:root{font-family:Nunito,system-ui,"Noto Sans",sans-serif;font-size:16px;color:#222a28;background:#eadcc4;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button{font:800 1rem/1.35 Nunito,system-ui,"Noto Sans",sans-serif;color:inherit;background:#fff8e7;border:2px solid #263e4a;border-radius:10px;min-height:44px;padding:.65rem .45rem;cursor:pointer;white-space:normal;overflow-wrap:anywhere;word-break:normal;hyphens:auto;box-shadow:0 3px 0 #c4b18e;flex:1 1 max(140px,7.5em);max-width:100%}button:hover:not(:disabled){background:#f1e6c5}button:focus-visible{outline:3px solid #245b7a;outline-offset:3px}button:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px 0 #c4b18e}button:disabled{opacity:.52;cursor:default}.primary{background:#e3e9d5;border-color:#4c7748}.selected{outline:3px solid #a44932;outline-offset:1px}.warning{background:#fff0d2;border-left:5px solid #a64b36;padding:.75rem;font-weight:800;color:#743120}#app{max-width:1120px;margin:auto;padding:clamp(12px,3vw,28px);background:#fbefd9;min-height:100vh}header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;flex-wrap:wrap;border-bottom:3px double #9b7755;padding-bottom:14px}header>div{flex:1 1 300px;min-width:0}h1{font-size:clamp(1.5rem,4.5vw,2.2rem);line-height:1.15;margin:.3rem 0 .5rem;font-weight:1000}h2{font-size:1.35rem;line-height:1.3;margin:.5rem 0 1rem}h3{font-size:1.12rem;line-height:1.35}p,li,figcaption{line-height:1.5;overflow-wrap:anywhere}p{margin:.6rem 0}nav{display:flex;flex-wrap:wrap;gap:8px;max-width:100%;flex:0 1 360px}nav button{font-size:.9rem;flex-basis:110px}#stats{font-weight:900;color:#246b6d}#notice:empty,#audio-note:empty{display:none}#notice{font-weight:800;padding:.6rem;border-left:4px solid #a44932;background:#f8dfb8}#board{margin:16px 0}#host-strip{display:grid;grid-template-columns:112px minmax(0,1fr) 80px;align-items:center;gap:12px;max-width:840px;margin:0 auto 1rem;border-bottom:2px solid #bb9e72;padding-bottom:12px}#host-canvas{width:112px;height:140px;display:block}#host-name{font-weight:1000;color:#246b6d}#host-role{font-size:.9rem}#gag{font-size:.95rem;font-style:italic}.die-block{max-width:100%;text-align:center;font-weight:900}#die-canvas{display:block;width:72px;height:72px;margin:auto;max-width:100%}#die-label{font-size:.85rem;line-height:1.3}#race-line{font-weight:800}#rules-short{padding:.65rem;border:1px solid #ac9673;background:#f7e8c8;border-radius:8px;font-size:.9rem}#board-wrap{width:min(100%,640px);margin:1rem auto}#board-canvas{display:block;width:100%;aspect-ratio:1;height:auto;background:#fbefd9;border-radius:3px}#board-summary{display:flex;flex-wrap:wrap;gap:.4rem 1rem;font-size:.9rem;margin-top:.65rem}#board-summary span{flex:1 1 210px;min-width:0}#pending{font-size:1.1rem;font-weight:1000;color:#246b6d}#selection{font-weight:800}#choices-label{font-size:.9rem}#decisions,#actions{display:flex;flex-wrap:wrap;gap:10px;margin:1rem 0}.last-event{padding:.7rem;border-top:2px solid #bb9e72}#panel{margin:1rem 0;padding:clamp(12px,2vw,22px);border:2px solid #9b7755;border-radius:14px;background:#fff6e0}#body{min-width:0}.hero{display:block;width:100%;max-height:360px;aspect-ratio:3/2;object-fit:contain;object-position:center;border:2px solid #694e37;border-radius:10px;margin:0 0 1rem}.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:14px;margin:1rem 0}.tile{border:1px solid #ac9673;border-radius:10px;padding:12px;background:#fbefd9;min-width:0}.tile h3{margin:.35rem 0}.tile button{display:block;width:100%;margin:.55rem 0}.tile img{display:block;width:100%;height:150px;object-fit:contain}.setting-group{margin:1.2rem 0;border-bottom:1px solid #bfa984;padding-bottom:1rem}.setting-buttons{display:flex;flex-wrap:wrap;gap:10px}.setting-buttons button{min-width:0}.lesson-board{display:block;max-width:100%;width:360px;aspect-ratio:1;margin:1rem auto;background:#fbefd9}.rule-list{padding-left:1.5rem}.rule-list li{margin:.8rem 0}footer{border-top:2px solid #bfa984;padding-top:1rem;margin-top:1.5rem;font-size:.9rem;color:#4d5c4e}section[hidden],[hidden]{display:none!important}[data-motion="off"] button:active{transform:none}@media(min-width:850px){#decisions button{flex-basis:max(160px,7.5em)}}@media(max-width:440px){#host-strip{grid-template-columns:86px minmax(0,1fr);gap:8px}#host-canvas{width:86px;height:108px}.die-block{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:12px}#die-canvas{width:56px;height:56px;margin:0}#die-label{font-size:.9rem}nav{flex-basis:100%}nav button{flex-basis:100px}#host-role{font-size:.85rem}}

h1,h2,h3{overflow-wrap:anywhere;hyphens:auto}

#board figure{margin:1rem auto;max-width:840px}#table{display:block;width:100%;height:auto;aspect-ratio:9/4}#host-strip{grid-template-columns:112px minmax(0,1fr)}#host-name{font-weight:1000}#last{border-top:2px dashed #bb9e72;padding-top:.7rem}#summary{font-weight:800}#hand{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,max(96px,6.3em)),1fr));gap:10px;margin:1rem 0}#hand button{font-size:1.05rem;min-height:76px;background:#fffaf0;position:relative;box-shadow:3px 3px #d8bd97;padding:.6rem .35rem;border-radius:4px;overflow-wrap:normal;word-break:normal;hyphens:none;line-height:1.3}#hand button.red{color:#a13e31}#hand button.selected{background:#fff1b7;border-color:#9a392e;box-shadow:4px 4px #ba7958}#hand button[aria-pressed=true]::after{content:'✓';position:absolute;right:3px;top:1px;font-size:.8rem;color:#174b4d}#preview{padding:.8rem;background:#eee6c8;border-left:4px solid #246b6d;font-weight:800}#table-caption{font-size:.85rem}#hand-heading{margin-bottom:0}#nav{display:flex;flex-wrap:wrap;gap:8px}#body .hero{max-height:400px}.lesson-cards{display:flex;flex-wrap:wrap;gap:8px;margin:1rem 0}.lesson-card{display:inline-block;padding:.6rem .8rem;min-width:44px;background:#fffaf0;border:2px solid #263e4a;border-radius:4px;font-weight:900}.lesson-card.red{color:#a13e31}.setting-buttons{min-width:0}.setting-buttons button.selected{background:#fff1b7}@media(max-width:440px){#host-strip{grid-template-columns:86px minmax(0,1fr)}#host-canvas{width:86px;height:108px}}

/* CSS also honors live system motion preferences before the next animation frame. */
@media(prefers-reduced-motion:reduce){button:active:not(:disabled){transform:none}}