:root{
/* Базовые цвета (оставлены как в исходнике) */
--bg:#f6f8fb; --card:#ffffff; --line:#e6eaf2; --ink:#0f172a; --muted:#475569;
--accent:#2060df; --accent-2:#1348b3; --success:#1a7f37; --warning:#b45309;
--radius:16px; --shadow:0 10px 30px rgba(16,24,40,.08), 0 3px 10px rgba(16,24,40,.06);
font-family: Inter, "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
}
/* Технологичный фон: мягкий градиент + тонкая сетка */
body{
margin:0;
color:var(--ink);
background:
radial-gradient(900px 500px at 80% -10%, rgba(32,96,223,.08), transparent 60%),
radial-gradient(700px 400px at -10% 10%, rgba(19,72,179,.06), transparent 60%),
var(--bg);
position:relative;
overflow-x:hidden;
}
body::before{
content:"";
position:fixed; inset:0;
pointer-events:none; z-index:0; opacity:.35;
background-image:
linear-gradient(transparent 31px, rgba(16,24,40,.06) 32px),
linear-gradient(90deg, transparent 31px, rgba(16,24,40,.06) 32px);
background-size:32px 32px;
mask-image: radial-gradient(60% 45% at 50% 10%, #000 55%, transparent 100%);
}
h1,h2,h3,h4{margin:0 0 .4rem}
p,li,div,small{color:var(--muted);line-height:1.6}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent-2)}
.container{max-width:980px;margin:36px auto;padding:0 12px; position:relative; z-index:1}
/* Шапка — «стекло» */
.header{
display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;
background:linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,255,255,.55));
backdrop-filter:saturate(160%) blur(6px);
border:1px solid #e7ecf6; border-radius:14px; padding:10px 14px;
box-shadow:0 8px 24px rgba(16,24,40,.07);
}
.brand{display:flex;align-items:center;gap:10px}
.logo{
width:36px;height:36px;border-radius:10px;
display:grid;place-items:center;
background:radial-gradient(120% 120% at 10% 10%, #e9f0ff 0, #dfe7ff 40%, #d5ddff 70%);
border:1px solid #cbd6f6; box-shadow:inset 0 0 22