/* app-patches-1.css — potongan dari assets/app.css (dipecah 28 Jul 2026).
   Token warna status + PAINTER STATUS !important (kartu agenda) + patch R3/R5/R9/G3.
   URUTAN <link> di index.html/admin-users.html/observability.html adalah KONTRAK:
   cascade CSS = urutan muat, blok bawah sengaja mengalahkan blok atas.
   Muat setelah app-views.css, sebelum app-patches-2.css. */
/* =========================================================================
   WARNA STATUS KEPUTUSAN - sumber tunggal, paritas app iOS CCTheme.
   Tapping memakai system pink iOS; varian surface diturunkan dari hue yang sama. */
:root{
  --status-approved:#1d4ed8;
  --status-approved-bg:#e3effe;
  --status-approved-border:rgba(29,78,216,.38);
  --status-pending:#a15c07;
  --status-pending-bg:#fef5d2;
  --status-pending-border:rgba(161,92,7,.38);
  --status-rejected:#b42318;
  --status-rejected-bg:#fee8e8;
  --status-rejected-border:rgba(180,35,24,.38);
  --status-delegated:#6d28d9;
  --status-delegated-bg:#f1edfe;
  --status-delegated-border:rgba(109,40,217,.38);
  --status-waiting:#334155;
  --status-waiting-bg:#e7ecf3;
  --status-waiting-border:rgba(51,65,85,.36);
  --status-tapping:#ff2d55;
  --status-tapping-bg:#ffe6eb;
  --status-tapping-border:rgba(255,45,85,.38);
  --status-approved-print:#1d4ed8;
  --status-approved-print-bg:#e3effe;
  --status-pending-print:#a15c07;
  --status-pending-print-bg:#fef5d2;
  --status-rejected-print:#b42318;
  --status-rejected-print-bg:#fee8e8;
  --status-delegated-print:#6d28d9;
  --status-delegated-print-bg:#f1edfe;
  --status-waiting-print:#334155;
  --status-waiting-print-bg:#e7ecf3;
  --status-tapping-print:#ff2d55;
  --status-tapping-print-bg:#ffe6eb;
}
[data-theme="dark"]{
  --status-approved:#bfdbfe;
  --status-approved-bg:rgba(191,219,254,.20);
  --status-approved-border:rgba(191,219,254,.46);
  --status-pending:#fde68a;
  --status-pending-bg:rgba(253,230,138,.20);
  --status-pending-border:rgba(253,230,138,.46);
  --status-rejected:#fecaca;
  --status-rejected-bg:rgba(254,202,202,.20);
  --status-rejected-border:rgba(254,202,202,.46);
  --status-delegated:#ddd6fe;
  --status-delegated-bg:rgba(221,214,254,.20);
  --status-delegated-border:rgba(221,214,254,.46);
  --status-waiting:#cbd5e1;
  --status-waiting-bg:rgba(203,213,225,.20);
  --status-waiting-border:rgba(203,213,225,.46);
  --status-tapping:#ff375f;
  --status-tapping-bg:rgba(255,55,95,.20);
  --status-tapping-border:rgba(255,55,95,.46);
}

/* =========================================================================
   MODE MALAM - STATUS SEMANTIK.
   Lapisan ini ditempatkan paling akhir agar warna status tidak ditimpa lagi
   oleh surface Liquid Glass generik; pemetaan kelas dipakai kedua tema. */
:is(.status-approved,.status-approved-action){
  --status-surface-ink:var(--status-approved);
  --status-surface-bg:var(--status-approved-bg);
  --status-surface-border:var(--status-approved-border);
}
:is(.status-pending,.status-pending-action){
  --status-surface-ink:var(--status-pending);
  --status-surface-bg:var(--status-pending-bg);
  --status-surface-border:var(--status-pending-border);
}
:is(.status-tapping,.status-tapping-action,.tapping-active){
  --status-surface-ink:var(--status-tapping);
  --status-surface-bg:var(--status-tapping-bg);
  --status-surface-border:var(--status-tapping-border);
}
:is(.status-rejected,.status-rejected-action){
  --status-surface-ink:var(--status-rejected);
  --status-surface-bg:var(--status-rejected-bg);
  --status-surface-border:var(--status-rejected-border);
}
:is(.status-delegated,.status-delegated-action){
  --status-surface-ink:var(--status-delegated);
  --status-surface-bg:var(--status-delegated-bg);
  --status-surface-border:var(--status-delegated-border);
}
:is(.status-waiting,.status-waiting-action){
  --status-surface-ink:var(--status-waiting);
  --status-surface-bg:var(--status-waiting-bg);
  --status-surface-border:var(--status-waiting-border);
}
:is(.status-flower,.status-flower-action){
  --status-surface-ink:var(--status-flower);
  --status-surface-bg:var(--status-flower-bg);
  --status-surface-border:var(--status-flower-border);
}
:is(.status-resched,.status-resched-action){
  --status-surface-ink:var(--status-resched);
  --status-surface-bg:var(--status-resched-bg);
  --status-surface-border:var(--status-resched-border);
}

:is(.home-agenda-mini,.home-approval-card,.map-roster-item):is(
  .status-approved,.status-pending,.status-tapping,
  .status-rejected,.status-delegated,.status-waiting,
  .status-flower,.status-resched
){
  border-color:var(--status-surface-border);
  background:color-mix(in srgb, var(--status-surface-bg) 68%, var(--panel));
  box-shadow:inset 4px 0 0 var(--status-surface-ink);
}

@media screen{
  [data-theme="dark"] .pdf-event:is(.status-approved,.status-pending,.status-tapping,.status-rejected,.status-delegated,.status-waiting,.status-flower,.status-resched){
    color:var(--status-surface-ink);
    background:var(--status-surface-bg);
    border-color:var(--status-surface-border);
  }
}

[data-theme="dark"] :is(
  .badge,
  .btn,
  .calendar-pill,
  .calendar-date-event,
  .calendar-day-event,
  .week-agenda-item,
  .agenda-preview-chip,
  .presentation-agenda
):is(
  .status-approved,.status-approved-action,
  .status-pending,.status-pending-action,
  .status-tapping,.status-tapping-action,.tapping-active,
  .status-rejected,.status-rejected-action,
  .status-delegated,.status-delegated-action,
  .status-waiting,.status-waiting-action,
  .status-flower,.status-flower-action,
  .status-resched,.status-resched-action
){
  color:var(--status-surface-ink) !important;
  background:var(--status-surface-bg) !important;
  border-color:var(--status-surface-border) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16);
}

[data-theme="dark"] :is(
  .agenda-card,
  .home-agenda-mini,
  .home-approval-card,
  .map-roster-item
):is(
  .status-approved,.status-pending,.status-tapping,
  .status-rejected,.status-delegated,.status-waiting,
  .status-flower,.status-resched
){
  color:var(--ink) !important;
  border-color:var(--status-surface-border) !important;
  background:
    linear-gradient(145deg,
      color-mix(in srgb, var(--status-surface-bg) 86%, rgba(255,255,255,.1)),
      color-mix(in srgb, var(--status-surface-bg) 72%, rgba(15,23,42,.78))) !important;
  box-shadow:inset 5px 0 0 var(--status-surface-ink), var(--shadow) !important;
}

/* Status generik: readiness, risk, alert kecil, prioritas, dan Tapping. */
[data-theme="dark"] :is(.btn.success,.badge.ok){
  color:var(--success) !important;
  background:var(--success-bg) !important;
  border-color:var(--success-border) !important;
}
[data-theme="dark"] :is(.btn.warn,.badge.warn,.badge.p2,.badge.medium){
  color:var(--warning) !important;
  background:var(--warning-bg) !important;
  border-color:var(--warning-border) !important;
}
[data-theme="dark"] :is(.btn.danger,.badge.danger,.badge.p1,.badge.high){
  color:var(--danger) !important;
  background:var(--danger-bg) !important;
  border-color:var(--danger-border) !important;
}
[data-theme="dark"] :is(.badge.info,.badge.p3){
  color:var(--info) !important;
  background:var(--info-bg) !important;
  border-color:var(--info-border) !important;
}
[data-theme="dark"] .badge.p4{
  color:var(--priority-p4) !important;
  background:var(--priority-p4-bg) !important;
  border-color:var(--priority-p4-border) !important;
}
[data-theme="dark"] .badge.p5{
  color:var(--priority-p5) !important;
  background:var(--priority-p5-bg) !important;
  border-color:var(--priority-p5-border) !important;
}
[data-theme="dark"] .badge.gray{
  color:var(--status-neutral) !important;
  background:var(--status-neutral-bg) !important;
  border-color:var(--status-neutral-border) !important;
}
[data-theme="dark"] .btn.tapping-active{
  color:var(--status-tapping) !important;
  background:var(--status-tapping-bg) !important;
  border-color:var(--status-tapping-border) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16);
}

/* Warna keputusan selalu menjadi surface Kalender; strip kiri tetap menyimpan
   kategori/prioritas tanpa mengambil alih makna status. */
:is(
  .calendar-pill,
  .calendar-date-event,
  .calendar-day-event,
  .week-agenda-item
):is(.status-approved,.status-pending,.status-tapping,.status-rejected,.status-delegated,.status-waiting,.status-flower,.status-resched){
  color:var(--status-surface-ink, var(--agenda-tone-ink)) !important;
  border-color:var(--status-surface-border, var(--agenda-tone-border)) !important;
  background:
    linear-gradient(90deg, var(--agenda-category-strip, #64748b) 0 4px, transparent 4px 100%),
    var(--status-surface-bg, var(--agenda-tone-bg)) !important;
}
.calendar-date-event:is(.status-approved,.status-pending,.status-tapping,.status-rejected,.status-delegated,.status-waiting,.status-flower,.status-resched) time,
.calendar-day-event:is(.status-approved,.status-pending,.status-tapping,.status-rejected,.status-delegated,.status-waiting,.status-flower,.status-resched) .calendar-day-event-time,
.week-agenda-item:is(.status-approved,.status-pending,.status-tapping,.status-rejected,.status-delegated,.status-waiting,.status-flower,.status-resched) .week-agenda-ready{
  color:var(--status-surface-ink, currentColor) !important;
  border-color:var(--status-surface-border, currentColor) !important;
  background:var(--status-surface-bg, var(--panel)) !important;
}

/* Checklist: permukaan kartu ikut berwarna, bukan hanya garis 4px. */
[data-theme="dark"] .check-item.work-item-grid.is-done{
  border-color:var(--state-filled-border) !important;
  box-shadow:inset 4px 0 0 var(--state-filled) !important;
}
[data-theme="dark"] .check-item.work-item-grid.missing{
  border-color:var(--state-missing-border) !important;
  box-shadow:inset 4px 0 0 var(--state-missing) !important;
}
[data-theme="dark"] .check-item.work-item-grid.missing .work-status-cell .badge.warn{
  color:var(--state-missing-label) !important;
  background:var(--state-missing-label-bg) !important;
  border-color:var(--state-missing-border-soft) !important;
}

/* =========================================================================
   CHECKLIST 4 KATEGORI + JUNK M2. Token kategori terpusat; warna komponen
   hanya mengambil token ini agar light/dark selalu konsisten. */
:root{
  --check-menko:#d93a41;
  --check-menko-tint:#fdecee;
  --check-menko-border:rgba(217,58,65,.32);
  --check-substansi:#6e7bff;
  --check-substansi-tint:#eef0ff;
  --check-substansi-border:rgba(110,123,255,.32);
  --check-ops:#0b7361; /* G2: 3.58 -> >=4.6 */
  --check-ops-tint:#e3f6f1;
  --check-ops-border:rgba(14,143,121,.32);
  --check-persidangan-media:#c57e0a;
  --check-persidangan-media-tint:#fcf1dc;
  --check-persidangan-media-border:rgba(197,126,10,.34);
}
[data-theme="dark"]{
  --check-menko:#ff9ca2;
  --check-menko-tint:rgba(217,58,65,.18);
  --check-menko-border:rgba(255,156,162,.42);
  --check-substansi:#b8c0ff;
  --check-substansi-tint:rgba(110,123,255,.18);
  --check-substansi-border:rgba(184,192,255,.42);
  --check-ops:#73dac8;
  --check-ops-tint:rgba(14,143,121,.18);
  --check-ops-border:rgba(115,218,200,.42);
  --check-persidangan-media:#f2bd61;
  --check-persidangan-media-tint:rgba(197,126,10,.2);
  --check-persidangan-media-border:rgba(242,189,97,.44);
}
.checklist-category-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--ui-3);
  align-items:stretch;
}
.checklist-category-column{
  min-width:0;
  margin:0;
  border:1px solid var(--category-border);
  border-radius:22px;
  background:var(--category-tint);
  overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),var(--shadow-soft);
}
.checklist-category-column.menko{--category-color:var(--check-menko);--category-tint:var(--check-menko-tint);--category-border:var(--check-menko-border)}
.checklist-category-column.substansi{--category-color:var(--check-substansi);--category-tint:var(--check-substansi-tint);--category-border:var(--check-substansi-border)}
.checklist-category-column.ops{--category-color:var(--check-ops);--category-tint:var(--check-ops-tint);--category-border:var(--check-ops-border)}
.checklist-category-column.persidangan-media{--category-color:var(--check-persidangan-media);--category-tint:var(--check-persidangan-media-tint);--category-border:var(--check-persidangan-media-border)}
.checklist-category-head{
  min-height:52px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  gap:var(--ui-2);
  align-items:center;
  padding:var(--ui-25) var(--ui-3);
  color:var(--category-color);
  cursor:pointer;
  list-style:none;
  font-size:var(--fs-label);
  font-weight:950;
  text-transform:uppercase;
}
.checklist-category-head::-webkit-details-marker{display:none}
.checklist-category-head em{
  border:1px solid currentColor;
  border-radius:var(--ui-r-pill);
  padding:3px 6px;
  font-size:9px;
  font-style:normal;
  letter-spacing:.04em;
}
.checklist-category-head strong{
  display:grid;
  place-items:center;
  min-width:36px;
  min-height:28px;
  border-radius:var(--radius-control);
  background:color-mix(in srgb,var(--category-color) 12%,var(--panel));
}
.checklist-category-items{display:grid;gap:var(--ui-2);padding:0 var(--ui-2) var(--ui-2)}
.checklist-category-column .detail-brief-result-row{
  grid-template-columns:1fr !important;
  height:196px !important;
  min-height:196px !important;
  gap:var(--ui-15);
  align-items:start;
  align-content:start;
  padding:var(--ui-25);
  overflow:hidden !important;
  background:color-mix(in srgb,var(--panel) 92%,transparent) !important;
}
.checklist-category-column .detail-brief-result-title,
.checklist-category-column .detail-brief-result-value,
.checklist-category-column .detail-brief-result-owner{min-width:0}
.checklist-category-column .detail-brief-result-owner{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--ui-05)}
.checklist-category-column .detail-brief-chip{justify-self:start}
.checklist-category-persidangan{
  border:1px solid var(--category-border);
  border-radius:var(--radius-inner);
  background:color-mix(in srgb,var(--panel) 90%,transparent);
  overflow:hidden;
}
.checklist-category-persidangan > summary,
.checklist-category-popup-group-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--ui-2);
  padding:var(--ui-25);
  color:var(--check-ops);
  font-size:var(--fs-label);
  font-weight:900;
  cursor:pointer;
  list-style:none;
}
.checklist-category-persidangan > summary::-webkit-details-marker{display:none}
.checklist-category-persidangan-body,.checklist-category-sublist{display:grid;gap:var(--ui-15);padding:0 var(--ui-2) var(--ui-2)}
.checklist-category-subrow{display:flex;justify-content:space-between;gap:var(--ui-2);align-items:center;padding:var(--ui-2);border-radius:12px;background:var(--check-ops-tint);font-size:var(--fs-label)}
.checklist-category-open-item{border:0;background:transparent;color:var(--check-ops);font:inherit;font-weight:900}
.checklist-category-empty{color:var(--muted)}
.checklist-category-chips{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--ui-2);margin-top:10px}
.checklist-category-chip{
  min-width:0;
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:var(--ui-15);
  border:1px solid var(--chip-border);
  border-radius:var(--radius-control);
  padding:7px 9px;
  background:var(--chip-tint);
  color:var(--chip-color);
  font:inherit;
  font-size:var(--fs-label);
  font-weight:850;
}
.checklist-category-chip.menko{--chip-color:var(--check-menko);--chip-tint:var(--check-menko-tint);--chip-border:var(--check-menko-border)}
.checklist-category-chip.substansi{--chip-color:var(--check-substansi);--chip-tint:var(--check-substansi-tint);--chip-border:var(--check-substansi-border)}
.checklist-category-chip.ops{--chip-color:var(--check-ops);--chip-tint:var(--check-ops-tint);--chip-border:var(--check-ops-border)}
.checklist-category-chip.persidangan-media{--chip-color:var(--check-persidangan-media);--chip-tint:var(--check-persidangan-media-tint);--chip-border:var(--check-persidangan-media-border)}
.checklist-category-chip strong{font-variant-numeric:tabular-nums;white-space:nowrap}
.checklist-category-dot{width:7px;height:7px;border-radius:50%;background:currentColor;flex:0 0 auto}
#checklistCategoryModal{z-index:252}
.checklist-category-modal{width:min(680px,100%);max-height:min(82dvh,760px);overflow:hidden;display:flex;flex-direction:column}
.checklist-category-popup-list{display:grid;gap:var(--ui-2);min-height:0;overflow:auto;padding:var(--ui-05)}
.checklist-category-popup-item{
  width:100%;
  min-height:58px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:var(--ui-25);
  align-items:center;
  border:1px solid var(--line);
  border-radius:var(--radius-inner);
  padding:9px 11px;
  background:var(--panel);
  color:var(--ink);
  text-align:left;
}
.checklist-category-popup-item > span:first-child{display:grid;gap:3px;min-width:0}
.checklist-category-popup-item strong{font-size:var(--fs-body);overflow-wrap:anywhere}
.checklist-category-popup-item small{color:var(--muted);font-size:var(--fs-caption)}
.checklist-category-popup-item.is-empty{opacity:.64}
.checklist-category-popup-action{border:0;background:transparent;color:var(--accent);font:inherit;font-size:var(--fs-label);font-weight:900;white-space:nowrap}
.checklist-category-popup-group{display:grid;gap:var(--ui-15);border:1px solid var(--check-ops-border);border-radius:18px;padding:var(--ui-15);background:var(--check-ops-tint)}
.menko-version-history{margin-top:7px;border:1px solid var(--check-menko-border);border-radius:var(--radius-control);background:var(--check-menko-tint);overflow:hidden}
.menko-version-history > summary{padding:9px 10px;color:var(--check-menko);font-size:var(--fs-label);font-weight:900;cursor:pointer}
.menko-version-history > div{display:grid;gap:var(--ui-15);padding:0 7px 7px}
.menko-version-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--ui-2);align-items:center;padding:7px;border-radius:11px;background:var(--panel)}
.menko-version-row span{display:grid;gap:var(--ui-05);min-width:0}.menko-version-row small{color:var(--muted);font-size:10px}.menko-version-row .btn{min-height:32px;padding:var(--ui-15) var(--ui-2);font-size:var(--fs-caption)}
.junk-tools-card{grid-column:1/-1}
.junk-tools-head{display:flex;justify-content:space-between;gap:var(--ui-3);align-items:start}.junk-tools-head h3{margin:0 0 5px}.junk-tools-head p{margin:0}
.junk-tools-filters{display:grid;grid-template-columns:minmax(0,1fr) minmax(130px,.3fr);gap:var(--ui-2);margin-top:12px}
.junk-tools-filters input,.junk-tools-filters select{min-height:44px;border:1px solid var(--line);border-radius:var(--radius-control);padding:var(--ui-2) var(--ui-25);background:var(--bg);color:var(--ink)}
.junk-tools-list{display:grid;gap:var(--ui-2);margin-top:10px}
.junk-tools-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:var(--ui-25);align-items:center;border:1px solid var(--line);border-radius:var(--radius-inner);padding:var(--ui-25);background:color-mix(in srgb,var(--panel) 90%,var(--bg))}
.junk-tools-row > div{display:grid;gap:3px;min-width:0}.junk-tools-row strong{font-size:var(--fs-body);overflow-wrap:anywhere}.junk-tools-row small{color:var(--muted);font-size:var(--fs-caption)}
/* Arsip isian lama (read-only) — memunculkan isi item checklist "retired" agenda lama */
.legacy-archive{margin-top:14px;border:1px solid var(--border,#e2e8f0);border-radius:var(--radius-control);background:rgba(148,163,184,.06);overflow:hidden}
.legacy-archive>summary{cursor:pointer;list-style:none;padding:11px 14px;font-weight:var(--fw-bold);font-size:var(--fs-body);color:#475569;user-select:none}
.legacy-archive>summary::-webkit-details-marker{display:none}
.legacy-archive[open]>summary{border-bottom:1px solid var(--border,#e2e8f0)}
.legacy-archive-note{margin:10px 14px 4px;font-size:var(--fs-label);color:#64748b}
.legacy-archive-list{display:grid;gap:var(--ui-2);padding:6px 14px 14px}
.legacy-archive-item{padding:9px 11px;border-radius:var(--radius-chip);background:#fff;border:1px solid var(--border,#e8edf5)}
.legacy-archive-item>strong{display:block;font-size:var(--fs-body);color:#334155;margin-bottom:3px}
.legacy-archive-text{white-space:pre-wrap;overflow-wrap:anywhere;font-size:var(--fs-body);color:#0f172a}
.legacy-archive-files,.legacy-archive-links{margin-top:6px;display:flex;flex-wrap:wrap;gap:var(--ui-15)}
@media(max-width:1100px){.checklist-category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.checklist-category-column{height:auto}}
@media(max-width:680px){
  .checklist-category-grid{grid-template-columns:1fr}
  .checklist-category-chips{gap:5px}.checklist-category-chip{min-height:42px;padding:6px 5px;font-size:var(--fs-caption);gap:var(--ui-1)}
  .checklist-category-modal{max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 16px)}
  .junk-tools-filters,.junk-tools-row{grid-template-columns:1fr}.junk-tools-row .badge,.junk-tools-row .btn{justify-self:start}
	.home-operational-summary-grid{grid-template-columns:1fr}
	.operational-format-row{grid-template-columns:1fr}
	.operational-entry-fields{grid-template-columns:1fr}
	.operational-photo-strip{grid-template-columns:1fr}
	.operational-entry-actions{justify-content:stretch}
	.operational-entry-actions .btn{flex:1 1 132px}
}

/* RBAC 3-tingkat: panel "Disposisi ke Admin" di Detail Agenda (khusus Super Admin) */
.detail-disposisi .detail-disposisi-hint{margin:.35em 0 .6em;font-size:.86rem;opacity:.72;line-height:1.45}
.detail-disposisi .detail-disposisi-current{margin:.2em 0 .6em;font-size:.9rem}
.detail-disposisi .detail-disposisi-current .btn{margin-left:8px}
.detail-disposisi .detail-disposisi-row{display:flex;gap:var(--ui-2);flex-wrap:wrap;align-items:center}
.detail-disposisi .detail-disposisi-input{flex:1 1 200px;min-width:160px;padding:8px 11px;border-radius:8px;border:1px solid var(--border,#d5d9e2);background:var(--surface,#fff);color:inherit;font:inherit}

/* RBAC 3-tingkat: tombol + modal "Buat Agenda" scoped (Admin) */
.scoped-create-row{margin-top:10px}
.scoped-create-form{display:flex;flex-direction:column;gap:13px;padding:var(--ui-1) var(--ui-05) var(--ui-05)}
.scoped-create-form label{display:flex;flex-direction:column;gap:5px;font-size:.82rem;font-weight:var(--fw-medium);opacity:.9}
.scoped-create-form .req{color:#c0392b;font-weight:var(--fw-bold)}
.scoped-create-form input{padding:9px 11px;border-radius:8px;border:1px solid var(--border,#d5d9e2);background:var(--surface,#fff);color:inherit;font:inherit;font-weight:400}
.scoped-create-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--ui-25)}
.scoped-create-actions{display:flex;justify-content:flex-end;gap:var(--ui-2);margin-top:6px}
@media (max-width:520px){.scoped-create-grid{grid-template-columns:1fr}}

/* ===== R9 (2026-07-16): kerapian komponen R3/R4/R5 — light & dark via var token ===== */
/* R3: daftar lampiran-banyak kartu seragam — susun rapi, spasi konsisten. */
.work-result-cell .work-link-preview + .work-link-preview{margin-top:6px}
.work-result-cell .work-link-preview.is-missing{opacity:.85}
/* R3: daftar lampiran BERSAMAAN di reader hasil checklist (di luar iframe). */
.link-reader-attachments{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:var(--ui-2);
  margin:2px 0 10px;
  padding:var(--ui-25) var(--ui-3);
  border:1px solid var(--line,#e2e8f0);
  border-radius:var(--radius-control);
  background:var(--panel,#fff);
}
.link-reader-attachments-title{
  font-size:var(--fs-label);
  font-weight:850;
  letter-spacing:.02em;
  text-transform:uppercase;
  color:var(--muted,#64748b);
  margin-right:2px;
}
.link-reader-attachments .btn{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* R5: bar Tunjuk Petugas Massal di atas checklist Mode Kerjakan. */
.work-bulk-category-bar{
  grid-column:1 / -1;                 /* bentang penuh DI ATAS kartu kategori (grid 4 kolom) */
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:var(--ui-2) var(--ui-3);
  margin:0 0 4px;
  padding:9px 12px;
  border:1px solid var(--line,#e2e8f0);
  border-radius:12px;
  background:color-mix(in srgb, var(--panel,#fff) 94%, transparent);
}
.work-bulk-category-bar .btn{flex:0 0 auto;white-space:nowrap}
.work-bulk-category-bar .muted{flex:1 1 220px;min-width:0;font-size:var(--fs-label);line-height:var(--lh-snug)}
/* R5: sheet Tunjuk Petugas Massal. */
#bulkDelegateModal{z-index:254}
.bulk-delegate-modal{width:min(760px,calc(100vw - 32px));max-height:min(90dvh,800px);display:flex;flex-direction:column}
.bulk-delegate-body{display:grid;gap:16px;min-height:0;overflow:auto;padding:2px 4px 4px}
.bulk-delegate-cats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-auto-rows:1fr;
  gap:8px;
  align-items:stretch;
}
.bulk-delegate-cat{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  min-width:0;
  min-height:72px;
  height:100%;
  padding:8px 6px;
  border:1.5px solid var(--chip-border,var(--line,#e2e8f0));
  border-radius:14px;
  background:var(--chip-tint,var(--panel,#fff));
  color:var(--chip-color,var(--ink,#0f172a));
  font:inherit;
  font-size:12px;
  font-weight:850;
  cursor:pointer;
  transition:transform .12s ease, box-shadow .12s ease;
}
.bulk-delegate-cat strong{font-variant-numeric:tabular-nums}
.bulk-delegate-cat small{font-size:11px;font-weight:700;opacity:.78}
.bulk-delegate-cat.menko{--chip-color:var(--check-menko);--chip-tint:var(--check-menko-tint);--chip-border:var(--check-menko-border)}
.bulk-delegate-cat.substansi{--chip-color:var(--check-substansi);--chip-tint:var(--check-substansi-tint);--chip-border:var(--check-substansi-border)}
.bulk-delegate-cat.ops{--chip-color:var(--check-ops);--chip-tint:var(--check-ops-tint);--chip-border:var(--check-ops-border)}
.bulk-delegate-cat.persidangan-media{--chip-color:var(--check-persidangan-media);--chip-tint:var(--check-persidangan-media-tint);--chip-border:var(--check-persidangan-media-border)}
.bulk-delegate-cat.is-active{box-shadow:0 0 0 2px var(--chip-color,var(--accent,#0f172a)) inset;transform:translateY(-1px)}
.bulk-delegate-cat:disabled,.bulk-delegate-select-all:has(input:disabled){cursor:wait}
.bulk-delegate-section{display:grid;gap:10px;min-width:0}
.bulk-delegate-section h4{margin:0;color:var(--ink,#0f172a)}
.bulk-delegate-section-head,.bulk-delegate-recipient-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;min-width:0}
.bulk-delegate-recipient-head p{margin:0;font-size:12px;color:var(--muted,#64748b)}
.bulk-delegate-select-all{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:44px;
  margin:0;
  padding:0 4px;
  color:var(--ink,#0f172a);
  font-size:13px;
  font-weight:750;
  cursor:pointer;
}
.bulk-delegate-select-all input,.bulk-delegate-item>input{
  appearance:auto;
  width:18px;
  min-width:18px;
  height:18px;
  min-height:18px;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  accent-color:var(--accent,#0a84ff);
}
.bulk-delegate-count{margin:0;font-size:13px;color:var(--muted,#64748b)}
.bulk-delegate-count strong{color:var(--ink,#0f172a);font-variant-numeric:tabular-nums}
.bulk-delegate-items{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-auto-rows:1fr;
  gap:10px;
  align-items:stretch;
}
.bulk-delegate-item{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:start;
  gap:10px;
  min-width:0;
  min-height:86px;
  height:100%;
  margin:0;
  padding:12px;
  border:1px solid var(--line,#e2e8f0);
  border-radius:14px;
  background:color-mix(in srgb,var(--panel,#fff) 96%,var(--accent,#0a84ff) 4%);
  color:var(--ink,#0f172a);
  cursor:pointer;
}
.bulk-delegate-item.is-selected{box-shadow:0 0 0 2px var(--accent,#0a84ff) inset}
.bulk-delegate-item.is-unavailable{opacity:.68;cursor:not-allowed;background:var(--soft,#f1f5f9)}
.bulk-delegate-item-copy{display:flex;flex-direction:column;justify-content:space-between;gap:10px;min-width:0;height:100%}
.bulk-delegate-item-copy>strong{overflow-wrap:anywhere}
.bulk-delegate-item-meta{display:flex;align-items:center;gap:6px 8px;flex-wrap:wrap;min-width:0}
.bulk-delegate-item-meta small{color:var(--muted,#64748b);overflow-wrap:anywhere}
.bulk-delegate-warning{min-height:18px;margin:0;color:var(--danger,#b42318);font-size:12px;font-weight:750}
.bulk-delegate-actions{
  position:sticky;
  z-index:2;
  bottom:-4px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:0;
  padding:12px 0 2px;
  border-top:1px solid var(--line,#e2e8f0);
  background:var(--panel,#fff);
}
.bulk-delegate-actions>p{flex:1 1 280px;min-width:0;margin:0;color:var(--muted,#64748b);font-size:13px}
.bulk-delegate-actions>div{display:flex;justify-content:flex-end;gap:8px;flex:0 0 auto}
@media (max-width:620px){
  .bulk-delegate-cats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bulk-delegate-items{grid-template-columns:1fr}
  .bulk-delegate-actions{align-items:stretch;flex-direction:column}
  .bulk-delegate-actions>p{flex:0 1 auto}
  .bulk-delegate-actions>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
  .bulk-delegate-actions .btn{width:100%}
}
@media (max-width:420px){
  .bulk-delegate-modal{width:calc(100vw - 16px)}
  .bulk-delegate-cat{min-height:68px}
}

/* ===== G3 (2026-07-16): disposisi multi-admin + inline-edit Rangkuman ===== */
/* Chips penerima (bar Tunjuk massal + panel disposisi Detail) */
.assign-chips{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0}
.assign-chip{
  display:inline-flex;align-items:center;gap:6px;
  padding:var(--ui-1) var(--ui-2);border-radius:var(--ui-r-pill);font-size:12.5px;
  border:1px solid var(--line);
  background:color-mix(in srgb, var(--accent, #0a84ff) 12%, transparent);
  color:var(--ink,#0f172a);
}
.assign-chip button{
  appearance:none;border:0;background:transparent;cursor:pointer;
  font-size:14px;line-height:1;padding:0 var(--ui-05);color:inherit;opacity:.7;
}
.assign-chip button:hover,.assign-chip button:focus-visible{opacity:1}
.detail-disposisi-list{list-style:none;margin:6px 0;padding:0;display:grid;gap:var(--ui-1)}
.detail-disposisi-list li{display:flex;align-items:center;gap:var(--ui-2);flex-wrap:wrap;font-size:var(--fs-body)}
.detail-disposisi-note{color:var(--muted,#64748b);font-size:var(--fs-label)}

/* Inline-edit Rangkuman: tile jadi field DI TEMPAT (Edit -> Simpan/Batal) */
.detail-brief-editbtn{margin-left:6px}
.detail-brief-tile-editing{display:flex;flex-direction:column;gap:var(--ui-15)}
.detail-brief-input,
.detail-brief-tile-editing .detail-brief-select{
  width:100%;min-width:0;font:inherit;font-size:var(--ctrl-fs);
  padding:var(--field-pad-sm);border-radius:var(--radius-control); /* G3: isian seradius tombol */
  border:1px solid var(--line);
  background:var(--panel,#fff);color:var(--ink,#0f172a);
}
.detail-brief-input:focus-visible,
.detail-brief-tile-editing .detail-brief-select:focus-visible{
  outline:2px solid var(--accent,#0a84ff);outline-offset:1px;
}
.detail-brief-time-pair{display:flex;align-items:center;gap:var(--ui-15)}
.detail-brief-time-pair span{color:var(--muted,#64748b)}
.detail-brief-time-pair .detail-brief-input{flex:1 1 0}
.detail-brief-pick{margin-top:2px;font-size:12.5px;color:var(--muted,#64748b)}
.detail-brief-grid-editing .detail-brief-tile{background:color-mix(in srgb, var(--accent,#0a84ff) 5%, var(--panel,#fff))}

/* ===== G3c (2026-07-16): date-only + multi-date + textarea di grid edit ===== */
.detail-brief-textarea{width:100%;min-width:0;resize:vertical;line-height:1.4;font-family:inherit}
.detail-brief-dateonly{display:flex;align-items:center;gap:7px;margin-top:6px;font-size:12.5px;color:var(--muted,#64748b);cursor:pointer}
.detail-brief-dateonly input{width:16px;height:16px;flex:0 0 auto}
/* RENTANG TANGGAL (4 Sep 2026): baris gaya Google [tgl][jam] – [jam][tgl]; tiap tepi
   pasangan tanggal+jam yang tak boleh terpisah; tile-nya span 2 kolom. Sempit -> tepi
   turun baris (flex-wrap), pasangan tetap utuh. (Aturan .detail-brief-multidate dihapus.) */
.detail-brief-rentang-baris{flex-wrap:wrap}
.detail-brief-rentang-tepi{display:flex;align-items:center;gap:var(--ui-15);flex:1 1 15em;min-width:0}
.detail-brief-rentang-tepi .detail-brief-input[type="date"]{flex:1 1 9.5em;min-width:8.5em}
.detail-brief-rentang-tepi .detail-brief-input[data-time24]{flex:0 1 5.5em;min-width:4.5em}
.detail-brief-input:disabled{opacity:.5;cursor:not-allowed}

/* G3c: mode EDIT grid — auto-flow 2 kolom (bukan named-areas read-only), agar tile
   tambahan (blok tanggal, objective, rekomendasi, tapping) tidak saling menimpa. */
.detail-brief-grid-editing{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  grid-template-areas:none !important;
  grid-auto-flow:row;
}
.detail-brief-grid-editing > .detail-brief-tile{grid-area:auto !important}
.detail-brief-grid-editing > .detail-brief-tile-full{grid-column:1 / -1 !important}
.detail-brief-grid-editing > .detail-brief-tile-span2{grid-column:1 / -1 !important}
.detail-brief-folder-fields{display:contents}
.detail-brief-folder-fields > .detail-brief-tile{grid-area:auto !important}
.detail-brief-folder-fields > .detail-brief-tile-full,
.detail-brief-folder-fields > .detail-brief-tile-span2{grid-column:1 / -1 !important}
.detail-brief-folder-fields[hidden],
[data-checklist-workspace][hidden]{display:none !important}
@media (max-width:640px){
  .detail-brief-grid-editing{grid-template-columns:1fr !important}
  .detail-brief-grid-editing > .detail-brief-tile,
  .detail-brief-folder-fields > .detail-brief-tile{grid-column:1 / -1 !important}
}

/* Google Places location field: same input, one shared suggestion surface. */
.location-autocomplete{position:relative;width:100%;min-width:0;display:flex;flex-direction:column;gap:var(--ui-1)}
.location-autocomplete > input{width:100%}
.location-autocomplete-status{
  display:block;min-height:1.15em;color:var(--muted,#64748b);
  font-size:11.5px;font-weight:var(--fw-medium);line-height:1.25;
}
.location-autocomplete-status:empty{display:none}
.location-autocomplete-status[data-tone="verified"]{color:var(--success,#047857);font-weight:var(--fw-heavy)}
.location-autocomplete-status[data-tone="internal"]{color:var(--teal,#0f766e);font-weight:var(--fw-heavy)}
.location-autocomplete-status[data-tone="manual"]{color:var(--muted,#64748b);font-weight:var(--fw-bold)}
.location-autocomplete-status[data-tone="notice"]{color:var(--warning,#a15c07)}
.location-autocomplete-list{
  position:fixed;z-index:420;display:flex;flex-direction:column;overflow:auto;
  padding:var(--ui-15);border:1px solid var(--line,#d5d9e2);border-radius:12px;
  background:var(--bg,#fff);color:var(--ink,#0f172a);
  box-shadow:0 18px 48px rgba(15,23,42,.22);
  overscroll-behavior:contain;
}
.location-autocomplete-list[hidden]{display:none}
.location-autocomplete-option{
  appearance:none;width:100%;min-height:44px;display:flex;flex-direction:column;
  align-items:flex-start;justify-content:center;gap:var(--ui-05);padding:var(--ui-2) var(--ui-25);
  border:0;border-radius:9px;background:transparent;color:inherit;text-align:left;
  font:inherit;cursor:pointer;
}
.location-autocomplete-heading{width:100%;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:var(--ui-2)}
.location-autocomplete-heading strong{min-width:0;overflow-wrap:anywhere}
.location-autocomplete-source{
  flex:0 0 auto;padding:var(--ui-05) var(--ui-15);border:1px solid var(--line,#d5d9e2);border-radius:var(--ui-r-pill);
  color:var(--muted,#64748b);background:var(--panel,#fff);font-size:9px;font-weight:var(--fw-heavy);
  line-height:var(--lh-tight);text-transform:uppercase;
}
.location-autocomplete-option.source-internal .location-autocomplete-source{
  border-color:color-mix(in srgb, var(--teal,#0f766e) 38%, var(--line,#d5d9e2));
  color:var(--teal,#0f766e);background:color-mix(in srgb, var(--teal,#0f766e) 9%, var(--panel,#fff));
}
.location-autocomplete-option.source-manual .location-autocomplete-source{color:var(--ink,#0f172a)}
.location-autocomplete-option.source-register{
  margin-top:2px;border-top:1px solid var(--line,#d5d9e2);border-radius:0 0 9px 9px;
}
.location-autocomplete-option strong{font-size:var(--fs-body);line-height:1.25}
.location-autocomplete-option span{font-size:11.5px;line-height:1.25;color:var(--muted,#64748b)}
.location-autocomplete-option:hover,
.location-autocomplete-option.active,
.location-autocomplete-option[aria-selected="true"]{background:var(--accent-soft,rgba(59,130,246,.1))}
.location-autocomplete-attribution{
  padding:var(--ui-15) var(--ui-25) var(--ui-05);border-top:1px solid var(--line,#d5d9e2);
  color:#5e5e5e;font-family:Roboto,Arial,sans-serif;font-size:var(--fs-label);font-style:normal;
  font-weight:400;letter-spacing:normal;line-height:1.25;white-space:nowrap;text-align:right;
}
[data-theme="dark"] .location-autocomplete-attribution{color:#fff}

/* Master lokasi internal tetap satu alur dengan field Lokasi yang ada. */
body.location-master-open{overflow:hidden}
.location-master-backdrop{
  z-index:560;align-items:center;justify-content:center;
  padding:max(12px,env(safe-area-inset-top,0px)) max(12px,env(safe-area-inset-right,0px))
    max(12px,env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px));
}
.location-master-modal{
  width:min(100%,620px);max-width:min(620px,calc(100vw - 24px));
  max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 24px);
  display:flex;flex-direction:column;overflow:hidden;border-radius:22px;
  background:var(--panel,#fff) !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;
}
.location-master-modal .modal-head{
  flex:0 0 auto;margin:0;padding:0 0 var(--ui-3);background:var(--panel,#fff);
}
.location-master-modal .modal-head p{margin:4px 0 0;font-size:var(--fs-label);line-height:var(--lh-snug)}
.location-master-form{display:flex;min-height:0;flex-direction:column;gap:var(--ui-3);overflow:auto;padding-top:var(--ui-3)}
.location-master-form label{display:flex;flex-direction:column;gap:var(--ui-15);color:var(--ink,#0f172a);font-size:var(--fs-label);font-weight:var(--fw-heavy)}
.location-master-form input,
.location-master-form textarea{
  width:100%;min-height:44px;padding:var(--ui-25) var(--ui-3);border:1px solid var(--line,#d5d9e2);border-radius:12px;
  background:var(--bg,#fff);color:var(--ink,#0f172a);font:inherit;font-weight:500;line-height:var(--lh-snug);
}
.location-master-form textarea{min-height:76px;resize:vertical}
.location-master-form input:focus-visible,
.location-master-form textarea:focus-visible{outline:2px solid var(--accent,#0a84ff);outline-offset:1px}
.location-master-split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--ui-3)}
.location-master-venue{position:relative}
.location-master-venue-results{
  max-height:210px;overflow:auto;padding:5px;border:1px solid var(--line,#d5d9e2);border-radius:12px;
  background:var(--panel,#fff);box-shadow:0 16px 36px rgba(15,23,42,.18);
}
.location-master-venue-results[hidden]{display:none}
.location-master-venue-results button{
  width:100%;min-height:44px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
  gap:var(--ui-05);padding:var(--ui-2) var(--ui-25);border:0;border-radius:9px;background:transparent;color:var(--ink,#0f172a);
  text-align:left;font:inherit;cursor:pointer;
}
.location-master-venue-results button:hover,
.location-master-venue-results button:focus-visible{background:var(--accent-soft,rgba(59,130,246,.1));outline:0}
.location-master-venue-results button strong{font-size:var(--fs-body)}
.location-master-venue-results button span{color:var(--muted,#64748b);font-size:11.5px}
.location-master-message{min-height:1.2em;margin:0;color:var(--muted,#64748b);font-size:var(--fs-label);font-weight:var(--fw-bold)}
.location-master-message[data-tone="verified"]{color:var(--success,#047857)}
.location-master-message[data-tone="notice"]{color:var(--danger,#b42318)}
.location-master-form .actions{
  position:sticky;bottom:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--ui-2);margin:0;padding-top:var(--ui-1);background:var(--panel,#fff)
}
.location-master-form .actions .btn{min-width:0;white-space:normal}
@media (max-width:640px){
  .location-autocomplete-list{z-index:520;border-radius:12px}
  .location-autocomplete-option{min-height:48px}
  .location-master-backdrop{align-items:flex-start}
  .location-master-modal{
    width:calc(100vw - 16px);max-width:calc(100vw - 16px);
    border-radius:18px;padding:13px
  }
  .location-master-split{grid-template-columns:1fr}
}

/* ===== Peta Operasional Agenda — ruang kerja penuh, terscope hanya ke Tab Peta ===== */
body.map-view-active{
  background:
    radial-gradient(circle at 82% 7%, color-mix(in srgb,var(--accent) 13%,transparent), transparent 34%),
    radial-gradient(circle at 7% 62%, color-mix(in srgb,var(--success) 9%,transparent), transparent 32%),
    var(--bg);
}
body.map-view-active .app{max-width:none}
body.map-view-active main{
  width:100%;
  max-width:none;
  padding:12px clamp(12px,2vw,30px) calc(108px + var(--safe-bottom));
}
body.map-view-active .grid.stats[aria-label="Ringkasan"]{display:none}
#view-map.map-command-view{margin:0;min-width:0}
#view-map .map-command-shell{
  position:relative;
  min-height:calc(100dvh - 122px - var(--safe-bottom));
  overflow:hidden;
  padding:clamp(16px,1.7vw,26px);
  border:1px solid color-mix(in srgb,var(--line) 80%,transparent);
  border-radius:30px;
  /* Orb dekoratif dipindah ke lapisan background (fix artefak kotak di sudut —
     lihat catatan .cc-shell). */
  background:
    radial-gradient(circle 212px at calc(100% - 40px) -35px, color-mix(in srgb,var(--accent) 12%,transparent) 0 98%, transparent 100%),
    linear-gradient(148deg,color-mix(in srgb,var(--panel) 96%,transparent),color-mix(in srgb,var(--accent-soft) 28%,var(--panel)));
  box-shadow:
    0 28px 70px rgba(15,23,42,.12),
    inset 0 1px 0 rgba(255,255,255,.72);
}
#view-map .map-command-header{
  position:relative;
  z-index:1;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:var(--ui-6);
}
#view-map .map-command-heading{min-width:0}
#view-map .map-command-kicker{
  display:flex;
  align-items:center;
  gap:var(--ui-2);
  margin:0 0 7px;
  color:var(--accent);
  font-size:var(--fs-caption);
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
#view-map .map-command-kicker span{
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--success);
  box-shadow:0 0 0 5px color-mix(in srgb,var(--success) 15%,transparent);
  animation:map-live-pulse 2.2s ease-in-out infinite;
}
@keyframes map-live-pulse{
  0%,100%{box-shadow:0 0 0 5px color-mix(in srgb,var(--success) 15%,transparent)}
  50%{box-shadow:0 0 0 9px color-mix(in srgb,var(--success) 4%,transparent)}
}
#view-map .map-command-heading h2{
  margin:0;
  color:var(--ink);
  font-size:clamp(26px,3vw,42px);
  line-height:1.02;
  letter-spacing:-.055em;
}
#view-map .map-command-heading > p:last-child{
  max-width:690px;
  margin:9px 0 0;
  color:var(--muted);
  font-size:var(--fs-body);
  line-height:1.45;
}
#view-map .map-command-date{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:var(--ui-25);
  flex:0 0 auto;
}
#view-map .map-command-date #officialMapFocus{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  padding:0 13px;
  border-color:color-mix(in srgb,var(--accent) 24%,var(--line));
  background:color-mix(in srgb,var(--accent-soft) 52%,var(--panel));
}
#view-map .map-day-controls{width:auto;flex-wrap:nowrap}
#view-map .map-day-controls .btn{min-height:42px;margin:0}
#view-map #todayOfficialMapDayBtn{min-width:96px}

#view-map .map-command-toolbar{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--ui-3);
  margin-top:14px; /* ritme antar-section seragam 14 (toolbar→KPI→workspace→trip-watch) */
}
#view-map .map-command-search{
  min-width:240px;
  max-width:520px;
  flex:1 1 420px;
  min-height:42px; /* = --ui-ctrl-h; sejajar tombol tanggal & filter-group (3+36+3) */
  display:flex;
  align-items:center;
  gap:9px;
  padding:0 14px;
  border:1px solid var(--line);
  border-radius:var(--radius-inner);
  background:color-mix(in srgb,var(--panel) 88%,transparent);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.62);
}
#view-map .map-command-search > span{color:var(--muted);font-size:20px;line-height:1}
#view-map .map-command-search input{
  width:100%;
  min-width:0;
  min-height:0; /* batalkan tinggi bawaan input global (44) — tinggi baris dipegang kontainer (42) */
  height:auto;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:var(--ink);
  font:inherit;
  font-size:var(--fs-body);
}
#view-map .map-command-search:focus-within{
  border-color:color-mix(in srgb,var(--accent) 58%,var(--line));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 12%,transparent);
}
#view-map .map-filter-group{
  display:flex;
  align-items:center;
  gap:5px;
  padding:var(--ui-05); /* border-box: 2+36+2+border 2 = 42, rata dgn search & tombol tanggal */
  overflow-x:auto;
  border:1px solid var(--line);
  border-radius:var(--radius-inner);
  background:color-mix(in srgb,var(--panel) 78%,transparent);
}
#view-map .map-filter-btn{
  min-height:36px;
  flex:0 0 auto;
  padding:0 var(--ui-3);
  border:0;
  border-radius:12px;
  background:transparent;
  color:var(--muted);
  font:inherit;
  font-size:var(--fs-label);
  font-weight:var(--fw-heavy);
  cursor:pointer;
}
#view-map .map-filter-btn:hover{color:var(--ink);background:color-mix(in srgb,var(--accent-soft) 35%,transparent)}
#view-map .map-filter-btn.active{
  background:var(--ink);
  color:var(--panel);
  box-shadow:0 6px 16px rgba(15,23,42,.15);
}

#view-map .map-command-metrics{
  position:relative;
  z-index:1;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:var(--ui-25);
  margin:14px 0;
}
#view-map .map-command-metrics .map-metric{
  min-height:88px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:14px; /* simetris (dulu 13px 14px) */
  border-radius:18px;
  background:color-mix(in srgb,var(--panel) 86%,transparent);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.62);
}
#view-map .map-command-metrics .map-metric.attention{
  border-color:color-mix(in srgb,var(--warning) 34%,var(--line));
  background:color-mix(in srgb,var(--status-pending-bg) 28%,var(--panel));
}
#view-map .map-command-metrics .map-metric span{
  color:var(--muted);
  font-size:10px;
  font-weight:850;
  letter-spacing:.05em;
  text-transform:uppercase;
}
#view-map .map-command-metrics .map-metric strong{
  margin:3px 0 1px;
  color:var(--ink);
  font-size:24px; /* titik skala (25 nilai yatim) */
  line-height:1;
}
#view-map .map-command-metrics .map-metric small{
  color:var(--muted);
  font-size:10px;
  line-height:1.25;
}

#view-map .map-command-workspace{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1fr) clamp(340px,25vw,420px);
  gap:14px;
  align-items:stretch;
}
#view-map .map-command-canvas,
#view-map .map-command-rail,
#view-map .map-trip-watch{
  min-width:0;
  border:1px solid var(--line);
  border-radius:24px;
  background:color-mix(in srgb,var(--panel) 90%,transparent);
  box-shadow:0 18px 42px rgba(15,23,42,.08),inset 0 1px 0 rgba(255,255,255,.7);
}
#view-map .map-command-canvas{padding:14px} /* padding panel seragam 14 (canvas=rail=trip-watch) */
#view-map .map-canvas-head{
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--ui-4);
  padding:0 var(--ui-05) var(--ui-25); /* indent mikro seragam 2px dgn rail-head */
}
#view-map .map-canvas-head > div:first-child{min-width:0}
#view-map .map-canvas-head > div:first-child span{
  display:block;
  margin-bottom:2px;
  color:var(--muted);
  font-size:10px;
  font-weight:850;
  letter-spacing:.07em;
  text-transform:uppercase;
}
#view-map .map-canvas-head > div:first-child strong{
  display:block;
  max-width:62vw;
  overflow:hidden;
  color:var(--ink);
  font-size:var(--fs-title);
  text-overflow:ellipsis;
  white-space:nowrap;
}
#view-map .map-quality-legend{display:flex;align-items:center;gap:var(--ui-25);flex:0 0 auto}
#view-map .map-quality-legend span{display:flex;align-items:center;gap:5px;color:var(--muted);font-size:10px;font-weight:750}
#view-map .map-quality-legend i{width:7px;height:7px;border-radius:50%;background:var(--warning)}
#view-map .map-quality-legend i.verified{background:var(--success)}
#view-map .map-quality-legend i.unknown{background:var(--danger)}

#view-map .official-map-stage{
  min-height:clamp(480px,58dvh,720px);
  height:clamp(480px,58dvh,720px);
  border-radius:18px; /* skala radius: 30 shell / 24 panel / 18 kartu / 16 input / 14 chip (19 yatim) */
  background:color-mix(in srgb,var(--accent-soft) 18%,var(--bg));
  isolation:isolate;
}
/* B-04: state loading iframe Maps — teks halus di belakang; tertutup begitu tile termuat.
   Digerbang :has(.google-map-frame) agar TIDAK muncul di belakang .map-stage-empty. */
#view-map .official-map-stage:has(.google-map-frame)::before{
  content:"Memuat peta…";
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--muted);
  font-size:var(--fs-label);
  font-weight:750;
  letter-spacing:.02em;
}
#view-map .google-map-frame{opacity:.96;filter:saturate(.78) contrast(1.03)}
#view-map .google-map-shade{
  z-index:1;
  background:
    linear-gradient(180deg,rgba(9,18,32,.16),transparent 24%,transparent 70%,rgba(9,18,32,.25)),
    radial-gradient(circle at 50% 48%,transparent 34%,rgba(9,18,32,.08) 100%);
}
#view-map .map-stage-location{
  position:absolute;
  z-index:3;
  top:14px;
  left:14px;
  max-width:min(440px,calc(100% - 150px));
  display:grid;
  gap:var(--ui-05);
  padding:12px 14px;
  border:1px solid rgba(255,255,255,.74);
  border-radius:var(--radius-inner);
  background:rgba(255,255,255,.84);
  color:#0f172a;
  box-shadow:0 14px 34px rgba(15,23,42,.16);
  backdrop-filter:blur(18px) saturate(145%);
  -webkit-backdrop-filter:blur(18px) saturate(145%);
}
#view-map .map-stage-location > span{
  width:max-content;
  max-width:100%;
  color:#047857;
  font-size:9px;
  font-weight:900;
  letter-spacing:.07em;
  text-transform:uppercase;
}
#view-map .map-stage-location > span.quality-inferred{color:#a15c07}
#view-map .map-stage-location > span.quality-unknown{color:#b42318}
#view-map .map-stage-location strong{overflow:hidden;font-size:var(--fs-title);text-overflow:ellipsis;white-space:nowrap}
#view-map .map-stage-location small{overflow:hidden;color:#64748b;font-size:10px;text-overflow:ellipsis;white-space:nowrap}
#view-map .google-map-link{
  z-index:4;
  top:14px;
  right:14px;
  bottom:auto;
  left:auto;
  min-height:40px;
  display:inline-flex;
  align-items:center;
}
#view-map .map-location-strip{
  position:absolute;
  z-index:4;
  right:14px; /* offset overlay stage seragam 14 (= stage-location & google-map-link) */
  bottom:14px;
  left:14px;
  display:flex;
  gap:7px;
  overflow-x:auto;
  padding:3px 2px;
  scrollbar-width:none;
}
#view-map .map-location-strip::-webkit-scrollbar{display:none}
#view-map .map-location-chip{
  min-width:126px;
  max-width:188px;
  min-height:50px;
  flex:0 0 auto;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:var(--ui-2);
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.76);
  border-radius:var(--radius-control);
  background:rgba(255,255,255,.82);
  color:#0f172a;
  box-shadow:0 10px 25px rgba(15,23,42,.14);
  text-align:left;
  cursor:pointer;
  backdrop-filter:blur(18px) saturate(145%);
  -webkit-backdrop-filter:blur(18px) saturate(145%);
}
#view-map .map-location-chip > span{font-size:10px;font-weight:900}
#view-map .map-location-chip > strong{overflow:hidden;font-size:var(--fs-caption);line-height:var(--lh-tight);text-overflow:ellipsis;white-space:nowrap}
#view-map .map-location-chip::before{content:"";width:6px;height:6px;border-radius:50%;background:#f59e0b;grid-row:1 / span 2}
#view-map .map-location-chip.quality-exact::before,
#view-map .map-location-chip.quality-internal::before{background:#10b981}
#view-map .map-location-chip.quality-unknown::before{background:#ef4444}
#view-map .map-location-chip.active{
  border-color:rgba(15,23,42,.78);
  background:rgba(15,23,42,.9);
  color:#fff;
  transform:translateY(-2px);
}
#view-map .map-stage-empty{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:30px;
  color:var(--muted);
  text-align:center;
}
#view-map .map-stage-empty > span{font-size:40px;color:var(--accent)}
#view-map .map-stage-empty strong{color:var(--ink);font-size:17px}
#view-map .map-stage-empty p{max-width:340px;margin:0;font-size:var(--fs-label);line-height:1.45}
#view-map .map-load-status{
  position:absolute;
  top:12px;
  left:12px;
  z-index:3;
  padding:7px 10px;
  border:1px solid color-mix(in srgb,var(--line) 80%,transparent);
  border-radius:var(--ui-r-pill);
  background:color-mix(in srgb,var(--panel) 88%,transparent);
  color:var(--ink);
  font-size:var(--fs-label);
  font-weight:var(--fw-bold);
}
#view-map .map-stage-fallback{overflow:auto;justify-content:flex-start;padding-top:var(--ui-6)}
#view-map .map-fallback-list{display:grid;gap:7px;width:min(100%,520px);margin-top:4px;text-align:left}
#view-map .map-fallback-list .map-roster-item{width:100%;text-align:left}
#view-map .map-fallback-list .map-roster-item small{display:block;margin-top:4px;color:var(--muted)}

#view-map .map-movement-summary{margin-top:10px}
#view-map .map-movement-route{
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(220px,.6fr);
  gap:14px;
  padding:14px; /* simetris */
  border:1px solid var(--line);
  border-radius:18px; /* skala radius (17 yatim) */
  background:color-mix(in srgb,var(--bg) 62%,var(--panel));
}
#view-map .map-movement-label{
  display:block;
  margin-bottom:9px;
  color:var(--muted);
  font-size:9px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
#view-map .map-route-points{position:relative;display:grid;gap:9px}
#view-map .map-route-points::before{
  content:"";
  position:absolute;
  top:12px;
  bottom:12px;
  left:5px;
  width:1px;
  background:var(--line);
}
#view-map .map-route-points > div{position:relative;z-index:1;display:grid;grid-template-columns:12px minmax(0,1fr);gap:var(--ui-2);align-items:center}
#view-map .map-route-points i{width:11px;height:11px;border:3px solid var(--panel);border-radius:50%;background:var(--muted);box-shadow:0 0 0 1px var(--line)}
#view-map .map-route-points i.destination{background:var(--accent)}
#view-map .map-route-points span{min-width:0}
#view-map .map-route-points small{display:block;color:var(--muted);font-size:9px}
#view-map .map-route-points strong{display:block;overflow:hidden;color:var(--ink);font-size:var(--fs-caption);text-overflow:ellipsis;white-space:nowrap}
#view-map .map-movement-facts{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}
#view-map .map-movement-facts > span,
#view-map .map-movement-facts > a{
  min-height:30px;
  display:inline-flex;
  align-items:center;
  padding:0 9px;
  border:1px solid var(--line);
  border-radius:var(--ui-r-pill);
  background:var(--panel);
  color:var(--ink);
  font-size:10px;
  font-weight:var(--fw-heavy);
  text-decoration:none;
}
#view-map .map-movement-facts > span.danger{border-color:var(--status-rejected-border);background:var(--status-rejected-bg);color:var(--danger)}
#view-map .map-movement-facts > a{border-color:color-mix(in srgb,var(--accent) 32%,var(--line));color:var(--accent)}
#view-map .map-movement-facts > small{max-width:170px;color:var(--muted);font-size:9px;line-height:1.3;text-align:right}
#view-map :is(.map-filter-btn,.map-location-chip,.map-timeline-select,.map-detail-btn,.map-roster-item,.map-day-controls .btn,.map-brief-actions .btn,.google-map-link,.map-movement-facts > a):focus-visible{
  outline:3px solid color-mix(in srgb,var(--accent) 48%,transparent);
  outline-offset:2px;
}
#view-map .map-route-note{margin:6px 4px 0;color:var(--muted);font-size:10px;line-height:var(--lh-snug)} /* normalisasi font fraksional */

#view-map .map-command-rail{
  /* 232 = 228 lama + 4 (padding canvas 12→14 menambah tinggi kolom kiri 2×2px)
     agar dasar rail tetap flush dgn dasar canvas. */
  height:calc(clamp(480px,58dvh,720px) + 232px);
  max-height:calc(clamp(480px,58dvh,720px) + 232px);
  display:flex;
  flex-direction:column;
  padding:14px;
  overflow:hidden;
}
#view-map .map-rail-head{
  flex:0 0 auto;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:var(--ui-25);
  padding:var(--ui-05) var(--ui-05) var(--ui-25); /* ritme bawah head seragam 10 dgn canvas-head */
}
#view-map .map-rail-head span:first-child{
  display:block;
  color:var(--muted);
  font-size:9px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
#view-map .map-rail-head h3{margin:3px 0 0;color:var(--ink);font-size:var(--fs-heading);letter-spacing:-.03em}
#view-map .map-rail-count{
  flex:0 0 auto;
  padding:5px 8px;
  border-radius:var(--ui-r-pill);
  background:var(--accent-soft);
  color:var(--accent);
  font-size:10px;
  font-weight:850;
}
#view-map .map-selected-brief{flex:0 0 auto}
#view-map .map-brief-card{
  display:grid;
  gap:var(--ui-25);
  padding:13px;
  border:1px solid color-mix(in srgb,var(--accent) 26%,var(--line));
  border-radius:18px;
  background:
    linear-gradient(150deg,color-mix(in srgb,var(--accent-soft) 35%,var(--panel)),var(--panel));
}
#view-map .map-brief-top{display:grid;grid-template-columns:minmax(0,1fr) 56px;gap:var(--ui-25);align-items:start}
#view-map .map-brief-top > div:first-child{min-width:0}
#view-map .map-brief-top > div:first-child span{display:block;color:var(--accent);font-size:var(--fs-caption);font-weight:900}
#view-map .map-brief-top > div:first-child strong{
  display:-webkit-box;
  margin-top:3px;
  overflow:hidden;
  color:var(--ink);
  font-size:14px;
  line-height:1.28;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
#view-map .map-readiness{
  width:54px;
  height:54px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:
    radial-gradient(circle closest-side,var(--panel) 74%,transparent 76% 99%),
    conic-gradient(var(--success) calc(var(--map-ready) * 1%),color-mix(in srgb,var(--line) 65%,transparent) 0);
}
#view-map .map-readiness span{color:var(--ink);font-size:var(--fs-caption);font-weight:900;line-height:1}
#view-map .map-readiness small{margin-top:2px;color:var(--muted);font-size:8px}
#view-map .map-brief-badges{display:flex;gap:5px;overflow-x:auto;scrollbar-width:none}
#view-map .map-brief-badges::-webkit-scrollbar{display:none}
#view-map .map-brief-badges .badge{flex:0 0 auto;font-size:9px}
#view-map .map-brief-data{display:grid;gap:var(--ui-15);margin:0}
#view-map .map-brief-data > div{display:grid;grid-template-columns:68px minmax(0,1fr);gap:var(--ui-2)}
#view-map .map-brief-data dt{color:var(--muted);font-size:9px;font-weight:850;text-transform:uppercase}
#view-map .map-brief-data dd{margin:0;overflow:hidden;color:var(--ink);font-size:var(--fs-caption);line-height:1.3;text-overflow:ellipsis;white-space:nowrap} /* normalisasi 10.5→11 */
#view-map .map-brief-alert{
  display:grid;
  gap:var(--ui-05);
  padding:8px 9px;
  border:1px solid var(--status-pending-border);
  border-radius:12px;
  background:color-mix(in srgb,var(--status-pending-bg) 38%,var(--panel));
}
#view-map .map-brief-alert strong{color:var(--warning);font-size:9px;text-transform:uppercase}
#view-map .map-brief-alert span{color:var(--ink);font-size:10px;line-height:1.3}
#view-map .map-brief-actions{display:grid;grid-template-columns:1fr auto;gap:7px}
#view-map .map-brief-actions .btn{min-height:38px;display:inline-flex;align-items:center;justify-content:center;padding:0 11px;font-size:10px;text-decoration:none}
#view-map .map-brief-empty{padding:18px;border:1px dashed var(--line);border-radius:var(--radius-inner);color:var(--muted);font-size:var(--fs-caption);text-align:center}

#view-map .official-map-roster{
  min-height:0;
  max-height:none;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  gap:var(--ui-2);
  margin-top:10px;
  padding:0 var(--ui-05) 0 0; /* indent mikro seragam 2px */
  overflow:auto;
}
#view-map .map-timeline-item{
  flex:0 0 auto;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius-inner);
  background:color-mix(in srgb,var(--bg) 56%,var(--panel));
  transition:border-color .16s ease,transform .16s ease,background .16s ease;
}
#view-map .map-timeline-item:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--accent) 30%,var(--line))}
#view-map .map-timeline-item.selected{
  border-color:color-mix(in srgb,var(--accent) 54%,var(--line));
  background:color-mix(in srgb,var(--accent-soft) 32%,var(--panel));
  box-shadow:inset 3px 0 0 var(--accent);
}
#view-map .map-timeline-select{
  width:100%;
  display:grid;
  grid-template-columns:52px minmax(0,1fr);
  gap:9px;
  padding:10px 10px 7px;
  border:0;
  background:transparent;
  color:inherit;
  text-align:left;
  cursor:pointer;
}
#view-map .map-timeline-time{
  position:relative;
  display:flex;
  align-items:center;
  gap:var(--ui-15);
  color:var(--ink);
  font-size:var(--fs-label);
  font-weight:900;
  font-variant-numeric:tabular-nums;
}
#view-map .map-timeline-time i{width:7px;height:7px;border-radius:50%;background:var(--muted)}
#view-map .map-timeline-time i.live{background:var(--success);box-shadow:0 0 0 4px color-mix(in srgb,var(--success) 13%,transparent)}
#view-map .map-timeline-time i.next{background:var(--accent)}
#view-map .map-timeline-time i.tbc{background:var(--warning)}
#view-map .map-timeline-copy{min-width:0}
#view-map .map-timeline-moment{display:block;margin-bottom:2px;color:var(--muted);font-size:9px;font-weight:900;letter-spacing:.05em;text-transform:uppercase} /* normalisasi 8.5→9 */
#view-map .map-timeline-moment.live{color:var(--success)}
#view-map .map-timeline-moment.next{color:var(--accent)}
#view-map .map-timeline-copy strong{
  display:block;
  overflow:hidden;
  color:var(--ink);
  font-size:var(--fs-caption); /* normalisasi 11.5→11 */
  line-height:1.25;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#view-map .map-timeline-copy small{
  display:block;
  margin-top:3px;
  overflow:hidden;
  color:var(--muted);
  font-size:10px; /* normalisasi 9.5→10 */
  text-overflow:ellipsis;
  white-space:nowrap;
}
#view-map .map-timeline-foot{
  display:flex;
  align-items:center;
  gap:var(--ui-15);
  padding:0 9px 8px 71px; /* 71 = 10 (pad kiri select) + 52 (kolom jam) + 9 (gap) — jaga sinkron dgn grid select */
  color:var(--muted);
  font-size:9px; /* normalisasi 8.5→9 */
}
#view-map .map-quality-pill{
  max-width:120px;
  overflow:hidden;
  padding:3px 6px;
  border-radius:var(--ui-r-pill);
  background:color-mix(in srgb,var(--warning) 11%,transparent);
  color:var(--warning);
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#view-map .map-quality-pill.quality-exact,
#view-map .map-quality-pill.quality-internal{background:color-mix(in srgb,var(--success) 11%,transparent);color:var(--success)}
#view-map .map-quality-pill.quality-unknown{background:color-mix(in srgb,var(--danger) 10%,transparent);color:var(--danger)}
#view-map .map-attention-note{min-width:0;flex:1;overflow:hidden;color:var(--warning);text-overflow:ellipsis;white-space:nowrap}
#view-map .map-detail-btn{
  min-height:28px;
  margin-left:auto;
  padding:0 var(--ui-2);
  border:1px solid var(--line);
  border-radius:9px;
  background:var(--panel);
  color:var(--ink);
  font:inherit;
  font-size:9px;
  font-weight:850;
  cursor:pointer;
}
#view-map .map-roster-empty{display:grid;gap:5px;padding:24px 14px;border:1px dashed var(--line);border-radius:var(--radius-inner);text-align:center}
#view-map .map-roster-empty strong{color:var(--ink);font-size:var(--fs-label)}
#view-map .map-roster-empty span{color:var(--muted);font-size:10px}

#view-map .map-trip-watch{
  position:relative;
  z-index:1;
  margin-top:14px;
  padding:14px; /* padding panel seragam 14 */
}
#view-map .map-trip-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--ui-3);margin-bottom:11px}
#view-map .map-trip-head p{margin:0;color:var(--accent);font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
#view-map .map-trip-head h3{margin:3px 0 0;color:var(--ink);font-size:17px}
#view-map .map-trip-head > span{color:var(--muted);font-size:10px}
#view-map #mapTripSummary{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--ui-25);margin:0}
#view-map #mapTripSummary > .card{border:1px solid var(--line);border-radius:18px;background:color-mix(in srgb,var(--bg) 44%,var(--panel));box-shadow:none} /* radius skala + gantikan inline style box-shadow di template JS */
#view-map #mapTripSummary .section-head{margin:0 0 9px}
#view-map #mapTripSummary .section-head h2{font-size:var(--fs-body)}
#view-map #mapTripSummary .section-head p{font-size:9px}
#view-map #mapTripSummary .map-roster-item{border-radius:var(--radius-control);padding:9px} /* 13→14 selaras chip */
#view-map #mapTripSummary .map-roster-item strong{font-size:var(--fs-caption)}
#view-map #mapTripSummary .map-roster-item p{font-size:10px}

[data-theme="dark"] #view-map .map-command-shell{
  background:
    radial-gradient(circle 212px at calc(100% - 40px) -35px, color-mix(in srgb,var(--accent) 12%,transparent) 0 98%, transparent 100%),
    linear-gradient(150deg,rgba(52,62,66,.94),rgba(43,52,56,.96));
  box-shadow:0 28px 80px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.06);
}
[data-theme="dark"] #view-map .map-command-canvas,
[data-theme="dark"] #view-map .map-command-rail,
[data-theme="dark"] #view-map .map-trip-watch{background:rgba(16,27,43,.82);box-shadow:0 18px 42px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.04)}
[data-theme="dark"] #view-map .map-command-search,
[data-theme="dark"] #view-map .map-filter-group,
[data-theme="dark"] #view-map .map-command-metrics .map-metric{box-shadow:inset 0 1px 0 rgba(255,255,255,.035)}
[data-theme="dark"] #view-map .google-map-frame{filter:saturate(.68) brightness(.78) contrast(1.08)}

@media (max-width:1180px){
  #view-map .map-command-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
  #view-map .map-command-workspace{grid-template-columns:minmax(0,1fr) minmax(310px,35vw)}
}
@media (max-width:980px){
  #view-map .map-command-header{align-items:flex-start}
  #view-map .map-command-toolbar{align-items:stretch;flex-direction:column}
  #view-map .map-command-search{max-width:none;flex-basis:auto}
  #view-map .map-filter-group{width:100%}
  #view-map .map-command-workspace{grid-template-columns:1fr}
  #view-map .map-command-rail{height:auto;max-height:none}
  #view-map .official-map-roster{max-height:520px}
}
@media (max-width:680px){
  body.map-view-active main{padding:8px 8px calc(96px + var(--safe-bottom))}
  #view-map .map-command-shell{
    min-height:calc(100dvh - 104px - var(--safe-bottom));
    padding:14px;
    border-radius:23px;
  }
  #view-map .map-command-header{display:grid;gap:14px}
  #view-map .map-command-heading h2{font-size:28px}
  #view-map .map-command-date{width:100%;display:grid;grid-template-columns:1fr}
  #view-map .map-command-date #officialMapFocus{justify-content:center}
  #view-map .map-day-controls{width:100%;display:grid;grid-template-columns:42px minmax(0,1fr) 42px} /* = --ui-ctrl-h, konsisten dgn lapisan konsolidasi */
  #view-map #todayOfficialMapDayBtn{width:100%}
  #view-map .map-command-toolbar{margin-top:14px}
  #view-map .map-command-search{min-width:0}
  #view-map .map-filter-group{justify-content:flex-start}
  #view-map .map-command-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  #view-map .map-command-metrics .map-metric{min-height:78px;padding:11px}
  #view-map .map-command-canvas,
  #view-map .map-command-rail,
  #view-map .map-trip-watch{border-radius:18px} /* skala radius (19 yatim) */
  #view-map .map-canvas-head{align-items:flex-start}
  #view-map .map-quality-legend{display:none}
  #view-map .map-canvas-head > div:first-child strong{max-width:78vw}
  #view-map .official-map-stage{min-height:390px;height:48dvh;max-height:470px;border-radius:var(--radius-inner)}
  #view-map .map-stage-location{right:12px;max-width:none}
  #view-map .google-map-link{top:92px;right:12px}
  #view-map .map-location-strip{bottom:10px}
  #view-map .map-movement-route{grid-template-columns:1fr}
  #view-map .map-movement-facts{justify-content:flex-start}
  #view-map .map-movement-facts > small{max-width:none;text-align:left}
  #view-map .map-command-rail{padding:var(--ui-3)}
  #view-map .official-map-roster{max-height:480px}
  #view-map #mapTripSummary{grid-template-columns:1fr}
  #view-map .map-trip-head{align-items:flex-start;flex-direction:column}
  #view-map .map-brief-actions{grid-template-columns:1fr}
  #view-map .map-timeline-foot{padding-left:var(--ui-25)}
}
@media (prefers-reduced-motion:reduce){
  #view-map .map-command-kicker span{animation:none}
  #view-map .map-location-chip,
  #view-map .map-timeline-item{transition:none}
}
#view-map :is(.map-filter-btn,.map-location-chip,.map-timeline-select,.map-detail-btn):focus-visible{
  outline:3px solid color-mix(in srgb,var(--accent) 48%,transparent);
  outline-offset:2px;
}

/* ============================================================================
   COMMAND SHELL KIT (Fase 0, 18 Jul 2026) — kiblat UI/UX Tab Peta utk SEMUA tab.
   Ekstraksi view-agnostic dari blok "Peta Operasional Agenda" di atas. Blok Peta
   SENGAJA tidak disentuh (nol regresi); tab lain mengadopsi kit ini per fase.

   CARA ADOPSI SATU TAB (contoh Home):
   1. app.js: tambahkan nama view ke WIDE_LAYOUT_VIEWS (dekat toggle
      map-view-active) -> body.wide-view-active otomatis melebarkan main.
   2. index.html: bungkus isi view dgn <section class="cc-shell"> + header pola
      kicker/judul/subtitle (.cc-shell-header/.cc-kicker/.cc-subtitle).
   3. Pindahkan kontrol ke .cc-toolbar (.cc-search/.cc-filter-group/.cc-filter-btn),
      angka ringkasan ke .cc-metrics/.cc-metric, kartu konten ke .cc-panel.
   4. JANGAN mengubah id/data-* yang dipakai JS — kit hanya class visual.

   Skala baku (sama dgn Peta): radius 30 shell / 24 panel / 18 kartu / 16 input /
   14 chip / 12 kecil; ritme antar-section 14px; tinggi kontrol 42px; padding
   panel 14px. Breakpoint: 1180 / 980 / 680.
   ========================================================================== */

/* --- Layar lebar generik: di-drive JS via WIDE_LAYOUT_VIEWS -> body.wide-view-active.
       Saat view=map, body membawa map-view-active DAN wide-view-active dgn nilai
       identik -> tidak ada perubahan visual. Penyembunyian elemen (mis. stats
       Ringkasan) adalah keputusan PER-VIEW, bukan kit. --- */
body.wide-view-active{
  background:
    radial-gradient(circle at 82% 7%, color-mix(in srgb,var(--accent) 13%,transparent), transparent 34%),
    radial-gradient(circle at 7% 62%, color-mix(in srgb,var(--success) 9%,transparent), transparent 32%),
    var(--bg);
}
body.wide-view-active .app{max-width:none}
body.wide-view-active main{
  width:100%;
  max-width:none;
  padding:12px clamp(12px,2vw,30px) calc(108px + var(--safe-bottom));
}

/* --- Shell besar (bingkai satu tab) --- */
.cc-shell{
  position:relative;
  overflow:hidden;
  padding:clamp(16px,1.7vw,26px);
  border:1px solid color-mix(in srgb,var(--line) 80%,transparent);
  border-radius:30px;
  /* Orb dekoratif = LAPISAN radial-gradient background (bukan ::before + blur).
     Pseudo-element ber-filter bisa di-composite tanpa border-radius di sudut
     (artefak KOTAK abu di pojok shell) — background selalu terpotong radius. */
  background:
    radial-gradient(circle 212px at calc(100% - 40px) -35px, color-mix(in srgb,var(--accent) 12%,transparent) 0 98%, transparent 100%),
    linear-gradient(148deg,color-mix(in srgb,var(--panel) 96%,transparent),color-mix(in srgb,var(--accent-soft) 28%,var(--panel)));
  box-shadow:
    0 28px 70px rgba(15,23,42,.12),
    inset 0 1px 0 rgba(255,255,255,.72);
}
.cc-shell > *{position:relative;z-index:1}

/* --- Header shell: kicker + judul + subtitle, aksi kanan --- */
.cc-shell-header{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:var(--ui-6);
}
.cc-shell-heading{min-width:0}
.cc-kicker{
  display:flex;
  align-items:center;
  gap:var(--ui-2);
  margin:0 0 7px;
  color:var(--accent);
  font-size:var(--fs-caption);
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.cc-kicker > i{
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--success);
  box-shadow:0 0 0 5px color-mix(in srgb,var(--success) 15%,transparent);
  animation:cc-live-pulse 2.2s ease-in-out infinite;
}
@keyframes cc-live-pulse{
  0%,100%{box-shadow:0 0 0 5px color-mix(in srgb,var(--success) 15%,transparent)}
  50%{box-shadow:0 0 0 9px color-mix(in srgb,var(--success) 4%,transparent)}
}
.cc-shell-heading h2{
  margin:0;
  color:var(--ink);
  font-size:clamp(26px,3vw,42px);
  line-height:1.02;
  letter-spacing:-.055em;
}
.cc-subtitle{
  max-width:690px;
  margin:9px 0 0;
  color:var(--muted);
  font-size:var(--fs-body);
  line-height:1.45;
}
.cc-header-side{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:var(--ui-25);
  flex:0 0 auto;
}
.cc-header-side .btn{min-height:var(--ctrl-h);margin:0}
.cc-header-side .badge{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  padding:0 13px;
  border-color:color-mix(in srgb,var(--accent) 24%,var(--line));
  background:color-mix(in srgb,var(--accent-soft) 52%,var(--panel));
}

/* --- Toolbar: search + filter, semua kontrol 42px --- */
.cc-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--ui-3);
  margin-top:14px;
}
.cc-search{
  min-width:240px;
  max-width:520px;
  flex:1 1 420px;
  min-height:42px;
  display:flex;
  align-items:center;
  gap:9px;
  padding:0 14px;
  border:1px solid var(--line);
  border-radius:var(--radius-inner);
  background:color-mix(in srgb,var(--panel) 88%,transparent);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.62);
}
.cc-search > span{color:var(--muted);font-size:20px;line-height:1}
.cc-search input{
  width:100%;
  min-width:0;
  min-height:0; /* batalkan tinggi bawaan input global — baris dipegang kontainer */
  height:auto;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:var(--ink);
  font:inherit;
  font-size:var(--fs-body);
}
.cc-search:focus-within{
  border-color:color-mix(in srgb,var(--accent) 58%,var(--line));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 12%,transparent);
}
.cc-filter-group{
  display:flex;
  align-items:center;
  gap:5px;
  padding:var(--ui-05); /* border-box: 2+36+2+border 2 = 42 */
  overflow-x:auto;
  border:1px solid var(--line);
  border-radius:var(--radius-inner);
  background:color-mix(in srgb,var(--panel) 78%,transparent);
}
.cc-filter-btn{
  min-height:36px;
  flex:0 0 auto;
  padding:0 var(--ui-3);
  border:0;
  border-radius:12px;
  background:transparent;
  color:var(--muted);
  font:inherit;
  font-size:var(--fs-label);
  font-weight:var(--fw-heavy);
  cursor:pointer;
}
.cc-filter-btn:hover{color:var(--ink);background:color-mix(in srgb,var(--accent-soft) 35%,transparent)}
.cc-filter-btn.active{
  background:var(--ink);
  color:var(--panel);
  box-shadow:0 6px 16px rgba(15,23,42,.15);
}

/* --- Metrics (KPI) --- */
.cc-metrics{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:var(--ui-25);
  margin:14px 0;
}
.cc-metric{
  min-height:88px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:14px;
  border:1px solid var(--line);
  border-radius:18px;
  background:color-mix(in srgb,var(--panel) 86%,transparent);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.62);
}
.cc-metric.attention{
  border-color:color-mix(in srgb,var(--warning) 34%,var(--line));
  background:color-mix(in srgb,var(--status-pending-bg) 28%,var(--panel));
}
.cc-metric span{
  color:var(--muted);
  font-size:10px;
  font-weight:850;
  letter-spacing:.05em;
  text-transform:uppercase;
}
.cc-metric strong{
  margin:3px 0 1px;
  color:var(--ink);
  font-size:24px;
  line-height:1;
}
.cc-metric small{
  color:var(--muted);
  font-size:10px;
  line-height:1.25;
}

/* --- Panel konten (kartu besar dalam shell) --- */
.cc-panel{
  min-width:0;
  padding:14px;
  border:1px solid var(--line);
  border-radius:24px;
  background:color-mix(in srgb,var(--panel) 90%,transparent);
  box-shadow:0 18px 42px rgba(15,23,42,.08),inset 0 1px 0 rgba(255,255,255,.7);
}
.cc-panel-head{
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--ui-4);
  padding:0 var(--ui-05) var(--ui-25);
}
.cc-panel-head > div:first-child{min-width:0}
.cc-panel-head > div:first-child span{
  display:block;
  margin-bottom:2px;
  color:var(--muted);
  font-size:10px;
  font-weight:850;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.cc-panel-head > div:first-child strong{
  display:block;
  overflow:hidden;
  color:var(--ink);
  font-size:var(--fs-title);
  text-overflow:ellipsis;
  white-space:nowrap;
}
.cc-panel + .cc-panel{margin-top:14px}

/* --- Dark mode kit --- */
[data-theme="dark"] .cc-shell{
  background:
    radial-gradient(circle 212px at calc(100% - 40px) -35px, color-mix(in srgb,var(--accent) 12%,transparent) 0 98%, transparent 100%),
    linear-gradient(150deg,rgba(52,62,66,.94),rgba(43,52,56,.96));
  box-shadow:0 28px 80px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.06);
}
[data-theme="dark"] .cc-panel{background:rgba(52,62,66,.88);box-shadow:0 18px 42px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.04)}
[data-theme="dark"] .cc-search,
[data-theme="dark"] .cc-filter-group,
[data-theme="dark"] .cc-metric{box-shadow:inset 0 1px 0 rgba(255,255,255,.035)}

/* --- Responsive kit --- */
@media (max-width:1180px){
  .cc-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:980px){
  .cc-shell-header{align-items:flex-start}
  .cc-toolbar{align-items:stretch;flex-direction:column}
  .cc-search{max-width:none;flex-basis:auto}
  .cc-filter-group{width:100%}
}
@media (max-width:680px){
  body.wide-view-active main{padding:8px 8px calc(96px + var(--safe-bottom))}
  .cc-shell{padding:14px;border-radius:24px}
  .cc-shell-header{display:grid;gap:14px}
  .cc-shell-heading h2{font-size:28px}
  .cc-header-side{width:100%;justify-content:flex-start;flex-wrap:wrap}
  .cc-toolbar{margin-top:14px}
  .cc-search{min-width:0}
  .cc-filter-group{justify-content:flex-start}
  .cc-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .cc-metric{min-height:78px;padding:11px}
  .cc-panel{border-radius:18px}
}
@media (prefers-reduced-motion:reduce){
  .cc-kicker > i{animation:none}
}
:is(.cc-filter-btn):focus-visible{
  outline:3px solid color-mix(in srgb,var(--accent) 48%,transparent);
  outline-offset:2px;
}