:root{--bg:#120f24;--panel:#1c1740;--panel2:#241d52;--text:#ece8ff;--muted:#a8a1d0;--gold:#f0c35a;--violet:#8a63e6;--line:#352d6b}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(1200px 600px at 70% -10%,#2a1f63 0,#120f24 60%) no-repeat,#120f24;color:var(--text);font:16px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:var(--gold)}a:hover{color:#fff}
.wrap{max-width:1040px;margin:0 auto;padding:0 20px}.narrow{max-width:780px;margin:0 auto;padding:24px 20px}
header{background:rgba(18,15,36,.9);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5;backdrop-filter:blur(6px)}
.bar{max-width:1040px;margin:0 auto;padding:10px 20px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;font-weight:600;letter-spacing:.02em}.brand img{image-rendering:pixelated;border-radius:6px}.brand b{color:var(--gold)}
nav{display:flex;gap:4px;flex-wrap:wrap;flex:1}nav a{color:var(--muted);text-decoration:none;padding:6px 12px;border-radius:8px}nav a:hover,nav a.on{color:#fff;background:var(--panel2)}
.lang{color:var(--muted);text-decoration:none;border:1px solid var(--line);padding:4px 12px;border-radius:8px;font-size:.9rem}.lang:hover{color:#fff;border-color:var(--violet)}
.hero{padding:72px 0 48px;text-align:center}.hero h1{font-size:clamp(2.2rem,6vw,3.6rem);margin:0 0 12px;letter-spacing:.02em}.hero h1 b{color:var(--gold)}
.lead{max-width:680px;margin:0 auto 26px;font-size:1.15rem;color:#d8d2f6}
.btn{display:inline-block;background:var(--gold);color:#241a05;font-weight:700;padding:11px 22px;border-radius:10px;text-decoration:none;margin:4px}.btn:hover{background:#ffd978;color:#241a05}
.btn.ghost{background:transparent;color:var(--text);border:1px solid var(--violet)}.btn.ghost:hover{background:var(--panel2);color:#fff}
.badge{display:inline-block;margin-top:18px;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:4px 16px;font-size:.9rem}
h1,h2,h3{line-height:1.25}h2{margin-top:2rem;color:#fff}h2::after{content:"";display:block;width:48px;height:3px;background:var(--violet);border-radius:2px;margin-top:6px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin:18px 0 48px}
.cards article{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px 20px}.cards h3{margin:.1rem 0 .4rem;color:var(--gold)}.cards p{margin:0;color:#d8d2f6}
code{background:var(--panel2);border:1px solid var(--line);padding:1px 7px;border-radius:6px;color:#fff;font-size:.92em}
.note{background:var(--panel);border-left:4px solid var(--gold);padding:12px 16px;border-radius:0 10px 10px 0}.small{color:var(--muted);font-size:.9rem}.big{font-size:1.4rem}
.topics{columns:2;column-gap:32px;padding-left:20px}@media(max-width:640px){.topics{columns:1}nav{order:3;flex-basis:100%}}
iframe.map{width:100%;height:70vh;min-height:420px;border:1px solid var(--line);border-radius:14px;margin-top:12px;background:#0b0918}
footer{border-top:1px solid var(--line);margin-top:48px;padding:22px 0;color:var(--muted);text-align:center}footer p{margin:.2rem 0}footer a{color:var(--muted)}