/* ═══════════════════════════════════════════════════════════════
   Aziz GeoVerse — Land Expropriation & Cadastral Mapping System
   app.css — dashboard chrome + ArcGIS-style A4 layout sheet
   Brand: Teal #0d5c58 / #008080 · Amber #f59e0b · Charcoal #1e293b
   ═══════════════════════════════════════════════════════════════ */

:root{
  --bg:#101823;            /* page charcoal */
  --panel:#16202e;         /* panel charcoal */
  --panel2:#1b2836;
  --teal:#0d5c58;          /* brand primary */
  --teal2:#008080;         /* brand primary light */
  --teal3:#14b8a6;         /* bright teal accent */
  --amber:#f59e0b;         /* brand accent */
  --amber2:#fbbf24;
  --charcoal:#1e293b;
  --line:rgba(255,255,255,.1);
  --full:#ef4444; --partial:#f59e0b;
  --f: 'Cairo','Segoe UI',Tahoma,system-ui,sans-serif;
}
*{ font-family:var(--f); }
html,body{ background:var(--bg); }
::-webkit-scrollbar{ width:9px;height:9px }
::-webkit-scrollbar-thumb{ background:#2c3c50;border-radius:8px }
::-webkit-scrollbar-track{ background:transparent }
[dir="rtl"] .ltr-only{ display:none!important } [dir="ltr"] .rtl-only{ display:none!important }

/* ─── Top bar ─── */
#topbar{ background:linear-gradient(90deg,#16222f 0%,#131c29 55%,#101823 100%); border-bottom:1px solid var(--line); }
#brand-logo{ background:linear-gradient(135deg,#12312f,#0e2120); border:1px solid rgba(20,184,166,.4); }
.topbtn{ display:inline-flex;align-items:center;gap:.45rem;height:38px;padding:0 .8rem;border-radius:.7rem;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);color:#e2e8f0;font-size:12.5px;
  transition:.15s; cursor:pointer; }
.topbtn:hover{ background:rgba(20,184,166,.14); border-color:rgba(20,184,166,.45) }
.topbtn-gold{ background:rgba(245,158,11,.13); border-color:rgba(245,158,11,.45); color:#fbbf24 }
.topbtn-gold:hover{ background:rgba(245,158,11,.22); border-color:rgba(245,158,11,.6) }

/* ─── Generic controls ─── */
.topbtn,.iconbtn,.mapbtn,.tabbtn,.btn-primary,.btn-ghost,.switch{ user-select:none }
.iconbtn{ width:34px;height:34px;border-radius:.6rem;display:grid;place-items:center;color:#cbd5e1;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);cursor:pointer;transition:.15s }
.iconbtn:hover{ background:rgba(20,184,166,.16); color:#5eead4 }
.btn-primary{ display:inline-flex;align-items:center;justify-content:center;gap:.5rem;height:38px;padding:0 1rem;border-radius:.7rem;
  background:linear-gradient(135deg,#0d9488,#0d5c58);color:#fff;font-weight:800;font-size:13px;border:1px solid rgba(13,148,136,.5);
  cursor:pointer;box-shadow:0 4px 14px rgba(13,92,88,.35);transition:.15s }
.btn-primary:hover{ filter:brightness(1.12) }
.btn-primary:disabled{ opacity:.5;cursor:not-allowed;filter:grayscale(.4) }
.btn-ghost{ display:inline-flex;align-items:center;justify-content:center;gap:.45rem;height:38px;padding:0 .9rem;border-radius:.7rem;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);color:#e2e8f0;font-weight:700;font-size:12.5px;cursor:pointer;transition:.15s }
.btn-ghost:hover{ background:rgba(20,184,166,.14); border-color:rgba(20,184,166,.4) }
.inp{ width:100%;height:38px;padding:0 .75rem;border-radius:.6rem;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);color:#f1f5f9;font-size:12.5px;outline:none }
.inp:focus{ border-color:rgba(20,184,166,.65) }
select.inp option{ background:#16202e;color:#f1f5f9 }
.tabbtn{ display:inline-flex;align-items:center;gap:.4rem;padding:.55rem .9rem;font-size:12.5px;font-weight:800;color:#94a3b8;
  border-bottom:2.5px solid transparent;cursor:pointer;background:none;border-top:none;border-left:none;border-right:none }
.tabbtn.active{ color:#2dd4bf;border-bottom-color:#f59e0b }
.switch{ width:46px;height:26px;border-radius:99px;background:#475569;border:none;position:relative;cursor:pointer;transition:.2s;flex-shrink:0 }
.switch .knob{ position:absolute;top:3px;inset-inline-start:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:.2s }
.switch[aria-checked="true"]{ background:#0d9488 }
.switch[aria-checked="true"] .knob{ inset-inline-start:23px }

/* ─── Sidebar panels ─── */
#sidebar{ position:absolute; z-index:1100; top:0; bottom:0; inset-inline-start:0; width:min(92vw,380px);
  background:rgba(22,32,46,.98); border-inline-end:1px solid var(--line); display:flex; flex-direction:column;
  transform:translateX(var(--hide-x,-105%)); transition:transform .3s ease; box-shadow:14px 0 44px rgba(0,0,0,.45) }
[dir="rtl"] #sidebar{ --hide-x:105% } [dir="ltr"] #sidebar{ --hide-x:-105% }
#sidebar.open{ transform:translateX(0) }
@media (min-width:1024px){
  #sidebar{ position:relative; width:380px; background:#16202e; box-shadow:none; flex-shrink:0 }
}
.panel-section{ padding:14px 16px;border-bottom:1px dashed rgba(255,255,255,.08) }
.stat-card{ background:linear-gradient(160deg,rgba(20,184,166,.07),rgba(255,255,255,.02)); border:1px solid rgba(20,184,166,.16);
  border-radius:.8rem;padding:.7rem .8rem }
.stat-num{ font-size:17px;font-weight:900;color:#fff;letter-spacing:.2px }
.stat-lbl{ font-size:10.5px;color:#8fa1bd;font-weight:700;margin-top:2px }
.zone-card{ display:flex;align-items:center;gap:.7rem;width:100%;text-align:start;padding:.65rem .8rem;border-radius:.75rem;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.09);cursor:pointer;transition:.15s }
.zone-card:hover{ background:rgba(20,184,166,.1);border-color:rgba(20,184,166,.4) }
.zone-dot{ width:11px;height:11px;border-radius:3px;flex-shrink:0 }
.meta-row{ display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:.44rem 0;border-bottom:1px dashed rgba(255,255,255,.07) }
.meta-k{ font-size:11.5px;color:#8fa1bd;font-weight:700;flex-shrink:0 }
.meta-v{ font-size:12.5px;color:#f1f5f9;font-weight:700;text-align:end }
.pill{ display:inline-flex;align-items:center;gap:.3rem;padding:.14rem .6rem;border-radius:99px;font-size:10.5px;font-weight:800 }
.pill-paid{ background:rgba(52,211,153,.14);color:#34d399;border:1px solid rgba(52,211,153,.35) }
.pill-pending{ background:rgba(251,191,36,.14);color:#fbbf24;border:1px solid rgba(251,191,36,.35) }
.pill-disputed{ background:rgba(248,113,113,.14);color:#f87171;border:1px solid rgba(248,113,113,.35) }
.tbl{ width:100%;border-collapse:collapse;font-size:11.5px }
.tbl th{ background:#1b2836;color:#cbd5e1;font-weight:800;padding:.42rem .4rem;white-space:nowrap;position:sticky;top:0 }
.tbl td{ padding:.4rem .4rem;border-top:1px solid rgba(255,255,255,.07);color:#e2e8f0;text-align:center;white-space:nowrap }
.tbl tbody tr{ cursor:pointer }
.tbl tbody tr:hover td{ background:rgba(20,184,166,.09) }
.tbl tr.row-active td{ background:rgba(245,158,11,.14)!important }

/* ─── Modals ─── */
.modal{ position:fixed;inset:0;z-index:1500;display:grid;place-items:center;padding:16px }
.modal-backdrop{ position:absolute;inset:0;background:rgba(6,10,16,.74);backdrop-filter:blur(3px) }
.modal-card{ position:relative;width:100%;background:var(--panel);border:1px solid rgba(255,255,255,.13);
  border-radius:1rem;box-shadow:0 30px 80px rgba(0,0,0,.6);overflow:hidden }
.dropzone{ border:1.5px dashed rgba(255,255,255,.2);border-radius:.9rem;padding:1.4rem 1rem;display:flex;flex-direction:column;
  align-items:center;text-align:center;cursor:pointer;transition:.15s;background:rgba(255,255,255,.02) }
.dropzone:hover,.dropzone.drag{ border-color:rgba(20,184,166,.65);background:rgba(20,184,166,.06) }
.keychip{ font-family:ui-monospace,Menlo,Consolas,monospace;letter-spacing:1px;background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.14);padding:.2rem .5rem;border-radius:.45rem;font-size:12px }

/* ─── Progress bars ─── */
.prog{ border:1px solid rgba(20,184,166,.3);background:rgba(20,184,166,.06);border-radius:.7rem;padding:.6rem .8rem }
.prog.hidden{ display:none }
.prog-head{ display:flex;justify-content:space-between;font-size:11px;font-weight:800;color:#5eead4;margin-bottom:.4rem }
.prog-track{ height:8px;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden }
.prog-fill{ height:100%;width:0%;border-radius:99px;background:linear-gradient(90deg,#0d9488,#2dd4bf);
  transition:width .25s ease;position:relative }
.prog-fill::after{ content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.25),transparent);
  animation:progshine 1.2s linear infinite }
@keyframes progshine{ from{ transform:translateX(-100%) } to{ transform:translateX(100%) } }

/* ─── Map controls & legend ─── */
.mapbtn{ width:40px;height:40px;border-radius:.7rem;display:grid;place-items:center;color:#e2e8f0;
  background:rgba(22,32,46,.92);border:1px solid rgba(255,255,255,.15);cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.4);transition:.15s }
.mapbtn:hover{ background:rgba(13,92,88,.55);border-color:rgba(20,184,166,.6);color:#5eead4 }
.lg-row{ display:flex;align-items:center;gap:.55rem;font-size:11.5px;font-weight:700;color:#cbd5e1;cursor:pointer }
.lg-sw{ width:26px;height:15px;border-radius:3px;flex-shrink:0;border:1px solid rgba(255,255,255,.35);position:relative }
.lg-line{ width:26px;height:0;border-top:2.5px solid #fff;border-radius:2px;flex-shrink:0 }
.lg-check{ margin-inline-start:auto;width:15px;height:15px;accent-color:#14b8a6;cursor:pointer }
#legend.collapsed #legend-body, #legend.collapsed #legend-cad{ display:none!important }
#legend.collapsed #legend-chev{ transform:rotate(45deg) }
#legend-cad .lg-row .lg-sw{ background:transparent!important }

/* ─── Leaflet overrides ─── */
.leaflet-container{ background:#0d141d;font-family:var(--f) }
.parcel-label{ background:rgba(10,16,24,.82);color:#fff;border:1px solid rgba(255,255,255,.4);
  border-radius:5px;font-size:10.5px;font-weight:800;padding:0 5px;white-space:nowrap;display:inline-block;
  font-family:ui-monospace,Consolas,monospace;letter-spacing:.4px;box-shadow:0 2px 6px rgba(0,0,0,.45) }
.leaflet-marker-icon span.parcel-label{ position:absolute;transform:translate(-50%,-50%) }
.cad-label{ position:absolute;transform:translate(-50%,-50%);font-size:11px;font-weight:800;white-space:nowrap;
  text-shadow:-1px -1px 0 rgba(0,0,0,.85),1px -1px 0 rgba(0,0,0,.85),-1px 1px 0 rgba(0,0,0,.85),1px 1px 0 rgba(0,0,0,.85);
  font-family:ui-monospace,Consolas,monospace;pointer-events:none }
.leaflet-tooltip.parcel-tooltip{ background:#16202e;border:1px solid rgba(20,184,166,.4);color:#e2e8f0;
  border-radius:8px;box-shadow:0 10px 26px rgba(0,0,0,.45);padding:6px 9px }
.leaflet-tooltip.parcel-tooltip::before{ border-top-color:#16202e }
.photo-marker{ margin-left:-15px;margin-top:-15px;background:none;border:none }
.photo-marker .pm{ width:30px;height:30px;border-radius:50% 50% 50% 4px;transform:rotate(-45deg);
  background:linear-gradient(135deg,#14b8a6,#0d5c58);display:grid;place-items:center;box-shadow:0 3px 10px rgba(0,0,0,.5);
  border:1.5px solid #fff }
.photo-marker .pm svg{ transform:rotate(45deg);width:14px;height:14px;color:#fff }
.me-marker{ margin-left:-8px;margin-top:-8px;background:none;border:none }
.me-marker .dot{ width:16px;height:16px;border-radius:50%;background:#38bdf8;border:2.5px solid #fff;box-shadow:0 0 0 6px rgba(56,189,248,.25) }
@keyframes selglow{ 0%,100%{ stroke-opacity:1 } 50%{ stroke-opacity:.55 } }
.path-sel{ animation:selglow 1.6s ease-in-out infinite }

/* ─── Toasts / busy ─── */
.toast{ pointer-events:auto;display:flex;align-items:center;gap:.55rem;padding:.6rem 1rem;border-radius:.75rem;
  background:#16202e;border:1px solid rgba(255,255,255,.18);color:#f1f5f9;font-size:12.5px;font-weight:700;
  box-shadow:0 12px 34px rgba(0,0,0,.5);animation:toastin .25s ease }
.toast.ok{ border-color:rgba(45,212,191,.55) } .toast.err{ border-color:rgba(248,113,113,.5) } .toast.warn{ border-color:rgba(245,158,11,.5) }
@keyframes toastin{ from{ opacity:0;transform:translateY(-8px) } to{ opacity:1;transform:none } }
.spinner{ width:38px;height:38px;border-radius:50%;border:4px solid rgba(20,184,166,.25);border-top-color:#2dd4bf;animation:spin .8s linear infinite }
@keyframes spin{ to{ transform:rotate(360deg) } }

/* ─── Search results ─── */
.sr-item{ display:flex;align-items:center;gap:.6rem;padding:.5rem .75rem;cursor:pointer;font-size:12.5px;color:#e2e8f0 }
.sr-item:hover{ background:rgba(20,184,166,.1) }
.sr-item .sid{ font-family:ui-monospace,monospace;font-weight:800;color:#2dd4bf;direction:ltr }
.sr-head{ padding:.35rem .75rem;font-size:10px;color:#64748b;font-weight:800;letter-spacing:.6px }

/* ═══════════════════════════════════════════════════════════════
   A4 LANDSCAPE LAYOUT SHEET — ArcGIS Pro style (1123×794 px)
   Brand accents: teal #0d5c58 header/table chrome, amber #f59e0b stamp
   ═══════════════════════════════════════════════════════════════ */
#layout-sheet{ width:1123px;height:794px;background:#fff;color:#101828;position:relative;
  box-shadow:0 24px 70px rgba(0,0,0,.55);flex-shrink:0 }
#layout-sheet *{ box-sizing:border-box }
.ls-outer{ position:absolute;inset:9px;border:2.4px solid #0d3b39;pointer-events:none }
.ls-inner{ position:absolute;inset:13px;border:1px solid #0d5c58;pointer-events:none }
.ls-watermark{ position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;z-index:0 }
.ls-watermark span{ font-size:170px;font-weight:900;letter-spacing:26px;color:rgba(13,92,88,.06);transform:rotate(-18deg);white-space:nowrap }
.ls-content{ position:absolute;inset:14px;z-index:1;display:flex;flex-direction:column }

.ls-header{ height:86px;flex-shrink:0;display:flex;align-items:center;gap:14px;padding:0 16px;
  border-bottom:2.2px solid #0d5c58;background:linear-gradient(180deg,#f2faf9,#e8f4f2) }
.ls-emblem{ width:54px;height:54px;border-radius:50%;border:2.4px solid #0d5c58;display:grid;place-items:center;background:#fff;flex-shrink:0 }
.ls-emblem svg{ width:34px;height:34px }
.ls-head-center{ flex:1;text-align:center;min-width:0 }
.ls-gov{ font-size:14.5px;font-weight:800;color:#0d3b39;letter-spacing:.3px }
.ls-office{ font-size:11px;font-weight:700;color:#475467;margin-top:1px }
.ls-title{ font-size:21px;font-weight:900;color:#101828;margin-top:3px }
.ls-title-sub{ font-size:12px;font-weight:700;color:#b45309;margin-top:1px }
.ls-head-side{ width:190px;flex-shrink:0;display:flex;flex-direction:column;gap:5px;align-items:flex-end }
[dir="ltr"] .ls-head-side{ align-items:flex-start }
.ls-refbox{ border:1.6px solid #0d5c58;padding:4px 9px;text-align:center;background:#fff }
.ls-refbox .r1{ font-size:10px;font-weight:800;color:#0d5c58 }
.ls-refbox .r2{ font-size:11.5px;font-weight:900;color:#101828;direction:ltr }
.ls-demo-stamp{ border:2px solid #f59e0b;color:#b45309;font-weight:900;font-size:12px;letter-spacing:2px;
  padding:2px 10px;transform:rotate(-4deg);background:rgba(245,158,11,.07) }

.ls-body{ flex:1;display:grid;grid-template-columns:1fr 252px;gap:9px;padding:9px 12px 6px;min-height:0 }
[dir="ltr"] .ls-body{ grid-template-columns:252px 1fr }
.ls-mapframe{ position:relative;border:1.8px solid #0d3b39;background:#28303f;overflow:hidden }
.ls-mapframe img{ position:absolute;inset:0;width:100%;height:100%;object-fit:cover }
.ls-frame-label{ position:absolute;top:0;inset-inline-start:0;background:rgba(13,59,57,.82);color:#fff;
  font-size:10.5px;font-weight:800;padding:3px 10px;z-index:2 }
.ls-north{ position:absolute;top:8px;inset-inline-end:8px;width:46px;height:64px;z-index:2;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6)) }
.ls-scalebar{ position:absolute;bottom:8px;inset-inline-start:10px;z-index:2;display:flex;flex-direction:column;gap:2px }
.ls-scalebar .seg-row{ display:flex;height:7px;border:1.4px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,.6) }
.ls-scalebar .seg{ width:56px } .ls-scalebar .seg:nth-child(odd){ background:#fff } .ls-scalebar .seg:nth-child(even){ background:transparent }
.ls-scalebar .seg-lbls{ display:flex;color:#fff;font-size:9px;font-weight:800;text-shadow:0 1px 2px #000 }
.ls-scalebar .seg-lbls span{ width:56px;text-align:center;direction:ltr }
.ls-scalebar .unit{ color:#fff;font-size:9px;font-weight:800;text-shadow:0 1px 2px #000;direction:ltr;text-align:start }
.ls-sel-chip{ position:absolute;bottom:8px;inset-inline-end:8px;background:rgba(245,158,11,.95);color:#231204;
  font-size:10.5px;font-weight:900;padding:2.5px 9px;border-radius:4px;z-index:2;direction:ltr }
.ls-attrib{ position:absolute;bottom:1.5px;inset-inline-end:4px;color:rgba(255,255,255,.75);font-size:7px;z-index:2;direction:ltr }

.ls-side{ display:flex;flex-direction:column;gap:8px;min-height:0 }
.ls-box{ border:1.6px solid #0d5c58;background:#fff;flex-shrink:0 }
.ls-box-title{ background:#0d5c58;color:#fff;font-size:11px;font-weight:800;padding:3.5px 9px;display:flex;justify-content:space-between;align-items:center }
.ls-box-title .en{ font-weight:700;color:#b9e8e2 }
.ls-legend{ padding:7px 9px;display:flex;flex-direction:column;gap:5.5px }
.lg-item{ display:flex;align-items:center;gap:7px;font-size:10px;font-weight:700;color:#1f2a44 }
.lg-swatch{ width:26px;height:13px;border:1px solid #33415c;border-radius:2px;flex-shrink:0 }
.lg-swatch-line{ width:26px;height:0;border-top:2.6px solid #fff;outline:1px solid #94a3b8;flex-shrink:0 }
.lg-swatch-cam{ width:26px;height:15px;display:grid;place-items:center;flex-shrink:0;color:#b45309 }
.lg-swatch-cam svg{ width:14px;height:14px }
.ls-photo-frame{ flex:1;min-height:0;display:flex;flex-direction:column }
.ls-photo-body{ flex:1;min-height:0;position:relative;background:#e5e9f0 }
.ls-photo-body img{ position:absolute;inset:0;width:100%;height:100%;object-fit:cover }
.ls-photo-cap{ font-size:9.5px;font-weight:700;color:#344054;padding:3px 8px;border-top:1px solid #d0d5dd;display:flex;justify-content:space-between;direction:ltr }
.ls-notes-box{ flex-shrink:0;max-height:118px;display:flex;flex-direction:column }
.ls-notes-body{ padding:6px 9px;font-size:9.5px;font-weight:600;color:#344054;line-height:1.55;overflow:hidden }

.ls-table-wrap{ flex-shrink:0;padding:2px 12px 6px }
.ls-table-title{ font-size:11.5px;font-weight:900;color:#0d3b39;margin:2px 0 4px;display:flex;justify-content:space-between }
.ls-table{ width:100%;border-collapse:collapse;border:1.6px solid #0d5c58 }
.ls-table th{ background:#0d5c58;color:#fff;font-size:10px;font-weight:800;padding:4px 4px;border:1px solid #1a6b68;text-align:center;line-height:1.25 }
.ls-table td{ font-size:10.5px;font-weight:700;padding:3.5px 4px;border:1px solid #98a2b3;text-align:center;color:#101828 }
.ls-table tr.hl td{ background:#fef3c7;font-weight:900 }
.ls-table tr.total td{ background:#e8f4f2;font-weight:900;color:#0d3b39 }

.ls-footer{ height:64px;flex-shrink:0;border-top:2.2px solid #0d5c58;display:flex;align-items:stretch;background:linear-gradient(180deg,#f2faf9,#e8f4f2) }
.ls-foot-cell{ flex:1;display:flex;flex-direction:column;justify-content:center;padding:4px 14px;border-inline-end:1px solid #98a2b3 }
.ls-foot-cell:last-child{ border-inline-end:none }
.ls-sig-line{ border-top:1.4px dotted #475467;margin-top:16px;padding-top:2px;font-size:9px;font-weight:700;color:#475467;text-align:center }
.ls-sig-name{ font-size:10.5px;font-weight:900;color:#101828;text-align:center }
.ls-foot-info{ font-size:10px;font-weight:700;color:#344054;display:flex;justify-content:space-between;gap:8px }
.ls-foot-info b{ color:#0d3b39 }
.ls-brand{ display:flex;align-items:center;gap:7px;justify-content:center }
.ls-brand .blogo{ width:26px;height:26px }
.ls-brand .bname{ font-size:12px;font-weight:900;color:#0d3b39;line-height:1.15 }
.ls-brand .bsub{ font-size:8.5px;font-weight:700;color:#667085 }
.ls-foot-note{ font-size:8.5px;color:#667085;text-align:center;margin-top:3px }

/* ─── live edit mode on the sheet ─── */
#layout-sheet .ed{ border-radius:2px;transition:box-shadow .12s }
#layout-sheet.editing .ed{ outline:1.2px dashed rgba(13,148,136,.85);cursor:text;min-width:14px }
#layout-sheet.editing .ed:hover{ background:#ecfdf9 }
#layout-sheet.editing .ed:focus{ outline:2px solid #f59e0b;background:#fffbeb }
#layout-sheet.editing .ls-table td .ed{ display:inline-block;min-width:20px }
.edit-hint{ display:none }
#layout-sheet.editing ~ .edit-hint, .edit-hint.on{ display:block }

/* layout modal scaling */
#layout-scale-wrap{ transform-origin:top center }
[dir="rtl"] #layout-scale-wrap{ transform-origin:top right }
@media (max-width:1220px){ #layout-scale-wrap{ transform:scale(.82) } }
@media (max-width:1000px){ #layout-scale-wrap{ transform:scale(.66) } }
@media (max-width:780px){ #layout-scale-wrap{ transform:scale(.5) } }
@media (max-width:600px){ #layout-scale-wrap{ transform:scale(.38) } }

/* capture stage (offscreen map clone for html2canvas) */
#capture-stage{ position:fixed;top:0;left:-12000px;width:1000px;height:680px;z-index:-1 }
#capture-stage .capture-map{ width:1000px;height:680px;background:#28303f }

/* print — only the layout sheet */
#print-root{ display:none }
@media print{
  body.printing > *:not(#print-root){ display:none!important }
  body.printing #print-root{ display:block;position:static }
  body.printing #print-root #layout-sheet{ box-shadow:none;page-break-after:avoid }
  @page{ size:A4 landscape;margin:0 }
}
/* details photo zoom cursor */
.photo-thumb{ cursor:zoom-in }

/* safety: guarantee hidden state even if Tailwind CDN fails */
.hidden{ display:none!important }
