*,::after,::before{box-sizing:border-box;margin:0;padding:0}:root{--bg:#07090f;--bg2:#0d1017;--bg3:#131824;--bg4:#1a2035;--border:#1e2a42;--gold:#c8a951;--gold-dim:#8a7038;--gold-glow:rgba(200,169,81,.18);--text:#d8dde8;--text-dim:#7a8499;--text-muted:#4a5568;--titan:#4a7fc1;--hunter:#5a9f6a;--warlock:#9a6abf;--danger:#c14a4a;--radius:6px;--radius-lg:12px;--shadow:0 4px 24px rgba(0,0,0,.6)}body,html{height:100%;background:var(--bg);color:var(--text);font-family:'Segoe UI',system-ui,sans-serif;font-size:15px;line-height:1.6;overflow-x:hidden}body::before{content:'';position:fixed;inset:0;background-image:url('../../assets/img/background.jpg');background-size:cover;background-position:center top;background-repeat:no-repeat;opacity:.5;pointer-events:none;z-index:0}.login-wrap{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:1.5rem;position:relative;z-index:1}.login-box{width:100%;max-width:380px;background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:2.5rem 2rem;box-shadow:var(--shadow)}.login-logo{text-align:center;margin-bottom:2rem}.login-logo .brand{font-size:1.6rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}.login-logo .sub{font-size:.78rem;letter-spacing:.25em;text-transform:uppercase;color:var(--text-dim);margin-top:.25rem}.form-group{margin-bottom:1.1rem}.form-group label{display:block;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim);margin-bottom:.4rem}input[type=number],input[type=password],input[type=text],select{width:100%;padding:.65rem .9rem;background:var(--bg3);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:.95rem;outline:0;transition:border-color .2s;font-family:inherit}input:focus,select:focus{border-color:var(--gold-dim)}option{background:var(--bg3)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;padding:.65rem 1.2rem;border:none;border-radius:var(--radius);font-size:.9rem;font-weight:600;cursor:pointer;transition:opacity .18s,background .18s;letter-spacing:.04em}.btn:disabled{opacity:.45;cursor:default}.btn-primary{background:var(--gold);color:#0a0b0f;width:100%}.btn-primary:hover:not(:disabled){opacity:.88}.btn-ghost{background:0 0;color:var(--text-dim);border:1px solid var(--border)}.btn-ghost:hover:not(:disabled){border-color:var(--gold-dim);color:var(--gold)}.btn-sm{padding:.4rem .8rem;font-size:.8rem}.login-error{color:var(--danger);font-size:.85rem;text-align:center;margin-top:.8rem;min-height:1.2em}#app{display:flex;flex-direction:column;min-height:100vh;position:relative;z-index:1}.header{display:flex;align-items:center;justify-content:space-between;padding:.9rem 1.8rem;background:var(--bg2);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100}.header-brand{font-size:1.15rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}.header-brand span{color:var(--text-dim);font-weight:400}.header-right{display:flex;align-items:center;gap:.7rem}.app-footer{padding:.55rem 1.8rem;border-top:1px solid var(--border);background:var(--bg2);text-align:right;font-size:.72rem;color:var(--text-muted)}.user-chip{position:relative}.user-menu-btn{display:flex;align-items:center;gap:.45rem;background:0 0;border:1px solid var(--border);border-radius:var(--radius);color:var(--text-dim);font-size:.82rem;font-weight:600;padding:.38rem .7rem;cursor:pointer;transition:border-color .18s,color .18s;white-space:nowrap}.user-menu-btn:hover{border-color:var(--gold-dim);color:var(--gold)}.user-caret{font-size:.65rem;opacity:.7}.user-dropdown{display:none;position:absolute;top:calc(100% + .45rem);right:0;min-width:200px;background:var(--bg3);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow);z-index:300;overflow:hidden;padding:.35rem 0}.user-dropdown.open{display:block}.user-dropdown-item{display:block;width:100%;text-align:left;background:0 0;border:none;padding:.55rem 1rem;font-size:.85rem;color:var(--text-dim);cursor:pointer;transition:background .15s,color .15s}.user-dropdown-item:hover{background:var(--bg4);color:var(--text)}.user-dropdown-item--danger{color:var(--danger)}.user-dropdown-item--danger:hover{background:rgba(193,74,74,.12);color:var(--danger)}.user-dropdown-divider{height:1px;background:var(--border);margin:.35rem 0}.game-tabs{display:flex;gap:0;background:var(--bg2);border-bottom:1px solid var(--border);padding:0 1.8rem}.game-tab{padding:.75rem 1.5rem;font-size:.82rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim);background:0 0;border:none;border-bottom:2px solid transparent;cursor:pointer;transition:color .2s,border-color .2s}.game-tab.active{color:var(--gold);border-bottom-color:var(--gold)}.game-tab:hover:not(.active){color:var(--text)}.main{flex:1;padding:1.8rem;max-width:1300px;width:100%;margin:0 auto}.sync-bar{display:flex;align-items:center;justify-content:space-between;padding:.8rem 1.2rem;background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:1.5rem}.sync-info{font-size:.82rem;color:var(--text-dim)}.sync-info strong{color:var(--text)}.sync-status{font-size:.78rem;color:var(--text-muted);padding:.25rem .65rem;background:var(--bg3);border-radius:20px}.sync-status.running{color:var(--gold);animation:1.4s infinite pulse}.sync-status.ok{color:#5aaf7a}.sync-status.error{color:var(--danger)}@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}.chars-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem;margin-bottom:1.8rem}.char-card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;position:relative;transition:border-color .2s}.char-card:hover{border-color:var(--gold-dim)}.char-banner{height:80px;background:var(--bg3) center/cover no-repeat;position:relative}.char-banner::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.1),rgba(7,9,15,.85))}.char-class-badge{position:absolute;bottom:.6rem;left:.9rem;font-size:.7rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;padding:.2rem .55rem;border-radius:20px;z-index:1}.badge-titan{background:rgba(74,127,193,.25);color:var(--titan);border:1px solid var(--titan)}.badge-hunter{background:rgba(90,159,106,.25);color:var(--hunter);border:1px solid var(--hunter)}.badge-warlock{background:rgba(154,106,191,.25);color:var(--warlock);border:1px solid var(--warlock)}.char-body{padding:.9rem 1rem}.char-light{font-size:2rem;font-weight:700;color:var(--gold);line-height:1}.char-light-label{font-size:.7rem;color:var(--text-muted);letter-spacing:.1em;text-transform:uppercase;margin-bottom:.6rem}.char-meta{display:flex;flex-direction:column;gap:.25rem;margin-top:.5rem}.char-meta-row{display:flex;justify-content:space-between;font-size:.8rem}.char-meta-row .label{color:var(--text-dim)}.char-meta-row .value{color:var(--text);font-weight:500}.progress-bar{display:flex;gap:1rem;margin-bottom:1.8rem;flex-wrap:wrap}.progress-card{flex:1;min-width:180px;background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1rem 1.2rem;display:flex;flex-direction:column;gap:.2rem}.progress-card-label{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}.progress-card-value{font-size:1.7rem;font-weight:700;color:var(--gold);line-height:1.1}.progress-card-sub{font-size:.75rem;color:var(--text-dim);margin-top:.15rem}.empty-state{text-align:center;padding:3rem 1.5rem;color:var(--text-muted)}.empty-state .empty-icon{font-size:2.5rem;margin-bottom:.8rem}.empty-state p{font-size:.9rem}.toast-wrap{position:fixed;bottom:1.5rem;right:1.5rem;display:flex;flex-direction:column;gap:.5rem;z-index:9999}.toast{padding:.7rem 1.1rem;border-radius:var(--radius);font-size:.85rem;font-weight:500;background:var(--bg3);border:1px solid var(--border);color:var(--text);box-shadow:var(--shadow);animation:.2s slideIn;max-width:320px}.toast.success{border-color:#5aaf7a;color:#5aaf7a}.toast.error{border-color:var(--danger);color:var(--danger)}@keyframes slideIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.stats-section{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:1rem;margin-bottom:1.8rem}.stats-group{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1rem 1.2rem}.stats-group-head{font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted);margin-bottom:.75rem;padding-bottom:.5rem;border-bottom:1px solid var(--border)}.stats-group-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.55rem .4rem}.stat-kv{display:flex;flex-direction:column}.stat-kv-v{font-size:.88rem;font-weight:700;color:var(--gold);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stat-kv-k{font-size:.62rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em}.data-section{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1rem 1.2rem;margin-bottom:1.8rem}.dsection-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.6rem;margin-bottom:.9rem;padding-bottom:.6rem;border-bottom:1px solid var(--border)}.dsection-head>span:first-child{font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}.dsection-count{font-size:.7rem;color:var(--text-muted);background:var(--bg3);padding:.1rem .5rem;border-radius:20px}.cat-pills{display:flex;gap:.3rem;flex-wrap:wrap}.cat-pill{padding:.25rem .65rem;font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;background:var(--bg3);border:1px solid var(--border);border-radius:20px;color:var(--text-dim);cursor:pointer;transition:.15s}.cat-pill.active,.cat-pill:hover{border-color:var(--gold-dim);color:var(--gold)}.char-compare-wrap{overflow-x:auto}.char-compare-table{width:100%;border-collapse:collapse;font-size:.82rem}.char-compare-table td,.char-compare-table th{padding:.35rem .7rem;text-align:right;border-bottom:1px solid var(--border)}.char-compare-table td:first-child,.char-compare-table th:first-child{text-align:left;color:var(--text-dim);width:50%}.char-compare-table thead th{font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);background:var(--bg3)}.char-compare-table tbody tr:last-child td{border-bottom:none}.char-compare-table tbody tr:hover td{background:rgba(255,255,255,.02)}.char-compare-table td:not(:first-child){color:var(--gold);font-weight:600}.search-input{padding:.3rem .7rem;background:var(--bg3);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:.8rem;font-family:inherit;outline:0;width:180px;transition:border-color .2s}.search-input:focus{border-color:var(--gold-dim)}.search-input::placeholder{color:var(--text-muted)}.activity-list-head{display:grid;grid-template-columns:1fr 5rem 6rem 4rem;gap:.5rem;padding:.3rem .7rem;font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted)}.activity-list-head span:not(:first-child){text-align:right}.activities-list{max-height:420px;overflow-y:auto;display:flex;flex-direction:column;gap:.2rem}.activity-row{display:grid;grid-template-columns:1fr 5rem 6rem 4rem;gap:.5rem;padding:.4rem .7rem;background:var(--bg3);border-radius:var(--radius);font-size:.82rem;align-items:center;transition:background .15s}.activity-row:hover{background:var(--bg4)}.activity-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text)}.activity-stat{text-align:right;color:var(--text-dim);font-variant-numeric:tabular-nums}.activity-stat.gold{color:var(--gold);font-weight:600}.act-type{font-size:.65rem;color:var(--text-muted);margin-left:.4rem;font-weight:400}.section-empty{padding:1.5rem;text-align:center;font-size:.82rem;color:var(--text-muted)}.raid-summary{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:1rem}.raid-summary-card{background:var(--bg3);border-radius:var(--radius);padding:.5rem .9rem;display:flex;flex-direction:column;gap:.1rem;min-width:9rem}.raid-summary-val{font-size:1.2rem;font-weight:700;color:var(--gold);line-height:1.2}.raid-summary-label{font-size:.65rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted)}.raid-table{width:100%;border-collapse:collapse;font-size:.82rem}.raid-table td,.raid-table th{padding:.4rem .7rem;border-bottom:1px solid var(--border);text-align:right}.raid-table td:first-child,.raid-table th:first-child{text-align:left}.raid-table thead th{font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);background:var(--bg3)}.raid-table tbody tr:last-child td{border-bottom:none}.raid-table tbody tr:hover td{background:rgba(255,255,255,.02)}.raid-table td:not(:first-child){color:var(--gold);font-weight:600}.raid-table td.muted{color:var(--text-dim);font-weight:400}.raid-char-chip{font-size:.68rem;padding:.1rem .45rem;border-radius:20px;font-weight:600}.raid-char-chip.badge-titan{background:rgba(74,127,193,.2);color:var(--titan)}.raid-char-chip.badge-hunter{background:rgba(90,159,106,.2);color:var(--hunter)}.raid-char-chip.badge-warlock{background:rgba(154,106,191,.2);color:var(--warlock)}.metrics-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:.5rem;max-height:420px;overflow-y:auto}.metric-card{background:var(--bg3);border-radius:var(--radius);padding:.6rem .8rem}.metric-card.completed{opacity:.55}.metric-name{font-size:.78rem;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:.3rem}.metric-desc{font-size:.68rem;color:var(--text-muted);margin-bottom:.2rem;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.metric-bar-track{height:3px;background:var(--bg4);border-radius:2px;margin:.3rem 0}.metric-bar-fill{height:100%;background:var(--gold);border-radius:2px;max-width:100%}.metric-bar-fill.done{background:#5aaf7a}.metric-value{font-size:.7rem;color:var(--text-muted);font-variant-numeric:tabular-nums}@media (max-width:600px){.header{padding:.7rem 1rem}.main{padding:1rem}.game-tabs{padding:0 1rem}.activity-list-head,.activity-row{grid-template-columns:1fr 4rem 5rem 3.5rem;font-size:.75rem}.metrics-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}}