:root{--bg: #0f1226;--bg-card: #181c34;--bg-card-2: #20264a;--fg: #eef1ff;--fg-dim: #aab0d6;--accent: #5b8cff;--go: #36d399;--miss: #f87171;--radius: 16px;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;touch-action:manipulation}.app{max-width:460px;margin:0 auto;padding:max(16px,env(safe-area-inset-top)) 16px calc(24px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:14px;min-height:100vh}.app__head{text-align:center;padding-top:8px}.app__title{margin:0;font-size:30px;letter-spacing:.04em;font-weight:800}.app__sub{margin:4px 0 0;color:var(--fg-dim);font-size:13px}.card{background:var(--bg-card);border-radius:var(--radius);padding:16px;box-shadow:0 6px 24px #00000040}.scene{width:100%;height:auto;display:block;border-radius:12px;aspect-ratio:1 / 1}.meta{display:flex;align-items:center;gap:12px;margin-top:14px}.badge{flex:0 0 auto;width:44px;height:44px;display:grid;place-items:center;background:var(--bg-card-2);border-radius:12px;font-size:22px}.meta__name{font-weight:700}.meta__rule{color:var(--fg-dim);font-size:14px;margin-top:2px}.meta__sys{color:var(--fg-dim);font-size:12px;margin-top:4px;opacity:.8}.stage{text-align:center}.hint{color:var(--fg-dim);font-size:14px;margin:0 0 12px}.timer{font-variant-numeric:tabular-nums;font-size:40px;font-weight:800;margin:6px 0 14px}.timer--final{color:var(--go)}.row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;border-radius:12px;padding:14px 20px;font-size:16px;font-weight:700;color:var(--fg);background:var(--bg-card-2);cursor:pointer;min-height:52px;flex:1 1 auto;transition:transform .05s ease,filter .15s ease}.btn:active{transform:translateY(1px)}.btn--go{background:var(--go);color:#06281c}.btn--miss{background:var(--miss);color:#2a0a0a}.record__title{margin:0 0 12px;font-size:15px;color:var(--fg-dim);font-weight:700}.record__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0}.record__grid div{background:var(--bg-card-2);border-radius:12px;padding:12px 8px;text-align:center}.record__grid dt{font-size:12px;color:var(--fg-dim)}.record__grid dd{margin:6px 0 0;font-size:20px;font-weight:800;font-variant-numeric:tabular-nums}.record__note{margin:12px 0 0;font-size:12px;color:var(--fg-dim);line-height:1.5}.app__foot{text-align:center;color:var(--fg-dim);font-size:11px;opacity:.7;margin-top:auto;padding-top:8px}.tapstage{position:relative;width:100%;aspect-ratio:1 / 1;margin:4px auto 0;max-width:360px}.tapstage__scene,.tapstage__hits{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border-radius:12px}.tapstage__hits{touch-action:manipulation}.play-scene{width:100%;max-width:360px;aspect-ratio:1 / 1;display:block;margin:4px auto;border-radius:12px}.stub{text-align:center}.choicestage__prompt{width:100%;max-width:360px;aspect-ratio:1 / 1;display:block;margin:4px auto 12px;border-radius:12px}.choices{display:grid;gap:10px;grid-template-columns:repeat(2,1fr)}.choices--n3{grid-template-columns:repeat(3,1fr)}.choice{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:2px solid #2b3160;background:var(--bg-card-2);color:var(--fg);border-radius:14px;padding:14px;min-height:64px;cursor:pointer;display:grid;place-items:center}.choice:disabled{cursor:default}.choice--correct{border-color:var(--go);background:#36d39929}.choice--wrong{border-color:var(--miss);background:#f8717129}.choice__text{font-size:24px;font-weight:800;font-variant-numeric:tabular-nums}.choice__swatch{width:44px;height:44px;border-radius:10px;display:block}.choice__scene{width:100%;max-width:110px;aspect-ratio:1 / 1;display:block}.pg__cats,.pg__diff{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:10px}.pg__label{font-size:12px;color:var(--fg-dim);margin-right:4px}.chip{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid #2b3160;background:var(--bg-card-2);color:var(--fg);border-radius:10px;padding:8px 12px;font-size:14px;font-weight:700;cursor:pointer;min-height:40px}.chip--sm{padding:6px 10px;min-width:36px;min-height:36px;font-size:13px}.chip--on{background:var(--accent);border-color:var(--accent);color:#06122e}.pg__done{text-align:center;padding:24px 0}.link-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;color:var(--accent);font-size:13px;font-weight:700;cursor:pointer;padding:6px;text-decoration:underline}.notify-prompt{text-align:center}.howto__list{margin:4px 0 8px;padding-left:20px;color:var(--fg);font-size:14px;line-height:1.7}.howto__list li{margin-bottom:10px}.howto__sub{margin:14px 0 8px;font-size:15px;font-weight:700;color:var(--fg-dim)}.howto__row{display:flex;align-items:center;justify-content:space-between;background:var(--bg-card-2);border-radius:12px;padding:12px 14px;margin-bottom:8px;font-size:15px}.howto__row input[type=time]{background:var(--bg);color:var(--fg);border:1px solid #2b3160;border-radius:8px;padding:6px 8px;font-size:15px}.howto__row input[type=checkbox]{width:22px;height:22px}.btn--ghost{background:transparent;border:1px solid #2b3160}.btn--sm{min-height:40px;padding:8px 14px;font-size:14px;flex:0 1 auto}.result{text-align:center}.result__stats{display:flex;gap:20px;justify-content:center;margin:6px 0 4px}.result__stats div{background:var(--bg-card-2);border-radius:12px;padding:10px 18px;min-width:92px}.result__stats dt{font-size:12px;color:var(--fg-dim)}.result__stats dd{margin:4px 0 0;font-size:22px;font-weight:800;font-variant-numeric:tabular-nums}.symboldrop{position:relative;width:100%;max-width:340px;margin:14px auto 6px;aspect-ratio:300 / 180}.symboldrop__layer{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.symboldrop__new--drop{animation:symboldrop-fall .9s cubic-bezier(.34,1.5,.6,1) both}@keyframes symboldrop-fall{0%{transform:translateY(-46%);opacity:0}55%{opacity:1}to{transform:translateY(0);opacity:1}}.collection__head{display:flex;align-items:center;gap:12px;margin-bottom:10px}.collection__head .record__title{margin:0}.collection__legend{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:12px 0}.legend__item{display:flex;align-items:center;gap:8px;background:var(--bg-card-2);border-radius:10px;padding:6px 10px;font-size:13px}.legend__emblem{width:32px;height:32px;flex:0 0 auto}@media (prefers-reduced-motion: reduce){.btn{transition:none}.symboldrop__new--drop{animation:none}}
