:root{--ink:#23374e;--muted:#657080;--gold:#ac8648;--line:rgba(64,76,91,.14);--glass:rgba(255,255,255,.75);--shadow:0 16px 60px rgba(47,57,68,.07);font-family:system-ui,-apple-system,"Segoe UI","Microsoft YaHei",sans-serif;color:var(--ink);background:#f7f5ef;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;min-height:100vh}.ambient{position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 4% 0%,#e4eaf0 0,transparent 48%),radial-gradient(ellipse at 96% 52%,#eee3cf 0,transparent 48%)}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button,.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.9);color:var(--ink);cursor:pointer;text-decoration:none;min-height:46px;transition:background .2s,transform .2s}button:hover,.button:hover{background:#f0e9db}button:active{transform:translateY(1px)}button:disabled{opacity:.5;cursor:not-allowed}.primary{background:var(--ink);color:white}.primary:hover{background:#354f69}.danger{color:#963f38}a{color:var(--ink)}:focus-visible{outline:3px solid #b28d4d;outline-offset:4px}input,textarea,select{width:100%;border:1px solid #bec6ce;border-radius:12px;padding:12px 14px;background:rgba(255,255,255,.85);color:var(--ink);min-height:48px}textarea{resize:vertical;min-height:146px;line-height:1.8}label{display:block;font-weight:600;margin:15px 0 7px}fieldset{border:0;padding:0;margin:18px 0}legend{font-weight:600;margin-bottom:10px}.masthead{max-width:1600px;margin:auto;padding:26px 5vw;display:flex;align-items:center;justify-content:space-between;gap:15px}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-size:21px;font-weight:650;letter-spacing:2px}.brand-mark{font-size:38px;color:var(--gold)}.brand small{display:block;font-size:11px;letter-spacing:2px;font-weight:400;margin-top:5px;color:var(--muted)}.pill{border:1px solid var(--line);background:var(--glass);border-radius:100px;padding:7px 13px;font-size:13px;white-space:nowrap}main{max-width:1440px;padding:20px 4vw 50px;margin:auto}.glass{background:var(--glass);border:1px solid rgba(255,255,255,.95);box-shadow:var(--shadow);backdrop-filter:blur(20px);border-radius:26px;padding:28px}.landing{max-width:600px;margin:5vh auto}.eyebrow{font-size:12px;font-weight:650;color:var(--gold);letter-spacing:3px;margin:0 0 14px}h1{font-size:clamp(28px,3.3vw,48px);line-height:1.3;letter-spacing:-1px;margin:0 0 16px}h2{font-size:23px;margin:0 0 14px}h3{margin:0 0 12px;font-size:19px}p{line-height:1.8}.muted,.hint{color:var(--muted);font-size:14px;line-height:1.7}.hint{margin:8px 0}.room-input{letter-spacing:10px;font-size:27px;text-align:center}.row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.spread{justify-content:space-between}.stack{display:grid;gap:20px}.hero{margin-bottom:24px}.hero .prompt{font-size:clamp(19px,2vw,28px);max-width:1000px;margin:10px 0}.hero-meta{margin-bottom:16px}.join-layout{max-width:740px;margin:auto}.privacy{padding:12px 16px;border-left:3px solid #c7a367;background:#f4f0e5;border-radius:0 10px 10px 0;font-size:14px;line-height:1.8}.choices{display:flex;gap:10px;flex-wrap:wrap}.choice{flex:1;min-width:120px}.choice[aria-pressed="true"]{border-color:var(--gold);background:#ede4d1;box-shadow:inset 0 0 0 1px var(--gold)}.count{text-align:right;font-size:13px;color:var(--muted)}.feedback{min-height:25px;font-size:14px;line-height:1.7;color:#46644c}.host-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(300px,.8fr);gap:22px}.control-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.qr-panel{text-align:center}.qr-panel img{display:block;width:190px;height:190px;max-width:100%;margin:18px auto;background:white;border-radius:14px;padding:8px}.join-link{overflow-wrap:anywhere;font-size:13px}.room-number{font-size:32px;letter-spacing:7px;margin:8px 0;color:var(--ink);font-variant-numeric:tabular-nums}.base-warning{color:#93522a}.wall{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:24px;align-items:start}.wall-column{min-width:0}.column-heading{display:flex;justify-content:space-between;align-items:center;padding:0 8px 15px;border-bottom:1px solid var(--line);margin-bottom:18px}.column-heading h2{margin:0}.cards{display:grid;gap:25px;padding:8px 0}.message-card{border:1px solid rgba(255,255,255,.95);border-radius:22px;background:rgba(255,255,255,.8);box-shadow:0 8px 25px rgba(50,61,73,.05);padding:23px;overflow-wrap:anywhere;white-space:pre-wrap;font-size:clamp(20px,1.8vw,29px);line-height:1.65;animation:float 7s ease-in-out infinite}.wall-column:nth-child(2) .message-card{background:rgba(251,247,236,.9)}.message-card:nth-child(2n){animation-delay:-3s}.message-card:nth-child(3n){animation-delay:-5s}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}.paused .message-card{animation-play-state:paused}.empty{padding:30px 18px;border:1px dashed #bfc6ce;border-radius:20px;color:var(--muted);line-height:1.8;text-align:center}.screen-top{display:grid;grid-template-columns:minmax(0,1fr) 225px;gap:28px}.screen-top .qr-panel{padding:16px}.screen-top .qr-panel img{width:142px;height:142px;margin:10px auto}.screen-top .room-number{font-size:24px}.results{display:grid;gap:18px;margin-top:20px}.result-label{display:flex;justify-content:space-between;gap:16px;margin-bottom:8px;font-size:19px}.track{height:17px;background:#e5e8e9;border-radius:20px;overflow:hidden}.bar{height:100%;border-radius:20px;background:linear-gradient(90deg,#71859a,#b59b70);transition:width .55s ease;min-width:0}.message-list{max-height:500px;overflow:auto}.moderation-item{border-bottom:1px solid var(--line);padding:18px 0}.moderation-item p{white-space:pre-wrap;overflow-wrap:anywhere;margin:8px 0}.moderation-item button{padding:6px 12px;min-height:38px;font-size:13px}details{margin-top:20px}summary{cursor:pointer;padding:10px 0;color:var(--muted)}footer{max-width:1440px;margin:auto;padding:18px 4vw 28px;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;color:var(--muted);font-size:12px}#connection[data-status="error"]{color:#984a3f}.notice{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);max-width:90vw;background:#23374e;color:white;border-radius:15px;padding:14px 23px;z-index:20;box-shadow:var(--shadow)}[hidden]{display:none!important}.full{width:100%}.section-space{margin-top:24px}.screen-mode main{max-width:1800px}.screen-mode .masthead{max-width:1800px}.screen-mode .prompt{font-size:clamp(24px,2.7vw,42px)}
@media(max-width:800px){.host-grid{grid-template-columns:1fr}.masthead{padding:20px 5vw}.glass{padding:22px}.screen-top{grid-template-columns:1fr 175px;gap:15px}.screen-top .qr-panel img{width:120px;height:120px}.wall{gap:16px}.message-card{padding:17px;font-size:20px}.brand small{letter-spacing:1px}}
@media(max-width:520px){main{padding-top:12px}.landing{margin:2vh auto}.screen-top{grid-template-columns:1fr}.screen-top .qr-panel{display:none}.wall{gap:12px}.column-heading{padding:0 0 12px}.column-heading h2{font-size:17px}.message-card{font-size:17px;padding:14px;border-radius:16px}.glass{border-radius:20px;padding:19px}.control-grid{grid-template-columns:1fr}.brand{font-size:18px}.pill{font-size:12px}.choice{min-width:100px}.hero{margin-bottom:18px}}
@media(max-width:520px){.screen-top .qr-panel{display:block}.screen-top .qr-panel img{width:140px;height:140px}.screen-top .qr-panel .row{justify-content:center}}
.side-choices{display:grid;grid-template-columns:1fr 1fr}.side-choices.single{grid-template-columns:1fr}.side-choices .choice{min-width:0;line-height:1.6}.screen-workspace{margin-top:24px;display:grid;gap:24px;align-items:start}.screen-workspace.with-results{grid-template-columns:minmax(260px,320px) minmax(0,1fr)}.screen-workspace .wall{margin-top:0}.wall.single-column{grid-template-columns:1fr}.screen-mode .cards{max-height:clamp(230px,calc(100dvh - 405px),640px);overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:8px 9px;align-content:start}.screen-workspace #screenResults{position:sticky;top:16px}.scroll-hint{font-size:12px}.screen-mode .screen-top .qr-panel{padding:12px}.screen-mode .screen-top .qr-panel .eyebrow{margin-bottom:5px}.screen-mode .screen-top .qr-panel h2{font-size:17px;margin-bottom:4px}.screen-mode .screen-top .qr-panel img{width:112px;height:112px;margin:5px auto}.screen-mode .screen-top .qr-panel .room-number{font-size:22px;margin:4px 0}.screen-mode .screen-top .qr-panel .row{margin-top:8px;gap:5px}.screen-mode .screen-top .qr-panel button{font-size:12px;padding:7px 9px;min-height:35px}.screen-mode .screen-top .qr-panel .join-link{font-size:11px}.screen-mode .masthead{padding-top:15px;padding-bottom:12px}.screen-mode main{padding-top:12px}.screen-mode .hero{margin-bottom:12px}.screen-mode .hero h1{font-size:clamp(26px,3vw,42px)}.screen-mode .prompt{font-size:clamp(21px,2.2vw,32px)}
@media(max-width:1000px){.screen-workspace.with-results{grid-template-columns:minmax(210px,260px) minmax(0,1fr)}.screen-workspace .message-card{font-size:18px}.screen-workspace .column-heading h2{font-size:18px}}
@media(max-width:760px){.screen-workspace.with-results{grid-template-columns:1fr}.screen-workspace #screenResults{position:static}.screen-mode .cards{max-height:420px}.screen-workspace .results{grid-template-columns:1fr 1fr}.screen-workspace .result-label{font-size:16px}.screen-workspace .wall{gap:12px}}
.teacher-link{display:block;text-align:center;margin-top:24px;font-size:14px;color:var(--muted)}.privacy-details{font-size:12px;margin-top:16px}.privacy-details summary{font-size:12px}.feedback:empty,.hint:empty{display:none}.join-layout .hero h1{font-size:clamp(24px,3vw,36px)}.join-layout .hero .prompt{font-size:18px;line-height:1.7}.join-layout textarea{min-height:105px}.join-layout .glass{padding-top:12px}.join-layout fieldset{margin:14px 0}.join-layout .feedback{min-height:0}.join-layout .count{margin:5px 0}.join-layout .section-space{margin-top:14px}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(prefers-reduced-transparency:reduce){.glass,.message-card,.pill{backdrop-filter:none;background:#fff}.ambient{display:none}}
