:root{
  --bg:#0d1117;
  --surface:#161b22;
  --surface-2:#1c2333;
  --border:rgba(255,255,255,0.08);
  --muted:#c9d1d9;
  --muted-2:#8b949e;
  --accent:#58a6ff;
  --accent-2:#79c0ff;
  --success:#238636;
  --danger:#da3633;
  --warn:#d29922;
  --radius:10px;
  font-family:Inter,system-ui,-apple-system,'Segoe UI',sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%;background:var(--bg);color:var(--muted)}
a{color:inherit}

.topnav{display:flex;align-items:center;justify-content:space-between;padding:14px 32px;border-bottom:1px solid var(--border);background:var(--surface);position:sticky;top:0;z-index:10}
.topnav-brand{font-size:1.15rem;font-weight:700;color:#fff;letter-spacing:-0.02em;text-decoration:none;display:flex;align-items:center;gap:8px}
.topnav-brand .dot{width:8px;height:8px;border-radius:50%;background:#3fb950;box-shadow:0 0 6px rgba(63,185,80,0.7);display:inline-block}
.topnav-links{display:flex;align-items:center;gap:10px}
.topnav-links a{color:var(--muted-2);text-decoration:none;font-size:0.85rem;font-weight:500;padding:6px 12px;border-radius:8px;border:1px solid var(--border);transition:color 120ms,background 120ms,border-color 120ms}
.topnav-links a:hover{color:var(--muted);background:rgba(255,255,255,0.04)}
.topnav-links a.cta{color:#fff;background:#1f6feb;border-color:#1f6feb;font-weight:600}
.topnav-links a.cta:hover{background:#388bfd;border-color:#388bfd}
.topnav-links a.chat-nav{color:#fff;background:#238636;border-color:#238636;font-weight:600;display:flex;align-items:center;gap:7px}
.topnav-links a.chat-nav:hover{background:#2ea043;border-color:#2ea043}
.topnav-links a.chat-nav .live-dot{width:7px;height:7px;border-radius:50%;background:#4ade80;box-shadow:0 0 5px rgba(74,222,128,0.8);flex-shrink:0}

.page{display:grid;grid-template-columns:240px 1fr;min-height:calc(100vh - 57px);max-width:1200px;margin:0 auto}
.page-wide{max-width:1400px}
.page-auth{grid-template-columns:1fr 380px;gap:40px;padding:40px 32px;align-items:start}
.page-register{grid-template-columns:1fr 420px;gap:40px;padding:40px 32px;align-items:start;max-width:1100px}

.sidebar{border-right:1px solid var(--border);padding:24px 0;position:sticky;top:57px;height:calc(100vh - 57px);overflow-y:auto;scrollbar-width:none}
.sidebar::-webkit-scrollbar{display:none}
.sidebar-section{padding:0 14px;margin-bottom:24px}
.sidebar-label{font-size:0.7rem;font-weight:600;text-transform:uppercase;letter-spacing:0.1em;color:var(--muted-2);padding:0 8px;margin-bottom:8px}
.nav-link{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:8px;color:var(--muted-2);text-decoration:none;font-size:0.875rem;font-weight:500;transition:background 100ms,color 100ms,border-color 100ms;margin-bottom:2px}
.nav-link svg{flex-shrink:0;opacity:0.8}
.nav-link:hover{background:rgba(255,255,255,0.04);color:var(--muted)}
.nav-link.active{background:rgba(88,166,255,0.1);color:var(--accent)}
.nav-link.active svg{opacity:1}
.nav-link.chat-cta{background:rgba(35,134,54,0.18);color:#4ade80;border:1px solid rgba(74,222,128,0.2);font-weight:700;margin:6px 0 4px}
.nav-link.chat-cta svg{color:#4ade80;opacity:1}
.nav-link.chat-cta:hover{background:rgba(35,134,54,0.32);color:#6ee77a;border-color:rgba(74,222,128,0.38)}
.chat-cta-arrow{margin-left:auto;opacity:0.7;font-size:0.8rem}

.user-card{margin:0 14px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);padding:12px 14px}
.user-card-label{font-size:0.7rem;font-weight:600;text-transform:uppercase;letter-spacing:0.1em;color:var(--muted-2);margin-bottom:8px}
.user-name{font-size:0.9rem;font-weight:700;color:#fff}
.user-rank{font-size:0.8rem;color:var(--muted-2);margin-top:4px}
.user-rank a{color:var(--accent);text-decoration:none}
.user-rank a:hover{text-decoration:underline}

.main-content{padding:28px 32px}
.page-heading{margin-bottom:18px}
.page-heading h1{font-size:1.3rem;font-weight:700;color:#fff;margin-bottom:4px}
.page-heading p{font-size:0.85rem;color:var(--muted-2)}
.page-footer{padding:20px 32px;text-align:center;font-size:0.78rem;color:var(--muted-2);border-top:1px solid var(--border);max-width:1200px;margin:0 auto}
.page-footer.page-footer-wide{max-width:1400px}

.btn,.btn-signin,.btn-register{display:inline-flex;align-items:center;justify-content:center;padding:9px 14px;border-radius:8px;border:1px solid var(--border);background:var(--surface-2);color:var(--muted);font-weight:600;text-decoration:none;transition:background 120ms,border-color 120ms;cursor:pointer}
.btn:hover,.btn-signin:hover,.btn-register:hover{background:rgba(255,255,255,0.04);border-color:rgba(255,255,255,0.14)}
.btn-primary,.btn-signin,.btn-register{background:#1f6feb;border-color:#1f6feb;color:#fff}
.btn-primary:hover,.btn-signin:hover,.btn-register:hover{background:#388bfd;border-color:#388bfd;color:#fff}
.btn-secondary{background:var(--surface-2);color:var(--muted)}
.btn-danger{background:#da3633;border-color:#da3633;color:#fff}
.btn-danger:hover{background:#f85149;border-color:#f85149;color:#fff}

.panel,.auth-card,.news-card,.profile-card,.bio-card,.hero-card,.form-card,.progress-card,.empty-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}
.panel,.bio-card,.form-card,.progress-card,.empty-card{padding:22px}
.hero-card,.profile-card{padding:22px}
.panel h2,.panel h3,.card-header h2,.progress-title,.bio-title{color:#fff}
.panel h2,.panel h3,.card-header h2{margin-bottom:8px}
.panel p,.muted{color:var(--muted-2)}

.input,.textarea,.form-row input,.field textarea,.field input,.mod-admin-row input,input[type="text"],input[type="email"],input[type="password"],textarea{width:100%;padding:10px 12px;border-radius:8px;border:1px solid var(--border);background:var(--surface-2);color:var(--muted);outline:none;transition:border-color 140ms}
.input:focus,.textarea:focus,.form-row input:focus,.field textarea:focus,.field input:focus,input[type="text"]:focus,input[type="email"]:focus,input[type="password"]:focus,textarea:focus{border-color:var(--accent)}
.input::placeholder,.textarea::placeholder,.form-row input::placeholder,.field textarea::placeholder{color:var(--muted-2)}

.table-wrap{overflow:auto;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}
table,.bridge-table{width:100%;border-collapse:collapse;background:transparent}
th,td,.bridge-table th,.bridge-table td{padding:10px 12px;text-align:left;border-bottom:1px solid rgba(255,255,255,0.06);font-size:0.84rem;vertical-align:top}
th,.bridge-table th{font-size:0.75rem;text-transform:uppercase;letter-spacing:0.08em;color:var(--muted-2);background:rgba(255,255,255,0.02)}
tbody tr:hover,.bridge-table tbody tr:hover{background:rgba(255,255,255,0.03)}

.hero{display:flex;flex-direction:column;gap:24px}
.hero-kicker{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:rgba(88,166,255,0.08);border:1px solid rgba(88,166,255,0.16);font-size:0.78rem;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;color:var(--accent);margin-bottom:14px}
.hero-headline{font-size:2.4rem;font-weight:800;color:#fff;letter-spacing:-0.04em;line-height:1.15;margin-bottom:12px}
.hero-headline span{color:var(--accent)}
.hero-sub{color:var(--muted-2);font-size:1rem;line-height:1.6;max-width:480px}
.features{display:flex;flex-wrap:wrap;gap:10px;list-style:none;margin-top:8px}
.features li{display:flex;align-items:center;gap:6px;background:var(--surface);border:1px solid var(--border);padding:7px 14px;border-radius:999px;font-size:0.82rem;color:var(--muted-2)}
.features li::before{content:'✓';color:var(--accent);font-weight:700;font-size:0.75rem}

.hero-graphic{position:relative;min-height:220px;border:1px solid var(--border);border-radius:22px;background:radial-gradient(circle at top left, rgba(88,166,255,0.16), transparent 36%),linear-gradient(145deg, rgba(28,35,51,0.95), rgba(13,17,23,0.98));overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,0.04),0 20px 50px rgba(0,0,0,0.25)}
.hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(121,192,255,0.08) 1px, transparent 1px),linear-gradient(90deg, rgba(121,192,255,0.08) 1px, transparent 1px);background-size:30px 30px;mask-image:linear-gradient(to bottom, rgba(0,0,0,0.95), rgba(0,0,0,0.25));opacity:0.55}
.hero-graphic-glow{position:absolute;border-radius:999px;filter:blur(12px);opacity:0.85}
.hero-graphic-glow-a{width:180px;height:180px;background:rgba(88,166,255,0.18);top:-28px;left:-10px}
.hero-graphic-glow-b{width:110px;height:110px;background:rgba(63,185,80,0.18);right:40px;bottom:34px}
.hero-graphic-panel{position:absolute;border:1px solid rgba(255,255,255,0.08);background:rgba(13,17,23,0.74);backdrop-filter:blur(8px);border-radius:18px;box-shadow:0 14px 30px rgba(0,0,0,0.22)}
.hero-graphic-panel-main{left:28px;bottom:26px;width:240px;padding:18px 18px 16px}
.hero-graphic-panel-side{top:28px;right:30px;width:118px;height:132px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}
.panel-label{font-size:0.72rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--muted-2);margin-bottom:12px}
.signal-bars{height:96px;display:grid;grid-template-columns:repeat(6,1fr);align-items:end;gap:8px}
.signal-bars span{display:block;width:100%;border-radius:999px 999px 0 0;background:linear-gradient(180deg, var(--accent-2), var(--accent));box-shadow:0 0 16px rgba(88,166,255,0.22)}
.signal-bars span:nth-child(1){height:32%}
.signal-bars span:nth-child(2){height:54%}
.signal-bars span:nth-child(3){height:76%}
.signal-bars span:nth-child(4){height:48%}
.signal-bars span:nth-child(5){height:88%}
.signal-bars span:nth-child(6){height:62%}
.signal-caption{margin-top:12px;font-size:0.8rem;line-height:1.45;color:var(--muted-2)}
.mini-ring{width:44px;height:44px;border-radius:50%;border:2px solid rgba(88,166,255,0.45);box-shadow:0 0 0 10px rgba(88,166,255,0.06),0 0 18px rgba(88,166,255,0.12) inset;position:relative}
.mini-ring::after{content:'';position:absolute;inset:10px;border-radius:50%;background:linear-gradient(135deg, rgba(88,166,255,0.92), rgba(63,185,80,0.9))}
.mini-lines{display:flex;flex-direction:column;gap:7px;width:66px}
.mini-lines span{height:6px;border-radius:999px;background:linear-gradient(90deg, rgba(121,192,255,0.88), rgba(63,185,80,0.7))}
.mini-lines span:nth-child(2){width:80%}
.mini-lines span:nth-child(3){width:56%}
.hero-orbit{position:absolute;border-radius:50%;border:1px solid rgba(121,192,255,0.16)}
.hero-orbit-a{width:240px;height:240px;right:-42px;top:-34px}
.hero-orbit-b{width:320px;height:320px;right:-86px;top:-70px}
.hero-node{position:absolute;width:10px;height:10px;border-radius:50%;box-shadow:0 0 0 6px rgba(255,255,255,0.04)}
.hero-node-a{top:56px;right:98px;background:#79c0ff}
.hero-node-b{top:118px;right:198px;background:#3fb950}
.hero-node-c{bottom:48px;right:92px;background:#58a6ff}

.news-card{overflow:hidden}.news-card-header{padding:12px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px}.news-card-header h3{font-size:0.78rem;font-weight:600;text-transform:uppercase;letter-spacing:0.1em;color:var(--muted-2)}.news-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);flex-shrink:0}.news-list{display:flex;flex-direction:column}.news-item{display:flex;flex-direction:column;gap:3px;padding:12px 16px;border-bottom:1px solid var(--border);transition:background 100ms}.news-item:last-child{border-bottom:0}.news-item:hover{background:rgba(255,255,255,0.02)}.news-title{font-size:0.88rem;font-weight:600;color:var(--muted);line-height:1.4}.news-meta{font-size:0.75rem;color:var(--muted-2)}.news-body{font-size:0.82rem;color:var(--muted-2);line-height:1.5;margin-top:3px}.news-empty{padding:20px 16px;text-align:center;color:var(--muted-2);font-size:0.85rem}
.news-feed{display:flex;flex-direction:column;gap:10px}.news-post{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px 20px;transition:border-color 120ms}.news-post:hover{border-color:rgba(255,255,255,0.14)}.news-post-title{font-size:0.95rem;font-weight:600;color:#fff;margin-bottom:6px}.news-post-meta{font-size:0.78rem;color:var(--muted-2);margin-bottom:10px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}.news-post-meta a{color:var(--accent);text-decoration:none}.news-post-meta a:hover{text-decoration:underline}.meta-sep{opacity:0.4}.news-post-body{font-size:0.875rem;color:var(--muted);line-height:1.6}

.auth-col{position:sticky;top:80px}.auth-card{overflow:hidden}.auth-card-header{padding:20px 24px 16px;border-bottom:1px solid var(--border)}.auth-card-header h2{font-size:1.05rem;font-weight:700;color:#fff;margin-bottom:4px}.auth-card-header p{font-size:0.82rem;color:var(--muted-2)}.auth-form{padding:20px 24px;display:flex;flex-direction:column;gap:14px}.form-row{display:flex;flex-direction:column;gap:5px}.form-row label{font-size:0.78rem;font-weight:600;color:var(--muted-2);letter-spacing:0.01em}.password-wrap{display:flex;align-items:center;gap:6px}.password-wrap input{flex:1}.toggle-pw{background:transparent;border:1px solid var(--border);color:var(--muted-2);cursor:pointer;padding:8px;border-radius:8px;font-size:0.85rem;transition:background 100ms;flex-shrink:0}.toggle-pw:hover{background:var(--surface-2)}.form-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.checkbox-label{display:flex;align-items:center;gap:7px;font-size:0.8rem;color:var(--muted-2);cursor:pointer}.checkbox-label input{accent-color:var(--accent)}.auth-card-footer{padding:14px 24px;border-top:1px solid var(--border);text-align:center;font-size:0.82rem;color:var(--muted-2)}.auth-card-footer a{color:var(--accent);text-decoration:none;font-weight:600}.auth-card-footer a:hover{text-decoration:underline}
.auth-col{display:flex;flex-direction:column;gap:12px}
.auth-online-card{background:linear-gradient(145deg, rgba(35,134,54,0.22), rgba(22,27,34,0.95));border:1px solid rgba(74,222,128,0.35);border-radius:var(--radius);padding:14px 16px;box-shadow:inset 0 1px 0 rgba(255,255,255,0.05)}
.auth-online-label{font-size:0.74rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:#9ee8b5;margin-bottom:6px}
.auth-online-value{font-size:2rem;line-height:1;font-weight:800;color:#e8fff0;letter-spacing:-0.03em;margin-bottom:8px}
.auth-online-meta{display:inline-flex;align-items:center;gap:8px;font-size:0.82rem;color:#b6f5c8}
.auth-online-dot{width:8px;height:8px;border-radius:50%;background:#4ade80;box-shadow:0 0 8px rgba(74,222,128,0.8)}

.perks{display:flex;flex-direction:column;gap:16px}.perk{display:flex;align-items:flex-start;gap:14px}.perk-icon{width:36px;height:36px;flex-shrink:0;background:rgba(88,166,255,0.1);border:1px solid rgba(88,166,255,0.2);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:16px}.perk-text strong{display:block;font-size:0.875rem;color:var(--muted);font-weight:600;margin-bottom:2px}.perk-text span{font-size:0.8rem;color:var(--muted-2)}
.gender-row{display:flex;gap:10px}.gender-option{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;padding:8px 12px;border-radius:8px;border:1px solid var(--border);background:var(--surface-2);cursor:pointer;font-size:0.85rem;color:var(--muted-2);transition:border-color 140ms,color 140ms,background 140ms;user-select:none}.gender-option input[type=radio]{accent-color:var(--accent)}.gender-option:has(input:checked){border-color:var(--accent);background:rgba(88,166,255,0.08);color:var(--accent)}

.stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:18px}.stat-box{background:var(--surface-2);border:1px solid var(--border);border-radius:10px;padding:12px}.stat-label{font-size:0.72rem;text-transform:uppercase;letter-spacing:0.08em;color:var(--muted-2);margin-bottom:6px}.stat-value{font-size:1rem;font-weight:700;color:#fff}.progress-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}.big-percent{font-size:44px;font-weight:800;color:var(--accent);letter-spacing:-0.03em;line-height:1}.progress-bar{height:14px;background:rgba(255,255,255,0.05);border-radius:999px;overflow:hidden;border:1px solid rgba(255,255,255,0.04)}.progress-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-2));width:0%;transition:width 900ms cubic-bezier(.22,.9,.38,1)}.progress-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px;font-size:0.84rem;color:var(--muted-2)}.meta{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:18px}.chip,.badge{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:var(--surface-2);border:1px solid var(--border);font-size:0.8rem;color:var(--muted)}.btn-row{margin-top:20px;display:flex;justify-content:flex-end;gap:10px}

.hero-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;background:rgba(88,166,255,0.08);border:1px solid rgba(88,166,255,0.18);font-size:0.8rem;color:var(--accent);font-weight:600;margin-bottom:14px}.hero-card h2{font-size:1.15rem;color:#fff;margin-bottom:8px}.hero-card p{color:var(--muted-2);line-height:1.6;max-width:620px}.hero-actions{margin-top:16px;display:flex;gap:10px;flex-wrap:wrap}.field{display:flex;flex-direction:column;gap:8px;margin-top:16px}.field label{font-size:0.78rem;text-transform:uppercase;letter-spacing:0.08em;color:var(--muted-2);font-weight:600}.field textarea{min-height:180px;resize:vertical}.helper{margin-top:8px;font-size:0.78rem;color:var(--muted-2)}

.toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}.mod-admin-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:10px}.mod-admin-row input{width:auto;min-width:220px}.status-msg{font-size:0.85rem;color:var(--muted-2)}.section-stack{display:flex;flex-direction:column;gap:14px}.form-grid{display:grid;gap:12px}.label{display:block;margin-bottom:6px;color:var(--muted-2);font-size:0.8rem;font-weight:600}

.profile-header{display:flex;gap:16px;align-items:center}.avatar{width:80px;height:80px;border-radius:16px;background:linear-gradient(135deg,#1f6feb,#58a6ff);display:flex;align-items:center;justify-content:center;font-size:1.6rem;font-weight:800;color:#fff;flex-shrink:0}.profile-name{font-size:1.2rem;font-weight:700;color:#fff}.badge-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.bio-title{font-size:0.95rem;font-weight:700;margin-bottom:8px}.bio-text{line-height:1.7;color:var(--muted);white-space:pre-wrap}

.inline-form{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.empty{color:var(--muted-2)}

@media(max-width:860px){
  .page,.page-auth,.page-register{grid-template-columns:1fr;padding:24px 20px;gap:28px}
  .sidebar{position:relative;top:auto;height:auto;border-right:0;border-bottom:1px solid var(--border);padding:16px 0}
  .main-content{padding:20px 16px}
  .auth-col{position:relative;top:auto}
  .hero-headline{font-size:1.8rem}
  .hero-graphic{min-height:190px}
  .hero-graphic-panel-main{left:18px;right:18px;bottom:18px;width:auto}
  .hero-graphic-panel-side{display:none}
  .hero-orbit-a,.hero-orbit-b{right:-96px}
  .stats-grid{grid-template-columns:1fr}
  .progress-head{flex-direction:column}
  .big-percent{font-size:36px}
  .profile-header{align-items:flex-start}
}