:root{--ink:#563842;--rose:#a83d65;--blush:#f9e6ed;--canvas:#fff6f9;--muted:#856571;--line:#efd8e1;--gold:#bd708c;--white:#fffdfe;--red:#b44a47;--shadow:0 18px 60px #9b486b0c}*{box-sizing:border-box}body{margin:0;background:var(--canvas);color:var(--ink);font-family:"PingFang TC","Noto Sans TC","Microsoft JhengHei",system-ui,sans-serif;line-height:1.65}button,input{font:inherit}button,a,input{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid #c6678e;outline-offset:4px}button{transition:background .2s,transform .2s,border .2s}a{color:inherit;text-decoration:none}.page-glow{position:fixed;top:-380px;left:-190px;width:1100px;height:900px;border-radius:50%;background:radial-gradient(ellipse,#fbd0e080,transparent 65%);pointer-events:none;z-index:-1}.site-header{max-width:1240px;margin:0 auto;padding:30px 44px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:13px;font-size:23px;font-weight:750;letter-spacing:.07em}.brand-mark{width:45px;height:45px;background:var(--rose);color:white;display:grid;place-items:center;font-family:serif;font-size:25px;border-radius:14px 4px 14px 4px}.brand small{display:block;font-size:8px;letter-spacing:.15em;color:var(--muted);font-weight:600}.header-right{display:flex;align-items:center;gap:9px;font-size:12px;color:var(--muted)}.live-dot,.live-label i{display:inline-block;width:6px;height:6px;background:#bd6689;border-radius:50%}.main-shell{max-width:1160px;margin:0 auto;padding:58px 20px 70px;min-height:72vh}.eyebrow{font-size:10px;font-weight:750;letter-spacing:.16em;color:var(--muted)}.highlight{position:relative;color:var(--rose);white-space:nowrap;z-index:0}.highlight:after{content:"";height:10px;position:absolute;left:0;right:-2px;bottom:4px;background:#f7cdda;z-index:-1;border-radius:4px;transform:rotate(-2deg)}.join-card{max-width:490px;background:var(--white);border:1px solid var(--line);border-radius:20px;padding:26px 29px;box-shadow:var(--shadow)}.join-card label{font-size:14px;font-weight:700}.input-row{margin-top:13px;display:flex;align-items:center;border:1px solid #ecd3dd;border-radius:10px;background:#fff9fc;gap:13px;padding:0 15px}.input-row:focus-within{border-color:var(--rose)}.input-row span{font-size:25px;color:#bc8a9d}.input-row input{width:100%;min-width:0;border:0;background:none;padding:13px 0;color:var(--ink);outline:none!important;font-size:14px}.input-row input::placeholder{color:#9b7886}.join-card p{color:var(--muted);font-size:10px;margin:7px 0 16px}.primary-btn{background:var(--rose);color:white;border:1px solid var(--rose);border-radius:11px;padding:13px 20px;font-size:14px;font-weight:650;display:flex;align-items:center;justify-content:space-between;gap:20px}.primary-btn:hover:not(:disabled){background:#8f3054;transform:translateY(-1px)}.primary-btn:disabled{background:#e2bdcc;border-color:#e2bdcc;color:#fff8fb}.primary-btn span{font-size:21px;font-weight:400;line-height:1}.join-card .primary-btn{width:100%}.join-card .rules-line{font-size:10px;text-align:center;margin:14px 0 0}.room-share{display:flex;justify-content:space-between;max-width:490px;margin-top:14px;padding:0 4px;font-size:10px;color:var(--muted);align-items:center}.text-btn{background:none;border:0;color:var(--rose);padding:5px 0;font-size:11px;font-weight:650}.text-btn:hover{text-decoration:underline}.board-card{background:var(--white);border:1px solid var(--line);padding:27px 27px 0;border-radius:22px;box-shadow:var(--shadow);margin-top:9px;overflow:hidden}.card-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.card-heading h2{font-size:19px;margin:3px 0 0}.card-heading .eyebrow{font-size:8px}.live-label{display:flex;align-items:center;gap:6px;font-size:9px;color:var(--muted);white-space:nowrap}.empty-board{display:flex;flex-direction:column;align-items:center;text-align:center;padding:54px 0 66px}.empty-board .trophy{width:100px;opacity:.75;margin-bottom:26px}.empty-board strong{font-size:13px;font-weight:650}.empty-board p{font-size:11px;color:var(--muted);margin-top:6px}.board-foot{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:17px 0;font-size:10px;color:var(--muted)}.board-foot b{font-weight:700;color:var(--ink)}.ranking-list{list-style:none;margin:19px 0;padding:0}.rank-row{display:flex;align-items:center;gap:13px;padding:15px 3px;border-bottom:1px solid #f5e5ec}.rank-row:last-child{border:0}.rank-number{font-size:13px;color:#95727f;width:31px;text-align:center;flex-shrink:0}.top-rank .rank-number{font-size:23px}.rank-person{flex:1;min-width:0}.rank-person strong{font-size:12px;display:block;overflow-wrap:anywhere}.rank-person small{font-size:9px;color:var(--muted);display:block}.rank-row>b{font-size:22px;font-family:Georgia,serif;font-weight:500;white-space:nowrap}.rank-row>b small{font-family:system-ui,sans-serif;font-size:9px;margin-left:4px;font-weight:500}.you-tag{background:var(--blush);color:var(--rose);font-size:8px;font-weight:500;border-radius:4px;padding:1px 4px;margin-left:7px}.is-you{background:#fff0f6;border-radius:8px;padding-left:8px;padding-right:8px}.site-footer{max-width:1160px;border-top:1px solid var(--line);margin:0 auto;padding:24px 20px;display:flex;justify-content:space-between;font-size:10px;color:#977382;gap:12px}.loading-card,.error-card{margin:70px auto;text-align:center;max-width:550px}.loader{display:inline-block;width:27px;height:27px;border:2px solid #f0c9da;border-top-color:var(--rose);border-radius:50%;animation:spin .8s linear infinite}.loading-card p{font-size:13px;color:var(--muted)}.error-card h1{font-size:27px}.error-card p{color:var(--muted);font-size:13px}.error-card .primary-btn{margin:25px auto}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);max-width:min(90vw,550px);background:var(--rose);color:white;border-radius:12px;box-shadow:0 8px 25px #74365320;padding:13px 20px;font-size:12px;z-index:20;overflow-wrap:anywhere}.toast[hidden]{display:none}.quiz-shell{max-width:820px;margin:auto}.quiz-topline{display:flex;justify-content:space-between;gap:20px;align-items:center}.quiz-topline h1{font-size:28px;margin:8px 0 0;letter-spacing:-.03em}.quiz-timer{text-align:right}.quiz-timer small{display:block;color:var(--muted);font-size:10px}.quiz-timer strong{font-family:Georgia,serif;font-size:27px;font-weight:500;font-variant-numeric:tabular-nums}.progress-track{display:flex;gap:9px;margin:29px 0 27px}.progress-step{height:33px;flex:1;display:grid;place-items:center;border-radius:8px;background:#f9e9f0;color:#95717e;font-size:11px;border:1px solid transparent}.progress-step.done{background:#f4d2e0;color:var(--rose)}.progress-step.current{border-color:#bd6086;background:#fff0f6;color:var(--rose);font-weight:750}.question-card{background:var(--white);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:22px;padding:33px 36px}.question-meta{display:flex;justify-content:space-between;align-items:center;gap:12px;color:var(--muted);font-size:10px;flex-wrap:wrap}.question-chip{background:#fbe5ef;color:var(--rose);padding:5px 11px;border-radius:7px;font-weight:700;letter-spacing:.05em;font-size:9px}.question-stem{font-size:19px;line-height:1.9;font-weight:650;margin:23px 0 27px;white-space:normal}.stem-item{font-weight:650}.options{display:grid;gap:11px}.option{width:100%;text-align:left;border:1px solid #ecd3de;border-radius:12px;background:#fffafb;color:var(--ink);padding:15px 17px;display:flex;gap:15px;align-items:center;font-size:13px;line-height:1.75}.option:hover:not(:disabled){border-color:#d19bb2;background:#fff2f7}.option-letter{width:29px;height:29px;flex-shrink:0;border:1px solid #edd2de;border-radius:7px;display:grid;place-items:center;font-family:Georgia,serif;color:var(--muted)}.option>span:nth-child(2){flex:1}.option-check{width:15px;flex-shrink:0;font-size:19px}.option.selected,.option.correct{border-color:#c97597;background:#fff0f5}.option.selected .option-letter,.option.correct .option-letter{background:var(--rose);color:white;border-color:var(--rose)}.option.wrong{border-color:#d99898;background:#fff0ef}.option.wrong .option-letter{background:#b96565;color:white;border-color:#b96565}.option.correct .option-check{color:var(--rose)}.option.wrong .option-check{color:var(--red)}.question-bottom{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-top:27px;border-top:1px solid var(--line);padding-top:22px}.question-bottom p{font-size:10px;color:var(--muted);margin:0}.question-submit{min-width:157px;flex-shrink:0}.save-note{font-size:10px;color:var(--muted);text-align:center;margin-top:20px}.feedback{margin-top:20px;border-radius:12px;padding:17px 20px;background:#fff0f5;border:1px solid #efcede;font-size:12px}.feedback strong{font-size:13px;color:var(--rose)}.feedback p{margin:7px 0 0;line-height:1.85;color:#876674}.feedback-wrong{background:#fff0ef;border-color:#f0c9c7}.feedback-wrong strong{color:#a65951}.results-shell{max-width:870px;margin:auto}.result-hero{text-align:center}.result-hero h1{font-size:37px;margin:12px 0;line-height:1.5;letter-spacing:-.03em}.result-hero>p{font-size:13px;color:var(--muted)}.score-banner{background:var(--rose);color:#fff8fc;border-radius:21px;padding:27px 34px;margin:29px 0;display:flex;justify-content:space-between;align-items:center;gap:25px;text-align:left;position:relative;overflow:hidden}.score-banner:after{content:"✦";font-size:190px;color:#fff0f609;position:absolute;left:14%;top:-53px;pointer-events:none}.big-score{font-family:Georgia,serif;font-size:64px;line-height:1.2;white-space:nowrap}.big-score>span{font-family:system-ui,sans-serif;display:block;font-size:11px;color:#f7dbe6;text-align:center;line-height:1.7}.result-metrics{display:flex;gap:31px;text-align:left}.result-metrics small{font-size:10px;display:block;color:#f7dbe6}.result-metrics strong{font-size:22px;white-space:nowrap}.result-metrics strong>span{font-size:11px;color:#f7dbe6}.awards-card{border:1px solid var(--line);background:var(--white);border-radius:22px;padding:26px 35px 20px;box-shadow:var(--shadow)}.awards-card .trophy{width:52px}.awards-card h2{font-size:24px}.podium{display:flex;justify-content:center;align-items:flex-end;gap:15px;max-width:650px;margin:35px auto 0}.podium-place{width:32%;text-align:center;min-width:0}.podium-avatar{border-radius:50%;width:43px;height:43px;margin:0 auto 9px;background:#fae6ef;color:var(--rose);font-size:20px;display:grid;place-items:center}.place-1 .podium-avatar{background:#f5d1e1;border:2px solid #e8adc7;width:51px;height:51px;font-size:24px}.podium-place>strong{display:block;font-size:12px;overflow-wrap:anywhere;line-height:1.5}.podium-place>span{font-size:11px;color:var(--muted)}.podium-base{margin-top:12px;border-radius:12px 12px 0 0;background:#f9e8ef;height:96px;padding:15px 10px}.place-1 .podium-base{height:129px;background:#f4d5e2}.place-3 .podium-base{height:76px;background:#f5e1e9}.podium-base>span{display:block;font-size:26px}.podium-base>b{font-family:Georgia,serif;font-size:22px;font-weight:500;color:#98707f}.place-1 .podium-base>b{color:#a34e73}.award-note,.podium-empty{text-align:center;font-size:10px;color:var(--muted);margin:19px 0 0}.statistics-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:20px 0 31px}.statistics-grid>div{background:#fbe7ef;border-radius:12px;padding:15px 18px}.statistics-grid small{display:block;font-size:10px;color:var(--muted)}.statistics-grid strong{font-family:Georgia,serif;font-size:27px;font-weight:500}.full-board{border:1px solid var(--line);border-radius:18px;padding:21px 27px;background:var(--white)}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.section-heading h2{font-size:19px;margin:0}.section-heading>span{font-size:10px;color:var(--muted)}.full-board .ranking-list{margin:14px 0 0}.review-section{margin:38px 0 0}.review-section h2{margin:5px 0 0}.review-list{margin-top:18px;display:grid;gap:9px}.review-item{background:var(--white);border:1px solid var(--line);border-radius:12px;overflow:hidden}.review-item summary{display:flex;align-items:center;gap:13px;padding:16px 19px;cursor:pointer;list-style:none}.review-item summary::-webkit-details-marker{display:none}.review-icon{width:29px;height:29px;border-radius:8px;display:grid;place-items:center;flex-shrink:0}.review-icon.right{background:#f9dfe9;color:var(--rose)}.review-icon.miss{background:#fde5e5;color:var(--red)}.review-item summary>span:nth-child(2){flex:1}.review-item summary small{display:block;font-size:9px;color:var(--muted)}.review-item summary strong{font-size:12px;display:block}.review-answer{font-size:10px;color:var(--muted);white-space:nowrap}.review-answer>span{font-size:17px;margin-left:12px}.review-body{border-top:1px solid var(--line);padding:12px 23px 23px;font-size:12px;color:#876674;line-height:1.85}.review-body>p:first-child{font-weight:650;color:var(--ink)}.review-options{list-style:none;padding:0}.review-options li{margin:5px 0}.correct-text{font-weight:700;color:var(--rose)}.review-body small{font-size:9px;display:block;color:#977382;overflow-wrap:anywhere}.answer-line{border-top:1px dashed var(--line);padding-top:12px;font-weight:650}.result-actions{display:flex;justify-content:center;align-items:center;gap:30px;margin-top:30px}.secondary-btn{border:1px solid #e3b9cd;border-radius:10px;color:var(--rose);background:#fff0f6;padding:11px 20px;font-weight:650;font-size:11px}.secondary-btn:hover{background:#f9dae8}@keyframes spin{to{transform:rotate(360deg)}}
@media(min-width:1300px){.main-shell{padding-top:65px;padding-bottom:85px}}@media(max-width:950px){.site-header{padding:24px 28px}.main-shell{padding:40px 28px 55px}.board-card{padding:24px 20px 0}.result-metrics{gap:22px}}@media(max-width:700px){.site-header{padding:19px 20px}.brand{font-size:20px;gap:10px}.brand-mark{width:38px;height:38px;font-size:22px}.brand small{font-size:6px}.header-right{font-size:10px}.main-shell{padding:33px 18px 44px}.join-card{max-width:none;padding:24px}.room-share{max-width:none}.board-card{margin-top:0;padding:23px 23px 0}.empty-board{padding:31px 0 38px}.empty-board .trophy{width:73px;margin-bottom:17px}.site-footer{margin:0 18px;padding:20px 0;flex-direction:column;gap:4px;font-size:9px}.quiz-topline h1{font-size:23px}.quiz-topline .eyebrow{font-size:9px}.quiz-timer strong{font-size:24px}.progress-track{gap:5px;margin:23px 0}.progress-step{height:27px;border-radius:6px;font-size:9px}.question-card{padding:23px 20px;border-radius:18px}.question-meta{font-size:9px;gap:9px}.question-stem{font-size:16px;margin:20px 0 22px;line-height:1.9}.option{padding:13px 12px;gap:10px;font-size:12px}.option-letter{width:26px;height:26px;font-size:13px}.question-bottom{flex-direction:column;align-items:stretch;gap:14px;margin-top:23px}.question-bottom p{text-align:center;font-size:9px}.question-submit{width:100%}.feedback{padding:15px;font-size:11px}.feedback strong{font-size:12px}.result-hero h1{font-size:29px}.result-hero>p{font-size:11px}.score-banner{padding:23px 22px;flex-direction:column;gap:21px;text-align:center}.big-score{font-size:62px}.result-metrics{width:100%;justify-content:space-around;gap:12px;text-align:center;border-top:1px solid #c37595;padding-top:15px}.result-metrics strong{font-size:20px}.awards-card{padding:21px 20px 18px}.awards-card h2{font-size:20px}.awards-card .trophy{width:40px}.podium{gap:8px;margin-top:27px}.podium-place>strong{font-size:10px}.podium-place>span{font-size:10px}.podium-avatar{width:37px;height:37px;font-size:17px}.place-1 .podium-avatar{width:43px;height:43px;font-size:20px}.statistics-grid{grid-template-columns:repeat(2,1fr);gap:9px}.statistics-grid>div{padding:13px 17px}.full-board{padding:20px}.section-heading h2{font-size:18px}.review-item summary{padding:13px 12px;gap:10px}.review-item summary strong{font-size:11px}.review-answer{font-size:9px}.review-answer>span{margin-left:7px}.review-body{padding:12px 15px 18px;font-size:11px}.result-actions{gap:17px;flex-wrap:wrap}.rank-person strong{font-size:12px}.result-hero .highlight{white-space:normal}}@media(max-width:350px){.header-right{display:none}.join-card{padding:20px}.result-hero h1{font-size:25px}.review-answer{display:none}.result-metrics strong{font-size:17px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.quiz-timer.urgent{color:var(--red)}

.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.waiting-shell{max-width:600px;margin:24px auto;text-align:center;padding:38px 32px;background:var(--white);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow)}.waiting-symbol{display:block;font-size:47px;color:var(--gold);line-height:1.3;margin-bottom:19px}.waiting-shell h1{font-size:40px;line-height:1.45;margin:17px 0}.waiting-shell>p{font-size:14px;color:var(--muted)}.waiting-facts{margin:31px auto 21px;padding:19px;background:#ffedf5;border-radius:16px;display:flex;flex-direction:column;gap:4px;color:var(--rose)}.waiting-facts b{font:48px Georgia,serif}.waiting-facts span{font-size:11px}.waiting-live{font-size:13px;display:flex;align-items:center;justify-content:center;gap:7px}.waiting-shell .waiting-note{font-size:11px;margin:17px 0 24px}.waiting-shell .room-share{margin:auto;max-width:none}.host-login{max-width:460px;margin:20px auto 80px}.host-login h1{font-size:42px;line-height:1.45}.host-login>p{color:var(--muted);font-size:13px;margin-bottom:25px}.host-login .primary-btn{margin-top:18px}.host-toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:24px}.host-toolbar label{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--muted)}.host-toolbar select{font:inherit;max-width:400px;background:var(--white);border:1px solid var(--line);padding:10px;border-radius:9px;color:var(--ink)}.host-hero{display:grid;grid-template-columns:1fr 280px;gap:35px;align-items:center;margin:25px 0}.host-hero h1{font-size:36px;line-height:1.45;margin:14px 0}.host-hero p{font-size:13px;color:var(--muted)}.phase-pill{display:inline-block;padding:5px 12px;border-radius:30px;background:#f9e1ec;color:var(--rose);font-size:11px;font-weight:700}.host-share{display:flex;align-items:center;gap:17px;flex-wrap:wrap;font-size:11px;color:var(--muted);margin-top:21px}.host-share a{font-weight:650;color:var(--rose)}.host-start-card{background:var(--rose);color:white;padding:25px 27px;border-radius:20px;text-align:center}.host-start-card>small{display:block;font-size:11px;color:#f7dce7}.host-start-card>strong{display:block;font:52px Georgia,serif;margin:5px 0 16px}.host-start-card .primary-btn{width:100%;background:#ffe5ef;border-color:#ffe5ef;color:var(--rose)}.host-start-card .primary-btn:hover:not(:disabled){background:#fff0f6}.host-start-card .primary-btn:disabled{background:#c37595;border-color:#c37595;color:#ffedf5}.host-start-card>p{font-size:10px;color:#f7dce7;margin:13px 0 0;min-height:33px}.host-roster-card{background:var(--white);border:1px solid var(--line);border-radius:20px;padding:26px;margin-top:27px}.roster-scroll{overflow-x:auto}.roster-table{border-collapse:collapse;width:100%;min-width:570px;text-align:left;font-size:12px}.roster-table th{font-size:10px;color:var(--muted);font-weight:600;padding:14px 12px;background:#fff0f6}.roster-table td{padding:16px 12px;border-bottom:1px solid var(--line);white-space:nowrap}.roster-table tr:last-child td{border-bottom:0}.roster-table td:first-child{white-space:normal;overflow-wrap:anywhere;max-width:220px}.player-status{display:inline-block;padding:4px 9px;border-radius:20px;font-size:10px;background:#f9e0eb;color:var(--rose)}.status-waiting{background:#fce1ec;color:#9c4b6c}.empty-roster{color:var(--muted);text-align:center!important;padding:32px!important;white-space:normal!important}.host-next-card{border-top:1px solid var(--line);padding-top:25px;margin-top:35px;display:flex;align-items:center;justify-content:space-between;gap:25px}.host-next-card h2{font-size:23px;margin:6px 0}.host-next-card p{font-size:11px;color:var(--muted)}.host-next-card form{display:flex;gap:12px;flex-wrap:wrap}.host-next-card input{font:inherit;font-size:12px;border:1px solid var(--line);border-radius:10px;background:var(--white);padding:12px 14px;min-width:250px;color:var(--ink)}
@media(max-width:700px){.waiting-shell{padding:28px 21px;margin:0}.waiting-shell h1{font-size:31px}.host-login h1{font-size:36px}.host-hero{grid-template-columns:1fr;gap:20px}.host-hero h1{font-size:29px}.host-toolbar{gap:12px}.host-toolbar label{width:100%}.host-toolbar select{min-width:0;width:100%}.host-start-card{padding:22px 25px}.host-roster-card{padding:20px 15px}.host-next-card{display:block}.host-next-card form{margin-top:20px}.host-next-card input{min-width:0;width:100%}.host-next-card .secondary-btn{width:100%}}

.host-toolbar label{white-space:nowrap}


/* Simple class login and sakura palette. */
.player-page{background:radial-gradient(ellipse at 10% 12%,#fae0eb90,transparent 42%),radial-gradient(ellipse at 95% 90%,#f8dce880,transparent 45%),var(--canvas);min-height:100vh}
.player-page .page-glow{display:none}
.brand-flower{display:block;flex-shrink:0}
.player-page .site-header{max-width:960px;padding:24px;border-bottom:0}
.player-page .brand{font-size:20px;letter-spacing:.03em;gap:10px}
.player-page.is-lobby .site-header{display:none}
.player-page.is-lobby .main-shell{max-width:none;min-height:100vh;min-height:100svh;display:grid;place-items:center;padding:32px 20px}
.player-page.is-lobby .loading-card{margin:0 auto}
.login-card{width:100%;max-width:420px;padding:40px 36px 32px;border:1px solid #efcfdd;border-radius:28px;background:var(--white);box-shadow:0 20px 70px #a84f7310}
.login-flower{display:block;margin:0 auto 18px}
.login-card h1{text-align:center;font-size:32px;line-height:1.4;letter-spacing:.03em;margin:0 0 32px;font-weight:700}
.login-card label{display:block;font-size:14px;font-weight:600;margin-bottom:9px}
.login-card .input-row{min-height:52px;padding:0 16px;border-radius:13px;background:#fff9fc}
.login-card .input-row input{font-size:16px;padding:12px 0}
.login-card .input-row:focus-within{border-color:#bd6086;box-shadow:0 0 0 3px #fbe3ed}
.login-card .primary-btn{width:100%;min-height:50px;justify-content:center;font-size:16px;border-radius:13px;letter-spacing:.08em;margin-top:18px}
.login-card .login-note{text-align:center;font-size:12px;color:var(--muted);margin:16px 0 0}
.waiting-shell{max-width:440px;padding:38px 32px}
.waiting-flower{display:block;margin:0 auto 20px}
.waiting-shell h1{font-size:28px;margin:12px 0 16px;line-height:1.4}
.waiting-shell .waiting-live{margin-top:28px}
.waiting-shell .waiting-note{margin:14px 0 0;line-height:1.8}
@media(max-width:480px){.player-page.is-lobby .main-shell{padding:24px 18px}.login-card{padding:32px 26px 26px;border-radius:24px}.login-card h1{font-size:29px;margin-bottom:28px}.login-flower{width:50px;height:50px}.waiting-shell{padding:30px 22px}.waiting-shell h1{font-size:25px}.brand-flower{width:31px;height:31px}}

/* Keep the question, choices and clock together during play. */
.player-page.is-quiz .site-header{display:none}
.player-page.is-quiz .main-shell{min-height:100vh;min-height:100svh;padding:32px 20px 40px}
.player-page.is-quiz .quiz-timer{display:flex;align-items:center;gap:10px}
.player-page.is-quiz .quiz-timer small{font-size:11px}
.player-page.is-quiz .quiz-timer strong{font-family:inherit;font-size:27px;font-weight:650;line-height:1.2;min-width:65px}
.player-page.is-quiz .question-chip{font-size:11px;letter-spacing:0;background:none;padding:0;color:var(--muted);font-weight:500}
.player-page.is-quiz .question-bottom{justify-content:flex-end;border-top:0;padding-top:0;margin-top:24px}
@media(max-width:700px){.player-page.is-quiz .main-shell{padding:18px 14px 28px}.player-page.is-quiz .question-card{padding:20px 18px}.player-page.is-quiz .quiz-timer strong{font-size:24px;min-width:59px}.player-page.is-quiz .quiz-timer small{font-size:10px}.player-page.is-quiz .question-stem{margin:21px 0 24px}.player-page.is-quiz .question-submit{min-height:48px;justify-content:center;gap:18px}}

.player-page.is-results-waiting .site-header{display:none}
.player-page.is-results-waiting .main-shell{min-height:100vh;min-height:100svh;display:grid;place-items:center;padding:28px 20px}
.results-waiting-shell{width:100%;max-width:420px;text-align:center;padding:38px 28px;background:var(--white);border:1px solid var(--line);border-radius:26px;box-shadow:var(--shadow)}
.finished-mark{display:grid;place-items:center;width:56px;height:56px;margin:0 auto 20px;border-radius:50%;background:var(--blush);color:var(--rose);font-size:26px}
.results-waiting-shell h1{font-size:25px;margin:0 0 10px}
.results-waiting-shell p{font-size:13px;color:var(--muted);margin:0 0 27px}
.results-waiting-clock{display:flex;flex-direction:column;gap:5px}
.results-waiting-clock small{font-size:11px;color:var(--muted)}
.results-waiting-clock strong{font-size:38px;line-height:1.3;font-weight:650;font-variant-numeric:tabular-nums;color:var(--rose)}

/* The host's main view is a shared scene of live player bubbles. */
.host-page{background:var(--canvas)}
.host-page .header-right{display:flex}
.host-page.host-dashboard .site-header{max-width:1280px;padding:23px 32px;border-bottom:0}
.host-page.host-dashboard .header-right>span{display:none}
.host-page.host-dashboard .main-shell{max-width:1280px;min-height:0;padding:10px 32px 30px}
.host-arena [hidden]{display:none!important}
.arena-heading,.arena-title,.arena-tools{display:flex;align-items:center;gap:14px}
.arena-heading{justify-content:space-between;margin:0 2px 19px;flex-wrap:wrap}
.arena-title h1{font-size:25px;font-weight:700;margin:0;letter-spacing:.03em}
.arena-title .phase-pill{font-size:11px}
.arena-tools{gap:17px}
.arena-tools .secondary-btn{font-size:12px;padding:9px 14px;background:var(--white)}
.arena-player-count{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted);white-space:nowrap}
.arena-player-count strong{color:var(--ink);font-size:16px;font-weight:700}
.player-stage{position:relative;display:grid;place-items:center;min-height:clamp(380px,55vh,640px);padding:28px 24px;border:1px solid #edd3df;border-radius:30px;background:radial-gradient(ellipse at 18% 12%,#fbe4ef,transparent 52%),radial-gradient(ellipse at 86% 95%,#fff4dd80,transparent 48%),#fffafd;overflow:hidden;box-shadow:0 14px 45px #a8537010}
.player-stage:before,.player-stage:after{content:"";position:absolute;border:2px solid #ffffffc0;border-radius:50%;pointer-events:none}
.player-stage:before{width:340px;height:340px;left:-140px;top:-220px}
.player-stage:after{width:290px;height:290px;right:-120px;bottom:-190px;border-color:#efdce580}
.bubble-cloud{--bubble-size:150px;position:relative;z-index:1;width:100%;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:24px 26px}
.bubble-slot{padding:12px 0;animation:bubble-appear .4s ease-out both}
.bubble-slot:nth-child(3n+2){padding-top:44px}
.bubble-slot:nth-child(4n+3){padding-bottom:36px}
.player-bubble{--bubble-tint:#f6dce8;--bubble-ink:#9b4a70;position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:var(--bubble-size);height:var(--bubble-size);padding:14px;border-radius:50%;border:2px solid #ffffffdc;background:radial-gradient(circle at 30% 22%,#fffffff2 0%,#ffffff75 24%,var(--bubble-tint) 76%);color:var(--bubble-ink);box-shadow:inset 0 -6px 16px #ffffff80,0 10px 24px #795c7012;animation:bubble-float 5.5s ease-in-out infinite;overflow:hidden;text-align:center}
.player-bubble:before{content:"";position:absolute;left:18%;top:15%;width:29%;height:10%;border-radius:50%;background:#ffffffa0;transform:rotate(-32deg);pointer-events:none}
.player-bubble:after{content:"";position:absolute;inset:6px;border:1px solid #ffffff66;border-radius:50%;pointer-events:none}
.bubble-slot:nth-child(3n+2) .player-bubble{width:calc(var(--bubble-size)*.94);height:calc(var(--bubble-size)*.94);animation-duration:6.3s;animation-delay:-2s}
.bubble-slot:nth-child(4n+3) .player-bubble{animation-duration:5s;animation-delay:-3s}
.bubble-name,.bubble-score,.bubble-status{position:relative;z-index:1;max-width:100%}
.bubble-name{font-size:clamp(11px,calc(var(--bubble-size)*.10),15px);line-height:1.45;font-weight:700;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bubble-score{font-size:clamp(18px,calc(var(--bubble-size)*.17),26px);line-height:1.1;font-weight:700;font-variant-numeric:tabular-nums}
.bubble-status{font-size:clamp(9px,calc(var(--bubble-size)*.075),11px);line-height:1.3;white-space:nowrap}
.player-bubble.is-completed{border-color:#ffffff;box-shadow:inset 0 -6px 16px #ffffff80,0 8px 28px #a85d7c20}
.bubble-pink{--bubble-tint:#f6dce8;--bubble-ink:#9b4a70}
.bubble-sky{--bubble-tint:#def1fb;--bubble-ink:#316682}
.bubble-lavender{--bubble-tint:#e8e1ff;--bubble-ink:#60518f}
.bubble-peach{--bubble-tint:#ffe7db;--bubble-ink:#915333}
.bubble-mint{--bubble-tint:#def3e7;--bubble-ink:#377558}
.bubble-lemon{--bubble-tint:#fbf2cc;--bubble-ink:#876521}
.bubble-coral{--bubble-tint:#ffe1e5;--bubble-ink:#a74353}
.bubble-blue{--bubble-tint:#e2eaff;--bubble-ink:#4e65a0}
.bubble-orchid{--bubble-tint:#f8def0;--bubble-ink:#8b4b77}
.bubble-lime{--bubble-tint:#edf4d7;--bubble-ink:#63702e}
.stage-empty{position:absolute;inset:26px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;pointer-events:none}
.stage-empty img{margin-bottom:20px;opacity:.8}
.stage-empty h2{font-size:23px;font-weight:650;color:#8c697a;margin:0 0 8px}
.stage-empty p{font-size:13px;color:var(--muted);margin:0}
.arena-controls{display:flex;align-items:center;justify-content:center;gap:25px;margin:23px 0 0;flex-wrap:wrap}
.arena-clock{display:flex;align-items:center;gap:11px}
.arena-clock small{font-size:12px;color:var(--muted)}
.arena-clock strong{font-size:29px;font-weight:600;line-height:1.25;font-variant-numeric:tabular-nums;min-width:72px}
.arena-controls .primary-btn{min-width:200px;min-height:48px;justify-content:center;gap:24px;font-size:15px}
.arena-controls .primary-btn:disabled{color:#7d5265;background:#f2d7e2;border-color:#f2d7e2}
.arena-controls .secondary-btn{min-height:46px;font-size:13px;background:var(--white)}
.arena-help{text-align:center;font-size:12px;color:var(--muted);margin:13px 0 22px}
.arena-settings{border-top:1px solid var(--line);max-width:760px;margin:0 auto}
.arena-settings>summary{cursor:pointer;display:flex;justify-content:center;align-items:center;gap:8px;padding:15px;font-size:12px;color:var(--muted);list-style:none}
.arena-settings>summary::-webkit-details-marker{display:none}
.arena-settings[open]>summary>span{transform:rotate(180deg)}
.arena-settings-body{padding:12px 24px 24px;border:1px solid var(--line);border-radius:18px;background:var(--white)}
.arena-room-select{display:flex;align-items:center;gap:15px;font-size:12px;font-weight:600}
.arena-room-select select{flex:1;min-width:0;font:inherit;color:var(--ink);border:1px solid var(--line);background:#fff9fc;border-radius:9px;padding:11px}
.arena-counts{display:flex;gap:17px;align-items:center;flex-wrap:wrap;font-size:11px;color:var(--muted);padding:16px 0 20px}
.arena-counts a{margin-left:auto;color:var(--rose)}
.arena-create-form{border-top:1px solid var(--line);padding-top:18px}
.arena-create-form>label{display:block;font-size:13px;font-weight:650;margin-bottom:10px}
.arena-create-form>div{display:flex;gap:12px}
.arena-create-form input{flex:1;min-width:0;font:inherit;font-size:14px;color:var(--ink);border:1px solid var(--line);border-radius:10px;background:#fff9fc;padding:11px 13px}
.arena-create-form .secondary-btn{font-size:12px;white-space:nowrap}
@keyframes bubble-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes bubble-appear{from{opacity:0;transform:scale(.84)}to{opacity:1;transform:scale(1)}}
.player-stage.is-awards{background:radial-gradient(ellipse at 50% 0,#ffe9dbaa,transparent 60%),radial-gradient(ellipse at 16% 82%,#f8e0ef,transparent 50%),#fffafd}
.host-awards{position:relative;z-index:1;width:100%;max-width:820px;padding:15px 10px 0;animation:host-awards-appear .5s ease-out both}
.host-awards-heading{text-align:center}
.host-awards-heading img{display:block;margin:0 auto 7px}
.host-awards-heading p{margin:0;color:var(--muted);font-size:13px;letter-spacing:.08em}
.host-podium{max-width:760px;gap:25px;margin-top:25px}
.host-podium .podium-rank{display:block;font-size:12px;color:var(--muted);font-weight:600;margin-bottom:10px}
.host-podium .podium-avatar{width:58px;height:58px;font-size:26px;background:#f2e5fc;margin-bottom:10px}
.host-podium .place-1 .podium-avatar{width:74px;height:74px;font-size:33px;background:#ffe9c9;color:#9b641b;border-color:#f1ca86}
.host-podium .place-3 .podium-avatar{background:#ffe7df;color:#a16546}
.host-podium .podium-place>strong{font-size:19px;line-height:1.45;padding:0 5px}
.host-podium .podium-score{display:block;font-size:21px;font-weight:700;margin-top:5px;color:var(--rose)}
.host-podium .podium-base{height:130px;margin-top:17px;padding:10px 12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;background:linear-gradient(#ece4f8,#e4daf0);border:1px solid #fff8;border-bottom:0;box-shadow:0 -7px 20px #fff5,inset 0 2px 0 #fff9}
.host-podium .place-1 .podium-base{height:182px;background:linear-gradient(#ffe8c5,#f5d5a7)}
.host-podium .place-3 .podium-base{height:100px;background:linear-gradient(#f9e1d7,#edcec0)}
.host-podium .podium-base>span{font-size:36px;line-height:1}
.host-podium .podium-base>b{font-size:31px;line-height:1}
.host-podium .podium-vacant{opacity:.5}
.host-podium .podium-vacant .podium-score{font-size:12px;font-weight:400;color:var(--muted)}
.host-awards-empty{text-align:center;padding:55px 15px}
.host-awards-empty img{display:block;margin:0 auto 20px}
.host-awards-empty h2{font-size:23px;margin:0 0 8px}
.host-awards-empty p{font-size:13px;color:var(--muted);margin:0}
@keyframes host-awards-appear{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:700px){.host-awards{padding:8px 0 0}.host-awards-heading img{width:52px;height:52px}.host-awards-heading p{font-size:11px}.host-podium{gap:8px;margin-top:23px}.host-podium .podium-rank{font-size:10px;margin-bottom:8px}.host-podium .podium-avatar{width:40px;height:40px;font-size:19px}.host-podium .place-1 .podium-avatar{width:50px;height:50px;font-size:24px}.host-podium .podium-place>strong{font-size:12px;padding:0 1px}.host-podium .podium-score{font-size:17px}.host-podium .podium-base{height:95px;margin-top:13px;padding:9px 5px;gap:6px}.host-podium .place-1 .podium-base{height:130px}.host-podium .place-3 .podium-base{height:75px}.host-podium .podium-base>span{font-size:25px}.host-podium .podium-base>b{font-size:22px}.host-podium .podium-vacant .podium-score{font-size:10px}}
@media(max-width:700px){.host-page.host-dashboard .site-header{padding:18px}.host-page.host-dashboard .main-shell{padding:7px 16px 22px}.arena-heading{gap:13px;margin-bottom:16px}.arena-title h1{font-size:22px}.arena-tools{gap:13px;width:100%;justify-content:space-between}.arena-tools .secondary-btn{font-size:11px;padding:8px 12px}.player-stage{min-height:390px;padding:22px 16px;border-radius:23px}.bubble-cloud{gap:15px 18px}.bubble-slot{padding:8px 0}.bubble-slot:nth-child(3n+2){padding-top:27px}.bubble-slot:nth-child(4n+3){padding-bottom:23px}.player-bubble{padding:10px;gap:5px}.stage-empty h2{font-size:21px}.stage-empty p{font-size:12px}.arena-controls{gap:14px;margin-top:20px}.arena-controls .primary-btn{min-width:158px;font-size:14px}.arena-clock{gap:8px}.arena-clock strong{font-size:26px;min-width:64px}.arena-clock small{font-size:10px}.arena-help{font-size:11px}.arena-settings-body{padding:16px}.arena-room-select{display:block}.arena-room-select select{display:block;width:100%;margin-top:9px;font-size:13px}.arena-counts{gap:14px}.arena-counts a{margin-left:0;width:100%}.arena-create-form>div{flex-direction:column}.arena-create-form input{font-size:16px}.arena-create-form .secondary-btn{min-height:44px}.arena-controls .secondary-btn{font-size:12px}}
