/* Стезя: днём — морская карта (data-look="chart"), после заката — тёмный HUD (data-look="hud"), ночью — красный свет (.red).
   Вид выбирает sky.js по солнцу над Минском или настройка темы. Имена переменных прежние — их использует app.js */
:root {
  --bg:#05070A; --card:rgba(13,17,22,.82); --ink:#E9EDF2; --soft:#A3ACB7; --faint:#7D8793; --line:#1A2028; --line2:#2A323C;
  --field:#10151B;
  --teal:#3CC2A6; --teal-bg:rgba(60,194,166,.13); --amber:#F0A15A; --amber-bg:rgba(240,161,90,.12); --blue:#7FA8DA; --blue-bg:rgba(127,168,218,.12);
  --violet:#A79BF0; --violet-bg:rgba(167,155,240,.12); --pink:#F07AAE; --pink-bg:rgba(240,122,174,.12); --warn:#FF8A7A; --warn-bg:rgba(255,138,122,.12);
  --on-accent:#05070A; --on-ink:#05070A; --dock:rgba(7,9,12,.92);
  --s0:#141A21; --s1:#173A33; --s2:#1F6456; --s3:#2E9A83; --s4:#3CC2A6;
  --k0:#121820; --k1:#1E2E42; --k2:#2E4D72; --k3:#5A83B6; --k4:#8FB5E3;
  --wake:#F0A15A;
  --shadow:none;
  --tip-bg:#E9EDF2; --tip-ink:#05070A;
  --dawn-a:transparent; --dawn-b:transparent; --dawn-ink:var(--ink); --dawn-ref:var(--amber); --dawn-glow:rgba(240,161,90,.3);
  --mono:"JetBrains Mono",ui-monospace,Menlo,monospace; --disp:Oswald,"Arial Narrow",sans-serif; --serif:"PT Serif",Georgia,serif;
  /* имена, которые использует app.js */
  --pine:var(--teal); --pine-ink:var(--on-accent); --gold:var(--warn); --ink-soft:var(--soft);
  --surface:var(--card); --paper:var(--bg);
  color-scheme:dark;
}
/* Морская карта: бумага, чернила, сетка широт и долгот */
:root[data-look="chart"] {
  --bg:#F2ECDF; --card:rgba(251,248,240,.88); --ink:#1F2B35; --soft:#4F5B64; --faint:#736F66; --line:#E2D9C7; --line2:#CDC2AB;
  --field:#EAE3D3;
  --teal:#0E7C6B; --teal-bg:rgba(14,124,107,.1); --amber:#B4560F; --amber-bg:rgba(180,86,15,.1); --blue:#35629A; --blue-bg:rgba(53,98,154,.1);
  --violet:#4E4691; --violet-bg:rgba(78,70,145,.1); --pink:#B83B73; --pink-bg:rgba(184,59,115,.1); --warn:#B42318; --warn-bg:rgba(180,35,24,.08);
  --on-accent:#FFFDF8; --on-ink:#F2ECDF; --dock:rgba(246,241,230,.94);
  --s0:#E4DCCB; --s1:#CBE0D6; --s2:#8FC4B4; --s3:#3FA58E; --s4:#0E7C6B;
  --k0:#E6E0D2; --k1:#D3DCE6; --k2:#A9C2E2; --k3:#6F95C6; --k4:#35629A;
  --wake:#C2620F;
  --tip-bg:#1F2B35; --tip-ink:#F2ECDF; --dawn-glow:rgba(180,86,15,.15);
  color-scheme:light;
}

* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:var(--mono);
  font-size:14px; line-height:1.55; font-variant-numeric:tabular-nums;
  padding-top:env(safe-area-inset-top,0px); }
h1,h2,h3 { margin:0; line-height:1.2; text-wrap:balance; }
button, input, select, textarea { font:inherit; color:inherit; }
button { cursor:pointer; }
a { color:var(--teal); }
:focus-visible { outline:2px solid var(--teal); outline-offset:2px; }
[hidden] { display:none !important; }
.sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.warn-t { color:var(--warn); } .ok-t { color:var(--teal); }
.note { margin:10px 0 0; font-size:13.5px; color:var(--faint); max-width:70ch; }
.empty { color:var(--faint); font-size:14.5px; padding:6px 0; margin:0; list-style:none; }

/* ---------- каркас ---------- */
.app { max-width:1100px; margin:0 auto; padding:0 16px calc(96px + env(safe-area-inset-bottom,0px)); }
.side { display:none; }
.top { padding:18px 2px 14px; display:flex; flex-direction:column; gap:4px; }
.top-row { display:flex; justify-content:space-between; align-items:center; gap:10px; }
.top-r { display:flex; align-items:center; gap:8px; }
.eyebrow { font-size:13px; font-weight:500; color:var(--faint); }
.top h1 { font-size:clamp(26px,6.5vw,32px); font-weight:700; letter-spacing:-.02em; margin-top:6px; }
.top h1::first-letter { text-transform:uppercase; }
.lede { margin:0; font-size:14.5px; color:var(--soft); }
.lede b { color:var(--ink); font-weight:600; }
.gear { width:34px; height:34px; border-radius:50%; display:grid; place-items:center; color:var(--soft); background:var(--card); box-shadow:var(--shadow); }
.gear svg { width:19px; height:19px; }
.gear.on { color:var(--teal); }
.sync { white-space:nowrap; display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:500; color:var(--faint);
  background:var(--card); border:0; border-radius:20px; padding:5px 11px; box-shadow:var(--shadow); }
.sync::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--line2); }
.sync.ok { color:var(--teal); background:var(--teal-bg); box-shadow:none; }
.sync.ok::before { background:var(--teal); }
.sync.busy::before { background:var(--faint); animation:pulse 1s ease-in-out infinite; }
.sync.warn { color:var(--warn); background:var(--warn-bg); box-shadow:none; }
.sync.warn::before { background:var(--warn); }
@keyframes pulse { 50% { opacity:.3; } }
.notice { margin:0 0 14px; padding:11px 14px; border-radius:14px; background:var(--warn-bg); color:var(--warn); font-size:14.5px; }

.view { display:grid; grid-template-columns:minmax(0,1fr); gap:14px; align-items:start; }
.stack { display:grid; gap:14px; min-width:0; }
section { min-width:0; }
.card { background:var(--card); border-radius:22px; padding:16px; box-shadow:var(--shadow); }
.card-h { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:12px; flex-wrap:wrap; }
.card-h h2 { font-size:17px; font-weight:600; }
.card-h small, .card-h .aside { font-size:13px; font-weight:500; color:var(--faint); }
.sec-head { display:flex; justify-content:space-between; align-items:baseline; gap:10px; flex-wrap:wrap; margin:4px 2px 12px; }
.sec-head h2 { font-size:19px; font-weight:700; }
.sec-head .aside { font-size:13px; color:var(--faint); }
.connect-card { margin-top:14px; }
.foot-note { margin:10px 0 0; font-size:12.5px; color:var(--faint); }

/* ---------- вкладки ---------- */
.tabbar { position:fixed; left:0; right:0; bottom:0; z-index:15; display:grid; grid-template-columns:repeat(5,1fr);
  padding:6px 8px calc(6px + env(safe-area-inset-bottom,0px)); background:color-mix(in srgb, var(--card) 88%, transparent);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-top:1px solid var(--line); }
.tabbar a, .side-nav a { display:flex; flex-direction:column; align-items:center; gap:2px; padding:5px 0; font-size:11.5px; font-weight:500;
  color:var(--faint); text-decoration:none; -webkit-tap-highlight-color:transparent; border-radius:12px; }
.tabbar svg, .side-nav svg { width:23px; height:23px; }
.tabbar a[aria-current="page"], .side-nav a[aria-current="page"] { color:var(--teal); }

/* ---------- сегментированные переключатели и навигация ---------- */
.seg { display:inline-flex; background:var(--field); border-radius:12px; padding:3px; gap:2px; }
.seg button { border:0; background:none; padding:5px 12px; border-radius:9px; font-size:13.5px; font-weight:500; color:var(--soft); }
.seg button[aria-selected="true"] { background:var(--card); color:var(--ink); box-shadow:0 1px 3px rgba(16,24,40,.12); }
.nav { display:flex; align-items:center; gap:6px; }
.nav button, .per-nav button { border:0; background:var(--field); border-radius:10px; padding:5px 11px; font-size:13px; font-weight:500; color:var(--soft); }
.nav button:disabled, .per-nav button:disabled { opacity:.45; cursor:default; }
#week-label, #kc-label { font-size:13px; color:var(--soft); min-width:110px; text-align:center; }

/* ---------- кнопки и поля ---------- */
.field { border:1px solid var(--line2); background:var(--field); border-radius:12px; padding:8px 11px; font-size:15px; min-width:0; }
.field:focus { border-color:var(--teal); outline:none; }
.field.mini { padding:3px 8px; font-size:13px; border-radius:9px; margin-left:4px; }
.btn { border:0; background:var(--teal); color:var(--on-accent); border-radius:12px; padding:9px 15px; font-weight:600; font-size:14px; }
.btn.ghost { background:var(--field); color:var(--ink); font-weight:500; }
.btn.danger { background:var(--warn-bg); color:var(--warn); }
.btn.pink { background:var(--pink); }
.btn.sm { padding:6px 11px; font-size:13px; border-radius:10px; }
.btn:disabled { opacity:.45; cursor:default; }
.linkbtn { background:none; border:0; padding:0; color:var(--teal); font-weight:500; text-decoration:underline; text-underline-offset:3px; }
.xbtn { background:none; border:0; color:var(--faint); font-size:19px; line-height:1; padding:0 4px; }
.xbtn:hover { color:var(--warn); }
form.row { display:flex; flex-wrap:wrap; gap:8px; margin:14px 0 6px; }
form.row input[type=text] { flex:1 1 200px; }
.fgrid { display:flex; flex-wrap:wrap; gap:10px; align-items:end; margin-top:12px; }
.fgrid label { display:grid; gap:4px; font-size:12.5px; font-weight:500; color:var(--faint); }
.fgrid label.wide { flex:1 1 100%; }
.kf-hint { flex:1 1 100%; margin:-4px 0 0; font-size:13.5px; font-weight:500; color:var(--soft); }
.fgrid textarea.field { width:100%; resize:vertical; }
details.sub > summary { cursor:pointer; list-style:none; font-size:17px; font-weight:600; display:flex; justify-content:space-between; align-items:center; }
details.sub > summary::-webkit-details-marker { display:none; }
details.sub > summary::after { content:""; width:9px; height:9px; border-right:2px solid var(--faint); border-bottom:2px solid var(--faint);
  transform:rotate(45deg); margin:0 4px 4px; transition:transform .15s; }
details.sub[open] > summary::after { transform:rotate(-135deg); margin-bottom:-2px; }
details.sub[open] > summary { margin-bottom:6px; }
.h3 { font-size:15px; font-weight:600; margin:0 0 8px; }
.h3.top { margin-top:16px; }
.state { font-size:14px; color:var(--soft); margin:6px 0; }
ol.steps { margin:6px 0 8px; padding-left:20px; font-size:14px; color:var(--soft); display:grid; gap:5px; }
ol.steps code { font-family:ui-monospace,Menlo,monospace; font-size:13px; background:var(--field); padding:1px 5px; border-radius:5px; }
.days { display:flex; gap:4px; flex-wrap:wrap; }
.days label { display:inline-flex; align-items:center; justify-content:center; width:38px; height:36px; border-radius:10px; background:var(--field);
  font-size:13px; font-weight:500; color:var(--soft); cursor:pointer; }
.days input { position:absolute; opacity:0; pointer-events:none; }
.days label:has(input:checked) { background:var(--teal-bg); color:var(--teal); }
.days label:has(input:focus-visible) { outline:2px solid var(--teal); }

/* ---------- кнопки утра ---------- */
.kid-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.kbtn { display:grid; grid-template-columns:30px 1fr auto; gap:10px; align-items:center; text-align:left; padding:13px 12px;
  border:0; border-radius:18px; -webkit-tap-highlight-color:transparent; transition:transform .1s; min-height:74px; }
.kbtn:active { transform:scale(.98); }
.kbtn svg { width:28px; height:28px; }
.kbtn b { display:block; font-size:14.5px; font-weight:600; line-height:1.2; }
.kbtn > span > span { display:block; font-size:12px; color:var(--soft); margin-top:3px; line-height:1.3; }
.kbtn.kid { background:var(--amber-bg); } .kbtn.kid b { color:var(--amber); }
.kbtn.sleep { background:var(--blue-bg); } .kbtn.sleep b { color:var(--blue); }
.kbtn.night { background:var(--violet-bg); } .kbtn.night b { color:var(--violet); }
.kbtn.me { background:var(--teal-bg); } .kbtn.me b { color:var(--teal); }
.kbtn:disabled { opacity:.5; cursor:default; }

/* ---------- лента дня ---------- */
.tl { list-style:none; margin:0; padding:0; position:relative; }
.tl::before { content:""; position:absolute; left:83px; top:10px; bottom:10px; width:2px; background:var(--line); border-radius:2px; }
.tl li { display:grid; grid-template-columns:70px 1fr; gap:26px; padding:8px 0; position:relative; }
.tl li::before { content:""; position:absolute; left:78px; top:13px; width:12px; height:12px; border-radius:50%; background:var(--line2);
  box-shadow:0 0 0 3px var(--card); }
.tl time { font-size:13px; font-weight:600; color:var(--soft); text-align:right; padding-top:1px; }
.tl b { display:block; font-size:15px; font-weight:600; }
.tl li > div > span { display:block; font-size:13px; color:var(--faint); }
.tl .kid::before { background:var(--amber); } .tl .me::before { background:var(--teal); }
.tl .slot::before { background:var(--blue); } .tl .busy::before { background:var(--violet); }
.tl .band > div { background:var(--amber-bg); border-radius:12px; padding:7px 10px; margin:-7px 0 -3px -10px; }
.tl .done b { color:var(--faint); font-weight:500; }
.tl .done::before { opacity:.55; }
.tl .now { padding:0; }
.tl .cur > div { background:var(--field); border-radius:12px; padding:7px 10px; margin:-7px 0 -3px -10px; }
.tl .cur b { font-weight:600; }
.tl .now::before { background:var(--warn); width:10px; height:10px; left:79px; top:4px; }
.tl .now time { color:var(--warn); font-size:12px; }
.tl .now > span { color:var(--warn); font-size:12px; font-weight:600; padding-top:1px; }

/* ---------- привычки на сегодня ---------- */
ul.today { list-style:none; margin:0; padding:0; }
ul.today li + li { border-top:1px solid var(--line); }
.hab { width:100%; display:grid; grid-template-columns:28px 1fr auto; align-items:center; gap:12px; text-align:left;
  padding:11px 0; background:none; border:0; -webkit-tap-highlight-color:transparent; }
.tick { width:26px; height:26px; border-radius:50%; background:var(--field); display:grid; place-items:center; transition:background .15s; }
.tick svg { width:13px; height:13px; opacity:0; transition:opacity .15s; }
.hab[aria-pressed="true"] .tick { background:var(--teal); }
.hab[aria-pressed="true"] .tick svg { opacity:1; }
.hab-main { display:flex; flex-direction:column; gap:1px; min-width:0; }
.hab-name { font-size:15.5px; font-weight:500; }
.hab[aria-pressed="true"] .hab-name { color:var(--soft); }
.hab-meta { font-size:12.5px; color:var(--faint); }
.dots { display:flex; gap:3px; }
.dots i { width:8px; height:8px; border-radius:50%; background:var(--line2); }
.dots i.on { background:var(--teal); }

/* ---------- задачи ---------- */
ul.ptasks { list-style:none; margin:0; padding:0; }
.ptasks .grp { font-size:12.5px; font-weight:600; color:var(--faint); padding:8px 0 2px; }
.ptasks .grp.warn { color:var(--warn); }
.pt { display:grid; grid-template-columns:26px 1fr; gap:10px; align-items:start; padding:9px 0; border-bottom:1px solid var(--line); }
.pt:last-child { border-bottom:0; }
.pt button { width:22px; height:22px; border-radius:50%; border:0; background:var(--field); padding:0; display:grid; place-items:center; margin-top:1px; }
.pt button svg { width:11px; height:11px; opacity:0; }
.pt.done button { background:var(--teal); }
.pt.done button svg { opacity:1; }
.pt.done .pt-t { color:var(--faint); text-decoration:line-through; }
.pt-t { font-size:15px; line-height:1.35; overflow-wrap:anywhere; }
.pt-t small { display:block; font-size:12.5px; color:var(--faint); text-decoration:none; }
.pt-foot { margin:10px 0 0; font-size:12.5px; color:var(--faint); }

/* ---------- вдвоём ---------- */
.duo { display:flex; align-items:center; gap:14px; background:var(--pink-bg); box-shadow:none; }
.duo b { font-size:34px; font-weight:700; color:var(--pink); line-height:1; }
.duo span { font-size:14px; color:var(--soft); flex:1; }
.duo .btn { background:var(--pink); white-space:nowrap; }
.tg { display:grid; grid-template-columns:minmax(0,1fr); gap:16px; align-items:center; }
.tg-big { display:flex; flex-direction:column; gap:2px; }
.tg-big b { font-size:48px; font-weight:700; line-height:1; letter-spacing:-.02em; color:var(--pink); }
.tg-big b.warn { color:var(--warn); }
.tg-big span { font-size:15px; color:var(--soft); }
.tg-big small { font-size:13.5px; color:var(--faint); }
.wstrip { display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:4px; }
.wstrip span { aspect-ratio:1; max-width:100%; border-radius:6px; background:var(--s0); }
.wstrip span.on { background:var(--teal); }
.wstrip span.part { background:var(--s2); }
.wstrip span.none { background:transparent; box-shadow:inset 0 0 0 1px var(--line); }
.wstrip span.cur { box-shadow:0 0 0 2px var(--card), 0 0 0 3.5px var(--faint); }
#together .wstrip span.on { background:var(--pink); }
ul.tg-list { list-style:none; margin:6px 0 0; padding:0; }
.tg-list li { display:flex; gap:12px; align-items:baseline; padding:8px 0; border-bottom:1px solid var(--line); font-size:15px; }
.tg-list li:last-child { border-bottom:0; }
.tg-list .d { font-size:13px; color:var(--faint); white-space:nowrap; min-width:96px; }
.tg-list .n { flex:1; color:var(--soft); overflow-wrap:anywhere; }

/* ---------- утро ---------- */
.forecast { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.fc-box { border-radius:22px; padding:16px; display:flex; flex-direction:column; gap:2px; }
.fc-box.kid { background:var(--amber-bg); }
.fc-box.me { background:var(--teal-bg); }
.fc-box .eyebrow { color:var(--soft); }
.fc-big { font-size:clamp(40px,11vw,56px); font-weight:700; letter-spacing:-.03em; line-height:1; margin:8px 0 6px; }
.fc-box.kid .fc-big { color:var(--amber); }
.fc-box.me .fc-big { color:var(--teal); }
.fc-box p { margin:0; font-size:14px; color:var(--soft); }
.fc-basis { margin:10px 4px 0; font-size:13px; color:var(--faint); max-width:75ch; }
.fc-basis:empty { display:none; }
.kc { overflow:hidden; }
.kc-grid { display:grid; grid-template-columns:38px repeat(var(--cols), minmax(0,1fr)); column-gap:3px; }
.kc-head { font-size:10.5px; color:var(--faint); text-align:center; line-height:1.2; padding-bottom:6px; }
.kc-head b { display:block; font-size:12.5px; font-weight:600; color:var(--soft); }
.kc-head.today b { color:var(--teal); }
.kc-head.fc, .kc-head.fc b { color:var(--k4); }
.kc-time { font-size:10.5px; color:var(--faint); line-height:1; transform:translateY(-5px); }
.kc-c { height:13px; background:var(--k0); position:relative; }
.kc-c.hr { box-shadow:inset 0 1px 0 var(--card); }
.kc-c.first { border-radius:6px 6px 0 0; } .kc-c.last { border-radius:0 0 6px 6px; }
.kc-c.band { background:var(--k1); }
.kc-c.f1 { background:var(--k1); } .kc-c.f2 { background:var(--k2); } .kc-c.f3 { background:var(--k3); } .kc-c.f4 { background:var(--k4); }
.kc-c.wk::after { content:""; position:absolute; left:50%; top:50%; width:11px; height:11px; margin:-5.5px 0 0 -5.5px;
  border-radius:50%; background:var(--wake); box-shadow:0 0 0 2px var(--card); z-index:1; }
.kc-c.me::before { content:""; position:absolute; left:2px; right:2px; top:50%; height:3px; margin-top:-1.5px; background:var(--teal); border-radius:2px; }
.kc-foot, .kc-foot-l { font-size:10.5px; color:var(--faint); text-align:center; padding-top:5px; white-space:nowrap; overflow:hidden; }
.kc-foot-l { text-align:left; }
.kc-foot.w { color:var(--wake); } .kc-foot.me { color:var(--teal); }
.klegend { display:flex; flex-wrap:wrap; gap:6px 16px; margin-top:12px; font-size:12.5px; color:var(--faint); }
.klegend > span { display:inline-flex; align-items:center; gap:6px; }
.klegend i { width:12px; height:12px; border-radius:3px; display:inline-block; }
.klegend i.dot { border-radius:50%; background:var(--wake); width:10px; height:10px; }
.klegend i.bar-me { width:14px; height:3px; border-radius:2px; background:var(--teal); }
.tiles { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px; }
.tiles div { background:var(--field); border-radius:16px; padding:11px 13px; display:flex; flex-direction:column; gap:1px; min-width:0; }
.tiles b { font-size:20px; font-weight:700; letter-spacing:-.01em; }
.tiles span { font-size:12px; color:var(--faint); }
ul.insights { list-style:none; margin:14px 0 0; padding:0; display:grid; gap:6px; }
ul.insights:empty { display:none; }
ul.insights li { font-size:14.5px; color:var(--soft); padding-left:16px; position:relative; max-width:75ch; }
ul.insights li::before { content:""; position:absolute; left:2px; top:.6em; width:7px; height:7px; border-radius:50%; background:var(--k3); }

/* ---------- графики ---------- */
.charts2 { display:grid; grid-template-columns:minmax(0,1fr); gap:22px; margin-top:22px; }
figure { margin:0; min-width:0; }
figcaption { font-weight:600; font-size:15px; margin-bottom:8px; }
figcaption small { display:block; font-weight:400; font-size:13px; color:var(--faint); margin-top:2px; }
.chart { width:100%; min-height:40px; }
.chart svg { display:block; max-width:100%; height:auto; overflow:visible; }
.chart .grid { stroke:var(--line); stroke-width:1; }
.chart .ax { font-family:var(--mono); font-size:10.5px; fill:var(--faint); }
.chart .ax.hl { fill:var(--violet); font-weight:600; }
.chart .bar { fill:var(--teal); }
.chart .bar.cur { fill:var(--s2); }
.chart .dot { fill:var(--wake); stroke:var(--card); stroke-width:2; }
.chart .fit { stroke:var(--faint); stroke-width:2; stroke-dasharray:5 4; fill:none; }
.chart .empty-c { font-size:14px; color:var(--faint); padding:14px 0; margin:0; }

/* ---------- неделя ---------- */
.scroll { overflow-x:auto; }
table.week { border-collapse:collapse; width:100%; font-variant-numeric:tabular-nums; }
.week th, .week td { padding:5px 2px; text-align:center; border-bottom:1px solid var(--line); }
.week tr:last-child td { border-bottom:0; }
.week th { font-weight:500; font-size:11.5px; color:var(--faint); line-height:1.3; }
.week th.is-today { color:var(--teal); }
.week th .ch { display:block; font-size:9.5px; color:var(--violet); }
.week th:first-child, .week td:first-child { text-align:left; padding-left:0; }
.week td.name { font-size:14px; line-height:1.3; padding-right:6px; }
.week td.name small { display:block; font-size:11.5px; color:var(--faint); }
.week td.today-col { background:color-mix(in srgb, var(--teal) 7%, transparent); }
.cell { width:30px; height:30px; border-radius:9px; border:0; background:var(--field); display:inline-grid; place-items:center; padding:0; -webkit-tap-highlight-color:transparent; }
.cell[aria-pressed="true"] { background:var(--teal); }
.cell svg { width:13px; height:13px; opacity:0; }
.cell[aria-pressed="true"] svg { opacity:1; }
.cell:disabled { background:transparent; box-shadow:inset 0 0 0 1px var(--line); cursor:default; }
.week td.sum { font-size:12.5px; white-space:nowrap; color:var(--soft); font-weight:500; }
.week td.sum.ok { color:var(--teal); } .week td.sum.warn { color:var(--warn); }

/* ---------- прогресс ---------- */
.per-nav { display:flex; align-items:center; gap:8px; margin-bottom:14px; }
.per-nav .nav-l { font-weight:600; font-size:16px; min-width:0; }
.per-nav .nav-l small { display:block; font-weight:400; font-size:13px; color:var(--faint); }
.per-nav .sp { flex:1; }
.prog { display:grid; grid-template-columns:minmax(0,1fr); gap:22px; align-items:start; }
.mgrid { display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); gap:4px; }
.mdow { font-size:11px; color:var(--faint); text-align:center; padding-bottom:2px; }
.md { aspect-ratio:1; border-radius:10px; background:var(--s0); position:relative; padding:5px 6px; display:flex;
  flex-direction:column; justify-content:space-between; min-width:0; }
.md b { font-weight:600; font-size:13px; line-height:1; color:var(--soft); }
.md i { font-style:normal; font-size:10px; line-height:1; color:var(--wake); font-weight:600; display:flex; align-items:center; gap:3px; white-space:nowrap; overflow:hidden; }
.md i::before { content:""; width:5px; height:5px; border-radius:50%; background:currentColor; flex:none; }
.md.l1 { background:var(--s1); } .md.l2 { background:var(--s2); } .md.l3 { background:var(--s3); } .md.l4 { background:var(--s4); }
.md.l3 b, .md.l4 b, .md.l3 i, .md.l4 i { color:var(--on-accent); }
.md.future { background:transparent; box-shadow:inset 0 0 0 1px var(--line); }
.md.future b { color:var(--faint); font-weight:500; }
.md.today { box-shadow:0 0 0 2px var(--card), 0 0 0 3.5px var(--ink); }
.minis { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; }
.mini-t { margin:0 0 6px; font-weight:600; font-size:14px; }
.minis .md { padding:0; border-radius:4px; }
.minis .mgrid { gap:2px; }
.minis .mdow { font-size:8.5px; }
.legend { display:flex; flex-wrap:wrap; align-items:center; gap:4px; margin-top:10px; font-size:12px; color:var(--faint); }
.legend i { width:12px; height:12px; border-radius:3px; display:inline-block; }
.legend .gap { width:12px; }
.legend .wd { width:7px; height:7px; border-radius:50%; background:var(--wake); }
.big-stat { display:flex; flex-direction:column; gap:2px; padding-bottom:12px; border-bottom:1px solid var(--line); }
.big-stat b { font-size:48px; font-weight:700; line-height:1; letter-spacing:-.03em; }
.big-stat span { font-size:15px; color:var(--soft); }
.big-stat small { font-size:13px; color:var(--faint); }
.big-stat .up { color:var(--teal); } .big-stat .down { color:var(--warn); }
ul.hbars { list-style:none; margin:0; padding:0; }
ul.hbars li { padding:10px 0; border-bottom:1px solid var(--line); display:grid; gap:6px; }
ul.hbars li:last-child { border-bottom:0; }
.hb-top { display:flex; justify-content:space-between; gap:12px; font-size:15px; }
.hb-top .v { font-size:12.5px; color:var(--soft); white-space:nowrap; }
.hb { height:8px; border-radius:4px; background:var(--s0); overflow:hidden; }
.hb i { display:block; height:100%; border-radius:4px; background:var(--teal); }

/* ---------- цели ---------- */
.glist { display:grid; grid-template-columns:minmax(0,1fr); gap:14px; margin-bottom:14px; }
.glist > .empty, .glist > .note { background:var(--card); border-radius:22px; padding:16px; box-shadow:var(--shadow); margin:0; }
.goal { background:var(--card); border-radius:22px; padding:16px; box-shadow:var(--shadow); display:flex; flex-direction:column; gap:10px; min-width:0; }
.goal header { display:flex; justify-content:space-between; align-items:start; gap:10px; }
.goal h3 { font-size:17px; font-weight:600; }
.chip { font-size:12px; font-weight:600; padding:3px 9px; border-radius:20px; white-space:nowrap; background:var(--field); color:var(--soft); }
.chip.ok { background:var(--teal-bg); color:var(--teal); }
.chip.warn { background:var(--warn-bg); color:var(--warn); }
.chip.done { background:var(--teal); color:var(--on-accent); }
.g-meta { margin:0; font-size:13px; color:var(--faint); }
.g-val { margin:0; font-size:15px; color:var(--soft); }
.g-val b { font-size:26px; font-weight:700; color:var(--ink); letter-spacing:-.02em; }
.g-bar { position:relative; height:10px; border-radius:5px; background:var(--s0); }
.g-bar i { position:absolute; left:0; top:0; bottom:0; border-radius:5px; background:var(--teal); }
.g-bar em { position:absolute; top:-4px; bottom:-4px; width:3px; margin-left:-1.5px; background:var(--ink); border-radius:2px; }
.g-pace { margin:0; font-size:13.5px; color:var(--soft); }
.g-spark svg { display:block; max-width:100%; height:auto; }
.g-spark .plan-l { stroke:var(--faint); stroke-width:1.5; stroke-dasharray:4 4; fill:none; }
.g-spark .act { stroke:var(--teal); stroke-width:2; fill:none; }
.g-spark .area { fill:color-mix(in srgb, var(--teal) 14%, transparent); }
.g-spark .gp { fill:var(--teal); stroke:var(--card); stroke-width:2; }
.g-spark .ax { font-size:10.5px; fill:var(--faint); }
.g-spark .base { stroke:var(--line); }
form.g-upd { display:flex; flex-wrap:wrap; gap:6px; }
form.g-upd input { flex:1 1 100px; width:100px; }
ul.g-steps { list-style:none; margin:0; padding:0; }
.g-steps li { display:flex; gap:10px; align-items:start; padding:6px 0; font-size:15px; }
.g-steps input { margin-top:4px; accent-color:var(--teal); width:17px; height:17px; flex:none; }
.g-steps li.done span { color:var(--faint); text-decoration:line-through; }
.g-steps .xbtn { margin-left:auto; }
details.g-edit > summary { cursor:pointer; list-style:none; font-size:13px; font-weight:500; color:var(--faint); }
details.g-edit > summary::-webkit-details-marker { display:none; }
#goal-add summary { font-size:15.5px; }

/* ---------- система ---------- */
.sys-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:20px; margin-top:18px; }
#sys-tiles, #ft-tiles { grid-template-columns:repeat(4, minmax(0,1fr)); }
ul.plain { list-style:none; margin:0; padding:0; }
ul.checks li { display:flex; align-items:center; gap:10px; padding:9px 0; border-bottom:1px solid var(--line); font-size:15px; }
ul.checks li:last-child { border-bottom:0; }
.checks .dot { width:9px; height:9px; border-radius:50%; flex:none; background:var(--line2); }
.checks .ok .dot { background:var(--teal); } .checks .warn .dot { background:var(--warn); } .checks .mid .dot { background:var(--amber); }
.ck-name { flex:1; } .ck-val { font-size:12.5px; color:var(--faint); white-space:nowrap; }
.ck-sub { display:block; font-size:13px; color:var(--faint); }
.rv-text { margin:10px 0 12px; font-size:15px; color:var(--soft); }
.rv-text b { color:var(--ink); }

/* ---------- настройки ---------- */
ul.mlist { list-style:none; margin:0; padding:0; }
ul.mlist li { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:9px 0; border-bottom:1px solid var(--line); }
ul.mlist .field.name { flex:1 1 200px; }
ul.mlist .arch-name { flex:1 1 200px; color:var(--faint); }
.mhead { font-size:12.5px; font-weight:600; color:var(--faint); margin:18px 0 4px; }
.connect { display:grid; gap:12px; margin-top:6px; max-width:620px; }
.connect label { display:grid; gap:4px; font-size:12.5px; font-weight:500; color:var(--faint); }
.connect .actions { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
#slot-list { margin-bottom:10px; }

/* ---------- всплывашки ---------- */
.tip { position:fixed; z-index:30; pointer-events:none; background:var(--tip-bg); color:var(--tip-ink); font-size:12px;
  padding:5px 9px; border-radius:8px; white-space:nowrap; }
.toast { position:fixed; left:50%; transform:translateX(-50%); bottom:calc(78px + env(safe-area-inset-bottom,0px)); z-index:20;
  background:var(--tip-bg); color:var(--tip-ink); border-radius:14px; padding:11px 15px; font-size:14.5px;
  display:flex; gap:14px; align-items:center; width:max-content; max-width:calc(100vw - 32px); box-shadow:0 8px 24px rgba(0,0,0,.2); }
.toast button { background:none; border:0; color:inherit; font-weight:600; text-decoration:underline; text-underline-offset:3px; padding:0; white-space:nowrap; }

/* ---------- узкие экраны ---------- */
@media (max-width:420px) {
  .kbtn { grid-template-columns:26px 1fr; gap:8px; padding:11px 10px; }
  .kbtn svg { width:24px; height:24px; }
  .forecast { gap:8px; }
  .fc-box { padding:14px; }
  .fc-big { font-size:40px; }
  #sys-tiles, #ft-tiles { grid-template-columns:repeat(2, minmax(0,1fr)); }
  .md { padding:3px 4px; border-radius:7px; }
  .md b { font-size:11.5px; }
  .md i { font-size:8.5px; }
  .md i::before { display:none; }
  .tl::before { left:67px; } .tl li { grid-template-columns:56px 1fr; gap:24px; } .tl li::before { left:62px; } .tl .now::before { left:63px; }
  .tl time { font-size:12px; }
  .cell { width:27px; height:27px; border-radius:8px; }
  .week th, .week td { padding:4px 1px; }
  .week th { font-size:10.5px; }
  .week td.name { font-size:13px; }
  .week td.sum { font-size:11.5px; }
  .eyebrow { font-size:12px; }
}

/* ---------- широкие экраны: боковое меню и две колонки ---------- */
@media (min-width:960px) {
  body { display:grid; grid-template-columns:220px minmax(0,1fr); }
  .tabbar { display:none; }
  .side { display:flex; flex-direction:column; gap:18px; position:sticky; top:0; height:100vh; padding:26px 14px; border-right:1px solid var(--line); }
  .brand { font-size:18px; font-weight:700; padding:0 10px; display:flex; align-items:center; gap:10px; }
  .brand img { border-radius:7px; }
  .side-nav { display:grid; gap:2px; }
  .side-nav a { flex-direction:row; gap:12px; padding:10px 12px; font-size:15px; }
  .side-nav a[aria-current="page"] { background:var(--teal-bg); }
  .side-nav svg { width:21px; height:21px; }
  .app { padding:0 28px 48px; width:100%; }
  .top { padding-top:26px; }
  .view { grid-template-columns:repeat(2, minmax(0,1fr)); gap:16px; }
  .span2 { grid-column:1 / -1; }
  .kid-actions { grid-template-columns:repeat(4, 1fr); }
  .tiles.six { grid-template-columns:repeat(6, minmax(0,1fr)); }
  .tiles.four { grid-template-columns:repeat(4, minmax(0,1fr)); }
  .span2 .charts2, .span2 .prog { grid-template-columns:repeat(2, minmax(0,1fr)); gap:28px; }
  .prog.q { grid-template-columns:minmax(0,1fr); }
  .glist { grid-template-columns:repeat(2, minmax(0,1fr)); }
  .tg { grid-template-columns:minmax(0,1fr) minmax(0,1.3fr); gap:32px; }
  .sys-grid { grid-template-columns:repeat(2, minmax(0,1fr)); gap:32px; }
  .toast { bottom:24px; }
  .connect-card { max-width:none; }
}
@media (prefers-reduced-motion:reduce) { * { transition:none !important; animation:none !important; } }

/* ---------- кнопки по ситуации и редактор сна ---------- */
.kid-actions { grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); }
.done-chips { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.done-chips:empty { display:none; }
.chip-done { display:inline-flex; align-items:center; gap:6px; border:0; border-radius:20px; padding:6px 11px; font-size:13px; font-weight:500;
  background:var(--card); color:var(--soft); box-shadow:var(--shadow); }
.chip-done i { width:8px; height:8px; border-radius:50%; flex:none; }
.chip-done.fix { color:var(--teal); background:var(--teal-bg); box-shadow:none; }
.chip-note { font-size:13px; color:var(--faint); padding:6px 2px; }
ul.nights { list-style:none; margin:10px 0 6px; padding:0; display:grid; gap:6px; }
.night-row { width:100%; text-align:left; border:0; border-radius:12px; padding:8px 12px; background:var(--field); display:grid; gap:1px; }
.night-row b { font-size:14px; font-weight:600; }
.night-row span { font-size:12.5px; color:var(--faint); }
.night-row[aria-current="true"] { background:var(--teal-bg); }
.night-row[aria-current="true"] b { color:var(--teal); }

/* ---------- оформление ---------- */
.theme-row { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.theme-row p { margin:0; font-size:14px; color:var(--soft); }

/* ---------- ритуалы, слоты, главное ---------- */
.ritual { display:flex; align-items:center; gap:14px; background:var(--violet-bg); box-shadow:none; }
.ritual .r-ic { width:40px; height:40px; border-radius:12px; background:var(--card); display:grid; place-items:center; flex:none; }
.ritual .r-ic svg { width:22px; height:22px; }
.ritual .r-t { flex:1; min-width:0; }
.ritual b { display:block; font-size:16px; font-weight:600; color:var(--violet); }
.ritual span { font-size:13.5px; color:var(--soft); }
.ritual .btn { background:var(--violet); white-space:nowrap; }
.slot-card { background:var(--blue-bg); box-shadow:none; display:grid; gap:10px; }
.slot-card .eyebrow { color:var(--blue); font-weight:600; }
.slot-card h3 { font-size:20px; font-weight:700; letter-spacing:-.01em; }
.slot-card .sg { font-size:13.5px; color:var(--soft); }
.slot-card .row-btns .btn:not(.ghost) { background:var(--blue); }
.slot-card .btn.ghost { background:var(--card); }
.sbar { height:8px; border-radius:4px; background:color-mix(in srgb, var(--blue) 18%, transparent); overflow:hidden; }
.sbar i { display:block; height:100%; background:var(--blue); border-radius:4px; }
.row-btns { display:flex; flex-wrap:wrap; gap:8px; }
.inline-plan { display:flex; gap:8px; flex-wrap:wrap; }
.inline-plan .field { flex:1 1 200px; }
ul.focus { list-style:none; margin:0; padding:0; }
.focus li { display:grid; grid-template-columns:26px 1fr; gap:10px; align-items:start; padding:9px 0; border-bottom:1px solid var(--line); }
.focus li:last-child { border-bottom:0; }
.focus button.fk { width:22px; height:22px; border-radius:6px; border:0; background:var(--field); padding:0; display:grid; place-items:center; margin-top:1px; }
.focus button.fk svg { width:12px; height:12px; opacity:0; }
.focus li.done button.fk { background:var(--teal); }
.focus li.done button.fk svg { opacity:1; }
.focus li.done .ft { color:var(--faint); text-decoration:line-through; }
.focus .ft { font-size:15px; line-height:1.35; }
.focus .ft small { display:block; font-size:12.5px; color:var(--faint); text-decoration:none; }
ul.splan { list-style:none; margin:10px 0 0; padding:0; display:grid; gap:8px; }
.splan li { display:grid; grid-template-columns:120px 1fr; gap:10px; align-items:center; }
.splan .sd { font-size:13.5px; font-weight:600; }
.splan .sd small { display:block; font-weight:400; color:var(--faint); font-size:12.5px; }
.splan .st { font-size:12px; font-weight:600; }
.splan .st.done { color:var(--teal); } .splan .st.skip { color:var(--warn); }
.g-next { margin:0; font-size:14px; color:var(--soft); background:var(--field); border-radius:12px; padding:8px 11px; }
.g-next b { color:var(--ink); font-weight:600; }
.g-next.missing { background:var(--warn-bg); color:var(--warn); }
/* окно ритуала */
.sheet { position:fixed; inset:0; z-index:40; background:rgba(8,12,16,.45); display:flex; align-items:flex-end; justify-content:center; }
.sheet-in { background:var(--bg); width:100%; max-width:640px; max-height:94vh; border-radius:24px 24px 0 0; display:flex; flex-direction:column;
  padding:0 0 env(safe-area-inset-bottom,0px); box-shadow:0 -10px 40px rgba(0,0,0,.25); }
.sheet-h { display:flex; justify-content:space-between; align-items:flex-start; gap:10px; padding:18px 18px 6px; }
.sheet-h h2 { font-size:21px; font-weight:700; margin-top:2px; }
.xbtn.big { font-size:28px; padding:0 6px; }
.sheet-dots { display:flex; gap:5px; padding:0 18px 10px; }
.sheet-dots i { flex:1; height:4px; border-radius:2px; background:var(--line2); }
.sheet-dots i.on { background:var(--violet); }
.sheet-body { overflow:auto; padding:4px 18px 16px; display:grid; gap:12px; align-content:start; }
.sheet-f { display:flex; justify-content:space-between; gap:10px; padding:12px 18px 16px; border-top:1px solid var(--line); background:var(--card); }
.sheet-f .btn { min-width:110px; }
.sheet-f #sheet-next { background:var(--violet); }
.sheet .card { box-shadow:none; }
.pick { display:grid; gap:6px; }
.pick-h { font-size:12.5px; font-weight:600; color:var(--faint); margin:6px 0 0; }
.pick button.pi { display:grid; grid-template-columns:1fr auto; gap:10px; align-items:center; text-align:left; border:0; border-radius:12px;
  background:var(--card); padding:10px 12px; font-size:14.5px; }
.pick button.pi small { display:block; font-size:12px; color:var(--faint); }
.pick button.pi .plus { width:26px; height:26px; border-radius:50%; background:var(--violet-bg); color:var(--violet); display:grid; place-items:center; font-weight:700; }
.pick button.pi:disabled { opacity:.45; }
.chosen { display:grid; gap:6px; }
.chosen li { list-style:none; display:flex; gap:10px; align-items:center; background:var(--violet-bg); border-radius:12px; padding:9px 12px; font-size:15px; }
.chosen li span { flex:1; }
.chosen ol, ol.chosen { margin:0; padding:0; }
.w-stat { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px; }
.w-stat div { background:var(--card); border-radius:14px; padding:10px 12px; }
.w-stat b { display:block; font-size:20px; font-weight:700; }
.w-stat span { font-size:12px; color:var(--faint); }
.w-line { background:var(--card); border-radius:14px; padding:10px 12px; display:grid; gap:6px; }
.w-line b { font-size:15px; }
.w-line .fgrid { margin-top:0; }
body.noscroll { overflow:hidden; }
@media (min-width:960px) {
  .sheet { align-items:center; }
  .sheet-in { border-radius:24px; max-height:86vh; }
}
@media (max-width:420px) { .splan li { grid-template-columns:1fr; gap:4px; } }

.kgo { font-size:12.5px; font-weight:600; padding:6px 10px; border-radius:20px; background:var(--card); white-space:nowrap; }
.kbtn.kid .kgo { color:var(--amber); } .kbtn.sleep .kgo { color:var(--blue); } .kbtn.night .kgo { color:var(--violet); } .kbtn.me .kgo { color:var(--teal); }
@media (max-width:420px) { .kbtn { grid-template-columns:26px 1fr auto; } .kgo { padding:5px 8px; font-size:12px; } }

/* ---------- молитва ---------- */
.pray-card { display:flex; align-items:center; gap:14px; background:var(--violet-bg); box-shadow:none; }
.pray-card .pc-t { flex:1; min-width:0; }
.pray-card b { display:block; font-size:16px; font-weight:600; color:var(--violet); }
.pray-card span { font-size:13.5px; color:var(--soft); }
.pray-card .pc-live { font-size:26px; font-weight:700; color:var(--violet); font-variant-numeric:tabular-nums; }
.pray-card .btn { background:var(--violet); white-space:nowrap; }
.pray-card.met { background:var(--teal-bg); padding-top:12px; padding-bottom:12px; }
.pray-card.met b { font-size:15px; color:var(--teal); }
.pray-card.met .btn { background:transparent; color:var(--teal); }
.pc-ok { flex:none; display:grid; place-items:center; width:30px; height:30px; border-radius:50%; background:var(--teal); }
.pc-ok svg { width:16px; height:16px; }
.fgrid label.check { display:flex; align-items:center; gap:8px; font-size:14px; color:var(--soft); font-weight:500; }
.fgrid label.check input { width:18px; height:18px; accent-color:var(--teal); }
label.plan-l { display:grid; gap:6px; margin-top:12px; font-size:12.5px; font-weight:500; color:var(--faint); }
label.plan-l textarea { width:100%; resize:vertical; font-size:15px; line-height:1.5; }
/* полноэкранный режим — всегда тёмный и тихий, в любой теме */
.pray { position:fixed; inset:0; z-index:50; background:#0B0F14; color:#E6EAF0; display:flex; justify-content:center;
  padding:env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,0px); }
.pray-in { width:100%; max-width:520px; display:flex; flex-direction:column; padding:18px 22px 26px; }
.pray-h { display:flex; justify-content:space-between; align-items:center; font-size:14px; color:#8E99A8; }
.pray-x { background:none; border:0; color:#8E99A8; font-size:14px; padding:6px 0; }
.pray-main { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:26px; }
.ring { position:relative; width:min(72vw, 300px); aspect-ratio:1; }
.ring svg { width:100%; height:100%; transform:rotate(-90deg); }
.ring-bg { fill:none; stroke:#1C232C; stroke-width:6; }
.ring-fg { fill:none; stroke:#A79BF0; stroke-width:6; stroke-linecap:round; transition:stroke-dashoffset 1s linear; }
.ring-fg.over { stroke:#3CC2A6; }
.ring-t { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; }
.ring-t b { font-size:clamp(46px, 15vw, 64px); font-weight:600; letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.ring-t span { font-size:14px; color:#8E99A8; }
.pray.paused .ring-t b { opacity:.45; }
.pray-point { width:100%; text-align:center; display:grid; gap:8px; justify-items:center; }
.pp-n { font-size:12.5px; color:#8E99A8; letter-spacing:.06em; text-transform:uppercase; }
.pray-point b { font-size:22px; font-weight:600; line-height:1.3; max-width:22ch; text-wrap:balance; }
.pray-actions { display:flex; gap:12px; width:100%; }
.pray-btn { flex:1; border:0; border-radius:16px; padding:15px 12px; font-size:16px; font-weight:600; background:#A79BF0; color:#0B0F14; }
.pray-btn.soft { background:#1C232C; color:#E6EAF0; }
.pray-point .pray-btn { flex:none; padding:9px 20px; font-size:14px; }
.pray-done { font-size:34px; font-weight:600; }
.pray-lab { font-size:13px; color:#8E99A8; margin-bottom:-18px; }
.pray-input { background:#151B22; border:1px solid #28303A; color:#E6EAF0; border-radius:16px; font-size:40px; font-weight:600;
  width:160px; text-align:center; padding:8px; font-variant-numeric:tabular-nums; }
.pray-sub { margin:0; font-size:14px; color:#8E99A8; text-align:center; }
.tl .pr::before { background:var(--violet); }

/* ---------- молитвенные нужды ---------- */
#needs .row { margin-top:0; }
.needs-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:20px; margin-top:6px; }
ul.needs { list-style:none; margin:10px 0 0; padding:0; }
.needs li { padding:11px 0; border-bottom:1px solid var(--line); display:grid; gap:6px; }
.needs li:last-child { border-bottom:0; }
.nd-top { display:flex; gap:10px; align-items:start; }
.nd-t { flex:1; font-size:15.5px; line-height:1.35; overflow-wrap:anywhere; }
.nd-meta { font-size:12.5px; color:var(--faint); }
.nd-note { font-size:14px; color:var(--soft); background:var(--teal-bg); border-radius:10px; padding:7px 10px; }
.nd-act { display:flex; flex-wrap:wrap; gap:6px; }
.nd-form { display:flex; flex-wrap:wrap; gap:6px; align-items:center; background:var(--field); border-radius:12px; padding:8px; }
.nd-form .field { background:var(--card); }
.nd-form input[type=text] { flex:1 1 180px; }
.btn.teal-soft { background:var(--teal-bg); color:var(--teal); }
.md.ans { background:var(--teal); }
.md.ans b, .md.ans i { color:var(--on-accent); }
.md.nw i.nd-dot { position:absolute; right:5px; top:5px; width:7px; height:7px; border-radius:50%; background:var(--violet); }
.md i.cnt { font-style:normal; font-size:11px; font-weight:700; }
.md i.cnt::before { display:none; }
.legend .nd { width:8px; height:8px; border-radius:50%; background:var(--violet); }
.pray-needs { list-style:none; margin:2px 0 4px; padding:0; display:grid; gap:4px; max-width:34ch; }
.pray-needs:empty { display:none; }
.pray-needs li { font-size:15px; color:#B9C2CE; line-height:1.35; }
.pray-needs li::before { content:"· "; color:#A79BF0; }
@media (min-width:960px) { .needs-grid { grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:32px; } }
.md i.nd-dot::before { display:none; }

/* ---------- баланс сфер ---------- */
.bal-skew { margin:0 0 12px; padding:10px 12px; border-radius:12px; background:var(--amber-bg); color:var(--ink); font-size:14px; line-height:1.4; }
.bal-rec { display:grid; gap:12px; }
.bal-rec .br-h { display:flex; justify-content:space-between; align-items:center; gap:10px; margin:0; font-size:13px; color:var(--faint); }
.bal-rec .br-h b { font-size:15px; font-weight:600; color:var(--ink); }
.bal-rec .br-h b::first-letter { text-transform:uppercase; }
.bal-rec .br-h span { text-align:right; }
.bal-ok { margin:0; padding:10px 12px; border-radius:12px; background:var(--teal-bg); color:var(--teal); font-size:14px; }
.bal-skew.ok { background:var(--teal-bg); color:var(--teal); }
.bal-rec .br-h .alt { flex:none; width:36px; height:36px; border-radius:50%; border:0; background:var(--field); color:var(--soft); font-size:15px; line-height:1; padding:0; }
.bal-rec .br-h span { flex:1; }
.care { display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:8px; margin-top:6px; }
.cchip { display:grid; grid-template-columns:22px minmax(0,1fr); gap:8px; align-items:start; text-align:left; border:0; border-radius:12px; padding:9px 10px; background:var(--field); }
.cchip .tick { width:20px; height:20px; border-radius:6px; background:var(--card); display:grid; place-items:center; margin-top:1px; }
.cchip .tick svg { width:11px; height:11px; opacity:0; }
.cchip[aria-pressed="true"] { background:var(--teal-bg); }
.cchip[aria-pressed="true"] .tick { background:var(--teal); }
.cchip[aria-pressed="true"] .tick svg { opacity:1; }
.cchip:disabled { cursor:default; }
.cchip .cn { font-size:14.5px; font-weight:500; min-width:0; }
.cchip .cn::first-letter { text-transform:uppercase; }
.cchip small { display:block; font-size:12px; font-weight:400; color:var(--faint); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bal-tags { margin-top:12px; border-top:1px solid var(--line); padding-top:10px; }
.bal-tags summary { cursor:pointer; font-size:13.5px; font-weight:500; color:var(--soft); }
.bal-tags ul { list-style:none; margin:8px 0 0; padding:0; }
.bal-tags li { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:7px 0; border-bottom:1px solid var(--line); font-size:14px; }
.bal-tags li:last-child { border-bottom:0; }
.bal-tags li small { display:block; font-size:12px; color:var(--faint); }
.bal-tags select { flex:none; max-width:42%; }
.bal .pick button.pi { background:var(--field); }

/* ---------- подзадачи ---------- */
.pt.par, .pt-head { border-bottom:0; }
.pt-head { list-style:none; padding:10px 0 2px; font-size:14.5px; font-weight:500; color:var(--soft); line-height:1.35; overflow-wrap:anywhere; }
.pt-head small { display:block; font-size:12.5px; font-weight:400; color:var(--faint); }
.pt.sub { padding:5px 0 5px 34px; border-bottom:0; }
.pt.sub.last { border-bottom:1px solid var(--line); padding-bottom:10px; }
.pt.sub:last-child { border-bottom:0; }
.pt.sub button { width:20px; height:20px; }
.pt.sub .pt-t { font-size:14.5px; }
.pt.more { display:block; font-size:13px; color:var(--faint); }
.pick-sub { margin:6px 0 0; font-size:13.5px; font-weight:500; color:var(--soft); }
.pick button.pi.sub { margin-left:14px; }
.sheet .cchip { background:var(--card); }
.sheet .cchip .tick { background:var(--field); }
.sheet .cchip[aria-pressed="true"] { background:var(--teal-bg); }
.sheet .cchip[aria-pressed="true"] .tick { background:var(--teal); }
.bal .pick button.pi.idea { background:none; border:1.5px dashed var(--line2); }

/* ---------- заряд сфер ---------- */
.pick button.pi.on, .bal .pick button.pi.on { background:var(--teal-bg); border-color:transparent; }
.pick button.pi.on .plus { background:var(--teal); color:var(--on-accent); }
.pick button.pi[aria-pressed="true"] { background:var(--teal-bg); border-color:transparent; }
.pick button.pi[aria-pressed="true"] .plus { background:var(--teal); color:var(--on-accent); }

/* ---------- исправления: пустые состояния, контраст ---------- */
.focus li.empty { display:block; }
.hab:not([aria-pressed="true"]) .tick, .pt:not(.done) button, .focus li:not(.done) button.fk, .cell:not([aria-pressed="true"]):not(:disabled) {
  box-shadow:inset 0 0 0 1.5px var(--line2); }
.week td.name small.ok-t { color:var(--teal); } .week td.name small.warn-t { color:var(--warn); }
.week td.name { min-width:96px; }
@media (max-width:420px) { .cell { width:28px; height:28px; border-radius:8px; } .week th, .week td { padding:5px 1px; } }

/* ---------- «Главное» с упором и заряд сфер ---------- */
.bal-sub { margin-top:14px; padding-top:12px; border-top:1px solid var(--line); }
.bal-h { margin:0 0 10px; font-size:15px; font-weight:600; display:flex; justify-content:space-between; align-items:baseline; gap:10px; }
.bal-h small { font-size:12.5px; font-weight:500; color:var(--faint); }
.bal-sub .bal-rec { gap:10px; }
.bal-h2 { margin:2px 0 -2px; font-size:15px; font-weight:600; }

/* ---------- лента дня: свёрнута до «дальше…» ---------- */
.tl-next { margin:0; font-size:14.5px; color:var(--ink); line-height:1.45; }
.tl-next span { color:var(--faint); }
.tl-next b { font-weight:600; }
#day .tl { display:none; }
#day.open .tl { display:block; }
#day.open .tl-next { display:none; }
.tl-more { margin-top:10px; font-size:13.5px; }
.faint { color:var(--faint); font-weight:400; }

/* ---------- выбор подзадачи для слота ---------- */
.slot-card select.field, .splan select.field { width:100%; min-width:0; }
.slot-card select.field { margin-top:10px; }
.splan .sx { font-size:14.5px; color:var(--soft); }

/* ---------- понятность: кнопки сна на узком экране, мягкие предупреждения ---------- */
@media (max-width:420px) {
  .kbtn { grid-template-columns:24px minmax(0,1fr); align-items:start; }
  .kbtn .kgo { grid-column:2; justify-self:start; margin-top:2px; }
}
.late-t { color:var(--amber); }
.splan li { grid-template-columns:120px minmax(0,1fr); }
@media (max-width:420px) { .splan li { grid-template-columns:minmax(0,1fr); } }
.sheet ul.splan.card { padding:12px 14px; }

/* ---------- демо ---------- */
.demo-bar { display:flex; flex-wrap:wrap; gap:4px 10px; align-items:baseline; margin:4px 0 10px; padding:10px 14px; border-radius:14px;
  background:var(--amber-bg); color:var(--ink); font-size:13.5px; line-height:1.4; }
.demo-bar b { color:var(--amber); }
.demo-bar span { flex:1 1 200px; color:var(--soft); }
.demo-bar a { font-weight:600; color:var(--amber); }
#remind .row-btns:empty { display:none; }
/* вечер вдвоём */
.duo-card .r-ic { width:40px; height:40px; border-radius:12px; background:var(--card); display:grid; place-items:center; flex:none; }
.duo-card .r-ic svg { width:22px; height:22px; }
.duo-card .eyebrow { display:block; font-size:12px; color:var(--faint); margin-bottom:2px; }
.duo-card .pc-t > span:last-child { display:block; margin-top:2px; }
.duo-card .btn.ghost { background:var(--card); color:var(--violet); }
.duo-card.met .btn { background:transparent; color:var(--teal); }
.tl .tl-duo::before { background:var(--violet); }
/* сон: промежуточные пробуждения и «ты уже встал» */
.fc-box p.fc-next { margin-top:8px; font-size:13px; color:var(--faint); }
.fc-next:empty { display:none; }
.fc-box.me.done .fc-big { color:var(--soft); opacity:.75; }
/* сфера «по делу»: без заряда и без красного */

/* ---------- стих дня ---------- */
.verse { position:relative; overflow:hidden; background:linear-gradient(135deg,var(--dawn-a),var(--dawn-b)); box-shadow:none; padding:18px 20px 16px; }
.verse .v-eye { display:flex; align-items:center; gap:6px; font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--dawn-ref); }
.verse .v-eye svg { width:15px; height:15px; }
.verse blockquote { margin:10px 0 6px; font-family:"PT Serif",Georgia,serif; font-size:clamp(19px,2.6vw,23px); line-height:1.45; color:var(--dawn-ink); text-wrap:pretty; }
.verse cite { display:block; text-align:right; font-style:normal; font-size:13.5px; font-weight:600; color:var(--dawn-ref); }
.verse .v-act { display:flex; align-items:center; gap:12px; margin-top:12px; padding-top:12px; border-top:1px solid color-mix(in srgb,var(--dawn-ref) 22%,transparent); }
.verse .v-act p { flex:1; margin:0; font-size:14.5px; line-height:1.4; color:var(--ink); }
.verse .v-act p span { color:var(--dawn-ref); font-weight:600; }
/* Раз в день: слова проявляются, как рассвет, и по карточке проходит тёплый свет */
.verse.rise blockquote .w { display:inline-block; opacity:0; transform:translateY(6px); filter:blur(3px);
  animation:v-word .7s cubic-bezier(.2,.7,.2,1) forwards; animation-delay:calc(var(--i) * 70ms + 250ms); }
.verse.rise cite, .verse.rise .v-act { opacity:0; animation:v-fade .8s ease forwards; animation-delay:var(--after); }
.verse.rise::after { content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(105deg,transparent 30%,var(--dawn-glow) 50%,transparent 70%); transform:translateX(-100%);
  animation:v-sweep 2.4s ease-out .2s forwards; }
@keyframes v-word { to { opacity:1; transform:none; filter:none; } }
@keyframes v-fade { to { opacity:1; } }
@keyframes v-sweep { to { transform:translateX(100%); } }
@media (prefers-reduced-motion:reduce) {
  .verse.rise blockquote .w, .verse.rise cite, .verse.rise .v-act { animation:none; opacity:1; transform:none; filter:none; }
  .verse.rise::after { display:none; }
}

/* Кольца сфер на «Сегодня»: тихие, янтарным — только те, кому Keel советует время сейчас */
.rings { display:grid; grid-template-columns:repeat(auto-fill,minmax(54px,1fr)); gap:8px 4px; margin:0 0 12px; padding:10px 6px 8px; border-radius:14px; background:var(--field); text-decoration:none; color:inherit; }
.rings:hover { box-shadow:inset 0 0 0 1.5px var(--line2); }
.rg { position:relative; display:grid; justify-items:center; gap:2px; min-width:0; }
.rg svg { width:40px; height:40px; transform:rotate(-90deg); }
.rg circle { fill:none; stroke-width:5; }
.rg .rg-t { stroke:var(--line2); }
.rg .rg-a { stroke:var(--s2); stroke-linecap:round; animation:rg-in 1s cubic-bezier(.2,.8,.2,1) both; }
.rg.ok .rg-a { stroke:var(--teal); }
.rg.hot .rg-a { stroke:var(--amber); }
.rg b { position:absolute; top:0; height:40px; line-height:40px; font-size:12.5px; font-weight:600; }
.rg b small { font-size:10px; font-weight:500; color:var(--faint); }
.rg-n { max-width:100%; font-size:11.5px; color:var(--soft); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rg-n::first-letter, .bg-n::first-letter { text-transform:uppercase; }
.rg.hot .rg-n { color:var(--amber); font-weight:600; }
@keyframes rg-in { from { stroke-dashoffset:var(--c); } }
.bal-more { justify-self:start; font-size:13.5px; }

/* «План»: неделя клетками */
.bgrid { max-width:520px; display:grid; grid-template-columns:minmax(0,76px) repeat(7,minmax(0,1fr)) minmax(70px,auto); gap:6px 4px; align-items:center; }
.bg-d { font-size:11px; color:var(--faint); text-align:center; }
.bg-d.t { color:var(--ink); font-weight:700; }
.bg-n { font-size:14px; font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bg-n.od { color:var(--faint); }
.bg-c { aspect-ratio:1; min-width:0; border:0; padding:0; border-radius:7px; background:var(--field); animation:bg-in .4s cubic-bezier(.3,1.6,.5,1) both; animation-delay:calc(var(--i) * 30ms); }
.bg-c.on { background:var(--teal); }
.bg-n.od ~ .bg-c.on { background:var(--s2); }
.bg-c.rut { background:var(--field); box-shadow:inset 0 0 0 1.5px var(--s2); }
.bg-c.sel { outline:2px solid var(--ink); outline-offset:1px; }
@keyframes bg-in { from { transform:scale(.3); opacity:0; } }
.bg-s { font-size:12.5px; text-align:right; line-height:1.25; white-space:nowrap; }
.bg-s b { font-size:14px; }
.bg-s small { display:block; font-size:12px; color:var(--faint); }
.bg-s.need small { color:var(--amber); font-weight:600; }
.bg-s.ok small { color:var(--teal); font-weight:600; }
.bg-detail { max-width:520px; margin:12px 0 6px; padding:10px 12px; border-radius:12px; background:var(--field); color:var(--soft); font-size:14px; line-height:1.4; }
.bg-detail b { color:var(--ink); }
#bal-norms li span::first-letter { text-transform:uppercase; }

.rt { display:inline-flex; align-items:center; gap:5px; font-size:13px; color:var(--soft); white-space:nowrap; }
.rt input { accent-color:var(--teal); }

/* ---------- итоги месяца ---------- */
.month-link { display:flex; align-items:center; gap:12px; text-decoration:none; color:inherit;
  background:linear-gradient(135deg, var(--teal-bg), var(--card) 70%); }
.ml-main { display:flex; flex-direction:column; gap:1px; min-width:0; flex:1; }
.ml-main small { font-size:12.5px; font-weight:500; color:var(--teal); }
.ml-main b { font-size:21px; font-weight:700; letter-spacing:-.01em; }
.ml-main span { font-size:13.5px; color:var(--soft); }
.ml-go { width:36px; height:36px; flex:none; border-radius:50%; display:grid; place-items:center; background:var(--teal); color:var(--on-accent); font-weight:600; }
.m-back { font-size:14px; font-weight:500; text-decoration:none; }
.m-lede { margin:0 0 14px; font-size:15px; color:var(--soft); max-width:62ch; }
.tiles small { font-size:11.5px; color:var(--faint); margin-top:3px; line-height:1.3; }
.m-sub { margin-top:14px; }
.m-cap { margin:0 0 4px; }
.ms-row { display:grid; gap:5px; padding:6px 0; }
.ms-l { display:flex; justify-content:space-between; gap:10px; font-size:13.5px; color:var(--soft); }
.ms-l small { font-size:12.5px; color:var(--faint); }
.ms-cells { display:grid; grid-template-columns:repeat(var(--n), minmax(0,1fr)); gap:2px; }
.ms-cells i { height:18px; border-radius:3px; background:var(--s0); }
.ms-cells i.c1 { background:var(--s1); } .ms-cells i.c2 { background:var(--s2); }
.ms-cells i.c3 { background:var(--s3); } .ms-cells i.c4 { background:var(--s4); }
.ms-cells i.na, .ms-cells i.pre { background:transparent; }
.ms-cells i.fut { background:transparent; box-shadow:inset 0 0 0 1px var(--line); }
.ms-cells i.today { outline:1.5px solid var(--soft); outline-offset:1px; }
.ms-ax { margin-top:2px; }
.ms-ax span { font-size:10px; color:var(--faint); text-align:center; white-space:nowrap; overflow:visible; }
.m-hb { position:relative; overflow:visible; }
.m-hb b { position:absolute; top:-3px; width:2px; height:14px; border-radius:1px; background:var(--ink); transform:translateX(-1px); }
.m-sph li.od .hb i { background:var(--s2); }
.chart .nbar { fill:var(--k3); }
ul.m-mom { list-style:none; margin:0 0 10px; padding:0; }
.m-mom li { display:grid; grid-template-columns:44px 10px minmax(0,1fr); gap:10px; align-items:baseline; padding:9px 0; border-bottom:1px solid var(--line); }
.m-mom li:last-child { border-bottom:0; }
.m-mom li.empty { display:block; }
.m-mom .d { font-size:12.5px; color:var(--faint); }
.m-mom .dot { width:9px; height:9px; border-radius:50%; background:var(--line2); align-self:center; }
.m-mom .ans .dot { background:var(--violet); } .m-mom .tg .dot { background:var(--pink); }
.m-mom .step .dot { background:var(--blue); } .m-mom .rev .dot { background:var(--teal); }
.m-mom .t { font-size:14.5px; min-width:0; overflow-wrap:anywhere; }
.m-mom .t small { display:block; font-size:12px; color:var(--faint); }
.m-mom .t em { display:block; font-style:normal; font-size:13px; color:var(--soft); }
@media (min-width:960px) { .m-kpi { grid-template-columns:repeat(4, minmax(0,1fr)); } }

/* ================= Стезя: раскладка и компоненты, как на превью «Командный центр» ================= */
html { transition:filter .8s; }
body { transition:background-color .8s, color .8s; }
:root[data-look="chart"] body { background:
  linear-gradient(rgba(31,43,53,.05) 1px, transparent 1px) 0 0 / 120px 120px,
  linear-gradient(90deg, rgba(31,43,53,.05) 1px, transparent 1px) 0 0 / 120px 120px, var(--bg); }
/* Ночью — красный свет: не режет глаза и не разгоняет сон */
html.red { filter:grayscale(1) sepia(1) saturate(5) hue-rotate(-40deg) brightness(.58) contrast(1.05); }
#sky { position:fixed; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(130% 70% at var(--sun-x,70%) 105%, rgba(240,140,70,calc(var(--glow,0) * .32)), transparent 65%),
             radial-gradient(90% 50% at var(--sun-x,70%) 100%, rgba(150,110,190,calc(var(--glow,0) * .14)), transparent 70%); }
#stars { position:fixed; inset:0; width:100%; height:100%; z-index:0; pointer-events:none; }
.app { position:relative; z-index:1; max-width:1480px; padding:0 16px calc(150px + env(safe-area-inset-bottom,0px)); }
.side { display:none !important; }
:focus-visible { outline:1px solid var(--ink); outline-offset:3px; }

/* ---------- шапка: имя и стих · вкладки · часы ---------- */
header.top { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:4px 14px; padding:16px 2px 12px; }
header.top .tabs { display:none; }
.ttl { min-width:0; }
header.top h1 { font:500 clamp(30px,8.5vw,46px)/1 var(--disp); letter-spacing:.06em; text-transform:uppercase; margin:0; }
.tagline { margin:8px 0 0; font-size:10.5px; line-height:1.5; letter-spacing:.2em; text-transform:uppercase; color:var(--soft); }
.tagline small { margin-left:10px; color:var(--faint); letter-spacing:.12em; white-space:nowrap; }
.clock { text-align:right; }
.clk-t { font:500 clamp(38px,11vw,66px)/1 var(--disp); letter-spacing:.02em; }
.clk-t small { font-size:.52em; color:var(--soft); }
.clk-d { margin-top:6px; font-size:10.5px; letter-spacing:.26em; text-transform:uppercase; color:var(--soft); }
.clk-s { margin-top:3px; font-size:10px; letter-spacing:.08em; color:var(--faint); white-space:nowrap; }
header.top .top-r { justify-content:flex-end; gap:12px; margin-top:8px; }
header.top .lede { grid-column:1 / -1; margin:6px 0 0; font-size:13px; }
.sync { background:none; border:0; box-shadow:none; padding:0; font-size:10px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--faint); }
.sync::before { width:5px; height:5px; }
.sync.ok, .sync.warn { background:none; }
.gear { width:auto; height:auto; background:none; border:0; box-shadow:none; color:var(--soft); }
.gear svg { width:17px; height:17px; }
.notice { border-radius:6px; }

/* ---------- разделы: подпись с линией, а не коробка ---------- */
.view { gap:34px; }
.card { background:none; border:0; border-radius:0; padding:0; box-shadow:none; }
.card-h { display:flex; align-items:center; flex-wrap:wrap; gap:8px 10px; margin-bottom:14px; }
.card-h::after { content:""; order:1; flex:1 1 24px; height:1px; background:var(--line2); }
.card-h > .seg, .card-h > .nav, .card-h > button, .card-h > a { order:2; }
.card-h h2, .sec-head h2, details.sub > summary, .bal-h, .h3 { font-family:var(--mono); font-size:11px; font-weight:600; letter-spacing:.22em; text-transform:uppercase; color:var(--ink); }
.card-h small, .card-h .aside, .sec-head .aside { font-size:10px; font-weight:400; letter-spacing:.14em; text-transform:uppercase; color:var(--faint); }
.sec-head { border-bottom:1px solid var(--line2); padding-bottom:8px; }
.bal-h2 { font-size:13px; }
.bal-h small { letter-spacing:.04em; text-transform:none; }
figcaption { font-size:13px; }
.goal { background:var(--card); border:1px solid var(--line2); border-radius:8px; box-shadow:none; }
.glist > .empty, .glist > .note { background:none; border:0; box-shadow:none; padding:0; }
.tiles div { background:transparent; border:1px solid var(--line2); border-radius:6px; }
.w-stat div, .w-line, .bg-detail, .g-next, .nd-form, .night-row, .bal-ok, .bal-skew, .fc-box, .month-link, .duo, .demo-bar { border-radius:6px; }
.fc-box.kid { background:transparent; border:1px solid color-mix(in srgb, var(--amber) 45%, transparent); }
.fc-box.me { background:transparent; border:1px solid color-mix(in srgb, var(--teal) 45%, transparent); }
.month-link { background:var(--card); border:1px solid var(--line2); padding:14px; }
.demo-bar { background:none; border:1px dashed color-mix(in srgb, var(--amber) 60%, transparent); padding:7px 12px; font-size:12px; margin:0 0 6px; }
.sheet-in { border-radius:14px 14px 0 0; }
.sheet .card { background:var(--card); border:1px solid var(--line2); border-radius:8px; padding:12px 14px; }

/* крупные числа — узким шрифтом, как на приборах */
.fc-big, .tg-big b, .big-stat b, .tiles b, .g-val b, .duo b, .w-stat b, .ml-main b, .pray-card .pc-live, .ring-t b, .pray-done, .pray-input {
  font-family:var(--disp); font-weight:500; letter-spacing:.01em; }
.tiles b { font-size:24px; }

/* кнопки, поля, переключатели */
.btn { border-radius:6px; font-weight:600; font-size:13px; letter-spacing:.02em; }
.btn.ghost { background:transparent; border:1px solid var(--line2); }
.field { border-radius:6px; font-size:15px; }
.seg { background:transparent; border:1px solid var(--line2); border-radius:8px; }
.seg button { border-radius:5px; font-size:12.5px; }
.seg button[aria-selected="true"] { background:var(--ink); color:var(--on-ink); box-shadow:none; }
.nav button, .per-nav button { border-radius:6px; background:transparent; border:1px solid var(--line2); }
.chip { border-radius:4px; font-size:11px; letter-spacing:.04em; }
.days label { border-radius:6px; }
.toast, .tip { border-radius:8px; font-size:13px; }
.toast { bottom:calc(136px + env(safe-area-inset-bottom,0px)); }
.pray-btn { border-radius:8px; }

/* флажки — квадратные, разделители — пунктир */
.tick, .pt button, .focus button.fk, .cchip .tick { width:18px; height:18px; border-radius:2px; background:transparent; }
.hab:not([aria-pressed="true"]) .tick, .pt:not(.done) button, .focus li:not(.done) button.fk { box-shadow:inset 0 0 0 1px var(--soft); }
.hab[aria-pressed="true"] .tick, .pt.done button, .focus li.done button.fk { background:var(--teal); box-shadow:none; }
.hab { grid-template-columns:22px 1fr auto; }
ul.today li + li, .focus li, .pt, ul.checks li, .tg-list li, .needs li, ul.hbars li, .m-mom li { border-color:var(--line2); }
ul.today li + li { border-top-style:dashed; }
.focus li, .pt { border-bottom-style:dashed; }
.hab-name, .pt-t, .focus .ft, .tl b, .nd-t, .g-steps li, .tg-list li, ul.checks li, .hb-top { font-size:14px; }
.hab-meta, .pt-t small, .focus .ft small, .nd-meta { font-size:11.5px; }
.dots i { border-radius:1px; width:7px; height:7px; }

/* ---------- «Сегодня»: на телефоне — порядок превью, на широком экране — три колонки ---------- */
.view.today-v { display:flex; flex-direction:column; gap:32px; }
.today-v > .col-l, .today-v > .col-c, .today-v > .col-r { display:contents; }
@media (max-width:1179px) {
  #hero { order:1; } #verse-card { order:2; } #mark { order:3; }
  #pray-card, #duo-card, #book-card, #ritual-card, #slot-card { order:4; }
  #focus-card { order:5; } #habits { order:6; } #tasks { order:7; } #metrics { order:8; }
}

/* курс дня: компас */
.hero { display:flex; flex-direction:column; align-items:center; text-align:center; }
.hero .status { margin:0; display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:4px 8px;
  font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--soft); }
.hero .status b { color:var(--ink); font-weight:600; }
.hero .status .dot { width:5px; height:5px; border-radius:50%; background:var(--teal); box-shadow:0 0 8px var(--teal); }
:root[data-look="chart"] .hero .status .dot { box-shadow:none; }
#compass { display:block; width:100%; height:340px; margin-top:2px; touch-action:manipulation; -webkit-tap-highlight-color:transparent; }
.phase { font:500 42px/1.05 var(--disp); letter-spacing:.26em; margin:2px 0 0 .26em; text-transform:uppercase; }
.phase.long { font-size:28px; letter-spacing:.1em; margin-left:.1em; }
.phase-sub { margin:10px 0 0; max-width:62ch; font-size:13px; line-height:1.55; color:var(--soft); }
.phase-sub b { color:var(--ink); font-weight:600; }
.hero .lede { margin:6px 0 0; font-size:12px; color:var(--faint); }
.hero .lede b { color:var(--soft); }
.hero-foot:empty { display:none; }
.hero .linkbtn { color:var(--ink); font-weight:500; }
#bal-batts { display:none !important; }
/* воскресенье — без «Главного», упора и задач (кнопка «показать дела» вернёт) */
.sunday #focus-card, .sunday #tasks { display:none; }

/* стих дня — без рамки, по центру, проявляется как расшифровка */
.verse { background:none; border:0; box-shadow:none; padding:0; text-align:center; max-width:640px; margin:0 auto; overflow:visible; }
.verse .v-eye { justify-content:center; font-size:10.5px; font-weight:600; letter-spacing:.24em; color:var(--soft); }
.verse blockquote { margin:10px auto 6px; font-family:var(--mono); font-size:15px; line-height:1.65; color:var(--ink); min-height:3.3em; }
:root[data-look="chart"] .verse blockquote { font-family:var(--serif); font-style:italic; font-size:19px; line-height:1.5; }
.verse cite { text-align:center; font-size:10.5px; font-weight:500; letter-spacing:.2em; text-transform:uppercase; color:var(--faint); }
.verse .v-act { justify-content:center; border-top:1px dashed var(--line2); }
.verse .v-act p { font-size:12.5px; color:var(--soft); }
.verse .v-act p span { color:var(--amber); }
.verse.rise::after { display:none; }
.verse.rise cite, .verse.rise .v-act { animation-delay:1.4s; }

/* отметить одним касанием */
.kid-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.kbtn { display:flex; justify-content:space-between; align-items:center; gap:10px; min-height:64px; padding:11px 13px; text-align:left;
  border:1px solid var(--line2); border-radius:6px; background:var(--card); color:var(--ink); transition:border-color .2s; }
.kbtn:hover { border-color:var(--soft); }
.kid-actions .kbtn { background:var(--card); border-color:var(--line2); }
.kid-actions .kbtn:hover { border-color:var(--soft); }
.kbtn svg, .kbtn .kgo { display:none; }
.kbtn::after { content:"→"; flex:none; color:var(--soft); font-size:17px; transition:transform .2s; }
.kbtn:hover::after { transform:translateX(3px); color:var(--ink); }
.kid-actions .kbtn b { font-size:14px; font-weight:500; color:var(--ink); }
.kbtn > span > span { font-size:11px; color:var(--faint); margin-top:3px; }
.chip-done { border-radius:6px; background:transparent; border:1px solid var(--line2); box-shadow:none; font-size:12px; }
.chip-done.fix { background:transparent; border-color:color-mix(in srgb, var(--teal) 50%, transparent); }

/* «Сейчас»: молитва, слот, ритуал — рамка с цветной кромкой */
.pray-card, .ritual, .slot-card, .duo-card { background:var(--card); border:1px solid var(--line2); border-left:2px solid var(--violet); border-radius:6px; padding:14px; }
.slot-card { border-left-color:var(--blue); }
.duo-card { border-left-color:var(--pink); }
.book-card { border-left-color:var(--teal); }
.book-card b { color:var(--teal); }
.book-card .btn { background:var(--teal); }
.book-card .btn.ghost { color:var(--teal); }
.tl .tl-book::before { background:var(--teal); }
.tl .tl-out::before { background:var(--blue); }
.pray-card.met { background:var(--card); border-left-color:var(--teal); }
.ritual .r-ic, .duo-card .r-ic { border-radius:6px; background:transparent; border:1px solid var(--line2); }
.slot-card h3 { font-size:16px; }
.slot-card .btn.ghost, .duo-card .btn.ghost { background:transparent; }

/* главное и упор */
.bal-sub { margin-top:18px; padding:14px; border:1px solid var(--line2); border-radius:6px; background:var(--card); }
.bal .pick button.pi { background:transparent; border:1px solid var(--line2); border-radius:6px; }
.bal .pick button.pi.idea { border-style:dashed; }
.pick button.pi .plus { border-radius:4px; }
.bal-rec .br-h .alt { border-radius:6px; background:transparent; border:1px solid var(--line2); }

/* показатели за 7 дней */
.metric { padding:14px 0 16px; border-bottom:1px solid var(--line); }
.metric:first-child { padding-top:0; }
.m-h { display:flex; justify-content:space-between; align-items:baseline; gap:8px; font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--soft); }
.m-h .k::before { content:"•"; margin-right:8px; color:var(--c); }
.m-h .r { letter-spacing:.04em; text-transform:none; color:var(--faint); white-space:nowrap; }
.m-h .r em { font-style:normal; color:var(--c); }
.m-v { font:500 46px/1.05 var(--disp); margin-top:6px; }
.m-v small { font:400 13px var(--mono); color:var(--soft); margin-left:8px; }
.m-note { margin:4px 0 0; font-size:12px; color:var(--faint); }
.m-note b { color:var(--soft); font-weight:500; }
.m-v .of { font-size:.42em; color:var(--soft); margin-left:6px; letter-spacing:.02em; }
.spark { display:block; width:100%; height:44px; margin-top:6px; overflow:visible; }
.frame { display:block; position:relative; margin-top:22px; padding:16px 18px 14px; color:inherit; text-decoration:none;
  border:1px solid var(--line2); background:linear-gradient(180deg, color-mix(in srgb, var(--ink) 4%, transparent), transparent); }
.frame::before, .frame::after, .frame > .c1, .frame > .c2 { content:""; position:absolute; width:12px; height:12px; border:0 solid var(--soft); }
.frame::before { top:-4px; left:-4px; border-width:1px 0 0 1px; } .frame::after { top:-4px; right:-4px; border-width:1px 1px 0 0; }
.frame > .c1 { bottom:-4px; left:-4px; border-width:0 0 1px 1px; } .frame > .c2 { bottom:-4px; right:-4px; border-width:0 1px 1px 0; }
.frame .lbl { display:block; font-size:10.5px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; }
.frame .f-sub { display:block; margin-top:2px; font-size:12px; color:var(--soft); }
.frame .big { display:block; margin-top:10px; font:500 50px/1 var(--disp); }
.frame .big small { font:400 13px var(--mono); color:var(--soft); margin-left:8px; }
.frame .gauge { position:relative; display:flex; gap:3px; height:24px; margin-top:14px; }
.frame .gauge i { flex:1; background:var(--line2); }
.frame .gauge i.on { background:linear-gradient(180deg, var(--soft), var(--faint)); }
.frame .gauge b { position:absolute; top:50%; width:13px; height:13px; border-radius:50%; background:var(--ink); transform:translate(-50%,-50%); }
:root:not([data-look="chart"]) .frame .gauge b { box-shadow:0 0 12px rgba(255,255,255,.55); }
.frame .scale { display:flex; justify-content:space-between; margin-top:8px; font-size:10.5px; color:var(--soft); }

/* лента дня — полоса внизу экрана; «Весь день» раскрывает её */
#day { position:fixed; z-index:14; left:12px; right:12px; bottom:calc(70px + env(safe-area-inset-bottom,0px)); display:flex; align-items:center; gap:12px;
  padding:9px 10px 9px 14px; background:var(--dock); border:1px solid var(--line2); border-radius:10px; backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
#day .card-h { margin:0; flex:none; }
#day .card-h::after, #day-title { display:none; }
#day .card-h h2 { font:500 14px var(--mono); letter-spacing:0; text-transform:none; }
#day:not(.open) .seg { display:none; }
#day .tl-next { flex:1; min-width:0; margin:0; font-size:12px; color:var(--soft); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#day .tl-next b { color:var(--ink); }
#day-toggle { flex:none; margin:0; padding:7px 11px; border:1px solid var(--line2); border-radius:6px; color:var(--ink); text-decoration:none; font-size:12px; white-space:nowrap; }
#day.open { display:block; max-height:min(72vh,600px); overflow:auto; padding:14px; }
#day.open .card-h { display:flex; justify-content:space-between; margin-bottom:12px; }
#day.open #day-toggle { margin-top:12px; }
.tl li::before { box-shadow:0 0 0 3px var(--dock); }
.tl .cur > div, .tl .band > div { border-radius:6px; }

/* вкладки внизу на телефоне */
.tabbar { background:var(--dock); border-top:1px solid var(--line2); }
.tabbar a, .tabs a { font-size:10px; font-weight:500; letter-spacing:.12em; text-transform:uppercase; }
.tabbar a[aria-current="page"] { color:var(--ink); }
:root:not([data-look="chart"]) .tabbar a[aria-current="page"] svg { filter:drop-shadow(0 0 6px rgba(255,255,255,.45)); }

@media (max-width:420px) {
  .hero .status .wide { display:none; }
  .clk-s { font-size:9.5px; letter-spacing:.04em; }
  .kbtn { min-height:58px; padding:10px 11px; }
}
@media (min-width:960px) {
  body { display:block; }
  .app { padding:0 32px 110px; }
  header.top { grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); padding:26px 0 18px; }
  header.top .tabs { display:flex; justify-self:center; align-self:start; gap:4px; padding:5px; border:1px solid var(--line2); border-radius:12px; background:var(--card); }
  .tabs a { display:flex; align-items:center; gap:8px; padding:10px 16px; border-radius:8px; font-size:11.5px; color:var(--soft); text-decoration:none; }
  .tabs a svg { width:16px; height:16px; }
  .tabs a[aria-current="page"] { background:var(--ink); color:var(--on-ink); }
  .clock { justify-self:end; }
  .view:not(.today-v) { max-width:1200px; margin-inline:auto; }
  .view.today-v { max-width:760px; margin-inline:auto; }
  #compass { height:min(520px, calc(100vh - 330px)); min-height:400px; }
  .phase { font-size:58px; } .phase.long { font-size:44px; letter-spacing:.14em; margin-left:.14em; }
  #day { left:32px; right:32px; bottom:18px; padding:10px 12px 10px 18px; }
  #day .card-h h2 { font-size:16px; }
  #day .tl-next { font-size:13px; }
  .toast { bottom:84px; }
  .sheet-in { border-radius:14px; }
}
@media (min-width:1180px) {
  .view.today-v { display:grid; max-width:none; grid-template-columns:minmax(250px,310px) minmax(0,1fr) minmax(300px,360px); gap:0 40px; align-items:start; }
  .today-v > .col-l, .today-v > .col-c, .today-v > .col-r { display:flex; flex-direction:column; gap:30px; min-width:0; }
  .today-v > .col-l { grid-column:1; grid-row:1; padding-top:44px; }
  .today-v > .col-c { grid-column:2; grid-row:1; }
  .today-v > .col-r { grid-column:3; grid-row:1; padding-top:44px; }
}
/* твой сон */
.ms-fig { margin:16px 0 0; }