:root {
    --bg: #0a0f14;
    --panel: rgba(16, 22, 29, .97);
    --panel-2: #131b23;
    --panel-3: #18222d;
    --line: #2a3542;
    --text: #eef4f8;
    --muted: #8f9ca8;
    --accent: #3aa7ff;
    --danger: #ef5350;
    --warning: #ffb020;
    --keypoint: #ffd34d;
    --route: #8b78ff;
    --zone: #ef5350;
    --success: #2ecc71;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: var(--bg); color: var(--text); }
body { overflow: hidden; }
button, input, textarea, select { font: inherit; }
button { color: inherit; }
a { color: inherit; }
.hidden-form { display: none; }

.app-header {
    height: 56px; display: flex; align-items: center; gap: 14px; padding: 0 18px;
    background: #0b1117; border-bottom: 1px solid #1f2933; position: relative; z-index: 1000;
}
.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 800; text-decoration: none; }
.brand-mark { width: 30px; height: 30px; border-radius: 10px; display: grid; place-items: center; background: linear-gradient(135deg,#ef5350,#ff7b55); }
.header-caption { color: var(--muted); font-size: 13px; }

.workspace { height: calc(100vh - 56px); display: grid; grid-template-columns: 390px 1fr; }
.leftbar { overflow-y: auto; padding: 14px; background: #0d141b; border-right: 1px solid #202b36; }
.leftbar::-webkit-scrollbar { width: 8px; }
.leftbar::-webkit-scrollbar-thumb { background: #2a3542; border-radius: 99px; }
.project-head { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; margin-bottom: 12px; }
.project-head h1 { margin: 3px 0 0; font-size: 23px; }
.eyebrow, .micro-label { font-size: 10px; font-weight: 850; letter-spacing: .14em; color: var(--muted); }
.status-pill { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; color: #a7efc4; background: rgba(46,204,113,.12); border: 1px solid rgba(46,204,113,.24); border-radius: 999px; padding: 6px 8px; }
.status-pill i { width: 7px; height: 7px; border-radius: 50%; background: var(--success); }

.import-card, .project-card, .layer-card { border: 1px solid var(--line); background: var(--panel); border-radius: 14px; padding: 13px; margin-bottom: 10px; }
.import-card summary { cursor: pointer; font-weight: 750; }
.upload-form { display: grid; gap: 9px; margin-top: 12px; }
.drop-zone { cursor: pointer; border: 1px dashed #455362; background: #101820; border-radius: 12px; padding: 16px 12px; display: grid; place-items: center; gap: 4px; text-align: center; }
.drop-zone:hover { border-color: var(--accent); }
.drop-icon { color: var(--accent); font-size: 25px; }
.drop-zone small, .selected-files { color: var(--muted); font-size: 12px; }
.selected-files { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.notice { border-radius: 10px; padding: 9px 10px; margin-top: 9px; font-size: 12px; }
.notice.success { background: rgba(46,204,113,.12); color: #a7efc4; }
.notice.error { background: rgba(239,83,80,.12); color: #ffc2c0; }

.project-name-row { display: grid; grid-template-columns: 1fr 40px; gap: 8px; margin-top: 7px; }
.field, .search-field { width: 100%; min-width: 0; border: 1px solid #34414f; background: #111922; color: var(--text); border-radius: 9px; padding: 9px 10px; outline: none; }
.field:focus, .search-field:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(58,167,255,.12); }
textarea.field { min-height: 84px; resize: vertical; }
.icon-button, .close-button { border: 1px solid #34414f; background: #151e27; border-radius: 9px; cursor: pointer; min-width: 38px; min-height: 38px; display: grid; place-items: center; }
.icon-button:hover, .close-button:hover { background: #1b2732; border-color: #4a5a6b; }
.export-buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 9px; }
.soft-button, .btn { border: 1px solid #34414f; background: #151e27; border-radius: 9px; padding: 9px 10px; cursor: pointer; text-decoration: none; text-align: center; font-weight: 700; }
.soft-button:hover, .btn:hover { background: #1a2530; }
.soft-button.accent, .btn.primary { background: var(--accent); border-color: var(--accent); color: #071018; }

.stats-row { display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; margin-bottom: 10px; }
.stats-row div { border: 1px solid var(--line); background: var(--panel); border-radius: 12px; padding: 9px 8px; }
.stats-row span { display: block; color: var(--muted); font-size: 10px; }
.stats-row strong { display: block; font-size: 20px; margin-top: 2px; }

.object-tabs { display: grid; grid-template-columns: repeat(3,1fr); gap: 5px; background: #10171f; border: 1px solid var(--line); border-radius: 11px; padding: 4px; }
.object-tab { border: 0; background: transparent; color: var(--muted); border-radius: 8px; padding: 8px 6px; cursor: pointer; font-weight: 750; }
.object-tab.active { background: #202b36; color: var(--text); }
.object-panel { display: none; margin-top: 8px; }
.object-panel.active { display: block; }
.object-toolbar { display: grid; grid-template-columns: 1fr 40px; gap: 7px; margin-bottom: 7px; }
.object-list { display: grid; gap: 5px; max-height: 315px; overflow: auto; padding-right: 2px; }
.object-list::-webkit-scrollbar { width: 6px; }
.object-list::-webkit-scrollbar-thumb { background: #2d3946; border-radius: 99px; }
.object-row { display: grid; align-items: center; grid-template-columns: auto 1fr auto; gap: 8px; border: 1px solid transparent; border-radius: 10px; padding: 8px; background: #111820; }
.object-row[data-route-row] { grid-template-columns: auto auto auto 1fr auto; }
.object-row:hover { border-color: #334250; background: #141e27; }
.object-row.selected { border-color: rgba(58,167,255,.75); background: rgba(58,167,255,.09); }
.object-main { border: 0; background: transparent; text-align: left; cursor: pointer; min-width: 0; padding: 0; }
.object-main strong { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.object-main small { display: block; margin-top: 2px; color: var(--muted); font-size: 11px; }
.focus-mini { border: 0; background: transparent; color: var(--muted); cursor: pointer; font-size: 17px; }
.route-swatch { width: 10px; height: 10px; border-radius: 3px; }
.keypoint-swatch { color: var(--keypoint); font-size: 16px; line-height: 1; }
.zone-swatch { width: 12px; height: 12px; border: 2px solid var(--zone); border-radius: 50%; background: rgba(239,83,80,.18); }
.merge-bar { display: grid; grid-template-columns: 1fr auto auto; gap: 6px; align-items: center; margin-top: 8px; padding: 8px; border: 1px solid var(--line); border-radius: 10px; background: #10171f; font-size: 12px; }
.merge-bar strong { color: var(--accent); }

.layer-card { display: grid; gap: 6px; }
.layer-row { display: grid; grid-template-columns: auto 28px 1fr; gap: 8px; align-items: center; color: #cbd5dd; font-size: 13px; cursor: pointer; }
.legend-line { display: block; width: 24px; height: 4px; background: var(--route); border-radius: 99px; }
.legend-keypoint { color: var(--keypoint); font-size: 17px; text-align: center; }
.legend-zone { width: 18px; height: 18px; border: 2px solid var(--zone); border-radius: 50%; background: rgba(239,83,80,.18); justify-self: center; }
.legend-gps { width: 22px; height: 22px; border-radius: 50%; background: var(--warning); color: #101820; border: 2px solid white; font-size: 8px; font-weight: 900; display: grid; place-items: center; justify-self: center; }
.danger-link { width: 100%; border: 1px solid rgba(239,83,80,.28); color: #ffaaa7; background: rgba(239,83,80,.06); border-radius: 9px; padding: 8px; cursor: pointer; }

.map-stage { position: relative; min-width: 0; }
#map { position: absolute; inset: 0; background: #20262c; }
.map-commandbar { position: absolute; z-index: 600; top: 14px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 5px; padding: 5px; border-radius: 13px; border: 1px solid rgba(255,255,255,.12); background: rgba(12,18,24,.94); box-shadow: 0 7px 30px rgba(0,0,0,.32); backdrop-filter: blur(14px); }
.segmented { display: flex; gap: 2px; padding: 2px; background: #111820; border-radius: 9px; }
.map-style, .command-btn { border: 0; background: transparent; border-radius: 8px; color: #c2ccd5; padding: 8px 10px; cursor: pointer; font-weight: 700; white-space: nowrap; }
.map-style.active, .command-btn.active { background: #26394b; color: white; }
.command-btn:hover { background: #1d2934; color: white; }
.command-btn.subtle { color: var(--muted); }
.divider { width: 1px; height: 26px; background: #33404d; margin: 0 2px; }
.map-legend { position: absolute; z-index: 550; left: 14px; bottom: 14px; display: flex; flex-wrap: wrap; gap: 10px; padding: 8px 11px; background: rgba(11,17,23,.9); border: 1px solid rgba(255,255,255,.11); border-radius: 11px; backdrop-filter: blur(10px); font-size: 11px; color: #cbd5dd; pointer-events: none; }
.map-legend span { display: flex; align-items: center; gap: 5px; }
.lg-keypoint { color: var(--keypoint); font-style: normal; font-size: 15px; }
.lg-gps { width: 20px; height: 20px; border-radius: 50%; background: var(--warning); color: #111820; border: 2px solid white; display: grid; place-items: center; font-size: 7px; font-style: normal; font-weight: 900; }
.lg-route { width: 22px; height: 4px; background: var(--route); border-radius: 99px; }
.lg-zone { width: 17px; height: 17px; border: 2px solid var(--zone); background: rgba(239,83,80,.18); border-radius: 50%; }

.inspector { position: absolute; z-index: 650; right: 14px; top: 72px; bottom: 14px; width: 380px; border-radius: 15px; border: 1px solid rgba(255,255,255,.12); background: rgba(13,19,26,.97); box-shadow: 0 14px 50px rgba(0,0,0,.38); backdrop-filter: blur(15px); display: flex; flex-direction: column; overflow: hidden; }
.inspector.hidden { display: none; }
.inspector-head { display: flex; justify-content: space-between; gap: 10px; padding: 15px; border-bottom: 1px solid var(--line); }
.inspector-head h2 { margin: 3px 0 0; font-size: 20px; }
.object-kind { color: var(--muted); font-size: 10px; font-weight: 900; letter-spacing: .14em; }
.object-kind.keypoint { color: var(--keypoint); }
.object-kind.gps { color: var(--warning); }
.object-kind.route { color: #a99cff; }
.object-kind.zone { color: #ff8e8b; }
.close-button { min-width: 34px; min-height: 34px; font-size: 20px; }
.inspector-body { overflow-y: auto; padding: 15px; }
.inspector-body::-webkit-scrollbar { width: 7px; }
.inspector-body::-webkit-scrollbar-thumb { background: #33414f; border-radius: 99px; }

.type-explainer { border: 1px solid #344150; background: #111923; border-radius: 11px; padding: 10px; margin-bottom: 13px; color: #c7d0d8; font-size: 12px; }
.type-explainer strong { color: white; }
.inspector-form { display: grid; gap: 11px; }
.inspector-form label { display: grid; gap: 5px; font-size: 12px; color: #aab6c0; }
.form-two { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.form-actions { display: grid; grid-template-columns: repeat(2,1fr); gap: 7px; margin-top: 4px; }
.form-actions.one { grid-template-columns: 1fr; }
.action-btn { border: 1px solid #374655; background: #16202a; border-radius: 9px; padding: 9px; cursor: pointer; font-weight: 700; }
.action-btn:hover { background: #1d2a35; }
.action-btn.primary { background: var(--accent); border-color: var(--accent); color: #071018; }
.action-btn.danger { border-color: rgba(239,83,80,.45); color: #ffaaa7; background: rgba(239,83,80,.06); }
.action-btn.warn { border-color: rgba(255,176,32,.4); color: #ffd487; }
.metric-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 7px; margin: 10px 0; }
.metric { background: #111820; border: 1px solid var(--line); border-radius: 9px; padding: 9px; }
.metric span { display: block; color: var(--muted); font-size: 10px; }
.metric strong { display: block; margin-top: 2px; }
.help-text { color: var(--muted); font-size: 11px; line-height: 1.45; }
.coord-row { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.track-list { display: grid; gap: 6px; max-height: 52vh; overflow: auto; margin-top: 10px; }
.track-item { display: grid; grid-template-columns: 46px 1fr auto; gap: 7px; align-items: center; padding: 8px; background: #111820; border: 1px solid var(--line); border-radius: 9px; }
.track-number { border: 0; border-radius: 999px; width: 38px; height: 28px; background: var(--warning); color: #111820; font-weight: 900; cursor: pointer; }
.track-item small { color: var(--muted); }
.track-item .trash-mini { border: 0; background: transparent; color: #ff9996; cursor: pointer; }

.keypoint-marker { background: transparent; border: 0; }
.keypoint-marker .pin { position: relative; display: grid; place-items: center; width: 28px; height: 28px; transform: rotate(45deg); border-radius: 6px 6px 6px 2px; background: var(--keypoint); border: 3px solid white; box-shadow: 0 3px 12px rgba(0,0,0,.45); }
.keypoint-marker .pin::after { content: ''; width: 8px; height: 8px; border-radius: 50%; background: #27313b; }
.keypoint-label { background: rgba(255,255,255,.96); color: #1a2026; border: 0; border-radius: 8px; padding: 4px 7px; box-shadow: 0 2px 8px rgba(0,0,0,.25); font-weight: 700; }
.gps-vertex-icon { background: transparent; border: 0; }
.gps-vertex-icon span { display:flex; align-items:center; justify-content:center; width:24px; height:24px; border-radius:50%; background:var(--warning); color:#111820; border:2px solid white; font-size:8px; font-weight:900; box-shadow:0 2px 9px rgba(0,0,0,.5); }
.gps-vertex-icon.selected span { width:30px; height:30px; background:#ffcb55; box-shadow:0 0 0 4px rgba(255,176,32,.25),0 3px 12px rgba(0,0,0,.55); }
.zone-center-icon { background: transparent; border: 0; }
.zone-center-icon span { display:grid; place-items:center; width:22px; height:22px; border-radius:50%; border:3px solid white; background:var(--danger); box-shadow:0 2px 9px rgba(0,0,0,.45); }
.route-selected { filter: drop-shadow(0 0 4px rgba(255,255,255,.5)); }
.map-insert-mode { cursor: crosshair !important; outline: 3px solid rgba(255,176,32,.75); outline-offset: -3px; }

.toast { position: absolute; z-index: 1000; left: 50%; bottom: 58px; transform: translateX(-50%); background: rgba(17,25,34,.96); border: 1px solid #3a4857; color: white; padding: 10px 13px; border-radius: 10px; box-shadow: 0 7px 24px rgba(0,0,0,.3); }
.toast.error { border-color: rgba(239,83,80,.55); color: #ffc0bd; }
.toast.hidden { display: none; }
.empty-map { position: absolute; z-index: 500; inset: 0; display: grid; place-content: center; text-align: center; pointer-events: none; color: #d9e2e9; }
.empty-symbol { font-size: 48px; color: var(--accent); }
.empty-map h2 { margin-bottom: 5px; }
.empty-map p { margin: 0; color: var(--muted); }

.leaflet-container { font-family: inherit; }
.leaflet-control-zoom a { background: rgba(255,255,255,.94); }

@media (max-width: 980px) {
    .workspace { grid-template-columns: 330px 1fr; }
    .inspector { width: 330px; }
    .map-commandbar { left: auto; right: 10px; transform: none; max-width: calc(100% - 20px); flex-wrap: wrap; }
}

@media (max-width: 760px) {
    body { overflow: auto; }
    .workspace { height: auto; min-height: calc(100vh - 56px); grid-template-columns: 1fr; }
    .leftbar { max-height: none; border-right: 0; border-bottom: 1px solid #202b36; }
    .map-stage { height: 70vh; }
    .inspector { left: 8px; right: 8px; width: auto; top: 84px; }
    .map-legend { display: none; }
}

/* --- Map features: buildings / territories / lines --- */
.export-buttons { grid-template-columns: repeat(3, 1fr); }
.restore-form { display:grid; grid-template-columns:1fr auto; gap:7px; align-items:center; margin-top:8px; }
.restore-form input[type=file] { min-width:0; font-size:11px; color:var(--muted); }
.stats-row { grid-template-columns: repeat(5,1fr); }
.object-tabs { grid-template-columns: repeat(4,1fr); }
.feature-quick-row { display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-bottom:7px; }
.feature-swatch { width:14px; height:14px; border-radius:3px; border:2px solid currentColor; background:color-mix(in srgb,currentColor 25%,transparent); }
.legend-feature { color:#44c2ff; font-size:17px; text-align:center; }
.lg-feature { width:19px; height:14px; display:inline-block; border:2px solid #44c2ff; background:rgba(68,194,255,.18); border-radius:3px; }
.object-kind.feature { color:#6bd4ff; }
.feature-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
.feature-kind-badge { display:inline-flex; align-items:center; gap:5px; padding:3px 7px; border:1px solid #344554; border-radius:999px; color:#dbe7ef; font-size:11px; background:#111923; }
.vertex-list { display:grid; gap:6px; max-height:240px; overflow:auto; }
.vertex-row { display:grid; grid-template-columns:30px 1fr 1fr; gap:6px; align-items:center; }
.vertex-index { width:28px; height:28px; display:grid; place-items:center; border-radius:7px; background:#15222d; color:#84daf9; font-size:10px; font-weight:900; }

@media (max-width: 1180px) {
  .map-commandbar { max-width:calc(100% - 20px); flex-wrap:wrap; }
  .stats-row { grid-template-columns:repeat(3,1fr); }
}


/* =========================================================
   PRINT STUDIO
   ========================================================= */
.print-command { color:#dff7ff; }
.print-studio { position:fixed; inset:0; z-index:5000; display:grid; grid-template-columns:360px 1fr; background:#0a0f14; }
.print-studio.hidden { display:none; }
.print-studio-backdrop { position:absolute; inset:0; background:radial-gradient(circle at 65% 20%,rgba(56,154,214,.10),transparent 38%); pointer-events:none; }
.print-settings-panel { position:relative; z-index:2; display:flex; flex-direction:column; min-width:0; border-right:1px solid #26313c; background:#0f161d; box-shadow:12px 0 35px rgba(0,0,0,.24); }
.print-settings-head { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; padding:18px; border-bottom:1px solid var(--line); }
.print-settings-head h2 { margin:3px 0 0; font-size:22px; }
.print-settings-scroll { overflow:auto; padding:16px; display:grid; gap:14px; }
.print-field { display:grid; gap:6px; color:#acb8c2; font-size:12px; }
.print-grid-two { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.print-option-group { display:grid; gap:8px; padding:12px; border:1px solid var(--line); border-radius:11px; background:#111a22; }
.print-option-group label { display:flex; align-items:center; gap:8px; color:#d1d9df; font-size:12px; }
.print-settings-actions { margin-top:auto; padding:14px 16px 18px; border-top:1px solid var(--line); display:grid; grid-template-columns:1fr 1.2fr; gap:8px; }
.print-preview-wrap { position:relative; z-index:1; min-width:0; overflow:auto; padding:32px; display:flex; align-items:flex-start; justify-content:center; background:#171d23; }
.print-sheet { --sheet-w:297mm; --sheet-h:210mm; width:var(--sheet-w); height:var(--sheet-h); flex:none; background:white; color:#16191c; box-shadow:0 20px 70px rgba(0,0,0,.48); display:grid; grid-template-rows:auto 1fr auto; overflow:hidden; }
.print-sheet.a4.landscape { --sheet-w:297mm; --sheet-h:210mm; }
.print-sheet.a4.portrait { --sheet-w:210mm; --sheet-h:297mm; }
.print-sheet.a3.landscape { --sheet-w:420mm; --sheet-h:297mm; }
.print-sheet.a3.portrait { --sheet-w:297mm; --sheet-h:420mm; }
.print-header { min-height:19mm; padding:8mm 10mm 5mm; display:flex; justify-content:space-between; align-items:flex-end; border-bottom:0.35mm solid #bbc3c9; }
.print-header h1 { margin:1.2mm 0 0; font-size:20pt; line-height:1.05; color:#111; }
.print-kicker { font-size:7pt; font-weight:900; letter-spacing:.18em; color:#5c6872; }
.print-created-at { font-size:7.5pt; color:#68747d; white-space:nowrap; }
.print-map-frame { position:relative; margin:0 10mm; min-height:0; border:.45mm solid #29323a; background:#dfe5e9; overflow:hidden; }
#print-map { width:100%; height:100%; min-height:100%; background:#d9e1e6; }
.print-map-frame .leaflet-control-attribution { font-size:6px; opacity:.82; }
.print-north-arrow { position:absolute; z-index:1000; top:5mm; right:5mm; width:11mm; height:16mm; display:flex; flex-direction:column; align-items:center; justify-content:center; color:#111; background:rgba(255,255,255,.90); border:.3mm solid #333; border-radius:1.5mm; box-shadow:0 1mm 3mm rgba(0,0,0,.16); pointer-events:none; }
.print-north-arrow span { font-weight:900; font-size:8pt; line-height:1; }
.print-north-arrow b { font-size:15pt; line-height:.8; }
.print-footer { min-height:19mm; padding:4mm 10mm 6mm; display:flex; align-items:flex-start; justify-content:space-between; gap:8mm; }
.print-preview-legend { display:flex; flex-wrap:wrap; gap:3mm 6mm; color:#2d343a; font-size:7.5pt; }
.print-preview-legend span { display:flex; gap:1.5mm; align-items:center; }
.print-bounds-text { max-width:48%; text-align:right; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:6.7pt; line-height:1.35; color:#59646c; }
.print-selecting-area { cursor:crosshair !important; outline:4px solid rgba(44,190,255,.9); outline-offset:-4px; }
.print-area-hint { position:absolute; z-index:1200; left:50%; top:76px; transform:translateX(-50%); background:rgba(8,14,20,.95); color:white; border:1px solid rgba(95,207,255,.42); padding:10px 14px; border-radius:10px; font-weight:800; box-shadow:0 7px 25px rgba(0,0,0,.3); }

@page { margin:0; }

@media print {
    html, body { width:100%; height:auto; margin:0 !important; padding:0 !important; background:white !important; overflow:visible !important; }
    body > header, body > footer, .workspace, .print-settings-panel, .print-studio-backdrop { display:none !important; }
    #print-studio { display:block !important; position:static !important; background:white !important; }
    .print-preview-wrap { display:block !important; padding:0 !important; overflow:visible !important; background:white !important; }
    .print-sheet { margin:0 !important; box-shadow:none !important; break-inside:avoid; page-break-inside:avoid; }
    .leaflet-control-zoom, .leaflet-control-container .leaflet-top.leaflet-left { display:none !important; }
}

@media (max-width:900px) {
    .print-studio { grid-template-columns:300px 1fr; }
    .print-preview-wrap { padding:18px; }
}


/* =========================================================
   PRINT PRO — granular layer controls + rotation
   ========================================================= */
.print-sub-option {
    padding-left: 22px;
    opacity: .78;
}
.print-object-master-actions,
.print-rotation-buttons {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    margin-top:5px;
}
.print-rotation-buttons {
    grid-template-columns:repeat(5,minmax(0,1fr));
}
.mini-print-button {
    border:1px solid #34424e;
    background:#17222b;
    color:#cbd7df;
    border-radius:7px;
    padding:7px 6px;
    font-size:10px;
    cursor:pointer;
}
.mini-print-button:hover {
    border-color:#56bce8;
    color:#fff;
}
.print-individual-group {
    max-height:315px;
    min-height:110px;
}
.print-group-title-row small,
.print-option-group > small {
    display:block;
    color:#768590;
    font-size:10px;
    line-height:1.35;
    margin-top:4px;
}
.print-object-columns-head {
    display:grid;
    grid-template-columns:minmax(0,1fr) 38px 38px;
    gap:7px;
    color:#687985;
    font-size:9px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.08em;
    padding:7px 5px 3px;
    border-bottom:1px solid #26323c;
}
.print-object-columns-head span:nth-child(n+2) {
    text-align:center;
}
.print-feature-object-list {
    display:grid;
    gap:3px;
    max-height:225px;
    overflow:auto;
    padding-right:2px;
}
.print-feature-row {
    display:grid;
    grid-template-columns:minmax(0,1fr) 38px 38px;
    align-items:center;
    gap:7px;
    min-height:37px;
    padding:5px 5px;
    border-radius:7px;
    border:1px solid transparent;
}
.print-feature-row:hover {
    background:#16212a;
    border-color:#25343f;
}
.print-feature-row-main {
    min-width:0;
    display:flex;
    gap:7px;
    align-items:center;
}
.print-feature-row-main .feature-icon {
    width:22px;
    text-align:center;
    flex:none;
}
.print-feature-row-main .feature-copy {
    min-width:0;
}
.print-feature-row-main strong {
    display:block;
    font-size:11px;
    color:#dbe4ea;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}
.print-feature-row-main small {
    display:block;
    margin-top:1px;
    color:#73838e;
    font-size:9px;
}
.print-feature-check {
    display:flex;
    justify-content:center;
    align-items:center;
}
.print-feature-check input {
    width:16px;
    height:16px;
}
.print-rotation-readout {
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:10px;
}
.print-rotation-readout strong {
    font-size:18px;
    color:#e7f7ff;
}
.print-rotation-readout span {
    color:#788995;
    font-size:9px;
}
#print-rotation {
    width:100%;
}
#print-map-rotation-surface {
    position:absolute;
    inset:0;
    transform-origin:50% 50%;
    will-change:transform;
}
#print-map {
    width:100%;
    height:100%;
}
.print-rotation-badge {
    position:absolute;
    left:5mm;
    top:5mm;
    z-index:1001;
    min-width:11mm;
    padding:1.2mm 2mm;
    border:.3mm solid #333;
    background:rgba(255,255,255,.90);
    color:#222;
    text-align:center;
    border-radius:1.5mm;
    font:700 7pt ui-monospace,SFMono-Regular,Menlo,monospace;
    pointer-events:none;
}
.print-feature-label,
.print-point-label,
.print-zone-label {
    white-space:nowrap;
}


/* =========================================================
   PRINT STUDIO — macOS scrolling fix
   ========================================================= */

/* fixed overlay must have an explicit viewport height */
.print-studio {
    height: 100vh;
    height: 100dvh;
    min-height: 0;
    overflow: hidden;
}

/* left column is a bounded flex-column */
.print-settings-panel {
    height: 100vh;
    height: 100dvh;
    min-height: 0;
    overflow: hidden;
}

/* header and footer stay fixed */
.print-settings-head,
.print-settings-actions {
    flex: 0 0 auto;
}

/* ONLY this middle block scrolls */
.print-settings-scroll {
    flex: 1 1 auto;
    min-height: 0;
    height: 0;
    overflow-y: auto !important;
    overflow-x: hidden;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-gutter: stable;
    touch-action: pan-y;
}

/* Makes the scrollbar easier to see on macOS when it is visible */
.print-settings-scroll::-webkit-scrollbar {
    width: 10px;
}

.print-settings-scroll::-webkit-scrollbar-track {
    background: #0d141a;
}

.print-settings-scroll::-webkit-scrollbar-thumb {
    background: #334550;
    border-radius: 10px;
    border: 2px solid #0d141a;
}

.print-settings-scroll::-webkit-scrollbar-thumb:hover {
    background: #49606e;
}

/* the right preview can scroll independently */
.print-preview-wrap {
    height: 100vh;
    height: 100dvh;
    min-height: 0;
    overflow: auto;
}

/* Small persistent explanation next to rotation */
.print-rotation-scope-note {
    margin-top: 4px;
    padding: 8px 9px;
    border: 1px solid #2d3b45;
    border-radius: 8px;
    background: #111a21;
    color: #8fa0ab;
    font-size: 10px;
    line-height: 1.4;
}

@media print {
    .print-studio,
    .print-settings-panel,
    .print-preview-wrap {
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
    }
}


/* =========================================================
   STABLE ROTATION + PRINT OBJECT UX
   ========================================================= */
.map-bearing-controls {
    display:flex;
    gap:4px;
    align-items:center;
}
.command-btn.compact {
    min-width:auto;
    padding-left:8px;
    padding-right:8px;
}
.command-btn.bearing-value {
    min-width:60px;
    font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
    font-weight:800;
}

.print-label-master {
    margin-top:5px;
    padding-top:8px;
    border-top:1px solid #26343e;
}
.print-help-box {
    margin-top:4px;
    padding:9px 10px;
    border:1px solid #30414c;
    border-radius:8px;
    background:rgba(46,154,203,.08);
    color:#91a5b2;
    font-size:10px;
    line-height:1.45;
}
.print-help-box strong { color:#d8edf7; }

.print-individual-group {
    min-height:330px !important;
    max-height:none !important;
}
.print-feature-object-list {
    min-height:245px !important;
    max-height:600px !important;
    overflow-y:auto !important;
    overflow-x:hidden;
}
.print-count-badge {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:22px;
    height:18px;
    padding:0 5px;
    margin-left:6px;
    border-radius:9px;
    background:#253640;
    color:#bfe9fa;
    font-size:9px;
    letter-spacing:0;
}
.print-feature-empty {
    padding:20px 11px;
    border:1px dashed #30404a;
    border-radius:8px;
    color:#81939f;
    font-size:10px;
    line-height:1.55;
}
.print-feature-empty strong { color:#d4dfe5; }

/* Leaflet Rotate prints the actual map pane. Do not additionally rotate CSS. */
#print-map-rotation-surface {
    transform:none !important;
}

/* Make rotated-map control easy to notice */
.leaflet-control-rotate {
    box-shadow:0 1px 5px rgba(0,0,0,.35);
}


/* =========================================================
   PRINT INTERACTIVE FINAL
   ========================================================= */
.print-map-interaction-note {
    margin-top:8px;
    padding:9px 10px;
    border:1px solid #2d3d48;
    border-radius:8px;
    background:#111a21;
    color:#8fa0ab;
    font-size:10px;
    line-height:1.45;
}
.print-map-interaction-note strong { color:#d8edf7; }
#print-map { cursor:grab; }
#print-map:active { cursor:grabbing; }
#print-map .leaflet-control-zoom { display:block; }

/* Important: print-studio is INSIDE .workspace/.map-stage. Never hide its ancestor. */
@media print {
    html, body {
        margin:0 !important;
        padding:0 !important;
        width:auto !important;
        height:auto !important;
        overflow:visible !important;
        background:white !important;
        -webkit-print-color-adjust:exact !important;
        print-color-adjust:exact !important;
    }

    body > header,
    body > footer,
    .leftbar,
    .map-commandbar,
    .map-legend,
    #inspector,
    .print-settings-panel,
    .print-studio-backdrop,
    #toast {
        display:none !important;
    }

    .workspace,
    .map-stage,
    #print-studio,
    .print-preview-wrap {
        display:block !important;
        position:static !important;
        width:auto !important;
        height:auto !important;
        min-height:0 !important;
        margin:0 !important;
        padding:0 !important;
        overflow:visible !important;
        background:white !important;
    }

    .print-sheet {
        display:grid !important;
        margin:0 !important;
        box-shadow:none !important;
        overflow:hidden !important;
        break-inside:avoid;
        page-break-inside:avoid;
    }

    .print-map-frame,
    #print-map-rotation-surface,
    #print-map,
    #print-map .leaflet-map-pane,
    #print-map .leaflet-tile-pane,
    #print-map .leaflet-overlay-pane {
        visibility:visible !important;
    }

    #print-map-rotation-surface {
        position:absolute !important;
        inset:0 !important;
        transform:none !important;
    }

    #print-map {
        position:absolute !important;
        inset:0 !important;
        width:100% !important;
        height:100% !important;
        background:#d9e1e6 !important;
    }

    #print-map .leaflet-tile {
        visibility:visible !important;
        opacity:1 !important;
        -webkit-print-color-adjust:exact !important;
        print-color-adjust:exact !important;
    }

    #print-map .leaflet-control-zoom { display:none !important; }
}


/* =========================================================
   FINAL PRINT: screen-space selection + shared live map
   ========================================================= */
.print-screen-selector {
    position:absolute;
    inset:0;
    z-index:4500;
    cursor:crosshair;
    background:rgba(0,0,0,.03);
}
.print-screen-selector-box {
    position:absolute;
    border:3px solid #35b7ff;
    background:rgba(53,183,255,.10);
    box-shadow:0 0 0 9999px rgba(7,14,20,.30);
    pointer-events:none;
}
.print-screen-selector-hint {
    position:absolute;
    z-index:2;
    left:50%;
    top:72px;
    transform:translateX(-50%);
    padding:10px 14px;
    border:1px solid rgba(80,205,255,.5);
    border-radius:10px;
    background:rgba(8,14,20,.95);
    color:#fff;
    font-weight:800;
    box-shadow:0 8px 28px rgba(0,0,0,.35);
    pointer-events:none;
}
#print-map {
    position:relative;
    width:100%;
    height:100%;
    overflow:hidden;
}
#print-map > #map {
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    display:block !important;
}
@media print {
    #map { display:block !important; visibility:visible !important; }
    #print-map, #print-map > #map { display:block !important; visibility:visible !important; }
}


/* =========================================================
   PRINT STYLE — line widths + basemap filters
   ========================================================= */
.print-range-field {
    display:grid;
    gap:7px;
    padding:7px 0;
}
.print-range-field > span {
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    gap:10px;
    color:#cdd7de;
    font-size:11px;
}
.print-range-field b {
    font-weight:600;
}
.print-range-field output {
    color:#8fcfeb;
    font:700 10px ui-monospace,SFMono-Regular,Menlo,monospace;
    white-space:nowrap;
}
.print-range-field input[type="range"] {
    width:100%;
}
.print-bg-presets {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    margin-bottom:5px;
}
.print-bg-presets .mini-print-button:last-child {
    grid-column:1 / -1;
}
#print-map .leaflet-tile-pane {
    transition:filter .12s ease;
}


/* macOS Chrome/Safari native Print/PDF: preserve filtered satellite tiles */
@media print {
    html, body, #print-studio, #print-sheet, #print-map,
    #print-map .leaflet-container,
    #print-map .leaflet-map-pane,
    #print-map .leaflet-tile-pane,
    #print-map img.leaflet-tile {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }
}


/* Native macOS PDF/Print receives pixel-baked data:image tiles. */
@media print {
    #print-map img.leaflet-tile,
    .leaflet-tile-pane img.leaflet-tile {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
        image-rendering: auto !important;
    }
}

/* MULTI MAP HOME */
.maps-home{min-height:100vh;background:#081015;color:#eef7fb;padding:42px;box-sizing:border-box}.maps-hero{max-width:1250px;margin:0 auto 28px;display:flex;justify-content:space-between;align-items:end;gap:30px}.maps-hero h1{font-size:42px;margin:5px 0 4px}.maps-hero p{color:#8fa4af;margin:0}.create-map-form{display:flex;gap:10px;min-width:430px}.create-map-form .field{flex:1}.maps-grid{max-width:1250px;margin:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:16px}.map-project-card,.empty-map-card{background:#101b21;border:1px solid #22333c;border-radius:18px;padding:20px;box-shadow:0 15px 45px #0004}.map-project-top{display:flex;justify-content:space-between;gap:15px}.map-project-top h2{margin:4px 0 14px;font-size:22px}.map-updated{font-size:11px;color:#718995}.map-project-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0 18px}.map-project-stats span{background:#0b1419;border-radius:10px;padding:10px;color:#8fa4af;font-size:12px}.map-project-stats b{color:#eaf7fc;font-size:16px;margin-right:4px}.map-project-actions{display:flex;align-items:center;justify-content:space-between;gap:12px}.empty-map-card{display:grid;gap:8px;color:#8fa4af;min-height:130px;align-content:center}.empty-map-card strong{font-size:20px;color:#eef7fb}@media(max-width:750px){.maps-home{padding:20px}.maps-hero{display:block}.create-map-form{min-width:0;margin-top:20px;display:grid}}

/* Admin authentication */
.header-admin{margin-left:auto;display:flex;align-items:center;gap:12px}.header-admin form{margin:0}.header-link{color:inherit;text-decoration:none;opacity:.85;font-size:14px}.header-link:hover{opacity:1}.button-link{border:0;background:transparent;font:inherit;cursor:pointer;padding:0}.auth-shell{min-height:calc(100vh - 72px);display:grid;place-items:center;padding:32px 18px}.auth-card{width:min(440px,100%);background:#fff;border:1px solid #e5e7eb;border-radius:20px;padding:28px;box-shadow:0 18px 60px rgba(15,23,42,.10)}.auth-card.wide{width:min(560px,100%)}.auth-card h1{margin:6px 0 8px}.auth-card p{color:#64748b}.auth-form{display:grid;gap:16px;margin-top:22px}.auth-form label{display:grid;gap:7px;font-weight:700;font-size:13px}.auth-form .btn{min-height:44px}.auth-hint{margin-top:18px;font-size:13px;color:#64748b}