@font-face{font-family:localserif;src:local("YuMincho"),local("Hiragino Mincho ProN");font-display:swap}
:root{font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;color:#292c2c;background:#efeee9;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100svh}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:2px solid #547972;outline-offset:5px}button:disabled{cursor:wait}button,svg{user-select:none}[hidden]{display:none!important}#app{max-width:780px;min-height:100svh;margin:auto;padding:0 24px}.topbar{height:88px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d8d8d1}.brand{font-size:14px;letter-spacing:.16em}.sound{display:grid;place-items:center;width:44px;height:44px;background:none;border:0}.sound svg{width:22px;height:22px}.play{max-width:620px;margin:0 auto;padding:32px 0 20px}.progress{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;font-family:ui-monospace,monospace;font-size:14px;letter-spacing:.06em}.progress span span{color:#90958e}.dots{display:flex;gap:8px}.dot{width:5px;height:5px;border-radius:50%;background:#c7cbc3}.dot.done{background:#52625b}.photo-shell{position:relative;padding:12px;background:#fff;box-shadow:0 3px 5px #25382d09,0 16px 40px #243c3110;transform:rotate(-.35deg)}.photo-stage{position:relative;aspect-ratio:1;overflow:hidden;background:#d6d7d1;touch-action:manipulation}.photo-stage img{display:block;width:100%;height:100%;object-fit:contain;user-select:none}.hit-area{position:absolute;inset:0}.person{position:absolute;appearance:none;background:transparent;border:0;border-radius:50%;padding:0;touch-action:manipulation}.person:focus-visible{outline:2px solid #eee;outline-offset:2px;box-shadow:0 0 0 4px #4b6558}.instruction-wrap{min-height:88px;text-align:center;padding-top:24px}#instruction{font-size:17px;line-height:1.8;margin:0;letter-spacing:.06em}.feedback{height:20px;font-size:13px;margin-top:8px;color:#68756d}.flash{position:absolute;inset:0;pointer-events:none;background:#fafaf7;opacity:0}.flash.fire{animation:flash .22s ease-out}.photo-shell.wrong{animation:shake .18s linear}.start-screen{position:fixed;inset:0;background:#efeee9;z-index:10;display:grid;place-items:center;padding:28px}.start-inner{width:100%;max-width:380px;text-align:center}.edition{font:12px ui-monospace,monospace;letter-spacing:.24em;color:#78847c}h1{font-family:localserif,"Yu Mincho",serif;font-weight:500;letter-spacing:.18em;font-size:clamp(38px,8vw,52px);line-height:1.65;margin:24px 0 22px}.rule-line{height:1px;width:40px;background:#8d998e;margin:0 auto 28px}.start-inner>p{font-size:16px;letter-spacing:.05em}.primary{display:flex;justify-content:center;align-items:center;gap:12px;margin:32px auto 22px;min-height:54px;width:100%;border:1px solid #293a32;background:#293a32;color:#fff;font-size:15px;letter-spacing:.08em}.primary:disabled{opacity:.6}.start-inner small{display:block;font-size:12px;color:#81847e;line-height:1.8}.loader{width:12px;height:12px;border:1px solid #fff5;border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}body.ominous{background:#141715;color:#dfdfd7;transition:background 1s,color 1s}body.ominous .topbar{border-color:#303b33}body.ominous .photo-shell{background:#b4b8ae;transform:none;box-shadow:0 0 60px #0008}body.ominous #instruction{font-family:localserif,"Yu Mincho",serif;letter-spacing:.09em}body.ominous .dot{background:#465047}.cinema{position:fixed;inset:0;background:#070908;z-index:20;overflow:hidden}.cinema-frame{position:absolute;inset:0;overflow:hidden}.cinema-frame img{position:absolute;left:50%;top:50%;width:min(100vw,760px);height:auto;max-width:none;will-change:transform;filter:saturate(.45) contrast(1.06);transform-origin:center}.cinema-frame:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 15%,#05070588 85%);pointer-events:none}.subtitle{position:absolute;left:20px;right:20px;bottom:max(12vh,64px);z-index:4;margin:0;text-align:center;white-space:pre-line;line-height:2;letter-spacing:.12em;font-family:localserif,"Yu Mincho",serif;font-size:clamp(20px,4.5vw,28px);color:#f0f0e8;text-shadow:0 2px 14px #000,0 0 32px #000}.blackout{position:absolute;inset:0;background:#000;z-index:7;opacity:0;pointer-events:none}.result{position:fixed;inset:0;z-index:30;background:#000;color:#898d88;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:30px}.result p{font-family:localserif,"Yu Mincho",serif;letter-spacing:.2em;font-size:16px}.result button{border:0;background:none;font-size:14px;letter-spacing:.08em;padding:16px;color:#c4c8c1}.result button span{margin-left:20px;font-size:20px}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes flash{0%{opacity:.3}100%{opacity:0}}@keyframes shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
@media(max-width:600px){#app{padding:0 16px}.topbar{height:68px}.play{padding-top:26px}.photo-shell{padding:8px}.progress{margin-bottom:16px}.instruction-wrap{padding-top:25px}.brand{font-size:13px}.cinema-frame img{width:100vw}}
@media(max-height:620px) and (min-width:600px){.topbar{height:56px}.play{max-width:380px;padding-top:12px}.progress{margin-bottom:10px}.instruction-wrap{padding-top:12px}.photo-shell{padding:6px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}.photo-shell{transform:none}.cinema-frame img{will-change:auto}}

.photo-stage:focus{outline:none}
.start-inner>.start-note{margin:0;font-size:14px;line-height:1.8;color:#687169;letter-spacing:.02em}
.cinema-blink{pointer-events:none;clip-path:inset(42.2% 43.7% 53.2% 44%);mask-image:radial-gradient(ellipse 2.3% 1.3% at 47.65% 44.35%,#000 50%,transparent 100%),radial-gradient(ellipse 2.3% 1.3% at 52.5% 44.35%,#000 50%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 2.3% 1.3% at 47.65% 44.35%,#000 50%,transparent 100%),radial-gradient(ellipse 2.3% 1.3% at 52.5% 44.35%,#000 50%,transparent 100%)}
body.ending .sound{position:fixed;top:max(12px,env(safe-area-inset-top));right:max(16px,env(safe-area-inset-right));z-index:40;border:1px solid #586057;border-radius:50%;background:#070908d9;color:#e0e4dc}
.subtitle{left:50%;right:auto;width:calc(100% - 40px);max-width:14em;transform:translateX(-50%);text-wrap:balance}

.result .result-message{max-width:16em;padding:0 24px;font-size:clamp(20px,4.5vw,26px);color:#dedfd8;line-height:2;letter-spacing:.08em;text-align:center;text-wrap:balance}

.result .share{display:block;min-width:230px;max-width:calc(100vw - 48px);padding:16px 24px;border:1px solid #626a62;color:#e0e4dc;text-align:center;text-decoration:none;font-size:14px;letter-spacing:.06em}.result .share:hover{background:#151a16}.result .share:focus-visible{outline:2px solid #adb9ac;outline-offset:5px}.result #replay{margin-top:-18px}