*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:#eef3ea;color:#263e33;font-family:system-ui,'Malgun Gothic',sans-serif}main{max-width:880px;margin:auto;padding:clamp(16px,4vw,32px)}.menu,.race{background:#fffdf7;border-radius:24px;padding:clamp(20px,4vw,32px);box-shadow:0 8px 30px #30443718}.eyebrow{font-size:14px;font-weight:800;color:#356b59}h1{font-size:clamp(27px,5vw,38px);margin:5px 0 12px}p{line-height:1.6;margin:8px 0}.lead{font-size:20px;font-weight:700}.note{color:#475e53;font-size:15px}.menu a{display:inline-flex;min-height:44px;align-items:center;color:#235b91;font-weight:700}.intro{display:flex;align-items:center;gap:20px}.intro-art{width:min(200px,30%);flex:none}.settings{display:flex;flex-wrap:wrap;gap:14px;margin:18px 0}.settings label{display:grid;gap:5px;font-weight:700}.settings select{font:inherit;min-height:50px;border:1px solid #799d8d;border-radius:10px;background:#fff;padding:8px 12px;color:#243c33}button,summary{font:inherit;cursor:pointer;color:#183e34;touch-action:manipulation}button:focus-visible,select:focus-visible,a:focus-visible,summary:focus-visible,[tabindex="0"]:focus-visible{outline:4px solid #125ab3;outline-offset:3px}button:disabled{cursor:default;opacity:.8}summary{min-height:48px;padding:10px;font-weight:800}details{border:1px solid #c6d8c5;border-radius:10px;padding:0 12px;margin-top:14px}.controls,.tokens{display:flex;flex-wrap:wrap;gap:9px;margin-top:18px}.controls button,#start,.tokens button{min-width:44px;min-height:50px;border:1px solid #84a798;border-radius:12px;background:#fff;padding:10px 16px;font-weight:700}#start,#roll,#computer{background:#286650;color:white}#pause[aria-pressed="true"]{background:#d5ebd7;border:3px solid #286650}.turn{font-size:19px;font-weight:800;margin:18px 0 8px}.track{width:min(100%,460px);margin:8px auto;background:#f2f5e8;border:2px solid #c2d4bd;border-radius:22px;padding:8px}.track svg{display:block;width:100%}.track-line{fill:none;stroke:#90a993;stroke-width:4;stroke-dasharray:6 5}.track-cell{fill:#fffdf7;stroke:#537965;stroke-width:3}.track-number{text-anchor:middle;font-size:14px;font-weight:800;fill:#1d4034}.marker-one{fill:#a34f3c;stroke:#fff;stroke-width:1}.marker-two{fill:#286650;stroke:#fff;stroke-width:1}.marker-number{text-anchor:middle;font-size:9px;font-weight:800;fill:#fff}.summary{padding:10px 12px;background:#f2f7ef;border-radius:8px;font-size:15px;line-height:1.6}.throw-result{font-weight:800}.sticks{display:flex;flex-wrap:wrap;gap:7px}.sticks span{min-width:70px;padding:8px;border:2px solid #8aa18d;border-radius:20px;background:#f5eee0;text-align:center;font-size:14px;font-weight:700}.sticks [data-face="true"]{background:#dbead6;border-style:solid}.sticks [data-face="false"]{background:#f5eee0;border-style:dashed}.tokens button strong,.tokens button small{display:block}.tokens button small{font-size:13px}.result{background:#f8ebc5;border-left:5px solid #947026;padding:16px;font-weight:800;font-size:19px;border-radius:8px;margin-top:16px}.status{min-height:3em;font-weight:700;background:#e7f1e7;border-left:5px solid #397a5e;padding:10px 14px;border-radius:6px;margin-top:16px}@media(max-width:620px){.intro-art{width:100px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
dialog{width:min(90vw,32rem);max-width:90vw;border:2px solid #526f60;border-radius:12px;padding:20px;background:#fff;color:#1e3529}dialog::backdrop{background:rgb(20 35 27 / 55%)}dialog button{font:inherit;min-width:44px;min-height:48px;padding:10px 16px;margin:4px;border:2px solid #526f60;border-radius:10px;background:#fff;color:#1e3529}dialog button:focus-visible{outline:4px solid #125ab3;outline-offset:3px}