:root{--bg-0: #07111f;--bg-1: #0b1e33;--bg-2: #122c47;--glass: rgba(18, 44, 71, .55);--glass-brd: rgba(120, 190, 240, .18);--txt: #e7f2ff;--txt-dim: #9bb6cf;--accent: #4fc3f7;--gold: #ffd76a;--good: #6ee7a8;--warn: #ff8a8a;--shadow: 0 8px 30px rgba(0, 0, 0, .35)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{margin:0;height:100%;width:100%;overflow:hidden;background:radial-gradient(circle at 50% 50%,#73d18c,#57c7bd,#4da9d9,#4d80d1,#dbf0ff);color:var(--txt);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;user-select:none;-webkit-user-select:none}#root{display:flex;flex-direction:column}.topbar{display:flex;gap:8px;padding:8px 10px;flex-wrap:wrap;align-items:center;background:var(--glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--glass-brd);z-index:5}.stat{display:flex;flex-direction:column;min-width:78px;padding:4px 10px;border-radius:12px;background:#ffffff0a;border:1px solid var(--glass-brd)}.stat .label{font-size:11px;color:var(--txt-dim)}.stat .value{font-size:16px;font-weight:700;font-variant-numeric:tabular-nums}.stamina-wrap{flex:1 1 160px;min-width:150px}.bar{height:10px;border-radius:6px;background:#ffffff14;overflow:hidden;margin-top:4px}.bar>i{display:block;height:100%;border-radius:6px;transition:width .2s linear}.bar.stamina>i{background:linear-gradient(90deg,#6ee7a8,#4fc3f7)}.bar.cd>i{background:linear-gradient(90deg,#ffd76a,#ff9d5c)}.stage{position:relative;flex:1 1 auto;min-height:0}#game-canvas{position:absolute;top:0;right:0;bottom:0;left:0}.sidepanel{position:absolute;top:10px;right:10px;width:280px;max-height:calc(100% - 20px);overflow-y:auto;padding:12px;border-radius:16px;background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--glass-brd);box-shadow:var(--shadow);z-index:4}.sidepanel h3{margin:14px 0 6px;font-size:13px;color:var(--accent);letter-spacing:1px}.sidepanel h3:first-child{margin-top:0}.btn{display:block;width:100%;margin:4px 0;padding:9px 12px;border:1px solid var(--glass-brd);border-radius:10px;background:#4fc3f71f;color:var(--txt);font-size:13px;font-weight:600;cursor:pointer;transition:.15s}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn .sub{font-size:11px;color:var(--txt-dim);font-weight:400}.row{display:flex;justify-content:space-between;font-size:12px;padding:3px 0;border-bottom:1px dashed rgba(255,255,255,.06)}.row .k{color:var(--txt-dim)}.row .v{font-weight:600}.tag{display:inline-block;font-size:10px;padding:1px 6px;border-radius:6px;margin-left:4px}.tag.dual{background:#ffd76a33;color:var(--gold)}.tag.single{background:#78bef02e;color:var(--accent)}.log{position:absolute;left:10px;bottom:10px;width:250px;max-height:38%;overflow:hidden;padding:10px 12px;border-radius:14px;background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--glass-brd);font-size:12px;z-index:4;pointer-events:none}.log .line{padding:2px 0;color:var(--txt-dim);animation:fade .3s}.log .line b{color:var(--txt)}@keyframes fade{0%{opacity:0;transform:translateY(4px)}}.modal-mask{position:absolute;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:20;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal{width:min(86vw,360px);padding:22px;border-radius:18px;background:linear-gradient(180deg,var(--bg-2),var(--bg-1));border:1px solid var(--glass-brd);box-shadow:var(--shadow);text-align:center}.modal h2{margin:0 0 10px;color:var(--gold)}.modal p{color:var(--txt-dim);font-size:13px;line-height:1.7}.modal .big{font-size:26px;font-weight:800;color:var(--txt);margin:8px 0}@media (max-width: 640px){.sidepanel{top:auto;bottom:10px;right:10px;left:10px;width:auto;max-height:42%}.log{display:none}.stat{min-width:64px}.stat .value{font-size:14px}}.login-screen{display:grid;place-items:center;height:100%;padding:20px}.login-card{width:min(92vw,360px);padding:28px 24px;border-radius:20px;background:var(--glass);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--glass-brd);box-shadow:var(--shadow);text-align:center}.login-card h1{margin:0;font-size:26px;color:var(--gold);letter-spacing:2px}.login-card .sub{margin:6px 0 18px;color:var(--txt-dim);font-size:13px}.login-card form{display:flex;flex-direction:column;gap:10px}.login-input{width:100%;padding:12px 14px;border-radius:12px;border:1px solid var(--glass-brd);background:#00000040;color:var(--txt);font-size:14px;outline:none}.login-input:focus{border-color:var(--accent)}.login-btn{margin-top:6px;padding:12px;border:none;border-radius:12px;background:linear-gradient(90deg,#4fc3f7,#6ee7a8);color:#06203a;font-size:15px;font-weight:800;cursor:pointer}.login-btn:active{transform:scale(.98)}.login-error{color:var(--warn);font-size:12px;text-align:left}.login-switch{margin-top:14px;font-size:12px;color:var(--accent);cursor:pointer}.login-alt{margin-top:16px;display:flex;align-items:center;justify-content:center;gap:10px;font-size:13px}.login-link{background:none;border:none;color:var(--accent);font-size:13px;cursor:pointer;padding:4px 2px;text-decoration:underline;text-underline-offset:3px}.login-link:active{opacity:.7}.login-sep{color:var(--txt-dim)}.register-card{position:relative;text-align:center}.register-card .login-input{margin-bottom:10px}.register-card form{display:flex;flex-direction:column;gap:4px;margin-top:14px}.modal-close{position:absolute;top:12px;right:14px;width:28px;height:28px;border:none;border-radius:50%;background:#ffffff14;color:var(--txt);font-size:18px;line-height:1;cursor:pointer}.modal-close:active{transform:scale(.94)}.btn-logout{margin-top:4px;padding:5px 12px;border:1px solid var(--glass-brd);border-radius:10px;background:#ff8a8a1f;color:var(--txt);font-size:12px;cursor:pointer}.btn-logout:active{transform:scale(.97)}