/* ASABA 2.0 — визуальная система.
   Палитра FONBET Brand Book 2025: RED_1 #E80024, BLACK #000005, WHITE; дополнительные RED_3 #9B0024,
   GRAPHITE #242B35, GREY_3 #EDEDED. Шрифт бренда Cera подхватывается, если установлен; иначе системный гротеск. */

:root {
  --red: #E80024;
  --red-hover: #CC0020;
  --red-deep: #9B0024;
  --red-ink: #C8001F;
  --red-soft: #FFF0F2;
  --red-soft-2: #FFE1E6;
  --black: #000005;
  --graphite: #242B35;

  --bg: #F3F3F5;
  --surface: #FFFFFF;
  --surface-2: #F7F7F9;
  --surface-3: #EDEDED;
  --line: #E6E6EA;
  --line-strong: #D5D5DB;
  --text: #0E0E14;
  --text-2: #55555F;
  --text-3: #85858F;
  --shadow: 0 1px 2px rgba(10, 10, 20, .04), 0 4px 16px rgba(10, 10, 20, .04);
  --shadow-lg: 0 24px 64px rgba(10, 10, 20, .18), 0 4px 16px rgba(10, 10, 20, .08);

  --green: #12A150;
  --green-soft: #E7F7EE;
  --amber: #D98200;
  --amber-soft: #FFF4DE;
  --point: #242B35;
  --point-soft: #EEF0F3;
  --dobro: #9B0024;

  --rail: #000005;
  --rail-text: #A9A9B2;
  --rail-line: #1B1B22;

  --r-xl: 22px;
  --r-lg: 16px;
  --r-md: 12px;
  --r-sm: 8px;
  --font: "Cera Pro", "Cera", -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-display: "Cera Pro", "Cera", -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", Roboto, Arial, sans-serif;
  --ease: cubic-bezier(.2, .8, .2, 1);
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #09090C; --surface: #121217; --surface-2: #17171D; --surface-3: #202028; --line: #23232B; --line-strong: #31313B;
    --text: #F3F3F6; --text-2: #A8A8B3; --text-3: #75757F; --red-ink: #FF4D66; --red-soft: #2A0E14; --red-soft-2: #3A111A;
    --green-soft: #0E2A1B; --amber-soft: #2E2210; --point: #B9C1CE; --point-soft: #1D2230; --dobro: #FF7A8E;
    --shadow: 0 1px 2px rgba(0, 0, 0, .4); --shadow-lg: 0 24px 64px rgba(0, 0, 0, .6);
    --rail: #000003; --rail-line: #17171D; color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #09090C; --surface: #121217; --surface-2: #17171D; --surface-3: #202028; --line: #23232B; --line-strong: #31313B;
  --text: #F3F3F6; --text-2: #A8A8B3; --text-3: #75757F; --red-ink: #FF4D66; --red-soft: #2A0E14; --red-soft-2: #3A111A;
  --green-soft: #0E2A1B; --amber-soft: #2E2210; --point: #B9C1CE; --point-soft: #1D2230; --dobro: #FF7A8E;
  --shadow: 0 1px 2px rgba(0, 0, 0, .4); --shadow-lg: 0 24px 64px rgba(0, 0, 0, .6);
  --rail: #000003; --rail-line: #17171D; color-scheme: dark;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--text); font: 14px/1.45 var(--font); -webkit-font-smoothing: antialiased; font-feature-settings: "tnum" 1, "cv11" 1; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; color: inherit; }
button { cursor: pointer; }
h1, h2, h3, h4 { margin: 0; font-family: var(--font-display); letter-spacing: -.01em; }
p { margin: 0; }
svg.i { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; border-radius: 6px; }
.skip { position: fixed; left: 12px; top: -60px; z-index: 100; background: var(--red); color: #fff; padding: 10px 14px; border-radius: 10px; }
.skip:focus { top: 12px; }
.missing { color: var(--text-3); }
.pre { white-space: pre-line; }
.muted { color: var(--text-3); }
.past { color: var(--red-ink) !important; }
kbd { font: 600 11px/1 var(--font); padding: 3px 6px; border-radius: 6px; border: 1px solid var(--line-strong); background: var(--surface); color: var(--text-2); }

/* ───────── Layout ───────── */
.app { display: grid; grid-template-columns: 248px minmax(0, 1fr); min-height: 100vh; transition: grid-template-columns .25s var(--ease); }
body.rail-min .app { grid-template-columns: 76px minmax(0, 1fr); }
.shell { min-width: 0; display: flex; flex-direction: column; }
main { flex: 1; padding: 8px 32px 40px; max-width: 1480px; width: 100%; margin: 0 auto; outline: none; }
main.enter > * { animation: rise .42s var(--ease) both; }
main.enter > *:nth-child(2) { animation-delay: .04s; }
main.enter > *:nth-child(3) { animation-delay: .08s; }
main.enter > *:nth-child(4) { animation-delay: .12s; }
main.enter > *:nth-child(5) { animation-delay: .16s; }
@keyframes rise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.fade-in { animation: rise .3s var(--ease) both; }

/* ───────── Rail ───────── */
.rail { position: sticky; top: 0; height: 100vh; background: var(--rail); color: var(--rail-text); display: flex; flex-direction: column; padding: 18px 14px; gap: 18px; overflow: hidden; z-index: 20; }
.brand { display: flex; align-items: center; gap: 12px; padding: 4px 6px 14px; border-bottom: 1px solid var(--rail-line); }
.brand-mark { width: 40px; height: 40px; flex: none; border-radius: 12px; background: var(--red); color: #fff; display: grid; place-items: center; font: 650 21px/1 var(--font-display); font-style: italic; letter-spacing: -.04em; box-shadow: 0 6px 18px rgba(232, 0, 36, .45); }
.brand-text strong { display: block; color: #fff; font: 650 17px/1.05 var(--font-display); letter-spacing: .02em; font-style: italic; }
.brand-text small { display: block; font-size: 11px; color: var(--rail-text); margin-top: 3px; letter-spacing: .04em; text-transform: uppercase; }
.nav { display: flex; flex-direction: column; gap: 3px; }
.nav-label { font-size: 10.5px; letter-spacing: 0; text-transform: none; color: #5D5D68; padding: 14px 10px 6px; white-space: nowrap; }
.nav a, .nav-btn { position: relative; display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 11px; color: var(--rail-text); font-weight: 550; white-space: nowrap; border: 0; background: none; text-align: left; transition: background .15s, color .15s; }
.nav a:hover, .nav-btn:hover { background: #15151C; color: #fff; }
.nav a.active { background: var(--red); color: #fff; box-shadow: 0 8px 22px rgba(232, 0, 36, .35); }
.nav a.active .nav-count { background: rgba(255, 255, 255, .22); color: #fff; }
.nav-count { margin-left: auto; font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 99px; background: #1C1C24; color: #D9D9E0; }
.nav-btn kbd { margin-left: auto; background: #15151C; border-color: #26262F; color: #8B8B95; }
.rail-foot { margin-top: auto; display: flex; flex-direction: column; gap: 10px; }
.source-card { display: flex; gap: 10px; align-items: flex-start; padding: 12px; border-radius: 14px; background: #0D0D12; border: 1px solid var(--rail-line); }
.source-card strong { display: block; color: #E8E8EE; font-size: 12px; font-weight: 600; white-space: nowrap; }
.source-card small { display: block; font-size: 11.5px; margin-top: 2px; white-space: nowrap; }
.pulse { width: 8px; height: 8px; border-radius: 50%; background: var(--red); margin-top: 5px; flex: none; box-shadow: 0 0 0 0 rgba(232, 0, 36, .6); animation: pulse 2.4s infinite; }
@keyframes pulse { 70% { box-shadow: 0 0 0 8px rgba(232, 0, 36, 0); } 100% { box-shadow: 0 0 0 0 rgba(232, 0, 36, 0); } }
.rail-collapse { align-self: flex-end; width: 34px; height: 34px; border-radius: 10px; border: 1px solid var(--rail-line); background: transparent; color: var(--rail-text); display: grid; place-items: center; }
.rail-collapse svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; transition: transform .25s; }
.rail-collapse:hover { color: #fff; background: #15151C; }
body.rail-min .brand-text, body.rail-min .nav span, body.rail-min .nav-label, body.rail-min .nav-count, body.rail-min .nav-btn kbd, body.rail-min .source-card div { display: none; }
body.rail-min .nav a, body.rail-min .nav-btn { justify-content: center; padding: 11px; }
body.rail-min .source-card { justify-content: center; padding: 10px; }
body.rail-min .pulse { margin: 0; }
body.rail-min .rail-collapse { align-self: center; }
body.rail-min .rail-collapse svg { transform: rotate(180deg); }
body.rail-min .brand { justify-content: center; padding-inline: 0; }

/* ───────── Topbar ───────── */
.topbar { position: sticky; top: 0; z-index: 15; display: flex; align-items: center; gap: 16px; padding: 12px 32px; background: color-mix(in srgb, var(--bg) 82%, transparent); backdrop-filter: saturate(1.4) blur(14px); -webkit-backdrop-filter: saturate(1.4) blur(14px); border-bottom: 1px solid color-mix(in srgb, var(--line) 70%, transparent); }
.crumbs { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text-3); white-space: nowrap; min-width: 180px; }
.crumbs i { font-style: normal; opacity: .5; }
.crumbs strong { color: var(--text); font-weight: 600; }
.search-trigger { flex: 1; max-width: 520px; margin: 0 auto; display: flex; align-items: center; gap: 10px; height: 40px; padding: 0 8px 0 14px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface); color: var(--text-3); box-shadow: var(--shadow); transition: border-color .15s, box-shadow .15s; }
.search-trigger:hover { border-color: var(--line-strong); }
.search-trigger svg, .readonly-pill svg, .icon-btn svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.search-trigger span { flex: 1; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.top-actions { display: flex; align-items: center; gap: 8px; }
.readonly-pill { display: inline-flex; align-items: center; gap: 7px; height: 34px; padding: 0 12px; border-radius: 99px; background: var(--surface); border: 1px solid var(--line); font-size: 12.5px; font-weight: 600; color: var(--text-2); white-space: nowrap; }
.icon-btn { width: 38px; height: 38px; display: inline-grid; place-items: center; border-radius: 11px; border: 1px solid var(--line); background: var(--surface); color: var(--text-2); transition: background .15s, color .15s, border-color .15s; }
.icon-btn:hover:not(:disabled) { color: var(--text); border-color: var(--line-strong); }
.icon-btn:disabled { opacity: .4; cursor: default; }
.icon-btn .i { width: 17px; height: 17px; }
.i-sun { display: none; }
:root[data-theme="dark"] .i-sun { display: block; } :root[data-theme="dark"] .i-moon { display: none; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .i-sun { display: block; } :root:not([data-theme="light"]) .i-moon { display: none; } }
.foot { display: flex; justify-content: space-between; gap: 16px; padding: 16px 32px 24px; font-size: 12px; color: var(--text-3); }

/* ───────── Primitives ───────── */
.kicker { font-size: 11.5px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--red-ink); margin-bottom: 8px; }
.kicker.light { color: #FF8A9B; }
.page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding: 22px 0 22px; }
.page-head h1, .tl-head h1 { font: 650 28px/1 var(--font-display); text-transform: none; letter-spacing: -.015em; }
.page-head p { margin-top: 10px; color: var(--text-2); font-size: 15px; max-width: 720px; }
.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-xl); padding: 22px; box-shadow: var(--shadow); min-width: 0; }
.card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.card-head h2 { font-size: 18px; font-weight: 600; }
.card-head p { color: var(--text-3); font-size: 12.5px; margin-top: 3px; }
.note { color: var(--text-3); font-size: 12px; margin-top: 14px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: 11px; border: 1px solid var(--line); background: var(--surface); font-weight: 650; white-space: nowrap; transition: background .15s, border-color .15s, transform .1s, box-shadow .15s; }
.btn:hover { border-color: var(--line-strong); background: var(--surface-2); }
.btn:active { transform: scale(.98); }
.btn.primary { background: var(--red); border-color: var(--red); color: #fff; box-shadow: 0 6px 16px rgba(232, 0, 36, .28); }
.btn.primary:hover { background: var(--red-hover); }
.btn.ghost { background: var(--surface); }
.btn.sm { height: 32px; padding: 0 12px; font-size: 12.5px; border-radius: 9px; }
.btn:disabled { opacity: .45; cursor: default; }
.btn .badge { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 99px; background: var(--red); color: #fff; font-size: 11px; display: inline-grid; place-items: center; }
.link-btn { display: inline-flex; align-items: center; gap: 6px; border: 0; background: none; padding: 6px 10px; border-radius: 9px; color: var(--red-ink); font-weight: 650; font-size: 13px; white-space: nowrap; }
.link-btn:hover { background: var(--red-soft); }
.link-btn .i { width: 15px; height: 15px; }
.tag { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 10px; border-radius: 99px; background: var(--surface-3); color: var(--text-2); font-size: 11.5px; font-weight: 650; white-space: nowrap; }
.tag.red { background: var(--red-soft); color: var(--red-ink); }
.tag.archive { background: var(--amber-soft); color: var(--amber); }
.seg { display: inline-flex; padding: 3px; gap: 2px; border-radius: 12px; background: var(--surface-3); flex: none; }
.seg button { height: 32px; padding: 0 13px; border-radius: 9px; border: 0; background: transparent; color: var(--text-2); font-weight: 650; font-size: 13px; white-space: nowrap; transition: background .15s, color .15s, box-shadow .15s; }
.seg button:hover { color: var(--text); }
.seg button[aria-pressed="true"] { background: var(--surface); color: var(--text); box-shadow: 0 1px 3px rgba(0, 0, 0, .12); }
.seg.icons button { width: 36px; padding: 0; display: grid; place-items: center; }
.seg.icons button[aria-pressed="true"] { color: var(--red-ink); }
.dot { width: 9px; height: 9px; border-radius: 50%; flex: none; display: inline-block; background: var(--text-3); }
.dot.green { background: var(--green); box-shadow: 0 0 0 3px var(--green-soft); }
.dot.amber { background: var(--amber); box-shadow: 0 0 0 3px var(--amber-soft); }
.dot.red { background: var(--red); box-shadow: 0 0 0 3px var(--red-soft); }
.dir { display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: 6px; background: var(--black); color: #fff; font-size: 10px; font-weight: 650; letter-spacing: .03em; text-transform: uppercase; }
:root[data-theme="dark"] .dir { background: #fff; color: #000; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .dir { background: #fff; color: #000; } }
.dir.dobro { background: var(--red-soft); color: var(--dobro); }
.t-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 11.5px; color: var(--text-3); }
.av { --c: #777; width: 30px; height: 30px; flex: none; border-radius: 50%; display: inline-grid; place-items: center; font-size: 11px; font-weight: 600; color: var(--c); background: color-mix(in srgb, var(--c) 14%, var(--surface)); border: 1px solid color-mix(in srgb, var(--c) 28%, transparent); letter-spacing: .02em; }
.av.xs { width: 22px; height: 22px; font-size: 9px; }
.av.sm { width: 26px; height: 26px; font-size: 10px; }
.av.lg { width: 46px; height: 46px; font-size: 15px; }
.av.xl { width: 64px; height: 64px; font-size: 21px; }
.emo { font-size: 16px; line-height: 1; }
.cx { display: inline-grid; place-items: center; min-width: 28px; height: 22px; padding: 0 6px; border-radius: 7px; font-size: 11px; font-weight: 650; background: var(--surface-3); color: var(--text-2); }
.fresh { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; color: var(--text-3); }
.fresh::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--text-3); }
.fresh.fresh::before { background: var(--green); }
.fresh.stale::before { background: var(--amber); }
.lgd { width: 10px; height: 10px; border-radius: 3px; display: inline-block; flex: none; }
.lgd.work, .lgd.launch { background: var(--red); }
.lgd.pause { background: var(--text-3); }
.lgd.point { background: var(--point); }
.lgd.deadline { background: var(--amber); }
.mini-title { display: block; font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--text-3); margin-bottom: 10px; }
.sub-title { font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--text-3); margin: 18px 0 8px; }

/* Stepper */
.stepper { display: inline-flex; flex-direction: column; gap: 6px; min-width: 0; }
.stepper-track { display: grid; grid-template-columns: repeat(8, 1fr); gap: 3px; width: 100%; min-width: 96px; }
.stepper-track i { height: 5px; border-radius: 3px; background: var(--surface-3); }
.stepper-track i.done { background: color-mix(in srgb, var(--red) 45%, var(--surface-3)); }
.stepper-track i.now { background: var(--red); box-shadow: 0 0 0 2px var(--red-soft); }
.stepper-label { font-size: 12px; font-weight: 650; color: var(--text-2); }
.stepper.compact .stepper-track { min-width: 72px; width: 72px; gap: 2px; }
.stepper.compact .stepper-track i { height: 4px; }
.stepper.paused .stepper-label { display: inline-flex; height: 22px; align-items: center; padding: 0 9px; border-radius: 99px; background: var(--surface-3); font-size: 11px; }

/* Meter */
.meter { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 700; color: var(--text-2); }
.meter svg { width: 18px; height: 18px; }
.meter-track { fill: none; stroke: var(--surface-3); stroke-width: 3; }
.meter-fill { fill: none; stroke: var(--red); stroke-width: 3; stroke-linecap: round; }

/* ───────── Overview ───────── */
.hero { position: relative; overflow: hidden; margin-top: 18px; border-radius: 26px; padding: 30px 32px 26px; background: var(--black); color: #fff; isolation: isolate; }
.hero-glow { position: absolute; inset: 0; z-index: -1; background:
  radial-gradient(60% 120% at 100% 0%, rgba(232, 0, 36, .75) 0%, rgba(232, 0, 36, 0) 60%),
  radial-gradient(40% 80% at 85% 110%, rgba(155, 0, 36, .7) 0%, rgba(155, 0, 36, 0) 70%),
  linear-gradient(115deg, transparent 55%, rgba(255, 255, 255, .04) 55%, rgba(255, 255, 255, .04) 62%, transparent 62%); }
.hero-glow::after { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 32px 32px; mask-image: linear-gradient(90deg, transparent 30%, #000); }
.hero-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; }
.hero h1 { font: 650 30px/1 var(--font-display); text-transform: none; letter-spacing: -.02em; }
.hero-date { color: #C9C9D2; margin-top: 12px; font-size: 14px; }
.hero-cta { display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 18px; border-radius: 12px; background: #fff; color: var(--black); font-weight: 600; white-space: nowrap; transition: transform .15s; }
.hero-cta:hover { transform: translateY(-1px); }
.kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 28px; }
.kpi { position: relative; display: flex; flex-direction: column; gap: 4px; padding: 18px 18px 16px; border-radius: 18px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .09); backdrop-filter: blur(8px); transition: background .2s, transform .2s, border-color .2s; }
.kpi:hover { background: rgba(255, 255, 255, .11); border-color: rgba(255, 255, 255, .2); transform: translateY(-2px); }
.kpi-value { font: 650 28px/1 var(--font-display); letter-spacing: -.03em; }
.kpi-label { font-weight: 700; font-size: 14px; margin-top: 6px; }
.kpi-hint { font-size: 12px; color: #A6A6B0; }
.kpi-go { position: absolute; top: 16px; right: 16px; width: 18px; height: 18px; color: #77777F; transition: color .2s, transform .2s; }
.kpi:hover .kpi-go { color: #fff; transform: translate(2px, -2px); }
.kpi:first-child { background: var(--red); border-color: var(--red); box-shadow: 0 12px 30px rgba(232, 0, 36, .35); }
.kpi:first-child .kpi-hint { color: #FFD2D9; }
.kpi:first-child .kpi-go { color: #FFD2D9; }

.notice { margin-top: 16px; display: grid; grid-template-columns: auto 1fr; align-items: stretch; border-radius: var(--r-xl); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow); overflow: hidden; }
.notice-head { display: flex; align-items: center; gap: 10px; padding: 16px 20px; background: var(--red-soft); color: var(--red-ink); border-right: 1px solid var(--line); }
.notice-head h2 { font-size: 14px; font-weight: 650; white-space: nowrap; }
.notice-n { min-width: 22px; height: 22px; border-radius: 99px; background: var(--red); color: #fff; font-size: 11px; font-weight: 650; display: grid; place-items: center; }
.notice-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.notice-list li { display: flex; flex-direction: column; justify-content: center; gap: 4px; padding: 12px 20px; border-left: 1px solid var(--line); animation: rise .5s var(--ease) both; animation-delay: calc(var(--i) * 60ms + .1s); }
.notice-list li:first-child { border-left: 0; }
.notice-date { font-size: 11px; font-weight: 600; color: var(--red-ink); text-transform: none; letter-spacing: 0; }
.notice-list p { font-weight: 600; }
.notice-empty { color: var(--text-3); }

.grid-overview { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 16px; margin-top: 16px; align-items: stretch; }
.events-card { display: flex; flex-direction: column; }
.events-card .seg { align-self: flex-start; margin-bottom: 10px; }
/* Высота событий следует за высотой «Команды и нагрузки»; длинный список прокручивается внутри. */
.events-scroll { flex: 1; min-height: 260px; contain: size; overflow: auto; margin: 0 -10px; padding: 0 10px; scrollbar-width: thin; }
.day { display: grid; grid-template-columns: 74px 1fr; gap: 12px; padding: 12px 0; border-top: 1px solid var(--line); }
.day:first-child { border-top: 0; }
.day-head { display: flex; flex-direction: column; gap: 2px; padding-top: 6px; }
.day-head strong { font: 650 20px/1 var(--font-display); }
.day-head span { font-size: 12px; font-weight: 650; color: var(--text-2); display: flex; flex-direction: column; }
.day-head small { font-weight: 500; color: var(--text-3); font-size: 11px; }
.day-items { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ev { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 13px; background: var(--surface-2); border: 1px solid transparent; transition: border-color .15s, background .15s, transform .15s; }
.ev:hover { border-color: var(--line-strong); background: var(--surface); transform: translateX(2px); }
.ev-kind { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--point); white-space: nowrap; }
.ev-kind .i { width: 13px; height: 13px; }
.ev-kind.launch { color: var(--red-ink); }
.ev-kind.deadline { color: var(--amber); }
.ev-main { min-width: 0; display: flex; flex-direction: column; }
.ev-main strong { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ev-main small { color: var(--text-3); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.loads { display: flex; flex-direction: column; gap: 4px; }
.load { display: grid; grid-template-columns: 30px 92px 1fr 48px; align-items: center; gap: 12px; padding: 9px 10px; margin: 0 -10px; border-radius: 12px; transition: background .15s; }
.load:hover { background: var(--surface-2); }
.load-name { font-weight: 650; }
.load-bar { position: relative; height: 10px; border-radius: 99px; background: var(--surface-3); }
.load-bar i { position: absolute; left: 0; top: 0; bottom: 0; width: var(--w); border-radius: 99px; background: linear-gradient(90deg, #6B6B75, #2F2F38); animation: grow .9s var(--ease) both; animation-delay: calc(var(--i, 0) * 50ms); }
:root[data-theme="dark"] .load-bar i { background: linear-gradient(90deg, #5A5A66, #B4B4BE); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .load-bar i { background: linear-gradient(90deg, #5A5A66, #B4B4BE); } }
.load-bar i.high { background: linear-gradient(90deg, #FF7A8E, var(--red)); }
.load-bar i.over { background: linear-gradient(90deg, var(--red), var(--red-deep)); }
.load-bar .cap { position: absolute; top: -4px; bottom: -4px; width: 2px; border-radius: 2px; background: var(--text); opacity: .35; }
.load strong { text-align: right; font-weight: 650; font-size: 15px; }
.load strong.over { color: var(--red-ink); }
@keyframes grow { from { width: 0; } }

.heat { display: grid; grid-template-columns: 112px repeat(var(--cols), minmax(0, 1fr)); gap: 4px; align-items: center; }
.heat-corner, .heat-week { font-size: 11px; color: var(--text-3); font-weight: 650; text-align: center; line-height: 1.1; }
.heat-corner { text-align: left; }
.heat-week small { display: block; font-weight: 500; }
.heat-name { display: flex; align-items: center; gap: 8px; font-weight: 650; font-size: 13px; padding: 4px 0; white-space: nowrap; }
.heat-name:hover { color: var(--red-ink); }
.heat-cell { height: 34px; border-radius: 9px; display: grid; place-items: center; font-size: 12px; font-weight: 600; color: var(--text); background: color-mix(in srgb, var(--red) calc(var(--v) * 70%), var(--surface-2)); transition: transform .15s; }
.heat-cell[data-level="high"], .heat-cell[data-level="over"] { color: #fff; }
.heat-cell[data-level="over"] { background: var(--red-deep); box-shadow: inset 0 0 0 2px var(--red); }
.heat-cell:hover { transform: scale(1.06); }

.weekly { margin-top: 16px; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.chips button { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 14px 0 7px; border-radius: 99px; border: 1px solid var(--line); background: var(--surface); font-weight: 650; transition: border-color .15s, background .15s; }
.chips button:last-child { padding-left: 14px; }
.chips button:hover { border-color: var(--line-strong); }
.chips button[aria-pressed="true"] { background: var(--black); color: #fff; border-color: var(--black); }
:root[data-theme="dark"] .chips button[aria-pressed="true"] { background: #fff; color: #000; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .chips button[aria-pressed="true"] { background: #fff; color: #000; } }
.report-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; }
.report-cols section { padding: 18px 20px; }
.report-cols section + section { border-left: 1px solid var(--line); background: var(--surface-2); }
.report-cols h4 { font-size: 11px; letter-spacing: 0; text-transform: none; color: var(--text-3); margin-bottom: 10px; }
.report-cols p { font-size: 14px; line-height: 1.6; }
.report-all { display: flex; flex-direction: column; gap: 18px; }
.report-pm { display: flex; align-items: center; gap: 8px; font-size: 15px; margin-bottom: 10px; }

/* ───────── My work ───────── */
.pm-picker { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 16px; }
.pm-picker a { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px 0 7px; border-radius: 99px; border: 1px solid var(--line); background: var(--surface); font-weight: 650; transition: border-color .15s, background .15s; }
.pm-picker a:hover { border-color: var(--line-strong); }
.pm-picker a[aria-current="true"] { background: var(--red); border-color: var(--red); color: #fff; box-shadow: 0 6px 16px rgba(232, 0, 36, .28); }
.pm-picker a[aria-current="true"] .av { background: #fff; border-color: #fff; }
.me-hero { margin-bottom: 0; display: grid; grid-template-columns: 1.3fr auto 1.4fr 1fr; gap: 28px; align-items: center; padding: 24px 28px; border-radius: 24px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow); }
.me-id { display: flex; align-items: center; gap: 16px; }
.me-id h2 { font: 650 22px/1 var(--font-display); text-transform: none; }
.me-id p { color: var(--text-2); margin-top: 6px; }
.me-gauge { display: flex; flex-direction: column; align-items: center; gap: 2px; font-size: 12px; color: var(--text-3); }
.gauge { width: 120px; height: 70px; }
.g-track, .g-fill { fill: none; stroke-width: 9; stroke-linecap: round; }
.g-track { stroke: var(--surface-3); }
.g-fill { stroke: var(--text); }
.g-fill.over { stroke: var(--red); }
.gauge text { font: 650 15px var(--font-display); fill: var(--text); }
.spark { position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 5px; align-items: end; height: 76px; padding-top: 14px; }
.spark span { position: relative; height: var(--h); min-height: 4px; border-radius: 6px 6px 3px 3px; background: var(--surface-3); animation: rise-bar .8s var(--ease) both; transform-origin: bottom; }
.spark span.high { background: color-mix(in srgb, var(--red) 55%, var(--surface-3)); }
.spark span.over { background: var(--red); }
.spark b { position: absolute; top: -15px; left: 0; right: 0; text-align: center; font-size: 10px; color: var(--text-3); font-weight: 650; }
.spark-cap { position: absolute; left: -2px; right: -2px; height: 0; border-top: 1.5px dashed color-mix(in srgb, var(--text) 40%, transparent); }
.spark.small { height: 58px; }
@keyframes rise-bar { from { transform: scaleY(0); } }
.me-stats { display: flex; flex-direction: column; gap: 10px; }
.me-stats div { display: flex; align-items: baseline; gap: 10px; }
.me-stats strong { font: 650 20px/1 var(--font-display); min-width: 28px; }
.me-stats span { color: var(--text-2); font-size: 12.5px; }
.grid-my { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 16px; margin-top: 16px; align-items: start; }
.agenda { display: flex; flex-direction: column; }
.ag { display: grid; grid-template-columns: 44px 70px minmax(0, 1fr); gap: 12px; align-items: center; padding: 10px 8px; border-radius: 12px; border-top: 1px solid var(--line); }
.ag:first-child { border-top: 0; }
.ag:hover { background: var(--surface-2); }
.ag-date { display: flex; flex-direction: column; align-items: center; font-size: 11px; color: var(--text-3); line-height: 1.1; }
.ag-date strong { font: 650 16px/1 var(--font-display); color: var(--text); }
.mini-projects { display: flex; flex-direction: column; }
.mp { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 8px; border-radius: 12px; border-top: 1px solid var(--line); }
.mp:first-child { border-top: 0; }
.mp:hover { background: var(--surface-2); }
.mp-main { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.mp-main strong { display: flex; align-items: center; gap: 8px; font-weight: 700; }
.mp-main small { color: var(--text-3); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mp-side { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; font-size: 12px; color: var(--text-2); }

/* ───────── Portfolio ───────── */
.switch { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; font-size: 13px; color: var(--text-2); cursor: pointer; white-space: nowrap; }
.switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.switch-ui { width: 40px; height: 24px; border-radius: 99px; background: var(--line-strong); position: relative; transition: background .2s; }
.switch-ui::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .25); transition: transform .2s var(--ease); }
.switch input:checked + .switch-ui { background: var(--red); }
.switch input:checked + .switch-ui::after { transform: translateX(16px); }
.switch input:focus-visible + .switch-ui { outline: 2px solid var(--red); outline-offset: 2px; }

.dash { margin-bottom: 16px; }
.dash summary { list-style: none; display: flex; align-items: baseline; gap: 12px; padding: 4px 2px 12px; cursor: pointer; }
.dash summary::-webkit-details-marker { display: none; }
.dash summary span { font-size: 18px; font-weight: 650; font-family: var(--font-display); }
.dash summary small { color: var(--text-3); font-size: 12.5px; }
.dash-chev { margin-left: auto; align-self: center; transition: transform .2s; color: var(--text-3); }
.dash[open] .dash-chev { transform: rotate(180deg); }
.dash-grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr) minmax(0, 1.05fr); gap: 16px; }
.dash h3 { display: flex; justify-content: space-between; align-items: baseline; font-size: 15px; font-weight: 600; margin-bottom: 16px; }
.dash h3 small { font-size: 11.5px; color: var(--text-3); font-weight: 500; }
.ring-card { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto 1fr auto; column-gap: 18px; }
.ring-card h3 { grid-column: 1 / -1; }
.ring-wrap { position: relative; width: 136px; height: 136px; }
.ring { width: 136px; height: 136px; }
.ring circle { fill: none; stroke-width: 16; }
.ring-track { stroke: var(--surface-3); }
.ring-work { stroke: var(--red); stroke-linecap: butt; animation: draw 1s var(--ease) both; }
.ring-pause { stroke: var(--text-3); animation: draw 1s var(--ease) both .3s; }
@keyframes draw { from { stroke-dasharray: 0 999; } }
.ring-center { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; }
.ring-center strong { font: 650 28px/1 var(--font-display); }
.ring-center span { font-size: 11px; color: var(--text-3); margin-top: 4px; }
.ring-legend { display: flex; flex-direction: column; gap: 8px; justify-content: center; }
.ring-legend a { white-space: nowrap; display: grid; grid-template-columns: auto 1fr auto; grid-template-rows: auto auto; align-items: center; column-gap: 8px; padding: 10px 12px; border-radius: 12px; background: var(--surface-2); border: 1px solid transparent; font-weight: 600; font-size: 13px; transition: border-color .15s; }
.ring-legend a:hover { border-color: var(--line-strong); }
.ring-legend strong { grid-row: span 2; font: 650 20px/1 var(--font-display); }
.ring-legend small { grid-column: 2; color: var(--text-3); font-size: 11.5px; font-weight: 500; }
.dir-split { grid-column: 1 / -1; display: flex; gap: 4px; margin-top: 16px; }
.dir-split a { display: flex; justify-content: space-between; align-items: center; height: 34px; padding: 0 12px; border-radius: 10px; background: var(--black); color: #fff; font-size: 11px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; min-width: 110px; transition: filter .15s; }
.dir-split a.dobro { background: var(--red); }
.dir-split a:hover { filter: brightness(1.15); }
.dir-split strong { font-size: 14px; }
:root[data-theme="dark"] .dir-split a:not(.dobro) { background: #fff; color: #000; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .dir-split a:not(.dobro) { background: #fff; color: #000; } }
.stage-bars { display: flex; flex-direction: column; gap: 4px; }
.sbar { display: grid; grid-template-columns: 128px 1fr 30px; align-items: center; gap: 12px; padding: 6px 8px; margin: 0 -8px; border-radius: 10px; font-size: 13px; transition: background .15s; }
.sbar:hover { background: var(--surface-2); }
.sbar span:first-child { color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sbar-track { height: 14px; border-radius: 5px; background: var(--surface-2); overflow: hidden; }
.sbar-track i { display: block; height: 100%; width: var(--w); border-radius: 5px; background: var(--red); animation: grow .9s var(--ease) both; animation-delay: var(--d); }
.sbar-track i.paused { background: var(--text-3); }
.sbar strong { text-align: right; font-weight: 650; }
.type-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.type-tile { display: flex; flex-direction: column; justify-content: space-between; gap: 6px; min-height: 64px; padding: 10px 12px; border-radius: 12px; background: var(--surface-2); border: 1px solid transparent; transition: border-color .15s, transform .15s; }
.type-tile:hover { border-color: var(--line-strong); transform: translateY(-1px); }
.type-tile span { font-size: 12px; font-weight: 600; color: var(--text-2); line-height: 1.2; }
.type-tile strong { font: 650 18px/1 var(--font-display); }
.type-tile { position: relative; overflow: hidden; }
.type-tile strong small { font: 600 11px var(--font); color: var(--text-3); margin-left: 6px; }
.type-share { position: absolute; left: 0; bottom: 0; height: 3px; width: var(--w); background: var(--red); border-radius: 0 3px 3px 0; }

.list-card { padding: 0; overflow: hidden; }
.toolbar { display: flex; align-items: center; gap: 10px; padding: 16px 18px; flex-wrap: wrap; }
.toolbar-right { margin-left: auto; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.search { flex: 1 1 260px; max-width: 420px; display: flex; align-items: center; gap: 10px; height: 40px; padding: 0 12px; border-radius: 11px; border: 1px solid var(--line); background: var(--surface-2); color: var(--text-3); transition: border-color .15s, background .15s, box-shadow .15s; }
.search:focus-within { border-color: var(--red); background: var(--surface); box-shadow: 0 0 0 4px var(--red-soft); }
.search input { flex: 1; min-width: 0; border: 0; background: none; outline: none; color: var(--text); height: 100%; }
.search input::-webkit-search-cancel-button { filter: grayscale(1); }
.fchips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 0 18px 12px; }
.fchip { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 8px 0 12px; border-radius: 99px; border: 1px solid var(--red-soft-2); background: var(--red-soft); color: var(--red-ink); font-weight: 650; font-size: 12.5px; }
.fchip small { color: var(--text-3); font-weight: 500; }
.fchip .i { width: 14px; height: 14px; }
.fchip:hover { border-color: var(--red); }
.result-line { display: flex; align-items: center; gap: 10px; padding: 10px 18px; border-top: 1px solid var(--line); background: var(--surface-2); font-size: 12.5px; color: var(--text-3); font-weight: 600; }

.table-wrap { overflow: auto; max-height: calc(100vh - 180px); }
@media (min-width: 1281px) {
  .table-wrap { overflow: visible; max-height: none; }
  .ptable th { top: 65px; }
  .list-card { overflow: visible; }
  .list-card .toolbar { border-radius: var(--r-xl) var(--r-xl) 0 0; }
}
.ptable { width: 100%; min-width: 1120px; border-collapse: separate; border-spacing: 0; table-layout: fixed; font-size: 13px; }
.ptable col.c-proj { width: 22%; } .ptable col.c-pm { width: 10%; } .ptable col.c-type { width: 8%; } .ptable col.c-cx { width: 5%; }
.ptable col.c-stage { width: 11%; } .ptable col.c-date { width: 12%; } .ptable col.c-text { width: 16%; }
.ptable th { position: sticky; top: 0; z-index: 2; text-align: left; font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--text-3); background: var(--surface); padding: 11px 12px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.ptable td { padding: 12px; border-bottom: 1px solid var(--line); vertical-align: top; transition: background .12s; }
.ptable tbody tr:hover td { background: var(--surface-2); }
.ptable tr.peeked td { background: var(--red-soft); }
.ptable tr.peeked td:first-child { box-shadow: inset 3px 0 0 var(--red); }
.t-proj { display: flex; align-items: center; gap: 9px; margin-bottom: 6px; }
.t-name { font-weight: 600; font-size: 14px; line-height: 1.25; }
.t-name:hover { color: var(--red-ink); }
.t-pm { display: inline-flex; align-items: center; gap: 7px; font-weight: 600; white-space: nowrap; }
.t-stage { display: block; font-size: 12px; margin-top: 6px; color: var(--text-2); font-weight: 600; }
.t-date { display: block; font-weight: 700; white-space: nowrap; }
.t-rel { display: block; color: var(--text-3); font-size: 11.5px; margin-top: 2px; }
.t-text { display: block; width: 100%; text-align: left; border: 0; background: none; padding: 0; color: var(--text-2); font-size: 12.5px; line-height: 1.45; }
.t-text span { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; white-space: pre-line; }
.t-text:hover { color: var(--text); }
.t-text + .fresh { margin-top: 6px; }

.plist { display: flex; flex-direction: column; }
.lrow { display: grid; grid-template-columns: 44px minmax(0, 2.2fr) minmax(150px, 1fr) minmax(0, 1.5fr) 150px; gap: 18px; align-items: center; padding: 14px 18px; border-top: 1px solid var(--line); transition: background .15s; }
.lrow:first-child { border-top: 0; }
.lrow:hover { background: var(--surface-2); }
.lr-emo { width: 44px; height: 44px; border-radius: 13px; background: var(--surface-2); border: 1px solid var(--line); display: grid; place-items: center; font-size: 21px; }
.lr-main { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.lr-title { display: flex; align-items: center; gap: 9px; }
.lr-title strong { font-size: 15px; font-weight: 600; }
.lr-desc { color: var(--text-3); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lr-owner { display: flex; align-items: center; gap: 10px; min-width: 0; }
.lr-owner > span { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.lr-owner strong { font-weight: 650; }
.lr-plan { min-width: 0; font-size: 12.5px; color: var(--text-2); }
.lr-plan small { display: block; font-size: 10.5px; letter-spacing: 0; text-transform: none; color: var(--text-3); font-weight: 600; margin-bottom: 3px; }
.lr-plan > span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.lr-date { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; text-align: right; }
.lr-date strong { font-weight: 600; white-space: nowrap; }
.lr-date small { color: var(--text-3); font-size: 11.5px; }

.board { display: flex; gap: 12px; padding: 16px 18px 20px; overflow-x: auto; align-items: flex-start; }
.bcol { flex: 0 0 270px; display: flex; flex-direction: column; gap: 8px; padding: 10px; border-radius: 18px; background: var(--surface-2); border: 1px solid var(--line); }
.bcol header { display: flex; justify-content: space-between; align-items: center; padding: 4px 6px 6px; font-weight: 650; font-size: 13px; }
.bcol header b { min-width: 24px; height: 22px; padding: 0 7px; border-radius: 99px; background: var(--red); color: #fff; font-size: 11px; display: grid; place-items: center; }
.bcol.paused header b { background: var(--text-3); }
.bcard { display: flex; flex-direction: column; gap: 8px; padding: 12px; border-radius: 14px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow); transition: transform .15s, border-color .15s, box-shadow .15s; }
.bcard:hover { transform: translateY(-2px); border-color: var(--line-strong); box-shadow: 0 10px 24px rgba(0, 0, 0, .08); }
.bcard strong { font-weight: 600; line-height: 1.3; }
.bc-top { display: flex; align-items: center; gap: 8px; }
.bc-dir { margin-left: auto; font-size: 10px; font-weight: 650; letter-spacing: .05em; text-transform: uppercase; color: var(--text-3); }
.bc-plan { font-size: 12px; color: var(--text-3); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.bc-foot { display: flex; align-items: center; gap: 7px; font-size: 12px; color: var(--text-2); font-weight: 600; }
.bc-date { margin-left: auto; font-weight: 700; color: var(--text); }

/* ───────── Timeline ───────── */
.tl-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 16px 0 14px; }
.tl-head h1 { font-size: 30px !important; }
.tl-head p { color: var(--text-3); font-size: 13px; margin-top: 6px; }
.tl-period { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tl-period strong { font-size: 15px; font-weight: 600; min-width: 220px; text-align: center; text-transform: capitalize; }
.month-pick { display: inline-flex; align-items: center; gap: 6px; height: 38px; padding: 0 10px; border-radius: 11px; border: 1px solid var(--line); background: var(--surface); color: var(--text-3); }
.month-pick input { border: 0; background: none; outline: none; color: var(--text); font-weight: 600; }
.tl-card { padding: 0; overflow: hidden; }
.tl-legend { gap: 14px; font-size: 12px; color: var(--text-2); font-weight: 600; }
.tl-legend span { display: inline-flex; align-items: center; gap: 6px; }
.tl-scroll { overflow-x: auto; border-top: 1px solid var(--line); }
.tl-grid { display: grid; grid-template-columns: 158px repeat(var(--cols), minmax(0, 1fr)); width: max(100%, calc(158px + var(--cols) * 158px)); }
.tl-corner { position: sticky; left: 0; z-index: 3; background: var(--surface); padding: 10px 14px; font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--text-3); border-right: 1px solid var(--line); }
.tl-corner.sub { border-bottom: 1px solid var(--line); text-transform: none; letter-spacing: 0; font-weight: 600; }
.tl-month { padding: 10px 12px; font: 650 13px var(--font-display); text-transform: none; letter-spacing: 0; border-left: 2px solid var(--line-strong); background: var(--surface-2); }
.tl-month.first { border-left-color: var(--red); color: var(--red-ink); background: var(--red-soft); }
.tl-week { padding: 7px 10px; font-size: 11.5px; font-weight: 650; color: var(--text-3); border-left: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--surface); }
.tl-week.mstart { border-left: 2px solid var(--line-strong); }
.tl-week.now { color: #fff; background: var(--red); }
.tl-pm { position: sticky; left: 0; z-index: 2; display: flex; align-items: center; gap: 10px; padding: 8px 14px; background: var(--surface); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); transition: background .15s; }
.tl-pm:hover { background: var(--surface-2); }
.tl-pm strong { display: block; font-weight: 700; font-size: 13px; }
.tl-pm small { display: block; font-size: 11px; color: var(--text-3); }
.tl-cell { position: relative; display: flex; flex-direction: column; gap: 4px; padding: 6px; min-height: 50px; min-width: 0; border-left: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.tl-cell.mstart { border-left: 2px solid var(--line-strong); }
.tl-cell.now { background: color-mix(in srgb, var(--red-soft) 60%, transparent); }
.tl-today { position: absolute; top: 0; bottom: -1px; width: 2px; margin-left: -1px; background: var(--red); opacity: .55; pointer-events: none; }
.tl-ev { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: flex-start; gap: 1px; width: 100%; padding: 5px 7px 5px 9px; border-radius: 9px; border: 0; text-align: left; background: var(--point-soft); color: var(--text); font-size: 11.5px; line-height: 1.25; box-shadow: inset 3px 0 0 var(--point); transition: transform .12s, box-shadow .12s, filter .12s; }
.tl-ev:hover { transform: translateY(-1px); filter: brightness(.97); }
.tl-ev.launch { background: var(--red-soft); box-shadow: inset 3px 0 0 var(--red); }
.tl-ev.deadline { background: var(--amber-soft); box-shadow: inset 3px 0 0 var(--amber); }
.tl-ev-d { font-size: 10.5px; font-weight: 650; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; }
.tl-ev-n { font-weight: 700; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; width: 100%; }
.tl-cell.has-more .tl-ev { padding-right: 36px; }
.tl-more { position: absolute; z-index: 2; top: 9px; right: 9px; height: 19px; padding: 0 7px; border-radius: 99px; border: 1px solid var(--line-strong); background: var(--surface); font-size: 11px; font-weight: 650; color: var(--red-ink); }
.tl-more:hover { border-color: var(--red); }
.tl-foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 18px; font-size: 12px; color: var(--text-3); border-top: 1px solid var(--line); background: var(--surface-2); }

/* ───────── Team ───────── */
.people { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }
.person { display: flex; flex-direction: column; gap: 16px; padding: 20px; border-radius: var(--r-xl); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow); animation: rise .5s var(--ease) both; animation-delay: calc(var(--i) * 40ms); }
.person header { display: flex; align-items: center; gap: 12px; }
.person header h2 { font-size: 18px; font-weight: 650; }
.person header p { color: var(--text-3); font-size: 12.5px; }
.person .gauge { margin-left: auto; width: 92px; height: 54px; }
.person-next { display: flex; flex-direction: column; gap: 2px; }
.pn { display: grid; grid-template-columns: 40px 64px minmax(0, 1fr); gap: 8px; align-items: center; padding: 6px 6px; margin: 0 -6px; border-radius: 9px; font-size: 12.5px; }
.pn:hover { background: var(--surface-2); }
.pn-date { font-weight: 650; }
.pn-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 600; }
.person footer { display: flex; gap: 8px; margin-top: auto; }
.grid-team { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 16px; margin-top: 16px; align-items: start; }
.regular { display: flex; flex-direction: column; gap: 8px; }
.reg { display: grid; grid-template-columns: 20px 1fr auto; gap: 12px; align-items: center; padding: 12px; border-radius: 13px; background: var(--surface-2); }
.reg .i { color: var(--red-ink); }
.reg strong { display: block; font-weight: 700; }
.reg small { color: var(--text-3); font-size: 12px; }
.reg small a { color: var(--text-2); text-decoration: underline; text-decoration-color: var(--line-strong); }
.reg-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; }

/* ───────── Project ───────── */
.back { display: inline-flex; align-items: center; gap: 6px; margin: 18px 0 12px; padding: 6px 10px 6px 6px; border-radius: 9px; font-weight: 650; color: var(--text-2); }
.back:hover { background: var(--surface); color: var(--text); }
.back .i { width: 16px; height: 16px; }
.p-hero { position: relative; border-radius: 26px; padding: 26px 28px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow); overflow: hidden; }
.p-hero::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 6px; background: var(--red); }
.p-hero-main { display: grid; grid-template-columns: auto 1fr auto; gap: 18px; align-items: flex-start; }
.p-emo { width: 64px; height: 64px; border-radius: 18px; background: var(--surface-2); border: 1px solid var(--line); display: grid; place-items: center; font-size: 32px; }
.p-emo.sm { width: 48px; height: 48px; font-size: 24px; border-radius: 14px; flex: none; }
.p-hero h1 { font: 650 26px/1.05 var(--font-display); margin: 8px 0 8px; letter-spacing: -.02em; }
.p-hero-main p { color: var(--text-2); max-width: 760px; }
.status-tag { display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 12px; border-radius: 99px; font-weight: 700; font-size: 12.5px; background: var(--surface-3); white-space: nowrap; }
.status-tag i { width: 8px; height: 8px; border-radius: 50%; background: var(--text-3); }
.status-tag.green { background: var(--green-soft); color: var(--green); } .status-tag.green i { background: var(--green); }
.status-tag.amber { background: var(--amber-soft); color: var(--amber); } .status-tag.amber i { background: var(--amber); }
.status-tag.red { background: var(--red-soft); color: var(--red-ink); } .status-tag.red i { background: var(--red); }
.p-stage { margin: 22px 0 18px; max-width: 520px; }
.p-stage .stepper, .dr-stage .stepper { display: flex; width: 100%; }
.p-stage .stepper-track i { height: 7px; }
.facts { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 16px; overflow: hidden; }
.facts > div { display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; background: var(--surface-2); }
.facts span { font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--text-3); }
.facts strong { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 600; }
.facts strong small { color: var(--text-3); font-weight: 500; font-size: 12px; }
.facts > div > small { color: var(--text-3); font-size: 12px; }
.tabs { display: flex; gap: 4px; margin: 18px 0 14px; padding: 4px; border-radius: 14px; background: var(--surface-3); width: max-content; max-width: 100%; overflow-x: auto; }
.tabs button { height: 36px; padding: 0 16px; border: 0; border-radius: 10px; background: none; font-weight: 650; color: var(--text-2); white-space: nowrap; }
.tabs button:hover { color: var(--text); }
.tabs button[aria-selected="true"] { background: var(--surface); color: var(--text); box-shadow: 0 1px 3px rgba(0, 0, 0, .12); }
.grid-card { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.stack { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.field { display: flex; flex-direction: column; gap: 6px; padding: 12px 0; border-top: 1px solid var(--line); }
.card-head + .field, .plan-grid .field { border-top: 0; padding-top: 0; }
.field > span { font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--text-3); }
.field p { font-size: 14px; line-height: 1.6; }
.field.accent { padding: 14px 16px; border-radius: 14px; background: var(--red-soft); border: 0; }
.field.accent > span { color: var(--red-ink); }
.plan-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.plan-grid .field:not(.accent) { padding: 14px 16px; border-radius: 14px; background: var(--surface-2); }
.budget { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.budget div { padding: 12px 14px; border-radius: 12px; background: var(--surface-2); display: flex; flex-direction: column; gap: 4px; }
.budget span { font-size: 11.5px; color: var(--text-3); font-weight: 600; }
.budget strong { font: 650 15px var(--font-display); }
.kpi-list { display: flex; flex-direction: column; gap: 10px; }
.kpi-row { display: grid; grid-template-columns: 1fr auto; gap: 6px 16px; padding: 12px 14px; border-radius: 12px; background: var(--surface-2); }
.kpi-row strong { display: block; font-weight: 700; }
.kpi-row small { color: var(--text-3); font-size: 11.5px; }
.kpi-nums { display: flex; gap: 14px; font-size: 12px; color: var(--text-3); align-items: center; }
.kpi-nums b { color: var(--text); font-weight: 650; margin-left: 4px; }
.kpi-bar { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 44px; gap: 10px; align-items: center; }
.kpi-bar::before { content: ""; grid-area: 1 / 1; height: 8px; border-radius: 99px; background: var(--surface-3); }
.kpi-bar i { grid-area: 1 / 1; height: 8px; width: var(--w); border-radius: 99px; background: var(--text-2); animation: grow .9s var(--ease) both; }
.kpi-bar i.done { background: var(--red); }
.kpi-bar span { font-size: 12px; font-weight: 650; text-align: right; }
.mtl { list-style: none; margin: 0; padding: 0; position: relative; }
.mtl::before { content: ""; position: absolute; left: 17px; top: 18px; bottom: 18px; width: 2px; background: var(--line); }
.mtl li { position: relative; display: grid; grid-template-columns: 36px 1fr auto; gap: 14px; align-items: flex-start; padding: 10px 0; }
.mtl-dot { position: relative; z-index: 1; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--surface); border: 2px solid var(--red); font-size: 15px; }
.mtl li.is-past .mtl-dot { border-color: var(--line-strong); filter: grayscale(.6); }
.mtl-date { font-size: 11.5px; font-weight: 600; color: var(--red-ink); text-transform: none; letter-spacing: 0; }
.mtl li.is-past .mtl-date { color: var(--text-3); }
.mtl h4 { font-size: 15px; font-weight: 600; margin: 3px 0 4px; }
.mtl p { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; color: var(--text-2); font-size: 12.5px; }
.mtl p.pre { display: block; margin-top: 6px; }
.source { display: flex; align-items: center; gap: 12px; }
.source .i { width: 22px; height: 22px; color: var(--red-ink); }
.source strong { display: block; font-weight: 700; }
.source small { color: var(--text-3); font-size: 12px; }

/* ───────── Drawer ───────── */
.drawer-scrim { position: fixed; inset: 0; z-index: 40; background: rgba(5, 5, 10, .28); opacity: 0; transition: opacity .2s; }
.drawer-scrim.on { opacity: 1; }
.drawer { position: fixed; z-index: 41; top: 10px; right: 10px; bottom: 10px; width: min(520px, calc(100vw - 20px)); display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--line); border-radius: 22px; box-shadow: var(--shadow-lg); transform: translateX(calc(100% + 24px)); transition: transform .3s var(--ease); visibility: hidden; }
.drawer.open { transform: none; visibility: visible; }
.dr-head { display: flex; gap: 14px; align-items: flex-start; padding: 20px 20px 16px; border-bottom: 1px solid var(--line); }
.dr-head > div { flex: 1; min-width: 0; }
.dr-head h2 { font: 650 21px/1.2 var(--font-display); margin-top: 6px; }
.dr-body { flex: 1; overflow: auto; padding: 18px 20px; display: flex; flex-direction: column; gap: 12px; }
.dr-body .field { border-top: 0; padding: 0; }
.dr-body .field:not(.accent) { padding: 14px 16px; border-radius: 14px; background: var(--surface-2); }
.dr-body .field.accent { padding: 14px 16px; }
.dr-stage { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; }
.dr-stage .stepper { flex: 1; }
.dr-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.dr-facts > div { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; border-radius: 13px; border: 1px solid var(--line); }
.dr-facts span { font-size: 11px; color: var(--text-3); font-weight: 600; letter-spacing: 0; text-transform: none; }
.dr-facts strong { display: flex; align-items: center; gap: 7px; font-weight: 600; }
.dr-facts small { color: var(--text-3); font-size: 12px; }
.dr-points { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.dr-points li { display: grid; grid-template-columns: 48px 1fr auto; gap: 8px; font-size: 13px; }
.dr-points b { color: var(--red-ink); }
.dr-points small { color: var(--text-3); }
.dr-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 20px; border-top: 1px solid var(--line); }
.kbd-hint { font-size: 12px; color: var(--text-3); display: inline-flex; gap: 6px; align-items: center; }

/* ───────── Modal, sheet, palette ───────── */
.modal { border: 0; padding: 0; border-radius: 22px; background: var(--surface); color: var(--text); width: min(640px, calc(100vw - 24px)); max-height: min(80vh, 760px); box-shadow: var(--shadow-lg); animation: pop .22s var(--ease); }
.modal::backdrop { background: rgba(5, 5, 10, .4); backdrop-filter: blur(3px); }
@keyframes pop { from { opacity: 0; transform: translateY(8px) scale(.98); } }
.modal-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 18px 20px; border-bottom: 1px solid var(--line); position: sticky; top: 0; background: var(--surface); z-index: 1; }
.modal-head h2 { font-size: 18px; font-weight: 650; }
.modal-body { padding: 16px 20px 20px; }
.modal.sheet { margin: 10px 10px 10px auto; height: calc(100vh - 20px); max-height: none; width: min(440px, calc(100vw - 20px)); display: flex; flex-direction: column; animation: slide .28s var(--ease); }
.modal.sheet[open] { display: flex; }
@keyframes slide { from { transform: translateX(40px); opacity: 0; } }
.modal.sheet .modal-body { flex: 1; overflow: auto; padding: 0; }
.fsheet { display: flex; flex-direction: column; min-height: 100%; }
.fsheet .hint { padding: 14px 20px 0; color: var(--text-3); font-size: 12.5px; }
.fsheet fieldset { border: 0; margin: 0; padding: 18px 20px 4px; }
.fsheet fieldset + fieldset { border-top: 1px solid var(--line); margin-top: 14px; }
.fsheet legend { float: left; width: 100%; font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--text-3); margin-bottom: 10px; padding: 0; }
.fopts { clear: both; display: flex; flex-wrap: wrap; gap: 6px; }
.fopt { position: relative; display: inline-flex; align-items: center; gap: 7px; height: 36px; padding: 0 13px; border-radius: 99px; border: 1px solid var(--line); background: var(--surface); font-weight: 600; font-size: 13px; cursor: pointer; transition: background .12s, border-color .12s, color .12s; }
.fopt:has(.av) { padding-left: 6px; }
.fopt input { position: absolute; opacity: 0; pointer-events: none; }
.fopt:hover { border-color: var(--line-strong); }
.fopt:has(input:checked) { background: var(--red); border-color: var(--red); color: #fff; }
.fopt:has(input:focus-visible) { outline: 2px solid var(--red); outline-offset: 2px; }
.fsheet-foot { position: sticky; bottom: 0; margin-top: auto; display: flex; gap: 8px; justify-content: space-between; padding: 14px 20px; border-top: 1px solid var(--line); background: var(--surface); }
.fsheet-foot .primary { flex: 1; }
.mlist { display: flex; flex-direction: column; gap: 8px; }
.mlist article { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; border-radius: 14px; background: var(--surface-2); }
.mlist-title { font-weight: 600; font-size: 15px; }
.mlist-title:hover { color: var(--red-ink); }
.mlist small { display: flex; align-items: center; gap: 6px; color: var(--text-3); font-size: 12px; }
.modal.palette { margin-top: 12vh; width: min(640px, calc(100vw - 24px)); max-height: 66vh; display: flex; flex-direction: column; overflow: hidden; }
.modal.palette[open] { display: flex; }
.pal-input { display: flex; align-items: center; gap: 12px; padding: 16px 18px; border-bottom: 1px solid var(--line); color: var(--text-3); }
.pal-input input { flex: 1; border: 0; outline: none; background: none; font-size: 17px; color: var(--text); }
.pal-list { flex: 1; overflow: auto; padding: 8px; }
.pal-group { font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--text-3); padding: 10px 10px 6px; }
.pal-item { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 11px; font-weight: 600; }
.pal-item small { margin-left: auto; color: var(--text-3); font-weight: 500; font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 50%; }
.pal-item[aria-selected="true"], .pal-item:hover { background: var(--red-soft); color: var(--red-ink); }
.pal-item[aria-selected="true"] small { color: var(--red-ink); }
.pal-empty { text-align: center; padding: 24px; }
.pal-foot { display: flex; gap: 16px; padding: 10px 16px; border-top: 1px solid var(--line); font-size: 12px; color: var(--text-3); background: var(--surface-2); }
.pal-foot kbd { margin-right: 4px; }


/* ───────── Tasks ───────── */
.actor-pill { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 6px 0 12px; border-radius: 11px; border: 1px solid var(--line); background: var(--surface); font-size: 12.5px; font-weight: 600; color: var(--text-3); }
.actor-pill select { border: 0; background: var(--surface-3); color: var(--text); font-weight: 700; height: 28px; border-radius: 8px; padding: 0 8px; outline: none; cursor: pointer; }
.actor-pill select:focus-visible { outline: 2px solid var(--red); }
.nav-badge { margin-left: auto; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 99px; background: var(--red); color: #fff; font-size: 11px; font-weight: 650; display: inline-grid; place-items: center; box-shadow: 0 0 0 2px var(--rail); }
.nav-badge[hidden] { display: none; }
.nav a.active .nav-badge { background: #fff; color: var(--red); }
body.rail-min .nav-badge { position: absolute; top: 4px; right: 4px; min-width: 16px; height: 16px; font-size: 10px; padding: 0 4px; }
.tabbar a { position: relative; }
.tabbar .nav-badge { position: absolute; top: 2px; right: 14%; min-width: 16px; height: 16px; font-size: 10px; box-shadow: none; }
.icon-btn.sm { width: 32px; height: 32px; border-radius: 9px; }
.btn.danger { color: var(--red-ink); }
.green-tag { background: var(--green-soft); color: var(--green); }
.green-tag .i { width: 13px; height: 13px; }

.tasks-card { margin-bottom: 16px; }
.grid-my .tasks-card { margin: 0; }
.tc-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.tc-head h2 { font-size: 20px; font-weight: 650; }
.tc-head p { color: var(--text-3); font-size: 12.5px; margin-top: 3px; }
.week-nav { display: flex; align-items: center; gap: 6px; }
.week-now { display: flex; flex-direction: column; align-items: center; min-width: 132px; line-height: 1.15; }
.week-now strong { font-size: 13.5px; }
.week-now small { color: var(--text-3); font-size: 12px; }
.review-banner { display: flex; align-items: center; gap: 14px; padding: 14px 16px; margin-bottom: 14px; border-radius: 16px; background: var(--black); color: #fff; box-shadow: 0 10px 26px rgba(232, 0, 36, .18); background-image: radial-gradient(80% 160% at 100% 0, rgba(232, 0, 36, .55), transparent 60%); }
.review-banner > .i { width: 22px; height: 22px; color: #FF8A9B; }
.review-banner div { flex: 1; display: flex; flex-direction: column; }
.review-banner span { font-size: 12.5px; color: #C9C9D2; }
.tc-progress { display: flex; flex-direction: column; gap: 8px; margin-bottom: 14px; }
.tc-bar { height: 8px; border-radius: 99px; background: var(--surface-3); overflow: hidden; }
.tc-bar i { display: block; height: 100%; width: var(--w); border-radius: 99px; background: var(--red); transition: width .4s var(--ease); }
.tc-stats { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; font-size: 12.5px; color: var(--text-2); }
.tc-stats b { color: var(--text); font-weight: 650; }
.lead-count { display: inline-flex; align-items: center; gap: 5px; color: var(--red-ink); }
.lead-count .i { width: 14px; height: 14px; }
.quick-add { display: flex; align-items: center; gap: 8px; padding: 6px 6px 6px 12px; margin-bottom: 12px; border-radius: 14px; border: 1.5px dashed var(--line-strong); background: var(--surface-2); transition: border-color .15s, background .15s, box-shadow .15s; }
.quick-add:focus-within { border-style: solid; border-color: var(--red); background: var(--surface); box-shadow: 0 0 0 4px var(--red-soft); }
.qa-plus { color: var(--red-ink); display: grid; }
.quick-add input { flex: 1; min-width: 0; border: 0; background: none; outline: none; height: 36px; font-size: 14px; color: var(--text); }
.quick-add select { min-width: 0; max-width: 230px; height: 32px; border-radius: 9px; border: 1px solid var(--line); background: var(--surface); color: var(--text-2); font-size: 12.5px; padding: 0 8px; }
.tsub { font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--text-3); margin: 12px 0 6px; }
.tsub.warn { color: var(--amber); }
.tlist { display: flex; flex-direction: column; gap: 4px; }
.task { display: flex; align-items: flex-start; gap: 10px; padding: 8px 8px 8px 10px; border-radius: 12px; border: 1px solid transparent; transition: background .12s, border-color .12s, opacity .2s; }
.task:hover { background: var(--surface-2); border-color: var(--line); }
.tcheck { flex: none; width: 24px; height: 24px; margin-top: 1px; border-radius: 8px; border: 2px solid var(--line-strong); background: var(--surface); display: grid; place-items: center; color: transparent; padding: 0; transition: background .15s, border-color .15s, color .15s, transform .1s; }
.tcheck .i { width: 15px; height: 15px; stroke-width: 2.6; }
button.tcheck:hover { border-color: var(--red); color: color-mix(in srgb, var(--red) 45%, transparent); }
button.tcheck:active { transform: scale(.9); }
.tcheck.on { background: var(--red); border-color: var(--red); color: #fff; }
.tcheck.static { border-style: dashed; }
.tcheck.static.on { border-style: solid; background: var(--text-3); border-color: var(--text-3); }
.tcheck.off { border-style: solid; color: var(--text-3); }
.task-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; padding: 2px 0; border: 0; background: none; text-align: left; }
.task-title { display: flex; align-items: center; gap: 7px; font-weight: 650; font-size: 14px; line-height: 1.35; }
.task.done .task-title { color: var(--text-3); text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--text-3) 60%, transparent); }
.task.cancelled { opacity: .55; }
.task.cancelled .task-title { text-decoration: line-through; }
.prio { width: 8px; height: 8px; border-radius: 2px; background: var(--red); transform: rotate(45deg); flex: none; }
.task-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: 11.5px; color: var(--text-3); }
.task-meta > span { display: inline-flex; align-items: center; gap: 4px; }
.task-meta .i { width: 13px; height: 13px; }
.badge-new { display: inline-flex; align-items: center; height: 18px; padding: 0 7px; border-radius: 99px; background: var(--red); color: #fff; font-size: 10px; font-weight: 650; letter-spacing: .03em; text-transform: uppercase; margin-left: 6px; }
.task-meta .badge-new { margin-left: 0; }
.from-lead { display: inline-flex; align-items: center; gap: 4px; color: var(--red-ink); font-weight: 700; }
.from-lead .i { width: 13px; height: 13px; }
.tproj { font-weight: 600; color: var(--text-2); max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block !important; }
.tproj.none { color: var(--text-3); font-weight: 500; font-style: normal; }
.tdue.past { color: var(--red-ink); font-weight: 700; }
.tcarry { color: var(--amber); font-weight: 700; }
.tpeople { gap: 2px !important; }
.tpeople .av { margin-left: -4px; box-shadow: 0 0 0 2px var(--surface); }
.tpeople .av:first-child { margin-left: 0; }
.tp { display: inline-flex; align-items: center; gap: 4px; margin-right: 6px; font-weight: 600; color: var(--text-2); }
.tp .av { margin-left: 0 !important; }
.tp.ok { color: var(--green); }
.ghost-btn { opacity: 0; border-color: transparent; background: transparent; }
.task:hover .ghost-btn, .ghost-btn:focus-visible { opacity: 1; border-color: var(--line); background: var(--surface); }
@media (hover: none) { .ghost-btn { opacity: 1; } }
.tc-empty { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 26px 16px; border-radius: 14px; background: var(--surface-2); color: var(--text-3); text-align: center; }
.tc-empty > .i { width: 26px; height: 26px; }
.carried { margin-top: 10px; }
.carried summary { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; font-size: 12.5px; font-weight: 650; color: var(--text-3); padding: 6px 4px; list-style: none; }
.carried summary::-webkit-details-marker { display: none; }
.carried summary .i { width: 14px; height: 14px; }
.tc-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.tc-foot .i { width: 15px; height: 15px; }
.tc-note { margin-left: auto; font-size: 11.5px; color: var(--text-3); }

.week-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; }
.week-bar > div { display: flex; flex-direction: column; min-width: 150px; text-align: center; line-height: 1.2; }
.week-bar > div strong { font-size: 15px; }
.week-bar > div span { font-size: 12px; color: var(--text-3); }
.week-total { margin-left: auto; font-size: 13px; color: var(--text-2); }
.week-total b { color: var(--text); }
.control-card { margin-bottom: 16px; }
.table-wrap.plain { overflow-x: auto; max-height: none; }
.ctable { width: 100%; border-collapse: collapse; font-size: 13px; min-width: 760px; }
.ctable th { text-align: left; font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--text-3); padding: 8px 10px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.ctable td { padding: 9px 10px; border-bottom: 1px solid var(--line); }
.ctable tr:last-child td { border-bottom: 0; }
.ctable tbody tr:hover td { background: var(--surface-2); }
.ctable .num { font-weight: 600; font-size: 14px; }
.ctable .num.ok { color: var(--green); }
.ctable .num small { margin-left: 4px; font-size: 11px; }
.ctable .t-pm span { display: inline-flex; align-items: center; }
.c-rate { width: 22%; }
.rate { display: flex; align-items: center; gap: 10px; }
.rate-bar { flex: 1; height: 8px; border-radius: 99px; background: var(--surface-3); overflow: hidden; }
.rate-bar i { display: block; height: 100%; width: var(--w); background: var(--text-2); border-radius: 99px; }
.rate-bar i.good { background: var(--green); }
.rate-bar i.low { background: var(--red); }
.rate b { width: 40px; text-align: right; }
.tasks-list-card { padding: 0; overflow: hidden; }
.tl-filters { display: flex; flex-wrap: wrap; gap: 8px; padding: 16px 18px; }
.seg a.seg-a { display: inline-flex; align-items: center; height: 32px; padding: 0 12px; border-radius: 9px; color: var(--text-2); font-weight: 650; font-size: 13px; white-space: nowrap; }
.seg a.seg-a[aria-pressed="true"] { background: var(--surface); color: var(--text); box-shadow: 0 1px 3px rgba(0, 0, 0, .12); }
.pm-mini { display: flex; flex-wrap: wrap; gap: 4px; }
.pm-mini a { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 10px 0 5px; border-radius: 99px; border: 1px solid var(--line); font-size: 12.5px; font-weight: 650; }
.pm-mini a:first-child { padding-left: 12px; }
.pm-mini a[aria-current="true"] { background: var(--black); border-color: var(--black); color: #fff; }
:root[data-theme="dark"] .pm-mini a[aria-current="true"] { background: #fff; color: #000; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .pm-mini a[aria-current="true"] { background: #fff; color: #000; } }
.tlist.wide { padding: 8px 10px 14px; }

/* Form, detail, review */
.modal.form { width: min(640px, calc(100vw - 24px)); }
.modal.wide { width: min(820px, calc(100vw - 24px)); }
.modal.form .modal-body, .modal.wide .modal-body { padding-bottom: 0; }
.tform { display: flex; flex-direction: column; gap: 14px; }
.tf-field { display: flex; flex-direction: column; gap: 6px; border: 0; margin: 0; padding: 0; min-width: 0; }
.tf-field > span, .tf-field legend { font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--text-3); padding: 0; margin-bottom: 2px; }
.tf-field small { font-weight: 500; letter-spacing: 0; text-transform: none; margin-left: 4px; }
.tf-field input, .tf-field textarea, .tf-field select { width: 100%; min-width: 0; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-2); color: var(--text); padding: 10px 12px; font: inherit; outline: none; transition: border-color .15s, box-shadow .15s, background .15s; }
.tf-field input[name="title"] { font-size: 16px; font-weight: 650; }
.tf-field textarea { resize: vertical; min-height: 70px; }
.tf-field input:focus, .tf-field textarea:focus, .tf-field select:focus { border-color: var(--red); background: var(--surface); box-shadow: 0 0 0 4px var(--red-soft); }
.tf-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-items: end; }
.tf-check { display: inline-flex; align-items: center; gap: 10px; height: 42px; font-weight: 600; cursor: pointer; }
.tf-check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.tf-check input:checked + .switch-ui { background: var(--red); }
.tf-check input:checked + .switch-ui::after { transform: translateX(16px); }
.tf-fixed { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-weight: 650; }
.tf-fixed small { width: 100%; color: var(--text-3); font-weight: 500; font-size: 12px; }
.tf-error { color: var(--red-ink); font-weight: 650; font-size: 13px; }
.tform .fsheet-foot, .review .fsheet-foot { margin: 6px -20px 0; }
.review .fsheet-foot { align-items: center; }
.rv-count { font-size: 12.5px; color: var(--text-2); font-weight: 600; }
.tdetail { display: flex; flex-direction: column; gap: 14px; padding-bottom: 18px; }
.td-status { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-weight: 600; }
.td-status .i { width: 18px; height: 18px; }
.td-status.done { color: var(--green); } .td-status.cancelled { color: var(--text-3); } .td-status.open { color: var(--text); }
.td-notes { padding: 12px 14px; border-radius: 12px; background: var(--surface-2); }
.td-people { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.td-people li { display: flex; align-items: center; gap: 10px; }
.td-people small { margin-left: auto; color: var(--text-3); }
.td-people li.ok small { color: var(--green); font-weight: 650; }
.td-history { list-style: none; margin: 0; padding: 0 0 0 14px; border-left: 2px solid var(--line); display: flex; flex-direction: column; gap: 8px; font-size: 13px; }
.td-history small { display: block; color: var(--text-3); font-size: 11.5px; }
.td-actions { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 6px; border-top: 1px solid var(--line); padding-top: 14px; }
.td-actions .i { width: 15px; height: 15px; }
.tdetail .dr-facts strong a { text-decoration: underline; text-decoration-color: var(--line-strong); }
.review { display: flex; flex-direction: column; gap: 12px; }
.review .hint { color: var(--text-2); font-size: 13px; }
.rv-all { display: flex; align-items: center; gap: 4px; font-size: 12.5px; color: var(--text-3); }
.rv-list { display: flex; flex-direction: column; gap: 6px; }
.rv-item { display: flex; align-items: center; gap: 14px; padding: 10px 12px; border-radius: 14px; background: var(--surface-2); border: 1px solid transparent; }
.rv-item:has([aria-pressed="true"]) { border-color: var(--line); background: var(--surface); }
.rv-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.rv-text strong { font-weight: 650; }
.rv-text small { display: flex; flex-wrap: wrap; gap: 4px 8px; color: var(--text-3); font-size: 12px; }
.rv-seg button { display: inline-flex; align-items: center; gap: 5px; padding: 0 10px; }
.rv-seg button .i { width: 14px; height: 14px; }
.rv-seg button:disabled { opacity: .35; cursor: not-allowed; }
.rv-seg button[data-decide$="|done"][aria-pressed="true"] { background: var(--green); color: #fff; }
.rv-seg button[data-decide$="|carry"][aria-pressed="true"] { background: var(--amber); color: #fff; }
.rv-seg button[data-decide$="|cancel"][aria-pressed="true"] { background: var(--text-2); color: var(--surface); }
.imp-group { border: 0; padding: 0; margin: 0 0 6px; }
.imp-group legend { font-weight: 600; margin-bottom: 6px; padding: 0; }
.imp-item { display: flex; align-items: flex-start; gap: 10px; padding: 7px 10px; border-radius: 10px; cursor: pointer; font-size: 13.5px; }
.imp-item:hover { background: var(--surface-2); }
.imp-item input { accent-color: var(--red); width: 16px; height: 16px; margin-top: 2px; }
.sheets-list { display: flex; flex-direction: column; gap: 14px; padding-bottom: 18px; }
.sheets-item h4 { font-size: 14px; margin-bottom: 8px; }
.sheets-item h4 small { font-weight: 500; color: var(--text-3); font-size: 12px; margin-left: 6px; }
.sheets-item textarea { width: 100%; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); color: var(--text); padding: 8px 10px; font: 13px/1.5 var(--font); resize: vertical; }
.sheets-item .field { border: 0; padding: 12px; border-radius: 12px; background: var(--surface-2); }
.sheets-item .link-btn { align-self: flex-start; }
.modal .hint { color: var(--text-2); font-size: 13px; margin-bottom: 12px; }

.toast { position: fixed; z-index: 60; left: 50%; bottom: 24px; transform: translate(-50%, 20px); padding: 12px 18px; border-radius: 14px; background: var(--black); color: #fff; font-weight: 650; font-size: 13.5px; box-shadow: var(--shadow-lg); opacity: 0; pointer-events: none; transition: opacity .2s, transform .25s var(--ease); max-width: calc(100vw - 32px); }
.toast.show { opacity: 1; transform: translate(-50%, 0); }
.toast.error { background: var(--red); }
:root[data-theme="dark"] .toast:not(.error) { background: #fff; color: #000; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .toast:not(.error) { background: #fff; color: #000; } }


/* ───────── Leader composer, report ───────── */
.composer { margin-bottom: 16px; border-color: color-mix(in srgb, var(--red) 25%, var(--line)); }
.lead-add { display: flex; flex-direction: column; gap: 12px; }
.lead-add .quick-add { margin: 0; }
.la-target { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.la-label { font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--text-3); margin-right: 4px; }
.la-target .fopt .i { width: 15px; height: 15px; }
.la-week { max-width: 190px !important; }
.pm-picker a .i { width: 18px; height: 18px; margin-left: 6px; }
.tsrc { font-size: 10.5px; font-weight: 700; padding: 1px 7px; border-radius: 99px; background: var(--surface-3); color: var(--text-2); }
.tp.team { color: var(--red-ink); font-weight: 700; }
.tp.team .i { width: 14px; height: 14px; }
.tf-hint { color: var(--text-3); font-size: 12px; margin-top: 6px; }
.fopt input:disabled + .av, .fopt:has(input:disabled) { opacity: .5; }
.weekly .card-head .week-nav { gap: 4px; }
.rep { display: flex; flex-direction: column; gap: 10px; }
.report-all .rep { padding-top: 14px; border-top: 1px solid var(--line); }
.report-all .rep:first-child { border-top: 0; padding-top: 0; }
.rep-head { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; }
.rep-head .report-pm { margin: 0; min-width: 150px; font-weight: 600; display: inline-flex; align-items: center; gap: 8px; }
.rep-head .report-pm:hover { color: var(--red-ink); }
.rep-head .rate { width: 200px; }
.rep-stats { font-size: 12.5px; color: var(--text-2); }
.rep-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.rep-list li { display: flex; flex-direction: column; gap: 2px; font-size: 13.5px; line-height: 1.4; }
.rep-list small { color: var(--text-3); font-size: 11.5px; }
.rep-list small b { color: var(--amber); font-weight: 700; }
.rep-lead .i { width: 13px; height: 13px; color: var(--red-ink); vertical-align: -2px; }
.rep-empty { font-size: 13px; }
.weekly-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-top: 14px; }
.weekly-foot .note { margin: 0; }
@media (max-width: 720px) {
  .la-week { flex: 1 1 0; min-width: 0; width: 0; max-width: none !important; }
  .rep-head .rate { width: 100%; }
  .weekly-foot .link-btn { white-space: normal; text-align: left; padding-left: 0; }
}


/* ───────── Month calendar ───────── */
.mode-seg button { display: inline-flex; align-items: center; gap: 6px; }
.mode-seg .i { width: 15px; height: 15px; }
.tc-head .mode-seg { margin-left: auto; }
.cap { text-transform: capitalize; }
.lgd.task { background: var(--surface); border: 2px solid var(--line-strong); }
.lgd.lead { background: var(--surface); border: 2px solid var(--red); }
.mc-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 12px; color: var(--text-2); font-weight: 600; margin-bottom: 12px; }
.mc-legend span { display: inline-flex; align-items: center; gap: 6px; }
.mc { border: 1px solid var(--line); border-radius: 16px; overflow: hidden; }
.mc-head { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); background: var(--surface-2); border-bottom: 1px solid var(--line); }
.mc-head span { padding: 8px 10px; font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--text-3); }
.mc-head span.weekend { color: var(--red-ink); }
.mc-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.mc-band { grid-column: 1 / -1; position: relative; display: flex; align-items: center; gap: 10px; padding: 6px 44px 6px 10px; min-height: 38px; background: var(--surface-2); border-top: 1px solid var(--line); }
.mc-band:first-child { border-top: 0; }
.mc-band.now { background: var(--red-soft); }
.mc-band-label { flex: none; display: inline-flex; align-items: center; gap: 6px; min-width: 110px; font-size: 11.5px; font-weight: 600; color: var(--text-2); }
.mc-band-label b { padding: 1px 7px; border-radius: 99px; background: var(--surface); border: 1px solid var(--line); font-size: 10.5px; }
.mc-band-items { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; gap: 4px; }
.mc-band-items .mc-item { max-width: 260px; }
.mc-band-empty { font-size: 11.5px; color: var(--text-3); }
.mc-day { min-height: 112px; min-width: 0; padding: 6px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); display: flex; flex-direction: column; gap: 4px; background: var(--surface); transition: background .12s; }
.mc-day:nth-child(8n+2) { border-left: 0; }
.mc-day.weekend { background: color-mix(in srgb, var(--surface-2) 60%, var(--surface)); }
.mc-day.out { background: var(--surface-2); }
.mc-day.out .mc-num { color: var(--text-3); opacity: .6; }
.mc-day:hover { background: var(--surface-2); }
.mc-day-head { display: flex; align-items: center; justify-content: space-between; }
.mc-num { display: inline-flex; align-items: center; justify-content: center; min-width: 26px; height: 26px; padding: 0 6px; border-radius: 8px; border: 0; background: none; font-weight: 650; font-size: 13px; color: var(--text); }
.mc-num:hover { background: var(--surface-3); }
.mc-wd { display: none; }
.mc-day.today .mc-num { background: var(--red); color: #fff; }
.mc-add { width: 24px; height: 24px; border-radius: 7px; border: 1px solid transparent; background: none; color: var(--text-3); display: grid; place-items: center; padding: 0; opacity: 0; transition: opacity .12s, background .12s, color .12s; }
.mc-add .i { width: 15px; height: 15px; }
.mc-day:hover .mc-add, .mc-band:hover .mc-add, .mc-add:focus-visible { opacity: 1; }
.mc-add:hover { background: var(--red); color: #fff; }
.mc-add.band { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); opacity: .7; border-color: var(--line); background: var(--surface); }
@media (hover: none) { .mc-add { opacity: 1; } }
.mc-items { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.mc-item { display: flex; align-items: center; gap: 5px; min-width: 0; padding: 3px 6px; border-radius: 7px; font-size: 11.5px; line-height: 1.25; background: var(--surface-2); border: 1px solid var(--line); }
.mc-item.ev { box-shadow: inset 3px 0 0 var(--point); background: var(--point-soft); border-color: transparent; }
.mc-item.ev.launch { box-shadow: inset 3px 0 0 var(--red); background: var(--red-soft); }
.mc-item.ev.deadline { box-shadow: inset 3px 0 0 var(--amber); background: var(--amber-soft); }
.mc-item.ev:hover { filter: brightness(.97); }
.mc-item.task { background: var(--surface); }
.mc-item.task.lead { border-color: color-mix(in srgb, var(--red) 55%, var(--line)); }
.mc-item.task.done .mc-text { text-decoration: line-through; color: var(--text-3); }
.mc-emo { flex: none; font-size: 11px; }
.mc-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border: 0; background: none; padding: 0; text-align: left; font: inherit; color: inherit; font-weight: 600; }
.mc-check { flex: none; width: 15px; height: 15px; padding: 0; border-radius: 5px; border: 1.5px solid var(--line-strong); background: var(--surface); color: transparent; display: grid; place-items: center; }
.mc-check .i { width: 11px; height: 11px; stroke-width: 3; }
button.mc-check:hover { border-color: var(--red); }
.mc-check.on { background: var(--red); border-color: var(--red); color: #fff; }
.mc-check.static.on { background: var(--text-3); border-color: var(--text-3); }
.mc-more { align-self: flex-start; border: 0; background: none; padding: 1px 4px; font-size: 11px; font-weight: 650; color: var(--red-ink); border-radius: 6px; }
.mc-more:hover { background: var(--red-soft); }
.mc-dialog { display: flex; flex-direction: column; gap: 6px; padding-bottom: 14px; }
.mc-dialog .mc-item { font-size: 13.5px; padding: 8px 10px; }
.mc-dialog .mc-text { white-space: normal; }
.mc-dialog .mc-check { width: 20px; height: 20px; }
@media (max-width: 720px) {
  .tc-head .mode-seg { margin-left: 0; }
  .mc { border: 0; border-radius: 0; }
  .mc-head { display: none; }
  .mc-grid { display: block; }
  .mc-band { border-radius: 12px; margin-top: 12px; border: 0; padding: 10px 44px 10px 10px; flex-direction: column; align-items: stretch; gap: 8px; }
  .mc-add.band { top: 10px; transform: none; }
  .mc-band-items .mc-item { max-width: 100%; }
  .mc-day { min-height: 0; border-left: 0; flex-direction: row; align-items: flex-start; gap: 10px; padding: 8px 2px; background: none !important; }
  .mc-day:not(.has):not(.today) { display: none; }
  .mc-day-head { flex-direction: column; gap: 4px; }
  .mc-num { flex-direction: column; min-width: 40px; height: auto; padding: 4px; line-height: 1.1; }
  .mc-wd { display: block; font-size: 10px; font-weight: 600; color: var(--text-3); }
  .mc-day.today .mc-wd { color: #FFD2D9; }
  .mc-items { flex: 1; }
  .mc-item { font-size: 13px; padding: 6px 8px; }
}


/* ───────── Compact weekly report ───────── */
.chips.compact { margin-bottom: 10px; }
.chips.compact button { height: 30px; font-size: 12.5px; padding: 0 11px 0 5px; }
.chips.compact button:first-child { padding-left: 11px; }
.rep-table { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.rep-row + .rep-row { border-top: 1px solid var(--line); }
.rr-head { display: grid; grid-template-columns: 22px 120px minmax(80px, 260px) 44px 54px 44px 1fr 20px; align-items: center; gap: 10px; padding: 8px 12px; list-style: none; cursor: pointer; font-size: 13px; transition: background .12s; }
.rr-head::-webkit-details-marker { display: none; }
.rep-row.is-empty .rr-head { cursor: default; color: var(--text-3); }
details.rep-row .rr-head:hover { background: var(--surface-2); }
details.rep-row[open] > .rr-head { background: var(--surface-2); }
.rr-name { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rr-bar { height: 6px; border-radius: 99px; background: var(--surface-3); overflow: hidden; }
.rr-bar i { display: block; height: 100%; width: var(--w); border-radius: 99px; background: var(--text-2); }
.rr-bar i.good { background: var(--green); } .rr-bar i.low { background: var(--red); }
.rr-rate { text-align: right; font-weight: 650; }
.rr-num { font-weight: 650; color: var(--text-2); white-space: nowrap; }
.rs { display: inline-flex; align-items: center; gap: 4px; justify-self: start; font-size: 11.5px; font-weight: 700; color: var(--text-3); white-space: nowrap; }
.rs .i { width: 13px; height: 13px; }
.rs.ok { color: var(--green); } .rs.bad { color: var(--red-ink); }
.rr-chev .i { width: 16px; height: 16px; color: var(--text-3); transition: transform .2s; }
details[open] > .rr-head .rr-chev .i { transform: rotate(180deg); }
.rr-body { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-top: 1px solid var(--line); }
.rr-body > div { padding: 10px 14px 12px; min-width: 0; }
.rr-body > div + div { border-left: 1px solid var(--line); }
.rr-body h4 { font-size: 10.5px; letter-spacing: 0; text-transform: none; color: var(--text-3); margin-bottom: 6px; }
.rl { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.rl li { display: flex; align-items: baseline; gap: 8px; min-width: 0; padding: 3px 0; font-size: 13px; }
.rl-title { flex: 0 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rl-proj { flex: 1 1 0; min-width: 40px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--text-3); font-size: 11.5px; }
.rl-note { flex: none; font-size: 11px; font-weight: 700; color: var(--amber); white-space: nowrap; }
.rl-more a { font-size: 12px; font-weight: 700; color: var(--red-ink); }
.rr-body .missing { font-size: 12.5px; }
@media (max-width: 720px) {
  .rr-head { grid-template-columns: 22px minmax(0, 1fr) 40px 44px 18px; gap: 8px; }
  .rr-bar, .rr-num.muted, .rs { display: none; }
  .rr-body { grid-template-columns: 1fr; }
  .rr-body > div + div { border-left: 0; border-top: 1px solid var(--line); }
  .rl li { flex-wrap: wrap; row-gap: 0; }
  .rl-title { white-space: normal; flex-basis: 100%; }
}


/* ───────── Empty / loading ───────── */
.empty { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; padding: 44px 20px; color: var(--text-3); }
.empty .i { width: 30px; height: 30px; color: var(--text-3); }
.empty h3 { color: var(--text); font-size: 16px; }
.empty .btn { margin-top: 8px; }
.empty.big { padding: 100px 20px; }
.loading { display: grid; place-items: center; gap: 14px; padding: 140px 0; color: var(--text-3); }
.spinner { width: 34px; height: 34px; border-radius: 50%; border: 3px solid var(--surface-3); border-top-color: var(--red); animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ───────── Mobile tab bar ───────── */
.tabbar { display: none; }

/* ───────── Responsive ───────── */
@media (max-width: 1280px) {
  .dash-grid { grid-template-columns: 1fr 1fr; }
  .type-card { grid-column: 1 / -1; }
  .type-tiles { grid-template-columns: repeat(4, 1fr); }
  .me-hero { grid-template-columns: 1fr auto; }
  .me-forecast, .me-stats { grid-column: span 1; }
  .facts { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 1080px) {
  .app, body.rail-min .app { grid-template-columns: 76px minmax(0, 1fr); }
  .brand-text, .nav span, .nav-label, .nav-count, .nav-btn kbd, .source-card div, .rail-collapse { display: none !important; }
  .nav a, .nav-btn { justify-content: center; padding: 11px; }
  .source-card { justify-content: center; padding: 10px; }
  .pulse { margin: 0; }
  .brand { justify-content: center; padding-inline: 0; }
  .grid-overview, .grid-my, .grid-card, .grid-team { grid-template-columns: 1fr; }
  .events-scroll { contain: none; max-height: 460px; }
  .kpis { grid-template-columns: 1fr 1fr; }
  .lrow { grid-template-columns: 44px minmax(0, 1fr) 150px; }
  .lr-owner, .lr-plan { display: none; }
  .crumbs { display: none; }
}
@media (max-width: 720px) {
  body { font-size: 14px; }
  .app, body.rail-min .app { grid-template-columns: 1fr; }
  .rail { display: none; }
  .topbar { padding: 10px 16px; gap: 8px; }
  .search-trigger span, .search-trigger kbd, .readonly-pill { display: none; }
  .search-trigger { flex: 0 0 auto; margin: 0 auto 0 0; width: 40px; padding: 0; justify-content: center; }
  .topbar::before { content: "ASABA"; font: 900 italic 18px var(--font-display); color: var(--red); margin-right: auto; order: -1; }
  .search-trigger { order: 1; margin: 0; }
  .top-actions { order: 2; }
  main { padding: 4px 16px 96px; }
  .foot { display: none; }
  .page-head { flex-direction: column; align-items: flex-start; padding: 18px 0 16px; }
  .page-head h1, .tl-head h1 { font-size: 30px; }
  .hero { padding: 22px 18px 18px; border-radius: 22px; margin-top: 10px; }
  .hero h1 { font-size: 32px; }
  .hero-top { flex-direction: column; }
  .hero-cta { display: none; }
  .kpis { gap: 8px; margin-top: 20px; }
  .kpi { padding: 14px; border-radius: 15px; }
  .kpi-value { font-size: 32px; }
  .kpi-hint { display: none; }
  .notice { grid-template-columns: 1fr; }
  .notice-head { border-right: 0; border-bottom: 1px solid var(--line); padding: 12px 16px; }
  .notice-list li { border-left: 0; border-top: 1px solid var(--line); padding: 10px 16px; flex-direction: row; align-items: baseline; gap: 10px; }
  .notice-list li:first-child { border-top: 0; }
  .notice-list li { justify-content: flex-start; }
  .notice-date { flex: 0 0 100px; }
  .card { padding: 16px; border-radius: 18px; }
  .card-head { flex-wrap: wrap; }
  .day { grid-template-columns: 1fr; gap: 6px; }
  .day-head { flex-direction: row; align-items: baseline; gap: 8px; padding-top: 0; }
  .day-head span { flex-direction: row; gap: 6px; }
  .ev { grid-template-columns: minmax(0, 1fr) auto; }
  .ev .ev-kind { grid-column: 1 / -1; }
  .load { grid-template-columns: 26px 72px 1fr 42px; gap: 8px; }
  .heat { grid-template-columns: 82px repeat(var(--cols), minmax(26px, 1fr)); gap: 3px; }
  .heat-name .av { display: none; }
  .heat-cell { height: 28px; font-size: 10.5px; border-radius: 6px; }
  .report-cols { grid-template-columns: 1fr; }
  .report-cols section + section { border-left: 0; border-top: 1px solid var(--line); }
  .me-hero { grid-template-columns: 1fr; gap: 18px; padding: 18px; }
  .me-gauge { align-items: flex-start; }
  .dash-grid { grid-template-columns: 1fr; }
  .ring-card { grid-template-columns: 1fr; justify-items: center; }
  .ring-legend { width: 100%; margin-top: 12px; }
  .type-tiles { grid-template-columns: 1fr 1fr; }
  .toolbar { padding: 12px; }
  .search { max-width: none; flex-basis: 100%; }
  .toolbar-right { margin-left: 0; width: 100%; justify-content: space-between; }
  .table-wrap { max-height: 70vh; }
  .lrow { grid-template-columns: 40px minmax(0, 1fr); gap: 12px; padding: 12px; }
  .lr-emo { width: 40px; height: 40px; }
  .lr-date { grid-column: 2; flex-direction: row; align-items: center; gap: 10px; justify-content: flex-start; flex-wrap: wrap; text-align: left; }
  .tl-head { flex-direction: column; align-items: flex-start; }
  .tl-period strong { min-width: 0; text-align: left; }
  .tl-grid { grid-template-columns: 104px repeat(var(--cols), minmax(118px, 1fr)); }
  .tl-pm .av { display: none; }
  .tl-legend { display: none; }
  .p-hero { padding: 20px 18px; border-radius: 22px; }
  .p-hero-main { grid-template-columns: 1fr; }
  .p-emo { width: 52px; height: 52px; font-size: 26px; }
  .p-hero h1 { font-size: 26px; }
  .facts { grid-template-columns: 1fr 1fr; }
  .plan-grid, .budget { grid-template-columns: 1fr; }
  .drawer { top: auto; left: 8px; right: 8px; bottom: 8px; width: auto; height: 86vh; transform: translateY(calc(100% + 24px)); }
  .modal.sheet { margin: auto 0 0; width: 100vw; max-width: 100vw; height: 86vh; border-radius: 22px 22px 0 0; animation: up .28s var(--ease); }
  @keyframes up { from { transform: translateY(40px); opacity: 0; } }
  .modal.palette { margin-top: 8vh; }
  .actor-label { display: none; }
  .actor-pill { padding: 0 4px; }
  .actor-pill select { max-width: 120px; }
  .quick-add { flex-wrap: wrap; padding: 8px 10px; }
  .quick-add input { flex-basis: calc(100% - 30px); }
  .quick-add select { flex: 1 1 0; min-width: 0; max-width: none; width: 0; }
  .tc-note { margin-left: 0; }
  .week-total { margin-left: 0; width: 100%; }
  .tf-row { grid-template-columns: 1fr; }
  .rv-item { flex-direction: column; align-items: stretch; }
  .rv-seg { display: flex; width: 100%; }
  .rv-seg button { flex: 1 1 0; min-width: 0; justify-content: center; padding: 0 4px; font-size: 12px; }
  .rv-all { flex-wrap: wrap; }
  .modal { overflow-x: hidden; }
  .toast { bottom: 96px; }
  .tabbar { position: fixed; z-index: 30; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom)); display: grid; grid-template-columns: repeat(5, 1fr); padding: 6px; border-radius: 20px; background: color-mix(in srgb, var(--black) 92%, transparent); backdrop-filter: blur(16px); box-shadow: 0 12px 30px rgba(0, 0, 0, .3); }
  .tabbar a { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 7px 2px; border-radius: 14px; color: #9A9AA4; font-size: 10.5px; font-weight: 650; }
  .tabbar a.active { background: var(--red); color: #fff; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0s !important; animation-delay: 0s !important; transition-duration: 0s !important; }
  .pulse { animation: none; }
}

/* ═════════ Visual v4 · Liquid glass ═════════
   Полупрозрачные слои с размытием поверх мягкого фона с бликами фирменного красного.
   Лёгкая типографика, без аватаров. При отсутствии backdrop-filter — почти непрозрачные поверхности. */
:root {
  --glass: rgba(255, 255, 255, .58);
  --glass-strong: rgba(255, 255, 255, .74);
  --glass-border: rgba(255, 255, 255, .78);
  --glass-line: rgba(24, 20, 36, .07);
  --glass-hi: inset 0 1px 0 rgba(255, 255, 255, .95);
  --glass-shadow: 0 1px 0 rgba(255, 255, 255, .9) inset, 0 12px 32px -14px rgba(40, 20, 40, .22), 0 2px 6px -2px rgba(40, 20, 40, .06);
  --blur: blur(22px) saturate(1.8);
  --surface-2: rgba(255, 255, 255, .5);
  --surface-3: rgba(24, 20, 36, .06);
  --line: rgba(24, 20, 36, .08);
  --line-strong: rgba(24, 20, 36, .14);
  --bg: #F3F1F4;
  --ambient: radial-gradient(55vw 55vw at 92% -12%, rgba(232, 0, 36, .17), transparent 62%),
             radial-gradient(45vw 45vw at -8% 28%, rgba(255, 128, 150, .20), transparent 60%),
             radial-gradient(42vw 42vw at 62% 112%, rgba(155, 0, 36, .11), transparent 60%),
             radial-gradient(30vw 30vw at 40% 40%, rgba(255, 255, 255, .7), transparent 70%);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --glass: rgba(30, 28, 36, .55); --glass-strong: rgba(34, 32, 40, .74); --glass-border: rgba(255, 255, 255, .09); --glass-line: rgba(255, 255, 255, .07);
    --glass-hi: inset 0 1px 0 rgba(255, 255, 255, .07); --glass-shadow: 0 1px 0 rgba(255, 255, 255, .06) inset, 0 16px 36px -14px rgba(0, 0, 0, .7);
    --surface-2: rgba(255, 255, 255, .04); --surface-3: rgba(255, 255, 255, .07); --line: rgba(255, 255, 255, .08); --line-strong: rgba(255, 255, 255, .14); --bg: #0C0B0F;
    --ambient: radial-gradient(55vw 55vw at 92% -12%, rgba(232, 0, 36, .26), transparent 62%), radial-gradient(45vw 45vw at -8% 30%, rgba(155, 0, 36, .22), transparent 60%), radial-gradient(42vw 42vw at 62% 112%, rgba(120, 20, 60, .2), transparent 60%);
  }
}
:root[data-theme="dark"] {
  --glass: rgba(30, 28, 36, .55); --glass-strong: rgba(34, 32, 40, .74); --glass-border: rgba(255, 255, 255, .09); --glass-line: rgba(255, 255, 255, .07);
  --glass-hi: inset 0 1px 0 rgba(255, 255, 255, .07); --glass-shadow: 0 1px 0 rgba(255, 255, 255, .06) inset, 0 16px 36px -14px rgba(0, 0, 0, .7);
  --surface-2: rgba(255, 255, 255, .04); --surface-3: rgba(255, 255, 255, .07); --line: rgba(255, 255, 255, .08); --line-strong: rgba(255, 255, 255, .14); --bg: #0C0B0F;
  --ambient: radial-gradient(55vw 55vw at 92% -12%, rgba(232, 0, 36, .26), transparent 62%), radial-gradient(45vw 45vw at -8% 30%, rgba(155, 0, 36, .22), transparent 60%), radial-gradient(42vw 42vw at 62% 112%, rgba(120, 20, 60, .2), transparent 60%);
}
body { background: var(--ambient), var(--bg); background-attachment: fixed; font-size: 14px; }

/* Стеклянные поверхности */
.card, .notice, .me-hero, .p-hero, .person, .search-trigger, .actor-pill, .readonly-pill, .icon-btn, .btn:not(.primary), .chips button, .pm-picker a, .fopt, .lrow .lr-emo, .p-emo, .month-pick, .search {
  background: var(--glass); -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur);
  border: 1px solid var(--glass-border); box-shadow: var(--glass-shadow);
}
.search, .month-pick, .chips button, .pm-picker a, .fopt, .icon-btn, .btn:not(.primary) { box-shadow: var(--glass-hi); }
.card { border-radius: 24px; }
.btn.primary, .nav a.active, .pm-picker a[aria-current="true"], .fopt:has(input:checked) { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 8px 20px -6px rgba(232, 0, 36, .45); }
.drawer, .modal { background: var(--glass-strong); -webkit-backdrop-filter: blur(30px) saturate(1.8); backdrop-filter: blur(30px) saturate(1.8); border: 1px solid var(--glass-border); }
.modal-head, .fsheet-foot, .modal-head + .modal-body .fsheet-foot { background: transparent; }
.modal::backdrop { background: rgba(20, 10, 20, .22); backdrop-filter: blur(6px); }
.seg, .tabs { background: var(--surface-3); box-shadow: inset 0 1px 2px rgba(0, 0, 0, .05); }
.seg button[aria-pressed="true"], .tabs button[aria-selected="true"] { background: var(--glass-strong); box-shadow: 0 1px 0 rgba(255, 255, 255, .9) inset, 0 2px 8px -2px rgba(30, 20, 40, .18); }

/* Навигация — плавающая стеклянная панель */
.app { grid-template-columns: 260px minmax(0, 1fr); }
body.rail-min .app { grid-template-columns: 88px minmax(0, 1fr); }
.rail { top: 12px; margin: 12px 0 12px 12px; height: calc(100vh - 24px); border-radius: 26px; background: var(--glass-strong); -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur); border: 1px solid var(--glass-border); box-shadow: var(--glass-shadow); color: var(--text-2); }
.brand { border-bottom-color: var(--glass-line); }
.brand-text strong { color: var(--text); font-weight: 700; font-size: 17px; }
.brand-text small { color: var(--text-3); }
.brand-mark { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4), 0 6px 16px -4px rgba(232, 0, 36, .5); font-weight: 800; font-size: 19px; }
.nav-label { color: var(--text-3); font-size: 11.5px; padding-top: 16px; }
.nav a, .nav-btn { color: var(--text-2); font-weight: 550; }
.nav a:hover, .nav-btn:hover { background: var(--surface-3); color: var(--text); }
.nav a.active { color: #fff; }
.nav-count { background: var(--surface-3); color: var(--text-2); }
.nav-btn kbd { background: var(--glass); border-color: var(--glass-line); color: var(--text-3); }
.source-card { background: var(--surface-2); border: 1px solid var(--glass-line); }
.source-card strong { color: var(--text); }
.source-card small { color: var(--text-3); }
.rail-collapse { border-color: var(--glass-line); color: var(--text-3); }
.rail-collapse:hover { background: var(--surface-3); color: var(--text); }
.topbar { margin: 12px 12px 0 16px; top: 12px; border-radius: 20px; background: var(--glass); -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur); border: 1px solid var(--glass-border); box-shadow: var(--glass-shadow); padding: 10px 14px 10px 20px; }
.search-trigger, .actor-pill { box-shadow: var(--glass-hi); background: var(--surface-2); }
main { padding: 4px 28px 40px 32px; }

/* Лёгкая типографика */
h1, h2, h3, h4 { letter-spacing: -.01em; }
.page-head { padding: 26px 0 18px; }
.page-head h1, .tl-head h1 { font-weight: 650; font-size: 28px; letter-spacing: -.02em; text-transform: none; }
.page-head p { font-size: 14px; color: var(--text-3); margin-top: 6px; }
.kicker { font-size: 12px; font-weight: 550; letter-spacing: 0; text-transform: none; color: var(--text-3); margin-bottom: 4px; }
.card-head h2 { font-size: 16px; font-weight: 650; }
.dash summary span { font-size: 16px; font-weight: 650; }
.dash h3 { font-size: 14px; font-weight: 600; }
.mini-title, .sub-title, .field > span, .facts span, .dr-facts span, .report-cols h4, .rr-body h4, .tf-field > span, .tf-field legend, .fsheet legend, .ptable th, .ctable th, .tl-corner, .mc-head span, .pal-group, .tsub, .la-label, .lr-plan small { font-size: 12px; font-weight: 550; color: var(--text-3); letter-spacing: 0; text-transform: none; }
.ev-kind, .notice-date, .mtl-date { text-transform: none; letter-spacing: 0; font-weight: 600; font-size: 12px; }

/* Обзор: лёгкий стеклянный блок вместо чёрного */
.hero { background: var(--glass); -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur); border: 1px solid var(--glass-border); box-shadow: var(--glass-shadow); color: var(--text); padding: 24px 26px 22px; border-radius: 26px; }
.hero-glow { background: radial-gradient(60% 140% at 100% 0%, rgba(232, 0, 36, .14), transparent 60%); }
.hero-glow::after { display: none; }
.hero h1 { font-size: 26px; font-weight: 650; text-transform: none; letter-spacing: -.02em; }
.kicker.light { color: var(--text-3); }
.hero-date { color: var(--text-3); margin-top: 4px; font-size: 13.5px; }
.hero-cta { background: var(--red); color: #fff; height: 38px; font-weight: 600; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 8px 20px -6px rgba(232, 0, 36, .45); }
.kpis { margin-top: 18px; gap: 10px; }
.kpi { background: var(--surface-2); border: 1px solid var(--glass-border); box-shadow: var(--glass-hi); padding: 14px 16px; }
.kpi:hover { background: var(--glass-strong); border-color: var(--glass-border); }
.kpi-value { font-size: 28px; font-weight: 650; letter-spacing: -.02em; color: var(--text); }
.kpi-label { font-weight: 600; font-size: 13px; margin-top: 2px; }
.kpi-hint { color: var(--text-3); }
.kpi-go { color: var(--text-3); }
.kpi:hover .kpi-go { color: var(--red-ink); }
.kpi:first-child { background: linear-gradient(160deg, rgba(232, 0, 36, .95), rgba(190, 0, 32, .95)); border-color: rgba(255, 255, 255, .25); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 12px 26px -10px rgba(232, 0, 36, .55); }
.kpi:first-child .kpi-value, .kpi:first-child .kpi-label { color: #fff; }

/* Плотность: меньше «блочности» */
.notice-head { background: transparent; border-right-color: var(--glass-line); color: var(--text); }
.notice-head .i { color: var(--red-ink); }
.notice-head h2 { font-weight: 600; font-size: 14px; }
.notice-list li { border-left-color: var(--glass-line); }
.notice-list p { font-weight: 500; }
.ev { background: transparent; border-color: transparent; padding: 8px 10px; }
.ev:hover { background: var(--surface-2); border-color: var(--glass-line); transform: none; }
.day { border-top-color: var(--glass-line); }
.day-head strong { font-weight: 600; font-size: 20px; }
.load strong { font-weight: 600; font-size: 14px; }
.load-bar { height: 8px; }
.load-bar i { background: linear-gradient(90deg, rgba(24, 20, 36, .3), rgba(24, 20, 36, .55)); }
.load { grid-template-columns: 96px 1fr 48px; }
.heat-cell { font-weight: 600; border-radius: 8px; }
.chips button, .pm-picker a { padding: 0 14px; height: 32px; font-weight: 550; font-size: 13px; }
.chips button[aria-pressed="true"] { background: var(--red-soft); color: var(--red-ink); border-color: var(--red-soft-2); box-shadow: none; }
:root[data-theme="dark"] .chips button[aria-pressed="true"] { background: var(--red-soft); color: var(--red-ink); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .chips button[aria-pressed="true"] { background: var(--red-soft); color: var(--red-ink); } }
.chips.compact button, .chips.compact button:first-child { padding: 0 12px; }
.rr-head { grid-template-columns: 120px minmax(80px, 260px) 44px 54px 44px 1fr 20px; }
.report-cols, .rep-table { border-color: var(--glass-line); }
.report-cols section + section { background: var(--surface-2); }
.me-id h2 { font-size: 22px; font-weight: 650; text-transform: none; }
.me-stats strong { font-weight: 650; font-size: 20px; }
.gauge text { font-weight: 650; }
.dir { background: var(--surface-3); color: var(--text-2); font-weight: 650; letter-spacing: .02em; }
:root[data-theme="dark"] .dir { background: var(--surface-3); color: var(--text-2); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .dir { background: var(--surface-3); color: var(--text-2); } }
.dir.dobro { background: var(--red-soft); color: var(--dobro); }
.dir-split a { font-weight: 650; }
.type-tile { background: var(--surface-2); border: 1px solid var(--glass-line); }
.type-tile strong { font-weight: 650; }
.ring-center strong, .ring-legend strong { font-weight: 650; }
.ring-legend a, .sbar:hover, .lrow:hover, .mp:hover, .ag:hover, .tl-pm:hover { background: var(--surface-2); }
.ptable th, .tl-corner, .tl-pm, .tl-week, .ac-name { background: var(--glass-strong); -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur); }
.ptable td { border-bottom-color: var(--glass-line); }
.ptable tbody tr:hover td { background: var(--surface-2); }
.list-card .toolbar, .result-line, .tl-foot { background: transparent; }
.result-line { border-top-color: var(--glass-line); }
.t-name { font-weight: 600; }
.lr-title strong { font-weight: 600; }
.task-title { font-weight: 550; }
.tc-head h2 { font-size: 17px; font-weight: 650; }
.review-banner { background: linear-gradient(135deg, rgba(232, 0, 36, .95), rgba(170, 0, 32, .95)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 12px 26px -12px rgba(232, 0, 36, .55); }
.review-banner span { color: rgba(255, 255, 255, .85); }
.quick-add { background: var(--surface-2); border-color: var(--line-strong); }
.p-hero::before { display: none; }
.p-hero h1 { font-size: 24px; font-weight: 650; }
.facts { background: var(--glass-line); border-color: var(--glass-line); }
.facts > div { background: var(--surface-2); }
.facts strong { font-weight: 600; }
.bcol { background: var(--surface-2); border-color: var(--glass-line); }
.bcard { background: var(--glass-strong); border-color: var(--glass-border); box-shadow: var(--glass-hi); }
.tl-ev { font-size: 11.5px; }
.tl-month { font-weight: 600; text-transform: capitalize; letter-spacing: 0; }
.tl-month.first { background: var(--red-soft); }
.tl-month, .tl-cell, .tl-week { border-color: var(--glass-line); }
.mc, .mc-head, .mc-day, .mc-band { border-color: var(--glass-line); }
.mc-day { background: transparent; }
.mc-day.out, .mc-day.weekend, .mc-band, .mc-head { background: var(--surface-2); }
.mc-num { font-weight: 600; }
.tabbar { background: var(--glass-strong); -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur); border: 1px solid var(--glass-border); box-shadow: var(--glass-shadow); }
.tabbar a { color: var(--text-2); }
.toast { -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur); }

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  :root { --glass: rgba(255, 255, 255, .96); --glass-strong: #fff; }
  :root[data-theme="dark"] { --glass: #19181e; --glass-strong: #1e1d24; }
}
@media (max-width: 1080px) {
  .app, body.rail-min .app { grid-template-columns: 88px minmax(0, 1fr); }
}
@media (max-width: 720px) {
  .app, body.rail-min .app { grid-template-columns: 1fr; }
  .topbar { margin: 8px 8px 0; top: 8px; padding: 8px 10px; }
  .topbar::before { font: 700 italic 17px var(--font-display); }
  main { padding: 4px 14px 96px; }
  .page-head h1, .tl-head h1 { font-size: 24px; }
  .hero { padding: 18px 16px; }
  .hero h1 { font-size: 22px; }
  .kpi-value { font-size: 24px; }
  .rr-head { grid-template-columns: minmax(0, 1fr) 40px 44px 18px; }
  .load { grid-template-columns: 80px 1fr 42px; }
}
.dir-split a { background: var(--surface-3); color: var(--text); box-shadow: var(--glass-hi); }
.dir-split a.dobro { background: var(--red-soft); color: var(--red-ink); }
:root[data-theme="dark"] .dir-split a:not(.dobro) { background: var(--surface-3); color: var(--text); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .dir-split a:not(.dobro) { background: var(--surface-3); color: var(--text); } }

/* ═════════ Visual v4.1 · контраст стекла ═════════
   Плотнее поверхности, тонкие тёмные рамки вместо белых, заметные разделители данных. */
:root {
  --glass: rgba(255, 255, 255, .82);
  --glass-strong: rgba(255, 255, 255, .93);
  --glass-border: rgba(24, 20, 36, .09);
  --glass-line: rgba(24, 20, 36, .10);
  --line: rgba(24, 20, 36, .10);
  --line-strong: rgba(24, 20, 36, .18);
  --surface-2: rgba(244, 242, 247, .92);
  --surface-3: rgba(24, 20, 36, .07);
  --glass-hi: inset 0 1px 0 rgba(255, 255, 255, .9);
  --glass-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 1px 2px rgba(24, 20, 36, .05), 0 10px 28px -14px rgba(40, 20, 40, .22);
  --ambient: radial-gradient(55vw 55vw at 92% -12%, rgba(232, 0, 36, .11), transparent 62%),
             radial-gradient(45vw 45vw at -8% 28%, rgba(255, 128, 150, .12), transparent 60%),
             radial-gradient(42vw 42vw at 62% 112%, rgba(155, 0, 36, .07), transparent 60%);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --glass: rgba(28, 27, 34, .82); --glass-strong: rgba(34, 33, 40, .93); --glass-border: rgba(255, 255, 255, .10); --glass-line: rgba(255, 255, 255, .10);
    --line: rgba(255, 255, 255, .10); --line-strong: rgba(255, 255, 255, .18); --surface-2: rgba(255, 255, 255, .05); --surface-3: rgba(255, 255, 255, .08);
    --glass-hi: inset 0 1px 0 rgba(255, 255, 255, .06);
  }
}
:root[data-theme="dark"] {
  --glass: rgba(28, 27, 34, .82); --glass-strong: rgba(34, 33, 40, .93); --glass-border: rgba(255, 255, 255, .10); --glass-line: rgba(255, 255, 255, .10);
  --line: rgba(255, 255, 255, .10); --line-strong: rgba(255, 255, 255, .18); --surface-2: rgba(255, 255, 255, .05); --surface-3: rgba(255, 255, 255, .08);
  --glass-hi: inset 0 1px 0 rgba(255, 255, 255, .06);
}

/* Активный пункт меню остаётся красным и при наведении */
.nav a.active, .nav a.active:hover { background: var(--red); color: #fff; }
.nav a.active:hover { background: var(--red-hover); }
.nav a:not(.active):hover { background: var(--surface-3); color: var(--text); }

/* Видимые границы между данными */
.ev { border-bottom: 1px solid var(--glass-line); border-radius: 0; }
.day-items .ev:last-child { border-bottom: 0; }
.ev:hover { border-radius: 10px; }
.notice { border-color: var(--glass-border); }
.notice-head { background: var(--surface-2); }
.lrow, .mp, .ag, .agenda .ag, .mini-projects .mp { border-color: var(--glass-line); }
.load { border-bottom: 1px solid var(--glass-line); border-radius: 0; margin: 0; padding: 9px 2px; }
.load:last-child { border-bottom: 0; }
.load:hover { border-radius: 10px; }
.ptable th { border-bottom: 1px solid var(--line-strong); }
.kpi { background: var(--glass-strong); border-color: var(--glass-border); }
.field.accent { border: 1px solid var(--red-soft-2); }
.plan-grid .field:not(.accent), .dr-body .field:not(.accent), .budget div, .kpi-row, .reg, .type-tile, .ring-legend a, .mlist article { border: 1px solid var(--glass-line); }
.task { border-bottom: 1px solid var(--glass-line); border-radius: 0; }
.tlist .task:last-child { border-bottom: 0; }
.task:hover { border-radius: 12px; }
.tl-cell, .tl-week, .tl-month, .mc-day, .mc-band { border-color: var(--line); }
.heat-cell { box-shadow: inset 0 0 0 1px var(--glass-line); }
.chips button, .pm-picker a, .fopt, .icon-btn, .btn:not(.primary), .search, .month-pick { border-color: var(--line-strong); }

/* ═════════ Обзор отдела · новый вариант ═════════ */
.variant-bar { display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin: 14px 0 -4px; font-size: 12.5px; color: var(--text-3); }
.ov-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; padding: 14px 0 16px; }
.ov-head h1 { font-size: 28px; font-weight: 650; letter-spacing: -.02em; }
.ov-head p { color: var(--text-3); margin-top: 4px; font-size: 14px; }
.grid-top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 16px; margin-bottom: 16px; align-items: stretch; }
.nt-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.nt { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 14px; align-items: center; padding: 10px 2px; border-top: 1px solid var(--glass-line); }
.nt:first-child { border-top: 0; padding-top: 2px; }
.nt-date { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 48px; border-radius: 12px; background: var(--red-soft); color: var(--red-ink); border: 1px solid var(--red-soft-2); line-height: 1.05; }
.nt-date strong { font-size: 18px; font-weight: 650; }
.nt-date small { font-size: 11.5px; font-weight: 550; text-align: center; }
.nt-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nt-text { font-size: 14px; font-weight: 550; line-height: 1.35; }
.nt-note { font-size: 12px; color: var(--text-3); }
.nt.soon .nt-note { color: var(--red-ink); font-weight: 600; }
.nt.past .nt-date { background: var(--surface-3); color: var(--text-3); border-color: var(--glass-line); }
.nt.past .nt-text { color: var(--text-3); }
.lk-groups { display: flex; flex-direction: column; gap: 14px; }
.lk-title { display: block; font-size: 12px; font-weight: 550; color: var(--text-3); margin-bottom: 6px; }
.lk-items { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.lk { position: relative; display: flex; align-items: center; min-width: 0; }
.lk-link { flex: 1; min-width: 0; display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 14px; background: var(--surface-2); border: 1px solid var(--glass-line); transition: border-color .15s, background .15s, transform .15s; }
.lk-link:hover { border-color: var(--red); background: var(--glass-strong); transform: translateY(-1px); }
.lk-ic { flex: none; width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: var(--glass-strong); border: 1px solid var(--glass-line); color: var(--red-ink); }
.lk-ic .i { width: 18px; height: 18px; }
.lk-text { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.lk-text strong { font-weight: 600; font-size: 13.5px; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.lk-text small { font-size: 11.5px; color: var(--text-3); }
.lk-out { width: 15px; height: 15px; color: var(--text-3); flex: none; }
.lk-link:hover .lk-out { color: var(--red-ink); }
.lk .ghost-btn { position: absolute; top: -6px; right: -6px; width: 24px; height: 24px; border-radius: 50%; background: var(--glass-strong); }
.lk:hover .ghost-btn { opacity: 1; }
@media (max-width: 1080px) { .grid-top { grid-template-columns: 1fr; } }
@media (max-width: 720px) {
  .variant-bar { justify-content: space-between; margin-top: 10px; }
  .ov-head h1 { font-size: 24px; }
  .lk-items { grid-template-columns: 1fr; }
}
@media (hover: none) { .lk .ghost-btn { display: none; } }

/* ═════════ Главная: «Команда и нагрузка» вместо раздела «Команда» ═════════ */
.grid-overview.wide-team { grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); }
.tm-head, .tm-row { display: grid; grid-template-columns: 92px minmax(70px, 1fr) 46px 64px minmax(0, 1.5fr); align-items: center; gap: 12px; }
.tm-head { padding: 0 6px 6px; font-size: 12px; color: var(--text-3); border-bottom: 1px solid var(--line-strong); }
.tm-head span:nth-child(4) { text-align: center; }
.tm-row { padding: 9px 6px; border-bottom: 1px solid var(--glass-line); font-size: 13px; transition: background .12s; }
.tm-row:last-child { border-bottom: 0; }
.tm-row:hover { background: var(--surface-2); border-radius: 10px; }
.tm-name { font-weight: 600; }
.tm-pct { text-align: right; font-weight: 600; }
.tm-pct.over { color: var(--red-ink); }
.tm-num { text-align: center; font-weight: 600; color: var(--text-2); }
.tm-next { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--text-2); font-size: 12.5px; }
.tm-next b { color: var(--text); font-weight: 600; margin-right: 4px; }
.tm-reg { margin-top: 10px; border-top: 1px solid var(--glass-line); padding-top: 8px; }
.tm-reg summary { list-style: none; display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 13px; font-weight: 600; color: var(--text-2); padding: 4px 6px; border-radius: 8px; }
.tm-reg summary::-webkit-details-marker { display: none; }
.tm-reg summary:hover { background: var(--surface-2); }
.tm-reg summary .i { width: 16px; height: 16px; color: var(--red-ink); }
.tm-chev { margin-left: auto; color: var(--text-3) !important; transition: transform .2s; }
.tm-reg[open] .tm-chev { transform: rotate(180deg); }
.tm-reg-row { display: flex; justify-content: space-between; gap: 12px; padding: 8px 6px; border-top: 1px solid var(--glass-line); font-size: 13px; }
.tm-reg-row strong { display: block; font-weight: 600; }
.tm-reg-row small { color: var(--text-3); font-size: 12px; }
@media (max-width: 1080px) { .grid-overview.wide-team { grid-template-columns: 1fr; } }
@media (max-width: 720px) {
  .tm-head { display: none; }
  .tm-row { grid-template-columns: 80px minmax(0, 1fr) 42px; row-gap: 4px; }
  .tm-num { display: none; }
  .tm-next { grid-column: 1 / -1; }
  .tm-reg-row { flex-direction: column; gap: 2px; }
}
@media (max-width: 720px) { .tabbar { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 1fr; } }

/* ═════════ Ближайшие события: лента дней + компактный список ═════════ */
.events-scroll { position: relative; }
.ev-tools { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.events-card .ev-tools .seg { margin: 0; }
.ev-legend { display: flex; gap: 12px; font-size: 12px; color: var(--text-3); }
.ev-legend span { display: inline-flex; align-items: center; gap: 5px; }
.ev-legend i, .evs-dots i { width: 7px; height: 7px; border-radius: 50%; background: var(--point); display: inline-block; }
.ev-legend i.launch, .evs-dots i.launch { background: var(--red); }
.ev-legend i.deadline, .evs-dots i.deadline { background: var(--amber); }
.ev-strip { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 4px; margin-bottom: 8px; }
.evs-day { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 6px 0 7px; border-radius: 12px; border: 1px solid var(--glass-line); background: var(--surface-2); color: var(--text); font: inherit; transition: border-color .15s, background .15s; }
.evs-day small { font-size: 10.5px; color: var(--text-3); }
.evs-day strong { font-size: 15px; font-weight: 600; line-height: 1.2; }
.evs-day.we small { color: var(--red-ink); }
.evs-day:disabled { cursor: default; opacity: .55; }
.evs-day.has:hover { border-color: var(--red); background: var(--glass-strong); }
.evs-day.today { background: var(--red); border-color: var(--red); color: #fff; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3); }
.evs-day.today small { color: rgba(255, 255, 255, .85); }
.evs-day.today .evs-dots i { box-shadow: 0 0 0 1.5px #fff; }
.evs-dots { display: flex; gap: 2px; height: 8px; align-items: center; margin-top: 2px; }
.evs-dots b { font-size: 9px; line-height: 1; color: var(--text-3); }
.evg { padding: 2px 0 6px; border-radius: 10px; }
.evg.flash { animation: evflash 1s ease; }
@keyframes evflash { 0%, 40% { background: var(--red-soft); } 100% { background: transparent; } }
.evg-head { position: sticky; top: 0; z-index: 1; display: flex; align-items: baseline; gap: 8px; padding: 8px 4px 4px; background: var(--glass-strong); -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur); font-size: 12.5px; color: var(--text-3); border-bottom: 1px solid var(--glass-line); }
.evg-head b { color: var(--text); font-weight: 600; text-transform: capitalize; }
.evg-head i { margin-left: auto; font-style: normal; font-size: 11px; font-weight: 600; min-width: 20px; height: 18px; padding: 0 6px; border-radius: 99px; background: var(--surface-3); display: inline-grid; place-items: center; }
.evr { display: grid; grid-template-columns: 22px minmax(0, 1fr) minmax(0, auto); align-items: center; gap: 10px; padding: 7px 6px; border-bottom: 1px solid var(--glass-line); font-size: 13px; border-radius: 0; transition: background .12s; }
.evr:last-child { border-bottom: 0; }
.evr:hover { background: var(--surface-2); border-radius: 8px; }
.evr-ic { width: 22px; height: 22px; border-radius: 7px; display: grid; place-items: center; background: var(--point-soft); color: var(--point); }
.evr-ic .i { width: 13px; height: 13px; }
.evr.launch .evr-ic { background: var(--red-soft); color: var(--red-ink); }
.evr.deadline .evr-ic { background: var(--amber-soft); color: var(--amber); }
.evr-title { min-width: 0; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.evr-title small { color: var(--text-3); font-weight: 500; }
.evr-ctx { min-width: 0; max-width: 46ch; font-size: 12px; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: right; }
@media (max-width: 720px) {
  .ev-legend { display: none; }
  .ev-strip { grid-template-columns: repeat(10, 42px); overflow-x: auto; padding-bottom: 2px; }
  .evr { grid-template-columns: 22px minmax(0, 1fr); row-gap: 2px; }
  .evr-ctx { grid-column: 2; text-align: left; max-width: none; }
}

/* Ближайшие события: список без ленты дат */
.evg { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 12px; padding: 8px 0; border-top: 1px solid var(--glass-line); border-radius: 0; }
.evg:first-child { border-top: 0; padding-top: 2px; }
.evg-date { display: flex; flex-direction: column; align-items: center; padding-top: 4px; line-height: 1.1; }
.evg-date strong { font-size: 18px; font-weight: 600; }
.evg-date span { font-size: 11.5px; color: var(--text-2); }
.evg-date small { font-size: 10.5px; color: var(--text-3); margin-top: 2px; }
.evg.today .evg-date strong, .evg.today .evg-date small { color: var(--red-ink); }
.evg-items { min-width: 0; display: flex; flex-direction: column; }
.evg-items .evr { border-bottom: 1px dashed var(--glass-line); }
.evg-items .evr:last-child { border-bottom: 0; }
.ev-legend i { width: 9px; height: 9px; border-radius: 3px; }
@media (max-width: 720px) { .evg { grid-template-columns: 40px minmax(0, 1fr); gap: 8px; } .ev-legend { display: flex; } }
.evg-items .evr { grid-template-columns: 22px minmax(0, 1fr); row-gap: 1px; padding: 6px 6px; align-items: start; }
.evg-items .evr-ic { grid-row: span 2; margin-top: 1px; }
.evg-items .evr-title { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.3; }
.evg-items .evr-ctx { grid-column: 2; text-align: left; max-width: none; font-size: 12px; line-height: 1.3; }

/* ═════════ Страница руководителя: «Неделя команды», «Мои поручения» ═════════ */
.team-week { margin-bottom: 16px; }
.tw-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.tw-head.pad { padding: 18px 20px 4px; margin: 0; }
.tw-head h2 { font-size: 17px; font-weight: 650; }
.tw-head p { font-size: 13px; color: var(--text-3); margin-top: 3px; }
.tw-head p b { color: var(--text); font-weight: 650; }
.tw-table { border: 1px solid var(--glass-line); border-radius: 14px; overflow: hidden; }
.tw-row { display: grid; grid-template-columns: minmax(120px, 1.1fr) minmax(80px, 1.3fr) 46px 70px 86px 76px minmax(96px, .9fr) 20px; align-items: center; gap: 12px; padding: 9px 14px; font-size: 13px; list-style: none; }
.tw-row::-webkit-details-marker { display: none; }
.tw-cols { font-size: 12px; color: var(--text-3); background: var(--surface-2); border-bottom: 1px solid var(--line-strong); padding-top: 8px; padding-bottom: 8px; }
.tw-row-wrap + .tw-row-wrap { border-top: 1px solid var(--glass-line); }
details.tw-row-wrap > summary { cursor: pointer; transition: background .12s; }
details.tw-row-wrap > summary:hover, details.tw-row-wrap[open] > summary { background: var(--surface-2); }
details[open] > .tw-row .rr-chev .i { transform: rotate(180deg); }
.tw-row-wrap.is-empty .tw-row { color: var(--text-3); }
.tw-name { display: flex; align-items: center; gap: 6px; min-width: 0; }
.tw-name a { font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tw-name a:hover { color: var(--red-ink); text-decoration: underline; }
.tw-name .badge-new { margin: 0; }
.tw-num { font-weight: 600; color: var(--text-2); white-space: nowrap; }
.tw-num small { margin-left: 4px; font-size: 11px; }
.tw-row-wrap .rr-body { border-top: 1px solid var(--glass-line); }
.rl-title { border: 0; background: none; padding: 0; font: inherit; color: inherit; text-align: left; cursor: pointer; }
.rl-title:hover { color: var(--red-ink); }
.tw-open { margin: 2px 8px 10px; }
.tw-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.tw-foot .note { margin: 0; }
.assignments .tlist.wide { padding-top: 4px; }
@media (max-width: 900px) {
  .tw-row { grid-template-columns: minmax(0, 1fr) 46px 64px 70px 18px; }
  .tw-row > .rr-bar, .tw-row > .tw-car, .tw-row > .rs { display: none; }
  .tw-cols { display: none; }
}
@media (max-width: 720px) { .tw-row { grid-template-columns: minmax(0, 1fr) 40px 54px 18px; padding: 9px 10px; } .tw-row > .tw-opn { display: none; } .tw-head.pad { padding: 14px 14px 4px; } }

/* ═════════ «Моя работа» менеджера: сводка сверху, компактные задачи ═════════ */
.me-hero + .tasks-card { margin-top: 16px; }
.tasks-card + .grid-my { margin-top: 0; }
.tasks-card.compact { padding: 18px 20px 14px; }
.tasks-card.compact .tc-head { align-items: center; margin-bottom: 12px; }
.tc-title { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.tc-title h2 { font-size: 17px; font-weight: 650; }
.tc-mini { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font-size: 12.5px; color: var(--text-3); }
.tc-mini b { color: var(--text); font-weight: 650; }
.tc-mini .lead-count .i { width: 13px; height: 13px; }
.tc-bar.mini { width: 90px; height: 6px; }
.tc-tools { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-left: auto; }
.tasks-card.compact .tc-head .mode-seg { margin-left: 0; }
.tasks-card.compact .quick-add { margin-bottom: 10px; padding: 4px 4px 4px 12px; }
.tasks-card.compact .quick-add input { height: 32px; }
.tgroups { display: flex; flex-direction: column; gap: 8px; }
.tg { border: 1px solid var(--glass-line); border-radius: 12px; overflow: hidden; }
.tg-head { display: flex; align-items: center; gap: 8px; padding: 6px 12px; background: var(--surface-2); border-bottom: 1px solid var(--glass-line); font-size: 12.5px; }
.tg-name { font-weight: 600; color: var(--text-2); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
a.tg-name:hover { color: var(--red-ink); }
.tg-name.none { color: var(--text-3); font-weight: 550; }
.tg-n { margin-left: auto; font-size: 11px; font-weight: 600; color: var(--text-3); }
.task.compact { align-items: center; gap: 10px; padding: 5px 10px; }
.tg .task.compact { border-bottom: 1px solid var(--glass-line); }
.tg .task.compact:last-child { border-bottom: 0; }
.task.compact .tcheck { width: 20px; height: 20px; border-radius: 6px; margin: 0; }
.task.compact .tcheck .i { width: 13px; height: 13px; }
.task.compact .task-main { flex-direction: row; align-items: center; gap: 10px; padding: 3px 0; min-width: 0; }
.task.compact .task-title { flex: 1 1 auto; min-width: 0; font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.task.compact .task-title .prio { display: inline-block; margin-right: 6px; vertical-align: 1px; }
.task.compact .task-meta { flex: 0 1 auto; flex-wrap: nowrap; gap: 8px; white-space: nowrap; max-width: 55%; overflow: hidden; }
.task.compact .tsrc { padding: 0 6px; font-size: 10.5px; }
.task.compact .icon-btn.sm { width: 26px; height: 26px; }
.tasks-card.compact .carried { margin-top: 8px; }
.tasks-card.compact .tc-foot { margin-top: 12px; padding-top: 10px; }
@media (max-width: 720px) {
  .tc-tools { margin-left: 0; width: 100%; justify-content: space-between; }
  .task.compact .task-main { flex-direction: column; align-items: flex-start; gap: 2px; }
  .task.compact .task-title { white-space: normal; }
  .task.compact .task-meta { max-width: 100%; flex-wrap: wrap; }
}
@media (min-width: 1200px) {
  .tgroups { display: block; column-count: 2; column-gap: 12px; }
  .tgroups .tg { break-inside: avoid; margin-bottom: 10px; display: block; }
}
/* Полоса «Задачи недели без даты» в календаре — явно подписана и отличается от дней */
.mc-band { background: repeating-linear-gradient(135deg, var(--surface-2) 0 10px, transparent 10px 20px), var(--surface-2); border-top: 1px dashed var(--line-strong); }
.mc-band.now { background: repeating-linear-gradient(135deg, var(--red-soft) 0 10px, transparent 10px 20px), var(--red-soft); }
.mc-band-label { min-width: 200px; gap: 6px; font-weight: 550; color: var(--text-3); font-size: 12px; }
.mc-band-label .i { width: 15px; height: 15px; color: var(--text-3); }
.mc-band-label b { font-weight: 600; }
.mc-legend-note { flex-basis: 100%; font-weight: 500; color: var(--text-3); font-size: 12px; }
@media (max-width: 720px) { .mc-band-label { min-width: 0; } }
.mc-band-gap { grid-column: 1 / -1; height: 0; border-top: 1px solid var(--line); }
.mc-band-gap + .mc-day, .mc-band-gap ~ .mc-day { }

/* «Моя работа»: ближайшие 14 дней внутри верхней сводки */
.me-hero { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1.15fr) minmax(0, 1.5fr); }
.me-agenda { min-width: 0; align-self: stretch; display: flex; flex-direction: column; gap: 6px; padding-left: 22px; border-left: 1px solid var(--glass-line); }
.mea-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.mea-head .mini-title { margin: 0; }
.mea-head small { font-size: 11.5px; color: var(--text-3); }
.mea-list { display: flex; flex-direction: column; }
.mea-row { display: grid; grid-template-columns: 40px 22px minmax(0, 1fr); align-items: center; gap: 8px; padding: 5px 4px; border-bottom: 1px solid var(--glass-line); border-radius: 0; font-size: 13px; }
.mea-row:last-child { border-bottom: 0; }
.mea-row:hover { background: var(--surface-2); border-radius: 8px; }
.mea-date { font-weight: 600; color: var(--text-2); font-size: 12.5px; }
.evr-ic.launch { background: var(--red-soft); color: var(--red-ink); }
.evr-ic.deadline { background: var(--amber-soft); color: var(--amber); }
.mea-text { min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.mea-text strong { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mea-text small { font-size: 11.5px; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mea-more { align-self: flex-start; padding-left: 4px; }
.mea-empty { font-size: 13px; color: var(--text-3); padding: 8px 4px; }
.mea-list.full { padding-bottom: 16px; }
.mea-list.full .mea-text strong, .mea-list.full .mea-text small { white-space: normal; }
.grid-my.single { grid-template-columns: 1fr; }
@media (max-width: 1280px) { .me-hero { grid-template-columns: 1fr auto; } .me-agenda { grid-column: 1 / -1; padding-left: 0; border-left: 0; border-top: 1px solid var(--glass-line); padding-top: 12px; } }
@media (max-width: 720px) { .me-hero { grid-template-columns: 1fr; } }
.toast.with-action { display: flex; align-items: center; gap: 14px; pointer-events: auto; padding: 10px 10px 10px 18px; }
.toast-btn { border: 0; border-radius: 10px; padding: 7px 12px; font: inherit; font-weight: 650; cursor: pointer; background: rgba(255, 255, 255, .16); color: inherit; }
.toast-btn:hover { background: rgba(255, 255, 255, .26); }
:root[data-theme="dark"] .toast-btn { background: rgba(0, 0, 0, .08); }

/* ═════ v5 · Карточка проекта ═════ */
/* Сложность — нейтральная шкала из четырёх делений */
.cx { display: inline-flex; align-items: center; gap: 6px; min-width: 0; height: 22px; padding: 0 8px 0 7px; border-radius: 7px; border: 1px solid var(--line); background: var(--surface); color: var(--text); font-size: 11.5px; font-weight: 650; }
.cx.none { color: var(--text-3); }
.cx-bars { display: inline-flex; align-items: flex-end; gap: 2px; height: 11px; }
.cx-bars i { width: 3px; border-radius: 1px; background: var(--line-strong); }
.cx-bars i:nth-child(1) { height: 4px; } .cx-bars i:nth-child(2) { height: 6px; } .cx-bars i:nth-child(3) { height: 8.5px; } .cx-bars i:nth-child(4) { height: 11px; }
.cx-bars i.on { background: var(--text-2); }
.facts .cx { height: 26px; font-size: 13px; }

.fact-btn { display: inline-flex; align-items: center; gap: 4px; align-self: flex-start; border: 0; background: none; padding: 0; color: var(--red-ink); font: inherit; font-size: 12px; font-weight: 650; cursor: pointer; }
.fact-btn .i { width: 13px; height: 13px; }
.fact-btn:hover { text-decoration: underline; }
.t-co { display: block; margin: 2px 0 0 26px; font-size: 11.5px; color: var(--text-3); }
.link-btn.inline { padding: 0; display: inline; }
.link-btn.inline:hover { background: none; text-decoration: underline; }

/* Контрольные точки: дата слева, одинаковая ширина */
.mls { list-style: none; margin: 0; padding: 0; }
.mls li { display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 9px 0; border-top: 1px solid var(--line); }
.mls li:first-child { border-top: 0; padding-top: 2px; }
.mls-date { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 12px; background: var(--red-soft); color: var(--red-ink); line-height: 1; }
.mls-date b { font-size: 17px; font-weight: 650; }
.mls-date small { font-size: 11px; font-weight: 600; margin-top: 3px; text-align: center; }
.mls li.is-past .mls-date { background: var(--surface-3); color: var(--text-3); }
.mls li.is-today .mls-date { background: var(--red); color: #fff; }
.mls-body { min-width: 0; }
.mls-body h4 { margin: 0; font-size: 14.5px; font-weight: 600; line-height: 1.3; }
.mls li.is-past h4 { color: var(--text-2); }
.mls-body p { margin: 3px 0 0; font-size: 12.5px; color: var(--text-3); }
.mls-body p.pre { color: var(--text-2); margin-top: 6px; }
.mls-tag { font-size: 11.5px; font-weight: 600; color: var(--text-3); white-space: nowrap; }
.mls-tag.plan { color: var(--red-ink); }
.mls.compact li { grid-template-columns: 40px minmax(0, 1fr) auto; gap: 10px; padding: 7px 0; }
.mls.compact .mls-date { width: 40px; height: 40px; border-radius: 10px; }
.mls.compact .mls-date b { font-size: 15px; }
.mls.compact .mls-date small { font-size: 10.5px; }
.mls.compact h4 { font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mls.compact .mls-body p { font-size: 12px; margin-top: 1px; }

/* KPI: план / факт — структура карточки таблицы */
.kpi-card { margin-bottom: 16px; }
.kpi-wrap { overflow-x: auto; margin: 0 -4px; padding: 0 4px; }
.kpi-table { width: 100%; border-collapse: collapse; font-size: 13.5px; min-width: 640px; }
.kpi-table th { text-align: left; font-size: 11.5px; font-weight: 600; color: var(--text-3); padding: 0 12px 8px; border-bottom: 1px solid var(--line-strong); white-space: nowrap; }
.kpi-table td { padding: 10px 12px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.kpi-table th:first-child, .kpi-table td:first-child { padding-left: 0; }
.kpi-table th:last-child, .kpi-table td:last-child { padding-right: 0; }
.kpi-table .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.kpi-table th:nth-child(5) { width: 200px; }
.kpi-table th:nth-child(6) { width: 56px; }
.kpi-table th:nth-child(2) { width: 90px; }
.kpi-name { font-weight: 600; }
.kpi-unit { color: var(--text-2); font-size: 12.5px; }
.kpi-table td.missing { color: var(--text-3); }
.kpi-meter { display: grid; grid-template-columns: minmax(0, 1fr) 52px; gap: 10px; align-items: center; }
.kpi-meter::before { content: ""; grid-area: 1 / 1; height: 6px; border-radius: 99px; background: var(--surface-3); }
.kpi-meter i { grid-area: 1 / 1; height: 6px; width: var(--w); border-radius: 99px; background: var(--text-2); }
.kpi-meter.done i { background: var(--red); }
.kpi-meter span { font-size: 12.5px; font-weight: 650; text-align: right; font-variant-numeric: tabular-nums; }
.kpi-meter.done span { color: var(--red-ink); }
.kpi-table tfoot td { border-bottom: 0; border-top: 1px solid var(--line-strong); font-weight: 650; padding-top: 12px; }
.kpi-table tfoot small { display: block; font-weight: 500; font-size: 11.5px; color: var(--text-3); margin-top: 2px; }
.kpi-table tfoot .kpi-meter.total::before, .kpi-table tfoot .kpi-meter.total i { height: 8px; }
.kpi-table td.warn { color: var(--amber); }
.kpi-card .note { margin-top: 12px; }

/* Команда проекта */
.pt-list { display: flex; flex-direction: column; }
.pt-row { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 4px 14px; padding: 10px 0; border-top: 1px solid var(--line); }
.pt-row:first-child { border-top: 0; padding-top: 0; }
.pt-who { grid-row: span 2; display: flex; flex-direction: column; }
.pt-who strong { font-weight: 650; }
.pt-who small { font-size: 12px; color: var(--text-3); }
.pt-zone { margin: 0; font-size: 13px; color: var(--text-2); }
.pt-zone.missing { color: var(--text-3); }
.pt-facts { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 12px; color: var(--text-3); }
.pt-facts .link-btn { padding: 0; font-size: 12.5px; }
.pt-facts .link-btn:hover { background: none; text-decoration: underline; }

/* Задачи проекта на двух менеджеров */
.pt-add .seg { flex: none; }
.pt-add .seg label { position: relative; display: inline-flex; align-items: center; height: 30px; padding: 0 11px; border-radius: 9px; font-weight: 650; font-size: 12.5px; color: var(--text-2); cursor: pointer; white-space: nowrap; }
.pt-add .seg input { position: absolute; opacity: 0; pointer-events: none; }
.pt-add .seg label:has(input:checked) { background: var(--surface); color: var(--text); box-shadow: 0 1px 3px rgba(0, 0, 0, .12); }
.pt-add .seg label:has(input:focus-visible) { outline: 2px solid var(--red); outline-offset: 1px; }
.pt-add select { max-width: 190px; }
.pt-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.pt-col { min-width: 0; padding: 12px 14px; border-radius: 14px; border: 1px solid var(--glass-line); background: var(--surface-2); }
.pt-col-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; }
.pt-col-head strong { font-weight: 650; }
.pt-col-head small { font-size: 12px; color: var(--text-3); }
.pt-col .pt-zone { margin-bottom: 8px; font-size: 12.5px; }
.pt-col .missing { font-size: 13px; margin: 6px 0; }
.from-co { font-size: 11.5px; color: var(--text-2); }
@media (max-width: 900px) { .pt-cols { grid-template-columns: 1fr; } }
@media (max-width: 640px) {
  .pt-row { grid-template-columns: 1fr; }
  .pt-who { grid-row: auto; flex-direction: row; gap: 8px; align-items: baseline; }
  .pt-add .seg { order: 0; }
  .pt-add select { order: 1; }
  .pt-add input[name="title"] { order: 2; flex-basis: 100%; }
  .pt-add .btn { order: 3; width: 100%; justify-content: center; }
  .mls li { grid-template-columns: 40px minmax(0, 1fr); }
  .mls-tag { grid-column: 2; }
}
.tf-field[hidden] { display: none; }

/* ═════ v5.1 · Карточка проекта: две вкладки ═════ */
.p-hero.v2 .p-hero-main { align-items: center; }
.p-hero.v2 h1 { margin-bottom: 0; }
.p-hero.v2 .p-stage { margin-top: 14px; }
.facts.six { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.facts.six > div { min-width: 0; }
.facts.six strong { flex-wrap: wrap; row-gap: 2px; }
@media (max-width: 1280px) { .facts.six { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .facts.six { grid-template-columns: 1fr 1fr; } }
.miss-line { margin: 12px 0 0; padding-top: 10px; border-top: 1px dashed var(--line); font-size: 12.5px; color: var(--text-3); }
.mech { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; }
.mech .field { margin: 0; padding: 10px 12px; border-radius: 12px; background: var(--surface-2); border: 1px solid var(--glass-line); }
.budget-dev { margin: 10px 0 0; font-size: 12.5px; color: var(--text-2); }
.budget-dev.over { color: var(--red-ink); font-weight: 600; }
.source-line { display: flex; align-items: center; gap: 8px; margin: 0; padding: 0 6px; font-size: 12px; color: var(--text-3); }
.source-line .i { width: 15px; height: 15px; }
.mls-past { margin-top: 8px; }
.mls-past .mls { margin-top: 6px; }
.card-head .fresh { white-space: nowrap; }
.wk-tags { display: inline-flex; align-items: center; gap: 10px; white-space: nowrap; }
.pre.clamp { display: -webkit-box; -webkit-line-clamp: 8; -webkit-box-orient: vertical; overflow: hidden; }
.more-btn { align-self: flex-start; margin-top: 6px; font-size: 12.5px; text-align: left; }
.fact-btn { text-align: left; } .fact-btn .i { flex: none; }

/* ═════ v5.2 · Редактирование карточки, точки, регулярная работа, чек-лист ═════ */
.ph-side { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.ph-actions { display: flex; gap: 2px; }
.edit-btn .i, .link-btn .i { flex: none; }
.link-btn.muted { color: var(--text-2); }
.link-btn.muted:hover { background: var(--surface-3); color: var(--text); }
.head-acts { display: inline-flex; align-items: center; gap: 8px; }
.wk-tags .edit-btn { margin-left: -4px; }

.edit-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 12px; }
.edit-grid .wide { grid-column: 1 / -1; }
.edit-grid .fsheet-foot { grid-column: 1 / -1; }
.tf-ro { margin: 0; padding: 10px 12px; border-radius: 11px; background: var(--surface-3); color: var(--text-2); }
.fsheet-foot .sp { flex: 1; }
.fsheet-foot:has(.sp) .primary { flex: none; }
.btn.danger-text { color: var(--red-ink); }
@media (max-width: 640px) { .edit-grid { grid-template-columns: 1fr; } }

/* Сложность S/M/L/XL — переключатель */
.lv-seg { display: inline-flex; padding: 3px; gap: 2px; border-radius: 11px; background: var(--surface-3); flex: none; }
.lv-seg label { position: relative; display: inline-grid; place-items: center; min-width: 34px; height: 30px; padding: 0 8px; border-radius: 8px; font-weight: 650; font-size: 12.5px; color: var(--text-2); cursor: pointer; }
.lv-seg input { position: absolute; opacity: 0; pointer-events: none; }
.lv-seg label:has(input:checked) { background: var(--surface); color: var(--text); box-shadow: 0 1px 3px rgba(0, 0, 0, .12); }
.lv-seg label:has(input:focus-visible) { outline: 2px solid var(--red); outline-offset: 1px; }

/* KPI-редактор */
.ke-head, .ke-row { display: grid; grid-template-columns: minmax(0, 2.4fr) minmax(0, .8fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, .7fr) 32px; gap: 6px; align-items: center; }
.ke-head span { font-size: 11.5px; font-weight: 600; color: var(--text-3); }
#ke-rows { display: flex; flex-direction: column; gap: 6px; }
.ke-row input { width: 100%; min-width: 0; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); color: var(--text); padding: 8px 10px; font: inherit; font-size: 13.5px; outline: none; }
.ke-row input:focus { border-color: var(--red); background: var(--surface); box-shadow: 0 0 0 3px var(--red-soft); }
.ke-row input[name="plan"], .ke-row input[name="actual"], .ke-row input[name="weight"] { text-align: right; font-variant-numeric: tabular-nums; }
.ke-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 12.5px; color: var(--text-3); }
.ke-foot .warn { color: var(--amber); font-weight: 600; }
@media (max-width: 640px) {
  .ke-head { display: none; }
  .ke-row { grid-template-columns: repeat(4, minmax(0, 1fr)); padding-bottom: 8px; border-bottom: 1px solid var(--line); }
  .ke-row input[name="name"] { grid-column: 1 / 4; }
  .ke-row [data-ke-del] { grid-column: 4; grid-row: 1; justify-self: end; }
}

/* Добавление точки / регулярной работы в карточке */
.ms-add { display: flex; flex-direction: column; gap: 8px; padding: 10px; margin-bottom: 12px; border-radius: 14px; border: 1.5px solid var(--red); background: var(--surface); box-shadow: 0 0 0 4px var(--red-soft); }
.ms-add > input { border: 0; background: none; outline: none; font: inherit; font-size: 14px; font-weight: 600; color: var(--text); padding: 4px 4px; }
.ms-add-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ms-add-row input[type="date"], .ms-add-row select { height: 36px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); color: var(--text); padding: 0 8px; font: inherit; font-size: 13px; min-width: 0; }
.ms-add-row select { flex: 1 1 110px; }
.ms-add-row .btn { margin-left: auto; }
.rw-d { display: inline-flex; align-items: center; gap: 4px; }
.rw-d small { color: var(--text-3); font-size: 12px; }

button.mls-body { display: block; width: 100%; text-align: left; border: 0; background: none; padding: 4px 6px; margin: -4px -6px; border-radius: 10px; color: inherit; font: inherit; cursor: pointer; }
button.mls-body:hover { background: var(--surface-2); }
.site-mark { display: inline-block; width: 6px; height: 6px; margin-left: 6px; border-radius: 50%; background: var(--red); vertical-align: middle; }

.rw-list { display: flex; flex-direction: column; }
.rw-row { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto auto; align-items: center; gap: 10px; padding: 9px 6px; border: 0; border-top: 1px solid var(--line); background: none; color: inherit; font: inherit; text-align: left; width: 100%; }
.rw-row:first-child { border-top: 0; }
button.rw-row { cursor: pointer; border-radius: 0; }
button.rw-row:hover { background: var(--surface-2); }
.rw-row > .i { width: 16px; height: 16px; color: var(--text-3); }
.rw-main { min-width: 0; display: flex; flex-direction: column; }
.rw-main strong { font-weight: 600; font-size: 13.5px; }
.rw-main small { font-size: 12px; color: var(--text-3); }
.rw-st { font-size: 11.5px; font-weight: 600; color: var(--text-3); min-width: 62px; text-align: right; }
.rw-st.live { color: var(--green, #1f9d55); }

/* Чек-лист закрытия */
.cl-progress { position: relative; height: 6px; border-radius: 99px; background: var(--surface-3); margin-bottom: 8px; overflow: hidden; }
.cl-progress i { position: absolute; inset: 0 auto 0 0; width: var(--w); background: var(--red); border-radius: 99px; }
.cl-list { list-style: none; margin: 0; padding: 0; }
.cl-row { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 0; border-top: 1px solid var(--line); }
.cl-row:first-child { border-top: 0; }
.cl-main { display: flex; flex-direction: column; min-width: 0; }
.cl-main strong { font-weight: 600; font-size: 13.5px; }
.cl-main small { font-size: 12px; color: var(--text-3); }
.cl-row.done .cl-main strong, .cl-row.na .cl-main strong { color: var(--text-2); }
.cl-row.na .cl-main strong { text-decoration: line-through; }
.cl-act { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0; }
.cl-act .link-btn { padding: 4px 6px; font-size: 12px; }
details.card.fold { padding-top: 16px; padding-bottom: 16px; }
details.card.fold > summary { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; cursor: pointer; list-style: none; font-weight: 600; font-size: 15px; }
details.card.fold > summary::-webkit-details-marker { display: none; }
details.card.fold > summary small { font-size: 12px; font-weight: 500; color: var(--text-3); }
details.card.fold[open] > summary { margin-bottom: 12px; }
@media (max-width: 640px) { .cl-row { grid-template-columns: 24px minmax(0, 1fr); } .cl-act { grid-column: 2; justify-content: flex-start; } }

/* История */
.hist { list-style: none; margin: 0; padding: 0 0 18px; }
.hist li { display: grid; grid-template-columns: 120px 110px minmax(0, 1fr); gap: 10px; padding: 9px 0; border-top: 1px solid var(--line); font-size: 13px; }
.hist li:first-child { border-top: 0; }
.hist-when, .hist-who { color: var(--text-3); font-size: 12.5px; }
.hist-what s { color: var(--text-3); }
@media (max-width: 640px) { .hist li { grid-template-columns: 1fr 1fr; } .hist-what { grid-column: 1 / -1; } }

/* ═════ v5.3 · Охранные поля у счётчиков и стрелок списков ═════ */
/* Меню: подпись сжимается с многоточием, число — спокойная цифра без плашки, с отступом от края. */
.nav a, .nav-btn { gap: 11px; padding-right: 14px; }
.nav a > span, .nav-btn > span { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.nav a > .i, .nav-btn > .i { flex: none; }
.nav-count, .nav a.active .nav-count { flex: none; margin-left: 0; padding: 0; background: none; border-radius: 0; font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--text-3); }
.nav a.active .nav-count { color: rgba(255, 255, 255, .78); }
.nav-badge, .nav-btn kbd { flex: none; margin-left: 0; }

/* Выпадающие списки: своя стрелка с полем 12 px от края вместо системной, прижатой к границе. */
select:not([multiple]) {
  -webkit-appearance: none; appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%2385858F' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4.5l3 3 3-3'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; background-position: right 12px center !important; background-size: 12px 12px !important;
  padding-right: 34px !important; text-overflow: ellipsis; cursor: pointer;
}
.actor-pill select { padding-left: 10px; background-position: right 9px center !important; padding-right: 28px !important; }

/* Карточка проекта: на узком экране точки и регулярная работа — в начале вкладки. */
@media (max-width: 1080px) { .grid-card.work > .stack:last-child { order: -1; } }
@media (min-width: 1081px) { .app { grid-template-columns: 272px minmax(0, 1fr); } body.rail-min .app { grid-template-columns: 88px minmax(0, 1fr); } }

/* ═════ v5.4 · Правила нагрузки ═════ */
.me-gauge .link-btn.mini { font-size: 11.5px; margin-top: 2px; }
.rules { padding-bottom: 18px; font-size: 13.5px; color: var(--text-2); }
.rules h3 { margin: 18px 0 6px; font-size: 14px; font-weight: 650; color: var(--text); }
.rules p { margin: 0 0 8px; }
.rules-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 8px; align-items: start; }
.rules-grid table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.rules-grid th { text-align: left; font-weight: 600; color: var(--text-3); padding: 0 0 6px; border-bottom: 1px solid var(--line-strong); }
.rules-grid td { padding: 5px 0; border-bottom: 1px solid var(--line); color: var(--text); }
.rules-grid .num { text-align: right; font-variant-numeric: tabular-nums; }
@media (max-width: 640px) { .rules-grid { grid-template-columns: 1fr; } }

/* ═════ v6 · Портфель: компактные показатели, один список ═════ */
.dash.v2 summary { padding-bottom: 10px; }
.pdash { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1.15fr) minmax(0, .9fr); gap: 0; border-radius: 20px; background: var(--glass-strong, var(--surface)); border: 1px solid var(--glass-line, var(--line)); box-shadow: var(--glass-shadow, none); overflow: hidden; }
.pdash > section { min-width: 0; padding: 16px 18px; }
.pdash > section + section { border-left: 1px solid var(--glass-line, var(--line)); }
.pdash h3 { margin: 0 0 8px; font-size: 12px; font-weight: 600; color: var(--text-3); }
.pdash h3 + .pd-split + h3 { margin-top: 12px; }

.pd-work { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; align-items: center; }
.pd-big { display: flex; flex-direction: column; align-items: flex-start; padding-right: 16px; border-right: 1px solid var(--glass-line, var(--line)); color: inherit; }
.pd-big strong { font: 650 40px/1 var(--font-display); letter-spacing: -.02em; color: var(--text); }
.pd-big span { font-size: 12.5px; color: var(--text-3); margin-top: 4px; }
.pd-big:hover strong { color: var(--red-ink); }
.pd-types { display: flex; flex-wrap: wrap; gap: 5px; }
.pd-chip { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 9px; border-radius: 8px; background: var(--surface-2); border: 1px solid var(--glass-line, var(--line)); font-size: 12px; font-weight: 550; color: var(--text-2); white-space: nowrap; }
.pd-chip b { font-weight: 650; color: var(--text); font-variant-numeric: tabular-nums; }
.pd-chip:hover { border-color: var(--red); color: var(--red-ink); }

.pd-stack { display: flex; gap: 2px; height: 12px; border-radius: 99px; overflow: hidden; margin-bottom: 10px; }
.pd-stack a { min-width: 4px; }
.pd-legend { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3px 14px; }
.pd-legend a { display: flex; align-items: center; gap: 7px; font-size: 12px; color: var(--text-2); padding: 2px 0; min-width: 0; }
.pd-legend a b { margin-left: auto; font-weight: 650; color: var(--text); font-variant-numeric: tabular-nums; }
.pd-legend a:hover { color: var(--red-ink); }
.pd-legend i { width: 9px; height: 9px; border-radius: 3px; flex: none; }
/* Этапы — от светлого к насыщенному по ходу проекта */
.st-0 { background: color-mix(in srgb, var(--red) 18%, var(--surface-3)); }
.st-1 { background: color-mix(in srgb, var(--red) 30%, var(--surface-3)); }
.st-2 { background: color-mix(in srgb, var(--red) 44%, var(--surface-3)); }
.st-3 { background: color-mix(in srgb, var(--red) 58%, var(--surface-3)); }
.st-4 { background: var(--red); }
.st-5 { background: color-mix(in srgb, var(--red) 70%, #000); }
.st-6 { background: color-mix(in srgb, var(--text-3) 70%, var(--surface-3)); }

.pd-split { display: flex; gap: 3px; height: 30px; }
.pd-split a { min-width: 46px; display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 0 10px; border-radius: 8px; font-size: 11.5px; font-weight: 600; white-space: nowrap; overflow: hidden; }
.pd-split a span { overflow: hidden; text-overflow: ellipsis; }
.pd-split a b { font-variant-numeric: tabular-nums; }
.pd-split .fon { background: var(--black, #000005); color: #fff; }
.pd-split .dobro { background: var(--red); color: #fff; }
.pd-split .ru { background: var(--surface-3); color: var(--text); }
.pd-split .by { background: color-mix(in srgb, var(--red) 14%, var(--surface)); color: var(--red-ink); border: 1px solid color-mix(in srgb, var(--red) 30%, transparent); }
.pd-split a:hover { filter: brightness(1.08); }
@media (max-width: 1180px) { .pdash { grid-template-columns: 1fr 1fr; } .pd-work { grid-column: 1 / -1; } .pd-stages { border-left: 0 !important; border-top: 1px solid var(--glass-line, var(--line)); } .pd-geo { border-top: 1px solid var(--glass-line, var(--line)); } }
@media (max-width: 640px) { .pdash { grid-template-columns: 1fr; } .pd-work { grid-template-columns: 1fr; } .pd-big { flex-direction: row; align-items: baseline; gap: 8px; border-right: 0; padding-right: 0; } .pd-geo { border-left: 0 !important; } }

.geo-tag { display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: 6px; font-size: 10.5px; font-weight: 650; color: var(--red-ink); background: color-mix(in srgb, var(--red) 10%, var(--surface)); border: 1px solid color-mix(in srgb, var(--red) 28%, transparent); }

/* Список проектов */
.prows { display: flex; flex-direction: column; }
.prow-head, .prow { display: grid; grid-template-columns: minmax(0, 2.3fr) minmax(90px, .8fr) minmax(120px, .95fr) minmax(104px, .8fr) minmax(0, 2fr) 58px; gap: 14px; align-items: center; }
.prow-head { position: sticky; top: 64px; z-index: 2; padding: 8px 12px; font-size: 11.5px; font-weight: 600; color: var(--text-3); border-bottom: 1px solid var(--line-strong); background: var(--surface); }
.prow { padding: 9px 12px; border-bottom: 1px solid var(--line); transition: background .12s; }
.prow:hover, .prow.peeked { background: var(--surface-2); }
.prow.paused { opacity: .72; }
.prow.closed .t-name { color: var(--text-2); }
.pr-name { display: flex; align-items: center; gap: 10px; min-width: 0; }
.pr-name > div { min-width: 0; }
.pr-name .emo { flex: none; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; background: var(--surface-2); font-size: 15px; }
.pr-title { display: flex; align-items: center; gap: 7px; min-width: 0; }
.pr-title .t-name { font-weight: 600; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.pr-name .t-meta { margin-top: 3px; gap: 6px; flex-wrap: nowrap; overflow: hidden; }
.pr-pm, .pr-stage, .pr-date { display: flex; flex-direction: column; min-width: 0; font-size: 13px; }
.pr-pm strong, .pr-date strong { font-weight: 600; }
.pr-pm small, .pr-stage small, .pr-date small { font-size: 11.5px; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pr-stage small { margin-top: 4px; }
.pr-date strong.past { color: var(--red-ink); }
.pr-plan { min-width: 0; text-align: left; border: 0; background: none; padding: 0; font: inherit; color: var(--text-2); cursor: pointer; display: flex; flex-direction: column; gap: 3px; }
.pr-plan > span { font-size: 12.5px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; white-space: pre-line; }
.pr-plan small { font-size: 11px; }
.pr-plan:hover > span { color: var(--text); }
.pr-cx { justify-self: end; }
@media (max-width: 1180px) { .prow-head, .prow { grid-template-columns: minmax(0, 2fr) minmax(84px, .8fr) minmax(110px, .9fr) minmax(96px, .8fr) minmax(0, 1.6fr); } .pr-cx, .prow-head span:last-child { display: none; } }
@media (max-width: 760px) {
  .prow-head { display: none; }
  .prow { grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; padding: 12px 4px; }
  .pr-name { grid-column: 1 / -1; }
  .pr-pm { grid-column: 1; flex-direction: row; gap: 6px; align-items: baseline; }
  .pr-date { grid-column: 2; grid-row: 2; text-align: right; }
  .pr-stage { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 8px; }
  .pr-stage small { margin: 0; }
  .pr-plan { grid-column: 1 / -1; }
  .pr-cx { display: none; }
}
.pd-bar { display: flex; gap: 2px; height: 8px; border-radius: 99px; overflow: hidden; }
.pd-bar i { min-width: 4px; }
.pd-bar .fon, .pd-bar-legend .fon { background: var(--black, #000005); }
.pd-bar .dobro, .pd-bar-legend .dobro { background: var(--red); }
.pd-bar .ru, .pd-bar-legend .ru { background: color-mix(in srgb, var(--text-3) 55%, var(--surface-3)); }
.pd-bar .by, .pd-bar-legend .by { background: color-mix(in srgb, var(--red) 55%, var(--surface)); }
:root[data-theme="dark"] .pd-bar .fon, :root[data-theme="dark"] .pd-bar-legend .fon { background: #E6E6EA; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .pd-bar .fon, :root:not([data-theme="light"]) .pd-bar-legend .fon { background: #E6E6EA; } }
.pd-bar-legend { display: flex; gap: 14px; margin-top: 7px; flex-wrap: wrap; }
.pd-bar-legend a { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text-2); white-space: nowrap; }
.pd-bar-legend a b { font-weight: 650; color: var(--text); font-variant-numeric: tabular-nums; }
.pd-bar-legend a small { color: var(--text-3); font-size: 11px; }
.pd-bar-legend a:hover { color: var(--red-ink); }
.pd-bar-legend i { width: 9px; height: 9px; border-radius: 3px; flex: none; }
.pd-geo h3:not(:first-child) { margin-top: 14px; }
/* Список: добавлена колонка «Выполнено за неделю» */
.prow-head, .prow { grid-template-columns: minmax(0, 2fr) minmax(86px, .75fr) minmax(112px, .85fr) minmax(96px, .7fr) minmax(0, 1.7fr) minmax(0, 1.7fr) 54px; gap: 12px; }
.pr-result small { color: var(--text-3); }
@media (max-width: 1180px) { .prow-head, .prow { grid-template-columns: minmax(0, 1.8fr) minmax(80px, .7fr) minmax(104px, .8fr) minmax(90px, .7fr) minmax(0, 1.5fr) minmax(0, 1.5fr); } }
@media (max-width: 760px) { .prow { grid-template-columns: minmax(0, 1fr) auto; } .pr-result { grid-column: 1 / -1; padding-top: 6px; border-top: 1px dashed var(--line); } .pr-result::before { content: "Выполнено за неделю"; font-size: 11px; color: var(--text-3); } }
.pr-title { align-items: flex-start; }
.pr-title .dot { margin-top: 6px; flex: none; }
.pr-title .t-name { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.3; }

/* ═════ v6.1 · Быстрая правка в боковой панели ═════ */
.dr-stage .qe-status { display: inline-flex; gap: 4px; flex: none; }
.qe-status button { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 10px; border-radius: 99px; border: 1px solid var(--line); background: var(--surface); color: var(--text-2); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
.qe-status button i { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.qe-status .green { color: var(--green); } .qe-status .amber { color: var(--amber); } .qe-status .red { color: var(--red-ink); }
.qe-status button[aria-pressed="false"] { color: var(--text-3); }
.qe-status button[aria-pressed="false"] i { opacity: .45; }
.qe-status .green[aria-pressed="true"] { background: color-mix(in srgb, var(--green) 12%, var(--surface)); border-color: color-mix(in srgb, var(--green) 40%, transparent); }
.qe-status .amber[aria-pressed="true"] { background: color-mix(in srgb, var(--amber) 12%, var(--surface)); border-color: color-mix(in srgb, var(--amber) 40%, transparent); }
.qe-status .red[aria-pressed="true"] { background: var(--red-soft); border-color: color-mix(in srgb, var(--red) 40%, transparent); }
.dr-facts.qe > label, .dr-facts.qe > div { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px; border-radius: 13px; border: 1px solid var(--line); min-width: 0; }
.dr-facts.qe select, .dr-facts.qe input[type="date"], .qe-row select { width: 100%; min-width: 0; height: 34px; border: 1px solid var(--line); border-radius: 9px; background-color: var(--surface-2); color: var(--text); padding: 0 10px; font: inherit; font-size: 13px; font-weight: 600; }
.dr-facts.qe select:focus, .dr-facts.qe input:focus, .qe-week textarea:focus, .qe-row select:focus { outline: none; border-color: var(--red); box-shadow: 0 0 0 3px var(--red-soft); }
.qe-cx { align-self: flex-start; }
.qe-cx button { min-width: 34px; height: 28px; padding: 0 8px; border: 0; border-radius: 8px; background: none; color: var(--text-2); font: inherit; font-size: 12.5px; font-weight: 650; cursor: pointer; }
.qe-cx button[aria-pressed="true"] { background: var(--surface); color: var(--text); box-shadow: 0 1px 3px rgba(0, 0, 0, .12); }
.qe-week textarea { width: 100%; min-height: 84px; resize: vertical; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); color: var(--text); padding: 10px 12px; font: inherit; font-size: 13.5px; line-height: 1.45; }
.qe-row { display: flex; gap: 8px; align-items: center; margin-top: 8px; }
.qe-row select { flex: 1; }
.qe-row .btn { flex: none; }
.qe-outcome { display: inline-block; margin-top: 6px; font-size: 12px; color: var(--text-3); }
.dr-add { margin: 2px 0 8px; }
.dr-foot .btn.ghost { margin-right: auto; }
.dr-foot .kbd-hint { margin-left: 0; }
@media (max-width: 520px) { .dr-stage { flex-direction: column; align-items: stretch; } .qe-status { justify-content: space-between; } .qe-status button { flex: 1; justify-content: center; } }
.dr-stage.qe-top { align-items: center; justify-content: flex-start; gap: 12px; }
.qe-label { font-size: 11px; font-weight: 600; color: var(--text-3); }
.qe-row .btn[hidden] { display: none; }
@media (max-width: 520px) { .dr-facts.qe { grid-template-columns: 1fr; } .dr-foot .kbd-hint { display: none; } .dr-foot .btn { flex: 1; justify-content: center; } }
/* Фильтры применяются сразу: внизу — счётчик и «Готово» */
.fsheet-foot { align-items: center; }
.fs-count { flex: 1; text-align: center; font-size: 13px; font-weight: 600; color: var(--text-2); }
.modal.sheet .modal-body { padding-bottom: 0; }
/* Под панелью фильтров список виден: он обновляется на лету */
.modal.sheet::backdrop { background: rgba(10, 10, 14, .14) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }

/* ═════ v7 · Таймлайн: 6 недель, группы менеджеров ═════ */
.tl-period .seg { margin-right: 6px; }
.tl-period strong { min-width: 180px; }
.tl-grid.wk { grid-template-columns: 132px repeat(var(--cols), minmax(150px, 1fr)); width: 100%; min-width: calc(132px + var(--cols) * 150px); }
.tl-grid.wk .tl-corner { border-bottom: 1px solid var(--line-strong); display: flex; align-items: flex-end; }
.tl-grid.wk .tl-week { display: flex; flex-direction: column; justify-content: flex-end; gap: 1px; padding: 10px 12px; font-size: 12.5px; font-weight: 650; color: var(--text-2); border-bottom: 1px solid var(--line-strong); }
.tl-grid.wk .tl-week small { font-size: 11px; font-weight: 600; opacity: .85; }
.tl-grid.wk .tl-week.now { background: var(--red); color: #fff; }
/* Группа — тонкая подпись и воздух сверху, без тяжёлых рамок */
.tl-group { position: sticky; left: 0; padding: 14px 14px 4px; min-height: 12px; border-bottom: 1px solid var(--line); background: linear-gradient(var(--surface), var(--surface)); }
.tl-group.first { padding-top: 10px; }
.tl-group span { position: sticky; left: 14px; font-size: 11.5px; font-weight: 650; color: var(--text-3); letter-spacing: .01em; }
.tl-group:not(.first) { border-top: 6px solid var(--surface-2); }
.tl-grid.wk .tl-pm { flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 1px; padding: 12px 14px; }
.tl-grid.wk .tl-pm strong { font-size: 14px; font-weight: 650; }
.tl-grid.wk .tl-cell { gap: 5px; padding: 7px; min-height: 64px; }
.tl-grid.wk .tl-cell.now { background: color-mix(in srgb, var(--red-soft) 45%, transparent); }
.tl-grid.wk .tl-ev { padding: 6px 8px 7px 10px; gap: 2px; border-radius: 10px; font-size: 12.5px; background: var(--surface-2); box-shadow: inset 3px 0 0 var(--text-3); }
.tl-grid.wk .tl-ev.launch { background: var(--red-soft); box-shadow: inset 3px 0 0 var(--red); }
.tl-grid.wk .tl-ev.deadline { background: var(--amber-soft); box-shadow: inset 3px 0 0 var(--amber); }
.tl-grid.wk .tl-ev.point { background: var(--surface-2); box-shadow: inset 3px 0 0 color-mix(in srgb, var(--text) 55%, transparent); }
.tl-grid.wk .tl-ev.is-past { opacity: .6; }
.tl-grid.wk .tl-ev-d { font-size: 11px; font-weight: 550; color: var(--text-3); }
.tl-grid.wk .tl-ev-d b { font-weight: 650; color: var(--text-2); text-transform: capitalize; }
.tl-grid.wk .tl-ev-n { font-weight: 650; line-height: 1.3; -webkit-line-clamp: 2; white-space: normal; }
.tl-ev-p { font-size: 11px; color: var(--text-3); width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tl-more-row { align-self: flex-start; border: 0; background: none; padding: 2px 4px; font: inherit; font-size: 12px; font-weight: 650; color: var(--red-ink); cursor: pointer; }
.tl-more-row:hover { text-decoration: underline; }
@media (max-width: 760px) { .tl-grid.wk { grid-template-columns: 92px repeat(var(--cols), minmax(150px, 1fr)); } .tl-period strong { min-width: 0; } }
.tl-period strong { text-transform: none; }
/* На широком экране 6 недель помещаются без прокрутки вбок — строка недель закреплена при прокрутке страницы */
@media (min-width: 1200px) {
  .tl-card:has(.tl-grid.wk) { overflow: visible; }
  .tl-card:has(.tl-grid.wk) .tl-scroll { overflow: visible; }
  .tl-grid.wk .tl-corner, .tl-grid.wk .tl-week { position: sticky; top: 82px; z-index: 4; }
  .tl-grid.wk .tl-corner { background: var(--surface); }
  .tl-grid.wk .tl-week:not(.now) { background: var(--surface); }
}
@media (max-width: 640px) { .tl-period { width: 100%; } .tl-period .seg { flex: 1 1 100%; margin: 0 0 4px; } .tl-period .seg button { flex: 1; } .tl-period strong { flex: 1; text-align: center; font-size: 13.5px; } }
/* Таймлайн v2.1: месяцы вернулись, блоков нет */
.tl-grid.wk { width: 100%; min-width: 0; }
.tl-grid.wk .tl-week { justify-content: center; padding: 8px 10px; font-size: 12px; border-left: 1px solid var(--line); }
.tl-grid.wk .tl-week.mstart, .tl-grid.wk .tl-cell.mstart { border-left: 2px solid var(--line-strong); }
.tl-grid.wk .tl-month { border-left: 2px solid var(--line-strong); }
.tl-grid.wk .tl-month.first { border-left-color: var(--red); }
.tl-grid.wk .tl-corner.sub { border-bottom: 1px solid var(--line-strong); }
.tl-grid.wk .tl-corner:not(.sub) { border-bottom: 0; }
.tl-grid.wk .tl-pm { padding: 10px 14px; }
.tl-grid.wk .tl-cell { min-height: 56px; padding: 6px; gap: 4px; }
.tl-grid.wk .tl-ev { padding: 5px 7px 6px 9px; }
@media (min-width: 1200px) {
  .tl-grid.wk .tl-month { position: sticky; top: 82px; z-index: 4; }
  .tl-grid.wk .tl-corner.sub, .tl-grid.wk .tl-week { top: 119px; }
}
.tl-grid.wk .tl-week { position: sticky; }
.tl-mline { position: absolute; top: 0; bottom: -1px; width: 0; border-left: 2px dashed var(--line-strong); pointer-events: none; z-index: 0; }
@media (min-width: 1200px) {
  .tl-grid.wk .tl-month, .tl-grid.wk .tl-corner:not(.sub) { top: 74px; }
  .tl-grid.wk .tl-corner.sub, .tl-grid.wk .tl-week { top: 111px; }
  .tl-grid.wk .tl-month:not(.first) { background: var(--surface-2); }
}
@media (max-width: 640px) { .tl-grid.wk { --tl-name: 86px; --tl-col: 140px; } .tl-grid.wk .tl-pm { padding: 10px; } .tl-grid.wk .tl-corner { padding: 10px; } }
/* Таймлайн: месяц на экран */
.tl-mtitle { min-width: 150px !important; text-transform: capitalize !important; font-size: 16px !important; }
.tl-grid.wk.mo .tl-week { font-size: 12.5px; }
@media (min-width: 1200px) { .tl-grid.wk.mo .tl-corner.sub, .tl-grid.wk.mo .tl-week { top: 74px; } }
.tl-grid.wk .tl-ev.slim { padding: 5px 8px 5px 10px; }
.tl-ev-day { display: inline-block; min-width: 38px; margin-right: 6px; font-size: 11px; font-weight: 650; color: var(--text-3); text-transform: capitalize; }
.tl-grid.wk .tl-ev.slim .tl-ev-n { font-size: 12.5px; }

/* ═════ v8 · Отчёты ═════ */
.rdash { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; align-items: start; }
.rd-card { padding: 18px; min-width: 0; }
.rd-card h3 { margin: 0 0 10px; font-size: 13px; font-weight: 600; color: var(--text-3); }
.rd-big { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.rd-big strong { font: 650 34px/1 var(--font-display); letter-spacing: -.02em; }
.rd-big strong small { font-size: 16px; font-weight: 600; color: var(--text-3); letter-spacing: 0; }
.rd-big span { font-size: 12.5px; color: var(--text-3); }
.rd-sub { margin: 8px 0 0; font-size: 12.5px; color: var(--text-2); }
.rd-sub b { color: var(--text); }
.rd-rows { display: flex; flex-direction: column; gap: 2px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line); }
.rd-row { display: grid; grid-template-columns: 70px minmax(0, 1fr) 40px; align-items: center; gap: 8px; padding: 3px 0; font-size: 12.5px; color: var(--text-2); }
a.rd-row { grid-template-columns: 70px minmax(0, 1fr) 40px 54px; border-radius: 6px; }
a.rd-row:hover { color: var(--red-ink); }
.rd-row > b { text-align: right; font-weight: 650; color: var(--text); font-variant-numeric: tabular-nums; }
.rd-row > b.over { color: var(--red-ink); }
.rd-row > small { font-size: 11px; color: var(--text-3); text-align: right; white-space: nowrap; }
.rb { position: relative; height: 6px; border-radius: 99px; background: var(--surface-3); }
.rb i { position: absolute; inset: 0 auto 0 0; width: var(--w); border-radius: 99px; background: var(--text-2); }
.rb i.ok { background: var(--green); }
.rb i.high { background: var(--amber); }
.rb i.over { background: var(--red); }
.rb .cap { position: absolute; top: -3px; bottom: -3px; width: 1px; background: var(--line-strong); }
.rd-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 12px; }
.rd-facts a { display: flex; flex-direction: column; gap: 2px; padding: 9px 10px; border-radius: 11px; background: var(--surface-2); border: 1px solid var(--glass-line, var(--line)); color: inherit; }
.rd-facts a:hover { border-color: var(--red); }
.rd-facts b { font-size: 20px; font-weight: 650; font-variant-numeric: tabular-nums; }
.rd-facts b small { font-size: 12px; color: var(--text-3); font-weight: 600; }
.rd-facts b.warn { color: var(--amber); }
.rd-facts span { font-size: 11.5px; color: var(--text-3); line-height: 1.25; }
.rd-list { list-style: none; margin: 10px 0 0; padding: 8px 0 0; border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; }
.rd-list li { display: flex; justify-content: space-between; gap: 8px; min-width: 0; }
.rd-list li a { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rd-list li b { color: var(--red-ink); font-weight: 650; margin-right: 4px; }
.rd-list small { color: var(--text-3); flex: none; }
@media (max-width: 1280px) { .rdash { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .rdash { grid-template-columns: 1fr; } }

/* Выводы */
.ins { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.ins li { display: grid; grid-template-columns: 10px minmax(0, 1fr); gap: 9px; align-items: baseline; font-size: 13.5px; line-height: 1.4; }
.ins li i { width: 8px; height: 8px; border-radius: 50%; background: var(--text-3); transform: translateY(-1px); }
.ins li.good i { background: var(--green); }
.ins li.warn i { background: var(--amber); }
.ins li.bad i { background: var(--red); }
.wr-team { padding: 14px 16px; margin-bottom: 12px; border-radius: 14px; background: var(--surface-2); border: 1px solid var(--glass-line, var(--line)); }
.wr-team h3, .wr-ins h4, .wr-next h4 { margin: 0 0 8px; font-size: 12px; font-weight: 600; color: var(--text-3); }

/* Отчёт менеджера */
.wr { border-top: 1px solid var(--line); }
.wr > summary { display: grid; grid-template-columns: 110px 70px minmax(80px, 160px) minmax(0, 1fr) auto 18px; align-items: center; gap: 12px; padding: 12px 4px; cursor: pointer; list-style: none; }
.wr > summary::-webkit-details-marker { display: none; }
.wr > summary:hover { background: var(--surface-2); }
.wr > summary strong { font-weight: 650; }
.wr-rate { font-weight: 650; font-variant-numeric: tabular-nums; font-size: 13px; }
.wr-rate.low { color: var(--red-ink); }
.wr-bar { height: 6px; border-radius: 99px; background: var(--surface-3); position: relative; overflow: hidden; }
.wr-bar i { position: absolute; inset: 0 auto 0 0; width: var(--w); background: var(--green); border-radius: 99px; }
.wr-bar.is-empty { opacity: .5; }
.wr-meta { font-size: 12.5px; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wr-flags { font-size: 12px; font-weight: 650; color: var(--amber); white-space: nowrap; }
.wr-flags.ok { color: var(--text-3); font-weight: 550; }
.wr-chev { width: 16px; height: 16px; color: var(--text-3); transition: transform .2s; }
.wr[open] .wr-chev { transform: rotate(180deg); }
.wr-body { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; margin: 0 0 14px; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.wr-ins { padding: 12px 14px; background: var(--surface-2); }
.wr-body .rr-body { border-top: 1px solid var(--line); }
.wr-next { padding: 10px 14px 12px; border-top: 1px solid var(--line); }
@media (max-width: 860px) {
  .wr > summary { grid-template-columns: minmax(0, 1fr) auto 18px; row-gap: 4px; }
  .wr-bar, .wr-meta { grid-column: 1 / -1; }
  .wr-flags { grid-row: 1; grid-column: 2; }
  .wr-rate { grid-row: 1; grid-column: 2; justify-self: end; display: none; }
  .wr-body .rr-body { grid-template-columns: 1fr; }
  .wr-body .rr-body > div + div { border-left: 0; border-top: 1px solid var(--line); }
}
.rdash { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr); }
a.rd-row, .rd-row { grid-template-columns: 72px minmax(0, 1fr) 46px; }
@media (max-width: 1280px) { .rdash { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .rdash { grid-template-columns: 1fr; } }
@media (max-width: 860px) {
  .wr > summary { grid-template-columns: auto minmax(0, 1fr) auto 18px; grid-template-areas: "name name flags chev" "rate bar bar bar" "meta meta meta meta"; }
  .wr > summary strong { grid-area: name; }
  .wr-flags { grid-area: flags; grid-row: auto; grid-column: auto; }
  .wr-chev { grid-area: chev; }
  .wr-rate { grid-area: rate; display: inline; grid-row: auto; grid-column: auto; justify-self: start; }
  .wr-bar { grid-area: bar; grid-column: auto; }
  .wr-meta { grid-area: meta; grid-column: auto; }
}
/* Отчёты: три плитки (блок «Проекты» убран — дублировал портфель) */
.rdash { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1.15fr) minmax(0, 1fr); }
@media (max-width: 1100px) { .rdash { grid-template-columns: repeat(2, minmax(0, 1fr)); } .rdash > :last-child { grid-column: 1 / -1; } }
@media (max-width: 640px) { .rdash { grid-template-columns: 1fr; } }
@media (min-width: 641px) and (max-width: 1100px) { .rdash > :last-child .rd-facts { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ═════ v8.1 · Недельный отчёт: главное за неделю + оценка ═════ */
.wk-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 6px; }
.wk-col { border-radius: 14px; padding: 12px 14px; min-width: 0; }
.wk-col.good { background: color-mix(in srgb, var(--green) 12%, var(--surface)); }
.wk-col.warn { background: color-mix(in srgb, var(--amber) 14%, var(--surface)); }
.wk-col.bad { background: color-mix(in srgb, var(--red) 10%, var(--surface)); }
.wk-col h3 { display: flex; align-items: center; gap: 7px; margin: 0 0 8px; font-size: 14px; font-weight: 650; }
.wk-col h3 .i { width: 16px; height: 16px; }
.wk-col h3 span { margin-left: auto; font-size: 12px; font-weight: 650; opacity: .8; }
.wk-col.good h3 { color: color-mix(in srgb, var(--green) 75%, #000); }
.wk-col.warn h3 { color: color-mix(in srgb, var(--amber) 75%, #000); }
.wk-col.bad h3 { color: var(--red-ink); }
.wk-col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 5px; }
.wk-col li { font-size: 13px; line-height: 1.4; color: var(--text); }
.wk-col li b { font-weight: 650; }
.wk-col li a { text-decoration: underline; text-decoration-color: color-mix(in srgb, currentColor 30%, transparent); }
.wk-col li.more { color: var(--text-3); font-size: 12px; }
.wk-col p { margin: 0; font-size: 12.5px; color: var(--text-3); }
:root[data-theme="dark"] .wk-col.good h3 { color: var(--green); } :root[data-theme="dark"] .wk-col.warn h3 { color: var(--amber); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .wk-col.good h3 { color: var(--green); } :root:not([data-theme="light"]) .wk-col.warn h3 { color: var(--amber); } }

.score { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.score-row { display: grid; grid-template-columns: minmax(90px, 1.1fr) repeat(4, minmax(0, 1fr)) 70px; gap: 10px; align-items: center; width: 100%; padding: 8px 14px; border: 0; border-top: 1px solid var(--line); background: none; color: inherit; font: inherit; text-align: left; }
.score-row.head { border-top: 0; background: var(--surface-2); font-size: 12px; font-weight: 600; color: var(--text-3); padding-top: 9px; padding-bottom: 9px; }
button.score-row { cursor: pointer; }
button.score-row:hover { background: var(--surface-2); }
.sc-name { font-weight: 650; }
.sc { justify-self: start; display: inline-flex; align-items: center; gap: 2px; min-width: 64px; padding: 4px 9px; border-radius: 8px; font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; }
.sc small { font-size: 11px; font-weight: 550; opacity: .85; }
.sc.good { background: color-mix(in srgb, var(--green) 14%, var(--surface)); color: color-mix(in srgb, var(--green) 75%, #000); }
.sc.warn { background: color-mix(in srgb, var(--amber) 16%, var(--surface)); color: color-mix(in srgb, var(--amber) 70%, #000); }
.sc.bad { background: color-mix(in srgb, var(--red) 12%, var(--surface)); color: var(--red-ink); }
.sc.muted { color: var(--text-3); font-weight: 550; }
.sc.ok-mark { color: var(--green); min-width: 0; padding: 4px 0; }
.sc.ok-mark .i { width: 17px; height: 17px; stroke-width: 2.4; }
.sc.bad-mark { color: var(--red-ink); min-width: 0; padding: 4px 0; font-weight: 700; }
:root[data-theme="dark"] .sc.good { color: var(--green); } :root[data-theme="dark"] .sc.warn { color: var(--amber); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .sc.good { color: var(--green); } :root:not([data-theme="light"]) .sc.warn { color: var(--amber); } }
.rep-lists .rr-body { border: 1px solid var(--line); border-radius: 12px; margin-top: 4px; }
@media (max-width: 900px) { .wk-cols { grid-template-columns: 1fr; } }
@media (max-width: 760px) {
  .score { overflow-x: auto; }
  .score-row { grid-template-columns: 84px repeat(4, 76px) 44px; min-width: 470px; padding: 8px 10px; }
  .sc { min-width: 0; }
}
.rep-lists .rr-body { grid-template-columns: 1fr; }
.rep-lists .rr-body > div + div { border-left: 0; border-top: 1px solid var(--line); }
.rep-lists .rl-title { flex: 1 1 auto; white-space: normal; }
.rep-lists .rl-proj { flex: 0 1 auto; max-width: 40%; }

/* ═════ v8.2 · Работа недели — дорожки ═════ */
.lanes { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.lane { display: grid; grid-template-columns: 150px minmax(0, 1fr); border-top: 1px solid var(--line); }
.lane:first-child { border-top: 0; }
.lane-who { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; padding: 10px 14px; border: 0; border-right: 1px solid var(--line); background: var(--surface-2); color: inherit; font: inherit; text-align: left; cursor: pointer; }
.lane-who:hover strong { color: var(--red-ink); }
.lane-who strong { font-weight: 650; }
.lane-who small { font-size: 11.5px; color: var(--text-3); }
.lane-dir { display: flex; gap: 2px; width: 100%; height: 5px; border-radius: 99px; overflow: hidden; }
.lane-dir .dobro { background: var(--red); }
.lane-dir .fon { background: color-mix(in srgb, var(--text) 75%, transparent); }
.lane-tiles { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px; min-width: 0; align-content: flex-start; }
.lt { flex: 1 1 150px; min-width: 150px; max-width: 100%; display: flex; flex-direction: column; gap: 2px; padding: 7px 10px 8px; border-radius: 10px; border: 1px solid transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; min-height: 52px; }
.lt.dobro { background: color-mix(in srgb, var(--red) 8%, var(--surface)); border-color: color-mix(in srgb, var(--red) 22%, transparent); }
.lt.fon { background: var(--surface-2); border-color: var(--line); }
.lt.none { background: none; border: 1px dashed var(--line-strong); }
.lt.more { flex: 0 0 auto; min-width: 0; justify-content: center; background: none; border: 1px dashed var(--line-strong); color: var(--text-2); font-size: 12.5px; font-weight: 600; }
.lt:hover { border-color: var(--red); }
.lt-name { display: flex; align-items: center; gap: 6px; font-weight: 650; font-size: 13px; line-height: 1.3; }
.lt.dobro .lt-name { color: var(--red-ink); }
.lt-name .geo-tag { height: 17px; font-size: 10px; padding: 0 5px; }
.lt-sub { font-size: 11.5px; color: var(--text-3); }
.lt-res { font-size: 12px; color: var(--text-2); line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.lt-bar { position: relative; height: 4px; margin-top: auto; padding-top: 0; border-radius: 99px; background: color-mix(in srgb, var(--text) 9%, transparent); }
.lt-bar i { position: absolute; inset: 0 auto 0 0; width: var(--w); border-radius: 99px; background: var(--text-2); }
.lt.dobro .lt-bar i { background: var(--red); }
.lt.all-done .lt-bar i { background: var(--green); }
.lt-sub + .lt-bar, .lt-res + .lt-bar { margin-top: 5px; }
.lane-empty { padding: 8px 4px; font-size: 12.5px; color: var(--text-3); }
.lanes-note { margin: 8px 0 4px; font-size: 12px; }
@media (max-width: 760px) {
  .lane { grid-template-columns: 1fr; }
  .lane-who { border-right: 0; border-bottom: 1px solid var(--line); flex-direction: row; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
  .lane-dir { width: 80px; }
  .lt { min-width: 130px; }
}
.lt-name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.lt-name .geo-tag { margin-left: 4px; vertical-align: 1px; }
@media (max-width: 760px) {
  .lane-tiles { flex-wrap: nowrap; overflow-x: auto; scroll-snap-type: x proximity; padding-bottom: 10px; }
  .lt { flex: 0 0 210px; min-width: 0; scroll-snap-align: start; }
  .lt.more { flex: 0 0 auto; }
}

/* ═════ v9 · Профиль менеджера ═════ */
.pf-link { border: 0; background: none; padding: 0; font: inherit; color: inherit; cursor: pointer; text-align: left; }
.pf-link:hover { color: var(--red-ink); text-decoration: underline; text-underline-offset: 2px; }
.pf-head h2 { margin-top: 4px; }
.pf-pos { margin: 2px 0 0; font-size: 13px; color: var(--text-2); }
.pf-pos.missing { color: var(--text-3); }
.pf-here { color: var(--green); font-weight: 600; }
.pf-away { color: var(--amber); font-weight: 650; }
.dr-facts strong.over { color: var(--red-ink); }
.pf-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.pf-tag { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 8px; background: var(--surface); border: 1px solid var(--line); font-size: 12.5px; font-weight: 600; color: var(--text-2); }
.pf-tag.auto { background: var(--surface-3); color: var(--text); }
.pf-tag.auto.dobro { background: color-mix(in srgb, var(--red) 10%, var(--surface)); border-color: color-mix(in srgb, var(--red) 25%, transparent); color: var(--red-ink); }
.pf-tag.by { color: var(--red-ink); }
.pf-tag.link:hover { border-color: var(--red); color: var(--red-ink); }
.pf-hint { display: block; margin-top: 6px; font-size: 11.5px; color: var(--text-3); }
.pf-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.pf-list li { display: flex; align-items: center; gap: 7px; padding: 5px 0; border-top: 1px solid var(--line); font-size: 13px; min-width: 0; }
.pf-list li:first-child { border-top: 0; }
.pf-list li a { font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pf-list li a:hover { color: var(--red-ink); }
.pf-list li small { margin-left: auto; flex: none; font-size: 11.5px; color: var(--text-3); }
.pf-list li .geo-tag { height: 17px; font-size: 10px; padding: 0 5px; flex: none; }
.pf-disc { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.pf-disc > div { display: flex; flex-direction: column; padding: 8px 10px; border-radius: 10px; background: var(--surface); border: 1px solid var(--line); }
.pf-disc b { font-size: 17px; font-weight: 650; font-variant-numeric: tabular-nums; }
.pf-disc small { font-size: 11.5px; color: var(--text-3); }
.pf-abs { list-style: none; margin: 0 0 6px; padding: 0; display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.pf-abs b { font-weight: 650; margin-right: 4px; }
.pf-abs .link-btn { margin-left: 6px; font-size: 12px; }
.dr-body .spark.small { height: 70px; }

.dr-body .spark.small { grid-template-rows: minmax(0, 1fr); height: 84px; }
.dr-body .spark.small span b { font-size: 10.5px; }
@media (max-width: 520px) { .dr-foot { flex-wrap: wrap; } .dr-foot .btn { flex: 1 1 140px; min-width: 0; padding-inline: 12px; } }

/* ═════ v10 · План работ — диаграмма Ганта ═════ */
.tab-dot { display: inline-block; width: 6px; height: 6px; margin-left: 4px; border-radius: 50%; background: var(--red); vertical-align: 2px; }
.plan-empty-box { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 26px 16px 18px; text-align: center; color: var(--text-3); }
.plan-empty-box .i { width: 28px; height: 28px; }
.plan-empty-box h3 { margin: 4px 0 0; font-size: 16px; color: var(--text); }
.plan-empty-box p { margin: 0; max-width: 460px; font-size: 13px; }
.plan-start { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; padding-bottom: 8px; }
.plan-card .card-head b.warn { color: var(--red-ink); font-weight: 650; }
.gt-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin: -4px 0 12px; font-size: 12px; color: var(--text-2); }
.gt-legend span { display: inline-flex; align-items: center; gap: 6px; }
.gt-legend .gt-hint { margin-left: auto; color: var(--text-3); }
.lg-over { width: 14px; height: 9px; border-radius: 3px; border: 2px solid var(--red); }
.lg-ms { width: 9px; height: 9px; transform: rotate(45deg); background: var(--text); }
.lg-launch { width: 2px; height: 12px; background: var(--red); }

.gt-scroll { overflow-x: auto; border: 1px solid var(--line); border-radius: 14px; }
.gt { --name: 260px; display: flex; flex-direction: column; min-width: max-content; }
.gt-row { display: flex; align-items: stretch; border-top: 1px solid var(--line); }
.gt-row:first-child { border-top: 0; }
.gt-name { position: sticky; left: 0; z-index: 3; flex: 0 0 var(--name); width: var(--name); display: flex; align-items: center; gap: 8px; padding: 6px 10px; background: var(--surface); border-right: 1px solid var(--line); min-width: 0; }
.gt-track { position: relative; flex: none; min-height: 34px; background-image: repeating-linear-gradient(90deg, transparent 0, transparent calc(var(--dw) * 7 - 1px), var(--line) calc(var(--dw) * 7 - 1px), var(--line) calc(var(--dw) * 7)); }
.gt-row.head .gt-name, .gt-row.head .gt-track { background-color: var(--surface-2); }
.gt-row.head .gt-track { min-height: 28px; background-image: none; }
.gt-months span, .gt-weeks span { position: absolute; top: 0; bottom: 0; display: flex; align-items: center; padding: 0 8px; font-size: 12px; white-space: nowrap; overflow: hidden; border-left: 1px solid var(--line); }
.gt-months span { font-weight: 650; text-transform: capitalize; color: var(--text); }
.gt-weeks span { font-size: 11.5px; color: var(--text-3); font-weight: 600; padding: 0 6px; }
.gt-row.head.wk .gt-name small, .gt-row.ms .gt-name small { font-size: 11.5px; color: var(--text-3); font-weight: 600; }
.gt-row.ms .gt-track { min-height: 26px; }
.gt-ms { position: absolute; top: 50%; width: 11px; height: 11px; margin: -6px 0 0 -6px; transform: rotate(45deg); background: var(--text); border-radius: 2px; cursor: default; z-index: 2; }
.gt-ms.past { background: var(--text-3); }
.gt-line { position: absolute; top: 0; bottom: 0; width: 0; z-index: 1; pointer-events: none; }
.gt-line.today { border-left: 2px solid color-mix(in srgb, var(--red) 55%, transparent); }
.gt-line.launch { border-left: 2px dashed var(--red); }
.gt-row.stage .gt-name { background: var(--surface-2); }
.gt-row.stage .gt-name strong { font-weight: 650; font-size: 13.5px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gt-row.stage .gt-name small { flex: none; font-size: 11.5px; color: var(--text-3); }
.gt-acts { margin-left: auto; display: inline-flex; gap: 0; flex: none; }
.icon-btn.xs { width: 24px; height: 24px; border-radius: 7px; }
.icon-btn.xs .i { width: 13px; height: 13px; }
.icon-btn.xs .i.up { transform: rotate(90deg); } .icon-btn.xs .i.down { transform: rotate(-90deg); }
.icon-btn.xs[disabled] { opacity: .3; }
.gt-row.stage .gt-track { background-color: color-mix(in srgb, var(--surface-2) 60%, transparent); }
.gt-span { position: absolute; top: 50%; height: 8px; margin-top: -4px; border-radius: 99px; background: color-mix(in srgb, var(--text) 18%, transparent); overflow: hidden; }
.gt-span i { display: block; height: 100%; background: var(--green); }
.gt-row.item .gt-name { padding-left: 18px; }
.gt-st { flex: none; width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--line-strong); background: var(--surface); padding: 0; display: inline-block; }
button.gt-st { cursor: pointer; }
.gt-st.doing { border-color: var(--red); background: conic-gradient(var(--red) 0 50%, var(--surface) 0); }
.gt-st.done { border-color: var(--green); background: var(--green); }
.gt-iname { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; border: 0; background: none; padding: 0; font: inherit; color: inherit; text-align: left; cursor: pointer; }
.gt-iname[disabled] { cursor: default; }
.gt-iname span { font-size: 13px; font-weight: 600; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gt-iname small { font-size: 11px; color: var(--text-3); white-space: nowrap; }
.gt-iname:not([disabled]):hover span { color: var(--red-ink); }
.gt-bar { position: absolute; top: 6px; bottom: 6px; z-index: 2; display: flex; align-items: center; min-width: 6px; border-radius: 7px; background: color-mix(in srgb, var(--text) 14%, var(--surface)); border: 1px solid color-mix(in srgb, var(--text) 22%, transparent); font-size: 11.5px; font-weight: 600; color: var(--text); overflow: hidden; user-select: none; touch-action: none; }
.gt-bar span { padding: 0 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; pointer-events: none; }
.gt-bar.doing { background: color-mix(in srgb, var(--red) 16%, var(--surface)); border-color: color-mix(in srgb, var(--red) 45%, transparent); color: var(--red-ink); }
.gt-bar.done { background: color-mix(in srgb, var(--green) 20%, var(--surface)); border-color: color-mix(in srgb, var(--green) 45%, transparent); color: color-mix(in srgb, var(--green) 70%, #000); }
.gt-bar.over { border: 2px solid var(--red); }
.gt-bar.editable { cursor: grab; }
.gt-bar.dragging { cursor: grabbing; box-shadow: 0 4px 14px rgba(0, 0, 0, .18); z-index: 5; }
.gt-bar.dragging::after { content: attr(data-tip); position: absolute; left: 4px; top: -24px; padding: 2px 6px; border-radius: 6px; background: var(--text); color: var(--surface); font-size: 11px; white-space: nowrap; }
.gt-bar.dragging { overflow: visible; }
.gt-h { position: absolute; top: 0; bottom: 0; width: 8px; cursor: ew-resize; z-index: 1; }
.gt-h.l { left: 0; } .gt-h.r { right: 0; }
.gt-bar.editable:hover .gt-h { background: color-mix(in srgb, currentColor 18%, transparent); }
.gt-row.add .gt-name { padding: 2px 10px 2px 14px; }
.gt-row.add .gt-track { min-height: 30px; }
.gt-row.add .link-btn { font-size: 12.5px; padding: 4px 6px; }
.gt-add { position: sticky; left: 0; display: flex; align-items: center; gap: 6px; padding: 6px 10px; background: var(--surface); width: min(760px, 100%); flex-wrap: wrap; }
.gt-add input, .gt-add select { height: 32px; border: 1px solid var(--line); border-radius: 9px; background-color: var(--surface-2); color: var(--text); padding: 0 8px; font: inherit; font-size: 13px; }
.gt-add input[name="name"] { flex: 1 1 200px; min-width: 160px; }
.gt-add input:focus, .gt-add select:focus { outline: none; border-color: var(--red); box-shadow: 0 0 0 3px var(--red-soft); }
@media (max-width: 760px) { .gt { --name: 150px; } .gt-legend .gt-hint { display: none; } .gt-iname small { display: none; } }
.gt-months span { overflow: visible; }
.gt-months span b { position: sticky; left: calc(var(--name) + 8px); font-weight: 650; }
@media (max-width: 760px) { .gt-acts .icon-btn:not(:last-child) { display: none; } .gt-row.stage .gt-name small { display: none; } .gt-name { padding: 6px 8px; } .gt-row.item .gt-name { padding-left: 10px; } }

/* ═════ v11 · Отчёты: вкладки, бренды, региональные спецпроекты ═════ */
.rp-tabs { margin: -4px 0 16px; }
.br-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; align-items: start; }
.br-card { padding: 18px; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.br-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.br-name { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 8px; background: var(--black); color: #fff; font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.br-card.dobro .br-name { background: var(--red); }
.br-share { font-size: 12.5px; color: var(--text-3); }
.br-stage { display: flex; gap: 2px; height: 8px; border-radius: 99px; overflow: hidden; }
.br-stage i { min-width: 4px; }
.br-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.br-fact { display: flex; flex-direction: column; gap: 2px; padding: 9px 10px; border-radius: 11px; background: var(--surface-2); border: 1px solid var(--glass-line, var(--line)); min-width: 0; }
.br-fact b { font-size: 19px; font-weight: 650; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.br-fact b small { font-size: 12px; color: var(--text-3); font-weight: 600; }
.br-fact span { font-size: 11.5px; color: var(--text-3); line-height: 1.25; }
.br-block { padding-top: 10px; border-top: 1px solid var(--line); }
.br-block h4 { margin: 0 0 6px; font-size: 12px; font-weight: 600; color: var(--text-3); }
.br-risk, .br-ev { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.br-risk li, .br-ev li { display: flex; align-items: center; gap: 8px; min-width: 0; }
.br-risk li a, .br-ev li a { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.br-risk li small, .br-ev li small { margin-left: auto; flex: none; color: var(--text-3); font-size: 12px; }
.br-risk li i { width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--amber); }
.br-risk li.bad i { background: var(--red); }
.br-risk li.more { color: var(--text-3); font-size: 12px; }
.br-ev li b { flex: none; width: 40px; font-weight: 650; color: var(--red-ink); font-variant-numeric: tabular-nums; }
.br-note { margin: 8px 0 0; font-size: 12px; color: var(--text-3); }
.br-note b { color: var(--text); }
.br-people { display: flex; flex-wrap: wrap; gap: 6px; padding-top: 10px; border-top: 1px solid var(--line); }
.br-people a { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 10px; border-radius: 99px; background: var(--surface-2); border: 1px solid var(--line); font-size: 12.5px; font-weight: 600; color: var(--text-2); }
.br-people a b { font-weight: 700; color: var(--text); }
.br-people a:hover { border-color: var(--red); color: var(--red-ink); }
.br-team { padding: 18px; margin-bottom: 16px; }
.bt { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.bt-row { display: grid; grid-template-columns: minmax(100px, 1fr) 90px 90px minmax(160px, 2fr) 80px; gap: 12px; align-items: center; padding: 9px 14px; border-top: 1px solid var(--line); font-size: 13px; font-variant-numeric: tabular-nums; }
.bt-row.head { border-top: 0; background: var(--surface-2); font-size: 12px; font-weight: 600; color: var(--text-3); }
.bt-row .over { color: var(--red-ink); font-weight: 650; }
.bt-bar { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.bt-bar .lane-dir { height: 8px; }
.bt-bar small { font-size: 11.5px; color: var(--text-3); }
@media (max-width: 960px) { .br-grid { grid-template-columns: 1fr; } }
@media (max-width: 640px) {
  .br-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bt-row { grid-template-columns: minmax(0, 1fr) 62px 70px; }
  .bt-row > :nth-child(4), .bt-row > :nth-child(5) { display: none; }
}

.rg-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; padding: 16px 18px; margin-bottom: 16px; }
.rg-who { display: flex; gap: 8px; flex-wrap: wrap; }
.rg-who .pf-link { display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 14px; border-radius: 99px; background: var(--surface-2); border: 1px solid var(--line); font-weight: 650; font-size: 14px; }
.rg-nums { display: flex; gap: 22px; flex-wrap: wrap; }
.rg-nums div { display: flex; flex-direction: column; gap: 2px; }
.rg-nums b { font: 650 24px/1 var(--font-display); font-variant-numeric: tabular-nums; }
.rg-nums b small { font-size: 14px; color: var(--text-3); font-weight: 600; }
.rg-nums span { font-size: 11.5px; color: var(--text-3); }
.rg-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); gap: 16px; margin-bottom: 16px; align-items: start; }
.rg-projects, .rg-events { padding: 18px; min-width: 0; }
.rg-table { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.rg-row { display: grid; grid-template-columns: 10px minmax(0, 2.2fr) minmax(90px, 1fr) minmax(100px, 1fr) 100px 92px; gap: 10px; align-items: center; padding: 8px 12px; border-top: 1px solid var(--line); font-size: 13px; }
.rg-row.head { border-top: 0; background: var(--surface-2); font-size: 12px; font-weight: 600; color: var(--text-3); }
.rg-row > span { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.rg-row small { font-size: 11.5px; color: var(--text-3); }
.rg-name a { font-weight: 650; }
.rg-name .geo-tag { align-self: flex-start; }
.rg-row .ok { color: var(--text-3); font-size: 12px; }
.rg-row .warn { color: var(--amber); font-size: 12px; font-weight: 650; }
.rg-ev { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.rg-ev li { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 8px; font-size: 13px; }
.rg-ev li b { font-weight: 650; color: var(--red-ink); font-variant-numeric: tabular-nums; }
.rg-ev li span { display: flex; flex-direction: column; min-width: 0; }
.rg-ev li small { font-size: 11.5px; color: var(--text-3); }
@media (max-width: 1100px) { .rg-grid { grid-template-columns: 1fr; } }
@media (max-width: 760px) {
  .rg-row { grid-template-columns: 10px minmax(0, 1fr) 84px; }
  .rg-row > :nth-child(4), .rg-row > :nth-child(5), .rg-row > :nth-child(6) { display: none; }
}

/* ═════ v11 · Празднование выполненной задачи ═════ */
.tcheck.pop { animation: cel-pop .42s cubic-bezier(.3, 1.6, .5, 1); }
@keyframes cel-pop { 0% { transform: scale(.7); } 55% { transform: scale(1.28); } 100% { transform: scale(1); } }
.cel-burst { position: fixed; z-index: 120; width: 0; height: 0; pointer-events: none; }
.cel-ring { position: absolute; left: -16px; top: -16px; width: 32px; height: 32px; border-radius: 50%; border: 3px solid var(--red); animation: cel-ring .55s ease-out forwards; }
@keyframes cel-ring { from { transform: scale(.4); opacity: 1; } to { transform: scale(2.1); opacity: 0; border-width: 1px; } }
.cel-p { position: absolute; left: -3.5px; top: -3.5px; width: 7px; height: 7px; border-radius: 50%; background: var(--c); animation: cel-p .75s cubic-bezier(.15, .7, .3, 1) forwards; }
.cel-p.sq { border-radius: 2px; width: 6px; height: 9px; }
@keyframes cel-p { 0% { transform: translate(0, 0) rotate(0) scale(.6); opacity: 1; } 70% { opacity: 1; } 100% { transform: translate(var(--dx), calc(var(--dy) + 14px)) rotate(var(--r)) scale(1); opacity: 0; } }

.cel-fly { position: fixed; z-index: 121; left: 0; top: 0; width: 96px; height: 96px; pointer-events: none; filter: drop-shadow(0 12px 16px rgba(0, 0, 0, .18)); }
.cel-fly svg { width: 100%; height: 100%; display: block; overflow: visible; }
.cel-fly.mascot { animation: cel-glide 2.4s cubic-bezier(.35, .1, .4, 1) forwards; }
.cel-fly.mascot .cel-body { animation: cel-bob .4s ease-in-out infinite alternate; }
.cel-fly .wing { transform-box: fill-box; animation: cel-flap .16s ease-in-out infinite alternate; }
.cel-fly .wing.l { transform-origin: 100% 60%; }
.cel-fly .wing.r { transform-origin: 0 60%; animation-direction: alternate-reverse; }
@keyframes cel-glide { 0% { transform: translate(-120px, 72vh) rotate(-8deg); } 30% { transform: translate(28vw, 46vh) rotate(4deg); } 55% { transform: translate(52vw, 58vh) rotate(-4deg); } 80% { transform: translate(78vw, 34vh) rotate(6deg); } 100% { transform: translate(calc(100vw + 120px), 22vh) rotate(0); } }
@keyframes cel-bob { from { transform: translateY(-6px); } to { transform: translateY(6px); } }
@keyframes cel-flap { from { transform: rotate(-24deg); } to { transform: rotate(18deg); } }
.cel-fly.rocket { width: 84px; height: 84px; animation: cel-rocket 1.6s cubic-bezier(.5, 0, .75, .6) forwards; }
.cel-fly .flame { transform-box: fill-box; transform-origin: 50% 0; animation: cel-flame .08s linear infinite alternate; }
@keyframes cel-rocket { 0% { transform: translate(-100px, 105vh); } 100% { transform: translate(calc(100vw + 80px), -140px); } }
@keyframes cel-flame { from { transform: scaleY(.7); } to { transform: scaleY(1.25); } }
.cel-fly.ball { width: 64px; height: 64px; animation: cel-ball-x 2.2s linear forwards; }
.cel-fly.ball .cel-body { animation: cel-ball-y 2.2s linear forwards; }
.cel-fly.ball svg { animation: cel-spin .6s linear infinite; }
@keyframes cel-ball-x { from { transform: translateX(-80px); } to { transform: translateX(calc(100vw + 80px)); } }
@keyframes cel-ball-y {
  0% { transform: translateY(40vh); animation-timing-function: cubic-bezier(.4, 0, 1, 1); }
  22% { transform: translateY(calc(100vh - 80px)); animation-timing-function: cubic-bezier(0, 0, .6, 1); }
  44% { transform: translateY(55vh); animation-timing-function: cubic-bezier(.4, 0, 1, 1); }
  64% { transform: translateY(calc(100vh - 80px)); animation-timing-function: cubic-bezier(0, 0, .6, 1); }
  82% { transform: translateY(70vh); animation-timing-function: cubic-bezier(.4, 0, 1, 1); }
  100% { transform: translateY(calc(100vh - 80px)); }
}
@keyframes cel-spin { to { transform: rotate(360deg); } }
.cel-party { position: fixed; inset: 0; z-index: 119; pointer-events: none; overflow: hidden; }
.cel-party > i { position: absolute; top: -20px; width: 8px; height: 8px; border-radius: 50%; background: var(--c); animation: cel-fall var(--t) cubic-bezier(.3, .4, .6, 1) var(--d) forwards; opacity: 0; }
.cel-party > i.sq { width: 7px; height: 11px; border-radius: 2px; }
@keyframes cel-fall { 0% { transform: translate(0, 0) rotate(0); opacity: 1; } 85% { opacity: 1; } 100% { transform: translate(var(--x), 105vh) rotate(var(--r)); opacity: 0; } }
.cel-msg { position: absolute; left: 50%; top: 38%; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 18px 28px; border-radius: 22px; background: var(--surface); box-shadow: var(--shadow-lg); border: 1px solid var(--line); transform: translate(-50%, -50%); animation: cel-msg 3.2s cubic-bezier(.3, 1.4, .5, 1) forwards; }
.cel-msg strong { font: 700 26px/1.1 var(--font-display); letter-spacing: -.02em; }
.cel-msg span { font-size: 14px; color: var(--text-3); }
@keyframes cel-msg { 0% { transform: translate(-50%, -50%) scale(.6); opacity: 0; } 12% { transform: translate(-50%, -50%) scale(1); opacity: 1; } 80% { transform: translate(-50%, -50%) scale(1); opacity: 1; } 100% { transform: translate(-50%, -56%) scale(.96); opacity: 0; } }
.pf-cel { display: flex; align-items: center; gap: 12px; }
.pf-cel small { font-size: 12px; color: var(--text-3); line-height: 1.35; }
.cel-switch { flex: none; position: relative; width: 40px; height: 24px; border-radius: 99px; border: 0; padding: 0; background: var(--line-strong); cursor: pointer; transition: background .2s; }
.cel-switch i { position: absolute; left: 3px; top: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .25); transition: transform .2s; }
.cel-switch[aria-checked="true"] { background: var(--red); }
.cel-switch[aria-checked="true"] i { transform: translateX(16px); }
@media (max-width: 640px) {
  .rp-tabs { display: flex; max-width: 100%; overflow-x: auto; scrollbar-width: none; }
  .rp-tabs::-webkit-scrollbar { display: none; }
  .rp-tabs .seg-a { flex: none; }
}

/* ═════ v11.1 · Персонаж ДоброFON в празднованиях ═════ */
.cel-fly.panda { width: 170px; height: auto; animation: cel-glide 2.6s cubic-bezier(.35, .1, .4, 1) forwards; }
.cel-fly.panda .cel-body { animation: cel-bob .45s ease-in-out infinite alternate; }
.cel-fly.panda img { display: block; width: 100%; height: auto; }
.cel-panda { position: absolute; left: 50%; bottom: -12px; height: min(42vh, 300px); width: auto; transform-origin: 50% 100%; filter: drop-shadow(0 18px 30px rgba(0, 0, 0, .22)); animation: cel-panda 3.9s cubic-bezier(.3, 1.5, .5, 1) forwards; }
@keyframes cel-panda {
  0% { transform: translate(-50%, 105%) rotate(-6deg); }
  14% { transform: translate(-50%, 0) rotate(3deg); }
  22% { transform: translate(-50%, 0) rotate(-2deg) scaleY(.97); }
  30% { transform: translate(-50%, 0) rotate(0) scaleY(1); }
  50% { transform: translate(-50%, -14px) rotate(2deg); }
  66% { transform: translate(-50%, 0) rotate(-1deg); }
  84% { transform: translate(-50%, 0) rotate(0); animation-timing-function: cubic-bezier(.5, 0, .9, .5); }
  100% { transform: translate(-50%, 110%) rotate(4deg); }
}
.cel-party .cel-msg { top: auto; bottom: calc(min(42vh, 300px) + 28px); transform: translate(-50%, 0); animation-name: cel-msg-b; }
@keyframes cel-msg-b { 0% { transform: translate(-50%, 20px) scale(.6); opacity: 0; } 14% { transform: translate(-50%, 0) scale(1); opacity: 1; } 80% { transform: translate(-50%, 0) scale(1); opacity: 1; } 100% { transform: translate(-50%, -10px) scale(.96); opacity: 0; } }

/* Подсказка «Отменить» остаётся поверх празднования */
.toast { z-index: 130; }

/* ═════ v12 · Уведомления о новых задачах ═════ */
.lead-block { margin: 0 0 12px; border-radius: 14px; border: 1px solid color-mix(in srgb, var(--red) 28%, var(--line)); background: color-mix(in srgb, var(--red) 5%, var(--surface)); overflow: hidden; }
.lb-head { display: flex; align-items: center; gap: 8px; padding: 9px 14px; font-size: 13px; color: var(--red-ink); border-bottom: 1px solid color-mix(in srgb, var(--red) 18%, var(--line)); }
.lb-head .i { width: 16px; height: 16px; }
.lb-head strong { font-weight: 700; }
.lb-n { font-size: 12px; font-weight: 650; color: var(--text-3); }
.lb-head .badge-new { margin-left: auto; }
.lead-block .tlist { background: var(--surface); }
.lead-block .task { border-radius: 0; }
.lead-block .task + .task { border-top: 1px solid var(--line); }
.ntf { position: fixed; z-index: 70; top: 88px; right: 20px; width: min(380px, calc(100vw - 32px)); display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; gap: 12px; align-items: start; padding: 14px 12px 14px 14px; border-radius: 18px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-lg); opacity: 0; transform: translateY(-12px) scale(.98); pointer-events: none; transition: opacity .2s, transform .3s var(--ease); }
.ntf.show { opacity: 1; transform: none; pointer-events: auto; }
.ntf-ico { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; background: var(--red); color: #fff; }
.ntf-ico .i { width: 19px; height: 19px; }
.ntf-body strong { display: block; font-size: 14px; font-weight: 700; margin: 1px 0 4px; }
.ntf-body p { margin: 0 0 2px; font-size: 13.5px; line-height: 1.35; color: var(--text); }
.ntf-body small { display: block; font-size: 12px; color: var(--text-3); margin-top: 2px; }
.ntf-actions { display: flex; gap: 8px; margin-top: 10px; }
.task.ntf-flash { animation: ntf-flash 1.8s ease-out; }
@keyframes ntf-flash { 0%, 30% { background: color-mix(in srgb, var(--red) 14%, var(--surface)); box-shadow: inset 0 0 0 2px var(--red); } 100% { background: transparent; box-shadow: inset 0 0 0 2px transparent; } }
@media (max-width: 640px) { .ntf { top: auto; bottom: 84px; right: 16px; } }

/* ═════ v13 · Отчёты → Регионы · HoReCa (снимок рабочей таблицы) ═════ */
.hc-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 16px 18px; margin-bottom: 12px; }
.hc-head h2 { margin: 0; font: 650 19px/1.2 var(--font-display); letter-spacing: -.01em; }
.hc-head p { margin: 4px 0 0; font-size: 13px; color: var(--text-3); }
.hc-src { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.hc-snap { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--text-3); }
.hc-snap .i { width: 14px; height: 14px; }
.hc-signal { display: flex; align-items: flex-start; gap: 10px; padding: 12px 16px; margin-bottom: 16px; border-radius: 14px; background: color-mix(in srgb, var(--amber) 14%, var(--surface)); border: 1px solid color-mix(in srgb, var(--amber) 35%, var(--line)); }
.hc-signal .i { flex: none; width: 18px; height: 18px; color: color-mix(in srgb, var(--amber) 75%, #000); margin-top: 1px; }
.hc-signal p { margin: 0; font-size: 13.5px; line-height: 1.45; font-weight: 550; }
.hc-cards { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.hc-card { padding: 14px 16px; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.hc-card span { font-size: 12px; font-weight: 600; color: var(--text-3); }
.hc-card strong { font: 650 26px/1.1 var(--font-display); letter-spacing: -.02em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.hc-card small { font-size: 12px; color: var(--text-3); line-height: 1.3; }
.hc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; align-items: start; }
.hc-sec { padding: 18px; min-width: 0; }
.hc-bar { padding: 12px 14px; border-radius: 14px; background: var(--surface-2); border: 1px solid var(--glass-line, var(--line)); margin-bottom: 12px; }
.hc-bar-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; font-size: 13px; font-weight: 650; }
.hc-verdict { padding: 3px 9px; border-radius: 99px; font-size: 12px; font-weight: 700; background: var(--surface-3); color: var(--text-2); }
.hc-verdict.warn { background: color-mix(in srgb, var(--amber) 18%, var(--surface)); color: color-mix(in srgb, var(--amber) 70%, #000); }
.hc-verdict.good { background: color-mix(in srgb, var(--green) 16%, var(--surface)); color: color-mix(in srgb, var(--green) 72%, #000); }
.hc-track { position: relative; display: flex; gap: 2px; height: 16px; border-radius: 6px; margin: 18px 0 10px; }
.hc-track i { min-width: 3px; }
.hc-track i:first-child { border-radius: 6px 0 0 6px; } .hc-track i:last-of-type { border-radius: 0 6px 6px 0; }
.hc-bar .s0 { background: var(--red); }
.hc-bar .s1 { background: color-mix(in srgb, var(--red) 55%, var(--surface)); }
.hc-bar .s2 { background: color-mix(in srgb, var(--red) 25%, var(--surface)); }
.hc-bar .s3 { background: repeating-linear-gradient(135deg, var(--surface-3) 0 5px, color-mix(in srgb, var(--text-3) 30%, var(--surface-3)) 5px 7px); }
.hc-marker { position: absolute; top: -6px; bottom: -6px; width: 2px; margin-left: -1px; background: var(--text); border-radius: 2px; }
.hc-marker em { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); margin-bottom: 3px; font-size: 10.5px; font-style: normal; font-weight: 650; color: var(--text-2); white-space: nowrap; }
.hc-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 12.5px; color: var(--text-2); }
.hc-legend span { display: inline-flex; align-items: center; gap: 6px; }
.hc-legend i { width: 10px; height: 10px; border-radius: 3px; flex: none; }
.hc-legend b { color: var(--text); font-weight: 700; font-variant-numeric: tabular-nums; }
.hc-legend small { color: var(--text-3); }
.hc-note { margin: 8px 0 0; font-size: 12.5px; color: var(--text-3); line-height: 1.4; }
.hc-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.hc-m { display: flex; flex-direction: column; gap: 2px; padding: 9px 10px; border-radius: 11px; border: 1px solid var(--line); min-width: 0; }
.hc-m span { font-size: 11.5px; color: var(--text-3); line-height: 1.25; }
.hc-m b { font-size: 17px; font-weight: 650; font-variant-numeric: tabular-nums; }
.hc-m small { font-size: 11.5px; color: var(--text-3); line-height: 1.25; }
.hc-partners { padding: 18px; margin-bottom: 16px; }
.hc-filters { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; }
.hc-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.hc-chip { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 11px; border-radius: 99px; border: 1px solid var(--line); background: var(--surface); color: var(--text-2); font: 600 12.5px var(--font); cursor: pointer; }
.hc-chip b { font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
.hc-chip:hover { border-color: var(--red); }
.hc-chip[aria-pressed="true"] { background: var(--black); border-color: var(--black); color: #fff; }
.hc-chip[aria-pressed="true"] b { color: #fff; }
.hc-table { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.hc-row { display: grid; grid-template-columns: minmax(0, 2fr) 170px minmax(120px, 1fr); gap: 12px; align-items: center; padding: 9px 14px; border-top: 1px solid var(--line); font-size: 13.5px; }
.hc-row.head { border-top: 0; background: var(--surface-2); font-size: 12px; font-weight: 600; color: var(--text-3); }
.hc-name { display: flex; flex-direction: column; min-width: 0; font-weight: 600; }
.hc-name small { font-size: 11.5px; font-weight: 500; color: var(--text-3); }
.hc-st { display: inline-flex; padding: 3px 9px; border-radius: 99px; font-size: 12px; font-weight: 650; background: var(--surface-3); color: var(--text-2); }
.hc-st.signed { background: color-mix(in srgb, var(--green) 15%, var(--surface)); color: color-mix(in srgb, var(--green) 72%, #000); }
.hc-st.agreed { background: color-mix(in srgb, var(--red) 14%, var(--surface)); color: var(--red-ink); }
.hc-st.talks { background: color-mix(in srgb, var(--amber) 16%, var(--surface)); color: color-mix(in srgb, var(--amber) 70%, #000); }
:root[data-theme="dark"] .hc-st.signed, :root[data-theme="dark"] .hc-verdict.good { color: var(--green); }
:root[data-theme="dark"] .hc-st.talks, :root[data-theme="dark"] .hc-verdict.warn, :root[data-theme="dark"] .hc-signal .i { color: var(--amber); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .hc-st.signed, :root:not([data-theme="light"]) .hc-verdict.good { color: var(--green); } :root:not([data-theme="light"]) .hc-st.talks, :root:not([data-theme="light"]) .hc-verdict.warn, :root:not([data-theme="light"]) .hc-signal .i { color: var(--amber); } }
@media (max-width: 1280px) { .hc-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1100px) { .hc-grid { grid-template-columns: 1fr; } }
@media (max-width: 640px) {
  .hc-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hc-card strong { font-size: 21px; }
  .hc-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hc-row { grid-template-columns: minmax(0, 1fr) auto; }
  .hc-row > :nth-child(3) { grid-column: 1; font-size: 12px; color: var(--text-3); margin-top: -6px; }
  .hc-row.head > :nth-child(3) { display: none; }
}
.hc-chip[data-zero] { opacity: .45; }
.hc-chip[data-zero][aria-pressed="false"]:hover { border-color: var(--line); }

/* ═════ v14 · Серверный режим: вход через Google ═════ */
body.login-mode .app, body.login-mode .tabbar { display: none; }
.login { min-height: 100vh; display: grid; place-items: center; padding: 24px 16px; }
.login-card { width: min(420px, 100%); display: flex; flex-direction: column; align-items: center; text-align: center; gap: 10px; padding: 36px 28px 28px; border-radius: 26px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-lg); }
.login-card .brand-mark.big { width: 64px; height: 64px; border-radius: 20px; font-size: 34px; display: grid; place-items: center; }
.login-card h1 { margin: 6px 0 0; font: 800 30px/1 var(--font-display); letter-spacing: -.03em; }
.login-sub { margin: 0 0 12px; color: var(--text-3); font-size: 14px; }
.login-btn { display: inline-flex; align-items: center; gap: 10px; height: 46px; padding: 0 22px; font-size: 15px; }
.login-btn svg { width: 20px; height: 20px; }
.login-note { margin: 6px 0 0; font-size: 12.5px; color: var(--text-3); line-height: 1.4; }
.login-note.warn { color: var(--red-ink); font-weight: 600; }
.actor-name { font-size: 13px; font-weight: 650; white-space: nowrap; }
.actor-out { margin-left: 4px; padding: 4px 8px; border-radius: 8px; font-size: 12.5px; font-weight: 600; color: var(--text-3); }
.actor-out:hover { color: var(--red-ink); background: var(--surface-2); }
.source-card.stale .pulse { background: var(--amber); }
@media (max-width: 640px) { .actor-name { max-width: 110px; overflow: hidden; text-overflow: ellipsis; } }
.br-grid.one { grid-template-columns: minmax(0, 720px); }

/* ═════ v15 · Таймлайн «Месяц»: компактно, все менеджеры на одном экране ═════ */
.tl-grid.wk.mo .tl-week { padding: 6px 10px; }
.tl-grid.wk.mo .tl-pm { padding: 6px 12px; }
.tl-grid.wk.mo .tl-pm strong { font-size: 13px; }
.tl-grid.wk.mo .tl-pm small { font-size: 10.5px; }
.tl-grid.wk.mo .tl-cell { min-height: 34px; padding: 4px 5px; gap: 3px; }
.tl-grid.wk.mo .tl-ev.slim { flex-direction: row; align-items: baseline; gap: 0; padding: 3px 7px 3px 9px; border-radius: 7px; font-size: 12px; line-height: 1.3; white-space: nowrap; }
.tl-grid.wk.mo .tl-ev-day { flex: none; min-width: 0; margin-right: 6px; font-size: 10.5px; }
.tl-ev-t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; font-weight: 650; }
.tl-ev-emo { font-style: normal; margin-right: 4px; font-size: 11px; }
.tl-grid.wk.mo .tl-more-row { padding: 0 4px; font-size: 11.5px; line-height: 1.4; }
.tl-grid.wk.mo { --tl-name: 104px; --tl-col: 116px; }
.tl-grid.wk.mo .tl-pm strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.tl-grid.wk.mo .tl-cell { min-height: 28px; padding: 3px 4px; gap: 2px; }
.tl-grid.wk.mo .tl-ev.slim { padding: 2px 7px 2px 8px; font-size: 11.5px; line-height: 1.3; border-radius: 6px; }
.tl-grid.wk.mo .tl-ev-day { font-size: 10px; margin-right: 5px; }
.tl-grid.wk.mo .tl-pm { flex-direction: row; align-items: baseline; gap: 6px; padding: 5px 10px; }
.tl-grid.wk.mo .tl-pm small { flex: none; }
.tl-grid.wk.mo .tl-week { padding: 5px 10px; font-size: 12px; }
.tl-grid.wk.mo .tl-week small { font-size: 10.5px; }
.tl-grid.wk.mo .tl-more-row { font-size: 11px; line-height: 1.3; }
/* «Месяц»: чуть свободнее (24.10.2026, по отзыву «слишком узко») — всё ещё помещается на экран 1440×900 */
.tl-grid.wk.mo .tl-cell { min-height: 38px; padding: 5px; gap: 3px; }
.tl-grid.wk.mo .tl-ev.slim { padding: 3px 8px 3px 10px; font-size: 12px; line-height: 1.35; border-radius: 7px; }
.tl-grid.wk.mo .tl-ev-day { font-size: 10.5px; margin-right: 6px; }
.tl-grid.wk.mo .tl-pm { flex-direction: column; align-items: flex-start; gap: 1px; padding: 8px 12px; }
.tl-grid.wk.mo .tl-week { padding: 7px 10px; }
.tl-grid.wk.mo .tl-more-row { font-size: 11.5px; line-height: 1.4; padding: 1px 4px; }