.play-body{background:#f9f5ec}.play-nav{display:flex;align-items:center;justify-content:space-between;max-width:1200px;margin:auto;padding:20px 24px;gap:16px;font-size:13px}.play-nav span{letter-spacing:2px;font-size:10px}.play-body button{border:1.5px solid var(--ink);border-radius:14px;background:var(--paper);padding:12px 18px;font-weight:700;min-height:44px}.play-body button:disabled{opacity:.4;cursor:default}.play-body main{max-width:1200px;margin:auto;padding:24px}.demo-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}.demo-heading h1{font-size:clamp(30px,5vw,56px);letter-spacing:-2px;margin:8px 0 24px}.mode-buttons{display:flex;gap:8px;flex-wrap:wrap}.play-body .selected,.play-body .primary{background:var(--ink);color:var(--paper)}.app-frame{background:var(--orange);border:2px solid var(--ink);border-radius:30px;box-shadow:0 8px 0 var(--ink);padding:28px;margin-top:20px;min-height:490px}.app-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}.app-header b{font-family:Barlow,sans-serif;font-size:28px;line-height:.9;transform:rotate(-4deg)}.app-header span{font-size:12px;background:#2c174e15;border-radius:30px;padding:8px 14px}.screen-title{font:800 clamp(30px,5vw,48px)/1 Barlow;margin:12px 0 20px;text-transform:uppercase}.category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.play-body .category{border:2px solid var(--ink);box-shadow:0 5px var(--ink);text-align:left;padding:20px;min-height:190px;background:var(--paper);display:flex;flex-direction:column;justify-content:space-between}.category:nth-child(2n){background:var(--lime)}.category strong{font:800 30px/1 Barlow;text-transform:uppercase}.category small{font-size:11px;letter-spacing:1px}.category .emoji{font-size:32px}.setup{display:grid;grid-template-columns:1fr 1fr;gap:40px}.setup p{max-width:440px}.fields label{display:block;margin-bottom:16px;font-size:13px}.fields input,.fields select{display:block;width:100%;padding:14px;margin-top:6px;background:var(--paper);border:1px solid var(--ink);border-radius:12px;font:inherit;color:var(--ink)}.ready{text-align:center;padding:20px}.ready h2{font:800 60px Barlow;margin:12px}.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}.play-body .correct{background:var(--lime);flex:2}.play-body .pass{flex:1}.question-top{display:flex;justify-content:space-between;align-items:center;gap:16px}.clock{font:800 48px Barlow}.question-card{background:var(--paper);padding:30px;border-radius:20px;min-height:160px;display:flex;align-items:center;justify-content:center;font-size:clamp(22px,3vw,36px);font-weight:700;text-align:center}.question-card.flag{font-size:90px}.answer-box{margin-top:16px;padding:16px 20px;border:1px dashed var(--ink);border-radius:14px;display:flex;gap:20px;justify-content:space-between;align-items:center}.answer-box small{font-size:10px;letter-spacing:1px}.answer-box strong{font-size:22px}.score-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.score-card{background:var(--paper);border:2px solid var(--ink);border-radius:22px;text-align:center;padding:28px}.score-card strong{font:800 80px Barlow;display:block}.avatar{display:grid;place-items:center;background:var(--lime);width:70px;height:70px;border-radius:20px;font:800 38px Barlow;margin:auto}.review-list{max-height:250px;overflow:auto;padding:0;list-style:none}.review-list li{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid #2c174e35}.review-list small{display:block;margin-top:4px}.demo-note{font-size:13px;max-width:800px;line-height:1.6;margin:26px auto;text-align:center}#tourControls{background:var(--ink);color:var(--paper);padding:24px;border-radius:22px;display:grid;grid-template-columns:1fr auto;gap:12px}#tourControls[hidden]{display:none}#tourControls h2{margin:8px 0;font-size:23px}#tourControls p{margin:0;max-width:720px;line-height:1.5}#tourCount{font-size:11px;letter-spacing:2px}.tour-buttons{display:flex;gap:8px;align-items:center}#tourDots{display:flex;gap:8px;grid-column:1/-1}#tourDots button{padding:0;width:28px;min-height:5px;height:5px;border:0;border-radius:5px;opacity:.4}#tourDots .active{opacity:1;background:var(--orange)}.demo-entry{background:var(--lime)}.demo-entry p{max-width:700px;line-height:1.6}.demo-link{margin-top:10px}.play-body button:focus-visible{outline:3px solid #3445ed;outline-offset:3px}@media(max-width:700px){.play-nav span{display:none}.play-body main{padding:14px}.demo-heading{display:block}.demo-heading h1{margin-bottom:16px}.app-frame{padding:18px;border-radius:22px}.category-grid{grid-template-columns:1fr 1fr;gap:12px}.play-body .category{padding:14px;min-height:160px}.category strong{font-size:26px}.setup{grid-template-columns:1fr;gap:10px}.question-card{padding:22px;min-height:170px}.answer-box{align-items:start;flex-direction:column;gap:8px}.score-card{padding:20px 10px}.score-card strong{font-size:60px}#tourControls{grid-template-columns:1fr;margin-top:18px}.tour-buttons{justify-content:space-between}.app-header{margin-bottom:22px}.demo-heading .eyebrow{font-size:10px}}
#tourControls .tour-buttons button{color:var(--ink)}#tourControls h2{letter-spacing:-.5px;line-height:1.2}.app-frame button:disabled{opacity:1;cursor:default}
