/* Atlas Servis — Cantek Group kurumsal renkleri (cantekgroup.com): Cantek mavisi #0098D8, antrasit #323E48,
   logo grisi #707070. Font: Barlow ailesi (kurumsal Amsi Pro denendi, tercih edilmedi).
   Tek cesur öğe: açık işlerin yaşını gösteren "termometre". Gerisi sakin ve yoğun. */

:root {
  --ink: #212529;
  --ink-2: #4f5a63;
  --ink-3: #707070;
  --bg: #eff2f4;
  --panel: #ffffff;
  --line: #d7dde2;
  --line-2: #e8ecef;
  --rail: #323e48;
  --rail-2: #3d4a55;
  --rail-ink: #c5cdd3;
  /* Cantek mavisi: çubuk, simge, seçili işaret, grafik gibi süs öğelerinde. Açık olduğu için yazıda ve
     üstüne beyaz yazılan düğmelerde okunur kalması adına koyu tonları (--accent, --accent-2) kullanılır. */
  --brand: #0098d8;
  --accent: #0077ad;
  --accent-2: #00699a;
  --accent-soft: #e1f2fa;
  --good: #2e7d4f;
  --good-soft: #e3f1e8;
  --warn: #a8650a;
  --warn-soft: #fbefdc;
  --crit: #bf3226;
  --crit-soft: #f9e3e0;
  --plan: #3a5ba0;
  --plan-soft: #e5ebf6;
  --series-1: #0098d8;
  --series-2: #c9662a;
  --radius: 6px;
  --font: 'Barlow', 'Segoe UI', system-ui, sans-serif;
  --font-cond: 'Barlow Semi Condensed', 'Barlow', 'Segoe UI', system-ui, sans-serif;

  --bs-body-font-family: var(--font);
  --bs-body-font-size: 0.9375rem;
  --bs-body-color: var(--ink);
  --bs-body-bg: var(--bg);
  --bs-border-color: var(--line);
  --bs-primary: var(--accent);
  --bs-primary-rgb: 0, 119, 173;
  --bs-link-color: var(--accent-2);
  --bs-link-color-rgb: 0, 105, 154;
  --bs-link-hover-color: var(--ink);
  --bs-secondary-color: var(--ink-2);
  --bs-border-radius: var(--radius);
  --bs-focus-ring-color: rgba(10, 120, 150, .35);
}

html { font-size: 16px; }
body { font-family: var(--font); background: var(--bg); color: var(--ink); margin: 0; }
.num, .table td.num { font-variant-numeric: tabular-nums; }
a { text-underline-offset: 2px; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* ---------- Kabuk ---------- */
.app { display: grid; grid-template-columns: 232px 1fr; min-height: 100vh; }
.rail {
  background: var(--rail); color: var(--rail-ink); display: flex; flex-direction: column;
  position: sticky; top: 0; height: 100vh; overflow-y: auto;
}
.rail-brand { display: flex; align-items: center; gap: .6rem; padding: 1.1rem 1.1rem .9rem; color: #fff; text-decoration: none; }
.rail-brand:hover { color: #fff; }
.rail-brand .brand-mark { width: 30px; height: 30px; flex: none; display: block; }
.rail-brand b { font-family: var(--font-cond); font-weight: 600; font-size: 1.2rem; letter-spacing: .01em; line-height: 1; }
.rail-brand small { display: block; color: var(--rail-ink); font-size: .75rem; font-weight: 500; margin-top: 2px; }

.rail-cta { margin: .3rem .9rem 1rem; }
.rail-cta .btn { width: 100%; display: flex; justify-content: space-between; align-items: center; }
.rail-cta kbd { background: rgba(255,255,255,.18); color: #fff; font-family: var(--font); font-size: .72rem; padding: 1px 6px; }

.rail nav { display: flex; flex-direction: column; padding: 0 .55rem; gap: 1px; }
.rail .group { color: #6f8590; font-size: .78rem; font-weight: 500; padding: .9rem .6rem .3rem; }
.rail nav a {
  display: flex; align-items: center; gap: .65rem; padding: .48rem .6rem; border-radius: 5px;
  color: var(--rail-ink); text-decoration: none; font-weight: 500;
}
.rail nav a i { font-size: 1.02rem; width: 1.1rem; text-align: center; opacity: .85; }
.rail nav a:hover { background: var(--rail-2); color: #fff; }
.rail nav a.active { background: var(--rail-2); color: #fff; box-shadow: inset 3px 0 0 var(--brand); }
.rail nav a .count {
  margin-left: auto; font-size: .72rem; font-weight: 600; min-width: 1.4rem; text-align: center;
  padding: 0 .35rem; border-radius: 9px; background: var(--crit); color: #fff;
}
.rail nav a .count.soft { background: #2f4550; color: #d9e4e9; }
.rail-user { margin-top: auto; padding: .9rem 1.1rem 1.1rem; border-top: 1px solid #22353f; font-size: .85rem; }
.rail-user b { color: #fff; font-weight: 600; display: block; }
.rail-user span { color: #7d939e; }
.rail-user .links { display: flex; gap: .9rem; margin-top: .5rem; }
.rail-user .links a, .rail-user .links button { color: var(--rail-ink); font-size: .82rem; background: none; border: 0; padding: 0; text-decoration: none; }
.rail-user .links a:hover, .rail-user .links button:hover { color: #fff; }

.rail-install { display: flex; align-items: center; gap: .45rem; margin-top: .6rem; padding: 0; background: none; border: 0;
  color: #8fd8ee; font-size: .82rem; font-weight: 500; }
.rail-install:hover { color: #fff; }

/* Telefon menüsü: masaüstünde gizli, 860px altında devreye girer */
.tabbar, .nav-backdrop, .search-toggle { display: none; }
.install-help { border: 0; border-radius: 10px; padding: 1.25rem 1.25rem 1rem; width: min(360px, 92vw); color: var(--ink);
  box-shadow: 0 18px 50px rgba(0,0,0,.3); }
.install-help::backdrop { background: rgba(20,28,34,.5); }
.install-help h2 { font-family: var(--font-cond); font-weight: 600; font-size: 1.35rem; margin: 0 0 .8rem; }
.install-help ol { padding-left: 1.2rem; margin: 0 0 .8rem; }
.install-help li { margin-bottom: .45rem; }
.install-help p { font-size: .88rem; }

.main { min-width: 0; display: flex; flex-direction: column; }
.topbar {
  display: flex; align-items: center; gap: 1rem; padding: .85rem 1.75rem; background: var(--panel);
  border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 20;
}
.topbar h1 { font-family: var(--font-cond); font-weight: 600; font-size: 1.45rem; margin: 0; line-height: 1.15; white-space: nowrap; }
.topbar .crumb { color: var(--ink-3); font-size: .85rem; }
.topbar .crumb a { color: var(--ink-2); text-decoration: none; }
.topbar .top-actions { margin-left: auto; display: flex; align-items: center; gap: .5rem; }
.topbar .search { position: relative; width: min(360px, 40vw); }
.topbar .search i { position: absolute; left: .7rem; top: 50%; transform: translateY(-50%); color: var(--ink-3); }
.topbar .search input { padding-left: 2.1rem; background: var(--bg); border-color: transparent; }
.topbar .search input:focus { background: #fff; border-color: var(--accent); }
.content { padding: 1.5rem 1.75rem 3rem; width: 100%; min-width: 0; }

/* ---------- Bileşenler ---------- */
.btn { font-weight: 500; border-radius: 5px; }
.btn-primary { --bs-btn-bg: var(--accent); --bs-btn-border-color: var(--accent); --bs-btn-hover-bg: var(--accent-2);
  --bs-btn-hover-border-color: var(--accent-2); --bs-btn-active-bg: var(--accent-2); --bs-btn-disabled-bg: var(--accent); --bs-btn-disabled-border-color: var(--accent); }
.btn-outline-secondary { --bs-btn-color: var(--ink-2); --bs-btn-border-color: var(--line); --bs-btn-hover-bg: var(--bg);
  --bs-btn-hover-color: var(--ink); --bs-btn-hover-border-color: var(--line); --bs-btn-active-bg: var(--line-2); --bs-btn-active-color: var(--ink); --bs-btn-active-border-color: var(--line); }
.btn-ghost { color: var(--ink-2); background: none; border: 0; }
.btn-ghost:hover { color: var(--ink); background: var(--bg); }
.form-control, .form-select { border-color: var(--line); border-radius: 5px; font-size: .9375rem; background-color: #fff; }
.form-control:disabled, .form-select:disabled, fieldset:disabled .form-control, fieldset:disabled .form-select { background-color: var(--line-2); }
.form-control:focus, .form-select:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(0,152,216,.18); background-color: #fff; }
.form-label { font-weight: 500; font-size: .85rem; color: var(--ink-2); margin-bottom: .3rem; }
.form-text { color: var(--ink-3); font-size: .8rem; }
.req::after { content: " *"; color: var(--crit); }
.invalid-feedback, .field-error { color: var(--crit); font-size: .8rem; }
.is-invalid { border-color: var(--crit) !important; }

.panel { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); }
.panel-head {
  display: flex; align-items: center; gap: .75rem; padding: .8rem 1rem; border-bottom: 1px solid var(--line-2);
}
.panel-head h2, .panel-head h3 { font-family: var(--font-cond); font-weight: 600; font-size: 1.08rem; margin: 0; }
.panel-head .aside { margin-left: auto; color: var(--ink-3); font-size: .85rem; display: flex; gap: .5rem; align-items: center; }
.panel-body { padding: 1rem; }
.panel-body.tight { padding: 0; }
.muted { color: var(--ink-3); }
.ink2 { color: var(--ink-2); }
.small2 { font-size: .82rem; }
.section-title { font-family: var(--font-cond); font-weight: 600; font-size: 1.15rem; margin: 0 0 .6rem; }
.empty { padding: 1.4rem 1rem; color: var(--ink-3); text-align: center; font-size: .9rem; }
.empty i { display: block; font-size: 1.4rem; margin-bottom: .3rem; color: var(--line); }

/* Tablolar */
.table { --bs-table-bg: transparent; margin: 0; font-size: .9rem; color: var(--ink); }
.table > :not(caption) > * > * { padding: .55rem .75rem; border-bottom-color: var(--line-2); vertical-align: middle; }
.table.fixed { table-layout: fixed; }
.table.fixed td { overflow-wrap: anywhere; }
.table thead th {
  font-family: var(--font-cond); font-weight: 600; font-size: .82rem; color: var(--ink-2);
  background: #f5f8f9; border-bottom: 1px solid var(--line); white-space: nowrap;
}
.table tbody tr:hover { background: #f7fafb; }
.table tbody tr:last-child > * { border-bottom: 0; }
.table a.row-link { color: var(--ink); text-decoration: none; font-weight: 500; }
.table a.row-link:hover { color: var(--accent-2); text-decoration: underline; }
.table .sub { display: block; color: var(--ink-3); font-size: .8rem; }
/* Ekran okuyucu metinleri (visually-hidden) kaydırılan tablonun dışına taşıp sayfayı genişletmesin */
.table-responsive { position: relative; }
.tno { font-family: var(--font-cond); font-weight: 600; font-variant-numeric: tabular-nums; color: var(--accent-2); white-space: nowrap; text-decoration: none; }
a.tno:hover { text-decoration: underline; }

/* Durum ve öncelik etiketleri: renk + metin, hiçbir zaman yalnız renk */
.st { display: inline-flex; align-items: center; gap: .35rem; font-size: .8rem; font-weight: 600; padding: .12rem .5rem;
  border-radius: 4px; white-space: nowrap; border: 1px solid transparent; }
.st::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.st-new { color: var(--ink-2); background: #fff; border-color: var(--line); }
.st-progress { color: var(--accent-2); background: var(--accent-soft); }
.st-planned { color: var(--plan); background: var(--plan-soft); }
.st-waiting { color: var(--warn); background: var(--warn-soft); }
.st-done { color: var(--good); background: var(--good-soft); }
.st-cancel { color: var(--ink-3); background: var(--line-2); text-decoration: line-through; }
.st-cancel::before { display: none; }

.pr { font-size: .78rem; font-weight: 600; white-space: nowrap; display: inline-flex; align-items: center; gap: .3rem; }
.pr-low { color: var(--ink-3); }
.pr-normal { color: var(--ink-2); font-weight: 500; }
.pr-high { color: var(--warn); }
.pr-high::before { content: "▲"; font-size: .6rem; }
.pr-urgent { color: #fff; background: var(--crit); padding: .08rem .45rem; border-radius: 4px; }

.tag { display: inline-block; white-space: nowrap; font-size: .75rem; padding: .05rem .45rem; border-radius: 4px; background: var(--line-2); color: var(--ink-2); font-weight: 500; }
.tag.warn { background: var(--warn-soft); color: var(--warn); }
.tag.crit { background: var(--crit-soft); color: var(--crit); }
.tag.good { background: var(--good-soft); color: var(--good); }
.tag.accent { background: var(--accent-soft); color: var(--accent-2); }
.due-late { color: var(--crit); font-weight: 600; }
.due-today { color: var(--warn); font-weight: 600; }

/* Yaş termometresi: açık bir işin kaç gündür beklediği. 0–2 gün serin, 3–7 ılık, 7+ sıcak. */
.thermo { display: inline-flex; align-items: center; gap: .45rem; white-space: nowrap; }
.thermo .tube { width: 46px; height: 6px; border-radius: 3px; background: var(--line-2); position: relative; overflow: hidden; }
.thermo .tube span { position: absolute; inset: 0 auto 0 0; border-radius: 3px; background: var(--series-1); }
.thermo.aging .tube span { background: #d4920f; }
.thermo.old .tube span { background: var(--crit); }
.thermo b { font-weight: 600; font-size: .82rem; font-variant-numeric: tabular-nums; min-width: 2.6rem; }
.thermo.old b { color: var(--crit); }

/* Gösterge paneli */
.kpis { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0; background: var(--panel);
  border: 1px solid var(--line); border-radius: var(--radius); margin-bottom: 1.25rem; }
.kpi { padding: .9rem 1.1rem; border-right: 1px solid var(--line-2); text-decoration: none; color: inherit; display: block; }
.kpi:last-child { border-right: 0; }
a.kpi:hover { background: #f7fafb; }
.kpi .v { font-size: 2rem; font-weight: 600; line-height: 1.05; font-variant-numeric: tabular-nums; }
.kpi .l { color: var(--ink-2); font-size: .85rem; font-weight: 500; margin-top: .15rem; }
.kpi .h { color: var(--ink-3); font-size: .78rem; margin-top: .2rem; }
.kpi.alert .v { color: var(--crit); }
.kpi.warn .v { color: var(--warn); }

.grid-dash { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.stack { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }

/* Yaş dağılımı: büyük termometre */
.age-scale { padding: 1rem 1rem 1.1rem; }
.age-scale .bar { display: flex; height: 26px; border-radius: 13px; overflow: hidden; background: var(--line-2); gap: 2px; }
.age-scale .bar > div { min-width: 0; display: flex; align-items: center; padding: 0 .6rem; color: #fff; font-weight: 600; font-size: .85rem; }
.age-scale .fresh { background: var(--series-1); }
.age-scale .aging { background: #d4920f; }
.age-scale .old { background: var(--crit); }
.age-scale .legend { display: flex; gap: 1.25rem; margin-top: .65rem; font-size: .85rem; color: var(--ink-2); flex-wrap: wrap; }
.age-scale .legend i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: .35rem; vertical-align: -1px; }

/* Yatay çubuk listesi */
.hbars { list-style: none; margin: 0; padding: .4rem 1rem .9rem; }
.hbars li { display: grid; grid-template-columns: minmax(0, 11rem) 1fr 2.2rem; gap: .7rem; align-items: center; padding: .28rem 0; font-size: .88rem; }
.hbars .lbl { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink-2); text-decoration: none; }
a.lbl:hover { color: var(--accent-2); text-decoration: underline; }
.hbars .trk { height: 10px; background: transparent; position: relative; }
.hbars .trk span { position: absolute; inset: 0 auto 0 0; background: var(--series-1); border-radius: 0 4px 4px 0; min-width: 3px; }
.hbars.warn .trk span { background: #d4920f; }
.hbars .n { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }

/* Trend grafiği */
.trend { padding: .6rem 1rem 1rem; }
.trend svg { width: 100%; height: auto; display: block; overflow: visible; }
.trend .axis text { fill: var(--ink-3); font-size: 11px; font-family: var(--font); }
.trend .grid line { stroke: var(--line-2); }
.trend .legend { display: flex; gap: 1.2rem; font-size: .85rem; color: var(--ink-2); margin-bottom: .4rem; }
.trend .legend i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: .4rem; vertical-align: -1px; }
.trend rect.hit { fill: transparent; }
.trend rect.hit:hover { fill: rgba(10, 120, 150, .06); }

/* Liste satırları (panolardaki kısa listeler) */
.items { list-style: none; margin: 0; padding: 0; }
.items li { display: grid; grid-template-columns: auto 1fr auto; gap: .2rem .8rem; padding: .65rem 1rem; border-bottom: 1px solid var(--line-2); align-items: center; }
.items li:last-child { border-bottom: 0; }
.items .who { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.items .what { grid-column: 2 / 3; color: var(--ink-2); font-size: .85rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.seg { display: inline-flex; border: 1px solid var(--line); border-radius: 5px; overflow: hidden; }
.seg a, .seg button { white-space: nowrap; padding: .22rem .65rem; font-size: .82rem; color: var(--ink-2); text-decoration: none; background: #fff; border: 0; border-right: 1px solid var(--line); }
.seg a:last-child, .seg button:last-child { border-right: 0; }
.seg a.on, .seg button.on { background: var(--ink); color: #fff; }

/* Filtre çubuğu */
.filters { display: flex; flex-wrap: wrap; gap: .5rem; align-items: end; padding: .85rem 1rem; border-bottom: 1px solid var(--line-2); }
.filters .form-select, .filters .form-control { font-size: .875rem; padding-top: .3rem; padding-bottom: .3rem; }
.filters-more { display: none; }
.views { display: flex; gap: .35rem; flex-wrap: wrap; margin-bottom: .9rem; }
.views a { padding: .3rem .75rem; border-radius: 16px; border: 1px solid var(--line); background: #fff; color: var(--ink-2);
  text-decoration: none; font-size: .85rem; font-weight: 500; }
.views a:hover { border-color: var(--ink-3); color: var(--ink); }
.views a.on { background: var(--ink); border-color: var(--ink); color: #fff; }
.views a .c { margin-left: .35rem; opacity: .7; font-variant-numeric: tabular-nums; }

/* Hızlı çağrı ekranı */
.call-grid { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 1.25rem; align-items: start; }
.cust-search { position: relative; }
.cust-search input.form-control-lg { font-size: 1.15rem; padding: .7rem 1rem .7rem 2.7rem; border-width: 2px; }
.cust-search > i { position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); font-size: 1.1rem; color: var(--ink-3); }
.ac-list { position: absolute; z-index: 30; left: 0; right: 0; top: calc(100% + 4px); background: #fff; border: 1px solid var(--line);
  border-radius: 6px; box-shadow: 0 10px 28px rgba(20, 34, 42, .14); max-height: 360px; overflow-y: auto; }
.ac-item { padding: .6rem .9rem; cursor: pointer; border-bottom: 1px solid var(--line-2); }
.ac-item:last-child { border-bottom: 0; }
.ac-item.on, .ac-item:hover { background: var(--accent-soft); }
.ac-item b { font-weight: 600; }
.ac-item .m { color: var(--ink-3); font-size: .82rem; }
.ac-item.new b { color: var(--accent-2); }
.cust-card { border-left: 3px solid var(--brand); }
.cust-card dl { display: grid; grid-template-columns: auto 1fr; gap: .25rem .9rem; margin: 0; font-size: .88rem; }
.cust-card dt { color: var(--ink-3); font-weight: 500; }
.cust-card dd { margin: 0; }
.link-choice { display: grid; gap: .4rem; }
.link-choice label { display: grid; grid-template-columns: auto 1fr; gap: .1rem .6rem; padding: .55rem .7rem; border: 1px solid var(--line);
  border-radius: 5px; cursor: pointer; background: #fff; }
.link-choice label:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); }
.link-choice input { margin-top: .25rem; }
.link-choice .t { font-weight: 500; font-size: .9rem; }
.link-choice .s { grid-column: 2; color: var(--ink-2); font-size: .82rem; }
.notice { padding: .6rem .8rem; border-radius: 5px; font-size: .86rem; display: flex; gap: .55rem; align-items: start; }
.notice i { margin-top: .1rem; }
.notice.warn { background: var(--warn-soft); color: #6d4306; }
.notice.info { background: var(--accent-soft); color: var(--accent-2); }
.notice.crit { background: var(--crit-soft); color: #7d1f17; }
.notice.good { background: var(--good-soft); color: #1f5a37; }
.status-pick { display: flex; flex-wrap: wrap; gap: .35rem; }
.status-pick input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.status-pick input:focus-visible + label { outline: 2px solid var(--accent); outline-offset: 2px; }
.status-pick label { padding: .3rem .7rem; border: 1px solid var(--line); border-radius: 5px; font-size: .85rem; cursor: pointer; background: #fff; font-weight: 500; color: var(--ink-2); }
.status-pick input:checked + label { background: var(--ink); color: #fff; border-color: var(--ink); }
.kbd-hint { color: var(--ink-3); font-size: .8rem; }
.kbd-hint kbd { background: var(--line-2); color: var(--ink-2); font-family: var(--font); font-size: .75rem; padding: 1px 5px; border-radius: 3px; }
[data-when] { display: none; }
[data-when].show { display: block; }

/* Kayıt detayı */
.t-head { display: flex; gap: 1rem; align-items: flex-start; margin-bottom: 1.1rem; }
.m-actions { display: none; }
#guncelle, #composer { scroll-margin-top: 5rem; }
.t-head .no { font-family: var(--font-cond); font-weight: 600; color: var(--accent-2); font-size: 1rem; }
.t-head h2 { font-family: var(--font-cond); font-weight: 600; font-size: 1.6rem; margin: .1rem 0 .35rem; line-height: 1.15; }
.t-head .meta { display: flex; flex-wrap: wrap; gap: .4rem 1.1rem; color: var(--ink-2); font-size: .9rem; }
.t-head .meta i { color: var(--ink-3); margin-right: .25rem; }
.t-grid { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 1.25rem; align-items: start; }
.facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-bottom: 1px solid var(--line-2); }
.facts > div { padding: .75rem 1rem; border-right: 1px solid var(--line-2); min-width: 0; }
.facts > div:last-child { border-right: 0; }
.facts .k { color: var(--ink-3); font-size: .78rem; font-weight: 500; }
.facts .v { font-weight: 500; margin-top: .1rem; overflow: hidden; text-overflow: ellipsis; }

.timeline { list-style: none; margin: 0; padding: .5rem 1rem 1rem; position: relative; }
.timeline li { display: grid; grid-template-columns: 28px 1fr; gap: .7rem; padding: .55rem 0; position: relative; }
.timeline li::before { content: ""; position: absolute; left: 13px; top: 2.1rem; bottom: -.6rem; width: 2px; background: var(--line-2); }
.timeline li:last-child::before { display: none; }
.timeline .dot { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--line-2); color: var(--ink-2); font-size: .85rem; position: relative; z-index: 1; }
.timeline .k-call .dot { background: var(--accent-soft); color: var(--accent-2); }
.timeline .k-status .dot { background: var(--plan-soft); color: var(--plan); }
.timeline .k-created .dot { background: var(--ink); color: #fff; }
.timeline .k-note .dot { background: var(--warn-soft); color: var(--warn); }
.timeline .head { font-size: .82rem; color: var(--ink-3); }
.timeline .head b { color: var(--ink-2); font-weight: 600; }
.timeline .body { font-size: .92rem; margin-top: .1rem; white-space: pre-line; }
.timeline .k-field .body { color: var(--ink-2); font-size: .86rem; }

.composer { padding: .8rem 1rem; border-bottom: 1px solid var(--line-2); background: #fafcfc; }
.composer textarea { resize: vertical; min-height: 60px; }
.tabs-mini { display: flex; gap: .2rem; margin-bottom: .5rem; }
.tabs-mini button { border: 0; background: none; padding: .25rem .6rem; border-radius: 4px; font-size: .85rem; color: var(--ink-2); font-weight: 500; }
.tabs-mini button.on { background: var(--ink); color: #fff; }

.side-list { list-style: none; margin: 0; padding: 0; }
.side-list li { padding: .55rem 1rem; border-bottom: 1px solid var(--line-2); font-size: .88rem; }
.side-list li:last-child { border-bottom: 0; }

/* Müşteri kartı */
.subtabs { display: flex; gap: .2rem; border-bottom: 1px solid var(--line); margin-bottom: 1.1rem; }
.subtabs a { padding: .55rem .9rem; color: var(--ink-2); text-decoration: none; font-weight: 500; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.subtabs a.on { color: var(--ink); border-bottom-color: var(--brand); }
.subtabs a .c { color: var(--ink-3); margin-left: .3rem; font-size: .85rem; }
.loc-card { border: 1px solid var(--line); border-radius: var(--radius); background: #fff; margin-bottom: 1rem; }
.loc-card > .head { display: flex; align-items: center; gap: .6rem; padding: .7rem 1rem; border-bottom: 1px solid var(--line-2); }
.loc-card > .head h3 { font-size: 1.02rem; font-weight: 600; margin: 0; }
.eq-row { display: grid; grid-template-columns: 1.4fr 1fr .8fr 1fr auto; gap: .8rem; padding: .55rem 1rem; border-bottom: 1px solid var(--line-2); font-size: .88rem; align-items: center; }
.eq-row:last-child { border-bottom: 0; }
.sec-block { border-top: 1px solid var(--line-2); }
.sec-block:first-of-type { border-top: 0; }
.sec-head { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; padding: .55rem 1rem; background: #f5f8f9; }
.sec-head b { font-weight: 600; }
.sec-block.general .sec-head { background: transparent; border-top: 1px dashed var(--line); }
.sec-note { padding: .3rem 1rem 0 2.35rem; }
.sec-block .eq-row { padding-left: 2.35rem; }
.eq-empty { padding: .45rem 1rem .55rem 2.35rem; }

/* Ürün seçici (katalog) */
.pp { position: relative; }
.pp-box { position: relative; }
.pp-box > .bi { position: absolute; left: .7rem; top: 50%; transform: translateY(-50%); color: var(--ink-3); pointer-events: none; }
.pp-box .pp-q { padding-left: 2rem; }
.pp-list { position: absolute; z-index: 20; left: 0; right: 0; top: calc(100% + 2px); margin: 0; padding: .25rem 0; list-style: none; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 8px 24px rgba(20, 35, 50, .12); max-height: 280px; overflow-y: auto; }
.pp-list li { padding: .4rem .75rem; cursor: pointer; display: flex; flex-direction: column; font-size: .9rem; }
.pp-list li span { font-size: .78rem; color: var(--ink-2); }
.pp-list li.on, .pp-list li:hover { background: var(--accent-soft); }
.pp-list li.pp-none { cursor: default; color: var(--ink-2); font-size: .85rem; }
.pp-list li.pp-none:hover { background: transparent; }
.pp-chosen { display: flex; align-items: center; gap: .5rem; border: 1px solid var(--line); border-radius: var(--radius); padding: .3rem .4rem .3rem .75rem; background: var(--accent-soft); }
.pp-chosen[hidden] { display: none; }
.pp-chosen-text { font-weight: 600; }

/* Taşeronlar */
.area-dot { display: inline-block; width: .62rem; height: .62rem; border-radius: 50%; margin-right: .4rem; vertical-align: .02rem; box-shadow: 0 0 0 1.5px #fff, 0 0 0 2.5px rgba(23, 37, 45, .12); }
.score { display: inline-block; min-width: 2.3rem; text-align: center; font-weight: 600; font-size: .85rem; border-radius: 4px; padding: .08rem .4rem; background: var(--line-2); color: var(--ink-2); font-variant-numeric: tabular-nums; }
.score.good { background: var(--good-soft); color: var(--good); }
.score.warn { background: var(--warn-soft); color: var(--warn); }
.score.crit { background: var(--crit-soft); color: var(--crit); }
.score.big { font-size: 1.6rem; padding: .15rem .6rem; min-width: 4rem; font-family: var(--font-cond); }
.sub-layout { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.sub-map { position: sticky; top: 1rem; height: calc(100vh - 6rem); min-height: 440px; max-height: 820px; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: #e4eaed; z-index: 0; }
.sub-table td { vertical-align: top; }
.sub-table .last-note { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-style: italic; }
.sub-table tr.focus td { background: var(--accent-soft); }
.sub-table a.wa { color: #1f8f4e; }
.leaflet-marker-icon.sub-cluster { display: flex; }
.sub-cluster span { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; line-height: 1; }
.sub-cluster { background: rgba(23, 37, 45, .86); color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: .8rem; border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, .3); }
.sub-pop { font-family: var(--font); font-size: .85rem; line-height: 1.4; display: grid; gap: .2rem; }
.sub-pop .t { font-weight: 600; font-size: .95rem; color: var(--ink); text-decoration: none; }
.sub-pop .t:hover { color: var(--accent-2); text-decoration: underline; }
.sub-pop .m { color: var(--ink-2); }
.sub-pop .n { color: var(--ink-2); font-style: italic; }
.sub-pop .a { color: var(--ink-3); font-size: .75rem; }
.leaflet-container { font-family: var(--font); }
.sub-abroad a { width: auto !important; padding: 0 .6rem; font-size: .78rem; color: var(--ink-2) !important; white-space: nowrap; }
.sub-detail { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.settings-side { width: 260px; }
.kv { display: grid; grid-template-columns: 7rem minmax(0, 1fr); gap: .55rem 1rem; margin: 0; }
.kv dt { color: var(--ink-3); font-weight: 500; font-size: .85rem; padding-top: .15rem; }
.kv dd { margin: 0; overflow-wrap: anywhere; }
.sub-point { height: 260px; z-index: 0; }
.pick-map { height: 360px; border: 1px solid var(--line); border-radius: var(--radius); z-index: 0; cursor: crosshair; }
.pick-status.ok { color: var(--good); }
.pick-status.warn { color: var(--warn); }
.fb-summary { display: flex; gap: 1.5rem; align-items: center; flex-wrap: wrap; border-bottom: 1px solid var(--line-2); }
.fb-avg { display: grid; gap: .2rem; justify-items: start; }
.fb-dist { flex: 1; min-width: 220px; display: grid; gap: .3rem; }
.fb-bar { display: grid; grid-template-columns: 3.6rem 1fr 2rem; gap: .5rem; align-items: center; font-size: .82rem; color: var(--ink-2); }
.fb-bar .track { height: .5rem; background: var(--line-2); border-radius: 3px; overflow: hidden; }
.fb-bar .fill { display: block; height: 100%; }
.fb-bar .fill.good { background: var(--good); }
.fb-bar .fill.warn { background: #d18a1f; }
.fb-bar .fill.crit { background: var(--crit); }
.fb-bar .num { text-align: right; font-variant-numeric: tabular-nums; }
.fb-form { border-bottom: 1px solid var(--line-2); background: #fafcfc; }
.fb-form fieldset { border: 0; padding: 0; margin: 0; }
.score-pick input:checked + label.sp-good { background: var(--good); border-color: var(--good); }
.score-pick input:checked + label.sp-warn { background: var(--warn); border-color: var(--warn); }
.score-pick input:checked + label.sp-crit { background: var(--crit); border-color: var(--crit); }
.stars { color: #d9a31a; font-size: .95rem; letter-spacing: .05rem; }
.score-pick label { min-width: 4.6rem; text-align: center; }
.pager { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; padding: .6rem 1rem; border-top: 1px solid var(--line-2); }
.pager .btn-dark.disabled { opacity: 1; background: var(--ink); border-color: var(--ink); }
.fb-list { list-style: none; margin: 0; padding: 0; }
.fb-list li { display: grid; grid-template-columns: auto 1fr auto; gap: .75rem; padding: .7rem 1rem; border-bottom: 1px solid var(--line-2); align-items: start; }
.fb-list li:last-child { border-bottom: 0; }
.fb-list .score { min-width: 1.9rem; }
.fb-list .meta { margin-top: .15rem; }
@media (max-width: 1100px) {
  .sub-layout, .sub-detail { grid-template-columns: minmax(0, 1fr); }
  .sub-map { position: relative; top: 0; height: 420px; order: -1; }
}

/* Raporlar */
.report-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.stat-table td:first-child { color: var(--ink-2); }
.stat-table a { color: var(--ink); text-decoration: none; }
.stat-table a:hover { color: var(--accent-2); text-decoration: underline; }
.sub { display: block; }
.toolbar { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; margin-bottom: 1rem; }
.toolbar .form-control { width: auto; }
.stat-table td.num { text-align: right; font-weight: 600; }
.cmp { color: var(--ink-3); font-size: .8rem; font-weight: 400; }
.note-box { white-space: pre-line; font-size: .95rem; }

/* Bildirim */
.toast-stack { position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 1080; display: grid; gap: .5rem; }
.toast-msg { background: var(--ink); color: #fff; padding: .7rem 1rem; border-radius: 6px; box-shadow: 0 8px 24px rgba(0,0,0,.2);
  font-size: .9rem; display: flex; gap: .7rem; align-items: center; max-width: 420px; animation: toast-in .25s ease-out; }
.toast-msg a { color: #8fd8ee; font-weight: 600; }
.toast-msg.err { background: var(--crit); }
@keyframes toast-in { from { transform: translateY(8px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .toast-msg { animation: none; } }

/* Giriş */
.login-wrap { min-height: 100vh; display: grid; grid-template-columns: 1fr 1fr; }
.login-side {
  position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; gap: 2rem;
  padding: 3rem 3.5rem; color: var(--rail-ink);
  background:
    radial-gradient(ellipse 70% 55% at 88% 92%, rgba(0,152,216,.22), transparent 70%),
    repeating-linear-gradient(90deg, transparent 0 95px, rgba(255,255,255,.028) 95px 96px),
    linear-gradient(160deg, #2a343d 0%, #323e48 55%, #2c3842 100%);
}
.login-side > * { position: relative; }
.login-art { --art: min(84vh, 50vw); position: absolute !important; width: var(--art); right: calc(var(--art) * -.24); bottom: calc(var(--art) * -.375); pointer-events: none; }
.login-art .c { fill: rgba(255,255,255,.05); }
.login-art .bar { fill: var(--brand); opacity: .55; }
.login-brand { width: 176px; height: auto; display: block; }
.login-copy { max-width: 30rem; }
.login-copy .eyebrow { color: #5cc6f2; font-size: .8rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; margin-bottom: .7rem; }
.login-copy h1 { font-family: var(--font-cond); color: #fff; font-weight: 600; font-size: 3.2rem; line-height: 1; margin: 0 0 1rem; }
.login-copy p { font-size: 1.05rem; line-height: 1.5; margin: 0; max-width: 34ch; }
.login-foot { display: flex; flex-direction: column; gap: .25rem; font-size: .78rem; color: #8396a2; }
.login-form { display: grid; place-items: center; padding: 2rem; background: var(--bg); }
.login-form .card-l { width: min(380px, 100%); }
.login-form h2 { font-family: var(--font-cond); font-weight: 600; font-size: 1.6rem; margin-bottom: 1.2rem; }
.print-brand { display: flex; align-items: center; justify-content: space-between; border-bottom: 2px solid var(--brand); padding-bottom: .5rem; margin-bottom: 1rem; }
.print-brand img { width: 130px; height: auto; }
.print-brand h2 { font-family: var(--font-cond); font-size: 1.3rem; margin: 0; }

@media (max-width: 1200px) {
  .kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .kpi:nth-child(3) { border-right: 0; }
  .kpi:nth-child(-n+3) { border-bottom: 1px solid var(--line-2); }
  .grid-dash, .t-grid, .call-grid, .report-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 860px) {
  /* Telefon kabuğu: yan menü soldan açılan çekmece, altta sabit menü, üstte ince başlık */
  .app { grid-template-columns: minmax(0, 1fr); }
  .rail {
    position: fixed; z-index: 1050; top: 0; bottom: 0; left: 0; width: min(300px, 86vw); height: auto;
    padding-top: env(safe-area-inset-top); padding-bottom: env(safe-area-inset-bottom);
    transform: translateX(-102%); visibility: hidden; transition: transform .22s ease, visibility 0s linear .22s;
  }
  body.nav-open { overflow: hidden; }
  body.nav-open .rail { transform: none; visibility: visible; transition: transform .22s ease; box-shadow: 0 0 40px rgba(0,0,0,.35); }
  .nav-backdrop { display: block; position: fixed; inset: 0; z-index: 1040; background: rgba(20,28,34,.45);
    opacity: 0; pointer-events: none; transition: opacity .2s; }
  body.nav-open .nav-backdrop { opacity: 1; pointer-events: auto; }
  .rail nav a { padding: .68rem .7rem; }
  .rail-cta kbd { display: none; }
  .rail-cta .btn { justify-content: center; padding: .6rem; }
  .rail-user .links { gap: 1.4rem; }
  .rail-user .links a, .rail-user .links button, .rail-install { font-size: .92rem; padding: .25rem 0; }

  .topbar { padding: .55rem max(1rem, env(safe-area-inset-right)) .55rem max(1rem, env(safe-area-inset-left));
    gap: .4rem .6rem; flex-wrap: wrap; }
  .topbar > div:first-child { flex: 1 1 8rem; min-width: 0; }
  .topbar h1 { font-size: 1.22rem; overflow: hidden; text-overflow: ellipsis; }
  .topbar .crumb { font-size: .78rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .topbar .top-actions { margin-left: 0; flex-wrap: wrap; }
  .search-toggle { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; margin-right: -.4rem; border: 0;
    background: none; color: var(--ink-2); font-size: 1.15rem; border-radius: 5px; }
  .search-toggle[aria-expanded="true"] { background: var(--bg); color: var(--ink); }
  .topbar .search { display: none; order: 10; width: 100%; }
  .topbar .search.open { display: block; }
  .content { padding: 1rem max(1rem, env(safe-area-inset-right)) calc(5.5rem + env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left)); }

  .tabbar {
    display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); position: fixed; z-index: 1030; left: 0; right: 0; bottom: 0;
    background: var(--panel); border-top: 1px solid var(--line); padding: 0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
    box-shadow: 0 -4px 16px rgba(20,28,34,.06);
  }
  .tabbar a, .tabbar button {
    position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    min-height: 3.5rem; padding: .35rem .2rem; background: none; border: 0; color: var(--ink-3);
    font-size: .7rem; font-weight: 500; text-decoration: none; line-height: 1.1; -webkit-tap-highlight-color: transparent;
  }
  .tabbar i { font-size: 1.3rem; line-height: 1; }
  .tabbar .active { color: var(--accent-2); box-shadow: inset 0 2px 0 var(--brand); }
  .tabbar .new { color: var(--accent-2); }
  .tabbar .new i { display: grid; place-items: center; width: 2.7rem; height: 1.85rem; border-radius: 1rem; background: var(--accent); color: #fff; font-size: 1.05rem; }
  .tabbar .new.active { box-shadow: none; }
  .tabbar .count { position: absolute; top: .3rem; left: calc(50% + .45rem); min-width: 1.15rem; padding: 0 .3rem; border-radius: 9px;
    background: var(--crit); color: #fff; font-size: .66rem; font-weight: 600; line-height: 1.15rem; text-align: center; }
  .tabbar .count.soft { background: var(--ink-2); }

  .topbar > div:first-child { order: 0; }
  .search-toggle { order: 1; }
  .topbar .top-actions { order: 2; flex: 1 1 100%; }
  .topbar .top-actions:empty { display: none; }
  .topbar .top-actions .btn { white-space: nowrap; }
  .topbar .top-actions .d-flex, .toolbar form { flex-wrap: wrap; }
  .toolbar .form-control { width: auto; min-width: 0; flex: 1 1 8rem; }
  .topbar .search { order: 3; }

  /* Servis kaydı listeleri telefonda kart olarak */
  .table.tcards, .table.tcards tbody { display: block; }
  .table.tcards thead { display: none; }
  .table.tcards tr {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .2rem .75rem; padding: .8rem 1rem;
    grid-template-areas: "no status" "subj subj" "cust cust" "next next" "follow age" "prio assignee";
    border-bottom: 1px solid var(--line-2);
  }
  .table.tcards tbody tr:last-child { border-bottom: 0; }
  .table.tcards > :not(caption) > * > * { padding: 0; border: 0; }
  .table.tcards td:empty { display: none; }
  .table.tcards .c-no { grid-area: no; }
  .table.tcards .c-no .sub { display: inline; margin-left: .45rem; }
  .table.tcards .c-status { grid-area: status; justify-self: end; text-align: right; }
  .table.tcards .c-subj { grid-area: subj; }
  .table.tcards .c-subj .row-link { font-size: 1rem; font-weight: 600; }
  .table.tcards .c-cust { grid-area: cust; }
  .table.tcards .c-next { grid-area: next; margin-top: .2rem; }
  .table.tcards .c-follow { grid-area: follow; align-self: center; }
  .table.tcards .c-age { grid-area: age; justify-self: end; align-self: center; }
  .table.tcards .c-prio { grid-area: prio; }
  .table.tcards .c-assignee { grid-area: assignee; justify-self: end; text-align: right; font-size: .85rem; color: var(--ink-2); }
  .table.tcards td[data-label]::before { content: attr(data-label) ": "; color: var(--ink-3); }
  .table-responsive:has(> .tcards) { overflow: visible; }

  .m-actions { display: flex; gap: .5rem; margin: -.4rem 0 1rem; }
  .m-actions .btn { flex: 1 1 0; padding: .55rem .5rem; white-space: nowrap; }
  .t-head h2 { font-size: 1.4rem; }
  .status-pick label { padding: .45rem .8rem; }
  .loc-card > .head { flex-wrap: wrap; row-gap: .3rem; }
  .panel-head { flex-wrap: wrap; row-gap: .3rem; }
  .content .flex-grow-1 { min-width: 0; }
  .settings-side { width: 100%; }
  .sec-block .eq-row, .sec-note, .eq-empty { padding-left: 1rem; }

  .sub-map { height: 320px; }
  /* Taşeron listesi telefonda kart olarak */
  .sub-table, .sub-table tbody { display: block; }
  .sub-table thead { display: none; }
  .sub-table tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .25rem .75rem; padding: .75rem 1rem;
    grid-template-areas: "firm score" "place map" "phone phone"; border-bottom: 1px solid var(--line-2); }
  .sub-table tbody tr:last-child { border-bottom: 0; }
  .sub-table > :not(caption) > * > * { padding: 0; border: 0; }
  .sub-table td:nth-child(1) { grid-area: firm; }
  .sub-table td:nth-child(1) .row-link { font-weight: 600; font-size: 1rem; }
  .sub-table td:nth-child(2) { grid-area: place; align-self: center; }
  .sub-table td:nth-child(2) .sub { display: inline; margin-left: .35rem; }
  .sub-table td:nth-child(3) { grid-area: phone; white-space: normal !important; }
  .sub-table td:nth-child(3) .d-block { display: inline-block !important; margin: .15rem 1.1rem .1rem 0; font-size: .95rem; }
  .sub-table td:nth-child(4) { grid-area: score; }
  .sub-table td:nth-child(5) { grid-area: map; align-self: center; }
  .table-responsive:has(> .sub-table) { overflow: visible; }

  .subtabs { overflow-x: auto; scrollbar-width: none; }
  .subtabs::-webkit-scrollbar { display: none; }
  .subtabs a { white-space: nowrap; flex: none; padding: .55rem .7rem; }

  .toast-stack { left: 1rem; right: 1rem; bottom: calc(4.6rem + env(safe-area-inset-bottom)); }
  .toast-msg { max-width: none; }
  /* iPhone, 16px'ten küçük yazılı alana dokununca sayfayı büyütür */
  .form-control, .form-select, .filters .form-control, .filters .form-select, .topbar .search input { font-size: 16px; }

  /* Liste filtreleri: arama kutusu + "Filtreler" düğmesi */
  .filters.m-fold:not(.open) > :not(.f-keep):not(.filters-more) { display: none !important; }
  .filters .f-keep { flex: 1 1 10rem !important; min-width: 0 !important; }
  .filters .d-flex > input[type="date"] { flex: 1 1 0; min-width: 0; width: 100%; }
  .filters-more { display: inline-flex; align-items: center; gap: .4rem; align-self: flex-end; padding: .45rem .8rem; border: 1px solid var(--line);
    border-radius: 5px; background: #fff; color: var(--ink-2); font-weight: 500; font-size: .92rem; white-space: nowrap; }
  .filters-more.on { border-color: var(--accent); color: var(--accent-2); background: var(--accent-soft); }
  .filters-more[aria-expanded="true"] { background: var(--ink); border-color: var(--ink); color: #fff; }
  .facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .login-wrap { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .login-side { padding: calc(1.4rem + env(safe-area-inset-top)) 1.5rem 1.6rem; gap: 1.3rem; justify-content: flex-start; }
  .login-art { --art: 280px; }
  .login-brand { width: 132px; }
  .login-copy .eyebrow { font-size: .7rem; margin-bottom: .3rem; }
  .login-copy h1 { font-size: 2.1rem; margin: 0; }
  .login-copy p, .login-foot { display: none; }
  .login-form { place-items: start center; padding: 2rem 1.5rem; }
  .eq-row { grid-template-columns: 1fr 1fr; }
  .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpi { border-right: 0; border-bottom: 1px solid var(--line-2); }
  .kpi .v { font-size: 1.6rem; }
}

@media print {
  .rail, .topbar, .no-print, .toast-stack, .tabbar, .nav-backdrop, .install-help { display: none !important; }
  .app { display: block; }
  body { background: #fff; font-size: 12px; }
  .content { padding: 0; max-width: none; }
  .panel { border-color: #bbb; break-inside: avoid; }
  .report-grid { grid-template-columns: 1fr 1fr; }
  a { color: inherit; text-decoration: none; }
  .print-only { display: block !important; }
}
.print-only { display: none; }
@media print { .print-brand.print-only { display: flex !important; } }