@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;600;700&family=Orbitron:wght@400;600;700&family=Share+Tech+Mono&display=swap");*{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0d0d0d;--surface:#1a1a1a;--surface-2:#222222;--border:#2e2e2e;--border-hi:#404040;--gold:#c9a84c;--gold-dim:#8a6e2f;--gold-bright:#f0d080;--accent:#7c4dff;--accent-2:#00e5ff;--hp:#e53935;--hp-lo:#7f1010;--en:#43a047;--en-lo:#1b5e20;--exp:#2979ff;--exp-lo:#0d2b6b;--text:#e0e0e0;--muted:#757575;--muted-2:#4a4a4a;--grade-f:#606060;--grade-e:#808080;--grade-d:#a0a0a0;--grade-c:#5000cc;--grade-b:#8000ff;--grade-a:#a000e5;--grade-s:#bf00cc;--grade-ss:#df00a6;--grade-sss:#ff0080;--grade-ace:#ff3366;--grade-nt:#ff1a1a;--glow-gold:0 0 12px rgba(201,168,76,0.5);--glow-hp:0 0 8px rgba(229,57,53,0.6);--glow-en:0 0 8px rgba(67,160,71,0.6);--panel-bg:linear-gradient(145deg,#1e1e1e,#141414);--metal-edge:linear-gradient(135deg,#3a3a3a,#222 50%,#3a3a3a);--font-ui:"Noto Sans TC","Segoe UI",system-ui,sans-serif;--font-hud:"Orbitron","Share Tech Mono",monospace;--font-mono:"Share Tech Mono",monospace;--ease-mecha:cubic-bezier(0.25,0.46,0.45,0.94);--status-h:188px;--bottom-h:52px;--shell-max-w:480px;--page-max-w:1200px;--route-chip-w:150px}html{font-family:var(--font-ui)}body,html{height:100%}body{background:var(--bg);color:var(--text);background-image:radial-gradient(ellipse at 20% 0,rgba(201,168,76,.03) 0,transparent 50%),radial-gradient(ellipse at 80% 100%,rgba(124,77,255,.03) 0,transparent 50%)}.mecha-shell{display:flex;flex-direction:column;height:100dvh;width:min(100%,var(--shell-max-w));max-width:var(--shell-max-w);margin:0 auto;overflow:hidden}.upper-window{flex:0 0 var(--status-h);overflow-y:auto;background:var(--surface);position:relative;z-index:10}.upper-window:after{content:"";display:block;height:3px;background:linear-gradient(90deg,transparent 0,var(--gold-dim) 20%,var(--gold) 50%,var(--gold-dim) 80%,transparent 100%);box-shadow:0 0 8px rgba(201,168,76,.4)}.mecha-divider{flex:0 0 4px;background:linear-gradient(90deg,transparent 0,var(--gold-dim) 15%,var(--gold) 50%,var(--gold-dim) 85%,transparent 100%);box-shadow:0 0 10px rgba(201,168,76,.35);position:relative}.mecha-divider:after,.mecha-divider:before{content:"";position:absolute;top:50%;transform:translateY(-50%);width:6px;height:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 6px var(--gold)}.mecha-divider:before{left:8px}.mecha-divider:after{right:8px}.lower-window{flex:1 1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;background:var(--bg);padding-bottom:var(--bottom-h)}.status-tab-bar{width:100%;display:flex;overflow-x:auto;gap:2px;padding:0 0 6px;border-bottom:1px solid var(--border);margin-bottom:6px;scrollbar-width:none}.status-tab-bar::-webkit-scrollbar{display:none}.status-tab-bar a{flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:1px;padding:4px 8px;border-radius:4px;border:1px solid transparent;text-decoration:none;color:var(--muted);font-size:.6rem;transition:all .15s}.status-tab-bar a .nav-icon{font-size:.95rem;line-height:1}.status-tab-bar a .nav-label{line-height:1.2}.status-tab-bar a.active{color:var(--gold);border-color:var(--gold-dim);background:rgba(201,168,76,.08)}.status-tab-bar a:hover:not(.active){color:var(--text);background:rgba(255,255,255,.04)}.status-bar{padding:8px 10px 6px}.status-bar-inner{display:flex;align-items:center;gap:10px}.status-bar-mecha{width:52px;height:52px;border:1px solid var(--gold-dim);border-radius:4px;background:var(--surface-2);display:flex;align-items:center;justify-content:center;font-size:1.6rem;flex-shrink:0;position:relative;box-shadow:inset 0 0 8px rgba(0,0,0,.5)}.status-bar-info{flex:1 1;min-width:0;display:flex;flex-direction:column;gap:3px}.status-bar-toprow{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.status-bar-name{font-size:.88rem;font-weight:700;color:var(--gold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status-bar-meta{font-size:.7rem;color:var(--muted);white-space:nowrap}.status-bar-bars{display:flex;flex-direction:column;gap:2px}.status-bar-stats{display:flex;gap:6px;font-size:.66rem;font-family:var(--font-hud);color:var(--muted);flex-wrap:wrap}.status-bar-right{display:flex;flex-direction:column;align-items:flex-end;gap:3px;flex-shrink:0}.status-bar-gold{font-size:.72rem;color:var(--gold-bright);font-family:var(--font-hud);white-space:nowrap}.mecha-bar-wrap{width:100%;height:8px;background:#111;border:1px solid var(--border);border-radius:2px;box-shadow:inset 0 1px 3px rgba(0,0,0,.8)}.mecha-bar-fill,.mecha-bar-wrap{position:relative;overflow:hidden}.mecha-bar-fill{height:100%;border-radius:1px;transition:width .4s var(--ease-mecha)}.mecha-bar-fill:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.18) 50%,transparent);animation:bar-shimmer 2.5s ease-in-out infinite}@keyframes bar-shimmer{0%{transform:translateX(-100%)}to{transform:translateX(200%)}}.mecha-bar-fill.hp{background:linear-gradient(180deg,var(--hp) 0,var(--hp-lo) 100%);box-shadow:var(--glow-hp)}.mecha-bar-fill.hp.critical{animation:bar-pulse-hp .8s ease-in-out infinite alternate}@keyframes bar-pulse-hp{0%{box-shadow:0 0 4px rgba(229,57,53,.4)}to{box-shadow:0 0 16px rgba(229,57,53,.9)}}.mecha-bar-fill.en{background:linear-gradient(180deg,var(--en) 0,var(--en-lo) 100%);box-shadow:var(--glow-en)}.mecha-bar-fill.exp{background:linear-gradient(180deg,var(--exp) 0,var(--exp-lo) 100%)}.mecha-bar-label{display:flex;justify-content:space-between;font-size:.65rem;font-family:var(--font-hud);color:var(--muted);margin-bottom:1px;letter-spacing:.04em}.mecha-bar-label .val{color:var(--text);font-size:.65rem}.grade-label{display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-hud);font-size:.6rem;font-weight:700;letter-spacing:.08em;padding:1px 4px;border-radius:2px;border:1px solid}.grade-label.grade-F{color:var(--grade-f)}.grade-label.grade-E{color:var(--grade-e)}.grade-label.grade-D{color:var(--grade-d)}.grade-label.grade-C{color:var(--grade-c)}.grade-label.grade-B{color:var(--grade-b)}.grade-label.grade-A{color:var(--grade-a)}.grade-label.grade-S{color:var(--grade-s);box-shadow:0 0 4px var(--grade-s)}.grade-label.grade-SS{color:var(--grade-ss);box-shadow:0 0 6px var(--grade-ss)}.grade-label.grade-SSS{color:var(--grade-sss);box-shadow:0 0 8px var(--grade-sss)}.grade-label.grade-ACE{color:var(--grade-ace);box-shadow:0 0 8px var(--grade-ace)}.grade-label.grade-NT{color:var(--grade-nt);text-shadow:0 0 8px var(--grade-nt);box-shadow:0 0 10px var(--grade-nt)}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,var(--shell-max-w));max-width:var(--shell-max-w);z-index:100;display:flex;background:var(--surface);border-top:1px solid var(--border);box-shadow:0 -2px 12px rgba(0,0,0,.6),inset 0 1px 0 rgba(201,168,76,.12)}.bottom-nav a{flex:1 1;text-align:center;font-size:.65rem;color:var(--muted);text-decoration:none;padding:5px 2px;display:flex;flex-direction:column;align-items:center;gap:2px;transition:color .15s;border-top:2px solid transparent}.bottom-nav a .nav-icon{font-size:1.05rem;line-height:1}.bottom-nav a.active{color:var(--gold);border-top-color:var(--gold);background:rgba(201,168,76,.05)}.bottom-nav a:hover:not(.active){color:var(--text)}.action-grid{display:grid;grid-template-columns:1fr 1fr;grid-gap:.5rem;gap:.5rem;padding:.75rem}.action-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:.7rem .5rem;text-align:center;cursor:pointer;text-decoration:none;display:flex;flex-direction:column;align-items:center;gap:3px;transition:border-color .15s,box-shadow .15s;position:relative;overflow:hidden}.action-card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(201,168,76,.06),transparent 60%);opacity:0;transition:opacity .15s}.action-card:hover{border-color:var(--gold-dim);box-shadow:0 0 8px rgba(201,168,76,.2)}.action-card:hover:before{opacity:1}.action-card .action-icon{font-size:1.3rem}.action-card .action-label{font-size:.78rem;font-weight:600;color:var(--text)}.action-card .action-sub{font-size:.65rem;color:var(--muted)}@keyframes panel-appear{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-appear{animation:panel-appear .3s var(--ease-mecha) both}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:.8rem;margin:0 .75rem .6rem}.stat-row{display:flex;justify-content:space-between;align-items:center;padding:.3rem 0;border-bottom:1px solid var(--border);font-size:.82rem}.stat-row:last-child{border-bottom:none}.label{color:var(--muted)}.badge,.value{font-weight:600}.badge{display:inline-block;padding:.12rem .4rem;border-radius:3px;font-size:.68rem}.badge-win{background:#1b5e20;color:#a5d6a7}.badge-lose{background:#b71c1c;color:#ef9a9a}h3{font-size:.88rem;font-weight:600;color:var(--text);margin-bottom:.5rem;padding-bottom:.3rem;border-bottom:1px solid var(--border)}.page-section{width:min(100%,var(--page-max-w));margin:0 auto;padding:.75rem}nav.top-nav{display:flex;gap:.75rem;padding:.6rem 1rem;background:var(--surface);border-bottom:1px solid var(--border);align-items:center}nav.top-nav .logo{font-weight:700;font-size:1rem;color:var(--gold);margin-right:auto;font-family:var(--font-hud);letter-spacing:.05em}nav.top-nav a{color:var(--muted);text-decoration:none;font-size:.85rem}nav.top-nav a:hover{color:var(--text)}@media (min-width:900px){:root{--status-h:220px;--bottom-h:58px;--shell-max-w:1180px;--page-max-w:1120px;--route-chip-w:220px}.status-bar{padding:12px 16px 10px}.status-tab-bar a{font-size:.68rem;padding:6px 10px}.bottom-nav a{font-size:.72rem;padding:7px 4px}.page-section{padding:1rem 1.25rem}.card{margin-left:0;margin-right:0}}:root{--radius:4px;--radius-lg:8px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.5rem 1rem;border-radius:var(--radius);border:1px solid transparent;font-family:var(--font-ui);font-size:.88rem;font-weight:600;cursor:pointer;transition:background .15s,border-color .15s,box-shadow .15s,opacity .15s;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%;margin-bottom:.5rem}.btn:last-child{margin-bottom:0}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,var(--gold-dim) 0,var(--gold) 100%);color:#0d0d0d;border-color:var(--gold);box-shadow:0 0 8px rgba(201,168,76,.25)}.btn-primary:hover:not(:disabled){background:linear-gradient(135deg,var(--gold) 0,var(--gold-bright) 100%);box-shadow:0 0 14px rgba(201,168,76,.5)}.btn-secondary{background:var(--surface-2);color:var(--text);border-color:var(--border-hi)}.btn-secondary:hover:not(:disabled){border-color:var(--gold-dim);color:var(--gold)}.page{padding:.75rem;min-height:100%}input{width:100%;padding:.6rem .75rem;background:var(--bg);border:1px solid var(--border-hi);border-radius:var(--radius);color:var(--text);font-family:var(--font-ui);font-size:.88rem;margin-bottom:.6rem;outline:none;transition:border-color .15s;box-sizing:border-box}input:focus{border-color:var(--gold-dim)}input::placeholder{color:var(--muted)}.faction-page{padding:8px 10px 16px}.faction-header-card{display:flex;align-items:center;gap:12px;margin-bottom:8px}.faction-emblem{font-size:2.2rem;line-height:1}.faction-name{font-size:1.1rem;font-weight:700;color:var(--gold);font-family:var(--font-hud)}.faction-meta{font-size:.72rem;color:var(--muted);margin-top:2px}.faction-my-stats{margin-bottom:12px}.section-title{font-size:.75rem;font-weight:600;color:var(--gold-dim);text-transform:uppercase;letter-spacing:.08em;margin:12px 0 6px}.faction-perks-grid{display:grid;grid-template-columns:1fr 1fr;grid-gap:6px;gap:6px;margin-bottom:4px}.faction-perk-card{background:var(--surface-2);border:1px solid var(--border);border-radius:6px;padding:8px;display:flex;flex-direction:column;gap:2px}.perk-icon{font-size:1rem}.perk-label{font-size:.78rem;font-weight:600;color:var(--text)}.perk-desc{font-size:.65rem;color:var(--muted)}.faction-ranking-card{padding:0}.faction-rank-row{display:grid;grid-template-columns:28px 1fr 48px 72px;align-items:center;padding:7px 10px;border-bottom:1px solid var(--border);font-size:.8rem}.faction-rank-row:last-child{border-bottom:none}.faction-rank-row.rank-first{background:rgba(201,168,76,.06)}.rank-num{color:var(--gold);font-family:var(--font-hud);font-size:.72rem}.rank-name{color:var(--text);font-weight:500}.rank-members{color:var(--muted);font-size:.72rem;text-align:center}.rank-score{color:var(--accent-2);font-family:var(--font-hud);font-size:.72rem;text-align:right}.faction-boss-card{justify-content:space-between}.boss-info,.faction-boss-card{display:flex;align-items:center}.boss-info{gap:10px}.boss-avatar{font-size:1.8rem}.boss-name{font-weight:700;color:var(--gold);font-size:.95rem}.boss-title{font-size:.7rem;color:var(--muted)}.boss-stats{font-size:.72rem;color:var(--muted);display:flex;flex-direction:column;align-items:flex-end;gap:2px}.boss-stats strong{color:var(--text)}.landing-shell{min-height:100dvh;max-width:480px;margin:0 auto;overflow-y:auto;overflow-x:hidden;background:radial-gradient(circle at top,rgba(43,124,255,.2),transparent 28%),linear-gradient(180deg,#061729,#01070d 42%,#000)}.legacy-home{min-height:100dvh;display:flex;align-items:flex-start;justify-content:center;padding:24px 14px 40px;position:relative;overflow:hidden}.legacy-home:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.18;background:repeating-linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.12) 1px,transparent 0,transparent 4px)}.legacy-home-panel{position:relative;z-index:1;width:100%;display:flex;flex-direction:column;align-items:center}.legacy-banner{width:min(100%,400px);height:auto;display:block;border-radius:6px;box-shadow:0 10px 30px rgba(0,0,0,.55),0 0 18px rgba(48,144,255,.35);border:1px solid rgba(120,200,255,.18)}.legacy-home-copy{text-align:center;margin-top:14px}.legacy-home-copy h1{font-size:1.5rem;line-height:1.1;color:#eaf6ff;text-shadow:0 0 12px rgba(88,170,255,.45);letter-spacing:.08em}.legacy-home-copy p{margin-top:6px;font-size:.8rem;color:#b8d5f3;font-family:Georgia,Times New Roman,serif;font-style:italic;letter-spacing:.06em}.legacy-menu{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:8px;margin-top:16px;flex-wrap:wrap}.legacy-menu-link{display:block;transition:transform .16s ease,filter .16s ease}.legacy-menu-link:hover{transform:translateY(-2px);filter:brightness(1.08)}.legacy-menu-image{width:150px;height:40px;display:block;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-user-drag:none}.legacy-home-note{margin-top:20px;padding:10px 12px;width:min(100%,320px);border:1px solid rgba(91,159,230,.22);background:rgba(4,17,32,.72);border-radius:6px;box-shadow:inset 0 0 18px rgba(0,0,0,.35)}.legacy-home-note p{margin:0;text-align:center;font-size:.75rem;color:#b8d5f3;line-height:1.5}