/* На экзамен — стили. Дизайн-система: design/review-visual.md (вариант А «светлый, спокойный»).
   Шрифты IBM Plex Sans / Plex Mono (OFL), иконки Lucide (ISC) — спрайт в templates/_icons.html. */
/* логотип: Unbounded 600 (OFL), только буквы «На экзамен» (1,5 КБ) — встроен, без отдельного запроса и мигания; исходник static/fonts/unbounded-600-logo.woff2 */
@font-face{font-family:Unbounded;font-weight:600;font-display:swap;src:url(/static/fonts/unbounded-600.woff2) format("woff2")}
@font-face{font-family:Logo;font-weight:600;font-display:block;src:url(data:font/woff2;base64,d09GMgABAAAAAAXkABAAAAAADEQAAAWHAAGzdQAAAAAAAAAAAAAAAAAAAAAAAAAAGhYbgkocMAZgP1NUQVQqAGwRCAqGPIUrATYCJAM0CxwABCAFiHQHIAwHG4EKEZWkaZJ9UWA3HF8IFDWBM9GI8O+LWVtDCPUTPufeuN6X4+Frvz7P7e4hqF+zhIoAJCDbXyvXCcBEropKRVgkF0XPh//d1wmj7liqRloA+iJ6a3WXCoBNmyZpp0Fj0f4ATwUGGZ70Z8mhYdsS+/73+7W6YlHwaBfxEP8QErR2dh4rD7WLqDXR0AiRtiHhnkySlaYVIqElQo6wiVfxdAb1c5kz4QUFuoAkFB0h0LbAOnlXZn45RpcG9e6K0e3Gvt0xUmDFGHartXd3NLn7KVq7ZV0j04WEyaDfob5e31eQfiaarU7qWtha9UOn+mMp1U/LX3WEZvpHNjc0BUXWMZmJ/k81qo+BzyWHdjrroboaVL+q71AFe+NPGEd+PGD1AKGhqGtqaevoCnUNCTUhZKXWjlXUkqQSSismXGSJdqZxplMtqmTTVI0a6QV4ctB9nMWKqISMnwJ/xCPbC+GT2aWAe1oR5a9wREDakChmy0JoCowEpkvP2jv6MjxIAqLFVgMSMkaywEhxHGOGsmR2cSjBJaJEldiSUAr+V4Q18d+h+uOflzevXrl08TiChHyEqP4bIPTAVIzwHbEXjGE6KLIsKilGgSXkHEXG1jUeugXp8salo3OpJ7ww4O3f2QDd5PC3bzNCf1BZdakn1aJ0Q28gTFYUZpRGQ6bcvNkwrgFwM5yWh2GCWdlYj34YlEvNpRRQOM+X/4tcyTJvO2bUOUFgdNJlC4QSe2FNItc4GaZkDSxItAib2046DKQq0d3CQBRkA17gSLUgRbHsNF2KDNBN01rZWWXbQomsFJpDVXUZg2z1AD1goH6k+3epf1b/2fx2IVx5jB4rOx/gzaW49XHYMfmSbYFtvvXlU672hw1n2xtKZeNH5BaXD8/LGi9JGpBRXuzfuHzcGDnQIzPV29+/0DsuU1UVAC40wr8Dng/aVubJE2SxatzivKaWGVUFK7qy/Zam+gR6Jn/yD87w8EwLiAktavDJTB7hGjRowVw/nBk0zQwpqQvaU5nvnZqU7uRqvzm1vaM1tsHGkUbFZ7m37I7Kl6dHtorjfHNygj0Ckjs8Kk0G8aNSM8NzS6cHYtOGQxtKs+ecVmP81llOaqFDdke3PKFEHVWsYrd/dVG+bFU+mXy1cf2h2EN3PtfTs/3glIN4MJBnx9d10c/ce1XamBBR4O2TFxnpk1/gFZEoxj/ca8qo64z1kzsty6ueIIpvwFLzv5XlZajXEXbadPBMH/aTT7LU3OpDzmwuZktT+uzGPn4IxLt+9L57Tr1R/N/NzL2Cr7dOHwv89OOBQZiYYOdXLEVdAsHUzMy/IaqfsyA8OvZyFfbnNW93weamW2a7FemkiSA3JYRW6X/Z9HGyfwn0LFXMk8XEOgWGvpBF0QMvcSmMeUlJ3yfK1viKirnBU83R8KS6uTGUmuqxnFrGYy11TEzuyi71wjXFUt+aXDNpCpdIDI9unv0PzuhhmJdjJxVV8+CtE2glrRbcO4SH8pdi+Y//cB0oxT+BnSiOAsOaE6l4pLX14uKv+qNCWyKbo6FSWMfiZlrncLhbtDH/CU3VTyDs+HLncgT6NNv7kdC4gB+xRsme21QoAkplBH/szsZviRqq1kD946S7aeVrbQ37w/8PVpDqH3kuyzJs77BTxi15CmF/yu3doZV4FhpfUI+aFySIfLhEZaG7wvlyUUAqISk5WWTGcMtJbZOnT1alEdA0my/GBXtOlNhjTXBHLZE8zbIEAV0u939Ysk6H+rYEkBH22buTc7iqsMx06nli1daI/SHeYsSOXKSDSeHPRCf79uXf3Jg6HZc2RBTJOzfu3DKCUcz810oISdEWxZyrtpsfVl8dnicoe8J5+KPusPC7lP+vQLVU69H58/r/ca9XpwEAAAA=) format("woff2")}
@font-face{font-family:Plex;font-weight:400;font-display:swap;src:url(/static/fonts/ibm-plex-sans-400.woff2) format("woff2")}
@font-face{font-family:Plex;font-weight:500;font-display:swap;src:url(/static/fonts/ibm-plex-sans-500.woff2) format("woff2")}
@font-face{font-family:Plex;font-weight:600;font-display:swap;src:url(/static/fonts/ibm-plex-sans-600.woff2) format("woff2")}
@font-face{font-family:"Plex Mono";font-weight:500;font-display:swap;src:url(/static/fonts/ibm-plex-mono-500.woff2) format("woff2")}

/* ===== токены ===== */
:root{
  --bg:#f7f8fa; --surface:#fff; --surface-2:#f2f4f7; --surface-3:#e7eaef;
  --border:#e4e7ec; --border-2:#c4cad4;
  --ink:#0f172a; --text:#1f2937; --text-2:#475467; --muted:#5d6779; --faint:#98a2b3;
  --accent:#2563eb; --accent-h:#1d4ed8; --accent-a:#1e40af; --accent-50:#eff4ff; --accent-100:#dbe6fe; --accent-ring:rgba(37,99,235,.24);
  --ok:#15803d; --ok-ink:#166534; --ok-bg:#f0fdf4; --ok-100:#dcfce7; --ok-line:#bbf7d0;
  --bad:#b91c1c; --bad-ink:#991b1b; --bad-bg:#fef2f2; --bad-100:#fee2e2; --bad-line:#fecaca;
  --warn-bg:#fffbeb; --warn-line:#fde68a; --warn-ink:#713f12;
  --r-sm:8px; --r-md:12px; --r-lg:16px; --r-full:999px;
  --sh-xs:0 1px 2px rgba(16,24,40,.05);
  --sh-md:0 8px 20px -6px rgba(16,24,40,.10),0 2px 4px -2px rgba(16,24,40,.05);
  --sh-btn:0 1px 2px rgba(16,24,40,.10),inset 0 1px 0 rgba(255,255,255,.14);
  --ring:0 0 0 4px var(--accent-ring);
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:20px;--s6:24px;--s8:32px;--s10:40px;--s12:48px;--s16:64px;
  --container:1240px; --hdr-h:64px; --measure:720px;
  --font:Plex,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:"Plex Mono",ui-monospace,Consolas,monospace;
}

/* ===== основа ===== */
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-padding-top:80px}
body{margin:0;background:var(--bg);color:var(--text);font:400 17px/1.65 var(--font);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
::selection{background:var(--accent-100);color:var(--ink)}
h1,h2,h3{color:var(--ink);font-weight:600;margin:0 0 .5em;text-wrap:balance}
h1{font-size:clamp(26px,1.4vw + 17px,36px);line-height:1.2;letter-spacing:-.02em}
h2{font-size:clamp(20px,.5vw + 16px,24px);line-height:1.3;letter-spacing:-.012em}
h3{font-size:18px;line-height:1.4;letter-spacing:-.006em}
p{margin:0 0 1em;text-wrap:pretty}
a{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:rgba(37,99,235,.35)}
a:hover{text-decoration-color:currentColor}
button{font:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.sr,.skip:not(:focus){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip:focus{position:fixed;top:8px;left:8px;z-index:50;background:#fff;padding:8px 12px}
.wrap{max-width:var(--container);margin:0 auto;padding-inline:16px}
/* большие мониторы (2K и шире): всё на 10% крупнее — текст, кнопки, плитки, отступы в тех же пропорциях */
@media (min-width:1680px){html{zoom:1.1}}
@media (min-width:768px){.wrap{padding-inline:32px}}
main{padding-top:16px;padding-bottom:var(--s12);min-height:60vh}
@media (min-width:960px){main{padding-bottom:var(--s16)}}
.lead{font-size:clamp(17px,.3vw + 16px,19px);line-height:1.6;color:var(--text-2);max-width:var(--measure)}
.label{display:block;font-size:12px;line-height:1.3;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 var(--s2)}
.muted{color:var(--muted)}
.num{font-variant-numeric:tabular-nums}
.ref{font-family:var(--mono);font-size:.9em}
.sect{margin:var(--s16) 0 0}
.sect > h2{margin-bottom:var(--s5)}
.sect--narrow{max-width:820px}

/* иконки */
.i{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}
.i--sm{width:16px;height:16px}
.i--lg{width:24px;height:24px}

/* плавный переход между страницами */
::view-transition-old(root),::view-transition-new(root){animation-duration:.14s}
.hdr{view-transition-name:hdr}
.tr__bar{view-transition-name:trbar}
.tr__nav{view-transition-name:trnav}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ===== шапка ===== */
.hdr{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.9);backdrop-filter:saturate(180%) blur(12px);-webkit-backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--border)}
.hdr__in{display:flex;align-items:center;gap:var(--s6);height:var(--hdr-h)}
.logo{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font-family:Logo,var(--font);font-weight:600;font-size:18px;letter-spacing:-.02em;white-space:nowrap}
.logo__mark{width:28px;height:28px;flex:none;border-radius:8px;box-shadow:0 1px 2px rgba(37,99,235,.35)}
.nav{display:flex;gap:var(--s1);margin-left:auto;height:100%}
.nav a{position:relative;display:flex;align-items:center;padding:0 12px;color:var(--text-2);text-decoration:none;font-size:15px;font-weight:500;white-space:nowrap}
.nav a:hover{color:var(--ink)}
.nav a[aria-current]{color:var(--ink)}
.nav a[aria-current]::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:2px;border-radius:2px;background:var(--accent)}
.mnav{margin-left:auto;display:none}
@media (max-width:1023px){.nav{display:none}.mnav{display:block}}
.mnav > summary{list-style:none;display:grid;place-items:center;width:44px;height:44px;margin-right:-10px;border-radius:var(--r-md);color:var(--ink);cursor:pointer}
.mnav > summary::-webkit-details-marker{display:none}
.mnav > summary:hover{background:var(--surface-2)}
.mnav[open] > summary .i-open,.mnav:not([open]) > summary .i-close{display:none}
.mnav:not([open]) .mnav__panel{display:none}

/* крошки */
.crumbs{margin:0 0 var(--s5)}
.crumbs ol{list-style:none;display:flex;align-items:center;gap:6px;margin:0;padding:0;font-size:14px;color:var(--muted);overflow-x:auto;scrollbar-width:none;white-space:nowrap}
.crumbs ol::-webkit-scrollbar{display:none}
.crumbs li{display:flex;align-items:center;gap:6px}
.crumbs li+li::before{content:"";width:14px;height:14px;flex:none;background:currentColor;opacity:.5;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") center/contain no-repeat}
.crumbs a{display:inline-block;padding:6px 0;color:var(--muted);text-decoration:none}
.crumbs a:hover{color:var(--ink)}
.crumbs [aria-current]{color:var(--text-2)}

/* ===== кнопки ===== */
.btn{--h:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--h);padding:0 18px;border-radius:var(--r-md);border:1px solid var(--border-2);background:var(--surface);color:var(--ink);box-shadow:var(--sh-xs);font:600 15px/1.2 var(--font);text-decoration:none;cursor:pointer;white-space:nowrap;transition:background-color .15s,border-color .15s,box-shadow .15s,color .15s}
.btn:hover{background:var(--surface-2)}
.btn:active{background:var(--surface-3)}
.btn:focus-visible{outline:0;box-shadow:var(--ring)}
.btn--primary{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:var(--sh-btn)}
.btn--primary:hover{background:var(--accent-h);border-color:var(--accent-h)}
.btn--primary:active{background:var(--accent-a);border-color:var(--accent-a)}
.btn--ghost{background:transparent;border-color:transparent;box-shadow:none;color:var(--text-2)}
.btn--ghost:hover{background:var(--surface-2);color:var(--ink)}
.btn--lg{--h:52px;padding:0 24px;font-size:16px}
.btn--block{display:flex;width:100%}
.btn[aria-disabled="true"]{background:var(--surface-2);border-color:var(--border);color:var(--muted);box-shadow:none;cursor:default}
.go{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:60px;padding:10px 20px;border-radius:var(--r-md);background:var(--accent);color:#fff;text-decoration:none;font-weight:600;font-size:17px;box-shadow:var(--sh-btn);transition:background-color .15s}
.go:hover{background:var(--accent-h)}
.go:active{background:var(--accent-a)}
.go:focus-visible{outline:0;box-shadow:var(--ring)}
.go small{font-weight:400;font-size:13px;color:#fff}
.badge{display:inline-block;margin-left:auto;padding:1px 8px;border-radius:var(--r-full);font:600 12px/1.6 var(--font);font-variant-numeric:tabular-nums}
.badge--bad{background:var(--bad-100);color:var(--bad-ink)}

/* ===== выбор теста ===== */
.picker{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--sh-md);overflow:hidden}
.pk__step{padding:var(--s5) var(--s5) var(--s4)}
.pk__step + .pk__step{padding-top:0}
.pk__hint{font-size:13px;line-height:1.5;color:var(--muted);margin:var(--s2) 0 0;min-height:1.5em}
.seg{display:grid;gap:4px;margin:0;padding:4px;background:var(--surface-2);border-radius:var(--r-md)}
.seg--4{grid-template-columns:repeat(4,1fr)}
.seg--2{grid-template-columns:1fr 1fr}
.seg__b{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:44px;padding:6px 8px;border-radius:var(--r-sm);color:var(--text-2);text-decoration:none;font-weight:600;font-size:16px;line-height:1.2;text-align:center;transition:background-color .15s,color .15s}
.seg--2 .seg__b{font-size:15px;white-space:nowrap}
.seg__b:hover{background:rgba(255,255,255,.75);color:var(--ink)}
.seg__b[aria-current]{background:var(--ink);color:#fff;box-shadow:0 1px 2px rgba(16,24,40,.2)}
.pk__go{padding:var(--s4) var(--s5) var(--s5);border-top:1px solid var(--border)}
.pk__sum{font-size:14px;color:var(--text-2);margin:0 0 var(--s3)}
.pk__sum b{color:var(--ink);font-weight:600}
.pk__modes{list-style:none;margin:0;padding:var(--s2);border-top:1px solid var(--border);background:#fcfcfd}
.pk__modes a{display:flex;align-items:center;gap:var(--s3);padding:10px var(--s3);border-radius:var(--r-md);text-decoration:none;color:var(--text)}
.pk__modes a:hover{background:var(--surface-2)}
.pk__modes b{display:block;font-weight:600;color:var(--ink);font-size:15px;line-height:1.35}
.pk__modes small{display:block;font-size:13px;color:var(--text-2)}
.pk__ic{display:grid;place-items:center;width:36px;height:36px;flex:none;border-radius:var(--r-md);background:var(--surface);border:1px solid var(--border);color:var(--accent)}
.pk__modes .i-chev{margin-left:auto;color:var(--faint)}
.pk__modes a:hover .i-chev{color:var(--accent)}
.pk__modes .badge + .i-chev{margin-left:8px}
.pk__modes .badge[hidden] + .i-chev{margin-left:auto}
.pk__other{border-top:1px solid var(--border)}
.pk__other > summary{display:flex;align-items:center;gap:8px;padding:14px var(--s5);cursor:pointer;list-style:none;font-size:15px;font-weight:500;color:var(--text-2)}
.pk__other > summary::-webkit-details-marker{display:none}
.pk__other > summary .i{margin-left:auto;color:var(--faint);transition:transform .2s}
.pk__other[open] > summary .i{transform:rotate(180deg)}
.pk__other > summary:hover{color:var(--ink);background:var(--surface-2)}


/* ===== раскладки страниц ===== */
.hero{display:grid;gap:var(--s8);align-items:start}
@media (min-width:1024px){.hero{grid-template-columns:minmax(0,1fr) 480px;gap:var(--s16)}.hero__aside{position:sticky;top:calc(var(--hdr-h) + 24px)}}
.hero h1{margin-bottom:var(--s3)}
.hero__note{font-size:13px;line-height:1.5;color:var(--muted);margin:var(--s3) 0 0}
.split{display:grid;gap:var(--s10);margin-top:var(--s16)}
@media (min-width:1024px){.split{grid-template-columns:minmax(0,1fr) 340px;gap:var(--s12)}.split__aside{position:sticky;top:calc(var(--hdr-h) + 24px);align-self:start}}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--sh-xs);padding:var(--s5)}
@media (min-width:640px){.card{padding:var(--s8)}}

/* главная */
.home-hero > *{min-width:0}
.display{font-size:clamp(28px,2vw + 18px,46px);line-height:1.12;letter-spacing:-.022em}
.home-hero .label{color:var(--accent);margin-bottom:var(--s3)}
.trust{list-style:none;margin:0 0 var(--s5);padding:0;display:flex;flex-wrap:wrap;gap:var(--s2) var(--s5);font-size:14px;color:var(--text-2)}
.trust li{display:flex;align-items:center;gap:8px}
.trust .i{width:18px;height:18px;color:var(--ok)}
/* главная: заголовок и плитки экзаменов шахматкой (синий / бледно-голубой); плитка — одна ссылка на раздел, будущие разделы приглушены */
.home-hero{padding:var(--s4) 0 var(--s6)}
@media (min-width:1024px){.home-hero{padding:var(--s10) 0 var(--s8)}.home-hero h1{max-width:none;margin-bottom:var(--s4)}.home-hero .lead{margin:0}}
.home-hero .lead{max-width:860px}
.resume{position:relative;margin:0 0 var(--s5)}
.resume__link{display:flex;align-items:center;gap:var(--s4);padding:16px 64px 16px 18px;border-radius:20px;background:var(--surface);border:1px solid #d2e1ff;box-shadow:var(--sh-xs);color:var(--text);text-decoration:none;transition:border-color .15s,box-shadow .15s}
.resume__x{position:absolute;top:50%;right:14px;transform:translateY(-50%);display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:50%;background:transparent;color:var(--muted);cursor:pointer}
.resume__x:hover{background:var(--surface-2);color:var(--ink)}
.resume[hidden],.resume__link[hidden]{display:none}
.resume__link:hover{border-color:var(--accent);box-shadow:var(--sh-md)}
.resume__ic{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:50%;background:var(--accent);color:#fff}
.resume__body{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.resume__k{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.resume__name{font:600 17px/1.3 Unbounded,var(--font);letter-spacing:-.01em;color:var(--ink)}
.resume__row{display:flex;align-items:center;gap:12px;margin-top:6px}
.resume__bar{position:relative;flex:1;max-width:280px;height:6px;border-radius:99px;background:#e3ebfb;overflow:hidden}
.resume__bar i{position:absolute;inset:0 auto 0 0;width:3%;border-radius:99px;background:var(--accent)}
.resume__p{font-size:14px;color:var(--text-2);white-space:nowrap}
.resume__go{display:inline-flex;align-items:center;gap:8px;flex:none;padding:12px 18px;border-radius:99px;background:var(--accent);color:#fff;font-weight:600;font-size:15px}
@media (max-width:639px){.resume__link{flex-wrap:wrap;padding:14px 52px 14px 14px}.resume__x{top:12px;right:8px;transform:none}.resume__ic{width:40px;height:40px}.resume__go{width:100%;justify-content:center}}
.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));list-style:none;margin:0;padding:0;border-radius:24px;overflow:hidden}
.tiles > li{display:flex;min-width:0}
.tl{position:relative;display:flex;flex-direction:column;width:100%;min-height:270px;padding:28px;background:#d2e1ff;color:var(--ink);text-decoration:none;transition:filter .2s}
.tiles > li:nth-child(odd) .tl{background:var(--accent);color:#fff}
a.tl:hover{filter:brightness(1.05)}
a.tl:focus-visible{outline:3px solid var(--ink);outline-offset:-3px}
.tl__num{position:absolute;top:22px;right:26px;font:500 13px/1 var(--mono);opacity:.55}
.tl__ic{color:var(--accent)}
.tiles > li:nth-child(odd) .tl__ic{color:#fff}
.tl__ic .i{width:30px;height:30px}
.tl__t{margin-top:auto;font:600 clamp(17px,1.6vw,21px)/1.2 Unbounded,var(--font);letter-spacing:-.02em}
.tl__meta{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 12px;margin-top:12px;font-size:16px}
.tl__meta b{font-size:17px;font-weight:700}
.tl__sub{opacity:.85}
.tl__hint{margin-top:8px;padding-right:56px;font-size:15px;line-height:1.45;opacity:.8}
.tl__go{position:absolute;right:24px;bottom:24px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--accent);color:#fff;transition:transform .2s}
.tiles > li:nth-child(odd) .tl__go{background:#fff;color:var(--accent)}
a.tl:hover .tl__go{transform:translateX(4px)}
.tl__pill{display:inline-block;padding:4px 12px;border-radius:99px;background:#fff;color:#6b7fa8;font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.tl--soon{background:#f0f4fc;color:#7f8fb0}
.tiles > li:nth-child(odd) .tl--soon{background:#a9bfec;color:#f2f6ff}
.tl--soon .tl__ic,.tiles > li:nth-child(odd) .tl--soon .tl__ic{color:inherit}
/* телефон и планшет: действующие экзамены во всю ширину, «скоро» по две; синие — 1, 3, 6 */
@media (max-width:959px){
.tiles{grid-template-columns:repeat(2,minmax(0,1fr));border-radius:20px}
.tiles > li:nth-child(-n+2){grid-column:span 2}
.tl{min-height:170px;padding:20px}
.tl--soon{min-height:140px}
.tl__num{display:none}
.tl__ic .i{width:24px;height:24px}
.tl__t{font-size:17px;padding-right:0}
.tl__meta{font-size:15px}.tl__meta b{font-size:16px}
.tl--soon .tl__t{font:600 16px/1.25 var(--font);letter-spacing:0}
.tl--soon{padding:16px}
.tl__hint{display:none}
.tl__go{top:18px;right:18px;bottom:auto;width:36px;height:36px}
.tiles > li:nth-child(n) .tl{background:#d2e1ff;color:var(--ink)}
.tiles > li:nth-child(n) .tl__ic{color:var(--accent)}
.tiles > li:nth-child(n) .tl__go{background:var(--accent);color:#fff}
.tiles > li:is(:nth-child(1),:nth-child(3),:nth-child(6)) .tl{background:var(--accent);color:#fff}
.tiles > li:is(:nth-child(1),:nth-child(3),:nth-child(6)) .tl__ic{color:#fff}
.tiles > li:is(:nth-child(1),:nth-child(3),:nth-child(6)) .tl__go{background:#fff;color:var(--accent)}
.tiles > li:nth-child(n) .tl--soon{background:#f0f4fc;color:#7f8fb0}
.tiles > li:is(:nth-child(3),:nth-child(6)) .tl--soon{background:#a9bfec;color:#f2f6ff}
.tiles > li:nth-child(n) .tl--soon .tl__ic{color:inherit}
}

/* хаб */
@media (max-width:519px){.matrix__head,.matrix__row{grid-template-columns:44px 1fr 1fr}.matrix__row a b{font-size:14px}}

/* страница теста */
.facts{list-style:none;margin:var(--s6) 0 0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden}
@media (min-width:640px){.facts{grid-template-columns:repeat(4,1fr)}}
.facts li{background:var(--surface);padding:var(--s4) var(--s5)}
.facts b{display:block;font-size:28px;line-height:1.1;font-weight:600;color:var(--ink);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.facts span{display:block;font-size:13px;line-height:1.4;color:var(--muted);margin-top:4px}
.notice,.note{display:flex;gap:var(--s3);align-items:flex-start;margin:var(--s4) 0 0;padding:12px 14px;border-radius:var(--r-md);background:var(--warn-bg);border:1px solid var(--warn-line);color:var(--warn-ink);font-size:14px;line-height:1.55;max-width:var(--measure)}
.notice .i,.note .i{color:#b45309;margin-top:1px}
.notice--info{background:var(--accent-50);border-color:var(--accent-100);color:#1e3a8a}
.notice--info .i{color:var(--accent)}
.topic{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);margin-bottom:var(--s2);box-shadow:var(--sh-xs);overflow:hidden}
.topic summary{display:flex;align-items:center;gap:var(--s3);min-height:56px;padding:0 var(--s5);cursor:pointer;list-style:none;font-weight:600;color:var(--ink)}
.topic summary::-webkit-details-marker{display:none}
.topic summary:hover{background:var(--surface-2)}
.topic__s{font-weight:500;font-size:13px;color:var(--muted);white-space:nowrap}
.topic__n{margin-left:auto;padding:2px 8px;border-radius:var(--r-full);background:var(--surface-2);color:var(--text-2);font:500 13px/1.4 var(--font);font-variant-numeric:tabular-nums}
.topic .i-chev{color:var(--muted);transition:transform .2s}
.topic[open] .i-chev{transform:rotate(180deg)}
.topic[open] summary{border-bottom:1px solid var(--border)}
.qlist{list-style:none;margin:0;padding:var(--s1) 0;counter-reset:q;font-size:15px}
.qlist li{counter-increment:q}
.qlist a{display:flex;gap:var(--s3);padding:10px var(--s5);color:var(--text);text-decoration:none;line-height:1.5}
.qlist a::before{content:counter(q);flex:none;min-width:2.4em;color:var(--muted);font:500 13px/1.75 var(--mono);text-align:right}
.qlist a:hover{background:var(--surface-2);color:var(--accent)}
.faq details{border-bottom:1px solid var(--border)}
.faq details:first-of-type{border-top:1px solid var(--border)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:var(--s4);padding:18px 0;cursor:pointer;list-style:none;font-weight:600;color:var(--ink);font-size:17px}
.faq summary::-webkit-details-marker{display:none}
.faq summary .i{color:var(--muted);transition:transform .2s}
.faq details[open] summary .i{transform:rotate(45deg)}
.faq p{margin:0 0 18px;color:var(--text-2);max-width:var(--measure)}

/* строки списков */
.rows{list-style:none;margin:0;padding:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden}
.rows > li + li{border-top:1px solid var(--border)}
.row{display:flex;align-items:center;gap:var(--s3);padding:14px var(--s4);color:var(--text);text-decoration:none;line-height:1.5;transition:background-color .12s}
.row:hover{background:var(--surface-2);color:var(--ink)}
.row__t{flex:1;min-width:0}
.row .i-chev{flex:none;color:var(--faint)}
.row:hover .i-chev{color:var(--accent)}
.rows--compact .row{padding:10px var(--s4);font-size:15px}

/* ===== варианты ответа ===== */
.opts{list-style:none;margin:0 0 var(--s4);padding:0;display:grid;gap:var(--s2)}
.opt{display:flex;gap:14px;align-items:flex-start;width:100%;text-align:left;padding:13px 16px;border:1px solid var(--border-2);border-radius:var(--r-md);background:var(--surface);color:var(--text);font:400 16px/1.55 var(--font);box-shadow:var(--sh-xs);transition:border-color .12s,background-color .12s,box-shadow .12s}
.opt__m{flex:none;display:grid;place-items:center;width:28px;height:28px;margin-top:-2px;border-radius:50%;background:var(--surface-2);border:1px solid var(--border);color:var(--text-2);font:600 13px/1 var(--font)}
.opts--multi .opt__m{border-radius:7px}
.opt__m .i{width:16px;height:16px;stroke-width:2.5}
button.opt{cursor:pointer}
@media (hover:hover){
  button.opt:hover:not([disabled]){border-color:var(--accent);background:var(--accent-50)}
  button.opt:hover:not([disabled]) .opt__m{border-color:var(--accent);color:var(--accent);background:#fff}
}
button.opt:focus-visible{outline:0;border-color:var(--accent);box-shadow:var(--ring)}
button.opt:active:not([disabled]){background:var(--accent-100)}
.opt.is-picked{border-color:var(--accent);background:var(--accent-50);box-shadow:inset 0 0 0 1px var(--accent)}
.opt.is-picked .opt__m{background:var(--accent);border-color:var(--accent);color:#fff}
.opt--ok{border-color:var(--ok);background:var(--ok-bg);box-shadow:inset 0 0 0 1px var(--ok);color:var(--ink)}
.opt--ok .opt__m{background:var(--ok);border-color:var(--ok);color:#fff}
.opt--bad{border-color:var(--bad);background:var(--bad-bg);box-shadow:inset 0 0 0 1px var(--bad);color:var(--ink)}
.opt--bad .opt__m{background:var(--bad);border-color:var(--bad);color:#fff}
button.opt[disabled]{cursor:default}
button.opt[disabled]:not(.opt--ok):not(.opt--bad){box-shadow:none;color:var(--text-2)}
button.opt[disabled]:not(.opt--ok):not(.opt--bad) .opt__m{color:var(--faint)}

.fb{display:grid;gap:6px;margin:var(--s3) 0 0;padding:14px 16px 16px;border:1px solid;border-radius:var(--r-md);font-size:15px;line-height:1.6;color:var(--text);animation:fbin .18s ease-out}
@keyframes fbin{from{opacity:0;transform:translateY(4px)}}
.fb--ok{background:var(--ok-bg);border-color:var(--ok-line)}
.fb--bad{background:var(--bad-bg);border-color:var(--bad-line)}
.fb b{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:600}
.fb--ok b{color:var(--ok-ink)}
.fb--bad b{color:var(--bad-ink)}
.fb p{margin:0}
.fb__more{justify-self:start;display:inline-flex;align-items:center;gap:6px;margin-top:2px;color:var(--accent);font-size:14px;font-weight:500;text-decoration:none}
.fb__more:hover{text-decoration:underline}
/* обоснование в тренажёре: документ, пункт, дословная цитата */
.fbc{margin:6px 0 2px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden}
.fbc__src{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;background:var(--surface-2);border-bottom:1px solid var(--border);font-size:13px;line-height:1.45;color:var(--text-2)}
.fbc__src > .i{color:var(--accent);margin-top:1px}
.fbc__src b{display:block;color:var(--ink);font-weight:600;font-size:14px}
.fbc__doc{display:block;color:var(--muted)}
.fbc__p{margin-left:auto;flex:none;padding:2px 8px;border-radius:var(--r-sm);background:var(--surface);border:1px solid var(--border);font:500 13px/1.4 var(--mono);color:var(--ink);white-space:nowrap}
.fbc__q{position:relative;margin:0;padding:12px 14px 12px 28px;font-size:15px;line-height:1.6;color:var(--ink)}
.fbc__q::before{content:"";position:absolute;left:14px;top:12px;bottom:12px;width:3px;border-radius:2px;background:var(--accent)}

/* ===== страница вопроса ===== */
.qpage{display:grid;gap:var(--s10)}
@media (min-width:1024px){.qpage{grid-template-columns:minmax(0,800px) 320px;justify-content:space-between;gap:var(--s12)}.qside{position:sticky;top:calc(var(--hdr-h) + 24px);align-self:start}}
.qmain{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--sh-xs);padding:var(--s6) var(--s5)}
@media (min-width:640px){.qmain{padding:var(--s8) var(--s10)}}
@media (max-width:639px){.qmain{background:none;border:0;box-shadow:none;padding:0}}
.qh{font-size:clamp(21px,.9vw + 16px,26px);line-height:1.35;letter-spacing:-.012em;margin-bottom:var(--s3)}
.qsrc{font-size:14px;color:var(--muted);margin:0 0 var(--s5)}
.why{margin-top:var(--s6)}
.why p{margin:0;font-size:17px;line-height:1.65;color:var(--text)}
.cite{margin:var(--s6) 0 0;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-xs)}
.cite__src{display:flex;gap:var(--s3);align-items:flex-start;padding:14px var(--s5);background:var(--surface-2);border-bottom:1px solid var(--border)}
.cite__src > .i{color:var(--accent);margin-top:2px}
.cite__act{display:block;color:var(--ink);font-weight:600;font-size:15px;line-height:1.4}
.cite__doc{display:block;color:var(--muted);font-size:13px;line-height:1.5;margin-top:2px}
.cite__p{margin-left:auto;flex:none;padding:3px 8px;border-radius:var(--r-sm);background:var(--surface);border:1px solid var(--border);font:500 13px/1.3 var(--mono);color:var(--ink);white-space:nowrap}
.cite blockquote{position:relative;margin:0;padding:var(--s5) var(--s5) var(--s5) calc(var(--s5) + 14px);font-size:17px;line-height:1.65;color:var(--ink)}
.cite blockquote::before{content:"";position:absolute;left:var(--s5);top:var(--s5);bottom:var(--s5);width:3px;border-radius:2px;background:var(--accent)}
.cite__foot{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:0;padding:12px var(--s5);border-top:1px solid var(--border);font-size:13px;color:var(--muted)}
.cite__foot .i{width:16px;height:16px;color:var(--ok)}
.cite__foot a{color:var(--muted)}
.qnext{display:flex;gap:var(--s2);flex-wrap:wrap;margin-top:var(--s6)}
.qnext .btn{flex:1 1 200px;white-space:normal;text-align:center;padding-top:8px;padding-bottom:8px}
.qcta{padding:var(--s5)!important}
.qcta__t{font-weight:600;color:var(--ink);font-size:16px;line-height:1.4;margin:6px 0 var(--s4)}
.qcta .btn{white-space:normal;text-align:center}
.qcta .btn + .btn{margin-top:var(--s2)}

/* ===== тренажёр (режим фокуса) ===== */
/* шапка в тренажёре та же, что везде; только не прилипает — прилипает строка тренажёра */
.is-trainer .ftr{display:none}
.is-trainer .hdr{position:relative}
.is-trainer main{padding-top:var(--s2)}
.tr{margin:0 auto}
.tr__bar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:var(--s3);padding:var(--s2) 0;background:var(--bg);font-size:14px;color:var(--muted)}
.tr__x{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 10px 0 6px;margin-left:-6px;border-radius:var(--r-sm);color:var(--text);text-decoration:none;font-weight:500}
.tr__x:hover{background:var(--surface-2);color:var(--ink)}
.tr__x small{color:var(--muted);font-weight:400;font-size:14px}
.tr__x{min-width:0}.tr__x span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tr__cnt,.tr__timer,.tr__end{flex:none;white-space:nowrap}
@media (max-width:639px){.tr__x small{display:none}.tr__bar{gap:var(--s2)}}
.tr__end{color:var(--accent);text-decoration:none;font-weight:500;padding:8px 4px;min-height:44px;display:inline-flex;align-items:center}
.tr__cnt{margin-left:auto;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.tr__timer{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:var(--r-full);background:var(--surface);border:1px solid var(--border);font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.tr__timer.is-low{color:var(--bad-ink);background:var(--bad-bg);border-color:var(--bad-line)}
.prog{display:flex;gap:4px;margin:var(--s1) 0 0}
.prog > *{flex:1;height:6px;border-radius:3px;background:var(--surface-3);transition:background-color .2s}
.prog .is-ok{background:var(--ok)}
.prog .is-bad{background:var(--bad)}
.prog .is-done{background:#64748b}
.prog .is-cur{background:var(--ink)}
.prog .is-skip{background:var(--surface-3)}
@media (max-width:1023px){
  .prog a{height:28px;border-radius:6px;display:grid;place-items:center;font:600 12px/1 var(--font);color:var(--text-2);text-decoration:none}
  .prog a.is-ok,.prog a.is-bad,.prog a.is-done,.prog a.is-cur{color:#fff}
}
.bar{height:6px;border-radius:3px;background:var(--surface-3);overflow:hidden;margin-top:var(--s1)}
.bar b{display:block;height:100%;background:var(--accent);border-radius:inherit}
.tr__grid{display:grid;gap:var(--s6);margin-top:var(--s4);align-items:start}
@media (min-width:1024px){.tr__grid{grid-template-columns:minmax(0,1fr) 264px}}
.tr__grid--single{grid-template-columns:minmax(0,820px)!important;justify-content:center}
.tr__card{padding:var(--s6) var(--s5)}
@media (min-width:640px){.tr__card{padding:var(--s8)}}
@media (max-width:639px){.tr__card{background:none;border:0;box-shadow:none;padding:0}}
.tr__meta{margin:0 0 var(--s2);font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.tr__intro{margin:0 0 var(--s4);font-size:14px}
.tr__q{font-size:clamp(19px,.8vw + 15px,22px);font-weight:600;line-height:1.45;letter-spacing:-.006em;color:var(--ink);margin:0 0 var(--s5);text-wrap:pretty}
.tr__multi{margin:-8px 0 var(--s3);font-weight:600;color:var(--accent);font-size:15px}
.tr__fbw{scroll-margin-bottom:calc(110px + env(safe-area-inset-bottom))}
.tr__nav{display:flex;align-items:center;gap:var(--s3);margin-top:var(--s6);padding-top:var(--s5);border-top:1px solid var(--border)}
.tr__nav [data-next]{min-width:220px}
.tr__back{width:var(--h);padding:0}
.tr__back[aria-disabled="true"]{color:var(--faint)}
.tr__keys{margin-left:auto;font-size:13px;color:var(--muted)}
.tr__keys kbd{display:inline-block;min-width:22px;padding:1px 6px;border:1px solid var(--border-2);border-bottom-width:2px;border-radius:6px;background:var(--surface);font:500 12px/1.5 var(--mono);color:var(--text-2);text-align:center}
@media (hover:none),(pointer:coarse),(max-width:639px){.tr__keys{display:none}}
@media (max-width:639px){
  .tr__nav{position:fixed;left:0;right:0;bottom:0;z-index:30;margin:0;padding:10px 16px calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--border);background:rgba(255,255,255,.94);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
  .tr__nav .btn{--h:52px}
  .tr__nav [data-next]{flex:1;min-width:0;font-size:16px}
  .is-trainer main{padding-bottom:120px}
}
.map{position:sticky;top:var(--s16);padding:var(--s5)!important}
@media (max-width:1023px){.map{display:none}}
.map__grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:0 0 var(--s4)}
.map__grid a{aspect-ratio:1;display:grid;place-items:center;border-radius:var(--r-sm);background:var(--surface-2);border:1px solid transparent;color:var(--text-2);font:600 14px/1 var(--font);font-variant-numeric:tabular-nums;text-decoration:none;transition:border-color .12s}
.map__grid a:hover{border-color:var(--border-2);color:var(--ink)}
.map__grid a.is-ok{background:var(--ok-100);color:var(--ok-ink)}
.map__grid a.is-bad{background:var(--bad-100);color:var(--bad-ink)}
.map__grid a.is-done{background:var(--accent-100);color:var(--accent-a)}
.map__grid a.is-cur{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring);color:var(--ink);background:#fff}
.map__stat{display:flex;gap:var(--s4);margin:0 0 var(--s2);font-size:14px;color:var(--text-2)}
.map__stat b{font-variant-numeric:tabular-nums;color:var(--ink)}
.map__pass{font-size:13px;color:var(--muted);margin:0 0 var(--s4)}
.skel i{display:block;height:54px;border-radius:var(--r-md);margin:8px 0;background:linear-gradient(90deg,var(--surface-2),var(--surface-3),var(--surface-2));background-size:200% 100%;animation:sh 1.2s infinite}
.skel i:first-child{height:60px;width:85%;margin-bottom:16px}
@keyframes sh{to{background-position:-200% 0}}
.empty{text-align:center;padding:var(--s8) 0}
.empty > .i{width:40px;height:40px;color:var(--ok);margin-bottom:var(--s3)}
.empty p{color:var(--text-2)}

/* результат */
.res{text-align:center;padding:var(--s2) 0}
.res__big{margin:var(--s3) 0;font-size:64px;line-height:1;font-weight:700;letter-spacing:-.03em;color:var(--ink);font-variant-numeric:tabular-nums}
.res__big small{font-size:28px;font-weight:500;color:var(--muted);letter-spacing:-.01em}
.res__badge{display:inline-flex;align-items:center;gap:8px;margin:0;padding:6px 14px;border-radius:var(--r-full);font-weight:600;font-size:15px}
.res__badge.is-ok{background:var(--ok-100);color:var(--ok-ink)}
.res__badge.is-bad{background:var(--bad-100);color:var(--bad-ink)}
.res__hint{margin:var(--s3) 0 0;font-size:14px;color:var(--muted)}
.res__prog{max-width:360px;margin:var(--s5) auto 0}
.res__btns{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s2);margin:var(--s6) 0 0}
@media (max-width:479px){.res__btns .btn{flex:1 1 100%}}
.res__h{font-size:18px;margin:var(--s10) 0 var(--s3)}
.rlist .row{align-items:flex-start}
.rlist__ic{display:grid;place-items:center;width:24px;height:24px;flex:none;border-radius:50%;margin-top:1px}
.rlist__ic .i{width:14px;height:14px;stroke-width:2.5}
.is-ok .rlist__ic{background:var(--ok-100);color:var(--ok-ink)}
.is-bad .rlist__ic{background:var(--bad-100);color:var(--bad-ink)}
.is-skip .rlist__ic{background:var(--surface-2);color:var(--muted)}
.rlist__n{font:500 13px/1.7 var(--mono);color:var(--muted);flex:none;min-width:1.6em}
.rlist__q{display:block;color:var(--ink);font-weight:500;font-size:15px;line-height:1.5}
.rlist__a{display:grid;gap:2px;margin-top:6px;font-size:14px;color:var(--text-2)}
.rlist__a .is-right{color:var(--ok-ink)}
.is-bad .rlist__a .is-your{color:var(--bad-ink)}

/* ===== статьи ===== */
.doc{display:grid;gap:var(--s10)}
@media (min-width:1024px){.doc{grid-template-columns:minmax(0,800px) 300px;justify-content:space-between}.doc__side{position:sticky;top:calc(var(--hdr-h) + 24px);align-self:start}}
.prose-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--sh-xs);padding:var(--s8) var(--s5)}
@media (min-width:640px){.prose-card{padding:var(--s10) var(--s12)}}
.prose h2{margin-top:var(--s10)}
.prose p,.prose :is(ul,ol):not(.facts):not(.rows):not(.timeline) > li{max-width:68ch}
.prose :is(ul,ol):not(.facts):not(.rows):not(.timeline) > li{margin:6px 0}
.timeline{list-style:none;counter-reset:st;margin:var(--s5) 0;padding:0}
.timeline li{counter-increment:st;position:relative;padding:0 0 var(--s6) 52px;margin:0}
.timeline li::before{content:counter(st);position:absolute;left:0;top:0;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--accent-50);color:var(--accent);font:600 14px/1 var(--font);border:1px solid var(--accent-100)}
.timeline li::after{content:"";position:absolute;left:15.5px;top:36px;bottom:4px;width:1px;background:var(--border-2)}
.timeline li:last-child::after{display:none}
.timeline b{display:block;color:var(--ink);font-weight:600;margin-bottom:2px}
.facts-side{list-style:none;margin:0;padding:var(--s5);display:grid;gap:var(--s4);background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg)}
.facts-side li{display:flex;gap:var(--s3);font-size:14px;line-height:1.5;color:var(--text-2)}
.facts-side .i{color:var(--accent);margin-top:1px}

/* реклама: место резервируется только когда реклама включена */
.ad{min-height:var(--ad-h);margin:var(--s6) 0}

/* ===== подвал ===== */
.ftr{background:var(--surface);border-top:1px solid var(--border);padding:var(--s12) 0 var(--s8);font-size:15px;color:var(--text-2);margin-top:var(--s8)}
.ftr__in{display:grid;gap:var(--s8) var(--s6);grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
@media (min-width:960px){.ftr__in{grid-template-columns:1.6fr 1fr 1fr 1fr}}
@media (max-width:479px){.ftr__in{grid-template-columns:minmax(0,1fr)}}
.ftr__brand{grid-column:1/-1}
@media (min-width:960px){.ftr__brand{grid-column:auto;padding-right:var(--s8)}}
.ftr__brand .logo{margin-bottom:var(--s3)}
.ftr__brand p{font-size:14px;line-height:1.6;margin:0 0 var(--s2)}
.ftr__h{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 var(--s3)}
.ftr__list{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.ftr__list a,.ftr a{color:var(--text-2);text-decoration:none}
.ftr__list a{display:inline-flex;align-items:center;gap:6px;padding:5px 0}
.ftr__list a:hover,.ftr a:hover{color:var(--accent)}
.ftr__bottom{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s6);justify-content:space-between;margin-top:var(--s10);padding-top:var(--s5);border-top:1px solid var(--border);font-size:13px;color:var(--muted)}

/* страница теста: заголовок → выбор (старт) → факты; на ПК выбор справа на всю высоту */
.hero--test{grid-template-areas:"head" "aside" "more"}
.hero--test .hero__head{grid-area:head}
.hero--test .hero__aside{grid-area:aside}
.hero--test .hero__more{grid-area:more}
.hero--test .facts{margin-top:0}
@media (min-width:1024px){.hero--test{grid-template-areas:"head aside" "more aside";row-gap:var(--s6)}}

.ftr__bottom a,.ftr__brand a:not(.logo){text-decoration:underline;text-decoration-color:rgba(71,84,103,.4);text-underline-offset:3px}

/* плашка о cookies: внизу, не перекрывает контент сверху, на тренажёре — над панелью */
.ck{position:fixed;left:16px;right:16px;bottom:16px;z-index:50;display:flex;align-items:center;gap:var(--s3);max-width:560px;margin:0 auto;padding:12px 12px 12px 16px;border-radius:var(--r-lg);background:var(--ink);color:#fff;font-size:14px;line-height:1.45;box-shadow:var(--sh-md)}
.ck a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.ck .btn{flex:none;background:#fff;color:var(--ink);border-color:#fff}
.q-lead{display:block;margin-bottom:4px;color:var(--text-2)}
.qback{display:inline-flex;align-items:center;gap:8px;margin:0 0 var(--s4);padding:8px 14px 8px 10px;border-radius:var(--r-full);background:var(--accent-50);border:1px solid var(--accent-100);color:var(--accent);font-size:14px;font-weight:600;text-decoration:none}
.qback:hover{border-color:var(--accent)}
.qback[hidden]{display:none}

/* главная: «Как это устроено» — пункты слева, живой пример разбора справа */
.how{display:grid;gap:var(--s8);margin:var(--s12) 0 0;padding:var(--s8);border-radius:24px;background:#eef3fd}
@media (min-width:960px){.how{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s12);padding:var(--s12)}}
@media (max-width:639px){.how{padding:var(--s6) var(--s5);border-radius:20px}}
.how h2{font:600 clamp(22px,2vw,28px)/1.2 Unbounded,var(--font);letter-spacing:-.02em;margin:0 0 var(--s6)}
.how__list{list-style:none;margin:0;padding:0;counter-reset:how;display:grid;gap:var(--s5)}
.how__list li{counter-increment:how;display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:var(--s4)}
.how__list li::before{content:counter(how,decimal-leading-zero);grid-row:span 2;font:600 15px/1.6 var(--mono);color:var(--accent)}
.how__list b{font-size:17px;color:var(--ink)}
.how__list span{font-size:16px;line-height:1.55;color:var(--text-2)}
.how__demo{align-self:start;margin:0;padding:var(--s6);border-radius:20px;background:var(--surface);box-shadow:var(--sh-md)}
.how__cap{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:var(--s3)}
.how__q{margin:0 0 var(--s4);font-size:18px;font-weight:600;line-height:1.4;color:var(--ink)}
.how__opt{display:flex;align-items:flex-start;gap:10px;margin:0 0 var(--s2);padding:10px 14px;border-radius:var(--r-md);font-weight:600;line-height:1.4}
.how__opt .i{flex:none;margin-top:2px}
.how__opt small{display:block;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;opacity:.8}
.how__opt--bad{background:var(--bad-bg);border:1px solid var(--bad-line);color:var(--bad-ink)}
.how__opt s{text-decoration-thickness:1px}
.how__opt--ok{background:var(--ok-bg);border:1px solid var(--ok-line);color:var(--ok-ink)}
.how__why{margin:var(--s4) 0;font-size:15px;line-height:1.6;color:var(--text)}
.how__why b{color:var(--ink)}
.how__quote{margin:0;padding:var(--s4);border-left:3px solid var(--accent);background:#f6f8fd;border-radius:0 var(--r-md) var(--r-md) 0;font-size:15px;line-height:1.6;color:var(--text)}
.how__src{display:block;margin-bottom:6px;font-size:13px;font-weight:600;color:var(--accent)}
.how__more{display:inline-flex;align-items:center;gap:6px;margin-top:var(--s4);font-weight:600;color:var(--accent);text-decoration:none}
.how__more:hover{text-decoration:underline}

/* раздел (хаб): заголовок, карточки групп с двумя кнопками напряжения, «как выбрать» карточками */
.hub-hero{padding:var(--s4) 0 var(--s6)}
@media (min-width:1024px){.hub-hero{padding:var(--s6) 0 var(--s8)}}
.hub-hero h1{font-size:clamp(28px,1.6vw + 18px,42px);line-height:1.15;letter-spacing:-.02em;margin-bottom:var(--s3)}
.hub-hero .lead{max-width:860px;margin:0}
.gcards{list-style:none;margin:0;padding:0;display:grid;gap:var(--s4);grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1100px){.gcards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:599px){.gcards{grid-template-columns:minmax(0,1fr)}}
.gcard{display:flex;flex-direction:column;padding:var(--s6);border-radius:20px;background:var(--surface);border:1px solid #d2e1ff;box-shadow:var(--sh-xs)}
.gcard__n{font:600 56px/1 Unbounded,var(--font);color:var(--accent);letter-spacing:-.04em}
.gcard__w{margin-top:2px;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.gcard__t{margin-top:var(--s4);font-size:18px;font-weight:600;color:var(--ink);line-height:1.3}
.gcard__d{margin-top:6px;font-size:15px;line-height:1.55;color:var(--text-2)}
.gcard__go{display:grid;gap:8px;margin-top:auto;padding-top:var(--s5)}
.hub-note{display:flex;align-items:flex-start;gap:8px;margin:var(--s4) 0 0;font-size:15px;color:var(--text-2)}
.hub-note .i{flex:none;margin-top:3px;color:var(--accent)}
.faqcards{display:grid;gap:var(--s4);grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:767px){.faqcards{grid-template-columns:minmax(0,1fr)}}
.faqcards > div{padding:var(--s6);border-radius:20px;background:#eef3fd}
.faqcards h3{margin:0 0 var(--s2);font-size:18px}
.faqcards p{margin:0;font-size:16px;line-height:1.6;color:var(--text-2)}
.gcards__h{margin:0 0 var(--s4);font-size:20px}

.gcards__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 20px;margin:0 0 var(--s4)}
.gcards__head .gcards__h{margin:0}
.gcards__help{display:inline-flex;align-items:center;gap:6px;font-size:15px;font-weight:500;color:var(--accent);text-decoration:none}
.gcards__help:hover{text-decoration:underline}
.gcard{position:relative}
.gcard__badge{position:absolute;top:18px;right:18px;padding:4px 10px;border-radius:99px;background:#d2e1ff;color:#1e40af;font-size:12px;font-weight:600}
.gcard__same{display:flex;align-items:center;gap:6px;margin-top:10px;font-size:14px;color:var(--accent)}
.gbtn{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:10px;min-height:56px;padding:10px 14px;border-radius:14px;background:var(--surface);border:1.5px solid #d2e1ff;color:var(--ink);text-decoration:none;transition:background-color .15s,border-color .15s}
.gbtn span{font-weight:600;font-size:16px}
.gbtn small{grid-column:1;font-size:13px;color:var(--text-2)}
.gbtn .i{grid-row:1/span 2;grid-column:2;color:var(--accent);transition:transform .15s}
.gbtn:hover{background:#eef3fd;border-color:var(--accent)}
.gbtn:hover .i{transform:translateX(3px)}
.resume__err{display:inline-flex;align-items:center;gap:8px;margin:8px 0 0 4px;font-size:15px;font-weight:500;color:var(--bad-ink);text-decoration:none}
.resume__err[hidden]{display:none}
.resume__err:hover span{text-decoration:underline}
/* телефон: карточки групп компактнее, кнопки напряжения строками «название · число · стрелка» */
@media (max-width:599px){
.gcard{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:14px;padding:18px}
.gcard__badge{top:14px;right:14px}
.gcard__n{grid-row:1/span 2;font-size:44px;align-self:center}
.gcard__w{grid-column:2;margin:0;align-self:end}
.gcard__t{grid-column:2;margin:0;font-size:17px;padding-right:84px}
.gcard__d{grid-column:1/-1;margin-top:10px;font-size:14px}
.gcard__same{grid-column:1/-1}
.gcard__go{grid-column:1/-1;padding-top:14px}
.gbtn{grid-template-columns:minmax(0,1fr) auto auto;min-height:50px}
.gbtn small{grid-column:2;grid-row:1}
.gbtn .i{grid-column:3;grid-row:1}
}
@media (max-width:639px){.resume__x{width:44px;height:44px;top:6px;right:4px}}
@media (max-width:599px){.hub-hero{padding-bottom:var(--s4)}.hub-hero .lead{font-size:16px}}

/* страница теста: продолжение своего билета — первой строкой карточки */
.pk__cont{display:flex;align-items:center;gap:12px;padding:14px var(--s5);background:#eef3fd;border-bottom:1px solid #d2e1ff;color:var(--ink);text-decoration:none}
.pk__cont[hidden]{display:none}
.pk__cont-ic{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:50%;background:var(--accent);color:#fff}
.pk__cont > .i{margin-left:auto;color:var(--accent)}
.pk__cont-t{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.pk__cont-t b{font-size:15px;font-weight:600}
.pk__cont-row{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--text-2)}
.pk__cont-row .resume__bar{max-width:160px}
.pk__cont:hover{background:#d2e1ff}

/* длинные списки вопросов по документу: сначала 20, остальное — по кнопке */
.qlist.is-cut > li:nth-child(n+21){display:none}
.qmore{display:block;width:calc(100% - 2*var(--s5));margin:var(--s2) var(--s5) var(--s4);padding:10px;border:1px dashed #d2e1ff;border-radius:var(--r-md);background:transparent;color:var(--accent);font:inherit;font-weight:600;cursor:pointer}
.qmore:hover{background:#eef3fd}

/* ===== единый стиль (как на главной): скругления 20, голубые линии и панели, заголовки разделов — Unbounded ===== */
:root{--line:#d2e1ff;--soft:#eef3fd;--r-xl:20px}
.sect > h2,.tpage h2,.gcards__h{font:600 clamp(20px,.9vw + 13px,26px)/1.25 Unbounded,var(--font);letter-spacing:-.02em}
.tpage{max-width:960px;margin-top:var(--s12)}
.tpage .faq{margin-top:var(--s12)}
.picker,.card{border-color:var(--line);border-radius:var(--r-xl);box-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 24px -12px rgba(37,99,235,.18)}
.facts{background:var(--line);border-color:var(--line);border-radius:var(--r-xl)}
.facts b{font:600 26px/1.1 Unbounded,var(--font);letter-spacing:-.03em}
.facts li:first-child b{color:var(--accent)}
.notice--info{border-radius:16px;background:var(--soft);border-color:var(--line)}
.topic{border-color:var(--line);border-radius:16px;box-shadow:none}
.topic summary:hover,.qlist a:hover{background:var(--soft)}
.topic[open] summary{border-bottom-color:var(--line)}
.topic__n{background:var(--soft);color:var(--accent)}
.faq details,.faq details:first-of-type{border:0;margin-bottom:8px;padding:0 20px;border-radius:16px;background:var(--soft)}
.faq summary{padding:16px 0}
.faq summary .i{color:var(--accent)}
.pk__modes{background:transparent}
.pk__modes a:hover{background:var(--soft)}
.pk__ic{border-color:var(--line);background:var(--soft)}
.seg{background:var(--soft)}

/* =====================================================================
   ДИЗАЙН-СИСТЕМА (единая для всех страниц; эталон — главная)
   Шрифты: Unbounded — логотип, H1/H2, названия плиток, крупные цифры; IBM Plex Sans — всё читаемое; Plex Mono — служебные номера.
   Скругления: 8 чипы · 12 элементы в карточке · 16 вложенные панели/списки · 20 карточки · 24 витрины · пилюля — кнопки и значки · круг — иконки.
   Линии — голубые, серых рамок нет; тень только у самостоятельных белых карточек.
   ===================================================================== */
:root{--line:#d2e1ff;--line-strong:#b6cbf5;--soft:#eef3fd;--soft-2:#e3ebfb;--accent-300:#93b4f5;
  --sh-card:0 1px 2px rgba(16,24,40,.04),0 8px 24px -12px rgba(37,99,235,.18);--sh-lift:0 12px 28px -12px rgba(37,99,235,.28);
  --border:var(--line);--border-2:var(--line-strong);--surface-2:var(--soft);--surface-3:var(--soft-2);
  --display:Unbounded,var(--font);--text:var(--ink);--muted:var(--text-2)}
b,strong{font-weight:600}

/* --- типографика --- */
h1,h2{font-family:var(--display);font-weight:600;letter-spacing:-.02em;overflow-wrap:break-word}
h1,.hub-hero h1{font-size:clamp(20px,6.4vw,24px);line-height:1.2}
.display,.home-hero h1{font-size:clamp(20px,6.4vw,24px);line-height:1.15}
h2,.sect > h2,.tpage h2,.gcards__h,.how h2,.res__h{font:600 20px/1.25 var(--display);letter-spacing:-.02em}
@media (min-width:640px){h1,.hub-hero h1{font-size:28px}.display,.home-hero h1{font-size:32px}h2,.sect > h2,.tpage h2,.gcards__h,.how h2,.res__h{font-size:22px}}
@media (min-width:1024px){h1,.hub-hero h1{font-size:32px}.display,.home-hero h1{font-size:40px}h2,.sect > h2,.tpage h2,.gcards__h,.how h2,.res__h{font-size:24px}}
.prose h2{font:600 20px/1.3 var(--display);letter-spacing:-.02em;margin-top:1.6em}
.tr__q,.qh{font:600 19px/1.4 var(--font);letter-spacing:-.005em}
@media (min-width:640px){.tr__q,.qh{font-size:22px}}
.res__big,.gcard__n{font-family:var(--display);font-weight:600;letter-spacing:-.04em}
.res__big{font-size:56px;line-height:1}
.res__big small{font:500 22px var(--font);letter-spacing:0}
.empty .res__big{color:var(--accent)}
.facts b{font:600 24px/1.1 var(--display);letter-spacing:-.03em}
@media (min-width:1024px){.facts b{font-size:26px}}
h3,.gcard__t,.faqcards h3,.how__q{font:600 18px/1.35 var(--font);letter-spacing:0;color:var(--ink)}
@media (max-width:639px){h3,.gcard__t,.faqcards h3,.how__q{font-size:17px}}
.faq summary,.topic summary,.timeline b,.how__list b,.qcta__t{font-size:17px;font-weight:600;line-height:1.45}
.pk__modes b,.cite__act,.pk__cont-t b,.fbc__src b,.fb b{font-size:15px;font-weight:600}
.gcard__d,.faqcards p,.how__list span,.tl__hint,.how__why,.how__quote,.hub-note,.notice,.note,.fb,.fbc__q{font-size:15px;line-height:1.55}
.hero__note,.pk__hint,.facts span,.topic__s,.pk__modes small,.gbtn small,.go small,.cite__doc,.cite__foot,.fbc__src,.map__pass,.tr__keys,.ftr__bottom,.pk__cont-row,.resume__p,.gcard__same,.pk__sum,.qsrc,.crumbs ol,.facts-side li,.map__stat,.how__src,.prose .muted{font-size:14px}
.topic__s{font-weight:400}
.label,h2.label,.tr__meta,.how__cap,.ftr__h,.resume__k,.gcard__w,.tl__pill,.how__opt small{font:600 12px/1.3 var(--font);letter-spacing:.06em;text-transform:uppercase}
.label,h2.label,.tr__meta,.how__cap,.ftr__h,.gcard__w{color:var(--muted)}
.home-hero .label,.resume__k{color:var(--accent)}
.badge,.gcard__badge,.topic__n{font:600 12px/1.5 var(--font);letter-spacing:0;font-variant-numeric:tabular-nums;padding:3px 10px;border-radius:999px}
.gcard__badge,.topic__n{background:var(--soft);color:var(--accent-a)}
.fbc__p,.cite__p,.rlist__n,.tl__num,.qlist a::before{font-family:var(--mono);font-weight:500;font-size:13px}
.how__list li::before{font:500 14px/1.9 var(--mono)}
.timeline li::before{font:500 13px/1 var(--mono)}

/* --- кнопки: пилюли, без теней; основная / второстепенная / тихая / ссылка со стрелкой --- */
.btn{border-radius:999px;box-shadow:none;font:600 15px/1.2 var(--font);padding:0 20px;background:var(--surface);border:1px solid var(--line-strong);color:var(--ink)}
.btn:hover{background:var(--soft);border-color:var(--accent)}
.btn:active{background:var(--soft-2)}
.btn:focus-visible,.go:focus-visible,button.opt:focus-visible{outline:2px solid var(--accent);outline-offset:2px;box-shadow:none}
.btn--primary{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:none}
.btn--primary:hover{background:var(--accent-h);border-color:var(--accent-h)}
.btn--ghost{background:transparent;border-color:transparent;color:var(--accent)}
.btn--ghost:hover{background:var(--soft);border-color:transparent;color:var(--accent-a)}
.btn--lg{padding:0 26px;font-size:16px}
.btn[aria-disabled="true"]{background:var(--soft);border-color:transparent;color:var(--muted)}
.tr__back{border-radius:50%}
.go{border-radius:16px;box-shadow:none;font-size:16px}
.fb__more,.how__more,.gcards__help,.tr__end,.qmore,.qback,.resume__err{font-size:15px;font-weight:600}
.resume__go{min-height:44px;padding:0 20px}

/* --- карточки, панели, списки --- */
.picker,.card,.qmain,.prose-card,.facts-side,.gcard,.resume__link,.how__demo{border:1px solid var(--line);border-radius:20px;box-shadow:var(--sh-card)}
.rows,.cite,.notice,.note,.fb,.topic{border-radius:16px}
.cite{box-shadow:none}
.notice--info{background:var(--soft);border-color:var(--line)}
.gbtn{border-radius:12px;border:1.5px solid var(--line-strong)}
.how__quote{background:#fff;border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:0 12px 12px 0}
.fbc__p,.cite__p{border-color:var(--line)}

/* --- иконки: всегда в круге --- */
.pk__ic{width:36px;height:36px;border:0;border-radius:50%;background:var(--soft);color:var(--accent)}
.resume__ic{width:44px;height:44px}
.pk__cont-ic{width:36px;height:36px}

/* --- раскрывающиеся: шеврон, синий, поворот 180° --- */
.faq details,.faq details:first-of-type{margin-bottom:12px}
.faq details[open] summary .i{transform:rotate(180deg)}
.topic .i-chev,.pk__other > summary .i,.faq summary .i{color:var(--accent)}

/* --- прогресс и переключатель: без чёрного --- */
.prog .is-cur{background:var(--accent)}
.prog .is-done{background:var(--accent-300)}
.seg__b[aria-current]{background:var(--accent);color:#fff;box-shadow:0 1px 2px rgba(37,99,235,.3)}
.seg__b:hover{background:#fff}
.resume__bar{background:var(--soft-2)}
.tr__timer{border-color:var(--line);padding:5px 12px}

/* --- ритм отступов --- */
.crumbs{margin:0 0 var(--s6)}
.ftr{margin-top:0}
.home-hero{padding:24px 0 var(--s6)}
@media (min-width:1024px){.home-hero{padding:24px 0 var(--s8)}}
.hub-hero{padding:0 0 var(--s6)}
@media (min-width:1024px){.hub-hero{padding:0 0 var(--s8)}}
.how,.tpage,.tpage .faq{margin-top:var(--s16)}
.res__h{margin:var(--s12) 0 var(--s4)}
@media (max-width:639px){.sect,.how,.tpage,.tpage .faq{margin-top:var(--s12)}}
.prose .facts{margin:var(--s6) 0}

/* --- плитки «Готовим» на телефоне: строкой во всю ширину --- */
@media (max-width:959px){
.tiles > li:nth-child(n){grid-column:span 2}
.tl--soon,.tiles > li:nth-child(n) .tl--soon{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;column-gap:14px;row-gap:6px;min-height:0;padding:14px 16px}
.tl--soon .tl__ic{grid-row:1/span 2}
.tl--soon .tl__t,.tiles > li:nth-child(n) .tl--soon .tl__t{margin:0;font:600 15px/1.25 var(--display);letter-spacing:-.02em}
.tl--soon .tl__meta{margin:0}
.tl--soon .tl__hint{display:none}
}
a.tl:focus-visible{outline:3px solid var(--accent);outline-offset:3px}

/* --- служебные классы вместо inline-стилей --- */
.e404{padding:40px 0}
@media (min-width:960px){.e404{padding:64px 0}}
.e404 .res__big{font-size:72px}
.qside__h{margin:24px 0 8px}
.res__note{margin:8px auto 0;max-width:560px;text-align:left}
.map__ok{color:var(--ok-ink)}.map__bad{color:var(--bad-ink)}
.rows--doc .row{align-items:flex-start}
.row__t b{color:var(--ink)}
.log__d{min-width:6.5em}
.doc--narrow{max-width:860px}
.mt{margin-top:16px}
.small{font-size:14px}
.ftr__h--gap{margin-top:20px}
.qcta .btn > span{min-width:0}
.qlist a.is-last{color:var(--accent);font-weight:600}

/* мобильное меню: разделы раскрываются, подпункты — внутри */
.mnav__dim{position:absolute;left:0;right:0;top:var(--hdr-h);height:100dvh;background:rgba(15,23,42,.32)}
.mnav:not([open]) .mnav__dim{display:none}
.mnav__panel{position:absolute;z-index:1;left:0;right:0;top:var(--hdr-h);background:var(--surface);border-bottom:1px solid var(--line);box-shadow:var(--sh-md);padding:4px 16px 16px;max-height:calc(100dvh - var(--hdr-h));overflow:auto;overscroll-behavior:contain}
.msec{border-bottom:1px solid var(--line)}
.msec:last-child{border-bottom:0}
.msec > summary,.msec--link{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px;padding:0 4px;color:var(--ink);font-size:17px;font-weight:600;text-decoration:none;cursor:pointer}
.msec > summary::-webkit-details-marker{display:none}
.msec > summary .i-chev{color:var(--accent);transition:transform .2s}
.msec[open] > summary .i-chev{transform:rotate(180deg)}
.msec--link .i{color:var(--accent)}
.msec--link[aria-current]{color:var(--accent)}
.msec__body{display:grid;gap:6px;padding:0 4px 16px}
.msec__body--links{gap:0}
.msec__body--links a{display:flex;align-items:center;min-height:44px;color:var(--ink);font-size:16px;font-weight:400;text-decoration:none}
.msec__body--links a:hover{color:var(--accent)}

/* ===== юзабилити 04.10: отзывы «обычных людей» ===== */
/* телефон: вопрос и тренажёр без карточки (рамку вернул общий блок карточек) */
@media (max-width:639px){.qmain,.tr__card{background:none;border:0;border-radius:0;box-shadow:none;padding:0}}
/* хлебные крошки переносятся, а не обрезаются */
.crumbs ol{flex-wrap:wrap;row-gap:0;white-space:normal;overflow:visible}
/* «Готовим» — бледные на любой клетке, чтобы не казались рабочими */
.tiles > li:nth-child(n) .tl--soon{background:#f5f8fe;color:#8a9ab8;box-shadow:inset 0 0 0 1px #d2e1ff}
/* список вопросов: вопрос + ответ, видно, что это ссылка */
.qlist a{align-items:flex-start;padding:12px var(--s5)}
.qlist__b{display:grid;gap:4px;flex:1;min-width:0}
.qlist__q{color:var(--ink)}
.qlist__a{display:flex;gap:6px;align-items:flex-start;color:var(--text-2);font-size:14px;line-height:1.5}
.qlist__a .i{flex:none;margin-top:3px;color:var(--ok-ink)}
.qlist__go{flex:none;margin-top:4px;color:var(--accent)}
.qlist a:hover .qlist__q{color:var(--accent)}
.qlist li[hidden],.topic[hidden]{display:none}
/* поиск и печать */
.qtools{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 8px}
.qsearch{flex:1 1 280px;display:flex;align-items:center;gap:10px;min-height:48px;padding:0 16px;border:1px solid var(--line-strong);border-radius:var(--r-full);background:var(--surface);color:var(--accent)}
.qsearch:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-100)}
.qsearch input{flex:1;min-width:0;border:0;outline:0;background:none;font:400 16px/1.4 var(--font);color:var(--ink)}
.qtools__print{min-height:48px}
.qtools__n{margin:0 0 16px;min-height:1px;color:var(--text-2);font-size:14px}
/* страница вопроса: кнопки тренажёра под вариантами — только там, где карточка тренажёра уходит вниз */
.qstrip{display:grid;gap:10px;margin:16px 0 0;padding:14px 16px;border-radius:16px;background:var(--soft)}
.qstrip__t{margin:0;font-size:15px;color:var(--text-2)}
.qstrip__t b{color:var(--ink)}
.qstrip__b{display:flex;flex-wrap:wrap;gap:8px}
.qstrip__b .btn{flex:1 1 auto}
@media (min-width:960px){.qstrip{display:none}}
/* тренажёр: подсказка правильного ответа, «Далее» всегда видна */
.fb__right{margin-left:auto;font-weight:500;color:var(--text-2)}
@media (min-width:640px){.tr__nav{position:sticky;bottom:0;z-index:5;background:var(--surface);margin-bottom:calc(-1 * var(--s8));padding-bottom:var(--s8)}}
/* окно подтверждения */
.dlg{width:min(440px,calc(100vw - 32px));padding:24px;border:0;border-radius:20px;box-shadow:var(--sh-md);color:var(--ink)}
.dlg::backdrop{background:rgba(15,23,42,.4)}
.dlg__h{margin:0 0 8px;font:600 20px/1.3 var(--font)}
.dlg__t{margin:0 0 20px;color:var(--text-2);font-size:16px;line-height:1.5}
.dlg__b{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.dlg__b .btn{flex:1 1 auto}
/* экран перед экзаменом */
.ready{display:grid;justify-items:start;gap:16px;max-width:620px}
.ready__ic{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--soft);color:var(--accent)}
.ready__ic .i{width:28px;height:28px}
.ready__l{display:grid;gap:10px;margin:0;padding:0;list-style:none;font-size:16px;line-height:1.5;color:var(--text-2)}
.ready__l li{position:relative;padding-left:22px}
.ready__l li::before{content:"";position:absolute;left:4px;top:.6em;width:7px;height:7px;border-radius:50%;background:var(--accent)}
.ready__l b{color:var(--ink)}
.ready__b{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
/* результат: досрочно — нейтрально; отличия в ответах подсвечены */
.res__badge.is-part{background:var(--soft);color:var(--accent)}
.rlist mark{padding:0 2px;border-radius:3px;background:#fde68a;color:inherit}
/* хаб: примеры должностей */
.faqcards__wide{grid-column:1 / -1}
.ex{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.ex__n{margin-top:12px;color:var(--text-2);font-size:15px}
/* печать: только вопросы с ответами */
@media print{
  .hdr,.ftr,.crumbs,.hero__aside,.hero__more,.ad,.qtools,.qtools__n,.faq,.resume,.ck,.qmore,.skip,.qlist__go,.topic summary .i-chev{display:none !important}
  body{background:#fff}
  .hero{display:block;padding:0;margin:0 0 12px}
  .topic{break-inside:auto;border:0;box-shadow:none}
  .topic summary{padding:8px 0;font-weight:600}
  .qlist a{padding:4px 0;break-inside:avoid}
  .qlist__a{color:#000}
}
.cite__foot{flex-wrap:nowrap;align-items:flex-start}
.cite__foot .i{flex:none;margin-top:1px}
.qlist a.is-last .qlist__q{color:var(--accent)}
.qlist__a::before{content:"";flex:none;width:14px;height:14px;margin-top:4px;background:var(--ok-ink);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat}
.qlist a::after{content:"";flex:none;width:16px;height:16px;margin-top:4px;background:var(--accent);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") center/contain no-repeat}
@media print{.qlist a::after{display:none}}
.topic__s{white-space:normal}
.topic summary > span:first-child{min-width:0}
@media (max-width:639px){.qlist a{gap:10px;padding:12px 16px}.qlist a::before{min-width:1.6em}}
.topic__s{display:block;margin-top:2px}
.qcta{display:flex;flex-direction:column;gap:8px}
.qcta .label,.qcta__t{margin-bottom:0}
.qcta__t{margin:0 0 8px}
.qcta .btn + .btn{margin-top:0}
.qcta .btn{--h:52px;border-radius:16px}
.qcta .btn--ghost{--h:44px}

/* разбор неверных вариантов: на странице вопроса — свёрнут; в тренажёре — строка про выбранный вариант */
.whyno{margin-top:var(--s5);border-radius:16px;background:var(--soft)}
.whyno summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px;padding:0 18px;list-style:none;cursor:pointer;font-weight:600;font-size:16px;color:var(--ink)}
.whyno summary::-webkit-details-marker{display:none}
.whyno summary .i{flex:none;color:var(--accent);transition:transform .2s}
.whyno[open] summary .i{transform:rotate(180deg)}
.whyno ul{display:grid;gap:14px;margin:0;padding:4px 18px 18px;list-style:none}
.whyno li{display:flex;gap:12px;align-items:flex-start;font-size:15px;line-height:1.55;color:var(--text)}
.whyno li > span:last-child{display:grid;gap:2px;min-width:0}
.whyno b{font-weight:600;color:var(--ink)}
.whyno .opt__m{flex:none;background:var(--surface)}
.fb__why{margin:0;padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.6)}
.fb__why b{display:inline;font-weight:600;color:var(--bad-ink)}
@media print{.whyno{display:none}}
/* «Почему так» — зелёная панель, как у правильного ответа */
.why{margin-top:var(--s5);padding:16px 18px 18px;border:1px solid var(--ok-line);border-radius:16px;background:var(--ok-bg)}
.why__h{display:flex;align-items:center;gap:8px;margin:0 0 8px;font:600 15px/1.3 var(--font);color:var(--ok-ink);letter-spacing:0;text-transform:none}
.why__h .i{color:var(--ok)}
.why p{font-size:16px;line-height:1.6}
.whyno{margin-top:var(--s4)}
.qrel{margin-top:var(--s6)}
.qrel__h{margin:0 0 12px;font:600 16px/1.4 var(--font);color:var(--ink)}
.qrel__h small{display:block;margin-top:2px;font-weight:400;font-size:14px;color:var(--text-2)}
@media print{.qrel{display:none}}

/* спорный вопрос: на странице — перед «Почему так», в тренажёре — внизу пояснения */
.note--disp{margin:var(--s4) 0 0}
.fb__disp{display:flex;gap:8px;align-items:flex-start;margin:0;padding:8px 10px;border-radius:10px;background:var(--warn-bg);border:1px solid var(--warn-line);color:var(--warn-ink)}
.fb__disp .i{color:#b45309;margin-top:2px;flex:none}

/* хаб «Сети и станции»: три карточки */
.gcards--3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:899px){.gcards--3{grid-template-columns:minmax(0,1fr)}}

/* цифры теста: в узкой левой колонке (960–1199 px) четыре в ряд не помещаются — по две */
@media (min-width:960px) and (max-width:1199px){.hero--test .facts{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* «Продолжить билет» в карточке теста: ссылка + отдельный крестик (44×44, удобно пальцем) */
.pk__contw{display:flex;align-items:stretch;background:#eef3fd;border-bottom:1px solid #d2e1ff}
.pk__contw[hidden]{display:none}
.pk__contw .pk__cont{flex:1;min-width:0;background:none;border-bottom:0;padding-right:8px}
.pk__contw .pk__cont:hover{background:#d2e1ff}
.pk__cont-x{flex:none;display:grid;place-items:center;width:48px;min-height:48px;margin:0;padding:0;border:0;border-left:1px solid #d2e1ff;background:none;color:var(--muted);cursor:pointer}
.pk__cont-x:hover{background:#d2e1ff;color:var(--ink)}
.pk__cont-x:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}

/* «Начать билет»: главное действие страницы теста — крупнее подписи */
.go{min-height:68px;padding:12px 20px;gap:3px}
.go [data-go-h]{font-size:20px;line-height:1.2;font-weight:600;letter-spacing:-.01em}
@media (max-width:639px){.go [data-go-h]{font-size:19px}}

/* хаб «Сети и станции»: в карточке одна кнопка — заливная, и вся карточка нажимается */
.gbtn--main{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:var(--sh-btn)}
.gbtn--main small,.gbtn--main .i{color:#fff}
.gbtn--main small{opacity:.85}
.gbtn--main:hover{background:var(--accent-h);border-color:var(--accent-h)}
.gcards--link .gcard{position:relative;transition:border-color .15s,box-shadow .15s}
.gcards--link .gbtn--main::after{content:"";position:absolute;inset:0;border-radius:20px}
.gcards--link .gcard:hover{border-color:var(--accent);box-shadow:var(--sh-sm,var(--sh-xs))}
.gcards--link .gcard:hover .gbtn--main{background:var(--accent-h)}
.gcards--link .gcard__t{margin-top:0;padding-right:0;grid-column:1/-1}
.gcards--link .gcard__d{grid-column:1/-1;margin-top:8px}


/* заголовки карточек хабов (сети и станции, электробезопасность) — шрифтом заголовков */
.gcard__t{font:600 19px/1.25 var(--display);letter-spacing:-.02em}
@media (max-width:639px){.gcard__t{font-size:18px}}
@media (max-width:639px){.gcard__t{padding-right:0}.gcard:has(.gcard__badge) .gcard__t{padding-right:84px}}

/* плашка «Вы остановились» на главной: меньше заливного синего (рядом синие плитки), крестик заметнее и под палец */
.resume__ic{background:#e3ebfb;color:var(--accent)}
.resume__go{background:#eef3fd;color:var(--accent);border:1.5px solid #d2e1ff}
.resume__link:hover .resume__go{background:#e3ebfb;border-color:var(--accent)}
.resume__x .i{width:20px;height:20px}
@media (max-width:639px){
  .resume__link{padding:14px}
  .resume__body{padding-right:44px}
  .resume__go{width:100%}
  .resume__x{width:44px;height:44px;top:8px;right:8px}
  .resume__x::before{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--surface-2,#f1f4f9);z-index:-1}
  .resume__x{z-index:0;color:var(--text-2)}
}
.pk__cont-ic{background:#e3ebfb;color:var(--accent)}

/* «Продолжить билет» на странице теста — в стиле плашки главной: подпись, заголовок, круглый крестик в углу */
.pk__contw{position:relative}
.pk__contw .pk__cont{padding:16px 64px 16px var(--s5);gap:14px}
.pk__contw .pk__cont-ic{width:44px;height:44px}
.pk__cont-t{gap:2px}
.pk__cont-t b{font:600 17px/1.3 var(--display);letter-spacing:-.01em;color:var(--ink)}
.pk__cont-row{margin-top:6px}
.pk__cont-x.resume__x{position:absolute;top:50%;right:10px;transform:translateY(-50%);width:44px;height:44px;min-height:0;border:0;border-left:0;z-index:0;color:var(--text-2)}
.pk__cont-x.resume__x::before{content:"";position:absolute;inset:4px;border-radius:50%;background:#fff;z-index:-1}
.pk__cont-x.resume__x:hover::before{background:#d2e1ff}
@media (max-width:639px){.pk__cont-x.resume__x{top:8px;transform:none}.pk__contw .pk__cont{padding:14px 56px 14px 16px}}
