:root { --krasnyj:#c8102e; --tekst:#1d2330; --seryj:#667085; --fon:#f5f6f8; --linia:#e1e4ea; --zel:#18794e; --zhel:#b26b00; }
* { box-sizing: border-box; }
body { margin:0; font-family:"Segoe UI", Arial, sans-serif; color:var(--tekst); background:var(--fon); line-height:1.5; font-size:15px; }
a { color:#1d4ed8; text-decoration:none; } a:hover { text-decoration:underline; }
.shapka { background:#1d2330; color:#fff; }
.shapka-in { max-width:1100px; margin:0 auto; padding:10px 16px; display:flex; align-items:center; gap:24px; flex-wrap:wrap; }
.logo { color:#fff; font-weight:600; font-size:17px; } .logo span { color:#fff; background:var(--krasnyj); padding:2px 8px; border-radius:4px; margin-right:6px; letter-spacing:1px; }
.logo:hover { text-decoration:none; }
nav { display:flex; gap:16px; flex-wrap:wrap; flex:1; } nav a { color:#d6dae3; } nav a:hover { color:#fff; }
.vyhod { display:flex; align-items:center; gap:10px; color:#aab; font-size:13px; margin:0; }
.vyhod button { background:none; border:1px solid #556; color:#ccd; padding:3px 10px; border-radius:4px; cursor:pointer; }
.glav { max-width:1100px; margin:0 auto; padding:24px 16px 60px; }
h1 { font-size:24px; margin:0 0 16px; } h2 { font-size:18px; margin:24px 0 10px; } h3 { font-size:16px; margin:0 0 8px; }
.karta { background:#fff; border:1px solid var(--linia); border-radius:8px; padding:16px 20px; margin-bottom:14px; }
.seryj { color:var(--seryj); font-size:13px; }
.knopka, button.knopka { display:inline-block; background:var(--krasnyj); color:#fff; border:0; padding:8px 16px; border-radius:6px; cursor:pointer; font-size:14px; font-family:inherit; }
.knopka:hover { text-decoration:none; filter:brightness(1.08); }
.knopka.vtor { background:#fff; color:var(--tekst); border:1px solid var(--linia); }
input[type=text], input[type=number], input[type=date], select, textarea { font:inherit; padding:7px 10px; border:1px solid #cfd4dc; border-radius:6px; width:100%; background:#fff; }
textarea { min-height:120px; resize:vertical; }
label { display:block; margin:10px 0 4px; font-weight:600; font-size:14px; }
label.galka { font-weight:400; display:flex; gap:8px; align-items:center; margin:6px 0; }
.ryad { display:grid; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:12px; }
table { width:100%; border-collapse:collapse; background:#fff; font-size:14px; }
th, td { border-bottom:1px solid var(--linia); padding:8px 10px; text-align:left; vertical-align:top; }
th { background:#eef0f4; font-weight:600; }
.metka { display:inline-block; font-size:12px; padding:1px 8px; border-radius:10px; background:#eef0f4; color:#445; white-space:nowrap; }
.metka.ok { background:#e3f5ea; color:var(--zel); } .metka.zhdet { background:#fff3d6; color:var(--zhel); }
.metka.net { background:#fde7ea; color:var(--krasnyj); } .metka.zakryt { background:#eceef2; color:#99a; }
.oshibka { background:#fde7ea; color:#8a0f22; padding:10px 14px; border-radius:6px; margin:10px 0; }
.uspeh { background:#e3f5ea; color:#0f5132; padding:10px 14px; border-radius:6px; margin:10px 0; }
.spisok-blokov { list-style:none; padding:0; margin:0; }
.spisok-blokov li { display:flex; align-items:center; gap:12px; padding:10px 0; border-bottom:1px solid var(--linia); }
.spisok-blokov li:last-child { border-bottom:0; }
.nomer { width:28px; height:28px; border-radius:50%; background:#eef0f4; display:flex; align-items:center; justify-content:center; font-size:13px; flex:none; }
.nomer.ok { background:var(--zel); color:#fff; }
.polosa { height:8px; background:#eceef2; border-radius:4px; overflow:hidden; margin:6px 0 2px; }
.polosa div { height:100%; background:var(--zel); }
.tekst-bloka { font-size:15.5px; } .tekst-bloka img { max-width:100%; }
.vopros { padding:12px 0; border-bottom:1px solid var(--linia); } .vopros:last-of-type { border-bottom:0; }
.vopros p { margin:0 0 6px; font-weight:600; }
.derevo ul { list-style:none; padding-left:18px; margin:4px 0; } .derevo > ul { padding-left:0; }
.derevo .razdel { font-weight:600; margin-top:8px; }
.kroshki { font-size:13px; color:var(--seryj); margin-bottom:6px; }
.otzyv-knopki { display:flex; gap:8px; flex-wrap:wrap; }
.dve-kolonki { display:grid; grid-template-columns: 280px 1fr; gap:16px; }
@media (max-width: 800px) { .dve-kolonki { grid-template-columns:1fr; } nav { flex-basis:100%; order:3; } }
.vhod-karta { max-width:420px; margin:60px auto; }
pre.kod { background:#f3f4f6; padding:10px; border-radius:6px; font-size:13px; white-space:pre-wrap; }
details summary { cursor:pointer; color:#1d4ed8; }