/* Y666 STB skin «Фирменный» (24.08.2026).
 * Подменяет вшитый /stb/css/app.css через nginx (DOM бинаря не трогаем).
 * Ограничения приставок MAG/GSTB (WebKit ~2010): без flex/grid/var()/blur,
 * только float+absolute; border-radius/box-shadow/rgba/linear-gradient — с
 * -webkit- дублями. Высоты интерактивных строк (.row 46, .kb-key 48) не
 * менять — на них опирается JS-скролл списков.
 * Токены: фон #0f1113, поверхность #14161a/#17191c, границы #23262a/#1f2226,
 * текст #fff/#c7cdd4/#aeb6bf/#8a9199/#6f7780, акцент #ff6600.
 * Фокус пульта = зелёное кольцо-свечение, НЕ сплошная заливка.
 * Карточка фильма (#modal-box.wide) — стиль «Афиша». */

html,body{margin:0;padding:0;width:100%;height:100%;overflow:hidden;background:#0f1113;color:#f8fafc;font-family:Arial,Helvetica,sans-serif;font-size:20px;line-height:1.3}
body.playing{background:transparent}
div,span,ul,li{-webkit-box-sizing:border-box;box-sizing:border-box}
.hide{display:none}
.accent{color:#ff6600}
.dim{color:#8a9199}
.right{float:right}
.nowrap{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

#boot{position:absolute;left:0;top:45%;width:100%;text-align:center;color:#8a9199;font-size:24px}
#boot.fail{top:0;height:100%;text-align:left;padding:30px;font-size:17px;color:#ffd4b0;background:#1a0c05;white-space:pre-wrap;word-wrap:break-word;overflow:auto}
.fail-why{margin-top:12px;font-size:14px;line-height:1.35;color:#ffb877;word-wrap:break-word}

#app{position:absolute;left:0;top:0;width:100%;height:100%}

/* Шапка: лого-картинка вместо текста (текст уводим за экран) */
#head{position:absolute;left:0;top:0;width:100%;height:62px;padding:0 24px;background:#14161a;border-bottom:1px solid #23262a}
#head-logo{float:left;width:96px;height:60px;overflow:hidden;text-indent:-9999px;background:url(/stb-skin/logo-stb.png) no-repeat 0 50%}
#head-right{float:right;line-height:60px}
#head-info{display:inline-block;margin-right:26px;font-size:17px;color:#6f7780}
#head-clock{display:inline-block;font-size:22px;color:#ffffff}

/* Навигация: активный пункт — пилюля с зелёной планкой */
#nav{position:absolute;left:0;top:62px;width:232px;bottom:46px;background:#121417;border-right:1px solid #1d2024;padding:12px 0}
.nav-item{height:50px;margin:0 10px 6px 10px;padding:0 18px;line-height:50px;font-size:20px;color:#aeb6bf;border-left:4px solid transparent;-webkit-border-radius:10px;border-radius:10px}
.nav-item.on{color:#ffffff;background:#1c1f23}
.nav-item.sel{color:#ffffff;background:#2a1a0c;border-left-color:#ff6600;font-weight:bold}

#main{position:absolute;left:234px;top:62px;right:0;bottom:46px;padding:14px 18px}

/* Подвал-подсказки */
#foot{position:absolute;left:0;bottom:0;width:100%;height:46px;padding:0 20px;line-height:46px;font-size:16px;color:#6f7780;background:#14161a;border-top:1px solid #23262a;white-space:nowrap;overflow:hidden}
.hint{margin-right:26px;white-space:nowrap}
.key{display:inline-block;min-width:30px;padding:1px 8px;margin-right:8px;text-align:center;color:#dfe2ee;background:#23262a;-webkit-border-radius:6px;border-radius:6px;font-size:14px;font-weight:bold}
.key.red{background:#ef4444;color:#ffffff}
.key.green{background:#ff6600;color:#1a0a00}
.key.yellow{background:#eab308;color:#1a0a00}
.key.blue{background:#3b82f6;color:#ffffff}

.col-title{height:30px;font-size:14px;letter-spacing:2px;color:#6f7780;text-transform:uppercase}

/* Списки: фокус = кольцо, курсор в неактивной колонке = серая подложка */
.list{position:relative;overflow:hidden}
.row{position:relative;height:46px;padding:0 12px;line-height:46px;font-size:20px;color:#dfe2ee;overflow:hidden;white-space:nowrap;border-bottom:1px solid #16181b;-webkit-border-radius:8px;border-radius:8px}
.row.on{background:#1c1f23;color:#ffffff;border-bottom-color:transparent}
.row.sel{background:#241408;color:#ffffff;font-weight:bold;border:2px solid #ff6600;border-bottom:2px solid #ff6600;line-height:42px;-webkit-border-radius:10px;border-radius:10px;-webkit-box-shadow:0 0 0 3px rgba(255,102,0,0.25);box-shadow:0 0 0 3px rgba(255,102,0,0.25)}
.row.fav-mark{color:#eab308}
.row.sel.fav-mark{color:#ffffff}
.row-num{display:inline-block;width:54px;color:#6f7780;font-size:17px}
.row.sel .row-num{color:#ffb877}
.row-sub{float:right;max-width:45%;font-size:16px;color:#8a9199;overflow:hidden}
.row.sel .row-sub{color:#ffb877}
.scroll{position:absolute;right:2px;width:4px;background:#23262a;-webkit-border-radius:2px;border-radius:2px}
.empty{padding:40px 10px;text-align:center;color:#6f7780;font-size:20px}

#ch-cats{position:absolute;left:0;top:0;width:20%;bottom:0}
#ch-list{position:absolute;left:21%;top:0;width:36%;bottom:0}
#ch-side{position:absolute;left:58%;top:0;right:0;bottom:0}
.panel{position:relative;height:100%;background:#14161a;border:1px solid #1f2226;-webkit-border-radius:12px;border-radius:12px;padding:8px}

.epg-now{padding:10px 8px;border-bottom:1px solid #1f2226}
.epg-title{font-size:19px;color:#ffffff}
.epg-time{font-size:16px;color:#ffb877}
.bar{height:6px;margin-top:8px;background:#23262a;-webkit-border-radius:3px;border-radius:3px}
.bar-fill{height:6px;background:#ff6600;-webkit-border-radius:3px;border-radius:3px}
.epg-item{padding:6px 8px;font-size:17px;color:#aeb6bf;border-bottom:1px solid #16181b}
.epg-item.sel{background:#241408;color:#ffffff;border:2px solid #ff6600;-webkit-border-radius:8px;border-radius:8px}
.epg-item.past{color:#5b6167}

.fit-frame{position:absolute;left:0;top:0;right:0;bottom:0;border:3px solid #ff6600}
.fit-info{position:absolute;left:8%;top:18%;right:8%;padding:20px 26px;background:#17191c;border:1px solid #23262a;-webkit-border-radius:16px;border-radius:16px}
.fit-h{color:#ff6600;margin-bottom:12px}
.fit-p{color:#aeb6bf;margin:10px 0;line-height:1.4}
.fit-row{margin:8px 0;overflow:hidden}
.fit-key{display:inline-block;width:4em;color:#ffffff}
.fit-name{display:inline-block;width:60%;color:#aeb6bf}
.fit-val{color:#ff6600;font-weight:bold}

.help-text{height:100%;overflow:hidden;padding:6px 10px}
.help-h{font-size:26px;color:#ff6600;margin-bottom:16px}
.help-row{margin-bottom:10px;overflow:hidden}
.help-gap{height:16px}
.help-key{display:inline-block;width:26%;min-width:140px;vertical-align:top;line-height:1.35;color:#ffffff}
.help-val{display:inline-block;width:70%;vertical-align:top;line-height:1.35;color:#aeb6bf}
.help-p{margin-bottom:10px;line-height:1.4;color:#aeb6bf}

.pin-field{text-align:center;letter-spacing:8px;margin:14px 0}
.pin-pad{width:300px;margin:0 auto 10px auto}

/* Сетка постеров: фокус = кольцо-свечение */
.cell{position:absolute;overflow:hidden;background:transparent;border:2px solid transparent;-webkit-border-radius:12px;border-radius:12px}
.cell.sel{border-color:#ff6600;background:#241408;-webkit-box-shadow:0 0 0 4px rgba(255,102,0,0.25);box-shadow:0 0 0 4px rgba(255,102,0,0.25)}
.cell-img{display:block;width:100%;background:#1c1f23;-webkit-border-radius:10px;border-radius:10px}
.cell-cap{height:46px;padding:2px 8px;font-size:16px;line-height:1.15;overflow:hidden;color:#aeb6bf}
.cell.sel .cell-cap{color:#ffffff;font-weight:bold}

/* Жанровые чипы */
.chips{height:42px;overflow:hidden}
.chip{float:left;height:34px;margin:0 8px 0 0;padding:0 16px;line-height:32px;font-size:16px;color:#c7cdd4;background:transparent;border:1px solid #2a2e33;-webkit-border-radius:17px;border-radius:17px}
.chip.on{color:#c7cdd4;background:transparent;border-color:#2a2e33}
.chip.sel{color:#1a0a00;background:#ff6600;border-color:#ff6600;font-weight:bold}
.chip.more{padding:0 8px;color:#6f7780;background:transparent;border-color:transparent}

/* Экранная клавиатура */
.kb{position:relative;margin-top:14px}
.kb-key{position:absolute;height:48px;line-height:44px;text-align:center;font-size:20px;color:#dfe2ee;background:#1e2126;border:2px solid #1e2126;-webkit-border-radius:10px;border-radius:10px}
.kb-key.sel{color:#ffffff;background:#1e2126;border-color:#ff6600;font-weight:bold;-webkit-box-shadow:0 0 0 3px rgba(255,102,0,0.25);box-shadow:0 0 0 3px rgba(255,102,0,0.25)}

.field{height:54px;padding:0 14px;line-height:50px;font-size:22px;color:#ffffff;background:#101214;border:2px solid #2a2e33;-webkit-border-radius:12px;border-radius:12px;overflow:hidden;white-space:nowrap}
.field.on{border-color:#ff6600;-webkit-box-shadow:0 0 0 3px rgba(255,102,0,0.2);box-shadow:0 0 0 3px rgba(255,102,0,0.2)}
.caret{color:#ff6600}

/* OSD: плавающая карточка вместо полосы во всю ширину */
#osd{position:absolute;left:48px;right:48px;bottom:40px;width:auto;padding:22px 30px 24px 30px;background:#101315;opacity:0.95;filter:alpha(opacity=95);border:1px solid #23262a;-webkit-border-radius:16px;border-radius:16px}
#osd .osd-left{float:left}
#osd .osd-num{width:120px;font-size:52px;font-weight:bold;line-height:1;color:#ff6600}
#osd .osd-now{margin-top:14px}
#osd .osd-time{font-size:24px;line-height:1.1;color:#f8fafc;white-space:nowrap}
#osd .osd-date{margin-top:2px;font-size:14px;line-height:1.2;color:#6f7780;white-space:nowrap}
#osd .osd-body{margin-left:140px}
#osd .osd-name{font-size:19px;color:#8a9199;overflow:hidden;white-space:nowrap}
#osd .osd-title{margin-top:2px;font-size:32px;line-height:1.15;color:#ffffff;overflow:hidden;white-space:nowrap}
#osd .osd-when{margin-top:4px;font-size:17px;color:#ff6600}
#osd .osd-ts{margin-top:6px;padding:3px 12px;display:inline-block;font-size:22px;font-weight:bold;color:#1a0a00;background:#ff6600;-webkit-border-radius:8px;border-radius:8px}
.bar{position:relative}
.bar-live{position:absolute;top:-4px;width:3px;height:14px;background:#ffffff;-webkit-border-radius:1px;border-radius:1px}
#osd .osd-desc{margin-top:8px;height:56px;font-size:20px;line-height:1.35;color:#aeb6bf;overflow:hidden}
#osd .osd-next{margin-top:6px;font-size:16px;color:#6f7780;overflow:hidden;white-space:nowrap}
#osd .bar{margin-top:8px}
#osd.numeric{padding:36px}
#osd.numeric .osd-num{float:none;width:100%;font-size:76px;text-align:center}
#osd.numeric .osd-hint{margin-top:10px;text-align:center;font-size:20px;color:#8a9199}

/* Оверлей списка каналов поверх эфира */
.osd-over{position:absolute;left:0;top:0;width:100%;height:100%;background:#0b0d0f;opacity:0.93;filter:alpha(opacity=93)}
.ov-head{position:absolute;left:12px;top:8px;right:12px;height:44px;padding:0 20px;line-height:44px;font-size:16px;letter-spacing:1px;color:#6f7780;background:#14161a;border:1px solid #23262a;-webkit-border-radius:10px;border-radius:10px}
.ov-cats{position:absolute;left:12px;top:60px;width:20%;bottom:60px}
.ov-list{position:absolute;left:22%;top:60px;width:38%;bottom:60px}
.ov-epg{position:absolute;left:61%;top:60px;right:12px;bottom:60px}
.ov-foot{position:absolute;left:12px;right:12px;bottom:8px;height:46px;padding:0 20px;line-height:44px;font-size:16px;color:#6f7780;background:#14161a;border:1px solid #23262a;-webkit-border-radius:10px;border-radius:10px}

/* Окно фильма/сериала — «Афиша»: постер во всю высоту, вертикальные действия */
#modal{position:absolute;left:0;top:0;width:100%;height:100%;background:#050507}
#modal-box{position:absolute;left:50%;top:50%;width:620px;margin-left:-310px;padding:26px 30px;background:#17191c;border:1px solid #23262a;-webkit-border-radius:16px;border-radius:16px;overflow:hidden;-webkit-box-shadow:0 24px 60px rgba(0,0,0,0.55);box-shadow:0 24px 60px rgba(0,0,0,0.55)}
#modal-box.wide{left:0;top:0;width:100%;height:100%;margin-left:0;padding:6% 5.6% 0 39%;background:#050507;border:0;-webkit-border-radius:0;border-radius:0;-webkit-box-shadow:none;box-shadow:none}
/* Постер — «наклонённый баннер» из направления «Плакат»: зелёная рамка,
   плоская смещённая тень, лёгкий поворот. Высота сама из пропорции 2:3. */
.modal-poster{position:absolute;left:6%;top:12%;width:23%;height:auto;border:4px solid #ff6600;-webkit-box-shadow:22px 22px 0 #3d1a00;box-shadow:22px 22px 0 #3d1a00;-webkit-transform:rotate(-4deg);transform:rotate(-4deg);background:#101214}
#modal-box.wide .modal-poster{-webkit-border-radius:0;border-radius:0}

.modal-body{margin-left:0}
#modal-box.wide .modal-body{margin-left:0}
.modal-title{font-size:26px;color:#ffffff;margin-bottom:10px}
#modal-box.wide .modal-title{font-size:58px;line-height:1.05;font-weight:bold;margin-bottom:16px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.modal-meta{font-size:17px;color:#8a9199;margin-bottom:14px}
#modal-box.wide .modal-meta{font-size:20px;color:#ff6600;margin-bottom:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.modal-text{font-size:18px;color:#dfe2ee;max-height:200px;overflow:hidden;white-space:pre-wrap}
#modal-box.wide .modal-text{font-size:21px;line-height:1.5;color:#c9cdd9;max-height:none;padding-bottom:8px}
/* Кнопки — сразу под описанием, компактные, ход пультом ◄► (так их и водит
   бинарь при двух кнопках) */
#modal-box.wide .modal-btns{position:static;padding-top:16px;overflow:hidden}

/* Кнопки: по умолчанию пилюля (диалоги), в «Афише» — вертикальный список */
.btn{display:inline-block;height:50px;margin-right:14px;margin-bottom:10px;padding:0 26px;line-height:46px;font-size:19px;color:#dfe2ee;background:transparent;border:2px solid #2f343a;-webkit-border-radius:25px;border-radius:25px}
.btn.sel{color:#1a0a00;background:#ff6600;border-color:#ff6600;font-weight:bold;-webkit-box-shadow:0 0 0 4px rgba(255,102,0,0.3);box-shadow:0 0 0 4px rgba(255,102,0,0.3)}
#modal-box.wide .btn{display:inline-block;width:auto;height:56px;margin:0 16px 0 0;padding:0 36px;line-height:52px;font-size:22px;color:#dfe2ee;background:transparent;border:2px solid #2f343a;-webkit-border-radius:12px;border-radius:12px}
#modal-box.wide .btn.sel{color:#1a0a00;background:#ff6600;border-color:#ff6600;font-weight:bold;-webkit-box-shadow:0 0 0 4px rgba(255,102,0,0.3);box-shadow:0 0 0 4px rgba(255,102,0,0.3)}

.set-help-val{margin-bottom:14px;font-size:18px;color:#ff6600}
.set-help-p{margin-bottom:12px;font-size:17px;line-height:1.4;color:#aeb6bf}

#dbg{position:absolute;left:0;top:0;width:46%;padding:8px 10px;background:#000000;opacity:0.72;filter:alpha(opacity=72)}
.dbg-line{font-size:14px;line-height:1.35;color:#ff9736;overflow:hidden;white-space:nowrap}

/* Пикер (серии, опции) — фирменная карточка */
#picker{position:absolute;left:0;top:0;width:100%;height:100%;background:transparent}
.picker-box{position:absolute;left:50%;top:8%;width:620px;height:84%;margin-left:-310px;padding:24px 28px;background:#17191c;border:1px solid #23262a;-webkit-border-radius:16px;border-radius:16px;-webkit-box-shadow:0 24px 60px rgba(0,0,0,0.55);box-shadow:0 24px 60px rgba(0,0,0,0.55)}
.picker-list{position:absolute;left:24px;right:24px;top:74px;bottom:56px}
.pick-mark{display:inline-block;width:1.3em;color:#ff6600}
.picker-hint{position:absolute;left:28px;right:28px;bottom:16px;color:#8a9199}
.row.sel .pick-mark{color:#ffffff}

.loading{position:absolute;left:40%;top:45%;padding:10px 24px;text-align:center;color:#1a0a00;background:#ff6600;-webkit-border-radius:12px;border-radius:12px;font-weight:bold}
.loading.tail{left:auto;right:12px;top:auto;bottom:8px;margin-left:0;width:auto;padding:6px 16px;opacity:0.9;filter:alpha(opacity=90)}

#toast{position:absolute;left:auto;right:3%;top:3%;max-width:50%;padding:10px 22px;text-align:center;font-size:19px;color:#ffece0;background:#2a1608;border:1px solid #5c2c0a;-webkit-border-radius:12px;border-radius:12px}

/* Строки каналов */
.ch-row{position:relative;padding:0;white-space:normal}
.ch-logo{position:absolute;left:10px;top:50%;height:32px;width:auto;max-width:46px;margin-top:-16px}
.ch-num{position:absolute;left:62px;top:50%;width:38px;margin-top:-13px;line-height:26px;font-size:17px;color:#6f7780}
.ch-name{margin:0 74px 0 106px;padding-top:8px;line-height:1.15;font-size:21px;color:#dfe2ee;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ch-fav{margin-right:6px;color:#eab308}
.ch-now{margin:2px 74px 0 106px;line-height:1.15;font-size:16px;color:#8a9199;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ch-at{display:inline-block;min-width:3.2em;margin-right:0.6em;color:#6f7780}
.ch-arch{position:absolute;right:14px;top:50%;width:10px;height:10px;margin-top:-5px;background:#eab308;-webkit-border-radius:5px;border-radius:5px}
.row.sel .ch-arch{background:#ffb877}
.ch-dvr{position:absolute;right:12px;top:50%;margin-top:-0.7em;padding:0 7px;line-height:1.4;font-size:13px;font-weight:bold;color:#eab308;border:1px solid #6b5b12;-webkit-border-radius:8px;border-radius:8px}
.row.sel .ch-dvr{color:#ffb877;border-color:#5c2c0a}
.ch-bar{position:absolute;left:106px;right:12px;bottom:7px;height:3px;background:#23262a;-webkit-border-radius:2px;border-radius:2px}
.ch-fill{height:3px;background:#ff6600;-webkit-border-radius:2px;border-radius:2px}
.row.on .ch-name{color:#ffffff}
.row.sel .ch-name{color:#ffffff;font-weight:bold}
.row.sel .ch-num,.row.sel .ch-now,.row.sel .ch-at{color:#ffb877}
.row.sel .ch-fav{color:#ffffff}
.row.sel .ch-bar{background:#5c2c0a}
.row.sel .ch-fill{background:#ff6600}

/* Программа передач */
.epg-days{height:40px;overflow:hidden;padding:4px 0 0 0;border-bottom:1px solid #1f2226}
.epg-listbox{position:absolute;left:8px;right:8px;top:84px;bottom:34%}
.epg-detail{position:absolute;left:8px;right:8px;bottom:30px;height:32%;padding-top:8px;overflow:hidden;border-top:1px solid #1f2226}
/* Подсказка выхода из панели программы/архива (правая колонка ТВ) */
#ch-side .panel:after{content:"Нажмите \2190\00a0(назад) на пульте, чтобы выйти";position:absolute;left:10px;right:10px;bottom:7px;font-size:14px;color:#ff6600;text-align:right;white-space:nowrap;overflow:hidden}
.epg-d-title{font-size:20px;color:#ffffff;overflow:hidden;white-space:nowrap}
.epg-d-when{font-size:15px;color:#ff6600;margin:2px 0 6px 0}
.epg-d-text{font-size:19px;line-height:1.4;color:#aeb6bf;overflow:hidden}
.epg-row{height:46px;padding:0 10px;line-height:46px;font-size:18px;color:#dfe2ee;overflow:hidden;white-space:nowrap;border-bottom:1px solid #16181b;-webkit-border-radius:8px;border-radius:8px}
.epg-row.on{background:#1c1f23;color:#ffffff;border-bottom-color:transparent}
.epg-row.sel{background:#241408;color:#ffffff;font-weight:bold;border:2px solid #ff6600;border-bottom:2px solid #ff6600;line-height:42px;-webkit-border-radius:10px;border-radius:10px;-webkit-box-shadow:0 0 0 3px rgba(255,102,0,0.25);box-shadow:0 0 0 3px rgba(255,102,0,0.25)}
.epg-row .epg-mark{display:inline-block;width:1.4em;color:#ff6600}
.epg-row.sel .epg-mark{color:#ffffff}
.epg-row .epg-at{display:inline-block;min-width:3.2em;margin-right:0.7em;color:#6f7780}
.epg-row.sel .epg-at{color:#ffb877}
.epg-row.live .epg-at{color:#ff6600}
.epg-row.sel.live .epg-at{color:#ffffff}
.epg-row.future{color:#8a9199}

/* Сворачиваемое меню: пока фокус в содержимом (body.nav-min из app.js),
   левая колонка — узкая рейка, разделам достаётся ~170px ширины. Возврат
   в меню (◄) разворачивает её обратно. */
body.nav-min #nav{width:64px}
body.nav-min .nav-item{width:44px;height:44px;margin:0 10px 8px 10px;padding:0;line-height:44px;overflow:hidden;text-indent:-9999px;background-repeat:no-repeat;background-position:50% 50%;-webkit-background-size:22px 22px;background-size:22px 22px}
body.nav-min .nav-item:nth-child(1){background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23aeb6bf%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%222%22%20y%3D%226%22%20width%3D%2220%22%20height%3D%2213%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M8%202l4%204%204-4%22%2F%3E%3C%2Fsvg%3E")}
body.nav-min .nav-item:nth-child(1).sel,body.nav-min .nav-item:nth-child(1).on{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ff6600%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%222%22%20y%3D%226%22%20width%3D%2220%22%20height%3D%2213%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M8%202l4%204%204-4%22%2F%3E%3C%2Fsvg%3E")}
body.nav-min .nav-item:nth-child(2){background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23aeb6bf%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%223%22%20width%3D%2218%22%20height%3D%2218%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M7%203v18M17%203v18M3%208h4M3%2016h4M17%208h4M17%2016h4%22%2F%3E%3C%2Fsvg%3E")}
body.nav-min .nav-item:nth-child(2).sel,body.nav-min .nav-item:nth-child(2).on{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ff6600%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%223%22%20width%3D%2218%22%20height%3D%2218%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M7%203v18M17%203v18M3%208h4M3%2016h4M17%208h4M17%2016h4%22%2F%3E%3C%2Fsvg%3E")}
body.nav-min .nav-item:nth-child(3){background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23aeb6bf%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%224%22%20y%3D%228%22%20width%3D%2216%22%20height%3D%2212%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M6%205h12M8%202h8%22%2F%3E%3C%2Fsvg%3E")}
body.nav-min .nav-item:nth-child(3).sel,body.nav-min .nav-item:nth-child(3).on{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ff6600%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%224%22%20y%3D%228%22%20width%3D%2216%22%20height%3D%2212%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M6%205h12M8%202h8%22%2F%3E%3C%2Fsvg%3E")}
body.nav-min .nav-item:nth-child(4){background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23aeb6bf%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%2211%22%20r%3D%227%22%2F%3E%3Cpath%20d%3D%22M21%2021l-4.3-4.3%22%2F%3E%3C%2Fsvg%3E")}
body.nav-min .nav-item:nth-child(4).sel,body.nav-min .nav-item:nth-child(4).on{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ff6600%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%2211%22%20r%3D%227%22%2F%3E%3Cpath%20d%3D%22M21%2021l-4.3-4.3%22%2F%3E%3C%2Fsvg%3E")}
body.nav-min .nav-item:nth-child(5){background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23aeb6bf%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%207h10M18%207h2M4%2017h2M10%2017h10%22%2F%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%227%22%20r%3D%222.5%22%2F%3E%3Ccircle%20cx%3D%227%22%20cy%3D%2217%22%20r%3D%222.5%22%2F%3E%3C%2Fsvg%3E")}
body.nav-min .nav-item:nth-child(5).sel,body.nav-min .nav-item:nth-child(5).on{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ff6600%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%207h10M18%207h2M4%2017h2M10%2017h10%22%2F%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%227%22%20r%3D%222.5%22%2F%3E%3Ccircle%20cx%3D%227%22%20cy%3D%2217%22%20r%3D%222.5%22%2F%3E%3C%2Fsvg%3E")}
body.nav-min .nav-item:nth-child(6){background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23aeb6bf%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Cpath%20d%3D%22M9.5%209.5a2.5%202.5%200%201%201%203.4%202.3c-.8.3-.9%201-.9%201.7%22%2F%3E%3Cpath%20d%3D%22M12%2017h.01%22%2F%3E%3C%2Fsvg%3E")}
body.nav-min .nav-item:nth-child(6).sel,body.nav-min .nav-item:nth-child(6).on{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ff6600%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Cpath%20d%3D%22M9.5%209.5a2.5%202.5%200%201%201%203.4%202.3c-.8.3-.9%201-.9%201.7%22%2F%3E%3Cpath%20d%3D%22M12%2017h.01%22%2F%3E%3C%2Fsvg%3E")}
body.nav-min .nav-item.sel,body.nav-min .nav-item.on{border-left:0}
/* Фокус на рейке — полноценное зелёное кольцо, как у остальных элементов;
   просто активный раздел (.on) — только зелёная иконка без кольца. */
body.nav-min .nav-item.sel{background:#241408;border:2px solid #ff6600;-webkit-border-radius:12px;border-radius:12px;-webkit-box-shadow:0 0 0 4px rgba(255,102,0,0.25);box-shadow:0 0 0 4px rgba(255,102,0,0.25)}
body.nav-min #main{left:66px}

/* ТВ: категории — рейка первых букв, пока фокус в каналах/программе
   (body.cats-min из screen-channels.js). Каналам — вся освободившаяся ширина. */
/* Категории — «выпадающий» шаг: видны только когда фокус в них (► с меню);
   всё остальное время скрыты, ширина уходит каналам и программе. */
body.cats-min #ch-cats{display:none}
body.cats-min #ch-list{left:0;width:49%}
body.cats-min #ch-side{left:51%}

/* ── SD / 4:3 (28.08.2026). body.sd ставит app.js: авто при высоте экрана
   ≤600 (MAG в 720×576 на кинескопном ТВ через SCART/«тюльпан») либо вручную
   «Настройки → Экран 4:3 (SD)». Кегли — в em от базового F (инжект settings.js),
   чтобы «Размер шрифта» продолжал работать; геометрия каркаса тоже в em.
   Кинескоп: без 1px-разделителей (мерцают на 576i), белый чуть приглушён,
   поля 4% по умолчанию (см. app.js overscan). Каркас 46+38 вместо 62+46. */
body.sd{color:#eef1f4}
body.sd #head{height:2.3em;padding:0 12px;border-bottom:0}
body.sd #head-logo{width:78px;height:2.2em;-webkit-background-size:auto 60%;background-size:auto 60%}
body.sd #head-logo,body.sd #head-right{line-height:2.2em}
body.sd #head-info{font-size:0.75em;margin-right:14px}
body.sd #head-clock{font-size:1em;color:#eef1f4}
body.sd #nav{top:2.3em;bottom:1.9em;width:9.6em;padding:6px 0}
body.sd .nav-item{height:2em;line-height:2em;margin:0 6px 3px 6px;padding:0 12px;border-left-width:3px;-webkit-border-radius:8px;border-radius:8px}
body.sd #main{left:9.7em;top:2.3em;bottom:1.9em;padding:8px 10px}
body.sd #foot{height:1.9em;line-height:1.9em;padding:0 10px;font-size:0.78em;border-top:0}
body.sd .hint{margin-right:14px}
body.sd .key{min-width:24px;padding:0 6px;margin-right:5px;font-size:0.85em}
body.sd .col-title{height:1.6em;font-size:0.68em;letter-spacing:1px}
body.sd .panel{padding:5px;-webkit-border-radius:8px;border-radius:8px}
body.sd .row{font-size:0.95em;padding:0 8px;border-bottom:0;-webkit-border-radius:6px;border-radius:6px}
body.sd .row.sel{line-height:inherit;-webkit-border-radius:8px;border-radius:8px;-webkit-box-shadow:0 0 0 2px rgba(255,102,0,0.25);box-shadow:0 0 0 2px rgba(255,102,0,0.25)}
body.sd .row-num{width:2.2em;font-size:0.8em}
body.sd .row-sub{font-size:0.75em}
body.sd .empty{font-size:0.9em;padding:24px 8px}
body.sd .scroll{width:3px}
/* рейка меню */
body.sd.nav-min #nav{width:52px}
body.sd.nav-min .nav-item{width:36px;height:36px;margin:0 8px 6px 8px;padding:0;line-height:36px;-webkit-background-size:20px 20px;background-size:20px 20px}
body.sd.nav-min .nav-item.sel{-webkit-border-radius:10px;border-radius:10px;-webkit-box-shadow:0 0 0 3px rgba(255,102,0,0.25);box-shadow:0 0 0 3px rgba(255,102,0,0.25)}
body.sd.nav-min #main{left:54px}
/* ТВ: три колонки уже, каналам — больше ширины */
body.sd #ch-cats{width:24%}
body.sd #ch-list{left:25%;width:37%}
body.sd #ch-side{left:63%}
body.sd.cats-min #ch-list{left:0;width:57%}
body.sd.cats-min #ch-side{left:58%}
/* строка канала (высота строки ×0.78 — обёртка UI.ChannelList в app.js) */
/* Колонки логотип/номер уже (по фото клиента 28.08 названия резались до
   «Setanta …»): без логотипов текст с 50px, с логотипами (body.logos из
   app.js) — с 96px вместо 138. */
body.sd .ch-logo{left:8px;height:24px;max-width:40px;margin-top:-12px}
body.sd .ch-num{left:6px;width:38px;font-size:0.78em;line-height:1.3em;margin-top:-0.65em}
body.sd .ch-name,body.sd .ch-now{margin-left:50px}
body.sd .ch-bar{left:50px}
body.sd.logos .ch-num{left:52px}
body.sd.logos .ch-name,body.sd.logos .ch-now{margin-left:96px}
body.sd.logos .ch-bar{left:96px}
body.sd .ch-name{font-size:1em;margin-right:54px;padding-top:0.2em}
body.sd .ch-now{font-size:0.74em;margin-right:54px;margin-top:1px}
body.sd .ch-at{min-width:3em;margin-right:0.5em}
body.sd .ch-dvr{font-size:0.6em;right:8px;padding:0 5px}
body.sd .ch-arch{right:10px;width:8px;height:8px;margin-top:-4px}
body.sd .ch-bar{right:8px;bottom:5px;height:3px}
body.sd .ch-fill{height:3px}
/* программа в правой колонке */
body.sd .epg-now{padding:6px 6px}
body.sd .epg-title{font-size:0.9em;color:#eef1f4}
body.sd .epg-time{font-size:0.75em}
body.sd .epg-item{padding:4px 6px;font-size:0.8em;border-bottom:0}
body.sd .epg-days{height:1.8em;padding:1px 0 0 0;border-bottom:0}
body.sd .chips{height:1.8em}
body.sd .chip{height:1.5em;line-height:1.4em;padding:0 10px;margin-right:5px;font-size:0.75em;-webkit-border-radius:0.75em;border-radius:0.75em}
body.sd .epg-listbox{top:3.7em;bottom:36%}
body.sd .epg-detail{height:34%;bottom:6px;padding-top:6px}
body.sd #ch-side .panel:after{display:none}
body.sd .epg-row{font-size:0.85em;padding:0 8px;border-bottom:0;-webkit-border-radius:6px;border-radius:6px}
body.sd .epg-row.sel{line-height:inherit;-webkit-box-shadow:0 0 0 2px rgba(255,102,0,0.25);box-shadow:0 0 0 2px rgba(255,102,0,0.25)}
body.sd .epg-row .epg-at{min-width:2.9em;margin-right:0.5em}
body.sd .epg-d-title{font-size:0.95em;color:#eef1f4}
body.sd .epg-d-when{font-size:0.72em;margin:1px 0 4px 0}
body.sd .epg-d-text{font-size:0.85em;line-height:1.3}
/* плашка на эфире */
body.sd #osd{left:18px;right:18px;bottom:16px;padding:12px 16px 13px 16px;-webkit-border-radius:10px;border-radius:10px}
body.sd #osd .osd-num{width:72px;font-size:2em}
body.sd #osd .osd-body{margin-left:86px}
body.sd #osd .osd-now{margin-top:6px}
body.sd #osd .osd-time{font-size:1em}
body.sd #osd .osd-date{font-size:0.65em}
body.sd #osd .osd-name{font-size:0.8em}
body.sd #osd .osd-title{font-size:1.35em;color:#eef1f4}
body.sd #osd .osd-when{font-size:0.75em;margin-top:2px}
body.sd #osd .osd-ts{font-size:0.9em;padding:2px 8px;margin-top:4px}
body.sd #osd .osd-desc{font-size:0.85em;line-height:1.35;height:2.7em;margin-top:5px}
body.sd #osd .osd-next{font-size:0.72em;margin-top:4px}
body.sd #osd .bar{margin-top:6px}
body.sd #osd.numeric{padding:20px}
body.sd #osd.numeric .osd-num{font-size:3.2em}
body.sd #osd.numeric .osd-hint{font-size:0.85em;margin-top:6px}
/* оверлей списка поверх видео */
body.sd .ov-head{left:8px;right:8px;top:6px;height:34px;line-height:34px;padding:0 12px;font-size:0.72em}
body.sd .ov-foot{left:8px;right:8px;bottom:6px;height:36px;line-height:34px;padding:0 12px;font-size:0.72em}
body.sd .ov-cats,body.sd .ov-list,body.sd .ov-epg{top:46px;bottom:48px}
body.sd .ov-cats{left:8px;width:24%}
body.sd .ov-list{left:26%;width:40%}
body.sd .ov-epg{left:67%;right:8px}
/* карточка фильма: всё должно уместиться в 576 строк, кнопки — на экране.
   Описание ограничено, ▲▼ прокручивают его (ui.js). */
body.sd #modal-box.wide{left:0;top:0;width:100%;height:100%;margin-left:0;padding:4% 4% 0 36%;-webkit-border-radius:0;border-radius:0}
body.sd .modal-poster{left:4%;top:9%;width:25%;border-width:3px;-webkit-box-shadow:12px 12px 0 #3d1a00;box-shadow:12px 12px 0 #3d1a00}
body.sd #modal-box.wide .modal-title{font-size:1.7em;line-height:1.1;margin-bottom:6px;color:#eef1f4}
body.sd #modal-box.wide .modal-meta{font-size:0.85em;margin-bottom:8px}
body.sd #modal-box.wide .modal-text{font-size:0.9em;line-height:1.4;max-height:7em;overflow:hidden;padding-bottom:0}
body.sd #modal-box.wide .modal-btns{padding-top:10px}
body.sd #modal-box.wide .btn{height:44px;line-height:40px;padding:0 22px;margin-right:10px;font-size:0.95em;-webkit-border-radius:10px;border-radius:10px}
/* диалоги, пикер, клавиатура, поле ввода */
body.sd #modal-box{width:540px;margin-left:-270px;padding:16px 20px;-webkit-border-radius:12px;border-radius:12px}
body.sd .modal-title{font-size:1.2em;margin-bottom:6px}
body.sd .modal-meta{font-size:0.8em;margin-bottom:8px}
body.sd .modal-text{font-size:0.9em;max-height:140px}
body.sd .btn{height:42px;line-height:38px;padding:0 20px;margin-right:10px;margin-bottom:8px;font-size:0.9em;-webkit-border-radius:21px;border-radius:21px}
body.sd .picker-box{width:540px;margin-left:-270px;top:4%;height:92%;padding:14px 18px;-webkit-border-radius:12px;border-radius:12px}
body.sd .picker-list{left:14px;right:14px;top:2.6em;bottom:2.3em}
body.sd .picker-hint{left:18px;right:18px;bottom:10px;font-size:0.8em}
body.sd .field{height:2.2em;line-height:2.1em;padding:0 10px;font-size:1em;-webkit-border-radius:8px;border-radius:8px}
body.sd .kb{margin-top:8px}
body.sd .kb-key{font-size:0.95em;-webkit-border-radius:8px;border-radius:8px}
body.sd .cell-cap{font-size:0.78em;padding:2px 6px}
body.sd .cell{-webkit-border-radius:8px;border-radius:8px}
body.sd #toast{font-size:0.9em;padding:8px 16px}
body.sd .set-help-val{font-size:0.85em;margin-bottom:8px}
body.sd .set-help-p{font-size:0.8em;margin-bottom:8px;line-height:1.35}
body.sd .help-h{font-size:1.2em;margin-bottom:10px}
body.sd .help-row{margin-bottom:6px}
body.sd .help-key{width:30%;min-width:120px;font-size:0.9em}
body.sd .help-val{width:66%;font-size:0.9em}
body.sd .help-p{font-size:0.9em;margin-bottom:8px}
body.sd .fit-info{left:6%;top:14%;right:6%;padding:14px 18px;-webkit-border-radius:12px;border-radius:12px}
body.sd .fit-row{margin:5px 0}
body.sd .dbg-line{font-size:0.65em}