/* Вариант 4 «Итог»: движения ушей v2 только в касании, записи, «не понял», «уточняет», «готово»; в покое и во сне уши не видны (DESIGN.md:93, :180).
   Ночью кожа носа темнее (решение владельца), без обводки и свечения (DESIGN.md:202). Искры записи остаются (DESIGN.md:175). Свои правки помечены «v4:». */
:root,[data-theme=day]{
  --outer:#d9cfbf;--paper:#f5eee2;--card:#fffaf2;--ink:#221b16;--ink2:#6b5d51;--line:#e2d5c1;--accent:#b0451a;--sel:#f2c9a8;--danger:#b3261e;
  --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;
}
[data-theme=night]{
  --outer:#0b0c11;--paper:#14161f;--card:#1e2130;--ink:#efe9de;--ink2:#9ea1b3;--line:#323650;--accent:#f2b56b;--sel:#5a4a33;--danger:#ff8f86;
  --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;
}
/* окрас корги: выбор в настройках, действует в обеих темах */
[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}
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}
/* язык — отдельный слой поверх рисунка; ход задаёт 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(18px + var(--tg-safe-area-inset-top,0px) + var(--tg-content-safe-area-inset-top,0px)) 22px 6px}
html[data-theme] .app-header .wordmark{font-family:Unbounded,sans-serif;font-weight:700;font-size:26px;letter-spacing:-.04em;line-height:32px}
html[data-theme] .header-actions{gap:8px}
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 14px;border-radius:18px;border:1.5px solid var(--ink);background:transparent;color:var(--ink);font-weight:600;font-size:12px;letter-spacing:.06em}
html[data-theme] .plus-link::after{content:"";position:absolute;inset:-7px 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:14px 18px 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:14px;line-height:18px;letter-spacing:0;color:var(--ink2)}
html[data-theme] .upcoming .section-heading>span{font-weight:500;font-size:14px;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:grid;grid-template-columns:62px 1fr auto;gap:0;align-items:center;min-height:0;padding:14px 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{min-width:0;font-weight:600;font-size:17px;color:var(--accent);font-variant-numeric:normal}
html[data-theme] .reminder-title{font-weight:500;font-size:16px;line-height:1.3;white-space:normal}
html[data-theme] .reminder-meta{font-size:12.5px;color:var(--ink2);margin-top:2px}
html[data-theme] .reminder-chevron{display:none}
@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:30px;letter-spacing:-.035em;line-height:1.05;margin:0 0 8px}
html[data-theme] .capture-heading .capture-subtitle{height:20px;margin:0;font-size:14px;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:8px;margin:14px 0 0;height:44px;min-height:0;padding:0 18px;border-radius:22px;border:1.5px solid var(--line);background:transparent;color:var(--ink);font-weight:500;font-size:15px}
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)) auto calc(-1 * var(--nose-shift))}
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:26px}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 .3s,transform .3s}
.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 18px;border-radius:22px;border:1.5px solid var(--line);background:var(--card);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] dialog::backdrop{background:rgba(34,27,22,.42)}
html[data-theme=night] dialog::backdrop{background:rgba(0,0,0,.62)}
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(--ink2);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-picker{background:var(--paper);color:var(--ink);border:1.5px solid var(--line);box-shadow:0 24px 60px -20px var(--shade)}
html[data-theme] .date-picker::backdrop{background:rgba(34,27,22,.42)}
html[data-theme=night] .date-picker::backdrop{background:rgba(0,0,0,.62)}
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)}
html[data-theme] .date-day.is-outside{color:var(--ink2);opacity:1}
.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-day[aria-current=date]{box-shadow:inset 0 0 0 1.5px var(--line)}
@media (hover:hover){html[data-theme] .date-day:hover:not(:disabled){background:var(--sel)}}
html[data-theme] .date-day.is-selected{background:var(--accent);color:var(--paper)}@media (hover:hover){html[data-theme] .date-day.is-selected:hover{background:var(--accent);color:var(--paper)}}
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{outline:none}
/* блик-боб: резкий верх, мягкий низ, градиент вместо размытия; правый тусклее; ночью меньше и тусклее */
.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:16px;right:16px;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] .date-day{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}
html[data-theme] .voice-result form label{margin:8px 0 5px}
/* QA: сбой отправки с «Повторить» лежал под мордой пса; пока в подвале есть кнопка, он плашка над псом */
html[data-theme] .telegram-mode .app-footer:has(button){position:fixed;left:18px;right:18px;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}
/* В открытом листе плашка встаёт в поток под полями: 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{justify-content:center;gap:10px}
html[data-theme] .stepper{flex:none;gap:0;padding:0 2px;background:var(--card);border:1.5px solid var(--line);border-radius:16px}
html[data-theme] .stepper button{background:none;color:var(--ink2);border:0}
html[data-theme] .stepper output{flex:none;width:34px;font-size:20px}
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{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{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 */
html[data-theme] .pref-toggles{display:grid;gap:8px}
html[data-theme] .sheet-view .pref-toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px;margin:0;padding:0 14px;border-radius:16px;border:1.5px solid var(--line);background:var(--card);color:var(--ink);font-size:15px;cursor:pointer}
html[data-theme] .sheet-view .pref-toggle input{appearance:none;-webkit-appearance:none;position:relative;flex:none;width:46px;height:28px;min-height:0;margin:0;padding:0;border:0;border-radius:14px;background:var(--line);cursor:pointer;transition:background .2s}
html[data-theme] .sheet-view .pref-toggle input::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:var(--paper);box-shadow:0 1px 3px #0003;transition:transform .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(18px)}
@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(8px + var(--tg-top))}
html[data-theme] .telegram-mode #sheet{max-height:calc(100dvh - 12px - var(--tg-top))}
/* Настройки переноса — длинный экран: на весь экран, шапка липнет под кнопками Telegram на фоне листа */
html[data-theme] .telegram-mode #sheet[data-view=settings]{inset:0;width:100%;max-width:none;height:100dvh;max-height:none;margin:0;padding-top:0;border:0;border-radius:0;box-shadow:none}
html[data-theme] .telegram-mode #sheet[data-view=settings] .sheet-handle{display:none}
html[data-theme] .telegram-mode #sheet[data-view=settings] .sheet-header{padding-top:calc(6px + var(--tg-top));box-shadow:none}
/* Настройки без прокрутки на обычных 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:46px;min-height:46px}
html[data-theme]:where(.h-le-900) .telegram-mode #settings-view .unit-seg span,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:28px}
html[data-theme]:where(.h-le-900) .telegram-mode #snooze-settings-form .primary-button{box-shadow:0 0 0 14px var(--paper),0 6px 0 14px var(--paper)}
html[data-theme] .telegram-mode #sheet[data-view=settings]::backdrop{background:var(--paper)}
/* Календарь в Telegram прижат к верху под кнопками «Закрыть»/«Свернуть»: по центру он прыгал, когда Telegram с опозданием ужимал экран под клавиатуру */
html[data-theme] .telegram-mode .date-picker{inset:var(--tg-top) 0 0;margin:8px auto auto;max-height:calc(100dvh - 16px - var(--tg-top))}
html[data-theme] .telegram-mode #date-picker-form{max-height:calc(100dvh - 18px - var(--tg-top))}
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]{animation:boop-sheet-in .34s cubic-bezier(.2,.8,.2,1)}
html[data-theme] #sheet[open]::backdrop,html[data-theme] .date-picker[open]::backdrop{animation:boop-fade-in .25s ease-out}
html[data-theme] .telegram-mode #sheet[open][data-view=settings]{animation:boop-full-in .3s cubic-bezier(.2,.8,.2,1)}
html[data-theme] .date-picker[open]{animation:boop-pop-in .24s cubic-bezier(.2,.8,.2,1)}
}
@keyframes boop-sheet-in{from{transform:translateY(100%)}}
@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}}
/* Кнопка «Напиши текстом» над сценой носа: сцена заходит на неё сверху на 26 px, и на маленьких экранах нижняя половина кнопки ловила тап носом */
html[data-theme] .text-button{position:relative;z-index:2}
/* Настройки: звук и вибрация в одну строку, разделы с одинаковыми подписями */
html[data-theme] .sheet-view .settings-label{margin:22px 0 8px;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:40px}
html[data-theme] .sheet-view .settings-lead{margin:0 0 4px}
html[data-theme] .pref-toggles{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
html[data-theme] .sheet-view .pref-toggle{padding:0 10px 0 14px;gap:8px}
html[data-theme] .sheet-view .pref-toggle span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:359px){html[data-theme] .sheet-view .pref-toggle{padding:0 8px 0 12px;font-size:14px}html[data-theme] .sheet-view .pref-toggle input{width:40px;height:24px;border-radius:12px}html[data-theme] .sheet-view .pref-toggle input::after{width:18px;height:18px}html[data-theme] .sheet-view .pref-toggle input:checked::after{transform:translateX(16px)}}
/* «Сохранить настройки» всегда под рукой: липнет к низу и закрывает прокручиваемое под ним кольцом цвета листа */
html[data-theme] #snooze-settings-form .primary-button{position:sticky;bottom:12px;z-index:2;box-shadow:0 0 0 14px var(--paper),0 20px 0 14px var(--paper)}
html[data-theme] .telegram-mode #sheet[data-view=settings]{padding-bottom:calc(12px + var(--safe-bottom))}
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 -18px;padding:10px 18px 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: пока набираешь интервал, «Сохранить» стоит на своём месте и не ложится на поля над клавиатурой */
html[data-theme] #snooze-settings-form:has(input:focus) .primary-button{position:relative;bottom:auto;box-shadow:none}
/* 2.1.4: плашка снизу, у пальца, и не закрывает шапку */
html[data-theme] .toast,html[data-theme] .telegram-mode .toast{top:auto;bottom:calc(12px + var(--safe-bottom))}
/* 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::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) .capture-heading h2{font-size:22px;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}
/* Вход в правку: пилюля в строке даты, заметна и в зоне большого пальца. */
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:6px;min-height:40px;padding:0 14px 0 12px;border-radius:999px;border:1.5px solid var(--line);background:var(--paper);color:var(--ink);font:inherit;font-size:14px;font-weight:550;cursor:pointer}
html[data-theme] .detail-edit svg{width:16px;height:16px;color:var(--accent)}
html[data-theme] #detail-text{cursor:pointer}.settings-privacy{display:inline-flex;align-items:center;min-height:44px;color:var(--accent,#5b4bd6);font-size:14px}