/* ============================================================================
   «СЕГОДНЯ» — ПОЛОСА И ЗАНЯТИЕ (29.09.2026, учёба Ф3). Разметку рисует public/study.js.

   ВИЗУАЛЬНЫЙ ЯЗЫК — тот же, что у гримёрки и чата-2, без новых сущностей:
     • полоса на фото = стекло чипов серии (cabinet.css §8): тёмная подложка .66 с
       размытием, кремовый текст — лежит НА кадре, а не рядом с ним;
     • главная кнопка — литое розовое золото --gold-grad (выбор Сармата 26.07);
     • скругление 14 / пилюля, как у карточек продукта (style.css, --r:14px);
     • глубина осветлением ступеней, никаких цветных ореолов.

   ПОЧЕМУ СВОИ ТОКЕНЫ --sd-*. В светлой теме с data-chrome="a" (боевое состояние
   сайта) body переворачивает --ink в светлый, и любая новая светлая поверхность
   без своей палитры получает белый текст на белом (память «ловушка темы»,
   живой случай — контраст 1.05). Поэтому оверлей и полоса несут палитру сами и
   переключаются от html[data-theme="dark"], а не от предков.
   Светлая тема = СНЯТЫЙ data-theme (theme.js), значения light не бывает.

   БЕЗ КРАСНОГО. Ошибка — пунктир и приглушение, верный ответ — мята. План:
   «разбор ошибки без красного»; ошибаться не должно быть больно.
   ============================================================================ */

/* ------------------------------- 1. ТОКЕНЫ -------------------------------- */
.sd-ov,.sd-host{
  --sd-bg:#EDEFF4;--sd-s1:#F5F7FA;--sd-s2:#FFFFFF;--sd-s3:#E7EBF2;
  --sd-ink:#171B26;--sd-mut:#4E5766;--sd-dim:#5A6474;
  --sd-line:rgba(23,27,38,.13);--sd-line2:rgba(23,27,38,.24);
  --sd-iris:#6C46D8;--sd-iris-wash:rgba(108,70,216,.10);
  --sd-mint:#1E7A5A;--sd-mint-wash:rgba(30,122,90,.10);--sd-mint-line:rgba(30,122,90,.55);
  --sd-ko:#5A2FC0;                       /* слово песни: сирень потемнее — 7.3:1 на белом */
  --sd-mark:rgba(108,70,216,.14);
  --sd-gold:var(--gold-grad,linear-gradient(135deg,#FBE6D2,#EDC7A2 46%,#DFA97F));
  --sd-gold-ink:#2A1520;
  --sd-cast:0 8px 22px rgba(23,32,56,.13);
  --sd-edge:inset 0 1px 0 rgba(255,255,255,.85);
  --sd-focus:#6C46D8;
  --sd-r:14px;
}
html[data-theme="dark"] .sd-ov,html[data-theme="dark"] .sd-host{
  --sd-bg:#100B18;--sd-s1:#17101F;--sd-s2:#1E1629;--sd-s3:#261D33;
  --sd-ink:#F6F1FA;--sd-mut:#C6B7D7;--sd-dim:#A594C0;
  --sd-line:rgba(255,255,255,.10);--sd-line2:rgba(255,255,255,.20);
  --sd-iris:#C888E6;--sd-iris-wash:rgba(200,136,230,.13);
  --sd-mint:#7FE8C9;--sd-mint-wash:rgba(127,232,201,.12);--sd-mint-line:rgba(127,232,201,.60);
  --sd-ko:#C6A5FF;
  --sd-mark:rgba(198,165,255,.18);
  --sd-cast:0 10px 26px rgba(0,0,0,.55);
  --sd-edge:inset 0 1px 0 rgba(255,255,255,.06);
  --sd-focus:#ffe9a8;
}

/* ------------------------------ 2. ПОЛОСА --------------------------------- */
.sd-host{display:block;min-width:0}
.sd-strip{
  display:flex;align-items:center;gap:12px;width:100%;min-height:58px;padding:9px 10px 9px 11px;
  border:1px solid var(--sd-line2);border-radius:var(--sd-r);
  background:var(--sd-s2);color:var(--sd-ink);box-shadow:var(--sd-cast),var(--sd-edge);
  font-family:inherit;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;
  transition:transform var(--d-fast,140ms) var(--ease,ease),background var(--d-fast,140ms)}
.sd-strip:active{transform:scale(.985)}
.sd-strip:focus-visible{outline:2px solid var(--sd-focus);outline-offset:2px}
/* На фото айдола — стекло чипов серии, одинаковое в обеих темах: под ним кадр, а не страница. */
.sd-on-photo .sd-strip{
  background:rgba(10,6,16,.70);color:#FFF6EA;border-color:rgba(255,255,255,.28);
  -webkit-backdrop-filter:blur(12px) saturate(1.2);backdrop-filter:blur(12px) saturate(1.2);
  box-shadow:0 4px 16px rgba(0,0,0,.40)}
.sd-on-photo{--sd-focus:#ffe9a8}
.sd-strip-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;line-height:1.2}
.sd-strip-tx b{font-size:16px;font-weight:760;letter-spacing:.005em}
.sd-strip-tx small{display:flex;align-items:baseline;gap:6px;min-width:0;font-size:13px;font-weight:520;
  color:var(--sd-mut);white-space:nowrap}
.sd-on-photo .sd-strip-tx small{color:rgba(255,246,234,.86)}
.sd-strip-tx small>span{flex:none}
.sd-strip-tx small .sd-s-t{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;font-weight:650}
.sd-s-n{font-family:var(--f-mono,monospace);font-size:12px;font-weight:600;letter-spacing:-.02em}
.sd-sep{opacity:.6}
.sd-ok-mark{color:var(--sd-mint)}
.sd-on-photo .sd-ok-mark{color:#7FE8C9}
/* Кольцо — мера песни «понимаешь N из M»: одно число, которое растёт от проверок
   в разные дни. Золото — цвет песни в гримёрке (--st-edge-gold). */
/* Две дуги (30.09.2026, двухцветная шкала песни): яркая до --p — «понимаешь»,
   светлая от --p до --q — «в работе». Без --q вторая дуга нулевой длины. */
/* Три дуги (30.09.2026, шкала в три ступени): «Знаю» до --p, «Узнаю» до --r, «Учу» до --q. */
.sd-ring{--p:0;--r:0;--q:0;--arc:#DFA97F;--arc-m:rgba(223,169,127,.72);--arc2:rgba(223,169,127,.36);--track:var(--sd-line2);
  position:relative;flex:none;width:38px;height:38px;border-radius:50%;
  background:conic-gradient(var(--arc) calc(var(--p) * 1turn),var(--arc-m) 0 calc(var(--r) * 1turn),var(--arc2) 0 calc(var(--q) * 1turn),var(--track) 0);
  display:grid;place-items:center}
.sd-ring::before{content:"";position:absolute;inset:3.5px;border-radius:50%;background:var(--sd-s2)}
.sd-on-photo .sd-ring{--arc:#EDC7A2;--arc-m:rgba(237,199,162,.72);--arc2:rgba(237,199,162,.38);--track:rgba(255,255,255,.22)}
html[data-theme="dark"] .sd-ring{--arc-m:rgba(237,199,162,.70);--arc2:rgba(237,199,162,.36)}
.sd-on-photo .sd-ring::before{background:#1a1224}
.sd-ring.is-done{--arc:var(--sd-mint)}
.sd-on-photo .sd-ring.is-done{--arc:#7FE8C9}
.sd-ring-ic{position:relative;display:grid;place-items:center;font-style:normal;color:inherit}
.sd-ring.is-done .sd-ring-ic{color:var(--sd-mint)}
.sd-on-photo .sd-ring.is-done .sd-ring-ic{color:#7FE8C9}
.sd-go{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;
  background:var(--sd-gold);color:var(--sd-gold-ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
.sd-strip.is-done .sd-go,.sd-strip.is-err .sd-go{background:transparent;color:inherit;box-shadow:none;opacity:.7}
.sd-strip.is-done .sd-strip-tx b{font-weight:680}

/* Скелет той же высоты: гримёрка не прыгает, когда приходит состояние. */
.sd-strip.is-skel{cursor:default}
.sd-skel-b,.sd-skel-l{display:block;background:var(--sd-line2);border-radius:8px;position:relative;overflow:hidden}
.sd-on-photo .sd-skel-b,.sd-on-photo .sd-skel-l{background:rgba(255,255,255,.18)}
.sd-strip.is-skel .sd-ring{background:var(--sd-line2);border-radius:50%}
.sd-on-photo .sd-strip.is-skel .sd-ring{background:rgba(255,255,255,.18)}
.sd-strip.is-skel .sd-ring::before{display:none}
.sd-skel-l{height:12px;width:46%;border-radius:6px}
.sd-skel-l.s{width:72%;height:10px;opacity:.7}
.sd-skel-b::after,.sd-skel-l::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);
  transform:translateX(-100%);animation:sd-shim 1.3s ease-in-out infinite}
@keyframes sd-shim{to{transform:translateX(100%)}}

/* ------------------------------ 3. ОВЕРЛЕЙ -------------------------------- */
html.sd-lock,html.sd-lock body{overflow:hidden}
.sd-ov{position:fixed;inset:0;z-index:9000;display:none;justify-content:center;align-items:stretch;
  background:var(--sd-bg);color:var(--sd-ink);font-family:var(--f-ui,system-ui,sans-serif)}
.sd-ov.is-open{display:flex}
.sd-box{position:relative;display:flex;flex-direction:column;width:100%;max-width:560px;height:100dvh;
  background:
    radial-gradient(120% 34% at 50% 0%,var(--sd-iris-wash),transparent 70%),
    var(--sd-bg)}
@media (min-width:640px){.sd-box{border-left:1px solid var(--sd-line);border-right:1px solid var(--sd-line)}}
/* :where — нулевой вес: цвет кнопки задаёт её собственный класс (.sd-spk, .sd-x…), а не общий сброс. */
:where(.sd-ov) button{font-family:inherit;color:var(--sd-ink)}
.sd-strip{font-family:inherit}
.sd-ov :focus-visible{outline:2px solid var(--sd-focus);outline-offset:2px}
/* Якоря чтения (tabindex=-1: пузырь айдола, слово задания) получают фокус программно —
   чтобы скринридер начал с них. Это не элементы управления, кольцо на них — шум. Глобальное
   :focus-visible в style.css стоит с !important, поэтому и здесь !important. */
.sd-ov [tabindex="-1"]:focus-visible{outline:none!important;box-shadow:none!important}
.sd-ov [lang="ko"]{font-family:var(--f-ko,"Pretendard Variable"),var(--f-ui,sans-serif)}

.sd-top{flex:none;display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:8px;
  min-height:56px;padding:6px 12px 6px 6px;padding-top:max(6px,env(safe-area-inset-top,0px))}
.sd-x{width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:50%;background:none;cursor:pointer;color:var(--sd-mut)}
.sd-x:hover{background:var(--sd-iris-wash);color:var(--sd-ink)}
.sd-top-c{min-width:0;display:flex;justify-content:center}
.sd-top-t{font-size:16px;font-weight:750}
.sd-top-r{min-width:44px;display:flex;justify-content:flex-end}
.sd-pill{padding:5px 10px;border-radius:999px;background:var(--sd-s2);border:1px solid var(--sd-line);
  font-size:12.5px;font-weight:600;color:var(--sd-mut);white-space:nowrap}

/* Точки: одна на задание. Верно — мята, ошибка — пустое кольцо (не красное). */
.sd-dots{display:flex;flex-wrap:wrap;justify-content:center;gap:5px;list-style:none;margin:0;padding:0;max-width:100%}
.sd-dots li{width:8px;height:8px;border-radius:999px;background:var(--sd-line2);transition:width var(--d-base,220ms) var(--ease,ease),background var(--d-base,220ms)}
.sd-dots li.ok{background:var(--sd-mint)}
.sd-dots li.miss{background:transparent;box-shadow:inset 0 0 0 1.5px var(--sd-dim)}
.sd-dots li.cur{width:20px;background:var(--sd-iris)}

.sd-body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:4px 16px 16px}
.sd-scr{display:flex;flex-direction:column;gap:14px;min-height:100%}
.sd-in{animation:sd-in var(--d-base,220ms) var(--ease,cubic-bezier(.16,1,.3,1)) both}
@keyframes sd-in{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}

.sd-foot{flex:none;display:flex;flex-direction:column;gap:10px;padding:10px 16px;
  padding-bottom:max(12px,env(safe-area-inset-bottom,0px));
  border-top:1px solid var(--sd-line);background:color-mix(in srgb,var(--sd-bg) 92%,transparent);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.sd-foot[hidden]{display:none}
.sd-foot-row{display:flex;gap:10px}
.sd-foot-row>.sd-btn{flex:1}

/* ------------------------------ 4. КНОПКИ --------------------------------- */
.sd-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:56px;padding:0 20px;
  border:1px solid transparent;border-radius:999px;font-size:17px;font-weight:720;line-height:1.1;text-align:center;
  text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent;
  transition:transform var(--d-fast,140ms) var(--ease,ease),opacity var(--d-fast,140ms)}
.sd-btn:active{transform:scale(.98)}
.sd-btn[disabled]{opacity:.45;cursor:default;transform:none}
.sd-gold{background:var(--sd-gold);color:var(--sd-gold-ink) !important;
  box-shadow:0 6px 16px rgba(194,134,90,.28),inset 0 1px 0 rgba(255,255,255,.65),inset 0 -1px 0 rgba(122,70,40,.25)}
.sd-glass{background:var(--sd-s2);color:var(--sd-ink) !important;border-color:var(--sd-line2);box-shadow:var(--sd-edge)}
.sd-quiet{min-height:48px;background:transparent;color:var(--sd-mut) !important;border-color:var(--sd-line2);font-size:15.5px;font-weight:620}
.sd-btn-s{min-height:44px;padding:0 16px;font-size:15px}

/* ------------------------------ 5. СТАРТ ---------------------------------- */
.sd-idol{display:flex;align-items:flex-start;gap:10px;padding-top:6px}
.sd-av{flex:none;width:46px;height:46px;border-radius:50%;object-fit:cover;object-position:50% 18%;
  box-shadow:0 0 0 2px var(--sd-bg),0 0 0 3.5px var(--sd-tint,var(--sd-iris))}
.sd-av-ph{display:grid;place-items:center;background:var(--sd-iris-wash);color:var(--sd-iris);font-weight:800;font-size:18px}
.sd-idol-col{min-width:0;flex:1;display:flex;flex-direction:column;gap:4px}
.sd-idol-nm{font-size:12.5px;font-weight:700;color:var(--sd-mut);letter-spacing:.02em}
.sd-bub{align-self:flex-start;max-width:100%;padding:11px 14px;border-radius:6px 18px 18px 18px;
  background:var(--sd-s2);border:1px solid var(--sd-line);box-shadow:var(--sd-edge);
  font-size:16px;line-height:1.42;font-weight:500;min-height:44px;outline:none}
.sd-bub.is-said{animation:sd-pop var(--d-base,220ms) var(--ease,ease) both}
@keyframes sd-pop{from{opacity:.2;transform:translateY(4px)}to{opacity:1;transform:none}}
.sd-typing{display:inline-flex;gap:4px;align-items:center;height:20px}
.sd-typing i{width:7px;height:7px;border-radius:50%;background:var(--sd-dim);animation:sd-dot 1s infinite ease-in-out}
.sd-typing i:nth-child(2){animation-delay:.15s}.sd-typing i:nth-child(3){animation-delay:.3s}
@keyframes sd-dot{0%,80%,100%{opacity:.3;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}

.sd-note{margin:0;padding:10px 12px;border-radius:12px;background:var(--sd-iris-wash);font-size:14px;line-height:1.4;color:var(--sd-ink)}
.sd-plan{display:grid;grid-template-columns:repeat(auto-fit,minmax(72px,1fr));gap:8px}
.sd-plan-t{display:flex;flex-direction:column;gap:4px;padding:12px 10px;border-radius:var(--sd-r);
  background:var(--sd-s2);border:1px solid var(--sd-line);box-shadow:var(--sd-edge)}
.sd-plan-t b{font-size:26px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums}
.sd-plan-t span{font-size:13px;color:var(--sd-mut);line-height:1.25}

.sd-song{padding:14px;border-radius:var(--sd-r);background:var(--sd-s1);border:1px solid var(--sd-line)}
.sd-song-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px}
.sd-song-h b{font-size:17px;font-weight:760}
.sd-song-h span{font-size:13.5px;color:var(--sd-mut)}
.sd-song-m{margin-top:6px;font-size:14px;color:var(--sd-mut)}
/* Полоса песни — по клетке на ключевое слово: видно, сколько осталось, а не проценты в никуда. */
.sd-seg{display:flex;gap:3px;margin-top:8px}
.sd-seg i{flex:1;height:7px;border-radius:3px;background:var(--sd-line2)}
.sd-seg i.on{background:#DFA97F}
html[data-theme="dark"] .sd-seg i.on{background:#EDC7A2}
/* «В работе» — тот же тон, светлее (30.09.2026): одна семья цвета, два состояния.
   Непрозрачная пара к треку, чтобы клетка читалась и на фото, и на панели. */
.sd-seg i.wk{background:rgba(223,169,127,.42)}
html[data-theme="dark"] .sd-seg i.wk{background:rgba(237,199,162,.5)}
.sd-meter .sd-song-m{margin-top:6px}

/* ШКАЛА ПЕСНИ В ТРИ СТУПЕНИ (30.09.2026, шкала прогресса; рисует study.js scaleHtml).
   Клетка на ключевое слово: .l1 «Учу» — тон с золотой каймой (начато), .l2 «Узнаю» —
   средняя заливка, .l3 «Знаю» — яркая. Свои цвета, без токенов --sd-*: шкала живёт и в
   окне карточки (progress.js), и в заданиях по клипу (card-tasks.css) — вне .sd-ov.
   Трек — от currentColor: читается на любой подложке. .is-grow — клетка, чья ступень
   выросла с прошлого показа: короткое закрашивание, по очереди (--sc-d). */
.sd-sc{--sc-k:#D48E57;--sc-r:rgba(212,142,87,.62);--sc-l:rgba(212,142,87,.20);--sc-line:rgba(212,142,87,.85);
  --sc-track:color-mix(in srgb,currentColor 13%,transparent);
  display:flex;flex-direction:column;gap:6px;margin-top:8px;min-width:0}
html[data-theme="dark"] .sd-sc,.sd-on-photo .sd-sc{--sc-k:#F2C99E;--sc-r:rgba(242,201,158,.62);--sc-l:rgba(242,201,158,.20);--sc-line:rgba(242,201,158,.9)}
.sd-sc-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;font-size:14px;line-height:1.3}
.sd-sc-t{font-weight:650}
.sd-sc-plus{font-size:12.5px;font-weight:700;color:var(--sc-k);white-space:nowrap}
.sd-sc-bar{display:flex;gap:3px}
.sd-sc-bar i{flex:1;min-width:0;height:9px;border-radius:3px;background:var(--sc-track)}
.sd-sc-bar i.l1{background:var(--sc-l);box-shadow:inset 0 0 0 1.5px var(--sc-line)}
.sd-sc-bar i.l2{background:var(--sc-r)}
.sd-sc-bar i.l3{background:var(--sc-k);box-shadow:0 0 6px color-mix(in srgb,var(--sc-k) 45%,transparent)}
.sd-sc-bar i.is-grow{transform-origin:left center;animation:sd-sc-grow .7s var(--sc-d,0ms) cubic-bezier(.2,.9,.3,1.2) both}
@keyframes sd-sc-grow{0%{transform:scaleX(.08);opacity:.15}55%{transform:scaleX(1.06) scaleY(1.45);filter:brightness(1.35)}100%{transform:none;opacity:1;filter:none}}
.sd-sc-lg{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12px;line-height:1.2;opacity:.85}
.sd-sc-lg span{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.sd-sc-lg i{display:inline-block;width:12px;height:8px;border-radius:2px}
.sd-sc-lg i.l1{background:var(--sc-l);box-shadow:inset 0 0 0 1.5px var(--sc-line)}
.sd-sc-lg i.l2{background:var(--sc-r)}
.sd-sc-lg i.l3{background:var(--sc-k)}
/* В полосе «Сегодня» — тонкая шкала под подписью, без легенды. */
.sd-sc-strip{margin-top:2px;display:block}
.sd-sc-strip .sd-sc-bar{gap:2px}
.sd-sc-strip .sd-sc-bar i{height:4px;border-radius:2px}
.sd-sc-strip .sd-sc-bar i.l1{box-shadow:inset 0 0 0 1px var(--sc-line)}
.sd-sc-strip .sd-sc-bar i.l3{box-shadow:none}
.sd-mv-w{font-size:13px;line-height:1.35;color:var(--sd-mut)}

/* ------------------------------ 6. ЗАДАНИЕ -------------------------------- */
.sd-eyebrow{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:720;letter-spacing:.08em;
  text-transform:uppercase;color:var(--sd-mut)}
.sd-again{padding:3px 8px;border-radius:999px;background:var(--sd-iris-wash);color:var(--sd-iris);letter-spacing:.04em}
.sd-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;padding:22px 16px;
  border-radius:var(--sd-r);background:var(--sd-s2);border:1px solid var(--sd-line);box-shadow:var(--sd-cast),var(--sd-edge);text-align:center}
.sd-word-w{display:flex;align-items:center;justify-content:center;gap:10px;max-width:100%}
.sd-word{font-size:clamp(34px,10vw,44px);font-weight:760;line-height:1.1;color:var(--sd-ko);overflow-wrap:anywhere;outline:none}
.sd-word-read{font-size:clamp(40px,12vw,52px)}
.sd-word-sub{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 10px;font-size:15px;color:var(--sd-mut)}
.sd-tr{font-weight:600;color:var(--sd-mut)}
.sd-base{padding:1px 8px;border-radius:999px;border:1px solid var(--sd-line2);font-size:13.5px}
.sd-gloss{font-size:20px;font-weight:700;line-height:1.3}
.sd-spk{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;cursor:pointer;
  border:1px solid var(--sd-line2);background:var(--sd-s1);color:var(--sd-iris)}
.sd-spk-s{width:44px;height:44px;margin:-6px 0}
.sd-chip{position:absolute;top:10px;right:10px;padding:3px 10px;border-radius:999px;background:var(--sd-iris-wash);color:var(--sd-iris);font-weight:750}
.sd-card-listen{padding:26px 16px}
.sd-play{display:grid;place-items:center;width:88px;height:88px;border-radius:50%;cursor:pointer;
  border:0;background:var(--sd-gold);color:var(--sd-gold-ink);box-shadow:0 8px 22px rgba(194,134,90,.32),inset 0 1px 0 rgba(255,255,255,.6)}
.sd-play svg{width:36px;height:36px}
.sd-play.is-on{animation:sd-pulse 1s ease-in-out infinite}
@keyframes sd-pulse{50%{transform:scale(1.05)}}
.sd-reveal{display:flex;flex-direction:column;gap:4px;align-items:center}
.sd-reveal small{font-size:13px;color:var(--sd-mut)}
.sd-reveal b{font-size:26px;color:var(--sd-ko)}
.sd-prompt{font-size:24px;font-weight:760;line-height:1.25;outline:none}
.sd-fbline,.sd-fb{font-size:12.5px;font-weight:500;color:var(--sd-dim)}
.sd-fbline{margin:-6px 0 0;text-align:center}
.sd-hint-s{margin:0;text-align:center;font-size:13px;color:var(--sd-dim)}

/* Строка песни: слово в работе подсвечено, смысл строки — под ней (§11.1: смысл
   «Залатай строку» показан ВО ВРЕМЯ вопроса, иначе у трети пропусков два верных). */
.sd-ctx{padding:14px;border-radius:var(--sd-r);background:var(--sd-s1);border:1px solid var(--sd-line)}
.sd-ctx-h{font-size:12.5px;font-weight:650;color:var(--sd-dim);margin-bottom:6px;letter-spacing:.02em}
.sd-card-gap{align-items:stretch;text-align:left}
.sd-line{margin:0;font-size:19px;line-height:1.55;font-weight:600;overflow-wrap:anywhere}
.sd-line mark{background:var(--sd-mark);color:var(--sd-ko);padding:1px 4px;border-radius:6px;font-weight:760}
.sd-line mark.is-right,.sd-line .sd-fill{background:var(--sd-mint-wash);color:var(--sd-ink);box-shadow:inset 0 -2px 0 var(--sd-mint)}
.sd-blank{display:inline-block;vertical-align:-3px;width:4.2em;height:1.15em;border-radius:6px;
  border:2px dashed var(--sd-iris);background:var(--sd-iris-wash)}
.sd-line-s{margin:6px 0 0;font-size:15px;line-height:1.4;color:var(--sd-mut)}

/* Варианты: столбиком по 56 px (план), палец, не курсор. */
.sd-opts{display:flex;flex-direction:column;gap:10px}
.sd-opt{position:relative;display:flex;align-items:center;gap:12px;min-height:56px;padding:10px 14px;width:100%;
  border:1.5px solid var(--sd-line2);border-radius:var(--sd-r);background:var(--sd-s2);box-shadow:var(--sd-edge);
  font-size:17px;font-weight:620;line-height:1.25;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;
  transition:transform var(--d-fast,140ms) var(--ease,ease),border-color var(--d-fast,140ms),background var(--d-fast,140ms),opacity var(--d-base,220ms)}
.sd-opt:active{transform:scale(.985)}
@media (hover:hover){.sd-opts:not(.is-locked) .sd-opt:hover{border-color:var(--sd-iris)}}
.sd-opt-k{flex:none;width:24px;height:24px;display:grid;place-items:center;border-radius:7px;border:1px solid var(--sd-line2);
  font-family:var(--f-mono,monospace);font-size:12px;font-weight:700;color:var(--sd-dim)}
@media (hover:none){.sd-opt-k{display:none}}
.sd-opt-t{flex:1;min-width:0;overflow-wrap:anywhere}
.sd-opt-m{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%}
.sd-opts.is-locked .sd-opt{cursor:default}
.sd-opt.is-right{border-color:var(--sd-mint);background:var(--sd-mint-wash)}
.sd-opt.is-right .sd-opt-m{background:var(--sd-mint);color:var(--sd-s2);animation:sd-pop var(--d-base,220ms) var(--ease,ease) both}
html[data-theme="dark"] .sd-opt.is-right .sd-opt-m{color:#10281F}
.sd-opt.is-miss{border-style:dashed;border-color:var(--sd-dim);opacity:.7}
.sd-opt.is-miss .sd-opt-t{text-decoration:line-through;text-decoration-color:var(--sd-dim)}
.sd-opt.is-off{opacity:.45}

/* «Собери слово»: ячейки ответа и плитки 52 px. */
.sd-slots{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:6px}
.sd-slot{min-width:48px;height:52px;padding:0 10px;border-radius:12px;border:2px dashed var(--sd-line2);
  background:transparent;font-size:24px;font-weight:720;color:var(--sd-ko);cursor:pointer}
.sd-slot.is-full{border-style:solid;border-color:var(--sd-iris);background:var(--sd-iris-wash)}
.sd-slots.is-right .sd-slot{border-color:var(--sd-mint);background:var(--sd-mint-wash);color:var(--sd-ink)}
.sd-slots.is-miss .sd-slot{border-style:dashed;border-color:var(--sd-dim);opacity:.75}
.sd-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.sd-tile{min-height:52px;border-radius:12px;border:1.5px solid var(--sd-line2);background:var(--sd-s2);box-shadow:var(--sd-edge);
  font-size:22px;font-weight:700;color:var(--sd-ink);cursor:pointer;transition:opacity var(--d-fast,140ms),transform var(--d-fast,140ms)}
.sd-tile:active{transform:scale(.95)}
.sd-tile.is-used{opacity:.22;cursor:default}
.sd-tile[disabled]{cursor:default}

.sd-okline{display:flex;align-items:center;justify-content:center;gap:8px;min-height:56px;font-size:17px;font-weight:750;color:var(--sd-mint)}

/* Разбор ошибки — лист над кнопкой «Дальше». Сирень, не красный. */
.sd-sheet{display:flex;flex-direction:column;gap:8px;padding:12px 14px;border-radius:var(--sd-r);
  background:var(--sd-s2);border:1px solid var(--sd-line2);box-shadow:inset 3px 0 0 var(--sd-iris),var(--sd-edge);
  animation:sd-up var(--d-base,220ms) var(--ease,ease) both;max-height:46dvh;overflow-y:auto}
@keyframes sd-up{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.sd-rv{font-size:15.5px;line-height:1.45}
.sd-rv-1{display:flex;align-items:center;justify-content:space-between;gap:10px}
.sd-rv-1 b{font-size:20px;color:var(--sd-ko)}
.sd-rv-2 .sd-line{font-size:16px}
.sd-rv-2 .sd-line-s{font-size:14px;margin-top:2px}
.sd-rv-3{padding-top:8px;border-top:1px solid var(--sd-line);color:var(--sd-ink);font-weight:560}
.sd-rv-note{font-size:12.5px;color:var(--sd-dim)}

/* ------------------------------ 7. ИТОГ ----------------------------------- */
.sd-fin-head{display:flex;flex-direction:column;align-items:center;gap:10px;padding-top:10px;text-align:center}
.sd-fin-mark{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;
  background:var(--sd-mint-wash);color:var(--sd-mint);box-shadow:inset 0 0 0 2px var(--sd-mint-line);
  animation:sd-pop var(--d-slow,380ms) var(--ease,ease) both}
.sd-fin-mark svg{width:32px;height:32px}
.sd-fin-mark.is-wait{margin:40px auto 0;opacity:.6;animation:sd-pulse 1.1s ease-in-out infinite}
.sd-h{margin:0;font-size:24px;font-weight:800;line-height:1.2;outline:none}
.sd-sub{margin:0;font-size:15px;line-height:1.45;color:var(--sd-mut)}
.sd-center{text-align:center}
.sd-fin-card{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:var(--sd-r);
  background:var(--sd-s2);border:1px solid var(--sd-line);box-shadow:var(--sd-edge)}
.sd-fin-card h3{margin:0;font-size:12.5px;font-weight:720;letter-spacing:.08em;text-transform:uppercase;color:var(--sd-mut)}
.sd-fin-line{box-shadow:inset 3px 0 0 #DFA97F,var(--sd-edge)}
.sd-mv{display:flex;flex-direction:column;gap:3px}
.sd-mv b{font-size:16px;font-weight:720}
.sd-mv small{font-size:13px;line-height:1.35;color:var(--sd-mut)}
.sd-mv-up b{color:var(--sd-mint)}
.sd-wchips{display:flex;flex-wrap:wrap;gap:6px}
.sd-wchip{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;border:1px solid var(--sd-line2);font-size:14px}
.sd-wchip b{color:var(--sd-ko);font-weight:720}
.sd-wchip i{font-style:normal;font-size:12.5px;color:var(--sd-mut)}
.sd-wchip.sd-st-recognize{border-color:var(--sd-iris)}
.sd-wchip.sd-st-known{border-color:var(--sd-mint);background:var(--sd-mint-wash)}
.sd-cardline{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:var(--sd-r);background:var(--sd-s1);
  border:1px solid var(--sd-line);font-size:14.5px;line-height:1.4}
.sd-cardline-ic{flex:none;width:22px;height:28px;border-radius:4px;background:linear-gradient(160deg,#FBE6D2,#EDC7A2 46%,#C79BE4);
  box-shadow:0 2px 6px rgba(0,0,0,.25);transform:rotate(-6deg)}
.sd-cardline.is-new{border-color:#DFA97F;font-weight:650}
.sd-notif{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px 10px 14px;
  border-radius:var(--sd-r);border:1px dashed var(--sd-line2);font-size:14.5px;line-height:1.35}

/* --------------------------- 8. ПУСТЫЕ СОСТОЯНИЯ -------------------------- */
.sd-empty{display:flex;flex-direction:column;gap:10px}
.sd-empty .sd-idol{margin-bottom:6px}
.sd-empty-ic{display:grid;place-items:center;width:56px;height:56px;margin-top:24px;border-radius:50%;background:var(--sd-iris-wash);color:var(--sd-iris)}
.sd-empty-ic svg{width:26px;height:26px}
.sd-picks{display:flex;flex-direction:column;gap:8px}
.sd-pick-h{margin-top:6px;font-size:12.5px;font-weight:720;letter-spacing:.08em;text-transform:uppercase;color:var(--sd-mut)}
.sd-pick{display:flex;align-items:center;gap:12px;width:100%;min-height:64px;padding:8px 10px 8px 8px;
  border-radius:var(--sd-r);border:1px solid var(--sd-line2);background:var(--sd-s2);box-shadow:var(--sd-edge);text-align:left;cursor:pointer}
.sd-pick:active{transform:scale(.985)}
.sd-pick.is-big{border-color:#DFA97F;box-shadow:inset 3px 0 0 #DFA97F,var(--sd-edge)}
.sd-pick.is-busy{opacity:.55;pointer-events:none}
.sd-th{flex:none;width:64px;height:48px;border-radius:10px;object-fit:cover;background:var(--sd-s3)}
.sd-th-ph{display:grid;place-items:center;color:var(--sd-dim)}
.sd-pick-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.sd-pick-tx b{font-size:15.5px;font-weight:720;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sd-pick-tx small{font-size:13px;color:var(--sd-mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sd-pick-n{flex:none;font-family:var(--f-mono,monospace);font-size:12px;color:var(--sd-mut)}
.sd-pick .sd-go{width:30px;height:30px}

/* Скелет оверлея при холодной загрузке. */
.sd-skel{display:flex;flex-direction:column;gap:14px;padding-top:8px}
.sd-skel-row{display:flex;gap:10px;align-items:flex-start}
.sd-skel-av{width:46px;height:46px;border-radius:50%}
.sd-skel-bub{flex:1;height:64px;border-radius:6px 18px 18px 18px}
.sd-skel-card{height:84px;border-radius:var(--sd-r)}
.sd-skel-card.s{height:64px}

.sd-toast{position:absolute;left:16px;right:16px;bottom:calc(92px + env(safe-area-inset-bottom,0px));z-index:5;
  padding:12px 14px;border-radius:12px;background:var(--sd-ink);color:var(--sd-bg);font-size:14.5px;line-height:1.35;
  box-shadow:var(--sd-cast);animation:sd-up var(--d-base,220ms) var(--ease,ease) both}
.sd-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ------------------------- 9. СЕГОДНЯ v2 (02.10.2026) -----------------------
   Буква дня, «Собери из слогов», «Напиши по буквам», итог-неделя и карточка айдола.
   Те же токены --sd-*, без новых сущностей. Каждый экран помещается в 375x667 без
   прокрутки: размеры ниже подобраны под это (замер в puppeteer, 02.10.2026).
   Тап-цели не меньше 44 px; подсказка — золотая кайма, ошибка — пунктир, без красного. */
.sd-let{gap:6px;padding:16px 16px 14px}
.sd-let-w{display:flex;align-items:center;justify-content:center;gap:16px}
.sd-let-big{font-size:88px;line-height:1;font-weight:800;color:var(--sd-ko);outline:none}
.sd-let-snd{margin:0;font-size:15.5px;line-height:1.35;color:var(--sd-mut);text-wrap:balance}
.sd-ex-h{font-size:12.5px;font-weight:720;letter-spacing:.08em;text-transform:uppercase;color:var(--sd-mut);margin-bottom:-6px}
.sd-exs{display:flex;flex-direction:column;gap:8px}
.sd-ex{display:flex;align-items:center;gap:10px;min-height:52px;padding:4px 6px 4px 12px;border-radius:var(--sd-r);
  background:var(--sd-s2);border:1px solid var(--sd-line);box-shadow:var(--sd-edge)}
.sd-ex-k{flex:none;min-width:68px;font-size:22px;font-weight:720;color:var(--sd-ink)}
.sd-ex-k mark{background:none;color:var(--sd-ko);font-weight:800;box-shadow:inset 0 -3px 0 var(--sd-mark)}
.sd-ex-m{flex:1;min-width:0;font-size:14px;line-height:1.3}
.sd-ex-m small{display:block;font-size:12px;color:var(--sd-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sd-spk.is-on{background:var(--sd-iris-wash);border-color:var(--sd-iris)}

.sd-v2{display:flex;flex-direction:column;gap:12px}
.sd-v2-q{gap:6px;padding:14px 14px 16px}
.sd-v2-q .sd-prompt{font-size:22px}
.sd-v2-q .sd-hint-s{margin:0}
.sd-slot-l{min-width:64px;height:64px;font-size:30px;border-radius:14px}
.sd-slot-l[disabled]{cursor:default;opacity:1}
.sd-slots.is-shown .sd-slot{border-style:solid;border-color:var(--sd-iris);background:var(--sd-iris-wash);color:var(--sd-ink)}
.sd-tiles-l{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.sd-tile-l{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:68px;min-height:68px;
  font-size:30px;line-height:1;border-radius:14px}
.sd-tile-l small{font-size:12.5px;font-weight:650;color:#8E5527}
html[data-theme="dark"] .sd-tile-l small{color:#EDC7A2}
.sd-tile-l.is-used{opacity:.22}
.sd-tile-l[disabled]:not(.is-used){opacity:.5;cursor:default}
.sd-fb2{margin:0;min-height:21px;font-size:14.5px;line-height:1.4;text-align:center;color:var(--sd-mut)}
.sd-fb2.is-good{color:var(--sd-mint);font-weight:700}
.sd-hintb{align-self:center;min-height:44px;padding:0 10px;border:0;background:none;cursor:pointer;
  font-size:14.5px;font-weight:600;color:var(--sd-iris) !important;text-decoration:underline;text-underline-offset:3px}

.sd-sp-w{font-size:20px;color:var(--sd-ko)}
.sd-typed{display:grid;place-items:center;min-height:76px;border-radius:var(--sd-r);background:var(--sd-s1);
  border:1.5px dashed var(--sd-line2);font-size:44px;font-weight:800;line-height:1;color:var(--sd-ko)}
.sd-typed.is-right{border-style:solid;border-color:var(--sd-mint);background:var(--sd-mint-wash)}
.sd-typed-ph{font-size:16px;font-weight:500;color:var(--sd-dim)}
.sd-pad{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.sd-key{min-height:52px;border-radius:12px;border:1.5px solid var(--sd-line2);background:var(--sd-s2);box-shadow:var(--sd-edge);
  font-size:24px;font-weight:700;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform var(--d-fast,140ms)}
.sd-key:active{transform:scale(.95)}
.sd-key[disabled]{opacity:.4;cursor:default;transform:none}
.sd-key.is-hint{border-color:#DFA97F;box-shadow:inset 0 0 0 2px #DFA97F,0 0 12px rgba(223,169,127,.35)}
.sd-key-fn{font-size:15px;font-weight:650;color:var(--sd-mut) !important}
.sd-key-hint{font-size:13.5px}

/* Итог v2: шапка строкой, неделя, карточка, копилка — всё в одном экране. */
.sd-fin2{display:flex;flex-direction:column;gap:12px}
.sd-fin2-head{display:flex;align-items:center;justify-content:center;gap:12px;padding-top:4px}
.sd-fin2-head .sd-fin-mark{width:44px;height:44px}
.sd-fin2-head .sd-fin-mark svg{width:24px;height:24px}
.sd-fin2 .sd-idol{padding-top:0}
.sd-wk{display:flex;flex-direction:column;gap:10px;padding:12px 12px 10px;border-radius:var(--sd-r);
  background:var(--sd-s2);border:1px solid var(--sd-line);box-shadow:var(--sd-edge)}
.sd-wk-row{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;list-style:none;margin:0;padding:0}
.sd-wk-day{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0}
.sd-wk-dot{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;border:1.5px solid var(--sd-line2);
  font-size:15px;font-weight:700;color:var(--sd-dim)}
.sd-wk-dot svg{width:16px;height:16px}
.sd-wk-dot.is-ok{background:var(--sd-iris);border-color:var(--sd-iris);color:var(--sd-s2)}
html[data-theme="dark"] .sd-wk-dot.is-ok{color:#1A1024}
.sd-wk-dot.is-skip{border-style:dashed}
.sd-wk-dot.is-today{border:2px solid #DFA97F;color:#8E5527}
html[data-theme="dark"] .sd-wk-dot.is-today{color:#EDC7A2}
.sd-wk-dot.is-ok.is-now{box-shadow:0 0 0 2px var(--sd-s2),0 0 0 4px #DFA97F}
.sd-wk-dot.is-today.is-done{animation:sd-pop var(--d-slow,380ms) var(--ease,ease) both}
.sd-wk-d{font-size:11.5px;color:var(--sd-mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.sd-wk-goal{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:2px 10px;font-size:13px;line-height:1.35;color:var(--sd-mut)}
.sd-wk-goal b{margin-left:auto;font-weight:700;color:#8E5527;text-align:right}
html[data-theme="dark"] .sd-wk-goal b{color:#F3D9AC}
.sd-wk-trial{font-size:12.5px;color:var(--sd-dim)}

.sd-idc{display:flex;align-items:center;gap:14px;padding:12px;border-radius:var(--sd-r);background:var(--sd-s2);
  border:1px solid var(--sd-line2);box-shadow:var(--sd-edge);animation:sd-up var(--d-slow,380ms) var(--ease,ease) both}
.sd-pc{position:relative;flex:none;width:74px;aspect-ratio:55/85;border-radius:9px;overflow:hidden;background:var(--sd-s3);
  box-shadow:0 0 0 1.5px var(--sd-line2)}
.sd-pc img{display:block;width:100%;height:100%;object-fit:cover}
.sd-pc.is-print{display:grid;place-items:center;background:linear-gradient(160deg,var(--sd-s3),var(--sd-iris-wash))}
.sd-pc-print{padding:4px;font-size:11px;font-weight:700;text-align:center;color:var(--sd-mut)}
.sd-pc.is-print::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);
  transform:translateX(-100%);animation:sd-shim 1.6s ease-in-out infinite}
.sd-pc-no{position:absolute;right:4px;top:4px;padding:1px 4px;border-radius:4px;background:rgba(16,11,24,.7);color:#fff;font-size:9.5px;font-weight:700}
.sd-r-rare .sd-pc{box-shadow:0 0 0 2px #C79EE8,0 0 14px rgba(199,158,232,.45)}
.sd-r-legend .sd-pc{box-shadow:0 0 0 2px #F3D9AC,0 0 16px rgba(243,217,172,.55)}
.sd-r-rare{border-color:#C79EE8}
.sd-r-legend{border-color:#DFA97F}
.sd-idc-tx{min-width:0;display:flex;flex-direction:column;gap:3px}
.sd-idc-tx b{font-size:16.5px;line-height:1.3;font-weight:760}
.sd-idc-tx small{font-size:13px;line-height:1.35;color:var(--sd-mut)}
.sd-idc-tag{align-self:flex-start;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:760;letter-spacing:.06em;text-transform:uppercase;
  background:var(--sd-s3);color:var(--sd-mut)}
.sd-r-rare .sd-idc-tag{background:rgba(199,158,232,.18);color:var(--sd-iris)}
.sd-r-legend .sd-idc-tag{background:rgba(243,217,172,.22);color:#8E5527}
html[data-theme="dark"] .sd-r-legend .sd-idc-tag{color:#F3D9AC}
.sd-idc-trial{color:var(--sd-dim) !important}
.sd-bag .sd-wchips{gap:6px}

/* Узкий экран 360: поля и кегли на ступень меньше, варианты не теряют 56 px. */
@media (max-width:374px){
  .sd-body{padding:4px 12px 14px}
  .sd-foot{padding-left:12px;padding-right:12px}
  .sd-strip{gap:10px;padding:8px 8px 8px 9px}
  .sd-strip-tx small{font-size:12.5px;gap:5px}
  .sd-tiles{gap:6px}
  .sd-tile{font-size:20px}
  .sd-line{font-size:17.5px}
  .sd-btn{font-size:16px;padding:0 14px}
  .sd-let-big{font-size:76px}
  .sd-tile-l{width:62px;min-height:62px}
  .sd-slot-l{min-width:58px;height:58px}
  .sd-wk-dot{width:28px;height:28px}
}
/* Низкий экран (667 и меньше): v2 сжимается по высоте, чтобы не было прокрутки. */
@media (max-height:700px){
  .sd-let-big{font-size:72px}
  .sd-let{padding:12px 14px 10px}
  .sd-ex{min-height:48px}
  .sd-v2{gap:10px}
  .sd-v2-q{padding:10px 12px 12px}
  .sd-typed{min-height:64px;font-size:38px}
  .sd-key{min-height:48px}
  .sd-fin2{gap:10px}
  .sd-fin2-head .sd-fin-mark{width:38px;height:38px}
  .sd-fin2-head .sd-h{font-size:21px}
  .sd-fin2 .sd-bub{font-size:15px;padding:9px 12px;min-height:40px}
  .sd-fin2 .sd-av{width:40px;height:40px}
  .sd-wk{gap:8px;padding:10px 10px 8px}
  .sd-idc{padding:10px;gap:12px}
  .sd-pc{width:60px}
  .sd-idc-tx b{font-size:15.5px}
  .sd-fin2 .sd-notif{padding:6px 8px 6px 12px;font-size:14px}
}
@media (prefers-reduced-motion:reduce){
  .sd-ov *,.sd-strip,.sd-strip *,.sd-sc *{animation:none !important;transition:none !important}
}

/* ТОНКАЯ ПОЛОСА «СЕГОДНЯ» НА ФОТО (03.10.2026, макет v4 Сармата). Логика полосы та же
   (study.js stripHtml), меняется только вид: одна строка 44px, стекло потише, кольцо и
   стрелка меньше, подпись в строку рядом со словом «Сегодня», шкала по словам скрыта —
   на фото важны лицо и одна строка «что сегодня». */
.sd-on-photo .sd-strip{min-height:44px;padding:4px 6px 4px 8px;gap:9px;border-radius:14px;
  background:rgba(14,11,24,.52);border-color:rgba(255,255,255,.14);box-shadow:none}
.sd-on-photo .sd-ring{width:28px;height:28px}
.sd-on-photo .sd-ring::before{inset:3px}
.sd-on-photo .sd-ring-ic svg{width:11px;height:11px}
.sd-on-photo .sd-strip-tx{flex-direction:row;align-items:baseline;gap:8px}
.sd-on-photo .sd-strip-tx b{font-size:14px;font-weight:650;flex:none}
.sd-on-photo .sd-strip-tx small{flex:1;font-size:12.5px}
.sd-on-photo .sd-strip-tx>:not(b):not(small){display:none}
.sd-on-photo .sd-go{width:30px;height:30px;background:transparent;color:#fff;box-shadow:none;opacity:.85}
.sd-on-photo .sd-strip.is-skel{min-height:44px}

/* «СЕГОДНЯ» В ШКАТУЛКЕ «МОЯ ПЕСНЯ» (04.10.2026, правка Сармата). Полоса та же (study.js), вид —
   как у шкатулки: прозрачный фон, тонкие шампань-линии, кольцо прогресса золотом, ▶ — круг с
   золотым ободком. Шкатулка тёмная в обеих темах, поэтому цвета фиксированные. Строку песни
   («VISION 5/17») и шкалу слов не повторяем, если ниже уже стоит строка текущей песни. */
.sd-in-lux{margin:-2px 0 12px}
.sd-in-lux .sd-strip{min-height:52px;padding:6px 6px 6px 8px;gap:11px;border-radius:14px;background:rgba(243,217,172,.04);
  border:1px solid rgba(243,217,172,.32);box-shadow:none;color:#FFF8EE}
.sd-in-lux .sd-strip:focus-visible{outline:2px solid #F3D9AC;outline-offset:2px}
.sd-in-lux .sd-strip-tx b{font-size:15px;font-weight:600;letter-spacing:.04em;color:#FFF8EE}
.sd-in-lux .sd-strip-tx small{color:rgba(243,217,172,.82);font-size:12.5px}
.sd-in-lux .sd-ring{--arc:#F3D9AC;--arc-m:rgba(243,217,172,.7);--arc2:rgba(243,217,172,.34);--track:rgba(243,217,172,.16);width:34px;height:34px}
.sd-in-lux .sd-ring::before{background:#17121F;inset:3px}
.sd-in-lux .sd-ring-ic{color:#F3D9AC}
.sd-in-lux .sd-ring.is-done{--arc:#7FE8C9}
.sd-in-lux .sd-ring.is-done .sd-ring-ic{color:#7FE8C9}
.sd-in-lux .sd-go{width:40px;height:40px;background:transparent;color:#F3D9AC;border:1px solid #F3D9AC;box-shadow:0 0 12px rgba(243,217,172,.22)}
.sd-in-lux .sd-strip.is-done .sd-go,.sd-in-lux .sd-strip.is-err .sd-go{opacity:.75;border-color:rgba(243,217,172,.5)}
.sd-in-lux .sd-strip.is-skel{border-style:dashed}
.sd-in-lux .sd-skel-b,.sd-in-lux .sd-skel-l{background:rgba(243,217,172,.14)}
.sd-in-lux .sd-strip.is-skel .sd-ring{background:rgba(243,217,172,.14)}
.sd-in-lux .sd-sc{--sc-k:#F2C99E;--sc-r:rgba(242,201,158,.62);--sc-l:rgba(242,201,158,.2);--sc-line:rgba(242,201,158,.9)}
.sd-in-lux:has(~ #pcNow:not([hidden])) .sd-sep,
.sd-in-lux:has(~ #pcNow:not([hidden])) .sd-s-t,
.sd-in-lux:has(~ #pcNow:not([hidden])) .sd-s-n,
.sd-in-lux:has(~ #pcNow:not([hidden])) .sd-sc{display:none}
/* «Задания песни →» на итоге «Сегодня» (04.10.2026): отдельной строкой над кнопками. */
.sd-songtasks{width:100%;margin:0 0 8px}