:root{
  --bg:#0b0d14;
  --bg2:#101424;
  --text:#eef1ff;
  --muted:rgba(238,241,255,.72);
  --faint:rgba(238,241,255,.55);
  --border:rgba(255,255,255,.14);
  --card:rgba(255,255,255,.06);
  --card2:rgba(255,255,255,.09);
  --brand:#ff4d8d;
  --brand2:#7c5cff;
  --ok:#31d0aa;
  --warn:#ffcc66;
  --danger:#ff5c7a;
  --shadow:0 18px 60px rgba(0,0,0,.35);
  --shadow2:0 10px 30px rgba(0,0,0,.25);
  --r-sm:14px;
  --r-md:18px;
  --r-lg:24px;
  --container:1120px;
  --space-1:6px;
  --space-2:10px;
  --space-3:14px;
  --space-4:18px;
  --space-5:24px;
  --space-6:32px;
  --space-7:44px;
  --space-8:64px;
  --h1:clamp(2.0rem, 1.4rem + 2vw, 3.1rem);
  --h2:clamp(1.5rem, 1.1rem + 1.3vw, 2.1rem);
  --h3:1.25rem;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,"Apple Color Emoji","Segoe UI Emoji";
  line-height:1.65;
  color:var(--text);
  background:
    radial-gradient(900px 450px at 10% -10%, rgba(124,92,255,.35), transparent 60%),
    radial-gradient(900px 500px at 90% 0%, rgba(255,77,141,.25), transparent 55%),
    radial-gradient(900px 500px at 50% 120%, rgba(49,208,170,.20), transparent 55%),
    var(--bg);
  text-rendering:optimizeLegibility;
}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}
.container{max-width:var(--container);margin:0 auto;padding:0 var(--space-5)}
.skip{
  position:absolute;left:-999px;top:10px;background:#000;color:#fff;
  padding:10px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.2)
}
.skip:focus{left:10px;z-index:9999}
.header{
  position:sticky; top:0; z-index:40;
  background:rgba(11,13,20,.55);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(255,255,255,.10);
}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:18px}
.logo{display:inline-flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.2px}
.logo-mark{
  width:34px;height:34px;border-radius:12px;
  background:linear-gradient(135deg, rgba(255,77,141,.95), rgba(124,92,255,.85));
  box-shadow:var(--shadow2);
}
.nav{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.nav a{padding:8px 10px;border-radius:12px;color:rgba(238,241,255,.92)}
.nav a:hover{background:rgba(255,255,255,.06);text-decoration:none}
main{min-height:60vh}
.footer{border-top:1px solid rgba(255,255,255,.10);padding:var(--space-7) 0;color:var(--muted)}
.badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 10px;border-radius:999px;
  border:1px solid var(--border);
  background:rgba(0,0,0,.18);
  color:rgba(238,241,255,.82);
  font-size:.92rem;
}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:12px 16px;border-radius:var(--r-sm);
  border:1px solid var(--border);
  background:rgba(255,255,255,.06);
  box-shadow:var(--shadow2);
  font-weight:650;
  letter-spacing:.2px;
}
.btn:hover{background:rgba(255,255,255,.10);text-decoration:none}
.btn:focus-visible{outline:3px solid rgba(124,92,255,.35);outline-offset:2px}
.btn.primary{
  border-color:rgba(255,77,141,.55);
  background:linear-gradient(135deg, rgba(255,77,141,.95), rgba(124,92,255,.85));
}
.btn.primary:hover{filter:brightness(1.05)}
.card{
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--r-lg);
  padding:var(--space-6);
  box-shadow:var(--shadow);
  backdrop-filter:blur(10px);
}
.card.tight{padding:var(--space-5)}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--space-5)}
@media(max-width:900px){.grid{grid-template-columns:1fr}}
.prose h1{font-size:var(--h1);line-height:1.1;margin:0 0 var(--space-4)}
.prose h2{font-size:var(--h2);line-height:1.15;margin:var(--space-6) 0 var(--space-3)}
.prose h3{font-size:var(--h3);margin:var(--space-5) 0 var(--space-2)}
.prose p{margin:0 0 var(--space-4);color:rgba(238,241,255,.92)}
.prose ul,.prose ol{margin:0 0 var(--space-4);padding-left:1.2rem}
.prose li{margin:.35rem 0;color:rgba(238,241,255,.92)}
.prose code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace}
.prose blockquote{
  margin:var(--space-5) 0;padding:var(--space-4) var(--space-5);
  border-left:4px solid rgba(255,77,141,.65);
  background:rgba(255,255,255,.05);
  border-radius:var(--r-md);
}
.hr{
  height:1px;border:0;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent);
  margin:var(--space-7) 0;
}
.row{display:flex;gap:var(--space-5);align-items:center}
.wrap{flex-wrap:wrap}
.muted{color:var(--muted)}
.faint{color:var(--faint)}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5)}
@media(max-width:900px){.kpis{grid-template-columns:1fr}}
.kpi{
  border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r-lg);
  padding:var(--space-5);
  background:rgba(255,255,255,.04);
}
.kpi b{display:block;font-size:1.4rem}
.breadcrumbs{font-size:.95rem;color:var(--muted)}
.breadcrumbs ol{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:0}
.breadcrumbs li{display:flex;align-items:center}
.breadcrumbs .sep{padding:0 8px;color:rgba(238,241,255,.45)}
.form{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--space-4)}
.form .field{grid-column:span 6;display:flex;flex-direction:column;gap:8px}
@media(max-width:900px){.form .field{grid-column:span 12}}
input,select,textarea{
  background:rgba(0,0,0,.18);
  border:1px solid rgba(255,255,255,.16);
  border-radius:12px;
  padding:12px 12px;
  color:var(--text);
  font-size:1rem;
}
input:focus,select:focus,textarea:focus{outline:3px solid rgba(124,92,255,.35);outline-offset:2px}
label{color:rgba(238,241,255,.85);font-weight:650}
.small{font-size:.95rem;color:var(--muted)}
.notice{
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--r-md);
  padding:14px 14px;
  background:rgba(255,255,255,.04);
}
.notice.ok{border-color:rgba(49,208,170,.35)}
.notice.warn{border-color:rgba(255,204,102,.35)}
.notice.danger{border-color:rgba(255,92,122,.35)}
.table{width:100%;border-collapse:collapse;margin:var(--space-5) 0;font-size:.98rem}
.table th,.table td{border:1px solid rgba(255,255,255,.14);padding:10px 12px;vertical-align:top}
.table th{background:rgba(255,255,255,.06);text-align:left}