/* Kaskad · «Режим стрима» (stream.js). Вид — Claude Design kaskad-stream/export-2026-10-29-r1 (css/stream.css, HANDOFF
   «## stream · Режим стрима r1»), перенесён на разметку панели: kk-frame → gx-frame, gx-ico → gi. Новое — ks-*;
   готовое (gx-kv / gx-kv__copy, gx-sw, gx-check, gx-input, gx-al, gx-details, gx-dlg, gx-menu, ga-btn, gs-cover) не
   меняется. Цвета и размеры — только токены. Подключается последним. */

.ks-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ── Маска: всегда 8 точек, какой бы длины ни было значение ─────────────── */
.ks-mask { font-family: var(--mono); letter-spacing: .12em; color: var(--text-2); user-select: none; cursor: pointer; }
.gx-brand__host .ks-mask, .kk-srv .ks-mask { letter-spacing: .1em; cursor: default; }

/* ── Скрытое значение в строке gx-kv: значение · отсчёт · глаз · «Скопировать» ─────────── */
.ks-sv { display: inline-grid; gap: 5px; min-width: 0; max-width: 320px; vertical-align: middle; }
.ks-sv__line { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
.ks-sv__v { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ks-sv__left { flex: none; font: 400 .78125rem/1 var(--font); color: var(--text-3); font-variant-numeric: tabular-nums; white-space: nowrap; }
/* отсчёт 10 с: полоса 2 px под значением сокращается; при prefers-reduced-motion — только текст «ещё 7 с» */
.ks-cd { display: block; height: 2px; border-radius: 1px; background: var(--surface-3); overflow: hidden; }
.ks-cd[hidden] { display: none; }
.ks-cd > i { display: block; height: 100%; width: calc(var(--p, 1) * 100%); border-radius: 1px; background: var(--accent-text); transition: width .25s linear; }
@media (prefers-reduced-motion: reduce) { .ks-cd { display: none; } }
/* глаз — та же кнопка 32, что «Скопировать» (gx-kv__copy); нажат — значение показано */
.ks-eye[aria-pressed="true"] { background: var(--accent-soft); color: var(--accent-text); }
.gx-kv__v > .gx-kv__copy + .gx-kv__copy { margin-left: -2px; }
.gx-kv__v--mono:has(.ks-sv) .gx-kv__text { white-space: normal; overflow: visible; }
.gx-kv__text > .ks-sv { width: 100%; }
/* телефон: область нажатия 40 × 40 */
[data-device="phone"] .gx-kv__v:has(.ks-eye) .gx-kv__copy { width: 40px; height: 40px; margin: -8px 0; }
[data-device="phone"] .ks-sv { max-width: none; }

/* ── Поле ввода в режиме стрима: точки + глаз, как поле ключа GitHub ───────────────── */
html[data-stream="on"] .ks-sectext { -webkit-text-security: disc; }
.ks-paste { display: flex; align-items: center; gap: 6px 10px; flex-wrap: wrap; margin-top: 6px; font-size: var(--fs-sm); line-height: 1.125rem; color: var(--text-2); }
.ks-paste[hidden] { display: none; }
.ks-paste > b { font-weight: 500; color: var(--foreground); }
.ks-paste > span { color: var(--text-3); }
.ks-paste .ga-btn.gx-link { font-size: var(--fs-sm); }

/* ── Полоса «Режим стрима включён»: первым ребёнком рамки, 32 px, спокойный тон ─────────── */
.ks-bar { position: relative; z-index: 6; flex: none; display: flex; align-items: center; gap: 8px; height: 32px; padding: 0 12px 0 16px; background: color-mix(in oklab, var(--accent) 14%, var(--frame-bg, var(--background))); color: var(--foreground); font: 500 var(--fs-sm)/1 var(--font); }
.gx-app.has-side .ks-bar { border-radius: var(--r-dialog) var(--r-dialog) 0 0; }
.ks-bar[hidden] { display: none; }
.ks-bar__ic { display: grid; color: var(--accent-text); }
.ks-bar > b { font-weight: 600; white-space: nowrap; }
.ks-bar__dot { color: var(--text-3); }
.ks-bar__b { height: 24px; padding: 0 8px; border: 0; border-radius: var(--r-btn); background: none; color: var(--accent-text); font: 500 var(--fs-sm)/1.5rem var(--font); white-space: nowrap; cursor: pointer; }
.ks-bar__b:hover { background: color-mix(in oklab, var(--accent) 16%, transparent); }
.ks-bar__b:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.ks-bar__sp { flex: 1; }
.ks-bar__iw { position: relative; display: flex; }
.ks-bar__i { width: 28px; height: 28px; display: grid; place-items: center; border: 0; border-radius: 50%; background: none; color: var(--text-2); cursor: pointer; }
.ks-bar__i:hover, .ks-bar__i[aria-expanded="true"] { background: color-mix(in oklab, var(--accent) 18%, transparent); color: var(--foreground); }
.ks-bar__i:focus-visible { outline: none; box-shadow: var(--focus-ring); }
/* телефон: одна строка, длинное — в «⋯» */
[data-device="phone"] .ks-bar { padding: 0 4px 0 16px; padding-top: 0; }
[data-device="phone"] .ks-bar > b { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
[data-device="phone"] .ks-bar .ks-bar__i { width: 40px; height: 32px; border-radius: var(--r-btn); }
/* подсказка ⓘ: про адресную строку + «Скопировать команду»; открывается под шапкой, кнопки шапки остаются видны */
.ks-pop { position: absolute; z-index: 45; top: calc(100% + 72px); right: 0; width: 340px; max-width: calc(100vw - 32px); display: grid; gap: 10px; justify-items: start; padding: 12px 14px; border-radius: var(--r-tile); background: var(--surface-raised); box-shadow: var(--popover-shadow), 0 0 0 1px var(--border); color: var(--foreground); font: 400 var(--fs-sm)/1.1875rem var(--font); text-wrap: pretty; cursor: default; }
.ks-pop[hidden] { display: none; }
.ks-pop > p { margin: 0; }

/* ── Кнопка шапки «Режим стрима» (gx-iconbtn рядом с #themeToggle) и её подсказка ───────────── */
.ks-hw { position: relative; display: flex; flex: none; }
.ks-hbtn[aria-pressed="true"] { background: var(--accent-soft); color: var(--accent-text); }
.ks-hbtn[aria-pressed="true"]:hover:not([disabled]) { background: var(--accent-soft-hover); }
.ks-tip { position: absolute; z-index: 44; top: calc(100% + 8px); right: 0; width: max-content; max-width: 280px; padding: 7px 10px; border-radius: var(--r-tag); background: var(--foreground); color: var(--background); font: 500 .78125rem/1.0625rem var(--font); pointer-events: none; opacity: 0; visibility: hidden; transition: opacity var(--dur) var(--ease); }
.ks-hw:hover > .ks-tip, .ks-hbtn:focus-visible + .ks-tip { opacity: 1; visibility: visible; }

/* ── QR под шторкой: в режиме стрима кода под шторкой нет вовсе (не размыт) ──────────────── */
.ks-qrbox { display: grid; justify-items: center; gap: 10px; }
.ks-qrc { width: 196px; height: 196px; box-sizing: border-box; display: grid; place-content: center; justify-items: center; gap: 10px; text-align: center; border-radius: 12px; box-shadow: inset 0 0 0 1.5px var(--border); background: repeating-linear-gradient(135deg, transparent 0 8px, color-mix(in oklab, var(--surface-3) 50%, transparent) 8px 16px); padding: 12px; }
.gs-qrwrap > .ks-qrc { margin: 0 auto; }
/* в окне выдачи .gs-cover — слой поверх кода (give.css: absolute); шторка режима стрима стоит вместо кода — в потоке */
.gs-cover.ks-qrc { position: static; inset: auto; }
.kb2-is .ks-qrc { width: 176px; height: 176px; }
.ks-qrc__ic { width: 40px; height: 40px; border-radius: var(--r-field); display: grid; place-items: center; background: var(--surface-3); color: var(--text-2); }
.ks-qrc p { margin: 0; font: 500 .78125rem/1.0625rem var(--font); color: var(--text-2); }
.ks-qrhide { justify-self: center; }
.ks-key { display: flex; align-items: center; gap: 8px; min-width: 0; height: 36px; padding: 0 4px 0 12px; border-radius: var(--r-field); background: var(--surface); box-shadow: inset 0 0 0 1px var(--border); }
.ks-key > .ks-sv { flex: 1; max-width: none; }
.ks-key .ks-sv__v, .ks-key .ks-mask { font: 500 .78125rem/1.125rem var(--mono); white-space: nowrap; }
.ks-key .gx-kv__copy { margin: 0; width: 28px; height: 28px; }
[data-device="phone"] .ks-key { height: 48px; }
[data-device="phone"] .ks-key .gx-kv__copy { width: 40px; height: 40px; }

/* ── Карточка «Режим стрима» в «Настройки › Вид» ─────────────────────────────────────── */
.ks-card { display: grid; gap: 16px; }
.ks-card + .gx-card { margin-top: var(--card-gap, 16px); }
.ks-swh { max-width: none; padding-top: 0; padding-bottom: 16px; align-items: flex-start; }
.ks-swh > .gx-card__ic { margin-top: 0; }
.ks-swh > .gx-sw__t > span:first-child { font: 600 var(--fs-h3)/1.3 var(--font-head); }
.ks-swh > .gx-sw__t > span + span { max-width: 640px; }
.ks-swh > .gx-sw__t > .ks-local { margin-top: 4px; color: var(--foreground); font-weight: 500; }
.ks-swh > .gx-track { margin-top: 8px; }
.ks-swh:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--r-field); }
.ks-card .gx-check__i { padding: 0; }
.ks-card .gx-check__i[disabled] { opacity: .5; cursor: not-allowed; }
.ks-card .gx-check__i:not([aria-checked="true"]) .gx-box > .gi { display: none; }
.ks-ck { display: grid; gap: 2px; min-width: 0; }
.ks-ck > b { font: 500 var(--fs)/1.375rem var(--font); }
.ks-ck > span { font-size: var(--fs-sm); line-height: 1.125rem; color: var(--text-2); }
.ks-nc { margin: 0; padding: 0 14px 14px 32px; display: grid; gap: 6px; font-size: var(--fs-sm); line-height: 1.1875rem; color: var(--text-2); text-wrap: pretty; }
.ks-nc[hidden] { display: none; }
[data-device="phone"] .ks-swh > .gx-card__ic { display: none; }
[data-device="phone"] .ks-card .gx-al { align-items: flex-start; }

/* ── Окно подтверждения выключения ──────────────────────────────────────────────────── */
.ks-dlg { --dlg-w: 420px; }
.ks-dlg__p { margin: 0; color: var(--text-2); text-wrap: pretty; }
[data-device="phone"] .ks-dlg .gx-dlg__foot { display: grid; grid-template-columns: minmax(0, 1fr); }
[data-device="phone"] .ks-dlg .gx-dlg__foot > .ga-btn { height: 48px; }

/* ── Скрытое в других местах: блок кода, поля выдачи, текст ключа ─────────────────── */
.ks-sv__v--pre { white-space: pre-wrap; overflow-wrap: anywhere; text-overflow: clip; }
.ks-sv:has(.ks-sv__v--pre) { max-width: none; }
.gx-code__box > .ks-sv, .gs-code > .ks-key > .ks-sv { flex: 1; max-width: none; min-width: 0; }
.gx-code__box > .ks-eye { flex: none; margin: 0; }
.gs-field__v > .ks-sv { max-width: none; }
.gs-key > .ks-key { align-self: stretch; }
.gs-code > .ks-key { height: auto; min-height: 36px; padding-top: 4px; padding-bottom: 4px; }
.ks-qrbox > .gx-qrcard, .ks-qrbox > .kk-qr { justify-self: stretch; }
html[data-stream="on"] .gx-brand__host, html[data-stream="on"] .kk-srv__h, html[data-stream="on"] #crumbHost { letter-spacing: .1em; }
.ux-row:has(> .ks-eye) { flex-wrap: nowrap; }
.ux-row > .ux-in--token { flex: 1; min-width: 0; }
.ux-share__link > .ks-eye { flex: none; }
.ux-share__url > .ks-sv { max-width: none; }
/* «Выходы›Все выходы», раскрытие строки: «Адрес» маской, глаз — в той же строке (28, как у ключа в окне выдачи) */
.kk-exd__v:has(> .ks-sv) { display: flex; align-items: center; gap: 6px; overflow: visible; }
.kk-exd__v > .ks-eye { width: 28px; height: 28px; margin: -4px 0; }