:root{--ink:#16251f;--cream:#f7f3e9;--paper:#fffdf7;--lime:#dfff45;--orange:#ff5b35;--yellow:#ffc947;--line:#16251f24}*{box-sizing:border-box}html{background:var(--cream)}body{background:var(--cream);color:var(--ink);margin:0;font-family:Arial,Helvetica,sans-serif}button{font:inherit}.app-shell{min-height:100vh;overflow:hidden}.topbar{border-bottom:1px solid var(--line);z-index:30;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#f7f3e9eb;justify-content:space-between;align-items:center;height:72px;padding:0 4vw;display:flex;position:sticky;top:0}.brand{letter-spacing:.08em;cursor:pointer;color:var(--ink);background:0 0;border:0;align-items:center;gap:11px;font-weight:900;display:flex}.brand-mark{background:var(--ink);width:33px;height:33px;color:var(--lime);border-radius:50% 50% 46% 54%;place-items:center;font-family:Georgia,serif;font-size:21px;font-style:italic;display:grid;transform:rotate(-7deg)}.round-pill{background:var(--ink);color:#fff;letter-spacing:.04em;border-radius:99px;padding:9px 15px;font-size:12px;font-weight:800}.setup-screen{grid-template-columns:minmax(360px,.85fr) minmax(520px,1.15fr);min-height:calc(100vh - 72px);display:grid}.hero-copy{border-right:1px solid var(--line);background:radial-gradient(circle at 90% 10%,#dfff459e,#0000 27%);padding:5.5vw 5vw 4vw;position:relative}.hero-copy:after{content:"1  X  2";letter-spacing:-.1em;color:#1726200e;pointer-events:none;font:900 clamp(48px,7vw,110px)/1 Arial;position:absolute;bottom:2.5vw;right:3vw;transform:rotate(-8deg)}.eyebrow{letter-spacing:.15em;text-transform:uppercase;align-items:center;gap:9px;font-size:11px;font-weight:900;display:inline-flex}.eyebrow:before{content:"";background:var(--orange);width:23px;height:3px}.eyebrow.light{color:#ffffffb8}.eyebrow.light:before{background:var(--lime)}h1,h2,p{margin-top:0}.hero-copy h1,.summary-screen>h1{font:900 clamp(54px,5.7vw,88px)/.84 var(--font-geist-sans),Arial;letter-spacing:-.075em;margin:27px 0 24px}h1 em{color:var(--orange);font-family:Georgia,serif;font-weight:400}.hero-copy>p{color:#4e5a54;max-width:480px;font-size:17px;line-height:1.55}.game-facts{border-top:1px solid var(--line);border-bottom:1px solid var(--line);grid-template-columns:repeat(3,1fr);max-width:500px;margin:28px 0 0;padding:18px 0;display:grid}.game-facts span{color:#64706a;text-transform:uppercase;letter-spacing:.05em;flex-direction:column;gap:4px;padding-right:12px;font-size:10px;display:flex}.game-facts strong{font:900 22px/1 var(--font-geist-mono),monospace;color:var(--ink)}.role-picker{max-width:500px;margin-top:20px}.role-picker>span{color:#69736e;letter-spacing:.12em;text-transform:uppercase;margin-bottom:8px;font-size:9px;font-weight:900;display:block}.role-picker>div{grid-template-columns:1fr 1fr;gap:8px;display:grid}.role-picker button{border:1px solid var(--line);min-height:60px;color:var(--ink);text-align:left;cursor:pointer;background:#ffffff75;border-radius:10px;flex-direction:column;justify-content:center;gap:3px;padding:10px 13px;display:flex}.role-picker button:hover{border-color:var(--ink);background:var(--paper)}.role-picker button.active{border-color:var(--ink);background:var(--lime);box-shadow:0 3px 0 var(--ink)}.role-picker b{font-size:12px}.role-picker small{color:#69736e;font-size:9px;line-height:1.25}.hero-actions{flex-wrap:wrap;gap:10px;margin-top:25px;display:flex}.primary,.secondary{border:1px solid var(--ink);cursor:pointer;border-radius:999px;min-height:54px;padding:0 22px;font-weight:900;transition:all .18s}.primary{background:var(--ink);color:#fff;justify-content:center;align-items:center;gap:34px;display:inline-flex}.primary span{color:var(--lime);font-size:20px}.primary:hover{box-shadow:0 6px 0 var(--orange);transform:translateY(-2px)}.primary:disabled{opacity:.28;cursor:not-allowed;box-shadow:none;transform:none}.secondary{color:var(--ink);background:0 0}.secondary:hover{background:#fff}.how-it-works{color:#68736d;text-transform:uppercase;letter-spacing:.05em;align-items:center;gap:9px;margin-top:24px;font-size:10px;font-weight:800;display:flex}.how-it-works span{white-space:nowrap;align-items:center;gap:5px;display:flex}.how-it-works b{border:1px solid var(--ink);width:20px;height:20px;color:var(--ink);border-radius:50%;place-items:center;display:grid}.how-it-works i{color:#a0a7a3;font-style:normal}.beer-picker{background:#eae4d7;max-height:calc(100vh - 72px);padding:3.4vw 3.5vw 5vw;overflow:auto}.picker-head{justify-content:space-between;align-items:end;margin-bottom:22px;display:flex}.step-label{color:var(--orange);text-transform:uppercase;letter-spacing:.15em;font-size:10px;font-weight:900}.picker-head h2{letter-spacing:-.04em;margin:5px 0 0;font-size:29px}.picker-actions{align-items:center;gap:14px;display:flex}.selected-badge{background:var(--ink);color:#fff;font:800 10px var(--font-geist-mono),monospace;white-space:nowrap;border-radius:99px;padding:7px 11px}.text-button{cursor:pointer;color:var(--ink);background:0 0;border:0;border-bottom:1px solid;padding:2px 0;font-size:11px;font-weight:800}.catalog-search{background:var(--paper);border:1px solid #16251f3b;border-radius:12px;grid-template-columns:30px 1fr 30px;align-items:center;gap:6px;height:50px;margin-bottom:12px;padding:0 13px;display:grid;box-shadow:0 2px #16251f14}.catalog-search>span{color:var(--orange);font:900 24px/1 Arial;transform:rotate(-20deg)}.catalog-search input{width:100%;color:var(--ink);background:0 0;border:0;outline:0;font-size:13px}.catalog-search input::placeholder{color:#818a85}.catalog-search button{width:28px;height:28px;color:var(--ink);cursor:pointer;background:#e8e3d8;border:0;border-radius:50%;font-size:18px}.filter-row{scrollbar-width:none;gap:7px;margin:0 -3px 18px;padding:3px;display:flex;overflow-x:auto}.filter-row::-webkit-scrollbar{display:none}.filter-row button{color:#52605a;cursor:pointer;background:#ffffff73;border:1px solid #16251f2e;border-radius:99px;flex:none;min-height:35px;padding:0 13px;font-size:11px;font-weight:800}.filter-row button:hover{background:var(--paper);border-color:var(--ink)}.filter-row button.active{background:var(--orange);border-color:var(--orange);color:#fff}.catalog-status{color:#69746e;justify-content:space-between;align-items:center;gap:12px;min-height:24px;margin:-8px 0 10px;font-size:10px;font-weight:700;display:flex}.catalog-status strong{color:var(--orange)}.beer-grid{grid-template-columns:1fr 1fr;gap:9px;display:grid}.beer-card{text-align:left;min-height:84px;color:var(--ink);cursor:pointer;background:#ffffffb8;border:1px solid #0000;border-radius:10px;grid-template-columns:38px 1fr 27px;align-items:center;gap:9px;padding:13px;transition:all .14s;display:grid}.beer-card:hover{background:#fff;transform:translateY(-1px)}.beer-card.selected{background:var(--lime);border-color:var(--ink);box-shadow:0 4px 0 var(--ink);transform:translateY(-2px)}.beer-number{font:600 11px var(--font-geist-mono),monospace;color:#78817c;align-self:start;margin-top:3px}.beer-info{flex-direction:column;gap:6px;display:flex}.beer-info strong{font-size:14px;line-height:1.15}.beer-info small{color:#69726d;font-size:10px;line-height:1.25}.check{border:1px solid var(--line);border-radius:50%;place-items:center;width:25px;height:25px;font-weight:900;display:grid}.selected .check{background:var(--ink);color:var(--lime)}.empty-filter{color:#707b75;border:1px dashed #16251f3d;border-radius:10px;flex-direction:column;grid-column:1/-1;justify-content:center;align-items:center;gap:6px;min-height:180px;display:flex}.empty-filter strong{color:var(--ink)}.load-more{border:1px solid var(--ink);width:100%;min-height:50px;color:var(--ink);cursor:pointer;background:0 0;border-radius:999px;grid-column:1/-1;margin-top:14px;font-weight:900}.load-more:hover{background:var(--paper)}.load-more span{color:#737d78;margin-left:5px;font-size:10px;font-weight:700}.catalog-meta{color:#747d78;text-align:center;max-width:600px;margin:16px auto 0;font-size:9px;line-height:1.45}.mobile-start-bar{display:none}.center-screen{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:calc(100vh - 76px);padding:7vh 20px;display:flex}.ready-screen{background:var(--orange);color:#fff;position:relative}.ready-screen:before,.ready-screen:after{content:"";border:1px solid #ffffff1f;border-radius:50%;width:28vw;height:28vw;position:absolute}.ready-screen:before{top:5vh;left:-12vw}.ready-screen:after{bottom:-15vw;right:-10vw}.glass-orbit{border:1px solid #ffffff73;border-radius:50%;place-items:center;width:150px;height:150px;margin-bottom:28px;display:grid;position:relative}.glass-emoji{filter:drop-shadow(0 10px 10px #00000026);font-size:66px}.orbit-label{background:var(--lime);color:var(--ink);border-radius:50%;place-items:center;width:42px;height:42px;font-weight:900;display:grid;position:absolute;top:7px;right:-4px}.ready-screen h1{font:900 clamp(62px,9vw,126px)/.84 var(--font-geist-sans),Arial;letter-spacing:-.075em;margin:25px 0}.ready-screen p{color:#fffc;max-width:500px;font-size:17px;line-height:1.55}.primary.dark{background:var(--ink);min-width:220px;margin-top:22px}.host-screen{position:relative}.host-prompt{background:var(--ink);color:#fff}.host-prompt:before{content:"";pointer-events:none;border:1px dashed #dfff454d;border-radius:22px;position:absolute;inset:22px}.host-screen .host-badge{background:var(--lime);color:var(--ink);letter-spacing:.1em;text-transform:uppercase;border-radius:99px;margin-bottom:25px;padding:9px 14px;font-size:10px;font-weight:900}.host-screen h1{max-width:900px;font:900 clamp(54px,8vw,108px)/.86 var(--font-geist-sans),Arial;letter-spacing:-.075em;margin:25px 0}.host-screen>p{color:#ffffffba;max-width:650px;font-size:17px;line-height:1.5}.host-button{background:var(--lime);color:var(--ink);border-color:var(--lime);margin-top:22px}.host-button span{color:var(--ink)}.host-reveal{background:var(--yellow);color:var(--ink)}.host-reveal .host-badge{background:var(--ink);color:var(--lime)}.host-reveal .eyebrow{margin-bottom:10px}.host-reveal .host-beer-number{font:900 12px var(--font-geist-mono),monospace;letter-spacing:.12em;text-transform:uppercase}.host-reveal h1{max-width:1050px;font-size:clamp(48px,7vw,94px)}.host-reveal>p{color:#4c574f}.host-reveal>.primary{margin-top:24px}.host-reveal>small{color:#59635d;max-width:420px;margin-top:16px;line-height:1.4}.quiz-screen{flex-direction:column;max-width:760px;min-height:calc(100vh - 76px);margin:0 auto;padding:7vh 25px;display:flex}.quiz-progress{background:#dcd6ca;border-radius:9px;height:5px;overflow:hidden}.quiz-progress span{background:var(--orange);height:100%;transition:width .3s;display:block}.question-meta{font:800 10px var(--font-geist-mono),monospace;text-transform:uppercase;letter-spacing:.1em;color:#747d78;justify-content:space-between;margin-top:18px;display:flex}.quiz-screen h1{font:900 clamp(38px,5.5vw,66px)/1 var(--font-geist-sans),Arial;letter-spacing:-.06em;max-width:700px;margin:8vh 0 12px}.shortcut-hint{color:#77817c;margin:0 0 4vh;font-size:11px}.answers{gap:10px;display:grid}.answers button{border:1px solid var(--line);text-align:left;min-height:80px;color:var(--ink);cursor:pointer;background:#ffffff9e;border-radius:10px;grid-template-columns:45px 1fr 25px;align-items:center;gap:14px;padding:13px 18px;font-weight:750;transition:all .15s;display:grid}.answers button:hover{border-color:var(--ink);background:#fff}.answers button.chosen{background:var(--lime);border-color:var(--ink);box-shadow:0 5px 0 var(--ink);transform:translateY(-2px)}.answer-key{font:900 23px var(--font-geist-mono),monospace}.answer-dot{border:1px solid #87908b;border-radius:50%;justify-self:end;width:18px;height:18px}.chosen .answer-dot{border:5px solid var(--ink)}.quiz-next{align-self:flex-end;min-width:190px;margin-top:28px}.reveal-screen{background:#ebe6da;min-height:calc(100vh - 76px)}.reveal-hero{background:var(--ink);color:#fff;padding:7vh max(5vw,25px) 5vh;position:relative;overflow:hidden}.reveal-hero:after{content:"RÄTT SVAR";color:#ffffff09;font:900 10vw/1 Arial;position:absolute;bottom:-2vw;right:-2vw}.score-burst{background:var(--lime);width:100px;height:100px;color:var(--ink);border-radius:50%;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;top:5vh;right:6vw;transform:rotate(7deg)}.score-burst strong{font:900 38px/1 var(--font-geist-mono),monospace}.score-burst span{font-size:10px;font-weight:800}.reveal-hero h1{font:900 clamp(52px,8vw,105px)/.9 var(--font-geist-sans),Arial;letter-spacing:-.07em;max-width:900px;margin:30px 140px 16px 0}.reveal-hero>p{color:#aeb7b2}.fact-row{flex-wrap:wrap;gap:8px;margin-top:26px;display:flex}.fact-row span{border:1px solid #526059;border-radius:99px;padding:8px 13px;font-size:11px}.reveal-body{grid-template-columns:.8fr 1.2fr;align-items:start;gap:4vw;padding:4vw max(5vw,25px) 7vw;display:grid}.taste-card{background:var(--orange);color:#fff;border-radius:6px;padding:28px;position:sticky;top:20px}.taste-card>span{text-transform:uppercase;letter-spacing:.14em;opacity:.7;font-size:10px;font-weight:900}.taste-card>p{font:700 21px/1.4 var(--font-geist-sans),Arial;margin:18px 0 30px}.meters{border-top:1px solid #ffffff4d;grid-template-columns:repeat(3,1fr);gap:10px;padding-top:18px;display:grid}.meters div{flex-direction:column;gap:5px;display:flex}.meters small{opacity:.7;text-transform:uppercase;font-size:9px}.meters strong{font-size:12px}.answer-review h2{margin-bottom:18px;font-size:27px}.review-row{border-top:1px solid var(--line);grid-template-columns:34px 1fr;gap:12px;padding:16px 0;display:grid}.review-row>span{border-radius:50%;place-items:center;width:27px;height:27px;font-weight:900;display:grid}.review-row.correct>span{background:var(--lime)}.review-row.wrong>span{background:var(--orange);color:#fff}.review-row div{flex-direction:column;gap:4px;display:flex}.review-row small{color:#68716c}.review-row strong{font-size:14px}.review-row em{color:var(--orange);font-size:11px;font-style:normal}.reveal-body>.primary{grid-column:2;justify-self:end}.summary-screen{text-align:center;max-width:900px;margin:auto;padding:9vh 25px}.summary-screen>h1{margin:28px 0 45px}.summary-screen>h1 em{display:inline-block;transform:rotate(-2deg)}.total-score{background:var(--lime);border:2px solid var(--ink);width:230px;height:230px;box-shadow:8px 8px 0 var(--ink);border-radius:50%;flex-direction:column;justify-content:center;align-items:center;margin:0 auto 50px;display:flex;transform:rotate(-3deg)}.total-score strong{font:900 76px/.9 var(--font-geist-mono),monospace;letter-spacing:-.08em}.total-score span{font-size:11px;font-weight:800}.total-score small{color:#4a554f;margin-top:15px;font-style:italic}.score-list{text-align:left;border-top:1px solid var(--line);max-width:650px;margin:0 auto 35px}.score-list>div{border-bottom:1px solid var(--line);grid-template-columns:42px 1fr 50px;align-items:center;gap:12px;min-height:70px;display:grid}.round-index{background:var(--ink);color:#fff;border-radius:50%;place-items:center;width:29px;height:29px;font-size:11px;display:grid}.score-list div div{flex-direction:column;gap:4px;display:flex}.score-list small{color:#727b76}.score-list b{font:900 18px var(--font-geist-mono),monospace;text-align:right}.summary-screen>.primary{min-width:190px;margin:auto}.source-note{color:#7d8581;max-width:500px;margin:30px auto 0;font-size:10px;line-height:1.5}@media (width<=850px){.setup-screen{grid-template-columns:1fr}.hero-copy{border-right:0;border-bottom:1px solid var(--line);padding:50px 24px 44px}.hero-copy:after{display:none}.beer-picker{max-height:none;padding:38px 20px 110px}.reveal-body{grid-template-columns:1fr}.taste-card{position:static}.reveal-body>.primary{grid-column:1}.reveal-hero h1{margin-right:0;padding-top:80px}}@media (width<=560px){.topbar{height:62px;padding:0 17px}.brand{font-size:12px}.brand-mark{width:30px;height:30px}.setup-screen,.center-screen,.quiz-screen,.reveal-screen{min-height:calc(100vh - 62px)}.hero-copy{padding:38px 20px 34px}.hero-copy h1,.summary-screen>h1{margin:22px 0 20px;font-size:52px}.hero-copy>p{font-size:15px;line-height:1.5}.game-facts{margin-top:22px;padding:15px 0}.game-facts span{font-size:8px}.game-facts strong{font-size:19px}.role-picker>div{grid-template-columns:1fr}.role-picker button{min-height:52px}.hero-actions{margin-top:18px}.hero-actions .primary{display:none}.hero-actions .secondary{width:100%;min-height:48px}.how-it-works{display:none}.beer-picker{padding:30px 15px 115px}.picker-head{align-items:flex-start;margin-bottom:16px}.picker-head h2{font-size:25px}.picker-actions{flex-direction:column;align-items:flex-end;gap:8px}.catalog-search{z-index:16;margin:0 -2px;position:sticky;top:62px}.filter-row{z-index:15;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#eae4d7f0;margin:0 -15px 14px;padding:10px 15px;position:sticky;top:112px}.beer-grid{grid-template-columns:1fr;gap:8px}.beer-card{border-radius:9px;min-height:76px;padding:11px 12px}.beer-info strong{font-size:13px}.beer-info small{font-size:9px}.mobile-start-bar{z-index:40;background:var(--ink);color:#fff;border:1px solid #ffffff38;border-radius:18px;justify-content:space-between;align-items:center;gap:16px;min-height:70px;padding:9px 9px 9px 17px;display:flex;position:fixed;bottom:12px;left:12px;right:12px;box-shadow:0 10px 35px #16251f59}.mobile-start-bar>div{flex-direction:column;display:flex}.mobile-start-bar strong{font:900 21px var(--font-geist-mono),monospace;color:var(--lime)}.mobile-start-bar span{text-transform:uppercase;letter-spacing:.08em;font-size:9px}.mobile-start-bar .primary{background:var(--lime);color:var(--ink);border-color:var(--lime);min-height:50px;box-shadow:none;padding:0 18px}.mobile-start-bar .primary span{color:var(--ink)}.host-screen{padding:55px 20px}.host-screen h1{font-size:54px}.host-screen>p{font-size:15px}.host-screen>.primary{width:100%;max-width:330px}.ready-screen h1{font-size:66px}.quiz-screen{padding:30px 18px}.quiz-screen h1{margin:45px 0 10px;font-size:40px}.shortcut-hint{margin-bottom:28px}.answers button{min-height:73px}.quiz-next{width:100%}.score-burst{width:82px;height:82px;top:42px;right:20px}.reveal-hero{padding:45px 20px 35px}.reveal-hero h1{font-size:55px}.reveal-body{padding:35px 20px 60px}.reveal-body>.primary{width:100%}.summary-screen{padding-top:65px}.total-score{width:205px;height:205px}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}:root{--ink:#2d1712;--cream:#f1dfc3;--paper:#fff8e9;--lime:#f2c75c;--orange:#b95536;--yellow:#e9a43d;--wine:#70363c;--line:#3f1f1729}.topbar{background:#2d1712f2;border-bottom-color:#ffffff1a;box-shadow:0 7px 24px #2d17122e}.brand{color:var(--paper)}.brand-mark,.round-pill{background:var(--yellow);color:var(--ink)}.game-controls{align-items:center;gap:9px;display:flex}.restart-button{min-height:38px;color:var(--paper);cursor:pointer;background:#ffffff14;border:1px solid #ffffff47;border-radius:99px;padding:0 14px;font-size:11px;font-weight:900}.restart-button:hover{background:var(--yellow);border-color:var(--yellow);color:var(--ink)}.hero-copy{color:var(--paper);background:linear-gradient(90deg,#26110cf5,#26110cad),url(/glaskampen/beer-hero.png) 50%/cover no-repeat}.hero-copy>p{color:#fff8e9c7}.game-facts strong{color:var(--paper)}.game-facts span,.role-picker>span{color:#fff8e9a6}.role-picker button{color:var(--paper);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#fff8e91a;border-color:#ffffff38}.role-picker button.active{border-color:var(--yellow);background:var(--yellow);color:var(--ink);box-shadow:0 3px #130906}.role-picker button.active small{color:#654238}.beer-picker{background:#ead6b8}.ready-screen{background:radial-gradient(circle at 50% 30%,#9a4d4e 0,var(--wine) 48%,#492027 100%)}.restart-overlay{z-index:100;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#1c0c09b8;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.restart-dialog{background:var(--paper);width:min(430px,100%);color:var(--ink);text-align:center;border:1px solid #ffffff29;border-radius:22px;padding:30px;box-shadow:0 24px 80px #14080573}.restart-dialog h2{letter-spacing:-.04em;margin:8px 0 12px;font-size:30px}.restart-dialog p{color:#6e5148;line-height:1.5}.restart-dialog>div{justify-content:center;gap:9px;margin-top:24px;display:flex}@media (width<=560px){.round-pill{display:none}.restart-button{padding:0 11px}.filter-row{background:#ead6b8f2}.restart-dialog>div{flex-direction:column}}