:root{--bg:#0a0a12;--bg2:#0f0f1a;--surface:#141422;--surface2:#1a1a2e;--border:#2a2a44;--border-hi:#3a3a5c;--text:#e8e8f0;--text-dim:#88a;--text-faint:#557;--green:#3f3;--green-dim:#1a881a;--green-glow:#33ff3326;--cyan:#3ff;--magenta:#f3f;--gold:gold;--silver:silver;--bronze:#cd7f32;--red:#f33;--font-mono:"Courier New", "Lucida Console", monospace;--font-sans:"Segoe UI", system-ui, -apple-system, sans-serif}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text);font-family:var(--font-sans);min-height:100vh;line-height:1.6}.app{flex-direction:column;min-height:100vh;display:flex}.hero{text-align:center;background:linear-gradient(180deg, var(--bg2) 0%, var(--bg) 100%);padding:64px 24px 48px;position:relative;overflow:hidden}.hero-inner{z-index:1;max-width:640px;margin:0 auto;position:relative}.hero-badge{font-family:var(--font-mono);letter-spacing:3px;color:var(--green);border:1px solid var(--green-dim);text-transform:uppercase;border-radius:2px;margin-bottom:20px;padding:4px 14px;font-size:11px;display:inline-block}.hero-title{font-family:var(--font-mono);letter-spacing:4px;color:var(--green);text-shadow:0 0 24px var(--green-glow), 0 0 60px #33ff3314;margin-bottom:12px;font-size:clamp(36px,7vw,64px);font-weight:700;line-height:1.1}.hero-sub{color:var(--text-dim);max-width:480px;margin:0 auto 20px;font-size:16px}.hero-meta{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.hero-chip{font-family:var(--font-mono);letter-spacing:1px;color:var(--text-faint);border:1px solid var(--border);border-radius:2px;padding:4px 12px;font-size:11px}.hero-scanlines{pointer-events:none;z-index:0;background:repeating-linear-gradient(0deg,#0000,#0000 2px,#00000026 2px 4px);position:absolute;inset:0}.main{flex:1;width:100%;max-width:1200px;margin:0 auto;padding:40px 20px}.game-section{margin-bottom:48px}.game-layout{grid-template-columns:1fr 360px;align-items:start;gap:24px;display:grid}@media (width<=900px){.game-layout{grid-template-columns:1fr}}.game-panel-wrap{min-width:0}.panel-frame{background:var(--surface);border:1px solid var(--border);border-radius:4px;padding:20px;box-shadow:0 0 40px #33ff330a,inset 0 0 20px #0000004d}.panel-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.panel-label{font-family:var(--font-mono);letter-spacing:4px;color:var(--green);font-size:16px;font-weight:700}.panel-year{font-family:var(--font-mono);color:var(--cyan);letter-spacing:1px;font-size:13px}.resources{grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px;display:grid}@media (width<=480px){.resources{grid-template-columns:1fr}}.res-item{background:var(--bg);border:1px solid var(--border);border-radius:4px;align-items:center;gap:10px;padding:12px;display:flex}.res-icon{font-size:24px}.res-label{font-family:var(--font-mono);letter-spacing:1px;color:var(--text-faint);text-transform:uppercase;font-size:10px;display:block}.res-value{font-family:var(--font-mono);color:var(--text);font-size:18px;font-weight:700}.indicators{flex-direction:column;gap:10px;margin-bottom:16px;display:flex}.indicator{flex-direction:column;gap:4px;display:flex}.ind-label{font-family:var(--font-mono);color:var(--text-dim);font-size:11px}.ind-bar{background:var(--surface2);border-radius:3px;height:6px;overflow:hidden}.ind-fill{background:linear-gradient(90deg, var(--green-dim), var(--green));border-radius:3px;height:100%;transition:width .3s}.ind-fill.danger{background:linear-gradient(90deg, #811, var(--red))}.score-row{border-top:1px solid var(--border);align-items:center;gap:16px;padding-top:12px;display:flex}.score-label{font-family:var(--font-mono);letter-spacing:2px;color:var(--text-faint);font-size:11px}.score-value{font-family:var(--font-mono);color:var(--green);text-shadow:0 0 12px var(--green-glow);font-size:28px;font-weight:700}.score-time{font-family:var(--font-mono);color:var(--text-dim);margin-left:auto;font-size:13px}.controls{background:var(--surface);border:1px solid var(--border);border-radius:4px;margin-top:16px;padding:16px}.controls.finished{text-align:center}.field-label{font-family:var(--font-mono);letter-spacing:2px;color:var(--text-dim);text-transform:uppercase;margin-bottom:8px;font-size:11px;display:block}.nick-input{background:var(--bg);border:1px solid var(--border);width:100%;color:var(--text);font-family:var(--font-mono);letter-spacing:1px;border-radius:2px;margin-bottom:12px;padding:10px 14px;font-size:16px;transition:border-color .15s}.nick-input:focus{border-color:var(--green);box-shadow:0 0 0 2px var(--green-glow);outline:none}.btn-start{background:var(--green);width:100%;color:var(--bg);font-family:var(--font-mono);letter-spacing:3px;cursor:pointer;border:none;border-radius:2px;padding:12px;font-size:14px;font-weight:700;transition:background .15s,transform .1s;display:block}.btn-start:hover{background:#5f5;transform:translateY(-1px)}.btn-start:active{transform:translateY(0)}.btn-start:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}.btn-quit{color:var(--text-dim);font-family:var(--font-mono);letter-spacing:1px;border:1px solid var(--border);cursor:pointer;background:0 0;border-radius:2px;margin-top:8px;padding:8px 16px;font-size:12px;transition:color .15s,border-color .15s;display:inline-block}.btn-quit:hover{color:var(--red);border-color:var(--red)}.btn-quit:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}.turn-inputs{grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:12px;display:grid}@media (width<=600px){.turn-inputs{grid-template-columns:repeat(2,1fr)}}.input-group{flex-direction:column;gap:4px;display:flex}.input-group label{font-family:var(--font-mono);letter-spacing:1px;color:var(--text-faint);text-transform:uppercase;font-size:10px}.input-group input{background:var(--bg);border:1px solid var(--border);color:var(--text);font-family:var(--font-mono);border-radius:2px;padding:8px 10px;font-size:14px;transition:border-color .15s}.input-group input:focus{border-color:var(--green);box-shadow:0 0 0 2px var(--green-glow);outline:none}.btn-turn{background:var(--cyan);width:100%;color:var(--bg);font-family:var(--font-mono);letter-spacing:3px;cursor:pointer;border:none;border-radius:2px;padding:12px;font-size:14px;font-weight:700;transition:background .15s,transform .1s;display:block}.btn-turn:hover{background:#5ff;transform:translateY(-1px)}.btn-turn:active{transform:translateY(0)}.btn-turn:focus-visible{outline:2px solid var(--green);outline-offset:2px}.result-card{text-align:center}.result-title{font-family:var(--font-mono);letter-spacing:3px;margin-bottom:8px;font-size:16px}.result-title.win{color:var(--gold)}.result-title.lose{color:var(--red)}.result-score{font-family:var(--font-mono);color:var(--green);text-shadow:0 0 20px var(--green-glow);margin-bottom:4px;font-size:48px;font-weight:700}.result-time{font-family:var(--font-mono);color:var(--text-dim);margin-bottom:16px;font-size:14px}.side-panel{flex-direction:column;gap:16px;display:flex}.log-wrap{background:var(--surface);border:1px solid var(--border);border-radius:4px;padding:16px}.log-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.log-title{font-family:var(--font-mono);letter-spacing:3px;color:var(--text);font-size:14px;font-weight:700}.log-empty{text-align:center;color:var(--text-faint);font-family:var(--font-mono);padding:24px;font-size:13px}.log-list{flex-direction:column;gap:8px;max-height:240px;display:flex;overflow-y:auto}.log-entry{font-family:var(--font-mono);color:var(--text-dim);background:var(--bg);border:1px solid var(--border);white-space:pre-wrap;border-radius:2px;padding:8px;font-size:11px;line-height:1.5}.leaderboard-wrap{background:var(--surface);border:1px solid var(--border);border-radius:4px;padding:16px}.lb-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.lb-title{font-family:var(--font-mono);letter-spacing:3px;color:var(--text);font-size:14px;font-weight:700}.lb-refresh{border:1px solid var(--border);color:var(--text-dim);cursor:pointer;background:0 0;border-radius:2px;width:28px;height:28px;font-size:14px;transition:color .15s,border-color .15s}.lb-refresh:hover{color:var(--green);border-color:var(--green)}.lb-refresh:disabled{opacity:.4;cursor:default}.lb-empty{text-align:center;color:var(--text-faint);padding:32px 16px}.lb-empty-icon{color:var(--text-faint);margin-bottom:8px;font-size:32px}.lb-list{flex-direction:column;gap:4px;max-height:320px;list-style:none;display:flex;overflow-y:auto}.lb-row{background:var(--bg);border:1px solid var(--border);font-family:var(--font-mono);border-left:3px solid #0000;border-radius:2px;grid-template-columns:24px 1fr 24px 48px 48px;align-items:center;padding:8px 10px;font-size:12px;transition:background .15s;display:grid}.lb-row:hover,.lb-row.top{background:var(--surface2)}.lb-rank{color:var(--text-faint);font-size:11px}.lb-nick{color:var(--text);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.lb-outcome{font-size:14px}.lb-score{color:var(--green);text-align:right;font-weight:700}.lb-time{color:var(--text-dim);text-align:right;font-size:10px}.about{margin-bottom:48px}.about-title{font-family:var(--font-mono);letter-spacing:3px;color:var(--text);margin-bottom:20px;font-size:20px;font-weight:700}.about-grid{grid-template-columns:repeat(3,1fr);gap:16px;display:grid}@media (width<=640px){.about-grid{grid-template-columns:1fr}}.about-card{background:var(--surface);border:1px solid var(--border);border-radius:4px;padding:20px;transition:border-color .2s}.about-card:hover{border-color:var(--border-hi)}.about-num{font-family:var(--font-mono);color:var(--green-dim);margin-bottom:8px;font-size:28px;font-weight:700}.about-card h3{color:var(--text);margin-bottom:6px;font-size:15px;font-weight:600}.about-card p{color:var(--text-dim);font-size:13px;line-height:1.5}.sso{text-align:center;border-top:1px solid var(--border);padding:24px}.sso p{color:var(--text-dim);font-size:14px}.btn-sso{background:var(--surface2);color:var(--text);font-family:var(--font-mono);letter-spacing:1px;border:1px solid var(--border);border-radius:2px;padding:10px 24px;font-size:13px;text-decoration:none;transition:border-color .15s,color .15s;display:inline-block}.btn-sso:hover{border-color:var(--cyan);color:var(--cyan)}.btn-sso:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}.footer{border-top:1px solid var(--border);font-family:var(--font-mono);color:var(--text-faint);letter-spacing:1px;justify-content:space-between;padding:20px 24px;font-size:11px;display:flex}@media (width<=480px){.footer{text-align:center;flex-direction:column;gap:4px}.hero{padding:40px 16px 32px}.main{padding:24px 12px}.panel-frame{padding:12px}.score-row{flex-wrap:wrap}}