:root{color-scheme:light;--page:#f0eadc;--paper:#fbf7ed;--ink:#244638;--soft:#666155;--brass:#99763e;--line:#d5c6a8;--red:#a33b32}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top,#ded2b966,transparent 65%),var(--page);color:var(--ink);font:16px/1.5 Georgia,serif}main{max-width:760px;margin:auto;padding:20px 20px 35px}.back{color:var(--soft);font-size:14px}header{text-align:center;margin:20px 0 18px}.eyebrow{font:11px/1.4 system-ui,sans-serif;letter-spacing:.17em;color:var(--brass)}h1{font-weight:400;font-size:clamp(34px,8vw,48px);margin:4px 0}header p{margin:0;color:var(--soft)}button,select,textarea{font:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{cursor:default;opacity:.55}button:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:3px solid #b3813e;outline-offset:3px}.topbar,.hallhead{display:flex;align-items:center;justify-content:space-between;gap:12px}.topbar{border-top:1px solid var(--line);padding:8px 0}.topbar button,.hallhead button{background:none;border:0;color:var(--soft);font-size:14px;padding:7px;min-height:40px}.topbar button[aria-pressed=true]{font-weight:bold;color:var(--ink)}.settings{margin:6px 0 16px}.settings label{display:block;color:var(--soft);font-size:13px}.settings select{display:block;margin-top:4px;width:100%;background:var(--paper);border:1px solid var(--line);border-radius:4px;color:var(--ink);padding:10px 12px}.hall{background:var(--paper);border:1px solid var(--brass);border-radius:30px 30px 6px 6px;min-height:480px;padding:18px clamp(18px,5vw,35px) 30px;box-shadow:inset 0 0 0 4px var(--paper),inset 0 0 0 5px var(--line),0 16px 36px #15312712}.hallhead{color:var(--brass);font-size:13px}.stage{text-align:center;padding:18px 0 0}.stage h2{font-weight:400;font-size:clamp(26px,5vw,34px);line-height:1.2;margin:8px 0 10px}.stage p{color:var(--soft);margin:8px auto 16px;max-width:570px}.stage .challenge{text-align:left;max-width:520px;margin:14px auto;border-top:1px solid var(--line);padding:12px 0}.challenge strong{font-weight:600}.word-list{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:20px 0}.word-list span,.word-list button,.token{border:1px solid var(--brass);background:#f1e9d7;border-radius:30px;padding:8px 16px;color:var(--ink)}.word-list span,.word-list button{font-size:19px}.word-list button:disabled{opacity:.42}.token{display:inline-flex;align-items:center;justify-content:center;min-width:84px;min-height:84px;font-size:42px;margin:14px auto}.token.bell{font-size:50px}.constraint{border-left:3px solid var(--brass);padding:10px 14px;margin:12px auto;max-width:480px;text-align:left;background:#f4ecdb}.actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:18px 0 4px}.actions button,dialog button,.primary{background:var(--ink);color:var(--paper);border:1px solid var(--brass);border-radius:4px;padding:10px 20px;min-height:46px}.actions .secondary{background:transparent;color:var(--ink)}.composer{display:block;width:min(100%,520px);height:100px;margin:14px auto;padding:12px;background:#fffdf6;color:var(--ink);border:1px solid var(--line);border-radius:5px;resize:vertical;line-height:1.5}.hint,.feedback{font-size:14px}.feedback{min-height:22px}.feedback.error{color:var(--red)}.questioner{font-size:13px;text-transform:uppercase;letter-spacing:.12em;color:var(--brass)}.seatline{display:flex;justify-content:center;gap:7px;flex-wrap:wrap;margin:8px 0 18px}.seatline span{font-size:12px;color:var(--soft);border:1px solid var(--line);border-radius:20px;padding:4px 8px}.seatline .active{background:var(--ink);color:var(--paper);border-color:var(--ink)}.review{border-top:1px solid var(--line);margin:18px 0;padding:12px 0;text-align:left}.review h3{font-size:18px;font-weight:600;margin:0 0 8px}.review .pair{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}.review .pair>div{background:#f4eedf;border:1px solid var(--line);border-radius:4px;padding:9px 11px;min-width:0;overflow-wrap:anywhere;white-space:pre-wrap}.review small{display:block;color:var(--soft);font-size:12px;margin-bottom:4px}.review .right{color:var(--ink)}.review .wrong{color:var(--red)}.footer{text-align:center;color:var(--soft);font-size:12px;margin-top:20px}dialog{background:var(--paper);color:var(--ink);border:1px solid var(--brass);border-radius:12px;padding:24px;width:min(530px,92vw);max-height:85vh;overflow:auto}dialog::backdrop{background:#182b21af}dialog h2{font-weight:400;margin:4px 0 10px}dialog p{color:var(--soft);font-size:14px}[hidden]{display:none!important}@media(max-width:460px){main{padding:14px 15px 26px}.hall{padding:14px 17px 20px}.review .pair{grid-template-columns:1fr}.token{min-width:74px;min-height:74px;font-size:35px}}

.example{text-align:left;max-width:520px;margin:14px auto;color:var(--soft);font-size:14px}.example summary{cursor:pointer;min-height:36px;padding:6px 0}.example p{margin:8px 0}.match-status{font:12px/1.5 system-ui,sans-serif;color:var(--soft);margin:-3px 0 20px}.match-status.exact{color:var(--ink)}mark{color:inherit;padding:1px 2px;border-radius:2px}mark.missing{background:#f3dacc;text-decoration:underline dotted;text-underline-offset:3px}mark.added{background:#e0e7d0;text-decoration:underline;text-underline-offset:3px}.diff-key{font-size:12px}.letter-positions{display:flex;flex-wrap:wrap;gap:8px;font:13px/1.5 system-ui,sans-serif}.letter-positions span{padding:5px 9px;border:1px solid var(--line);border-radius:4px}.letter-positions .correct{background:#e0e7d0}.letter-positions .different{background:#f3dacc}

.story-card{background:#f4eedf;border:1px solid var(--line);border-radius:8px;padding:22px;margin:20px 0}.story-text{white-space:pre-wrap;overflow-wrap:anywhere;font-size:clamp(20px,4vw,26px);line-height:1.7}.story-text u{text-decoration-color:var(--brass);text-underline-offset:5px}.given-words{font-size:13px;color:var(--soft);margin:0 0 15px}.result-stats{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0}.result-stats span{background:#eee6d4;border-radius:5px;padding:8px 12px;font-size:14px}.full-review>summary{cursor:pointer;padding:14px 0;border-top:1px solid var(--line);font-size:18px}.whole-recall{height:210px}.share-image{display:block;width:100%;max-height:45vh;object-fit:contain;margin:16px 0;background:#eee6d4}.share-option{display:flex;align-items:center;gap:8px;font-size:14px}.share-option input{width:18px;height:18px}.share-caption{width:100%;height:105px;border:1px solid var(--line);background:#fffdf6;color:var(--ink);padding:10px;font:13px/1.5 system-ui,sans-serif;resize:vertical}#share-dialog{width:min(620px,94vw)}.review .pair>div{line-height:1.7}

.challenge-count{font:12px/1.5 system-ui,sans-serif;color:var(--soft);margin:6px 0 0}

.given-ending{padding-top:12px;border-top:1px solid var(--line);font-size:16px;color:var(--ink)}

.assembly-map{width:min(100%,560px);margin:16px auto 4px;padding:8px 12px 0;background:radial-gradient(ellipse at 50% 80%,#315146,#203d33 70%);border:1px solid #ac8950;border-radius:110px 110px 8px 8px;box-shadow:inset 0 0 0 3px #203d33,inset 0 0 0 4px #8a774f,0 9px 18px #17362919}
.assembly-map svg{display:block;width:100%;height:auto;overflow:visible}
.assembly-arc{fill:none;stroke:#b89b67;stroke-width:1;stroke-dasharray:3 8;opacity:.5}
.assembly-seat circle{fill:#203d33;stroke:#c9a76d;stroke-width:2;transition:fill .25s,stroke-width .25s}
.assembly-seat .assembly-ray{fill:none;stroke:#e0bc79;stroke-width:1.5;opacity:0;transition:opacity .25s}
.assembly-seat text{text-anchor:middle;paint-order:stroke;stroke:#203d33;stroke-width:1px}
.assembly-number{fill:#e8d7b5;font-size:17px;font-family:Georgia,serif}
.assembly-label{fill:#dbc092;font:14px/1.2 system-ui,sans-serif;letter-spacing:1px}
.assembly-you{fill:#f1d9a5;text-anchor:middle;font:17px Georgia,serif;letter-spacing:4px}
.assembly-seat.active circle{fill:#d6aa66;stroke:#f8e7c7;stroke-width:3;filter:drop-shadow(0 0 7px #e4bc78)}
.assembly-seat.active .assembly-number{fill:#19392e;stroke:none}
.assembly-seat.active .assembly-label{fill:#fff0ce;font-weight:700;stroke:none}
.assembly-seat.active .assembly-ray{opacity:.75}
@media(max-width:460px){.assembly-map{margin:10px auto 4px;padding:6px 4px 0}.assembly-label{font-size:17px;letter-spacing:.4px}.assembly-you{font-size:19px}}
@media(prefers-reduced-motion:reduce){.assembly-seat circle,.assembly-seat .assembly-ray{transition:none}}

/* During play, the questioner and their challenge share one assembly stage. */
.hall[data-phase="active"]{position:relative;min-height:530px;background:radial-gradient(ellipse at 50% 42%,#294438,#1b3028 78%);color:#f5ead2;border-color:#d0ac6c;box-shadow:inset 0 0 0 5px #1b3028,inset 0 0 0 6px #816e48,0 16px 36px #1531271d}
.hall[data-phase="active"]:before,.hall[data-phase="active"]:after{position:absolute;top:42px;color:#dfbd7c;font-size:29px;content:"✧"}
.hall[data-phase="active"]:before{left:29px}.hall[data-phase="active"]:after{right:29px}
.hall[data-phase="active"] .hallhead,.hall[data-phase="active"] .hallhead button{color:#dfc18c}
.hall[data-phase="active"] .assembly-map{width:min(100%,610px);margin:8px auto 0;padding:0 10px;background:transparent;border:0;border-radius:0;box-shadow:none}
.hall[data-phase="active"] #stage{text-align:center;padding:7px 0 13px}
.hall[data-phase="active"] #stage .questioner,.hall[data-phase="active"] #stage .eyebrow{color:#ddbd83}
.hall[data-phase="active"] #stage h2{font-weight:400;font-size:clamp(30px,6vw,43px);line-height:1.2;color:#e8bd79;margin:9px auto 14px}
.hall[data-phase="active"] #stage p{max-width:570px;margin:12px auto 18px;color:#e5d7ba}
.hall[data-phase="active"] #stage .token{display:block;min-width:0;min-height:0;width:max-content;margin:12px auto 18px;padding:0;background:none;border:0;border-radius:0;color:#e8bd79;font-size:clamp(80px,18vw,126px);line-height:1.05}
.hall[data-phase="active"] #stage .token.bell{font-size:76px}
.hall[data-phase="active"] #stage .word-list{margin:16px auto}
.hall[data-phase="active"] #stage .word-list span,.hall[data-phase="active"] #stage .word-list button{background:#2b4639;border-color:#b89b68;color:#f4e5c4}
.hall[data-phase="active"] #stage .word-list button:disabled{background:#d4ad71;color:#193429;opacity:1}
.hall[data-phase="active"] #stage .constraint{background:#294438;border:1px solid #987c52;border-left-width:3px;color:#f3dfb8;text-align:center}
.hall[data-phase="active"] #stage .composer{background:#fbf7eb;border:2px solid #c6a56d;color:#203a2f;text-align:left}
.hall[data-phase="active"] #stage .feedback.error{color:#ffbdad}
.hall[data-phase="active"] #stage .actions button{background:#d7b57b;color:#193429;border:1px solid #f4d69d;font-weight:600}
.hall[data-phase="active"] #stage .actions .secondary{background:transparent;color:#f3dbb0}
.hall[data-phase="active"] #stage .actions button:disabled{opacity:.48}
@media(max-width:460px){.hall[data-phase="active"]{min-height:510px}.hall[data-phase="active"]:before,.hall[data-phase="active"]:after{top:38px;font-size:20px}.hall[data-phase="active"]:before{left:18px}.hall[data-phase="active"]:after{right:18px}.hall[data-phase="active"] .assembly-map{padding:0}.hall[data-phase="active"] #stage{padding-top:3px}}
.creator-dialog{width:min(620px,94vw)}.creator-dialog form label,.creator-dialog #creator-link-wrap>label{display:block;margin:12px 0;font-size:14px;color:var(--soft)}.creator-dialog input,.creator-dialog select{display:block;width:100%;min-height:44px;margin-top:5px;padding:9px 12px;border:1px solid var(--line);border-radius:5px;background:#fffdf6;color:var(--ink)}.creator-words{display:grid;grid-template-columns:repeat(2,1fr);gap:0 10px}.creator-dialog #creator-link-wrap{margin:18px 0;padding-top:12px;border-top:1px solid var(--line)}.creator-dialog #creator-close{margin-top:12px}.creator-dialog #creator-status{min-height:20px}
@media(max-width:460px){.creator-words{grid-template-columns:1fr}.topbar{flex-wrap:wrap}.topbar #create-challenge{margin-right:auto}}
