/* ============ токены (значения подставляет app.js из выбранной темы) ============ */
:root {
  --bg: #000000;
  --panel: #1c1c1e;
  --panel-2: #29292c;
  --line: #333336;
  --text: #f2f5fc;
  --muted: #9a9ca5;
  --gray: #74767e;
  --accent: #00e676;
  --on-accent: #0b1020;
  --accent2: #2f80ff;
  --on-accent2: #ffffff;
  --up: #34d399;
  --down: #fb7185;
  --warn: #fbbf24;
  --font-scale: 1;
  --tabs-h: 58px;
  --radius: 18px;
  color-scheme: dark;
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin: 0; background: var(--bg); color: var(--text); overscroll-behavior: none; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, sans-serif;
  font-size: calc(16px * var(--font-scale));
  line-height: 1.35;
  min-height: 100dvh;
  -webkit-text-size-adjust: 100%;
  overscroll-behavior-y: none;
}
body.sheet-open { overflow: hidden; }
button { font: inherit; color: inherit; cursor: pointer; }
button:disabled { opacity: 0.35; cursor: default; }
input, select, textarea { font: inherit; color: var(--text); }
svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; }
svg.fillicon { fill: currentColor; stroke: none; }

/* каркас: документ не прокручивается, прокручивается только область страницы над нижним меню */
.view {
  position: fixed; left: 0; right: 0; top: 0; bottom: var(--reserve);
  overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
  padding: calc(env(safe-area-inset-top) + 8px) max(12px, calc((100% - 696px) / 2)) 16px;
}
/* Учёт и неделя календаря — ровно на экран, без вертикальной прокрутки */
.view.view-track, body[data-calfit="1"] .view { overflow: hidden; padding-bottom: 8px; }
.view-track .main-head, .view-track .hero, #calPage.fit .cal-head, #calPage.fit .book { touch-action: pan-x pinch-zoom; }
.muted { color: var(--muted); }
.gray { color: var(--gray); }
.up { color: var(--up); }
.down { color: var(--down); }
.warn { color: var(--warn); }
.small { font-size: 0.8em; }
.tiny { font-size: 0.68em; }
.center { text-align: center; }
.pad { padding: 10px 4px; }
.dot { display: inline-block; width: 0.62em; height: 0.62em; border-radius: 50%; margin-right: 0.4em; vertical-align: 0.05em; flex: 0 0 auto; }
.h1 { font-size: 1.55em; margin: 4px 2px 10px; letter-spacing: -0.01em; }
.h2 { font-size: 0.78em; margin: 0 0 10px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted); font-weight: 600; }
.hint { color: var(--muted); font-size: 0.76em; text-align: center; margin: 8px 4px 10px; }
.hint.left { text-align: left; margin: 0 0 10px; }
.label { color: var(--muted); font-size: 0.8em; margin: 12px 2px 6px; }
.page-head { display: flex; align-items: center; gap: 8px; }
.page-head .h1 { margin-right: auto; }
.head-tools { display: inline-flex; align-items: center; gap: 8px; }
.head-tools .btn svg { width: 16px; height: 16px; }

/* ============ таб-бар: всегда внизу, на одном месте ============ */
:root { --tabs-h: 56px; --tabs-gap: 0px; --sb: max(4px, calc(env(safe-area-inset-bottom) - var(--vb-gap, 0px))); --reserve: calc(var(--tabs-h) + var(--sb)); }
.tabs {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 20;
  display: grid; grid-template-columns: repeat(var(--tabn, 4), 1fr); gap: 4px;
  height: calc(var(--tabs-h) + var(--sb));
  padding: 4px max(8px, calc((100% - 560px) / 2)) calc(var(--sb) + 4px);
  background: color-mix(in srgb, var(--panel) 90%, transparent);
  -webkit-backdrop-filter: blur(20px) saturate(1.4); backdrop-filter: blur(20px) saturate(1.4);
  border-top: 1px solid var(--line);
}
.tabs[hidden] { display: none; }
.tab { position: relative; border: 0; background: none; color: var(--muted); border-radius: 14px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; font-size: 0.66em; font-weight: 500; }
.tab svg { width: 21px; height: 21px; }
.tab.on { color: var(--accent2); background: color-mix(in srgb, var(--text) 9%, transparent); font-weight: 600; }
.tab-dot { position: absolute; top: 4px; left: calc(50% + 8px); min-width: 9px; height: 9px; border-radius: 9px; background: var(--accent); box-shadow: 0 0 0 2px var(--panel); font-size: 8px; font-style: normal; color: var(--on-accent); line-height: 9px; text-align: center; padding: 0 2px; }

/* ============ Учёт ============ */
.main {
  display: flex; flex-direction: column;
  height: calc(100% - 42px); /* под капсулой «Секундомер | Таймер» */
}
.main-head { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; }
.day-chip { border: 0; background: var(--panel); border-radius: 12px; padding: 6px 11px; color: var(--text); font-size: 0.78em; font-weight: 600; white-space: nowrap; }
.mini-stats { flex: 1; min-width: 0; display: flex; gap: 4px; align-items: center; justify-content: center; font-size: 0.7em; color: var(--muted); white-space: nowrap; overflow: hidden; font-variant-numeric: tabular-nums; }
.mini-stats b { color: var(--text); font-weight: 600; }
.mini-stats i { font-style: normal; opacity: 0.5; }
.icon-btn { width: 40px; height: 40px; border-radius: 12px; border: 0; background: var(--panel); display: inline-grid; place-items: center; color: var(--text); flex: 0 0 auto; }
.icon-btn.sm { width: 34px; height: 34px; }
.icon-btn.sm svg { width: 18px; height: 18px; }
.icon-btn.off { color: var(--gray); }
.icon-btn.off[data-action="moon"] { opacity: 0.4; } /* день только что завершён — 🌙 серая, чтобы не нажать дважды */
.icon-btn.stop { color: var(--down); }
.sync-dot { width: 10px; height: 10px; border-radius: 50%; border: 0; padding: 0; background: var(--warn); flex: 0 0 auto; }
.sync-dot.bad { background: var(--down); }

.mono { font-family: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace; font-variant-numeric: tabular-nums; }
.hero { flex: 0 0 auto; display: flex; flex-direction: column; align-items: stretch; padding: 4px 0 6px; }
.hero-label { display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 0.95em; min-height: 1.5em; margin-top: 2px; }
.hero-label b { font-weight: 700; }
.hero-label .dot { margin: 0; width: 0.7em; height: 0.7em; }
.hl-tag { font-size: 0.78em; color: var(--muted); background: var(--panel); border-radius: 999px; padding: 2px 8px; }
.hl-tag.warn { color: var(--warn); }
.clock-row { position: relative; display: flex; justify-content: center; }
.clock { display: block; border: 0; background: none; padding: 0; margin: 0; color: var(--text); font-size: clamp(46px, min(17vw, 10.5vh), 84px); font-weight: 700; letter-spacing: -0.02em; line-height: 1.08; text-align: center; font-variant-numeric: tabular-nums; }
.hero.off .clock { color: var(--gray); }
.clock-edit { position: absolute; right: 0; bottom: 8px; border: 0; background: none; color: var(--muted); padding: 6px; }
.clock-edit svg { width: 20px; height: 20px; }
.hero-sub { text-align: center; color: var(--muted); font-size: 0.74em; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0 0 8px; }
.hero-sub b { color: var(--text); font-weight: 600; }
.ctl-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ctl { display: flex; align-items: center; justify-content: center; gap: 8px; height: 46px; border: 0; border-radius: 16px; background: var(--panel); color: var(--text); font-weight: 600; font-size: 0.95em; }
.ctl svg { width: 18px; height: 18px; }
.ctl.go { background: var(--accent); color: var(--on-accent); }
.ctl.stop { background: color-mix(in srgb, var(--down) 22%, var(--panel)); color: var(--text); }
.ctl.stop svg { color: var(--down); }
#nowLine { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cd-sphere { text-align: center; font-weight: 600; margin-top: 10px; }
.sec-list { display: flex; flex-direction: column; gap: 6px; margin: 0 0 8px; flex: 0 0 auto; max-height: 132px; overflow-y: auto; scrollbar-width: none; }
.sec-list::-webkit-scrollbar { display: none; }
.sec-list:empty { display: none; }
.sec-cap { font-size: 0.66em; color: var(--gray); text-transform: uppercase; letter-spacing: 0.05em; margin: 2px 4px -2px; }
.sec-row { display: flex; align-items: center; gap: 10px; background: var(--panel); border-radius: 16px; padding: 4px 6px 4px 14px; min-height: 44px; cursor: pointer; }
.sec-row.paused { opacity: 0.7; }
.sec-row .dot { margin: 0; }
.sec-name { flex: 1; min-width: 0; font-weight: 600; font-size: 0.9em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sec-time { font-size: 1.05em; font-weight: 700; font-variant-numeric: tabular-nums; }
.sec-btn { border: 0; background: none; width: 36px; height: 36px; display: grid; place-items: center; color: var(--text); padding: 0; }
.sec-btn svg { width: 17px; height: 17px; }
.sec-btn.stop { color: var(--down); }
.cd-chips { flex: 0 0 auto; margin-bottom: 8px; align-items: center; }
.cd-cap { flex: 0 0 auto; font-size: 0.7em; color: var(--gray); white-space: nowrap; }

.grid { display: grid; grid-template-columns: repeat(var(--cols, 3), 1fr); gap: 8px; }
.grid-main { flex: 1 1 auto; min-height: 0; overflow-y: auto; grid-auto-rows: minmax(48px, 1fr); padding: 3px; margin: -3px; scrollbar-width: none; }
.grid-main::-webkit-scrollbar { display: none; }
.grid-small, .grid-cd { grid-auto-rows: minmax(54px, auto); }

/* секундомер ↔ таймер: маленькая капсула над таб-баром */
.mode-float {
  position: fixed; left: 50%; transform: translateX(-50%); z-index: 19;
  bottom: calc(var(--reserve) + 8px);
  display: flex; gap: 2px; padding: 3px; border-radius: 999px;
  background: color-mix(in srgb, var(--panel) 85%, transparent);
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  border: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
}
.mode-float button { border: 0; background: none; color: var(--muted); border-radius: 999px; height: 30px; padding: 0 12px; font-size: 0.74em; font-weight: 600; white-space: nowrap; }
.mode-float button.on { background: color-mix(in srgb, var(--text) 10%, transparent); color: var(--text); }
.center-link { display: block; margin: 6px auto 0; }
/* много таймеров сразу: часы чуть меньше, строки параллельных компактнее — кнопки сфер остаются на экране */
.many .clock { font-size: clamp(38px, min(14vw, 8vh), 70px); }
.many .ctl { height: 40px; }
.many .sec-row { min-height: 38px; padding-top: 1px; padding-bottom: 1px; }
.many .sec-btn { height: 32px; }
.many .sec-list { max-height: 104px; gap: 5px; }
.many .cd-chips .chip { padding-top: 5px; padding-bottom: 5px; }
/* маленькие экраны (iPhone SE и т. п.): всё главное по-прежнему без прокрутки */
@media (max-height: 720px) {
  .clock { font-size: clamp(40px, min(16vw, 9vh), 64px); }
  .ctl { height: 40px; }
  .hero-sub { margin-bottom: 6px; }
  .sec-row { min-height: 40px; }
  .many .clock { font-size: clamp(34px, min(12vw, 7vh), 56px); }
  .many .sec-list { max-height: 84px; }
  .many .ctl { height: 36px; }
  .grid-main { gap: 6px; }
  .grid-main .sb { padding: 6px 9px 11px; border-radius: 16px; }
  .grid-main .sb-name { line-height: 1.04; }
  .grid-main .sb-name { font-size: 0.84em; }
  .grid-main .sb.long .sb-name { font-size: 0.76em; }
}

.sb { position: relative; overflow: hidden; border: 0; border-radius: 20px; background: var(--c); color: var(--fg); text-align: left; padding: 9px 10px 14px; display: flex; flex-direction: column; justify-content: space-between; gap: 2px; min-height: 48px; transition: transform 0.08s ease; }
.sb:active { transform: scale(0.97); }
.sb-name { font-weight: 700; font-size: 0.88em; line-height: 1.12; overflow-wrap: anywhere; hyphens: auto; }
.sb.long .sb-name { font-size: 0.78em; }
.sb-sub { font-size: 0.68em; opacity: 0.9; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sb-bar { position: absolute; left: 10px; right: 10px; bottom: 6px; height: 5px; border-radius: 4px; background: var(--bar-track, rgba(0, 0, 0, 0.16)); overflow: hidden; display: flex; }
.sb-bar i { display: block; height: 100%; transition: width 0.4s ease; }
.sb-bar i.prev { background: var(--bar-prev, var(--fg)); } /* прошлые дни — тусклее, тем же цветом */
.sb-bar i.now { background: var(--bar-now, var(--fg)); } /* этот день — ярче */
/* идёт — свечение внутри кнопки (рамка не вылезает за края экрана и соседей) */
.sb.run { box-shadow: inset 0 0 0 2.5px color-mix(in srgb, var(--fg) 85%, transparent), inset 0 0 12px color-mix(in srgb, var(--fg) 25%, transparent); animation: pulse 1.8s ease-in-out infinite; }
.sb.paused { box-shadow: inset 0 0 0 2.5px color-mix(in srgb, var(--fg) 45%, transparent); opacity: 0.8; }
.sb-more { --c: var(--panel); --fg: var(--muted); align-items: center; justify-content: center; flex-direction: column; gap: 3px; border: 1.5px dashed var(--line); font-size: 0.76em; padding: 6px; }
.sb-more svg { width: 18px; height: 18px; }
@keyframes pulse { 50% { box-shadow: inset 0 0 0 2.5px color-mix(in srgb, var(--fg) 55%, transparent), inset 0 0 22px color-mix(in srgb, var(--fg) 40%, transparent); } }
body.compact .sb { padding: 7px 8px 11px; }
body.compact .card { padding: 10px; }

/* ============ общие элементы ============ */
.card { background: var(--panel); border-radius: 24px; padding: 14px 16px; margin-bottom: 12px; }
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.card-head .h2 { margin: 0; }
.list { display: flex; flex-direction: column; }
.btn { border: 0; border-radius: 14px; background: var(--panel-2); padding: 0 16px; height: 46px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
.btn.small { height: 34px; padding: 0 12px; font-size: 0.85em; border-radius: 11px; }
.btn.small svg { width: 16px; height: 16px; }
.btn.primary { background: var(--accent); color: var(--on-accent); }
.btn.ghost { background: transparent; color: var(--muted); }
.btn.danger-ghost { background: transparent; color: var(--down); }
.btn.wide { width: 100%; }
.btn.grow, .grow { flex: 1; }
.btn-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; align-items: center; }
.link { border: 0; background: none; color: var(--muted); padding: 2px 4px; font-size: 0.85em; display: inline-flex; align-items: center; gap: 4px; }
.link svg { width: 14px; height: 14px; }
.tag { display: inline-block; font-size: 0.68em; padding: 1px 7px; border-radius: 999px; background: var(--panel-2); color: var(--muted); font-weight: 500; vertical-align: 0.1em; }
.alert { background: color-mix(in srgb, var(--down) 16%, transparent); color: var(--text); border-radius: 12px; padding: 9px 12px; margin: 8px 0; font-size: 0.88em; }

.chips { display: flex; gap: 8px; margin: 0 0 10px; }
.chips.wrap { flex-wrap: wrap; }
.chips.scroll { overflow-x: auto; scrollbar-width: none; margin-left: -12px; margin-right: -12px; padding: 0 12px; }
.chips.scroll::-webkit-scrollbar { display: none; }
.chip { flex: 0 0 auto; border: 1px solid var(--line); background: var(--panel); border-radius: 999px; padding: 0 13px; height: 36px; font-size: 0.85em; display: inline-flex; align-items: center; white-space: nowrap; }
.chip.big { height: 46px; padding: 0 16px; font-size: 0.95em; font-weight: 600; }
.chip.on { background: var(--text); color: var(--bg); border-color: var(--text); }
.chip-input { gap: 6px; color: var(--muted); }
.chip-input input { width: 54px; border: 0 !important; background: transparent !important; outline: none; font-weight: 600; color: var(--text); height: auto !important; padding: 0 !important; }

.seg { display: flex; background: var(--panel); border-radius: 13px; padding: 3px; gap: 2px; margin-bottom: 10px; overflow-x: auto; scrollbar-width: none; }
.seg::-webkit-scrollbar { display: none; }
.seg > * { flex: 1; border: 0; background: none; border-radius: 10px; height: 36px; padding: 0 8px; font-size: 0.85em; color: var(--muted); white-space: nowrap; display: inline-flex; align-items: center; justify-content: center; gap: 4px; position: relative; }
.seg > .on { background: var(--panel-2); color: var(--text); font-weight: 600; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15); }
.seg label input[type="date"] { position: absolute; inset: 0; opacity: 0; }
.scroll-seg > * { flex: 0 0 auto; padding: 0 12px; }
.seg.mini { display: inline-flex; margin: 0; background: var(--panel-2); flex-wrap: wrap; }
.seg.mini > * { height: 30px; font-size: 0.78em; flex: 0 0 auto; padding: 0 10px; }
.seg.mini > .on { background: var(--panel); }
.center-seg { display: flex; width: max-content; margin: 6px auto 0; }

input:not([type="checkbox"]):not([type="color"]), select, textarea { width: 100%; border: 1px solid var(--line); background: var(--bg); border-radius: 12px; padding: 0 12px; height: 46px; outline: none; }
textarea { height: auto; padding: 10px 12px; resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: var(--accent2); }

/* ============ добавить / история ============ */
.phrase { display: flex; gap: 8px; }
.phrase input { height: 52px !important; font-size: 1.02em; border-radius: 16px !important; background: var(--panel) !important; }
.mic { width: 52px; height: 52px; border-radius: 16px; border: 0; background: var(--accent); color: var(--on-accent); display: grid; place-items: center; flex: 0 0 auto; }
.mic.listening { animation: mic 1s ease-in-out infinite; }
@keyframes mic { 50% { box-shadow: 0 0 0 8px color-mix(in srgb, var(--accent) 35%, transparent); } }
.phrase-preview { margin: 8px 0 0; }
.pp { display: flex; align-items: center; justify-content: space-between; gap: 10px; background: var(--panel); border-radius: 14px; padding: 8px 8px 8px 14px; }
.pp-bad { color: var(--muted); font-size: 0.88em; padding: 10px 14px; }
.hist { margin-top: 18px; }
.hist-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.hist-top .h2 { margin: 0; }
.day-head { display: flex; align-items: center; gap: 8px; padding: 12px 2px 6px; border-top: 1px solid var(--line); }
.day-head:first-child { border-top: 0; padding-top: 2px; }
.day-tools { margin-left: auto; display: inline-flex; gap: 2px; }
.row-entry { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 8px; border: 0; background: none; padding: 9px 2px; text-align: left; width: 100%; }
.row-entry.ghost { opacity: 0.6; }
.re-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.re-when { font-size: 0.78em; font-variant-numeric: tabular-nums; }
.re-dur { font-variant-numeric: tabular-nums; min-width: 3.2em; text-align: right; }
.subtract { margin: 4px 0 6px; }
.subtract.hl { background: color-mix(in srgb, var(--warn) 12%, transparent); border-radius: 14px; padding: 2px 10px 4px; }
.check-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin: 10px 0; }
.check-tile { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); background: var(--bg); border-radius: 12px; padding: 10px; text-align: left; font-size: 0.9em; }
.check-tile .box { width: 22px; height: 22px; border-radius: 6px; border: 2px solid var(--gray); display: grid; place-items: center; flex: 0 0 auto; }
.check-tile .box svg { width: 15px; height: 15px; stroke-width: 3; }
.check-tile.on { border-color: var(--accent2); }
.check-tile.on .box { background: var(--accent2); border-color: var(--accent2); color: var(--on-accent2); }

/* ============ аналитика ============ */
.an-nav { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 2px 0 12px; }
.an-title { display: flex; flex-direction: column; align-items: center; text-align: center; }
.custom-range { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.sum-main { font-size: 2.1em; font-weight: 700; letter-spacing: -0.02em; }
.sum-sub { margin-top: 2px; }
.pct { font-weight: 700; font-size: 0.9em; }
.pct.up { color: var(--up); }
.pct.down { color: var(--down); }
.chart-title { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font-weight: 600; font-size: 0.78em; text-transform: uppercase; letter-spacing: 0.04em; color: var(--muted); margin-bottom: 10px; }
.chart-title .gray, .chart-title .link { text-transform: none; letter-spacing: 0; font-weight: 400; }
.chart-title .seg { margin-left: auto; }
.chart-title .seg + .seg { margin-left: 0; }

.day-chart { position: relative; padding-left: 34px; }
.dc-area { position: relative; height: 160px; display: flex; align-items: flex-end; gap: 6px; border-bottom: 1px solid var(--line); }
.gl { position: absolute; left: 0; right: 0; border-top: 1px dashed color-mix(in srgb, var(--line) 80%, transparent); pointer-events: none; font-style: normal; }
.gl span { position: absolute; left: -34px; width: 30px; text-align: right; top: -0.6em; font-size: 0.62em; color: var(--gray); }
.dc { flex: 1; height: 100%; position: relative; display: flex; align-items: flex-end; justify-content: center; border: 0; background: none; padding: 0; z-index: 1; }
.dc .stack { display: flex; flex-direction: column-reverse; width: 100%; max-width: 30px; height: 100%; justify-content: flex-start; }
.dc .stack i { display: block; width: 100%; }
.dc .stack i:last-child { border-radius: 5px 5px 0 0; }
.dc .ghost, .dc .solid { position: absolute; bottom: 0; width: 70%; max-width: 30px; border-radius: 5px 5px 0 0; }
.dc.future { opacity: 0.35; }
.striped { background: repeating-linear-gradient(135deg, var(--c) 0 3px, transparent 3px 6px) !important; opacity: 0.85; }
.dc-labels { display: flex; gap: 6px; margin-top: 4px; }
.dc-labels span { flex: 1; text-align: center; font-size: 0.7em; color: var(--gray); }
.dc-labels .today { color: var(--text); font-weight: 700; }
.day-chart.dense .dc-area, .day-chart.dense .dc-labels { gap: 2px; }
.avg-line { position: absolute; left: 0; right: 0; border-top: 1.5px dashed var(--accent); pointer-events: none; z-index: 2; font-style: normal; }
.avg-line span { position: absolute; right: 0; top: -1.45em; font-size: 0.66em; color: var(--accent); background: var(--panel); padding: 0 4px; border-radius: 4px; }

.donut-wrap { display: flex; justify-content: center; }
.donut { width: min(260px, 78vw); height: auto; }
.dn-center { font-size: 24px; font-weight: 700; text-anchor: middle; fill: var(--text); font-variant-numeric: tabular-nums; }
.dn-sub { font-size: 9px; text-anchor: middle; fill: var(--muted); }
.dn-tick { font-size: 7px; text-anchor: middle; fill: var(--gray); }
.legend { display: flex; flex-direction: column; margin-top: 8px; }
.lg-row { display: grid; grid-template-columns: auto 1fr auto auto 3em; align-items: center; gap: 6px; border: 0; background: none; padding: 7px 2px; text-align: left; border-top: 1px solid var(--line); width: 100%; font-variant-numeric: tabular-nums; }
.lg-row:first-child { border-top: 0; }
.lg-row.sel { background: var(--panel-2); border-radius: 10px; }
.lg-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lg-pct { text-align: right; font-size: 0.85em; }

.hist-chart { position: relative; display: flex; }
.hc-axis { position: relative; flex: 0 0 34px; }
.hc-axis .gl { border-top: 0; }
.hc-axis .gl span { left: 0; }
.hc-scroll { flex: 1; min-width: 0; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
.hc-scroll::-webkit-scrollbar { display: none; }
.hc-track { position: relative; display: flex; gap: 6px; min-width: 100%; width: max-content; }
.hc-grid { position: absolute; left: 0; right: 0; top: 18px; height: 130px; pointer-events: none; }
.hc { flex: 1 0 40px; border: 0; background: none; padding: 0; display: flex; flex-direction: column; align-items: center; gap: 4px; z-index: 1; }
.hc-val { font-size: 0.68em; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; height: 14px; }
.hc-bar { position: relative; width: 100%; height: 130px; display: flex; justify-content: center; }
.hc-gl { position: absolute; left: -3px; right: -3px; height: 0; border-top: 1px dashed color-mix(in srgb, var(--line) 80%, transparent); pointer-events: none; }
.hc-bar i { z-index: 1; }
.hc-bar i { position: absolute; bottom: 0; width: 70%; max-width: 34px; border-radius: 6px 6px 0 0; }
.hc-bar .ghost { border: 1px dashed; border-bottom: 0; }
.hc-name { font-size: 0.66em; color: var(--muted); white-space: nowrap; }
.hc.sel .hc-name { color: var(--text); font-weight: 700; }

.sort-line { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; margin: 4px 2px 8px; }
.an-row { border: 0; background: none; text-align: left; padding: 11px 2px; border-top: 1px solid var(--line); width: 100%; }
.an-row:first-child { border-top: 0; }
.an-row.sel { background: var(--panel-2); border-radius: 12px; padding-left: 8px; padding-right: 8px; }
.an-top { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.an-name { font-weight: 600; }
.an-nums { font-variant-numeric: tabular-nums; white-space: nowrap; }
.bar { position: relative; height: 8px; border-radius: 6px; background: var(--panel-2); margin: 7px 0 5px; overflow: hidden; }
.bar i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 6px; }
.bar i.prev { background: var(--gray); }
.bar i.now { background: var(--text); }
.bar .pace { width: 2px; background: var(--text); opacity: 0.6; border-radius: 0; z-index: 2; }
.an-sub { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 0.78em; }

.cmp-sets { display: flex; flex-direction: column; gap: 6px; }
.cmp-set { display: flex; align-items: center; gap: 10px; border: 0; background: var(--panel-2); border-radius: 12px; padding: 8px 10px; text-align: left; }
.cmp-set > span:nth-child(2) { display: flex; flex-direction: column; flex: 1; }
.cmp-badge { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 7px; font-size: 0.75em; font-weight: 800; flex: 0 0 auto; }
.cmp-badge.a { background: var(--accent); color: var(--on-accent); }
.cmp-badge.b { background: var(--panel-2); color: var(--text); border: 1px solid var(--gray); }
.cmp-row { padding: 10px 2px; border-top: 1px solid var(--line); }
.cmp-row:first-child { border-top: 0; }
.cmp-bars { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; }
.cb { display: grid; grid-template-columns: 22px 1fr 3.4em; gap: 8px; align-items: center; font-variant-numeric: tabular-nums; font-size: 0.85em; }
.cb .cmp-badge { width: 18px; height: 18px; font-size: 0.65em; }
.cb-track { height: 10px; background: var(--panel-2); border-radius: 6px; overflow: hidden; }
.cb-track i { display: block; height: 100%; border-radius: 6px; }
.cb b { text-align: right; }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin: 8px 0; }
.cal-h { text-align: center; font-size: 0.72em; color: var(--muted); }
.cal-cell { aspect-ratio: 1; border: 0; border-radius: 10px; background: var(--bg); font-variant-numeric: tabular-nums; }
.cal-cell.out { opacity: 0.4; }
.cal-cell.today { box-shadow: inset 0 0 0 1.5px var(--accent2); }
.cal-cell.on { background: var(--accent); color: var(--on-accent); font-weight: 700; }

/* ============ настройки ============ */
.table-wrap { overflow-x: auto; margin: 0 -14px; padding: 0 14px; -webkit-overflow-scrolling: touch; }
table.plan { border-collapse: separate; border-spacing: 0; font-size: 0.82em; min-width: 100%; }
table.plan th { color: var(--muted); font-weight: 500; padding: 4px 3px; text-align: center; white-space: nowrap; }
table.plan th.today { color: var(--accent2); font-weight: 700; }
table.plan td { padding: 3px; text-align: center; white-space: nowrap; border-top: 1px solid var(--line); font-variant-numeric: tabular-nums; }
table.plan .sticky { position: sticky; left: -14px; background: var(--panel); text-align: left; z-index: 1; padding-left: 0; max-width: 128px; }
table.plan input.cell { width: 46px; height: 34px; padding: 0 2px; text-align: center; border-radius: 8px; font-size: 1em; }
table.plan td.today input.cell { border-color: color-mix(in srgb, var(--accent2) 55%, var(--line)); }
table.plan input.cell::placeholder { color: var(--gray); opacity: 1; }
table.plan input.cell.strong { width: 54px; font-weight: 700; border-color: color-mix(in srgb, var(--accent) 60%, var(--line)); }
table.plan select.flag { width: 46px; height: 34px; padding: 0 4px; border-radius: 8px; font-weight: 700; text-align: center; }
table.plan .avg { color: var(--gray); }
table.plan .calc { color: var(--muted); font-weight: 600; }
table.plan tr.sys td, table.plan tr.tot td { color: var(--muted); }
table.plan tr.tot td { font-weight: 700; }
table.plan td.bad { color: var(--down) !important; font-weight: 700; }
table.plan tr.is-hidden .link-name { opacity: 0.55; }
.link-name { border: 0; background: none; padding: 6px 0; text-align: left; display: inline-flex; align-items: center; max-width: 124px; overflow: hidden; text-overflow: ellipsis; font-weight: 600; }
.sp-row { display: flex; align-items: center; gap: 6px; border-top: 1px solid var(--line); padding: 4px 0; }
.sp-row:first-child { border-top: 0; }
.sp-row.is-hidden .sp-main { opacity: 0.5; }
.sp-main { flex: 1; display: flex; align-items: center; gap: 10px; border: 0; background: none; padding: 8px 0; text-align: left; min-width: 0; }
.sp-main .tag { margin-left: auto; }
.swatch { width: 22px; height: 22px; border-radius: 7px; flex: 0 0 auto; }
.set-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 0; border-top: 1px solid var(--line); }
.set-row.col { flex-direction: column; align-items: stretch; }
.set-row select { width: auto; height: 36px; }
.set-row .num-in { width: 72px; height: 36px; text-align: center; }
.inline-inputs { display: inline-flex; align-items: center; gap: 6px; }
.inline-inputs input { width: 88px; height: 36px; padding-left: 6px; padding-right: 6px; }
.h2 + .set-row, .hint + .set-row { border-top: 0; }
.day-row { display: flex; align-items: center; gap: 10px; border: 0; background: none; padding: 9px 0; border-top: 1px solid var(--line); text-align: left; width: 100%; }
.day-row span:first-child { flex: 1; }
.day-row svg { width: 16px; height: 16px; color: var(--gray); }
.more summary { color: var(--muted); font-size: 0.88em; padding: 8px 0; cursor: pointer; }
.auth { display: flex; flex-direction: column; gap: 8px; }
.theme-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(98px, 1fr)); gap: 8px; margin-bottom: 6px; }
.theme-tile { border: 1px solid var(--line); border-radius: 14px; padding: 10px; display: flex; flex-direction: column; gap: 8px; align-items: flex-start; font-size: 0.78em; font-weight: 600; text-align: left; min-height: 70px; }
.theme-tile.on { box-shadow: 0 0 0 2px var(--accent2); }
.tt-dots { display: flex; gap: 4px; }
.tt-dots i { width: 14px; height: 14px; border-radius: 50%; box-shadow: 0 0 0 1px rgba(127, 127, 127, 0.4); }
.swatches { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.swatches.inline { margin: 0; gap: 6px; }
.sw { width: 34px; height: 34px; border-radius: 11px; border: 0; position: relative; box-shadow: inset 0 0 0 1px rgba(127, 127, 127, 0.35); }
.sw.sm { width: 28px; height: 28px; border-radius: 9px; }
.sw.on { box-shadow: 0 0 0 2px var(--panel), 0 0 0 4px var(--text); }
.sw-custom { overflow: hidden; display: inline-grid; place-items: center; }
.sw-custom::after { content: "+"; color: #fff; font-weight: 700; text-shadow: 0 0 3px rgba(0, 0, 0, 0.6); }
.sw-custom input { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; }

/* ============ листы, тосты, баннер ============ */
.backdrop { position: fixed; inset: 0; background: rgba(0, 0, 0, 0.55); z-index: 40; animation: fade 0.15s ease; }
.sheet { position: fixed; left: 0; right: 0; bottom: 0; z-index: 41; max-width: 640px; margin: 0 auto; background: var(--panel); border-radius: 22px 22px 0 0; padding: 14px 16px calc(18px + var(--sb)); max-height: 90dvh; overflow-y: auto; animation: up 0.2s ease; }
@keyframes up { from { transform: translateY(30px); opacity: 0; } }
@keyframes fade { from { opacity: 0; } }
.sheet-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 12px; }
.sheet-head h3 { margin: 0; font-size: 1.1em; display: flex; align-items: center; }
.sheet .chips.wrap { margin-top: 6px; }
.sheet > input, .sheet form > input { margin-bottom: 8px; }
.hm-row { display: flex; gap: 8px; align-items: flex-end; margin: 10px 0; flex-wrap: wrap; }
.hm-row label { display: flex; align-items: center; gap: 6px; }
.hm-row label > span { color: var(--muted); font-size: 0.85em; white-space: nowrap; }
.hm-row input[type="number"] { width: 70px; text-align: center; font-weight: 700; font-size: 1.1em; }
.hm-row label.grow input { flex: 1; min-width: 0; }
.hm-row select { flex: 1; }
.field { display: flex; flex-direction: column; gap: 5px; margin: 10px 0; }
.field > span { color: var(--muted); font-size: 0.82em; }
.check { display: flex; align-items: center; gap: 10px; margin: 12px 0; font-size: 0.92em; }
.check input { width: 20px; height: 20px; accent-color: var(--accent2); }
.alarm-done { text-align: center; padding: 10px 0; }
.big-emoji { font-size: 56px; }
.alarm-done h3 { margin: 6px 0; font-size: 1.4em; }

.toast { flex-wrap: nowrap !important; position: fixed; left: 50%; transform: translateX(-50%); z-index: 60; top: calc(env(safe-area-inset-top) + 6px); background: var(--text); color: var(--bg); border-radius: 12px; padding: 4px 5px 4px 14px; min-height: 36px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; max-width: calc(100% - 24px); width: max-content; box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35); font-size: 0.82em; animation: up 0.18s ease; }
.toast[hidden] { display: none; }
.toast span { margin-right: 6px; }
.toast button { border: 0; background: color-mix(in srgb, var(--bg) 10%, transparent); color: var(--accent2); font-weight: 700; padding: 4px 9px; border-radius: 8px; }


#banner { position: fixed; left: 0; right: 0; top: 0; z-index: 55; padding: calc(env(safe-area-inset-top) + 8px) 10px 0; pointer-events: none; }
.rem-banner { pointer-events: auto; max-width: 620px; margin: 0 auto; background: var(--panel); border-radius: 18px; padding: 12px 12px 10px 14px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4); border-left: 5px solid var(--c); animation: up 0.2s ease; }
.rem-banner .btn-row { margin-top: 8px; }

/* ============ календарь: см. ниже ============ */
.donut text { stroke: none; }
.donut circle { stroke-linecap: butt; }

/* ============ календарь-ежедневник ============ */
.cal { --lh: calc(var(--cal-fs, 15px) * 1.8); --cal-accent: var(--accent2); --cal-red: #e5484d;
  --cal-bg: var(--bg); --cal-page: #1f1f22; --cal-tab: #29292d; --cal-line: #36363c; --cal-ink: #ececf0; --cal-muted: #8e8e93; --cal-ring: #8e8e93;
  color: var(--cal-ink); }
.cal.cal-white { --cal-page: #f6f6f3; --cal-tab: #e9e9e6; --cal-line: #d7d7dc; --cal-ink: #141416; --cal-muted: #7a7a80; --cal-ring: #a1a1a6; }
.cal.cal-light { --cal-bg: #ececf1; --cal-page: #ffffff; --cal-tab: #f1f1f4; --cal-line: #dcdce2; --cal-ink: #141416; --cal-muted: #77777d; --cal-ring: #8e8e93; }
.cal.cal-light { background: var(--cal-bg); margin: calc(-8px - env(safe-area-inset-top)) -12px 0; padding: calc(env(safe-area-inset-top) + 8px) 12px 30px; min-height: 100dvh; }
.cal.cal-white .ln, .cal.cal-light .ln { --cal-ink-auto: #141416; }
.cal .ln-text, .cal .ln-input { color: var(--cal-ink); }
.cal .hint, .cal .cal-hint { color: var(--muted); }
.cal-hint { font-size: 0.7em; text-align: center; margin: 12px 8px 0; color: var(--muted); }

.cal-head { position: relative; display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.today-badge { flex: 0 0 auto; width: 46px; height: 46px; border: 0; border-radius: 12px; background: var(--cal-red); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1; box-shadow: 0 3px 10px rgba(229, 72, 77, 0.35); }
.today-badge small { font-size: 0.62em; opacity: 0.9; }
.today-badge b { font-size: 1.15em; }
.today-badge.sm { width: 38px; height: 38px; border-radius: 10px; }
.cal-title { flex: 1; min-width: 0; display: flex; align-items: center; background: var(--panel); border-radius: 12px; height: 46px; color: var(--text); }
.cal-arrow { flex: 0 0 auto; width: 26px; height: 46px; border: 0; background: none; color: var(--muted); display: grid; place-items: center; padding: 0; }
.cal-arrow svg { width: 16px; height: 16px; }
.cal-tt { position: relative; flex: 1; min-width: 0; display: flex; align-items: center; justify-content: center; gap: 6px; }
.cal-tt svg { width: 18px; height: 18px; color: var(--muted); flex: 0 0 auto; }
.cal-tt > span { display: flex; flex-direction: column; min-width: 0; line-height: 1.15; }
.cal-tt b { font-size: 0.9em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-tt small { font-size: 0.68em; color: var(--muted); white-space: nowrap; }
.cal-tt input[type="date"] { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; }
.cal-tools { display: flex; gap: 4px; }
.cal-btn { width: 34px; height: 34px; border-radius: 10px; border: 0; background: var(--panel); color: var(--text); display: inline-grid; place-items: center; padding: 0; flex: 0 0 auto; }
.cal-btn svg { width: 18px; height: 18px; }
.pop-backdrop { position: fixed; inset: 0; z-index: 30; }
.pop-menu { position: absolute; right: 0; top: 52px; z-index: 31; min-width: 190px; background: var(--panel); border-radius: 18px; box-shadow: 0 14px 40px rgba(0, 0, 0, 0.5); overflow: hidden; border: 1px solid var(--line); }
.pop-menu button { display: flex; align-items: center; gap: 10px; width: 100%; border: 0; background: none; padding: 13px 16px; font-size: 0.98em; color: var(--text); text-align: left; border-top: 1px solid var(--line); }
.pop-menu button:first-child { border-top: 0; }
.pop-menu button.on { background: var(--panel-2); }
.pm-check { width: 18px; display: inline-grid; color: var(--accent2); }
.pm-check svg { width: 18px; height: 18px; }

.pin-banner { display: flex; flex-direction: column; gap: 2px; background: var(--panel); border-radius: 14px; padding: 5px 6px 5px 10px; margin-bottom: 10px; }
.pin-row { display: flex; align-items: center; gap: 6px; min-width: 0; }
.pin-banner.multi .pin-row + .pin-row { border-top: 1px solid var(--line); padding-top: 2px; }
.pin-bars.blank { visibility: hidden; }
.pin-cap.dim { color: var(--gray); font-weight: 500; }
.pin-cap.task { color: var(--accent); }
.task-check { border: 0; background: none; color: var(--text); font-size: 1.25em; width: 34px; height: 34px; padding: 0; }
.pin-main { flex: 1; display: flex; align-items: stretch; gap: 10px; border: 0; background: none; text-align: left; color: var(--text); min-width: 0; padding: 2px 0; }
.pin-main > span { display: flex; flex-direction: column; justify-content: center; min-width: 0; }
.pin-main b { font-size: 0.86em; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pin-cap { font-size: 0.7em; color: var(--accent2); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* полоски закрепов как в Telegram */
.pin-bars { flex: 0 0 3px; display: flex; flex-direction: column; gap: 2px; padding: 1px 0; }
.pin-bars i { flex: 1; width: 3px; border-radius: 2px; background: color-mix(in srgb, var(--accent2) 30%, transparent); }
.pin-bars i.on { background: var(--accent2); }
.ln.flash { animation: lnflash 1.6s ease; }
@keyframes lnflash { 0%, 60% { background: color-mix(in srgb, var(--accent2) 30%, transparent); } 100% { background: transparent; } }
.pin-done { border: 0; background: none; color: var(--accent); width: 30px; height: 30px; display: grid; place-items: center; }
.pin-done svg { width: 18px; height: 18px; }

/* разворот */
.book { position: relative; display: grid; grid-template-columns: 1fr 1fr; column-gap: 22px; row-gap: 14px; align-items: stretch; }
.book.cols .bk-col { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.book.cols .bk-col .pg { flex: 1; }
.spiral { position: absolute; top: 4px; bottom: 4px; left: 50%; width: 16px; transform: translateX(-50%); pointer-events: none; opacity: 0.9;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='17'%3E%3Cpath d='M2.5 10.5 C2.5 3.5 13.5 3.5 13.5 9.5' fill='none' stroke='%239a9aa0' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") repeat-y center top / 16px 17px; }
.wk-end { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.wk-end .pg { flex: 1; }
.pg { display: flex; flex-direction: column; min-width: 0; }
.pg-tab { align-self: flex-start; display: inline-flex; align-items: baseline; gap: 6px; border: 0; background: var(--cal-tab); color: var(--cal-ink); border-radius: 10px 10px 0 0; padding: 5px 10px 3px; font-size: 0.8em; }
.pg-tab b { font-size: 1.15em; }
.pg-tab span { color: var(--cal-muted); font-size: 0.85em; }
.pg-open { font-style: normal; color: var(--cal-muted); margin-left: 8px; font-size: 0.9em; }
.pg.is-today .pg-tab { background: var(--cal-red); color: #fff; }
.pg.is-today .pg-tab span, .pg.is-today .pg-open { color: rgba(255, 255, 255, 0.85); }
.pg.past { opacity: 0.88; }
.pg-lines { flex: 1; position: relative; background-color: var(--cal-page); border-radius: 0 14px 14px 14px; padding: 2px 8px 6px; min-height: calc(var(--lh) * 2); cursor: text;
  background-image: linear-gradient(to bottom, transparent calc(var(--lh) - 1px), var(--cal-line) calc(var(--lh) - 1px)); background-size: 100% var(--lh); background-origin: content-box; background-clip: padding-box; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.18); }
.date-inline .pg-tab { align-self: stretch; border-radius: 14px 14px 0 0; background: var(--cal-page); border-bottom: 2px solid var(--cal-line); }
.date-inline .pg-lines { border-radius: 0 0 14px 14px; }
.lines-dots .pg-lines { background-image: radial-gradient(circle, var(--cal-line) 1.3px, transparent 1.7px); background-size: 18px var(--lh); background-position: 0 calc(var(--lh) / 2); }
.lines-grid .pg-lines { background-image: linear-gradient(to bottom, transparent calc(var(--lh) - 1px), var(--cal-line) calc(var(--lh) - 1px)), linear-gradient(to right, transparent calc(var(--lh) - 1px), var(--cal-line) calc(var(--lh) - 1px)); background-size: 100% var(--lh), var(--lh) 100%; }
.lines-dotted .pg-lines { background-image: radial-gradient(circle at 1px calc(var(--lh) - 1px), var(--cal-line) 1px, transparent 1.4px); background-size: 6px var(--lh); }
.ln { display: flex; align-items: center; gap: 6px; height: var(--lh); line-height: var(--lh); font-size: var(--cal-fs, 15px); padding: 0 2px; min-width: 0; overflow: hidden; }
.ln.empty { cursor: text; }
.ln-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ln u { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.ln.done .ln-text, .ln.done .ln-pill { text-decoration: line-through; opacity: 0.5; }
.cal.nostrike .ln.done .ln-text, .cal.nostrike .ln.done .ln-pill, .cal.nostrike .tl-block.done, .cal.nostrike .lv-row.done .lv-text { text-decoration: none; }
.ln-dot { width: 7px; height: 7px; border-radius: 50%; flex: 0 0 auto; }
.ln-box { width: 17px; height: 17px; border-radius: 5px; border: 1.5px solid var(--cal-muted); background: none; padding: 0; display: grid; place-items: center; flex: 0 0 auto; color: #fff; }
.ln-box svg { width: 12px; height: 12px; stroke-width: 3; }
.ln.done .ln-box { background: var(--c); border-color: var(--c); }
.ln-pill { display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: calc(var(--lh) - 8px); padding: 0 8px; border-radius: 6px; background: color-mix(in srgb, var(--c) 24%, var(--cal-page)); border-left: 3px solid var(--c); color: var(--cal-ink); font-size: 0.95em; }
.rec-ico { font-style: normal; font-size: 0.75em; opacity: 0.7; }
.ln.editing { padding: 0; }
.ln.editing { position: relative; overflow: visible; z-index: 6; }
/* правка строки: окошко на всю ширину строки, длинный текст переносится по линиям блокнота */
.ln-input { position: absolute; left: 0; right: 0; top: 0; width: 100%; min-height: var(--lh); height: var(--lh); margin: 0; border: 0 !important; border-radius: 6px !important; resize: none; overflow: hidden; display: block;
  line-height: var(--lh) !important; padding: 0 4px !important; font: inherit; font-size: var(--cal-fs, 15px) !important; color: var(--cal-ink) !important; outline: none; white-space: pre-wrap; overflow-wrap: anywhere;
  background-color: color-mix(in srgb, var(--cal-accent) 12%, var(--cal-page)) !important;
  background-image: linear-gradient(to bottom, transparent calc(var(--lh) - 1px), var(--cal-line) calc(var(--lh) - 1px)) !important; background-size: 100% var(--lh) !important; background-attachment: local !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.28); -webkit-appearance: none; appearance: none; }
.half .pg-lines { min-height: calc(var(--lh) * 3); }

/* неделя / 4 / 2 дня — целиком на экране, без прокрутки; листается свайпом */
#calPage.fit { display: flex; flex-direction: column; overflow: hidden; height: 100%; }
.cal.cal-light.fit { min-height: 0; height: calc(100% + 16px + env(safe-area-inset-top)); margin-bottom: -8px; padding-bottom: 8px; }
.fit .cal-head, .fit .pin-banner { flex: 0 0 auto; margin-bottom: 8px; }
.fit .book { flex: 1 1 0; min-height: 0; row-gap: 8px; grid-auto-rows: minmax(0, 1fr); }
.fit .book.cols { grid-template-rows: minmax(0, 1fr); }
.fit .book.two { grid-template-rows: minmax(0, 1fr); }
.fit .pg, .fit .wk-end, .fit .bk-col { min-height: 0; }
.fit .bk-col { gap: 8px; }
.fit .wk-end { gap: 6px; }
.fit .bk-col .wk-end { flex: 1 1 0; }
.fit .wk-end .pg, .fit .bk-col .pg { flex: 1 1 0; }
.fit .pg-lines { flex: 1 1 0; min-height: 0; overflow: hidden; padding-top: 0; padding-bottom: 0; }
.fit .half .pg-lines { min-height: 0; }
.fit .pg-lines.grow { overflow-y: auto; overscroll-behavior: contain; background-attachment: local; scrollbar-width: none; } /* ввод ниже края странички */
.fit .pg-lines.grow::-webkit-scrollbar { display: none; }
.fit .pg-tab { padding: 3px 9px 2px; }
.fit .half .pg-tab { padding: 2px 8px 1px; font-size: 0.72em; }
.fit { --lh: calc(var(--cal-fs, 15px) * 1.65); }
.ln.more { color: var(--cal-accent); font-size: calc(var(--cal-fs, 15px) * 0.85); font-weight: 600; cursor: pointer; }
.fit .pin-banner { padding-top: 2px; padding-bottom: 2px; }

/* месяц */
.month .mo-head { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin-bottom: 4px; }
.month .mo-head span { text-align: center; font-size: 0.7em; color: var(--muted); }
.mo-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.mo-cell { min-height: 84px; border: 0; border-radius: 10px; background: var(--cal-page); color: var(--cal-ink); padding: 4px 3px; display: flex; flex-direction: column; align-items: stretch; gap: 2px; text-align: left; overflow: hidden; }
.mo-cell b { font-size: 0.78em; padding-left: 2px; }
.mo-cell.out { opacity: 0.4; }
.mo-cell.is-today b { background: var(--cal-red); color: #fff; border-radius: 6px; align-self: flex-start; padding: 0 5px; }
.mo-ln { font-size: 0.58em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-left: 2px solid var(--c); padding-left: 3px; color: var(--cal-ink); }
.mo-ln.rec { background: color-mix(in srgb, var(--c) 20%, transparent); }
.mo-more { font-size: 0.56em; color: var(--cal-muted); padding-left: 3px; }

/* день на весь экран: без рамок, шапка (дни недели, фильтры) всегда видна */
body[data-calday="1"] .view { padding: 0 12px; }
.cal-daymodal { margin: 0 -12px; min-height: 100%; background: var(--cal-page); }
.cal-daymodal .dm-top { position: sticky; top: 0; z-index: 8; background: var(--cal-page); padding: calc(env(safe-area-inset-top) + 8px) 12px 0; box-shadow: 0 1px 0 var(--cal-line); }
.cal-daymodal .dm-body { padding: 6px 12px 12px; }
.cal-daymodal .pg-lines { box-shadow: none; border-radius: 0; padding-left: 4px; padding-right: 4px; min-height: calc(var(--lh) * 20); }
.cal-daymodal .cal-btn { background: color-mix(in srgb, var(--cal-ink) 8%, transparent); color: var(--cal-ink); }
.dm-title { flex: 1; min-width: 0; font-size: 1.12em; color: var(--cal-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dm-modes { display: inline-flex; padding: 2px; border-radius: 10px; background: color-mix(in srgb, var(--cal-ink) 8%, transparent); }
.dm-modes button { width: 32px; height: 30px; border: 0; background: none; border-radius: 8px; color: var(--cal-muted); display: grid; place-items: center; padding: 0; }
.dm-modes button svg { width: 17px; height: 17px; }
.dm-modes button.on { background: var(--cal-page); color: var(--cal-accent); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25); }
.cal-daymodal .dm-strip .cal-btn { width: 30px; flex: 0 0 30px; }
.cal-daymodal .dm-filters { margin: 8px 0 8px; }
.dm-head { display: flex; align-items: center; gap: 8px; }

.dm-month { font-size: 0.72em; color: var(--cal-muted); margin: 10px 4px 4px; }
.dm-strip { display: flex; align-items: center; gap: 2px; padding-bottom: 8px; border-bottom: 1px solid var(--cal-line); }
.ds-day { flex: 1; border: 0; background: none; border-radius: 10px; padding: 5px 0 4px; display: flex; flex-direction: column; align-items: center; gap: 1px; color: var(--cal-ink); }
.ds-day small { font-size: 0.66em; color: var(--cal-muted); }
.ds-day b { font-size: 1.05em; }
.ds-day i { width: 5px; height: 5px; border-radius: 50%; }
.ds-day i.has { background: var(--cal-accent); }
.ds-day.on { background: color-mix(in srgb, var(--cal-ink) 10%, transparent); }
.ds-day.today b { color: var(--cal-red); }
.dm-filters { display: flex; gap: 6px; margin: 10px 0 6px; overflow-x: auto; scrollbar-width: none; }
.fchip { flex: 0 0 auto; border: 1px solid var(--cal-line); background: none; color: var(--cal-ink); border-radius: 10px; height: 32px; padding: 0 11px; font-size: 0.8em; display: inline-flex; align-items: center; gap: 4px; }
.fchip.on { border-color: var(--cal-accent); color: var(--cal-accent); font-weight: 600; }
.fchip.icon { margin-left: auto; padding: 0 8px; }
.fchip svg { width: 17px; height: 17px; }

/* поиск */
.cal-search { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.cal-search label { flex: 1; display: flex; align-items: center; gap: 8px; background: var(--panel); border-radius: 12px; padding: 0 10px; }
.cal-search label svg { width: 18px; height: 18px; color: var(--muted); }
.cal-search input { border: 0 !important; background: none !important; padding: 0 !important; height: 42px !important; }
.sr-list { display: flex; flex-direction: column; gap: 6px; }
.sr-row { display: flex; flex-direction: column; gap: 2px; border: 0; background: var(--cal-page); color: var(--cal-ink); border-radius: 12px; padding: 9px 12px; text-align: left; }
.sr-date { font-size: 0.7em; color: var(--cal-muted); }
.sr-text { font-size: 0.92em; }

/* подсказки над клавиатурой */
.cal-suggest { position: fixed; left: 8px; right: 8px; top: 0; z-index: 70; display: flex; gap: 6px; overflow-x: auto; padding: 5px 6px; background: color-mix(in srgb, var(--panel) 94%, transparent); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45); scrollbar-width: none; }
.cal-suggest[hidden] { display: none; }
.sg { flex: 0 0 auto; border: 1px solid var(--line); background: var(--bg); color: var(--text); border-radius: 999px; padding: 6px 12px; font-size: 0.85em; white-space: nowrap; }
.sg.sym { font-weight: 700; }

/* шкала времени дня */
.tl-untimed { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 8px; }
.tl-note { border: 1px solid var(--cal-line); background: none; color: var(--cal-ink); border-radius: 8px; padding: 4px 8px; font-size: 0.82em; }
.timeline { position: relative; border-radius: 14px; overflow: hidden; }
.tl-hour { position: absolute; left: 0; right: 0; height: 52px; border-top: 1px solid var(--cal-line); cursor: pointer; }
.tl-hour span { position: absolute; left: 6px; top: 2px; font-size: 0.66em; color: var(--cal-muted); font-variant-numeric: tabular-nums; }
.tl-now { position: absolute; left: 40px; right: 0; border-top: 2px solid var(--cal-red); z-index: 3; }
.tl-now::before { content: ""; position: absolute; left: -5px; top: -6px; width: 10px; height: 10px; border-radius: 50%; background: var(--cal-red); }
.tl-block { position: absolute; z-index: 2; border-radius: 8px; padding: 3px 7px; font-size: 0.78em; overflow: hidden; background: color-mix(in srgb, var(--c) 30%, var(--cal-page)); border-left: 4px solid var(--c); color: var(--cal-ink); touch-action: pan-y; cursor: pointer; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.tl-block.lifted { box-shadow: 0 10px 24px rgba(0, 0, 0, 0.45), 0 0 0 2px var(--c); transform: scale(1.03); z-index: 6; cursor: grabbing; }
.tl-box { float: left; margin: 1px 5px 0 0; width: 15px; height: 15px; }
.tl-block.nodur { background: color-mix(in srgb, var(--c) 16%, var(--cal-page)); border-left-style: dashed; }
.tl-block.done { opacity: 0.5; text-decoration: line-through; }
.tl-block.dragging { box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3); z-index: 5; cursor: grabbing; }

/* неделя по часам (как в Google Календаре) */
.wg { --wg-gut: 30px; position: relative; }
.wg-hour { position: absolute; left: 0; right: 0; border-top: 1px solid var(--cal-line); pointer-events: none; }
.wg-hour span { position: absolute; left: 6px; top: 1px; font-size: 0.6em; color: var(--cal-muted); font-variant-numeric: tabular-nums; }
.wg-col { position: absolute; top: 0; bottom: 0; border-left: 1px solid color-mix(in srgb, var(--cal-line) 60%, transparent); cursor: pointer; }
.wg-col.today { background: color-mix(in srgb, var(--cal-accent) 7%, transparent); }
.wg-col.past { background: color-mix(in srgb, var(--cal-ink) 2%, transparent); }
.wg-block { padding: 1px 3px; font-size: 0.62em; line-height: 1.15; border-left-width: 3px; border-radius: 5px; margin-left: 1px; }
.wg-block b { display: block; font-weight: 700; font-size: 0.92em; }
.wg-block span { display: block; overflow: hidden; overflow-wrap: break-word; hyphens: auto; -webkit-hyphens: auto; }
.wg-now { position: absolute; left: 0; right: 0; border-top: 2px solid var(--cal-red); z-index: 3; pointer-events: none; }
.is-week .dm-strip { gap: 0; }
.is-week .ds-day { border-radius: 8px; }

/* телефон на боку: компактная шапка и таб-бар без подписей */
@media (orientation: landscape) and (max-height: 560px) {
  :root { --tabs-h: 44px; }
  .tab span { display: none; }
  .cal-daymodal.land .dm-top { padding-top: calc(env(safe-area-inset-top) + 4px); padding-left: max(12px, env(safe-area-inset-left)); padding-right: max(12px, env(safe-area-inset-right)); }
  .cal-daymodal.land .dm-modes { display: none; }
  .cal-daymodal.land .dm-title { font-size: 0.98em; }
  .cal-daymodal.land .today-badge.sm { width: 32px; height: 32px; }
  .cal-daymodal.land .dm-strip { padding-bottom: 2px; border-bottom: 0; margin-top: 2px; }
  .cal-daymodal.land .ds-day { flex-direction: row; justify-content: center; gap: 4px; padding: 2px 0; }
  .cal-daymodal.land .ds-day i { display: none; }
  .cal-daymodal.land .dm-body { padding-left: max(12px, env(safe-area-inset-left)); padding-right: max(12px, env(safe-area-inset-right)); }
}

/* настройки календаря: плитки */
.opt-row { display: flex; gap: 8px; flex-wrap: wrap; }
.opt-tile { border: 1px solid var(--line); background: var(--bg); border-radius: 12px; padding: 6px; display: flex; flex-direction: column; align-items: center; gap: 4px; color: var(--muted); width: 68px; }
.opt-tile.on { border-color: var(--accent2); color: var(--text); }
.ot-prev { --lh: 9px; --cal-line: #9a9aa0; width: 52px; height: 36px; border-radius: 6px; background-color: #f6f6f3; }
.ot-prev.lines-lines { background-image: linear-gradient(to bottom, transparent 8px, var(--cal-line) 8px); background-size: 100% 9px; }
.ot-prev.lines-dots { background-image: radial-gradient(circle, var(--cal-line) 1.1px, transparent 1.5px); background-size: 9px 9px; }
.ot-prev.lines-grid { background-image: linear-gradient(to bottom, transparent 8px, var(--cal-line) 8px), linear-gradient(to right, transparent 8px, var(--cal-line) 8px); background-size: 100% 9px, 9px 100%; }
.ot-prev.lines-dotted { background-image: radial-gradient(circle at 1px 8px, var(--cal-line) 0.8px, transparent 1.2px); background-size: 4px 9px; }
.opt-tile small { font-size: 0.68em; }
.ink { width: 38px; height: 38px; border-radius: 10px; border: 1px solid var(--line); background: linear-gradient(135deg, #000 50%, #eee 50%); color: transparent; font-weight: 700; }
.ink.on { box-shadow: 0 0 0 2px var(--panel), 0 0 0 4px var(--text); }

.toast span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.toast button { flex: 0 0 auto; }
.avg-note { margin-left: auto; display: inline-flex; align-items: center; gap: 5px; text-transform: none; letter-spacing: 0; font-weight: 500; color: var(--accent); }
.avg-note i { width: 14px; border-top: 1.5px dashed var(--accent); }
.chart-sub { font-size: 0.68em; color: var(--gray); margin: -6px 0 8px; }
.hc { flex: 1 0 46px; }
.hc-val { font-size: 0.62em; }
.center-link { font-size: 0.72em; }

/* ============ настройки: «назад» всегда на экране ============ */
.view.view-set { padding-top: 0; bottom: 0; padding-bottom: calc(var(--sb) + 20px); }
.page.set > .page-head { position: sticky; top: calc(-8px - env(safe-area-inset-top)); z-index: 12; background: color-mix(in srgb, var(--bg) 92%, transparent); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); margin: calc(-8px - env(safe-area-inset-top)) -12px 6px; padding: calc(env(safe-area-inset-top) + 8px) 12px 6px; }
.page.set > .page-head .h1 { margin: 0; }

/* ============ календарь: шапка на узком экране ============ */
@media (max-width: 400px) { .cal-tt > svg { display: none; } .cal-tools { gap: 3px; } .cal-btn { width: 32px; } }

/* ============ режим ожидания ============ */
body[data-standby="1"] .tabs { display: none; }
body[data-standby="1"] { background: #000; }
.standby { position: fixed; inset: 0; z-index: 50; background: #000; color: #fff; overflow-y: auto; padding: calc(env(safe-area-inset-top) + 14px) max(16px, env(safe-area-inset-right)) calc(var(--sb) + 20px) max(16px, env(safe-area-inset-left)); display: flex; flex-direction: column; gap: 14px; }
.stb-close { position: absolute; top: calc(env(safe-area-inset-top) + 10px); right: max(12px, env(safe-area-inset-right)); width: 36px; height: 36px; border-radius: 11px; border: 0; background: #1c1c1e; color: #8e8e93; display: grid; place-items: center; z-index: 2; }
.stb-close svg { width: 18px; height: 18px; }
.stb-clock { display: flex; flex-direction: column; align-items: center; gap: 2px; margin-top: 8px; }
.stb-clock b { font-size: clamp(56px, 22vw, 120px); font-weight: 600; letter-spacing: -0.02em; line-height: 1; font-variant-numeric: tabular-nums; }
.stb-clock span { color: #8e8e93; font-size: 0.9em; }
.stb-main { display: flex; flex-direction: column; gap: 10px; width: 100%; max-width: 640px; margin: 0 auto; }
.stb-card { background: #0d0d0f; border: 1px solid #2c2c2e; border-radius: 22px; padding: 16px 18px 18px; cursor: pointer; }
.sbc-top { display: flex; align-items: flex-start; gap: 12px; }
.sbc-title { flex: 1; min-width: 0; font-size: 1.25em; font-weight: 600; line-height: 1.2; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.sbc-left { font-size: 2.3em; font-weight: 500; line-height: 1; font-variant-numeric: tabular-nums; letter-spacing: -0.01em; white-space: nowrap; }
.sbc-times { display: flex; justify-content: space-between; gap: 10px; margin-top: 14px; color: #d1d1d6; font-size: 0.92em; font-variant-numeric: tabular-nums; }
.sbc-times span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sbc-bar { height: 5px; border-radius: 3px; background: #2c2c2e; margin-top: 8px; overflow: hidden; }
.sbc-bar i { display: block; height: 100%; border-radius: 3px; background: #0a84ff; }
.stb-card.idle .sbc-title { color: #8e8e93; }
.stb-cap { font-size: 0.72em; text-transform: uppercase; letter-spacing: 0.06em; color: #8e8e93; margin: 4px 4px -4px; }
.stb-nexts { display: flex; flex-direction: column; background: #0d0d0f; border: 1px solid #2c2c2e; border-radius: 18px; overflow: hidden; }
.stb-next { display: flex; align-items: center; gap: 8px; border: 0; background: none; color: #fff; padding: 12px 14px; text-align: left; border-top: 1px solid #1c1c1e; font-size: 0.95em; }
.stb-next:first-child { border-top: 0; }
.stb-next .dot { margin: 0; }
.sbn-time { font-variant-numeric: tabular-nums; color: #d1d1d6; white-space: nowrap; }
.sbn-title { flex: 1; min-width: 0; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sbn-in { color: #8e8e93; font-size: 0.85em; white-space: nowrap; }
.pin-banner.pb-standby { background: #0d0d0f; border: 1px solid #2c2c2e; border-radius: 18px; margin: 0; padding: 8px 8px 8px 14px; }
.pin-banner.pb-standby .pin-main { color: #fff; }
.pin-banner.pb-standby .pin-main b { font-size: 0.95em; }
@media (orientation: landscape) and (max-height: 560px) {
  .standby { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); align-items: center; gap: 20px; }
  .stb-clock { margin: 0; }
  .stb-main { max-width: none; padding-top: 30px; }
}

/* строка «что идёт сейчас» над разворотом — мелко и серо */
.cal-now { display: flex; align-items: center; gap: 5px; width: 100%; height: 18px; margin: -4px 0 6px; padding: 0 4px; border: 0; background: none; color: var(--gray); font-size: 0.7em; white-space: nowrap; overflow: hidden; font-variant-numeric: tabular-nums; text-align: left; }
.cal-now b { color: var(--muted); font-weight: 600; }
.cal-now .dot { margin: 0; width: 6px; height: 6px; flex: 0 0 auto; }
.cal-now .cn-title { min-width: 0; overflow: hidden; text-overflow: ellipsis; color: var(--muted); }
.cal-now span { flex: 0 0 auto; }
.cal-now .cn-title { flex: 0 1 auto; }
.fit .cal-now { flex: 0 0 auto; }
.ln-bell { font-style: normal; font-size: 0.72em; opacity: 0.75; margin-left: 2px; }

/* быстрая анимация листания: новое содержимое въезжает с той стороны, куда листали */
.swipe-next { animation: swipeFromRight 0.17s cubic-bezier(0.2, 0.8, 0.2, 1); }
.swipe-prev { animation: swipeFromLeft 0.17s cubic-bezier(0.2, 0.8, 0.2, 1); }
@keyframes swipeFromRight { from { transform: translateX(22%); opacity: 0.25; } to { transform: none; opacity: 1; } }
@keyframes swipeFromLeft { from { transform: translateX(-22%); opacity: 0.25; } to { transform: none; opacity: 1; } }

/* легенда кольца: «левитирующие» метки — цвет и название; выбранная в кольце раскрывается с цифрами */
.lg-cloud { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 6px; margin: 10px 2px 4px; }
.lg-chip { display: inline-flex; align-items: center; gap: 6px; border: 0; border-radius: 999px; padding: 5px 11px 5px 9px; background: color-mix(in srgb, var(--c) 13%, var(--panel-2)); color: var(--text); font-size: 0.78em; box-shadow: 0 3px 10px rgba(0, 0, 0, 0.25); transition: transform 0.15s ease; }
.lg-chip .dot { margin: 0; width: 8px; height: 8px; }
.lg-chip em { font-style: normal; color: var(--muted); font-variant-numeric: tabular-nums; margin-left: 2px; }
.lg-chip em b { color: var(--text); font-weight: 600; }
.lg-chip em b.up { color: var(--up); }
.lg-chip.open { background: color-mix(in srgb, var(--c) 26%, var(--panel-2)); box-shadow: 0 0 0 1.5px var(--c), 0 6px 16px rgba(0, 0, 0, 0.3); transform: translateY(-1px); font-size: 0.86em; padding: 7px 13px 7px 11px; }
.donut .arc { cursor: pointer; transition: opacity 0.15s ease; }
.donut .arc.dim { opacity: 0.28; }

/* клавиатура открыта (телефон): меню и капсула режимов не занимают место */
body[data-kb="1"] .tabs, body[data-kb="1"] .mode-float { display: none; }

/* кнопка режима ожидания в «Учёте» — слева от часов */
.clock-sb { position: absolute; left: 0; bottom: 8px; border: 0; background: none; color: var(--muted); padding: 6px; opacity: 0.8; }
.clock-sb svg { width: 19px; height: 19px; }
/* режим ожидания: идущие таймеры, экономия энергии */
.stb-card.sess .sbc-title { display: flex; align-items: center; gap: 8px; }
.stb-card.sess .dot { margin: 0; width: 10px; height: 10px; }
.stb-card.sess { border-color: color-mix(in srgb, var(--c) 45%, #2c2c2e); }
.stb-card.sess.paused { opacity: 0.6; }
.standby { transition: opacity 0.6s ease; }
.standby.dim { opacity: 0.55; }
.standby * { animation: none !important; }

/* повтор в карточке строки: дни недели */
.wd-row { display: grid; grid-template-columns: repeat(7, 1fr); gap: 5px; margin: 8px 0 4px; }
.wd { border: 1px solid var(--line); background: var(--bg); color: var(--muted); border-radius: 10px; height: 36px; font-size: 0.82em; font-weight: 600; padding: 0; }
.wd.on { background: var(--accent2); border-color: var(--accent2); color: #fff; }
.small-label { margin-top: 10px; }
/* записи без времени на шкале — в 9:00, пунктиром */
.tl-block.untimed { background: color-mix(in srgb, var(--c) 12%, var(--cal-page)); border-left-style: dotted; opacity: 0.85; }
.tl-block.untimed b { font-weight: 500; opacity: 0.75; }
.wg-group { position: absolute; z-index: 2; border: 0; border-left: 3px dotted var(--cal-accent); border-radius: 5px; margin-left: 1px; padding: 1px 3px; text-align: left; font-size: 0.62em; line-height: 1.15; overflow: hidden; color: var(--cal-ink); background: color-mix(in srgb, var(--cal-accent) 12%, var(--cal-page)); }
.wg-group b { display: block; font-weight: 700; }
.wg-group span { display: block; overflow: hidden; opacity: 0.85; overflow-wrap: break-word; }

/* масштаб шкалы − / + */
.zoom { margin-left: auto; display: inline-flex; gap: 4px; flex: 0 0 auto; }
.zbtn { width: 32px; height: 32px; border: 1px solid var(--cal-line); background: none; color: var(--cal-ink); border-radius: 10px; font-size: 1.1em; font-weight: 600; padding: 0; line-height: 1; }
.zbtn:disabled { opacity: 0.3; }
.dm-filters .zoom { position: sticky; right: 0; background: var(--cal-page); padding-left: 4px; }
.wg.tight .wg-block { font-size: 0.55em; }
.wg.tight .wg-block span { display: none; }
.cal-btn.accent { color: var(--cal-accent, var(--accent2)); }
.cal-daymodal.is-main .dm-head .cal-btn { flex: 0 0 auto; }
.dm-month .cal-now.inline { display: inline-flex; width: auto; height: auto; margin: 0 0 0 10px; padding: 0; vertical-align: baseline; max-width: 60%; }
.cal-daymodal .pin-banner.pb-grid { margin: 6px 0 4px; }

/* список всех записей */
.cal-listpage .lv-filters { margin: 4px 0 6px; }
.lv-day { margin-bottom: 4px; }
.lv-date { position: sticky; top: 0; z-index: 3; display: flex; align-items: baseline; gap: 8px; width: 100%; border: 0; text-align: left; background: var(--bg); color: var(--text); padding: 10px 4px 6px; }
.lv-date b { font-size: 0.95em; }
.lv-date small { color: var(--muted); font-size: 0.75em; }
.lv-day.is-today .lv-date b { color: var(--cal-red, #e5484d); }
.lv-day.past { opacity: 0.75; }
.lv-row { display: flex; align-items: center; gap: 10px; background: var(--cal-page); color: var(--cal-ink); border-radius: 12px; padding: 9px 10px; margin: 0 0 6px; cursor: pointer; }
.lv-time { flex: 0 0 46px; font-size: 0.82em; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.15; color: var(--cal-ink); }
.lv-time small { color: var(--cal-muted); font-weight: 500; }
.lv-bar { flex: 0 0 3px; align-self: stretch; border-radius: 2px; background: var(--c); }
.lv-text { flex: 1; min-width: 0; font-size: 0.95em; overflow-wrap: anywhere; }
.lv-row.done .lv-text { text-decoration: line-through; opacity: 0.55; }
.lv-empty { color: var(--gray); font-size: 0.8em; padding: 2px 6px 8px; }
.lv-more { display: block; margin: 8px auto; }
.lv-today { position: fixed; right: 16px; bottom: calc(var(--reserve) + 14px); z-index: 18; border: 0; border-radius: 999px; padding: 9px 16px; background: var(--accent2); color: #fff; font-weight: 600; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.4); }

/* ============ вкладка «Задачи»: один лист, каждая строка — задача ============ */
.tasks-page .tk-head { margin-bottom: 8px; }
.tk-title { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.15; }
.tk-title b { font-size: 1.5em; color: var(--text); }
.tk-title small { font-size: 0.74em; color: var(--muted); }
.cal-btn.wide { width: auto; white-space: nowrap; padding: 0 10px; font-size: 0.76em; font-weight: 600; color: var(--accent); }
.tk-page .pg-lines { border-radius: 14px; min-height: calc(var(--lh) * 24); }
.ln-when { flex: 0 0 auto; font-style: normal; font-size: 0.72em; line-height: 1.5; padding: 0 6px; border-radius: 6px; color: var(--cal-muted); background: color-mix(in srgb, var(--cal-ink) 8%, transparent); }
.ln-when.today { color: var(--accent2); }
.ln-when.late { color: var(--cal-red); }
.ln.done .ln-when { opacity: 0.5; }
.tab-standby svg, .tab-tasks svg { stroke-width: 1.8; }

/* ============ большой переключатель «Учёт времени» ============ */
.mode-card { padding-top: 10px; }
.big-toggle { display: flex; align-items: center; gap: 12px; width: 100%; border: 0; background: var(--panel-2); color: var(--text); border-radius: 16px; padding: 14px 14px 14px 16px; text-align: left; }
.bt-text { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.bt-text b { font-size: 1.12em; }
.bt-text small { color: var(--muted); font-size: 0.78em; }
.bt-switch { flex: 0 0 auto; width: 58px; height: 34px; border-radius: 34px; background: color-mix(in srgb, var(--text) 18%, transparent); position: relative; transition: background 0.2s; }
.bt-switch i { position: absolute; top: 3px; left: 3px; width: 28px; height: 28px; border-radius: 50%; background: #fff; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3); transition: transform 0.2s; }
.big-toggle.on .bt-switch { background: #34c759; }
.big-toggle.on .bt-switch i { transform: translateX(24px); }

/* ============ аналитика «Намечено в календаре» ============ */
.src-seg { margin-bottom: 8px; }
.pl-items { display: flex; flex-direction: column; gap: 3px; margin-top: 8px; text-align: left; }
.pl-item { display: flex; gap: 8px; font-size: 0.8em; min-width: 0; }
.pl-item .gray { flex: 0 0 auto; }
.pl-item b { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-bar { margin: 6px 0 8px; }
.pl-task { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-top: 1px solid var(--line); font-size: 0.9em; }
.pl-task > span:nth-child(2) { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pl-task .ln-box { --cal-muted: var(--muted); width: 20px; height: 20px; }

/* ============ код восстановления ============ */
.rc-code { font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: 1.35em; font-weight: 700; letter-spacing: 0.06em; text-align: center; padding: 16px 8px; margin: 6px 0 12px; border-radius: 14px; background: var(--panel-2); user-select: all; -webkit-user-select: all; }
.set .link.small, .card > .link.small { display: block; margin: 8px auto 0; font-size: 0.82em; }
.help h3 { font-size: 0.95em; margin: 14px 0 6px; }
.help ol { margin: 0 0 6px; padding-left: 20px; font-size: 0.86em; line-height: 1.45; }
.help p { font-size: 0.84em; line-height: 1.45; margin: 4px 0 8px; }
.help code { font-size: 0.92em; background: var(--panel-2); padding: 1px 5px; border-radius: 5px; overflow-wrap: anywhere; }
.picked { display: flex; align-items: center; gap: 8px; font-size: 0.8em; color: var(--muted); margin: 6px 0 2px; }
.picked i { width: 18px; height: 18px; border-radius: 6px; flex: 0 0 auto; box-shadow: inset 0 0 0 1px rgba(127, 127, 127, 0.4); }
.picked b { color: var(--text); font-family: ui-monospace, Menlo, monospace; font-weight: 600; }

.save-btn { margin-left: auto; }
.save-note { font-size: 0.74em; color: var(--muted); margin: -2px 2px 10px; line-height: 1.4; }
.kw-names { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0 10px; }
.kw-n { display: inline-flex; align-items: center; gap: 2px; font-size: 0.78em; background: var(--panel-2); border-radius: 9px; padding: 4px 9px; }
.kw-n small { color: var(--muted); margin-left: 4px; }
/* плашка задач — под закрепом, как второе закреплённое в Telegram */
.pin-banner + .task-banner { margin-top: -6px; }
.task-banner .pin-bars i { background: color-mix(in srgb, var(--up) 30%, transparent); }
.task-banner .pin-bars i.on { background: var(--up); }
.pin-cap.task { color: var(--up); }
.task-banner .task-check { font-size: 1.15em; color: var(--muted); }
.cal-daymodal .task-banner.pb-grid { margin: 0 0 4px; }
.fit .task-banner { flex: 0 0 auto; }
/* лист задач — до низа экрана */
.view-tasks { padding-bottom: 6px; }
.tasks-page { display: flex; flex-direction: column; min-height: 100%; }
.tasks-page .tk-page { flex: 1 1 auto; display: flex; flex-direction: column; }
.tasks-page .tk-page .pg-lines { flex: 1 1 auto; min-height: 0; }
.tk-hint { font-size: 0.64em; margin: 6px 6px 0; line-height: 1.35; }
.tk-n { font-style: normal; background: var(--panel-2); color: var(--muted); border-radius: 6px; padding: 0 5px; margin-left: 3px; font-size: 0.9em; }
.arc-list { display: flex; flex-direction: column; }
.arc-row { display: flex; align-items: center; gap: 10px; padding: 9px 2px; border-top: 1px solid var(--line); }
.arc-row:first-child { border-top: 0; }
.arc-row .ln-box { --cal-muted: var(--muted); width: 20px; height: 20px; background: var(--up); border-color: var(--up); color: #fff; }
.arc-text { flex: 1; min-width: 0; font-size: 0.9em; text-decoration: line-through; color: var(--muted); overflow-wrap: anywhere; }
.arc-text .tag { text-decoration: none; }
.arc-at { flex: 0 0 auto; color: var(--gray); font-size: 0.74em; }
.wg-col, .tl-hour { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
.wg-col.slot-hold, .tl-hour.slot-hold { background: color-mix(in srgb, var(--cal-accent) 10%, transparent); transition: background 0.3s; }
/* крупные кнопки «Ожидание» и «Неделя по часам», мелкие «Вид» и ⚙ — столбиком */
.cal-btn.big { width: 46px; height: 46px; border-radius: 13px; }
.cal-btn.big svg { width: 23px; height: 23px; }
.btn-stack { display: inline-flex; flex-direction: column; gap: 4px; flex: 0 0 auto; }
.btn-stack .cal-btn { width: 34px; height: 21px; border-radius: 7px; }
.btn-stack .cal-btn svg { width: 14px; height: 14px; }
.dm-head .cal-btn.big { width: 42px; height: 42px; }
.dm-head .today-badge { width: 42px; height: 42px; }
.dm-head .btn-stack .cal-btn { height: 19px; }
.cal-daymodal .dm-head { position: relative; }
.cal-daymodal .pop-menu { right: 0; top: 50px; }
/* «какая сфера?» — плашка над нижним меню, одно нажатие */
.sphere-ask { position: fixed; left: 10px; right: 10px; bottom: calc(var(--reserve) + 10px); z-index: 25; background: var(--panel); border: 1px solid var(--line); border-radius: 16px; padding: 8px 8px 9px 12px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45); max-width: 560px; margin: 0 auto; animation: fade 0.2s ease; }
.sphere-ask[hidden] { display: none; }
.sa-top { display: flex; align-items: center; gap: 8px; }
.sa-q { flex: 1; min-width: 0; font-size: 0.8em; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sa-x { border: 0; background: none; color: var(--muted); width: 28px; height: 28px; display: grid; place-items: center; padding: 0; }
.sa-x svg { width: 16px; height: 16px; }
.sa-chips { display: flex; gap: 6px; overflow-x: auto; margin-top: 6px; scrollbar-width: none; }
.sa-chips::-webkit-scrollbar { display: none; }
.sa-chip { flex: 0 0 auto; border: 0; border-radius: 10px; padding: 7px 11px; background: color-mix(in srgb, var(--c) 18%, var(--panel-2)); color: var(--text); font-size: 0.84em; font-weight: 600; display: inline-flex; align-items: center; }
/* событие по расписанию в режиме ожидания — тусклее, чем идущий секундомер */
.stb-card.planned { opacity: 0.62; border-style: dashed; }
.stb-card.planned .sbc-left { font-weight: 500; }
.sbc-sched { margin-top: 6px; font-size: 0.72em; color: #8e8e93; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* история: свёрнутые недели / месяцы / годы и поиск дня */
.hist-find { position: relative; margin-left: auto; width: 32px; height: 32px; border-radius: 10px; background: var(--panel); display: inline-grid; place-items: center; color: var(--muted); flex: 0 0 auto; }
.hist-find svg { width: 16px; height: 16px; }
.hist-find input { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; }
.hist-top { gap: 8px; }
.hist-group { display: flex; align-items: center; gap: 8px; width: 100%; border: 0; border-top: 1px solid var(--line); background: none; color: var(--text); padding: 12px 4px; text-align: left; font-size: 0.92em; }
.hist-group .muted { margin-left: auto; font-size: 0.85em; }
.hg-arrow { display: inline-grid; transition: transform 0.15s; color: var(--muted); }
.hg-arrow svg { width: 14px; height: 14px; }
.hist-group.open .hg-arrow { transform: rotate(90deg); }
.hist-days { padding-left: 8px; border-left: 2px solid var(--line); margin-left: 6px; }
.day-head.focus { background: color-mix(in srgb, var(--accent) 14%, transparent); border-radius: 10px; }
.help ul { margin: 0 0 6px; padding-left: 20px; font-size: 0.86em; line-height: 1.45; }
/* смена закрепа/задачи — сдвиг как в Telegram: старый уезжает вверх, новый въезжает снизу */
.pin-banner.swap .pin-main > span { animation: pinSwap 0.38s cubic-bezier(0.2, 0.8, 0.2, 1); }
.pin-banner.swap .pin-bars i.on { animation: pinBar 0.38s ease; }
@keyframes pinSwap { 0% { transform: translateY(85%); opacity: 0; } 100% { transform: none; opacity: 1; } }
@keyframes pinBar { 0% { transform: scaleY(0.4); } 100% { transform: none; } }
.pin-main { overflow: hidden; }
/* полоска аналитики: прошлые дни (тусклее) + сегодня (ярко, справа) */
.bar i.prev { border-radius: 0; }
.bar i.now { border-radius: 0 6px 6px 0; }
/* переключатель отставания в аналитике — всегда внизу над меню, крупнее */
.lag-float { padding: 4px; }
.lag-float button { height: 38px; padding: 0 12px; font-size: 0.84em; }
.view-an { padding-bottom: 64px; }
/* важные / фоновые сферы в аналитике */
.an-row.bg { opacity: 0.72; }
.an-row.bg .down, .an-row.bg .up { color: var(--muted) !important; }
.tag.bgtag { background: transparent; border: 1px solid var(--line); color: var(--gray); }
.an-sec { display: flex; align-items: center; gap: 8px; justify-content: space-between; font-size: 0.74em; color: var(--muted); padding: 12px 2px 4px; border-top: 1px solid var(--line); margin-top: 4px; }
.an-sec .link { font-size: 1em; }
.sum-imp { margin-top: 6px; font-size: 0.92em; }

/* ============ кнопка «?» и обзор приложения ============ */
.help-btn { flex: 0 0 auto; width: 26px; height: 26px; border-radius: 8px; border: 1px solid var(--line); background: var(--panel); color: var(--muted); font-weight: 700; font-size: 0.82em; display: inline-grid; place-items: center; padding: 0; }
.help-wide { margin-bottom: 10px; color: var(--muted); }
.tour { position: fixed; inset: 0; z-index: 80; background: rgba(0, 0, 0, 0.72); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); display: flex; align-items: center; justify-content: center; padding: calc(env(safe-area-inset-top) + 10px) 12px calc(env(safe-area-inset-bottom) + 10px); animation: fade 0.2s ease; }
.tour[hidden] { display: none; }
.tour-card { width: 100%; max-width: 440px; max-height: 100%; display: flex; flex-direction: column; background: var(--panel); border: 1px solid var(--line); border-radius: 24px; padding: 12px 14px 14px; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6); }
.tour-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.tour-step { font-size: 0.74em; color: var(--muted); font-variant-numeric: tabular-nums; }
.tour-skip { border: 0; background: none; color: var(--muted); font-size: 0.84em; padding: 4px 2px; }
.tour-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; align-items: center; }
.tour-shot { width: 100%; display: flex; justify-content: center; margin: 2px 0 10px; }
.tour-shot img { display: block; max-width: 72%; max-height: 46vh; border-radius: 18px; border: 1px solid var(--line); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45); object-fit: contain; background: #000; }
.tour-done { width: 74px; height: 74px; border-radius: 22px; background: var(--accent); color: var(--on-accent); display: grid; place-items: center; font-size: 2.2em; font-weight: 800; margin: 18px 0 14px; }
.tour-title { font-size: 1.12em; margin: 0 0 6px; text-align: center; }
.tour-lines { margin: 0; padding: 0 2px 0 18px; font-size: 0.86em; line-height: 1.42; color: var(--text); align-self: stretch; }
.tour-lines li { margin: 4px 0; }
.tour-lines b { color: var(--accent); font-weight: 650; }
.tour-dots { display: flex; justify-content: center; gap: 6px; margin: 10px 0 10px; }
.tour-dots i { width: 7px; height: 7px; border-radius: 4px; background: var(--line); cursor: pointer; transition: width 0.2s; }
.tour-dots i.on { width: 20px; background: var(--accent); }
.tour-nav { display: flex; gap: 8px; }
body.tour-open .tabs { pointer-events: none; }

.ln-when.cal::before { content: "📅 "; font-size: 0.9em; } /* задача из календаря на листе «Задачи» */
/* «Список всех записей»: верхнее меню всегда видно, даже если пролистали далеко вниз */
.cal-listpage > .cal-head { position: sticky; top: calc(-8px - env(safe-area-inset-top)); /* липкость считается от отступа прокрутки — сдвигаем к самому верху экрана */ z-index: 12; margin: calc(-8px - env(safe-area-inset-top)) -12px 6px; padding: calc(env(safe-area-inset-top) + 8px) 12px 8px; background: color-mix(in srgb, var(--cal-bg) 94%, transparent); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.cal-listpage .lv-date { top: calc(var(--lv-head, 0px) - 8px - env(safe-area-inset-top)); }
/* режим ожидания: таймер сферы идёт во время события той же сферы — одна карточка */
.sbc-run { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-top: 8px; font-size: 0.82em; color: var(--muted); }
.sbc-run b[data-sess] { font-size: 1.25em; color: var(--text); font-variant-numeric: tabular-nums; }
.sbc-relabel { position: absolute; right: 12px; bottom: 8px; border: 0; background: none; color: var(--accent2); font: inherit; font-size: 0.72em; padding: 4px 2px; }
.stb-card.sess { position: relative; padding-bottom: 24px; }
/* название таймера: своё или событие календаря (сфера — мелко рядом), тап — сменить */
.hl-btn { display: inline-flex; align-items: center; gap: 6px; border: 0; background: none; color: inherit; font: inherit; padding: 2px 4px; max-width: 100%; min-width: 0; }
.hl-btn b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hl-sp { font-size: 0.72em; color: var(--muted); white-space: nowrap; }
.hl-pen svg { width: 13px; height: 13px; opacity: 0.45; }
/* «📅 сейчас» — события календаря кнопками */
.ev-now { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 2px 0 6px; align-items: center; }
.ev-now::-webkit-scrollbar { display: none; }
.ev-cap { flex: 0 0 auto; font-size: 0.72em; color: var(--muted); }
.ev-btn { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; max-width: 78%; border: 1px solid color-mix(in srgb, var(--c) 55%, transparent); background: color-mix(in srgb, var(--c) 16%, var(--panel)); color: var(--text); border-radius: 999px; padding: 6px 12px; font: inherit; font-size: 0.86em; }
.ev-btn span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ev-btn small { color: var(--muted); font-size: 0.82em; white-space: nowrap; }
.ev-btn.on { background: var(--c); color: #fff; border-color: var(--c); }
.ev-btn.on small { color: rgba(255, 255, 255, 0.85); }
.lbl-chips { margin: 6px 0 8px; }
.lbl-chips .chip.dim { opacity: 0.6; }
/* «Задачи» на пол-экрана снизу календаря — тот же лист; удержать строку — перетащить на день / время */
.tk-dock { position: fixed; left: 6px; right: 6px; bottom: calc(var(--reserve) + 4px); z-index: 30; height: var(--dock-h, 34vh); max-height: 34vh; display: flex; flex-direction: column; background: var(--cal-bg, var(--bg)); border: 1px solid var(--line); border-radius: 18px; padding: 8px 8px 6px; box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.45); }
.tk-dock.kb { height: auto; }
.tkd-head { display: flex; align-items: center; gap: 8px; margin: 0 4px 6px; flex: 0 0 auto; }
.tkd-head b { font-size: 0.95em; }
.tkd-head small { flex: 1; min-width: 0; color: var(--muted); font-size: 0.7em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tkd-x { border: 0; background: var(--panel); color: var(--muted); width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; }
.tkd-x svg { width: 16px; height: 16px; }
.tkd-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; border-radius: 14px; }
.tk-mini .pg-lines { border-radius: 14px; min-height: 100%; }
.tk-dock .ln:not(.editing) { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.tk-dock .ln.lifted { opacity: 0.35; }
.task-check.tk-open { font-size: 1em; }
.task-check.tk-open.on { color: var(--accent2); }
.tkd-ghost { position: fixed; left: 0; top: 0; z-index: 80; pointer-events: none; max-width: 70vw; padding: 8px 12px; border-radius: 10px; background: var(--accent2); color: #fff; font-size: 0.86em; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45); }
.tkd-ghost::after { content: attr(data-when); display: block; font-size: 0.78em; font-weight: 500; opacity: 0.85; }
.drop-on { outline: 2px solid var(--accent2); outline-offset: -2px; background-color: color-mix(in srgb, var(--accent2) 14%, transparent) !important; }
/* новая запись прямо в сетке по часам */
.g-new { position: absolute; z-index: 9; background: var(--cal-page); border: 2px solid var(--accent2); border-radius: 10px; padding: 4px 6px 6px; box-shadow: 0 8px 22px rgba(0, 0, 0, 0.4); display: flex; flex-direction: column; gap: 2px; }
.g-new small { font-size: 0.7em; font-weight: 700; color: var(--accent2); }
.g-new textarea { border: 0 !important; background: none !important; padding: 0 !important; height: auto; min-height: 2.6em; resize: none; color: var(--cal-ink) !important; font-size: 0.9em; line-height: 1.3; outline: none; border-radius: 0 !important; }
.g-new-mark { position: absolute; z-index: 8; border-radius: 6px; background: color-mix(in srgb, var(--accent2) 30%, transparent); pointer-events: none; }
body[data-dock="1"] .view { bottom: calc(var(--reserve) + var(--dock-h, 34vh) + 10px); }
.cal.tk-dock, .cal.cal-light.tk-dock { margin: 0; padding: 8px 8px 6px; min-height: 0; background: var(--cal-bg, var(--bg)); }
.tk-dock .tkd-head b { color: var(--cal-ink); }
/* заголовок-кнопка месяца ▾ и календарик месяца сверху (как в Google) */
button.cal-tt { border: 0; background: none; color: var(--cal-ink, var(--text)); font: inherit; padding: 0; text-align: center; }
button.dm-title { border: 0; background: none; font: inherit; font-weight: 700; text-align: left; padding: 0; }
.mp-caret { font-style: normal; font-size: 0.8em; display: inline-block; transition: transform 0.2s; color: var(--muted); }
.mp-caret.up { transform: rotate(180deg); }
.mpick { background: var(--cal-page); border-radius: 16px; padding: 6px 6px 8px; margin: 0 0 8px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3); animation: mpdown 0.18s ease; }
@keyframes mpdown { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
.mp-head { display: flex; align-items: center; justify-content: space-between; padding: 0 2px 4px; }
.mp-head b { font-size: 0.92em; color: var(--cal-ink); }
.mp-wd, .mp-grid { display: grid; grid-template-columns: repeat(7, 1fr); }
.mp-wd span { text-align: center; font-size: 0.66em; color: var(--cal-muted); padding: 2px 0; }
.mp-day { border: 0; background: none; color: var(--cal-ink); font: inherit; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 4px 0 3px; border-radius: 10px; min-height: 40px; }
.mp-day b { font-size: 0.88em; font-weight: 600; width: 28px; height: 24px; display: grid; place-items: center; border-radius: 999px; }
.mp-day.out { opacity: 0.35; }
.mp-day.wk { background: color-mix(in srgb, var(--cal-accent) 12%, transparent); }
.mp-day.today b { background: var(--cal-red); color: #fff; }
.mp-day.sel b { outline: 2px solid var(--cal-accent); }
.mp-dots { display: flex; gap: 2px; height: 5px; align-items: center; }
.mp-dots i { width: 5px; height: 5px; border-radius: 50%; }
.mp-dots em { font-style: normal; font-size: 0.6em; line-height: 5px; color: var(--cal-muted); }
/* меню календаря слева */
.drawer-back { position: fixed; inset: 0; z-index: 70; background: rgba(0, 0, 0, 0.45); animation: fadein 0.15s ease; }
@keyframes fadein { from { opacity: 0; } to { opacity: 1; } }
.cal.cal-drawer, .cal.cal-light.cal-drawer { position: fixed; left: 0; top: 0; bottom: 0; z-index: 71; width: min(82vw, 320px); overflow-y: auto; background: var(--cal-bg, var(--bg)); padding: calc(env(safe-area-inset-top) + 14px) 10px calc(env(safe-area-inset-bottom) + 14px); border-radius: 0 18px 18px 0; box-shadow: 10px 0 30px rgba(0, 0, 0, 0.45); animation: drawin 0.2s ease; margin: 0; min-height: 0; }
@keyframes drawin { from { transform: translateX(-100%); } to { transform: none; } }
.dw-title { font-size: 1.25em; font-weight: 700; color: var(--cal-ink); padding: 4px 12px 12px; }
.dw-row { display: flex; align-items: center; gap: 14px; width: 100%; border: 0; background: none; color: var(--cal-ink); font: inherit; font-size: 0.95em; padding: 11px 12px; border-radius: 999px; text-align: left; }
.dw-row svg { width: 20px; height: 20px; flex: 0 0 auto; color: var(--cal-muted); }
.dw-row.on { background: color-mix(in srgb, var(--cal-accent) 22%, transparent); color: var(--cal-accent); font-weight: 600; }
.dw-row.on svg { color: var(--cal-accent); }
.dw-row.add { color: var(--cal-accent); }
.dw-q { width: 20px; text-align: center; color: var(--cal-muted); }
.dw-sep { height: 1px; background: var(--cal-line); margin: 8px 6px; }
.dw-cap { font-size: 0.7em; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--cal-muted); padding: 6px 12px 4px; }
.dw-cal { display: flex; align-items: center; gap: 12px; padding: 4px 4px 4px 12px; }
.dw-check { width: 22px; height: 22px; border-radius: 6px; border: 2px solid var(--c); background: none; display: grid; place-items: center; padding: 0; color: #fff; flex: 0 0 auto; }
.dw-check.on { background: var(--c); }
.dw-check svg { width: 14px; height: 14px; stroke-width: 3; }
.dw-cname { flex: 1; min-width: 0; border: 0; background: none; color: var(--cal-ink); font: inherit; font-size: 0.95em; text-align: left; padding: 8px 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dw-cname small { color: var(--cal-muted); font-size: 0.78em; }
.dw-edit { border: 0; background: none; color: var(--cal-muted); padding: 6px; display: grid; place-items: center; }
.dw-edit svg { width: 15px; height: 15px; }
/* карточка записи — минимально: крупное главное, редкое — в «Доп. настройки», «Сохранить» всегда внизу */
.ce { display: flex; flex-direction: column; gap: 10px; }
.ce-text { width: 100%; min-height: 48px; height: auto; resize: none; overflow: hidden; font-size: 1.08em !important; line-height: 1.35; padding: 11px 12px !important; border-radius: 14px !important; }
.ce-time { display: flex; align-items: center; gap: 8px; }
.ce-time label { flex: 1; display: flex; align-items: center; gap: 8px; background: var(--bg); border: 1px solid var(--line); border-radius: 14px; padding: 0 12px; }
.ce-time label span { color: var(--muted); font-size: 0.85em; }
.ce-time input { border: 0 !important; background: none !important; padding: 0 !important; height: 48px; font-size: 1.15em; font-weight: 600; min-width: 0; }
.ce-time i { color: var(--muted); font-style: normal; }
.ce-sp { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
.ce-sp::-webkit-scrollbar { display: none; }
.ce-sp .chip { flex: 0 0 auto; }
.ce-found { margin-top: -6px; }
.ce-toggles { display: flex; flex-wrap: wrap; gap: 6px; }
.ce-tg { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); background: var(--bg); color: var(--text); border-radius: 12px; padding: 9px 12px; font: inherit; font-size: 0.88em; max-width: 100%; }
.ce-tg input { width: auto; height: auto; margin: 0; accent-color: var(--accent2); }
.ce-tg.on, .ce-tg:has(input:checked) { border-color: var(--accent2); background: color-mix(in srgb, var(--accent2) 16%, var(--bg)); }
.ce-tg.open { box-shadow: 0 0 0 2px var(--accent2) inset; }
.ce-sec { background: var(--bg); border-radius: 14px; padding: 8px 10px 10px; }
.ce-sec .label:first-child { margin-top: 0; }
.ce-more { align-self: flex-start; border: 0; background: none; color: var(--accent2); font: inherit; font-size: 0.86em; padding: 2px 2px; }
.ce-foot { position: sticky; bottom: calc(-18px - var(--sb)); margin: 4px -16px calc(-18px - var(--sb)); padding: 10px 16px calc(14px + var(--sb)); background: var(--panel); display: flex; gap: 8px; z-index: 2; box-shadow: 0 -8px 16px var(--panel); }
.ce-foot .ce-save { height: 50px; font-size: 1.05em; }
/* списки задач: название — кнопка, вкладки-списки под шапкой (листаются вбок) */
button.tk-title { border: 0; background: none; color: inherit; font: inherit; text-align: left; padding: 0; }
.tk-title b { display: inline-flex; align-items: center; gap: 6px; }
.tk-title b .dot { width: 0.5em; height: 0.5em; }
.tl-tabs { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; margin: -2px 0 8px; }
.tl-tabs::-webkit-scrollbar { display: none; }
.tl-tab { flex: 0 0 auto; border: 1px solid var(--line); background: var(--panel); color: var(--muted); border-radius: 999px; padding: 6px 13px; font: inherit; font-size: 0.82em; font-weight: 600; }
.tl-tab.on { color: #fff; background: var(--c); border-color: var(--c); }
.tl-tab.add { color: var(--accent2); }
.tkd-list-name { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
/* строка задач над днями сетки (как в Google) */
.wg-allday { display: grid; gap: 2px; margin: 6px 3px 0 30px; padding-bottom: 4px; }
.ad-day { min-width: 0; display: flex; flex-direction: column; gap: 2px; padding: 0 1px; }
.ad-day.today .ad-lbl b { color: var(--cal-red); }
.ad-lbl { border: 0; background: none; color: var(--cal-ink); display: flex; align-items: baseline; justify-content: center; gap: 4px; padding: 2px 0 4px; font: inherit; }
.ad-lbl small { font-size: 0.66em; color: var(--cal-muted); }
.ad-lbl b { font-size: 1.05em; }
.ad-chip { display: flex; align-items: center; gap: 3px; min-width: 0; padding: 2px 4px; border-radius: 6px; background: color-mix(in srgb, var(--c) 30%, var(--cal-page)); border-left: 3px solid var(--c); font-size: 0.66em; line-height: 1.3; color: var(--cal-ink); -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; cursor: grab; }
.ad-chip span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ad-chip .ln-box { width: 12px; height: 12px; border-radius: 3px; flex: 0 0 auto; }
.ad-chip .ln-box svg { width: 9px; height: 9px; }
.ad-chip.done span { text-decoration: line-through; opacity: 0.55; }
.ad-more { border: 0; background: none; color: var(--cal-accent); font: inherit; font-size: 0.66em; font-weight: 600; padding: 1px 4px; text-align: left; }
/* перетаскивание: свободные окна, куда дело помещается целиком; рамка будущего места; край — соседняя неделя */
.free-slot { position: absolute; left: 1px; right: 1px; z-index: 1; pointer-events: none; border-radius: 6px; background: color-mix(in srgb, #30d158 16%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, #30d158 45%, transparent); }
.free-slot.tl { left: 44px; right: 4px; }
.dg-prev { position: absolute; left: 1px; right: 1px; z-index: 6; pointer-events: none; border-radius: 6px; border: 2px dashed #30d158; background: color-mix(in srgb, #30d158 22%, transparent); }
.dg-prev.tl { left: 44px; right: 4px; }
.dg-prev.bad { border-color: #ff453a; background: color-mix(in srgb, #ff453a 20%, transparent); }
.pg.fits .pg-lines, .ad-day.fits, .ds-day.fits { box-shadow: inset 0 0 0 2px color-mix(in srgb, #30d158 55%, transparent); }
.tl-block.lifted, .ad-chip.lifted { opacity: 0.35; }
body[data-dg-edge="l"]::before, body[data-dg-edge="r"]::before { content: ""; position: fixed; top: 0; bottom: 0; width: 28px; z-index: 79; pointer-events: none; background: linear-gradient(to right, color-mix(in srgb, var(--accent2) 45%, transparent), transparent); }
body[data-dg-edge="l"]::before { left: 0; }
body[data-dg-edge="r"]::before { right: 0; transform: scaleX(-1); }
/* нижнее меню — как в «Часах» iOS: парящая стеклянная капсула, выбранная вкладка — светлая «таблетка» */
:root { --tabs-h: 62px; --reserve: calc(var(--tabs-h) + var(--sb) + 10px); }
.tabs {
  left: 12px; right: 12px; bottom: calc(var(--sb) + 4px); height: var(--tabs-h);
  max-width: 560px; margin: 0 auto; padding: 5px; gap: 2px;
  border-radius: 999px; border: 1px solid color-mix(in srgb, var(--text) 14%, transparent); border-top-color: color-mix(in srgb, var(--text) 22%, transparent);
  background: color-mix(in srgb, var(--panel) 70%, transparent);
  -webkit-backdrop-filter: blur(26px) saturate(1.8); backdrop-filter: blur(26px) saturate(1.8);
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.38), inset 0 1px 0 color-mix(in srgb, #fff 10%, transparent);
}
.tab { color: var(--text); border-radius: 999px; font-size: 0.66em; font-weight: 600; gap: 2px; transition: background 0.2s, color 0.2s; }
.tab svg { width: 22px; height: 22px; }
.tab.on { color: var(--accent2); background: color-mix(in srgb, var(--text) 13%, transparent); box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 18%, transparent), 0 2px 10px rgba(0, 0, 0, 0.18); }
.tab-dot { box-shadow: none; }
@media (orientation: landscape) and (max-height: 560px) { :root { --tabs-h: 46px; } }
.view:has(.cal-drawer) { z-index: 65; } /* меню календаря — поверх нижнего меню */
.cal.cal-drawer { padding-bottom: calc(env(safe-area-inset-bottom) + 24px); }
/* заголовок месяца / дней: открыт календарик — подсвечен светло-серым (без стрелочки) */
.dm-nav { flex: 1; min-width: 0; display: flex; align-items: center; gap: 2px; }
.dm-nav .dm-title { flex: 1; min-width: 0; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dm-title, button.cal-tt { border-radius: 12px; padding: 4px 8px; transition: background 0.15s; }
.dm-title.open, button.cal-tt.open { background: color-mix(in srgb, var(--cal-ink, var(--text)) 16%, transparent); }
.mp-caret { display: none; }
.dm-nav .cal-arrow svg { width: 18px; height: 18px; }
/* перетаскивание: место для дела — серым */
.free-slot { background: color-mix(in srgb, var(--cal-ink, #fff) 9%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cal-ink, #fff) 22%, transparent); }
.dg-prev { border-color: color-mix(in srgb, var(--cal-ink, #fff) 60%, transparent); background: color-mix(in srgb, var(--cal-ink, #fff) 18%, transparent); }
.pg.fits .pg-lines, .ad-day.fits, .ds-day.fits { box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--cal-ink, #fff) 28%, transparent); }
/* в работе подсказки не нужны — место под дело */
.cal-hint, .tk-hint { display: none !important; }
/* мобильная версия: минимум кнопок — только основное */
body[data-ui="min"] .dm-filters .fchip,
body[data-ui="min"] .cal-now,
body[data-ui="min"] .dm-month,
body[data-ui="min"] .clock-sb,
body[data-ui="min"] .clock-edit,
body[data-ui="min"] .sec-cap,
body[data-ui="min"] .mini-stats i,
body[data-ui="min"] .an .src-seg,
body[data-ui="min"] .an .sort-line,
body[data-ui="min"] .an .chart-sub,
body[data-ui="min"] .an .summary .sum-sub.muted.small,
body[data-ui="min"] .an .hint.small,
body[data-ui="min"] .tk-head .cal-btn[data-action="standby"],
body[data-ui="min"] .ev-cap,
body[data-ui="min"] .tkd-head small,
body[data-ui="min"] .lbl-chips + .hint { display: none !important; }
body[data-ui="min"] .dm-filters { justify-content: flex-end; }
.wg-allday .ad-lbl { flex-direction: row; align-items: baseline; justify-content: center; gap: 4px; line-height: 1.1; padding: 1px 0 2px; }
/* v7: сетка по часам — чёрный фон, даты прямо над сеткой, масштаб — капсулой снизу и двумя пальцами */
.cal-daymodal { background: var(--cal-bg); }
.cal-daymodal .dm-top { background: color-mix(in srgb, var(--cal-bg) 96%, transparent); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.cal-daymodal .dm-page .pg-lines { background-color: var(--cal-page); border-radius: 14px; }
.cal-daymodal.is-main .dm-top { padding-bottom: 0; }
.cal-daymodal.is-main .pin-banner.pb-grid { margin: 4px 0 2px; }
.cal-daymodal.is-main .pin-banner.pb-grid .pin-main { padding-top: 5px; padding-bottom: 5px; }
.cal-daymodal .wg-allday { margin: 4px 3px 0 30px; padding-bottom: 4px; }
.cal-daymodal.is-main .dm-body { padding-top: 0; }
.wg, .timeline { touch-action: pan-y; }
.zoom-float { position: fixed; right: 14px; bottom: calc(var(--reserve) + 10px); z-index: 19; display: flex; padding: 3px; gap: 2px; border-radius: 999px; background: color-mix(in srgb, var(--panel) 75%, transparent); border: 1px solid color-mix(in srgb, var(--text) 14%, transparent); -webkit-backdrop-filter: blur(20px) saturate(1.6); backdrop-filter: blur(20px) saturate(1.6); box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35); }
.zoom-float .zoom { display: flex; gap: 2px; margin: 0; }
.zoom-float .zbtn { width: 40px; height: 36px; border-radius: 999px; border: 0; background: none; color: var(--text); font-size: 1.15em; font-weight: 600; }
.zoom-float .zbtn:disabled { opacity: 0.3; }
body[data-dock="1"] .zoom-float { display: none; }
/* свободное время при перетаскивании: дата — серым фоном, без рамки */
.pg.fits .pg-lines, .ad-day.fits, .ds-day.fits { box-shadow: none; background-color: color-mix(in srgb, var(--cal-ink, #fff) 10%, transparent) !important; border-radius: 10px; }
.pg.fits .pg-lines { background-color: var(--cal-page) !important; }
.pg.fits .pg-tab { background: color-mix(in srgb, var(--cal-ink, #fff) 26%, var(--cal-tab)) !important; }

/* ===== v7.0 ✨ ИИ ===== */
.sa-chip.ai { background: color-mix(in srgb, var(--c) 34%, var(--panel-2)); box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--c) 70%, transparent); }
.sa-chip .dot { margin-right: 5px; }
.ln-dot.ai { box-shadow: 0 0 0 1.5px var(--cal-bg, #000), 0 0 0 3px rgba(245, 196, 81, 0.85); }
.pp-ai { color: #f5c451; font-weight: 600; }
.pp-col { flex-direction: column; align-items: stretch; padding: 10px 12px; }
.pp-col > .btn { align-self: flex-start; }
.pp-alt { display: flex; gap: 6px; align-items: center; margin-top: 6px; overflow-x: auto; scrollbar-width: none; }
.pp-alt::-webkit-scrollbar { display: none; }
.pp-alt > span { flex: 0 0 auto; }
.pp-col .pp-alt { flex-wrap: wrap; overflow: visible; }
.sa-chip.ai { gap: 4px; }
.sa-chip.ai .dot { margin-right: 1px; }
.phrase-preview:not(:empty) { margin-bottom: 12px; }
.ai-status { font-size: 0.86em; margin: 8px 0 0; padding: 8px 10px; border-radius: 10px; background: var(--panel-2); }
.ai-status.ok { color: #6fcf97; }
.ai-status.warn { color: #f2a65a; }
.ce-found { margin-top: 4px; }

/* ===== v7.1: текст на кнопках ===== */
.btn-sample { display: flex; gap: 6px; flex-wrap: wrap; margin: 2px 0 6px; }
.btn-sample span { border-radius: 10px; padding: 6px 10px; font-weight: 700; font-size: 0.86em; }
.picked .pk-btn { display: inline-grid; place-items: center; width: 40px; height: 28px; border-radius: 8px; font-style: normal; font-weight: 700; font-size: 0.85em; flex: 0 0 auto; }
.pk-note { display: block; color: var(--muted); font-size: 0.85em; }
.ic { display: inline-flex; vertical-align: -0.16em; line-height: 1; }
.ic svg { width: 1.1em; height: 1.1em; stroke-width: 2.1; }
.ic.gold { color: #f5c451; }
.ic.dim { opacity: 0.7; }

/* ===== v7.1: подсказки ===== */
.tip { display: flex; align-items: flex-start; gap: 8px; margin: 8px 0; padding: 9px 8px 9px 11px; border-radius: 12px; background: color-mix(in srgb, var(--accent2, #0a84ff) 13%, var(--panel)); color: var(--text); font-size: 0.84em; line-height: 1.35; }
.tip-ic svg { width: 17px; height: 17px; color: var(--accent2, #0a84ff); margin-top: 1px; }
.tip-t { flex: 1; }
.tip-x { border: 0; background: none; color: var(--muted); padding: 0 2px; display: grid; place-items: center; }
.tip-x svg { width: 16px; height: 16px; }

/* ===== v7.1: Анализ — три кнопки-картинки, короткая сводка, «Интересное» ===== */
.pbar { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin: 2px 0 10px; }
.pb-group { display: flex; gap: 4px; background: var(--panel); border-radius: 14px; padding: 3px; }
.pb { border: 0; background: none; color: var(--muted); width: 48px; height: 38px; border-radius: 11px; display: grid; place-items: center; padding: 0; }
.pb svg { width: 23px; height: 23px; stroke-width: 1.8; }
.pb.on { background: var(--panel-2); color: var(--text); }
.pb.on.soft { color: #f5c451; }
.pb.num b { font-size: 0.82em; border: 1.6px dashed currentColor; border-radius: 6px; padding: 1px 4px; min-width: 22px; }
.summary.s2 { padding: 14px 16px 12px; }
.sum-nums { display: flex; align-items: baseline; gap: 18px; flex-wrap: wrap; }
.sn { display: flex; flex-direction: column; }
.sn b { font-size: 2.1em; font-weight: 700; letter-spacing: -0.02em; line-height: 1.05; font-variant-numeric: tabular-nums; }
.sn small { font-size: 0.74em; color: var(--muted); margin-top: 2px; display: inline-flex; align-items: center; gap: 3px; }
.sn.imp b { color: var(--muted); }
.sum-trend { margin-top: 8px; font-size: 0.8em; display: flex; gap: 6px; align-items: center; }
.sum-trend .pct { font-weight: 600; }
.hc-left { font-size: 0.62em; color: var(--down); font-variant-numeric: tabular-nums; white-space: nowrap; height: 13px; line-height: 13px; }
.hc.done .hc-left { color: var(--up); }
.hc-left .ic svg { width: 12px; height: 12px; stroke-width: 3; }
.an-gap { height: 1px; background: var(--line); margin: 6px 2px; }
.insights .chart-title { display: flex; align-items: center; gap: 6px; }
.ins-re { margin-left: auto; }
.facts { margin: 4px 0 10px; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.facts li { position: relative; padding-left: 14px; font-size: 0.9em; line-height: 1.35; }
.facts li::before { content: ""; position: absolute; left: 2px; top: 0.55em; width: 5px; height: 5px; border-radius: 50%; background: var(--accent2, #0a84ff); }
.cmp-back { margin: 0 0 10px; display: inline-flex; align-items: center; gap: 4px; }
.cmp-back svg { width: 16px; height: 16px; }
.lag-float .ic svg { width: 15px; height: 15px; }
.tip.float { position: fixed; left: 14px; right: 14px; bottom: calc(var(--reserve) + 62px); z-index: 40; margin: 0; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35); background: color-mix(in srgb, var(--accent2, #0a84ff) 16%, var(--panel)); }
/* иконки вместо смайликов — размеры в местах, где раньше стоял символ */
.big-emoji svg { width: 56px; height: 56px; stroke-width: 1.6; }
.task-check { display: grid; place-items: center; }
.task-check svg { width: 21px; height: 21px; }
.sg.sym { display: inline-flex; align-items: center; }
.sg.sym svg { width: 16px; height: 16px; }
.rec-ico .ic svg, .ln-bell .ic svg { width: 0.95em; height: 0.95em; }
.mode-float .ic svg { width: 15px; height: 15px; }
.chip .ic svg { width: 14px; height: 14px; }
.ce-btns .btn svg, .btn .ic svg { width: 1.05em; height: 1.05em; }

/* ===== v7.2: компактнее — больше места под календарь на маленьком телефоне ===== */
.cal-daymodal.is-main .dm-top { padding-top: calc(env(safe-area-inset-top) + 4px); padding-left: 10px; padding-right: 10px; }
.cal-daymodal.is-main .dm-head { gap: 6px; }
.cal-daymodal.is-main .dm-head .cal-btn.big { width: 38px; height: 38px; border-radius: 11px; }
.cal-daymodal.is-main .dm-head .cal-btn.big svg { width: 20px; height: 20px; }
.cal-daymodal.is-main .dm-head .today-badge { width: 38px; height: 38px; border-radius: 11px; }
.cal-daymodal.is-main .dm-head .btn-stack .cal-btn { height: 17px; width: 32px; }
.cal-daymodal.is-main .dm-title { font-size: 1.02em; }
/* закреп: одна строка, если текст влезает (значок + дата + текст), иначе — две */
.cal-daymodal .pin-banner.pb-grid { margin: 3px 0 1px; padding: 3px 8px 3px 9px; border-radius: 11px; }
.cal-daymodal.is-main .pin-banner.pb-grid .pin-main { padding: 2px 0; gap: 8px; }
.pin-banner.pb-grid .pin-main > span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.25; }
.pin-banner.pb-grid .pin-cap { display: inline; font-size: 0.72em; }
.pin-banner.pb-grid .pin-cap .ic svg { width: 12px; height: 12px; vertical-align: -1px; }
.pin-banner.pb-grid .pin-main b { display: inline; white-space: normal; font-size: 0.84em; }
.cal-daymodal.is-main .wg-allday { margin-top: 2px; padding-bottom: 3px; }
.wg-allday .ad-lbl small { font-size: 0.7em; }
.wg-allday .ad-lbl b { font-size: 1em; }
@media (max-height: 760px) {
  .cal-daymodal.is-main .dm-head .cal-btn.big, .cal-daymodal.is-main .dm-head .today-badge { width: 34px; height: 34px; }
  .cal-daymodal.is-main .dm-head .btn-stack .cal-btn { height: 15px; }
  .pin-banner.pb-grid .pin-main b { font-size: 0.8em; }
}
.chip .ic { margin-right: 4px; }
.row-entry.live.run .re-dur { color: var(--up); }

/* ===== v7.3 ===== */
.ln.rec .rec-open { display: inline-grid; place-items: center; margin: 0 6px 0 -4px; padding: 0 2px; cursor: pointer; opacity: 0.85; }
.ln.rec .ln-pill u { cursor: pointer; }
.cal-btn.wide { display: inline-flex; align-items: center; gap: 4px; }
.cal-btn.wide .ic svg { width: 15px; height: 15px; }
.cal-btn.wide .tk-n { margin-left: 1px; }
/* настройки: у вида нет верхнего отступа — шапка липнет к самому верху, а под часами iPhone — её отступ */
.view.view-set > .page.set > .page-head { top: 0; margin: 0 -12px 6px; padding: calc(env(safe-area-inset-top) + 6px) 12px 6px; }
.lbl-chips .chip small { margin-left: 6px; }
.lbl-form { margin: 6px 0 0; }
.lbl-form input { width: 100%; margin-bottom: 8px; }
.lbl-btns { display: flex; gap: 8px; }
.lbl-btns .btn { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lbl-btns .btn.primary { flex: 0 0 auto; }
/* «Добавить»: строка ввода — рядом с заголовком; при вводе растягивается на всю ширину */
.add-head { margin-bottom: 12px; }
.add-head .h1 { flex: 0 1 auto; transition: opacity 0.15s; }
.add-head .phrase { flex: 1 1 auto; min-width: 0; gap: 6px; }
.add-head .phrase input { height: 44px !important; min-width: 0; border-radius: 14px !important; font-size: 0.95em; }
.add-head .mic { width: 44px; height: 44px; border-radius: 14px; }
.add-head .mic svg { width: 20px; height: 20px; }
.add-head:focus-within .h1, .add-head:focus-within > .icon-btn, .add-head:focus-within > .sync-dot { display: none; }
.add-head + .phrase-preview:empty { display: none; }
.view-add .grid { margin-top: 4px; }
/* поиск дня: на iPhone поле даты шире значка — не даём ему залезать на соседнюю кнопку */
.hist-find { overflow: hidden; }
.hist-find input { max-width: 32px; -webkit-appearance: none; appearance: none; }
.btn.off { opacity: 0.45; }
.day-head.focus { padding-left: 10px; padding-right: 10px; margin: 0 -8px; border-top-color: transparent; }
/* Анализ: выбор периода и даты — шапкой, всегда на экране при прокрутке («Анализ» и настройки — только наверху) */
.an-sticky { position: sticky; top: -10px; z-index: 12; margin: 0 -12px 6px; padding: 6px 12px 2px; background: var(--bg); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.an-sticky::before { content: ""; position: absolute; left: 0; right: 0; bottom: 100%; height: calc(env(safe-area-inset-top) + 12px); background: inherit; -webkit-backdrop-filter: inherit; backdrop-filter: inherit; }
.an-sticky .pbar { margin-bottom: 6px; }
.an-sticky .an-nav { margin-bottom: 6px; }
.an-sticky .an-nav .icon-btn { width: 38px; height: 38px; }
.pg-more { font-style: normal; font-size: 0.72em; font-weight: 700; color: var(--cal-accent, var(--accent2)); margin-left: 6px; }

/* ===== v7.4: задачи дня висят над сеткой (не занимают отдельную строку), при прокрутке — под датами ===== */
.wg-allday.labels { padding-bottom: 2px; }
.wg-hang { position: sticky; top: var(--dmtop, 0px); z-index: 6; height: 0; }
.cal-daymodal .wg-hang .wg-allday.hang { margin: 0 3px 0 30px; padding: 3px 0 0; pointer-events: none; }
.wg-hang .ad-day { gap: 2px; }
.wg-hang .ad-chip, .wg-hang .ad-more { pointer-events: auto; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45); }
.wg-hang .ad-more { justify-self: start; border-radius: 6px; background: var(--cal-page); }

/* ===== v7.4: «Задачи» — без прокрутки вкладки; прокручивается только сам лист, и он не ограничен ===== */
.view.view-tasks { overflow: hidden; padding-bottom: 8px; }
.view-tasks .tasks-page { height: 100%; min-height: 0; }
.tasks-page .tk-page { flex: 1 1 0; min-height: 0; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; border-radius: 14px; display: block; }
.tasks-page .tk-page .pg-lines { min-height: 100%; }
.tk-page .pg-lines { min-height: 0; }
.tk-head .cal-tools { gap: 6px; }
.tk-head .cal-btn.wide { padding: 0 9px; color: var(--up); }
.tk-dots { display: flex; justify-content: center; gap: 6px; margin: -4px 0 8px; }
.tk-dots i { width: 6px; height: 6px; border-radius: 50%; background: color-mix(in srgb, var(--text) 25%, transparent); }
.tk-dots i.on { background: var(--c); width: 16px; border-radius: 3px; }
.tkp-list { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; }
.tkp-row { display: flex; align-items: center; gap: 6px; }
.tkp-name { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; border: 0; background: var(--panel-2); color: var(--text); font: inherit; padding: 10px 12px; border-radius: 12px; text-align: left; }
.tkp-name .ic { margin-left: auto; }
.tkp-row .icon-btn:disabled { opacity: 0.3; }

/* ===== v7.4: отменить / повторить ===== */
.undo-bar { position: fixed; left: 12px; bottom: calc(var(--reserve) + 10px); z-index: 25; display: flex; gap: 2px; padding: 3px; border-radius: 999px; background: color-mix(in srgb, var(--panel) 80%, transparent); border: 1px solid color-mix(in srgb, var(--text) 12%, transparent); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3); }
.undo-bar[hidden] { display: none; }
.undo-bar button { width: 38px; height: 34px; border: 0; border-radius: 999px; background: none; color: var(--text); display: grid; place-items: center; padding: 0; }
.undo-bar button svg { width: 19px; height: 19px; }
.undo-bar button:disabled { opacity: 0.28; }
body[data-dock="1"] .undo-bar, body[data-standby="1"] .undo-bar, body[data-kb="1"] .undo-bar { display: none; }
/* капсулы внизу — правее, чтобы не наезжать на стрелки */
.lag-float { left: auto !important; right: 12px; transform: none !important; }
body[data-undo="1"] .mode-float:not(.lag-float) { left: calc(50% + 44px); }
body[data-undo="1"] .view.view-tasks { padding-bottom: 58px; }

/* ===== v7.5: одна шапка во всех видах календаря (блокнот, расписание, день) — кнопки на тех же местах и того же размера ===== */
.cal-daymodal .top-bar { margin: 0 0 6px; }
.cal-daymodal .top-bar .cal-btn { background: var(--panel); color: var(--text); }
.cal-daymodal .top-bar .cal-btn.accent { color: var(--cal-accent, var(--accent2)); }
.cal-daymodal .top-bar .cal-title { background: var(--panel); }
.cal-daymodal.is-main .dm-top, .cal-daymodal:not(.land) .dm-top { padding: calc(env(safe-area-inset-top) + 8px) 12px 0; }
.cal-daymodal .task-banner.pb-grid { margin: 0 0 2px; padding: 3px 8px 3px 9px; border-radius: 11px; }
body[data-drawer="1"] .tabs { z-index: 66; } /* меню календаря открыто — «Календарь» внизу его закрывает */
.cal.cal-drawer { padding-bottom: calc(var(--reserve) + 20px); }
/* «Задачи»: листать страницы — капсулой справа внизу (на уровне стрелок отмены) */
.tk-pager { position: fixed; right: 12px; bottom: calc(var(--reserve) + 10px); z-index: 25; display: flex; align-items: center; gap: 2px; padding: 3px; border-radius: 999px; background: color-mix(in srgb, var(--panel) 80%, transparent); border: 1px solid color-mix(in srgb, var(--text) 12%, transparent); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3); }
.tk-pager button { width: 36px; height: 34px; border: 0; border-radius: 999px; background: none; color: var(--text); display: grid; place-items: center; padding: 0; }
.tk-pager button svg { width: 18px; height: 18px; }
.tk-pager span { font-size: 0.82em; font-weight: 700; color: var(--text); padding: 0 2px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tk-pager span small { font-weight: 500; color: var(--muted); font-size: 0.9em; }
body[data-kb="1"] .tk-pager { display: none; }
.view.view-tasks:has(.tk-pager) { padding-bottom: 58px; }
/* компьютер: нижний край блока в расписании — потянуть, чтобы изменить длительность */
@media (hover: hover) and (pointer: fine) {
  .tl-block:not(.untimed)::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 7px; cursor: ns-resize; }
  .tl-block:not(.untimed):hover::after { background: linear-gradient(transparent, color-mix(in srgb, var(--c) 55%, transparent)); border-radius: 0 0 5px 5px; }
}
.tl-block.resizing { z-index: 7; outline: 2px solid var(--accent2); }
.tl-block.resizing::before { content: attr(data-rz); position: absolute; left: 2px; bottom: -18px; font-size: 10px; font-weight: 700; color: var(--accent2); white-space: nowrap; }
/* новая запись: длительность — кнопками или ручкой снизу; удержание + вниз — сразу с длительностью */
.gn-durs { display: flex; gap: 4px; flex-wrap: wrap; }
.gn-dur { border: 1px solid var(--cal-line); background: none; color: var(--cal-ink); border-radius: 8px; padding: 2px 7px; font-size: 0.7em; font-weight: 600; }
.gn-dur.on { background: var(--accent2); border-color: var(--accent2); color: #fff; }
.gn-handle { display: block; align-self: center; width: 44px; height: 14px; margin: 2px 0 -4px; cursor: ns-resize; touch-action: none; position: relative; }
.gn-handle::after { content: ""; position: absolute; left: 10px; right: 10px; top: 5px; height: 4px; border-radius: 2px; background: color-mix(in srgb, var(--cal-ink) 35%, transparent); }
.g-new-mark.drag { z-index: 9; background: color-mix(in srgb, var(--accent2) 35%, transparent); border: 1.5px solid var(--accent2); }
.g-new-mark.drag::after { content: attr(data-t); position: absolute; left: 4px; top: 2px; font-size: 10px; font-weight: 700; color: var(--cal-ink); }
.pin-banner.pb-grid .pin-cap { margin-right: 6px; }

/* ===== v7.6: единый дизайн кнопок ===== */
:root { --btn: 46px; --btn-r: 13px; --cap-h: 40px; }
/* кнопки в шапках вкладок — как у календаря: 46 × 46, скругление 13, фон панели */
.page-head .icon-btn, .main-head .icon-btn, .icon-btn.hdr, .tk-head .cal-btn, .cal-head .cal-btn.big, .cal-daymodal .top-bar .cal-btn { width: var(--btn); height: var(--btn); border-radius: var(--btn-r); background: var(--panel); flex: 0 0 auto; }
.page-head .icon-btn svg, .main-head .icon-btn svg, .icon-btn.hdr svg, .tk-head .cal-btn svg, .cal-head .cal-btn.big svg, .cal-daymodal .top-bar .cal-btn svg { width: 22px; height: 22px; }
.tk-head .cal-btn.wide { width: auto; min-width: var(--btn); padding: 0 12px; }
.today-badge, .cal-title { border-radius: var(--btn-r); }
.cal-head .today-badge { width: var(--btn); height: var(--btn); }
.day-chip { height: var(--btn); border-radius: var(--btn-r); padding: 0 12px; font-size: 0.84em; display: inline-flex; align-items: center; }
.main-head { gap: 6px; }
.page-head { min-height: var(--btn); }
.page-head .head-tools { display: flex; align-items: center; gap: 6px; }
/* капсулы внизу — одной высоты и одного вида */
.undo-bar, .tk-pager, .zoom-float, .mode-float { height: var(--cap-h); padding: 3px; border-radius: 999px; background: color-mix(in srgb, var(--panel) 82%, transparent); border: 1px solid color-mix(in srgb, var(--text) 12%, transparent); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3); bottom: calc(var(--reserve) + 10px); box-sizing: border-box; align-items: center; }
.undo-bar button, .tk-pager button, .zoom-float .zbtn, .mode-float button { height: 32px; }
.zoom-float .zbtn { width: 38px; }
.mode-float button { padding: 0 12px; font-size: 0.78em; display: inline-flex; align-items: center; gap: 5px; }
/* «Секундомер | Таймер» — справа, не заходит на стрелки отмены */
.mode-float, body[data-undo="1"] .mode-float:not(.lag-float) { left: auto !important; right: 12px; transform: none !important; }
/* Анализ: день / неделя / месяц, звезда, «намечено» и настройки — в самом верху */
.pbar { justify-content: flex-start; }
.pbar .pb-group:first-child { margin-right: auto; }
.pbar .sync-dot { align-self: center; }
.pb { height: 38px; }
/* кнопка «микрофон / ручка» — по центру над нижним меню на Календаре, Задачах и «Добавить» */
.q-btn { position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(var(--reserve) + 10px); z-index: 26; width: 64px; height: var(--cap-h); border-radius: 999px; border: 0; background: var(--accent); color: var(--on-accent, #000); display: grid; place-items: center; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35); -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; touch-action: none; transition: transform 0.15s; }
.q-btn[hidden] { display: none; }
.q-btn svg { width: 21px; height: 21px; }
.q-btn.pen { background: var(--panel); color: var(--text); border: 1px solid color-mix(in srgb, var(--text) 14%, transparent); }
.q-btn.held { transform: translateX(-50%) scale(1.12); }
.q-btn.rec { background: var(--down); color: #fff; animation: mic 1s ease-in-out infinite; }
.q-rec { position: fixed; left: 16px; right: 16px; bottom: calc(var(--reserve) + 62px); z-index: 27; display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 16px; background: var(--panel); color: var(--text); font-size: 0.92em; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45); }
.q-rec[hidden] { display: none; }
.q-rec-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--down); flex: 0 0 auto; animation: mic 1s ease-in-out infinite; }
.q-text { width: 100%; min-height: 76px; resize: none; font-size: 1em; border-radius: 14px; }
.q-prev { display: flex; flex-direction: column; gap: 6px; margin: 10px 0; }
.q-item { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 10px; background: var(--panel-2); font-size: 0.92em; }
.q-item > span:nth-child(2), .q-item > span:first-child:not(.q-day) { flex: 1; min-width: 0; }
.q-day { flex: 0 0 auto; font-size: 0.78em; font-weight: 700; color: var(--accent2); }
.q-ai { margin-left: auto; }
.q-phrase input { height: 48px !important; }
.main-head .mini-stats { flex-direction: column; gap: 0; line-height: 1.25; font-size: 0.74em; }
/* «Важные сферы»: всё на одном экране */
.anf-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 6px 0; }
.anf-top .seg { margin: 0; }
.anf-all { flex: 0 0 auto; white-space: nowrap; }
.anf-bg { margin: 0 0 6px; }
.anf-grid { gap: 6px; margin: 6px 0 10px; }
.anf-grid .check-tile { padding: 6px 8px; gap: 6px; font-size: 0.84em; min-width: 0; }
.anf-grid .check-tile .box { width: 18px; height: 18px; border-radius: 5px; }
.anf-grid .check-tile .box svg { width: 12px; height: 12px; }
.anf-grid .ct-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* история: найденный день — без цветной подложки (у неё были другие скругления) */
.day-head.focus { background: none; margin: 0; padding-left: 2px; padding-right: 2px; }
.sh-tools { display: flex; gap: 6px; }
.icon-btn.on { color: var(--up); }
.hs-list { display: flex; flex-direction: column; gap: 4px; }
.hs-row { display: flex; align-items: center; gap: 10px; border: 0; background: var(--panel-2); color: var(--muted); font: inherit; padding: 10px 12px; border-radius: 12px; text-align: left; }
.hs-row.on { color: var(--text); }
.hs-row span:nth-child(2) { flex: 1; }
.hs-eye svg { width: 20px; height: 20px; }

/* ===== v7.8: календарь — странички дня прокручиваются, время на полях, вид — внизу под пальцем ===== */
.pg { position: relative; }
.fit .pg-lines.scroll { overflow-y: auto; overscroll-behavior: contain; background-attachment: local; scrollbar-width: none; touch-action: pan-y; -webkit-overflow-scrolling: touch; }
.fit .pg-lines.scroll::-webkit-scrollbar { display: none; }
.pg-more-ind { position: absolute; right: 6px; bottom: 5px; z-index: 4; display: inline-flex; align-items: center; gap: 1px; border: 0; border-radius: 999px; padding: 1px 7px 1px 4px; background: color-mix(in srgb, var(--cal-accent) 88%, #000); color: #fff; font-size: 0.66em; font-weight: 700; line-height: 1.5; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4); }
.pg-more-ind[hidden] { display: none; }
.pg-more-ind svg { width: 12px; height: 12px; stroke-width: 2.6; }
/* время — на полях слева, как в ежедневнике: начало над концом, справа красная линия */
.tcol { --tmw: calc(var(--cal-fs, 15px) * 2.15); }
.ln-tm { flex: 0 0 var(--tmw); width: var(--tmw); align-self: stretch; display: flex; flex-direction: column; justify-content: center; align-items: flex-end; padding-right: 4px; margin: 0 1px 0 -2px; border-right: 1.5px solid color-mix(in srgb, var(--cal-red) 60%, transparent); font-size: calc(var(--cal-fs, 15px) * 0.6); line-height: 1.08; color: var(--cal-ink); font-variant-numeric: tabular-nums; letter-spacing: -0.01em; overflow: hidden; }
.ln-tm b { font-weight: 650; white-space: nowrap; }
.ln-tm.two b + b { color: var(--cal-muted); font-weight: 500; }
.ln-tm[data-action] { cursor: pointer; }
.ln.rec .ln-pill { min-width: 0; }
.ln.late .ln-text { color: var(--cal-red); }
.ln.late .ln-tm b:first-child { color: var(--cal-red); }
.cal-daymodal .tcol .ln-tm { margin-left: -2px; }
/* переключатель вида — справа внизу; − / + в расписании — над ним */
.mode-float.cal-mode button { width: 44px; padding: 0; justify-content: center; }
.mode-float.cal-mode button svg { width: 19px; height: 19px; }
.mode-float.cal-mode button span { display: none; }
@media (min-width: 620px) { .mode-float.cal-mode button { width: auto; padding: 0 12px; } .mode-float.cal-mode button span { display: inline; } }
.zoom-float { bottom: calc(var(--reserve) + var(--cap-h) + 18px) !important; }
body[data-calfit="1"]:not([data-dock="1"]) .view { bottom: calc(var(--reserve) + var(--cap-h) + 16px); }
body[data-cal="1"]:not([data-calfit="1"]) .view { padding-bottom: calc(var(--cap-h) + 26px); }
.view.view-tasks { padding-bottom: calc(var(--cap-h) + 18px); }
body[data-standby="1"] .mode-float.cal-mode, body[data-kb="1"] .mode-float.cal-mode { display: none; }
/* «Задачи»: удержать строку — перетащить (выше/ниже, к краю — на другую страницу) */
#tasksPage .ln:not(.editing) { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
#tasksPage .ln.lifted { opacity: 0.3; }
#tasksPage .ln.drop-line { box-shadow: inset 0 2.5px 0 var(--accent2); }
/* плашка задачи: полоски и подпись — цветом её страницы (или календаря) */
.task-banner .pin-bars i { background: color-mix(in srgb, var(--bc, var(--up)) 32%, transparent); }
.task-banner .pin-bars i.on { background: var(--bc, var(--up)); }
.task-banner .pin-bars { flex-basis: 3.5px; }
.task-banner .pin-bars i { width: 3.5px; }
.pin-cap.task { color: var(--bc, var(--up)); }
.tb-src { color: var(--gray); font-weight: 500; white-space: nowrap; }
.tb-src .dot { width: 6px; height: 6px; margin: 0 3px 0 4px; vertical-align: 0.08em; }
.tb-late { color: var(--down); }
/* записи без времени в шкале дня — сверху чипами; «дз 3ч» без времени — сам в свободном окне, пунктиром */
.tl-untimed { margin: 0 0 8px; }
.tl-note { display: inline-flex; align-items: center; gap: 4px; border-left: 3px solid var(--c); background: color-mix(in srgb, var(--c) 16%, var(--cal-page)); }
.tl-note.done { opacity: 0.5; text-decoration: line-through; }
.tl-note .ic svg { width: 13px; height: 13px; }
.tl-block.auto { border-left-style: dashed; background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--c) 22%, var(--cal-page)) 0 6px, color-mix(in srgb, var(--c) 12%, var(--cal-page)) 6px 12px); }
.tl-block.auto b { font-weight: 600; opacity: 0.85; }

/* ===== v7.8: Учёт ===== */
/* «день / учтено» — капсулой: крупные цифры, мелкие подписи, полоска — какая часть дня учтена */
.mini-stats.v2 { position: relative; flex: 1 1 auto; max-width: 190px; margin: 0 auto; height: var(--btn); display: flex; flex-direction: row !important; align-items: center; justify-content: center; gap: 0; padding: 0 6px 3px; border-radius: var(--btn-r); background: var(--panel); overflow: hidden; cursor: pointer; line-height: 1.1 !important; font-size: 1em !important; color: var(--text); }
.mini-stats.v2 .ms-cell { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; align-items: center; }
.mini-stats.v2 .ms-cell b { font-size: 0.98em; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.mini-stats.v2 .ms-cell small { font-size: 0.6em; color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; margin-top: 1px; }
.mini-stats.v2 .ms-sep { flex: 0 0 1px; align-self: stretch; margin: 10px 2px 8px; background: var(--line); }
.mini-stats.v2 .ms-bar { position: absolute; left: 12px; right: 12px; bottom: 5px; height: 2px; border-radius: 2px; background: color-mix(in srgb, var(--text) 10%, transparent); overflow: hidden; }
.mini-stats.v2 .ms-bar span { display: block; height: 100%; background: var(--accent); border-radius: 2px; transition: width 0.6s ease; }
/* секундомер: название крупнее, часы чуть меньше, лёгкий фон цвета сферы; смена минуты/часа — цифры вспыхивают цветом сферы */
.hero { border-radius: 22px; margin: 2px -4px 4px; padding: 6px 4px 8px; transition: background 0.4s; }
.hero.on { background: radial-gradient(120% 95% at 50% 0%, color-mix(in srgb, var(--hc, var(--accent)) 17%, transparent), color-mix(in srgb, var(--hc, var(--accent)) 5%, transparent) 70%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--hc, var(--accent)) 16%, transparent); }
.hero-label { font-size: 1.12em; min-height: 1.7em; }
.hero-label .hl-btn b { font-size: 1.08em; font-weight: 750; }
.hero-label .dot { width: 0.62em; height: 0.62em; }
.clock { font-size: clamp(40px, min(14.5vw, 9vh), 70px); }
.many .clock { font-size: clamp(34px, min(12.5vw, 7.4vh), 60px); }
@media (max-height: 720px) { .clock { font-size: clamp(36px, min(13.5vw, 8vh), 58px); } }
.clock .cd, .clock .cc { display: inline-block; }
.clock .cd.fl { animation: digitFlash 1s ease-out; }
@keyframes digitFlash { 0% { color: var(--hc, var(--accent)); text-shadow: 0 0 18px color-mix(in srgb, var(--hc, var(--accent)) 70%, transparent); } 55% { color: var(--hc, var(--accent)); } 100% { color: inherit; text-shadow: none; } }
/* «сейчас» и «скоро» — кнопками: без пустой точки, у идущего — белая пульсирующая */
.ev-now { gap: 6px; padding: 0 0 8px; }
.ev-btn { gap: 7px; padding: 7px 12px 7px 10px; border-radius: 14px; border: 1px solid color-mix(in srgb, var(--c) 45%, transparent); background: color-mix(in srgb, var(--c) 14%, var(--panel)); font-size: 0.86em; max-width: 86%; }
.ev-btn .ev-dot { flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 3px color-mix(in srgb, var(--c) 25%, transparent); }
.ev-btn .ev-t { font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ev-btn small { color: var(--muted); font-size: 0.8em; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ev-btn .ev-ic { display: inline-grid; color: var(--c); }
.ev-btn .ev-ic svg { width: 15px; height: 15px; }
.ev-btn.soon { border-style: dashed; background: color-mix(in srgb, var(--c) 7%, var(--panel)); }
.ev-btn.on { background: var(--c); border-color: var(--c); color: #fff; }
.ev-btn.on .ev-dot { background: #fff; box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6); animation: evPulse 1.6s ease-out infinite; }
.ev-btn.on small { color: rgba(255, 255, 255, 0.85); }
@keyframes evPulse { 0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6); } 100% { box-shadow: 0 0 0 7px rgba(255, 255, 255, 0); } }
/* событие закончилось → завершить и что дальше */
.ee-banner .ee-next { margin-top: 8px; font-size: 0.86em; color: var(--muted); }
.ee-banner .ee-next b { color: var(--text); }
.ee-banner .ee-next .ic svg { width: 14px; height: 14px; }
.ee-banner .btn { height: 38px; padding: 0 12px; font-size: 0.86em; }
.temp-new { margin-top: 12px; }
.temp-new small { font-weight: 400; margin-left: 4px; }

/* ===== v7.8: статистика сервера (владелец) ===== */
.adm-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.adm-tile { background: var(--panel-2); border-radius: 14px; padding: 10px 12px; display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.adm-tile b { font-size: 1.6em; font-weight: 750; font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
.adm-tile small { color: var(--text); font-size: 0.78em; }
.adm-tile em { font-style: normal; color: var(--muted); font-size: 0.7em; }
.adm-chart { display: flex; align-items: flex-end; gap: 2px; height: 90px; padding: 6px 2px 0; background: var(--panel-2); border-radius: 12px; }
.adm-bar { position: relative; flex: 1; height: 100%; display: flex; align-items: flex-end; }
.adm-bar i { display: block; width: 100%; border-radius: 3px 3px 0 0; background: var(--accent2); }
.adm-bar em { position: absolute; left: 50%; width: 5px; height: 5px; margin: 0 0 3px -2.5px; border-radius: 50%; background: var(--accent); }
.adm-axis { display: flex; justify-content: space-between; font-size: 0.66em; color: var(--gray); margin: 3px 2px 0; }
.adm-list { display: flex; flex-direction: column; }
.adm-row { display: flex; flex-direction: column; gap: 1px; padding: 8px 2px; border-top: 1px solid var(--line); }
.adm-row:first-child { border-top: 0; }
.adm-email { font-weight: 600; font-size: 0.9em; overflow-wrap: anywhere; }
.adm-meta { font-size: 0.74em; color: var(--muted); }

/* ===== v7.8: Анализ ===== */
.sum-nums { align-items: flex-end; gap: 16px; }
.sn.trend { margin-left: auto; align-items: flex-end; text-align: right; }
.sn.trend .pct { font-size: 1.05em; font-weight: 700; line-height: 1.6; }
.sn.trend small { margin-top: 0; }
.summary.sel { position: relative; box-shadow: inset 3px 0 0 var(--c); }
.summary.sel .sn small .dot { width: 8px; height: 8px; margin-right: 4px; }
.sum-x { position: absolute; right: 10px; top: 8px; font-size: 0.72em; }
.sum-x svg { width: 12px; height: 12px; }
.summary.sel .sn.trend { margin-top: 14px; }
.dc .dc-v { position: absolute; left: 50%; transform: translate(-50%, -3px); font-size: 0.56em; font-weight: 700; color: var(--text); white-space: nowrap; font-variant-numeric: tabular-nums; z-index: 3; pointer-events: none; }
.chart-title.combo { align-items: flex-start; flex-wrap: nowrap; text-transform: none; letter-spacing: 0; }
.ct-name { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.ct-name b { font-size: 1.22em; color: var(--text); font-weight: 700; }
.ct-name small { font-size: 0.86em; color: var(--gray); font-weight: 400; line-height: 1.25; }
.ct-tools { display: flex; flex-direction: column; gap: 4px; align-items: flex-end; flex: 0 0 auto; }
.chart-title.combo .seg { margin-left: 0; }
.seg.mini.icons > * { width: 34px; padding: 0; }
.seg.mini.icons svg { width: 17px; height: 17px; }
.hc-gl.c100 { border-top: 1.5px solid color-mix(in srgb, var(--text) 45%, transparent); }
.hc-val .up { color: var(--up); }
.hc-val .down { color: var(--down); }
/* «какая сфера?» — над полосой капсул (кнопка микрофона её больше не закрывает) */
.sphere-ask { bottom: calc(var(--reserve) + var(--cap-h) + 16px); }

/* ===================== v8.0 ===================== */

/* -------- календарь: одна кнопка вида, переключатель «Событие | Задача», баннер задач в расписании -------- */
.mode-float.cal-mode.one button { width: 46px; }
@media (min-width: 620px) { .mode-float.cal-mode.one button { width: auto; } }
.cal-suggest .sg-as { display: inline-flex; flex: 0 0 auto; background: color-mix(in srgb, var(--text) 8%, transparent); border-radius: 10px; padding: 2px; gap: 2px; margin-right: 2px; }
.cal-suggest .sg-as .sg { margin: 0; border: 0; background: none; color: var(--muted); display: inline-flex; align-items: center; gap: 4px; }
.cal-suggest .sg-as .sg.on { background: var(--panel-2, #29292c); color: var(--text); font-weight: 600; }
.cal-suggest .sg-as svg { width: 15px; height: 15px; }
.gn-dur.gn-as { display: inline-grid; place-items: center; padding: 0 6px; }
.gn-dur.gn-as svg { width: 16px; height: 16px; }
.q-as { margin: 8px 0 4px; }
.q-as svg { width: 15px; height: 15px; }
.q-item .q-tk svg { width: 14px; height: 14px; }
/* баннер задач/закрепа в расписании — как в блокноте: сверху мелко «откуда», ниже сам текст, слева полоски-счётчик */
.pin-banner.pb-grid .pin-main { align-items: stretch; }
.pin-banner.pb-grid .pin-main > span { display: flex; flex-direction: column; justify-content: center; -webkit-line-clamp: unset; line-height: 1.22; gap: 1px; min-width: 0; }
.pin-banner.pb-grid .pin-cap { display: block; margin-right: 0; font-size: 0.66em; }
.pin-banner.pb-grid .pin-main b { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 0.84em; }
.pin-banner.pb-grid .pin-bars { min-height: 26px; flex-basis: 3.5px; }
.pin-banner.pb-grid .pin-bars i { min-height: 4px; }
.pin-banner .pin-bars.one i { background: color-mix(in srgb, var(--bc, var(--accent2)) 80%, transparent); }

/* -------- «Учёт»: журнал в дате шапки, кнопка лекарства «сейчас» -------- */
.day-chip.j { display: inline-flex; align-items: center; gap: 5px; }
.day-chip .dc-ic svg { width: 14px; height: 14px; opacity: 0.8; display: block; }
.ev-btn.dose { --c: #ff9f0a; }
.ev-btn.dose .ev-ic svg { width: 15px; height: 15px; }
.ev-btn.dose.late { border-style: dashed; }
.tab-dot.h-dot { background: #ff9f0a; color: #000; }

/* -------- вкладка «Здоровье» -------- */
.page.health { padding-bottom: calc(var(--cap-h) + 26px); }
.h-head .head-tools { display: inline-flex; align-items: center; gap: 6px; }
.h-back { gap: 4px; }
.h-back svg { width: 14px; height: 14px; }
.h-week { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; margin: 0 0 10px; }
.h-wd { border: 0; background: none; color: var(--muted); display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 4px 0 5px; border-radius: 14px; }
.h-wd small { font-size: 0.66em; text-transform: uppercase; letter-spacing: 0.03em; }
.h-wd b { font-size: 0.8em; color: var(--text); font-weight: 600; margin-top: -21px; height: 20px; line-height: 20px; }
.h-wd svg { width: 28px; height: 28px; }
.h-wd.on { background: var(--panel); }
.h-wd.today small { color: var(--accent2); font-weight: 700; }
.h-wd.fut { opacity: 0.35; }
.h-wd.fut b { color: var(--muted); }

.h-sum { display: flex; align-items: center; gap: 12px; padding: 12px 14px; }
.h-sum-ring { position: relative; flex: 0 0 auto; width: 124px; height: 124px; }
.h-sum-ring svg { width: 124px; height: 124px; display: block; }
.h-sum-c { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.h-sum-c b { font-size: 1.15em; font-variant-numeric: tabular-nums; }
.h-sum-c small { font-size: 0.66em; color: var(--muted); }
.h-sum-list { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.h-sum-row { display: flex; align-items: center; gap: 7px; border: 0; background: none; padding: 5px 2px; color: var(--text); text-align: left; border-radius: 10px; min-width: 0; }
.h-sum-t { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.15; }
.h-sum-t > small { font-size: 0.68em; color: var(--muted); }
.h-sum-t > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.h-sum-t b { font-size: 0.95em; font-variant-numeric: tabular-nums; color: var(--hc); }
.h-sum-t span small { font-size: 0.72em; color: var(--gray); }
.h-ok { color: var(--hc); display: inline-grid; }
.h-ok svg { width: 14px; height: 14px; stroke-width: 3; }

.h-card { padding: 12px 14px 14px; }
.h-card-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; min-height: 34px; }
.h-ic { width: 30px; height: 30px; border-radius: 9px; background: color-mix(in srgb, var(--hc, var(--accent2)) 20%, transparent); color: var(--hc, var(--accent2)); display: inline-grid; place-items: center; flex: 0 0 auto; }
.h-ic svg { width: 18px; height: 18px; }
.h-ic.sm { width: 22px; height: 22px; border-radius: 7px; }
.h-ic.sm svg { width: 13px; height: 13px; }
.h-ic.xs { width: 18px; height: 18px; border-radius: 6px; margin-right: 6px; }
.h-ic.xs svg { width: 11px; height: 11px; }
.h-ttl { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.2; }
.h-ttl b { font-size: 0.98em; }
.h-ttl small { font-size: 0.74em; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.h-act { display: inline-flex; gap: 6px; flex: 0 0 auto; }
.h-btn { border: 0; height: 34px; border-radius: 11px; padding: 0 12px; font-size: 0.84em; font-weight: 600; background: color-mix(in srgb, var(--hc, var(--accent2)) 22%, var(--panel-2)); color: var(--text); display: inline-flex; align-items: center; gap: 5px; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.h-btn svg { width: 15px; height: 15px; }
.h-btn.ghost { background: var(--panel-2); width: 34px; padding: 0; justify-content: center; }
.h-mini { border: 0; background: var(--panel-2); color: var(--muted); width: 30px; height: 30px; border-radius: 10px; display: inline-grid; place-items: center; flex: 0 0 auto; }
.h-mini svg { width: 15px; height: 15px; }
.h-empty { color: var(--muted); font-size: 0.84em; margin: 0 0 8px; line-height: 1.4; }
.h-note { color: var(--muted); font-size: 0.76em; margin: 8px 0 0; line-height: 1.4; }
.h-note svg { width: 13px; height: 13px; vertical-align: -2px; }
.h-big { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.h-big b { font-size: 1.6em; font-weight: 700; letter-spacing: -0.01em; font-variant-numeric: tabular-nums; }
.h-big span { color: var(--muted); font-size: 0.8em; }
.h-bar { height: 7px; border-radius: 7px; background: color-mix(in srgb, var(--hc) 16%, transparent); overflow: hidden; }
.h-bar i { display: block; height: 100%; border-radius: 7px; background: var(--hc); transition: width 0.3s; }
.h-minibars { position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 6px; height: 64px; margin-top: 12px; padding-bottom: 16px; }
.h-minibars::before { content: ""; position: absolute; left: 0; right: 0; bottom: calc(16px + 48px * var(--goal, 0)); border-top: 1px dashed color-mix(in srgb, var(--text) 25%, transparent); pointer-events: none; }
.h-mb { position: relative; display: flex; align-items: flex-end; justify-content: center; height: 48px; }
.h-mb i { width: 100%; max-width: 22px; border-radius: 5px 5px 2px 2px; background: color-mix(in srgb, var(--hc) 40%, transparent); min-height: 2px; }
.h-mb.ok i { background: color-mix(in srgb, var(--hc) 75%, transparent); }
.h-mb.cur i { background: var(--hc); }
.h-mb small { position: absolute; bottom: -16px; font-size: 0.6em; color: var(--gray); }
.h-chips { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 12px; }
.h-chips .chip { gap: 6px; border-color: color-mix(in srgb, var(--c) 50%, transparent); }
.h-chips .chip svg { width: 13px; height: 13px; }
.h-chips .chip.on { background: color-mix(in srgb, var(--c) 30%, var(--panel)); color: var(--text); border-color: var(--c); }

/* лекарства */
.h-doses { display: flex; flex-direction: column; }
.h-dose { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-top: 1px solid var(--line); -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.h-dose:first-child { border-top: 0; padding-top: 2px; }
.h-dose-t { width: 44px; flex: 0 0 auto; font-variant-numeric: tabular-nums; font-weight: 600; font-size: 0.86em; color: var(--muted); }
.h-dose-t .ic svg { width: 16px; height: 16px; color: var(--hc); }
.h-dose-n { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.h-dose-n b { font-size: 0.92em; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.h-dose-n small { font-size: 0.74em; color: var(--muted); }
.h-dose.missed .h-dose-n small { color: var(--muted); }
.h-dose.taken .h-dose-n b, .h-dose.skipped .h-dose-n b { color: var(--muted); }
.h-dose.skipped .h-dose-n b { text-decoration: line-through; }
.h-dose.due .h-dose-t, .h-dose.missed .h-dose-t { color: var(--hc); }
.h-check { flex: 0 0 auto; min-width: 34px; height: 34px; border-radius: 999px; border: 2px solid color-mix(in srgb, var(--hc) 60%, transparent); background: none; color: var(--text); display: inline-grid; place-items: center; font-size: 0.8em; font-weight: 700; padding: 0; }
.h-check.due { background: var(--hc); border-color: var(--hc); color: #000; padding: 0 14px; }
.h-check.on { background: var(--hc); border-color: var(--hc); color: #000; }
.h-check.on svg { width: 18px; height: 18px; stroke-width: 3; }
.h-check.skip { border-color: var(--line); color: var(--muted); font-size: 1.2em; }
.h-check.late { padding: 0 12px; color: var(--hc); }
.h-dose-n em { font-style: normal; }
.h-dose-n em.h-st-missed { color: var(--down); }
.h-dose-n em.h-st-due { color: var(--hc); font-weight: 600; }
.h-dose-n em.h-st-taken { color: var(--up); }
.h-med-chips { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
.h-med-chip { border: 1px solid var(--line); background: none; border-radius: 12px; padding: 5px 10px; text-align: left; display: flex; flex-direction: column; font-size: 0.8em; font-weight: 600; color: var(--text); }
.h-med-chip small { font-weight: 400; color: var(--muted); font-size: 0.86em; }
.h-med-chip.low { border-color: color-mix(in srgb, var(--down) 60%, transparent); }
.h-med-chip.low small { color: var(--down); }

/* вода */
.h-water { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.h-cups { flex: 1; display: flex; gap: 5px; flex-wrap: wrap; align-items: flex-end; }
.h-cup { width: 20px; height: 26px; border: 2px solid color-mix(in srgb, var(--hc) 55%, transparent); border-top-width: 0; border-radius: 3px 3px 7px 7px; background: linear-gradient(to top, var(--hc) var(--f), transparent var(--f)); }
.h-cup-more { font-size: 0.74em; color: var(--hc); font-weight: 700; }

/* самочувствие */
.h-faces { display: flex; justify-content: space-between; gap: 4px; }
.h-face { border: 0; background: none; padding: 4px; border-radius: 50%; display: flex; flex-direction: column; align-items: center; gap: 4px; transition: transform 0.15s, opacity 0.15s; }
.h-face svg { width: 40px; height: 40px; display: block; }
.h-face.on { transform: scale(1.12); box-shadow: 0 0 0 2px var(--text); }
.h-face.dim { opacity: 0.38; }
.h-faces.big { margin: 6px 0 14px; }
.h-faces.big .h-face { border-radius: 14px; padding: 6px 2px; flex: 1; }
.h-faces.big .h-face svg { width: 44px; height: 44px; }
.h-faces.big small { font-size: 0.7em; color: var(--muted); }
.h-syms { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 12px; }
.h-syms .chip { height: 32px; font-size: 0.8em; }
.h-syms.ro .chip { cursor: default; }

/* питание */
.h-day24 { position: relative; height: 34px; border-radius: 9px; background: color-mix(in srgb, var(--hc) 9%, transparent); margin-bottom: 4px; }
.h-day24 i { position: absolute; top: 6px; height: 12px; border-radius: 4px; background: var(--hc); }
.h-day24 i.run { animation: hpulse 1.4s ease-in-out infinite; }
.h-day24 b.now { position: absolute; top: 2px; bottom: 12px; width: 2px; border-radius: 2px; background: var(--text); opacity: 0.7; }
.h-day24 span { position: absolute; bottom: 1px; font-size: 0.58em; color: var(--gray); transform: translateX(-50%); }
.h-day24 span:nth-of-type(1) { left: 0; transform: none; padding-left: 4px; }
.h-day24 span:nth-of-type(2) { left: 33.3%; }
.h-day24 span:nth-of-type(3) { left: 66.6%; }
.h-day24 span:nth-of-type(4) { right: 0; left: auto; transform: none; padding-right: 4px; }
@keyframes hpulse { 50% { opacity: 0.45; } }
.h-meals { display: flex; flex-direction: column; margin-top: 4px; }
.h-meal-row { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-top: 1px solid var(--line); }
.h-meal-row:first-child { border-top: 0; }
.h-meal-row.run .h-dose-n b { color: var(--hc); }

/* цикл */
.h-cyc { position: relative; width: 150px; height: 150px; margin: 0 auto 10px; }
.h-cyc svg { width: 150px; height: 150px; display: block; color: var(--text); }
.h-cyc-c { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 0 30px; }
.h-cyc-c b { font-size: 1.25em; }
.h-cyc-c small { font-size: 0.68em; font-weight: 600; line-height: 1.2; }
.h-cyc-info { display: flex; flex-direction: column; gap: 4px; font-size: 0.82em; }
.h-cyc-info i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 7px; vertical-align: -1px; }
.h-cyc-list { display: flex; flex-direction: column; gap: 5px; margin-top: 4px; }
.h-cyc-row { display: grid; grid-template-columns: 64px 1fr 28px; align-items: center; gap: 8px; font-size: 0.78em; color: var(--muted); }
.h-cyc-row i { height: 8px; border-radius: 4px; background: var(--hc); }
.h-cyc-row b { color: var(--text); text-align: right; }
.h-cyc-row.odd i { background: var(--gray); }

/* вес */
.h-spark { width: 100%; height: 46px; display: block; color: var(--text); margin-top: 4px; }
.h-stepper { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 14px 0; }
.h-stepper input { width: 130px; height: 64px; text-align: center; font-size: 2em; font-weight: 700; border-radius: 16px; }
.h-st { width: 56px; height: 56px; border-radius: 50%; border: 0; background: var(--panel-2); display: grid; place-items: center; }
.h-pick { display: flex; gap: 8px; flex-wrap: wrap; margin: 6px 0 4px; }

.h-more { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 4px 2px 10px; }
.h-more > span { width: 100%; font-size: 0.76em; color: var(--muted); }
.h-more .chip { height: 34px; }
.h-foot { height: 8px; }

/* «Динамика» */
.h-period { display: flex; gap: 6px; margin: 0 0 10px; }
.h-period button { flex: 1; height: 34px; border-radius: 11px; border: 0; background: var(--panel); color: var(--muted); font-size: 0.84em; font-weight: 600; }
.h-period button.on { background: var(--text); color: var(--bg); }
.h-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(72px, 1fr)); gap: 8px; margin-bottom: 10px; }
.h-stat { background: var(--panel-2); border-radius: 12px; padding: 8px 10px; display: flex; flex-direction: column; min-width: 0; }
.h-stat b { font-size: 1.02em; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--hc); }
.h-stat small { font-size: 0.66em; color: var(--muted); line-height: 1.2; }
.h-chart { position: relative; display: flex; align-items: flex-end; gap: 3px; height: 92px; }
.h-col { flex: 1; display: flex; align-items: flex-end; height: 100%; min-width: 0; }
.h-col i { width: 100%; border-radius: 4px 4px 1px 1px; background: color-mix(in srgb, var(--hc) 50%, transparent); min-height: 1px; }
.h-col.ok i { background: var(--hc); }
.h-col.thin { gap: 0; }
.h-chart:has(.thin) { gap: 1px; }
.h-goal { position: absolute; left: 0; right: 0; border-top: 1px dashed color-mix(in srgb, var(--text) 35%, transparent); pointer-events: none; }
.h-axis { display: flex; gap: 3px; margin-top: 4px; }
.h-axis span { flex: 1; text-align: center; font-size: 0.58em; color: var(--gray); min-width: 0; overflow: visible; white-space: nowrap; }
.h-window { position: relative; display: flex; gap: 3px; height: 128px; padding-left: 36px; margin-bottom: 6px; background: repeating-linear-gradient(to bottom, transparent 0 calc(25% - 1px), color-mix(in srgb, var(--text) 7%, transparent) calc(25% - 1px) 25%); border-radius: 8px; margin-top: 2px; }
.h-window.food { background: repeating-linear-gradient(to bottom, transparent 0 calc(33.33% - 1px), color-mix(in srgb, var(--text) 7%, transparent) calc(33.33% - 1px) 33.33%); }
.h-wcol { position: relative; flex: 1; min-width: 0; }
.h-wcol i { position: absolute; left: 12%; right: 12%; border-radius: 4px; background: color-mix(in srgb, var(--hc) 55%, transparent); }
.h-wcol i.ok { background: var(--hc); }
.h-wcol.thin i { left: 0; right: 0; border-radius: 2px; }
.h-wcol.food i { background: var(--hc); }
.h-wl { position: absolute; left: 0; width: 32px; font-size: 0.56em; color: var(--gray); transform: translateY(-50%); pointer-events: none; font-variant-numeric: tabular-nums; }
.h-dots-row { display: flex; align-items: center; gap: 8px; margin: 6px 0; }
.h-dots-row > span { width: 86px; flex: 0 0 auto; font-size: 0.78em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.h-dots { flex: 1; display: flex; gap: 3px; }
.h-dots i, .h-lg { flex: 1; height: 12px; border-radius: 4px; background: color-mix(in srgb, var(--text) 8%, transparent); }
.h-dots.thin { gap: 1px; }
.h-dots i.all, .h-lg.all { background: var(--hc); }
.h-dots i.part, .h-lg.part { background: color-mix(in srgb, var(--hc) 45%, transparent); }
.h-dots i.miss, .h-lg.miss { background: color-mix(in srgb, var(--down) 55%, transparent); }
.h-lg { display: inline-block; width: 12px; flex: none; vertical-align: -2px; }
.h-moodline { display: flex; align-items: flex-end; gap: 3px; height: 70px; }
.h-moodline i { flex: 1; border-radius: 4px; background: color-mix(in srgb, var(--text) 6%, transparent); height: 6%; }
.h-moodline.thin { gap: 1px; }
.h-facts .h-ic { --hc: #bf5af2; }

/* листы */
.h-items { display: flex; flex-direction: column; gap: 6px; margin: 8px 0; }
.h-item { display: flex; align-items: center; gap: 8px; font-size: 0.88em; }
.h-item > span { flex: 1; min-width: 0; }
.h-item small { color: var(--muted); }
.h-item input { width: 74px; height: 34px; text-align: center; }
.h-recent { margin: 6px 0; }
.h-recent .chip { height: 32px; font-size: 0.8em; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.h-times { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 8px; align-items: center; }
.h-time { display: inline-flex; align-items: center; gap: 2px; background: var(--panel-2); border-radius: 12px; padding: 2px 2px 2px 6px; }
.h-time input { width: 92px; height: 34px; border: 0 !important; background: none !important; }
.h-parsed { color: var(--up); }
.h-parsed svg { width: 13px; height: 13px; vertical-align: -2px; }
.day-row.h-unsure { box-shadow: inset 3px 0 0 var(--warn); }
.cd-cap { font-size: 0.78em; color: var(--muted); align-self: center; margin-right: 2px; }

/* напоминание о приёме (поверх всех вкладок) */
.h-banner .rem-text svg { width: 16px; height: 16px; vertical-align: -3px; color: #ff9f0a; }

/* «Ожидание»: приём лекарства и вода */
.stb-card.sbh { cursor: default; display: flex; flex-direction: column; gap: 10px; padding: 12px 14px; }
.sbh-row { display: flex; align-items: center; gap: 10px; color: #fff; font-size: 0.9em; min-width: 0; }
.sbh-row > span:first-child { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sbh-row .ic svg { width: 16px; height: 16px; vertical-align: -3px; }
.sbh-row.due { color: #ff9f0a; }
.sbh-in { color: #8e8e93; font-variant-numeric: tabular-nums; font-size: 0.9em; }
.sbh-bar { width: 70px; height: 6px; border-radius: 6px; background: rgba(50, 173, 230, 0.2); overflow: hidden; flex: 0 0 auto; }
.sbh-bar i { display: block; height: 100%; background: #32ade6; }
.sbh .btn.small { height: 32px; }

@media (max-width: 370px) {
  .h-sum { flex-direction: column; align-items: stretch; }
  .h-sum-ring { margin: 0 auto; }
  .h-face svg { width: 34px; height: 34px; }
}
.q-item.hq > .ic { flex: 0 0 auto; }
.q-item.hq .ic svg { width: 16px; height: 16px; }
.h-meal-times { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.h-meal-times label { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.h-meal-times small { font-size: 0.72em; color: var(--muted); }
.h-meal-times input { width: 100%; min-width: 0; height: 38px; padding: 0 6px; }
.q-item > .ic { flex: 0 0 auto !important; }
.q-item > .ic + .q-day { flex: 0 0 auto; }
.q-item > .ic + .q-day + span { flex: 1; min-width: 0; }

/* ===================== v8.1 ===================== */
/* кнопка сферы: значок в углу — второй способ запуска (таймер / секундомер) */
/* значок — «обтекаемый» справа: имя переносится по словам, без разрыва посередине слова */
.sb-corner { float: right; position: relative; width: 30px; height: 30px; margin: -4px -5px 2px 4px; border-radius: 10px; display: grid; place-items: center; background: color-mix(in srgb, var(--fg) 16%, transparent); color: var(--fg); }
.sb-corner::before { content: ""; position: absolute; inset: -6px; }
.sb-corner svg { width: 17px; height: 17px; stroke-width: 2.2; }
.sb.has-corner .sb-name { display: block; overflow-wrap: normal; word-break: normal; hyphens: manual; }
.grid-main .sb { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.cd-pick { margin: 4px 0 2px; }
/* капсула одной кнопкой с подписью (Учёт ↔ Журнал) */
.mode-float.one-txt button { color: var(--text); padding: 0 14px; }
.mode-float.one-txt svg { width: 17px; height: 17px; }
.page.journal { padding-bottom: calc(var(--cap-h) + 26px); }
/* календарь: строка «сейчас» + метка «куда пишется» */
.cal-now-row { display: flex; align-items: center; gap: 8px; margin: -4px 0 6px; min-height: 24px; }
.cal-now-row .cal-now { margin: 0; flex: 1; min-width: 0; width: auto; }
.fit .cal-now-row { flex: 0 0 auto; }
.cal-now-row.grid { margin: 2px 2px 4px; }
.cal-target { flex: 0 0 auto; display: inline-flex; align-items: center; height: 26px; border-radius: 999px; background: color-mix(in srgb, var(--c) 16%, transparent); border: 1px solid color-mix(in srgb, var(--c) 40%, transparent); font-size: 0.72em; overflow: hidden; max-width: 62%; }
.cal-target button { border: 0; background: none; color: var(--text); height: 100%; display: inline-flex; align-items: center; gap: 5px; padding: 0 9px; font-weight: 600; white-space: nowrap; min-width: 0; }
.cal-target .ct-cal { min-width: 0; }
.cal-target .ct-cal span { overflow: hidden; text-overflow: ellipsis; }
.cal-target .dot { width: 7px; height: 7px; margin: 0; background: var(--c); flex: 0 0 auto; }
.cal-target .ct-kind { border-left: 1px solid color-mix(in srgb, var(--c) 40%, transparent); color: var(--muted); font-weight: 500; }
.cal-target .ct-kind.on { color: var(--text); }
.cal.cal-light .cal-target button { color: var(--cal-ink); }
.cal.cal-light .cal-target .ct-kind:not(.on) { color: var(--cal-muted); }
.cal-target svg { width: 13px; height: 13px; }
/* подзадачи: под задачей, с отступом, мельче */
.ln.sub { font-size: calc(var(--cal-fs, 15px) * 0.88); }
.ln.sub .ln-box.sm { margin-left: 20px; }
.ln.sub .ln-text { color: var(--cal-muted, var(--muted)); }
.ln.sub:not(.done) .ln-text { color: inherit; opacity: 0.86; }
.ln-box.sm { width: 14px; height: 14px; border-radius: 4px; }
.ln-box.sm svg { width: 10px; height: 10px; }
.ln.sub.done .ln-box { background: var(--c); border-color: var(--c); }
.ln-subn { font-style: normal; font-size: 0.72em; color: var(--cal-muted, var(--muted)); flex: 0 0 auto; font-variant-numeric: tabular-nums; }
.sg.sg-subt svg { width: 15px; height: 15px; vertical-align: -3px; }
/* перенос строки блокнота: линия, куда ляжет */
.pg-lines .ln.drop-line { box-shadow: inset 0 2px 0 var(--accent2); }
.pg-lines .ln[data-id] { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.pg-lines .ln.lifted { opacity: 0.35; }
/* шапка календаря — на поверхности приложения: цвет текста приложения (а не страничек) */
button.cal-tt { color: var(--text); }
.cal.cal-white .ad-lbl { color: var(--text); }
.cal.cal-white .ad-lbl small { color: var(--muted); }
.cal-target .ct-kind svg { color: var(--tc, currentColor); }
.cal-target .ct-kind span { overflow: hidden; text-overflow: ellipsis; max-width: 9em; }

/* ===================== v8.2: кнопки над меню — одной высоты, круглые ===================== */
:root { --cap-h: 48px; }
.undo-bar, .mode-float, .tk-pager, .zoom-float { height: var(--cap-h); padding: 3px; }
.undo-bar button { width: 40px; height: 40px; border-radius: 50%; }
.q-btn { width: var(--cap-h); height: var(--cap-h); border-radius: 50%; }
.q-btn svg { width: 22px; height: 22px; }
.mode-float.one { width: var(--cap-h); padding: 3px; justify-content: center; }
.mode-float.one button { width: 40px !important; height: 40px; padding: 0 !important; border-radius: 50%; display: grid; place-items: center; color: var(--text); }
.mode-float.one button span { display: none !important; }
.mode-float.one button svg { width: 20px; height: 20px; }
.mode-float.lag-float { left: auto !important; right: 12px; transform: none !important; }
/* светлые странички в расписании — без двойных отступов (кнопки шапки на тех же местах, что в блокноте) */
.cal.cal-light.cal-daymodal { margin: 0 -12px; padding: 0; min-height: 100%; }
/* 8.2 — здоровье: число ровно в центре кольца, вес по датам */
.h-wd-ring { position: relative; width: 28px; height: 28px; display: block; }
.h-wd-ring svg { display: block; }
.h-wd .h-wd-ring b { position: absolute; inset: 0; margin: 0; height: auto; display: flex; align-items: center; justify-content: center; line-height: 1; font-variant-numeric: tabular-nums; }
.h-spark.w { height: 74px; }
.h-chart-btn { display: block; width: 100%; border: 0; background: none; padding: 0; color: inherit; cursor: pointer; }
.h-wlist { display: flex; flex-direction: column; gap: 4px; margin-top: 4px; }
.h-wrow { display: flex; gap: 6px; align-items: center; }
.h-wmain { flex: 1; display: flex; align-items: center; gap: 10px; border: 0; background: var(--panel); color: var(--text); padding: 10px 12px; border-radius: 12px; font: inherit; text-align: left; }
.h-wmain span { flex: 1; color: var(--muted); }
.h-wmain svg { width: 16px; height: 16px; opacity: .5; }
.h-wrow.on .h-wmain { outline: 2px solid var(--accent2); }
.h-mini { width: 40px; height: 40px; border-radius: 50%; border: 0; background: var(--panel); color: var(--muted); display: grid; place-items: center; }
.h-mini svg { width: 16px; height: 16px; }
.h-cam { display: flex; align-items: center; gap: 14px; width: 100%; border: 0; border-radius: 16px; background: color-mix(in srgb, #ff6b5e 16%, var(--panel)); color: var(--text); padding: 14px 16px; margin: 4px 0 10px; font: inherit; text-align: left; }
.h-cam svg { width: 30px; height: 30px; color: #ff6b5e; flex: none; }
.h-cam span { display: flex; flex-direction: column; font-weight: 600; }
.h-cam small { font-weight: 400; color: var(--muted); }
.btn.sq { width: 48px; padding: 0; display: grid; place-items: center; }
.h-wchart { position: relative; margin-top: 6px; }
.h-wchart .h-spark.w { height: 64px; margin: 0; }
.h-waxis { display: flex; justify-content: space-between; font-size: 0.78em; color: var(--muted); margin-top: 4px; }
/* 8.2 — лекарство: моменты дня сеткой, тап = количество */
.h-medf .mf-forms { margin: 8px 0 10px; }
.chips.scroll { display: flex; flex-wrap: nowrap; overflow-x: auto; gap: 6px; scrollbar-width: none; margin-left: -2px; padding: 2px; }
.chips.scroll::-webkit-scrollbar { display: none; }
.chips.scroll .chip { flex: none; }
.mt-grid { display: grid; grid-template-columns: auto 1fr 1fr 1fr; gap: 6px 8px; align-items: center; margin: 12px 0 8px; }
.mt-grid > small { text-align: center; color: var(--muted); font-size: 0.78em; }
.mt-grid > small.mt-r { text-align: left; color: var(--text); font-size: 0.92em; padding-right: 4px; }
.mt-c { height: 44px; border-radius: 14px; border: 1.5px dashed color-mix(in srgb, var(--muted) 45%, transparent); background: none; color: var(--text); font: inherit; display: grid; place-items: center; }
.mt-c.on { border: 0; background: #ff9f0a; color: #1c1c1e; }
.mt-c b { font-size: 1.15em; }
.mt-extra { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.mt-extra .chip b { margin-left: 4px; background: rgba(0,0,0,.18); border-radius: 8px; padding: 0 6px; }
.chip.on b { color: inherit; }
.mt-time { display: inline-flex; align-items: center; gap: 4px; padding-right: 4px; }
.mt-time input { border: 0; background: none; color: inherit; font: inherit; width: 5.6em; padding: 0; }
.mt-time button { border: 0; background: none; color: inherit; padding: 0 2px; display: grid; place-items: center; }
.mt-time button svg { width: 14px; height: 14px; }
.mf-wd { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin-top: 6px; }
.mf-wd button { height: 38px; border-radius: 12px; border: 0; background: var(--panel); color: var(--muted); font: inherit; }
.mf-wd button.on { background: #ff9f0a; color: #1c1c1e; font-weight: 600; }
.mf-pack { align-items: center; }
.mf-pack.hl input { outline: 2px solid #ff9f0a; }
.mf-left { color: var(--muted); white-space: nowrap; }
.mf-left b { color: var(--text); }
.mf-hist { display: flex; flex-direction: column; gap: 4px; margin: 4px 0 10px; }
.mf-strip { display: flex; gap: 3px; }
.mf-strip i { flex: 1; height: 8px; border-radius: 3px; background: var(--panel); }
.mf-strip i.ok { background: #30d158; } .mf-strip i.part { background: #ff9f0a; } .mf-strip i.no { background: #ff453a; }
.mf-hist small { color: var(--muted); }
.h-medf .seg { margin-top: 6px; }
.chip.mt-time input[type="time"] { background: transparent; border: 0; box-shadow: none; height: auto; min-height: 0; padding: 0; margin: 0; width: 5.4em; color: inherit; font: inherit; border-radius: 0; }
.chip.mt-time input[type="time"]::-webkit-calendar-picker-indicator { display: none; }
/* 8.3 — подзадача с датой отдельной строкой в своём дне */
.ln .ln-par { flex: none; max-width: 38%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-style: normal; font-size: 0.72em; color: var(--muted); display: inline-flex; align-items: center; gap: 3px; margin-left: 6px; }
.ln .ln-par svg { width: 12px; height: 12px; }
.ln.sub .ln-when { margin-left: auto; }
.tl-block.follow { border-style: dashed; opacity: .92; }
.ln.sub .ln-text { min-width: 2.6em; flex: 1 1 auto; }
.ln.sub .ln-when { flex: 0 1 auto; min-width: 0; max-width: 48%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ln.subof .ln-text { min-width: 2.6em; flex: 1 1 auto; }
.ln.subof .ln-par { flex: 0 1 auto; min-width: 0; }
/* 8.3 — «Обзор» */
.an-list-tgl { display: flex; align-items: center; gap: 8px; width: 100%; margin: 4px 0 12px; padding: 12px 16px; border: 0; border-radius: 16px; background: var(--panel); color: var(--text); font: inherit; font-weight: 600; }
.an-list-tgl span { flex: 1; text-align: left; }
.an-list-tgl svg { width: 18px; height: 18px; color: var(--muted); transition: transform .2s; }
.an-list-tgl.open svg { transform: rotate(180deg); }
.an-blocks-btn { margin-top: 6px; }
.an-hb:empty { display: none; }
.anb-list { display: flex; flex-direction: column; gap: 4px; margin: 8px 0 12px; }
.anb-row { display: flex; align-items: center; gap: 6px; padding: 4px 6px; border-radius: 14px; background: var(--panel); }
.anb-row .anb-n { flex: 1; }
.anb-row.off .anb-n { color: var(--muted); }
.anb-row.na { opacity: .55; }
.anb-row .flip svg { transform: rotate(180deg); }
.anb-row .h-mini svg { width: 16px; height: 16px; }
.anb-row .h-mini[disabled] { opacity: .3; }
.anb-chk { margin: 0 4px; }
.h-faces.sm { gap: 4px; justify-content: space-between; }
.h-faces.sm .h-face { padding: 2px; }
.hl-sec { margin-bottom: 10px; }
.hl-row { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 12px; background: var(--panel); margin-bottom: 4px; width: 100%; border: 0; color: var(--text); font: inherit; text-align: left; }
.hl-row input[type="time"] { width: 6.4em; }
.hl-ml { display: flex; align-items: center; gap: 4px; flex: 1; }
.hl-ml input { width: 5.5em; }
.hl-n { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.hl-n small { color: var(--muted); }
.hl-t { color: var(--muted); font-variant-numeric: tabular-nums; }
.hl-btn svg { width: 16px; height: 16px; opacity: .5; }
/* 8.3 — «Учёт»: ряд здоровья (вода, лекарства, еда, сон) — меньше сфер и чуть в стороне */
.hq { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin: 4px 0 12px; padding: 6px; border-radius: 18px; background: color-mix(in srgb, var(--panel) 55%, transparent); border: 1px solid color-mix(in srgb, var(--muted) 18%, transparent); }
.hq-b { display: flex; align-items: center; gap: 8px; min-width: 0; height: 52px; padding: 0 10px; border: 0; border-radius: 14px; background: var(--panel); color: var(--text); font: inherit; text-align: left; position: relative; overflow: hidden; }
.hq-ic { width: 30px; height: 30px; flex: none; border-radius: 50%; display: grid; place-items: center; background: color-mix(in srgb, var(--hc) 20%, transparent); color: var(--hc); }
.hq-ic svg { width: 17px; height: 17px; }
.hq-t { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.hq-t b { font-size: 0.86em; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hq-t small { font-size: 0.72em; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hq-b.run { box-shadow: inset 0 0 0 2px var(--hc); }
.hq-b.due { background: color-mix(in srgb, var(--hc) 26%, var(--panel)); animation: hqGlow 1.8s ease-in-out infinite; }
.hq-b.due .hq-ic { background: var(--hc); color: #fff; }
.hq-b.due .hq-t small { color: var(--text); }
@keyframes hqGlow { 0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--hc) 0%, transparent); } 50% { box-shadow: 0 0 0 4px color-mix(in srgb, var(--hc) 38%, transparent); } }
@media (prefers-reduced-motion: reduce) { .hq-b.due { animation: none; } }
.hq-mood { display: flex; align-items: center; gap: 8px; margin: 4px 0 10px; padding: 8px 10px; border-radius: 16px; background: var(--panel); }
.hq-mood > span { font-weight: 600; font-size: 0.9em; white-space: nowrap; }
.hq-mood .h-faces { flex: 1; margin: 0; }
.h-thumb { width: 36px; height: 36px; border-radius: 9px; object-fit: cover; flex: none; }
.hm-photo { position: relative; margin: 4px 0 10px; }
.hm-photo img { width: 100%; max-height: 220px; object-fit: cover; border-radius: 16px; display: block; }
.hm-photo .h-mini { position: absolute; top: 8px; right: 8px; background: rgba(0,0,0,.55); color: #fff; }
.hm-when { margin: 2px 0 10px; }
.ee-meal { display: flex; align-items: center; gap: 10px; width: 100%; margin: 8px 0; padding: 8px 12px; border: 0; border-radius: 14px; background: var(--panel); color: var(--text); font: inherit; text-align: left; }
.ee-meal img { width: 44px; height: 44px; border-radius: 10px; object-fit: cover; }
.ee-meal > svg:first-child { width: 22px; height: 22px; color: #ff6b5e; }
.ee-meal span { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.ee-meal small { color: var(--muted); }
.ee-meal > svg:last-child { width: 16px; height: 16px; opacity: .5; }
.hq-mood .h-faces.sm { display: flex; justify-content: space-between; min-width: 0; }
.hq-mood .h-face { flex: 1 1 0; min-width: 0; padding: 0; display: grid; place-items: center; }
.hq-mood .h-face svg { width: 26px; height: 26px; }
/* 8.4 — ряд здоровья компактный при любом наборе (1 кнопка — тонкая полоса, 2 — в ряд, 3–4 — 2×2) */
.hq { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0 10px; padding: 0; border: 0; background: none; }
.hq-b { flex: 1 1 calc(50% - 3px); height: 44px; padding: 0 10px; border-radius: 13px; gap: 8px; }
.hq[style*="--n:1"] .hq-b, .hq[style*="--n:2"] .hq-b { flex: 1 1 0; }
.hq[style*="--n:3"] .hq-b:last-child { flex-basis: 100%; }
.hq-ic { width: 26px; height: 26px; background: color-mix(in srgb, var(--hc) 22%, transparent); color: color-mix(in srgb, var(--hc) 62%, var(--text)); }
.hq-ic svg { width: 15px; height: 15px; }
.hq-t b { font-size: 0.82em; }
.hq-t small { font-size: 0.7em; }
.te-label { width: 100%; margin-bottom: 6px; }
/* 8.4 — лист задач: дни отделены линией жирнее */
.ln.dsep { box-shadow: inset 0 2px 0 color-mix(in srgb, var(--cal-ink, var(--text)) 32%, transparent); }
/* 8.4 — выбор нескольких строк */
.ln.picked { background: color-mix(in srgb, var(--accent2) 22%, transparent); box-shadow: inset 3px 0 0 var(--accent2); }
.tl-block.picked { outline: 2px solid var(--accent2); outline-offset: 1px; }
.sel-bar { position: fixed; left: 10px; right: 10px; bottom: calc(var(--tabbar-h, 76px) + 14px + env(safe-area-inset-bottom)); z-index: 60; padding: 8px 10px 10px; border-radius: 20px; background: color-mix(in srgb, var(--panel) 96%, transparent); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); border: 1px solid var(--line); box-shadow: 0 10px 30px rgba(0,0,0,.35); }
.sel-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; font-size: 0.9em; }
.sel-x { width: 32px; height: 32px; border-radius: 50%; border: 0; background: var(--panel-2, var(--bg)); color: var(--text); display: grid; place-items: center; }
.sel-x svg { width: 16px; height: 16px; }
.sel-acts { display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; }
.sb-act { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 6px 2px; border: 0; border-radius: 12px; background: none; color: var(--text); font: inherit; font-size: 0.72em; }
.sb-act svg, .sb-act .dot { width: 20px; height: 20px; }
.sb-act .dot { display: inline-block; border-radius: 50%; width: 14px; height: 14px; margin: 3px; }
.sb-act[disabled] { opacity: .35; }
.sb-act.danger { color: #ff453a; }
body[data-selecting="1"] #undoBar, body[data-selecting="1"] .q-btn, body[data-selecting="1"] .mode-float, body[data-selecting="1"] .tk-pager { display: none !important; }
/* 8.4 — поля со временем: уже, одна линия по всей странице; можно справа */
.tcol { --tmw: calc(var(--cal-fs, 15px) * 1.9); }
.tcol .ln-tm { padding-right: 3px; }
.tright .ln-tm { order: 20; margin: 0 -2px 0 2px; padding: 0 0 0 4px; border-right: 0; border-left: 1.5px solid color-mix(in srgb, var(--cal-red) 60%, transparent); align-items: flex-start; }
.tright .ln-dot { order: 19; }
.tright .ln-subn { order: 18; }
.tkcol { --tmw: calc(var(--cal-fs, 15px) * 3.1); }
.tkcol .ln-tm b { font-weight: 600; }
.tkcol .ln-tm.today b:first-child { color: var(--accent2); }
.tkcol .ln-tm.late b:first-child { color: var(--cal-red); }
.cal-daymodal .tright .ln-tm, .cal .tright .ln-tm { margin-left: auto; margin-right: -2px; }
/* 8.4 — длинная строка переносится на свободные линии под ней (одна запись) */
.ln.wrap { align-items: flex-start; }
.ln.wrap .ln-text { white-space: normal; overflow-wrap: anywhere; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; text-overflow: clip; line-height: var(--lh); }
.ln.wrap > .ln-box { margin-top: calc((var(--lh) - 17px) / 2); }
.ln.wrap > .ln-dot { margin-top: calc((var(--lh) - 7px) / 2); }
.ln.wrap > .ln-when, .ln.wrap > .ln-subn, .ln.wrap > .ln-par { margin-top: calc((var(--lh) - 1.5em) / 2); line-height: 1.5; }
.ln.wrap .ln-tm { justify-content: flex-start; padding-top: calc((var(--lh) - 1.2em) / 2); }
.ln.wrapped { display: none !important; }
.tright .ln-tm { margin-left: auto; }
.tright:not(.tkcol) { --tmw: calc(var(--cal-fs, 15px) * 2.2); }
/* ===== 8.5 ===== */
/* плотнее: линия = текст × --lhk (мелкий текст — 1,42) */
.cal { --lh: calc(var(--cal-fs, 15px) * var(--lhk, 1.46)); }
.fit { --lh: calc(var(--cal-fs, 15px) * (var(--lhk, 1.46) - 0.04)); }
.ln { gap: 5px; }
.pg-lines { padding-top: 1px; padding-bottom: 3px; }
/* лист задач: линия между днями — во всю ширину странички */
.ln.dsep { box-shadow: none; position: relative; overflow: visible; }
.ln.dsep::before { content: ""; position: absolute; left: -10px; right: -10px; top: -1px; height: 2px; background: color-mix(in srgb, var(--cal-ink, var(--text)) 32%, transparent); pointer-events: none; }
/* поля справа: время целиком, без обрезки (колонка шире, само время на месте) */
.tright:not(.tkcol) { --tmw: calc(var(--cal-fs, 15px) * 2.5); }
.tright .ln-tm { overflow: visible; padding-right: 2px; }
.tcol .ln-tm b { overflow: visible; }
/* закреплённое и задачи — одинаковые плашки */
.pin-banner, .cal-daymodal .pin-banner.pb-grid, .cal-daymodal .task-banner.pb-grid { border-radius: 14px; padding: 5px 8px 5px 10px; }
.pin-banner + .task-banner { margin-top: -4px; }
/* «что сейчас» и выбор календаря / листа — одинаково в блокноте и расписании */
.cal-now-row, .cal-now-row.grid { margin: 0 2px 6px; min-height: 28px; align-items: center; }
.cal-now-row .cal-now { height: 28px; padding-left: 2px; font-size: 0.72em; }
.cal-target { height: 28px; }
/* выбор нескольких: панель сверху (не закрывает строки), выбранные видно и в расписании */
.sel-bar { top: calc(env(safe-area-inset-top) + 6px); bottom: auto; }
body[data-selecting="1"] .cal-head, body[data-selecting="1"] .dm-top .cal-head { visibility: hidden; }
.ln.sel-on { background: color-mix(in srgb, var(--accent2) 22%, transparent); box-shadow: inset 3px 0 0 var(--accent2); }
.tl-block.sel-on { box-shadow: 0 0 0 2px var(--accent2); z-index: 4; }
/* правка строки: время и дата подчёркнуты и в поле ввода */
.ln-mirror { position: absolute; left: 0; right: 0; top: 0; z-index: 2; pointer-events: none; padding: 0 4px; margin: 0; line-height: var(--lh); font: inherit; font-size: var(--cal-fs, 15px); color: transparent; white-space: pre-wrap; overflow-wrap: anywhere; overflow: hidden; }
.ln-mirror u { text-decoration: underline; text-decoration-color: var(--cal-ink, var(--text)); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.hm-textrow { display: flex; gap: 6px; align-items: flex-start; }
.hm-textrow textarea { flex: 1; }
.hm-mic.rec { background: #ff453a; color: #fff; animation: hqGlow 1.2s infinite; --hc: #ff453a; }
/* настройки: разделы и поиск */
.set-search { display: flex; align-items: center; gap: 8px; margin: 8px 0 10px; padding: 0 10px 0 12px; height: 44px; border-radius: 14px; background: var(--panel); }
.set-search > svg { width: 18px; height: 18px; color: var(--muted); flex: none; }
.set-search input { flex: 1; min-width: 0; border: 0 !important; background: none !important; padding: 0 !important; height: 40px; font: inherit; color: var(--text); box-shadow: none !important; }
.set-ai { display: inline-flex; align-items: center; gap: 4px; border: 0; border-radius: 10px; padding: 6px 10px; background: color-mix(in srgb, #ffd60a 18%, var(--panel)); color: var(--text); font: inherit; font-size: 0.8em; }
.set-ai svg { width: 14px; height: 14px; color: #ffd60a; }
.set-sec { margin-bottom: 8px; border-radius: 16px; background: var(--panel); overflow: hidden; }
.set-sec > summary { list-style: none; display: flex; align-items: center; gap: 12px; padding: 14px 14px; cursor: pointer; }
.set-sec > summary::-webkit-details-marker { display: none; }
.set-sec > summary b { flex: 1; font-size: 1.02em; }
.ss-ic { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; background: color-mix(in srgb, var(--accent2) 18%, transparent); color: var(--accent2); }
.ss-ic svg { width: 17px; height: 17px; }
.ss-arrow svg { width: 16px; height: 16px; color: var(--muted); transition: transform .2s; }
.set-sec[open] .ss-arrow svg { transform: rotate(90deg); }
.set-sec-body { padding: 0 8px 8px; }
.set-sec-body > .card { margin: 0 0 8px; background: var(--bg); }
.set-hide { display: none !important; }
/* размер кнопок (⚙ → Вид) */
.hq-b { height: calc(44px * var(--btn-k, 1)); font-size: calc(1em * var(--btn-k, 1)); }
.hq-ic { width: calc(26px * var(--btn-k, 1)); height: calc(26px * var(--btn-k, 1)); }
.sb { font-size: calc(1em * var(--btn-k, 1)); }
.grid-small .sb { min-height: calc(48px * var(--btn-k, 1)); }
.grid-main { grid-auto-rows: minmax(calc(48px * var(--btn-k, 1)), 1fr); }
/* долгое нажатие на кнопки ряда здоровья — без выделения текста на экране */
.hq, .hq-b, .hq-b * { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
/* правка секундомера: блоки «Название · Время · Сфера» */
.te-sec { background: var(--panel-2, color-mix(in srgb, var(--text) 5%, transparent)); border-radius: 16px; padding: 10px 10px 8px; margin-bottom: 10px; }
.te-cap { font-size: 0.72em; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); margin: 0 2px 6px; }
.te-sec .te-label { margin: 0 0 6px; }
.te-adj { display: grid; grid-template-columns: repeat(6, 1fr); gap: 4px; margin-bottom: 8px; }
.te-adj button { height: 38px; border: 0; border-radius: 11px; background: var(--panel); color: var(--text); font: inherit; font-weight: 600; font-variant-numeric: tabular-nums; }
.te-adj button.minus { color: var(--down, #fb7185); }
.te-adj button.plus { color: var(--up, #34d399); }
.te-time { display: flex; gap: 6px; align-items: center; }
.te-time label { display: flex; align-items: center; gap: 4px; }
.te-time input[type="number"] { width: 56px; text-align: center; }
.te-time .te-start { flex: 1; justify-content: flex-end; }
.te-time .te-start input { width: 100px; }
.te-time span { color: var(--muted); font-size: 0.85em; }
.te-sps { max-height: 150px; overflow-y: auto; }
.te-foot { margin-top: 4px; }
/* журнал: здоровье в истории дня */
.row-entry .dot.hj { width: 18px; height: 18px; border-radius: 6px; display: inline-grid; place-items: center; background: none !important; }
.row-entry.hrow .dot.hj svg { width: 15px; height: 15px; }
.re-meal { display: inline-flex; align-items: center; gap: 4px; color: var(--muted); font-size: 0.85em; margin-left: 4px; }
.re-meal img, .re-thumb { width: 22px; height: 22px; border-radius: 6px; object-fit: cover; vertical-align: middle; margin-right: 4px; }
.clock-food { position: absolute; left: 44px; bottom: 6px; width: 40px; height: 40px; border-radius: 50%; border: 0; background: color-mix(in srgb, #ff6b5e 22%, transparent); color: #ff6b5e; display: grid; place-items: center; padding: 0; overflow: hidden; }
.clock-food svg { width: 20px; height: 20px; }
.clock-food img { width: 100%; height: 100%; object-fit: cover; }
.clock-food.has { box-shadow: 0 0 0 2px #ff6b5e; }
.h-thumb.sm { width: 26px; height: 26px; border-radius: 7px; }
/* лекарство: «−» в уголке ячейки, строки «каждые / если нужно» */
.mt-cw { position: relative; display: block; }
.mt-cw.chipw { display: inline-block; }
.mt-cw .mt-c { width: 100%; }
.mt-minus { position: absolute; top: -6px; right: -6px; width: 22px; height: 22px; border-radius: 50%; border: 0; background: var(--bg); color: var(--text); font-size: 15px; line-height: 1; display: grid; place-items: center; padding: 0; box-shadow: 0 1px 4px rgba(0,0,0,.35); z-index: 2; }
.mf-line { display: flex; align-items: baseline; gap: 8px; margin: 8px 0 0; }
.mf-cap { flex: 0 0 74px; font-size: 0.78em; color: var(--muted); }
.mf-line .chips { flex: 1; min-width: 0; gap: 5px; }
.mf-line .chip { padding: 5px 10px; font-size: 0.85em; }
/* вес: по вертикали — кг (верх и низ), минимально */
.h-wchart { padding-right: 36px; }
.h-wchart .wy { position: absolute; right: 0; font-size: 0.68em; color: var(--muted); font-variant-numeric: tabular-nums; line-height: 1; }
.h-wchart .wy.hi { top: 2px; }
.h-wchart .wy.lo { top: 52px; }
.h-wchart .wy::after { content: " кг"; opacity: .7; }
.h-week-wrap { display: flex; align-items: center; gap: 2px; }
.h-week-wrap .h-week { flex: 1; min-width: 0; }
.h-wk-arr { flex: 0 0 26px; height: 40px; border: 0; background: none; color: var(--muted); display: grid; place-items: center; padding: 0; }
.h-wk-arr svg { width: 16px; height: 16px; }
.h-wk-arr[disabled] { opacity: .25; }
.h-week-cap { font-size: 0.72em; color: var(--muted); margin: 2px 4px 8px; text-align: center; }

/* ---------- 8.5: поля «серым», временные сферы, листы без мигания ---------- */
.sheet.still { animation: none; }
input.ghosting, textarea.ghosting { color: var(--gray) !important; -webkit-text-fill-color: var(--gray); }
.sb.temp { background: color-mix(in srgb, var(--c) 62%, transparent); box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--fg) 55%, transparent); outline: 2px dashed var(--c); outline-offset: 2px; }
.sb.temp::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: repeating-linear-gradient(-45deg, transparent 0 7px, color-mix(in srgb, var(--fg) 10%, transparent) 7px 9px); }
.hs-add { margin-top: 12px; gap: 8px; }
.hs-add .btn { flex-direction: row; flex-wrap: wrap; justify-content: center; align-content: center; gap: 2px 6px; line-height: 1.15; height: auto; min-height: 54px; padding: 8px 10px; }
.hs-add .btn .ic, .hs-add .btn svg { width: 1.05em; height: 1.05em; }
.hs-add small { flex-basis: 100%; text-align: center; }
.hs-add .temp-new { border: 1.5px dashed var(--line); background: transparent; }
.hs-add small { font-size: 0.68em; font-weight: 500; }
.toast { touch-action: none; }

/* ---------- 8.6 ---------- */
/* плашка повтора: не ниже букв (в XS линия низкая — фон был обрезан по буквам) */
.ln-pill { line-height: min(calc(var(--lh) - 2px), max(1.28em, calc(var(--lh) - 8px))); padding-top: 0; padding-bottom: 0; vertical-align: middle; }
/* время слева: «11:30», «20:30» целиком */
.tcol:not(.tkcol):not(.tright) { --tmw: calc(var(--cal-fs, 15px) * 2.08); }
.tcol:not(.tright) .ln-tm { margin-left: 0; padding-right: 3px; letter-spacing: -0.03em; overflow: visible; }
.cal-daymodal .tcol .ln-tm { margin-left: 0; }
/* закреплённое и задача — одной высоты в блокноте и в расписании */
.pin-banner:is(.pb-cal, .pb-grid), .cal-daymodal .pin-banner:is(.pb-cal, .pb-grid), .cal-daymodal.is-main .pin-banner.pb-grid { font-size: calc(16px * var(--font-scale)); padding: 4px 8px 4px 10px; margin: 0 0 6px; border-radius: 14px; }
.pin-banner:is(.pb-cal, .pb-grid) + .task-banner { margin-top: -2px; }
.pin-banner:is(.pb-cal, .pb-grid) .pin-row { min-height: 0; }
.pin-banner:is(.pb-cal, .pb-grid) .pin-main, .cal-daymodal.is-main .pin-banner.pb-grid .pin-main { padding: 2px 0; gap: 8px; align-items: stretch; min-height: 0; }
.pin-banner:is(.pb-cal, .pb-grid) .pin-main > span { display: flex; flex-direction: column; justify-content: center; line-height: 1.22; gap: 1px; min-width: 0; -webkit-line-clamp: unset; }
.pin-banner:is(.pb-cal, .pb-grid) .pin-cap { display: block; margin: 0; font-size: 0.68em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pin-banner:is(.pb-cal, .pb-grid) .pin-main b { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 0.86em; }
.pin-banner:is(.pb-cal, .pb-grid) .pin-bars { min-height: 26px; flex-basis: 3.5px; }
.pin-banner:is(.pb-cal, .pb-grid) .task-check { font-size: 1.1em; align-self: center; }
/* короткие странички (выходные): прокрутка — ровно по линиям, без половинок строк */
.pg-lines.scroll { scroll-snap-type: y mandatory; }
.pg-lines.scroll .ln { scroll-snap-align: start; }
/* ---------- 8.6: «все записи» одного вида ---------- */
.h-head-btn { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; border: 0; background: none; color: inherit; font: inherit; text-align: left; padding: 0; cursor: pointer; }
.hh-kinds { margin: 0 -2px 8px; }
.hh-kinds .chip.on { background: color-mix(in srgb, var(--hc) 24%, var(--panel-2)); color: var(--text); box-shadow: inset 0 0 0 1.5px var(--hc); }
.hh-kinds .h-ic.xs { color: var(--hc); }
.hh-nav { display: flex; align-items: center; gap: 6px; margin: 2px 0 10px; }
.hh-nav b { flex: 1; text-align: center; font-size: 0.92em; }
.hh-add { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 8px; border-radius: 14px; background: var(--panel-2); margin-bottom: 10px; }
.hh-add .chips { flex: 1 1 100%; margin: 0; }
.hh-when { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; flex: 1 1 auto; }
.hh-when input, .hh-add > input, .hh-row input[type="time"], .hh-row input[type="date"] { height: 34px; padding: 0 8px; border-radius: 10px; font-variant-numeric: tabular-nums; }
.hh-row input[type="time"] { width: 6.2em; flex: 0 0 auto; }
.hh-row input[type="date"] { width: 9.6em; flex: 0 0 auto; }
.hh-g { margin-bottom: 10px; }
.hh-gh { display: flex; justify-content: space-between; align-items: baseline; width: 100%; border: 0; background: none; color: var(--muted); font: inherit; font-size: 0.78em; font-weight: 600; padding: 4px 4px 4px 2px; text-transform: none; }
.hh-gh small { font-weight: 500; color: var(--gray); }
.hh-row { display: flex; align-items: center; gap: 8px; padding: 6px 6px 6px 8px; border-radius: 12px; background: var(--panel-2); margin-bottom: 4px; width: 100%; border: 0; color: var(--text); font: inherit; text-align: left; min-height: 46px; }
.hh-row.hl { box-shadow: inset 0 0 0 2px var(--accent2); }
.hh-row.ok .hh-n b::after { content: " ✓"; color: var(--up); }
.hh-row.skip { opacity: 0.6; }
.hh-row.missed .hh-n small { color: var(--down); }
.hh-row.ghost { background: transparent; border: 1.5px dashed var(--line); }
.hh-row.run { box-shadow: inset 0 0 0 1.5px var(--hc, var(--accent2)); }
.hh-n { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.hh-n b { font-size: 0.92em; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hh-n small { font-size: 0.72em; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hh-t { font-variant-numeric: tabular-nums; font-size: 0.86em; width: 3.2em; color: var(--muted); }
.hh-txt { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; border: 0; background: none; color: inherit; font: inherit; text-align: left; padding: 0; }
.hh-txt span { display: flex; flex-direction: column; min-width: 0; }
.hh-txt b { font-size: 0.9em; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hh-txt small { font-size: 0.72em; color: var(--muted); }
.hh-num { display: flex; align-items: center; gap: 4px; flex: 1; min-width: 0; }
.hh-num input { width: 5.4em; height: 34px; padding: 0 8px; border-radius: 10px; }
.hh-num span { font-size: 0.8em; color: var(--muted); }
.hh-lbl { display: inline-flex; align-items: center; gap: 4px; font-size: 0.78em; color: var(--muted); }
.hh-lbl b { font-size: 1.05em; color: var(--text); font-weight: 600; }
.hh-dur { margin-left: auto; font-size: 0.78em; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.hh-del { margin-left: auto; width: 30px; height: 30px; border-radius: 10px; background: transparent; }
.hh-dur + .hh-del { margin-left: 0; }
.hh-none { color: var(--gray); font-size: 0.8em; margin: 2px 4px 8px; }
.hh-btn svg:last-child { width: 15px; height: 15px; color: var(--gray); flex: 0 0 auto; }
.hh-syms { color: var(--muted); font-size: 0.74em; display: block; margin: 2px 4px 0; }
.hh-mood .h-faces { justify-content: space-between; }
.hh-btn .dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 2px; }
/* пропущенные дни «по среднему» — пунктиром */
.h-col.ghost i, .h-mb.ghost i { background: transparent !important; border: 1.5px dashed color-mix(in srgb, var(--hc) 70%, transparent); border-bottom: 0; box-sizing: border-box; }
.h-wcol i.ghost { background: transparent; border: 1.5px dashed color-mix(in srgb, var(--hc) 70%, transparent); box-sizing: border-box; }
.h-lg.ghost { display: inline-block; flex: 0 0 auto; width: 14px; height: 10px; vertical-align: -1px; background: transparent; border: 1.5px dashed var(--hc); border-radius: 3px; }
.h-big.ghost b { color: var(--muted); }
.h-col[data-action], .h-wcol[data-action], .h-mb[data-action], .h-moodline i[data-action], .h-dots i[data-action], .h-cups[data-action] { cursor: pointer; }
.h-col[data-action]:active i, .h-wcol[data-action]:active i { filter: brightness(1.3); }
/* разница с прошлым периодом */
.h-dl { font-style: normal; font-size: 0.64em; font-weight: 600; color: var(--muted); margin-top: 1px; }
.h-dl.up { color: var(--up); }
.h-dl.down { color: var(--down); }
/* месяц — сетка по неделям */
.h-heat { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin: 4px 0 8px; }
.h-heat > b { font-size: 0.6em; font-weight: 500; color: var(--gray); text-align: center; }
.h-heat > i { display: block; }
.hm-c { position: relative; aspect-ratio: 1 / 0.82; border-radius: 8px; background: color-mix(in srgb, var(--text) 6%, transparent); display: grid; place-items: center; cursor: pointer; overflow: hidden; }
.hm-c.has { background: color-mix(in srgb, var(--hb, var(--hc)) calc(var(--p) * 85%), color-mix(in srgb, var(--text) 6%, transparent)); }
.hm-c.ok { box-shadow: inset 0 0 0 1.5px var(--hc); }
.hm-c.ghost { background: transparent; border: 1.5px dashed color-mix(in srgb, var(--hc) 65%, transparent); }
.hm-c.today small { font-weight: 800; text-decoration: underline; }
.hm-c small { font-size: 0.66em; color: var(--text); font-variant-numeric: tabular-nums; opacity: 0.9; }
.h-pct { flex: 1; height: 8px; border-radius: 4px; background: color-mix(in srgb, var(--text) 8%, transparent); overflow: hidden; }
.h-pct i { display: block; height: 100%; background: var(--hc); border-radius: 4px; }
.h-pct-n { font-size: 0.74em; width: 3em; text-align: right; font-variant-numeric: tabular-nums; }
.hh-sl input[type="time"] { width: 5.6em; }
.hh-arr { color: var(--gray); font-size: 0.85em; }
.hh-run { font-size: 0.82em; color: var(--hc, var(--accent2)); }
.hh-row input[type="time"], .hh-when input[type="time"] { min-width: 5.4em; }
.hh-row input[type="time"]::-webkit-calendar-picker-indicator, .hh-when input[type="time"]::-webkit-calendar-picker-indicator { display: none; }
.hh-add .hh-num { flex: 0 0 auto; }
.hh-add .hh-num input { width: 5em; }
.chip-input.mf-own { flex: 0 0 auto; }
.chip-input.mf-own input { width: 3.4em !important; flex: 0 0 auto; color: inherit !important; -webkit-text-fill-color: currentColor; }
.chip-input.mf-own input[type="time"] { width: 5.4em !important; }
.chip-input.on input, .chip-input.on input::placeholder { color: inherit; }
.ce-rare .chip-input input { width: 3em !important; }
.mt-c.edit { box-shadow: 0 0 0 2px var(--accent2); }
/* мелкий шрифт календаря — и вкладки дней мельче: в неделю помещается больше строк */
.fit .pg-tab { font-size: calc(var(--cal-fs, 15px) * 0.84); }
.fit .half .pg-tab { font-size: calc(var(--cal-fs, 15px) * 0.76); }
.fit .book { row-gap: calc(var(--cal-fs, 15px) * 0.45); }

/* ---------- 8.7: шапка календаря одинаковая в блокноте и расписании, всё чуть выше; плавающие кнопки ниже ---------- */
#calPage > .cal-head, #dayPage .cal-head { margin-bottom: 0 !important; }
#calPage .cal-now-row, #dayPage .cal-now-row, .cal-now-row.grid { margin: 4px 2px 4px !important; min-height: 26px; height: 26px; }
#calPage .pin-banner:is(.pb-cal, .pb-grid), #dayPage .pin-banner:is(.pb-cal, .pb-grid) { margin: 0 0 4px !important; }
#calPage .pin-banner + .task-banner, #dayPage .pin-banner + .task-banner { margin-top: 0 !important; }
:root { --float-gap: 4px; }
.undo-bar, .tk-pager, .mode-float, .q-btn, .zoom-float:not(.up) { bottom: calc(var(--reserve) + var(--float-gap)) !important; }
body[data-calfit="1"]:not([data-dock="1"]) .view { bottom: calc(var(--reserve) + var(--cap-h) + 8px); }
body:has(.view .mode-float) .zoom-float { bottom: calc(var(--reserve) + var(--float-gap) + var(--cap-h) + 8px) !important; }
/* выходные: вкладка дня ниже и плотнее — в субботу и воскресенье на строку больше */
.fit .wk-end { gap: 2px; }
.fit .half .pg-tab { padding: 1px 7px 0; font-size: calc(var(--cal-fs, 15px) * 0.7); line-height: 1.25; }
.fit .half .pg-tab b { font-size: 1.1em; }

/* ---------- 8.7: лекарства — столбцы приёмов, таблица, кнопка на «Учёте» ---------- */
.mc-row { display: flex; gap: 8px; overflow-x: auto; padding: 2px 2px 6px; margin: 0 -2px 4px; scrollbar-width: none; }
.mc-row::-webkit-scrollbar { display: none; }
.mc { position: relative; flex: 0 0 132px; display: flex; flex-direction: column; gap: 6px; padding: 8px; border-radius: 14px; background: var(--panel-2); border: 1.5px solid transparent; }
.mc.on { border-color: var(--accent2); }
.mc-k { border: 0; background: none; color: var(--text); font: inherit; text-align: left; padding: 0 18px 0 0; display: flex; flex-direction: column; min-height: 36px; }
.mc-k b { font-size: 0.84em; line-height: 1.15; }
.mc-k small { font-size: 0.68em; color: var(--muted); margin-top: 2px; }
.mc-n { display: flex; align-items: center; gap: 4px; }
.mc-n button { flex: 0 0 30px; height: 30px; border-radius: 9px; border: 0; background: var(--panel); color: var(--text); font-size: 1.1em; font-weight: 600; }
.mc-n input { flex: 1; min-width: 0; width: 100%; height: 30px; text-align: center; padding: 0 2px !important; border-radius: 9px; font-weight: 700; font-variant-numeric: tabular-nums; }
.mc-u { font-size: 0.7em; color: var(--muted); text-align: center; margin-top: -2px; }
.mc-del { position: absolute; top: 6px; right: 6px; width: 22px; height: 22px; border-radius: 7px; border: 0; background: transparent; color: var(--gray); display: grid; place-items: center; padding: 0; }
.mc-del svg { width: 13px; height: 13px; }
.mc-add { flex: 0 0 74px; align-items: center; justify-content: center; border: 1.5px dashed var(--line); background: transparent; color: var(--muted); font: inherit; font-size: 0.8em; }
.mc-add svg { width: 20px; height: 20px; }
.mc-picker { padding: 8px; border-radius: 14px; background: var(--panel-2); margin-bottom: 10px; display: flex; flex-direction: column; gap: 6px; }
.mp-g { display: flex; align-items: center; gap: 8px; }
.mp-g .mf-cap, .mc-picker .mf-cap { flex: 0 0 64px; font-size: 0.72em; color: var(--muted); }
.mp-g .chips { margin: 0; gap: 6px; }
.mc-picker .chip.used { opacity: 0.45; }
.mf-days { display: flex; align-items: center; gap: 4px; margin: 6px 0 10px; flex-wrap: wrap; }
.mf-days > span { width: 34px; height: 38px; border-radius: 10px; background: var(--panel-2); display: flex; flex-direction: column; align-items: center; justify-content: center; color: var(--gray); line-height: 1.1; }
.mf-days > span small { font-size: 0.6em; }
.mf-days > span b { font-size: 0.82em; }
.mf-days > span.on { background: color-mix(in srgb, #ff9f0a 26%, var(--panel-2)); color: var(--text); }
.mf-from { margin-left: auto; }
.mf-note { width: 100%; min-height: 40px; margin: 4px 0 10px; border-radius: 12px; padding: 9px 12px; font: inherit; font-size: 0.86em; resize: none; }
.hta-due { font-size: 0.82em; color: var(--muted); margin: -2px 0 8px; }
.hta-due b { color: var(--text); }
/* кнопка лекарства: ✕ — пропустить */
.hq-b.has-skip { padding-right: 40px; position: relative; }
.hq-skip { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 30px; height: 30px; border-radius: 10px; display: grid; place-items: center; background: color-mix(in srgb, var(--text) 10%, transparent); color: var(--text); }
.hq-skip svg { width: 14px; height: 14px; }
/* таблица приёмов */
.mtab-wrap { overflow: auto; max-height: 62vh; margin: 6px -4px 8px; border-radius: 12px; border: 1px solid var(--line); -webkit-overflow-scrolling: touch; }
.mtab { border-collapse: separate; border-spacing: 0; font-size: 0.82em; min-width: 100%; }
.mtab th, .mtab td { border-bottom: 1px solid var(--line); border-right: 1px solid var(--line); vertical-align: top; padding: 6px; background: var(--panel); }
.mtab thead th { position: sticky; top: 0; z-index: 2; background: color-mix(in srgb, #ff9f0a 16%, var(--panel)); min-width: 132px; text-align: left; }
.mtab .mt-d { position: sticky; left: 0; z-index: 1; min-width: 46px; width: 46px; text-align: center; background: var(--panel); }
.mtab thead .mt-d { z-index: 3; }
.mtab .mt-d b { display: block; font-size: 1.15em; }
.mtab .mt-d small { color: var(--muted); font-size: 0.74em; font-weight: 500; }
.mtab tr.we th, .mtab tr.we td { background: color-mix(in srgb, var(--text) 4%, var(--panel)); }
.mtab tr.today th, .mtab tr.today td { background: color-mix(in srgb, var(--accent2) 12%, var(--panel)); }
.mtab td.off { color: var(--gray); text-align: center; }
.mt-h { border: 0; background: none; color: var(--text); font: inherit; padding: 0; text-align: left; display: flex; flex-direction: column; }
.mt-h small { color: var(--muted); font-weight: 400; font-size: 0.82em; }
.mt-x { display: flex; align-items: flex-start; gap: 6px; width: 100%; border: 0; background: none; color: var(--text); font: inherit; text-align: left; padding: 2px 0; }
.mt-x i { flex: 0 0 16px; height: 16px; border-radius: 5px; border: 1.5px solid var(--gray); display: grid; place-items: center; font-style: normal; font-size: 0.8em; margin-top: 1px; }
.mt-x i svg { width: 12px; height: 12px; }
.mt-x.taken i { border-color: var(--up); background: var(--up); color: #fff; }
.mt-x.missed i { border-color: var(--down); color: var(--down); }
.mt-x.skipped { opacity: 0.55; }
.mt-x span { display: flex; flex-direction: column; line-height: 1.25; }
.mt-x span small { color: var(--muted); font-size: 0.82em; }
.mt-prn { display: block; color: var(--muted); font-size: 0.78em; margin-top: 2px; }
.mt-per { margin-bottom: 6px; }
.mt-exp { margin-top: 4px; }
.h-medrow { padding: 8px 0; border-top: 1px solid var(--line); }
.h-medrow-h { display: flex; align-items: baseline; justify-content: space-between; width: 100%; border: 0; background: none; color: var(--text); font: inherit; padding: 0; margin-bottom: 6px; }
.h-medrow-h em { font-style: normal; font-weight: 700; font-size: 0.9em; }
.h-medrow-h em.up { color: var(--up); }
.h-medrow-h em.down { color: var(--down); }
.h-medrow-s { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-top: 6px; }
.h-medrow-s small { font-size: 0.72em; color: var(--muted); }
.h-course { flex: 0 0 72px; height: 6px; border-radius: 3px; background: color-mix(in srgb, var(--text) 10%, transparent); overflow: hidden; }
.h-course i { display: block; height: 100%; background: var(--hc); }
/* активная вкладка показывает, куда переключит повторный тап */
.tab.on.alt span { font-size: 0.92em; }
.chip-input.mf-own input[type="date"] { width: 7.4em !important; }
.mt-dates { flex-wrap: nowrap; gap: 8px; }
.mt-dates label { min-width: 0; flex: 1 1 0; }
.mt-dates input { min-width: 0; width: 100%; }
/* ---------- 8.7: верхние кнопки на всех вкладках — на одной высоте (8 px) и одного размера (46) ---------- */
.an-sticky { padding-top: 0; top: 0; }
.an-sticky .pbar { margin-top: 0; }
.pb-group { padding: 3px; border-radius: 13px; }
.pbar .pb { height: 40px; }
.view-add .page-head { height: var(--btn); min-height: var(--btn); }
.view.view-set > .page.set > .page-head { padding-top: calc(env(safe-area-inset-top) + 8px); }

/* ---------- 8.8: лекарства — мера, вместе / по очереди, протокол по фото ---------- */
.mf-units { align-items: center; margin-top: -2px; }
.mf-units .mf-cap { flex: 0 0 auto; font-size: 0.72em; color: var(--muted); margin-right: 2px; }
.mf-pu { flex: 0 0 auto; }
.mp-hint { font-size: 0.78em; color: var(--muted); margin: 0 2px 6px; }
.mp-auto .chip { font-weight: 600; }
.mf-line .mf-cap { flex: 0 0 86px; }
.hh-skip { width: 32px; height: 32px; border-radius: 10px; flex: 0 0 auto; }
.mt-empty { display: flex; flex-direction: column; gap: 8px; margin: 8px 0; }
.rx-list { display: flex; flex-direction: column; gap: 6px; margin: 8px 0 10px; }
.rx-row { display: flex; align-items: flex-start; gap: 10px; padding: 10px; border-radius: 14px; background: var(--panel-2); }
.rx-row.h-unsure { box-shadow: inset 0 0 0 1.5px var(--warn); }
.rx-box { flex: 0 0 24px; height: 24px; border-radius: 7px; border: 1.5px solid var(--gray); background: transparent; color: #fff; display: grid; place-items: center; padding: 0; margin-top: 2px; }
.rx-box.on { background: var(--accent2); border-color: var(--accent2); }
.rx-box svg { width: 15px; height: 15px; }
.rx-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; border: 0; background: none; color: var(--text); font: inherit; text-align: left; padding: 0; }
.rx-main small { color: var(--muted); font-size: 0.78em; line-height: 1.3; }
.ep-banner .btn-row { flex-wrap: wrap; }

/* ---------- 8.9 ---------- */
/* «что ем» — справа под карандашом, не на цифрах секундомера */
.clock-stack { position: absolute; right: 0; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; align-items: center; gap: 4px; }
.clock-stack .clock-edit { position: static; padding: 4px; }
.clock-stack .clock-food { position: static; width: 34px; height: 34px; }
/* прокрутка коротких страничек: мягкая привязка к линиям, при вводе — без прыжков */
.pg-lines.scroll { scroll-snap-type: y proximity; }
.pg-lines.grow, .pg-lines:has(.editing), .pg-lines:has(#lnInput) { scroll-snap-type: none; }
.mt-view { margin: 4px 0 8px; }
.mlist { display: flex; flex-direction: column; gap: 8px; margin-bottom: 8px; }
.ml-day { border-radius: 14px; background: var(--panel-2); padding: 6px 8px; }
.ml-day.today { box-shadow: inset 0 0 0 1.5px var(--accent2); }
.ml-h { font-size: 0.8em; color: var(--muted); padding: 2px 2px 4px; }
.ml-h b { color: var(--text); font-size: 1.15em; margin-right: 2px; }
.ml-row { display: flex; align-items: center; gap: 10px; padding: 6px 2px; border-top: 1px solid var(--line); }
.ml-row:first-of-type { border-top: 0; }
.ml-t { flex: 0 0 3em; font-variant-numeric: tabular-nums; font-weight: 700; font-size: 0.9em; }
.ml-n { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.ml-n b { font-size: 0.9em; }
.ml-n small { color: var(--muted); font-size: 0.76em; }
.ml-row.mt-x i { order: 3; }
.mtab thead th { min-width: 150px; }
.mt-x span { white-space: normal; }
/* 8.9 · еда — отметкой, фото приёма пищи */
.h-wcol.food i.flag { height: 7px; margin-top: -3px; border-radius: 4px; left: 6%; right: 6%; }
.hm-photos { display: flex; gap: 8px; overflow-x: auto; padding: 2px 0 10px; scrollbar-width: none; }
.hm-photos::-webkit-scrollbar { display: none; }
.hm-ph { flex: 0 0 auto; position: relative; width: 78px; height: 104px; border-radius: 14px; overflow: hidden; padding: 0; border: 0; background: var(--panel-2); color: var(--muted); display: grid; place-items: center; }
.hm-photos.sm .hm-ph { width: 54px; height: 72px; border-radius: 12px; }
.hm-ph img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hm-ph.main { box-shadow: 0 0 0 2.5px var(--accent); }
.hm-ph.add svg { width: 24px; height: 24px; }
.hm-ph .hm-star { position: absolute; top: 4px; right: 4px; width: 18px; height: 18px; color: #ffcc00; filter: drop-shadow(0 1px 2px rgba(0,0,0,.5)); }
.hm-ph .hm-star svg, .hm-cstar svg { width: 100%; height: 100%; }
.hm-cstar { display: inline-block; width: 13px; height: 13px; color: #ffb800; margin-right: 4px; vertical-align: -1px; }
.hm-favb { color: var(--muted); }
.hm-favb.on { color: #ffb800; }
.h-cam-row { display: flex; gap: 8px; align-items: stretch; }
.h-cam-row .h-cam { flex: 1; }
.h-cam-row .h-cam.sq { flex: 0 0 76px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; }
.h-cam-row .h-cam.sq small { font-size: 11px; color: var(--muted); }
.hp-view { margin: 4px 0 8px; border-radius: 16px; overflow: hidden; background: #000; display: grid; place-items: center; max-height: 58vh; }
.hp-view img { max-width: 100%; max-height: 58vh; object-fit: contain; display: block; }
/* 8.9 · цепочка сфер */
.chain-bar { display: flex; align-items: center; gap: 6px; margin: 8px auto 0; max-width: 100%; overflow-x: auto; scrollbar-width: none; border: 0; background: none; padding: 2px 4px; color: var(--muted); font: inherit; }
.chain-bar::-webkit-scrollbar { display: none; }
.chain-bar > svg { width: 16px; height: 16px; flex: none; }
.ch-pg { flex: none; display: inline-flex; align-items: baseline; gap: 5px; padding: 4px 9px; border-radius: 10px; background: var(--panel-2); color: var(--text); font-size: 13px; border-left: 3px solid var(--hc, var(--line)); white-space: nowrap; }
.ch-pg b { font-variant-numeric: tabular-nums; font-weight: 700; }
.ch-pg.now { border-left: 0; background: none; color: var(--muted); padding-left: 2px; }
.ch-pg small { color: var(--muted); font-size: 11px; }
.ch-more { font-size: 12px; color: var(--muted); }
.chain-box { border-radius: 16px; background: var(--panel-2); padding: 10px 12px 12px; margin: 0 0 12px; }
.ch-cap { display: flex; align-items: center; gap: 6px; font-weight: 700; font-size: 14px; }
.ch-cap svg { width: 16px; height: 16px; }
.ch-q { font-size: 13px; color: var(--muted); margin: 8px 0 4px; }
.chain-box .chips { margin-bottom: 2px; }
.chain-box .chip-input input { width: auto; min-width: 0; border: 0; background: none; color: inherit; font: inherit; padding: 0; }
.chain-box .chip-input input[type="number"] { width: 3.2em; text-align: center; }
.chain-box .btn.wide { margin-top: 10px; }
.ch-row { display: flex; align-items: center; gap: 10px; padding: 10px 2px; border-bottom: 1px solid var(--line); }
.ch-row .ch-t { min-width: 64px; font-variant-numeric: tabular-nums; }
.ch-row .grow { display: flex; flex-direction: column; }
.ch-row small { color: var(--muted); font-size: 12px; }
.ch-row.done { opacity: .5; }
.ch-row.run .ch-t { color: var(--accent); }
/* 8.9 · отдых */
.rest-banner, .h-rest { display: flex; align-items: center; gap: 12px; width: 100%; border: 0; border-radius: 16px; padding: 10px 14px; margin: 6px 0 8px; font: inherit; text-align: left; color: var(--text); background: color-mix(in srgb, #ffb340 18%, var(--panel)); }
.rest-banner svg, .h-rest svg { width: 22px; height: 22px; color: #ff9f0a; flex: none; }
.rest-banner span, .h-rest span { display: flex; flex-direction: column; }
.rest-banner small, .h-rest small { color: var(--muted); font-size: 12px; }
.rest-banner.sm { padding: 8px 12px; }
.rest-tag { font-size: 11px; font-weight: 600; color: #ff9f0a; background: color-mix(in srgb, #ffb340 18%, transparent); border-radius: 6px; padding: 1px 6px; margin-left: 6px; vertical-align: 1px; }
.rest-list { margin-bottom: 10px; }
.rest-row { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.rest-row .grow { display: flex; flex-direction: column; flex: 1; }
.rest-row small { color: var(--muted); font-size: 12px; }
.h-wcol.food i.flag.ghost { background: transparent; border: 1.5px dashed color-mix(in srgb, var(--hc) 70%, transparent); box-sizing: border-box; }
/* 8.9 · «Ещё настройки» в лекарстве */
.mf-more { display: flex; align-items: center; justify-content: space-between; width: 100%; margin: 12px 0 4px; padding: 12px 14px; border: 0; border-radius: 14px; background: var(--panel-2); color: var(--text); font: inherit; font-weight: 600; text-align: left; }
.mf-more small { color: var(--muted); font-weight: 400; }
.mf-more svg { width: 18px; height: 18px; color: var(--muted); transition: transform .2s; flex: none; }
.mf-more.open svg { transform: rotate(180deg); }
/* 8.10 · перейти к закрепу: блок в расписании подсвечивается */
.tl-block.flash, .ad-chip.flash, .tl-note.flash { animation: blkflash 1.6s ease; }
@keyframes blkflash { 0%, 60% { box-shadow: 0 0 0 3px var(--accent2), 0 0 18px color-mix(in srgb, var(--accent2) 60%, transparent); } 100% { box-shadow: none; } }
/* ===== 8.10 · поля календаря: время у края, значки — перед красной линией ===== */
.tmk { --tmw: calc(var(--cal-fs, 15px) * 2.24); }
.pg-lines.tmk { padding-left: 3px; }
.tmk .ln { padding-left: 0; }
.tmk .ln-tm.mk { flex-direction: row; align-items: stretch; justify-content: space-between; gap: 1px; margin: 0 1px 0 0; padding: 0 2px 0 0; overflow: visible; font-size: calc(var(--cal-fs, 15px) * 0.54); letter-spacing: -0.035em; }
.tmk .ln-tm.mk .tm-t { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; line-height: 1.05; }
.tmk .ln-tm.mk .tm-k { flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; min-width: calc(var(--cal-fs, 15px) * 0.66); line-height: 1; }
.tmk .ln-tm.mk .tm-k.k3, .tmk .ln-tm.mk .tm-k.k4 { flex-direction: row; flex-wrap: wrap; width: calc(var(--cal-fs, 15px) * 0.7); align-content: center; gap: 0; }
.tmk .tm-k .ln-box { width: calc(var(--cal-fs, 15px) * 0.66); height: calc(var(--cal-fs, 15px) * 0.66); border-radius: 3px; border-width: 1.3px; }
.tmk .tm-k .ln-box svg { width: 80%; height: 80%; }
.tmk .tm-k .mk-ic, .tmk .tm-k .rec-ico { font-style: normal; display: grid; place-items: center; opacity: 0.75; color: var(--cal-ink); margin: 0; padding: 0; }
.tmk .tm-k .ic svg { width: calc(var(--cal-fs, 15px) * 0.52); height: calc(var(--cal-fs, 15px) * 0.52); }
.tmk .tm-k.k3 .ic svg, .tmk .tm-k.k4 .ic svg { width: calc(var(--cal-fs, 15px) * 0.34); height: calc(var(--cal-fs, 15px) * 0.34); }
.tmk .tm-k.k3 .ln-box, .tmk .tm-k.k4 .ln-box { width: calc(var(--cal-fs, 15px) * 0.5); height: calc(var(--cal-fs, 15px) * 0.5); }
.tmk .ln.done .tm-k .ln-box { background: var(--c); border-color: var(--c); }
.tmk .ln.rec .ln-pill { margin-left: 2px; }
.tmk .ln-tm.mk .tm-t:empty { display: block; }
/* символы в строке — чуть мельче */
.ln-box { width: 15px; height: 15px; border-radius: 4px; }
.ln-box svg { width: 11px; height: 11px; }
.ln-bell { font-size: 0.64em; }
.ln-text .ic svg { width: 0.8em; height: 0.8em; }
/* строка двойной высоты: в ней мало видно (время и значки съели место) — текст в две линии, без линейки посередине */
.ln.wrap.dbl { background: linear-gradient(to bottom, var(--cal-page) calc(100% - 1px), transparent calc(100% - 1px)); }
.tmk { --tmw: calc(var(--cal-fs, 15px) * 2.5); }
.tmk .ln-tm.mk .tm-t { flex: 0 1 auto; }
.ln.wrap .ln-tm.mk { padding-top: 0; }
.ln.wrap .ln-tm.mk .tm-t, .ln.wrap .ln-tm.mk .tm-k { justify-content: flex-start; height: var(--lh); justify-content: center; }
.tcol.tmk:not(.tkcol):not(.tright) { --tmw: calc(var(--cal-fs, 15px) * 2.3); }
.tmk .ln-tm.mk .tm-t { flex: 0 0 auto; }
.tmk .ln-tm.mk { justify-content: flex-start; }
.tmk .ln-tm.mk .tm-k { margin-left: auto; }
/* (8.11) линейки соседних строк больше не закрываются: тень только по бокам и без нижней линии */
.ln.wrap.dbl { box-shadow: -3px 0 0 0 var(--cal-page), 8px 0 0 0 var(--cal-page); clip-path: inset(0 -8px 1px -3px); }
/* ===== 8.10 · низ экрана: микрофон — в меню посередине, стрелки отмены — маленькие и полупрозрачные справа ===== */
.tab-mid { display: grid; place-items: center; min-width: 0; }
.tabs .q-btn { position: static !important; transform: none !important; bottom: auto !important; left: auto !important; width: 46px; height: 46px; border-radius: 50%; box-shadow: none; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); background: color-mix(in srgb, var(--accent) 22%, var(--panel)); color: color-mix(in srgb, var(--accent) 80%, var(--text)); }
.tabs .q-btn svg { width: 21px; height: 21px; }
.tabs .q-btn.pen { background: color-mix(in srgb, var(--accent2) 18%, var(--panel)); color: color-mix(in srgb, var(--accent2) 75%, var(--text)); border-color: color-mix(in srgb, var(--accent2) 40%, transparent); }
.tabs .q-btn.held { transform: scale(1.1) !important; }
.tabs .q-btn.rec { background: var(--down); color: #fff; border-color: transparent; }
.tabs .q-btn[hidden] { display: grid; visibility: hidden; }
/* отмена / повтор: маленькие, полупрозрачные, справа внизу — почти не закрывают страницу */
.undo-bar { left: auto !important; right: 6px; height: 30px !important; padding: 1px !important; gap: 0; opacity: 0.62; background: color-mix(in srgb, var(--panel) 55%, transparent) !important; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18) !important; bottom: calc(var(--reserve) + 4px) !important; }
.undo-bar:active, .undo-bar:focus-within { opacity: 1; }
.undo-bar button { width: 30px !important; height: 26px !important; border-radius: 999px !important; }
.undo-bar button svg { width: 15px; height: 15px; }
/* листание страниц задач и переключатели режима — слева, так же мелко */
.tk-pager, .mode-float, body[data-undo="1"] .mode-float:not(.lag-float) { left: 6px !important; right: auto !important; transform: none !important; height: 30px !important; padding: 1px !important; opacity: 0.72; bottom: calc(var(--reserve) + 4px) !important; background: color-mix(in srgb, var(--panel) 60%, transparent) !important; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18) !important; }
.tk-pager button, .mode-float button { height: 26px !important; min-width: 28px; }
.tk-pager button svg, .mode-float button svg { width: 15px; height: 15px; }
.zoom-float { bottom: calc(var(--reserve) + 40px) !important; right: 6px !important; opacity: 0.8; }
/* блокнот — до самого меню: под кнопки больше не резервируем место */
body[data-calfit="1"]:not([data-dock="1"]) .view { bottom: calc(var(--reserve) + 2px) !important; }
body[data-cal="1"]:not([data-calfit="1"]) .view { padding-bottom: 40px; }
/* задачи — тоже до самого меню (стрелки страниц и отмены — мелкие поверх) */
.view.view-tasks, body[data-undo="1"] .view.view-tasks, .view.view-tasks:has(.tk-pager) { padding-bottom: 6px !important; }
/* шапка календаря: кнопки с тем же зазором, что на «Задачах» */
.cal-tools, .cal-head .cal-tools, .dm-head .cal-tools { gap: 6px !important; }
/* 8.10 · здоровье в «Обзоре» — компактно: заголовок и главные цифры, ⌄ — графики */
.h-card.fold > *:not(.h-card-head):not(.h-stats):not(.h-big):not(.keep) { display: none !important; }
.h-card.fold > .h-stats ~ .h-stats, .h-card.fold > .h-big ~ .h-big { display: none !important; }
.h-card.fold { padding-bottom: 10px; }
.h-card.fold .h-stats { margin-bottom: 0; }
.h-foldb svg { transition: transform .2s; }
.h-card:not(.fold) .h-foldb svg { transform: rotate(180deg); }
/* ===== 8.11 · пересечения, «забыли выключить?», цепочка задним числом ===== */
.sum-warn { display: block; width: 100%; margin-top: 8px; border: 0; border-radius: 12px; padding: 8px 10px; font: inherit; font-size: 0.82em; text-align: left; color: #ffb340; background: color-mix(in srgb, #ff9f0a 14%, transparent); }
.warn-btn { color: #ffb340 !important; background: color-mix(in srgb, #ff9f0a 14%, var(--panel)) !important; }
.ov-day { margin: 10px 0 4px; }
.ov-day > b { display: block; font-size: 0.86em; color: var(--muted); margin-bottom: 4px; }
.ov-row, .cr-row { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.ov-row .grow, .cr-row .grow { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.ov-row small, .cr-row small { color: var(--muted); font-size: 12px; }
.cr-to { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; color: var(--muted); }
.cr-to input { width: auto; padding: 4px 6px; }
.hl-tag.warn { color: #ffb340; }
button.hl-tag { border: 0; font: inherit; cursor: pointer; }
.hl-tag.sm { font-size: 11px; padding: 1px 6px; }
/* напоминание о лекарстве: поверх всего (iPhone: прокручиваемая страница перехватывала касания), ✕ — скрыть */
#banner { z-index: 95 !important; -webkit-transform: translateZ(0); transform: translateZ(0); }
.rem-banner { position: relative; -webkit-transform: translateZ(0); transform: translateZ(0); }
.rem-banner .rb-x { position: absolute; top: 8px; right: 8px; width: 30px; height: 30px; border: 0; border-radius: 50%; background: color-mix(in srgb, var(--text) 10%, transparent); color: var(--muted); display: grid; place-items: center; padding: 0; }
.rem-banner .rb-x svg { width: 15px; height: 15px; }
.rem-banner .btn-row .btn { flex: 1 1 auto; }
/* 8.11 · отпуск: «таймер» на «Учёте» — не настоящий секундомер */
.rest-hero { display: flex; align-items: center; gap: 14px; width: 100%; border: 1.5px dashed color-mix(in srgb, #ff9f0a 55%, transparent); border-radius: 22px; padding: 18px 16px; margin: 4px 0 10px; font: inherit; text-align: left; color: var(--text); background: color-mix(in srgb, #ff9f0a 10%, var(--panel)); }
.rest-hero .rh-ic svg { width: 34px; height: 34px; color: #ff9f0a; }
.rest-hero .rh-t { display: flex; flex-direction: column; gap: 3px; }
.rest-hero b { font-size: 1.25em; }
.rest-hero small { color: var(--muted); font-size: 12.5px; }
.rest-hero.sm { padding: 8px 12px; border-radius: 14px; margin-top: 10px; }
.rest-hero.sm b { font-size: 0.95em; }
.rest-hero.sm .rh-ic svg { width: 20px; height: 20px; }
.rest-row.now { background: color-mix(in srgb, #ff9f0a 10%, transparent); border-radius: 12px; padding: 8px 8px; }
.rest-ask { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.hq-b.rest-off { opacity: 0.45; }
/* 8.11 · цепочка в строке названия */
.hero-label { flex-wrap: wrap; row-gap: 4px; }
.hl-chain { display: inline-flex; align-items: center; gap: 4px; border: 0; border-radius: 999px; padding: 2px 9px; font: inherit; font-size: 0.78em; color: var(--muted); background: var(--panel); max-width: 60vw; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hl-chain svg { width: 13px; height: 13px; flex: none; }
.hl-chain b { color: var(--text); font-weight: 650; font-variant-numeric: tabular-nums; }
.hl-chain span { color: var(--text); border-left: 2px solid var(--hc); padding-left: 4px; }
.hl-chain small { opacity: 0.8; }
.chk-row { display: flex; align-items: center; gap: 8px; margin: 8px 0; font-size: 0.92em; }
.chk-row input { width: 18px; height: 18px; }
.seg.wrap3 { flex-wrap: wrap; height: auto; }
.seg.wrap3 button { flex: 1 1 auto; white-space: nowrap; }
/* 8.11 · задача — квадрат с галочкой справа, цветом сферы; время на полях — прежнего размера */
.ln-box.sq { order: 30; margin-left: 4px; border-color: color-mix(in srgb, var(--c) 85%, var(--cal-muted)); border-width: 1.6px; width: 16px; height: 16px; border-radius: 4px; }
.ln.done .ln-box.sq { background: var(--c); border-color: var(--c); }
.ln.wrap > .ln-box.sq { margin-top: calc((var(--lh) - 16px) / 2); }
.tmk .ln-tm.mk { font-size: calc(var(--cal-fs, 15px) * 0.6); letter-spacing: -0.03em; }
.tcol.tmk:not(.tkcol):not(.tright) { --tmw: calc(var(--cal-fs, 15px) * 2.36); }
.tmk .ln-tm.mk .tm-k { min-width: calc(var(--cal-fs, 15px) * 0.5); }
.tmk .tm-k .ic svg { width: calc(var(--cal-fs, 15px) * 0.46); height: calc(var(--cal-fs, 15px) * 0.46); }
/* календарь — треугольник вершиной вниз, лист задач — квадрат (кружок — только сфера) */
.mk-cal { display: inline-block; width: 0; height: 0; border-left: 0.36em solid transparent; border-right: 0.36em solid transparent; border-top: 0.62em solid var(--c); margin-right: 5px; vertical-align: 0.05em; flex: none; }
.mk-list { display: inline-block; width: 0.62em; height: 0.62em; border-radius: 2px; background: var(--c); margin-right: 5px; vertical-align: 0; flex: none; }
/* кнопка «что едите» — в строке названия, не на «Стоп» */
.hl-food { display: inline-flex; align-items: center; gap: 5px; border: 0; border-radius: 999px; padding: 2px 10px 2px 4px; font: inherit; font-size: 0.8em; color: #ff8a7a; background: color-mix(in srgb, #ff6b5e 16%, var(--panel)); max-width: 46vw; }
.hl-food span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hl-food svg { width: 15px; height: 15px; }
.hl-food img { width: 20px; height: 20px; border-radius: 50%; object-fit: cover; }
.hl-food.has { color: var(--text); }
/* 8.11 · чередование в карточке лекарства */
.rot-box { margin: 10px 0 4px; }
.rot-box.on { border-radius: 16px; background: var(--panel-2); padding: 8px 10px 10px; }
.rot-box .label { display: flex; align-items: center; gap: 6px; margin-top: 0; }
.rot-box .label svg { width: 15px; height: 15px; }
.rot-m { display: flex; align-items: center; gap: 10px; padding: 6px 0; border-bottom: 1px solid var(--line); }
.rot-m b { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rot-m .mc-n { display: inline-flex; align-items: center; gap: 4px; }
.rot-m .mc-n input { width: 44px; height: 32px; text-align: center; padding: 0; }
.rot-m .mc-n button { width: 30px; height: 30px; border: 0; border-radius: 50%; background: var(--panel); color: var(--text); font-size: 17px; }
.rot-m small { color: var(--muted); font-size: 12px; min-width: 76px; }
.rot-prev { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; margin: 8px 0; }
.rot-prev span { display: flex; flex-direction: column; border-radius: 10px; background: var(--panel); padding: 4px 6px; min-width: 0; }
.rot-prev span.today { box-shadow: inset 0 0 0 1.5px var(--accent2); }
.rot-prev small { color: var(--muted); font-size: 11px; }
.rot-prev b { font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mf-sec { margin: 12px 0 4px; }
.mf-sec button { display: inline-flex; align-items: center; justify-content: center; gap: 5px; }
.mf-sec svg { width: 14px; height: 14px; }
/* 8.11 · все лекарства, заходы, рекомендации ИИ */
.ma-top { display: flex; align-items: center; gap: 10px; margin: 2px 0 8px; }
.ma-top .muted { flex: 1; }
.ma-row { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--line); }
.ma-row.on .ma-main b { color: var(--accent2); }
.ma-box { width: 24px; height: 24px; flex: none; border-radius: 7px; border: 1.6px solid var(--muted); background: none; color: #fff; display: grid; place-items: center; padding: 0; }
.ma-row.on .ma-box { background: var(--accent2); border-color: var(--accent2); }
.ma-box svg { width: 15px; height: 15px; }
.ma-main { flex: 1; min-width: 0; border: 0; background: none; color: var(--text); font: inherit; text-align: left; display: flex; flex-direction: column; padding: 0; }
.ma-main small { color: var(--muted); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ma-flag { color: #bf5af2; }
.ma-acts { position: sticky; bottom: 0; display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 0 6px; background: var(--panel); z-index: 2; }
.ma-panel { border-radius: 14px; background: var(--panel-2); padding: 8px 10px 10px; margin-bottom: 8px; }
.ma-fl { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--line); }
.ma-fl b { white-space: nowrap; }
.ma-fl small { flex: 1; color: var(--muted); font-size: 12px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ma-fl input { width: auto; padding: 4px 6px; font-size: 13px; }
.mk-flag { display: inline-block; width: 9px; height: 11px; margin-right: 5px; background: #bf5af2; clip-path: polygon(0 0, 100% 0, 75% 50%, 100% 100%, 0 100%); vertical-align: -1px; }
.ai-guess, .h-dose.ai-guess, .mt-x.ai-guess, .hq-b.meds.ai-guess { opacity: 0.55; filter: grayscale(0.7); }
.ai-tag { font-style: normal; font-size: 10px; font-weight: 700; color: #f5c451; border: 1px solid #f5c45180; border-radius: 5px; padding: 0 4px; vertical-align: 1px; }
.ai-box { display: flex; flex-wrap: wrap; gap: 6px; align-items: flex-start; border-radius: 14px; padding: 10px 12px; margin: 6px 0; background: color-mix(in srgb, #f5c451 12%, var(--panel)); font-size: 0.88em; }
.ai-box > span { flex: 1 1 200px; }
.ai-box .btn-row { flex-basis: 100%; margin: 4px 0 0; }
/* 8.11 · сон: период / неделя / ночь, ‹ › */
.sl-nav { display: inline-flex; align-items: center; gap: 2px; }
.sl-seg button { padding: 0 7px; font-size: 11.5px; }
.sl-ar { width: 26px; height: 26px; }
.sl-ar svg { width: 14px; height: 14px; }
.sl-ar:disabled { opacity: 0.3; }
.h-card.fold > .keep { display: flex !important; }
.sl-row { display: flex; justify-content: flex-end; margin: -2px 0 8px; }
/* ===== 8.12 ===== */
.hist-top .hist-find { margin-right: auto; }
.hist-tools { margin: -2px 0 8px; flex-wrap: wrap !important; overflow: visible !important; gap: 6px; }
.hist-tools .chip { white-space: nowrap; display: inline-flex; align-items: center; gap: 5px; }
.hist-tools .chip svg { width: 15px; height: 15px; }
.warn-chip { color: #ffb340 !important; background: color-mix(in srgb, #ff9f0a 16%, var(--panel)) !important; border-color: transparent !important; }
.ov-block { border-radius: 14px; background: var(--panel-2); padding: 8px 10px 10px; margin: 10px 0; }
.ov-bh { font-size: 0.82em; color: var(--muted); margin-bottom: 2px; }
.ov-block .ov-row:last-of-type { border-bottom: 0; }
.ov-row.is-main b { color: var(--accent2); }
.ov-star { color: #ffcc00; font-size: 18px; padding: 0 8px; }
.ov-block .btn-row { margin-top: 6px; }
/* отпуск — «секундомер» другого вида */
.rest-hero.big { flex-direction: column; align-items: center; text-align: center; gap: 4px; padding: 16px 14px 14px; border-style: dashed; }
.rest-hero.big .rh-top { display: inline-flex; align-items: center; gap: 6px; color: #ffb340; font-size: 0.95em; }
.rest-hero.big .rh-top svg { width: 20px; height: 20px; }
.rest-hero.big .rh-clock { font-size: clamp(28px, 9vw, 40px); font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: -0.02em; color: #ffcf80; line-height: 1.05; }
.rest-hero.big small { color: var(--muted); font-size: 12.5px; }
.rest-clock { font-variant-numeric: tabular-nums; }
.rest-name { margin: 2px 0 8px; }
/* временная сфера — только штриховка, без пунктирной рамки */
.sb.temp { outline: none !important; box-shadow: none !important; }

/* 8.13 — пересечения: понятнее «что с чем и что станет» */
.ov-block .ov-why { margin: 2px 0 6px; font-size: 13px; color: var(--muted); line-height: 1.35; }
.ov-block.run { border: 1px solid color-mix(in srgb, #ff9f0a 40%, transparent); }
.ov-rh { display: flex; align-items: center; gap: 8px; font-size: 15px; }
.ov-sub { font-size: 12.5px; color: var(--muted); margin: 2px 0 0 18px; }
.ov-acts { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.ov-acts .btn { width: 100%; height: auto; min-height: 40px; padding: 9px 14px; white-space: normal; justify-content: center; text-align: center; flex-direction: column; line-height: 1.2; }
.ov-acts .btn small { display: block; font-size: 11.5px; opacity: .75; font-weight: 500; }
.ov-row.pick { width: 100%; background: none; border: 0; border-bottom: 1px solid var(--line); color: inherit; text-align: left; font: inherit; cursor: pointer; align-items: flex-start; }
.ov-row .ov-l1 { display: flex; gap: 8px; align-items: baseline; justify-content: space-between; flex-wrap: wrap; }
.ov-row .ov-t { font-size: 12.5px; color: var(--muted); font-variant-numeric: tabular-nums; }
.ov-row small em { font-style: normal; }
.ov-row small em.ok { color: var(--accent1, #32d74b); }
.ov-row small em.bad { color: #ff6b5e; }
.ov-row small b { color: var(--text); font-weight: 600; }
.ov-radio { width: 20px; height: 20px; flex: 0 0 20px; border-radius: 50%; border: 2px solid var(--gray); margin-top: 1px; box-sizing: border-box; }
.ov-row.is-main .ov-radio { border-color: var(--accent1, #32d74b); background: radial-gradient(circle, var(--accent1, #32d74b) 0 4.5px, transparent 5px); }
.ov-row.is-main b { color: inherit; }
.ov-tl { position: relative; display: block; height: 6px; border-radius: 3px; background: color-mix(in srgb, var(--text) 7%, transparent); margin: 5px 0 3px; overflow: hidden; }
.ov-tl i { position: absolute; top: 0; bottom: 0; border-radius: 3px; }
.ov-tl i.was { background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--c) 35%, transparent) 0 3px, transparent 3px 6px); }
.ov-tl i.now { background: var(--c); }
.ov-res { font-size: 13px; margin-top: 6px; }

/* 9.0 — помощник */
.as-in { display: flex; gap: 8px; align-items: flex-end; }
.as-in textarea { flex: 1; min-height: 52px; }
.as-ex { margin-top: 10px; }
.as-ans { margin: 12px 0 6px; line-height: 1.4; }
.as-opt { border-radius: 16px; background: var(--panel-2); padding: 12px 12px 10px; margin: 10px 0; display: flex; flex-direction: column; gap: 4px; }
.as-opt > b { font-size: 15.5px; }
.as-opt > small { color: var(--muted); font-size: 13px; line-height: 1.35; }
.as-acts { margin: 6px 0 8px; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 5px; font-size: 13.5px; }
.as-acts li { position: relative; padding-left: 24px; line-height: 1.3; min-height: 18px; }
.as-acts li > .ic, .as-acts li > svg { position: absolute; left: 0; top: 1px; width: 16px; height: 16px; opacity: .8; }
.as-acts li .ic svg { width: 16px; height: 16px; }
.as-opt.done { opacity: .75; }
.as-done { color: var(--accent1, #32d74b); font-size: 13.5px; display: flex; gap: 6px; align-items: center; }
.as-done svg { width: 16px; height: 16px; }
.as-wide { margin: 0 0 10px; }
.as-link { margin-top: 8px; font-size: 14px; }
.flash { animation: flashHl 1.6s ease; }
@keyframes flashHl { 0%, 60% { box-shadow: 0 0 0 2px var(--accent1, #32d74b); } 100% { box-shadow: none; } }
.set-ai[hidden] { display: none !important; }

/* 9.1 — импорт */
.imp-file { position: relative; overflow: hidden; margin: 8px 0 4px; }
.imp-file input { position: absolute; inset: 0; opacity: 0; font-size: 0; cursor: pointer; }
.imp-url { display: flex; gap: 8px; margin-bottom: 6px; }
.imp-url input { flex: 1; min-width: 0; }
.imp-how { background: var(--panel-2); border-radius: 12px; padding: 4px 12px; margin: 8px 0; font-size: 13.5px; line-height: 1.4; }
.imp-src { display: flex; gap: 10px; align-items: flex-start; padding: 10px 0; border-bottom: 1px solid var(--line); }
.imp-src.off { opacity: .55; }
.imp-src .grow { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1; }
.imp-src small { color: var(--muted); font-size: 12.5px; line-height: 1.3; }
.imp-src small.warn { color: #ffb340; }
.imp-name { font: inherit; font-weight: 600; background: transparent; border: 0; border-bottom: 1px dashed var(--line); color: var(--text); padding: 2px 0; border-radius: 0; }
.imp-chk { width: 24px; height: 24px; flex: 0 0 24px; border-radius: 7px; border: 2px solid var(--gray); background: none; color: #fff; display: grid; place-items: center; padding: 0; }
.imp-chk.on { background: var(--accent1, #32d74b); border-color: var(--accent1, #32d74b); }
.imp-chk svg { width: 15px; height: 15px; }
.imp-dot { width: 12px; height: 12px; border-radius: 50%; margin-top: 7px; flex: 0 0 12px; }
.imp-sub-row { display: flex; align-items: center; gap: 8px; padding: 6px 0; }
.imp-sub-row .grow { display: flex; flex-direction: column; flex: 1; }
.imp-sub-row small { color: var(--muted); font-size: 12px; }
.imp-wide { margin: 0 0 10px; }

/* 9.1 — название сферы всегда сверху: значок таймера в углу больше не сдвигает текст вниз */
.sb.has-corner .sb-corner { float: none; position: absolute; top: 6px; right: 6px; margin: 0; }
.sb.has-corner .sb-name { padding-right: 30px; overflow-wrap: anywhere; hyphens: auto; }
.grid-main .sb.has-corner .sb-corner { top: 5px; right: 5px; }
.hidden-grid .sb { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.chain-fold { display: flex; align-items: center; gap: 8px; width: 100%; border: 0; border-radius: 14px; background: var(--panel-2); color: var(--muted); font: inherit; font-size: 14px; padding: 10px 12px; margin: 4px 0 10px; text-align: left; }
.chain-fold span { flex: 1; }
.chain-fold svg { width: 16px; height: 16px; }
.clock-stack .clock-chain { color: var(--muted); }
.ch-pick .sb { min-height: 52px; }
.hm-time { background: var(--panel-2); border-radius: 14px; padding: 8px 10px; margin: 0 0 10px; display: flex; flex-direction: column; gap: 6px; }
.hm-at { display: flex; align-items: center; gap: 10px; }
.hm-at input { width: auto; min-width: 110px; }
.hm-durs .chip { padding: 6px 12px; }
.when-label { margin: 2px 0 8px; }
.when-durs .chip, .when-chips .chip { padding: 7px 12px; }
.when-go { margin-top: 12px; }
.hh-nt { font-style: normal; color: #ffb340; }
.hh-add-hint { margin: -4px 4px 8px; font-size: 12px; color: var(--muted); }
.sb.xlong .sb-name { font-size: 0.7em; }
.grid-main .sb.xlong .sb-name { font-size: 0.68em; }
.sb.has-corner .sb-name { overflow-wrap: break-word; }
.chain-fold span { text-align: left; }
.hm-at span { white-space: nowrap; }
.chain-fold { justify-content: flex-start; }
.chain-fold > span { flex: 1 1 auto !important; text-align: left !important; margin: 0 !important; min-width: 0; }
.sb.has-corner .sb-name { overflow-wrap: normal; word-break: keep-all; hyphens: manual; }
.rest-tag .ic svg, .rest-tag svg { width: 12px; height: 12px; vertical-align: -1px; }

/* 9.2 — «Следовал расписанию»: неделя целиком */
.sf-range { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 2px 0 4px; }
.sf-end { display: flex; flex-direction: column; align-items: flex-start; border: 1.5px solid var(--line); background: var(--panel-2); color: var(--text); border-radius: 12px; padding: 5px 10px; font: inherit; }
.sf-end small { font-size: 11px; color: var(--muted); }
.sf-end b { font-size: 14px; font-variant-numeric: tabular-nums; }
.sf-end.on { border-color: var(--accent1, #32d74b); }
.sfg-nav { display: flex; align-items: center; justify-content: space-between; margin: 4px 0; font-size: 13px; color: var(--muted); }
.sfg-week { display: grid; grid-template-columns: 16px repeat(7, minmax(0, 1fr)); gap: 2px; height: 320px; position: relative; }
.sfg-ticks { position: relative; margin-top: 30px; }
.sfg-ticks span { position: absolute; left: 0; font-size: 9px; color: var(--gray); transform: translateY(-50%); }
.sfg-col { display: flex; flex-direction: column; min-width: 0; cursor: pointer; }
.sfg-dh { height: 28px; display: flex; flex-direction: column; align-items: center; font-size: 10px; font-weight: 600; color: var(--muted); line-height: 1.1; }
.sfg-dh small { font-size: 12px; color: var(--text); }
.sfg-col.today .sfg-dh small { color: #ff453a; }
.sfg-body { position: relative; flex: 1; background: color-mix(in srgb, var(--text) 5%, transparent); border-radius: 6px; overflow: hidden; }
.sfg-ev { position: absolute; left: 1px; right: 1px; border: 0; border-radius: 4px; padding: 1px 2px; background: color-mix(in srgb, var(--c) 70%, transparent); color: #fff; font: inherit; font-size: 8.5px; line-height: 1.1; text-align: left; overflow: hidden; word-break: break-word; }
.sfg-ev span { display: block; font-weight: 700; opacity: .85; }
.sfg-ev.nosp { background: color-mix(in srgb, var(--c) 40%, transparent); }
.sfg-ev.pt { border-left: 2px solid var(--c); background: color-mix(in srgb, var(--c) 30%, transparent); }
.sfg-sel { position: absolute; left: 0; right: 0; background: color-mix(in srgb, var(--accent1, #32d74b) 22%, transparent); border-top: 2px solid var(--accent1, #32d74b); border-bottom: 2px solid var(--accent1, #32d74b); }
.sfg-now { position: absolute; left: 0; right: 0; height: 2px; background: #ff453a; }
.sf-list { max-height: 210px; overflow: auto; }

/* 9.2 — режим «по расписанию» */
.fw-strip { display: flex; align-items: center; gap: 10px; width: 100%; border: 1.5px solid color-mix(in srgb, var(--hc) 55%, transparent); background: color-mix(in srgb, var(--hc) 14%, var(--panel)); color: var(--text); border-radius: 16px; padding: 8px 12px; margin: 8px 0; font: inherit; text-align: left; }
.fw-strip .grow { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.fw-strip small { color: var(--muted); font-size: 12px; }
.fw-strip svg { width: 18px; height: 18px; }
.fw-x { padding: 4px; color: var(--muted); }
.fw-hero .fw-next { text-align: center; margin: -2px 0 8px; }
.fw-hero .hl-btn svg { width: 18px; height: 18px; color: var(--hc); }
.clock-stack .clock-fw { color: var(--muted); }
.fw-list { margin: 6px 0; }
.rx-day1 { background: var(--panel-2); border-radius: 14px; padding: 10px 12px; margin: 4px 0 10px; display: flex; flex-direction: column; gap: 4px; }
.rx-day1 small { color: var(--muted); font-size: 12.5px; }
.ma-fl-shift { display: inline-flex; gap: 4px; }
.ma-fl-shift .chip { padding: 4px 8px; font-size: 12px; }
.ma-fl { flex-wrap: wrap; }

/* 9.2 — отпуск: поля дней жёлтые; серый фон расписания; маленькие закладки у всех дней */
.pg.rest-day .ln-tm { border-right-color: color-mix(in srgb, #ffc400 75%, transparent) !important; }
.grid-gray .wg, .cal.grid-gray .tl-wrap, .cal.grid-gray #timeline { background: #1c1c1f; border-radius: 12px; }
.cal.cal-light.grid-gray .wg { background: #e9e9ee; }
.fit.date-mini .pg-tab, .date-mini .fit .pg-tab, .cal.date-mini .pg:not(.half) .pg-tab { padding: 1px 7px 0; font-size: calc(var(--cal-fs, 15px) * 0.7); line-height: 1.25; }
.book.eq .bk-col .pg.eqh .pg-tab { padding: 2px 8px 1px; font-size: calc(var(--cal-fs, 15px) * 0.76); }
/* 9.2 — линейки странички едут вместе со строками (на iPhone фон «local» отставал при прокрутке) */
.cal.lines-lines.fit .pg-lines.scroll { background-image: none; }
.cal.lines-lines.fit .pg-lines.scroll .ln { position: relative; }
.cal.lines-lines.fit .pg-lines.scroll .ln::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--cal-line); pointer-events: none; }
.cal.lines-lines.fit .pg-lines.scroll .ln.wrap.dbl { clip-path: none; }
.view.view-tasks, #tasksPage { overflow-x: hidden; overscroll-behavior-x: none; }
#tasksPage .tk-page .pg-lines { touch-action: pan-y; }

/* ===== 9.4 ===== */
/* секундомер: цифры сменяются плавно (подсветка ключевых — как была) */
.clock .cd { position: relative; }
.clock .cd-new { font-style: normal; display: inline-block; }
.clock .cd.fd .cd-new { animation: cdIn 0.36s ease-in-out; }
.clock .cd-old { position: absolute; left: 0; top: 0; font-style: normal; pointer-events: none; animation: cdOut 0.3s ease-in forwards; }
@keyframes cdIn { from { opacity: 0; } 35% { opacity: 0.15; } to { opacity: 1; } }
@keyframes cdOut { from { opacity: 1; } 60% { opacity: 0.1; } to { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .clock .cd.fd .cd-new { animation: none; } .clock .cd-old { display: none; } }
/* цепочка — слева от часов, расписание — справа */
.clock-stack.l { right: auto; left: 0; }
/* ± свои значения: удержание → поле на месте кнопки */
.te-adj-in { display: flex; align-items: center; gap: 2px; height: 38px; border-radius: 11px; background: var(--panel); padding: 0 4px; font-weight: 700; box-shadow: inset 0 0 0 1.5px var(--accent2, var(--accent)); grid-column: span 2; }
.te-adj-in.minus { color: var(--down, #fb7185); } .te-adj-in.plus { color: var(--up, #34d399); }
.te-adj-in input { width: 100%; min-width: 0; border: 0; background: transparent; color: var(--text); font: inherit; text-align: center; padding: 0; }
.te-adj-in button { height: 30px !important; width: 34px; flex: 0 0 auto; background: var(--accent2, var(--accent)) !important; color: #fff !important; border-radius: 9px !important; display: grid; place-items: center; }
.te-adj-in button svg { width: 16px; height: 16px; }
.te-adj:has(.te-adj-in) { grid-template-columns: repeat(7, 1fr); }
.te-trim { display: flex; flex-direction: column; gap: 4px; margin: 2px 0 8px; font-size: 0.8em; color: var(--muted); }
.te-trim .seg { margin: 0; background: color-mix(in srgb, var(--text) 7%, transparent); }
.te-trim .seg button { font-size: 0.92em; padding: 6px 4px; }
.te-hint { margin: 0 0 6px; }
/* журнал: кнопки «Истории» — одной капсулой справа; фильтры спрятаны */
.hist-top { justify-content: space-between; }
.hist-btns { display: inline-flex; align-items: center; gap: 2px; padding: 3px; border-radius: 14px; background: var(--panel); margin-left: auto; }
.hist-btns .hb { position: relative; height: 32px; min-width: 34px; border: 0; border-radius: 11px; background: none; color: var(--muted); display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 0 8px; font: inherit; font-size: 0.8em; font-weight: 650; overflow: hidden; }
.hist-btns .hb svg { width: 17px; height: 17px; flex: 0 0 auto; }
.hist-btns .hb input { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; -webkit-appearance: none; appearance: none; }
.hist-btns .hb.on { background: var(--panel-2); color: var(--text); }
.hist-btns .hb.dot::after { content: ""; position: absolute; top: 6px; right: 6px; width: 6px; height: 6px; border-radius: 50%; background: var(--accent2, var(--accent)); }
.hist-btns .hb-moon { color: var(--text); background: var(--panel-2); }
.hist-btns .hb-moon.off { color: var(--muted); background: none; }
.hist-filt { margin-bottom: 4px; }
.hist-fon { margin: 0 0 8px; font-size: 0.8em; }
.hist-fon svg { width: 14px; height: 14px; }
/* голова дня: слева «Сегодня · 2ч 21м», справа значки; отпуск — отдельной строкой ниже */
.day-head { flex-wrap: wrap; row-gap: 4px; }
.day-head .dh-main { display: inline-flex; align-items: baseline; gap: 8px; min-width: 0; flex: 1 1 auto; }
.day-head .dh-main b { white-space: nowrap; }
.day-head .dh-total { white-space: nowrap; font-variant-numeric: tabular-nums; }
.day-head .day-tools { flex: 0 0 auto; gap: 4px; align-items: center; }
.day-head .dt-btn { border: 0; background: color-mix(in srgb, var(--text) 6%, transparent); color: var(--muted); height: 28px; min-width: 30px; border-radius: 9px; padding: 0 8px; display: inline-flex; align-items: center; justify-content: center; gap: 4px; font: inherit; font-size: 0.78em; white-space: nowrap; font-variant-numeric: tabular-nums; }
.day-head .dt-btn svg { width: 15px; height: 15px; }
.day-head .dt-btn .gray { color: inherit; }
.day-head .rest-tag { flex: 1 0 100%; margin: 0; padding: 3px 8px; font-size: 11.5px; border-radius: 7px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
/* «по расписанию»: неделя в прокрутке, щипок — крупнее; будущее — штриховкой; свой ввод времени */
.sfg-heads { display: grid; grid-template-columns: 18px repeat(7, minmax(0, 1fr)); gap: 2px; margin-bottom: 2px; }
.sfg-heads .sfg-dh.today small { color: #ff453a; }
.sfg-scroll { max-height: min(46vh, 380px); overflow-y: auto; overscroll-behavior: contain; border-radius: 8px; -webkit-overflow-scrolling: touch; }
.sfg-week { grid-template-columns: 18px repeat(7, minmax(0, 1fr)); height: calc(320px * var(--z, 1)); }
.sfg-ticks { margin-top: 0; }
.sfg-week[data-dense="0"] .sfg-ticks .tk-m { display: none; }
.sfg-week[data-dense="1"] .sfg-ticks .tk-m { opacity: 0.6; }
.sfg-col .sfg-body { height: 100%; }
.sfg-fut { position: absolute; left: 0; right: 0; bottom: 0; background: repeating-linear-gradient(135deg, transparent 0 5px, color-mix(in srgb, var(--text) 5%, transparent) 5px 7px); pointer-events: none; }
.sfg-zoom { display: flex; align-items: center; gap: 6px; margin: 6px 0 2px; font-size: 12px; color: var(--muted); }
.sfg-zoom span { flex: 1; text-align: center; }
.sfg-zoom .chip { padding: 4px 10px; font-size: 12px; }
.sf-end.typing { padding: 4px 8px; }
.sf-end.typing input { border: 0; background: transparent; color: var(--text); font: inherit; font-size: 14px; font-weight: 700; padding: 0; max-width: 190px; }
.sf-end small { white-space: nowrap; }
.sf-night { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--line); font-size: 0.9em; flex-wrap: wrap; }
.sf-night b { min-width: 76px; font-weight: 650; }
.sf-night label { display: inline-flex; align-items: center; gap: 4px; color: var(--muted); }
.sf-night input[type="time"] { border: 0; border-radius: 9px; background: var(--panel-2); color: var(--text); font: inherit; padding: 5px 8px; }
.sf-night .chip.sm { margin-left: auto; padding: 4px 10px; font-size: 12px; }
.sf-night.ok .muted { margin-left: auto; }
.sf-night.off b { opacity: 0.6; }
.sb-box { display: flex; align-items: center; gap: 8px; padding: 8px 10px; margin: 6px 0 8px; border-radius: 12px; background: color-mix(in srgb, var(--accent2, var(--accent)) 10%, var(--panel)); font-size: 0.84em; }
.sb-box svg { width: 16px; height: 16px; flex: 0 0 auto; color: var(--muted); }
.sb-box .chip { flex: 0 0 auto; }
/* маленькие закладки — и промежутки между днями меньше */
.cal.date-mini .bk-col { gap: 3px; }
.cal.date-mini .wk-end { gap: 2px; }
.cal.date-mini .book.cols .bk-col { gap: 4px; }
.hm-go2 { margin-top: 6px; gap: 6px; }
.hm-go2 .btn { font-size: 0.88em; }
.hm-go2 svg, .hm-go svg { width: 17px; height: 17px; }

/* ===== 9.5 ===== */
.h-wtod { margin: 6px 0 0; }
.h-wmain small { margin-left: 4px; font-weight: 500; }
/* сон за неделю: «сколько» ровно над «когда», дни — общие */
.h-chart.al { padding-left: 36px; height: 76px; margin-bottom: 4px; }
.h-chart.al .h-col i { margin: 0 12%; width: 76%; }
.h-chart.al .h-goal { left: 36px; }
.h-window.sl-al { margin-bottom: 0; }
.h-axis.al { padding-left: 36px; }
.sl-leg { margin-top: 6px; }
.sl-leg:empty { display: none; }
/* лист задач: пока строки влезают — не прокручивается */
.tasks-page .tk-page.tk-fit { overflow: hidden; }
/* равные дни: маленькие закладки — и здесь маленькие, дни плотнее */
.cal.date-mini .book.eq .bk-col .pg .pg-tab { padding: 1px 7px 0; font-size: calc(var(--cal-fs, 15px) * 0.7); line-height: 1.25; }
.cal.date-mini .book.eq .bk-col { gap: 3px; }
.wg-block b { white-space: nowrap; overflow: hidden; }
.wg-block.nodur span, .wg-block.auto span { -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; }
/* 9.6 */
.rx-ed { color: var(--accent2, var(--accent)); font-weight: 650; }
/* шкала времени у «когда спите / едите»: линия ровно на отметке */
.h-window, .h-window.food { background: none; }
.h-wg { position: absolute; left: 36px; right: 0; height: 1px; background: color-mix(in srgb, var(--text) 9%, transparent); pointer-events: none; }
.h-chart.al .h-gl-l { position: absolute; left: 0; width: 34px; font-size: 0.56em; color: var(--gray); transform: translateY(50%); pointer-events: none; }
.as-clash { color: var(--warn, #ff9f0a); font-weight: 600; }