:root {
  --bg: #0b1220;
  --panel: #111a2d;
  --panel-2: #17233a;
  --panel-3: #1c2a45;
  --field: #0c1525;
  --workspace: #0a111e;
  --header: rgba(10, 17, 30, .88);
  --stats: #0e1727;
  --line: #2a3a57;
  --soft-line: rgba(255, 255, 255, .07);
  --text: #edf4ff;
  --muted: #94a7c4;
  --accent: #49c6a7;
  --accent-2: #8ad8ff;
  --major: #ffd166;
  --minor: #64c5eb;
  --danger: #ff8b8b;
  --shadow: 0 18px 50px rgba(0, 0, 0, .34);
  --button-text: #061018;
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

:root[data-theme="light"] {
  --bg: #e8eef6;
  --panel: #ffffff;
  --panel-2: #f5f8fc;
  --panel-3: #edf3f9;
  --field: #ffffff;
  --workspace: #edf3f8;
  --header: rgba(255, 255, 255, .9);
  --stats: #ffffff;
  --line: #cbd7e6;
  --soft-line: rgba(37, 61, 90, .12);
  --text: #16243a;
  --muted: #60738e;
  --accent: #168f78;
  --accent-2: #227da5;
  --major: #b66a00;
  --minor: #16759c;
  --danger: #b53535;
  --shadow: 0 18px 42px rgba(42, 62, 88, .16);
  --button-text: #ffffff;
  color-scheme: light;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--bg); color: var(--text); }
body { overflow: hidden; }
button, input, select { font: inherit; }
button { cursor: pointer; }

.app-shell {
  display: grid;
  grid-template-columns: 360px minmax(0, 1fr);
  height: 100vh;
  min-height: 620px;
}

.sidebar {
  overflow-y: auto;
  padding: 22px 20px 26px;
  border-right: 1px solid var(--soft-line);
  background:
    radial-gradient(circle at 20% 0%, color-mix(in srgb, var(--accent) 13%, transparent), transparent 28%),
    linear-gradient(180deg, var(--panel) 0%, color-mix(in srgb, var(--panel) 92%, var(--bg)) 100%);
}

.brand-row { display: flex; gap: 12px; align-items: center; margin-bottom: 18px; }
.brand-copy { min-width: 0; flex: 1; }
.brand-mark {
  width: 45px; height: 45px; border-radius: 14px; display: grid; place-items: center;
  background: linear-gradient(145deg, var(--accent), #2d8fb8); color: #061018; font-weight: 900;
  box-shadow: 0 10px 28px color-mix(in srgb, var(--accent) 28%, transparent);
}
.brand-row h1 { font-size: 18px; margin: 0 0 2px; letter-spacing: .01em; white-space: nowrap; }
.brand-row p { font-size: 12px; color: var(--muted); margin: 0; }
.theme-toggle {
  display: inline-flex; align-items: center; justify-content: center; gap: 5px;
  min-width: 62px; height: 34px; padding: 0 9px; border-radius: 10px;
  border: 1px solid var(--line); color: var(--text); background: var(--panel-3);
  font-size: 11px; font-weight: 750;
}
.theme-toggle:hover { border-color: var(--accent); }

.panel-section { padding: 16px 0 18px; border-top: 1px solid var(--soft-line); }
.section-heading { display: flex; align-items: center; gap: 9px; margin-bottom: 13px; }
.section-heading > span {
  width: 24px; height: 24px; border-radius: 8px; display: grid; place-items: center;
  background: var(--panel-3); color: var(--accent-2); font-size: 11px; font-weight: 800;
}
.section-heading h2 { margin: 0; font-size: 13px; text-transform: uppercase; letter-spacing: .08em; }
.section-help { margin: -4px 0 12px; color: var(--muted); font-size: 11px; line-height: 1.45; }
.attribute-note { display: block; margin-top: 8px; color: var(--muted); line-height: 1.4; }

.drop-zone {
  position: relative; display: grid; gap: 4px; place-items: center; min-height: 104px; padding: 15px;
  border: 1px dashed color-mix(in srgb, var(--line) 75%, var(--accent)); border-radius: 14px;
  background: color-mix(in srgb, var(--panel-2) 58%, transparent); transition: .18s ease;
}
.drop-zone:hover, .drop-zone.dragover {
  border-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); transform: translateY(-1px);
}
.drop-zone input { position: absolute; inset: 0; opacity: 0; width: 100%; cursor: pointer; }
.drop-zone strong { font-size: 13px; }
.drop-zone small { color: var(--muted); font-size: 11px; text-align: center; }

.button-row { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 10px; }
.button-row.single { grid-template-columns: 1fr; }
.button {
  border: 0; border-radius: 10px; min-height: 39px; padding: 9px 12px; font-weight: 750;
  letter-spacing: .01em; transition: transform .15s ease, opacity .15s ease, box-shadow .15s ease;
}
.button:not(:disabled):hover { transform: translateY(-1px); }
.button:disabled { opacity: .42; cursor: not-allowed; }
.button.primary { color: var(--button-text); background: linear-gradient(135deg, var(--accent), #77dcc0); box-shadow: 0 8px 22px color-mix(in srgb, var(--accent) 20%, transparent); }
.button.secondary { color: var(--text); background: var(--panel-3); border: 1px solid var(--line); }
.button.export { width: 100%; margin-top: 12px; color: #07111a; background: linear-gradient(135deg, #ffd166, #ffb15a); box-shadow: 0 10px 26px rgba(255, 177, 90, .2); }

.mini-summary { margin-top: 10px; font-size: 11px; color: var(--muted); line-height: 1.45; }
.control-grid { display: grid; gap: 10px; }
.control-grid.two-col { grid-template-columns: 1fr 1fr; }
label { display: grid; gap: 6px; font-size: 11px; color: var(--muted); }
input[type="number"], select {
  width: 100%; min-width: 0; height: 35px; padding: 6px 8px; color: var(--text);
  background: var(--field); border: 1px solid var(--line); border-radius: 8px; outline: none;
}
input[type="number"]:focus, select:focus { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 12%, transparent); }
.compact-field {
  grid-template-columns: 1fr 76px; align-items: center; gap: 10px; margin-top: 11px;
  min-height: 35px; padding: 0 0 0 2px;
}
.compact-field input { width: 76px; }
.slider-control { margin-top: 12px; }
.slider-control > span { display: flex; justify-content: space-between; }
.slider-control output { color: var(--text); font-weight: 800; }
input[type="range"] { width: 100%; accent-color: var(--accent); }

.toggle-list { display: grid; gap: 8px; margin-bottom: 11px; }
.two-column-toggles { grid-template-columns: 1fr 1fr; }
.point-toggles { margin-top: 11px; }
.switch-row {
  grid-template-columns: 1fr auto; align-items: center; min-height: 32px; padding: 7px 9px;
  border: 1px solid var(--line); border-radius: 9px; background: color-mix(in srgb, var(--panel-2) 52%, transparent);
}
.switch-row span { color: var(--text); font-size: 11px; }
input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--accent); }
.privacy-note { display: block; margin-top: 9px; text-align: center; color: var(--muted); }

.export-progress { margin-top: 12px; }
.progress-meta { display: flex; justify-content: space-between; gap: 10px; color: var(--muted); font-size: 10px; }
.progress-meta strong { color: var(--text); }
.progress-track {
  height: 9px; margin-top: 7px; overflow: hidden; border-radius: 999px; background: var(--panel-3);
  border: 1px solid var(--line);
}
.progress-bar {
  width: 0%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--accent), #ffd166);
  transition: width .12s linear;
}

.workspace { min-width: 0; display: grid; grid-template-rows: auto 1fr auto; background: var(--workspace); }
.workspace-header {
  display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 74px;
  padding: 15px 22px; border-bottom: 1px solid var(--soft-line); background: var(--header); backdrop-filter: blur(10px);
}
.workspace-header h2 { margin: 0 0 3px; font-size: 17px; }
.workspace-header p { margin: 0; color: var(--muted); font-size: 12px; }
.legend { display: flex; align-items: center; gap: 15px; color: var(--muted); font-size: 11px; white-space: nowrap; }
.legend span { display: inline-flex; align-items: center; gap: 6px; }
.legend-line { width: 24px; height: 2px; border-radius: 10px; display: inline-block; }
.legend-line.major { background: var(--major); height: 3px; }
.legend-line.minor { background: var(--minor); }
.legend-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--text); }

.canvas-wrap { position: relative; min-height: 0; overflow: hidden; }
#mapCanvas { width: 100%; height: 100%; display: block; touch-action: none; }
.empty-state {
  position: absolute; inset: 0; display: grid; place-content: center; text-align: center; pointer-events: none;
  background: radial-gradient(circle at 50% 46%, color-mix(in srgb, var(--accent) 9%, transparent), transparent 28%);
}
.empty-state.hidden { display: none; }
.empty-icon {
  margin: 0 auto 12px; width: 58px; height: 58px; border-radius: 18px; display: grid; place-items: center;
  font-size: 34px; color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent) 20%, transparent);
}
.empty-state h3 { margin: 0 0 7px; font-size: 16px; }
.empty-state p { margin: 0; color: var(--muted); font-size: 12px; }
.canvas-tools { position: absolute; top: 15px; right: 15px; display: grid; gap: 7px; }
.canvas-tools button {
  width: 36px; height: 36px; border: 1px solid var(--soft-line); border-radius: 10px;
  color: var(--text); background: color-mix(in srgb, var(--panel) 90%, transparent); box-shadow: var(--shadow); font-weight: 800;
}
.coordinate-panel {
  position: absolute; left: 15px; bottom: 14px; display: flex; align-items: center; gap: 6px;
  padding: 5px 7px; border-radius: 10px; color: var(--text);
  background: color-mix(in srgb, var(--panel) 90%, transparent); border: 1px solid var(--soft-line);
  box-shadow: var(--shadow); z-index: 10;
}
.coordinate-panel button {
  width: 24px; height: 24px; border: 1px solid var(--soft-line); border-radius: 7px;
  color: var(--text); background: color-mix(in srgb, var(--field) 78%, transparent);
  font: 900 10px/1 ui-sans-serif, system-ui; display: grid; place-items: center;
}
.coordinate-readout {
  color: var(--text); font: 11px/1.2 ui-monospace, SFMono-Regular, Menlo, monospace;
  white-space: nowrap; pointer-events: none;
}
.canvas-wrap.coordinates-collapsed .coordinate-panel { padding: 5px; }
.canvas-wrap.coordinates-collapsed .coordinate-readout { display: none; }
.canvas-wrap.coordinates-collapsed .coordinate-panel button { width: 34px; }

.stats-bar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); min-height: 67px; border-top: 1px solid var(--soft-line); background: var(--stats); }
.stats-bar div { display: grid; align-content: center; gap: 4px; padding: 11px 20px; border-right: 1px solid var(--soft-line); }
.stats-bar div:last-child { border-right: 0; }
.stats-bar span { color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .07em; }
.stats-bar strong { overflow: hidden; text-overflow: ellipsis; font-size: 13px; }

.toast {
  position: fixed; left: 50%; bottom: 22px; z-index: 50; transform: translate(-50%, 20px);
  padding: 10px 14px; border-radius: 10px; color: var(--text); background: var(--panel-2);
  border: 1px solid var(--soft-line); box-shadow: var(--shadow); opacity: 0; pointer-events: none;
  transition: .2s ease; font-size: 12px;
}
.toast.show { opacity: 1; transform: translate(-50%, 0); }
.toast.error { border-color: color-mix(in srgb, var(--danger) 55%, transparent); color: var(--danger); }

@media (max-width: 900px) {
  body { overflow: auto; }
  .app-shell { grid-template-columns: 1fr; height: auto; min-height: 100vh; }
  .sidebar { overflow: visible; border-right: 0; border-bottom: 1px solid var(--soft-line); }
  .workspace { min-height: 72vh; grid-template-rows: auto minmax(520px, 1fr) auto; }
}

@media (max-width: 560px) {
  .sidebar { padding: 16px; }
  .brand-row h1 { font-size: 16px; }
  .theme-toggle { min-width: 36px; padding: 0 8px; }
  .theme-toggle span:last-child { display: none; }
  .workspace-header { align-items: flex-start; flex-direction: column; }
  .legend { flex-wrap: wrap; }
  .stats-bar { grid-template-columns: 1fr 1fr; }
  .stats-bar div:nth-child(2) { border-right: 0; }
  .stats-bar div:nth-child(-n+2) { border-bottom: 1px solid var(--soft-line); }
}

/* v3: compact description-code style editor */
.export-section-top {
  position: sticky;
  top: -22px;
  z-index: 8;
  margin: 0 -10px 4px;
  padding: 16px 10px 18px;
  background: color-mix(in srgb, var(--panel) 94%, transparent);
  backdrop-filter: blur(12px);
  box-shadow: 0 10px 24px color-mix(in srgb, var(--bg) 42%, transparent);
}
.export-section-top .button.export { margin-top: 10px; }
.description-styles { display: grid; gap: 7px; }
.description-style-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 82px 66px;
  gap: 7px;
  align-items: center;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: color-mix(in srgb, var(--panel-2) 55%, transparent);
}
.description-style-row select,
.description-style-row input[type="number"] { height: 30px; font-size: 10px; }
.desc-enabled {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  gap: 7px;
  align-items: center;
  min-width: 0;
}
.desc-enabled span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); font-weight: 700; }
.desc-enabled small { color: var(--muted); font-size: 9px; }
.desc-scale { display: grid; grid-template-columns: auto 1fr; gap: 4px; align-items: center; }
.desc-scale span { color: var(--muted); }
@media (max-width: 420px) {
  .description-style-row { grid-template-columns: 1fr 76px; }
  .desc-scale { grid-column: 1 / -1; }
}

/* Description-specific point style editor */
.description-style-row {
  grid-template-columns: minmax(105px, 1.35fr) minmax(78px, .9fr) minmax(70px, .8fr) 72px 72px;
}
.description-style-row .desc-scale { grid-template-columns: auto 1fr; align-items: center; gap: 4px; }
.description-style-row .desc-scale span { white-space: nowrap; font-size: 9px; }
@media (max-width: 900px) {
  .description-style-row { grid-template-columns: minmax(120px, 1.4fr) repeat(2, minmax(80px, 1fr)); }
}

/* v5: cleaner description-style layout and same-description polyline toggle */
.single-toggle { grid-template-columns: 1fr; }
.compact-toggle-list { margin-bottom: 8px; }
.description-styles { display: grid; gap: 8px; }
.description-style-row {
  display: grid;
  grid-template-columns: minmax(110px, 1.35fr) minmax(96px, 1fr) minmax(82px, .9fr) minmax(108px, 1fr);
  gap: 6px;
  align-items: center;
  padding: 7px;
}
.description-style-row select,
.description-style-row input[type="number"] { height: 30px; font-size: 10px; padding: 5px 7px; }
.desc-enabled {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 6px;
  align-items: center;
  min-width: 0;
}
.desc-enabled span { font-size: 11px; }
.desc-enabled small { font-size: 9px; white-space: nowrap; }
.desc-adjustments {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  min-width: 0;
}
.desc-scale {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 4px;
  align-items: center;
  min-width: 0;
}
.description-style-row .desc-scale span {
  white-space: nowrap;
  font-size: 9px;
  color: var(--muted);
}
@media (max-width: 520px) {
  .description-style-row {
    grid-template-columns: minmax(108px, 1.4fr) minmax(92px, 1fr) minmax(78px, .9fr);
  }
  .desc-adjustments { grid-column: 1 / -1; }
}

/* v6: tighter sidebar layout + selective description polylines */
.app-shell { grid-template-columns: 372px minmax(0, 1fr); }
.sidebar { padding: 16px 14px 18px; }
.brand-row { margin-bottom: 12px; gap: 10px; }
.brand-mark { width: 40px; height: 40px; border-radius: 12px; }
.brand-row h1 { font-size: 16px; }
.brand-row p { font-size: 11px; }
.panel-section { padding: 12px 0 14px; }
.section-heading { margin-bottom: 10px; gap: 8px; }
.section-heading > span { width: 22px; height: 22px; font-size: 10px; }
.section-heading h2 { font-size: 12px; }
.section-help { margin: -2px 0 8px; font-size: 10.5px; }
.attribute-note { margin-top: 6px; font-size: 10px; }
.drop-zone { min-height: 92px; padding: 12px; }
.drop-zone strong { font-size: 12px; }
.drop-zone small { font-size: 10px; }
.button-row { gap: 8px; margin-top: 8px; }
.button { min-height: 36px; padding: 8px 11px; font-size: 12px; }
.button.export { margin-top: 9px; }
.mini-summary { margin-top: 8px; font-size: 10px; }
.control-grid { gap: 8px; }
label { gap: 5px; font-size: 10.5px; }
input[type="number"], select { height: 32px; padding: 5px 7px; font-size: 11px; }
.compact-field { grid-template-columns: 1fr 68px; gap: 8px; margin-top: 8px; min-height: 32px; }
.compact-field input { width: 68px; }
.toggle-list { gap: 7px; margin-bottom: 8px; }
.switch-row { min-height: 29px; padding: 6px 8px; }
.switch-row span { font-size: 10.5px; }
.privacy-note { margin-top: 7px; font-size: 10px; }
.export-progress { margin-top: 9px; }
.progress-track { height: 8px; margin-top: 6px; }
.export-section-top { top: -16px; margin: 0 -8px 2px; padding: 12px 8px 14px; }

.description-style-row {
  grid-template-columns: minmax(84px, 1.1fr) minmax(92px, 0.95fr) minmax(82px, 0.82fr) minmax(110px, 1fr);
  gap: 5px;
  padding: 6px;
}
.desc-enabled { grid-template-columns: auto minmax(0,1fr) auto; gap: 5px; }
.desc-enabled span { font-size: 10px; }
.desc-enabled small { font-size: 8.5px; }
.desc-adjustments { display: grid; grid-template-columns: 26px minmax(0,1fr) minmax(0,1fr); gap: 5px; align-items: center; }
.desc-connect {
  display: inline-grid; grid-template-columns: auto; place-items: center;
  width: 26px; height: 30px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel-3);
  color: var(--muted); font-size: 9px; font-weight: 700;
}
.desc-connect input { width: 14px; height: 14px; margin: 0; }
.desc-scale { grid-template-columns: 22px minmax(0, 1fr); gap: 3px; }
.description-style-row .desc-scale span { font-size: 8.5px; }

@media (max-width: 1100px) {
  .app-shell { grid-template-columns: 348px minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .description-style-row { grid-template-columns: minmax(84px,1fr) minmax(88px,1fr) minmax(76px,.85fr); }
  .desc-adjustments { grid-column: 1 / -1; grid-template-columns: 30px 1fr 1fr; }
}

/* v7: lightweight conceptual 3D preview, scrollable tool ribbon and measurements */
.sidebar {
  scrollbar-gutter: stable;
  overflow-x: hidden;
}
.description-styles {
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  padding-bottom: 9px;
  scrollbar-width: auto;
  scrollbar-color: var(--accent) var(--panel-3);
}
.description-styles::-webkit-scrollbar { height: 11px; }
.description-styles::-webkit-scrollbar-track { background: var(--panel-3); border-radius: 999px; }
.description-styles::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--accent) 76%, var(--line)); border-radius: 999px; border: 2px solid var(--panel-3); }
.description-style-row { min-width: 410px; }

.viewport-toolbar-shell {
  position: absolute;
  z-index: 12;
  top: 12px;
  left: 12px;
  right: 58px;
  overflow: hidden;
  border: 1px solid var(--soft-line);
  border-radius: 12px;
  background: color-mix(in srgb, var(--panel) 93%, transparent);
  box-shadow: var(--shadow);
  backdrop-filter: blur(12px);
}
.viewport-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: max-content;
  padding: 7px 8px 9px;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-inline: contain;
  scrollbar-width: auto;
  scrollbar-color: var(--accent) var(--panel-3);
}
.viewport-toolbar::-webkit-scrollbar { height: 10px; }
.viewport-toolbar::-webkit-scrollbar-track { background: var(--panel-3); border-radius: 999px; }
.viewport-toolbar::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--accent) 78%, var(--line)); border-radius: 999px; border: 2px solid var(--panel-3); }
.toolbar-group { display: inline-flex; align-items: center; gap: 5px; flex: 0 0 auto; }
.toolbar-button {
  min-width: 42px;
  height: 32px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  color: var(--text);
  background: var(--panel-3);
  font-size: 10.5px;
  font-weight: 750;
  white-space: nowrap;
}
.toolbar-button:hover { border-color: var(--accent); }
.toolbar-button.active {
  color: var(--button-text);
  border-color: transparent;
  background: linear-gradient(135deg, var(--accent), #77dcc0);
}
.toolbar-field,
.toolbar-slider {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 10px;
  white-space: nowrap;
}
.toolbar-field select { width: 116px; height: 32px; }
.toolbar-slider input[type="range"] { width: 105px; }
.toolbar-slider output { color: var(--text); font-weight: 800; }
.toolbar-hint { color: var(--muted); font-size: 9.5px; white-space: nowrap; padding-right: 4px; }
.canvas-wrap.is-3d #mapCanvas { cursor: grab; }
.canvas-wrap.is-3d #mapCanvas:active { cursor: grabbing; }
.canvas-tools { top: 67px; }
.empty-state { padding-top: 62px; }
.measurement-readout {
  position: absolute;
  z-index: 11;
  left: 15px;
  bottom: 52px;
  max-width: min(430px, calc(100% - 30px));
  padding: 9px 11px;
  border-radius: 10px;
  color: var(--text);
  background: color-mix(in srgb, var(--panel) 94%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent) 40%, var(--soft-line));
  box-shadow: var(--shadow);
  font: 11px/1.35 ui-monospace, SFMono-Regular, Menlo, monospace;
  pointer-events: none;
}
.coordinate-panel { z-index: 10; }

@media (max-width: 700px) {
  .viewport-toolbar-shell { right: 12px; }
  .canvas-tools { top: 76px; }
}
/* Ensure the ribbon itself stays constrained so its horizontal scrollbar appears. */
.viewport-toolbar { width: 100%; min-width: 0; }

/* v9: unified survey measurement tool and GIS import/export controls */
.gis-export-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(108px, .82fr);
  gap: 8px;
  margin-top: 8px;
}
.gis-export-row select { height: 36px; }
.button.gis-export {
  color: var(--text);
  background: var(--panel-3);
  border: 1px solid var(--line);
  box-shadow: none;
}
.button.gis-export:not(:disabled):hover { border-color: var(--accent); }
.gis-metadata-grid { margin-top: 10px; }
input[type="text"] {
  width: 100%; min-width: 0; height: 32px; padding: 5px 7px; color: var(--text);
  background: var(--field); border: 1px solid var(--line); border-radius: 8px; outline: none;
  font-size: 11px;
}
input[type="text"]:focus { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 12%, transparent); }
.icon-tool-group { gap: 5px; }
.toolbar-button.icon-button {
  width: 38px;
  min-width: 38px;
  padding: 6px;
  display: inline-grid;
  place-items: center;
}
.toolbar-button.icon-button svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  pointer-events: none;
}
.canvas-wrap.measure-active #mapCanvas {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M15.5 2.5v22' stroke='%23ffd166' stroke-width='2.2'/%3E%3Cpath d='M11 7.5h9M12 12h7M11 16.5h9' stroke='%23f4f9ff' stroke-width='1.6'/%3E%3Cpath d='m15.5 30-4-6.5h8z' fill='%23ff8b8b' stroke='%2307101c' stroke-width='1'/%3E%3Ccircle cx='15.5' cy='3.5' r='2.2' fill='%23ffd166' stroke='%2307101c' stroke-width='1'/%3E%3C/svg%3E") 16 29, crosshair !important;
}
.canvas-wrap.measure-active #mapCanvas:active { cursor: crosshair !important; }
@media (max-width: 420px) {
  .gis-export-row { grid-template-columns: 1fr; }
}

/* v10: image icons, Google Earth layer toggles, custom cursor */
.image-icon-button img {
  width: 24px;
  height: 24px;
  object-fit: contain;
  pointer-events: none;
  display: block;
}
.gis-layer-toggles { margin-top: 8px; }
.gis-layer-toggles .switch-row { min-height: 28px; }
.canvas-wrap.measure-active #mapCanvas,
.canvas-wrap.draw-active #mapCanvas {
  cursor: url("survey_cursor.png") 7 7, crosshair !important;
}
.canvas-wrap.measure-active #mapCanvas:active,
.canvas-wrap.draw-active #mapCanvas:active {
  cursor: url("survey_cursor.png") 7 7, crosshair !important;
}
.toolbar-button.icon-button.active svg path,
.toolbar-button.icon-button.active svg circle,
.toolbar-button.icon-button.active svg polyline,
.toolbar-button.icon-button.active svg line {
  stroke: currentColor;
}

/* v11: TIN edge editing and polygon tools */
.canvas-wrap.tin-edit-active #mapCanvas {
  cursor: crosshair !important;
}
.toolbar-button:disabled { opacity: .38; cursor: not-allowed; }

/* v12 Engineering Edition: compact professional UI, AutoCAD line palette, profile drawer */
:root {
  font-family: "Segoe UI Variable", "Segoe UI", Roboto, Arial, sans-serif;
}
.app-shell { grid-template-columns: 348px minmax(0, 1fr); }
.sidebar { padding: 12px 11px 14px; }
.brand-row { margin-bottom: 9px; }
.brand-mark { width: 36px; height: 36px; border-radius: 10px; font-size: 12px; }
.brand-row h1 { font-size: 15px; }
.brand-row p { font-size: 10px; }
.theme-toggle { min-width: 56px; height: 30px; padding: 0 7px; }
.panel-section { padding: 9px 0 10px; }
.section-heading { margin-bottom: 7px; }
.section-heading > span { width: 20px; height: 20px; border-radius: 6px; }
.section-heading h2 { font-size: 11px; letter-spacing: .07em; }
.section-help { margin: -1px 0 7px; font-size: 9.8px; line-height: 1.35; }
.attribute-note { font-size: 9.4px; line-height: 1.35; }
.control-grid { gap: 6px; }
label { gap: 4px; font-size: 9.8px; }
input[type="number"], input[type="text"], input[type="date"], select { height: 29px; padding: 4px 6px; font-size: 10px; border-radius: 7px; }
.button { min-height: 32px; padding: 6px 9px; border-radius: 8px; font-size: 10.8px; }
.button-row { gap: 6px; margin-top: 6px; }
.switch-row { min-height: 26px; padding: 5px 7px; }
.switch-row span { font-size: 9.8px; }
.toggle-list { gap: 5px; margin-bottom: 6px; }
.compact-field { min-height: 29px; margin-top: 6px; }
.mini-summary { margin-top: 6px; font-size: 9.6px; }
.export-section-top { top: -12px; margin: 0 -6px 1px; padding: 9px 6px 10px; }
.gis-export-row { gap: 6px; margin-top: 6px; }
.gis-export-row select { height: 32px; }
.gis-layer-toggles { margin-top: 5px; }

.engineering-drop {
  min-height: 88px;
  grid-template-columns: 46px minmax(0,1fr);
  grid-template-rows: auto auto;
  place-items: center stretch;
  gap: 4px 9px;
  padding: 10px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--accent) 56%, var(--line));
  border-radius: 10px;
  background:
    linear-gradient(color-mix(in srgb, var(--accent) 4%, transparent), color-mix(in srgb, var(--accent) 4%, transparent)),
    linear-gradient(90deg, color-mix(in srgb, var(--line) 22%, transparent) 1px, transparent 1px),
    linear-gradient(color-mix(in srgb, var(--line) 22%, transparent) 1px, transparent 1px),
    var(--panel-2);
  background-size: auto, 16px 16px, 16px 16px, auto;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--text) 3%, transparent), 0 8px 24px rgba(0,0,0,.12);
}
.engineering-drop::after {
  content: "FIELD DATA";
  position: absolute;
  right: 8px;
  top: 6px;
  font: 700 7px/1 ui-monospace, SFMono-Regular, Consolas, monospace;
  letter-spacing: .16em;
  color: color-mix(in srgb, var(--accent) 68%, var(--muted));
}
.engineering-drop:hover, .engineering-drop.dragover { transform: translateY(-1px); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 28%, transparent), 0 10px 26px color-mix(in srgb, var(--accent) 10%, transparent); }
.drop-icon { grid-row: 1 / span 2; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 9px; background: color-mix(in srgb, var(--accent) 14%, var(--panel-3)); border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--line)); }
.drop-icon svg { width: 25px; height: 25px; fill: none; stroke: var(--accent); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.drop-copy { display: grid; gap: 2px; align-self: end; }
.drop-copy strong { color: var(--text); font-size: 11.5px; }
.drop-copy small { text-align: left; font-size: 9.5px; }
.format-strip { grid-column: 2; align-self: start; width: max-content; max-width: 100%; padding: 3px 5px; border-radius: 5px; background: color-mix(in srgb, var(--panel-3) 90%, transparent); color: var(--muted); font: 700 7.8px/1.2 ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .02em; }
.capacity-note { margin-top: 5px; display: flex; flex-wrap: wrap; align-items: center; gap: 3px 5px; color: var(--muted); font-size: 8.8px; }
.capacity-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 12%, transparent); }
.capacity-note strong { color: var(--text); font-weight: 700; }

.compact-module { margin-top: 7px; border: 1px solid var(--line); border-radius: 9px; background: color-mix(in srgb, var(--panel-2) 82%, transparent); overflow: hidden; }
.compact-module > summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 18px 1fr; align-items: center; gap: 6px; padding: 7px 8px; }
.compact-module > summary::-webkit-details-marker { display: none; }
.compact-module > summary .summary-icon { grid-row: 1 / span 2; width: 18px; height: 18px; display: grid; place-items: center; border-radius: 5px; background: var(--panel-3); color: var(--accent-2); transition: transform .16s ease; }
.compact-module[open] > summary .summary-icon { transform: rotate(180deg); }
.compact-module > summary strong { color: var(--text); font-size: 10px; }
.compact-module > summary small { grid-column: 2; font-size: 8.6px; color: var(--muted); }
.compact-module-body { padding: 8px; border-top: 1px solid var(--soft-line); }
.output-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.output-button { width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 6px; margin-top: 6px; color: var(--text); background: var(--panel-3); border: 1px solid var(--line); }
.output-button:hover:not(:disabled) { border-color: var(--accent); }
.output-button svg, .icon-text-button svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.pdf-button { background: linear-gradient(135deg, color-mix(in srgb, #e35d5d 18%, var(--panel-3)), var(--panel-3)); }
.title-block-module { margin-top: 7px; border-top: 1px solid var(--soft-line); padding-top: 6px; }
.title-block-module > summary { cursor: pointer; color: var(--muted); font-size: 9px; }
.title-block-grid { margin-top: 6px; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.logo-upload { grid-row: span 2; position: relative; cursor: pointer; display: grid; grid-template-columns: 42px 1fr; align-items: center; gap: 6px; padding: 5px; border: 1px dashed var(--line); border-radius: 7px; }
.logo-upload input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.logo-upload span { width: 42px; height: 34px; display: grid; place-items: center; border-radius: 5px; background: var(--field); color: var(--muted); font-size: 8px; overflow: hidden; }
.logo-upload span img { max-width: 100%; max-height: 100%; object-fit: contain; }
.logo-upload strong { color: var(--text); font-size: 9px; }

.description-styles { gap: 6px; padding-bottom: 7px; }
.description-style-row {
  min-width: 500px;
  grid-template-columns: minmax(82px,1.05fr) minmax(82px,.92fr) minmax(76px,.78fr) minmax(230px,2.2fr);
  gap: 4px;
  padding: 5px;
}
.description-style-row select, .description-style-row input[type="number"] { height: 28px; font-size: 9px; padding: 3px 5px; }
.desc-adjustments { grid-template-columns: 26px 48px minmax(142px,1fr); gap: 4px; }
.desc-connect { height: 28px; }
.desc-scale { grid-template-columns: 18px minmax(0,1fr); }
.aci-line-control { display: grid; grid-template-columns: minmax(0,1fr) 42px; gap: 4px; align-items: center; }
.aci-swatches { display: grid; grid-template-columns: repeat(6, 1fr); gap: 3px; }
.aci-swatch { width: 100%; min-width: 17px; height: 20px; padding: 0; border: 1px solid rgba(255,255,255,.28); border-radius: 4px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.18); }
.aci-swatch[data-aci="1"] { background:#e75e5c; }
.aci-swatch[data-aci="2"] { background:#f0c444; }
.aci-swatch[data-aci="3"] { background:#4fc675; }
.aci-swatch[data-aci="4"] { background:#4fc4e0; }
.aci-swatch[data-aci="5"] { background:#5687f4; }
.aci-swatch[data-aci="6"] { background:#d666e3; }
.aci-swatch.active { outline: 2px solid var(--text); outline-offset: 1px; }
.aci-number { width: 42px !important; text-align: center; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }

.tin-repair-section .button-row.two { grid-template-columns: 1fr 1fr; }
.icon-text-button { display: inline-flex; align-items: center; justify-content: center; gap: 5px; }
.tin-action-field { display: inline-flex; align-items: center; gap: 4px; flex: 0 0 auto; }
.tin-action-field span { font-size: 9px; color: var(--muted); }
.tin-action-field select { width: 112px; height: 30px; }

.workspace { grid-template-rows: auto minmax(0, 1fr) auto auto; }
.workspace.profile-open { grid-template-rows: auto minmax(290px, 1fr) minmax(230px, 34vh) auto; }
.profile-drawer { min-height: 0; overflow: hidden; border-top: 1px solid var(--soft-line); background: color-mix(in srgb, var(--panel) 97%, var(--workspace)); }
.profile-drawer[hidden] { display: none; }
.profile-drawer-header { min-height: 48px; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 6px 10px; border-bottom: 1px solid var(--soft-line); background: color-mix(in srgb, var(--header) 95%, transparent); }
.profile-title { min-width: 220px; display: flex; align-items: center; gap: 8px; }
.profile-title-icon { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 8px; background: color-mix(in srgb, var(--accent) 14%, var(--panel-3)); color: var(--accent); }
.profile-title-icon svg { width: 20px; height: 20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.profile-title h3 { margin: 0; font-size: 12px; }
.profile-title p { margin: 1px 0 0; color: var(--muted); font-size: 9px; }
.profile-controls { display: flex; align-items: end; justify-content: flex-end; gap: 5px; min-width: 0; overflow-x: auto; }
.profile-controls label { flex: 0 0 auto; }
.profile-controls label:nth-child(1) select { width: 150px; }
.profile-controls label:nth-child(2) input { width: 66px; }
.profile-controls label:nth-child(3) input { width: 52px; }
.profile-controls .profile-action { min-width: 58px; height: 29px; }
.profile-controls .icon-button { height: 29px; }
.profile-content { height: calc(100% - 49px); display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(290px, .75fr); min-height: 0; }
.profile-chart { min-width: 0; min-height: 0; padding: 6px; overflow: hidden; }
.profile-chart svg { width: 100%; height: 100%; display: block; }
.profile-empty { height: 100%; display: grid; place-items: center; align-content: center; gap: 4px; color: var(--muted); border: 1px dashed var(--line); border-radius: 8px; background: color-mix(in srgb, var(--panel-2) 50%, transparent); text-align: center; }
.profile-empty > span { color: var(--accent); font-size: 22px; }
.profile-empty strong { color: var(--text); font-size: 11px; }
.profile-empty small { max-width: 430px; font-size: 9px; }
.profile-table-wrap { min-height: 0; overflow: auto; border-left: 1px solid var(--soft-line); }
.profile-table { width: 100%; border-collapse: collapse; font: 9px/1.25 ui-monospace, SFMono-Regular, Consolas, monospace; }
.profile-table th { position: sticky; top: 0; z-index: 1; padding: 5px 6px; text-align: right; color: var(--muted); background: var(--panel-3); border-bottom: 1px solid var(--line); }
.profile-table td { padding: 4px 6px; text-align: right; border-bottom: 1px solid var(--soft-line); color: var(--text); }
.profile-table tbody tr:hover td { background: color-mix(in srgb, var(--accent) 7%, transparent); }
.profile-tool-button { position: relative; }
.profile-tool-button::after { content:"P"; position:absolute; right:2px; bottom:1px; width:10px; height:10px; display:grid; place-items:center; border-radius:50%; background:var(--accent); color:var(--button-text); font-size:6px; font-weight:900; }

.convert-only-notice { position: absolute; inset: 82px 20px 20px; z-index: 8; display: grid; place-items: center; align-content: center; gap: 7px; text-align: center; border: 1px dashed color-mix(in srgb, var(--accent) 45%, var(--line)); border-radius: 14px; background: color-mix(in srgb, var(--panel) 92%, transparent); }
.convert-only-notice[hidden] { display: none; }
.convert-only-icon { width: 64px; height: 64px; display:grid; place-items:center; border-radius:16px; color:#07111a; background:linear-gradient(135deg,#ffd166,#ffb15a); font-weight:900; box-shadow:0 12px 30px rgba(255,177,90,.18); }
.convert-only-notice h3 { margin: 5px 0 0; font-size: 15px; }
.convert-only-notice p { max-width: 560px; margin: 0; color: var(--muted); font-size: 10.5px; line-height: 1.5; }
.convert-only-notice strong { color: var(--accent); }
.canvas-wrap.convert-only #mapCanvas { visibility: hidden; }
.canvas-wrap.convert-only .viewport-toolbar-shell, .canvas-wrap.convert-only .canvas-tools, .canvas-wrap.convert-only .coordinate-panel { display:none; }

.vector-sheet { background:#fff; color:#1d2938; font-family:"Segoe UI",Arial,sans-serif; }

@media (max-width: 1050px) {
  .app-shell { grid-template-columns: 330px minmax(0,1fr); }
  .profile-content { grid-template-columns: 1fr; }
  .profile-table-wrap { display:none; }
}
@media (max-width: 760px) {
  body { overflow:auto; }
  .app-shell { display:block; height:auto; }
  .sidebar { overflow:visible; }
  .workspace { min-height:760px; }
  .profile-drawer-header { align-items:flex-start; flex-direction:column; }
  .profile-controls { width:100%; justify-content:flex-start; }
}

/* v12.3: restored readability, framed controls, live split profile and quick PDF sheets */
.app-shell { grid-template-columns: 366px minmax(0, 1fr); }
.sidebar { padding: 14px 12px 18px; }
.brand-row { margin-bottom: 12px; }
.brand-mark { width: 40px; height: 40px; border-radius: 12px; font-size: 13px; }
.brand-row h1 { font-size: 16.5px; }
.brand-row p { font-size: 11px; }
.theme-toggle { min-width: 62px; height: 34px; padding: 0 9px; font-size: 11px; }

.panel-section {
  margin: 0 0 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: color-mix(in srgb, var(--panel-2) 66%, transparent);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--text) 3%, transparent);
}
.panel-section:hover { border-color: color-mix(in srgb, var(--line) 66%, var(--accent)); }
.export-section-top {
  position: relative;
  top: auto;
  z-index: 1;
  margin: 0 0 10px;
  padding: 12px;
  border: 1px solid color-mix(in srgb, var(--accent) 26%, var(--line));
  border-radius: 12px;
  background: color-mix(in srgb, var(--panel) 96%, transparent);
  box-shadow: 0 8px 22px rgba(0,0,0,.12);
}
.section-heading { margin-bottom: 10px; gap: 8px; }
.section-heading > span { width: 24px; height: 24px; border-radius: 7px; font-size: 11px; }
.section-heading h2 { font-size: 12.5px; letter-spacing: .065em; }
.section-help { margin: -1px 0 9px; font-size: 10.8px; line-height: 1.45; }
.attribute-note { margin-top: 8px; font-size: 10.6px; line-height: 1.45; }
.mini-summary { margin-top: 8px; font-size: 10.8px; line-height: 1.45; }
.privacy-note { font-size: 10.5px; }

label { gap: 5px; font-size: 11.4px; }
input[type="number"], input[type="text"], input[type="date"], select {
  height: 34px;
  padding: 6px 8px;
  border-width: 1px;
  border-radius: 8px;
  font-size: 12px;
}
input[type="checkbox"] { width: 18px; height: 18px; }
.button { min-height: 36px; padding: 8px 11px; border-radius: 9px; font-size: 12px; }
.button-row { gap: 8px; margin-top: 8px; }
.control-grid { gap: 8px; }
.toggle-list { gap: 7px; margin-bottom: 8px; }
.switch-row { min-height: 34px; padding: 7px 9px; border-radius: 9px; cursor: pointer; }
.switch-row span { font-size: 11.3px; }
.switch-row:hover { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 7%, var(--panel-2)); }
.compact-field { min-height: 36px; margin-top: 8px; padding: 7px 8px; }
.drop-copy strong { font-size: 12.5px; }
.drop-copy small { font-size: 10.5px; }
.capacity-note { font-size: 9.8px; }
.format-strip { font-size: 8.4px; }

/* Framed input groups make the whole control visually and physically easier to target. */
.control-grid > label,
.boxed-field,
.slider-control,
.compact-field {
  padding: 7px 8px;
  border: 1px solid var(--soft-line);
  border-radius: 9px;
  background: color-mix(in srgb, var(--field) 34%, var(--panel-2));
  transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.control-grid > label:hover,
.boxed-field:hover,
.slider-control:hover,
.compact-field:hover {
  border-color: color-mix(in srgb, var(--accent) 50%, var(--line));
  background: color-mix(in srgb, var(--accent) 4%, var(--panel-2));
}
.control-grid > label:focus-within,
.boxed-field:focus-within,
.slider-control:focus-within,
.compact-field:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 10%, transparent);
}
.control-grid > label input,
.control-grid > label select,
.boxed-field input,
.boxed-field select { background: color-mix(in srgb, var(--field) 92%, transparent); }

/* High-priority engineering outputs, kept at the top of the sidebar. */
.quick-output-stack { display: grid; gap: 8px; margin-top: 9px; }
.quick-output-card {
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: color-mix(in srgb, var(--panel-2) 86%, transparent);
}
.quick-output-card:hover { border-color: color-mix(in srgb, var(--accent) 46%, var(--line)); }
.quick-output-heading { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.quick-output-heading > div { min-width: 0; display: grid; gap: 2px; }
.quick-output-heading strong { color: var(--text); font-size: 11.8px; }
.quick-output-heading small { color: var(--muted); font-size: 9.8px; }
.quick-output-icon {
  width: 31px; height: 31px; flex: 0 0 auto; display: grid; place-items: center;
  border-radius: 8px; color: var(--accent); background: color-mix(in srgb, var(--accent) 13%, var(--panel-3));
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--line));
}
.quick-output-icon.pdf-icon { color: #ff9999; background: color-mix(in srgb, #d85a5a 13%, var(--panel-3)); border-color: color-mix(in srgb, #d85a5a 30%, var(--line)); }
.quick-output-icon svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.quick-output-card .output-grid { gap: 7px; }
.quick-output-card .boxed-field { padding: 6px; font-size: 10.5px; }
.quick-output-card .boxed-field input,
.quick-output-card .boxed-field select { height: 31px; font-size: 10.8px; }
.output-button { min-height: 34px; margin-top: 7px; font-size: 11.2px; }

.pdf-sheet-toggles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.sheet-check {
  min-width: 0; min-height: 64px; padding: 7px 6px; display: grid; grid-template-columns: auto minmax(0,1fr);
  align-items: start; gap: 6px; cursor: pointer; border: 1px solid var(--line); border-radius: 9px;
  background: color-mix(in srgb, var(--field) 44%, var(--panel-2));
}
.sheet-check:hover { border-color: var(--accent); }
.sheet-check:has(input:checked) { border-color: color-mix(in srgb, var(--accent) 70%, var(--line)); background: color-mix(in srgb, var(--accent) 9%, var(--panel-2)); }
.sheet-check:has(input:disabled) { opacity: .48; cursor: not-allowed; }
.sheet-check input { margin: 1px 0 0; }
.sheet-check > span { min-width: 0; display: grid; gap: 2px; }
.sheet-check strong { overflow: hidden; text-overflow: ellipsis; color: var(--text); font-size: 10.3px; white-space: nowrap; }
.sheet-check small { color: var(--muted); font-size: 8.7px; line-height: 1.25; }
.pdf-action-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(132px, .9fr); align-items: end; gap: 7px; margin-top: 7px; }
.pdf-action-row .output-button { margin-top: 0; height: 100%; }
.title-block-module > summary { padding: 4px 0; font-size: 10.5px; }
.title-block-grid { gap: 7px; }
.logo-upload { min-height: 70px; }
.logo-upload strong { font-size: 10.5px; }

/* True two-row preview: map above, live longitudinal profile below. */
.workspace { grid-template-rows: auto minmax(0, 1fr) auto auto; }
.workspace.profile-open { grid-template-rows: auto minmax(250px, 1fr) minmax(250px, 1fr) auto; }
.workspace.profile-open.profile-expanded { grid-template-rows: auto minmax(180px, .58fr) minmax(330px, 1.42fr) auto; }
.profile-drawer {
  position: relative;
  min-height: 0;
  overflow: hidden;
  border-top: 0;
  background: color-mix(in srgb, var(--panel) 97%, var(--workspace));
  box-shadow: 0 -10px 28px rgba(0,0,0,.16);
}
.profile-split-line { height: 8px; display: grid; place-items: center; border-top: 1px solid var(--line); border-bottom: 1px solid var(--soft-line); background: var(--panel-3); }
.profile-split-line span { width: 48px; height: 3px; border-radius: 999px; background: color-mix(in srgb, var(--accent) 50%, var(--line)); }
.profile-drawer-header { min-height: 62px; padding: 8px 12px; gap: 14px; }
.profile-title { min-width: 260px; gap: 10px; }
.profile-title-icon { width: 36px; height: 36px; border-radius: 10px; }
.profile-title-icon svg { width: 22px; height: 22px; }
.profile-heading-line { display: flex; align-items: center; gap: 8px; }
.profile-title h3 { font-size: 13px; }
.profile-title p { margin-top: 3px; font-size: 10.5px; }
.live-badge { display: inline-flex; align-items: center; gap: 4px; padding: 3px 6px; border-radius: 999px; color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); border: 1px solid color-mix(in srgb, var(--accent) 24%, transparent); font-size: 8px; font-weight: 900; letter-spacing: .08em; }
.live-badge i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 12%, transparent); }
.profile-controls { gap: 7px; }
.profile-controls label { padding: 5px 6px; border: 1px solid var(--soft-line); border-radius: 8px; background: color-mix(in srgb, var(--field) 35%, var(--panel-2)); font-size: 10.5px; }
.profile-controls label:nth-child(1) select { width: 180px; }
.profile-controls label:nth-child(2) input { width: 76px; }
.profile-controls label:nth-child(3) input { width: 62px; }
.profile-controls input,
.profile-controls select { height: 31px; font-size: 11px; }
.profile-controls .profile-action { min-width: 64px; height: 34px; font-size: 11px; }
.profile-controls .icon-button { height: 34px; }
.profile-expand-button svg { transition: transform .18s ease; }
.workspace.profile-expanded .profile-expand-button svg { transform: rotate(180deg); }
.profile-content { height: calc(100% - 70px); grid-template-columns: minmax(0, 1.7fr) minmax(310px, .78fr); }
.profile-chart { padding: 9px; }
.profile-empty { gap: 6px; border-radius: 10px; }
.profile-empty > span { font-size: 26px; }
.profile-empty strong { font-size: 12px; }
.profile-empty small { font-size: 10px; line-height: 1.4; }
.profile-table { font-size: 10px; }
.profile-table th { padding: 7px 8px; }
.profile-table td { padding: 6px 8px; }

@media (max-width: 1150px) {
  .profile-drawer-header { align-items: flex-start; flex-direction: column; }
  .profile-controls { width: 100%; justify-content: flex-start; }
  .profile-content { height: calc(100% - 112px); }
}
@media (max-width: 900px) {
  .app-shell { grid-template-columns: 1fr; }
  .panel-section { margin-bottom: 10px; }
  .workspace.profile-open { grid-template-rows: auto minmax(360px, 1fr) minmax(300px, .85fr) auto; }
}
@media (max-width: 560px) {
  .pdf-sheet-toggles { grid-template-columns: 1fr; }
  .sheet-check { min-height: 52px; }
  .pdf-action-row { grid-template-columns: 1fr; }
  .profile-controls label:nth-child(1) select { width: 150px; }
}

/* Keep the live profile inside the viewport; avoid percentage-height grid feedback. */
.profile-drawer:not([hidden]) {
  display: grid;
  grid-template-rows: 8px auto minmax(0, 1fr);
}
.profile-content { height: auto; min-height: 0; }
@media (max-width: 1150px) {
  .profile-content { height: auto; }
}

/* The workspace is a fixed-height grid item beside a scrolling sidebar. */
.app-shell > .workspace { min-height: 0; height: 100%; overflow: hidden; }

/* --------------------------------------------------------------------------
   v12.4: top-priority import, compact output accordion and lighter rendering
   -------------------------------------------------------------------------- */
.sidebar > .panel-section:first-of-type {
  margin-top: 2px;
  border: 1px solid color-mix(in srgb, var(--accent) 46%, var(--line));
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--accent) 10%, var(--panel-2)), color-mix(in srgb, var(--panel) 96%, transparent));
  box-shadow: 0 8px 22px color-mix(in srgb, var(--accent) 9%, transparent);
}
.sidebar > section.panel-section:not(:first-of-type) {
  content-visibility: auto;
  contain-intrinsic-size: auto 240px;
}

.output-accordion {
  display: block;
  margin: 10px 0;
  padding: 0;
  overflow: clip;
  border: 1px solid color-mix(in srgb, var(--line) 78%, var(--accent));
  border-radius: 12px;
  background: color-mix(in srgb, var(--panel-2) 82%, var(--panel));
  box-shadow: 0 6px 18px rgba(0,0,0,.10);
}
.output-accordion[open] {
  border-color: color-mix(in srgb, var(--accent) 36%, var(--line));
}
.output-accordion-summary {
  display: grid;
  grid-template-columns: 34px minmax(0,1fr) 24px;
  align-items: center;
  gap: 9px;
  min-height: 58px;
  padding: 9px 10px;
  color: var(--text);
  cursor: pointer;
  list-style: none;
  user-select: none;
}
.output-accordion-summary::-webkit-details-marker { display: none; }
.output-accordion-summary:hover { background: color-mix(in srgb, var(--accent) 7%, transparent); }
.accordion-main-icon {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  color: var(--button-text);
  background: linear-gradient(145deg, var(--accent), #70d8c1);
  font-size: 18px;
  font-weight: 900;
}
.accordion-summary-copy { min-width: 0; display: grid; gap: 2px; }
.accordion-summary-copy strong { font-size: 13px; letter-spacing: .01em; }
.accordion-summary-copy small { color: var(--muted); font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.accordion-chevron { display: grid; place-items: center; color: var(--muted); font-size: 19px; transition: transform .18s ease; }
.output-accordion[open] .accordion-chevron { transform: rotate(180deg); }
.output-accordion-body { display: grid; gap: 8px; padding: 0 8px 9px; border-top: 1px solid var(--soft-line); }
.output-group {
  margin: 8px 0 0;
  padding: 9px;
  border: 1px solid var(--soft-line);
  border-radius: 10px;
  background: color-mix(in srgb, var(--panel) 70%, var(--panel-2));
}
.output-group-heading { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.output-group-heading > span {
  min-width: 34px;
  height: 27px;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--line));
  border-radius: 7px;
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 8%, var(--panel-3));
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .06em;
}
.output-group-heading > div { min-width: 0; display: grid; gap: 1px; }
.output-group-heading strong { font-size: 11.8px; }
.output-group-heading small { color: var(--muted); font-size: 9.7px; }
.output-group .button.export { margin-top: 8px; }
.output-group .gis-layer-toggles { margin: 7px 0 0; }
.output-group .output-grid { gap: 7px; }
.output-group .boxed-field { padding: 6px; }
.output-group .boxed-field input,
.output-group .boxed-field select { height: 32px; }

.print-quality-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-top: 8px; }
.print-quality-grid .colour-print-check { grid-column: 1 / -1; }
.print-note { display: block; margin-top: 7px; color: var(--muted); font-size: 9.5px; line-height: 1.4; }
.pdf-output-group .pdf-button { margin-top: 8px; }

/* Reduce expensive paint work without changing the visual language. */
.sidebar { overscroll-behavior: contain; scrollbar-gutter: stable; }
.canvas-wrap { contain: layout paint style; }
#mapCanvas { contain: paint; }
.output-accordion:not([open]) .output-accordion-body { display: none; }

@media (max-width: 420px) {
  .print-quality-grid { grid-template-columns: 1fr; }
  .print-quality-grid .colour-print-check { grid-column: auto; }
}


/* --------------------------------------------------------------------------
   v12.7: counter-clockwise north input, 2D-only print north arrow and purple export glow
   -------------------------------------------------------------------------- */
.aci-swatches { grid-template-columns: repeat(5, minmax(20px, 1fr)); }
.aci-swatch[data-aci="7"] {
  background: linear-gradient(135deg, #101318 0 48%, #f5f7fa 52% 100%);
  border-color: color-mix(in srgb, var(--text) 38%, var(--line));
}
.description-style-row select[data-role="color"] { min-width: 92px; }

/* Resizable live map/profile split. The JS supplies a clamped pixel height. */
.workspace.profile-open,
.workspace.profile-open.profile-expanded {
  grid-template-rows: auto minmax(180px, 1fr) var(--profile-pane-height, 360px) auto !important;
}
.profile-split-line {
  height: 11px;
  cursor: row-resize;
  touch-action: none;
  user-select: none;
  outline: none;
  transition: background .16s ease, box-shadow .16s ease;
}
.profile-split-line span {
  width: 58px;
  height: 4px;
  transition: width .16s ease, background .16s ease, box-shadow .16s ease;
}
.profile-split-line:hover,
.profile-split-line:focus-visible,
.workspace.profile-resizing .profile-split-line {
  background: color-mix(in srgb, var(--accent) 12%, var(--panel-3));
  box-shadow: 0 -4px 16px color-mix(in srgb, var(--accent) 18%, transparent), 0 4px 16px color-mix(in srgb, var(--accent) 18%, transparent);
}
.profile-split-line:hover span,
.profile-split-line:focus-visible span,
.workspace.profile-resizing .profile-split-line span {
  width: 84px;
  background: var(--accent);
  box-shadow: 0 0 12px color-mix(in srgb, var(--accent) 52%, transparent);
}
.workspace.profile-resizing,
.workspace.profile-resizing * { cursor: row-resize !important; }

/* Manual north arrow controls and draggable on-canvas compass. */
.north-toolbar { display: inline-flex; align-items: center; gap: 5px; flex: 0 0 auto; }
.north-toggle-button.active {
  color: var(--button-text);
  border-color: color-mix(in srgb, var(--accent) 70%, var(--line));
  background: linear-gradient(145deg, var(--accent), color-mix(in srgb, var(--accent) 70%, #8ee8d4));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 11%, transparent);
}
.north-toggle-button svg { fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.north-angle-control {
  min-width: 82px;
  height: 32px;
  display: inline-grid;
  grid-template-columns: 17px 45px 10px;
  align-items: center;
  gap: 2px;
  padding: 3px 5px;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--field) 58%, var(--panel-2));
}
.north-angle-control[hidden] { display: none !important; }
.north-angle-control span { color: var(--accent); font-size: 10px; font-weight: 900; text-align: center; }
.north-angle-control b { color: var(--muted); font-size: 10px; }
.north-angle-control input { width: 45px; height: 24px; padding: 2px 4px; text-align: center; font-size: 10px; }
.north-arrow-overlay {
  position: absolute;
  right: 17px;
  bottom: 17px;
  z-index: 9;
  width: 78px;
  padding: 5px 5px 4px;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--text) 24%, var(--line));
  border-radius: 14px;
  color: var(--text);
  background: color-mix(in srgb, var(--panel) 91%, transparent);
  box-shadow: 0 8px 24px rgba(0,0,0,.20), inset 0 0 0 1px color-mix(in srgb, var(--accent) 7%, transparent);
  backdrop-filter: blur(8px);
  cursor: grab;
  touch-action: none;
  user-select: none;
}
.north-arrow-overlay[hidden] { display: none !important; }
.north-arrow-overlay.dragging { cursor: grabbing; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 12%, transparent), 0 10px 28px rgba(0,0,0,.24); }
.north-arrow-overlay svg { width: 66px; height: 76px; overflow: visible; }
.north-compass-ring { fill: color-mix(in srgb, var(--panel-2) 62%, transparent); stroke: color-mix(in srgb, var(--text) 28%, var(--line)); stroke-width: 1.2; }
.north-arrow-rotor { transform-origin: 40px 43px; transform-box: view-box; transition: transform .08s linear; }
.north-arrow-overlay.dragging .north-arrow-rotor { transition: none; }
.north-arrow-head { fill: var(--accent); stroke: var(--text); stroke-width: 1; stroke-linejoin: round; }
.north-arrow-stem { fill: none; stroke: var(--text); stroke-width: 2.3; stroke-linecap: round; }
.north-letter { fill: var(--text); font: 900 12px/1 "Segoe UI", Arial, sans-serif; }
.north-centre-dot { fill: var(--text); }
.north-arrow-overlay > span { margin-top: -8px; color: var(--muted); font: 700 9px/1 ui-monospace, SFMono-Regular, Consolas, monospace; }

/* Ready-state purple light sweep only while Print & Export is closed. */
.output-accordion-summary { position: relative; overflow: hidden; isolation: isolate; }
.output-accordion-summary > * { position: relative; z-index: 2; }
.output-accordion.export-ready:not([open]) {
  border-color: color-mix(in srgb, #9b5cff 64%, var(--line));
  animation: exportReadyBorder 2.8s ease-in-out infinite;
}
.output-accordion.export-ready:not([open]) .accordion-main-icon {
  color: #a970ff;
  animation: exportReadyIcon 2.8s ease-in-out infinite;
}
.output-accordion.export-ready:not([open]) .output-accordion-summary::before {
  content: "";
  position: absolute;
  z-index: 1;
  top: -52%;
  bottom: -52%;
  left: -46%;
  width: 31%;
  transform: skewX(-20deg);
  background: linear-gradient(90deg, transparent, rgba(151, 83, 255, .18), rgba(217, 184, 255, .88), rgba(151, 83, 255, .18), transparent);
  filter: blur(.7px);
  animation: exportLightSweep 2.8s cubic-bezier(.18,.72,.2,1) infinite;
  pointer-events: none;
}
@keyframes exportLightSweep {
  0%, 30% { transform: translateX(0) skewX(-20deg); opacity: 0; }
  37% { opacity: .98; }
  69% { transform: translateX(600%) skewX(-20deg); opacity: .12; }
  73%, 100% { transform: translateX(600%) skewX(-20deg); opacity: 0; }
}
@keyframes exportReadyBorder {
  0%, 28%, 100% { box-shadow: 0 6px 18px rgba(0,0,0,.10), 0 0 0 rgba(155,92,255,0); }
  48% { box-shadow: 0 7px 24px rgba(0,0,0,.14), 0 0 22px rgba(155,92,255,.46), inset 0 0 12px rgba(155,92,255,.10); }
  70% { box-shadow: 0 6px 20px rgba(0,0,0,.12), 0 0 11px rgba(155,92,255,.20); }
}
@keyframes exportReadyIcon {
  0%, 28%, 100% { filter: brightness(1); transform: translateY(0) scale(1); }
  48% { filter: brightness(1.30) drop-shadow(0 0 6px rgba(155,92,255,.58)); transform: translateY(-1px) scale(1.05); }
  70% { filter: brightness(1.10); transform: translateY(0) scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .output-accordion.export-ready:not([open]),
  .output-accordion.export-ready:not([open]) .accordion-main-icon,
  .output-accordion.export-ready:not([open]) .output-accordion-summary::before { animation: none; }
  .north-arrow-rotor { transition: none; }
}

@media (max-width: 900px) {
  .workspace.profile-open,
  .workspace.profile-open.profile-expanded {
    grid-template-rows: auto minmax(260px, 1fr) var(--profile-pane-height, 320px) auto !important;
  }
}


/* v12.7 retains the v12.6 unit-selection workflow and unit badge */
.unit-system-modal {
  position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center;
  padding: 24px; background: rgba(3, 8, 16, .72); backdrop-filter: blur(12px);
}
.unit-system-modal[hidden] { display: none !important; }
body.unit-dialog-open { overflow: hidden; }
.unit-system-card {
  width: min(640px, 100%); padding: 26px; border: 1px solid color-mix(in srgb, var(--accent) 42%, var(--line));
  border-radius: 22px; background: linear-gradient(145deg, color-mix(in srgb, var(--panel) 96%, #fff 4%), var(--panel-2));
  box-shadow: 0 30px 90px rgba(0,0,0,.42), inset 0 0 0 1px color-mix(in srgb, var(--accent) 8%, transparent);
}
.unit-system-icon {
  width: 48px; height: 48px; display: grid; place-items: center; margin-bottom: 14px; border-radius: 15px;
  color: var(--button-text); font-size: 25px; font-weight: 900; background: linear-gradient(145deg, var(--accent), color-mix(in srgb, var(--accent) 62%, #8fe6d3));
  box-shadow: 0 10px 28px color-mix(in srgb, var(--accent) 24%, transparent);
}
.unit-system-kicker { color: var(--accent); font-size: 11px; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.unit-system-copy h2 { margin: 5px 0 8px; font-size: 23px; line-height: 1.2; }
.unit-system-copy p { margin: 0; color: var(--muted); line-height: 1.55; }
.unit-system-options { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; margin-top: 21px; }
.unit-system-option {
  min-height: 112px; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; align-items: center;
  column-gap: 12px; padding: 16px; text-align: left; color: var(--text); border: 1px solid var(--soft-line); border-radius: 16px;
  background: color-mix(in srgb, var(--field) 60%, var(--panel-2)); cursor: pointer; transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.unit-system-option:hover, .unit-system-option:focus-visible { transform: translateY(-2px); border-color: var(--accent); box-shadow: 0 12px 28px color-mix(in srgb, var(--accent) 16%, transparent); outline: none; }
.unit-system-option strong { align-self: end; font-size: 17px; }
.unit-system-option small { grid-column: 2; align-self: start; color: var(--muted); font-weight: 650; }
.unit-option-badge { grid-row: 1 / 3; width: 45px; height: 45px; display: grid; place-items: center; border-radius: 13px; font-weight: 900; color: var(--accent); border: 1px solid color-mix(in srgb, var(--accent) 34%, var(--line)); background: color-mix(in srgb, var(--accent) 10%, var(--panel)); }
.unit-system-cancel { display: block; margin: 15px auto 0; padding: 8px 14px; color: var(--muted); background: transparent; border: 0; cursor: pointer; font-weight: 700; }
.unit-system-cancel:hover { color: var(--text); }
.unit-system-note { display: block; margin-top: 8px; color: var(--muted); text-align: center; line-height: 1.45; }
.workspace-title-line { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.unit-system-badge { display: inline-flex; align-items: center; min-height: 24px; padding: 3px 9px; border: 1px solid color-mix(in srgb, var(--accent) 32%, var(--line)); border-radius: 999px; color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, var(--panel)); font-size: 10px; font-weight: 850; letter-spacing: .03em; }
@media (max-width: 600px) { .unit-system-options { grid-template-columns: 1fr; } .unit-system-card { padding: 20px; } }

/* Engine 1.0.2: tabbed sidebar, 3D profile drawing helpers, and contrast workflow */
.sidebar-tabs{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;margin:0 0 10px;padding:7px;border:1px solid color-mix(in srgb,var(--line) 82%,var(--accent));border-radius:14px;background:color-mix(in srgb,var(--panel) 94%,transparent);box-shadow:0 10px 28px rgba(0,0,0,.16);backdrop-filter:blur(12px)}
.sidebar-tab{min-height:34px;padding:6px 5px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--muted);font-size:11px;font-weight:850;letter-spacing:.02em}.sidebar-tab:hover{color:var(--text);background:color-mix(in srgb,var(--accent) 8%,transparent)}.sidebar-tab.active{color:var(--button-text);border-color:color-mix(in srgb,var(--accent) 54%,transparent);background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent-2) 84%,var(--accent)));box-shadow:0 9px 22px color-mix(in srgb,var(--accent) 22%,transparent)}
.sidebar-tab-panel{display:none!important}.sidebar-tab-panel.active{display:block!important}.output-accordion.sidebar-tab-panel.active{display:block!important}.sidebar-tab-panel.active{animation:tabPanelIn .16s ease both}@keyframes tabPanelIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
.snap-toggle-button{min-width:48px;padding-inline:9px;font-size:11px;font-weight:900;letter-spacing:.03em}.snap-toggle-button.active{color:#07111a;background:linear-gradient(135deg,#ffd166,#ff9f43);border-color:rgba(255,209,102,.6)}.contrast-toolbar-field{min-width:132px}.canvas-wrap.draw-active{cursor:crosshair}:root[data-theme="dark"] .canvas-wrap.contrast-high{box-shadow:inset 0 0 0 1px rgba(138,216,255,.18),0 0 0 1px rgba(255,255,255,.02)}:root[data-theme="dark"] .canvas-wrap.contrast-neon{box-shadow:inset 0 0 0 1px rgba(199,146,234,.26),0 0 26px rgba(73,198,167,.10)}@media(max-width:1050px){.sidebar-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Engine 1.0.3: cleaner two-row viewport toolbar, combined Import/Export tab, and 3D face colour palettes */
.viewport-toolbar-shell {
  right: 12px;
  max-width: min(980px, calc(100% - 24px));
}
.viewport-toolbar {
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  min-width: 0;
  overflow-x: visible;
  overflow-y: visible;
  padding: 7px 8px 8px;
}
.toolbar-row {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
  scrollbar-color: var(--accent) var(--panel-3);
  padding-bottom: 1px;
}
.toolbar-row::-webkit-scrollbar { height: 7px; }
.toolbar-row::-webkit-scrollbar-track { background: var(--panel-3); border-radius: 999px; }
.toolbar-row::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--accent) 80%, var(--line)); border-radius: 999px; }
.toolbar-row-view {
  padding-bottom: 5px;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 68%, transparent);
}
.toolbar-row-tools {
  align-items: center;
}
.toolbar-row-tools .toolbar-hint {
  white-space: normal;
  min-width: min(360px, 42vw);
  line-height: 1.25;
}
.contrast-toolbar-field { min-width: 190px; }
.contrast-toolbar-field select { width: 145px; }
.sidebar-tabs { grid-template-columns: repeat(4, minmax(0,1fr)); }
.output-accordion[data-tab-panel="import"] {
  margin-top: 10px;
  border-top: 1px solid color-mix(in srgb, var(--accent) 20%, var(--line));
}
.canvas-wrap.draw-active #mapCanvas,
.canvas-wrap.measure-active #mapCanvas {
  touch-action: none;
}
.canvas-wrap.contrast-primary { box-shadow: inset 0 0 0 1px rgba(255,255,255,.13), 0 0 20px rgba(0,87,255,.10); }
.canvas-wrap.contrast-warm { box-shadow: inset 0 0 0 1px rgba(255,190,95,.16), 0 0 22px rgba(255,90,45,.11); }
.canvas-wrap.contrast-cool { box-shadow: inset 0 0 0 1px rgba(120,210,255,.16), 0 0 22px rgba(0,140,255,.11); }
@media (max-width: 900px) {
  .toolbar-row-tools .toolbar-hint { min-width: 260px; }
  .contrast-toolbar-field { min-width: 176px; }
  .contrast-toolbar-field select { width: 132px; }
}
/* Commercial account, verification and subscription layer */
.account-pill{margin-left:auto;display:inline-flex;align-items:center;gap:7px;border:1px solid rgba(139,92,246,.45);border-radius:999px;background:rgba(139,92,246,.12);color:var(--text,#f4f4f5);padding:7px 10px;font:600 11px/1.1 inherit;white-space:nowrap;cursor:pointer}
.account-pill:hover{background:rgba(139,92,246,.2)}.account-pill.pro{border-color:rgba(34,197,94,.55);background:rgba(34,197,94,.12)}
.account-pill.blocked{border-color:rgba(245,158,11,.62);background:rgba(245,158,11,.13)}
.account-dot{width:7px;height:7px;border-radius:50%;background:#8b5cf6;box-shadow:0 0 10px rgba(139,92,246,.85)}.account-pill.pro .account-dot{background:#22c55e;box-shadow:0 0 10px rgba(34,197,94,.8)}
.access-modal[hidden]{display:none}.access-modal{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;padding:20px}.access-backdrop{position:absolute;inset:0;background:rgba(3,6,18,.78);backdrop-filter:blur(7px)}
.access-card,.pricing-card{position:relative;width:min(440px,100%);border:1px solid rgba(148,163,184,.2);border-radius:20px;background:linear-gradient(145deg,#111827,#0b1020);box-shadow:0 30px 90px rgba(0,0,0,.5);padding:28px;color:#eef2ff}.pricing-card{width:min(900px,100%)}
.access-close{position:absolute;right:14px;top:12px;border:0;background:transparent;color:#94a3b8;font-size:26px;cursor:pointer}.access-kicker{display:block;color:#a78bfa;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;margin-bottom:8px}
.access-card h2,.pricing-card h2{margin:0 30px 8px 0;font-size:24px}.access-card p,.pricing-card p{margin:0 0 20px;color:#aeb8ca;line-height:1.55}.access-form{display:grid;gap:13px}.access-form[hidden]{display:none}.access-form label{display:grid;gap:7px;color:#cbd5e1;font-size:12px;font-weight:700}.access-form input{width:100%;border:1px solid #334155;border-radius:10px;background:#080d18;color:#f8fafc;padding:12px 13px;font:500 14px inherit;outline:none}.access-form input:focus{border-color:#8b5cf6;box-shadow:0 0 0 3px rgba(139,92,246,.15)}
.access-primary{border:0;border-radius:10px;background:linear-gradient(135deg,#7c3aed,#4f46e5);color:#fff;padding:11px 14px;font:750 12px inherit;cursor:pointer}.access-primary:hover{filter:brightness(1.1)}.access-link{border:0;background:transparent;color:#a78bfa;padding:5px;font:650 11px inherit;cursor:pointer}.access-status{min-height:20px;margin-top:12px;color:#c4b5fd;font-size:12px}
.pricing-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.price-card{display:grid;gap:7px;border:1px solid #253149;border-radius:15px;background:rgba(15,23,42,.75);padding:18px}.price-card.featured{border-color:#8b5cf6;box-shadow:0 0 0 1px rgba(139,92,246,.25)}.price-card>span{color:#cbd5e1;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.price-card>strong{font-size:27px}.price-card>small{color:#94a3b8;margin-bottom:9px}.account-summary{grid-column:1/-1;display:flex;align-items:center;gap:12px;border:1px solid #253149;border-radius:12px;padding:12px 14px;color:#cbd5e1}.account-summary strong{color:#fff}.account-summary span{margin-right:auto;font-size:12px}
@media(max-width:720px){.pricing-grid{grid-template-columns:1fr}.account-summary{align-items:flex-start;flex-direction:column}.account-summary span{margin-right:0}.account-pill{padding:7px}.account-pill span:last-child{display:none}}
.brand-logo-mark{width:42px;height:42px;display:block;flex:0 0 auto;border-radius:10px}
.access-google{display:block;text-align:center;margin-top:12px;border:1px solid var(--border,rgba(120,160,190,.35));border-radius:10px;padding:10px 14px;color:inherit;text-decoration:none;background:rgba(255,255,255,.035)}
.access-google[hidden]{display:none}
.account-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:16px}
.account-actions a{color:inherit;text-underline-offset:3px}
.support-pill{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:6px 10px;border:1px solid rgba(120,160,190,.28);border-radius:999px;color:inherit;text-decoration:none;font-size:12px}

/* Commercial UI hardening: keep identity, account and navigation in separate rows. */
.brand-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;margin-bottom:8px}
.brand-copy{min-width:0}.brand-copy p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.account-strip{display:flex;align-items:center;gap:7px;min-height:32px;margin:0 0 10px}
.account-strip .account-pill{margin:0;min-width:0;max-width:calc(100% - 76px);overflow:hidden}
.account-strip .account-pill span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.account-strip .support-pill{margin-left:auto;min-height:30px;padding:5px 9px;font-size:11px}
.point-file-preview{margin-top:9px;border:1px solid color-mix(in srgb,var(--line) 82%,var(--accent));border-radius:11px;background:color-mix(in srgb,var(--panel) 90%,#06101c)}
.point-file-preview[hidden]{display:none}.point-file-preview summary{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 11px;cursor:pointer;list-style:none}.point-file-preview summary::-webkit-details-marker{display:none}
.point-file-preview summary>span:first-child{display:grid;min-width:0}.point-file-preview summary strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.point-file-preview summary small{color:var(--muted);font-size:10px}.preview-open-label{color:var(--accent);font-size:10px;font-weight:800;white-space:nowrap}.point-file-preview[open] .preview-open-label{font-size:0}.point-file-preview[open] .preview-open-label::after{content:"Hide points";font-size:10px}
.point-preview-note{padding:8px 11px;border-top:1px solid var(--soft-line);color:var(--muted);font-size:10px;line-height:1.45}.point-preview-scroll{max-height:250px;overflow:auto;border-top:1px solid var(--soft-line)}.point-preview-scroll table{width:100%;border-collapse:collapse;font:10px/1.35 ui-monospace,SFMono-Regular,Consolas,monospace}.point-preview-scroll th,.point-preview-scroll td{padding:6px 8px;border-bottom:1px solid var(--soft-line);text-align:left;white-space:nowrap}.point-preview-scroll th{position:sticky;top:0;background:var(--panel);color:var(--muted);z-index:1}.point-preview-scroll td:last-child{max-width:130px;overflow:hidden;text-overflow:ellipsis}
@media(max-width:420px){.brand-logo-mark{width:36px;height:36px}.brand-copy p{display:none}.account-strip .support-pill{font-size:0;width:31px;padding:5px}.account-strip .support-pill::after{content:"?";font-size:12px;font-weight:900}.account-strip .account-pill{max-width:calc(100% - 38px)}.sidebar-tabs{position:relative}}