/* Общие стили tezbase.com.
   Терминальная серость: всё держится на тоне, а не на цвете.
   Три приглушённых оттенка различают состояния и не кричат. */
:root{
  --bg:#f3f3f2; --term:#1a1d21; --term2:#22262b; --line:#2f343a;
  --txt:#c9ced6; --txt2:#8b929c; --txt3:#5f666f;
  --accent:#9d9382; --green:#7e9078; --red:#a8837a; --blue:#7f8f9e;
  --page-ink:#1c1f23; --page-ink2:#5a6069; --page-line:#dcdcda;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --sans:"Inter Tight",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#131518; --page-ink:#dfe2e6; --page-ink2:#8b929c; --page-line:#262a30;
}}
:root[data-theme="dark"]{--bg:#131518; --page-ink:#dfe2e6; --page-ink2:#8b929c; --page-line:#262a30}

*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--page-ink);font:16px/1.6 var(--sans);-webkit-font-smoothing:antialiased}
.w{max-width:940px;margin:0 auto;padding:0 20px}
a{color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* сквозное меню */
nav.verh{border-bottom:1px solid var(--page-line)}
nav.verh .w{display:flex;align-items:center;justify-content:space-between;gap:20px;height:58px}
.znak{font:700 15px/1 var(--mono);letter-spacing:.02em;text-decoration:none;display:flex;align-items:center;gap:9px;white-space:nowrap}
.znak i{font-style:normal;color:var(--accent)}
nav.verh ul{list-style:none;display:flex;gap:22px;margin:0;padding:0}
nav.verh a.punkt{font:400 14px/1 var(--mono);color:var(--page-ink2);text-decoration:none}
nav.verh a.punkt:hover,nav.verh a.punkt[aria-current="page"]{color:var(--page-ink)}

/* терминальное окно */
.okno{background:var(--term);border:1px solid var(--line);border-radius:8px;overflow:hidden;box-shadow:0 18px 40px -24px rgba(0,0,0,.55);margin:32px 0}
.okno-shapka{display:flex;align-items:center;gap:8px;padding:9px 14px;background:var(--term2);border-bottom:1px solid var(--line)}
.tochka{width:11px;height:11px;border-radius:50%;background:#39414b}
.okno-imya{margin-left:8px;font:400 12px/1 var(--mono);color:var(--txt3)}
.okno-telo{padding:20px 18px;font:400 13.5px/1.75 var(--mono);color:var(--txt);overflow-x:auto}
.okno-telo p{margin:0 0 2px}
.pr{color:var(--accent)} .cm{color:var(--txt3)} .ok{color:var(--green)}
.no{color:var(--red)} .hl{color:var(--blue)} .dim{color:var(--txt2)}

/* заголовки и текст */
header.top{padding:52px 0 0}
h1{font:600 clamp(28px,5vw,44px)/1.12 var(--sans);letter-spacing:-.025em;margin:0 0 16px;max-width:20ch;text-wrap:balance}
.lede{font-size:clamp(17px,2vw,19px);color:var(--page-ink2);max-width:58ch;margin:0}
section{margin:56px 0}
h2{font:600 24px/1.2 var(--sans);letter-spacing:-.015em;margin:0 0 10px}
h3{font:600 17px/1.3 var(--sans);margin:28px 0 8px}
.pod{color:var(--page-ink2);margin:0 0 4px;max-width:64ch}
.shag{font:500 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--page-ink2);margin:0 0 12px}
.tekst{max-width:66ch}
.tekst p{margin:0 0 14px}
.tekst ul{margin:0 0 14px;padding-left:20px}
.tekst li{margin-bottom:7px}
.tekst b{font-weight:600}

/* кнопки */
.knopki{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
.kn{display:inline-block;padding:12px 20px;border-radius:5px;text-decoration:none;font:500 14px/1 var(--mono);border:1px solid transparent}
.kn-main{background:var(--term);color:var(--txt);border-color:var(--line)}
.kn-main:hover{background:var(--term2)}
.kn-ghost{border-color:var(--page-line);color:var(--page-ink)}
.kn-ghost:hover{border-color:var(--page-ink2)}

/* факты */
.fakty{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:20px;margin:28px 0 0;padding:22px 0;border-top:1px solid var(--page-line);border-bottom:1px solid var(--page-line)}
.fakt dt{font:500 10px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--page-ink2)}
.fakt dd{margin:9px 0 0;font:500 21px/1 var(--mono);font-variant-numeric:tabular-nums}
.fakt dd small{display:block;font:400 13px/1.4 var(--sans);color:var(--page-ink2);margin-top:6px;letter-spacing:0}

.granicy{border-left:2px solid var(--page-line);padding-left:18px;max-width:64ch}
.granicy p{margin:0 0 10px;color:var(--page-ink2);font-size:15px}
.granicy b{color:var(--page-ink)}

/* подвал */
footer{border-top:1px solid var(--page-line);margin-top:64px;padding:24px 0 56px;font:400 13px/1.8 var(--mono);color:var(--page-ink2)}
footer .w{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
footer a{text-decoration:none;border-bottom:1px solid var(--page-line)}
footer a:hover{border-color:var(--accent);color:var(--accent)}
footer .ssylki{display:flex;gap:18px;flex-wrap:wrap}
