:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Hiragino Sans","Yu Gothic UI","Yu Gothic",sans-serif;color:#f5f7f1;background:#090b08;--lime:#d8ff5b;--muted:#9da593;--line:rgba(216,255,91,.17);--danger:#ff756b;--panel:#11150f}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#090b08;color:#f5f7f1}body{overscroll-behavior:none;-webkit-font-smoothing:antialiased}button,a{font:inherit}.app{min-height:100dvh;width:min(100%,520px);margin:auto;position:relative;overflow:hidden;background:radial-gradient(circle at 90% -12%,rgba(216,255,91,.13),transparent 33%),#090b08;padding:max(12px,env(safe-area-inset-top)) 14px max(16px,env(safe-area-inset-bottom))}.topbar{height:46px;display:grid;grid-template-columns:44px 1fr 44px;align-items:center;position:relative;z-index:10}.home,.sound{width:38px;height:38px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;color:#c4ccb9;background:#0e120c;text-decoration:none;font-weight:900;font-size:19px}.sound{justify-self:end;cursor:pointer}.sound[aria-pressed="false"]{color:#65705f}.brand{text-align:center;font-size:12px;letter-spacing:.16em;color:#747e6e;line-height:1.4}.brand b{display:block;color:#b7c0ae;font-size:12px}.screen{display:none;min-height:calc(100dvh - 74px);animation:enter .24s ease}.screen.is-active{display:flex;flex-direction:column}@keyframes enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.screen-start{justify-content:center;padding:12px 4px 24px;position:relative}.eyebrow{font-size:12px;font-weight:950;letter-spacing:.18em;color:var(--lime);margin-bottom:10px}.screen-start h1{font-size:clamp(72px,25vw,118px);line-height:.72;letter-spacing:-.08em;margin:0 0 26px;font-weight:950}.screen-start h1 em{font-style:normal;color:var(--lime)}.lead{font-size:15px;line-height:1.8;color:#bdc5b5;margin:0 0 22px;max-width:410px}.lead strong{color:#fff}.start-orbit{position:absolute;right:-74px;top:34px;width:238px;height:238px;border:1px solid rgba(216,255,91,.12);border-radius:50%;opacity:.62;pointer-events:none}.start-orbit:before,.start-orbit:after{content:"";position:absolute;border:1px solid rgba(216,255,91,.1);border-radius:50%;inset:32px}.start-orbit:after{inset:66px}.start-orbit span{position:absolute;color:rgba(216,255,91,.45);font-size:12px;font-weight:950}.start-orbit span:nth-child(1){left:48%;top:-5px}.start-orbit span:nth-child(2){right:12px;top:23%}.start-orbit span:nth-child(3){right:8px;bottom:25%}.start-orbit span:nth-child(4){left:49%;bottom:-5px}.start-orbit span:nth-child(5){left:10px;bottom:24%}.start-orbit span:nth-child(6){left:10px;top:24%}.start-orbit span:nth-child(7){left:47%;top:48%}.start-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}.start-stats div{border-top:1px solid var(--line);padding-top:10px}.start-stats strong{display:block;font-size:20px}.start-stats span{font-size:12px;letter-spacing:.13em;color:#70796a;font-weight:900}.rules{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:18px}.rules span{border:1px solid rgba(255,255,255,.08);background:#0e120d;padding:6px 9px;border-radius:999px;color:#98a18f;font-size:12px;font-weight:800}.primary{width:100%;min-height:58px;border:0;border-radius:17px;background:var(--lime);color:#0b0e08;font-size:14px;font-weight:950;padding:0 18px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;box-shadow:0 12px 32px rgba(216,255,91,.09);-webkit-tap-highlight-color:transparent}.primary:active{transform:scale(.985)}.primary span{font-size:22px}.note{font-size:12px;line-height:1.65;color:#6f7869;text-align:center;margin:12px 12px 0}
.screen-game{padding:8px 0 14px}.hud{margin-bottom:20px}.progress-wrap{height:3px;background:#1b2118;border-radius:99px;overflow:hidden}.progress{height:100%;width:10%;background:var(--lime);transition:width .25s ease}.hud-row{display:flex;justify-content:space-between;gap:10px;margin-top:8px;font-size:12px;font-weight:950;letter-spacing:.1em;color:#70796a}.streak{color:#aab49f}.skill-row{display:flex;align-items:center;gap:8px;margin-bottom:10px}.skill-dot{width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 16px rgba(216,255,91,.45)}.skill-name{font-size:12px;font-weight:950;letter-spacing:.16em;color:var(--lime)}.skill-jp{font-size:12px;color:#7f8977}.scenario{min-height:180px;border:1px solid rgba(255,255,255,.09);border-radius:22px;background:linear-gradient(145deg,#151a12,#0d100c);padding:18px 18px 15px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.scenario:after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;right:-92px;top:-104px;background:rgba(216,255,91,.06)}.scene-no{font-size:12px;letter-spacing:.16em;color:#737c6d;font-weight:950}.scenario h2{font-size:clamp(21px,6.2vw,30px);line-height:1.35;letter-spacing:-.035em;margin:20px 0 22px;position:relative;z-index:1}.timer{height:5px;border-radius:99px;background:#242a21;overflow:hidden}.timer-fill{height:100%;width:100%;background:var(--lime);transform-origin:left center}.timer-fill.is-danger{background:var(--danger)}.choices{display:grid;gap:9px;margin-top:12px}.choice{width:100%;min-height:62px;border:1px solid rgba(255,255,255,.1);border-radius:17px;background:#10140e;color:#edf0e9;text-align:left;padding:12px 15px;display:grid;grid-template-columns:28px 1fr;gap:9px;align-items:center;cursor:pointer;font-size:14px;line-height:1.45;font-weight:800;-webkit-tap-highlight-color:transparent}.choice:active{transform:scale(.99);border-color:rgba(216,255,91,.38)}.choice-no{width:26px;height:26px;border-radius:50%;border:1px solid rgba(255,255,255,.12);display:grid;place-items:center;color:#7d8677;font-size:12px}.microcopy{text-align:center;font-size:12px;color:#626b5d;margin-top:10px;letter-spacing:.05em}
.screen-feedback{justify-content:center;padding:24px 4px}.feedback-mark{width:66px;height:66px;border-radius:50%;display:grid;place-items:center;background:rgba(216,255,91,.1);border:1px solid rgba(216,255,91,.3);color:var(--lime);font-size:32px;font-weight:950;margin-bottom:20px}.feedback-mark.is-wrong{color:var(--danger);background:rgba(255,117,107,.08);border-color:rgba(255,117,107,.28)}.feedback-kicker{font-size:12px;letter-spacing:.18em;color:var(--lime);font-weight:950}.feedback-kicker.is-wrong{color:var(--danger)}.screen-feedback h2{font-size:clamp(34px,10vw,48px);line-height:1.04;letter-spacing:-.055em;margin:10px 0 13px}.screen-feedback p{font-size:14px;line-height:1.8;color:#b1baa8;margin:0 0 16px}.feedback-meta{display:flex;gap:8px;margin-bottom:26px}.feedback-meta span{font-size:12px;font-weight:950;letter-spacing:.1em;border:1px solid var(--line);border-radius:999px;padding:6px 9px;color:#939d8d}.screen-result{justify-content:center;padding:18px 4px 26px}.screen-result h2{font-size:clamp(42px,13vw,64px);line-height:.93;letter-spacing:-.065em;margin:0 0 15px}.screen-result h2 em{font-style:normal;color:var(--lime)}.reflex-score{display:flex;align-items:baseline;gap:8px;margin-bottom:18px}.reflex-score strong{font-size:72px;line-height:.9;color:var(--lime);letter-spacing:-.06em}.reflex-score span{color:#7d8675;font-size:14px}.result-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}.result-grid div{border:1px solid rgba(255,255,255,.08);background:#10140e;border-radius:15px;padding:11px}.result-grid span{font-size:12px;color:#727b6c;display:block;margin-bottom:5px}.result-grid strong{font-size:18px}.weak-card,.ifthen{border:1px solid var(--line);border-radius:17px;background:rgba(216,255,91,.035);padding:14px 15px;margin-bottom:10px}.weak-label,.ifthen span{font-size:12px;font-weight:950;letter-spacing:.13em;color:#788170;display:block;margin-bottom:6px}.weak-skill{font-size:18px;font-weight:950;color:var(--lime);letter-spacing:.08em}.weak-card p{font-size:12px;line-height:1.6;color:#9fa895;margin:5px 0 0}.ifthen strong{font-size:13px;line-height:1.55}.screen-result .primary{margin-top:6px}.secondary{display:block;text-align:center;color:#7f8878;font-size:12px;padding:15px;text-decoration:none}
@media(max-height:700px){.screen-start{justify-content:flex-start;padding-top:24px}.screen-start h1{font-size:72px;margin-bottom:18px}.lead{font-size:13px;margin-bottom:14px}.scenario{min-height:150px}.scenario h2{font-size:21px;margin:13px 0 16px}.choice{min-height:54px;padding:9px 13px}.screen-feedback,.screen-result{justify-content:flex-start;padding-top:30px}.reflex-score strong{font-size:58px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}