/* Компоненты TechCon ML. Только переменные из tokens.css, значений «по месту» нет.
   Тема выбирается атрибутом data-theme="light|dark" на <html>. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--tc-bg);color:var(--tc-text);font:400 var(--tc-text-md)/1.55 var(--tc-font-ui);}
h1,h2,h3{line-height:1.2;margin:0 0 var(--tc-space-3)}
/* Kharkiv Tone только у названия страницы; заголовки блоков читаются на Inter */
h1,.tc-display{font-family:var(--tc-font-display);font-weight:400;letter-spacing:.01em}
h2,h3{font-family:var(--tc-font-ui);font-weight:700;letter-spacing:-.005em}
h1{font-size:var(--tc-h1)}h2{font-size:var(--tc-h2)}h3{font-size:var(--tc-h3)}
p{margin:0 0 var(--tc-space-3)}
a{color:var(--tc-accent-ink);text-underline-offset:.15em}
a:hover{color:var(--tc-accent-ink-hover)}
:focus-visible{outline:3px solid var(--tc-focus);outline-offset:2px;border-radius:var(--tc-radius-sm)}
.tc-wrap{max-width:var(--tc-max-width);margin:0 auto;padding:0 var(--tc-gutter)}
.tc-muted{color:var(--tc-text-muted)}
.tc-label{font-size:var(--tc-text-xs);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--tc-text-muted)}
.tc-skip{position:absolute;left:-999px;top:0;background:var(--tc-bg);color:var(--tc-text);padding:var(--tc-space-2) var(--tc-space-3)}
.tc-skip:focus{left:var(--tc-space-2);top:var(--tc-space-2);z-index:10}
/* навбар: тёмный в обеих темах */
.tc-nav{background:var(--tc-nav-bg);border-bottom:2px solid var(--tc-accent)}
.tc-nav .tc-wrap{display:flex;align-items:center;gap:var(--tc-space-4);min-height:64px;flex-wrap:wrap;row-gap:0}
.tc-nav__brand{display:flex;align-items:center;gap:var(--tc-space-3);color:var(--tc-nav-text);font-weight:700;text-decoration:none}
.tc-nav__brand img{height:var(--tc-logo-nav);width:auto}
.tc-nav__links{display:flex;gap:var(--tc-space-1);margin:0;padding:0;list-style:none;flex-wrap:wrap}
.tc-nav__links a{display:inline-flex;align-items:center;min-height:var(--tc-tap-min);padding:0 var(--tc-space-3);color:var(--tc-nav-link);text-decoration:none;border-bottom:2px solid transparent}
.tc-nav__links a:hover,.tc-nav__links a[aria-current="page"]{color:var(--tc-nav-text);border-bottom-color:var(--tc-accent)}
.tc-nav :focus-visible{outline-color:var(--tc-nav-link)}
.tc-nav__all{margin-left:auto;color:var(--tc-nav-link);font-size:var(--tc-text-sm);text-decoration:none;min-height:var(--tc-tap-min);display:inline-flex;align-items:center}
/* кнопки: фон accent-ink (5,4+:1 с белым), яркий accent только для крупных декоративных элементов */
.tc-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--tc-space-2);min-height:var(--tc-tap-min);padding:0 var(--tc-space-4);border:2px solid transparent;border-radius:var(--tc-radius-md);font:600 var(--tc-text-sm)/1 var(--tc-font-ui);cursor:pointer;text-decoration:none;transition:background var(--tc-motion-fast),color var(--tc-motion-fast)}
.tc-btn--primary{background:var(--tc-btn-bg);color:var(--tc-btn-text)}
.tc-btn--primary:hover{background:var(--tc-btn-bg-hover)}
.tc-btn--ghost{background:transparent;color:var(--tc-accent-ink);border-color:var(--tc-accent-ink)}
.tc-btn--ghost:hover{background:var(--tc-surface-2)}
.tc-btn[disabled],.tc-btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed}
/* формы */
.tc-field{display:grid;gap:var(--tc-space-1);margin-bottom:var(--tc-space-4)}
.tc-field label{font-weight:600;font-size:var(--tc-text-sm)}
.tc-field__hint{font-size:var(--tc-text-sm);color:var(--tc-text-muted)}
.tc-field__error{font-size:var(--tc-text-sm);color:var(--tc-err-ink)}
.tc-input{min-height:var(--tc-tap-min);padding:0 var(--tc-space-3);background:var(--tc-surface-1);color:var(--tc-text);border:1px solid var(--tc-line);border-radius:var(--tc-radius-md);font:inherit}
.tc-input:focus{border-color:var(--tc-accent-ink)}
.tc-input[aria-invalid="true"]{border-color:var(--tc-err)}
/* карточка, таблица */
.tc-card{background:var(--tc-surface-1);border:1px solid var(--tc-line);border-radius:var(--tc-radius-lg);padding:var(--tc-space-5);box-shadow:var(--tc-shadow-card)}
.tc-table-wrap{overflow-x:auto}
.tc-table{width:100%;border-collapse:collapse;font-size:var(--tc-text-sm)}
.tc-table th{text-align:left;font-size:var(--tc-text-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--tc-text-muted);border-bottom:2px solid var(--tc-line);padding:var(--tc-space-2) var(--tc-space-3)}
.tc-table td{padding:var(--tc-space-3);border-bottom:1px solid var(--tc-line);font-variant-numeric:tabular-nums}
/* статус всегда словом; цвет только усиливает */
.tc-badge{display:inline-flex;align-items:center;gap:6px;padding:2px 10px;border-radius:999px;font-size:var(--tc-text-xs);font-weight:600;border:1px solid currentColor}
.tc-badge--ok{color:var(--tc-ok-ink);border-color:var(--tc-ok)}.tc-badge--warn{color:var(--tc-warn-ink);border-color:var(--tc-warn)}.tc-badge--err{color:var(--tc-err-ink);border-color:var(--tc-err)}
.tc-badge--info{color:var(--tc-accent-ink);border-color:var(--tc-accent)}
.tc-alert{display:flex;gap:var(--tc-space-3);padding:var(--tc-space-3) var(--tc-space-4);border-radius:var(--tc-radius-md);border:1px solid var(--tc-line);border-left:4px solid var(--tc-accent-ink);background:var(--tc-surface-1)}
.tc-alert--err{border-left-color:var(--tc-err)}.tc-alert--warn{border-left-color:var(--tc-warn)}.tc-alert--ok{border-left-color:var(--tc-ok)}
.tc-empty{text-align:center;padding:var(--tc-space-7) var(--tc-space-4);color:var(--tc-text-muted)}
/* подвал */
.tc-footer{border-top:1px solid var(--tc-line);padding:var(--tc-space-5) 0;color:var(--tc-text-muted);font-size:var(--tc-text-sm)}
.tc-footer .tc-wrap{display:flex;gap:var(--tc-space-4);flex-wrap:wrap;justify-content:space-between}
@media (max-width:640px){.tc-wrap{padding:0 var(--tc-gutter-sm)}h1{font-size:var(--tc-h2)}h2{font-size:var(--tc-h3)}.tc-card{padding:var(--tc-space-4)}
.tc-nav .tc-wrap{min-height:52px;gap:0 var(--tc-space-3)}.tc-nav__brand img{height:var(--tc-logo-nav-sm)}
.tc-nav__brand span{display:none}.tc-nav__all{order:2}
.tc-nav__links{order:3;flex:0 0 100%;flex-wrap:nowrap;overflow-x:auto;border-top:1px solid rgba(248,255,248,.12);-webkit-overflow-scrolling:touch}
.tc-nav__links a{min-height:40px;white-space:nowrap}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}