/* Каркас внутреннего приложения (base.html) в духе Linear / shadcn: монохромная палитра zinc, тонкие рамки, без градиентов.
   Публичный план этот файл не подключает. */
body.app {
  --bg: #ffffff; --surface: #ffffff; --muted-bg: #f4f4f5; --subtle: #fafafa;
  --border: #e4e4e7; --input: #e4e4e7; --ring: #a5acec;
  --fg: #09090b; --fg-2: #3f3f46; --muted: #71717a; --faint: #a1a1aa;
  --primary: #5e6ad2; --primary-hover: #4f5bc4; --primary-fg: #ffffff;
  --accent: #5e6ad2; --accent-ink: #4a55b8; --accent-soft: #eef0fb; --accent-soft-2: #e3e6f8; --ink: #18181b;
  --ok: #16a34a; --warn: #d97706; --bad: #dc2626; --info: #2563eb;
  --radius: 8px; --radius-sm: 6px; --shadow-sm: 0 1px 2px 0 #0000000d; --shadow-md: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;
  --side-w: 240px; --h: 2.25rem; --h-sm: 2rem;
  --pico-font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --pico-font-size: 14px; --pico-line-height: 1.5; --pico-font-weight: 400;
  --pico-primary: var(--fg); --pico-primary-hover: var(--fg); --pico-primary-underline: #09090b40; --pico-primary-hover-underline: var(--fg);
  --pico-primary-background: var(--primary); --pico-primary-border: var(--primary); --pico-primary-inverse: var(--primary-fg);
  --pico-primary-hover-background: var(--primary-hover); --pico-primary-hover-border: var(--primary-hover); --pico-primary-focus: #5e6ad233;
  --pico-secondary: var(--fg-2); --pico-secondary-background: var(--muted-bg); --pico-secondary-border: var(--border); --pico-secondary-hover: var(--fg);
  --pico-contrast-background: var(--ink); --pico-contrast-border: var(--ink); --pico-contrast-inverse: var(--primary-fg);
  --pico-color: var(--fg-2); --pico-h1-color: var(--fg); --pico-h2-color: var(--fg); --pico-h3-color: var(--fg); --pico-h4-color: var(--fg); --pico-h5-color: var(--fg);
  --pico-muted-color: var(--muted); --pico-muted-border-color: var(--border);
  --pico-background-color: var(--bg); --pico-card-background-color: var(--surface); --pico-card-sectioning-background-color: var(--subtle);
  --pico-border-radius: var(--radius-sm); --pico-border-width: 1px; --pico-outline-width: 2px;
  --pico-form-element-background-color: var(--surface); --pico-form-element-border-color: var(--input); --pico-form-element-active-border-color: var(--ring);
  --pico-form-element-focus-color: #5e6ad22e; --pico-form-element-placeholder-color: var(--faint);
  --pico-form-element-spacing-vertical: .45rem; --pico-form-element-spacing-horizontal: .75rem;
  --pico-spacing: 1rem; --pico-typography-spacing-vertical: .9rem; --pico-block-spacing-vertical: 1rem;
  --pico-table-border-color: var(--border); --pico-box-shadow: none;
  background: var(--bg); color: var(--fg-2); min-height: 100vh;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-feature-settings: "cv11", "ss01";
}
body.app h1, body.app h2, body.app h3, body.app h4 { letter-spacing: -.015em; font-weight: 600; }
body.app a { color: var(--fg); text-decoration: none; }
body.app a, body.app a:hover, body.app a:focus { text-decoration: none; }
body.app a:not([role=button]):hover { color: var(--accent-ink); }
body.app ::selection { background: #5e6ad233; }
body.app :focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* ---------- кнопки (shadcn: default / outline / ghost / destructive) ---------- */
body.app :is(button, [role=button], input[type=submit]) {
  display: inline-flex; align-items: center; justify-content: center; gap: .4rem; height: var(--h); padding: 0 1rem; margin: 0;
  font-size: .875rem; font-weight: 500; line-height: 1; border-radius: var(--radius-sm); box-shadow: var(--shadow-sm);
  transition: background-color .12s, border-color .12s, color .12s; white-space: nowrap; }
body.app :is(button, [role=button]):hover { text-decoration: none; }
body.app :is(button, [role=button]):focus-visible { box-shadow: 0 0 0 2px var(--bg), 0 0 0 4px var(--ring); outline: none; }
body.app :is(button, [role=button]).secondary, body.app :is(button, [role=button]).outline, body.app .btn-ghost {
  --pico-color: var(--fg); background: var(--surface); color: var(--fg); border: 1px solid var(--input); }
body.app :is(button, [role=button]).secondary:hover, body.app :is(button, [role=button]).outline:hover, body.app .btn-ghost:hover { background: var(--muted-bg); color: var(--fg); border-color: var(--input); }
body.app :is(button, [role=button]).contrast { background: var(--ink); border-color: var(--ink); color: #fafafa; }
body.app .btn-danger { background: var(--surface); color: var(--bad); border: 1px solid var(--input); }
body.app .btn-danger:hover { background: #fef2f2; border-color: #fecaca; color: var(--bad); }
body.app .btn-sm, body.app .actions button, body.app .actions [role=button] { height: var(--h-sm); padding: 0 .75rem; font-size: .8125rem; width: auto; }
body.app a[role=button]:not(.secondary, .outline, .btn-ghost, .btn-danger) { color: var(--primary-fg); background: var(--primary); border: 1px solid var(--primary); }
body.app a[role=button]:not(.secondary, .outline, .btn-ghost, .btn-danger):hover { background: var(--primary-hover); }
body.app button:is(.icon-btn, .icon-del) { box-shadow: none; border: 0; background: transparent; padding: 0; }
body.app button.icon-btn { width: 28px; height: 28px; color: var(--muted); }
body.app .icon-btn:hover { background: #ebebec; color: var(--fg); }
body.app button.icon-del { width: var(--h); height: var(--h); color: var(--faint); }
body.app .icon-del:hover { background: var(--muted-bg); color: var(--bad); }
body.app button:disabled { opacity: .5; pointer-events: none; }
kbd.k { display: inline-grid; place-items: center; min-width: 1.25rem; height: 1.25rem; padding: 0 .3rem; font: 500 .6875rem/1 ui-monospace, SFMono-Regular, Menlo, monospace;
  color: var(--muted); background: var(--surface); border: 1px solid var(--border); border-radius: 4px; box-shadow: none; }

/* ---------- поля ---------- */
body.app input:not([type=checkbox], [type=radio], [type=range], [type=file]), body.app select {
  height: var(--h); font-size: .875rem; border-radius: var(--radius-sm); box-shadow: var(--shadow-sm); padding-top: 0; padding-bottom: 0; }
body.app textarea { font-size: .875rem; border-radius: var(--radius-sm); box-shadow: var(--shadow-sm); }
body.app :is(input, select, textarea):focus { border-color: var(--accent); box-shadow: 0 0 0 3px #5e6ad226; }
body.app input[type=checkbox] { border-radius: 4px; width: 1rem; height: 1rem; border-color: #a1a1aa; }
body.app input[type=checkbox]:checked { background-color: var(--primary); border-color: var(--primary); }
body.app label { font-size: .875rem; font-weight: 500; color: var(--fg); }
body.app small, body.app label small { color: var(--muted); font-weight: 400; font-size: .8125rem; }
body.app code, body.app pre { background: var(--muted-bg); color: var(--fg); border-radius: 4px; font-size: .8125rem; }
body.app hr { border-color: var(--border); }
body.app details summary { color: var(--fg); }

/* ---------- каркас ---------- */
.sidebar { position: fixed; inset: 0 auto 0 0; width: var(--side-w); display: flex; flex-direction: column; gap: .25rem; padding: .75rem .625rem;
  background: var(--subtle); border-right: 1px solid var(--border); z-index: 40; overflow-y: auto; }
.sidebar a:hover { text-decoration: none; }
.brand { display: flex; align-items: center; gap: .6rem; padding: .35rem .5rem .75rem; color: var(--fg) !important; font-weight: 600; font-size: .9rem; letter-spacing: -.01em; }
.brand-mark { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 6px; background: var(--primary); color: var(--primary-fg); flex-shrink: 0; }
.brand-mark svg { width: 15px; height: 15px; }
.brand-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.brand-logo { height: 26px; width: auto; max-width: 170px; object-fit: contain; object-position: left center; }   /* логотип продукта менеджера */
.brand-icon { background: none; object-fit: contain; }
.nav-cta { display: flex; align-items: center; gap: .5rem; margin: 0 0 .5rem; height: var(--h-sm); padding: 0 .5rem 0 .6rem; border-radius: var(--radius-sm);
  background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow-sm); color: var(--fg) !important; font-weight: 500; font-size: .8125rem; }
body.app .nav-cta:hover { background: var(--muted-bg); color: var(--fg); }
.nav-cta kbd.k { margin-left: auto; }
.nav-cta svg, .side-nav svg, .icon-btn svg, .menu-toggle svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.sidebar nav.side-nav { display: flex; flex-direction: column; justify-content: flex-start; align-items: stretch; gap: 1px; flex: 1; padding: 0; }
.nav-label { margin: .9rem .5rem .3rem; font-size: .75rem; font-weight: 500; color: var(--muted); }
.side-nav a { display: flex; align-items: center; gap: .6rem; height: 2rem; padding: 0 .5rem; border-radius: var(--radius-sm); font-size: .8125rem; font-weight: 500; color: var(--fg-2); }
.side-nav a svg { color: var(--muted); }
body.app .side-nav a:hover { background: #f0f0f1; color: var(--fg); }
body.app .side-nav a[aria-current=page] { background: var(--accent-soft-2); color: var(--accent-ink); }
.side-nav a[aria-current=page] svg { color: var(--accent); }
.side-nav a > span { margin-left: auto; }
.nav-count { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--primary); color: var(--primary-fg); font-size: .6875rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.side-user { display: flex; align-items: center; gap: .55rem; padding: .6rem .35rem 0; margin-top: .5rem; border-top: 1px solid var(--border); }
.avatar { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #e4e4e7; color: var(--fg) !important; font-weight: 600; font-size: .6875rem; flex-shrink: 0; letter-spacing: .02em; }
.side-user-name { flex: 1; min-width: 0; line-height: 1.25; }
.side-user-name b { display: block; color: var(--fg); font-size: .8125rem; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.side-user-name small { color: var(--muted); font-size: .75rem; }
.icon-btn { all: unset; cursor: pointer; display: grid; place-items: center; width: 28px; height: 28px; border-radius: var(--radius-sm); color: var(--muted); }
.icon-btn:hover { background: #ebebec; color: var(--fg); }
body.app button.menu-toggle, .nav-scrim { display: none; }
.shell { margin-left: var(--side-w); min-width: 0; }
body.app .shell > main.container { max-width: 1200px; padding: 1.75rem 2.5rem 4rem; margin: 0 auto; }
body.app .shell > main.container > :first-child { margin-top: 0; }
body.app-guest .shell { margin-left: 0; }

@media (max-width: 960px) {
  .sidebar { transform: translateX(-100%); transition: transform .18s ease; }
  body.nav-open .sidebar { transform: none; box-shadow: var(--shadow-md); }
  body.nav-open .nav-scrim { display: block; position: fixed; inset: 0; background: #09090b4d; z-index: 30; }
  body.app button.menu-toggle { display: grid; place-items: center; position: fixed; top: .75rem; left: .75rem; z-index: 20; width: var(--h); height: var(--h); padding: 0;
    background: var(--surface); color: var(--fg); border: 1px solid var(--border); }
  .shell { margin-left: 0; }
  body.app .shell > main.container { padding: 3.75rem 1rem 3rem; }
}

/* ---------- заголовок страницы ---------- */
.page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem 2rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.page-head h1 { margin: 0; font-size: 1.5rem; line-height: 2rem; font-weight: 600; letter-spacing: -.025em; color: var(--fg); }
.page-head p { margin: .25rem 0 0; color: var(--muted); font-size: .875rem; }
.page-head .actions { align-items: center; gap: .5rem; }
.eyebrow { display: block; font-size: .8125rem; font-weight: 500; color: var(--muted); margin-bottom: .25rem; }

/* ---------- карточки и плитки ---------- */
.card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 1.5rem; margin-bottom: 1rem; }
.card > h2, .card > h3, .card-head h2, .card-head h3 { margin: 0 0 .25rem; font-size: 1rem; line-height: 1.5rem; font-weight: 600; }
.card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; flex-wrap: wrap; }
.card-head p { margin: 0; color: var(--muted); font-size: .875rem; }
.card.flush { padding: 0; overflow: hidden; }
.card.flush.has-menus { overflow: visible; }
.card.flush > .card-head { padding: 1.25rem 1.5rem 0; }
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: .75rem; margin-bottom: 1.25rem; }
.stat { position: relative; display: block; padding: .9rem 1rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); color: inherit; transition: border-color .12s, background-color .12s; }
a.stat:hover { text-decoration: none; background: var(--subtle); }
.stat[aria-current=true] { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); background: #fbfbfe; }
.stat[aria-current=true] small { color: var(--accent-ink); }
.stat small { display: flex; align-items: center; gap: .45rem; font-size: .8125rem; font-weight: 500; color: var(--muted); }
.stat b { display: block; margin-top: .25rem; font-size: 1.5rem; font-weight: 600; color: var(--fg); letter-spacing: -.025em; font-variant-numeric: tabular-nums; line-height: 2rem; }
.dot { width: 7px; height: 7px; border-radius: 50%; background: var(--faint); display: inline-block; flex-shrink: 0; }
.dot.running { background: var(--info); } .dot.queued { background: var(--warn); } .dot.done { background: var(--ok); } .dot.failed { background: var(--bad); } .dot.cancelled { background: var(--faint); }
.dot.new { background: var(--info); } .dot.seen { background: var(--warn); } .dot.closed { background: var(--faint); }

/* ---------- бейджи: контур + цветная точка (Linear) ---------- */
body.app .badge { display: inline-flex; align-items: center; gap: .375rem; height: 1.375rem; padding: 0 .5rem; border-radius: var(--radius-sm); font-size: .75rem; font-weight: 500;
  background: var(--surface); color: var(--fg-2); border: 1px solid var(--border); white-space: nowrap; line-height: 1; }
body.app .badge[class*="st-"]::before, body.app .badge[class*="req-"]::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--faint); }
body.app .badge.st-running::before { background: var(--info); } body.app .badge.st-done::before { background: var(--ok); }
body.app .badge.st-failed::before { background: var(--bad); } body.app .badge.st-queued::before, body.app .badge.st-pending::before { background: var(--warn); }
body.app .badge.req-new::before { background: var(--accent); } body.app .badge.req-seen::before { background: var(--warn); }
body.app .badge.role-admin { background: var(--accent-soft); border-color: transparent; color: var(--accent-ink); }
body.app .badge.role-manager { background: var(--muted-bg); border-color: transparent; color: var(--fg-2); }

/* ---------- таблицы (shadcn Table) ---------- */
.table-wrap { overflow-x: auto; }
table.data { width: 100%; margin: 0; border-collapse: collapse; font-size: .875rem; }
table.data th { height: 2.5rem; padding: 0 1rem; text-align: left; vertical-align: middle; font-size: .8125rem; font-weight: 500; color: var(--muted); background: transparent; border-bottom: 1px solid var(--border); white-space: nowrap; }
table.data td { padding: .75rem 1rem; border-bottom: 1px solid var(--border); vertical-align: middle; background: transparent; color: var(--fg-2); }
table.data tbody tr { transition: background-color .1s; }
table.data tbody tr:hover { background: var(--subtle); }
table.data tbody tr:last-child td { border-bottom: 0; }
table.data th.num, table.data td.num { text-align: right; font-variant-numeric: tabular-nums; }
table.data td.num b { font-weight: 500; color: var(--fg); }
table.data .strong a, table.data .strong { font-weight: 500; color: var(--fg); }
table.data .sub { display: block; color: var(--muted); font-size: .8125rem; margin-top: .1rem; font-weight: 400; }
.row-link { color: var(--fg); font-weight: 500; }
.progress { display: flex; align-items: center; gap: .6rem; min-width: 140px; }
.progress .bar { flex: 1; height: 4px; background: var(--muted-bg); border-radius: 99px; overflow: hidden; }
.progress .bar i { display: block; height: 100%; background: var(--primary) !important; border-radius: inherit; transition: width .4s ease; }
.progress span { font-size: .8125rem; color: var(--muted); font-variant-numeric: tabular-nums; min-width: 2.6rem; text-align: right; }

/* ---------- фильтры и панель инструментов ---------- */
.toolbar { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; padding: .75rem 1rem; border-bottom: 1px solid var(--border); }
.toolbar h2 { margin: 0; font-size: .875rem; font-weight: 600; }
.segmented { display: inline-flex; gap: 0; padding: 3px; background: var(--muted-bg); border-radius: var(--radius); flex-wrap: wrap; }
.segmented a { height: 1.75rem; display: inline-flex; align-items: center; padding: 0 .75rem; border-radius: var(--radius-sm); font-size: .8125rem; font-weight: 500; color: var(--muted); white-space: nowrap; }
.segmented a:hover { color: var(--fg); text-decoration: none; }
.segmented a[aria-current=true] { background: var(--surface); color: var(--accent-ink); box-shadow: var(--shadow-sm); }
.segmented a b { font-weight: 500; margin-left: .35rem; color: var(--faint); font-variant-numeric: tabular-nums; }
.search { position: relative; margin: 0; flex: 0 1 300px; min-width: 200px; }
.search svg { position: absolute; left: .7rem; top: 50%; transform: translateY(-50%); width: 15px; height: 15px; fill: none; stroke: var(--faint); stroke-width: 2; pointer-events: none; }
body.app .search input { margin: 0; padding-left: 2.1rem; padding-right: 2.2rem; height: var(--h-sm); font-size: .8125rem; }
.search kbd.k { position: absolute; right: .5rem; top: 50%; transform: translateY(-50%); pointer-events: none; }
.foot-note { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; padding: .6rem 1rem; font-size: .8125rem; color: var(--muted); border-top: 1px solid var(--border); }
.pager { display: flex; gap: .75rem; }

/* ---------- состояния (shadcn Alert) ---------- */
.flash { display: flex; align-items: center; gap: .6rem; padding: .75rem 1rem; margin-bottom: 1.25rem; border-radius: var(--radius); font-size: .875rem; border: 1px solid var(--border); background: var(--surface); color: var(--fg); animation: flash-in .2s ease; }
.flash.ok svg { color: var(--ok); }
.flash.err { border-color: #fecaca; color: var(--bad); background: #fffafa; }
.flash svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; flex-shrink: 0; }
@keyframes flash-in { from { opacity: 0; transform: translateY(-3px); } }
.empty { text-align: center; padding: 3rem 1rem; color: var(--muted); }
.empty svg { width: 36px; height: 36px; fill: none; stroke: var(--faint); stroke-width: 1.5; margin-bottom: .5rem; }
.empty h3 { font-size: 1rem; margin: 0 0 .25rem; }
.empty p { margin: 0 0 1rem; font-size: .875rem; }
body.app .error { color: var(--bad); }

/* ---------- формы и настройки ---------- */
.form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 0 1rem; }
.form-actions { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; padding-top: 1rem; margin-top: .5rem; border-top: 1px solid var(--border); }
.form-actions button, .form-actions [role=button] { width: auto; }
.form-actions .spacer { flex: 1; }
.settings-layout { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 2rem; align-items: start; }
.settings-nav { position: sticky; top: 2rem; display: flex; flex-direction: column; gap: 1px; }
.settings-nav a { display: flex; align-items: center; justify-content: space-between; gap: .5rem; height: 2rem; padding: 0 .6rem; border-radius: var(--radius-sm); color: var(--fg-2); font-size: .875rem; }
.settings-nav a b { font-weight: 500; }
.settings-nav a small { display: none; }
.settings-nav a:hover { background: var(--muted-bg); text-decoration: none; }
body.app .settings-nav a[aria-current=page] { background: var(--accent-soft); color: var(--accent-ink); }
.settings-nav a[aria-current=page] b { font-weight: 600; }
.settings-nav .tag { order: 2; width: 6px; height: 6px; padding: 0; font-size: 0; border-radius: 50%; background: var(--accent); }
@media (max-width: 860px) { .settings-layout { grid-template-columns: 1fr; gap: 1rem; } .settings-nav { position: static; flex-direction: row; overflow-x: auto; } }
.meta-line { font-size: .8125rem; color: var(--muted); }
.matrix { border-collapse: separate; border-spacing: 6px; margin: 0 -6px; }
.matrix th { font-size: .8125rem; font-weight: 500; color: var(--muted); text-align: center; padding: .2rem; border: 0; background: none; }
.matrix th[scope=row] { text-align: right; padding-right: .5rem; white-space: nowrap; }
.matrix td { padding: 0; border: 0; }
body.app .matrix input { margin: 0; text-align: right; font-variant-numeric: tabular-nums; min-width: 90px; }
.steps { display: flex; flex-direction: column; gap: .5rem; margin-bottom: .6rem; }
.step { display: grid; grid-template-columns: 1fr 1fr auto; gap: .5rem; align-items: center; }
body.app .step input { margin: 0; }
.step .icon-del { all: unset; cursor: pointer; width: var(--h); height: var(--h); display: grid; place-items: center; border-radius: var(--radius-sm); color: var(--faint); }
.step .icon-del:hover { background: var(--muted-bg); color: var(--bad); }
.step-head { display: grid; grid-template-columns: 1fr 1fr var(--h); gap: .5rem; font-size: .8125rem; font-weight: 500; color: var(--muted); margin-bottom: .35rem; }
body.app textarea.code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .8rem; line-height: 1.55; min-height: 460px; tab-size: 2; background: var(--subtle); }
.region-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 0 1rem; padding: .75rem 1rem; border: 1px solid var(--border); border-radius: var(--radius); margin-bottom: 1rem; }
.region-grid label { margin: .25rem 0; font-weight: 400; font-size: .875rem; color: var(--fg-2); }
.check-row { display: flex; align-items: center; gap: .5rem; font-weight: 500; }
.section-title { font-size: .875rem; font-weight: 600; color: var(--fg); margin: 0 0 .15rem; }
.section-sub { font-size: .8125rem; color: var(--muted); margin: 0 0 .9rem; }
.grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 1rem; }
.grid-2 > .card { margin-bottom: 0; }

/* ---------- пользователи и меню действий (shadcn DropdownMenu) ---------- */
.user-cell { display: flex; align-items: center; gap: .65rem; }
.user-cell .avatar { width: 32px; height: 32px; font-size: .7rem; }
.user-cell .avatar.off { opacity: .45; }
.user-cell b { display: block; color: var(--fg); font-weight: 500; }
.user-cell small { color: var(--muted); font-size: .8125rem; }
.menu { position: relative; display: inline-block; }
.menu > summary { list-style: none; cursor: pointer; display: grid; place-items: center; width: var(--h-sm); height: var(--h-sm); border-radius: var(--radius-sm); color: var(--muted); }
.menu > summary::-webkit-details-marker { display: none; }
.menu > summary::after { display: none !important; }
.menu > summary:hover, .menu[open] > summary { background: var(--muted-bg); color: var(--fg); }
.menu > summary svg { width: 16px; height: 16px; fill: currentColor; }
.menu-panel { position: absolute; right: 0; top: calc(100% + 4px); z-index: 20; width: 280px; padding: .75rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-md); text-align: left; }
.menu-panel form { margin: 0 0 .75rem; display: flex; flex-direction: column; align-items: stretch; gap: .4rem; white-space: normal; }
.menu-panel form:last-child { margin-bottom: 0; }
.menu-panel h4 { font-size: .75rem; font-weight: 500; color: var(--muted); margin: 0 0 .1rem; letter-spacing: 0; }
body.app .menu-panel :is(input, select) { width: 100%; margin: 0; height: var(--h-sm); font-size: .8125rem; }
body.app .menu-panel button { width: 100%; height: var(--h-sm); font-size: .8125rem; }
.menu-panel hr { margin: .75rem -.75rem; }
.drawer > summary { list-style: none; }
.drawer > summary::-webkit-details-marker { display: none; }
@media (max-width: 760px) { .card.flush.has-menus table.data :is(th, td):nth-child(n+4):nth-child(-n+6) { display: none; } }

/* ---------- новое КП ---------- */
.hero-form { padding: 1.5rem; }
.hero-form h2 { font-size: 1rem; margin: 0 0 .15rem; }
.domain-input { display: flex; gap: .5rem; align-items: stretch; margin-top: 1rem; }
body.app .domain-input input { flex: 1; margin: 0; height: 2.75rem; font-size: 1rem; }
body.app .domain-input button { width: auto; height: 2.75rem; padding: 0 1.25rem; }
.defaults-list { display: flex; flex-wrap: wrap; gap: .375rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.defaults-list li { list-style: none; margin: 0; font-size: .75rem; height: 1.5rem; display: inline-flex; align-items: center; padding: 0 .5rem; border: 1px solid var(--border); border-radius: var(--radius-sm); color: var(--muted); }
.defaults-list li b { color: var(--fg); font-weight: 500; margin-left: .25rem; }
@media (max-width: 600px) { .domain-input { flex-direction: column; } .hero-form { padding: 1rem; } }

/* ---------- вход (shadcn authentication) ---------- */
body.app-guest { min-height: 100dvh; }
body.app-guest .shell > main.container { max-width: none; padding: 0 !important; }
.auth { min-height: 100dvh; display: grid; grid-template-columns: 1fr 1fr; }
.auth-art { padding: 2.5rem; display: flex; flex-direction: column; justify-content: space-between; background: var(--ink); color: #a1a1aa; }
.auth-art .brand { padding: 0; color: #fafafa !important; }
.auth-art .brand-mark { background: var(--accent); color: #fff; }
.auth-art h1 { color: #fafafa; font-size: 1.5rem; line-height: 1.35; letter-spacing: -.02em; font-weight: 500; max-width: 460px; margin: 0 0 .75rem; }
.auth-art p { max-width: 440px; color: #a1a1aa; font-size: .9rem; margin: 0; }
.auth-points { display: grid; gap: .5rem; margin: 1.5rem 0 0; padding: 0; list-style: none; }
.auth-points li { list-style: none; display: flex; gap: .6rem; align-items: center; color: #d4d4d8; font-size: .875rem; }
.auth-points svg { width: 16px; height: 16px; fill: none; stroke: #8b93e6; stroke-width: 2; flex-shrink: 0; }
.auth-art > small { color: #71717a; }
.auth-panel { display: grid; place-items: center; padding: 2rem; }
.auth-card { width: 100%; max-width: 350px; }
.auth-card h2 { font-size: 1.5rem; text-align: center; margin: 0 0 .25rem; letter-spacing: -.025em; }
.auth-card > p { color: var(--muted); margin: 0 0 1.5rem; text-align: center; font-size: .875rem; }
body.app .auth-card button { width: 100%; margin-top: .25rem; }
body.app .auth-card .small { text-align: center; margin-top: 1.25rem; }
@media (max-width: 860px) { .auth { grid-template-columns: 1fr; } .auth-art { display: none; } }

/* ---------- система ---------- */
.list-plain { list-style: none; padding: 0; margin: 0; }
.list-plain li { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .6rem 0; border-bottom: 1px solid var(--border); font-size: .875rem; }
.list-plain li:last-child { border-bottom: 0; }

/* ---------- страница задачи и фрагменты из app.css: те же токены ---------- */
body.app.job-detail { background: var(--bg); color: var(--fg-2); --pico-primary: var(--fg); --pico-primary-hover: var(--fg); }
body.app.job-detail main.container { max-width: 1240px; }
body.app .job-heading h1 { color: var(--fg); font-size: 1.75rem; font-weight: 600; letter-spacing: -.03em; }
body.app .job-heading > a { color: var(--muted); font-size: .8125rem; }
body.app .job-reference, body.app .job-context, body.app .job-settings > summary { color: var(--muted); }
body.app .job-sections { top: .75rem; gap: 0; padding: 3px; background: var(--muted-bg); border: 0; border-radius: var(--radius); box-shadow: none; width: fit-content; max-width: 100%; }
body.app .job-sections a { height: 1.75rem; display: inline-flex; align-items: center; padding: 0 .75rem; border-radius: var(--radius-sm); font-size: .8125rem; font-weight: 500; color: var(--muted); }
body.app .job-sections a:hover, body.app .job-sections a:focus-visible { background: var(--surface); color: var(--fg); box-shadow: var(--shadow-sm); text-decoration: none; }
body.app .job-overview, body.app .report-section { border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 1.25rem 1.5rem; }
body.app .job-overview > header { margin: -1.25rem -1.5rem 1.25rem; padding: .75rem 1.5rem; border-bottom: 1px solid var(--border); }
body.app .report-section > summary { color: var(--fg); }
body.app .report-section > summary b { font-size: 1rem; font-weight: 600; }
body.app .report-section > summary small { color: var(--muted); font-size: .8125rem; }
body.app .budget-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); }
body.app .budget-card h3 { color: var(--muted); font-size: .875rem; font-weight: 500; }
body.app .budget-amount { color: var(--fg); font-weight: 600; font-size: 1.75rem; letter-spacing: -.03em; }
body.app .budget-discount { color: var(--muted); }
body.app .budget-discount b { color: var(--fg); font-weight: 600; }
body.app .budget-tiers { color: var(--muted); }
body.app .budget-tiers b { color: var(--fg); font-weight: 500; }
body.app .budget-tiers span[title] { cursor: help; }
body.app .budget-downloads a { color: var(--accent-ink); font-weight: 500; }
body.app .budget-downloads a:hover { color: var(--primary-hover); }
body.app :is(.execution-details, .region-summary, .methodology) { border-color: var(--border); }
body.app .account-balances { background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow-sm); border-radius: var(--radius); padding: 1rem 1.25rem; }
body.app .account-balances h3 { font-size: .875rem; font-weight: 600; }
body.app .balance-card { background: var(--subtle); border: 1px solid var(--border); border-radius: var(--radius-sm); }
body.app .balance-value { font-size: 1.3rem; font-weight: 600; color: var(--fg) !important; letter-spacing: -.02em; }
body.app .balance-card { padding: .75rem .9rem; }
body.app .balance-card p { font-size: .8125rem; color: var(--muted); }
body.app table:not(.data):not(.matrix) th { font-size: .8125rem; color: var(--muted); font-weight: 500; background: transparent; }
body.app table:not(.data):not(.matrix) td { border-color: var(--border); }
body.app :is(.filter-chip span, .page-opportunity, .topic-card, .competitor-client-summary) { border-color: var(--border); border-radius: var(--radius-sm); }
body.app .filter-chip input:checked + span { background: var(--primary); border-color: var(--primary); color: var(--primary-fg); }
body.app .competitor-client-summary, body.app .competitor-client-row td { background: var(--subtle); color: var(--fg); }
body.app .competitor-client-row td:first-child { border-left-color: var(--accent); }
body.app .action-badge { background: var(--muted-bg); color: var(--fg-2); border-radius: 4px; }
body.app progress { height: 4px; border-radius: 99px; background: var(--muted-bg); }
body.app progress::-webkit-progress-value { background: var(--primary); }
body.app progress::-moz-progress-bar { background: var(--primary); }

@media (max-width: 700px) {
  .stats { display: flex; overflow-x: auto; gap: .5rem; margin: 0 -1rem 1rem; padding: 0 1rem .15rem; scroll-snap-type: x mandatory; }
  .stat { flex: 0 0 auto; min-width: 120px; padding: .6rem .8rem; scroll-snap-align: start; }
  .stat b { font-size: 1.25rem; line-height: 1.6rem; }
  .page-head h1 { font-size: 1.25rem; }
  .search { flex: 1 1 100%; }
  table.data td, table.data th { padding-left: .75rem; padding-right: .75rem; }
}
@media (prefers-reduced-motion: reduce) { body.app * { animation: none !important; transition: none !important; } }
body.app details[open] > summary, body.app .report-section[open] > summary { color: var(--fg); }
body.app table:not(.data):not(.matrix) thead th { border-bottom: 1px solid var(--border); }
body.app table:not(.data):not(.matrix) td { font-size: .875rem; }
body.app tr.mark td, body.app .competitor-client-row td { background: var(--accent-soft); color: var(--fg); font-weight: 500; }
body.app tr.mark td:first-child { box-shadow: inset 2px 0 0 var(--accent); }

/* акцент: текстовые ссылки внутри контента и таблиц */
body.app :is(.row-link, table.data .strong a):hover { color: var(--accent-ink); }
body.app .shell main p a:not([role=button]), body.app .card-head a:not([role=button]), body.app .foot-note a, body.app .meta-line a { color: var(--accent-ink); }
body.app .shell main p a:not([role=button]):hover { color: var(--primary-hover); }

/* бренд продукта: предпросмотр в /admin/products (вкладка «Бренд») */
.vendor-preview { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; padding: .8rem 1rem; border: 1px solid var(--line, #e4e4e7); border-radius: 8px; }
.vendor-preview-contacts { display: flex; gap: 1rem; font-size: .85rem; }
.vendor-preview-contacts a { color: var(--vp, var(--accent)); }
.vendor-mark { display: inline-flex; align-items: center; gap: .6rem; min-width: 0; }
.vendor-logo { height: 28px; width: auto; max-width: 180px; object-fit: contain; }
.vendor-icon { height: 24px; width: 24px; object-fit: contain; }
.vendor-name { font-size: 1.05rem; font-weight: 600; letter-spacing: -.01em; }
.vendor-tagline { color: #71717a; font-size: .85rem; }