/* Стили компонентов дизайн-системы (bundle.css). Обновлять копированием */
/* единая сетка */
.ct-page{box-sizing:border-box;width:100%;max-width:calc(var(--container-max) + 2 * var(--margin-desktop));margin:0 auto;padding-inline:var(--margin-phone)}
.ct-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--gutter-phone);row-gap:var(--space-4)}
.ct-area{grid-column:span var(--span-p,4);min-width:0}
@media (min-width:768px){.ct-page{padding-inline:var(--margin-tablet)}.ct-grid{grid-template-columns:repeat(8,minmax(0,1fr));column-gap:var(--gutter-tablet)}.ct-area{grid-column:span var(--span-t,8)}}
@media (min-width:1280px){.ct-page{padding-inline:var(--margin-desktop)}.ct-grid{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter-desktop)}.ct-area{grid-column:span var(--span-d,12)}}
.ct-grid-overlay .ct-area{background:var(--panel);border:1.5px dashed var(--control);border-radius:var(--radius-md);min-height:56px;display:flex;align-items:center;justify-content:center}
.ct-area-l{font:500 12px var(--font-mono);color:var(--ink-muted);text-align:center;padding:8px}
.ct-measure{max-width:var(--measure)}
body{margin:0;background:var(--surface);color:var(--ink);font:500 15px/1.5 var(--font-ui)}
.ct-row{display:flex;gap:var(--space-2);flex-wrap:wrap;align-items:center;padding:var(--space-4)}
.ct-col{display:grid;gap:var(--space-3);padding:var(--space-4)}
:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.ct-o{display:inline-block;flex:none;vertical-align:middle}
.ct-mark{display:inline-flex;color:var(--ink)}
.ct-wm{display:inline-flex;align-items:center;gap:calc(var(--fs)*.3);color:var(--ink)}
.ct-wm-inv{color:var(--on-photo)}
.ct-wm-w{font:800 var(--fs)/1 var(--font-display);letter-spacing:-.03em;display:inline-flex;align-items:center}
.ct-wm-w .ct-o{margin:0 .03em;transform:translateY(.04em)}
.ct-wm-r{display:grid;gap:2px;border-left:2px solid currentColor;padding-left:calc(var(--fs)*.26)}
.ct-wm-r b{font:800 calc(var(--fs)*.62)/1 var(--font-display)}
.ct-beta{align-self:flex-start;margin:2px 0 0 calc(var(--fs)*-.1);font:600 13px/1 system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:var(--ink-muted)}
.ct-wm-inv .ct-beta{color:var(--on-photo);opacity:.85}
.ct-wm-r i{font:600 calc(var(--fs)*.36)/1.1 var(--font-ui);font-style:normal}
.ct-stamp{margin:0;display:inline-grid;justify-items:center;gap:4px}
.ct-stamp svg{display:block}
.ct-stamp.is-got circle{stroke:var(--stamp)}
.ct-stamp.is-empty circle{stroke:var(--control)}
.ct-stamp-t{font-family:var(--font-ui);font-weight:700;letter-spacing:.6px}
.ct-stamp.is-got .ct-stamp-t,.ct-stamp.is-got .ct-stamp-c{fill:var(--stamp)}
.ct-stamp.is-empty .ct-stamp-t,.ct-stamp.is-empty .ct-stamp-c{fill:var(--ink-muted)}
.ct-stamp-c{font-family:var(--font-mono);font-weight:500}
.ct-stamp figcaption{font:500 11px var(--font-mono);color:var(--ink-muted)}
.ct-btn{font:700 15px/1 var(--font-ui);padding:12px 20px;border-radius:var(--radius-pill);border:2px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer;display:inline-flex;gap:var(--space-2);align-items:center;justify-content:center}
.ct-btn-primary{background:var(--action);border-color:var(--action);color:var(--on-action)}
.ct-btn-accent{background:var(--coral);border-color:var(--coral);color:var(--on-fill)}
.ct-btn-sm{font-size:13px;padding:7px 13px}
.ct-btn:disabled{opacity:.5;cursor:not-allowed}
.ct-chip{font:700 12.5px/1.3 var(--font-ui);padding:6px 12px;border-radius:var(--radius-pill);border:1.5px solid var(--ink);display:inline-flex;align-items:center;gap:var(--space-1);font-variant-numeric:tabular-nums;background:transparent;color:var(--ink)}
.ct-chip-hot{background:var(--coral);border-color:var(--coral);color:var(--on-fill)}
.ct-chip-sun{background:var(--sun);border-color:var(--sun);color:var(--on-fill)}
.ct-filters{display:flex;gap:var(--space-1-5);flex-wrap:wrap}
.ct-filter{font:600 13px var(--font-ui);padding:6px 12px;border-radius:var(--radius-pill);border:1.5px solid var(--control);background:transparent;color:var(--ink);cursor:pointer}
.ct-filter[aria-pressed="true"]{background:var(--teal);border-color:var(--teal);color:var(--on-fill)}
.ct-switch-row{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3);padding:var(--space-2) 0;border-bottom:1px solid var(--line);font-size:14.5px}
.ct-switch{width:42px;height:24px;border-radius:var(--radius-pill);border:1.5px solid var(--control);background:var(--surface-raised);position:relative;cursor:pointer;padding:0}
.ct-switch i{position:absolute;top:3px;left:3px;width:15px;height:15px;border-radius:50%;background:var(--ink-muted)}
.ct-switch[aria-checked="true"]{background:var(--teal);border-color:var(--teal)}
.ct-switch[aria-checked="true"] i{left:21px;background:var(--on-fill)}
.ct-code{font:500 11.5px/1.3 var(--font-mono);letter-spacing:.02em;padding:1px 6px;border:1px solid var(--ink);color:var(--on-fill);background:var(--code-bg);white-space:nowrap}
[data-theme="dark"] .ct-code{color:var(--ink)}
.ct-tile{position:relative;overflow:hidden;border-radius:var(--radius-lg);max-width:100%;background:var(--panel)}
.ct-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ct-tile-slot{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:500 12px var(--font-mono);color:var(--ink-muted);border:1.5px dashed var(--control);border-radius:var(--radius-lg)}
.ct-tile-shade{position:absolute;inset:auto 0 0 0;height:60%;background:linear-gradient(rgba(0,0,0,0),var(--photo-shade))}
.ct-tile-top{position:absolute;top:10px;left:10px;right:10px;display:flex;align-items:flex-start;justify-content:flex-end}
.ct-tile-pin{margin-right:auto;min-width:0;background:var(--sun);color:var(--on-fill);font:700 12px/1.3 var(--font-ui);padding:5px 9px;border-radius:var(--radius-lg)}
.ct-tile-code{flex:none;margin-left:6px;font:500 11.5px var(--font-mono);background:var(--surface);color:var(--ink);padding:2px 6px}
.ct-tile-lab{position:absolute;left:12px;right:12px;bottom:12px;color:var(--on-photo);display:grid;gap:2px}
.ct-tile-lab b{font:800 22px/1.02 var(--font-display);letter-spacing:-.02em}
.ct-tile-lab span{font:600 12.5px var(--font-ui)}
.ct-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:var(--space-2);margin:0}
.ct-facts div{background:var(--surface-raised);border:1.5px solid var(--line);border-radius:14px;padding:12px 14px}
.ct-facts div.is-hl{background:var(--sun);border-color:var(--sun)}
.ct-facts dt{font-size:12px;color:var(--ink-muted)}
.ct-facts div.is-hl dt,.ct-facts div.is-hl dd{color:var(--on-fill)}
.ct-facts dd{margin:0;font:800 22px var(--font-display);font-variant-numeric:tabular-nums}
.ct-live{display:inline-block;font:700 11.5px var(--font-ui);padding:2px 8px;border-radius:var(--radius-pill);color:var(--on-fill)}
.ct-live-ok{background:var(--live-ok)}
[data-theme="dark"] .ct-live-ok{color:var(--ink)}
.ct-live-warn{background:var(--live-warn)}
/* ViewCount: просмотры — значок глаза и число; цифры моноширинные, чтобы ряд карточек не прыгал */
/* Обычный текст в строке, а не отдельный блок: цифра стоит на базовой линии соседнего текста
   и не сдвигается, когда site.js обновляет число; значок выровнен по высоте строчных букв */
.ct-views{display:inline;font:600 12.5px var(--font-ui);font-variant-numeric:tabular-nums;color:var(--ink-muted);white-space:nowrap}
.ct-views svg{display:inline-block;width:1.1em;height:1.1em;margin-right:.3em;vertical-align:-.18em;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round}
.ct-views-photo{color:var(--on-photo)}
/* Текст только для экранных чтецов */
.ct-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.ct-disc{display:inline-block;font:700 12px var(--font-ui);padding:4px 9px;border-radius:var(--radius-pill);background:var(--discount);color:var(--on-discount)}
.ct-tl{list-style:none;margin:0;padding:0;display:grid}
.ct-tl-stop{display:grid;grid-template-columns:48px 18px minmax(0,1fr) auto;gap:10px;align-items:center;padding:6px 0;font-variant-numeric:tabular-nums}
.ct-tl-stop time{font:700 15px var(--font-ui)}
.ct-tl-dot{width:14px;height:14px;border-radius:50%;border:3px solid var(--ink);background:var(--surface);box-sizing:border-box}
.ct-tl-dot.is-stamp{background:var(--stamp);border-color:var(--stamp)}
.ct-tl-stop b{display:block}
.ct-tl-stop small{display:block;font-size:12.5px;color:var(--ink-muted)}
.ct-tl-leg{display:grid;grid-template-columns:48px 18px minmax(0,1fr);gap:10px;align-items:center;font:500 12px var(--font-mono);color:var(--ink-muted)}
.ct-tl-leg::before{content:""}
.ct-tl-leg i{display:block;width:3px;height:26px;margin:0 auto;background:var(--ink)}
.ct-tl-walk i{background:repeating-linear-gradient(var(--ink) 0 4px,rgba(0,0,0,0) 4px 8px)}
.ct-tl-taxi i{background:var(--teal)}
.ct-bill{display:grid;background:var(--surface-raised);border:1.5px solid var(--line);border-radius:var(--radius-lg);padding:var(--space-2) var(--space-4)}
.ct-bill-ln{display:flex;justify-content:space-between;gap:var(--space-3);padding:8px 0;border-bottom:1px solid var(--line);font-size:14px;font-variant-numeric:tabular-nums}
.ct-bill-ln small{display:block;color:var(--ink-muted);font-size:12px}
.ct-bill-tot{border-bottom:0;align-items:baseline}
.ct-bill-tot b{font:800 26px var(--font-display)}
.ct-pass{display:grid;gap:6px;max-width:320px}
.ct-pass-h{display:flex;gap:8px;align-items:baseline}
.ct-pass-h b{font:800 40px/1 var(--font-display);color:var(--stamp-text)}
.ct-pass-h small{font-size:18px;color:var(--ink)}
.ct-pass-bar{display:block;height:8px;background:var(--line);border-radius:var(--radius-pill);overflow:hidden}
.ct-pass-bar i{display:block;height:100%;background:var(--stamp)}
.ct-pass>small{font-size:12.5px;color:var(--ink-muted)}
.ct-crew{display:inline-flex;padding-left:8px}
.ct-crew span{width:30px;height:30px;border-radius:50%;border:2px solid var(--surface);margin-left:-8px;display:flex;align-items:center;justify-content:center;font:700 11px var(--font-ui);color:var(--on-fill)}
.ct-field{display:grid;gap:4px;font:600 13px var(--font-ui);max-width:360px}
.ct-field input{font:500 15px var(--font-ui);padding:11px 12px;border:1.5px solid var(--control);border-radius:var(--radius-md);background:var(--surface-raised);color:var(--ink)}
.ct-field.is-err input{border-color:var(--coral-text)}
.ct-field small{font-weight:500;font-size:12px;color:var(--ink-muted)}
.ct-field .ct-field-err{color:var(--coral-text)}
.ct-notice{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px;border-radius:var(--radius-lg);background:var(--surface-raised);border:1.5px solid var(--line);max-width:520px}
.ct-notice.is-new{border-color:var(--ink);box-shadow:inset 4px 0 0 var(--stamp)}
.ct-notice img{width:48px;height:48px;border-radius:var(--radius-sm);object-fit:cover}
.ct-notice b{display:block;font-size:14.5px}
.ct-notice small{display:block;font-size:12.5px;color:var(--ink-muted)}
.ct-notice-k{font:500 11px var(--font-mono);color:var(--stamp-text)}
.ct-notice time{font:500 12px var(--font-mono);color:var(--ink-muted)}
.ct-msg{display:flex;gap:8px;align-items:flex-end;max-width:80%}
.ct-msg-me{margin-left:auto}
.ct-msg-av{width:30px;height:30px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font:700 11px var(--font-ui);color:var(--on-fill)}
.ct-msg>div{padding:8px 12px;border-radius:16px 16px 16px 4px;background:var(--surface-raised);border:1.5px solid var(--line)}
.ct-msg-me>div{background:var(--action);color:var(--on-action);border-color:var(--action);border-radius:16px 16px 4px 16px}
.ct-msg-bot>div{background:var(--teal);border-color:var(--teal);color:var(--on-fill)}
.ct-msg b{font-size:12.5px}
.ct-msg p{margin:0;font-size:14.5px}
.ct-msg time{display:block;font:500 11px var(--font-mono);opacity:.75;margin-top:3px}
.ct-msg-acts{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.ct-msg-acts .ct-chip{background:var(--surface);cursor:pointer}
.ct-nav{display:flex;align-items:center;gap:22px;padding:14px 24px;flex-wrap:wrap;background:var(--surface)}
.ct-nav ul{display:flex;gap:6px;list-style:none;margin:0;padding:0;font:600 14px var(--font-ui);flex-wrap:wrap}
.ct-nav li{padding:6px 12px;border-radius:var(--radius-pill)}
.ct-nav li.is-on{background:var(--action);color:var(--on-action)}
.ct-nav-r{margin-left:auto;display:flex;gap:10px;align-items:center}
.ct-nav-pass{font:600 12.5px var(--font-mono);border:1.5px solid var(--stamp);color:var(--stamp-text);padding:4px 9px;border-radius:var(--radius-pill)}
