/* Вариант 4 «Итог»: движения ушей v2 только в касании, записи, «не понял», «уточняет», «готово»; в покое и во сне уши не видны (DESIGN.md:93, :180).
   Ночью кожа носа темнее (решение владельца), без обводки и свечения (DESIGN.md:202). Искры записи остаются (DESIGN.md:175). Свои правки помечены «v4:». */
@property --drag{syntax:"<number>";inherits:true;initial-value:0}
:root,[data-theme=day]{
  --outer:#d9cfbf;--paper:#f5eee2;--card:#fffaf2;--ink:#221b16;--ink2:#6b5d51;--disabled-ink:#5f5247;--line:#e2d5c1;--accent:#b0451a;--sel:#f2c9a8;--danger:#b3261e;--tint:#f1dfcf;
  --fur1:#eeb070;--fur2:#d98a45;--fur3:#b5652a;--mask:#fff6ea;--mask-op:.96;--dots:#8a5a34;--ear1:#c97336;--ear2:#f4d9bd;
  /* дневная текстура тише (.6 → .4 → .25, критика 15.10 п. 6); блик-боб: --glint-op */
  --glow:transparent;--shade:rgba(80,50,20,.25);--glint-op:.6;--pebble-op:.25;
  --lea1:#3a2f2a;--lea2:#231c18;--lea3:#140f0d;
  /* редизайн v2: лист, календарь, переключатели */
  --gutter:20px;--knob:#fffaf2;--line2:#cdbba0;--on-accent:#fffaf2;--dis:#b8ad9f;--sheet:#f5eee2;--toggle-off:#8c7f70;--scrim:rgba(34,27,22,.5);--sheet-shadow:0 -10px 40px rgba(34,27,22,.18);
}
[data-theme=night]{
  --outer:#0b0c11;--paper:#14161f;--card:#1e2130;--ink:#efe9de;--ink2:#9ea1b3;--disabled-ink:#a8abbd;--line:#323650;--accent:#f2b56b;--sel:#5a4a33;--danger:#ff9a8f;--tint:#33313a;
  --fur1:#666b7e;--fur2:#4a4e5e;--fur3:#2c2f3d;--mask:#c9cbd6;--mask-op:.9;--dots:#2c2f3d;--ear1:#3d4158;--ear2:#8c6a4f;
  /* v4: ночью кожа темнее и холоднее, нос снова самый тёмный (DESIGN.md:195). Верх отделяют лампа сверху и блик, не контур. */
  --glow:rgba(242,181,107,.17);--shade:rgba(0,0,0,.5);--glint-op:.6;--pebble-op:.3;
  --lea1:#221e1c;--lea2:#141110;--lea3:#060505;
  --line2:#454a6b;--on-accent:#14161f;--dis:#5b5f78;--sheet:#181a26;--toggle-off:#6d7189;--scrim:rgba(5,6,10,.62);--sheet-shadow:0 -10px 40px rgba(0,0,0,.5);
}
/* окрас корги: выбор в настройках, действует в обеих темах */
[data-coat=red]{--fur1:#eeb070;--fur2:#d98a45;--fur3:#b5652a;--mask:#fff6ea;--mask-op:.96;--dots:#8a5a34;--ear1:#c97336;--ear2:#f4d9bd}
[data-coat=tri]{--fur1:#e0a060;--fur2:#b8682c;--fur3:#7a3e1a;--mask:#fff6ea;--mask-op:.96;--dots:#5a3a24;--ear1:#2a201c;--ear2:#e8c9a6}
[data-coat=sable]{--fur1:#e2b27a;--fur2:#b97c42;--fur3:#6e4422;--mask:#fff6ea;--mask-op:.96;--dots:#6e4422;--ear1:#7a4a26;--ear2:#f1d6b8}
[data-theme=night][data-coat] .snout svg{filter:brightness(.72) saturate(.85)} /* на внешнем svg: Safari не любит CSS-фильтр на <g> */
html[data-theme]{color-scheme:light;--bg:var(--outer);--app:var(--paper);--surface:var(--card);--text:var(--ink);--muted:var(--ink2);--subtle:var(--ink2);--mint:var(--accent)}
html[data-theme=night]{color-scheme:dark}
/* Смена темы: только цвета, 200 мс; класс ставит telegram.js paint() на 260 мс. Не transition:all. */

body{font-family:Onest,"Segoe UI",system-ui,-apple-system,sans-serif}
.capture-heading h2{font-family:Unbounded,sans-serif;font-weight:500;letter-spacing:-.035em}
.nose-stage{max-width:340px}
.nose-stage .nose-button.snout{border-radius:0;margin:0 auto;background:none;border:0;padding:0;-webkit-touch-callout:none;user-select:none}
.snout:focus-visible{outline:none}
.snout:focus-visible .nose-shape{stroke:var(--accent);stroke-width:3}
.snout{overflow:visible}
.snout svg{display:block;width:100%;height:100%;overflow:visible}
#nose{pointer-events:none}
.nose-hit{fill:transparent;stroke:transparent;stroke-width:32;stroke-linejoin:round;pointer-events:all;cursor:pointer}
.fur1{stop-color:var(--fur1)}.fur2{stop-color:var(--fur2)}.fur3{stop-color:var(--fur3)}
.lea1{stop-color:var(--lea1)}.lea2{stop-color:var(--lea2)}.lea3{stop-color:var(--lea3)}
.mask{fill:var(--mask);opacity:var(--mask-op);transition:fill .5s}
.whisk{fill:var(--dots)}
.pebble{opacity:var(--pebble-op)}

/* уши: вверх быстрый выход с малым перелётом (1 %), вниз короче и без перелёта; правое на 40 мс позже */
.ear{transform-box:fill-box;transition:transform .3s cubic-bezier(.4,0,.6,1)}
.ear.r{transition-delay:40ms}
/* v4: в покое уши спрятаны, как сейчас (DESIGN.md:93 «Видны только морда и нос») */
.ear.l{transform-origin:70% 100%;transform:translateY(215px) rotate(-14deg)}
.ear.r{transform-origin:30% 100%;transform:translateY(215px) rotate(14deg)}
.capture.is-recording .ear,.capture.is-asking .ear,.capture.is-done .ear{transition-duration:.42s;transition-timing-function:cubic-bezier(.22,1.18,.36,1)}
.capture.is-recording .ear.l{transform:translateY(0) rotate(-6deg)}
.capture.is-recording .ear.r{transform:translateY(0) rotate(6deg)}
/* обработка: уши наполовину и назад, пёс занят носом */
.capture.is-sniffing .ear.l{transform:translateY(70px) rotate(-15deg)}
.capture.is-sniffing .ear.r{transform:translateY(70px) rotate(15deg)}
.ear-in{fill:var(--ear2)}.ear-out{fill:var(--ear1)}
/* прижатие и поворот на голос corgi.js пишет в .ear-k; радость в «Готово» складывается с позой уха */
.ear-k{transform-box:fill-box;transform-origin:50% 100%}
/* v4: «Готово» — один подъём и возврат за .85 с, без двойного покачивания (CRITIQUE v2 п. 5); правое на 50 мс позже */
@keyframes perk{0%{transform:none}35%,50%{transform:translateY(-150px) rotate(4deg)}100%{transform:none}}
@keyframes perkR{0%{transform:none}35%,50%{transform:translateY(-150px) rotate(-4deg)}100%{transform:none}}
.capture.is-done .ear.l .ear-k{animation:perk .85s cubic-bezier(.3,.8,.3,1) both}
.capture.is-done .ear.r .ear-k{animation:perkR .85s cubic-bezier(.3,.8,.3,1) 50ms both}
.nostril{transform-box:fill-box}
/* ноздря растёт от хвоста: головка раскрывается вверх, хвост не доходит до края носа */
#nl,#nr{transform-origin:25% 80%}

/* v4: запись — уши подняты и поворачиваются на громкость, ноздри и искры следуют за голосом (DESIGN.md:175). Дуг и ореола нет. */
.spark{fill:var(--accent);stroke:rgba(255,236,214,.6);stroke-width:1}

/* покой: дыхание и редкое принюхивание */
@keyframes breathe{0%,100%{transform:none}50%{transform:translateY(-1.2px) scale(1.008)}}
@keyframes tease{0%,100%{transform:none}8%{transform:translateY(-2.5px) scale(1.015)}14%{transform:none}22%{transform:translateY(-2px) scale(1.012)}28%{transform:none}}
@keyframes flare{0%,100%{transform:none}8%,22%{transform:scale(1.1,1.2)}14%,28%{transform:none}}
.life{transform-origin:195px 130px;animation:breathe 3.8s ease-in-out infinite}
[data-theme=night] .life{animation-duration:5.2s} /* ночью пёс сонный: дышит медленнее */
[data-tease] .life{animation:tease 1.6s ease-out}
[data-tease] .nostril{animation:flare 1.6s ease-out}
/* обработка: быстрое «нюх-нюх» */
/* v5: нюх ищет — две затяжки слева, две справа, между ними нос возвращается; одинаковая петля .9 с выглядела механически */
@keyframes sniffs{0%,40%,90%,100%{transform:none}6%,20%{transform:translate(-5px,-4px) rotate(-1.2deg) scale(1.02,1.045)}13%,27%{transform:translate(-5px,0) rotate(-1.2deg)}56%,70%{transform:translate(5px,-4px) rotate(1.2deg) scale(1.02,1.045)}63%,77%{transform:translate(5px,0) rotate(1.2deg)}}
@keyframes flares{0%,13%,27%,40%,63%,77%,90%,100%{transform:none}6%,20%,56%,70%{transform:scale(1.14,1.26)}}
.capture.is-sniffing .life{animation:sniffs 2.4s ease-in-out infinite}
.capture.is-sniffing .nostril{animation:flares 2.4s ease-in-out infinite}
/* удаление: нос провожает карточку влево и дёргается обратно с перелётом; левая ноздря нюхает первой */
@keyframes twitch{0%,100%{transform:none}22%{transform:translateX(-3px) rotate(-1.4deg)}42%{transform:translateX(1.8px) rotate(.8deg)}62%{transform:translateX(-.8px) rotate(-.3deg)}80%{transform:translateX(.3px)}}
@keyframes twitchN{0%,100%{transform:none}18%{transform:scale(1.14,1.24)}34%{transform:scale(.95,1.03)}52%{transform:scale(1.07,1.13)}}
[data-twitch] .life{animation:twitch .6s cubic-bezier(.3,.7,.4,1) .12s}
[data-twitch] .nostril{animation:twitchN .5s ease-out .14s}
[data-twitch] #nr{animation-delay:.2s}
/* наклон головы: .45 с, перелёт 2 % */
.head{transform-origin:195px 250px;transition:transform .45s cubic-bezier(.3,1.25,.5,1)}
.capture.is-confused .head{transform:rotate(-9deg) translateX(-6px)}
/* «не понял»: одно ухо поднято, второе повисло вбок */
.capture.is-confused .ear.l{transform:translateY(20px) rotate(-6deg)}
.capture.is-confused .ear.r{transform:translateY(100px) rotate(10deg)}
.capture.is-confused .ear.r{transition-duration:.5s;transition-timing-function:cubic-bezier(.3,1.3,.5,1)}
/* v5: повисшее ухо один раз вздрагивает — «а?» */
@keyframes flick{0%,100%{transform:none}30%{transform:translateY(-14px) rotate(9deg)}60%{transform:rotate(-3deg)}}
.capture.is-confused .ear.r .ear-k{animation:flick .5s ease-out .8s}
/* «уточняет»: голова набок в другую сторону, ближнее к наклону ухо выше */
.capture.is-asking .head{transform:rotate(5deg)}
.capture.is-asking .ear.l{transform:translateY(40px) rotate(-8deg)}
.capture.is-asking .ear.r{transform:translateY(4px) rotate(4deg)}
/* v5: пока ждёт ответа, наклоняет голову то в одну, то в другую сторону — как корги, который слушает вопрос */
@keyframes ponder{0%,38%,100%{transform:rotate(5deg)}52%,86%{transform:rotate(-4deg)}}
.capture.is-asking .head{animation:ponder 3.4s ease-in-out .9s infinite}
/* v5: тишина в записи — уши чуть опущены и разведены */
.capture.is-recording[data-quiet] .ear.l{transform:translateY(36px) rotate(-12deg);transition-duration:.6s}
.capture.is-recording[data-quiet] .ear.r{transform:translateY(36px) rotate(12deg);transition-duration:.6s}

/* пустой список: пёс спит, уши вниз (DESIGN.md:180) */
@keyframes sleepy{0%,100%{transform:none}50%{transform:translateY(2px) scale(1.012,.985)}}
@keyframes zzz{0%{opacity:0;transform:translate(0,0) scale(.6)}20%{opacity:.9}100%{opacity:0;transform:translate(26px,-60px) scale(1.2)}}
.capture.is-sleep .life{animation:sleepy 5s ease-in-out infinite}
.capture.is-sleep .ear.l{transform:translateY(215px) rotate(-14deg)}
.capture.is-sleep .ear.r{transform:translateY(215px) rotate(14deg)}
.capture.is-sleep .ear{transition-duration:.8s}
.capture.is-sleep #glint{opacity:.45}
.z{font-family:Unbounded,sans-serif;font-weight:500;fill:var(--ink2);opacity:0}
.capture.is-sleep .z{animation:zzz 3.6s ease-out infinite}
.capture.is-sleep .z:nth-of-type(2){animation-delay:1.2s}.capture.is-sleep .z:nth-of-type(3){animation-delay:2.4s}
/* мелкие радости: блик от пальца, пузырь во сне, «пф» при отмене, облизывание на «Готово», привет за день */
.ripple{fill:none;stroke:#fff;stroke-width:2.5;vector-effect:non-scaling-stroke;transform-box:fill-box;transform-origin:center;opacity:0;pointer-events:none}
.bubble{transform-box:fill-box;transform-origin:15% 15%;opacity:0;transform:scale(.1);pointer-events:none}
.bubble circle{fill:rgba(255,255,255,.16);stroke:rgba(255,255,255,.6);stroke-width:1.5}
.bubble .bubble-hi{fill:#fff;stroke:none;opacity:.85}
@keyframes bubble{0%,100%{transform:scale(.25);opacity:.9}45%{transform:scale(1.04,.96);opacity:1}55%{transform:scale(.97,1.03)}}
.capture.is-sleep .bubble{animation:bubble 5s ease-in-out .9s infinite}
.puff{fill:#fff;stroke:rgba(80,50,20,.2);stroke-width:1;pointer-events:none}
@keyframes snortN{0%,100%{transform:none}25%{transform:scale(1.22,1.3)}}
[data-snort] .nostril{animation:snortN .45s ease-out}
/* «пых»: нос сжимается и вздрагивает (как на сайте, site/corgi.css); при reduce .life гасит правило ниже */
@keyframes snortShake{0%,100%{transform:none}14%{transform:translateY(2.5px) scale(1.02,.96)}34%{transform:translate(-2.2px,-1px) rotate(-1deg)}54%{transform:translate(1.8px,0) rotate(.7deg)}76%{transform:translateX(-.7px)}}[data-snort] .life{animation:snortShake .42s ease-out}
/* язык — отдельный слой поверх рисунка; ход задаёт corgi.js (lick), здесь только вид и место */
.snout .tongue{position:absolute;display:block;opacity:0;pointer-events:none;transform-origin:50% 100%;will-change:transform,opacity}
.snout .tongue-sway{transform-origin:50% 100%;will-change:transform}
.tongue-body{fill:url(#tongueG)}.tongue-shade{fill:#000;opacity:.16}.tongue-line{stroke:#a63c51;stroke-width:3;stroke-linecap:round;fill:none;opacity:.45}.tongue-hi{fill:#fff;opacity:.4}
@keyframes wet{0%,100%{opacity:var(--glint-op)}35%{opacity:1}}
[data-lick] .bob{animation:wet .6s ease-out .9s}
/* запись: кивок «угу» дважды */
@keyframes nod{0%,100%{transform:none}22%{transform:translateY(7px) rotate(.6deg)}44%{transform:none}66%{transform:translateY(5px)}}
.capture.is-recording[data-nod] .head{animation:nod .65s ease-in-out}
.drop ellipse{fill:rgba(255,255,255,.22);stroke:rgba(255,255,255,.55);stroke-width:1}.drop-hi{fill:#fff;opacity:.9}.drop{pointer-events:none}
.heart{fill:var(--accent);pointer-events:none}
@keyframes peek{0%,100%{transform:none}35%,60%{transform:translateY(-120px) rotate(5deg)}}
@keyframes peekR{0%,100%{transform:none}35%,60%{transform:translateY(-120px) rotate(-5deg)}}
[data-hello] .ear.l .ear-k{animation:peek 1.3s cubic-bezier(.3,.8,.3,1) both}
[data-hello] .ear.r .ear-k{animation:peekR 1.3s cubic-bezier(.3,.8,.3,1) 60ms both}
[data-hello] .life{animation:tease 1.6s ease-out}
[data-hello] .nostril{animation:flare 1.6s ease-out}
@media (prefers-reduced-motion:reduce){.life,[data-tease] .life,.capture.is-sniffing .life,.capture.is-sleep .life,.nostril,.z,.ear-k,.bubble,.head{animation:none!important}.ear,.head{transition-duration:.01s!important;transition-delay:0s!important}.capture.is-sleep .z:nth-of-type(2){opacity:.6}}
.plus-link{color:var(--ink);border-color:var(--ink2)}@media (hover:hover){.plus-link:hover{background:var(--card)}}

/* === раскладка и состояния из демо (шаг 3) === */
/* раскладка демо в Telegram: шапка, список-карточки, блок записи прижат к низу, морда в край */
html[data-theme] .telegram-mode .showcase{display:block;height:auto;min-height:0;padding:0;overflow:visible}
html[data-theme] .telegram-mode .app{display:flex;flex-direction:column;width:100%;max-width:480px;height:100vh;height:var(--tg-viewport-stable-height,100dvh);min-height:0;margin:0 auto;padding:0;border:0;border-radius:0;box-shadow:none;overflow:hidden;overflow:clip;background:var(--paper)}
html[data-theme] .app-header{flex-shrink:0;padding:calc(16px + var(--tg-safe-area-inset-top,0px) + var(--tg-content-safe-area-inset-top,0px)) var(--gutter) 6px}
html[data-theme] .app-header .wordmark{font-family:Unbounded,sans-serif;font-weight:700;font-size:26px;letter-spacing:-.04em;line-height:1}
html[data-theme] .header-actions{gap:8px}
@media (max-width:359px){html[data-theme] .app-header{padding-left:12px;padding-right:12px}html[data-theme] .header-actions{gap:4px}html[data-theme] .plus-link{padding:0 12px}}
html[data-theme] .icon-btn,html[data-theme] .settings-icon{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--line);background:transparent;color:var(--ink);display:grid;place-items:center}
html[data-theme] .plus-link{position:relative;height:36px;min-height:0;padding:0 18px;border-radius:22px;border:1.5px solid var(--ink);background:transparent;color:var(--ink);font-weight:700;font-size:12px;letter-spacing:.1em}
html[data-theme] .plus-link::after{content:"";position:absolute;inset:-5.5px 0}
html[data-theme] .plus-link>span{display:none}
html[data-theme] .upcoming{flex:1 1 auto;min-height:0;overflow:auto;margin:0;padding:42px var(--gutter) 12px}
html[data-theme] .upcoming .section-heading{margin:0 4px 10px;line-height:18px}
html[data-theme] .upcoming .section-heading h2{font-family:inherit;font-weight:500;font-size:.875rem;line-height:18px;letter-spacing:0;color:var(--ink2)}
html[data-theme] .upcoming .section-heading>span{font-weight:500;font-size:.875rem;color:var(--ink2);font-variant-numeric:tabular-nums}
html[data-theme] .reminder-scroll{max-height:none;overflow:visible;padding:0}
html[data-theme] .reminder-list{display:flex;flex-direction:column;gap:8px}
html[data-theme] .reminder-row{display:flex;gap:14px;align-items:center;min-height:64px;padding:12px 12px 12px 16px;border:0;border-radius:18px;background:var(--card);color:var(--ink);box-shadow:0 1px 0 var(--line),0 6px 14px -10px var(--shade)}
html[data-theme] .reminder-time{flex:none;min-width:3.1em;font-weight:600;font-size:1.0625rem;color:var(--accent);font-variant-numeric:normal}
html[data-theme] .reminder-hours{display:inline-block;min-width:1.4em;text-align:right}
html[data-theme] .reminder-time.h12{min-width:5.4em} /* «AM/PM» разной ширины: общий столбец, чтобы названия начинались с одного места */
html[data-theme] .reminder-title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;overflow-wrap:anywhere;font-weight:500;font-size:1rem;line-height:1.3;white-space:normal}
html[data-theme] .reminder-meta{font-size:.8125rem;line-height:1.35;color:var(--ink2);margin-top:2px}
html[data-theme] .reminder-item.is-deleting .reminder-row{box-shadow:none} /* тень снята до ухода: анимация строки — только transform/opacity */
html[data-theme] .reminder-chevron{flex:none;display:block;width:20px;height:20px;color:var(--ink2)}
html[data-theme] .reminder-chevron svg{display:block}
@media (hover:hover){html[data-theme] .reminder-row:hover .reminder-title{color:inherit}}
html[data-theme] .capture{--capture-shift:50px;--nose-shift:20px;display:flex;flex-direction:column;align-items:center;flex-shrink:0;margin-top:auto;padding:0 0 var(--tg-safe-area-inset-bottom,env(safe-area-inset-bottom,0px));border:0;background:none;text-align:center;position:relative}
html[data-theme] .capture::before{content:"";position:absolute;inset:auto -40px -40px;height:420px;background:radial-gradient(260px 170px at 50% calc(100% - 42px - min(42.5vw,204px) - var(--tg-safe-area-inset-bottom,env(safe-area-inset-bottom,0px))),var(--glow),transparent 72%);pointer-events:none}
html[data-theme] .capture-heading{order:1;height:auto;padding:0;gap:0;display:block;width:100%}
html[data-theme] .capture-heading h2{font-family:Unbounded,sans-serif;font-weight:500;font-size:1.875rem;letter-spacing:-.035em;line-height:1.05;margin:0 0 8px;padding-inline:16px;text-wrap:balance}
html[data-theme] .capture-heading .capture-subtitle{height:20px;margin:0;font-size:.875rem;line-height:20px;color:var(--ink2)}
html[data-theme] .capture-controls{order:2;flex:none;min-height:0;height:auto;padding:0;overflow:visible;width:100%}
html[data-theme] .voice-caption{display:none!important}
html[data-theme] .text-button{display:inline-flex;width:auto;gap:10px;margin:14px 0 0;height:44px;min-height:0;padding:0 20px;border-radius:22px;border:1.5px solid var(--line);background:transparent;color:var(--ink);font-weight:500;font-size:1rem}
html[data-theme] .text-button svg{width:22px;height:22px}
html[data-theme] .text-button>span:nth-child(2){flex:none}
html[data-theme] .text-button .button-arrow{display:none}
/* The transparent top of the snout overlaps the controls; its nose stays below them. */
html[data-theme] .nose-stage{order:3;width:100%;max-width:480px;margin:calc(4px + var(--nose-shift) - var(--capture-shift) + 14px) auto calc(-1 * var(--nose-shift))}
/* На низких экранах нос уезжает ниже, поэтому «Или напиши текстом» поднимаем сильнее: зазор 8–12 px. */
html[data-theme]:where(.h-le-680) .nose-stage{margin-top:calc(4px + var(--nose-shift) - var(--capture-shift) + 36px)}
html[data-theme] .nose-stage .nose-button.snout{width:100%;max-width:480px;height:auto;aspect-ratio:390/250;margin:0 auto}
html[data-theme] .telegram-mode .app-footer:empty{display:none}
html[data-theme] body:not(.telegram-mode) .capture{order:1} /* демо: ссылка и подвал встают под список, корги их не закрывает */
html[data-theme] body:not(.telegram-mode) .app-footer{margin-bottom:14px}
html[data-theme]:where(.h-le-680) .capture-heading h2{font-size:1.625rem}html[data-theme]:where(.h-le-680) .text-button{margin-top:8px}
html[data-theme] .capture-heading .capture-subtitle{height:auto;min-height:20px;font-variant-numeric:tabular-nums}
.capture-subtitle b{color:var(--accent);font-weight:600}
html[data-theme] .capture-controls{min-height:80px}
html[data-theme]:where(.h-le-680) .capture-controls{min-height:52px}
/* With the caption visible, narrow screens need a smaller offset and tighter control gaps to keep the entire nose clear. */
@media (max-width:430px){html[data-theme]:where(:not(.h-le-680)) .capture{--capture-shift:42px;--nose-shift:min(20px,calc(4.675vw - .5px))}html[data-theme]:where(:not(.h-le-680)) .capture-controls{min-height:64px}html[data-theme]:where(:not(.h-le-680)) .text-button{margin-top:4px}}
.capture-heading h2,#open-text{transition:opacity .2s,transform .2s}
.capture.is-recording .capture-heading h2,.capture.is-sniffing .capture-heading h2{opacity:.35;transform:scale(.96)}
.capture.is-sniffing #open-text{opacity:0;transform:translateY(6px);pointer-events:none}
html[data-theme] .speech-capsule,html[data-theme] #finish-recording,html[data-theme] #recording-disclosure,html[data-theme] #recording-error{display:none!important}
html[data-theme] .recording-actions{display:flex;justify-content:center;margin:14px 0 0}
html[data-theme] #cancel-recording{height:44px;min-height:0;padding:0 20px;border-radius:22px;border:1.5px solid var(--line);background:transparent;color:var(--ink);font-weight:500;font-size:15px}
html[data-theme] .voice-result{background:var(--card);color:var(--ink);border:1.5px solid var(--accent);border-radius:18px;box-shadow:0 1px 0 var(--line),0 6px 14px -10px var(--shade)}
html[data-theme] .voice-result form input{background:var(--paper);border:1.5px solid var(--line);color:var(--ink)}
html[data-theme] .voice-result #edit-inline-voice,html[data-theme] .voice-result-top button{color:var(--ink2)}
html[data-theme] .voice-result-top>span{color:var(--accent)}
html[data-theme] .form-error{color:var(--accent)}
.fly{position:fixed;z-index:20;pointer-events:none;background:var(--card);color:var(--ink);border-radius:18px;padding:12px 16px;font-weight:500;font-size:15px;box-shadow:0 18px 30px -12px var(--shade);border:1.5px solid var(--accent);box-sizing:border-box;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html[data-theme] .snout svg{overflow:visible} /* уши в покое уходят ниже края экрана, .app их обрезает, как в демо */
html[data-theme] .toast{background:var(--card);color:var(--ink);border:1.5px solid var(--line);box-shadow:0 18px 30px -12px var(--shade)}html[data-theme] .toast button{color:var(--accent)}

/* === окна (шаг 6): те же бумага, карточки и акцент, что на главном экране === */
html[data-theme] dialog{background:var(--paper);color:var(--ink);border:1.5px solid var(--line);box-shadow:0 -12px 40px -16px var(--shade)}
html[data-theme] .sheet-handle::before{background:var(--line)}
html[data-theme] .sheet-header,html[data-theme] .date-actions{background:var(--paper)}
html[data-theme] .sheet-header{box-shadow:0 -12px 0 var(--paper)} /* закрывает полосу 12px над липкой шапкой: туда просвечивал заголовок */
html[data-theme] .icon-button{background:var(--card);color:var(--ink);border:1.5px solid var(--line)}
html[data-theme] dialog h2{font-family:Unbounded,sans-serif;font-weight:500;letter-spacing:-.035em;color:var(--ink)}
html[data-theme] .eyebrow,html[data-theme] .field-note,html[data-theme] .snooze-heading,html[data-theme] .sheet-footnote,html[data-theme] .quiet-button,html[data-theme] .sheet-view label{color:var(--ink2)}
@media (hover:hover){html[data-theme] .quiet-button:hover{color:var(--ink)}}
html[data-theme] .sheet-view textarea,html[data-theme] .sheet-view input,html[data-theme] .sheet-view select{background:var(--card);color:var(--ink);border:1.5px solid var(--line)}
html[data-theme] .sheet-view textarea::placeholder,html[data-theme] .sheet-view input::placeholder{color:var(--ink2)}
html[data-theme] .sheet-view textarea:focus,html[data-theme] .sheet-view input:focus,html[data-theme] .sheet-view select:focus{outline:none;border-color:var(--accent)}
html[data-theme] .primary-button{background:var(--accent);color:var(--paper)}
@media (hover:hover){html[data-theme] .primary-button:hover{background:var(--accent);filter:brightness(1.06)}}
html[data-theme] .primary-button:disabled{background:var(--line);color:var(--disabled-ink);filter:none}
html[data-theme] .secondary-button,html[data-theme] .text-examples button{background:var(--card);color:var(--ink);border:1.5px solid var(--line);box-shadow:0 1px 0 var(--line)}
@media (hover:hover){html[data-theme] .secondary-button:hover,html[data-theme] .text-examples button:hover{border-color:var(--accent);color:var(--ink)}}
html[data-theme] .suggest-chip[aria-pressed="true"]{border-color:var(--accent);color:var(--accent)}html[data-theme] .suggest-chip[aria-pressed="true"]::before{content:"✓ "}
html[data-theme] .confirmation-card,html[data-theme] .preset-preview{background:var(--card);color:var(--ink);border:1.5px solid var(--line);box-shadow:0 1px 0 var(--line),0 6px 14px -10px var(--shade)}
html[data-theme] .confirmation-card h3{color:var(--ink)}
html[data-theme] .confirmation-time,html[data-theme] .detail-date{color:var(--accent);font-weight:600}
html[data-theme] .date-field{background:var(--card);color:var(--ink);border:1.5px solid var(--line)}
html[data-theme] .date-field svg{color:var(--accent)}
@media (hover:hover){html[data-theme] .date-field:hover{border-color:var(--accent)}}
html[data-theme] .date-field:focus-visible{outline:2px solid var(--accent)}
html[data-theme] .date-header button{background:var(--card);color:var(--ink);border:1.5px solid var(--line)}
html[data-theme] .date-shortcuts button,html[data-theme] .date-times button{background:var(--card);color:var(--ink);border:1.5px solid var(--line)}
html[data-theme] .date-shortcuts .is-selected,html[data-theme] .date-times .is-selected{background:var(--card);border-color:var(--accent);color:var(--accent);font-weight:600}
html[data-theme] .date-month-row button,html[data-theme] .date-day{color:var(--ink)}
html[data-theme] .date-weekdays,html[data-theme] .date-time label,html[data-theme] .date-time>span,html[data-theme] .date-timezone{color:var(--ink2)}
.date-chosen{display:none}
.date-picker.is-typing-time :is(.date-month-row,.date-weekdays,.date-grid){display:none}
.date-picker.is-typing-time .date-chosen{display:block;animation:boop-fade-in .2s ease-out;margin:18px 0 0;text-align:center;font-size:16px;font-weight:600;color:var(--ink,#eee)}
.date-chosen::first-letter{text-transform:uppercase}
html[data-theme] .date-time input{background:var(--card)!important;color:var(--ink)!important;border:1.5px solid var(--line)!important}
html[data-theme] .reminder-scroll{scrollbar-color:var(--line) transparent}
html[data-theme] .reminder-scroll:focus-visible{outline:none}
html[data-theme].kb-nav .reminder-scroll:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;border-radius:12px}
/* блик-боб: резкий верх, мягкий низ, градиент вместо размытия; правый тусклее; ночью меньше и тусклее */
.bob{fill:url(#bobG);opacity:var(--glint-op)}.bob.b2{opacity:calc(var(--glint-op)*.6)}
[data-theme=night] .bob{transform:scale(.8);transform-box:fill-box;transform-origin:50% 35%}
/* === шаг 8: тост не закрывает нос, мелкие подписи читаемы, кнопка Plus не липнет к линии === */
html[data-theme] .toast{top:calc(8px + var(--safe-top));bottom:auto;left:var(--gutter);right:var(--gutter);width:auto;max-width:448px;margin:0 auto;transform:none;justify-content:space-between;padding:4px 4px 4px 16px;font-size:14px}
html[data-theme] .eyebrow{font-size:11px;letter-spacing:1.2px}
html[data-theme] .date-timezone{font-size:11px}
html[data-theme] #plus-try-voice{margin-bottom:16px}
html[data-theme] .app-footer button{color:var(--accent)}
html[data-theme] .snout:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:24px}
/* === шаг 9: аудит impeccable — цели касания 44 px в календаре, номера Plus 11 px, витрина без колонки концепта === */
html[data-theme] .date-shortcuts button,html[data-theme] .date-times button{min-height:44px}
html[data-theme] .plus-feature>span{font-size:11px}
html[data-theme] .showcase{grid-template-columns:min(420px,100%);justify-content:center}
/* === шаг 10: зазор под списком, новая строка сверху, микрофон в поле карточки === */
html[data-theme] .upcoming{margin-bottom:12px;padding-bottom:24px;-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 64px),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 64px),transparent)}html[data-theme] .upcoming .reminder-list{padding-bottom:64px}
html[data-theme] .reminder-row.is-new{outline:1.5px solid var(--accent);outline-offset:-1.5px}
html[data-theme] .field-mic{position:relative}
html[data-theme] .voice-result form .field-mic input{padding-right:52px}
html[data-theme] .field-mic-button{position:absolute;right:2px;top:50%;transform:translateY(-50%);width:44px;height:44px;display:grid;place-items:center;padding:0;border:0;border-radius:12px;background:none;color:var(--ink2);cursor:pointer}
html[data-theme] .field-mic-button svg{width:22px;height:22px}
html[data-theme] .field-mic-button[aria-pressed=true]{color:var(--accent)}
html[data-theme] .field-mic-button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
/* QA: пока открыта форма черновика, «Напиши текстом» уступает место списку, кнопка «Готово» видна целиком */
html[data-theme] main.app:has(.voice-result-slot.has-result #inline-voice-form:not([hidden])) #open-text{display:none}
html[data-theme] main.app:has(.voice-result-slot.has-result #inline-voice-form:not([hidden])) .capture-controls{min-height:0}
html[data-theme]:where(.h-le-700) .date-shortcuts button{flex:1 1 auto;padding-inline:8px}
/* QA: в черновике и при ошибке текст строки карточки уже говорит пёс под заголовком; карточка плотнее, чтобы «Готово» влезла в Telegram на iPhone */
html[data-theme] main.app:has(#capture.is-asking) #inline-voice-note,html[data-theme] main.app:has(#capture.is-confused) #inline-voice-note{display:none}
html[data-theme] .voice-result #inline-voice-form{margin-top:12px}
/* B8: карточка голосового въезжает дробным translateY, и getBoundingClientRect даёт 43.99998 при min-height:44px. 0,1px запаса держит высоту касания не меньше 44px. */
html[data-theme] #retry-voice{min-height:44.1px}
html[data-theme] .voice-result form label{margin:8px 0 5px}
/* QA: сбой отправки с «Повторить» лежал под мордой пса; пока в подвале есть кнопка, он плашка над псом */
html[data-theme] .telegram-mode .app-footer:has(button){position:fixed;left:var(--gutter);right:var(--gutter);bottom:calc(14px + var(--safe-bottom));z-index:40;flex-wrap:wrap;justify-content:center;gap:2px 10px;padding:8px 12px;font-size:13px;line-height:1.35;text-align:center;color:var(--ink);background:var(--card);border:1.5px solid var(--line);border-radius:18px;box-shadow:0 18px 30px -12px var(--shade)}
html[data-theme] .telegram-mode .app-footer:has(button) button{min-height:44px;font-size:14px;font-weight:600;text-decoration:none}
html[data-theme] .app-footer button.footer-alt{color:var(--ink2)}
html[data-theme] .telegram-mode .app-footer:has(.footer-alt){flex-wrap:nowrap;column-gap:4px;padding-left:8px;padding-right:8px}
/* Плашка сбоя стоит над носом (bottom ставит app.js) на месте строки «Или напиши текстом»; её прячем без сдвига вёрстки. */
html[data-theme] .telegram-mode:has(main>.app-footer button) :is(#open-text,#mic-hint){visibility:hidden}
/* В открытом листе плашка встаёт в поток под полями: fixed закрывал нижние поля листа. */
html[data-theme] .telegram-mode #sheet .app-footer:has(button){position:static;margin:12px 0 0;box-shadow:none}
/* Часы и минуты — две капсулы «− 09 +» по центру, а не кнопки по краям экрана */
html[data-theme] .time-stepper{display:flex;align-items:center;justify-content:stretch;gap:8px;width:100%}
html[data-theme] .stepper{flex:1 1 0;gap:0;padding:0;height:50px;box-sizing:border-box;min-width:0;background:var(--card);border:1.5px solid var(--line);border-radius:14px}
html[data-theme] .stepper button{background:none;color:var(--accent);border:0;width:44px;height:44px;min-height:44px;padding:0;font-size:22px;font-weight:500;line-height:1}
html[data-theme] .stepper output{flex:1 1 auto;width:auto;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;font:500 20px/25px Onest,sans-serif;font-variant-numeric:tabular-nums}
/* A3: en/es/fil: AM/PM под часом. flex-центр держит текст по середине, даже когда он шире поля (узкие тихие часы). */
html[data-theme] .stepper output:has(small){line-height:20px}
html[data-theme] .stepper output small{font-size:11px;line-height:13px;color:var(--ink2);white-space:nowrap}
html[data-theme] .stepper-colon{font:500 20px/25px Onest,sans-serif;color:var(--muted)}
html[data-theme] .unit-seg span{background:var(--card);color:var(--ink);border:1.5px solid var(--line)}
html[data-theme] .unit-seg input:checked+span{background:var(--accent);border-color:var(--accent);color:var(--paper)}
html[data-theme] .repeat-chip[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--paper)}
html[data-theme] .sheet-view select,html[data-theme] .sheet-view .repeat-menu-btn{appearance:none;-webkit-appearance:none;padding-right:44px;background-repeat:no-repeat;background-position:right 16px center;background-size:20px 20px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M5 9l7 7 7-7' stroke='%23b0451a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
html[data-theme=night] .sheet-view select,html[data-theme=night] .sheet-view .repeat-menu-btn{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M5 9l7 7 7-7' stroke='%23f2b56b' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
/* Выключатели звука и вибрации в настройках: нативный checkbox с role=switch */
/* Звук и вибрация: строки на всю ширину в одной карточке; вся строка (label) нажимается. Переключатель 52x32, выкл. — --toggle-off. */
html[data-theme] .pref-toggles{display:block;border:1.5px solid var(--line);border-radius:18px;background:var(--card);overflow:hidden}
html[data-theme] .sheet-view .pref-toggles .pref-toggle{border:0;border-radius:0;background:none}
html[data-theme] .sheet-view .pref-toggles .pref-toggle+.pref-toggle{border-top:1px solid var(--line)}
html[data-theme] .sheet-view .pref-toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px;margin:0;padding:0 16px;border-radius:16px;border:1.5px solid var(--line);background:var(--card);color:var(--ink);font-size:16px;cursor:pointer}
html[data-theme] .sheet-view .pref-toggle input{appearance:none;-webkit-appearance:none;position:relative;flex:none;width:52px;height:32px;min-height:0;margin:0;padding:0;border:0;border-radius:16px;background:var(--toggle-off);cursor:pointer;transition:background .2s}
html[data-theme] .sheet-view .pref-toggle input::after{content:"";position:absolute;top:3px;left:3px;width:26px;height:26px;border-radius:50%;background:var(--knob);box-shadow:0 1px 3px #0000004d;transition:transform .2s,background .2s}
html[data-theme] .sheet-view .pref-toggle input:checked{background:var(--accent)}
html[data-theme] .sheet-view .pref-toggle input:checked::after{transform:translateX(20px);background:var(--on-accent);box-shadow:none}
html[data-theme] .sheet-view .pref-toggle span{min-width:0}
@media (prefers-reduced-motion:reduce){html[data-theme] .sheet-view .pref-toggle input,html[data-theme] .sheet-view .pref-toggle input::after{transition:none}}
/* === редизайн 15.10: удаление красным, чипы повтора одной сеткой, демо-ссылки 12 px === */
html[data-theme] .quiet-button.danger-button{color:var(--danger);margin-top:16px}
html[data-theme] .repeat-chips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
html[data-theme] .repeat-chip{padding:8px 4px;white-space:nowrap}
.chat-example-link{font-size:12px}
#sheet-title:focus{outline:none}
html,body,dialog{overscroll-behavior:none}.upcoming{overscroll-behavior-y:contain} /* T10: экран и шторки (настройки, карточка) не отскакивают; список держит прокрутку у себя */
html[data-theme] .app-grab{position:fixed;z-index:30;top:var(--tg-safe-area-inset-top,0px);left:calc(50% - 60px);width:120px;height:max(44px,var(--tg-content-safe-area-inset-top,44px))}html[data-theme] .app-grab::before{content:"";position:absolute;top:50%;left:calc(50% - 17px);width:34px;height:4px;margin-top:-2px;border-radius:4px;background:var(--ink2);opacity:.35}html[data-theme] .app-grab[hidden]{display:none}
/* === полировка 16.10: всё, что сверху, ниже кнопок Telegram «Закрыть» и «Свернуть» ===
   В fullscreen Telegram верх контента = системная зона + зона своих кнопок, их надо складывать, а не брать max. */
html[data-theme]{--tg-top:max(env(safe-area-inset-top,0px),calc(var(--tg-safe-area-inset-top,0px) + var(--tg-content-safe-area-inset-top,0px)))}
/* Тост с «Вернуть» стоит в постоянном месте между шапкой и списком: строки начинаются ниже него. */
html[data-theme] .toast{top:calc(72px + var(--tg-top))}
/* Настройки переноса — длинный экран: на весь экран, шапка липнет под кнопками Telegram на фоне листа */
/* Настройки без прокрутки на обычных iPhone: лишние поля скрыты. */
html[data-theme] #settings-view .preset-preview{display:none}
/* Невысокий экран (iPhone 15–17, не Pro Max): чуть ниже ряды, кнопки не меньше 44 px — минимум Apple для касания. */
html[data-theme]:where(.h-le-900) .telegram-mode #settings-view .interval-rows{gap:8px}
html[data-theme]:where(.h-le-900) .telegram-mode #settings-view .interval-row>input{height:50px;min-height:50px}
html[data-theme]:where(.h-le-900) .telegram-mode #settings-view .time-stepper button{height:44px;min-height:44px}
html[data-theme]:where(.h-le-900) .telegram-mode #settings-view>form+.settings-label{margin-top:22px}
/* Календарь в Telegram прижат к верху под кнопками «Закрыть»/«Свернуть»: по центру он прыгал, когда Telegram с опозданием ужимал экран под клавиатуру */
html[data-theme] .date-time input::selection{background:color-mix(in srgb,var(--accent) 22%,transparent);color:inherit}
/* Появление: лист выезжает снизу, календарь мягко проявляется, настройки из листа плавно раскрываются на весь экран */
@media (prefers-reduced-motion:no-preference){
html[data-theme] #sheet[open]::backdrop,html[data-theme] .date-picker[open]::backdrop{animation:boop-fade-in .18s ease-out}
html[data-theme] .date-picker[open]{animation:boop-pop-in .18s cubic-bezier(.2,.8,.2,1)}
/* Первый (невидимый) кадр открытия без содержимого: date-picker.js и app.js (showView) показывают его следующим кадром. */
html[data-theme] .date-picker.is-opening .date-content,html[data-theme] #sheet.is-opening .sheet-view{display:none}
html[data-theme] .date-picker.is-closing::backdrop{animation:boop-fade-out .18s ease-in forwards}
}
/* Пока лист входит, его содержимое не ловит тап: палец, оставшийся от открытия, не должен нажать «Удалить». */
html[data-theme] #sheet[data-opening="1"] .sheet-view{pointer-events:none}
@keyframes boop-full-in{from{transform:translateY(40px);opacity:.5}}
@keyframes boop-pop-in{from{transform:scale(.96);opacity:0}}
@keyframes boop-fade-in{from{opacity:0}}
::view-transition-old(root),::view-transition-new(root){animation-duration:.3s}
@media (prefers-reduced-motion:reduce){html[data-theme] #sheet[open],html[data-theme] .date-picker[open]{animation:boop-fade-in .2s ease-out!important}}
/* Кнопка «Напиши текстом» над сценой носа: сцена заходит на неё сверху на 26 px, и на маленьких экранах нижняя половина кнопки ловила тап носом */
html[data-theme] .text-button{position:relative;z-index:2}
/* Настройки: звук и вибрация в одну строку, разделы с одинаковыми подписями */
html[data-theme] .sheet-view .settings-label{margin:22px 0 4px;line-height:16px;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink2)}
html[data-theme] #settings-view>.settings-label:first-child{margin-top:4px}
html[data-theme] #settings-view>form+.settings-label{margin-top:22px}
html[data-theme] .sheet-view .settings-lead,html[data-theme] #settings-tomorrow-label+.field-note{margin:0 0 10px}
/* «Сохранить настройки» всегда под рукой: липнет к низу и закрывает прокручиваемое под ним кольцом цвета листа */
html[data-theme] .plus-feature .soon{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:999px;border:1px solid var(--line);font-style:normal;font-size:11px;font-weight:500;color:var(--ink2);vertical-align:2px}
/* Разбор 2.1.1: «На очереди» стоит на месте, прокручивается только список; сверху и снизу мягкое затухание */
html[data-theme] .upcoming{display:flex;flex-direction:column;overflow:hidden;padding-bottom:0;-webkit-mask-image:none;mask-image:none}
html[data-theme] .upcoming .section-heading{flex-shrink:0;margin-bottom:0}
html[data-theme] .reminder-scroll{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior-y:contain;margin:0 calc(-1*var(--gutter));padding:10px var(--gutter) 0;scroll-padding:12px 0 64px;-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 64px),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 64px),transparent)}
html[data-theme] .reminder-scroll.is-scrolled{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 36px,#000 calc(100% - 64px),transparent);mask-image:linear-gradient(to bottom,transparent,#000 36px,#000 calc(100% - 64px),transparent)}
/* 2.1.3: пока набираешь интервал, «Сохранить» стоит на своём месте и не ложится на поля над клавиатурой */
/* 2.1.4: плашка снизу, у пальца, и не закрывает шапку */
/* В листе тост по-прежнему снизу; на главной — под шапкой, чтобы не лежать на носу и не перехватывать тап. */
html[data-theme] #sheet .toast{top:auto;bottom:calc(12px + var(--safe-bottom))}
html[data-theme] #sheet .toast.is-top{top:calc(72px + var(--tg-top));bottom:auto}
html[data-theme] .toast{pointer-events:none}
html[data-theme] .toast button{pointer-events:auto}
/* 2.2.1: пока пёс разбирает фразу, блок под носом держит высоту, заголовок не прыгает; схлопывается, только когда открыта форма черновика */
html[data-theme] main.app:has(.voice-result-slot.has-result) #open-text{visibility:hidden}
/* 2.2.7: подложка свайпа на 1 px внутри строки, красная кайма в скруглённых углах не видна */
.reminder-item.is-swiping{background:none}
.reminder-item.is-swiping::before{content:"";position:absolute;inset:1px;border-radius:17px;background:#e5484d}
/* 2.2.8: фон гаснет вместе с уезжающим окном; сам уезжающий лист не перехватывает тап по списку */
html[data-theme] #sheet.is-closing,html[data-theme] #sheet.is-closing::backdrop{pointer-events:none}
html[data-theme] #sheet.is-closing::backdrop{animation:boop-fade-out .22s ease-in forwards}
@keyframes boop-fade-out{to{opacity:0}}
/* 3.3: на низких экранах мордочка уходит ниже за край, заголовок мельче, в списке помещается больше дел */
html[data-theme]:where(.h-le-620) .capture{--capture-shift:120px;--nose-shift:90px}html[data-theme]:where(.h-le-620) #nose{transform:scale(.68);transform-origin:top center}html[data-theme]:where(.h-le-620) .capture-heading h2{font-size:1.375rem;margin-bottom:4px}html[data-theme]:where(.h-le-620) .upcoming{padding-top:8px}html[data-theme]:where(.h-le-620) .upcoming .reminder-list{padding-bottom:36px}html[data-theme]:where(.h-le-620) .reminder-scroll,html[data-theme]:where(.h-le-620) .reminder-scroll.is-scrolled{-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 36px),transparent)}
/* 17.10.2026 полировка: отклик нажатия, без blur, шрифт от 11px, тап-зоны 44px, затухание списка без маски */
html[data-theme] button:not(.nose-button):not(:disabled):active,html[data-theme] .date-field:active{scale:.97}
html[data-theme] dialog::backdrop,html[data-theme] .date-picker::backdrop{-webkit-backdrop-filter:none;backdrop-filter:none}
html[data-theme] #inline-voice-status,html[data-theme] .voice-result form label,html[data-theme] .ai-label,html[data-theme] .field-note.voice-disclosure,html[data-theme] .sheet-footnote{font-size:11px}
html[data-theme] .date-picker .date-shortcuts button,html[data-theme] .date-picker .date-times button,html[data-theme] .date-picker .date-day{min-height:44px}
html[data-theme] .reminder-scroll,html[data-theme] .reminder-scroll.is-scrolled{-webkit-mask-image:none;mask-image:none}
html[data-theme] .upcoming{position:relative}
html[data-theme] .upcoming::after{content:'';position:absolute;left:0;right:0;bottom:0;height:36px;background:linear-gradient(to bottom,transparent,var(--paper));pointer-events:none}
html[data-theme] .reminder-scroll::before{content:'';position:sticky;top:-10px;display:block;height:36px;margin:-10px 0 -26px;background:linear-gradient(to bottom,var(--paper),transparent);pointer-events:none;z-index:2;opacity:0;transition:opacity .2s}
html[data-theme] .reminder-scroll.is-scrolled::before{opacity:1}
/* Лист: контент уходит под липкие шапку и подвал плавно, как список на главной. Классы ставит app.js (edge). */
html[data-theme] #sheet .sheet-header::after{content:'';position:absolute;left:0;right:0;top:100%;height:24px;background:linear-gradient(to bottom,var(--sheet),transparent);pointer-events:none;opacity:0;transition:opacity .2s}
html[data-theme] #sheet.is-scrolled .sheet-header::after{opacity:1}
html[data-theme] .date-picker .date-header::after{content:'';position:absolute;left:0;right:0;top:100%;height:24px;background:linear-gradient(to bottom,var(--sheet),transparent);pointer-events:none;opacity:0;transition:opacity .2s;z-index:1}
html[data-theme] .date-picker.is-scrolled .date-header::after{opacity:1}
html[data-theme] #sheet .sheet-foot::before{content:'';position:absolute;left:0;right:0;bottom:100%;height:28px;background:linear-gradient(to bottom,transparent,var(--sheet));pointer-events:none;transition:opacity .2s}
html[data-theme] #sheet.at-end .sheet-foot::before{opacity:0}
/* Вход в правку: пилюля в строке даты, заметна и в зоне большого пальца. */
html[data-theme] .detail-when{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:20px}
html[data-theme] .detail-when .detail-date{margin:0;min-width:0}
html[data-theme] .detail-edit{flex:none;display:inline-flex;align-items:center;gap:10px;height:44px;min-height:44px;padding:0 20px;border-radius:22px;border:1.5px solid var(--line2);background:transparent;color:var(--ink);font:500 16px Onest,sans-serif;cursor:pointer}
html[data-theme] .detail-edit svg{width:22px;height:22px;color:var(--accent)}
html[data-theme] #detail-text{cursor:pointer}
/* Настройки: остаток — карточка строк как .pref-toggles (название слева, число справа); «Данные и конфиденциальность» — одна строка-ссылка на политику. */
html[data-theme] .quota-left,html[data-theme] .settings-privacy{border:1.5px solid var(--line);border-radius:18px;background:var(--card);color:var(--ink);font-size:16px}
html[data-theme] .quota-left{list-style:none;display:block;margin:8px 0 0;padding:0;overflow:hidden}
html[data-theme] .quota-left li,html[data-theme] .settings-privacy{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px;padding:10px 16px}
html[data-theme] .quota-left li+li{border-top:1px solid var(--line)}
html[data-theme] .quota-left b{flex:none;color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
html[data-theme] .quota-left small{display:block;margin-top:2px;font-size:13px;line-height:18px;color:var(--ink2)}
html[data-theme] .settings-privacy{margin-top:22px;text-decoration:none}
html[data-theme] .settings-privacy svg{flex:none;width:20px;height:20px;color:var(--ink2)}
html[data-theme] .settings-mail{margin:12px 0 0;text-align:center;font-size:13px;line-height:1.4;color:var(--ink2)}
html[data-theme] .settings-mail b{font-weight:500;color:var(--ink);-webkit-user-select:text;user-select:text}

/* Карточка напоминания: спокойная раскладка, строка «Повтор» и окно #repeat-view (проход A) */
html[data-theme] #close-sheet{width:44px;height:44px}
html[data-theme] #detail-view .confirmation-card{background:none;border:0;box-shadow:none;padding:0;margin-top:4px}
html[data-theme] #detail-view .detail-when{margin-top:8px}
html[data-theme] #detail-view .detail-date{font-size:17px;font-variant-numeric:tabular-nums}
html[data-theme] .detail-edit{min-height:44px}
html[data-theme] .repeat-open,html[data-theme] .list-row,html[data-theme] .repeat-item{display:flex;align-items:center;gap:10px;width:100%;min-height:48px;margin:0;padding:0;background:none;border:0;color:var(--ink);font:inherit;font-size:16px;text-align:left;cursor:pointer}
html[data-theme] .repeat-open{margin-top:8px;min-height:56px;padding:0 16px;border:1.5px solid var(--line);border-radius:16px;background:var(--card)}
html[data-theme] .repeat-open>span:first-child,html[data-theme] .list-row>span:first-child{flex:1}
html[data-theme] .repeat-value{color:var(--ink2);font-size:15px}
html[data-theme] .timezone-current{max-width:58%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html[data-theme] #timezone-search{box-sizing:border-box;width:100%;min-height:48px;padding:10px 14px;border:1.5px solid var(--line);border-radius:16px;background:var(--card);color:var(--ink);font:inherit;font-size:16px}
html[data-theme] .timezone-option{justify-content:space-between;gap:12px}
html[data-theme] .timezone-option span{min-width:0;overflow-wrap:anywhere}
html[data-theme] .timezone-option small{flex:none;max-width:55%;color:var(--ink2);font-size:12px;overflow-wrap:anywhere;text-align:right}
html[data-theme] .row-chevron{color:var(--ink2);font-size:22px;line-height:1}
html[data-theme] #detail-view .nag-toggle{margin-top:8px}
html[data-theme] #detail-view .nag-note{font-size:13px}
html[data-theme] #complete-reminder{min-height:52px;height:52px;border-radius:22px;margin-top:16px;font-size:16px;font-weight:600}
html[data-theme] .snooze-heading{font-size:13px;font-weight:500;margin-top:16px;margin-bottom:0}
html[data-theme] .snooze-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin-top:8px}
html[data-theme] .snooze-grid .secondary-button{grid-column:span 2;min-height:44px;padding:8px 4px;font-size:14px;white-space:nowrap}
html[data-theme] .snooze-grid .secondary-button:nth-child(n+4){grid-column:span 3}
html[data-theme] .detail-extras{display:block;margin-top:16px}
html[data-theme] .detail-extras .list-row+.list-row{border-top:1px solid var(--line)}
html[data-theme] #detail-view .quiet-button.danger-button{min-height:48px;margin-top:8px;font-size:16px;font-weight:500}
html[data-theme] .repeat-item{padding:0 4px;border-radius:0}
html[data-theme] .repeat-item+.repeat-item{border-top:1px solid var(--line)}
html[data-theme] .repeat-dot{flex:none;width:20px;height:20px;border-radius:50%;border:2px solid var(--line);box-sizing:border-box}
html[data-theme] .repeat-item[aria-checked=true]{color:var(--accent);font-weight:600}
html[data-theme] .repeat-item[aria-checked=true] .repeat-dot{border-color:var(--accent);background:radial-gradient(circle,var(--accent) 0 4px,transparent 5px)}
/* UX-c: строка «Язык» в настройках (.repeat-open) и её список (.repeat-item). */
html[data-theme] .lang-open{margin:22px 0 0}html[data-theme] .lang-open>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}html[data-theme] .lang-open .row-chevron{transition:transform .18s ease-out}html[data-theme] .lang-open[aria-expanded=true] .row-chevron{transform:rotate(90deg)}
html[data-theme] .lang-list{margin:4px 0 0;padding:0 12px;animation:lang-in .18s ease-out}html[data-theme] .lang-list .repeat-item>span:first-child{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}html[data-theme] .lang-check{flex:none;visibility:hidden}html[data-theme] .lang-list [aria-checked=true] .lang-check{visibility:visible}
@keyframes lang-in{from{opacity:0;transform:translateY(-6px)}}@media (prefers-reduced-motion:reduce){html[data-theme] .lang-list{animation:none}html[data-theme] .lang-open .row-chevron{transition:none}}
html[data-theme] #repeat-note{margin-top:12px;font-size:13px}
html[data-theme] #repeat-view .quiet-button{min-height:48px;margin-top:8px}
html[data-theme] #sheet:has([aria-busy=true]) button{opacity:.6;pointer-events:none}
/* QA круг 2 */
/* 3: тихие часы влезают в 280 px, пока выключены — приглушены */
html[data-theme] .quiet-times{display:grid;grid-template-columns:max-content minmax(0,1fr);column-gap:12px;row-gap:8px;align-items:center;min-width:0;margin-top:8px}
html[data-theme] .quiet-row{display:contents}
html[data-theme] .quiet-row>span{width:auto;min-width:0;text-align:left}
html[data-theme] .quiet-row .time-stepper{width:100%;min-width:0;justify-content:stretch;gap:8px}
html[data-theme] .quiet-times.is-off{opacity:.45}
/* 4: таблица Plus на 320 и 360 */
@media (max-width:379px){html[data-theme] .plus-compare thead th{font-size:11px;padding-inline:2px;overflow-wrap:normal}html[data-theme] .plus-compare thead th:nth-child(2){padding-inline:0;white-space:nowrap}html[data-theme] .plus-compare thead th:last-child{padding:9px 2px;font-size:12px}html[data-theme] .plus-compare th,html[data-theme] .plus-compare td{min-width:0;overflow-wrap:anywhere}}
/* 5: ночью дорожка выключенного переключателя 3:1 к фону строки */
/* 9: длинное название на карточке не больше 4 строк */
html[data-theme] #detail-text{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;line-clamp:4;overflow:hidden;overflow-wrap:anywhere}

/* === редизайн v2, шаг 1: единый лист для всех окон ===
   На всю ширину, снизу, верх не ближе 44 px к краю экрана. Ручка и шапка липнут сверху, кнопка действия (.sheet-foot) липнет снизу. */
html[data-theme] dialog{--px:var(--gutter);position:fixed;inset:auto 0 0;margin:0 auto;width:100%;max-width:480px;max-height:calc(100dvh - 44px - var(--tg-top));padding:0 var(--gutter) calc(16px + var(--safe-bottom));border:0;border-radius:28px 28px 0 0;background:var(--sheet);box-shadow:var(--sheet-shadow),inset 0 1px 0 var(--line);overflow-x:hidden;overflow-y:auto}
html[data-theme] dialog:has(.sheet-view:not([hidden]) .sheet-foot){padding-bottom:0}
html[data-theme] dialog{--drag:0}html[data-theme] dialog::backdrop{background:var(--scrim);opacity:calc(1 - var(--drag, 0))}
/* --drag нужен только фону (::backdrop). Дети листа держат своё значение: анимация --drag при закрытии не пересчитывает стили всего листа каждый кадр (~8 мс при 4x). Только #sheet: на календаре правило утяжеляло первое открытие (E3). */
html[data-theme] #sheet>*{--drag:0}
html[data-theme] .sheet-handle{position:sticky;top:0;z-index:5;flex:none;height:16px;margin:0 calc(-1*var(--px));background:var(--sheet);touch-action:none;user-select:none}
html[data-theme] .sheet-handle::before{top:6px;left:calc(50% - 18px);width:36px;height:4px;border-radius:2px;background:var(--line2)}
html[data-theme] .sheet-header,html[data-theme] .date-header{position:sticky;top:16px;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px;margin:0 calc(-1*var(--px));padding:0 68px 0 var(--gutter);background:var(--sheet);border:0;box-shadow:none;touch-action:none;user-select:none}
html[data-theme] .date-header{position:relative;flex:none;margin:0;top:auto}
html[data-theme] dialog h2{margin:0;padding-top:0;min-width:0;overflow-wrap:anywhere;font:500 22px/1.2 Unbounded,sans-serif;letter-spacing:-.035em}
html[data-theme] #close-sheet,html[data-theme] #date-close{position:absolute;top:0;right:16px;flex:none;width:44px;height:44px;margin:0;border:1.5px solid var(--line);border-radius:50%;background:var(--card);color:var(--ink)}
@media (hover:hover){html[data-theme] #close-sheet:hover,html[data-theme] #date-close:hover{border-color:var(--accent)}}
html[data-theme] #close-sheet:active,html[data-theme] #date-close:active{background:var(--line)}
html[data-theme] #close-sheet svg,html[data-theme] #date-close svg{width:22px;height:22px}
/* Карточка: название дела — заголовок листа (Onest 600 24). Крестик остаётся в углу. */
html[data-theme] #sheet[data-view=detail] #sheet-title{position:static;width:auto;height:auto;margin:0;padding:0;overflow:hidden;clip:auto;white-space:normal;border:0;font:600 24px/1.25 Onest,sans-serif;letter-spacing:-.01em;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;line-clamp:4}
html[data-theme] #sheet[data-view=detail] #detail-text{display:none}
html[data-theme] #detail-view .detail-when{margin-top:12px}
html[data-theme] .sheet-foot{position:sticky;bottom:0;z-index:3;margin:16px calc(-1*var(--px)) 0;padding:12px var(--gutter) calc(16px + var(--safe-bottom));background:var(--sheet)}
html[data-theme] .sheet-foot::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:16px;background:linear-gradient(to bottom,transparent,var(--sheet));pointer-events:none}
html[data-theme] .primary-button{color:var(--on-accent)}
html[data-theme] .sheet-foot .primary-button{justify-content:center;margin-top:0;border-radius:22px}
html[data-theme] .sheet-foot .secondary-button,html[data-theme] .sheet-foot .quiet-button{margin-top:8px}
html[data-theme] .sheet-foot .sheet-caption{margin:10px 0 0;text-align:center;font-size:13px;line-height:1.4;color:var(--ink2)}
/* Календарь: та же оболочка, но прокручивается только тело, кнопка стоит внизу сама */
html[data-theme] #sheet.is-under-picker,html[data-theme] #sheet.is-under-picker::backdrop{visibility:hidden}
html[data-theme] .date-picker{--px:0px;padding:0;overflow:hidden}
html[data-theme] #date-picker-form{max-height:calc(100dvh - 44px - var(--tg-top) - 1px)}
html[data-theme] .date-picker .sheet-handle{position:static}
html[data-theme] .date-picker .date-content{padding:4px var(--gutter) 16px}
html[data-theme] .date-actions{padding:12px var(--gutter) calc(16px + var(--safe-bottom));background:var(--sheet);border-top:1px solid var(--line)}
html[data-theme] .date-actions .primary-button{justify-content:center;border-radius:22px}
html[data-theme] .date-picker .date-shortcuts button{flex:1 1 0;min-width:0;padding-inline:6px;border-radius:22px;font-size:14px;font-weight:500}

/* === редизайн v2, шаг 4: календарь без чужих месяцев, ровные клетки 44 px, один выбранный день ===
   Сетка шире тела на (--gutter - 4px) с каждой стороны: на 320 px клетка 44.5 px. Круг дня рисует ::before (inset 1px), сама кнопка прозрачна. */
html[data-theme] .date-picker .date-weekdays,html[data-theme] .date-picker .date-grid{gap:0;margin-inline:calc(4px - var(--gutter))}
html[data-theme] .date-picker .date-weekdays{margin-bottom:0;font-size:13px;font-weight:500;color:var(--ink2)}
html[data-theme] .date-weekdays span{display:grid;place-items:center;height:28px}
html[data-theme] .date-gap{height:44px}
html[data-theme] .date-day{position:relative;z-index:0;height:44px;min-height:44px;border-radius:0;background:none;color:var(--ink);font:500 16px/1 Onest,sans-serif;font-variant-numeric:tabular-nums}
html[data-theme] .date-day::before{content:"";position:absolute;inset:1px;border-radius:14px;z-index:-1}
html[data-theme] .date-day:disabled{color:var(--dis);font-weight:400;opacity:1}
html[data-theme] .date-day[aria-current=date]{box-shadow:none}
html[data-theme] .date-day[aria-current=date]::before{box-shadow:inset 0 0 0 1.5px var(--line2)}
html[data-theme] .date-day.is-selected{color:var(--on-accent);font-weight:700}
html[data-theme] .date-day.is-selected::before{background:var(--accent);box-shadow:none}
html[data-theme] .date-day:hover:not(:disabled),html[data-theme] .date-day.is-selected:hover{background:none;color:inherit}
html[data-theme] .date-day.is-selected:hover{color:var(--on-accent)}
html[data-theme] .date-day:focus-visible{outline:none}
html[data-theme] .date-picker.kb-nav .date-day:focus-visible::before{box-shadow:inset 0 0 0 2px var(--accent)}
html[data-theme] .date-picker.kb-nav .date-day.is-selected:focus-visible::before{box-shadow:inset 0 0 0 2px var(--ink)}
html[data-theme] .date-picker .date-times button{font-size:14px}
html[data-theme] .date-picker .date-timezone{margin:8px 0 0;font-size:13px;line-height:17px}
@media (min-width:380px){html[data-theme] .date-picker .date-shortcuts{margin-top:13px}html[data-theme] .date-picker .date-month-row{margin:14px 0 2px}}
html[data-theme]:not(.h-le-700) .date-picker .date-time{margin-top:12px}
html[data-theme] .date-picker .date-time{align-items:center}
html[data-theme] .date-picker .date-times{margin-top:10px}
@media (max-width:359px){html[data-theme] .date-picker .date-shortcuts{display:grid;grid-template-columns:repeat(3,minmax(min-content,1fr));gap:8px}html[data-theme] .date-picker .date-shortcuts button{width:100%;min-width:auto;white-space:nowrap}}
html[data-theme] .date-time label{font-size:13px}
html[data-theme] .date-time>span{flex:none;align-self:center;box-sizing:border-box;height:30px;padding:0;font:500 24px/30px Onest,sans-serif}
html[data-theme] #confirm-repeat{font-size:14px;line-height:1.4}

/* === редизайн v2, шаги 5–7: пустой список, основная кнопка, ввод, колонка Плюса === */
html[data-theme] .empty-message{display:flex;align-items:center;justify-content:center;min-height:64px;margin:0;padding:12px 16px;border:1.5px dashed var(--line2);border-radius:18px;text-align:center;font-size:15px;line-height:1.35;color:var(--ink2)}
/* Пустой список: единственный блок занимает свободную высоту области списка, заголовок «На очереди» остаётся на месте. */
html[data-theme] .upcoming.is-empty .reminder-scroll{display:flex;flex-direction:column}
html[data-theme] .upcoming.is-empty .reminder-list{padding-bottom:0}
html[data-theme] .upcoming.is-empty .reminder-scroll #empty-message{flex:1 1 auto}
html[data-theme] .upcoming.is-empty::after{display:none}
html[data-theme] .primary-button,html[data-theme] .sheet-foot .primary-button,html[data-theme] .date-actions .primary-button{min-height:52px;height:52px;justify-content:center;border-radius:22px;padding-inline:16px;font-size:16px;font-weight:600}
html[data-theme] #edit-confirmation{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;height:44px;min-height:44px;margin-top:8px;padding:0 16px;border:1.5px solid var(--line2);border-radius:22px;background:transparent;color:var(--ink);font-size:16px;font-weight:500}
html[data-theme] #reminder-text{resize:none;font-size:16px}
html[data-theme] #parse-note:empty{display:none}
html[data-theme] #text-examples{display:flex;flex-wrap:wrap;gap:8px}
html[data-theme] #text-examples button{height:auto;min-height:44px;border-radius:22px;padding:10px 14px;font-size:14px;font-weight:500;line-height:1.3;white-space:normal}
html[data-theme] .sheet-view form label{font-size:13px;font-weight:500;line-height:17px}
html[data-theme] .plus-compare thead th{height:44px;font-size:13px;font-weight:500;padding:8px;vertical-align:middle}
html[data-theme] .plus-compare thead th:last-child{height:44px;font-size:14px;font-weight:700;border-radius:14px 14px 0 0;padding:8px}
html[data-theme] .plus-compare td{color:var(--ink2);font-size:16px;font-weight:600}
html[data-theme] .plus-compare td:last-child{color:var(--ink);font-weight:700}
html[data-theme] .plus-compare td b{font-size:16px;font-weight:inherit;color:inherit}
/* Колонка Boop Plus залита сплошь: разделитель строк рисуем линией с отступом 16 px, на той же высоте, что border-bottom соседних колонок */
html[data-theme] .plus-compare tbody td:last-child{position:relative}
html[data-theme] .plus-compare tbody tr:not(:last-child) td:last-child::after{content:"";position:absolute;left:16px;right:16px;bottom:0;height:1px;background:color-mix(in srgb,var(--ink) 18%,transparent)}
html[data-theme] .plus-compare tbody th small{display:block;margin-top:1px;font-size:12px;font-weight:400;color:var(--ink2);line-height:16px}
html[data-theme] .plus-compare-note{display:flex;align-items:center;gap:6px;margin:10px 0 0;font-size:13px;line-height:1.4}
html[data-theme] .tg-star{color:var(--accent);flex:none;vertical-align:-2px}
html[data-theme] #plus-view .sheet-foot #plus-try-voice{margin:0}
html[data-theme] dialog:has(.sheet-view:not([hidden]) .sheet-foot[hidden]){padding-bottom:calc(16px + var(--safe-bottom))}
@media (max-width:359px){html[data-theme] .plus-compare .ok{font-size:12px}html[data-theme] .plus-compare tbody th{font-size:15px}html[data-theme] .plus-compare th,html[data-theme] .plus-compare td{padding:8px}}

/* === редизайн v2, шаг 8: карточка, повтор, настройки, запись, календарь, клавиатура === */
html[data-theme] #detail-view .detail-date{font-size:18px;font-weight:600;color:var(--accent)}
html[data-theme] .snooze-grid .secondary-button{height:44px;min-height:44px;border-radius:22px;font-size:14px;font-weight:500}
html[data-theme] #detail-view #delete-reminder{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;height:44px;min-height:44px;margin-top:18px;padding:0;border:0;border-radius:0;background:none;box-shadow:none;color:var(--danger);font-size:15px;font-weight:500}
html[data-theme] .repeat-item{min-height:52px}
html[data-theme] .sheet-view .settings-label{letter-spacing:.09em;font-weight:700}
html[data-theme] #settings-view .field-note{font-size:13px;line-height:1.4;font-weight:400;letter-spacing:0;text-transform:none;color:var(--ink2)}
html[data-theme] #settings-view .interval-row{grid-template-columns:70px minmax(56px,1fr) auto;justify-content:stretch;align-items:center;gap:8px;width:100%}
@media (max-width:359px){html[data-theme] #settings-view .interval-row{gap:6px}}
html[data-theme] #settings-view .interval-row>label{width:auto;min-width:0;color:var(--ink);font-size:15px;font-weight:400;line-height:20px;white-space:normal;overflow-wrap:anywhere}/* I5: длинный перевод переносится, а не уходит под поле (qps) */
html[data-theme] #settings-view .interval-row>input{width:100%;min-width:56px;max-width:none;height:50px;min-height:50px;padding-inline:0;box-sizing:border-box;border-radius:14px;font:500 20px/1 Onest,sans-serif;font-variant-numeric:tabular-nums}
html[data-theme]:where(.h-le-900) .telegram-mode #settings-view .interval-rows,html[data-theme] #settings-view .interval-rows{gap:6px}
/* мин/ч/дн — один блок с общей рамкой и тонкими разделителями, высота как у поля */
html[data-theme] #settings-view .unit-seg{display:flex;gap:0;width:auto;flex:none;height:50px;box-sizing:border-box;border:1.5px solid var(--line);border-radius:14px;overflow:hidden;background:var(--card)}
html[data-theme] #settings-view .unit-seg label{width:44px;height:100%;min-height:44px}
html[data-theme] #settings-view .unit-seg span{width:44px;min-width:44px;height:100%;min-height:44px;padding:0;border:0;border-radius:0;font-size:14px;font-weight:600}
html[data-theme] #settings-view .unit-seg label+label span{border-left:1.5px solid var(--line)}
html[data-theme] #settings-view .stepper button{width:44px;height:44px;min-height:44px}
html[data-theme] .capture.is-recording .capture-heading h2,html[data-theme] .capture.is-recording #status,html[data-theme] .capture.is-recording #open-text{display:none!important}
html[data-theme] .capture.is-recording .recording-feedback{display:flex;flex-direction:column;align-items:center;width:100%}
html[data-theme] .capture.is-recording .speech-capsule{display:flex!important;flex-direction:column;align-items:center;order:1;width:auto;max-width:100%;margin:0;padding:0;border:0!important;border-radius:0;background:none!important;box-shadow:none!important}
html[data-theme] .capture.is-recording .recording-visual,html[data-theme] .capture.is-recording #finish-recording{display:none!important}
html[data-theme] .capture.is-recording .recording-status{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;width:100%;font-size:15px;letter-spacing:0}
html[data-theme] .capture.is-recording #recording-status-text{flex:none;color:var(--accent);font-size:15px;font-weight:600}
html[data-theme] .capture.is-recording .recording-dot{width:8px;height:8px;margin:0;background:var(--accent);box-shadow:none}
html[data-theme] .capture.is-recording #recording-clock{flex-basis:100%;margin:0;padding:0;min-width:0;border:0;border-radius:0;background:none;text-align:center;font-family:Unbounded,sans-serif;font-size:40px;font-weight:500;line-height:1.1;letter-spacing:0;color:var(--ink)}
html[data-theme] .capture.is-recording #recording-disclosure{display:block!important;order:2;margin:8px 0 0;font-size:15px;line-height:1.35;text-align:center;color:var(--ink2)}
html[data-theme] .capture.is-recording .recording-actions{order:3}
body:has(.capture.is-recording) .upcoming{opacity:.38}
html[data-theme] .date-picker.is-typing-time .date-shortcuts{display:none}
html[data-theme] .date-picker.is-typing-time .date-chosen{display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;width:100%;height:48px;min-height:48px;margin:8px 0 0;padding:0 14px;border:1.5px solid var(--line);border-radius:16px;background:var(--card);color:var(--ink);font:600 16px/1.2 Onest,sans-serif;text-align:left;cursor:pointer}
html[data-theme] .date-picker.is-typing-time .date-chosen::after{content:"";width:8px;height:8px;margin-top:-4px;border-right:2px solid var(--ink2);border-bottom:2px solid var(--ink2);transform:rotate(45deg);flex:none}
html[data-theme] #date-picker-form{display:flex;flex-direction:column;min-height:0}
html[data-theme] .date-picker .date-content{flex:1 1 auto;min-height:0;overflow:auto;padding-bottom:16px}
html[data-theme] .date-actions{position:relative;flex:none}
html[data-theme] .date-actions::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:18px;background:linear-gradient(to bottom,transparent,var(--sheet));pointer-events:none}
html[data-theme] .sheet-foot::before{height:18px}
html[data-theme] .sheet-view textarea,html[data-theme] .date-time input{font-size:16px}
html[data-theme] .date-picker .date-time input{box-sizing:border-box;font-variant-numeric:normal;width:76px!important;height:52px!important;min-height:52px!important;margin:0!important;padding:0!important;font-size:24px;font-weight:500}
html[data-theme] textarea{resize:none}
html[data-theme][data-kb="1"] dialog{max-height:calc(var(--vv, 100dvh) - 8px);padding-bottom:16px}
html[data-theme][data-kb="1"] dialog:has(.sheet-view:not([hidden]) .sheet-foot){padding-bottom:0}
html[data-theme][data-kb="1"] dialog:has(.sheet-view:not([hidden]) .sheet-foot[hidden]){padding-bottom:16px}
html[data-theme][data-kb="1"] #date-picker-form{max-height:calc(var(--vv, 100dvh) - 8px)}
html[data-theme][data-kb="1"] .sheet-handle{display:none}
html[data-theme][data-kb="1"] .sheet-header,html[data-theme][data-kb="1"] .date-header{top:0;margin-top:16px}
html[data-theme][data-kb="1"] .sheet-foot,html[data-theme][data-kb="1"] .date-actions{padding-bottom:16px}
html[data-theme][data-kb="1"] .sheet-caption{display:none!important}
html[data-theme][data-vh="full"] .date-timezone{display:block}
html[data-theme][data-vh="compact"] #timezone-note,html[data-theme][data-vh="tight"] #timezone-note,html[data-theme][data-vh="compact"] .date-timezone,html[data-theme][data-vh="tight"] .date-timezone,html[data-theme][data-vh="compact"] #settings-view .field-note,html[data-theme][data-vh="tight"] #settings-view .field-note{display:none}
html[data-theme][data-vh="compact"] .date-time input{height:52px;min-height:52px}
html[data-theme][data-vh="compact"] .sheet-view textarea{height:72px;min-height:64px;max-height:80px}
html[data-theme][data-vh="compact"] #text-examples{flex-wrap:nowrap;overflow-x:auto}
html[data-theme][data-vh="compact"] #text-examples button{white-space:nowrap}
html[data-theme][data-vh="tight"] dialog h2{font-size:18px}
html[data-theme][data-vh="tight"] .sheet-view textarea{height:64px;min-height:64px;max-height:64px}
html[data-theme][data-vh="tight"] #text-examples,html[data-theme][data-vh="tight"] .date-times{display:none}
html[data-theme] .eyebrow,html[data-theme] .plus-feature>span,html[data-theme] .plus-feature .soon,html[data-theme] #inline-voice-status,html[data-theme] .voice-result form label,html[data-theme] .ai-label,html[data-theme] .field-note.voice-disclosure,html[data-theme] .sheet-footnote,html[data-theme] .app-footer,html[data-theme] .upcoming .section-heading>span,html[data-theme] .free-caption,html[data-theme] .hello{font-size:12px}
@media (max-width:379px){html[data-theme] .plus-compare thead th{font-size:13px}html[data-theme] .plus-compare thead th:last-child{font-size:14px}}
/* Лист Плюса: шапка, вводка и сноска как в макете. Строка версии — видимая мета под действиями. */
html[data-theme] #sheet[data-view="plus"] .sheet-header{align-items:flex-start;padding-top:3px}
html[data-theme] #sheet[data-view="plus"] #sheet-title{margin:0;padding-top:8px}
html[data-theme] #plus-view .plus-intro{margin:15px 0 14px;font-size:16px;font-weight:400;line-height:1.5;color:var(--ink2)}
html[data-theme] #plus-view .plus-compare thead th{height:44px;padding:8px;letter-spacing:0;white-space:nowrap}
html[data-theme] #plus-view .plus-compare tbody th,html[data-theme] #plus-view .plus-compare thead th:first-child{padding-left:0}
html[data-theme] #plus-view .app-version{display:block;margin:8px 0 0;text-align:center}
html[data-theme] #plus-view .sheet-foot{border-top:1px solid var(--line)}
/* Заливка под листом: пока клавиатура iOS едет, под листом виден главный экран. Тень цвета листа закрывает всё ниже. */
/* (pointer:coarse): кадр теста Telegram шире 480 px (980 px без meta viewport), на нём нужна та же заливка. На широком сенсорном экране clip-path обрезает тень по бокам листа. */
/* Тень начинается на 28 px (радиус угла) ниже верха листа: иначе она закрашивает места за скруглёнными углами и углы выглядят острыми. */
@media (max-width:480px),(pointer:coarse){html[data-theme] dialog[open]{box-shadow:var(--sheet-shadow),inset 0 1px 0 var(--line),0 calc(100vh + 28px) 0 100vh var(--sheet)}}
@media (min-width:481px) and (pointer:coarse){html[data-theme] dialog[open]{clip-path:inset(-60px 0 -200vh 0)}}
/* Лист ввода стоит наверху под кнопками Telegram и не зависит от клавиатуры: клавиатура закрывает только пустой низ. --vv меняет только низ листа. */
@media (max-width:480px),(pointer:coarse){
/* Пока окно сжато клавиатурой, обычный лист стоит низом на прежней высоте окна (app.js, --sink): окно растёт обратно, верх стоит. */
html[data-theme] dialog[open]{bottom:calc(-1 * var(--sink, 0px));max-height:calc(100dvh + var(--sink, 0px) - 44px - var(--tg-top))}
html[data-theme] #sheet[open][data-view=editor]{top:calc(var(--tg-top, 0px) + 8px);bottom:auto;max-height:calc(min(100dvh, var(--vv, 100dvh)) - var(--tg-top, 0px) - 16px)}
/* Обычный лист с полем в фокусе закреплён по верху (app.js, data-pin): низ листа над клавиатурой, верх стоит. */
html[data-theme] dialog[open][data-pin]{top:var(--pin-top);bottom:auto;max-height:calc(min(100dvh, var(--vv, 100dvh)) - var(--pin-top) - 8px)}
html[data-theme] .date-picker[open][data-pin] #date-picker-form{max-height:calc(min(100dvh, var(--vv, 100dvh)) - var(--pin-top) - 8px)}
}
/* Короткий экран: прокручивается вся форма, «Готово» стоит в конце после контента, а не поверх часов и пресетов. */
html[data-theme]:where(.h-le-620) #date-picker-form{display:block;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
html[data-theme]:where(.h-le-620) .date-picker .date-content{overflow:visible;flex:none;min-height:0}
/* Клавиатура, pin и ввод времени сохраняют прежнюю раскладку: прокручивается тело, кнопка стоит внизу. */
html[data-theme][data-kb="1"] #date-picker-form,html[data-theme] .date-picker[data-pin] #date-picker-form,html[data-theme] .date-picker.is-typing-time #date-picker-form{display:flex;overflow:visible}
html[data-theme][data-kb="1"] .date-picker .date-content,html[data-theme] .date-picker[data-pin] .date-content,html[data-theme] .date-picker.is-typing-time .date-content{overflow:auto;flex:1 1 auto}
/* U1: подсказка под «Или напиши текстом», пока нет доступа к микрофону. */
.mic-hint{margin:4px 0 10px;font-size:.75rem;line-height:16px;color:var(--ink2);text-align:center}
/* Ошибка записи: «Попробовать снова» и «Или напиши текстом» — ряд по верху с зазором 8 px; карандаш прячем, чтобы ряд влез в 440 px; узко — друг под другом.
   Строку-подсказку прячем до новой записи: текст ошибки уже говорит про доступ. */
html[data-theme] #retry-recording,html[data-theme] #open-text{vertical-align:top;margin-inline:4px}
html[data-theme] #retry-recording:not([hidden])~#open-text svg{display:none}
html[data-theme] .capture-controls:has(#recording-error:not([hidden])) #mic-hint{display:none}
/* U6: лист Plus сразу во всю высоту: цены после /api/plus/offer не растят лист вторым шагом.
   31.10: и у подписчиков тоже — Plus открывается на ту же высоту, что «Настройки», крестик всегда в одном месте. */
html[data-theme] #sheet[open][data-view="plus"]:not([data-pin]){min-height:calc(100dvh + var(--sink, 0px) - 44px - var(--tg-top))}
/* 31.10: верх листа — под строкой с логотипом (--sheet-top ставит app.js), но не выше прежнего предела 44 px + --tg-top. Лист ввода (editor) живёт по своему правилу выше. */
html[data-theme] #sheet[open]:not([data-pin]):not([data-view=editor]){max-height:calc(100dvh + var(--sink, 0px) - max(var(--sheet-top, 0px), 44px + var(--tg-top)))}
/* Поле почты в фокусе (data-pin): лист сжимается до видимой части над клавиатурой, а не стоит во всю высоту под ней. */
html[data-theme] #sheet[open][data-view="plus"]:not([data-pin]){min-height:calc(100dvh + var(--sink, 0px) - max(var(--sheet-top, 0px), 44px + var(--tg-top)))}
/* «Позвать друга»: нажимается только сама надпись, а не пустота слева и справа. */
html[data-theme] #plus-invite{width:fit-content;max-width:100%;margin-inline:auto}
/* Лист выше содержимого (высокий экран, подписчик): кнопки оплаты стоят внизу листа, а не висят посередине с пустотой под ними. */
html[data-theme] #sheet[open][data-view="plus"]{display:flex;flex-direction:column}
html[data-theme] #sheet[data-view="plus"]>#plus-view:not([hidden]){flex:1 0 auto;display:flex;flex-direction:column}
html[data-theme] #sheet[data-view="plus"]>#plus-view:not([hidden])::after{content:"";flex:1 0 0;order:1}html[data-theme] #plus-view>#plus-foot,html[data-theme] #plus-view>#plus-foot~*{order:2}
/* Plus v2 (26.10.2026): экран из макета Claude outputs/plus-limits/template.html — 5 строк с карточками «подробно», сроки в строку, регион РФ / не РФ (#plus-view[data-region]). */
.plus-compare .ok svg.inf{width:28px;height:16px}
/* экран без прокрутки на 740+: шапка таблицы как в живом приложении, колонка Plus прежней ширины.
   corgi.css задаёт эти места через #plus-view — перебиваем тем же префиксом */
html[data-theme] #plus-view .plus-intro{margin:2px 0 12px;font-size:15px;line-height:1.4}
html[data-theme] #plus-view .plus-compare thead th:nth-child(2){padding-inline:0 7px;font-size:11.5px}
@media (max-width:359px){html[data-theme] #plus-view .plus-compare thead th:nth-child(2){font-size:10.5px}}
html[data-theme] .plus-compare td .tg-star{color:#f5a400}
html[data-theme] .plus-compare td .pl-txt{display:inline-block;font-size:13px;font-weight:600;line-height:1.25;overflow-wrap:normal;word-break:normal;hyphens:none}
html[data-theme] .plus-compare td .pl-noun{font-size:12px;font-weight:600}
html[data-theme] .plus-compare td .pl-unit{margin-top:1px;font-size:11px;font-weight:500;line-height:1.2}
html[data-theme] .plus-compare col.c1{width:53%}
html[data-theme] .plus-compare col.c2{width:20%}
html[data-theme] .plus-compare col.c3{width:27%}
html[data-theme] .plus-compare tbody th,html[data-theme] .plus-compare tbody td{height:52px;padding-top:7px;padding-bottom:7px}
html[data-theme] .plus-compare tbody th{text-wrap:balance}
.pl-legend{display:flex;flex-wrap:wrap;gap:2px 14px;margin-top:10px!important;font-size:12px!important}
.pl-legend span{display:inline-flex;align-items:center;gap:5px}
/* строки раскрываются: под строкой карточка «подробно», нижние строки плавно съезжают */
#plus-rows .pl-row{cursor:pointer;-webkit-tap-highlight-color:transparent}
#plus-rows .pl-row:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
#plus-rows .pl-row>th{transition:color .2s ease}
#plus-rows .pl-row[aria-expanded=true]>th{color:var(--accent)}
.pl-chev{display:inline-block;width:12px;height:12px;margin-left:4px;vertical-align:-1px;color:var(--ink2);opacity:.7;transition:transform .2s cubic-bezier(.2,.8,.2,1),color .2s ease}
.pl-row[aria-expanded=true] .pl-chev{transform:rotate(180deg);color:var(--accent);opacity:1}
html[data-theme] #plus-rows .pl-more>td{position:relative;height:auto;padding:0;border:0;background:transparent}
html[data-theme] #plus-rows .pl-more>td::after{display:none}
/* полоса колонки Plus продолжается под карточкой */
#plus-rows .pl-more>td::before{content:"";position:absolute;top:0;right:0;bottom:0;width:27%;background:var(--tint)}
#plus-rows .pl-more:last-child>td::before{border-radius:0 0 14px 14px}
html[data-theme] #plus-rows .pl-row:nth-last-child(2)>*{border-bottom:0}
html[data-theme] #plus-rows .pl-row:nth-last-child(2) td:last-child::after{display:none}
html[data-theme] #plus-rows .pl-row:nth-last-child(2) td:last-child{border-radius:0}
html[data-theme] #plus-rows .pl-row:nth-last-child(2)[aria-expanded=false] td:last-child{border-radius:0 0 14px 14px}
/* Сворачивание — своя кривая без длинного хвоста: с кривой раскрытия пустое место доползало ~150 мс после исчезновения текста. */
.pl-more-in{display:grid;grid-template-rows:0fr;transition:grid-template-rows .16s cubic-bezier(.4,0,.2,1)}
.pl-more.open .pl-more-in{grid-template-rows:1fr;transition:grid-template-rows .2s cubic-bezier(.2,.8,.2,1)}
.pl-more-in>div{min-height:0;overflow:hidden}
.pl-more-card{position:relative;margin:2px 0 10px;padding:12px 14px;border-radius:10px;background:var(--card);box-shadow:0 0 0 1px var(--line);color:var(--ink2);font-size:13px;line-height:1.45;text-align:left;opacity:0;transform:translateY(-6px);transition:opacity .12s ease,transform .16s cubic-bezier(.4,0,.2,1)}
.pl-more.open .pl-more-card{opacity:1;transform:none;transition:opacity .16s ease .03s,transform .2s cubic-bezier(.2,.8,.2,1) .03s}
.pl-more-card ul{margin:0;padding:0;list-style:none;display:grid;gap:6px}
.pl-more-card li{position:relative;padding-left:14px}
.pl-more-card li::before{content:"";position:absolute;left:2px;top:.6em;width:5px;height:5px;border-radius:50%;background:var(--accent)}
html[data-theme] .plus-compare .pl-more-card{font-weight:400}
html[data-theme] .plus-compare .pl-more-card b{display:inline;font-size:inherit;color:var(--ink);font-weight:600}
.pl-more-empty{margin:0;font-style:italic}
@media (prefers-reduced-motion:reduce){.pl-more-in,.pl-more-card,.pl-chev,.pl-more.open .pl-more-in,.pl-more.open .pl-more-card{transition:none}}
.pl-legend svg.inf{width:18px;height:11px;color:var(--accent)}
html[data-theme] #sheet[data-view=plus] .app-version,html[data-theme] #sheet[data-view=plus] .app-footer{display:none}
#plus-buy-title{margin-bottom:4px!important}
.pl-tiers[data-l=row]{margin-top:14px!important}
[data-l=row] .pl-tier{padding:12px 2px 9px!important}
[data-l=row] .pl-tier[aria-checked=true]{padding:11px 1px 8px!important}
[data-l=row] .pl-price{margin-top:4px!important}
[data-l=row] .pl-note{margin-top:4px!important}
html[data-theme] #plus-foot{padding-top:10px;padding-bottom:12px}
.pl-btn{min-height:54px!important}
/* Карточки сроков: перенос .tier с sayboop.com (site/home.css), сетка 2x2 */
.pl-tiers{display:grid;grid-template-columns:1fr 1fr;gap:22px 10px;margin:16px 0 4px}
.pl-tier{position:relative;padding:18px 8px 14px;border:1px solid var(--line2);border-radius:20px;background:transparent;color:inherit;font:inherit;text-align:center;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .15s ease,box-shadow .2s ease,background-color .2s ease}
.pl-tier[aria-checked=true]{padding:17px 7px 13px;border:2px solid var(--accent);background:var(--card);box-shadow:0 14px 30px -18px rgba(176,69,26,.55)}
.pl-tier:active{transform:scale(.97)}
.pl-tag{position:absolute;top:-11px;left:50%;transform:translateX(-50%);padding:2px 10px;border-radius:999px;background:var(--accent);color:var(--on-accent);font:600 11px/1.45 Onest,sans-serif;white-space:nowrap}
.pl-term{margin:0;color:var(--muted);font-size:13px}
.pl-price{margin:5px 0 0;color:var(--ink);font:600 26px/1.1 Unbounded,sans-serif;letter-spacing:-.03em;white-space:nowrap}
.pl-note{margin:5px 0 0;color:var(--muted);font-size:12px}
.pl-tiers .s{display:none}
/* Вариант 2: 4 в строку, карточка выше и уже */
.pl-tiers[data-l=row]{grid-template-columns:repeat(4,1fr);gap:6px;margin:18px 0 2px}
[data-l=row] .pl-tier{padding:15px 2px 12px;border-radius:16px}
[data-l=row] .pl-tier[aria-checked=true]{padding:14px 1px 11px}
[data-l=row] .pl-term{font-size:12px;white-space:nowrap}
[data-l=row] .pl-price{margin-top:6px;font-size:18px;letter-spacing:-.04em}
[data-l=row] .pl-note{margin-top:6px;font-size:11px}
[data-l=row] .pl-tag{top:-10px;padding:1px 7px;font-size:10px}
/* 320 px: карточка 62 px, «Популярный» на 10 px не влезает */
@media (max-width:340px){[data-l=row] .pl-tag{padding:1px 3px;font-size:9px;letter-spacing:-.2px}}
[data-l=row] .l{display:none}[data-l=row] .s{display:inline}
/* у выбранной карточки рамка на 1 px толще: метка остаётся на той же высоте */
.pl-tier[aria-checked=true] .pl-tag{margin-top:-1px}
/* «Выгодно»: контурная плашка, чтобы не спорить с «Популярный» */
.pl-tag-best{background:var(--card);color:var(--accent);box-shadow:inset 0 0 0 1.5px var(--accent)}
/* звёзды: в РФ второй строкой «или N ★», вне РФ вместо рублей */
.pl-price .tg-star,.pl-alt .tg-star{width:.72em;height:.72em;color:#f5a400;vertical-align:-.02em}
.pl-alt{margin:3px 0 0;color:var(--muted);font-size:11px;white-space:nowrap}
.pl-tiers .xtr{display:none}
#plus-view[data-region=world] .pl-tiers .rub,#plus-view[data-region=world] .pl-alt,#plus-view[data-region=world] .pl-card{display:none}
#plus-view[data-region=world] .pl-tiers .xtr{display:inline}
#plus-view[data-region=world] .pl-pay{grid-template-columns:1fr}
/* Оплата: две кнопки в строку */
.pl-pay{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pl-btn{display:flex;align-items:center;justify-content:center;gap:9px;min-height:60px;padding:8px 10px;border:0;border-radius:20px;color:#fffaf2;font:inherit;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .12s ease,box-shadow .2s ease,filter .2s ease}
.pl-btn:active{transform:scale(.96);filter:brightness(.95)}
.pl-btn b{display:block;font:600 15px/1.2 Onest,sans-serif}
.pl-btn small{display:block;margin-top:1px;font-size:12px;opacity:.85;font-variant-numeric:tabular-nums;white-space:nowrap}
.pl-ico{flex:none;width:30px;height:30px}
.pl-card{background:linear-gradient(180deg,#c9581f,#a53e15);box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 12px 22px -12px rgba(176,69,26,.85)}
.pl-stars{background:linear-gradient(180deg,#34291f,#1d1612);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 12px 22px -12px rgba(34,27,22,.8)}
html[data-theme=night] .pl-stars{background:linear-gradient(180deg,#3b3a52,#2a293d);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 12px 22px -12px rgba(0,0,0,.8)}
.cal-url{display:block;width:100%;margin-top:8px;padding:10px 12px;border-radius:12px;border:1.5px solid var(--line);background:var(--card);color:var(--ink);font-size:13px}
/* «Привязать календарь»: строки-кнопки. */
.cm{display:grid;gap:10px;padding-bottom:8px}
.cm-list{display:grid;gap:10px}.cm-list:empty{display:none}
.cm-note{margin:0 0 4px;color:var(--ink2);font-size:14px;line-height:1.45}
.cm-row{display:flex;align-items:center;gap:12px;width:100%;min-height:60px;margin:0;padding:10px 14px;border:0;border-radius:16px;background:var(--card);box-shadow:0 0 0 1px var(--line);color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.cm-row:disabled{opacity:.6}.cm-row[hidden]{display:none}
.cm-ic{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:10px;font-weight:700;font-size:17px;color:#fff}
.cm-ic-apple{background:#fff;color:#e5392f;font-size:15px}.cm-ic-outlook{background:#0f6cbd}.cm-ic-google{background:#1a73e8}.cm-ic-yandex{background:#fc3f1d}.cm-ic-chat{background:#2aa3dc}.cm-ic-other{background:#8c7f70}
.cm-t{flex:1;display:grid;gap:2px;min-width:0}.cm-t b{font-size:16px;font-weight:600}.cm-t small{font-size:13px;color:var(--ink2)}
.cm-chev{flex:none;opacity:.5;font-size:20px}
.cm-label{margin:10px 0 0;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink2)}
.cm-callout{padding:12px 14px;border-radius:14px;background:var(--tint);font-size:14px;line-height:1.45;color:var(--ink)}
.cm-off{margin:14px auto 0;padding:6px;border:0;background:none;color:var(--ink2);font:inherit;font-size:13px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.cm-steps{margin:0;padding:0;list-style:none;counter-reset:s;display:grid;gap:10px}
.cm-steps li{counter-increment:s;display:flex;gap:12px;align-items:flex-start;font-size:15px;line-height:1.4}
.cm-steps li::before{content:counter(s);flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--tint);font-weight:600;font-size:13px}
.cm-url{display:flex;gap:8px;align-items:center;width:100%;min-width:0;margin:0;padding:10px 12px;border:0;border-radius:12px;background:var(--card);box-shadow:0 0 0 1px var(--line);font:inherit;font-size:13px;color:var(--ink2);text-align:left;cursor:pointer}
.cm-url span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cm-url b{color:var(--accent);font-weight:600}
#cal-yandex-copy{min-height:44px}
/* Меню повтора (date-picker.js) вместо нативного select. */
html[data-theme] .repeat-menu-wrap{position:relative}
html[data-theme] .sheet-view .repeat-menu-btn{display:block;width:100%;min-height:48px;padding:13px 44px 13px 14px;border:1.5px solid var(--line);border-radius:14px;background-color:var(--card);color:var(--ink);font-size:16px;text-align:left;cursor:pointer}
html[data-theme] .sheet-view .repeat-menu-btn[aria-expanded=true]{border-color:var(--accent)}
html[data-theme] .repeat-menu{position:absolute;z-index:5;left:0;right:0;top:calc(100% + 4px);overflow-y:auto;padding:4px;border:1px solid var(--line);border-radius:14px;background:var(--card);box-shadow:0 8px 24px #00000033;transform-origin:50% 0;animation:repeat-menu-in .13s cubic-bezier(.2,.8,.2,1)}
html[data-theme] .repeat-menu.is-up{top:auto;bottom:calc(100% + 4px);transform-origin:50% 100%}
html[data-theme] .repeat-menu-item{display:block;width:100%;min-height:44px;padding:0 12px;border:0;border-radius:10px;background:none;color:var(--ink);font:inherit;font-size:16px;text-align:left;cursor:pointer}
html[data-theme] .repeat-menu-item[aria-selected=true]{color:var(--accent);font-weight:600}
html[data-theme] .repeat-menu-item:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
@keyframes repeat-menu-in{from{opacity:0;transform:scale(.97) translateY(-4px)}}
@media (prefers-reduced-motion:reduce){html[data-theme] .repeat-menu{animation:none}}
/* Шапка карточки: 3 кнопки правки — время, текст, дата. Общая пилюля = «можно нажать»; значок называет, что меняется. */
html[data-theme] #detail-view .detail-when,html[data-theme] .clarify-when{display:flex;align-items:center;justify-content:flex-start;gap:8px;margin-top:12px}
html[data-theme] .chip-wrap{position:relative;display:flex;flex:none}
html[data-theme] .detail-chip{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:44px;min-height:44px;min-width:0;padding:0 14px;border-radius:22px;border:1.5px solid var(--line2);background:transparent;color:var(--ink);font:600 16px Onest,sans-serif;font-variant-numeric:normal;white-space:nowrap;cursor:pointer;transition:transform .12s,border-color .15s,background-color .15s}
html[data-theme] .detail-chip:active{transform:scale(.96)}
html[data-theme] .detail-chip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
html[data-theme] .detail-chip svg{width:18px;height:18px;flex:none;color:var(--accent)}
html[data-theme] .chip-time,html[data-theme] .chip-date{color:var(--accent)}
html[data-theme] .chip-text{flex:1 1 0}
@media (max-width:359px){html[data-theme] .chip-text span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}} /* 320 px: слово не влезает, остаётся карандаш */
html[data-theme] .chip-date{flex:0 1 auto}
html[data-theme] .chip-date .chip-value{overflow:hidden;text-overflow:ellipsis}
@media (max-width:360px){html[data-theme] .detail-when .chip-time,html[data-theme] .detail-when .chip-date,html[data-theme] .clarify-when .chip-time,html[data-theme] .clarify-when .chip-date{font-size:14px;padding-left:10px;padding-right:10px;gap:5px}}
html[data-theme] .chip-wrap .chip-time-input{position:absolute;inset:0;width:100%;height:100%;min-height:0;padding:0;border:0;opacity:0;pointer-events:none;font-size:16px;color:transparent;caret-color:transparent;background:transparent}
html[data-theme] .chip-time.is-editing{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}
/* Цифры пропорциональные и без ячейки равной ширины: табличная или центрованная «1» даёт дыру (как в списке, 0653d8a) */
html[data-theme] .time-slot{position:relative;display:inline-block;color:color-mix(in srgb,var(--accent) 40%,transparent)}
html[data-theme] .time-slot.is-typed{color:var(--accent)}
/* Текущая цифра: тонкая мигающая черта снизу, как курсор, а не заливка — заливка липла к соседям */
html[data-theme] .time-slot.is-current{color:color-mix(in srgb,var(--accent) 60%,transparent)}
html[data-theme] .time-slot.is-current::after{content:"";position:absolute;left:10%;right:10%;bottom:-3px;height:2.5px;border-radius:2px;background:var(--accent);animation:slot-caret 1s steps(1) infinite}
@keyframes slot-caret{50%{opacity:0}}
@media (prefers-reduced-motion:reduce){html[data-theme] .time-slot.is-current::after{animation:none}}
html[data-theme] .chip-date.is-flash{animation:chip-flash 1s ease-out}
@keyframes chip-flash{0%,55%{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 22%,transparent)}}
@media (prefers-reduced-motion:reduce){html[data-theme] .detail-chip{transition:none}html[data-theme] .detail-chip:active{transform:none}}
/* Крестик в поле текста при правке: стирает всё одним касанием. */
html[data-theme] .text-wrap{position:relative}
html[data-theme] .text-clear{position:absolute;top:6px;right:6px;display:grid;place-items:center;width:40px;height:40px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--ink2);cursor:pointer}
html[data-theme] .text-clear[hidden]{display:none}
html[data-theme] .text-wrap:has(.text-clear:not([hidden])) textarea{padding-right:48px}
/* Календарь «только день»: без часов и «Готово», касание дня сохраняет. */
.date-picker.day-only :is(.date-time,.date-times,.date-timezone,.date-chosen,#date-apply){display:none}