/* ============================================================
   ОТЗВУК — Акустическая топология
   Направление «Прибор» (design_handoff_otzvuk_pribor, 2026-07-27):
   слушание подано как точный, тихий метод — журнал наблюдения, а не
   приложение и не игра.

   ЧЕТЫРЕ ПРАВИЛА, ИЗ КОТОРЫХ СЛЕДУЕТ ВСЁ ОСТАЛЬНОЕ:
     1. Только тёмная плоскость. Светлых тем нет.
     2. Плоскость, а не глубина. Ни стекла, ни размытий, ни теней
        «для объёма», ни крупных градиентов, ни кнопок-таблеток.
        Иерархию держат размер, вес шрифта и воздух.
     3. Линия, а не коробка. Разделяет волосяная линия 1px --hair,
        а не заливка и не рамка-бокс. Панель — это область, а не
        объект.
     4. Управление как текст. Кнопка — слово с подчёркиванием или в
        тонкой рамке-мишени; состояние передаётся весом линии, а не
        заливкой.

   ember / steel / gold — СЕМАНТИКА, а не палитра акцентов: родство
   между записями. Два измерения (звуковой тон и восприятие) плюс их
   пересечение — точные значения у объявления токенов ниже. Четвёртого
   акцента не бывает, перекрашивать нельзя.

   Мороз и перчатки: любая цель для пальца >= 46px, ключевые — 56–58px.
   ============================================================ */

:root{
  /* ---------- палитра направления «Прибор» ---------- */
  /* РОДСТВО МЕЖДУ СЛЕДАМИ — два измерения, а не три.
     Имена взяты из кода (buildAdjacency в app.js), а не из рабочего
     чтения дизайнера: в handoff они названы «звук / место / время»,
     и это неверно. Ни координаты места, ни дата в родство не входят —
     дата влияет только на патину. */
  --ember:#cf6a4d;   /* совпал ЗВУКОВОЙ ТОН: частота, <= 0.18 октавы */
  --steel:#9bb6bd;   /* совпало ВОСПРИЯТИЕ: близость на круге ISO <= 0.45;
                        он же — активное, «живое» состояние */
  --gold:#bd9e6c;    /* совпало И ТО И ДРУГОЕ — пересечение первых двух,
                        а не третий вид родства; оттого и ярче */

  --bg:#0c0c0e;        /* фон экрана */
  --bg-alt:#141416;    /* фон холста/страницы */
  --bg-modal:#080809;  /* фон модального экрана */

  --paper:#e8e6e1;                      /* основной текст, «бумага» */
  --dim:rgba(232,230,225,0.56);         /* вторичный текст */
  --faint:rgba(232,230,225,0.34);       /* мета, третичный */
  --hair:rgba(232,230,225,0.13);        /* волосяная линия-разделитель */
  --hair-soft:rgba(232,230,225,0.06);   /* вложенные разделители */

  /* ---------- прежние имена токенов ----------
     Не удалены намеренно: на них написана вся существующая таблица
     стилей и правило проекта «новые стили пишутся на токенах». Здесь
     они перенаправлены на новую палитру — поэтому язык подхватывается
     всем файлом сразу, без правки каждого правила по отдельности. */
  --void:var(--bg); --void-2:var(--bg); --char:var(--bg-alt);
  --panel:transparent; --panel-2:transparent;   /* панель — область, не объект */
  --ink:var(--paper); --ink-dim:var(--dim); --mut:var(--dim);
  --faintest:rgba(232,230,225,0.22);
  --ember-soft:var(--ember); --steel-dim:rgba(155,182,189,0.5);
  --line:var(--hair); --line-2:var(--hair-soft);
  --grid:var(--hair-soft);

  /* Глубины больше нет: тени и «поднятия» обнулены в одном месте,
     чтобы ни одно старое правило не вернуло объём случайно. */
  --shadow:none; --elev:none;

  /* Скругления: корпус и экран — только у макета телефона в референсе,
     в вебе их нет. Контент-контролы НЕ скругляются вовсе; 6px оставлен
     мишеням и панели куратора. */
  --r-sm:0px; --r-md:0px; --r-lg:0px; --r-target:6px;

  --ease:cubic-bezier(.4,0,.2,1); --ease-out:cubic-bezier(.4,0,.2,1);
  --space:clamp(1rem,3vw,1.4rem);
  --sb:env(safe-area-inset-bottom,0px); --st:env(safe-area-inset-top,0px);

  /* Шаг сетки 8px и цель для пальца — из брифа, не из вкуса. */
  --grid-step:8px; --touch:46px; --touch-key:56px;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{height:100%;}
body{
  /* Ровная плоскость. Прежние два радиальных градиента убраны: это и
     есть «имитация материала», запрещённая направлением. */
  background:var(--bg);
  color:var(--paper);
  font-family:'IBM Plex Sans',system-ui,sans-serif; line-height:1.5;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; overflow:hidden; user-select:none;
}
/* Смысловые заголовки-жесты и человеческий голос — только здесь. */
.serif{font-family:'Source Serif 4',Georgia,serif;font-feature-settings:"kern";letter-spacing:-0.012em;}
/* Мета, координаты, ID, лейблы, значения — отдельный регистр. */
.mono{font-family:'IBM Plex Mono',ui-monospace,monospace;}

/* Виньетка и плёночное зерно СНЯТЫ.
   Зерно — прямой «красный флаг» брифа: шум-текстура как дешёвая цитата
   современного искусства вместо него самого. Виньетка — имитация
   глубины. Оба псевдоэлемента оставлены пустыми, чтобы не ловить
   сюрпризы от старых правил, которые на них опирались. */
body::after,body::before{content:none;}

button{font-family:inherit;color:inherit;cursor:pointer;border:none;background:none;}
input,textarea{font-family:inherit;}
:focus-visible{outline:1.5px solid var(--ember);outline-offset:3px;}
::-webkit-scrollbar{width:5px;height:5px;}::-webkit-scrollbar-thumb{background:var(--faint);border-radius:4px;}
::selection{background:rgba(226,97,58,0.3);}

/* фоновые холсты */
#layer-3d{position:fixed;inset:0;z-index:1;transition:filter 1.4s ease,opacity 1.4s ease;}
/* Скульптура за интерфейсом приглушается, но НЕ размывается:
   размытие — имитация глубины, запрещённая направлением.
   Оставлены только яркость и насыщенность. */
#layer-3d.blur{filter:brightness(0.32) saturate(0.7);opacity:0.6;}
#layer-2d{position:fixed;inset:0;z-index:2;pointer-events:none;}
#ui-root{position:fixed;inset:0;z-index:10;display:flex;flex-direction:column;height:100dvh;pointer-events:none;}
.interactive{pointer-events:auto;}

/* стекло-панель */
.glass{background:var(--panel);border:1px solid var(--line);border-radius:18px;}

/* кнопки */
.btn-primary{background:var(--ink);color:var(--void);padding:1.05rem 1.8rem;font-weight:600;font-size:0.8rem;letter-spacing:0.05em;text-transform:uppercase;border-radius:var(--r-md);width:100%;text-align:center;transition:transform .2s var(--ease),box-shadow .3s var(--ease),opacity .2s;}
.btn-primary:hover{transform:translateY(-2px);}
.btn-primary:active{transform:translateY(0);}
.btn-primary:disabled{opacity:0.35;pointer-events:none;}
.btn-ember{background:none;color:var(--paper);border:1px solid var(--paper);}
.btn-ember:hover{}
.btn-secondary{background:rgba(241,236,226,0.055);border:1px solid transparent;color:var(--ink);padding:1.05rem 1.8rem;font-weight:500;font-size:0.78rem;letter-spacing:0.05em;text-transform:uppercase;border-radius:var(--r-md);width:100%;text-align:center;transition:all .22s var(--ease);}
.btn-secondary:hover{background:rgba(236,230,218,0.06);border-color:var(--ink);}
.btn-secondary:disabled{opacity:0.35;pointer-events:none;}
.btn-warn{background:transparent;border:1px solid rgba(226,97,58,0.45);color:var(--ember-soft);padding:0.7rem 1.2rem;font-size:0.66rem;letter-spacing:0.08em;text-transform:uppercase;border-radius:10px;width:100%;transition:all .22s;}
.btn-warn:hover{background:var(--ember);color:#180c07;border-color:var(--ember);}

.inp{width:100%;background:rgba(0,0,0,0.35);border:1px solid var(--line);border-radius:12px;color:var(--ink);font-family:'IBM Plex Mono',monospace;font-size:0.86rem;padding:0.9rem 1rem;letter-spacing:0.04em;outline:none;transition:border-color .25s;}
.inp:focus{border-color:var(--ember);}
.inp::placeholder{color:var(--faint);letter-spacing:0.1em;}

/* теги опросника */
.tag{display:inline-block;padding:0.5rem 0.75rem;border:1px solid var(--line);border-radius:9px;font-size:0.7rem;letter-spacing:0.01em;cursor:pointer;transition:all .16s;color:var(--mut);background:rgba(0,0,0,0.25);}
.tag:hover{border-color:var(--ink-dim);color:var(--ink);transform:translateY(-1px);}
.tag.active{border-color:var(--ember);color:#180c07;background:var(--ember);font-weight:600;}

.eyebrow{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.58rem;letter-spacing:0.28em;text-transform:uppercase;color:var(--ember);}
.label-xs{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:clamp(0.58rem,1.6vw,0.64rem);letter-spacing:0.14em;text-transform:uppercase;color:var(--faint);}

/* навигация */
nav{position:fixed;top:0;left:0;width:100%;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:calc(1.1rem + var(--st)) 1.6rem 1rem;background:var(--bg);border-bottom:1px solid var(--hair);}
.brand{display:flex;align-items:baseline;gap:0.6rem;cursor:pointer;}
.brand .bn{font-family:'Source Serif 4';font-weight:600;font-size:1.22rem;letter-spacing:0.01em;}
.brand .bx{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.5rem;letter-spacing:0.24em;text-transform:uppercase;color:var(--faint);}
.nav-links{display:flex;gap:1.1rem;align-items:center;}
.nav-btn{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.62rem;font-weight:500;letter-spacing:0.12em;color:var(--mut);text-transform:uppercase;transition:color .25s;position:relative;padding:0.2rem 0;}
.nav-btn:hover{color:var(--ink);}
.nav-btn.active{color:var(--ember-soft);}
.nav-btn.active::after{content:"";position:absolute;bottom:-3px;left:0;width:100%;height:1px;background:var(--ember);}
.role-chip{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.5rem;letter-spacing:0.14em;text-transform:uppercase;color:var(--faint);border:1px solid var(--line);border-radius:6px;padding:3px 7px;}

/* системный бейдж */
.sys-badge{position:fixed;top:calc(4.6rem + var(--st));right:1.6rem;font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.56rem;letter-spacing:0.08em;color:var(--faint);display:flex;align-items:center;gap:8px;z-index:40;pointer-events:none;}
.ping{width:6px;height:6px;border-radius:50%;background:var(--faint);transition:all .5s;}
.ping.active{background:var(--ember);}

/* скролл-контainer экранов — страница не прокручивается, контент вписывается в viewport */
.screen-scroll{position:absolute;inset:0;overflow:hidden;overscroll-behavior:none;padding:calc(3.4rem + var(--st)) 1.2rem calc(1rem + var(--sb));display:flex;flex-direction:column;align-items:center;justify-content:safe center;max-height:100dvh;}
.screen-panel{width:100%;max-width:560px;flex:0 1 auto;min-height:0;max-height:100%;transform-origin:center center;}
.screen-fit{justify-content:safe center;}
.screen-fit>*{flex:0 0 auto;}
.screen-panel-cur{max-width:460px;display:flex;flex-direction:column;max-height:calc(100dvh - 4.2rem - var(--st) - var(--sb));}
.cur-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;}
body.screen-curator .screen-scroll{justify-content:flex-start;padding-top:calc(3rem + var(--st));}
body.screen-agent .screen-scroll,
body.screen-auth .screen-scroll,
body.screen-receipt .screen-scroll{justify-content:flex-start;align-items:stretch;}
body.screen-agent .screen-fit>*,
body.screen-auth .screen-fit>*,
body.screen-receipt .screen-fit>*{flex:1 1 auto;min-height:0;width:100%;max-width:560px;margin-left:auto;margin-right:auto;}
.wz-panel{
  display:flex;flex-direction:column;min-height:0;height:100%;max-height:100%;
  width:100%;max-width:520px;margin:0 auto;
}
.wz-panel > .wz-head,
.wz-panel > .wz-prog,
.wz-panel > .consent-card,
.wz-panel > .wz-foot{flex:0 0 auto;}
.wz-body{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;overflow:hidden;}
.wz-foot{padding-top:0.55rem;}
.wz-foot .btn-primary,
.wz-foot .btn-secondary{width:100%;}
.fade-in{animation:fadeUp .6s var(--ease-out);}
@keyframes fadeUp{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:none;}}
.stagger > *{opacity:0;animation:fadeUp .7s cubic-bezier(.2,.8,.2,1) forwards;}
.stagger > *:nth-child(1){animation-delay:.05s;}
.stagger > *:nth-child(2){animation-delay:.16s;}
.stagger > *:nth-child(3){animation-delay:.27s;}
.stagger > *:nth-child(4){animation-delay:.38s;}
.stagger > *:nth-child(5){animation-delay:.49s;}
.stagger > *:nth-child(6){animation-delay:.6s;}

/* AUTH */
#auth-wrap{max-width:600px;text-align:center;}
#auth-wrap h1{font-family:'Source Serif 4';font-weight:600;font-size:clamp(2.4rem,10vw,4.6rem);line-height:0.92;letter-spacing:-0.038em;margin:6px 0 6px;}
#auth-wrap .sub{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.6rem;letter-spacing:0.3em;text-transform:uppercase;color:var(--mut);margin-bottom:18px;}
#auth-wrap .desc{font-size:clamp(0.88rem,2.6vw,1rem);color:var(--ink-dim);max-width:42ch;margin:0 auto 1rem;font-weight:300;line-height:1.6;}
.gate{max-width:320px;margin:0 auto;}
.gate-div{max-width:320px;margin:18px auto 0;border-top:1px solid var(--line);padding-top:16px;}
.auth-privacy{
  display:flex;justify-content:center;align-items:center;
  width:100%;max-width:100%;margin:0.5rem auto 1.35rem;
  padding:0;text-align:center;align-self:center;flex:0 0 auto;
}
.auth-privacy-link{
  display:inline-flex;align-items:center;justify-content:center;gap:0.45rem;
  margin:0 auto;text-align:center;color:var(--ink-dim);
  font-size:clamp(0.68rem,3.2vw,0.88rem);font-weight:400;
  max-width:none;white-space:nowrap;line-height:1.3;
}
.auth-privacy-link span{text-align:center;}
.auth-privacy-link:hover{color:var(--ink);}
#auth-wrap h1 .em{font-style:italic;color:var(--ember);}

/* WIZARD */
.wz-head{text-align:center;margin-bottom:2px;flex:0 0 auto;}
.wz-step{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.58rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--ember);}
.wz-title{font-family:'Source Serif 4';font-weight:600;font-size:clamp(1.35rem,4.8vw,2.05rem);line-height:1.05;letter-spacing:-0.01em;margin:2px 0 0;}
.wz-sub{font-size:0.86rem;color:var(--mut);margin-bottom:14px;text-align:center;}
.wz-prog{display:flex;gap:6px;justify-content:center;margin-bottom:0.45rem;flex:0 0 auto;}
.wz-prog i{width:34px;height:2px;border-radius:2px;background:var(--line);transition:all .4s;}
.wz-prog i.on{background:var(--ember);width:44px;}
.q-block{margin-bottom:22px;}
.q-title{display:block;font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.6rem;letter-spacing:0.06em;text-transform:uppercase;color:var(--ink-dim);margin-bottom:9px;}
.q-opts{display:flex;flex-wrap:wrap;gap:7px;}

/* запись */
.rec-orb{position:relative;width:160px;height:160px;display:flex;align-items:center;justify-content:center;margin:0 auto;}
.rec-orb .ring{position:absolute;border-radius:50%;border:1px solid var(--line);inset:0;}
.rec-orb .ring.r2{inset:-16px;border-color:var(--line-2);}
.rec-orb.on .ring{border-color:var(--ember);animation:ripple 1.6s ease-out infinite;}
.rec-orb.on .ring.r2{animation:ripple 1.6s ease-out infinite .5s;}
@keyframes ripple{0%{transform:scale(0.92);opacity:.7;}100%{transform:scale(1.3);opacity:0;}}
.rec-core{width:122px;height:122px;border-radius:50%;border:1.5px solid var(--ember);background:none;color:var(--ink);font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.62rem;letter-spacing:0.08em;display:flex;align-items:center;justify-content:center;text-align:center;line-height:1.5;transition:all .25s;z-index:2;}
.rec-core.on{background:var(--ember);color:#180c07;font-weight:600;}
.prog-track{width:100%;max-width:300px;height:3px;background:var(--line);border-radius:99px;overflow:hidden;margin:0 auto;}
.prog-fill{height:100%;width:0%;background:var(--steel);transition:width .1s linear;}
.rec-time{font-family:'Source Serif 4';font-size:2.2rem;text-align:center;}

/* артефакт-квитанция */
.art-thumb{width:100%;aspect-ratio:3/4;background:#000;border-radius:16px;border:1px solid var(--line);overflow:hidden;}
.art-thumb img,.art-thumb canvas{width:100%;height:100%;object-fit:cover;display:block;}
.receipt{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.72rem;letter-spacing:0.03em;}
.receipt .k{color:var(--faint);font-size:0.54rem;letter-spacing:0.12em;text-transform:uppercase;}
.receipt .v{color:var(--ink);font-size:1.4rem;font-family:'Source Serif 4';}
.coord-mini{width:120px;height:120px;flex:none;}

/* ПОТОК */
#ether-card{max-width:440px;width:100%;text-align:center;}
.ether-stat{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.6rem;letter-spacing:0.34em;text-transform:uppercase;color:var(--mut);margin-bottom:28px;}
.now-line{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.64rem;color:var(--ink-dim);margin-top:18px;min-height:1.2em;}
.now-line .dot{color:var(--ember);}
.ether-hint{font-size:0.74rem;color:var(--faint);margin-top:18px;font-style:italic;}

/* панель узла (архив) */
#node-panel{position:fixed;bottom:1.4rem;right:1.4rem;width:300px;max-width:calc(100vw - 2rem);z-index:30;padding:1.4rem;transform:translateY(16px);opacity:0;transition:all .3s;display:none;}
#node-panel.on{transform:translateY(0);opacity:1;display:block;}
#node-panel h3{font-family:'Source Serif 4';font-size:1.05rem;border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:12px;word-break:break-word;}
.np-dsp{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.66rem;display:flex;justify-content:space-between;background:rgba(0,0,0,0.4);border-radius:9px;padding:0.7rem 0.9rem;margin-bottom:14px;color:var(--ink-dim);}
.archive-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:10;pointer-events:none;}

/* КУРАТОР */
.cur-sec{margin-bottom:18px;}
.cur-sec h4{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.6rem;letter-spacing:0.12em;text-transform:uppercase;border-bottom:1px solid var(--line);padding-bottom:9px;margin-bottom:16px;color:var(--ink-dim);}
.cur-sec h4.ember{color:var(--ember-soft);} .cur-sec h4.steel{color:var(--steel);} .cur-sec h4.gold{color:var(--gold);}
.preset-btn{font-size:0.58rem;padding:0.38rem 0.72rem;border-radius:0;border:1px solid var(--line);background:rgba(8,8,10,0.55);color:var(--mut);cursor:pointer;}
.preset-btn.on{border-color:rgba(179,150,104,0.55);color:var(--ink);background:rgba(179,150,104,0.14);}
.cur-presets{display:flex;flex-wrap:wrap;gap:8px;}
.cur-preset{font-size:0.66rem;padding:0.55rem 0.85rem;}
.ctl-row{margin-bottom:14px;}
.ctl-row .top{display:flex;justify-content:space-between;align-items:baseline;font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.62rem;color:var(--mut);margin-bottom:7px;}
.ctl-row .top .val{color:var(--ink);}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:2px;background:var(--line);border-radius:2px;outline:none;}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:15px;height:15px;border-radius:50%;background:var(--ember);cursor:pointer;border:3px solid var(--void);transition:transform .15s var(--ease);}
input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2);}
input[type=range]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--ember);border:3px solid var(--void);cursor:pointer;}
.eq-bank{display:flex;justify-content:space-between;gap:6px;align-items:end;}
.eq-band{display:flex;flex-direction:column;align-items:center;gap:8px;flex:1;}
.eq-band input{-webkit-appearance:slider-vertical;writing-mode:vertical-lr;direction:rtl;width:22px;height:96px;}
.eq-band .lab{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.5rem;color:var(--faint);}

/* тост */
#sys-toast{position:fixed;left:50%;bottom:calc(1.8rem + var(--sb));transform:translateX(-50%) translateY(22px);z-index:9000;background:rgba(30,30,35,0.9);color:var(--ink);border:1px solid var(--line);padding:0.85rem 1.3rem;border-radius:0.95rem;font-size:0.78rem;opacity:0;transition:all .34s var(--ease);pointer-events:none;max-width:90vw;text-align:center;}
#sys-toast.show{opacity:1;transform:translateX(-50%);}
.spin{display:inline-block;width:13px;height:13px;border:2px solid rgba(24,12,7,0.3);border-top-color:#180c07;border-radius:50%;animation:rot .7s linear infinite;vertical-align:-2px;}
@keyframes rot{to{transform:rotate(360deg);}}

@media(max-width:600px){
  /* меньше «воздуха» сверху — навбар тоньше, экран начинается выше */
  nav{padding:calc(0.75rem + var(--st)) 1.1rem 0.7rem;}
  .nav-links{gap:0.7rem;}
  .nav-btn{font-size:0.56rem;}
  .sys-badge{display:none;}                 /* декоративный статус — прячем, чтобы не теснить экран */
  .screen-scroll{padding:calc(2.85rem + var(--st)) 0.85rem calc(0.7rem + var(--sb));}
  /* круг восприятия не выше доступной высоты — шаг помещается без прокрутки */
  #iso-pad{max-width:min(340px,46dvh);max-height:min(340px,46dvh);}
  .wz-head{margin-bottom:0;}
  .wz-title{font-size:clamp(1.28rem,6.2vw,1.75rem);}
  .wz-sub{margin-bottom:8px;}
  .wz-prog{margin-bottom:0.35rem;}
  .wz-card{padding:0.7rem 0.75rem 0.65rem;}
  .wz-hint{font-size:0.76rem;} .wz-note{font-size:0.64rem;margin-bottom:.5rem;}
  .iso-read #iso-words{font-size:0.9rem;}
  /* запись компактнее */
  .rec-orb{width:108px;height:108px;}
  .rec-core{width:86px;height:86px;font-size:0.72rem;}
  .rec-time{font-size:1.45rem;}
  .consent-card{padding:0.7rem 0.75rem 0.65rem;margin-bottom:0.4rem;}
  .consent-title{font-size:0.95rem;}
  .consent-text{font-size:0.66rem;line-height:1.35;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;}
  .consent-policy{margin-left:30px;margin-top:0.4rem;}
  /* узловая панель и легенда */
  #node-panel{left:0.8rem;right:0.8rem;width:auto;bottom:calc(5.5rem + var(--sb));max-height:46dvh;overflow-y:auto;}
  /* кнопки чуть ниже — плотнее на телефоне */
  .btn-primary,.btn-secondary{padding:0.78rem 1.2rem;}
  .capture-tabs{margin-bottom:0;}
  .capture-card{padding:0.7rem 0.75rem;}
  .capture-card textarea.inp{min-height:2.2rem;max-height:3.4rem;}
}
@media(max-width:600px) and (max-height:760px){
  /* короткий телефон: шаг 2 ещё плотнее */
  .capture-card textarea.inp{min-height:2rem;max-height:2.8rem;}
  .rec-orb{width:92px;height:92px;}
  .rec-core{width:74px;height:74px;font-size:0.66rem;}
  .rec-time{font-size:1.25rem;}
  .consent-text{-webkit-line-clamp:3;}
  .consent-title{font-size:0.9rem;}
  .wz-card{padding:0.55rem 0.65rem;}
  #iso-pad{max-width:min(280px,40dvh);max-height:min(280px,40dvh);}
}
@media(max-height:740px){
  #auth-wrap h1{font-size:clamp(2rem,9vw,3.4rem);}
  #auth-wrap .desc{margin-bottom:12px;}
  .gate-div{margin-top:12px;padding-top:12px;}
  .wz-card{padding:0.65rem 0.75rem;}
  #iso-pad{max-width:min(300px,42dvh);max-height:min(300px,42dvh);}
  .rec-orb{width:100px;height:100px;}
  .rec-core{width:80px;height:80px;font-size:0.68rem;}
  .rec-time{font-size:1.35rem;}
  .receipt-title{font-size:1.45rem;margin-bottom:0.75rem;}
  .rc-memory{margin-bottom:1rem;}
  .consent-card{padding:0.6rem 0.7rem;}
}
@media(max-height:640px){
  #iso-pad{max-width:min(220px,34dvh);max-height:min(220px,34dvh);}
  .legend-wrap{top:calc(8.4rem + var(--st));left:0.75rem;bottom:auto;max-width:calc(100vw - 1.5rem);}
  .stream-guide{bottom:calc(8.4rem + var(--sb));}
  .stream-meta{top:calc(4.85rem + var(--st));max-width:calc(100% - 1rem);padding:6px 11px;}
  .consent-text{-webkit-line-clamp:2;}
  .wz-title{font-size:clamp(1.15rem,5vw,1.45rem);}
  .rec-orb{width:78px;height:78px;}
  .rec-core{width:64px;height:64px;font-size:0.58rem;}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition-duration:.01ms!important;}}

/* ---------- ISO 12913 шкалы ---------- */
.iso-attr{margin-bottom:16px;}
.iso-attr .top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:7px;}
.iso-attr .nm{font-family:'Source Serif 4';font-size:1.08rem;font-weight:500;}
.iso-attr .ax{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.5rem;letter-spacing:0.06em;padding:2px 6px;border-radius:5px;text-transform:uppercase;margin-left:8px;vertical-align:middle;}
.ax.p{color:var(--ember);border:1px solid rgba(226,97,58,.4);} .ax.e{color:var(--steel);border:1px solid rgba(111,179,196,.4);}
.iso-scale{display:flex;gap:6px;}
.iso-scale button{flex:1;height:44px;border:1px solid var(--line);border-radius:10px;font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.82rem;color:var(--mut);transition:all .15s;}
.iso-scale button:hover{border-color:var(--ink);color:var(--ink);transform:translateY(-1px);}
.iso-scale button[aria-pressed="true"]{background:var(--ember);border-color:var(--ember);color:#180c07;font-weight:700;}
.iso-ends{display:flex;justify-content:space-between;font-size:0.6rem;color:var(--faintest);margin-top:4px;font-family:'IBM Plex Mono',ui-monospace,monospace;letter-spacing:0.04em;}
.iso-mini-row{display:flex;align-items:center;gap:16px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-top:8px;}
.iso-mini-row canvas{width:92px;height:92px;flex:none;}
.iso-mini-row .rd{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.72rem;color:var(--mut);line-height:1.7;}
.iso-mini-row .rd b{color:var(--ember);} .iso-mini-row .rd i{color:var(--steel);font-style:normal;}

/* ---------- захват: запись + загрузка ---------- */
.capture-tabs{display:flex;gap:8px;margin-bottom:1.4rem;}
.cap-tab{flex:1;padding:0.7rem;border:1px solid var(--line);border-radius:10px;font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.62rem;letter-spacing:0.06em;text-transform:uppercase;color:var(--mut);transition:all .18s;}
.cap-tab.on{border-color:var(--ember);color:var(--ember-soft);background:rgba(226,97,58,0.06);}
input[type=file]{display:none;}
.upload-drop{border:1px dashed var(--line);border-radius:14px;padding:2rem 1rem;text-align:center;cursor:pointer;transition:all .2s;}
.upload-drop:hover{border-color:var(--steel);background:rgba(111,179,196,0.05);}
.upload-drop .ic{font-size:1.6rem;color:var(--steel);}
.upload-drop .t{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.7rem;letter-spacing:0.06em;color:var(--ink-dim);margin-top:8px;}
.upload-drop .s{font-size:0.64rem;color:var(--faint);margin-top:4px;}

/* ---------- ПОТОК: поле дрейфа ---------- */
#ether-field{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair;}
.ether-overlay{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:center;gap:8px;padding:0 12px calc(0.85rem + var(--sb));pointer-events:none;}
.ether-overlay .now-line{margin:0;min-height:0;}
.stream-stage{position:absolute;inset:0;pointer-events:none;overflow:hidden;}
.audio-unlock-overlay{
  position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;
  padding:1.5rem calc(1rem + var(--sb));background:rgba(6,6,8,0.72);
  pointer-events:auto;cursor:pointer;
}
.audio-unlock-inner{
  max-width:22rem;width:100%;padding:2rem 1.6rem;text-align:center;border-radius:1.2rem;
}
.audio-unlock-icon{display:inline-flex;align-items:center;justify-content:center;width:3.4rem;height:3.4rem;border-radius:50%;background:rgba(220,144,120,0.16);color:var(--ember-soft);margin-bottom:1rem;}
.audio-unlock-inner .serif{font-size:1.35rem;color:var(--ink);margin:0 0 0.5rem;}
.audio-unlock-sub{font-family:'IBM Plex Mono',monospace;font-size:0.68rem;letter-spacing:0.04em;color:var(--faint);margin:0;line-height:1.5;}
.ether-bar{pointer-events:auto;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;align-items:center;max-width:100%;background:rgba(16,16,20,0.58);border:1px solid var(--line);border-radius:1.35rem;padding:9px;}
.ether-ctl{height:46px;border-radius:11px;border:1px solid var(--line);padding:0 18px;font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.64rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--ink);transition:all .18s;display:flex;align-items:center;gap:7px;flex:0 0 auto;}
.ether-ctl span{white-space:nowrap;}
.ether-ctl:hover{border-color:var(--ink);}
.ether-ctl.on{background:rgba(226,97,58,0.16);border-color:var(--ember);color:var(--ember-soft);}
.ether-ctl.play{background:var(--ink);color:var(--void);border:none;}
.ether-ctl.play.on{background:var(--ember);color:#180c07;}
.ether-ctl:disabled{opacity:0.35;pointer-events:none;}
.ether-hint-f{pointer-events:none;position:absolute;top:calc(5rem + var(--st));left:0;right:0;text-align:center;font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.6rem;letter-spacing:0.06em;color:var(--faint);padding:0 1rem;}

/* ---------- описание ноды ---------- */
.np-desc{font-size:0.82rem;color:var(--ink-dim);margin-bottom:12px;font-style:italic;line-height:1.45;}
.stream-meta{
  position:fixed;top:calc(5.35rem + var(--st));left:50%;transform:translateX(-50%);
  z-index:48;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
  gap:6px 12px;padding:7px 14px;max-width:min(calc(100% - 1.4rem),680px);
  background:rgba(10,10,12,0.92);border:1px solid rgba(241,236,226,0.08);
  border-radius:99px;pointer-events:auto;
  transition:opacity .35s ease,visibility .35s ease;
}
.stream-count{
  font-family:'IBM Plex Mono',monospace;font-size:clamp(0.58rem,1.6vw,0.66rem);
  color:var(--mut);font-style:italic;letter-spacing:0.03em;white-space:nowrap;
}
.stream-guide{
  position:fixed;left:50%;transform:translateX(-50%);
  bottom:calc(5.6rem + var(--sb));z-index:24;
  max-width:min(94vw,540px);text-align:center;pointer-events:none;
  transition:opacity .35s ease,visibility .35s ease;
}
.stream-guide span{
  display:inline-block;padding:5px 12px;
  font-family:'IBM Plex Mono',monospace;font-size:clamp(0.56rem,1.5vw,0.64rem);
  letter-spacing:0.04em;color:var(--faint);line-height:1.35;
  background:rgba(8,8,10,0.78);border:1px solid rgba(241,236,226,0.05);border-radius:99px;
}
.coord-line{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.72rem;color:var(--mut);margin-bottom:1rem;}
.coord-line b{color:var(--ember);} .coord-line i{color:var(--steel);font-style:normal;}

/* ---------- устойчивость вёрстки к длинному тексту ---------- */
.nav-links{flex-wrap:wrap;justify-content:flex-end;max-width:70vw;}
.brand{min-width:0;flex-shrink:0;}
.btn-primary,.btn-secondary,.btn-ember,.btn-warn,.ether-ctl,.cap-tab,.nav-btn{white-space:normal;height:auto;line-height:1.3;overflow-wrap:break-word;word-break:normal;hyphens:none;}
.cap-tab span,.nav-btn span{overflow-wrap:break-word;word-break:normal;}
.btn-primary,.btn-secondary{min-height:46px;}
.ether-ctl{min-height:46px;}
.modal{scrollbar-gutter:stable;}
.iso-read{min-height:48px;}
#auth-wrap h1{overflow-wrap:anywhere;}
#auth-wrap .sub,#auth-wrap .desc,.eyebrow,.wz-title,.wz-sub,.fstep .lead,.ether-hint-f,.now-line,.np-desc,#np-id,.legend span,.metric .v,.receipt .v,.coord-line{overflow-wrap:anywhere;word-break:break-word;}
.now-line{max-width:92vw;}
.metric{min-width:0;}
.metric .v,.receipt .v{font-size:clamp(1rem,4vw,1.7rem);}
.legend-wrap{max-width:min(320px,48vw);}
.eq-band .lab{white-space:nowrap;}

/* поля редактирования текстов (куратор) */
.tx-field{margin-bottom:12px;}
.tx-field label{display:block;font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.54rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--faint);margin-bottom:5px;}
.tx-field .inp{font-size:0.8rem;}
.tx-group{margin-bottom:8px;}
.tx-group > .tx-head{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.58rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--ember-soft);margin:16px 0 10px;padding-bottom:6px;border-bottom:1px solid var(--line);}

/* ---------- согласие и политика (персональные данные) ---------- */
.consent-card{
  flex:0 0 auto;
  margin:0 0 0.55rem;
  padding:0.85rem 0.95rem 0.75rem;
  border:1px solid rgba(196,102,74,0.42);
  border-radius:14px;
  background:none;
}
.consent-card.is-on{
  border-color:rgba(196,102,74,0.55);
  background:none;
}
.consent-kicker{
  font-family:'IBM Plex Mono',monospace;
  font-size:0.52rem;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--ember-soft);
  margin-bottom:0.45rem;
}
.consent-row{display:flex;gap:11px;align-items:flex-start;font-size:0.8rem;color:var(--ink-dim);line-height:1.45;margin-bottom:0;cursor:pointer;overflow-wrap:anywhere;}
.consent-row-hero{gap:12px;}
.consent-row input{margin-top:3px;width:20px;height:20px;accent-color:var(--ember);flex:none;cursor:pointer;}
.consent-copy{display:flex;flex-direction:column;gap:0.28rem;min-width:0;}
.consent-title{font-size:1.02rem;font-weight:500;color:var(--ink);line-height:1.2;letter-spacing:-0.01em;}
.consent-text{font-size:0.72rem;color:var(--ink-dim);line-height:1.4;}
.consent-policy{display:inline-flex;align-items:center;gap:6px;margin-top:0.55rem;margin-left:32px;}
.linkish-sm{background:none;border:none;color:var(--steel);font-size:0.7rem;letter-spacing:0.02em;border-bottom:1px dotted var(--steel-dim);padding-bottom:1px;}
.linkish-sm:hover{color:var(--ink);}
.glass.is-locked{opacity:0.42;filter:grayscale(0.35);pointer-events:none;transition:opacity .3s;}
.capture-body{gap:0.45rem;}
.capture-card{padding:0.85rem 0.9rem 0.8rem;text-align:center;display:flex;flex-direction:column;gap:0.55rem;min-height:0;flex:1 1 auto;overflow:hidden;}
.capture-card .inp{margin:0;text-align:center;}
.capture-card textarea.inp{text-align:left;height:auto;min-height:2.6rem;max-height:4.2rem;resize:none;}
.capture-tabs{margin-bottom:0;flex:0 0 auto;}
.rec-block{display:flex;flex-direction:column;align-items:center;gap:0.35rem;margin-top:0.15rem;flex:1 1 auto;min-height:0;justify-content:center;}
.rec-caption{font-size:0.64rem;color:var(--faint);margin:0;line-height:1.35;}
.rec-time{margin:0;font-size:clamp(1.35rem,4.5vw,1.85rem);}
.modal-backdrop{position:fixed;inset:0;z-index:200;background:rgba(4,4,7,0.62);display:flex;align-items:center;justify-content:center;padding:1.4rem;}
.modal{max-width:540px;width:100%;max-height:84vh;overflow-y:auto;padding:2rem 1.9rem 1.7rem;display:flex;flex-direction:column;}
.modal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:1rem;}
.modal-head h3{font-size:1.5rem;overflow-wrap:anywhere;}
.modal-body{font-size:0.86rem;color:var(--ink-dim);line-height:1.6;overflow-wrap:anywhere;white-space:pre-line;}
.org-contact{margin-top:1.1rem;padding:0.85rem 1rem;border:1px solid var(--line);border-radius:11px;background:rgba(236,230,218,0.04);font-size:0.8rem;color:var(--ink-dim);line-height:1.5;white-space:pre-line;overflow-wrap:anywhere;height:auto;}

/* ---------- PAQ-оценки ISO/TS 12913-3 ---------- */
.paq-form{display:flex;flex-direction:column;gap:11px;}
.paq-row{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.paq-name{font-family:'IBM Plex Sans',sans-serif;font-size:0.86rem;color:var(--ink-dim);flex:1;min-width:0;overflow-wrap:anywhere;}
.paq-scale{display:flex;gap:7px;flex:none;}
.paq-dot{width:22px;height:22px;border-radius:50%;border:1px solid var(--line);background:rgba(0,0,0,0.25);transition:all .15s;cursor:pointer;}
.paq-dot:hover{border-color:var(--ink-dim);transform:scale(1.12);}
.paq-dot.on{background:var(--ember);border-color:var(--ember);}
@media(max-width:420px){ .paq-dot{width:19px;height:19px;} .paq-name{font-size:0.8rem;} }

/* ---------- карточка узла: частотный образ ---------- */
.np-spec{width:100%;height:84px;border-radius:10px;border:1px solid var(--line);background:#000;margin-bottom:12px;display:block;}
.np-row{display:flex;justify-content:space-between;font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.62rem;color:var(--mut);margin-top:4px;}

/* ---------- читаемый результат круга восприятия ---------- */
.iso-read{margin-top:8px;text-align:center;display:flex;flex-direction:column;gap:2px;flex:0 0 auto;}
.wz-card{padding:0.85rem 0.95rem 0.75rem;margin-bottom:0;display:flex;flex-direction:column;min-height:0;flex:1 1 auto;overflow:hidden;}
.wz-card-iso{align-items:center;}
.wz-hint{font-size:0.84rem;color:var(--ink-dim);margin-bottom:.25rem;text-align:center;line-height:1.4;flex:0 0 auto;}
.wz-note{font-size:0.7rem;color:var(--faint);margin-bottom:.9rem;text-align:center;line-height:1.5;}
#iso-pad{width:100%;aspect-ratio:1/1;max-width:min(420px,52dvh);max-height:min(420px,52dvh);display:block;margin:0 auto;touch-action:none;cursor:crosshair;flex:0 1 auto;}
.iso-read #iso-words{font-family:'Source Serif 4',serif;font-size:1.02rem;color:var(--ink);}
.iso-read .iso-pe{font-family:'IBM Plex Mono',monospace;font-size:0.66rem;color:var(--mut);}
.iso-read .iso-pe b{color:var(--ember-soft);} .iso-read .iso-pe i{color:var(--steel);font-style:normal;}
.wz-help-link{text-align:center;margin-top:0.35rem;flex:0 0 auto;}

/* ---------- лаконичная карточка-след ---------- */
.receipt-wrap{max-width:440px;width:100%;text-align:center;display:flex;flex-direction:column;min-height:0;height:100%;justify-content:center;}
#auth-wrap.screen-panel{display:flex;flex-direction:column;justify-content:center;min-height:0;height:100%;}
.receipt-title{font-size:2.1rem;margin-bottom:1.6rem;letter-spacing:-0.02em;}
.art-thumb-big{margin:0 auto 0.85rem;width:100%;max-width:340px;border-radius:1.1rem;overflow:hidden;border:1px solid var(--line-2);background:#000;}
.art-thumb-big img{width:100%;display:block;}
.rc-download{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.6rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--steel);text-decoration:none;border-bottom:1px dotted var(--steel-dim);padding-bottom:1px;display:inline-block;margin-bottom:1.6rem;}
.rc-download:hover{color:var(--ink);}
.rc-memory{font-family:'Source Serif 4',serif;font-style:italic;font-size:1rem;line-height:1.55;color:var(--ink-dim);margin:0 auto 1.8rem;max-width:380px;overflow-wrap:anywhere;}
.rc-actions{display:flex;gap:12px;}
@media(max-width:520px){ .receipt-title{font-size:1.55rem;} .rc-memory{font-size:0.92rem;} }

/* ---------- видимое коллективное авторство в потоке ---------- */
.stream-meta,.stream-guide{overflow-wrap:anywhere;word-break:break-word;}

/* ---------- заметка слушателя и дата в карточке узла ---------- */
.np-note{font-family:'Source Serif 4',serif;font-style:italic;font-size:0.92rem;line-height:1.45;color:var(--ink-dim);margin:2px 0 12px;overflow-wrap:anywhere;}
.np-meta{font-family:'IBM Plex Mono',monospace;font-size:0.56rem;letter-spacing:0.04em;color:var(--faint);margin-top:8px;}

/* ---------- читаемость: крупнее мелкие подписи (десктоп и мобайл) ---------- */
.label-xs{font-size:0.62rem;}
.eyebrow{font-size:0.6rem;}
.ether-stat{font-size:0.64rem;}
.now-line{font-size:0.74rem;}
.ether-hint{font-size:0.8rem;}
.stream-guide{font-size:0.66rem;}
.receipt .k{font-size:0.6rem;}
.np-dsp{font-size:0.72rem;}
.np-row{font-size:0.68rem;}
.np-meta{font-size:0.62rem;}
.np-desc{font-size:0.86rem;}
.coord-line{font-size:0.78rem;}
.cap-tab{font-size:0.66rem;}
.q-title{font-size:0.66rem;}
.wz-sub{font-size:0.92rem;}
.wz-note{font-size:0.74rem;}
.tx-field label{font-size:0.6rem;}
.cur-sec h4{font-size:0.66rem;}
.ctl-row .top{font-size:0.66rem;}
.eq-band .lab{font-size:0.56rem;}
.nav-btn{font-size:0.66rem;}
.ether-ctl{font-size:0.68rem;}
.iso-read .iso-pe{font-size:0.72rem;}
.iso-ends{font-size:0.64rem;}
.rc-download{font-size:0.66rem;}
.upload-drop .t{font-size:0.74rem;} .upload-drop .s{font-size:0.7rem;}

@media(max-width:600px){
  /* на телефоне физический размер мал — держим подписи различимыми */
  .nav-btn{font-size:0.6rem;}
  .now-line{font-size:0.72rem;}
  .stream-guide,.ether-hint-f{font-size:0.64rem;}
  .ctl-row .top{font-size:0.64rem;}
  .wz-note{font-size:0.7rem;}
  .consent-row{font-size:0.8rem;}
  /* транспорт потока: компактнее, чтобы умещался в 2 ряда, а не тянулся столбиком */
  .ether-bar{gap:7px;padding:8px 9px;width:100%;max-width:420px;}
  .ether-ctl{flex:1 1 calc(50% - 4px);min-width:0;padding:0 10px;height:44px;font-size:0.6rem;letter-spacing:0.04em;justify-content:center;}
  .ether-ctl.play{flex-basis:calc(50% - 4px);}
}

/* ============================================================
   СЛОЙ СОВРЕМЕННОСТИ — глубина, типографика, микровзаимодействия
   (поверх строгой основы; идентичность и палитра не меняются)
   ============================================================ */
/* типографика: увереннее заголовки, спокойнее набор */
#auth-wrap h1,.wz-title{letter-spacing:-0.035em;text-wrap:balance;}
#auth-wrap .desc,.wz-sub,.ether-hint,.now-line,.np-desc{text-wrap:pretty;}
#auth-wrap .desc{font-size:clamp(0.86rem,2.4vw,1rem);line-height:1.6;font-weight:300;max-width:38ch;}

/* стекло-панель: мягкая многослойная глубина + верхний световой кант + лёгкий градиент */
.glass{border:1px solid var(--hair);border-radius:0;background:var(--bg);}

/* единая кривая перехода для интерактивных элементов */
.btn-primary,.btn-secondary,.btn-ember,.btn-warn,.tag,.nav-btn,.inp,.ether-ctl,.cap-tab,.rec-core{transition-timing-function:var(--ease);}

/* мягкое янтарное свечение фокуса на полях ввода */
.inp:focus{border-color:var(--ember);}

/* активная навигация — мягкое свечение подчёркивания */
.nav-btn.active::after{}

/* прогресс записи и орб — мягкое свечение */
.prog-fill{}
.rec-core.on{}

/* тонкий подъём фокусных карточек при наведении (где есть мышь) */
@media(hover:hover){
  #ether-card,#node-panel{transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out);}
}

@media(prefers-reduced-motion:reduce){
  body::before{display:none;}
}

/* ============================================================
   ПЛАТФОРМА — каталожно-инструментальный слой
   Усиливает строгую основу: типографика, система меток,
   регистрационные засечки, точный транспорт. Палитра и
   концепция не меняются.
   ============================================================ */
:root{ --r-sm:10px; --r-md:13px; --r-lg:16px; }

/* навигация как masthead обсерватории — постоянная волосяная линия снизу */
nav{border-bottom:1px solid var(--hair);background:var(--bg);}
.brand .bn{letter-spacing:-0.01em;} .brand .bx{color:var(--mut);}
.nav-btn{letter-spacing:0.16em;} .nav-btn.active::after{height:1.5px;}

/* единый заголовок-«каталожная запись» (опрос, куратор) — волосяная линия под шапкой */
.wz-head{position:relative;padding-bottom:0.55rem;margin-bottom:0.35rem;}
.wz-head::after{content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:min(360px,82%);height:1px;background:var(--hair);}
.wz-step{display:inline-block;letter-spacing:0.32em;}

/* регистрационные засечки на ключевой карточке опроса — перекличка со «следом» */
.wz-card{position:relative;}
.wz-card::before,.wz-card::after{display:none;}

/* перцептивный прибор — точнее набор результата */
.iso-read #iso-words{letter-spacing:-0.01em;}
.iso-read .iso-pe{letter-spacing:0.04em;}

/* транспорт потока — точный «пульт» */
.ether-bar{border-radius:1.35rem;}
.ether-ctl{border-radius:var(--r-md);letter-spacing:0.1em;}
.ether-ctl.play{}
.ether-ctl.play.on{}

/* заголовки разделов — с ведущей засечкой-маркером (редакционный приём) */
.cur-sec h4::before,.tx-group > .tx-head::before{content:none;}

/* уверенный editorial набор заголовков */
#auth-wrap h1{letter-spacing:-0.04em;}
.receipt-title,.modal-head h3{letter-spacing:-0.02em;text-wrap:balance;}
.modal-head h3{font-family:'Source Serif 4',serif;}

/* единый радиус полей/тегов */
.inp{border-radius:var(--r-md);} .tag{border-radius:var(--r-sm);} .cap-tab{border-radius:var(--r-md);}

@media(max-width:600px){
  .wz-head{margin-bottom:0.25rem;padding-bottom:0.45rem;}
  .wz-head::after{width:min(280px,84%);}
  .wz-card::before,.wz-card::after{width:11px;height:11px;top:9px;left:9px;}
  .wz-card::after{top:auto;left:auto;bottom:9px;right:9px;}
}

/* ============================================================
   СЛОЙ shadcn / Tailwind / Lucide / Framer (бессборочно)
   Токены и эстетика этих библиотек, перенесённые на тёплую
   палитру «Отзвука». Иконки Lucide — встроенный SVG.
   ============================================================ */
:root{
  /* shadcn-совместимые семантические токены, привязанные к нашей палитре */
  --background:var(--void); --foreground:var(--ink);
  --card:var(--panel-2); --muted-foreground:var(--mut);
  --border:var(--line); --input:rgba(236,230,218,0.16);
  --ring:var(--ember-soft); --ring-offset:var(--void);
  --radius:1rem; --r-sm:calc(var(--radius) - 0.36rem); --r-md:calc(var(--radius) - 0.18rem); --r-lg:var(--radius);
  --ease-spring:cubic-bezier(.34,1.4,.5,1);
}

/* иконки Lucide */
.ic{display:inline-block;vertical-align:-0.18em;flex:0 0 auto;opacity:0.95}
.btn-primary .ic,.btn-ember .ic{opacity:1}

/* кнопки в стиле shadcn: иконка+подпись в ряд, скругление, тактильное нажатие */
.btn-primary,.btn-secondary,.btn-ember,.btn-warn{display:flex;align-items:center;justify-content:center;gap:0.55rem;border-radius:var(--r-md)}
.ether-ctl{justify-content:center;border-radius:var(--r-md)}
.btn-secondary:hover{background:rgba(241,236,226,0.1);border-color:transparent}
.btn-primary:active,.btn-ember:active,.btn-secondary:active,.btn-warn:active,.ether-ctl:active{transform:scale(0.975)}

/* кольцо фокуса shadcn (видно только с клавиатуры) */
.btn-primary,.btn-secondary,.btn-ember,.btn-warn,.ether-ctl,.nav-btn,.tag,.cap-tab,.linkish-sm,.inp,.role-chip{outline:none}
.btn-primary:focus-visible,.btn-secondary:focus-visible,.btn-ember:focus-visible,.btn-warn:focus-visible,.ether-ctl:focus-visible,.nav-btn:focus-visible,.tag:focus-visible,.cap-tab:focus-visible,.linkish-sm:focus-visible,.inp:focus-visible{}

/* бейдж роли — пилюля shadcn */
.role-chip{border-radius:0;border-color:var(--border)}

/* ссылка-приватность с иконкой: подчёркиваем только текст */
.linkish-sm{display:inline-flex;align-items:center;gap:0.4rem;border-bottom:none}
.linkish-sm span{border-bottom:1px dotted var(--steel-dim);padding-bottom:1px}

/* поля ввода — радиус shadcn */
.inp{border-radius:var(--r-md)}

/* движение в духе Framer: всплытие диалога (пружина) и затемнение фона */
.modal-backdrop{animation:scFade .2s ease both}
.modal{animation:scPop .3s var(--ease-spring) both}
@keyframes scFade{from{opacity:0}to{opacity:1}}
@keyframes scPop{from{opacity:0;transform:scale(.965) translateY(8px)}to{opacity:1;transform:none}}

@media(prefers-reduced-motion:reduce){ .modal-backdrop,.modal{animation:none} }

/* вкладки записи — сегментированный контрол shadcn (Tabs) */
.capture-tabs{padding:4px;gap:4px;background:rgba(236,230,218,0.05);border:1px solid var(--border);border-radius:var(--r-md)}
.cap-tab{border:none;background:transparent;border-radius:calc(var(--r-md) - 3px);padding:0.55rem 0.7rem;display:inline-flex;align-items:center;justify-content:center;gap:0.4rem;color:var(--mut)}
.cap-tab.on{background:var(--panel-2);color:var(--ink);}

/* иконка зоны загрузки (Lucide вместо текстовой стрелки) */
.upload-drop .up-ic{color:var(--steel);line-height:0;margin-bottom:0.5rem}
.upload-drop:hover .up-ic{color:var(--ink-dim)}

/* крестик закрытия модалки */
.flow-close{display:inline-flex;align-items:center;justify-content:center;color:var(--mut);transition:color .18s}
.flow-close:hover{color:var(--ink)}

/* ссылка-скачивание следа — иконка+подпись в ряд */
.rc-download{display:inline-flex;align-items:center;justify-content:center;gap:0.5rem}

/* ============================================================
   МАНИФЕСТ C — сценография, типографика, cinema mode
   ============================================================ */

/* editorial-панели вместо frosted app */
.glass{
  background:var(--bg);
  border-color:rgba(241,236,226,0.055);
}

/* кнопки — фразы, не бирки; ember только на героических действиях */
.btn-primary,.btn-secondary{
  text-transform:none;
  letter-spacing:0.02em;
  font-weight:500;
}
.btn-primary:hover{transform:translateY(-1px);}
.btn-ember{}
.btn-ember:hover{}
.btn-primary:active,.btn-secondary:active,.btn-ember:active{transform:none;}

/* вход — афиша */
.eyebrow{letter-spacing:0.2em;color:var(--mut);font-size:0.54rem;}
#auth-wrap .sub{
  font-family:'Source Serif 4',Georgia,serif;
  font-style:italic;
  font-size:clamp(1rem,3.5vw,1.18rem);
  letter-spacing:0.01em;
  text-transform:none;
  color:var(--ink-dim);
  margin-bottom:1.6rem;
  line-height:1.35;
}
#auth-wrap .desc{max-width:36ch;line-height:1.7;margin-bottom:2rem;}
.gate-div{opacity:0.82;}

/* wizard — круг герой, подсказка serif */
.wz-hint.serif{font-family:'Source Serif 4',serif;font-size:0.92rem;color:var(--ink-dim);line-height:1.4;margin-bottom:0.35rem;}
.wz-help-link{text-align:center;margin-top:0.35rem;}
.iso-read #iso-words{font-size:clamp(0.98rem,3.2vw,1.15rem);}

/* запись — ember-орб, serif во время REC */
.rec-core{
  font-family:'Source Serif 4',serif;
  font-size:0.82rem;
  letter-spacing:0.02em;
  text-transform:none;
}
.rec-core.on{font-style:italic;font-weight:500;}
.rec-core.btn-ember:not(.on){background:transparent;color:var(--ember-soft);}
.rec-core.on{}

/* квитанция — артефакт доминирует */
.receipt-title{margin-bottom:1rem;}
.rc-memory{font-size:clamp(0.95rem,2.8vw,1.05rem);}
.rc-actions .btn-secondary{opacity:0.72;}
.rc-actions .btn-secondary:hover{opacity:1;}

/* закрытый приём — типографический лист */
.closed-notice{max-width:480px;width:100%;text-align:center;padding:1rem 0;}
.closed-lead{font-size:clamp(1.8rem,6vw,2.4rem);line-height:1.05;margin:0.4rem 0 1rem;letter-spacing:-0.02em;}
.closed-body{font-size:0.92rem;color:var(--ink-dim);line-height:1.65;margin:0 auto 1.6rem;max-width:38ch;}
.closed-notice .btn-primary{max-width:280px;margin:0 auto;}

/* поток — субтитр спектакля */
.now-line{
  font-family:'Source Serif 4',Georgia,serif;
  font-size:clamp(1rem,3.2vw,1.28rem);
  color:var(--ink);
  text-align:center;
  line-height:1.35;
  letter-spacing:-0.01em;
  min-height:1.4em;
  transition:opacity .5s var(--ease);
}
.now-line .now-place{font-style:italic;color:var(--ink-dim);}
.now-line .now-phrase{font-weight:500;}

/* тихий пульт */
.ether-bar{
  background:rgba(10,10,12,0.78);
  border-color:rgba(241,236,226,0.05);
  transition:opacity .6s var(--ease),transform .6s var(--ease);
}
.ether-ctl{text-transform:none;letter-spacing:0.03em;color:var(--ink-dim);}
.ether-ctl.play{}
.ether-ctl.play.on{}
.ether-ctl.on:not(.play):not(.drift-ctl){background:rgba(241,236,226,0.04);border-color:rgba(241,236,226,0.12);color:var(--ink);}
.ether-ctl.drift-ctl{color:var(--ink-dim);}
.ether-ctl.drift-ctl.on{
  background:rgba(196,102,74,0.32);
  border-color:var(--ember);
  color:var(--ink);
}
.ether-ctl.drift-ctl.on span{color:var(--ink);}
.ether-ctl.focus-enter{
  border-color:rgba(196,102,74,0.42);
  color:var(--ink);
  background:rgba(196,102,74,0.1);
}
.ether-ctl.focus-enter.on,
.ether-ctl.focus-enter:hover{
  border-color:var(--ember);
  background:rgba(196,102,74,0.18);
}

.stream-guide{font-family:'IBM Plex Mono',monospace;letter-spacing:0.04em;transition:opacity .6s var(--ease);}

/* легенда — слева под верхней строкой, не на карте по центру */
.legend-wrap{
  position:fixed;
  top:calc(8.5rem + var(--st));
  left:1rem;
  bottom:auto;
  z-index:48;
  pointer-events:auto;
  max-width:min(320px,calc(100vw - 2rem));
}
.legend-fab{
  display:none;
  width:38px;height:38px;border-radius:50%;
  border:1px solid rgba(241,236,226,0.12);
  background:rgba(10,10,12,0.92);color:var(--mut);
  font-family:'IBM Plex Mono',monospace;font-size:0.88rem;line-height:1;
  align-items:center;justify-content:center;
  transition:border-color .2s,color .2s,background .2s;
}
.legend-fab:hover{color:var(--ink);border-color:rgba(241,236,226,0.2);}
.legend-panel{
  background:rgba(10,10,12,0.88);
  border:1px solid rgba(241,236,226,0.08);
  border-radius:14px;
  padding:12px 14px 11px;
}
.legend{
  opacity:1;
  transform:none;
  pointer-events:auto;
  font-family:'IBM Plex Mono',monospace;
  font-size:0.72rem;
  letter-spacing:0.03em;
  line-height:1.45;
  color:var(--ink-dim);
  display:flex;
  flex-direction:column;
  gap:8px;
}
.legend-body{display:flex;flex-direction:column;gap:8px;}
.legend-close{display:none;}
.legend-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:2px;padding-bottom:8px;border-bottom:1px solid var(--line-2);}
.legend-head .legend-title{flex:1;min-width:0;}
.legend-head .legend-q,.legend-head .legend-close{flex:none;}
.legend-title{font-family:'Source Serif 4',Georgia,serif;font-size:0.88rem;font-weight:500;color:var(--ink);letter-spacing:0.01em;}
.legend-q{
  width:22px;height:22px;flex:none;border-radius:50%;border:1px solid var(--line);
  background:rgba(241,236,226,0.04);color:var(--mut);font-family:'IBM Plex Mono',monospace;
  font-size:0.72rem;line-height:1;display:flex;align-items:center;justify-content:center;
  transition:border-color .2s,color .2s,background .2s;
}
.legend-q:hover{color:var(--ink);border-color:rgba(241,236,226,0.16);background:rgba(241,236,226,0.08);}
.legend-body span{display:flex;align-items:center;gap:9px;}
.legend-body i{display:inline-block;width:22px;height:3px;border-radius:2px;flex:none;}

/* карточка узла */
#node-panel h3{font-size:1.12rem;font-weight:600;}

/* системный бейдж — человеческий язык */
.sys-badge{font-style:italic;letter-spacing:0.04em;opacity:0.65;}
.ping.active{}

/* навигация — тише на потоке */
.nav-btn{text-transform:none;letter-spacing:0.06em;}
body.screen-stream nav{
  transition:opacity .6s var(--ease);
  background:var(--bg);
}
body.screen-stream .sys-badge{top:calc(5.1rem + var(--st));}

/* авто-уход UI — только в режиме «Скульптура» (focus-mode) */
body.screen-stream:not(.focus-mode) nav,
body.screen-stream:not(.focus-mode) .sys-badge,
body.screen-stream:not(.focus-mode) .stream-meta,
body.screen-stream:not(.focus-mode) .stream-guide,
body.screen-stream:not(.focus-mode) .legend-wrap,
body.screen-stream:not(.focus-mode) .ether-overlay{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
body.focus-mode.chrome-hidden .focus-exit{opacity:0.55;}
body.focus-mode.chrome-hidden .focus-exit:hover,
body.focus-mode.chrome-hidden .focus-exit:focus-visible{opacity:1;}
body.focus-mode.chrome-hidden .ether-bar{opacity:0;pointer-events:none;}

/* модалки — fade, не spring */
.modal-backdrop{animation:scFade .45s ease both;}
@keyframes mfFadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.modal{animation:mfFadeUp .5s var(--ease-out) both;}

/* manifesto lead в «О проекте» */
.manifesto-lead{
  font-size:1.12rem;
  font-style:italic;
  line-height:1.5;
  color:var(--ink);
  margin:0 0 1.2rem;
  padding-bottom:1rem;
  border-bottom:1px solid var(--line);
}

/* движение — медленнее, без bounce */
.fade-in{animation:fadeUp .75s var(--ease-out);}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.stagger > *{animation-duration:0.85s;animation-timing-function:var(--ease-out);}
.stagger > *:nth-child(1){animation-delay:.08s;}
.stagger > *:nth-child(2){animation-delay:.2s;}
.stagger > *:nth-child(3){animation-delay:.32s;}
.stagger > *:nth-child(4){animation-delay:.44s;}
.stagger > *:nth-child(5){animation-delay:.56s;}
.stagger > *:nth-child(6){animation-delay:.68s;}

/* приглушить product-glow из предыдущих слоёв */
.nav-btn.active::after{}
.prog-fill{}
.inp:focus{}
.btn-primary:active,.btn-ember:active,.btn-secondary:active,.btn-warn:active,.ether-ctl:active{transform:none;}

@media(max-width:600px){
  .legend-wrap{top:calc(7.6rem + var(--st));left:0.75rem;max-width:calc(100vw - 1.5rem);}
  .legend-fab{display:flex;}
  .legend-wrap:not(.open) .legend-panel{display:none;}
  .legend-wrap.open .legend-fab{display:none;}
  .legend-wrap.open .legend-close{display:flex;}
  .legend-panel{font-size:clamp(0.66rem,2vw,0.74rem);}
  .legend-body{gap:7px;}
  .legend-body i{width:18px;height:2.5px;}
  .legend-title{font-size:0.82rem;}
  .ether-bar{gap:6px;padding:8px;border-radius:1.1rem;}
  .ether-ctl{font-size:clamp(0.58rem,1.8vw,0.66rem);padding:0.55rem 0.7rem;min-width:0;flex:1 1 calc(50% - 6px);max-width:calc(50% - 3px);}
  .stream-guide{bottom:calc(8.4rem + var(--sb));}
  body.node-panel-open .legend-wrap{opacity:0;pointer-events:none;visibility:hidden;}
  body.node-panel-open .stream-meta,
  body.node-panel-open .stream-guide{opacity:0;pointer-events:none;visibility:hidden;}
  body.focus-mode.chrome-hidden .now-line{font-size:clamp(0.92rem,4vw,1.08rem);}
  .focus-exit{top:calc(0.7rem + var(--st));right:0.75rem;padding:0.55rem 0.85rem;font-size:0.58rem;}
  .role-chip{display:none;}
  nav .nav-links{gap:0.55rem;flex-wrap:wrap;justify-content:flex-end;max-width:62vw;}
}
.weather-pill{
  display:inline-flex;align-items:center;justify-content:center;
  font-family:'IBM Plex Mono',monospace;font-size:clamp(0.58rem,1.7vw,0.68rem);
  color:var(--steel);letter-spacing:0.02em;background:none;border:none;
  padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px;
}
.weather-pill:hover{color:var(--ink-dim);}
.legend-close{
  width:22px;height:22px;flex:none;border-radius:50%;border:1px solid var(--line);
  background:rgba(241,236,226,0.04);color:var(--mut);font-family:'IBM Plex Mono',monospace;
  font-size:1rem;line-height:1;align-items:center;justify-content:center;
}
.legend-close:hover{color:var(--ink);border-color:rgba(241,236,226,0.16);}
@media(min-width:601px){
  .legend-panel{display:block;}
  .legend-fab,.legend-close{display:none!important;}
}
.cap-tab{text-transform:none;letter-spacing:0.03em;}
.inp::placeholder{letter-spacing:0.03em;text-transform:none;}

/* Переключатель языка */
.lang-switch{display:inline-flex;gap:3px;align-items:center;margin-left:8px;padding:2px;border:1px solid var(--line-2);border-radius:0;background:rgba(8,8,10,0.5)}
.lang-btn{border:0;background:transparent;color:var(--faint);font-family:'IBM Plex Mono',monospace;font-size:0.58rem;letter-spacing:0.06em;padding:0.35rem 0.55rem;border-radius:0;cursor:pointer;line-height:1}
.lang-btn.on{color:var(--ink);background:rgba(199,154,75,0.14);}
.auth-lang{display:flex;justify-content:center;margin-top:1.4rem}
.auth-lang .lang-switch{margin-left:0}

/* ============================================================
   РЕЖИМ «ТОЛЬКО СКУЛЬПТУРА» — чистый зал, усиленное 3D
   ============================================================ */
.focus-exit{
  display:none;
  position:fixed;
  top:calc(0.95rem + var(--st));
  right:1.15rem;
  z-index:80;
  align-items:center;
  gap:8px;
  padding:0.62rem 1rem;
  border:1px solid rgba(196,102,74,0.45);
  border-radius:0;
  background:rgba(8,8,10,0.82);
  font-family:'IBM Plex Mono',monospace;
  font-size:0.62rem;
  letter-spacing:0.05em;
  color:var(--ink);
  transition:opacity .45s var(--ease),border-color .25s,color .25s,box-shadow .35s var(--ease);
}
.focus-exit:hover{color:var(--ink);border-color:var(--ember);}
body.focus-mode .focus-exit{display:inline-flex;animation:focusExitIn .55s var(--ease-out);}
@keyframes focusExitIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
body.focus-mode nav,
body.focus-mode .sys-badge{
  opacity:0;
  pointer-events:none;
  transition:opacity .55s var(--ease);
}
body.focus-mode .stream-stage > *:not(.focus-exit){
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .5s var(--ease);
}
body.focus-mode #layer-2d{opacity:0;}
body.focus-mode #layer-3d.sculpt-focus{
  filter:brightness(1.18) saturate(1.12) contrast(1.06);
  transition:filter 1s var(--ease);
}
body.focus-mode::after{opacity:0.08;transition:opacity 1s var(--ease);}
body.focus-mode::before{opacity:0.008;}

/* ============================================================
   ПАТТЕРН 2A · «Сначала — ощущение» (спецификация Claude Design)
   Путь шагов назван и пронумерован: «01 ощущение → 02 звук».
   Абстрактное «Шаг 1 из 2» не объясняло, ПОЧЕМУ такой порядок,
   и человек сопротивлялся: сначала же логично записать звук.
   Причина стоит строкой под заголовком — там, где уже стоит взгляд.
   ============================================================ */
.wz-path{display:flex;align-items:center;justify-content:center;gap:0.5rem;
  margin-bottom:0.5rem;flex-wrap:nowrap;}
.wz-path-i{font-family:'IBM Plex Mono',monospace;font-size:0.58rem;
  letter-spacing:0.14em;text-transform:uppercase;white-space:nowrap;
  transition:color .35s var(--ease);}
.wz-path-i b{font-weight:500;margin-right:0.28em;}
/* Текущий шаг — полный контраст. */
.wz-path-i.is-now{color:var(--ink);}
.wz-path-i.is-now b{color:var(--ember);}
/* Пройденный — приглушён, но читаем. */
.wz-path-i.is-done{color:var(--mut);}
/* Предстоящий — «ещё впереди», самый тихий. */
.wz-path-i.is-next{color:var(--faintest);}
.wz-path-sep{width:26px;height:1px;background:var(--line);flex:0 0 auto;}

/* Причина порядка — одной строкой, сразу под заголовком. */
.wz-why{font-size:0.78rem;line-height:1.5;color:var(--mut);
  max-width:34ch;margin:0.4rem auto 0;text-align:center;text-wrap:pretty;}

@media(max-width:600px){
  .wz-path-i{font-size:0.54rem;letter-spacing:0.1em;}
  .wz-path-sep{width:18px;}
  .wz-why{font-size:0.74rem;max-width:30ch;}
}
/* На низких экранах причина мешает кругу — прячем, она уже прочитана */
@media(max-height:640px){ .wz-why{display:none;} }

/* ============================================================
   ПАТТЕРН 1A · Первые десять секунд (спецификация Claude Design)
   Человек открыл ссылку от друга и не знает, что такое
   «акустическая топология». За 10 секунд он должен понять:
   (1) это звучит СЕЙЧАС, (2) собрано жителями города,
   (3) точку можно коснуться.

   Принцип: без экрана «далее-далее». Подсказка живёт на реальном
   интерфейсе, ничего не перекрывает и гаснет после первого касания.

   Цвет — нейтральный тёплый белый. ember/steel/gold здесь НЕ
   используются: это семантика типов связей, присваивать её
   онбордингу нельзя (требование спецификации).
   ============================================================ */
.onb-origin{
  position:absolute; left:50%; transform:translateX(-50%);
  bottom:calc(var(--sb) + 8.6rem);
  display:flex; flex-direction:column; align-items:center; gap:0.32rem;
  text-align:center; pointer-events:none; z-index:6;
  animation:onbIn 1.1s var(--ease-out) both; animation-delay:.5s;
}
.onb-origin.is-gone{ animation:onbOut .7s var(--ease) forwards; }

.onb-live{
  display:inline-flex; align-items:center; gap:0.44rem;
  font-family:'IBM Plex Mono',monospace; font-size:0.58rem;
  letter-spacing:0.18em; text-transform:uppercase; color:var(--ink-dim);
}
.onb-dot{
  width:6px; height:6px; border-radius:50%;
  background:var(--faint); flex:0 0 auto; transition:background .5s;
}
/* Пульсация только когда звук реально идёт — иначе это ложное обещание. */
.onb-dot.is-on{ background:var(--ink); animation:onbPing 2.4s ease-out infinite; }

.onb-made{
  font-size:0.78rem; line-height:1.45; color:var(--mut);
  max-width:30ch; text-wrap:pretty;
}

@keyframes onbPing{
  0%{ }
  70%{ }
  100%{ }
}
@keyframes onbIn{ from{opacity:0;transform:translateX(-50%) translateY(9px);}
                  to{opacity:1;transform:translateX(-50%) translateY(0);} }
@keyframes onbOut{ to{opacity:0;transform:translateX(-50%) translateY(-6px);visibility:hidden;} }

@media(max-width:600px){
  .onb-origin{ bottom:calc(var(--sb) + 9.4rem); padding:0 1.2rem; }
  .onb-made{ font-size:0.74rem; max-width:26ch; }
}
/* На низких экранах место дороже подсказки — она уже прочитана. */
@media(max-height:640px){ .onb-origin{ display:none; } }

@media(prefers-reduced-motion:reduce){
  .onb-origin{ animation:none; }
  .onb-dot.is-on{ animation:none; }
  .onb-origin.is-gone{ animation:none; opacity:0; visibility:hidden; }
}

/* ============================================================
   ГЕОМЕТРИЯ ОВЕРЛЕЕВ ПОТОКА (2026-07-24)
   Раньше .stream-guide, .onb-origin и пульт позиционировались
   независимыми константами в rem. На телефоне пульт переносится
   на две строки (~110px), и подсказка ложилась ПРЯМО НА КНОПКИ.
   Теперь одна переменная --dock-h задаёт высоту пульта, а всё
   остальное считается от неё: ничего не может наехать.
   ============================================================ */
:root{
  --dock-h:76px;      /* высота пульта: десктоп — одна строка */
  --dock-bot:0.85rem; /* отступ пульта от низа (padding .ether-overlay) */
  --dock-gap:14px;    /* зазор между пультом и подсказкой */
}
@media(max-width:600px){
  :root{ --dock-h:124px; }   /* телефон: пульт в две строки */
}
@media(max-width:380px){
  :root{ --dock-h:132px; }
}

/* Подсказка — всегда НАД пультом, с гарантированным зазором. */
.stream-guide{
  bottom:calc(var(--dock-bot) + var(--dock-h) + var(--dock-gap) + var(--sb)) !important;
}
/* Строка происхождения 1A — над подсказкой. */
.onb-origin{
  bottom:calc(var(--dock-bot) + var(--dock-h) + var(--dock-gap) + 3.1rem + var(--sb)) !important;
}

/* ---- Погода больше не перекрывает скульптуру ----
   .stream-meta была position:fixed с непрозрачным фоном по центру
   верха — постоянная плашка поверх работы. Теперь она уходит
   к краю, становится полупрозрачной и не ловит клики мимо
   самой таблетки. */
.stream-meta{
  /* НЕ поднимать до 4.6rem: там справа стоит .sys-badge, и на узком
     экране центрированная плашка заезжает под него. */
  top:calc(5.6rem + var(--st));
  background:rgba(10,10,12,0.42);
  border-color:rgba(241,236,226,0.05);
  padding:5px 12px;
  pointer-events:none;            /* сквозь плашку видно и кликается скульптура */
  opacity:0.82;
  transition:opacity .4s var(--ease);
}
.stream-meta > *{ pointer-events:auto; }   /* но сама таблетка кликабельна */
.stream-meta:hover{ opacity:1; }
/* В режиме скульптуры метаданные не нужны совсем. */
body.focus-mode .stream-meta{ opacity:0; visibility:hidden; }

@media(max-width:600px){
  .stream-meta{
    /* Системный бейдж стоит справа на 4.6rem и заканчивается около
       5.9rem. Уводим счётчик ниже этой строки целиком — на узком
       экране разъехаться по горизонтали не получится. */
    top:calc(6.4rem + var(--st));
    font-size:0.56rem; padding:4px 10px;
    max-width:calc(100% - 3rem);
  }
}
/* Низкие экраны: метаданные съедают вид на скульптуру — убираем. */
@media(max-height:620px){
  .stream-meta{ display:none; }
}

/* ============================================================
   ПРИОРИТЕТ ОВЕРЛЕЕВ (2026-07-24, ревизия 2)
   Прошлая правка чинила только вертикальные отступы. Настоящая
   причина была глубже: правило, прячущее подсказки при открытой
   карточке следа, лежало ВНУТРИ @media(max-width:600px). На
   десктопе и планшете карточка открывалась, а «коснитесь…» и
   плашка погоды продолжали висеть поверх её текста.

   Принцип теперь один: подсказки — низший приоритет. Любой
   элемент, который человек ЧИТАЕТ или с которым РАБОТАЕТ,
   гасит их на всех размерах экрана.
   ============================================================ */

/* --- Карточка следа: главный конфликт --- */
body.node-panel-open .stream-guide,
body.node-panel-open .stream-meta,
body.node-panel-open .onb-origin,
body.node-panel-open .legend-wrap{
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

/* --- Легенда связей раскрыта — читают её --- */
body.legend-open .stream-guide,
body.legend-open .onb-origin{
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

/* --- Модалка открыта — фон не должен мигать поверх --- */
body.modal-open .stream-guide,
body.modal-open .stream-meta,
body.modal-open .onb-origin{
  opacity:0 !important;
  visibility:hidden !important;
}

/* --- Карточка следа выше подсказок в любом случае --- */
#node-panel{ z-index:60; }

/* Подсказки живут ниже всего интерактивного. */
.stream-guide{ z-index:14; }
.onb-origin{ z-index:15; }

/* На десктопе карточка следа стоит справа, а подсказка по центру —
   они могут разойтись по горизонтали. Но при узком окне (планшет,
   половина экрана) неизбежно пересекутся: страхуемся отступом. */
@media(min-width:601px) and (max-width:1100px){
  .stream-guide{ max-width:min(60vw,420px); }
}

/* Третья строка знакомства — призыв коснуться. Раньше висела отдельным
   блоком поверх пульта: два текстовых пятна в момент первого впечатления.
   Собрано в один блок (замечание дизайнера на ревью). */
.onb-tap{
  font-family:'IBM Plex Mono',monospace;font-size:0.6rem;letter-spacing:0.08em;
  color:var(--faint);margin-top:0.15rem;max-width:32ch;text-wrap:pretty;
}
@media(max-width:600px){ .onb-tap{ font-size:0.56rem; max-width:28ch; } }

/* ============================================================
   НАПРАВЛЕНИЕ «ПРИБОР» — слой языка
   design_handoff_otzvuk_pribor, 2026-07-27

   Идёт последним в файле намеренно: наследие переопределяется
   каскадом, а не !important. Здесь только то, что делает интерфейс
   прибором — типографическая шкала, линии, мишени, засечки. Раскладку
   экранов трогаем минимально: структура и логика по брифу остаются.
   ============================================================ */

/* ---------- регистр меты: моношрифт, разрядка, верхний регистр ----------
   Крупнее кегль — меньше разрядка (правило из handoff). */
.otz-label{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:10.5px;letter-spacing:0.16em;
  text-transform:uppercase;color:var(--faint);}
.otz-value{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:14px;letter-spacing:0.02em;color:var(--paper);}
.otz-title{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:19px;letter-spacing:0.02em;
  line-height:1.2;text-transform:uppercase;color:var(--paper);}
.otz-meta{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:10.5px;letter-spacing:0.1em;color:var(--dim);}

/* ---------- «звучит»: единственный пульс во всём интерфейсе ---------- */
@keyframes otz-breath{0%,100%{opacity:0.35;}50%{opacity:1;}}
.otz-live{animation:otz-breath 3.4s ease-in-out infinite;}
.otz-live-dot{width:6px;height:6px;background:var(--steel);display:inline-block;border-radius:0;}
@media(prefers-reduced-motion:reduce){ .otz-live{animation:none;opacity:0.85;} }

/* ---------- угловые засечки активного поля ----------
   14px, волосяная линия. Поле «прибора» отмечено углами, а не рамкой:
   рамка сделала бы из него коробку. */
.otz-ticks{position:relative;}
.otz-ticks::before,.otz-ticks::after{content:"";position:absolute;width:14px;height:14px;pointer-events:none;}
.otz-ticks::before{top:0;left:0;border-top:1px solid var(--faint);border-left:1px solid var(--faint);}
.otz-ticks::after{bottom:0;right:0;border-bottom:1px solid var(--faint);border-right:1px solid var(--faint);}
.otz-ticks > .otz-ticks-b{position:absolute;inset:0;pointer-events:none;}
.otz-ticks > .otz-ticks-b::before,.otz-ticks > .otz-ticks-b::after{content:"";position:absolute;width:14px;height:14px;}
.otz-ticks > .otz-ticks-b::before{top:0;right:0;border-top:1px solid var(--faint);border-right:1px solid var(--faint);}
.otz-ticks > .otz-ticks-b::after{bottom:0;left:0;border-bottom:1px solid var(--faint);border-left:1px solid var(--faint);}

/* ============================================================
   УПРАВЛЕНИЕ КАК ТЕКСТ
   Кнопка — слово в тонкой рамке-мишени либо просто слово. Состояние
   передаётся весом линии и цветом текста, никогда — заливкой.
   Цель для пальца >= 46px, ключевые действия 56–58px: Норильск,
   улица, перчатки, одна рука.
   ============================================================ */
button,.btn-primary,.btn-secondary,.btn-ember,.btn-warn,.ether-ctl,.nav-btn,.linkish,.linkish-sm{
  border-radius:0;
  font-family:'IBM Plex Mono',ui-monospace,monospace;
  letter-spacing:0.12em;
  text-transform:uppercase;
  transition:color .2s var(--ease),border-color .2s var(--ease),opacity .2s var(--ease);
}
.btn-primary,.btn-secondary,.btn-ember,.btn-warn{
  min-height:var(--touch-key);
  display:flex;align-items:center;justify-content:center;gap:10px;
  font-size:13px;font-weight:400;
  background:none;
}
/* Главное действие — рамка цвета бумаги. Второстепенное — только слово. */
.btn-primary,.btn-ember{color:var(--paper);border:1px solid var(--paper);}
.btn-secondary{color:var(--dim);border:1px solid var(--hair);}
.btn-warn{color:var(--ember);border:1px solid var(--ember);}
.btn-primary:hover,.btn-ember:hover{color:var(--paper);border-color:var(--paper);}
.btn-secondary:hover{color:var(--paper);border-color:var(--paper);}
/* Нажатие — вес линии, а не заливка и не сдвиг. */
.btn-primary:active,.btn-secondary:active,.btn-ember:active,.btn-warn:active{transform:none;border-width:2px;}
button:disabled{opacity:0.32;cursor:default;}

/* Фокус — свой, стальной. Никаких синих системных колец. */
:focus{outline:none;}
:focus-visible{outline:2px solid var(--steel);outline-offset:2px;}

/* Иконок в направлении «Прибор» нет: всё, что можно сказать словом,
   говорится словом. Глифы остаются только там, где заменяют текст
   целиком (закрыть, назад) — там у кнопки нет подписи. */
button > .ic{display:none;}
button:not(:has(span)) > .ic{display:inline-block;}

/* ============================================================
   ЛИНИЯ ВМЕСТО КОРОБКИ
   ============================================================ */
.glass,#node-panel,.modal,.ether-bar,.legend-panel,.wz-card,.cur-sec{
  background:var(--bg);
  border-radius:0;
  border:none;
}
#node-panel,.modal,.legend-panel{border:1px solid var(--hair);}
.modal-backdrop{background:rgba(8,8,9,0.88);}
.modal{background:var(--bg-modal);}
hr,.divider{border:0;border-top:1px solid var(--hair);height:0;}

/* ============================================================
   ПОТОК: интерфейс отступает к краям, скульптура владеет экраном
   ============================================================ */
.ether-overlay{padding-bottom:calc(var(--sb) + 0px);}
.ether-bar{
  border-top:1px solid var(--hair);
  border-radius:0;
  display:flex;gap:0;padding:0;
  background:var(--bg);
}
.ether-ctl{
  flex:1;min-height:var(--touch-key);
  font-size:12px;letter-spacing:0.1em;
  color:var(--dim);background:none;border:none;
  border-left:1px solid var(--hair);
  border-radius:0;
  display:flex;align-items:center;justify-content:center;
}
.ether-ctl:first-child{border-left:none;}
.ether-ctl.on,.ether-ctl.play.on{color:var(--paper);}
.ether-ctl:hover{color:var(--paper);}

/* Лента-шапка потока и мета — регистр прибора */
.stream-meta{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:10.5px;
  letter-spacing:0.14em;text-transform:uppercase;color:var(--faint);}
.stream-count{color:var(--dim);}
.stream-guide{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:9.5px;
  letter-spacing:0.18em;text-transform:uppercase;color:var(--faint);}
.weather-pill{border-radius:0;border:none;background:none;color:var(--faint);
  font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:10.5px;letter-spacing:0.14em;text-transform:uppercase;}

/* Легенда родства — штрих 12×2, без коробки */
.legend-panel{background:var(--bg);border:1px solid var(--hair);border-radius:0;}
.legend-body span{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:9.5px;
  letter-spacing:0.08em;text-transform:uppercase;color:var(--dim);}
.legend-body i{width:12px;height:2px;border-radius:0;}
.legend-fab{border-radius:0;border:1px solid var(--hair);color:var(--dim);
  min-width:var(--touch);min-height:var(--touch);}

/* ============================================================
   КРУГ ВОСПРИЯТИЯ — смысловой центр
   Полюса фиксированы методом ISO/TS 12913-3 и не переименовываются.
   ============================================================ */
.iso-pole,.paq-name{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:11px;
  letter-spacing:0.1em;text-transform:uppercase;color:var(--dim);}
.iso-read .iso-pe,.iso-pe{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:13px;
  letter-spacing:0.08em;color:var(--paper);}
/* Точку в круге тянут пальцем — цель не меньше 46px даже если сама
   точка нарисована мелкой. */
.paq-dot,.iso-dot{min-width:var(--touch);min-height:var(--touch);}

/* ============================================================
   ГОЛОС ЧЕЛОВЕКА
   Единственное место серифа кроме заголовков-жестов — цитата
   слушателя. Не курсив ради красоты: это прямая речь.
   ============================================================ */
.np-note,.rc-memory{font-family:'Source Serif 4',Georgia,serif;font-style:italic;
  font-size:16.5px;line-height:1.4;color:var(--paper);letter-spacing:-0.01em;text-transform:none;}
.manifesto-lead{font-family:'Source Serif 4',Georgia,serif;font-style:italic;
  font-size:16px;line-height:1.42;color:var(--dim);}

/* ============================================================
   ДВИЖЕНИЕ ПОЧТИ УБРАНО
   Анимируется только звук («звучит», волна) и дрейф точки. Всплытия,
   появления и пружины сняты: они говорили языком приложения.
   ============================================================ */
.modal,.modal-backdrop,#node-panel,.ether-bar,.stream-guide,.onb-origin,.legend-panel{
  animation:none !important;
}
*{transition-timing-function:var(--ease);}
@media(prefers-reduced-motion:reduce){
  *{animation:none !important;transition-duration:.01ms !important;}
}

/* ============================================================
   ПАНЕЛЬ КУРАТОРА — единственный экран, где уместна таблица-«коробка»
   ============================================================ */
.cur-sec{border:1px solid var(--hair);border-radius:var(--r-target);}
.cur-sec h4{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:11px;
  letter-spacing:0.18em;text-transform:uppercase;color:var(--faint);}

/* ============================================================
   «ПРИБОР» — доводка по наследию
   Правила ниже гасят конкретные места, где старый язык пробивался
   сквозь слой выше: заливки состояний, «пилюли», переносы в пульте.
   Каждое — точечное, с указанием, что именно чинит.
   ============================================================ */

/* Пульт потока: одна строка мишеней, разделённых волосяной линией.
   Прежде .ether-bar переносил кнопки (flex-wrap:wrap) и медиазапросы
   задавали flex-basis 50% — на телефоне пять кнопок наезжали друг на
   друга. Пульт — область, а не объект: ни фона, ни рамки, ни радиуса. */
.ether-bar{flex-wrap:nowrap !important;gap:0 !important;padding:0 !important;
  max-width:none !important;width:100%;border:none;border-top:1px solid var(--hair);
  background:var(--bg);border-radius:0 !important;}
.ether-ctl{flex:1 1 0 !important;max-width:none !important;min-width:0 !important;
  height:auto;min-height:var(--touch-key);padding:0 4px !important;
  border:none;border-left:1px solid var(--hair);border-radius:0 !important;
  font-size:10px;letter-spacing:0.06em;text-transform:uppercase;
  color:var(--dim);background:none !important;justify-content:center;}
.ether-ctl:first-child{border-left:none;}
/* Активное состояние — цвет текста, а не заливка. steel = «живое». */
.ether-ctl.play{background:none !important;color:var(--dim) !important;border:none;border-left:1px solid var(--hair);}
.ether-ctl:first-child.play{border-left:none;}
.ether-ctl.play.on,.ether-ctl.on{color:var(--steel) !important;}
.ether-overlay{padding:0 !important;gap:0;}

/* Подсказка потока — строка, а не «пилюля» */
.stream-guide span{background:none !important;border:none !important;border-radius:0 !important;
  padding:0 !important;font-size:9.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--faint);}

/* Тост — плоская полоса на волосяной линии */
#sys-toast{background:var(--bg);border:1px solid var(--hair);border-radius:0;
  font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:11px;letter-spacing:0.06em;color:var(--paper);}

/* Поля ввода — прямые углы, линия снизу вместо коробки */
.inp{border-radius:0 !important;background:none;border:1px solid var(--hair);
  font-family:'IBM Plex Mono',ui-monospace,monospace;min-height:var(--touch);}
.inp:focus{border-color:var(--paper);}
.tag,.cap-tab,.preset-btn,.role-chip{border-radius:0 !important;background:none !important;}

/* Переключатель языка — два слова, активное просто ярче */
.lang-switch{border:none !important;background:none !important;padding:0;gap:10px;}
.lang-btn{color:var(--faint);background:none !important;min-height:var(--touch);padding:0 6px;
  border-bottom:1px solid transparent;}
.lang-btn.on{color:var(--paper);background:none !important;border-bottom-color:var(--paper);}

/* Погода — мета в общем регистре, без «пилюли» */
.weather-pill{border-radius:0 !important;border:none !important;background:none !important;padding:0;}

/* Кнопка легенды — квадратная мишень */
.legend-fab{border-radius:0 !important;background:none !important;}

/* ember/steel/gold — семантика родства, а не палитра акцентов.
   Активный пункт навигации красился ember, то есть цветом родства
   по звуковому тону: для читающего легенду это ложное сообщение. Активное
   состояние во всём интерфейсе передаёт steel («живое»). */
.nav-btn.active{color:var(--steel);}
.nav-btn.active::after{background:var(--steel);height:1px;}

/* Мета потока — строка на плоскости, не «пилюля» */
.stream-meta{background:none !important;border:none !important;border-radius:0 !important;
  padding:0 !important;}

/* Пульт: пять подписей должны поместиться на 390px, не наезжая */
.ether-ctl{font-size:9px;letter-spacing:0.02em;line-height:1.15;text-align:center;}
@media(min-width:601px){ .ether-ctl{font-size:11px;letter-spacing:0.06em;} }

/* Тост не должен закрывать пульт */
#sys-toast{bottom:calc(var(--touch-key) + 1.1rem + var(--sb));}

/* ---------- Посещения проекта (панель куратора) ----------
   Числа — в моно-регистре, столбики — волосяные линии, а не «график».
   Это ведомость наблюдения, а не дашборд. */
.vis-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--hair);
  border:1px solid var(--hair);margin-top:8px;}
.vis-cell{background:var(--bg);padding:10px 8px;display:flex;flex-direction:column;gap:4px;align-items:flex-start;}
.vis-n{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:19px;letter-spacing:0.01em;color:var(--paper);}
.vis-l{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:9px;letter-spacing:0.16em;
  text-transform:uppercase;color:var(--faint);}
.vis-chart{display:flex;align-items:flex-end;gap:2px;height:36px;margin-top:12px;
  border-bottom:1px solid var(--hair);padding-bottom:0;}
.vis-bar{flex:1 1 0;background:var(--steel);opacity:0.75;min-width:2px;}
.vis-axis{display:flex;justify-content:space-between;margin-top:5px;
  font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:9px;letter-spacing:0.1em;color:var(--faint);}

/* ============================================================
   ТИПОГРАФИКА: ДОВОДКА ПРИМЕНЕНИЯ (2026-08-10)

   Гарнитуры направления оставлены — правится то, КАК они применены.
   Слой выше навесил моношрифт, верхний регистр и разрядку 0.12em на
   ВСЕ кнопки без разбора. На коротком слове это язык прибора, а на
   фразе «политика обработки персональных данных» — нечитаемая
   капитель в разрядку. По-русски это особенно тяжело: кириллица в
   верхнем регистре шире латиницы и лишена выносных элементов, по
   которым глаз узнаёт слово.

   ПРАВИЛО, КОТОРОЕ ЗДЕСЬ ВОССТАНАВЛИВАЕТСЯ (оно есть в handoff):
   моношрифт в верхнем регистре — для МЕТЫ: координат, ID, значений,
   коротких лейблов и полюсов круга. Не для предложений.

   И второе правило оттуда же: крупнее кегль — меньше разрядка.
   Фиксированные 0.12em на любом размере как раз и «выбивались».
   ============================================================ */

/* Разрядка по кеглю, а не одна на всё. */
.mono,.otz-label,.otz-meta{letter-spacing:0.16em;}
.otz-title{letter-spacing:0.02em;}
.otz-value{letter-spacing:0.01em;}

/* Кнопка-мишень: короткая подпись, моно, умеренная разрядка. */
.btn-primary,.btn-ember,.btn-secondary,.btn-warn{
  font-size:13px;letter-spacing:0.08em;
}

/* Кнопки-ССЫЛКИ и всё, что длиннее двух слов, — обычным текстом.
   Подчёркивание вместо рамки: «управление как текст» именно об этом,
   а не о том, чтобы всё набрать капителью. */
.linkish,.linkish-sm,.legend-close,.legend-q,.flow-close,.lang-btn,
button.linkish,button.linkish-sm{
  font-family:'IBM Plex Sans',system-ui,sans-serif;
  text-transform:none;
  letter-spacing:0;
}
.linkish,.linkish-sm{
  font-size:14px;color:var(--dim);
  border-bottom:1px solid var(--hair);padding-bottom:2px;
}
.linkish:hover,.linkish-sm:hover{color:var(--paper);border-bottom-color:var(--paper);}

/* Ссылка на политику и прочие длинные пояснения — не капитель. */
.consent-card label,.consent-card a,.cur-hint,.wz-why,.np-meta,.np-dsp{
  font-family:'IBM Plex Sans',system-ui,sans-serif;
  text-transform:none;letter-spacing:0;
}

/* Пульт потока: 9px было мелко для мороза и перчаток. Слова короткие,
   верхний регистр им идёт, но разрядку убираем почти в ноль. */
.ether-ctl{font-size:11px;letter-spacing:0.02em;}
@media(min-width:601px){ .ether-ctl{font-size:12px;letter-spacing:0.05em;} }

/* Подсказка потока — это фраза, а не лейбл. */
.stream-guide span{text-transform:none;letter-spacing:0.01em;font-size:11.5px;
  font-family:'IBM Plex Sans',system-ui,sans-serif;}

/* Тост — сообщение человеку, набирать его моношрифтом незачем. */
#sys-toast{font-family:'IBM Plex Sans',system-ui,sans-serif;font-size:13px;letter-spacing:0;}

/* Заголовки разделов панели куратора — короткие лейблы, оставляем моно,
   но разрядку по кеглю. */
.cur-sec h4{font-size:11px;letter-spacing:0.14em;}

/* Строка происхождения на входе в поток — это обращение к человеку,
   а не лейбл прибора. Набирается текстом. */
.onb-made,.onb-tap{font-family:'IBM Plex Sans',system-ui,sans-serif;
  text-transform:none;letter-spacing:0.01em;}
.onb-tap{font-size:12px;}
.onb-made{font-size:13px;}
.onb-live{font-family:'IBM Plex Mono',ui-monospace,monospace;
  text-transform:uppercase;letter-spacing:0.16em;font-size:10px;color:var(--steel);}

/* Режим скульптуры в пульте красился ember — цветом родства «звук».
   Активное состояние во всём интерфейсе одно и то же: steel. */
.ether-ctl.focus-enter{border-color:var(--hair);color:var(--dim);}
.ether-ctl.focus-enter.on,.ether-ctl.focus-enter:hover{color:var(--steel);border-color:var(--hair);}

/* ---------- Статистика в панели куратора ----------
   Ведомость наблюдения: числа моно, полосы — волосяные линии. */
.st-tabs{display:flex;gap:0;margin-top:8px;border:1px solid var(--hair);}
.st-tab{flex:1;min-height:var(--touch);background:none;border:none;border-left:1px solid var(--hair);
  font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:10px;letter-spacing:0.08em;
  text-transform:uppercase;color:var(--dim);border-radius:0;}
.st-tab:first-child{border-left:none;}
.st-tab.on{color:var(--steel);}
.st-head{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:9.5px;letter-spacing:0.18em;
  text-transform:uppercase;color:var(--faint);margin:18px 0 8px;padding-bottom:6px;
  border-bottom:1px solid var(--hair);}
.st-row{display:flex;align-items:baseline;gap:10px;padding:7px 0;border-bottom:1px solid var(--hair-soft);
  font-family:'IBM Plex Sans',system-ui,sans-serif;font-size:13px;color:var(--dim);}
.st-l{flex:1;}
.st-v{font-family:'IBM Plex Mono',ui-monospace,monospace;color:var(--paper);letter-spacing:0.01em;}
.st-h{flex-basis:100%;font-size:11px;color:var(--faint);}
/* Воронка: доля от открытий видна длиной полосы, а не цветом. */
.st-fn{display:flex;align-items:center;gap:10px;padding:5px 0;}
.st-fn-l{flex:0 0 42%;font-family:'IBM Plex Sans',system-ui,sans-serif;font-size:12.5px;color:var(--dim);}
.st-fn-bar{flex:1;height:6px;border:1px solid var(--hair);position:relative;}
.st-fn-bar i{position:absolute;left:0;top:0;bottom:0;background:var(--steel);opacity:0.75;}
.st-fn-n{flex:0 0 auto;font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:11px;color:var(--paper);}
/* В столбике дня уникальные показаны вложенной, более яркой частью. */
.vis-bar{position:relative;}
.vis-bar i{position:absolute;left:0;right:0;bottom:0;background:var(--paper);opacity:0.55;}

/* Доводка ведомости статистики по факту вёрстки. */
.st-row{flex-wrap:wrap;}
.st-h{order:3;flex-basis:100%;margin-top:2px;}
.st-row .st-l{flex:1 1 auto;min-width:0;}
.st-row .st-v{flex:0 0 auto;white-space:nowrap;}
/* Пояснения в панели — вспомогательный текст, а не основной. */
.cur-hint{font-size:12px;line-height:1.45;color:var(--faint);margin-top:8px;}
/* «8 ч 32 мин» не должно переноситься посреди значения. */
.vis-n{font-size:17px;white-space:nowrap;}
.vis-cell{overflow:hidden;}
@media(max-width:430px){ .vis-n{font-size:15px;} .vis-grid{grid-template-columns:repeat(2,1fr);} }