:root{
  --bg:#090711;
  --card:rgba(22,13,24,.90);
  --panel:rgba(14,8,20,.82);
  --line:rgba(251,146,60,.32);
  --text:#fff7ed;
  --muted:#f2c9a7;
  --accent:#fb923c;
  --sun:#f97316;
  --red:#ef4444;
  --gold:#facc15;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  line-height:1.72;
  background:
    radial-gradient(circle at 16% 18%,rgba(249,115,22,.32),transparent 24%),
    radial-gradient(circle at 78% 12%,rgba(239,68,68,.16),transparent 26%),
    radial-gradient(circle at 64% 88%,rgba(250,204,21,.10),transparent 28%),
    linear-gradient(135deg,#090711 0%,#17091a 48%,#030712 100%);
}
body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 12% 20%,rgba(255,255,255,.38) 0 1px,transparent 1.7px),
    radial-gradient(circle at 70% 30%,rgba(255,255,255,.26) 0 1px,transparent 1.6px),
    radial-gradient(circle at 36% 70%,rgba(255,255,255,.22) 0 1px,transparent 1.6px),
    radial-gradient(circle at 86% 76%,rgba(255,255,255,.32) 0 1px,transparent 1.6px);
  background-size:180px 180px,240px 240px,210px 210px,260px 260px;
}
.site-shell{max-width:1240px;margin:0 auto;padding:30px 18px 56px}
.hero{
  border:1px solid var(--line);
  border-radius:32px;
  padding:34px;
  background:
    radial-gradient(circle at 92% 18%,rgba(251,146,60,.18),transparent 28%),
    linear-gradient(135deg,rgba(35,17,26,.94),rgba(5,8,18,.78));
  box-shadow:0 24px 90px rgba(0,0,0,.40),inset 0 0 60px rgba(251,146,60,.07);
  overflow:hidden;
  position:relative;
}
.hero:before{
  content:"";
  position:absolute;
  width:260px;
  height:260px;
  right:-90px;
  top:-75px;
  border-radius:50%;
  background:
    radial-gradient(circle at 35% 35%,#fff7ad 0 6%,#facc15 12%,#fb923c 44%,#ea580c 70%,rgba(234,88,12,.12) 100%);
  filter:blur(.2px);
  box-shadow:0 0 70px rgba(251,146,60,.55),0 0 140px rgba(249,115,22,.25);
  opacity:.85;
}
.hero:after{
  content:"орбиты • планеты • Солнце • космос";
  position:absolute;
  right:-62px;
  bottom:12px;
  color:rgba(251,146,60,.14);
  font-size:38px;
  font-weight:900;
  letter-spacing:.04em;
  transform:rotate(-4deg);
  white-space:nowrap;
}
.hero h1{
  position:relative;
  z-index:1;
  margin:0;
  max-width:900px;
  font-size:clamp(34px,5vw,62px);
  line-height:1.04;
  letter-spacing:-.04em;
}
.hero p{
  position:relative;
  z-index:1;
  color:var(--muted);
  max-width:850px;
  margin:16px 0 0;
  font-size:18px;
}
.layout{display:grid;grid-template-columns:310px minmax(0,1fr);gap:22px;margin-top:22px}
.sidebar{
  position:sticky;
  top:18px;
  align-self:start;
  border:1px solid var(--line);
  border-radius:24px;
  background:var(--panel);
  padding:16px;
  box-shadow:0 12px 44px rgba(0,0,0,.32);
}
.sidebar h2{margin:0 0 12px;color:#fed7aa;font-size:15px;letter-spacing:.08em;text-transform:uppercase}
.navlink{
  display:block;
  padding:9px 11px;
  color:var(--text);
  text-decoration:none;
  border:1px solid transparent;
  border-radius:14px;
}
.navlink:hover{color:#ffedd5;background:rgba(251,146,60,.11);border-color:rgba(251,146,60,.28)}
.page-card{
  border:1px solid var(--line);
  border-radius:28px;
  padding:30px;
  background:var(--card);
  box-shadow:0 18px 64px rgba(0,0,0,.34);
  overflow:hidden;
}
.page-card h1{margin:0 0 18px;font-size:clamp(30px,4vw,48px);line-height:1.12}
.page-card h2{margin-top:30px;padding-top:14px;border-top:1px solid rgba(251,146,60,.20);color:#fed7aa}
.page-card h3{color:#fecaca;margin-top:24px}
p{margin:13px 0}
a{color:#fdba74;text-decoration:none;border-bottom:1px solid rgba(251,146,60,.38)}
a:hover{color:#ffedd5;border-bottom-color:#ffedd5}
.unresolved-link{color:#facc15}
.content-list{padding-left:24px}
.content-list li{margin:8px 0}
code{
  color:#fde68a;
  background:rgba(250,204,21,.09);
  border:1px solid rgba(250,204,21,.22);
  padding:2px 6px;
  border-radius:7px;
}
pre{
  overflow:auto;
  padding:16px;
  border-radius:16px;
  border:1px solid rgba(251,146,60,.20);
  background:rgba(3,7,18,.72);
}
blockquote{
  margin:18px 0;
  padding:14px 18px;
  border-left:4px solid var(--accent);
  background:rgba(251,146,60,.09);
  border-radius:12px;
}
.math-block{
  overflow-x:auto;
  margin:18px 0;
  padding:16px;
  border:1px solid rgba(251,146,60,.25);
  background:rgba(15,23,42,.62);
  border-radius:16px;
}
.table-scroll{overflow-x:auto;margin:18px 0}
table{border-collapse:collapse;min-width:520px;width:100%;background:rgba(15,23,42,.45)}
td,th{border:1px solid rgba(251,146,60,.22);padding:10px 12px}
th{background:rgba(251,146,60,.14);color:#ffedd5}
.grid-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;margin-top:20px}
.tile{
  display:block;
  border:1px solid rgba(251,146,60,.25);
  border-radius:22px;
  padding:18px;
  background:
    radial-gradient(circle at 86% 18%,rgba(251,146,60,.16),transparent 30%),
    rgba(15,23,42,.52);
  min-height:146px;
  position:relative;
  overflow:hidden;
}
.tile:after{
  content:"";
  position:absolute;
  width:88px;
  height:88px;
  right:-28px;
  bottom:-28px;
  border-radius:50%;
  border:1px solid rgba(251,146,60,.18);
}
.tile h3{margin:0 0 8px;color:#fed7aa}
.tile p{color:var(--muted)}
.planet-mark{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:56px;
  height:56px;
  border-radius:50%;
  margin-bottom:12px;
  border:1px solid rgba(251,146,60,.35);
  background:radial-gradient(circle at 35% 30%,rgba(255,237,213,.85),rgba(251,146,60,.34) 45%,rgba(127,29,29,.25) 100%);
  box-shadow:0 0 24px rgba(251,146,60,.25);
  font-size:28px;
  color:#fff7ed;
}
.planet-hero{
  display:flex;
  align-items:center;
  gap:18px;
  padding:18px;
  margin:0 0 20px;
  border:1px solid rgba(251,146,60,.22);
  border-radius:22px;
  background:rgba(3,7,18,.36);
}
.planet-hero .planet-mark{margin:0;flex:0 0 auto}
.orbit-box{
  position:relative;
  height:240px;
  margin:24px 0;
  border:1px solid rgba(251,146,60,.22);
  border-radius:24px;
  background:radial-gradient(circle at center,rgba(251,146,60,.22),rgba(3,7,18,.50) 34%,rgba(3,7,18,.22) 100%);
  overflow:hidden;
}
.orbit-box .sun-dot{
  position:absolute;
  left:50%;
  top:50%;
  width:54px;
  height:54px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:radial-gradient(circle,#fff7ad 0 10%,#facc15 25%,#f97316 70%);
  box-shadow:0 0 45px rgba(251,146,60,.75),0 0 110px rgba(249,115,22,.35);
}
.orbit{
  position:absolute;
  left:50%;
  top:50%;
  border:1px solid rgba(251,146,60,.24);
  border-radius:50%;
  transform:translate(-50%,-50%);
}
.orbit.o1{width:120px;height:70px}
.orbit.o2{width:190px;height:106px}
.orbit.o3{width:270px;height:148px}
.orbit.o4{width:360px;height:196px}
.back{
  display:inline-flex;
  margin-bottom:18px;
  color:#ffedd5;
  background:rgba(251,146,60,.10);
  border:1px solid rgba(251,146,60,.30);
  border-radius:999px;
  padding:8px 12px;
}
@media(max-width:900px){
  .layout{grid-template-columns:1fr}
  .sidebar{position:static}
  .page-card{padding:22px}
  .hero:before{opacity:.35}
}