:root{--bg:#fff6f9;--fg:#3a2e33;--muted:#8a7a80;--line:#f1d5df;--card:#fff;--accent:#d2557a;--win:#c0811c;--lose:#8a6a9a;--font-display:"DotGothic16", "Hiragino Maru Gothic ProN", sans-serif;--font-body:"Zen Maru Gothic", "Hiragino Maru Gothic ProN", sans-serif}@media (prefers-color-scheme:dark){:root{--bg:#1e1a1c;--fg:#f2e8ec;--muted:#a8989e;--line:#3a3034;--card:#282225;--accent:#f07a9c;--win:#f0b850;--lose:#b89ac8;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}body{background:var(--bg);color:var(--fg);font-family:var(--font-body);-webkit-tap-highlight-color:transparent;padding-left:max(16px, env(safe-area-inset-left,0px));padding-right:max(16px, env(safe-area-inset-right,0px));margin:0;padding-block:16px 32px}.wrap{gap:12px;max-width:480px;margin:0 auto;display:grid}header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}h1{font-family:var(--font-display);letter-spacing:.05em;margin:0;font-size:1.4rem;font-weight:400}.back{color:var(--muted);padding:4px 0;font-size:.85rem;text-decoration:none;display:inline-block}.back:hover,.back:focus-visible{color:var(--accent);text-decoration:underline}select{font:inherit;border:1px solid var(--line);background:var(--card);color:var(--fg);border-radius:8px;padding:6px 10px;font-size:.85rem}#info{font-family:var(--font-display);font-variant-numeric:tabular-nums;align-items:baseline;gap:10px;font-size:1rem;display:flex}#info b{font-size:1.5rem;font-weight:400}#info span{color:var(--muted);font-size:.85rem}.meter{background:var(--line);border-radius:3px;height:6px;overflow:hidden}#meter{background:var(--accent);width:0;height:100%;transition:width .15s}#stage{touch-action:none;-webkit-user-select:none;user-select:none;position:relative}#board{width:100%;height:auto;image-rendering:pixelated;border:1px solid var(--line);border-radius:6px;display:block}.pop{font-family:var(--font-display);white-space:nowrap;pointer-events:none;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:2px 8px;font-size:.95rem;animation:1.1s ease-out forwards rise;position:absolute;transform:translate(-50%,-60%)}.pop.angry{color:#4e8a2a}.pop.win{color:var(--win);font-size:1.2rem}@keyframes rise{0%{opacity:1;transform:translate(-50%,-60%)}to{opacity:0;transform:translate(-50%,-140%)}}@media (prefers-reduced-motion:reduce){.pop{animation:none}}.note{min-height:1.6em;color:var(--muted);margin:0;font-size:.9rem}.note.win{color:var(--win);font-weight:700}.note.lose{color:var(--lose);font-weight:700}.controls{flex-wrap:wrap;gap:8px;display:flex}button{font:inherit;border:1px solid var(--line);background:var(--card);color:var(--fg);cursor:pointer;border-radius:999px;padding:8px 16px;font-size:.9rem}button.primary{background:var(--accent);border-color:var(--accent);color:#fff}button[hidden]{display:none}button:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.how{color:var(--muted);margin:0;font-size:.8rem;line-height:1.7}.head-tools{align-items:center;gap:8px;display:flex}button.small{padding:6px 12px;font-size:.8rem}#stage.emerge{animation:1.2s both emerge}@keyframes emerge{0%{opacity:0;filter:brightness(.2)}to{opacity:1;filter:none}}.story-overlay{--ink:#e9e4da;--dim:#8c8a86;--night:#15171c;--story-accent:#e86a7a;z-index:10;padding:max(28px, env(safe-area-inset-top,0px)) max(22px, env(safe-area-inset-right,0px)) max(28px, env(safe-area-inset-bottom,0px)) max(22px, env(safe-area-inset-left,0px));background:var(--night);color:var(--ink);font-family:var(--font-display);cursor:pointer;-webkit-user-select:none;user-select:none;opacity:0;visibility:hidden;flex-direction:column;gap:14px;transition:opacity .6s,visibility 0s .6s;display:flex;position:fixed;inset:0;overflow-y:auto}.story-overlay.on{opacity:1;visibility:visible;transition:none}.story-overlay.on.slow{transition:opacity 1s}.story-overlay:focus{outline:none}.story-overlay>*{width:100%;max-width:480px;margin-inline:auto}.story-label{letter-spacing:.2em;min-height:1.2em;color:var(--dim);padding-right:4.5em;font-size:.8rem}.story-text{letter-spacing:.02em;padding-bottom:3em;font-size:1.02rem;line-height:1.95}.story-text.center{text-align:center;margin-block:auto;font-size:1.3rem}.story-text p{min-height:1.95em;margin:0;transition:opacity .5s}.story-text p.hide{opacity:0}.story-text p.gap{min-height:.9em}.story-text p.last{color:var(--story-accent)}.story-tap{right:max(18px, env(safe-area-inset-right,0px));bottom:max(14px, env(safe-area-inset-bottom,0px));width:auto;color:var(--dim);font-size:.8rem;animation:1.2s steps(2,end) infinite story-blink;position:fixed}@keyframes story-blink{50%{opacity:0}}.story-overlay button.story-skip{top:max(10px, env(safe-area-inset-top,0px));right:max(10px, env(safe-area-inset-right,0px));width:auto;color:var(--dim);background:0 0;border:1px solid #2a2d35;border-radius:999px;padding:4px 10px;font-size:.75rem;position:fixed}.story-menu{gap:8px;display:grid}.story-overlay button{color:var(--ink);border:1px solid var(--dim);cursor:pointer;background:0 0;font-family:inherit}.story-menu button{text-align:left;padding:10px 16px}.story-overlay button.story-close{width:auto;color:var(--dim);align-self:flex-start;margin-inline:auto}.story-overlay button:focus-visible{outline:2px solid var(--story-accent);outline-offset:2px}@media (prefers-reduced-motion:reduce){#stage.emerge{animation:none}.story-overlay,.story-overlay.on,.story-overlay.on.slow,.story-text p{transition:none}.story-tap{animation:none}}
