:root{--surface:#0E0E0E;--surface-container-lowest:#0e0e0e;--surface-container-low:#1c1b1b;--surface-container:#20201f;--surface-container-high:#2a2a2a;--surface-container-highest:#353535;--primary:#adc7ff;--primary-container:#4a8eff;--on-primary:#002e68;--on-surface:#e5e2e1;--on-surface-variant:#c1c6d7;--outline-variant:#41475433;--secondary-container:#2a4a5e;--on-secondary-container:#99b9d0;--tertiary:#ddc1ab;--tertiary-container:#a58c7833}*{margin:0;padding:0;box-sizing:border-box}body{background-color:var(--surface);color:var(--on-surface);font-family:'Inter',sans-serif;display:flex;min-height:100vh}.material-symbols-outlined{font-variation-settings:FILL 0,wght 400,GRAD 0,opsz 24;vertical-align:middle}#pageLoader{position:fixed;top:0;left:0;width:100%;height:100%;background:#13131399;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;z-index:9999}.loader-content{text-align:center;color:#fff;font-family:'Inter',sans-serif;font-size:14px}.spinner{width:64px;height:64px;border:2px solid #334155;border-top:2px solid #38bdf8;border-radius:50%;animation:spin 1s ease infinite;margin:0 auto 10px}@keyframes spin{to{transform:rotate(360deg)}}aside{width:256px;height:100vh;position:fixed;left:0;top:0;background:#0e0e0ee6;backdrop-filter:blur(24px);display:flex;flex-direction:column;padding:2rem 0;border-right:1px solid var(--outline-variant);z-index:40}.logo-container{padding:0 2rem;margin-bottom:3rem}.logo-text{font-size:1.25rem;font-weight:800;color:var(--primary)}.user-profile-card{margin:0 1rem 2rem;padding:.75rem;background:var(--surface-container-low);border-radius:var(--radius-xl);display:flex;align-items:center;gap:.75rem;border-radius:12px}.avatar-wrapper{width:40px;height:40px;border-radius:50%;overflow:hidden;background:var(--surface-container-high);border:1px solid var(--outline-variant)}.avatar-wrapper img{width:100%;height:100%;object-fit:cover}.profile-info{display:flex;flex-direction:column}.profile-name{font-size:.875rem;font-weight:500}.profile-status{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:#adc7ffb3}nav{flex:1;padding:0 1rem}.nav-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;text-decoration:none;color:var(--on-surface-variant);font-size:.875rem;font-weight:500;border-radius:.25rem;transition:all .2s;margin-bottom:.5rem}.nav-item:hover{background:var(--surface-container-low);color:var(--on-surface);cursor:pointer}.nav-item.active{background:linear-gradient(to right,#adc7ff1a,transparent);color:var(--primary);border-left:4px solid var(--primary);transform:translateX(4px)}.nav-item.active .material-symbols-outlined{font-variation-settings:FILL 1}.sidebar-footer{padding:0 1.5rem;margin-top:auto}.btn-new-character{width:100%;background:linear-gradient(135deg,var(--primary),var(--primary-container));color:var(--on-primary);padding:.75rem 1rem;border:none;border-radius:.5rem;font-weight:700;font-size:.875rem;cursor:pointer;box-shadow:0 4px 20px #adc7ff33;transition:transform .2s}.btn-new-character:hover{transform:scale(1.02)}.btn-new-character:active{transform:scale(0.95)}.sub-menu{list-style:none;padding-left:2.5rem;margin-top:-.25rem;margin-bottom:.5rem}.sub-menu li{font-size:.75rem;color:var(--on-surface-variant);padding:.5rem 0;cursor:pointer;transition:.25s}.sub-menu li:hover,.sub-menu li.active{color:var(--primary)}main{margin-left:256px;flex:1;display:flex;flex-direction:column}header{height:5rem;padding:0 3rem;background:#13131366;backdrop-filter:blur(12px);display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:30}.ucp-logo{font-size:1.5rem;font-weight:900;letter-spacing:-.05em}.top-nav{display:flex;align-items:center;gap:2rem}.top-nav-links{display:none}@media (min-width: 768px){.top-nav-links{display:flex;gap:1.5rem}}.top-nav-link{text-decoration:none;color:var(--on-surface-variant);font-weight:700;font-size:.875rem;transition:color .2s}.top-nav-link:hover{color:var(--on-surface);cursor:pointer}.top-nav-link.active{color:var(--primary);border-bottom:2px solid var(--primary);padding-bottom:.25rem}.content-container{padding:3rem;width:100%}.welcome-section{margin-bottom:3rem}.welcome-title{font-size:2.25rem;font-weight:800;letter-spacing:-.025em;margin-bottom:.5rem}.welcome-title span{color:var(--primary)}.welcome-subtitle{color:var(--on-surface-variant);max-width:42rem;line-height:1.5}.stats-grid{display:grid;grid-template-columns:repeat(1,1fr);gap:1.5rem;margin-bottom:3rem}@media (min-width: 768px){.stats-grid{grid-template-columns:repeat(4,1fr)}}.stat-card{background:var(--surface-container-low);padding:1.5rem;border-radius:.75rem;position:relative;overflow:hidden;transition:background .2s}.stat-card:hover{background:var(--surface-container)}.stat-icon-bg{position:absolute;right:-1rem;bottom:-1rem;opacity:.05;font-size:5rem!important;transition:opacity .2s}.stat-card:hover .stat-icon-bg{opacity:.1}.stat-label{font-size:10px;text-transform:uppercase;letter-spacing:.2em;color:var(--on-surface-variant);font-weight:700;margin-bottom:1rem}.stat-value-group{display:flex;align-items:flex-end;gap:.5rem}.stat-value{font-size:1.875rem;font-weight:900}.stat-dot{width:.5rem;height:.5rem;border-radius:50%;background:var(--primary);margin-bottom:.5rem}.stat-subtext{font-size:.75rem;color:var(--on-surface-variant);margin-bottom:.5rem}.stat-card .stat-value{word-break:break-all}.stat-card#_accountSerial .stat-value,.stat-card#_accountEmail .stat-value{font-size:1.5rem}#_accountSerial,#_accountEmail{grid-column:span 2}.content-layout{display:grid;grid-template-columns:1fr;gap:2rem}@media (min-width: 1024px){.content-layout{grid-template-columns:2fr 1fr}}.activity-card{background:var(--surface-container-low);border-radius:.75rem;display:flex;flex-direction:column}.card-header{padding:2rem;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--outline-variant)}.card-title{font-size:1.25rem;font-weight:700}.btn-text{padding:16px;font-size:12px;font-weight:700;color:var(--primary);letter-spacing:.1em;background:none;border:none;cursor:pointer}.activity-list{padding:2rem}.activity-item{display:flex;gap:1.5rem;margin-bottom:2rem}.activity-item:last-child{margin-bottom:0}.activity-icon{width:3rem;height:3rem;flex-shrink:0;border-radius:.5rem;display:flex;align-items:center;justify-content:center}.activity-info{flex:1}.activity-meta{display:flex;justify-content:space-between;margin-bottom:.25rem}.activity-subject{font-weight:700}.activity-time{font-size:.75rem;color:var(--on-surface-variant)}.activity-desc{font-size:.875rem;color:var(--on-surface-variant)}.activity-desc span{color:var(--on-surface)}.sidebar-cards{display:flex;flex-direction:column;gap:1rem}.spotlight-card{position:relative;height:280px;border-radius:.75rem;overflow:hidden;background:var(--surface-container-high)}.spotlight-img{position:absolute;inset:0;width:100%;height:100%;top:-2.5rem;object-fit:contain;transition:transform .7s}.spotlight-card:hover .spotlight-img{transform:scale(1.1)}.spotlight-overlay{position:absolute;inset:0;background:linear-gradient(to top,#0e0e0e,#0e0e0e40,transparent)}.spotlight-content{position:absolute;bottom:0;padding:1.5rem;width:100%}.badge{background:#adc7ff33;color:var(--primary);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;padding:.25rem .5rem;border-radius:.25rem;display:inline-block;margin-bottom:.75rem}.spotlight-name{font-size:1.5rem;font-weight:900;color:#fff;line-height:1.2}.spotlight-loc{font-size:.875rem;color:var(--on-surface-variant);margin-bottom:1rem}.btn-outline{width:100%;background:#ffffff1a;backdrop-filter:blur(8px);color:#fff;border:1px solid #fff3;padding:.5rem;border-radius:.5rem;font-size:.75rem;font-weight:700;cursor:pointer;transition:background .2s}.btn-outline:hover{background:#fff3}.status-card{background:var(--surface-container-high);padding:1.5rem;border-radius:.75rem;border:1px solid var(--outline-variant)}.status-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.status-label{font-size:.875rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--on-surface-variant)}.status-indicator{display:flex;align-items:center;gap:.5rem}.dot-pulse{width:.5rem;height:.5rem;border-radius:50%;animation:pulse 1s infinite}@keyframes pulse{0%{opacity:1}50%{opacity:.4}100%{opacity:1}}.status-text{font-size:10px;font-weight:700;text-transform:uppercase}.player-count{display:flex;flex-direction:column}.count-val{font-size:1.5rem;font-weight:900}.count-label{font-size:.75rem;color:var(--on-surface-variant)}.progress-bar{margin-top:1.5rem;height:4px;width:100%;background:var(--surface-container);border-radius:2px;overflow:hidden}.progress-fill{height:100%;background:var(--primary)}footer{margin-top:auto;width:100%;padding:3rem 0;border-top:1px solid var(--outline-variant);background:var(--surface-container-lowest);display:flex;flex-direction:column;align-items:center;gap:1.5rem}.footer-logo{font-size:1.125rem;font-weight:700}.footer-links{display:flex;gap:2rem}.footer-link{font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--on-surface-variant);text-decoration:none;opacity:.8;transition:all .2s}.footer-link:hover{color:var(--primary);opacity:1}.copyright{font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--on-surface-variant);opacity:.6}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:#0e0e0e}::-webkit-scrollbar-thumb{background:#414754;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#adc7ff}