*{box-sizing:border-box;margin:0}html,body{background:#111;color:#fff;font-family:Helvetica Neue,Hiragino Sans,sans-serif}#scroll{height:1800vh}#gl{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}#loading{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#111;letter-spacing:.3em;font-size:12px;transition:opacity .5s;pointer-events:none}#loading.off{opacity:0}.brand{position:fixed;top:28px;left:32px;font-size:22px;font-weight:700;letter-spacing:.22em;text-shadow:0 1px 12px #0008;pointer-events:none}.brand span{display:block;font-size:10px;font-weight:400;letter-spacing:.12em;margin-top:7px}.journey{position:fixed;bottom:24px;left:32px;right:32px;display:flex;gap:16px;align-items:center;font-size:12px;text-shadow:0 1px 8px #000;pointer-events:none}#scene-count{font-size:10px;letter-spacing:.15em}.hint{margin-left:auto;font-size:10px;letter-spacing:.08em}.progress{position:fixed;bottom:0;left:0;right:0;height:3px;background:#ffffff20}#progress-bar{height:100%;background:#b33d32;transform-origin:left;transform:scaleX(0)}@media(max-width:600px){.brand{left:18px;top:20px}.journey{left:18px;right:18px;bottom:20px;flex-wrap:wrap;gap:8px 12px}.hint{width:100%;margin:0;font-size:9px}}#cards{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden}.card{position:absolute;left:0;top:0;width:clamp(92px,10.5vw,168px);padding:0;border:0;background:none;color:#2a211d;font:inherit;text-align:left;cursor:pointer;transform-origin:50% 50%;will-change:transform,opacity;display:grid;place-items:center}.card>.pin,.card>.sheet{grid-area:1 / 1;transition:scale .32s cubic-bezier(.2,.8,.2,1),opacity .25s}.card .pin{padding:.38em .8em .4em .62em;border-radius:3px;white-space:nowrap;background:#14100ea6;color:#fffd;font-size:clamp(10px,.92vw,13px);font-weight:500;letter-spacing:.1em;border:1px solid #ffffff38;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);box-shadow:0 2px 8px #0005}.card .pin b{margin-right:.5em;font-weight:400;color:#ffffffa8}.card:hover .pin,.card:focus-visible .pin{background:#14100ed9;color:#fff;border-color:#fff9}.card .sheet{width:100%;padding:5px 5px 4px;background:#f6f1e7;box-shadow:0 6px 18px #0007,0 1px 2px #0006;scale:.15;opacity:0;pointer-events:none}.card{pointer-events:none}.card.live:not(.open) .pin,.card.live.open .sheet{pointer-events:auto}.card.open .pin{scale:.3;opacity:0}.card.open .sheet{scale:1;opacity:1}.card.open{z-index:2}.card .thumb{display:block;aspect-ratio:16 / 9;background:#222 center / cover;position:relative}.card .thumb i{position:absolute;left:50%;top:50%;width:30%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:#b33d32e6;transition:scale .2s}.card .thumb i:after{content:"";position:absolute;left:54%;top:50%;translate:-50% -50%;border-style:solid;border-width:.38em 0 .38em .62em;border-color:transparent transparent transparent #fff;font-size:clamp(9px,1.1vw,15px)}.card .name{display:block;margin-top:4px;font-size:clamp(9px,.95vw,13px);font-weight:700;letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card.open:hover .thumb i{scale:1.18}.card:focus-visible{outline:3px solid #fff;outline-offset:3px;border-radius:6px}.card.first .pin{position:relative}.card.first .pin:before{content:"";position:absolute;top:-5px;right:-5px;bottom:-5px;left:-5px;border:1.5px solid #fff;border-radius:6px;animation:pulse 2s ease-out infinite;pointer-events:none}.card .tip{position:absolute;left:50%;top:calc(50% + 1.9em);translate:-50% 0;color:#fff;font-size:clamp(10px,.95vw,13px);letter-spacing:.12em;white-space:nowrap;text-shadow:0 1px 6px #000c;animation:nudge 2s ease-in-out infinite}@keyframes pulse{0%{opacity:.8;scale:1}to{opacity:0;scale:1.18 1.5}}@keyframes nudge{50%{translate:-50% 3px;opacity:.6}}body.played .card.first .pin:before,body.played .card .tip{display:none}#player{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#0b0908cc;opacity:0;visibility:hidden;transition:opacity .3s,visibility 0s .3s;z-index:10}#player.open{opacity:1;visibility:visible;transition:opacity .3s}#player .panel{width:min(92vw,960px,150vh);background:#15110f;border-radius:10px;overflow:hidden;box-shadow:0 20px 60px #000a;scale:.12;transition:scale .38s cubic-bezier(.2,.8,.2,1)}#player.open .panel{scale:1}#player .bar{display:flex;align-items:center;gap:14px;padding:10px 12px 10px 16px;font-size:14px;font-weight:700;letter-spacing:.06em}#player .bar a{margin-left:auto;color:#fff9;font-size:11px;font-weight:400}#player-close{width:32px;height:32px;border:0;border-radius:50%;background:#ffffff1f;color:#fff;font-size:20px;line-height:1;cursor:pointer}#player-close:hover{background:#b33d32}#player-frame{aspect-ratio:16 / 9;background:#000}#player-frame iframe{width:100%;height:100%;border:0;display:block}@media(prefers-reduced-motion:reduce){.card.first .pin:before,.card .tip{animation:none}#player .panel{transition:none}}