:root{color:#152034;background:#f7fbff;font-family:Inter,Segoe UI,Microsoft YaHei,Arial,sans-serif;--bg: #f7fbff;--panel: rgba(255, 255, 255, .88);--panel-strong: #ffffff;--line: #dbe6f5;--line-strong: #b8cdf0;--text: #152034;--muted: #62708b;--blue: #2368ff;--blue-2: #4f8bff;--green: #12ad7d;--gold: #c98d2e;--red: #e8546a;--shadow: 0 18px 45px rgba(42, 79, 138, .11)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;-webkit-font-smoothing:antialiased;background:radial-gradient(circle at 14% -10%,rgba(68,137,255,.18),transparent 28%),linear-gradient(180deg,#fbfdff 0%,var(--bg) 48%,#f2f8ff 100%)}button{border:0;font:inherit}img{display:block}.app-shell{min-height:100vh}.topbar{position:sticky;top:0;z-index:10;display:grid;grid-template-columns:260px 1fr 350px;align-items:center;gap:18px;height:72px;padding:0 22px;border-bottom:1px solid rgba(190,206,230,.72);background:#ffffffd6;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.brand{display:flex;align-items:center;gap:12px}.brand-mark{display:grid;place-items:center;width:48px;height:42px;border-radius:8px;color:#fff;font-weight:900;letter-spacing:0;background:linear-gradient(145deg,#0d62ff,#57a0ff);box-shadow:0 10px 24px #2368ff38}.brand strong,.brand span{display:block}.brand strong{font-size:19px}.brand span{margin-top:2px;color:var(--muted);font-size:13px}.nav-tabs{display:flex;justify-content:center;gap:12px}.nav-tabs button,.sync-button,.icon-button,.panel-link,.chip,.tier-tabs button,.secondary-button,.primary-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;color:var(--muted);background:transparent;cursor:pointer}.nav-tabs button{flex:0 0 auto;min-width:118px;height:40px;border-radius:999px;font-weight:700;white-space:nowrap}.nav-tabs button.active{color:var(--blue);border:1px solid #c9dcff;background:#edf5ff}.top-actions{display:flex;justify-content:flex-end;align-items:center;gap:10px}.sync-button{height:38px;padding:0 12px;border:1px solid var(--line);border-radius:999px;background:#fff}.icon-button{width:38px;height:38px;border:1px solid var(--line);border-radius:50%;background:#fff}.mini-profile{display:flex;align-items:center;gap:9px;min-width:118px;font-weight:700}.mini-profile img{width:34px;height:34px;border-radius:50%;object-fit:cover}.dashboard{display:grid;grid-template-columns:310px minmax(680px,1fr) 390px;gap:16px;width:min(1800px,calc(100vw - 36px));margin:18px auto 32px}.left-rail,.right-rail,.center-stage{display:flex;flex-direction:column;gap:16px}.panel,.profile-hero{border:1px solid var(--line);border-radius:8px;background:var(--panel);box-shadow:var(--shadow)}.panel{padding:18px}.panel-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:15px}.panel-title h2{margin:0;color:var(--text);font-size:18px;line-height:1.2}.panel-link{color:var(--blue);font-size:13px;font-weight:700}.account-list{display:grid;gap:12px}.account-card{position:relative;display:grid;grid-template-columns:48px 1fr 26px;align-items:center;gap:12px;min-height:86px;padding:12px;border:1px solid var(--line);border-radius:8px;color:var(--text);text-align:left;background:#fff;cursor:pointer}.account-card.selected{border-color:var(--blue);box-shadow:inset 0 0 0 1px var(--blue),0 12px 24px #2368ff1f}.avatar-frame{position:relative;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;overflow:hidden;color:var(--blue);background:#eef5ff}.avatar-frame img{width:100%;height:100%;object-fit:cover}.avatar-frame i{position:absolute;right:2px;bottom:2px;width:12px;height:12px;border:2px solid #fff;border-radius:50%}.avatar-frame i.online{background:var(--green)}.avatar-frame i.offline{background:#b9c2d3}.account-copy strong,.account-copy em,.account-copy small{display:block}.account-copy strong{font-size:15px}.account-copy em{margin-top:3px;overflow:hidden;color:#26354f;font-size:14px;font-style:normal;text-overflow:ellipsis;white-space:nowrap}.account-copy small{margin-top:5px;color:var(--muted);font-size:12px}.account-actions button{display:grid;place-items:center;width:26px;height:26px;border-radius:7px;color:var(--muted);background:#eef4ff;cursor:pointer}.qr-shell{display:grid;place-items:center;min-height:226px;padding:14px;border:1px solid var(--line);border-radius:8px;background:#fff}.qr-shell img{width:198px;height:198px;object-fit:contain}.qr-empty{display:grid;place-items:center;gap:9px;width:198px;height:198px;border:1px dashed #b7c9e9;border-radius:8px;color:var(--blue);font-weight:700;background:#f7fbff;cursor:pointer}.auto-sync{display:flex;align-items:center;justify-content:center;gap:8px;margin:14px 0 12px;color:var(--muted);font-size:13px}.primary-button,.secondary-button{width:100%;height:38px;border-radius:8px;font-weight:800}.primary-button{color:#fff;background:linear-gradient(135deg,#1e66ff,#4c91ff);box-shadow:0 12px 22px #2368ff38}.secondary-button{color:var(--blue);border:1px solid #bdd3fb;background:#f2f7ff}.muted{margin:12px 0 0;color:var(--muted);font-size:12px;line-height:1.6}.profile-hero{display:grid;grid-template-columns:80px 1fr auto;align-items:center;gap:16px;min-height:126px;padding:20px;background:linear-gradient(135deg,#fffffff0,#eef6ffe6)}.hero-avatar{display:grid;place-items:center;width:80px;height:80px;border:1px solid #c8d9f5;border-radius:50%;color:var(--blue);background:#eef5ff;overflow:hidden}.hero-avatar img{width:100%;height:100%;object-fit:cover}.hero-name-line{display:flex;align-items:center;gap:10px}.hero-name-line h1{margin:0;font-size:clamp(26px,3vw,34px);letter-spacing:0;line-height:1.1}.gender{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:999px;color:var(--blue);font-size:12px;font-weight:800;background:#e7f0ff}.hero-copy p{margin:8px 0 0;color:var(--muted)}.meta-row,.hero-medals{display:flex;flex-wrap:wrap;gap:8px;margin-top:11px}.meta-row span,.hero-medals span{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border:1px solid var(--line);border-radius:999px;color:#33415e;font-size:12px;background:#fff}.hero-medals{justify-content:flex-end;min-width:230px;margin-top:0}.hero-medals img{width:18px;height:18px;border-radius:50%}.split-grid{display:grid;grid-template-columns:minmax(260px,.9fr) minmax(320px,1.1fr);gap:16px}.radar-wrap{position:relative;display:grid;place-items:center;min-height:260px}.radar-wrap svg{width:245px;max-width:100%}.radar-grid{fill:#5089ff0f;stroke:#d4e3fa;stroke-width:1}.radar-shape{fill:#2368ff38;stroke:#2368ff;stroke-width:3}.radar-wrap text{fill:var(--muted);font-size:12px;text-anchor:middle}.radar-score{position:absolute;display:grid;place-items:center;width:92px;height:70px;border-radius:8px;background:#ffffffc2}.radar-score strong{color:var(--blue);font-size:28px;line-height:1}.radar-score span{color:var(--muted);font-size:12px}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.stats-grid.game{grid-template-columns:repeat(2,minmax(0,1fr))}.stats-grid.compact{grid-template-columns:repeat(4,minmax(0,1fr))}.stat{min-height:92px;padding:15px 12px;border:1px solid var(--line);border-radius:8px;background:#fff}.stat strong{display:block;color:var(--text);overflow-wrap:anywhere;font-size:clamp(18px,2vw,27px);line-height:1}.stat span{display:block;margin-top:9px;color:var(--muted);font-size:13px}.source-note{display:flex;align-items:center;gap:8px;margin-top:14px;padding:12px;border-radius:8px;color:#2b6c9d;background:#eef8ff;font-size:13px}.pending-strip{display:flex;align-items:center;gap:14px;min-height:96px;padding:18px;border:1px solid #d8e5f7;border-radius:8px;color:#365071;background:linear-gradient(135deg,#f7fbff,#fff)}.pending-strip svg{color:var(--blue)}.pending-strip strong{display:block;margin-bottom:6px}.pending-strip p{margin:0;color:var(--muted);line-height:1.6}.chip-row,.tier-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}.chip,.tier-tabs button{height:28px;padding:0 13px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:12px}.chip.active,.tier-tabs button.active{color:var(--blue);border-color:#bdd3fb;background:#edf5ff}.hero-grid{display:grid;grid-template-columns:repeat(5,minmax(86px,1fr));gap:12px}.hero-card{min-width:0;padding:10px;border:1px solid var(--line);border-radius:8px;text-align:center;background:#fff}.hero-card img{width:100%;aspect-ratio:1;border-radius:8px;object-fit:cover}.hero-card strong{display:block;margin-top:8px;overflow:hidden;font-size:13px;text-overflow:ellipsis;white-space:nowrap}.hero-card span{display:block;margin-top:4px;color:var(--muted);font-size:12px}.online-summary{display:flex;align-items:center;gap:10px;margin-bottom:12px}.online-summary span{font-size:22px;font-weight:900}.online-summary small{color:var(--muted)}.empty-state{display:grid;place-items:center;gap:8px;min-height:186px;padding:22px;border:1px dashed #bfd0ea;border-radius:8px;color:var(--muted);text-align:center;background:#fbfdff}.empty-state strong{color:var(--text)}.empty-state p{max-width:270px;margin:0;font-size:13px;line-height:1.6}.friend-list{display:grid;gap:10px}.friend-row{display:grid;grid-template-columns:42px 1fr 56px;align-items:center;gap:10px}.friend-row img{width:42px;height:42px;border-radius:8px;object-fit:cover}.friend-row strong,.friend-row span{display:block}.friend-row span{color:var(--green);font-size:12px}.friend-row button{height:28px;border:1px solid #bdd3fb;border-radius:999px;color:var(--blue);background:#f2f7ff;cursor:pointer}.tier-head{display:flex;align-items:center;gap:7px;margin-bottom:10px;color:var(--muted);font-size:13px}.tier-list{display:grid;gap:8px}.tier-row{display:grid;grid-template-columns:42px 1fr;align-items:center;gap:10px;min-height:46px}.tier-row strong{display:grid;place-items:center;height:36px;border-radius:8px;color:#7b5015;background:#fff1d8}.tier-row:nth-child(2) strong{color:#167249;background:#def8ed}.tier-row:nth-child(3) strong{color:#256b8e;background:#e2f5ff}.tier-row:nth-child(4) strong{color:#6a6372;background:#edf0f6}.tier-row div{display:flex;gap:7px}.mini-heroes img{width:36px;height:36px;border-radius:8px;object-fit:cover}.tier-chip,.tier-pending{display:inline-flex;align-items:center;min-height:32px;padding:0 10px;border:1px dashed #c8d7ef;border-radius:8px;color:var(--muted);background:#fbfdff;font-size:12px}.moment-list,.notice-list{display:grid;gap:10px}.moment-list article,.notice-list div{padding:12px;border:1px solid var(--line);border-radius:8px;background:#fff}.moment-list strong,.notice-list strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.moment-list p,.notice-list em{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:7px 0;overflow:hidden;color:var(--muted);font-size:13px;font-style:normal;line-height:1.5}.moment-list span,.notice-list span{color:var(--blue);font-size:12px;font-weight:800}.recommend-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:12px}.recommend-grid>div{padding:14px;border:1px solid var(--line);border-radius:8px;background:#fff}.recommend-grid strong{display:block;margin-bottom:8px;color:#168b66}.recommend-grid p{margin:0 0 12px;color:var(--muted);font-size:13px;line-height:1.6}.recommend-grid button{height:30px;padding:0 12px;border-radius:8px;color:var(--blue);background:#edf5ff;cursor:pointer}.mini-heroes{display:flex;gap:8px}.sync-orbit{display:grid;place-items:center;width:110px;height:110px;margin:4px auto 14px;border:12px solid #e6f0ff;border-top-color:#69a5ff;border-radius:50%;color:var(--green)}.sync-orbit+p{color:var(--muted);text-align:center}.progress-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.progress-list span{display:flex;align-items:center;gap:8px;min-height:40px;padding:0 10px;border:1px solid var(--line);border-radius:8px;color:var(--muted);background:#fff;font-size:13px}.progress-list span.done{color:#167249;border-color:#bee9d9;background:#ecfbf5}.empty-main{display:grid;place-items:center;min-height:680px;padding:40px;border:1px dashed #bfd0ea;border-radius:8px;color:var(--muted);text-align:center;background:#ffffffbf}.empty-main svg{color:var(--blue)}.empty-main h1{margin:18px 0 8px;color:var(--text)}.empty-main p{max-width:470px;margin:0;line-height:1.7}.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:1380px){.topbar{grid-template-columns:230px 1fr 280px}.dashboard{grid-template-columns:280px minmax(570px,1fr) 330px;width:calc(100vw - 24px)}.hero-grid{grid-template-columns:repeat(4,minmax(80px,1fr))}}@media(max-width:1120px){.topbar{position:static;grid-template-columns:1fr;height:auto;padding:14px}.nav-tabs{justify-content:flex-start;overflow-x:auto}.top-actions{justify-content:flex-start}.dashboard{grid-template-columns:1fr}.left-rail,.right-rail{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:760px){.dashboard{width:calc(100vw - 18px);margin-top:10px}.left-rail,.right-rail,.split-grid,.recommend-grid,.profile-hero{grid-template-columns:1fr}.profile-hero{justify-items:start}.hero-medals{justify-content:flex-start;min-width:0}.stats-grid{grid-template-columns:repeat(2,1fr)}.hero-grid{grid-template-columns:repeat(3,minmax(76px,1fr))}.nav-tabs button{min-width:90px;padding:0 12px}}