body{color:#1a1a1a;margin:0;padding:2rem;font-family:system-ui,sans-serif;line-height:1.6}main{max-width:40rem;margin:0 auto}a{color:#0b5fff}*,:before,:after{box-sizing:border-box}:root{--page:#f4f1ea;--ground:#e3ddd0;--trampled:#bdb29c;--wall:#4a3f34;--block:#3a6ea8;--runner:#cf3a1c;--drained:#a79f92;--grout:#8d8574;--ink:#23201c}body{background:var(--page);min-height:100vh;color:var(--ink);flex-direction:column;margin:0;padding:0;display:flex}main.page{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;max-width:none;padding:0 1rem 2rem;display:flex}.masthead{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:1rem;width:100%;padding:1rem 1.25rem 0;display:flex}.masthead__title h1{letter-spacing:.16em;text-transform:uppercase;margin:0;font-size:clamp(1.4rem,5vw,2rem)}.tagline{color:#746c5c;margin:.2rem 0 0;font-size:clamp(.8rem,2.6vw,.95rem)}.masthead nav{font-size:.8rem}.masthead nav a{color:#8a8375;text-decoration:none}.masthead nav a:hover,.masthead nav a:focus-visible{text-decoration:underline}.progress{justify-content:center;gap:.4rem;margin-bottom:.9rem;display:flex}.pip{background:#d6d0c2;border-radius:999px;width:.85rem;height:.3rem}.pip--done{background:#6f8f5a}.pip--now{background:var(--runner);width:1.7rem}.purse{border-left:1px solid #d6d0c2;align-items:center;gap:.3rem;margin-left:.7rem;padding-left:.7rem;display:inline-flex}.coin{background:var(--block);border-radius:3px;width:.62rem;height:.62rem;box-shadow:0 1px 2px #00000040}.coin--spent{background:0 0;box-shadow:inset 0 0 0 2px #d6d0c2}.stage{display:inline-block;position:relative}.board{--gap:3px;--cell:max(26px, min(calc((100vw - 3.5rem - (var(--cols,5) - 1) * var(--gap)) / var(--cols,5)), calc((100vh - 15rem) / var(--rows,7)), 88px));--frame:calc(var(--gap) * 2.5);grid-template-columns:repeat(var(--cols,5), var(--cell));gap:var(--gap);padding:var(--frame);background:var(--grout);touch-action:manipulation;user-select:none;border-radius:6px;display:grid}.cell{width:var(--cell);height:var(--cell);background:var(--ground);cursor:default;border-radius:3px;place-items:center;display:grid;position:relative}.board--setup .cell--open,.board--setup .cell--block{cursor:pointer}.cell:focus-visible{outline:3px solid var(--block);outline-offset:-3px}.cell--wall{background:var(--wall);cursor:default;border-radius:2px;box-shadow:inset 0 -3px #00000047}.cell--block:before{content:"";background:var(--block);border-radius:3px;position:absolute;inset:9%;box-shadow:inset 0 -3px #00000038,0 1px 4px #00000047}.cell--trail{background:var(--trampled);background-image:repeating-linear-gradient(45deg,#00000017 0 2px,#0000 2px 5px)}.cell--route:after{content:"";background:#00000038;border-radius:50%;width:22%;height:22%;position:absolute}.cell--exit{background:var(--page);box-shadow:0 var(--frame) 0 0 var(--page);cursor:default;border-radius:0}.cell--exit:before{content:"";border-right:3px solid var(--runner);border-bottom:3px solid var(--runner);opacity:.75;width:26%;height:26%;position:absolute;transform:translateY(-12%)rotate(45deg)}.cell--exit.cell--route:after{background:#cf3a1c59}.cell--runner{cursor:default}.cell--runner.cell--route:after{content:none}.meter{--vigour:1;--menace:0;inset:calc(6% + (1 - var(--vigour)) * 15%);background-color:var(--runner);background-color:color-mix(in oklab, var(--runner) calc(var(--vigour) * 100%), var(--drained));color:#fff;font-size:calc(var(--cell) * .34);pointer-events:none;background-image:radial-gradient(circle,#1a1a1a 60%,#0000 62%),radial-gradient(circle,#1a1a1a 60%,#0000 62%);background-position:32% 38%,68% 38%;background-repeat:no-repeat;background-size:14% 14%;border-radius:42% 58% 55% 45%/55% 45% 58% 42%;place-items:center;font-weight:700;line-height:1;transition:inset .18s ease-out,background-color .18s linear;display:grid;position:absolute;box-shadow:0 1px 3px #0000004d}.meter:before,.meter:after{content:"";top:calc(var(--cell) * -.06 - var(--menace) * var(--cell) * .03);width:calc(var(--cell) * .16 + var(--menace) * var(--cell) * .025);height:calc(var(--cell) * .22 + var(--menace) * var(--cell) * .03);background-color:inherit;clip-path:polygon(50% 0%,0% 100%,100% 100%);position:absolute}.meter:before{left:6%;transform:rotate(-12deg)}.meter:after{right:6%;transform:rotate(12deg)}.cell--spent .meter{background-color:var(--drained);color:#fffc;box-shadow:none}.cell--escaped .meter{box-shadow:0 0 0 3px var(--page), 0 0 0 6px var(--runner)}.cell--suggest{animation:2.2s ease-in-out infinite suggest-glow}@keyframes suggest-glow{0%,to{box-shadow:inset 0 0 0 3px #0000}50%{box-shadow:inset 0 0 0 3px color-mix(in oklab, var(--runner) 80%, transparent), 0 0 14px color-mix(in oklab, var(--runner) 55%, transparent)}}.cell--refused{animation:.38s ease-out refused}@keyframes refused{0%,to{background:var(--ground)}20%,60%{background:#e46a6a}}.curtain{background:#f4f1ea6b;border-radius:6px;place-content:center;gap:.9rem;display:grid;position:absolute;inset:0}.curtain[hidden]{display:none}.curtain--demo{pointer-events:none;background:0 0}.verdict{background:var(--page);letter-spacing:.06em;border-radius:999px;margin:0;padding:.3em .9em;font-size:clamp(1.1rem,4.5vw,1.6rem);font-weight:700;box-shadow:0 2px 10px #0000002e}.curtain--lost .verdict{color:var(--runner)}.again{font:inherit;background:var(--ink);color:#fff;cursor:pointer;border:none;border-radius:999px;justify-self:center;min-height:44px;padding:.5rem 1.6rem;font-weight:700}.again:focus-visible{outline:3px solid var(--block);outline-offset:3px}.start{z-index:2;font:inherit;letter-spacing:.05em;background:var(--runner);color:#fff;cursor:pointer;border:none;border-radius:999px;min-height:44px;padding:.6rem 2.2rem;font-weight:700;animation:2.4s ease-in-out infinite start-pulse;position:absolute;bottom:.9rem;left:50%;transform:translate(-50%);box-shadow:0 4px 14px #cf3a1c73}.start[hidden]{display:none}.start:focus-visible{outline:3px solid var(--ink);outline-offset:3px}@keyframes start-pulse{0%,to{box-shadow:0 4px 14px #cf3a1c73}50%{box-shadow:0 4px 22px #cf3a1cb3}}.solution{z-index:2;font:inherit;letter-spacing:.03em;border:1px solid var(--grout);min-height:32px;color:var(--ink);cursor:pointer;background:#f4f1eae6;border-radius:999px;padding:.35rem .8rem;font-size:.72rem;font-weight:700;position:absolute;top:.5rem;right:.5rem}.solution[hidden]{display:none}.solution:hover{background:var(--page)}.solution:focus-visible{outline:3px solid var(--block);outline-offset:2px}@media (prefers-reduced-motion:reduce){.cell--refused{animation-duration:1ms}.meter{transition:none}.start{animation:none}.cell--suggest{box-shadow:inset 0 0 0 3px color-mix(in oklab, var(--runner) 70%, transparent);animation:none}}
