/* Additive components. Existing site.css remains the design authority. */
/* R43: /sok/ and shared search controls are owned by site.css.
   Search-page/search-result rules were removed here to avoid late-loaded !important conflicts. */

.discovery-form{display:flex;flex-wrap:wrap;align-items:end;gap:20px;margin:28px 0}.discovery-form label{display:grid;gap:8px;flex:1;min-width:180px}.discovery-form input,
.discovery-form select{font:inherit;color:inherit;background:transparent;border:1px solid #d8d0c4;border-radius:8px;padding:12px;max-width:100%;width:100%}.discovery-form select[multiple]{min-width:240px}.discovery-pagination{display:flex;flex-wrap:wrap;gap:10px;margin:28px 0}.discovery-pagination [aria-current]{background:#3c534e;color:white}.quiz-form{max-width:760px;margin:32px auto 48px;display:block}.quiz-form fieldset{border:0;border-top:1px solid #ddd4c7;padding:24px 0;margin:0}.quiz-form legend{font-weight:600;padding:12px 0}.quiz-controls{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.match-reasons{font-size:14px;line-height:1.7;margin:14px 0 28px;padding-left:22px}.compare-scroll{overflow:auto;border-top:1px solid #d8d0c4;margin:24px 0 48px}.compare-table{border-collapse:collapse;width:100%;text-align:left}.compare-table th,
.compare-table td{padding:18px;vertical-align:top;border-bottom:1px solid #ddd4c7;min-width:190px;max-width:300px}.compare-table th:first-child{min-width:145px}.compare-table thead img{display:block;object-fit:contain;margin:0 auto 16px;max-width:100%}.compare-table thead th{font-weight:500}.compare-table thead a{display:block}.compare-favorite{display:block;margin-top:10px;background:transparent;border:1px solid #d8d0c4;border-radius:50%;padding:10px;color:inherit}.compare-favorite svg{width:22px;height:22px}.compare-favorite.is-favorite{background:#f2eadf;color:#a17b35}.dynamic-calendar{max-width:340px;margin:24px 0}.discovery-links{display:flex;flex-wrap:wrap;gap:18px;margin:24px 0}.offer-list p{padding:16px 0;border-bottom:1px solid #ddd4c7}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}:focus-visible{outline:3px solid #a17b35;outline-offset:4px}@media(max-width:680px){.compare-table th,
.compare-table td{min-width:180px;padding:12px}.compare-table th:first-child{min-width:110px;position:sticky;left:0;background:#fbf5ee}.discovery-form{display:block}.discovery-form .btn{margin-top:15px;width:100%}.quiz-controls .btn{width:auto}.match-reasons{font-size:13px}}@media(prefers-reduced-motion:reduce){*,
*::before,
*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* Discovery polish: inherits the live site's typography, forest green and warm gold. */
.quiz-page,.compare-page,.launches-page{padding-top:34px;padding-bottom:70px}
.quiz-intro{display:grid;grid-template-columns:1.2fr 1fr;gap:48px;align-items:center;margin-bottom:34px}
.quiz-intro h1{font-size:clamp(38px,4.5vw,62px);line-height:1.08;max-width:660px;margin:0 0 20px}
.quiz-intro>div>p{max-width:490px;font-size:16px;color:var(--muted);line-height:1.75}
.quiz-intro-meta{display:flex;flex-wrap:wrap;gap:0;margin-top:24px;font-size:12px;color:var(--ink)}
.quiz-intro-meta span{display:flex;align-items:center;gap:0}
.quiz-intro-meta span + span::before{content:"✦";display:inline-block;margin:0 10px;color:var(--gold);font-size:7px;font-style:normal;line-height:1;vertical-align:1px}
.quiz-intro-meta svg{width:17px;height:17px;color:var(--gold-dark)}
.quiz-oskar{display:grid;grid-template-columns:45% 1fr;align-items:center;gap:14px;padding:20px;border-radius:24px;background:var(--surface-2);border:1px solid var(--line)}
.quiz-oskar img{width:100%;height:230px;object-fit:contain;border-radius:16px;mix-blend-mode:multiply}
.quiz-oskar blockquote{margin:0;font:400 clamp(17px,1.7vw,23px)/1.55 var(--heading)}.quiz-oskar cite{display:block;margin-top:15px;font:500 12px var(--body);color:var(--muted)}
.quiz-form{max-width:920px;background:#fffaf5;border:1px solid var(--line);border-radius:24px;padding:32px 40px;box-shadow:0 12px 40px rgba(48,67,51,.045);scroll-margin-top:100px}
.quiz-progress-header{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:12px;color:var(--muted)}.quiz-progress-header .eyebrow{margin:0;letter-spacing:.15em;font-size:10px}
.quiz-progress-track{height:4px;background:var(--surface-2);border-radius:99px;margin:17px 0 34px;overflow:hidden}.quiz-progress-track>span{display:block;height:100%;width:0;background:var(--gold);border-radius:99px;transition:width .35s ease}
.quiz-form fieldset{padding:0;border:0;min-width:0;margin:0 0 26px}.quiz-form legend{font:400 clamp(25px,3vw,34px)/1.2 var(--heading);padding:0;margin-bottom:12px;max-width:100%}.quiz-step-hint{font-size:14px;color:var(--muted);margin:0 0 24px}
.quiz-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.quiz-choice{position:relative;cursor:pointer;min-width:0}.quiz-choice input{position:absolute;opacity:0;width:1px;height:1px;left:15px;top:50%;margin:0}
.quiz-choice-face{display:flex;align-items:center;gap:14px;min-height:78px;padding:16px;border:1px solid #ded6ca;background:var(--bg);border-radius:14px;font-size:14px;line-height:1.5;transition:background .2s,border-color .2s,box-shadow .2s,transform .2s}
.quiz-choice-symbol{display:grid;place-items:center;flex:0 0 var(--quiz-icon-size,40px);width:var(--quiz-icon-size,40px);height:var(--quiz-icon-size,40px)}.quiz-option-image{display:block;width:100%;height:100%;object-fit:contain}.quiz-choice-check{display:grid;place-items:center;flex:0 0 21px;width:21px;height:21px;margin-left:auto;border:1px solid #c9cabc;border-radius:50%}.quiz-choice-check svg{width:14px;height:14px;opacity:0}
.quiz-choice input:checked+.quiz-choice-face{border-color:var(--button-green);background:#edf1e9;box-shadow:inset 0 0 0 1px var(--button-green)}.quiz-choice input:checked+.quiz-choice-face .quiz-choice-check{background:var(--button-green);border-color:var(--button-green);color:#fff}.quiz-choice input:checked+.quiz-choice-face .quiz-choice-check svg{opacity:1}.quiz-choice input:focus-visible+.quiz-choice-face{outline:3px solid var(--gold);outline-offset:3px}
.quiz-controls{align-items:center;border-top:1px solid var(--line);padding-top:22px;margin-top:24px;gap:14px}.quiz-controls .btn{min-height:48px;border-radius:10px}.quiz-save-note{margin-right:auto;font-size:11px;color:var(--muted)}
.quiz-adjust{margin:25px 0 40px}.quiz-adjust>summary{display:flex;align-items:center;gap:12px;width:fit-content;cursor:pointer;padding:12px 0;font-weight:600}.quiz-adjust>summary svg{width:15px}.quiz-results{scroll-margin-top:100px}.quiz-results>h2{font-size:clamp(30px,4vw,43px)}.quiz-results>.ranking-quote{max-width:740px;border-left:2px solid var(--gold);padding:20px 24px;margin:24px 0;background:var(--surface-2);font:400 19px/1.6 var(--heading)}.quiz-results>.ranking-quote small{display:block;font:12px var(--body);margin-top:10px}.quiz-results>p{font-size:13px;color:var(--muted)}.quiz-match{min-width:0}.quiz-match>.eyebrow{padding:10px 0;border-bottom:1px solid var(--line);margin-bottom:20px;letter-spacing:.13em}.match-reasons{list-style:none;padding:0;font-size:12px}.match-reasons li{padding:8px 0 8px 22px;position:relative;border-bottom:1px solid var(--line)}.match-reasons li:before{content:'✓';position:absolute;left:0;color:var(--gold-dark)}
 .quiz-result-list{display:grid;gap:12px;max-width:1100px;margin:20px auto 0;border-top:0}
.quiz-result-row{position:relative;display:grid;grid-template-columns:180px minmax(0,1fr) 44px;gap:20px;align-items:center;min-height:208px;padding:14px 18px;border:1px solid #e6dacb;border-radius:16px;background:rgba(255,250,245,.72);color:var(--ink);text-decoration:none;transition:border-color .18s ease,background .18s ease,transform .18s ease}
.quiz-result-row:first-child{border-color:rgba(184,135,58,.58);background:#fffaf4}
.quiz-result-row:first-child::after{content:'★  BESTE TREFF';position:absolute;right:18px;top:14px;padding:6px 10px;border:1px solid rgba(184,135,58,.35);border-radius:999px;background:#fff7eb;color:#9a6b25;font-size:9.5px;font-weight:600;letter-spacing:.12em;line-height:1;text-transform:uppercase}
.quiz-result-row:hover{border-color:rgba(184,135,58,.48);background:#fffaf5;transform:translateY(-1px)}
.quiz-result-row:hover .quiz-result-copy>strong{color:var(--gold-dark)}
.quiz-result-thumb{display:grid;place-items:center;width:180px;height:180px;overflow:hidden;border:0;border-radius:12px;background:#f3ede4}
.quiz-result-thumb img{display:block;width:100%;height:100%;object-fit:cover!important;object-position:center center}
.quiz-result-copy{display:flex;min-width:0;flex-direction:column;align-items:flex-start;padding-right:12px}
.quiz-result-kicker{margin-bottom:5px;color:var(--gold-text);font-size:9.5px;font-weight:500;letter-spacing:.11em;line-height:1.3;text-transform:uppercase}
.quiz-result-copy>strong{font:500 25px/1.14 var(--heading);letter-spacing:-.012em;transition:color .15s}
.quiz-result-commerce{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:8px}
.quiz-result-commerce>b{font:400 20px/1.25 var(--heading)}
.quiz-result-commerce>b.is-unknown{color:#8c837a;font:500 11px/1.35 var(--body)}
.quiz-result-commerce .availability-badge{font-weight:500}
.quiz-result-copy>small{max-width:64ch;margin-top:8px;color:#847a70;font-size:11.5px;line-height:1.5}
.quiz-result-copy>.quiz-result-tradeoff{color:#8b6d3f}
.quiz-result-arrow{display:grid;width:40px;height:40px;place-items:center;border-radius:50%;background:#f3ece3;color:#425b50}
.quiz-result-arrow svg{width:16px;height:16px}
.quiz-result-note{max-width:900px;margin:16px auto 0!important;color:#9a9086!important;font-size:10.5px!important;font-style:italic;line-height:1.55!important;text-align:center}
.quiz-result-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:1100px;margin:20px auto 0}
.quiz-result-actions .btn{min-width:190px;min-height:42px;padding:10px 18px;border-radius:9px;font-size:11.5px}
.quiz-result-actions .btn-secondary{background:#fbf6ef;border-color:#ddcdbb;color:var(--ink)}
.quiz-result-actions .btn-secondary:hover{background:#f4ece2;border-color:#cbb79e}
.quiz-result-action-icon{font-size:17px;font-weight:400;line-height:1}


@media(max-width:680px){
 .compare-page,
.quiz-page,
.launches-page{padding-top:6px!important}
 .quiz-intro{grid-template-columns:1fr!important}.quiz-form fieldset{min-height:0!important;padding:22px 18px!important}.quiz-controls{grid-template-columns:1fr 1fr!important}.quiz-match.quiz-match-primary{display:block!important}.quiz-match-primary .product-card,
.quiz-match-primary .quiz-tradeoff{grid-column:auto!important}.quiz-match-primary .quiz-tradeoff{margin-top:10px!important}
 .picker-results{grid-template-columns:1fr!important;max-height:none!important;overflow:visible!important}.picker-actions{align-items:stretch!important;flex-direction:column!important}.picker-actions .btn{width:100%!important}
 .compare-product-heads,
.compare-matrix-values{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}.compare-product-heads{margin-bottom:24px!important}.compare-product.compare-mobile-hidden,
.compare-value.compare-mobile-hidden{display:none!important}.compare-title{font-size:16px!important}.compare-product-summary{display:block!important}.compare-product-summary .availability-badge{margin-bottom:5px!important}.compare-matrix-row{padding:15px 0!important}.compare-value{font-size:11px!important}.comparison-toolbar{display:block!important}.difference-toggle{margin-top:12px!important}
 .launch-tabs{margin-bottom:30px!important}.launch-card{display:block!important;grid-template-columns:none!important}.launch-card-image{width:100%!important;aspect-ratio:1.28/1!important;height:auto!important;min-height:0!important}.launch-card-body{min-height:0!important;padding:15px!important}.launch-card-meta{padding-right:46px!important}.launch-date-chip{right:10px!important;top:-24px!important}.launch-card h3{font-size:19px!important;margin:0 0 6px!important}.launch-card-link{padding:0!important;white-space:nowrap!important}
}
/* === Finish pass 2026-09-18 === */


.quiz-page{padding-top:5px!important}
.quiz-intro{display:grid!important;width:100%!important;max-width:none!important;grid-template-columns:1fr!important;align-items:center!important;margin:0 0 30px!important}
.quiz-intro>div{max-width:760px!important}
/* Result hero: one gold frame, with the submitted answers below Oskar's note. */
.quiz-result-head{display:grid!important;width:100%!important;max-width:none!important;grid-template-columns:minmax(0,1fr)!important;gap:24px!important;align-items:center!important;margin:0 0 30px!important}
.quiz-page .quiz-result-head--matches{grid-template-columns:190px minmax(0,1fr)!important;gap:16px 30px!important;max-width:1100px!important;margin:0 auto 24px!important;padding:24px 32px 0;border:1px solid #d8bc90;border-radius:22px;background:var(--surface);text-align:left}
.quiz-result-hero-art{display:block;width:100%;height:210px;object-fit:contain;object-position:center bottom;align-self:end}
.quiz-result-hero-copy{min-width:0;padding:0}
.quiz-page .quiz-result-hero-copy>.eyebrow{margin:0 0 10px!important;font-size:10px;letter-spacing:.23em}
.quiz-page .quiz-result-hero-copy>h1{max-width:740px;margin:0 0 12px!important;line-height:1.14!important}
.quiz-page .quiz-result-hero-copy>.quiz-result-quote{max-width:680px;margin:0 0 10px!important;color:#637064;font:italic 400 18px/1.5 var(--heading)!important}
.quiz-page .quiz-result-hero-copy>.quiz-oskar-signature{display:inline-block;align-self:flex-start!important;margin:0 0 0 2px!important;font-size:26px!important}
.quiz-result-answers{grid-column:1/-1;min-width:0;padding:14px 0 17px;border-top:1px solid #e1d1ba}
.quiz-result-answers-label{float:left;margin:6px 16px 6px 0;color:var(--muted);font-size:12px;cursor:pointer}
.quiz-result-answers-label::marker{color:var(--gold)}
.quiz-result-answers-label:focus-visible{outline:2px solid var(--gold);outline-offset:4px;border-radius:3px}
.quiz-result-answers ul{display:flex;flex-wrap:wrap;gap:8px;min-width:0;list-style:none;margin:0;padding:0}
.quiz-result-answers li{display:inline-flex;align-items:center;gap:6px;min-width:0;max-width:100%;padding:6px 11px;border:1px solid #e6dbc9;border-radius:999px;background:#fffaf3;color:#635b4a;font-size:12px;line-height:1.4}
.quiz-result-answers .quiz-option-image{flex:0 0 20px;width:20px;height:20px}
.quiz-result-answers li>span{min-width:0;overflow-wrap:anywhere}
@media(min-width:681px) and (max-width:1000px){
 .quiz-page .quiz-result-head--matches{grid-template-columns:150px minmax(0,1fr)!important;gap:16px 22px!important;padding:22px 24px 0}
 .quiz-result-hero-art{height:180px}
 .quiz-page .quiz-result-hero-copy>.quiz-result-quote{font-size:17px!important}
 .quiz-result-answers-label{float:none;margin:0 0 10px}
}
@media(max-width:680px){
 .quiz-page .quiz-result-head--matches{grid-template-columns:64px minmax(0,1fr)!important;gap:8px 12px!important;margin-bottom:20px!important;padding:20px 18px 0;border-radius:20px}
 .quiz-result-hero-art{grid-column:1;grid-row:3/5;align-self:start;width:64px;height:82px}
 .quiz-result-hero-copy{display:contents}
 .quiz-page .quiz-result-hero-copy>.eyebrow{grid-column:1/-1;grid-row:1;margin:0 0 4px!important;font-size:9px;letter-spacing:.22em}
 .quiz-page .quiz-result-hero-copy>h1{grid-column:1/-1;grid-row:2;line-height:1.04!important;margin:0 0 8px!important;overflow-wrap:anywhere}
 .quiz-page .quiz-result-hero-copy>.quiz-result-quote{grid-column:2;grid-row:3;font-size:15px!important;line-height:1.4!important;margin:0!important}
 .quiz-page .quiz-result-hero-copy>.quiz-oskar-signature{grid-column:2;grid-row:4;margin:0!important;font-size:22px!important}
 .quiz-result-answers{margin-top:6px;padding:13px 0 15px}
 .quiz-result-answers-label{float:none;margin:0;font-size:12px;line-height:1.5}
 .quiz-result-answers[open] .quiz-result-answers-label{margin-bottom:12px}
 .quiz-result-answers li{padding:5px 9px;font-size:11px}
 .quiz-result-answers .quiz-option-image{flex-basis:18px;width:18px;height:18px}
}
.quiz-adjust,
.quiz-form{max-width:none!important;width:100%!important}
.quiz-form fieldset{width:100%!important;min-height:350px!important}
.quiz-form legend:focus{outline:none!important}
.quiz-choice-summary{margin-top:0!important}
.quiz-result-head.quiz-result-head--empty{grid-template-columns:minmax(0,880px)!important;justify-content:center!important;text-align:center!important;margin-bottom:28px!important}
.quiz-result-head.quiz-result-head--empty>div{max-width:880px!important;margin:0 auto!important}
.quiz-result-head.quiz-result-head--empty>div>p{max-width:760px!important;margin-inline:auto!important}
.quiz-no-match{display:grid!important;grid-template-columns:minmax(260px,.9fr) minmax(0,1.1fr)!important;align-items:stretch!important;max-width:1080px!important;margin:18px auto 0!important;border:1px solid #e4d7c8!important;border-radius:18px!important;background:rgba(255,250,245,.66)!important;overflow:hidden!important}
.quiz-no-match-visual{position:relative!important;display:flex!important;align-items:flex-end!important;justify-content:center!important;min-height:310px!important;padding:24px 28px!important;overflow:hidden!important}
.quiz-no-match-visual img{position:relative!important;z-index:2!important;width:min(290px,92%)!important;max-height:295px!important;object-fit:contain!important;object-position:center bottom!important}
.quiz-no-match-star,
.quiz-no-match-kicker-star,
.quiz-no-match-corner-star{display:block!important;background:var(--gold)!important;-webkit-mask:url("/assets/icons/golden-star.svg") center/contain no-repeat!important;mask:url("/assets/icons/golden-star.svg") center/contain no-repeat!important}
.quiz-no-match-star{position:absolute!important;z-index:1!important;opacity:.72!important}
.quiz-no-match-star--one{left:18%!important;top:22%!important;width:11px!important;height:11px!important}
.quiz-no-match-star--two{right:18%!important;top:16%!important;width:15px!important;height:15px!important}
.quiz-no-match-star--three{right:10%!important;bottom:22%!important;width:8px!important;height:8px!important;opacity:.48!important}
.quiz-no-match-copy{position:relative!important;display:flex!important;flex-direction:column!important;justify-content:center!important;min-width:0!important;padding:42px 46px!important;border-left:1px solid rgba(227,217,205,.9)!important}
.quiz-no-match-kicker{display:flex!important;align-items:center!important;gap:9px!important;margin:0 0 19px!important;color:var(--gold)!important;font-size:10px!important;font-weight:500!important;letter-spacing:.23em!important;line-height:1.35!important;text-transform:uppercase!important}
.quiz-no-match-kicker-star{width:9px!important;height:9px!important;flex:0 0 9px!important}
.quiz-no-match blockquote{max-width:540px!important;margin:0!important;color:#6f746f!important;font:italic 400 18px/1.62 var(--heading)!important;letter-spacing:-.01em!important}
.quiz-no-match-signature{margin:20px 0 0 4px!important;color:#6d5536!important;font-family:"Segoe Script","Snell Roundhand","Brush Script MT",cursive!important;font-size:38px!important;font-weight:400!important;line-height:1!important;transform:rotate(-4deg)!important;transform-origin:left center!important}
.quiz-no-match-corner-star{position:absolute!important;right:31px!important;bottom:28px!important;width:15px!important;height:15px!important;opacity:.7!important}
.quiz-adjust>summary[hidden]{display:none!important}

.launch-card{display:block!important;overflow:hidden!important;background:#fffaf5!important}
.launch-card-image{display:block!important;width:100%!important;aspect-ratio:1.28/1!important;border-radius:14px 14px 0 0!important;background:#f2ece4!important;overflow:hidden!important}
.launch-card-image img{position:static!important;inset:auto!important;display:block!important;width:100%!important;height:100%!important;max-height:none!important;padding:0!important;object-fit:cover!important;mix-blend-mode:normal!important}
.launch-card-body{position:relative!important;display:block!important;min-height:0!important;padding:17px 18px 18px!important}
.launch-card-meta{display:block!important;padding-right:58px!important;margin:0 0 7px!important}
.launch-card-meta .eyebrow{display:block!important;margin:0!important}
.launch-brand{display:block!important;margin-top:3px!important}
.launch-card h3{display:-webkit-box!important;min-height:0!important;margin:0 0 7px!important;overflow:hidden!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2!important;font-size:21px!important;line-height:1.16!important}
.launch-card-link{display:inline-flex!important;width:auto!important;max-width:100%!important;align-items:center!important;justify-content:flex-start!important;gap:6px!important;margin:0!important;padding:0!important;border:0!important;font-size:10.5px!important;font-weight:700!important;white-space:nowrap!important}
.launch-card-link svg{flex:0 0 13px!important;width:13px!important;margin-left:0!important}
.launch-date-unknown{margin:9px 0 0!important;font-size:9.5px!important}
.launch-date-chip{top:-27px!important;right:14px!important;z-index:3!important}

@media(max-width:680px){
 .quiz-page{padding-top:0px!important}
 .quiz-intro,
.quiz-result-head{grid-template-columns:1fr!important;margin-bottom:22px!important}
 .quiz-result-head{gap:16px!important}
 .quiz-form fieldset{padding:24px 18px!important;min-height:0!important}
 .launch-card{display:block!important;grid-template-columns:none!important}
 .launch-card-image{width:100%!important;aspect-ratio:1.28/1!important;height:auto!important;min-height:0!important;border-radius:14px 14px 0 0!important}
 .launch-card-body{min-height:0!important;padding:15px 15px 17px!important}
 .launch-card-meta{padding-right:46px!important}
 .launch-card h3{font-size:19px!important;margin:0 0 6px!important}
 .launch-card-link{white-space:nowrap!important}
 .launch-date-chip{top:-24px!important;right:10px!important}
}

/* === R9 · 18.09.2026: final component corrections === */

/* Product cards: keep the strong image treatment,
but make the text read as one compact block. */
.product-grid>.product-card{height:auto!important;align-self:start!important}
.product-card-body{flex:0 0 auto!important;padding-top:13px!important}
.product-card-kicker{min-height:0!important;margin-bottom:5px!important}
.product-card h3{min-height:0!important;max-height:none!important;margin:0 0 8px!important;line-height:1.22!important}
.product-card .card-rating{min-height:23px!important;margin:0 0 5px!important}
.product-card-body .card-price,
.product-card .card-price{min-height:0!important;margin:0 0 7px!important;padding-top:0!important}
.product-card-body .card-more,
.product-card .card-more{min-height:0!important;margin:0!important;padding:0!important;border:0!important;align-self:flex-start!important}

/* Quiz: result hero occupies exactly the same top position as the intro hero. */
.quiz-results{width:100%!important;max-width:none!important;margin:0!important;padding-top:0!important}
.quiz-intro,
.quiz-result-head{margin-top:0!important}
.quiz-oskar{
  display:grid!important;grid-template-columns:84px minmax(0,1fr)!important;align-items:center!important;gap:16px!important;
  width:min(100%,390px)!important;justify-self:end!important;padding:14px 18px 14px 14px!important;
  border:1px solid rgba(221,207,188,.72)!important;border-radius:18px!important;background:#f1ebe2!important;
  box-shadow:0 8px 24px rgba(65,53,39,.025)!important;text-align:left!important
}
.quiz-oskar img{width:84px!important;height:84px!important;object-fit:cover!important;border-radius:50%!important;mix-blend-mode:normal!important}
.quiz-oskar-copy{display:flex!important;min-width:0!important;flex-direction:column!important;align-items:flex-start!important}
.quiz-oskar p{margin:0!important;color:var(--ink)!important;font:400 14px/1.48 var(--heading)!important;letter-spacing:-.006em!important}
.quiz-oskar-signature:not(.favorites-hero-count){margin:6px 0 0 3px!important;color:#6d5536!important;font-family:"Segoe Script","Snell Roundhand","Brush Script MT",cursive!important;font-size:22px!important;font-weight:400!important;line-height:1!important;transform:rotate(-4deg)!important;transform-origin:left center!important}

/* Homepage invitation: Oskar is a visible image on its own light surface,
not blended into the red panel. */
.home-discovery .discovery-invitation-art{display:grid!important;place-items:center!important;height:300px!important;padding:12px!important;border-radius:16px!important;background:#fbf5ee!important;overflow:hidden!important}
.home-discovery .discovery-invitation-art img{display:block!important;width:100%!important;height:100%!important;min-height:0!important;object-fit:contain!important;object-position:center!important;mix-blend-mode:normal!important;opacity:1!important;filter:none!important}

.toplist-picker-search,
.picker-search{
  display:flex!important;align-items:center!important;gap:11px!important;
  min-height:58px!important;border:1px solid #d8cab9!important;border-radius:12px!important;
  background:#fffaf5!important;color:#68716d!important;box-shadow:none!important
}

.toplist-picker-search,
.picker-search{padding:0 14px!important}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration{-webkit-appearance:none!important;appearance:none!important;display:none!important}
input[type="search"]::-ms-clear,
input[type="search"]::-ms-reveal{display:none!important;width:0!important;height:0!important}
.toplist-picker-search input{padding-right:34px!important}.toplist-picker-search .search-clear{position:static!important;right:auto!important;top:auto!important;transform:none!important;align-self:center!important;margin-left:auto!important}
.toplist-picker-search:focus-within,
.picker-search:focus-within{border-color:#a77936!important;outline:0!important;box-shadow:0 0 0 3px rgba(184,135,58,.11)!important}
.toplist-picker-search>svg,
.picker-search>svg{flex:0 0 18px!important;width:18px!important;height:18px!important}
.toplist-picker-search input,
.picker-search input{width:100%!important;min-width:0!important;min-height:56px!important;padding:0!important;border:0!important;background:transparent!important;color:var(--ink)!important;box-shadow:none!important;outline:0!important;font:400 15px/1.3 var(--body)!important}

/* Launch cards: larger hierarchy on desktop; compact horizontal list on phones. */
.launch-card h3{font-size:23px!important;line-height:1.14!important;margin-bottom:9px!important}
.launch-card-link{font-size:12.5px!important;gap:7px!important}
.launch-card-link svg{width:14px!important;height:14px!important}
.launch-date-chip{min-width:55px!important;padding:8px 9px!important}
.launch-date-chip strong{font-size:25px!important}

@media(max-width:680px){
  .quiz-oskar{grid-template-columns:64px minmax(0,1fr)!important;gap:12px!important;width:100%!important;justify-self:stretch!important;padding:11px 13px!important;border-radius:15px!important}
  .quiz-oskar img{width:64px!important;height:64px!important}
  .quiz-oskar p{font-size:12.5px!important;line-height:1.42!important}
  .quiz-oskar-signature:not(.favorites-hero-count){margin-top:4px!important;font-size:18px!important}

  .home-discovery .discovery-invitation-art{height:190px!important;padding:10px!important}

  .launch-grid{grid-template-columns:1fr!important;gap:11px!important}
  .launch-card{display:grid!important;grid-template-columns:116px minmax(0,1fr)!important;min-height:142px!important;align-items:stretch!important;border-radius:13px!important}
  .launch-card-image{grid-column:1!important;grid-row:1!important;width:116px!important;height:100%!important;min-height:142px!important;aspect-ratio:auto!important;border-radius:13px 0 0 13px!important;background:#f2ece4!important}
  .launch-card-image img{width:100%!important;height:100%!important;object-fit:contain!important;object-position:center!important}
  .launch-card-body{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;grid-template-rows:auto auto auto!important;column-gap:9px!important;grid-column:2!important;grid-row:1!important;min-width:0!important;padding:13px 11px 13px 14px!important}
  .launch-card-meta{grid-column:1!important;grid-row:1!important;align-self:center!important;margin:0 0 6px!important;padding-right:0!important}
  .launch-card-meta .eyebrow{font-size:8px!important;letter-spacing:.11em!important}
  .launch-card h3{grid-column:1/-1!important;grid-row:2!important;font-size:19.5px!important;line-height:1.13!important;margin:0 0 9px!important;-webkit-line-clamp:3!important}
  .launch-card-link{grid-column:1/-1!important;grid-row:3!important;font-size:11.5px!important;white-space:nowrap!important}
  .launch-date-chip{position:static!important;grid-column:2!important;grid-row:1!important;align-self:start!important;min-width:42px!important;padding:6px 6px!important;border-radius:9px!important;box-shadow:none!important;border:1px solid rgba(184,135,58,.18)!important;background:#fffaf5!important}
  .launch-date-chip strong{font-size:19px!important}
  .launch-date-chip span{font-size:7.5px!important}
  .launch-date-chip small{font-size:7px!important;margin-top:3px!important}
  .launch-date-unknown{margin-top:8px!important;font-size:9px!important}
}

/* === R10 · 18.09.2026: typography restore + quiz/launch mobile tuning === */
/* Keep the site's original eyebrow typography. Component layouts may alter spacing, not type size. */
.quiz-progress-header .eyebrow,
.quiz-choice-summary .eyebrow,
.quiz-match>.eyebrow,
.discovery-invitation .eyebrow,
.launch-card-meta .eyebrow,
.launch-card .eyebrow{
  color:var(--gold)!important;
  font-size:10px!important;
  font-weight:700!important;
  letter-spacing:.28em!important;
  text-transform:uppercase!important;
}

/* Product-card typography: undo the visually undersized mobile labels while keeping the tighter R9 spacing. */
@media(max-width:520px){
  .product-card-kicker{font-size:9px!important;line-height:1.45!important}
  .product-card h3{font-size:18px!important;line-height:1.2!important}
  .product-card .card-rating>span:last-child{font-size:11px!important}
  .product-card-body .card-price,.product-card .card-price{font-size:19px!important;line-height:1.28!important}
  .product-card-body .card-more,.product-card .card-more{font-size:12px!important;line-height:1.35!important}
}

/* Quiz advances automatically. Controls only need Back during the flow and the submit action at step 5. */
.quiz-controls{grid-template-columns:auto minmax(0,1fr) auto!important}

@media(max-width:680px){
  /* Larger,
calmer quiz typography on phones without changing the eyebrow system. */
  .quiz-page{font-size:16px!important}
  .quiz-intro h1,
.quiz-result-head h1{font-size:43px!important;line-height:1.04!important}
  .quiz-intro>div>p,
.quiz-result-head>div>p{font-size:17px!important;line-height:1.62!important}
  .quiz-intro-meta{font-size:12.5px!important;line-height:1.45!important}
  .quiz-progress-header{font-size:13.5px!important;line-height:1.35!important}
  .quiz-form legend{font-size:30px!important;line-height:1.15!important}
  .quiz-step-hint{font-size:14px!important;line-height:1.55!important}
  .quiz-choice-face{font-size:14px!important;line-height:1.45!important;min-height:56px!important;padding:14px 14px!important}
  .quiz-skip{font-size:13px!important}
  .quiz-oskar p{font-size:14px!important;line-height:1.5!important}
  .quiz-controls{grid-template-columns:auto minmax(0,1fr)!important;align-items:center!important}
  .quiz-controls [data-quiz-back]{grid-column:1!important;justify-self:start!important}
  .quiz-controls .btn{font-size:13px!important}

  /* Mobile launches: slightly larger image and type while preserving the compact side-by-side list. */
  .launch-card{grid-template-columns:132px minmax(0,1fr)!important;min-height:152px!important}
  .launch-card-image{width:132px!important;min-height:152px!important}
  .launch-card-image img{padding:6px!important}
  .launch-card-body{padding:14px 12px 14px 15px!important;column-gap:10px!important}
  .launch-card-meta{margin-bottom:7px!important}
  .launch-brand{font-size:10.5px!important}
  .launch-card h3{font-size:21px!important;line-height:1.12!important;margin-bottom:10px!important}
  .launch-card-link{font-size:13px!important;line-height:1.3!important;gap:7px!important}
  .launch-card-link svg{width:15px!important;height:15px!important}
  .launch-date-chip{min-width:46px!important;padding:7px!important;border-radius:10px!important}
  .launch-date-chip strong{font-size:25px!important;line-height:1!important}
  .launch-date-chip span{font-size:8.5px!important}
  .launch-date-chip small{font-size:7.5px!important}
}


/* === R11 · 18.09.2026: quiz scale + compact mobile launch cards === */

/* Keep title eyebrows at the shared spacing while utility eyebrows stay inline. */
.quiz-intro>.eyebrow,
.quiz-intro>div>.eyebrow,
.quiz-result-head>div>.eyebrow{margin-bottom:12px!important}
.quiz-progress-header .eyebrow,
.quiz-choice-summary .eyebrow,
.quiz-match>.eyebrow{margin-bottom:0!important}
.launch-card-meta{margin-bottom:12px!important}
.launch-card-meta .eyebrow.eyebrow{margin-bottom:0!important}

/* Launch CTA text was removed from the component; the card is now image + metadata + title + date only. */
.launch-card-link{display:none!important}

@media(max-width:680px){
  /* Quiz: readable mobile type from intro through progress,
question,
answers and result. */
  .quiz-page{font-size:16.5px!important}
  .quiz-intro h1,
.quiz-result-head h1{font-size:44px!important;line-height:1.04!important}
  .quiz-intro>div>p,
.quiz-result-head>div>p{font-size:17.5px!important;line-height:1.62!important}
  .quiz-intro-meta{font-size:13px!important;line-height:1.45!important}
  .quiz-progress-header{font-size:14.5px!important;line-height:1.35!important}
  .quiz-progress-header [data-quiz-progress]{font-size:14.5px!important}
  .quiz-form legend{font-size:32px!important;line-height:1.14!important}
  .quiz-step-hint{font-size:15px!important;line-height:1.55!important}
  .quiz-choice-face{font-size:15px!important;line-height:1.45!important;min-height:58px!important;padding:14px 15px!important}
  .quiz-skip{font-size:13.5px!important}
  .quiz-oskar p{font-size:14px!important;line-height:1.5!important}
  .quiz-choice-summary .quiz-choice-chips span{font-size:11.5px!important;line-height:1.35!important}
  .quiz-controls .btn{font-size:13.5px!important}

  /* Product-card mobile typography must not be re-shrunk by older discovery overrides. */
  .product-card-kicker{font-size:9px!important;line-height:1.4!important}
  .product-card h3{font-size:17px!important;line-height:1.2!important}
  .product-card .card-rating>span:last-child{font-size:10.5px!important}
  .product-card .card-price{font-size:18px!important;line-height:1.3!important}
  .product-card .hat-rating{gap:1px!important;transform:none!important}
  .product-card .hat-icon{width:15px!important;height:15px!important;flex-basis:15px!important}
  .product-card .favorite-button{width:34px!important;height:34px!important;padding:7px!important}
  .product-card .favorite-button svg{width:16px!important;height:16px!important}

  /* Launch cards: dense side-by-side list,
cover image,
slightly smaller title and clear date. */
  .launch-grid{gap:11px!important}
  .launch-card{display:grid!important;grid-template-columns:138px minmax(0,1fr)!important;min-height:144px!important;align-items:stretch!important;border-radius:13px!important}
  .launch-card-image{grid-column:1!important;grid-row:1!important;width:138px!important;height:100%!important;min-height:144px!important;aspect-ratio:auto!important;border-radius:13px 0 0 13px!important;overflow:hidden!important}
  .launch-card-image img{width:100%!important;height:100%!important;padding:0!important;object-fit:cover!important;object-position:center!important}
  .launch-card-body{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;grid-template-rows:auto 1fr!important;column-gap:9px!important;row-gap:0!important;grid-column:2!important;grid-row:1!important;min-width:0!important;padding:13px 10px 13px 13px!important}
  .launch-card-meta{grid-column:1!important;grid-row:1!important;align-self:start!important;margin:0 0 10px!important;padding:2px 0 0!important}
  .launch-card-meta .eyebrow.eyebrow{font-size:10px!important;letter-spacing:.28em!important;margin:0!important}
  .launch-card h3{grid-column:1/-1!important;grid-row:2!important;align-self:start!important;font-size:18px!important;line-height:1.16!important;margin:0!important;-webkit-line-clamp:3!important}
  .launch-date-chip{position:static!important;grid-column:2!important;grid-row:1!important;align-self:start!important;justify-self:end!important;min-width:43px!important;padding:6px!important;border-radius:9px!important;border:1px solid rgba(184,135,58,.22)!important;background:#fffaf5!important;box-shadow:none!important}
  .launch-date-chip strong{font-size:20px!important;line-height:1!important}
  .launch-date-chip span{font-size:8px!important;letter-spacing:.12em!important}
  .launch-date-chip small{font-size:7.5px!important;margin-top:3px!important}
  .launch-date-unknown{grid-column:1/-1!important;margin-top:7px!important;font-size:9px!important}
}

@media(max-width:390px){
  .quiz-intro h1,
.quiz-result-head h1{font-size:40px!important}
  .quiz-form legend{font-size:29px!important}
  .launch-card{grid-template-columns:126px minmax(0,1fr)!important;min-height:138px!important}
  .launch-card-image{width:126px!important;min-height:138px!important}
  .launch-card h3{font-size:17px!important}
}

/* Discovery loads after site.css,
so keep the shared eyebrow/title spacing authoritative here too. */
.eyebrow:has(+ h1),
.eyebrow:has(+ h2),
.eyebrow:has(+ h3){margin-bottom:12px!important}
.eyebrow + h1,
.eyebrow + h2,
.eyebrow + h3{margin-top:0!important}

/* === R12 · 18.09.2026: launch hierarchy + transparent Oskar art + quiz comment === */

/* Launch cards use a real two-column header: kicker/title left,
date chip right. */
.launch-card-body{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  grid-template-rows:auto auto!important;
  column-gap:12px!important;
  row-gap:0!important;
}
.launch-card-meta{
  grid-column:1!important;
  grid-row:1!important;
  align-self:end!important;
  margin:0 0 5px!important;
  padding:0!important;
}
.launch-card-meta .eyebrow.eyebrow{margin:0!important}
.launch-card h3{
  grid-column:1!important;
  grid-row:2!important;
  align-self:start!important;
  margin:0!important;
}
.launch-date-chip{
  position:static!important;
  grid-column:2!important;
  grid-row:1 / span 2!important;
  align-self:start!important;
  justify-self:end!important;
  min-width:62px!important;
  padding:10px 11px!important;
  border-radius:11px!important;
}
.launch-date-chip strong{font-size:28px!important;line-height:1!important}
.launch-date-chip span{font-size:9.5px!important}
.launch-date-chip small{font-size:8.5px!important}
.launch-date-unknown{grid-column:1!important}

/* Keep the artwork transparent even though older discovery rules supplied a beige tile. */
.discovery-invitation-art,
.home-discovery .discovery-invitation-art,
.discovery-invitation-art img,
.home-discovery .discovery-invitation-art img{
  background:transparent!important;
}
.discovery-invitation-art img,
.home-discovery .discovery-invitation-art img{mix-blend-mode:normal!important}

@media(max-width:680px){
  .launch-card-body{
    grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-rows:auto auto!important;
    column-gap:8px!important;
  }
  .launch-card-meta{margin:0 0 4px!important;padding:0!important}
  .launch-card h3{grid-column:1!important;grid-row:2!important;margin:0!important}
  .launch-date-chip{
    grid-column:2!important;
    grid-row:1 / span 2!important;
    min-width:44px!important;
    padding:6px!important;
    border-radius:9px!important;
  }
  .launch-date-chip strong{font-size:20px!important}
  .launch-date-chip span{font-size:8px!important}
  .launch-date-chip small{font-size:7.5px!important}

}

/* Discovery stylesheet loads after site.css: keep the shared hero lead scale authoritative here too. */
.quiz-intro>div>h1+p,
.quiz-result-head>div>h1+p{
  font-size:var(--hero-subtitle-size)!important;
  line-height:var(--hero-subtitle-line)!important;
}
@media(max-width:680px){
  .quiz-oskar [data-quiz-oskar-comment]{font-size:14.5px!important;line-height:1.42!important}
}

/* === R13 · 18.09.2026: quiz quiet metadata + launch-card hierarchy === */

/* Quiz metadata and progress are supporting information,
not competing headlines. */
.quiz-intro-meta{
  color:#8b7a67!important;
  font-size:11px!important;
  font-style:italic!important;
  font-weight:400!important;
  line-height:1.45!important;
}
.quiz-progress-header [data-quiz-progress]{
  color:#8b7a67!important;
  font-size:11px!important;
  font-style:italic!important;
  font-weight:400!important;
  line-height:1.35!important;
}

/* Back is an understated text action; quiz choices still advance automatically. */
.quiz-controls [data-quiz-back]{
  min-height:0!important;
  padding:3px 0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#746958!important;
  font-size:12px!important;
  font-weight:600!important;
  line-height:1.4!important;
  text-decoration:none!important;
}
.quiz-controls [data-quiz-back]::before{
  content:"←";
  display:inline-block;
  margin-right:6px;
  color:var(--gold-dark);
}
.quiz-controls [data-quiz-back]:hover,
.quiz-controls [data-quiz-back]:focus-visible{
  color:var(--ink)!important;
  text-decoration:none!important;
}
.quiz-controls [data-quiz-back]:focus-visible{
  outline:2px solid var(--gold)!important;
  outline-offset:4px;
}

/* Launch card: standard 10 px kicker,
then a deliberate small gap before the title; date remains right-aligned. */
.launch-card-meta{
  align-self:start!important;
  margin:0 0 8px!important;
  padding:0!important;
}
.launch-card-meta .eyebrow.eyebrow{
  font-size:10px!important;
  line-height:1.35!important;
  letter-spacing:.28em!important;
  margin:0!important;
}
.launch-card h3{align-self:start!important;margin:0!important}

@media(max-width:680px){
  /* Discovery loads after site.css,
so keep the requested mobile card scale authoritative here. */
  .product-card h3{font-size:16.5px!important;line-height:1.2!important}

  .quiz-intro h1,
.quiz-result-head h1{font-size:clamp(36px,10.2vw,41px)!important;line-height:1.04!important}
  .quiz-intro-meta{font-size:10.5px!important;margin-top:14px!important;gap:0!important}
  .quiz-progress-header{font-size:11px!important}
  .quiz-progress-header [data-quiz-progress]{font-size:10.5px!important}
  .quiz-oskar [data-quiz-oskar-comment]{font-size:15.5px!important;line-height:1.42!important}
  .quiz-controls{grid-template-columns:auto minmax(0,1fr)!important}
  .quiz-controls [data-quiz-back]{grid-column:1!important;justify-self:start!important;font-size:11.5px!important}

  .launch-card-meta{margin:0 0 7px!important;padding:0!important}
  .launch-card-meta .eyebrow.eyebrow{font-size:10px!important;line-height:1.35!important}
}

/* Unknown product-card price must stay visually secondary even though discovery.css loads last. */
.product-card .card-price.card-price--unknown{
  color:#80786f!important;
  font-family:var(--body)!important;
  font-size:12px!important;
  font-weight:600!important;
  line-height:1.35!important;
}
@media(max-width:680px){
  .product-card .card-price.card-price--unknown{font-size:11px!important}
}


/* === R15 · 18.09.2026: automatic final answer,
compact result typography and quiz star progress === */
/* Question legends stay visually inside the warm question card instead of sitting on its edge. */
.quiz-form fieldset>legend{
  float:left!important;
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  padding:0!important;
  margin:0 0 10px!important;
}
.quiz-form fieldset>legend + .quiz-step-hint{clear:both!important}
.quiz-form fieldset::after{content:"";display:block;clear:both}

/* Back is the only manual navigation control; the last answer submits automatically. */
.quiz-controls{grid-template-columns:auto minmax(0,1fr)!important}
.quiz-controls [data-quiz-back]{grid-column:1!important}
.quiz-save-note{grid-column:2!important;justify-self:end!important;margin:0!important}

/* A restrained golden star follows the progress bar and gives a short pulse on each step. */
.quiz-progress-track{position:relative!important;overflow:visible!important}
.quiz-progress-track>span{position:relative!important;overflow:visible!important}
.quiz-progress-track>span::after{
  content:"";
  position:absolute;
  right:-5px;
  top:50%;
  width:10px;
  height:10px;
  transform:translateY(-50%) scale(.92) rotate(0deg);
  transform-origin:center;
  background:var(--gold);
  opacity:.72;
  -webkit-mask:url("/assets/icons/golden-star.svg") center/contain no-repeat;
  mask:url("/assets/icons/golden-star.svg") center/contain no-repeat;
}
.quiz-progress-track>span.is-advancing::after{animation:quiz-progress-star .48s cubic-bezier(.2,.75,.25,1)}
@keyframes quiz-progress-star{
  0%{opacity:.35;transform:translateY(-50%) scale(.65) rotate(-10deg)}
  48%{opacity:.95;transform:translateY(-50%) scale(1.35) rotate(8deg)}
  100%{opacity:.72;transform:translateY(-50%) scale(.92) rotate(0deg)}
}

/* Quiz results use the same visual hierarchy as the site's product cards. */
.quiz-result-kicker{color:var(--gold-text)!important;font-weight:500!important}
.quiz-result-copy>small{color:#9a9188!important}
.quiz-result-commerce>b{
  color:var(--ink)!important;
  font:400 19px/1.3 var(--heading)!important;
}
.quiz-result-commerce>b.is-unknown{font:500 11px/1.35 var(--body)!important;color:#91877e!important}
.quiz-result-commerce .availability-badge{
  min-height:20px!important;
  padding:3px 7px!important;
  gap:5px!important;
  font-size:8px!important;
  font-weight:500!important;
  letter-spacing:.025em!important;
}
.quiz-result-commerce .availability-badge::before{width:5px!important;height:5px!important;flex-basis:5px!important}

/* Discovery loads after site.css,
so keep the calmer desktop H1 scale authoritative here too. */
@media(min-width:701px){
  .quiz-intro h1,.quiz-result-head h1{font-size:clamp(34px,3.25vw,46px)!important;line-height:1.04!important}
}

@media(max-width:680px){
  .quiz-result-head{gap:18px!important}

  .quiz-result-list{gap:16px!important;margin-top:20px!important}
  .quiz-result-row{
    grid-template-columns:clamp(98px,29vw,112px) minmax(0,1fr)!important;
    gap:16px!important;
    min-height:146px!important;
    padding:16px!important;
    border-radius:14px!important;
  }
  .quiz-result-row:first-child::after{right:10px!important;top:9px!important;padding:4px 7px!important;font-size:8.8px!important}
  .quiz-result-row:first-child .quiz-result-copy{padding-top:11px!important}
  .quiz-result-thumb{width:100%!important;height:clamp(116px,34vw,132px)!important;border-radius:10px!important}
  .quiz-result-thumb img{object-fit:cover!important;object-position:center center!important}
  .quiz-result-copy{padding-right:0!important}
  .quiz-result-kicker{font-size:8.5px!important;margin-bottom:10px!important}
  .quiz-result-copy>strong{font-size:17.5px!important;line-height:1.16!important;letter-spacing:-.01em!important}
  .quiz-result-commerce{gap:7px!important;margin-top:10px!important}
  .quiz-result-commerce>b{font-size:17.5px!important;line-height:1.18!important}
  .quiz-result-commerce .availability-badge{font-size:7.5px!important;padding:3px 7px!important;min-height:19px!important}
  .quiz-result-copy>small{margin-top:10px!important;font-size:11.75px!important;line-height:1.42!important}
  .quiz-result-arrow{display:none!important}
  .quiz-result-actions{gap:8px!important;margin-top:18px!important}
  .quiz-result-actions .btn{width:auto!important;min-width:0!important;min-height:42px!important;padding:10px 14px!important;font-size:12.5px!important;line-height:1.25!important}

  .quiz-result-head.quiz-result-head--empty{text-align:left!important;margin-bottom:20px!important}
  .quiz-result-head.quiz-result-head--empty>div{margin:0!important}
  .quiz-result-head.quiz-result-head--empty>div>p{margin-inline:0!important}
  .quiz-no-match{grid-template-columns:1fr!important;border-radius:15px!important}
  .quiz-no-match-visual{min-height:220px!important;padding:20px 22px 0!important}
  .quiz-no-match-visual img{width:min(230px,80%)!important;max-height:215px!important}
  .quiz-no-match-copy{padding:26px 24px 30px!important;border-left:0!important;border-top:1px solid rgba(227,217,205,.9)!important}
  .quiz-no-match-kicker{margin-bottom:14px!important;font-size:9px!important;letter-spacing:.2em!important}
  .quiz-no-match blockquote{font-size:15.5px!important;line-height:1.58!important}
  .quiz-no-match-signature{margin-top:16px!important;font-size:32px!important}
  .quiz-no-match-corner-star{right:22px!important;bottom:22px!important;width:12px!important;height:12px!important}
  .quiz-no-match-star--one{left:15%!important;top:24%!important}
  .quiz-no-match-star--two{right:16%!important;top:17%!important;width:13px!important;height:13px!important}

  .quiz-controls{grid-template-columns:auto minmax(0,1fr)!important}
  .quiz-save-note{justify-self:end!important;text-align:right!important}
}

@media(prefers-reduced-motion:reduce){
  .quiz-progress-track>span.is-advancing::after{animation:none!important}
}

/* === R16 · 18.09.2026: quiz companion layout + five-star progress === */
/* Keep the quiz in the existing design system: warm paper,
forest ink and restrained gold. */
.quiz-page{max-width:1180px!important}
.quiz-adjust{width:100%!important;max-width:1100px!important;margin:0 auto 34px!important}
.quiz-form,
.quiz-welcome{
  width:100%!important;
  max-width:1100px!important;
  margin:18px auto 46px!important;
  padding:30px 34px 24px!important;
  border:1px solid rgba(184,135,58,.56)!important;
  border-radius:28px!important;
  background:#fffaf5!important;
  box-shadow:0 14px 38px rgba(64,54,42,.035)!important;
  overflow:visible!important;
}
.quiz-progress-header{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  margin:0 0 14px!important;
  padding:0 2px!important;
}
.quiz-progress-header .eyebrow.eyebrow{
  margin:0!important;
  color:var(--gold-text)!important;
  font-size:10px!important;
  font-weight:500!important;
  letter-spacing:.28em!important;
}
.quiz-progress-header [data-quiz-progress]{
  color:#8b7a67!important;
  font-size:11px!important;
  font-style:italic!important;
  font-weight:400!important;
  line-height:1.35!important;
  white-space:nowrap!important;
}
.quiz-progress-track{
  position:relative!important;
  height:2px!important;
  margin:0 0 34px!important;
  border-radius:999px!important;
  background:#e5dcd0!important;
  overflow:visible!important;
}
.quiz-progress-track>[data-quiz-bar]{
  position:absolute!important;
  inset:0 auto 0 0!important;
  display:block!important;
  width:0;
  height:100%!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,#b8873a,#c99a4d)!important;
  transition:width .38s cubic-bezier(.2,.75,.25,1)!important;
  overflow:visible!important;
}
.quiz-progress-track>[data-quiz-bar]::after{display:none!important}
.quiz-progress-stars{
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  pointer-events:none!important;
}
.quiz-progress-stars [data-quiz-star]{
  position:absolute!important;
  left:var(--quiz-star-position)!important;
  top:50%!important;
  display:block!important;
  width:10px!important;
  height:10px!important;
  background:#d8cdbc!important;
  opacity:.52!important;
  transform:translate(-50%,-50%) scale(.78)!important;
  transition:background .22s ease,opacity .22s ease,transform .22s ease!important;
  -webkit-mask:url("/assets/icons/golden-star.svg") center/contain no-repeat!important;
  mask:url("/assets/icons/golden-star.svg") center/contain no-repeat!important;
}
.quiz-progress-stars [data-quiz-star].is-current{
  opacity:.78!important;
  transform:translate(-50%,-50%) scale(.9)!important;
}
.quiz-progress-stars [data-quiz-star].is-complete{
  background:var(--gold)!important;
  opacity:.98!important;
  transform:translate(-50%,-50%) scale(1)!important;
}
.quiz-progress-stars [data-quiz-star].is-new{animation:quiz-star-arrive .52s cubic-bezier(.2,.8,.25,1)}
@keyframes quiz-star-arrive{
  0%{opacity:.25;transform:translate(-50%,-50%) scale(.42) rotate(-12deg)}
  55%{opacity:1;transform:translate(-50%,-50%) scale(1.45) rotate(8deg)}
  100%{opacity:.98;transform:translate(-50%,-50%) scale(1) rotate(0)}
}

/* Same card, now with Oskar as the question's companion. */
.quiz-body{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.65fr);gap:34px;align-items:stretch}
.quiz-companion{display:flex;flex-direction:column;justify-content:center;min-width:0;margin:0;padding:8px 30px 8px 0;border-right:1px solid rgba(184,135,58,.25)}
.quiz-companion>img{display:block;width:100%;height:290px;object-fit:contain;object-position:center bottom;margin:0 auto}
.quiz-companion-copy{display:flex;flex-direction:column;gap:14px;margin-top:16px}
.quiz-companion-copy p{margin:0;color:#566059;font:italic 400 17px/1.5 var(--heading)}
.quiz-companion-copy .quiz-oskar-signature{align-self:flex-end;margin:0 3px 0 0!important;font-size:25px!important}
.quiz-questions{min-width:0;align-self:center}
.quiz-questions fieldset[data-step-name="Tilgjengelighet"] .quiz-options{grid-template-columns:1fr!important}
@media(max-width:900px){
 .quiz-body{grid-template-columns:minmax(0,1fr);gap:24px}
 .quiz-companion{display:grid;grid-template-columns:130px minmax(0,1fr);gap:18px;align-items:center;padding:0 4px 22px;border-right:0;border-bottom:1px solid rgba(184,135,58,.25)}
 .quiz-companion>img{height:145px;width:130px}
 .quiz-companion-copy{margin:0;gap:10px}
 .quiz-companion-copy p{font-size:16px;line-height:1.45}
}
@media(max-width:680px){
 .quiz-body{gap:24px}
 .quiz-companion{grid-template-columns:106px minmax(0,1fr);gap:13px;padding:0 4px 20px}
 .quiz-companion>img{width:106px;height:130px}
 .quiz-companion-copy p{font-size:14.5px;line-height:1.45}
 .quiz-companion-copy .quiz-oskar-signature{font-size:22px!important}
 .quiz-choice-symbol{--quiz-icon-size:36px}
 .quiz-choice-face{gap:11px}
 .quiz-choice-text small{font-size:11px}
}

.quiz-form fieldset{
  width:100%!important;
  min-height:0!important;
  margin:0!important;
  padding:10px 0 20px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  text-align:left!important;
}
.quiz-form fieldset>legend{
  float:none!important;
  display:block!important;
  width:100%!important;
  max-width:900px!important;
  margin:0 auto 7px!important;
  padding:0!important;
  color:var(--ink)!important;
  font:400 clamp(23px,2.15vw,30px)/1.12 var(--heading)!important;
  letter-spacing:-.012em!important;
  text-align:left!important;
}
.quiz-step-hint{
  max-width:720px!important;
  margin:12px 0 26px!important;
  color:#78807c!important;
  font-size:15px!important;
  line-height:1.65!important;
  text-align:left!important;
}
.quiz-options{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:11px!important;
  max-width:930px!important;
  margin:0 auto!important;
}
.quiz-choice-face{
  min-height:74px!important;
  padding:15px 17px!important;
  border:1px solid rgba(188,169,143,.18)!important;
  border-radius:17px!important;
  background:#f5efe7!important;
  box-shadow:0 5px 15px rgba(56,47,38,.018)!important;
  color:var(--ink)!important;
  font-size:14px!important;
  line-height:1.42!important;
  text-align:left!important;
  transition:background .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease!important;
}
.quiz-choice-symbol{display:grid!important;place-items:center;flex:0 0 var(--quiz-icon-size,40px);width:var(--quiz-icon-size,40px);height:var(--quiz-icon-size,40px);background:transparent;border-radius:0}
.quiz-choice-text{min-width:0}
.quiz-choice-text small{display:block;margin-top:4px;color:var(--muted);font-size:11px;line-height:1.4}
.quiz-choice[hidden]{display:none!important}
/* The CSS gate also works before JS loads and in the no-JS form. */
.quiz-form:not(:has(input[name="audience"][value="voksne"]:checked,input[name="audience"][value="par"]:checked)) [data-adult-choice]{display:none!important}
.quiz-choice-check{
  width:20px!important;
  height:20px!important;
  flex:0 0 20px!important;
  margin-left:auto!important;
  border:1px solid #cbb99f!important;
  background:transparent!important;
  color:#fff!important;
}
.quiz-choice input:checked+.quiz-choice-face{
  border-color:#a9b7aa!important;
  background:#edf1e9!important;
  box-shadow:inset 0 0 0 1px rgba(75,102,86,.09)!important;
  transform:none!important;
}
.quiz-choice input:checked+.quiz-choice-face .quiz-choice-check{
  border-color:var(--button-green)!important;
  background:var(--button-green)!important;
}
.quiz-choice input:focus-visible+.quiz-choice-face{
  outline:2px solid rgba(184,135,58,.78)!important;
  outline-offset:3px!important;
}
.quiz-skip{
  display:inline-flex!important;
  align-items:center;
  gap:7px;
  margin:18px 0 0!important;
  color:#93887c!important;
  font-size:11.5px!important;
  font-style:italic!important;
}
.quiz-skip .quiz-option-image{flex:0 0 24px;width:24px;height:24px}
.quiz-skip span{text-decoration:none!important;}
.quiz-card-divider{
  display:flex!important;
  align-items:center!important;
  gap:17px!important;
  width:100%!important;
  margin:16px 0 0!important;
}
.quiz-card-divider::before,
.quiz-card-divider::after{
  content:"";
  height:1px!important;
  flex:1 1 auto!important;
  background:rgba(184,135,58,.22)!important;
}
.quiz-card-divider>span{
  display:block!important;
  width:10px!important;
  height:10px!important;
  flex:0 0 10px!important;
  background:var(--gold)!important;
  opacity:.78!important;
  -webkit-mask:url("/assets/icons/golden-star.svg") center/contain no-repeat!important;
  mask:url("/assets/icons/golden-star.svg") center/contain no-repeat!important;
}
.quiz-controls{
  display:grid!important;
  grid-template-columns:auto 1fr!important;
  align-items:center!important;
  gap:16px!important;
  margin:14px 0 0!important;
  padding:0!important;
  border:0!important;
}
.quiz-controls [data-quiz-back]{
  justify-self:start!important;
  color:#796b58!important;
  font-size:12px!important;
}
.quiz-save-note{display:none!important}

@media(hover:hover) and (pointer:fine){
  .quiz-choice:hover .quiz-choice-face{
    border-color:rgba(184,135,58,.38)!important;
    background:#f7f1e9!important;
    box-shadow:0 7px 18px rgba(56,47,38,.035)!important;
    transform:translateY(-1px)!important;
  }
}

@media(max-width:680px){
  .quiz-adjust{max-width:none!important;margin-bottom:24px!important}
  .quiz-form,
  .quiz-welcome{
    margin:12px auto 34px!important;
    padding:18px 14px 16px!important;
    border-radius:24px!important;
  }
  .quiz-progress-header{gap:10px!important;margin-bottom:13px!important;padding:0 1px!important}
  .quiz-progress-header .eyebrow.eyebrow{font-size:9.5px!important;letter-spacing:.24em!important}
  .quiz-progress-header [data-quiz-progress]{font-size:10.5px!important}
  .quiz-progress-track{margin-bottom:24px!important}
  .quiz-progress-stars [data-quiz-star]{width:8px!important;height:8px!important}
  .quiz-form fieldset{
    padding:0 4px 18px!important;
    text-align:left!important;
  }
  .quiz-form fieldset>legend{
    max-width:100%!important;
    margin-bottom:7px!important;
    font-size:clamp(22px,6vw,25px)!important;
    line-height:1.12!important;
    letter-spacing:-.01em!important;
    text-align:left!important;
  }
  .quiz-step-hint{
    max-width:none!important;
    margin-bottom:22px!important;
    font-size:14px!important;
    line-height:1.58!important;
    text-align:left!important;
  }
  .quiz-options{
    grid-template-columns:1fr!important;
    gap:9px!important;
    max-width:none!important;
  }
  .quiz-choice-face{
    min-height:64px!important;
    padding:13px 15px!important;
    border-radius:15px!important;
    font-size:14px!important;
  }
  .quiz-choice-check{width:20px!important;height:20px!important;flex-basis:20px!important}
  .quiz-skip{margin-top:16px!important;font-size:11px!important}
  .quiz-card-divider{margin-top:13px!important;gap:14px!important}
  .quiz-card-divider>span{width:9px!important;height:9px!important;flex-basis:9px!important}
  .quiz-controls{margin-top:12px!important}
  .quiz-controls [data-quiz-back]{font-size:11.5px!important}
}

@media(prefers-reduced-motion:reduce){
  .quiz-progress-stars [data-quiz-star].is-new{animation:none!important}
  .quiz-progress-track>[data-quiz-bar]{transition:none!important}
}

/* Launch page navigation/caveat retained from the established launch design. */
.launch-caveat{display:inline-block!important;padding:8px 10px!important;border:0!important;border-radius:9px!important;background:#f6efe7!important;color:#7b776f!important;font-size:11px!important;line-height:1.5!important}
.launch-tabs{display:inline-flex!important;gap:3px!important;margin:4px 0 38px!important;padding:4px!important;border-radius:999px!important;background:#f2eadf!important}
.launch-tabs a{padding:8px 14px!important;border:0!important;border-radius:999px!important;background:transparent!important;color:var(--muted)!important;font-size:10.5px!important;font-weight:700!important}
.launch-tabs a:hover,
.launch-tabs a:focus{background:#fffaf5!important;color:var(--ink)!important}
.launch-tabs a.active{background:var(--button-green)!important;color:#fff!important}
.launch-period + .launch-period{margin-top:54px!important}

/* === R22 · 18.09.2026: launch calendar cards + tighter quiz rhythm === */
/* The same launch-card component is used on the homepage and /lanseringer/. */
.launch-card{
  position:relative!important;
  display:block!important;
  overflow:hidden!important;
  border:1px solid #dfd1c0!important;
  border-radius:16px!important;
  background:#fffaf5!important;
  box-shadow:none!important;
}
.launch-card-image{
  display:block!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:1.12/1!important;
  overflow:hidden!important;
  border-radius:15px 15px 0 0!important;
  background:#f4eee6!important;
}
.launch-card-image img{
  width:100%!important;
  height:100%!important;
  padding:0!important;
  object-fit:cover!important;
  object-position:center!important;
}
.launch-card-body{
  position:static!important;
  display:block!important;
  min-height:0!important;
  padding:17px 18px 19px!important;
}
.launch-card-meta{
  display:block!important;
  margin:0 0 8px!important;
  padding:0 72px 0 0!important;
}
.launch-card-meta .eyebrow.eyebrow{
  margin:0!important;
  font-size:10px!important;
  line-height:1.35!important;
  letter-spacing:.28em!important;
}
.launch-card h3{
  display:-webkit-box!important;
  margin:0!important;
  padding-right:58px!important;
  overflow:hidden!important;
  color:var(--ink)!important;
  font-size:22px!important;
  line-height:1.14!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:3!important;
}
.launch-date-chip{
  position:absolute!important;
  top:16px!important;
  right:16px!important;
  z-index:4!important;
  display:flex!important;
  min-width:64px!important;
  min-height:76px!important;
  padding:15px 10px 9px!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  border:1px solid rgba(184,135,58,.28)!important;
  border-radius:11px!important;
  background:#fffaf5!important;
  box-shadow:0 8px 22px rgba(62,51,38,.07)!important;
  color:var(--ink)!important;
  text-align:center!important;
}
.launch-date-chip::before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:6px;
  background:#c49a55;
}
.launch-date-chip strong{font:500 29px/1 var(--heading)!important;letter-spacing:-.035em!important}
.launch-date-chip span{margin-top:4px!important;color:var(--gold-text)!important;font-size:9px!important;font-weight:600!important;letter-spacing:.12em!important}
.launch-date-chip small{margin-top:4px!important;color:#7d756d!important;font-size:8px!important;line-height:1!important}
.launch-date-unknown{margin:8px 0 0!important;color:#8d847b!important;font-size:10px!important}

/* Question and supporting hint should read as one unit. */
.quiz-form fieldset>legend{margin-bottom:3px!important}
.quiz-step-hint{margin-top:0!important;margin-bottom:21px!important;line-height:1.48!important}

/* All Oskar comments on the quiz share one visual language. */
.quiz-oskar{
      position: relative !important;
      display: grid !important;
      grid-template-columns: 96px minmax(0, 1fr) !important;
      align-items: center !important;
      gap: 17px !important;
      padding: 15px 20px 15px 15px !important;
      border: none !important;
      border-radius: 17px !important;
      background: none !important;
      box-shadow: none !important;
      overflow: hidden !important;
    text-align: left !important;
}
.quiz-oskar::before,
.quiz-oskar::after{
  content:"";
  position:absolute!important;
  width:9px!important;
  height:9px!important;
  background:var(--gold)!important;
  opacity:.48!important;
  -webkit-mask:url("/assets/icons/golden-star.svg") center/contain no-repeat!important;
  mask:url("/assets/icons/golden-star.svg") center/contain no-repeat!important;
}
.quiz-oskar::before{left:122px!important;bottom:12px!important}
.quiz-oskar::after{right:15px!important;top:12px!important;opacity:.32!important}
.quiz-oskar img{
  width:96px!important;
  height:96px!important;
  object-fit:contain!important;
  border-radius:0!important;
  mix-blend-mode:normal!important;
}
.quiz-oskar-copy{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:14px!important;
  width:100%!important;
  min-width:0!important;
}
.quiz-oskar p{
    margin: 0 !important;
    color: #566059 !important;
    font: italic 400 17.5px / 1.5 var(--heading) !important;
    letter-spacing: -.006em !important;
}
.quiz-oskar-signature:not(.favorites-hero-count){
  margin:0 12px 0 0!important;
  color:#6d5536!important;
  font-family:"Segoe Script","Snell Roundhand","Brush Script MT",cursive!important;
  font-size:24px!important;
  font-weight:400!important;
  line-height:1!important;
  white-space:nowrap!important;
  transform:rotate(-4deg)!important;
  transform-origin:left center!important;
}
@media(min-width:681px){
  .quiz-oskar{grid-template-columns:84px minmax(0,1fr)!important;gap:14px!important;padding:20px 16px!important}
  .quiz-oskar .quiz-oskar-copy{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:7px!important}
  .quiz-oskar p{font-size:16px!important;line-height:1.48!important}
  .quiz-oskar .quiz-oskar-signature:not(.favorites-hero-count){align-self:flex-end!important;margin:0 6px 0 0!important;font-size:21px!important}
}

@media(max-width:680px){
  input[type="search"]{font-size:16px!important}
  .launch-grid{grid-template-columns:1fr!important;gap:11px!important}
  .launch-card{
    display:grid!important;
    grid-template-columns:clamp(120px,34vw,140px) minmax(0,1fr)!important;
    min-height:138px!important;
    align-items:stretch!important;
    border-radius:14px!important;
  }
  .launch-card-image{
    grid-column:1!important;
    grid-row:1!important;
    width:100%!important;
    height:100%!important;
    min-height:138px!important;
    aspect-ratio:auto!important;
    border-radius:13px 0 0 13px!important;
    background:#f3ede5!important;
  }
  .launch-card-image img{
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center!important;
  }
  .launch-card-body{
    position:relative!important;
    display:block!important;
    grid-column:2!important;
    grid-row:1!important;
    min-width:0!important;
    padding:13px 62px 13px 14px!important;
  }
  .launch-card-meta{
    display:block!important;
    margin:0 0 5px!important;
    padding:1px 0 0!important;
  }
  .launch-card-meta .eyebrow.eyebrow{font-size:10px!important;letter-spacing:.24em!important}
  .launch-card h3{
    display:-webkit-box!important;
    margin:0!important;
    padding:0!important;
    font-size:17.5px!important;
    line-height:1.15!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:3!important;
  }
  .launch-date-chip{
    position:absolute!important;
    top:12px!important;
    right:10px!important;
    min-width:47px!important;
    min-height:58px!important;
    padding:11px 6px 6px!important;
    border-radius:9px!important;
    box-shadow:none!important;
  }
  .launch-date-chip::before{height:4px!important}
  .launch-date-chip strong{font-size:21px!important}
  .launch-date-chip span{margin-top:3px!important;font-size:7.5px!important}
  .launch-date-chip small{margin-top:3px!important;font-size:7px!important}
  .launch-date-unknown{margin-top:7px!important;font-size:9px!important}
  .launch-period + .launch-period{margin-top:42px!important}
  .launch-tabs{margin-bottom:30px!important}

  .toplist-picker-search,
.picker-search{min-height:52px!important}
  .toplist-picker-search input,
.picker-search input{min-height:50px!important;font-size:16px!important}

  .quiz-form fieldset>legend{margin-bottom:2px!important}
  .quiz-step-hint{margin-bottom:17px!important;line-height:1.46!important}

  .quiz-oskar{
    grid-template-columns:76px minmax(0,1fr)!important;
    gap:12px!important;
    width:100%!important;
    max-width:none!important;
    justify-self:stretch!important;
    padding:20px 13px!important;
    border-radius:15px!important;
  }
  .quiz-oskar img{width:76px!important;height:76px!important}
  .quiz-oskar-copy{grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important}
  .quiz-oskar p{font-size:13.5px!important;line-height:1.44!important}
  .quiz-oskar-signature:not(.favorites-hero-count){margin-right:5px!important;font-size:20px!important}
  .quiz-oskar::before{left:94px!important;bottom:9px!important;width:8px!important;height:8px!important}
  .quiz-oskar::after{right:9px!important;top:9px!important;width:8px!important;height:8px!important}
}


/* Quiz welcome uses the existing question card, fonts, icons and primary button. */
.quiz-welcome-main{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(260px,.85fr);gap:32px;align-items:center;padding:12px 6px 24px}
.quiz-welcome-copy{min-width:0}
.quiz-welcome h1{max-width:620px;font-size:clamp(34px,3.25vw,46px);line-height:1.08;margin-bottom:20px}
.quiz-welcome-copy>p{max-width:510px;color:var(--muted);font-size:16px;line-height:1.65;margin:0}
.quiz-welcome-copy>.quiz-intro-meta{margin:20px 0}
.quiz-welcome-art{min-width:0;margin:0;align-self:end;text-align:center}
.quiz-welcome-art>img{width:min(100%,330px);height:auto;max-height:345px;object-fit:contain;margin:0 auto}
.quiz-welcome-art>figcaption{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:14px;color:var(--muted);font:italic 15px/1.5 var(--heading)}
.quiz-welcome-topics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;padding:24px 6px 4px;border-top:1px solid var(--line)}
.quiz-welcome-topics>div{display:flex;align-items:center;gap:12px;min-width:0}
.quiz-welcome-topics svg{width:24px;height:24px;flex:0 0 24px;color:var(--gold-dark)}
.quiz-welcome-topics strong{display:block;font-size:12px;font-weight:600}
.quiz-welcome-topics small{display:block;margin-top:3px;font-size:11px;color:var(--muted);line-height:1.45}
.quiz-page [data-quiz-welcome][hidden],.quiz-page #endre-toppfinner[hidden]{display:none!important}
@media(max-width:900px){
 .quiz-welcome-main{grid-template-columns:minmax(0,1.2fr) minmax(210px,.8fr);gap:22px}
 .quiz-welcome-topics{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 28px}
}
@media(max-width:680px){
 .quiz-welcome-main{grid-template-columns:minmax(0,1fr);gap:0;padding:8px 8px 24px;text-align:center}
 .quiz-welcome-copy{display:contents}
 .quiz-welcome-copy>.eyebrow{grid-row:1;margin:0 0 16px;font-size:9.5px}
 .quiz-welcome h1{grid-row:2;font-size:clamp(28px,7.5vw,36px);line-height:1.1;margin:0 auto 14px}
 .quiz-welcome-copy>p{grid-row:3;font-size:15px;line-height:1.55;margin:0 auto}
 .quiz-welcome-art{grid-row:4;margin:20px 0 0}
 .quiz-welcome-art>img{width:auto;height:190px;max-width:100%;margin:0 auto}
 .quiz-welcome-art>figcaption{font-size:12px;margin-top:10px;gap:8px}
 .quiz-welcome-art .quiz-oskar-signature{font-size:21px!important}
 .quiz-welcome-copy>.quiz-intro-meta{grid-row:5;justify-content:center;margin:18px 0 14px;row-gap:5px}
 .quiz-welcome-copy>.btn{grid-row:6;justify-self:center;max-width:100%}
 .quiz-welcome-topics{padding:20px 8px 4px;gap:18px 14px;text-align:left}
 .quiz-welcome-topics>div{gap:8px;align-items:flex-start}
 .quiz-welcome-topics svg{width:20px;height:20px;flex-basis:20px}
 .quiz-welcome-topics strong{font-size:11px;line-height:1.4}
 .quiz-welcome-topics small{font-size:10.5px}
}
