@font-face{font-family:Quiz;src:url('fonts/nunito-sans-latin-400-normal.woff2')}@font-face{font-family:Quiz;src:url('fonts/nunito-sans-latin-700-normal.woff2');font-weight:700}@font-face{font-family:Quiz;src:url('fonts/nunito-sans-latin-900-normal.woff2');font-weight:900}
:root{--display-scale:1;--cyan:#20d9ff;--gold:#ffcf26;--navy:#061438}html,body{font-family:Quiz,system-ui,sans-serif;background:#04112c;color:#fff}h1,h2,strong,.button{font-weight:900}button,input{font-family:inherit}a.button{display:inline-flex;justify-content:center;align-items:center;text-decoration:none}.brand-logo{filter:drop-shadow(0 5px 7px #0008)}.stage-lights{position:fixed;inset:0;pointer-events:none;overflow:hidden;background:radial-gradient(ellipse at 7% 0,#00a6f088,transparent 18%),radial-gradient(ellipse at 93% 0,#00a6f088,transparent 18%),radial-gradient(ellipse at 50% 100%,#124e9c80,transparent 50%),linear-gradient(#051537,#03112b 55%,#062554);z-index:0}.stage-lights:before{content:'';position:absolute;inset:12% -2% 18%;border:5px solid #edbd42;border-top-width:12px;transform:perspective(900px) rotateX(-15deg);box-shadow:0 0 10px #ffd774,inset 0 0 25px #00caff;background:radial-gradient(circle,#007bcba0 2px,transparent 4px) left center/24px 24px;background-clip:padding-box;mask:linear-gradient(90deg,#000,transparent 11%,transparent 89%,#000)}.stage-lights:after{content:'';position:absolute;left:-8%;right:-8%;bottom:-22%;height:42%;border:4px solid #12cfff;border-bottom-color:#ffdc62;border-radius:50%;box-shadow:0 0 15px #00cfff,inset 0 0 24px #00cfff50}main{position:relative;z-index:1}.panel{border:3px solid #3be1ff;border-bottom-color:#ffe147;border-radius:30px;box-shadow:0 0 8px #00daff,0 0 22px #00aaff55,inset 0 0 22px #0757b360;background:linear-gradient(145deg,#061b43f5,#04122ee8)}.button.primary{border:2px solid #fff29a;background:linear-gradient(135deg,#fff261,#ffd31d 48%,#f1ad00);box-shadow:0 0 5px #fff,0 0 17px #ffb40090;color:#071634}.button{transition:filter .15s,transform .15s}.button:hover{filter:brightness(1.09)}.button:active{transform:translateY(1px)}.quiz-mascot,.mobile-mascot{pointer-events:none;user-select:none;object-fit:contain}.mobile-mascot{position:absolute;left:-40px;top:120px;width:170px;z-index:2}.game-icon{display:block;object-fit:contain;width:100%;height:95px;margin:0 auto 12px;filter:drop-shadow(0 5px 4px #0008)}.game-card{padding:14px 8px;border:2px solid #a3b1c6;border-radius:22px;background:radial-gradient(at 50% 10%,#64778c,#27384c 75%);text-decoration:none;gap:8px;min-width:0;box-shadow:inset 0 0 14px #ffffff25}.game-card.selected{border:3px solid #fff34d;background:radial-gradient(at 50% 20%,#1276da,#06285f 85%);box-shadow:0 0 4px white,0 0 16px #ffcf20,inset 0 0 15px #008fff}.game-card.locked{opacity:.85}.game-card.locked .game-icon{filter:grayscale(1) drop-shadow(0 5px 4px #0009)}.game-card strong{font-size:1.08rem;line-height:1.15;min-height:2.4em;display:flex;align-items:center;justify-content:center}.game-card small{font-weight:900;border:1px solid #8396b3;border-radius:20px;padding:4px 10px}.game-card.selected small{border:0;background:#ffdb27;color:#06132b}.purchase-icon{width:75px;height:65px;object-fit:contain}.purchase-row>div{flex:1}.purchase-row{gap:10px}.dashboard-welcome{text-align:center}.dashboard-welcome p{color:#cedaf0;line-height:1.5}.dashboard-games h2{text-align:center}.host-dashboard{justify-content:flex-start;gap:20px;padding-top:20px}.host-dashboard .brand-logo{width:175px}.host-dashboard .account-bar{margin:0;padding:0}.host-dashboard .game-grid{gap:14px}.host-page .host-games{padding:16px}.host-page .host-games .game-card{min-height:150px}.host-page .host-games .game-icon{height:65px;margin:0}.host-page .host-games .game-card strong{font-size:.94rem}.account-bar,.host-header{position:relative;z-index:8}.account-menu nav{background:#051937}.mobile-wrap{gap:20px}.auth-page{justify-content:flex-start;padding-top:20px}.auth-page>h1{padding:12px 20px 0 85px;font-size:2.2rem;margin:0}.auth-page>.lead{padding-left:70px;margin:0 0 14px}.auth-card input,.join-card input,.account-page input{border:2px solid #d2e4ff;background:linear-gradient(110deg,#0b1d3e,#122d53);font-weight:700;min-height:54px}.auth-card label,.join-card label{font-size:1.1rem}.tabs{border:2px solid #b2c6e5;border-radius:20px}.tab{font-weight:900;padding:15px 8px}.tab.active{background:linear-gradient(#16c5ff,#0756aa);color:#fff;box-shadow:inset 0 0 10px #fff9}.join-page{padding-top:20px;justify-content:center;gap:30px}.join-page>.lead{font-weight:900;font-size:1.3rem;padding-left:75px;margin:35px 0 35px}.join-page>.brand-logo{margin-bottom:25px}.join-page .mobile-mascot{top:140px;width:145px}.join-card{padding:28px 20px}.join-card .primary{margin:25px 0}.join-card .fine-print{border-top:1px solid #5a789d;padding-top:25px;font-size:1rem}.waiting-page .mobile-mascot{top:8vh;width:130px}.waiting-page>.brand-logo{margin-bottom:60px}.wait-card{padding:35px 20px}.wait-card p{font-size:1.1rem}.page-home,.page-tv,.page-tvgame{height:100dvh!important;width:100vw!important;overflow:hidden!important;overscroll-behavior:none}.tv-screen .fullscreen{box-sizing:border-box;position:absolute!important;left:50%;top:50%;width:1672px!important;height:940px!important;min-height:0!important;max-height:940px;transform:translate(-50%,-50%) scale(var(--display-scale));transform-origin:center;padding:0!important;display:block;overflow:hidden!important;margin:0}.tv-screen h1,.tv-screen h2{font-weight:900;text-shadow:0 3px 4px #0007}.tv-screen .brand-logo{position:absolute;left:50%;top:0;transform:translateX(-50%);width:250px;height:145px;margin:0}.tv-screen .panel{border-width:4px;border-radius:40px}.tv-screen .quiz-mascot{position:absolute;left:-8px;top:205px;width:325px;height:560px;z-index:4;object-fit:contain}.tv-home .quiz-mascot{left:auto;right:-40px;top:190px;height:610px;width:405px;transform:scaleX(-1)}.tv-home .home-host{position:absolute;left:345px;top:175px;width:982px;height:392px;padding:15px}.tv-home .home-host h1{font-size:45px;margin:0 0 8px;line-height:1.15}.qr-box{box-sizing:border-box;flex-shrink:0}.tv-screen .qr-box{padding:10px;background:white;border-radius:18px;min-width:0;min-height:0;overflow:hidden}.qr-box img,.qr-box canvas{object-fit:contain;max-width:100%;max-height:100%;width:100%;height:100%}.tv-home .home-host .qr-box{width:250px;height:250px;margin:12px auto}.tv-home .home-host p{font-size:29px;line-height:1.1;margin:12px 0 0}.tv-home .test-bypass{position:absolute;right:22px;bottom:20px;padding:9px 14px;min-height:0;font-size:18px;border-radius:13px;max-width:180px}.tv-home .code-entry{position:absolute;top:610px;left:300px;width:1070px}.tv-home .code-entry h2{font-size:45px;line-height:1.15;margin:0 0 12px}.tv-home .code-entry>p{font-size:25px;line-height:1.2;margin:0 0 18px}.tv-home .digit-inputs{gap:45px;margin-top:25px}.tv-home .digit-inputs input{width:87px;height:83px;border:4px solid #25dfff;border-radius:20px;font-size:50px;box-shadow:0 0 6px #00c9ff80,inset 0 0 12px #09cfff25;margin:0;padding:0}.tv-home #code-error{font-size:23px;margin:0;color:#ffbfba}.tv-home #code-error:empty{display:none}.tv-home .host-hint{position:absolute;bottom:40px;left:350px;width:960px;font-size:27px;margin:0}.tv-home .host-hint:before{content:'▣';color:#22f08b;margin-right:18px}.tv-lobby header{height:190px;text-align:center}.tv-lobby .brand-logo{width:225px;height:132px}.tv-lobby header h1{position:absolute;left:250px;right:210px;top:130px;font-size:44px;line-height:1.15;margin:0}.tv-lobby .tv-layout{position:absolute;left:290px;top:200px;width:1220px;height:330px;display:grid!important;grid-template-columns:750px 450px;gap:20px}.tv-lobby .tv-join{display:flex;flex-direction:column;justify-content:flex-start;padding:7px 25px 10px;align-items:center}.tv-lobby .tv-join h2{font-size:36px;margin:0;line-height:42px;flex-shrink:0}.tv-lobby .tv-join .qr-box{width:228px;height:228px;margin:7px auto 3px}.tv-lobby .tv-join p{font-size:25px;line-height:30px;margin:0;white-space:nowrap;font-weight:900}.tv-lobby .tv-players{display:block!important;padding:7px 30px 14px;min-width:0}.tv-lobby .tv-players h2{font-size:36px;line-height:45px;margin:0 0 5px}.tv-lobby #tv-player-list{max-height:252px;overflow-y:auto;padding:0 4px}.tv-player{display:flex;align-items:center;gap:17px;height:57px;border:2px solid #57dfff;border-radius:25px;padding:3px 12px 3px 8px;margin:5px 0;background:linear-gradient(#093661,#041737);text-align:left;font-size:30px}.tv-player strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}.player-avatar{display:flex;align-items:center;justify-content:center;background:linear-gradient(#07cfff,#0072d6);width:49px;height:49px;border-radius:50%;flex-shrink:0}.player-avatar svg{fill:#fff;width:36px;height:36px}.tv-player:nth-child(4n+2) .player-avatar{background:linear-gradient(#ff70c6,#f00077)}.tv-player:nth-child(4n+3) .player-avatar{background:linear-gradient(#ffdc30,#f6a200)}.tv-player:nth-child(4n+4) .player-avatar{background:linear-gradient(#af72ff,#7922e9)}.player-check{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:linear-gradient(#16f645,#00a924);font-size:29px;font-family:Arial;font-weight:700;flex-shrink:0}.tv-lobby .tv-games{position:absolute;left:290px;top:550px;width:1220px;height:345px;padding:6px 42px 12px;display:block}.tv-lobby .tv-games h2{font-size:44px;line-height:50px;margin:0 0 10px}.tv-game-row{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.tv-game-tile{height:215px;border:4px solid #b8c6d7;border-radius:32px;padding:5px 12px 15px;background:radial-gradient(at 50% 20%,#667586,#293647 90%);opacity:1;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;box-shadow:inset 0 0 14px #ffffff25}.tv-game-tile .game-icon{height:125px;width:165px;margin:0 auto 14px;filter:grayscale(1) drop-shadow(0 5px 4px #0009)}.tv-game-tile strong{font-size:30px;line-height:1.03;display:flex;align-items:center;justify-content:center;flex:1}.tv-game-tile.active{background:radial-gradient(at 50% 30%,#0875d2,#072459 90%);border-color:#fff147;box-shadow:0 0 6px #fff,0 0 16px #ffd21c,inset 0 0 10px #00b5ff}.tv-game-tile.active .game-icon{filter:drop-shadow(0 5px 4px #0008)}.tv-lobby .tv-games>p{font-size:28px;font-weight:900;margin:9px 0 0;line-height:35px}.tv-lobby .tv-code{position:absolute;left:95px;bottom:40px;padding:5px 20px;font-size:24px;border:4px solid var(--cyan);border-bottom-color:var(--gold);border-radius:28px;background:#051936;box-shadow:0 0 8px #00bcff;z-index:5}.tv-game{padding:170px 150px 80px!important}.tv-game .brand-logo{width:230px}.tv-game #question-text{font-size:60px;margin:185px 80px 45px}.tv-game .answer-grid{margin:0 150px}.tv-game .answer-option{font-size:36px}.tv-screen .host-hint,.tv-screen .tv-games p{color:#fff}.tv-screen .code-entry h2:before,.tv-screen .code-entry h2:after,.tv-lobby h2:before,.tv-lobby h2:after{content:'';display:inline-block;vertical-align:middle;width:65px;height:3px;background:linear-gradient(90deg,transparent,#ffcf27,transparent);margin:0 15px;box-shadow:0 0 7px #ffc720}
@media(max-width:420px){.mobile-wrap{padding-left:16px;padding-right:16px}.mobile-mascot{left:-25px;width:125px}.auth-page>h1{font-size:1.8rem}.auth-page>.lead{font-size:.93rem}.game-card strong{font-size:.92rem}.game-icon{height:75px}.host-dashboard .panel{padding:18px 14px}.purchase-icon{width:50px;height:50px}.purchase-row .status-pill{font-size:.67rem}.account-page .panel{padding:20px 16px}}
@media(prefers-reduced-motion:reduce){.pulse-dots i{animation:none}*{transition:none!important}}

.game-icon,.purchase-icon{background-image:url('game-icons.png');background-size:200% 200%;background-repeat:no-repeat;flex-shrink:0}.icon-buzzerbattle{background-position:0 0}.icon-ladder{background-position:100% 0}.icon-millionaire{background-position:0 100%}.icon-one_against_all{background-position:100% 100%}.game-card>.game-icon{width:132px;height:99px}.purchase-icon{display:block}.tv-game-tile .game-icon{width:165px;height:125px}.host-page .host-games .game-icon{width:100px;height:75px}
.stage-lights{background:#041231 url('stage.svg') center/cover no-repeat}.stage-lights:before,.stage-lights:after{display:none}.tv-lobby .tv-join,.tv-lobby .tv-players{height:330px;min-height:0;overflow:hidden}.tv-lobby h2{position:relative}.tv-lobby h2:before,.tv-lobby h2:after{position:absolute;top:50%;left:0;margin:0;width:55px}.tv-lobby h2:after{left:auto;right:0}.tv-lobby .tv-games h2:before{left:28%}.tv-lobby .tv-games h2:after{right:28%}.tv-lobby #tv-player-list{max-height:250px}.tv-lobby .quiz-mascot{width:455px;height:600px;top:195px;left:-8px;object-position:0 0}.tv-home .quiz-mascot{object-position:0 0;width:470px;height:660px;right:-35px}
.tv-lobby .tv-join,.tv-lobby .tv-players{overflow:visible}.tv-lobby .tv-layout{grid-template-rows:330px}.tv-lobby .tv-join h2{width:100%}.tv-home .home-host{height:428px}.tv-home .home-host .qr-box{width:245px;height:245px}.tv-home .home-host .test-bypass{top:318px;bottom:auto;left:50%;right:auto;transform:translateX(-50%);font-size:17px;padding:7px 14px;white-space:nowrap}.tv-home .home-host p{position:absolute;left:15px;right:15px;bottom:18px;font-size:27px;margin:0}.tv-home .code-entry{top:630px}.tv-home .host-hint{bottom:33px}.tv-lobby .tv-code{width:155px;text-align:center;line-height:1.05;font-size:19px}.tv-lobby .tv-code span{display:block}.tv-lobby .tv-code strong{display:block;font-size:34px}

.host-dashboard>.mobile-mascot{top:12px;left:-25px;width:115px}.host-page>.mobile-mascot{top:10px;left:-30px;width:110px}.host-header .account-bar{padding-left:62px}.tv-game-tile .game-icon{height:130px;width:175px;margin-bottom:6px}.tv-game-tile{padding-bottom:10px}
input[type="hidden"]{display:none!important}.account-menu:not([open]) nav{display:none}.mobile-wrap>*{min-width:0;max-width:100%}.auth-card,.join-card,.dashboard-welcome,.dashboard-games{width:100%}.tabs>*{min-width:0;flex:1 1 0}.button.full{white-space:normal}.host-dashboard .game-card{padding:10px 7px;gap:5px}.host-dashboard .game-card>.game-icon{width:110px;height:83px;margin-bottom:5px}.host-dashboard .game-card strong{font-size:.98rem;min-height:2.3em}.host-dashboard .game-card small{font-size:.7rem;padding:3px 6px}.dashboard-welcome h1{font-size:1.5rem;line-height:1.15}.auth-card .tabs{width:100%}.auth-card .tab{width:50%}.auth-card input{box-sizing:border-box}
.auth-card .tab{display:flex;align-items:center;justify-content:center;line-height:1.2;min-height:60px;font-size:1rem}.qr-box img,.qr-box canvas{image-rendering:pixelated}

/* Hostlogin: één gecentreerde uitleg onder het logo. */
.auth-page>.lead{padding:0;width:100%;max-width:30ch;margin:28px auto 18px;text-align:center;font-size:1.12rem;line-height:1.5;text-wrap:balance}.auth-page>.mobile-mascot{top:14px;left:-28px;width:120px}.auth-page .auth-card{margin-top:0}
