
:root{
  --bg:#130025;
  --panel:#1d0836;
  --panel-2:#241044;
  --line:rgba(255,255,255,.12);
  --text:#f6f1ff;
  --muted:#cfc2ea;
  --gold:#f0c94f;
  --gold-2:#c89b14;
  --danger:#ffb48c;
  --link:#f5d66e;
  --shadow:0 20px 50px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:
radial-gradient(circle at 85% 12%, rgba(255,199,95,.12), transparent 10%),
radial-gradient(circle at 10% 85%, rgba(88,92,255,.15), transparent 12%),
linear-gradient(180deg,#120022 0%,#17042c 45%,#120023 100%);
color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.65}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1040px;margin:0 auto;padding:24px}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px}
.brand{display:flex;align-items:center;gap:14px}
.brand img{width:56px;height:56px;border-radius:18px;box-shadow:var(--shadow)}
.brand h1{font-size:1.2rem;margin:0}
.brand p{margin:0;color:var(--muted);font-size:.95rem}
.navlinks{display:flex;flex-wrap:wrap;gap:14px}
.navlinks a{padding:10px 14px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.03)}
.hero{display:grid;grid-template-columns:1.25fr .85fr;gap:28px;align-items:center;margin:24px 0 28px}
.card{background:linear-gradient(180deg,rgba(34,10,67,.96),rgba(21,5,43,.96));border:1px solid var(--line);border-radius:28px;box-shadow:var(--shadow)}
.hero .card{padding:34px}
.hero h2{font-size:clamp(2.1rem,4vw,3.6rem);line-height:1.08;margin:0 0 14px}
.hero p{font-size:1.08rem;color:var(--muted);margin:0 0 18px}
.badges{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 0}
.badge{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;border:1px solid rgba(240,201,79,.35);background:rgba(240,201,79,.08);color:#fff5ce;font-weight:600;font-size:.95rem}
.btnrow{display:flex;flex-wrap:wrap;gap:14px;margin-top:22px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:13px 18px;border-radius:16px;border:1px solid rgba(240,201,79,.35);font-weight:700}
.btn.primary{background:linear-gradient(180deg,#f4d564,#e8b834);color:#221200}
.btn.secondary{background:rgba(255,255,255,.04);color:var(--text)}
.panelgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:28px}
.panel{padding:24px}
.panel h3{margin:0 0 10px;font-size:1.2rem}
.panel p, .panel li{color:var(--muted)}
.panel ul{padding-left:18px;margin:0}
.page{padding:26px 0 44px}
.page .card{padding:30px}
.page h2{font-size:2rem;line-height:1.15;margin:0 0 10px}
.page h3{font-size:1.18rem;margin:26px 0 8px}
.meta{color:var(--muted);margin-bottom:18px}
.notice{padding:16px 18px;border-left:4px solid var(--gold);background:rgba(240,201,79,.08);border-radius:14px;margin:18px 0}
.footer{color:var(--muted);padding:24px 0 42px;font-size:.95rem}
.list-card{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.list-card .panel{height:100%}
@media (max-width:860px){
  .hero,.panelgrid,.list-card{grid-template-columns:1fr}
  .nav{align-items:flex-start;flex-direction:column}
}
