: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: #8a3b6f;
  --minor: #0e7490;
  --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; }
.app-trust-footer { display: grid; gap: 8px; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--soft-line); color: var(--muted); font-size: 10px; line-height: 1.4; }
.app-trust-footer strong { color: var(--text); font-size: 10px; }
.app-trust-footer nav { display: flex; flex-wrap: wrap; gap: 5px 10px; }
.app-trust-footer a { color: var(--accent-2); text-decoration: none; }
.app-trust-footer a:hover { text-decoration: underline; }
.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; }
.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, .button.gis-export { width: 100%; margin-top: 12px; color: #07111a; background: linear-gradient(135deg, #ffd166, #ffb15a); border-color: color-mix(in srgb, #ffd166 68%, var(--line)); 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 { position: relative; 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-cta { display: block; margin: 0 0 7px; color: #f87171; font-size: 14px; font-weight: 800; }
.empty-state p { margin: 0; color: var(--muted); font-size: 12px; }
.center-import-panel { display: grid; place-items: center; width: min(460px, calc(100vw - 36px)); pointer-events: auto; }
.center-import-panel[hidden] { display: none; }
.center-import-panel > .survey-data-panel,
.center-import-panel > .panel-section { width: 100%; max-height: min(620px, calc(100% - 20px)); overflow: auto; }
.empty-state.has-centered-import { pointer-events: auto; place-content: center; gap: 0; }
.empty-state.has-centered-import > .empty-icon,
.empty-state.has-centered-import > h3,
.empty-state.has-centered-import > .empty-state-cta,
.empty-state.has-centered-import > p { display: none; }
.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;
}
.canvas-tools button svg{width:19px;height:19px;display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;margin:auto}
.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); }
.toast.export-limit {
  top: 50%; bottom: auto; max-width: min(520px, calc(100vw - 32px));
  padding: 14px 18px; text-align: center; font-size: 13px; font-weight: 750;
  transform: translate(-50%, calc(-50% + 20px));
}
.toast.export-limit.show { transform: translate(-50%, -50%); }

@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, .export-section-top .button.gis-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; }
.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, .button.gis-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: 1fr;
  gap: 8px;
  margin-top: 8px;
}
.gis-export-row select { height: 36px; }
.button.gis-export:not(:disabled):hover, .button.export:not(:disabled):hover { border-color: #ffe29a; filter: brightness(1.04); }
.gis-metadata-grid { margin-top: 10px; }
.gis-coordinate-settings { margin: 7px 0 2px; padding: 7px 8px 8px; border: 1px solid var(--border); border-radius: 10px; background: color-mix(in srgb, var(--panel) 82%, var(--accent) 18%); }
.settings-caption { margin-bottom: 3px; color: var(--muted); font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
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; }
.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); }
.engineering-drop.awaiting-import { border-color: color-mix(in srgb, #ef4444 76%, var(--line)); animation: importAttentionPulse 2.4s ease-in-out infinite; }
@keyframes importAttentionPulse { 0%, 100% { box-shadow: inset 0 0 0 1px rgba(239,68,68,.16), 0 0 0 0 rgba(239,68,68,0); } 50% { box-shadow: inset 0 0 0 1px rgba(239,68,68,.62), 0 0 0 7px rgba(239,68,68,.12); } }
@media (prefers-reduced-motion: reduce) { .engineering-drop.awaiting-import { animation: none; box-shadow: inset 0 0 0 1px rgba(239,68,68,.32); } }
.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: nowrap; align-items: center; gap: 3px 4px; color: var(--muted); font-size: 8.8px; white-space: nowrap; }
.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); }
.workspace.profile-open .coordinate-panel,
.workspace.profile-open .measurement-readout { display: none !important; }
.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; }
.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: 8.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-main-icon{width:32px;height:32px;border:1px solid rgba(80,196,211,.28);background:linear-gradient(145deg,rgba(18,52,72,.76),rgba(8,27,44,.58));box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 6px 15px rgba(0,0,0,.16);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.accordion-main-icon img{display:block;width:24px;height:24px;object-fit:contain}
.export-sign-icon{display:inline-block;width:16px;height:16px;flex:0 0 auto;object-fit:contain;vertical-align:middle}
.button.export,.button.gis-export{display:inline-flex;align-items:center;justify-content:center;gap:7px}
.button:not(:disabled) .export-sign-icon{animation:exportArrowReady 1.65s cubic-bezier(.2,.75,.25,1) infinite}
.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, .output-group .button.gis-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]) .accordion-main-icon img{animation:exportArrowReady 1.65s cubic-bezier(.2,.75,.25,1) 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); }
}
@keyframes exportArrowReady{
  0%,22%,100%{transform:translate(0,0);filter:drop-shadow(0 0 0 rgba(39,150,236,0))}
  42%{transform:translate(3px,-3px);filter:drop-shadow(0 4px 5px rgba(39,150,236,.42))}
  58%{transform:translate(0,0)}
  72%{transform:translate(2px,-2px)}
}
@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; }
  .output-accordion.export-ready:not([open]) .accordion-main-icon img,
  .button:not(:disabled) .export-sign-icon { 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; } }

/* Import preview and explicit column mapping for pasted or delimited text. */
.import-review-modal{position:fixed;inset:0;z-index:10030;display:grid;place-items:center;padding:24px;background:rgba(3,9,18,.74);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
.import-review-modal[hidden]{display:none!important}.import-review-card{display:flex;flex-direction:column;width:min(1120px,100%);max-height:min(90svh,850px);overflow:hidden;border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line));border-radius:20px;background:var(--panel);box-shadow:0 28px 90px rgba(0,0,0,.45)}
.import-review-header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:22px 26px 16px;border-bottom:1px solid var(--soft-line)}.import-review-kicker{color:var(--accent);font-size:10px;font-weight:850;letter-spacing:.14em;text-transform:uppercase}.import-review-header h2{margin:5px 0 6px;font-size:23px}.import-review-header p{margin:0;color:var(--muted);font-size:12px;line-height:1.45}.import-review-close{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--line);border-radius:11px;background:var(--panel-3);color:var(--text);font-size:23px;line-height:1}
.import-mapping-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:16px 26px}.import-mapping-grid label{display:grid;gap:5px;color:var(--muted);font-size:11px}.import-mapping-grid select{height:34px;min-width:0;font-size:11px}
.import-coordinate-settings{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(0,1.4fr);gap:10px;margin:0 26px 14px;padding:12px;border:1px solid color-mix(in srgb,var(--accent) 24%,var(--soft-line));border-radius:12px;background:color-mix(in srgb,var(--accent) 5%,var(--panel-3))}.import-coordinate-settings>label,.import-utm-settings label{display:grid;gap:5px;color:var(--muted);font-size:11px}.import-coordinate-settings select,.import-coordinate-settings input{height:34px;min-width:0;font-size:11px}.import-utm-settings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.import-utm-settings[hidden]{display:none!important}.import-coordinate-preview{grid-column:1/-1;padding:9px 10px;border-radius:9px;background:color-mix(in srgb,var(--panel) 78%,transparent);color:var(--muted);font-size:10px;line-height:1.45}.import-coordinate-preview.valid{color:var(--accent)}.import-coordinate-preview.invalid{color:var(--danger,#ff6b6b)}
.import-review-table-wrap{min-height:0;overflow:auto;margin:0 26px;border:1px solid var(--soft-line);border-radius:12px}.import-review-table{width:100%;min-width:620px;border-collapse:collapse;font-size:11px}.import-review-table th{position:sticky;top:0;z-index:1;background:var(--panel-3);color:var(--muted);font-size:10px;text-align:left;letter-spacing:.06em;text-transform:uppercase}.import-review-table th,.import-review-table td{padding:8px 10px;border-bottom:1px solid var(--soft-line);white-space:nowrap}.import-review-table tbody tr:last-child td{border-bottom:0}.import-review-table td{max-width:260px;overflow:hidden;text-overflow:ellipsis}.import-review-hint{margin:0;padding:12px 26px 0;color:var(--muted);font-size:11px;line-height:1.4}.import-review-actions{display:flex;justify-content:flex-end;gap:8px;padding:16px 26px 22px}.import-review-actions .button{min-height:38px}.import-review-open{overflow:hidden}
@media(max-width:700px){.import-review-modal{align-items:end;padding:0}.import-review-card{width:100%;max-height:94svh;border-radius:20px 20px 0 0}.import-review-header{padding:18px 16px 14px}.import-review-header h2{font-size:20px}.import-mapping-grid{grid-template-columns:1fr 1fr;padding:14px 16px}.import-coordinate-settings{grid-template-columns:1fr;margin:0 16px 12px}.import-utm-settings{grid-template-columns:1fr 1fr}.import-coordinate-preview{grid-column:1}.import-review-table-wrap{margin:0 16px}.import-review-hint{padding:10px 16px 0}.import-review-actions{padding:12px 16px 16px}.import-review-actions .button{flex:1;min-height:44px}}

/* 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:grid;grid-template-columns:34px minmax(0,1fr) 14px;align-items:center;gap:9px;min-height:50px;border:1px solid rgba(100,170,190,.34);border-radius:15px;background:linear-gradient(135deg,rgba(19,47,66,.96),rgba(8,24,41,.97));color:var(--text,#f4f4f5);padding:7px 9px;text-align:left;white-space:nowrap;cursor:pointer;box-shadow:0 10px 26px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.035);transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease}
.account-pill:hover{border-color:rgba(77,215,189,.62);transform:translateY(-1px);box-shadow:0 13px 30px rgba(0,0,0,.2),0 0 0 1px rgba(77,215,189,.08)}.account-pill.pro{border-color:rgba(55,211,155,.48);background:linear-gradient(135deg,rgba(13,67,57,.76),rgba(7,34,39,.96))}
.account-pill.blocked{border-color:rgba(245,158,11,.62);background:rgba(245,158,11,.13)}
.account-avatar{display:grid;place-items:center;width:34px;height:34px;border:1px solid rgba(105,232,210,.34);border-radius:11px;background:linear-gradient(145deg,rgba(77,215,189,.2),rgba(74,141,255,.13));color:#6be2cf;box-shadow:0 7px 17px rgba(39,183,161,.12)}.account-avatar svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.account-pill-copy{display:grid;min-width:0;gap:3px;overflow:hidden}.account-dashboard-row{display:flex;align-items:center;gap:6px;min-width:0;font-size:11px;line-height:1.1;letter-spacing:.01em}.account-plan-badge{display:inline-flex;align-items:center;max-width:76px;min-height:16px;padding:2px 6px;border:1px solid rgba(92,220,198,.27);border-radius:999px;background:rgba(77,215,189,.1);color:#76e6d3;font-size:8px;font-weight:850;line-height:1;overflow:hidden;text-overflow:ellipsis}.account-pill.blocked .account-plan-badge{border-color:rgba(245,158,11,.38);background:rgba(245,158,11,.12);color:#ffd486}.account-email-viewport{display:block;min-width:0;width:100%;overflow:hidden;mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 9px),transparent 100%);-webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 9px),transparent 100%)}.account-email{display:block;width:max-content;max-width:none;color:var(--muted,#9fb0c3);font-size:9px;font-weight:650;line-height:1.2;will-change:transform}.account-email.is-moving{animation:account-email-pan 5.8s 1.2s ease-in-out infinite alternate}.account-pill:hover .account-email.is-moving,.account-pill:focus-visible .account-email.is-moving{animation-play-state:paused}@keyframes account-email-pan{0%,18%{transform:translateX(0)}82%,100%{transform:translateX(calc(-1 * var(--email-overflow)))}}
.account-chevron{color:#7d9bad;font-size:19px;line-height:1;transition:transform .18s ease}.account-pill:hover .account-chevron{transform:translateX(2px);color:#72dfcb}
.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-close.referral-close-button{width:38px;height:38px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--accent-2) 35%,var(--line));border-radius:50%;background:color-mix(in srgb,var(--panel-3) 88%,transparent);color:var(--text);font-size:23px;line-height:1}.access-close.referral-close-button:hover{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,var(--panel-3))}.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)}
.consent-options{display:grid;gap:6px;margin:12px 0 4px;padding:10px 11px;border:1px solid #334155;border-radius:10px;background:rgba(15,23,42,.62)}.consent-options legend{padding:0 5px;color:#f8fafc;font-size:11px;font-weight:850}.consent-options label{display:grid!important;grid-template-columns:auto 1fr;gap:7px!important;align-items:start;margin:0!important;color:#e2e8f0!important;font-size:11px!important}.consent-options input{width:auto!important;margin-top:2px;padding:0!important;accent-color:#5dd6c0}.consent-options small{grid-column:2;color:#94a3b8;font-size:9px;margin-top:-4px}.service-email-copy{display:block;color:#94a3b8;font-size:9px;line-height:1.4;margin:8px 0 10px}
.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}
.free-trial-card{width:min(620px,100%);border-color:rgba(77,215,189,.38)}.free-trial-card>p{margin-bottom:10px}.free-trial-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}.free-trial-actions .free-trial-continue,.free-trial-actions .free-trial-cancel{grid-column:1/-1}.free-trial-actions [data-free-trial-action="basic"]{background:linear-gradient(135deg,#168f78,#0d6f60)}.free-trial-actions .free-trial-continue{background:linear-gradient(135deg,#334a68,#243852);min-height:44px}.free-trial-actions .free-trial-cancel,.pro-only-actions .access-link{justify-self:stretch;min-height:40px;border:1px solid #334155;border-radius:10px;color:#cbd5e1;background:rgba(255,255,255,.025)}.pro-only-card{width:min(500px,100%);border-color:rgba(167,139,250,.45)}.pro-only-actions{display:grid;grid-template-columns:1fr;gap:10px}.free-plan-card{border-color:rgba(77,215,189,.45)}.free-plan-card p,.tier-plan-card>p{margin:0;color:#aeb8ca;font-size:11px;line-height:1.45}.tier-plan-card{grid-column:span 1}.tier-plan-options{display:grid;gap:8px;margin-top:3px}.tier-plan-option{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:8px;row-gap:2px;padding:9px 10px;border:1px solid #2a3851;border-radius:10px;background:rgba(8,13,24,.42)}.tier-plan-option>span{color:#d7e0ee;font-size:11px;font-weight:750}.tier-plan-option>strong{font-size:17px}.tier-plan-option>small{color:#8fa1b8;font-size:10px}.tier-plan-option>button{grid-column:1/-1;margin-top:4px;width:100%;padding:8px 10px;font-size:11px}
.free-upgrade-card{width:min(580px,100%);border-color:rgba(77,215,189,.42)}.free-export-unlocks{padding:12px 14px;border:1px solid rgba(77,215,189,.22);border-radius:12px;background:rgba(77,215,189,.06);line-height:1.8}.free-upgrade-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.free-upgrade-actions .access-link{grid-column:1/-1;justify-self:center}.free-upgrade-actions #upgradeBasicButton{background:linear-gradient(135deg,#168f78,#0d6f60)}.free-upgrade-actions #downloadFreeButton{grid-column:1/-1;background:linear-gradient(135deg,#253a53,#1a2b42);color:#eaf5ff}
@media(max-width:720px){.pricing-grid,.free-upgrade-actions,.free-trial-actions{grid-template-columns:1fr}.account-summary{align-items:flex-start;flex-direction:column}.account-summary span{margin-right:0}.account-pill{padding:7px 9px}}
@media(prefers-reduced-motion:reduce){.account-email.is-moving{animation:none;max-width:100%;overflow:hidden;text-overflow:ellipsis}.account-pill{transition:none}}
.brand-logo-mark{width:42px;height:42px;display:block;flex:0 0 auto;object-fit:contain}
.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}
.pricing-pill{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:6px 10px;border:1px solid rgba(99,167,255,.35);border-radius:999px;color:#b7daff;text-decoration:none;font-size:11px;white-space:nowrap}

/* 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-copy{overflow:hidden}
.account-strip .support-pill{margin-left:auto;min-height:30px;padding:5px 9px;font-size:11px}
.account-strip .pricing-pill{min-height:30px;padding:5px 9px;font-size:11px}
.brand-row .account-pill{max-width:190px;min-height:56px}
.brand-row .account-dashboard-row{font-size:13px}
.brand-row .account-email{font-size:10px}
.account-strip .theme-toggle{min-width:62px;height:30px;min-height:30px;padding:0 10px;font-size:11px}

/* Keep the account action compact beside the brand at narrow sidebar widths. */
.brand-row{grid-template-columns:auto minmax(105px,1fr) minmax(0,190px);align-items:center}
.brand-row .account-pill{width:190px;max-width:190px;min-height:50px;padding:6px 8px;color:#f4f9ff}
.brand-row .account-dashboard-row{font-size:12px;color:#f4f9ff}
.brand-row .account-email{font-size:9px;color:#b8c9d9}
.brand-row .account-avatar{width:32px;height:32px}

/* Shared utility-button motion: the header should feel like one control group. */
.brand-row .account-pill,
.account-strip .theme-toggle,
.account-strip .pricing-pill,
.account-strip .support-pill{
  border-radius:12px;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background-color .16s ease;
}
.brand-row .account-pill{box-shadow:0 8px 20px rgba(12,31,48,.18),inset 0 1px 0 rgba(255,255,255,.05)}
.account-strip .theme-toggle,
.account-strip .pricing-pill,
.account-strip .support-pill{
  border:1px solid var(--line);
  background:var(--panel-3);
  color:var(--text);
  text-decoration:none;
}
.account-strip .pricing-pill{font-size:11px;color:var(--text)}
.account-strip .support-pill{font-size:11px}
.brand-row .account-pill:hover,
.account-strip .theme-toggle:hover,
.account-strip .pricing-pill:hover,
.account-strip .support-pill:hover{
  transform:translateY(-1px);
  border-color:var(--accent);
  box-shadow:0 7px 16px color-mix(in srgb,var(--accent) 18%,transparent);
}
.brand-row .account-pill:focus-visible,
.account-strip .theme-toggle:focus-visible,
.account-strip .pricing-pill:focus-visible,
.account-strip .support-pill:focus-visible{outline:2px solid color-mix(in srgb,var(--accent) 55%,transparent);outline-offset:2px}

/* Keep coordinate paste compact and grouped with the file import controls. */
.survey-data-heading>h2{flex:1}.survey-data-panel.is-collapsed .survey-data-heading{margin-bottom:0}.survey-data-body[hidden]{display:none}.survey-data-toggle{display:grid;place-items:center;width:24px;height:24px;padding:0;border:1px solid var(--line);border-radius:7px;background:color-mix(in srgb,var(--panel) 75%,transparent);color:var(--muted);font-size:14px;line-height:1;cursor:pointer;transition:color .18s ease,border-color .18s ease,background .18s ease}.survey-data-toggle:hover{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--text)}
.coordinate-input-divider{display:flex;align-items:center;gap:9px;margin:12px 0 0;color:var(--muted);font-size:9px;font-weight:800;letter-spacing:.16em;text-align:center}.coordinate-input-divider::before,.coordinate-input-divider::after{content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--soft-line))}.coordinate-input-divider::after{background:linear-gradient(90deg,var(--soft-line),transparent)}.coordinate-data-toggle{display:block;width:max-content;min-width:164px;max-width:100%;margin:8px auto 0;padding:9px 17px;border:1px solid rgba(96,165,250,.78);border-radius:10px;background:linear-gradient(135deg,rgba(59,130,246,.24),rgba(96,165,250,.08));color:color-mix(in srgb,var(--text) 92%,#bfdbfe);font:750 12px/1.2 inherit;cursor:pointer;backdrop-filter:blur(12px) saturate(145%);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 7px 18px rgba(30,64,175,.2);transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease}.coordinate-data-toggle:hover,.coordinate-data-toggle.is-open{background:linear-gradient(135deg,rgba(37,99,235,.36),rgba(96,165,250,.16));border-color:#60a5fa;box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 9px 22px rgba(37,99,235,.28);transform:translateY(-1px)}.coordinate-data-toggle:focus-visible{outline:2px solid rgba(96,165,250,.65);outline-offset:2px}
.coordinate-paste-box{pointer-events:auto;width:100%;margin:11px 0 0;padding:10px 12px;border:1px solid color-mix(in srgb,var(--accent) 34%,var(--line));border-radius:11px;background:color-mix(in srgb,var(--panel) 78%,transparent);text-align:left;box-shadow:0 8px 22px rgba(0,0,0,.14)}.coordinate-paste-box[hidden]{display:none}
.coordinate-table-toolbar{display:grid;grid-template-columns:1.35fr 1fr .72fr .9fr;gap:6px;margin-bottom:9px}.coordinate-table-toolbar label{display:grid;gap:3px;color:var(--muted);font-size:9px;font-weight:700}.coordinate-table-toolbar select{min-width:0;height:28px;padding:0 6px;border:1px solid var(--line);border-radius:6px;background:var(--workspace);color:var(--text);font-size:10px}.coordinate-table-heading{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin:2px 0 5px}.coordinate-table-heading strong{font-size:11px}.coordinate-table-heading small{color:var(--muted);font-size:9px}.coordinate-table-paste-label{display:block}.coordinate-table-scroll{max-width:100%;overflow:auto;margin-top:8px;border:1px solid var(--line);border-radius:8px;background:color-mix(in srgb,var(--workspace) 76%,transparent)}.coordinate-entry-table{width:760px;min-width:100%;border-collapse:collapse;font-size:10px}.coordinate-entry-table th{position:sticky;top:0;z-index:1;padding:6px 5px;background:color-mix(in srgb,var(--panel) 94%,var(--accent));color:var(--muted);font-size:9px;font-weight:800;letter-spacing:.03em;text-align:left;white-space:nowrap}.coordinate-entry-table td{padding:3px;border-top:1px solid color-mix(in srgb,var(--line) 70%,transparent)}.coordinate-entry-table input{width:100%;min-width:72px;height:25px;padding:3px 5px;border:1px solid transparent;border-radius:4px;background:transparent;color:var(--text);font:10px ui-monospace,SFMono-Regular,Consolas,monospace}.coordinate-entry-table input:focus{border-color:var(--accent);outline:none;background:var(--workspace)}.coordinate-entry-table td:nth-child(1) input{min-width:58px}.coordinate-entry-table td:nth-child(5) input,.coordinate-entry-table td:nth-child(7) input{min-width:110px}.coordinate-remove-row{width:24px;height:24px;border:0;border-radius:5px;background:transparent;color:var(--muted);font-size:16px;cursor:pointer}.coordinate-remove-row:hover{background:color-mix(in srgb,#ef6d78 18%,transparent);color:#ef6d78}.coordinate-table-actions{display:flex;align-items:end;justify-content:space-between;gap:8px;margin-top:8px}.coordinate-table-actions label{display:grid;gap:3px;color:var(--muted);font-size:10px}.coordinate-table-actions select{height:29px;padding:0 7px;border:1px solid var(--line);border-radius:6px;background:var(--workspace);color:var(--text);font-size:11px}.coordinate-add-row{height:29px;padding:0 9px;border:1px solid var(--line);border-radius:7px;background:transparent;color:var(--text);font:700 10px inherit;cursor:pointer}.coordinate-add-row:hover{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent)}
.coordinate-paste-box>label{display:block;margin-bottom:6px;color:var(--text);font-size:11px;font-weight:750}.coordinate-paste-box textarea{display:block;width:100%;height:66px;resize:vertical;padding:7px 8px;border:1px solid var(--line);border-radius:7px;background:color-mix(in srgb,var(--workspace) 84%,transparent);color:var(--text);font:11px/1.45 ui-monospace,SFMono-Regular,Consolas,monospace;outline:none}.coordinate-paste-box textarea:focus{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 18%,transparent)}.coordinate-paste-actions{display:flex;align-items:end;justify-content:space-between;gap:8px;margin-top:7px}.coordinate-paste-actions label{display:grid;gap:3px;color:var(--muted);font-size:10px}.coordinate-paste-actions select{height:28px;padding:0 7px;border:1px solid var(--line);border-radius:6px;background:var(--workspace);color:var(--text);font-size:11px}.coordinate-paste-button{height:29px;padding:0 10px;border:1px solid color-mix(in srgb,var(--accent) 52%,var(--line));border-radius:7px;background:color-mix(in srgb,var(--accent) 15%,var(--panel));color:var(--text);font:750 10px inherit;cursor:pointer}.coordinate-paste-button:hover{background:color-mix(in srgb,var(--accent) 25%,var(--panel))}.coordinate-paste-box small{display:block;margin-top:6px;color:var(--muted);font-size:9px}.coordinate-paste-box[data-error=true] textarea{border-color:#ef6d78}.app-version{position:fixed;z-index:140;right:10px;bottom:8px;padding:3px 7px;border:1px solid color-mix(in srgb,var(--line) 80%,var(--accent));border-radius:6px;background:color-mix(in srgb,var(--panel) 88%,transparent);color:var(--muted);font:600 9px/1 ui-monospace,SFMono-Regular,Consolas,monospace;pointer-events:none;opacity:.82}
.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 .pricing-pill{font-size:0;width:54px;padding:5px}.account-strip .pricing-pill::after{content:"$";font-size:11px;font-weight:900}.account-strip .account-pill{max-width:calc(100% - 38px)}.sidebar-tabs{position:relative}}
.referral-home-welcome{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;justify-items:center;gap:10px;width:100%;margin:8px 0 14px;padding:9px 36px 9px 12px;border:1px solid color-mix(in srgb,var(--accent) 55%,var(--line));border-radius:11px;background:linear-gradient(145deg,color-mix(in srgb,var(--panel-2) 92%,var(--accent)),var(--panel));color:var(--text);box-shadow:0 8px 22px color-mix(in srgb,var(--accent) 12%,transparent);text-align:center}.referral-home-welcome strong{grid-column:1;font-size:11px;white-space:nowrap}.referral-home-welcome span{display:none}.referral-home-welcome a{grid-column:2;display:inline-flex;align-items:center;justify-content:center;border:1px solid color-mix(in srgb,var(--accent) 70%,var(--line));border-radius:7px;background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--text);padding:6px 10px;font-size:10px;font-weight:800;text-decoration:none;cursor:pointer;white-space:nowrap}.referral-home-welcome a:hover{background:color-mix(in srgb,var(--accent) 28%,transparent);border-color:var(--accent)}.referral-home-close{position:absolute;right:7px;top:50%;transform:translateY(-50%);width:23px;height:23px;display:grid;place-items:center;padding:0;border:1px solid color-mix(in srgb,var(--line) 80%,var(--accent));border-radius:50%;background:color-mix(in srgb,var(--panel) 72%,transparent);color:var(--muted);font-size:15px;line-height:1}.referral-home-close:hover{color:var(--text);border-color:var(--accent)}.referral-invite-card{width:min(460px,100%)}.referral-after-login-notice{width:min(500px,100%);text-align:center;border-color:color-mix(in srgb,var(--accent) 60%,var(--line));background:linear-gradient(145deg,var(--panel-2),var(--panel))}.referral-after-login-notice h2{margin-right:0;font-size:25px}.referral-after-login-notice h2 span{color:var(--accent)}.referral-after-login-notice p{max-width:390px;margin:0 auto 22px}.referral-after-login-action{display:inline-flex;justify-content:center;text-decoration:none;min-width:170px}@media(max-width:560px){.referral-home-welcome{gap:7px;padding:8px 31px 8px 9px}.referral-home-welcome strong{font-size:10px}.referral-home-welcome a{padding:6px 9px}}

/* Use the complete supplied brand artwork instead of rebuilding its wordmark in HTML. */
.brand-row{grid-template-columns:minmax(0,1fr) auto}
.brand-artwork{display:flex;align-items:center;justify-content:center;width:min(174px,100%);height:50px;padding:5px 8px;border:1px solid rgba(77,215,189,.28);border-radius:12px;background:#f7fbff;overflow:hidden;text-decoration:none;box-shadow:0 7px 20px rgba(0,0,0,.14)}
.brand-artwork img{display:block;width:158px;max-width:100%;height:auto;max-height:42px;object-fit:contain}
@media(max-width:420px){.brand-artwork{width:154px;height:44px;padding:4px 7px}.brand-artwork img{width:140px;max-height:36px}}

/* Layered glass brand header with controls separated below the artwork. */
.brand-row{display:flex;align-items:center;justify-content:flex-start;margin-bottom:0}
.brand-artwork{position:relative;isolation:isolate;width:184px;height:54px;padding:6px 9px;border:1px solid rgba(192,238,255,.52);background:linear-gradient(135deg,rgba(246,252,255,.82),rgba(205,235,245,.62));box-shadow:inset 0 1px 0 rgba(255,255,255,.9),inset 0 -1px 0 rgba(14,91,117,.14),0 12px 28px rgba(0,11,24,.22),0 2px 8px rgba(25,178,196,.12);backdrop-filter:blur(16px) saturate(135%);-webkit-backdrop-filter:blur(16px) saturate(135%)}
.brand-artwork::before{content:"";position:absolute;z-index:-1;inset:1px 1px auto;height:48%;border-radius:10px 10px 50% 50%;background:linear-gradient(180deg,rgba(255,255,255,.62),rgba(255,255,255,0));pointer-events:none}
.brand-artwork img{width:166px;max-height:44px;filter:drop-shadow(0 2px 3px rgba(4,36,55,.14))}
.theme-control-row{display:flex;justify-content:flex-end;min-height:32px;margin:3px 0 5px;padding-right:1px}
.theme-control-row .theme-toggle{border-color:rgba(128,195,219,.38);background:linear-gradient(145deg,rgba(19,44,66,.72),rgba(10,27,44,.48));box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 7px 18px rgba(0,0,0,.16);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.account-strip{margin-top:0;margin-bottom:8px}
@media(max-width:420px){.brand-artwork{width:164px;height:48px;padding:5px 8px}.brand-artwork img{width:148px;max-height:39px}.theme-control-row{margin:2px 0 5px}}

/* Project reset stays visible in the workspace corner and only activates with loaded points. */
.clear-project-corner{position:absolute;top:74px;right:18px;z-index:12;display:grid;place-items:center;width:42px;height:42px;padding:0;border:1px solid #ff7f87;border-radius:12px;background:linear-gradient(145deg,#f0525d,#d73542);color:#fff;box-shadow:0 8px 22px rgba(218,48,60,.25);cursor:pointer;transition:transform .15s ease,filter .15s ease,opacity .15s ease}
.clear-project-corner span{display:grid;place-items:center;width:100%;height:100%;font:700 30px/1 ui-sans-serif,system-ui,sans-serif;transform:translateY(1px)}
.clear-project-corner:not(:disabled):hover{filter:brightness(1.1);transform:translateY(-1px)}
.clear-project-corner:focus-visible{outline:3px solid rgba(255,111,120,.3);outline-offset:3px}
.clear-project-corner:disabled{display:none}

.mobile-gesture-hint{display:none}
@media(max-width:760px){
  .workspace{height:78svh;min-height:620px;grid-template-rows:auto minmax(420px,1fr) auto}
  .workspace-header{min-height:58px;padding:10px 60px 10px 13px}.workspace-header h2{font-size:15px}.workspace-header p{font-size:10px}.legend{display:none}
  .clear-project-corner{top:66px;right:9px;width:40px;height:40px;border-radius:11px}
  .canvas-wrap{min-height:430px;overscroll-behavior:contain}.viewport-toolbar-shell{top:8px;left:8px;right:8px;max-width:none}.viewport-toolbar{padding:6px}
  .canvas-tools{top:118px;right:8px}.coordinate-panel{left:8px;bottom:8px}.stats-bar{min-height:58px}.stats-bar div{padding:8px 12px}
  .desktop-gesture-hint{display:none}.mobile-gesture-hint{display:inline;color:var(--accent);font-weight:800}.toolbar-row-tools .toolbar-hint{min-width:245px}
  #mapCanvas{touch-action:none;-webkit-user-select:none;user-select:none}
}

/* Free export modal: make the non-upgrade path a proper, accessible button. */
.free-upgrade-actions .access-link{
  grid-column:1/-1;
  justify-self:stretch;
  min-height:44px;
  padding:10px 14px;
  border:1px solid rgba(167,139,250,.55);
  border-radius:10px;
  color:#d8c9ff;
  background:linear-gradient(180deg,rgba(167,139,250,.14),rgba(91,71,156,.16));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  font:750 12px/1.2 inherit;
  letter-spacing:.01em;
  transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease,color .16s ease;
}
.free-upgrade-actions .access-link:hover{
  transform:translateY(-1px);
  border-color:#c4b5fd;
  color:#fff;
  background:linear-gradient(180deg,rgba(167,139,250,.25),rgba(91,71,156,.25));
  box-shadow:0 8px 18px rgba(124,58,237,.18),inset 0 1px 0 rgba(255,255,255,.1);
}
.free-upgrade-actions .access-link:focus-visible{
  outline:2px solid #c4b5fd;
  outline-offset:3px;
}
@media(max-width:420px){.workspace{height:76svh;min-height:570px;grid-template-rows:auto minmax(380px,1fr) auto}.canvas-wrap{min-height:390px}.stats-bar span{font-size:8px}.stats-bar strong{font-size:11px}}

/* Engine 1.0.4: compact single-row viewport ribbon and vertical Z control. */
.workspace-header{
  min-height:58px;
  padding:10px 18px;
  gap:14px;
}
.workspace-header h2{margin-bottom:1px;font-size:16px}
.workspace-header p{font-size:10.5px;line-height:1.25}
.workspace-title-line{gap:8px;flex-wrap:nowrap}
.legend{gap:11px;font-size:10px}
.legend span{gap:5px}
.legend-line{width:20px}

.viewport-toolbar-shell{
  top:8px;
  left:8px;
  right:60px;
  max-width:none;
  container-type:inline-size;
  overflow:visible;
  border-radius:11px;
  background:color-mix(in srgb,var(--panel) 88%,transparent);
  box-shadow:0 8px 24px rgba(5,18,31,.14);
}
.viewport-toolbar{
  width:100%;
  min-width:0;
  min-height:44px;
  display:flex;
  flex-direction:row;
  flex-wrap:nowrap;
  align-items:center;
  gap:0;
  padding:5px 6px;
  overflow:visible;
  scrollbar-width:none;
}
.viewport-toolbar::-webkit-scrollbar{display:none}
.toolbar-row{
  display:contents;
}
.toolbar-row > *{scroll-snap-align:start}
.toolbar-row-view,
.toolbar-row-tools{
  padding:0;
  border:0;
}
.toolbar-row-view > *,
.toolbar-row-tools > .toolbar-group{
  margin-inline:3px;
}
.toolbar-row-view > * + *,
.toolbar-row-tools > .toolbar-group{
  padding-inline-start:6px;
  border-inline-start:1px solid color-mix(in srgb,var(--line) 68%,transparent);
}
.toolbar-button{
  min-width:36px;
  height:32px;
  padding-inline:8px;
}
.toolbar-button.icon-button{width:34px;min-width:34px;height:32px}
.toolbar-field{gap:4px}
.toolbar-field > span,
.tin-action-field > span{font-size:8px}
.toolbar-field select{width:108px;height:32px;padding-inline:7px 24px}
.contrast-toolbar-field{min-width:0}
.contrast-toolbar-field select{width:128px}
.tin-action-field select{width:105px}
.toolbar-row-tools .toolbar-hint{display:none}

.toolbar-icon-select{
  position:relative;
  display:inline-grid;
  place-items:center;
  width:36px;
  min-width:36px;
  height:32px;
  flex:0 0 36px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:9px;
  color:var(--text);
  background:var(--panel-3);
  cursor:pointer;
}
.toolbar-icon-select:hover{color:var(--accent);border-color:var(--accent)}
.toolbar-icon-select:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 16%,transparent)}
.toolbar-icon-select:has(select:disabled){opacity:.4;cursor:not-allowed}
.toolbar-icon-select svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.toolbar-icon-select::after{content:"";position:absolute;right:3px;bottom:3px;width:0;height:0;border-left:3px solid transparent;border-right:3px solid transparent;border-top:4px solid currentColor;opacity:.62;pointer-events:none}
.toolbar-icon-select select{position:absolute;inset:0;width:100%!important;min-width:0!important;height:100%!important;margin:0;padding:0;opacity:0;cursor:pointer}
.toolbar-icon-select select:disabled{cursor:not-allowed}
.vertical-exaggeration-control{
  position:relative;
  z-index:30;
  display:inline-grid;
  place-items:center;
  width:48px;
  height:32px;
  margin-inline:3px 5px;
  border:1px solid var(--line);
  border-radius:9px;
  color:var(--muted);
  background:var(--panel-3);
  cursor:ns-resize;
  transition:border-color .16s ease,background .16s ease,box-shadow .16s ease;
}
.vertical-exaggeration-control > span{
  display:flex;
  align-items:center;
  gap:2px;
  font-size:9.5px;
  font-weight:800;
}
.vertical-exaggeration-trigger{
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  padding:0;
  border:0;
  border-radius:inherit;
  color:inherit;
  background:transparent;
  cursor:inherit;
}
.vertical-exaggeration-trigger > span{display:flex;align-items:center;gap:2px;font-size:9.5px;font-weight:800}
.vertical-exaggeration-control output{color:var(--text);font-weight:900}
.vertical-exaggeration-control input[type="range"]{
  position:absolute;
  z-index:40;
  left:50%;
  top:calc(100% + 8px);
  bottom:auto;
  width:22px;
  height:126px;
  margin:0;
  padding:10px 7px;
  border:1px solid color-mix(in srgb,var(--accent) 38%,var(--line));
  border-radius:999px;
  background:color-mix(in srgb,var(--panel) 92%,transparent);
  box-shadow:0 12px 28px rgba(4,16,28,.22),inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  writing-mode:vertical-lr;
  direction:rtl;
  appearance:slider-vertical;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate(-50%,-6px);
  transform-origin:top center;
  transition:opacity .16s ease,transform .16s ease,visibility .16s;
}
.vertical-exaggeration-control:hover,
.vertical-exaggeration-control.is-open{
  border-color:var(--accent);
  background:color-mix(in srgb,var(--accent) 10%,var(--panel-3));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 10%,transparent);
}
.vertical-exaggeration-control.is-open input[type="range"]{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translate(-50%,0);
}
.vertical-exaggeration-control:has(input:disabled){opacity:.42;cursor:not-allowed}
.vertical-exaggeration-control:has(input:disabled):hover{border-color:var(--line);box-shadow:none}
.vertical-exaggeration-control:has(input:disabled) input{display:none}

.surface-flow-control{display:inline-flex;align-items:center;gap:5px;flex:0 0 auto;margin-inline:2px 5px;padding-inline-start:7px;border-inline-start:1px solid color-mix(in srgb,var(--line) 68%,transparent)}
.surface-flow-toggle{position:relative;display:block;flex:0 0 auto}
.surface-flow-toggle input{position:absolute;inline-size:1px;block-size:1px;opacity:0;pointer-events:none}
.surface-flow-toggle span{display:grid;place-items:center;width:36px;min-width:36px;height:32px;padding:0;border:1px solid var(--line);border-radius:9px;background:var(--panel-3);color:var(--muted);cursor:pointer;transition:color .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease}
.surface-flow-toggle svg{width:20px;height:20px;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.surface-flow-toggle .flow-arrow{transform-box:fill-box;transform-origin:center;opacity:.68;animation:flow-arrow-idle 2.4s ease-in-out infinite}
.surface-flow-toggle .flow-arrow-2{animation-delay:.24s}
.surface-flow-toggle input:checked + span{color:#22d3ee;border-color:color-mix(in srgb,#22d3ee 72%,var(--line));background:color-mix(in srgb,#22d3ee 12%,var(--panel-3));box-shadow:0 0 0 3px rgba(34,211,238,.1)}
.surface-flow-toggle input:checked + span .flow-arrow{animation:flow-arrow-stream 1.15s ease-in-out infinite}
.surface-flow-toggle input:checked + span .flow-arrow-1{stroke:#22d3ee}
.surface-flow-toggle input:checked + span .flow-arrow-2{stroke:#a78bfa}
.surface-flow-toggle input:checked + span .flow-arrow-2{animation-delay:.14s}
.surface-flow-toggle.performance-static .flow-arrow{animation:none!important;opacity:1;transform:none}
@keyframes flow-arrow-idle{0%,100%{opacity:.42;transform:translateX(-.75px)}50%{opacity:.76;transform:translateX(.75px)}}
@keyframes flow-arrow-stream{0%,100%{opacity:.32;transform:translateX(-2px)}50%{opacity:1;transform:translateX(2px)}}
@media(prefers-reduced-motion:reduce){.surface-flow-toggle .flow-arrow{animation:none!important;transform:none!important}}
.surface-flow-toggle input:focus-visible + span{outline:2px solid var(--accent);outline-offset:2px}
.surface-flow-toggle input:disabled + span{opacity:.4;cursor:not-allowed;box-shadow:none}
.flow-settings-control{position:relative;z-index:30;width:34px;height:32px}
.flow-settings-trigger{display:grid;place-items:center;width:34px;height:32px;padding:0;border:1px solid var(--line);border-radius:9px;background:var(--panel-3);color:var(--muted);cursor:pointer;transition:.16s ease}
.flow-settings-trigger svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.flow-settings-trigger:hover,.flow-settings-control.is-open .flow-settings-trigger{color:#22d3ee;border-color:#22d3ee;background:color-mix(in srgb,#22d3ee 9%,var(--panel-3));box-shadow:0 0 0 3px rgba(34,211,238,.1)}
.flow-settings-control:has(input:disabled){opacity:.4}
.flow-settings-control:has(input:disabled) .flow-settings-trigger{cursor:not-allowed;box-shadow:none}
.flow-settings-popover{position:absolute;z-index:50;top:calc(100% + 8px);right:0;display:grid;grid-template-columns:repeat(2,46px);gap:7px;width:107px;height:174px;padding:10px 7px 8px;border:1px solid color-mix(in srgb,#22d3ee 38%,var(--line));border-radius:13px;background:color-mix(in srgb,var(--panel) 94%,transparent);box-shadow:0 14px 34px rgba(4,16,28,.26),inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-6px);transform-origin:top right;transition:opacity .16s ease,transform .16s ease,visibility .16s}
.flow-settings-control.is-open .flow-settings-popover{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
.flow-settings-popover label{display:grid;grid-template-rows:16px 1fr 15px;place-items:center;gap:3px;min-width:0;color:var(--muted);font-size:8px;font-weight:800}
.flow-settings-popover output{color:var(--text);font-size:9px;font-weight:900}
.flow-settings-popover input[type="range"]{width:22px;height:112px;margin:0;padding:7px 6px;border:0;border-radius:999px;background:color-mix(in srgb,var(--panel-3) 90%,transparent);writing-mode:vertical-lr;direction:rtl;appearance:slider-vertical;accent-color:#22d3ee;cursor:ns-resize}
.flow-settings-popover input:disabled{opacity:.4;cursor:not-allowed}

.flow-mode-modal{position:fixed;inset:0;z-index:10020;display:grid;place-items:center;padding:20px;background:rgba(3,8,16,.78);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.flow-mode-modal[hidden]{display:none!important}
body.flow-dialog-open{overflow:hidden}
.flow-mode-card{width:min(520px,100%);padding:26px;border:1px solid color-mix(in srgb,#22d3ee 42%,var(--line));border-radius:20px;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,.46),inset 0 1px 0 rgba(255,255,255,.07)}
.flow-mode-kicker{color:#22d3ee;font-size:10px;font-weight:900;letter-spacing:.13em;text-transform:uppercase}
.flow-mode-card h2{margin:6px 0 10px;font-size:22px;line-height:1.2}
.flow-mode-card p{margin:0;color:var(--muted);font-size:13px;line-height:1.58}
.flow-mode-card .flow-mode-dataset-warning{margin-top:14px;padding:11px 12px;border:1px solid color-mix(in srgb,#f6c453 45%,var(--line));border-radius:11px;color:#f8d985;background:color-mix(in srgb,#f6c453 9%,var(--panel-2));font-weight:750}
.flow-mode-card .flow-mode-dataset-warning.is-critical{border-color:color-mix(in srgb,#ff7f87 56%,var(--line));color:#ffb4b9;background:color-mix(in srgb,#ff7f87 10%,var(--panel-2))}
.flow-mode-card .flow-mode-note{margin-top:12px;color:var(--text);font-weight:700}
.flow-mode-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}
.flow-mode-enable,.flow-mode-cancel{min-height:42px;padding:9px 15px;border-radius:10px;font:800 12px/1.2 inherit;cursor:pointer}
.flow-mode-enable{border:1px solid color-mix(in srgb,#22d3ee 70%,var(--line));color:#06151c;background:linear-gradient(135deg,#22d3ee,#5eead4)}
.flow-mode-cancel{border:1px solid var(--line);color:var(--text);background:var(--panel-3)}
.flow-mode-enable:focus-visible,.flow-mode-cancel:focus-visible{outline:3px solid color-mix(in srgb,#22d3ee 35%,transparent);outline-offset:2px}

.viewport-toolbar{overflow-x:auto;overflow-y:hidden}
.viewport-toolbar:has(.vertical-exaggeration-control.is-open,.flow-settings-control.is-open){overflow:visible}
@media(max-width:1200px){.toolbar-field>span{display:none}.toolbar-field select{width:102px}.contrast-toolbar-field select{width:116px}}

.clear-project-corner{
  top:66px;
  right:10px;
  width:38px;
  height:38px;
  border-radius:10px;
}
.clear-project-corner span{font-size:25px}
.canvas-tools{top:60px}
.empty-state{padding-top:0}

@media(max-width:900px){
  .workspace-header{padding-inline:13px}
  .viewport-toolbar-shell{right:54px}
  .viewport-toolbar{overflow:visible}
  .toolbar-field > span{display:none}
  .toolbar-field select{width:104px}
  .contrast-toolbar-field select{width:116px}
}
@media(max-width:760px){
  .workspace-header{min-height:52px;padding:8px 54px 8px 11px}
  .clear-project-corner{top:58px;right:8px;width:36px;height:36px}
  .viewport-toolbar-shell{top:6px;left:6px;right:50px}
  .viewport-toolbar{min-height:42px;padding:4px}
  .canvas-tools{top:54px}
}
@media(max-width:900px){
  .viewport-toolbar{overflow-x:auto;overflow-y:hidden}
  .viewport-toolbar:has(.vertical-exaggeration-control.is-open,.flow-settings-control.is-open){overflow:visible}
}

/* Keep project reset in the header and give the viewport ribbon the full row. */
.workspace-header{padding-right:68px}
.workspace-header .legend{margin-left:auto;margin-right:2px}
.clear-project-corner{top:10px;right:12px;width:38px;height:38px}
.viewport-toolbar-shell{right:8px}
@media(max-width:760px){
  .workspace-header{padding-right:56px}
  .clear-project-corner{top:8px;right:9px;width:36px;height:36px}
  .viewport-toolbar-shell{right:6px}
}

/* Desktop profile focus mode: keep the map and longitudinal chart as the only
   primary work surfaces. Sample coordinates remain available to CSV export. */
@media (min-width: 901px) {
  .workspace > #projectReset {
    display: none !important;
  }

  .workspace.profile-open,
  .workspace.profile-open.profile-expanded {
    grid-template-rows: minmax(220px, 1fr) var(--profile-pane-height, 420px) !important;
  }

  .workspace.profile-open .workspace-header,
  .workspace.profile-open .stats-bar,
  .workspace.profile-open .profile-table-wrap {
    display: none !important;
  }

  .workspace.profile-open .profile-content {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Mobile workspace: map-first layout with a slide-out controls drawer and bottom-sheet summary. */
.mobile-drawer-scrim,.mobile-drawer-header,.mobile-menu-toggle,.mobile-sheet-handle{display:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:900px){
  body{overflow:hidden}
  .app-shell{display:block;height:100svh;min-height:0;position:relative}
  .workspace{display:block;position:relative;width:100%;height:100svh;min-height:0;overflow:hidden}
  .workspace > .canvas-wrap{position:absolute;inset:0;min-height:0;height:100%;overflow:hidden}
  .sidebar{position:fixed;inset:0 auto 0 0;z-index:120;width:min(88vw,360px);height:100svh;max-height:100svh;overflow-y:auto;overscroll-behavior:contain;padding:16px 14px 24px;border:0;border-right:1px solid var(--line);box-shadow:24px 0 60px rgba(0,0,0,.38);transform:translateX(-105%);transition:transform .24s cubic-bezier(.2,.8,.2,1);will-change:transform}
  .mobile-drawer-open .sidebar{transform:translateX(0)}
  .mobile-drawer-header{position:sticky;top:0;z-index:45;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px;margin:-16px -14px 12px;padding:8px 12px 8px 16px;border-bottom:1px solid var(--soft-line);background:color-mix(in srgb,var(--panel) 96%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
  .mobile-drawer-header strong{font-size:12px;letter-spacing:.035em}
  .mobile-drawer-close{display:grid;place-items:center;width:42px;height:42px;min-width:42px;padding:0;border:1px solid var(--line);border-radius:12px;background:var(--panel-3);color:var(--text);font-size:25px;line-height:1}
  .mobile-drawer-close:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 48%,transparent);outline-offset:2px}
  .sidebar-tabs{top:52px}
  .mobile-drawer-scrim{display:block;position:fixed;inset:0;z-index:110;border:0;background:rgba(2,8,16,.62);opacity:0;pointer-events:none;transition:opacity .2s ease;backdrop-filter:blur(3px)}
  .mobile-drawer-open .mobile-drawer-scrim{opacity:1;pointer-events:auto}
  .mobile-drawer-closing .mobile-drawer-scrim{opacity:0;pointer-events:auto}
  .mobile-drawer-open .canvas-wrap,.mobile-drawer-closing .canvas-wrap,.canvas-wrap.mobile-map-locked{pointer-events:none!important;touch-action:none!important;user-select:none}
  .mobile-menu-toggle{display:grid;place-items:center;position:absolute;z-index:3;top:12px;left:12px;width:40px;height:40px;padding:0;border:1px solid var(--line);border-radius:12px;color:var(--text);background:color-mix(in srgb,var(--panel) 90%,transparent);box-shadow:0 8px 20px rgba(0,0,0,.2);font-size:20px;line-height:1}
  .mobile-menu-toggle:focus-visible,.mobile-sheet-handle:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 55%,transparent);outline-offset:2px}
  .workspace-header{position:absolute;z-index:45;left:0;right:0;bottom:0;height:var(--mobile-sheet-height,116px);min-height:0;padding:34px 18px 16px 64px;display:block;border:1px solid color-mix(in srgb,var(--line) 90%,var(--accent));border-bottom:0;border-radius:22px 22px 0 0;background:color-mix(in srgb,var(--panel) 94%,transparent);box-shadow:0 -16px 40px rgba(0,0,0,.28);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);transition:height .22s ease,transform .2s ease}
  .workspace-header.mobile-sheet-expanded{height:var(--mobile-sheet-height,48svh);overflow:auto}
  .workspace-header > div:first-of-type{min-width:0}
  .workspace-header h2{font-size:16px;line-height:1.15;margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .workspace-header p{font-size:11px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .workspace-header .legend{display:none}
  .workspace-header.mobile-sheet-expanded .legend{display:flex;margin-top:16px;gap:12px;flex-wrap:wrap;font-size:10px}
  .mobile-sheet-handle{display:grid;place-items:center;position:absolute;z-index:2;top:7px;left:50%;width:72px;height:24px;padding:0;border:0;border-radius:999px;background:transparent;transform:translateX(-50%);touch-action:none;cursor:grab}
  .mobile-sheet-handle > span:first-child{display:block;width:42px;height:4px;border-radius:999px;background:var(--muted);opacity:.72}
  .mobile-sheet-handle:active{cursor:grabbing}
  .clear-project-corner{top:12px;right:12px;width:38px;height:38px;transform:scale(.78);transform-origin:top right}
  .clear-project-corner span{font-size:24px}
  .viewport-toolbar-shell{top:66px;left:10px;right:10px;z-index:35;max-width:none;border-radius:14px;background:color-mix(in srgb,var(--panel) 88%,transparent);box-shadow:0 10px 24px rgba(0,0,0,.2)}
  .viewport-toolbar{display:flex;flex-wrap:nowrap;gap:0;min-height:0;padding:6px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scroll-padding-inline:2px}
  .toolbar-row{display:contents}
  .toolbar-row-view > *, .toolbar-row-tools > .toolbar-group{flex:0 0 auto}
  .toolbar-row-tools .toolbar-hint{display:none}
  .toolbar-button,.toolbar-field select,.viewport-toolbar select,.surface-flow-toggle span,.flow-settings-trigger,.vertical-exaggeration-control,.toolbar-icon-select{min-height:42px;height:42px}
  .toolbar-button{min-width:42px;padding-inline:10px;border-radius:11px}
  .toolbar-button.icon-button{width:42px;min-width:42px;height:42px}
  .toolbar-icon-select{width:42px;min-width:42px;flex-basis:42px;border-radius:11px}
  .toolbar-field{display:flex;align-items:center;gap:4px}
  .toolbar-field select{width:118px;padding-inline:9px 24px;font-size:11px}
  .contrast-toolbar-field select{width:142px}
  .tin-action-field select{width:114px}
  .vertical-exaggeration-control{width:58px;margin:0;flex:0 0 58px}
  .surface-flow-control{min-height:42px;margin:0;padding-inline-start:6px}
  .surface-flow-toggle span{width:42px;min-width:42px;padding:0}
  .flow-settings-control,.flow-settings-trigger{width:42px;height:42px}
  .flow-settings-popover{position:fixed;top:auto;right:12px;bottom:calc(var(--mobile-sheet-height,116px) + 76px);width:120px;height:188px}
  .canvas-tools{top:auto;right:14px;bottom:calc(var(--mobile-sheet-height,116px) + 18px);z-index:32;display:grid;gap:10px}
  .canvas-tools button{width:46px;height:46px;min-width:46px;border-radius:14px;font-size:22px;box-shadow:0 8px 22px rgba(0,0,0,.24)}
  .coordinate-panel{left:14px;bottom:calc(var(--mobile-sheet-height,116px) + 18px);z-index:32;min-height:42px;border-radius:13px}
  .coordinate-panel button{width:42px;height:42px;min-width:42px}
  .coordinate-panel .coordinate-readout{font-size:10px}
  .canvas-wrap:not(.coordinates-collapsed) .coordinate-readout{display:inline}
  .canvas-wrap.coordinates-collapsed .coordinate-readout{display:none}
  .stats-bar{display:none}
  .workspace.profile-open .workspace-header{display:none!important}
  .workspace.profile-open .profile-drawer:not([hidden]){position:absolute;z-index:60;left:0;right:0;bottom:0;height:56svh;min-height:min(320px,72svh);max-height:72svh;border-radius:20px 20px 0 0;box-shadow:0 -18px 45px rgba(0,0,0,.32)}
  .profile-drawer-header{min-height:58px;padding:9px 12px}
  .profile-content{min-height:0;overflow:auto}
  .unit-system-modal,.access-modal{padding:12px;align-items:end;overflow:auto}
  .flow-mode-modal{padding:12px;align-items:end;overflow:auto}
  .flow-mode-card{max-height:calc(100svh - 24px);overflow:auto;padding:20px;border-radius:18px}
  .flow-mode-actions{display:grid;grid-template-columns:1fr}
  .flow-mode-enable,.flow-mode-cancel{min-height:46px}
  .unit-system-card,.access-card,.pricing-card{max-height:calc(100svh - 24px);overflow:auto;border-radius:18px;padding:20px}
  .unit-system-option{min-height:82px;padding:13px}
  .access-close{min-width:44px;min-height:44px;right:8px;top:8px}
  .app-trust-footer{padding-bottom:8px}
}
@media(max-width:420px){
  .workspace-header{padding-left:60px;padding-right:14px}
  .viewport-toolbar-shell{top:64px}
  .toolbar-field select{width:108px}
  .contrast-toolbar-field select{width:128px}
}

/* Point data-quality review */
.point-review-modal{position:fixed;inset:0;z-index:10040;display:grid;place-items:center;padding:24px;background:rgba(3,9,18,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.point-review-modal[hidden]{display:none}
.point-review-card{display:flex;flex-direction:column;width:min(1120px,100%);max-height:min(88svh,820px);overflow:hidden;border:1px solid var(--line);border-radius:20px;background:var(--panel);box-shadow:0 26px 90px rgba(0,0,0,.42)}
.point-review-header{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding:24px 28px 18px;border-bottom:1px solid var(--soft-line)}
.point-review-kicker{color:var(--accent);font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.point-review-header h2{margin:5px 0 6px;font-size:24px}.point-review-header p{max-width:720px;margin:0;color:var(--muted);font-size:12px;line-height:1.5}
.point-review-close{display:grid;place-items:center;width:40px;height:40px;min-width:40px;border:1px solid var(--line);border-radius:12px;background:var(--panel-3);color:var(--text);font-size:24px;line-height:1}
.point-review-summary{display:flex;flex-wrap:wrap;gap:8px;padding:16px 28px 0}.point-review-summary-item{padding:6px 10px;border:1px solid var(--soft-line);border-radius:999px;color:var(--muted);font-size:11px}.point-review-summary-item:first-child{border-color:color-mix(in srgb,var(--accent) 55%,var(--line));color:var(--text)}
.point-review-toolbar{display:flex;align-items:end;justify-content:space-between;gap:16px;padding:16px 28px}.point-review-toolbar label{display:grid;gap:5px;color:var(--muted);font-size:11px}.point-review-toolbar select{min-width:190px}.point-review-toolbar-note{color:var(--muted);font-size:11px}
.point-review-table-wrap{min-height:0;overflow:auto;margin:0 28px;border:1px solid var(--soft-line);border-radius:12px}.point-review-table{width:100%;min-width:760px;border-collapse:collapse;font-size:12px}.point-review-table th{position:sticky;top:0;z-index:1;background:var(--panel-3);color:var(--muted);font-size:10px;letter-spacing:.08em;text-align:left;text-transform:uppercase}.point-review-table th,.point-review-table td{padding:9px 10px;border-bottom:1px solid var(--soft-line);white-space:nowrap}.point-review-table tbody tr:last-child td{border-bottom:0}.point-review-table tbody tr.needs-review{background:color-mix(in srgb,#e7b84b 8%,transparent)}.point-review-table tbody tr.excluded{background:color-mix(in srgb,var(--muted) 7%,transparent);color:var(--muted)}.point-review-table input[type=checkbox]{width:17px;height:17px;accent-color:var(--accent)}.point-review-table .point-review-z{width:112px;min-height:32px;padding:5px 7px}.point-review-status{font-weight:700}.point-review-actions{display:flex;flex-wrap:wrap;gap:8px;padding:16px 28px 8px}.point-review-actions .button{min-height:38px}.point-review-hint{margin:0;padding:0 28px 22px;color:var(--muted);font-size:11px}.point-review-row-action{min-height:30px;padding:5px 10px;font-size:11px}.auto-boundary{stroke:var(--accent);stroke-dasharray:8 5;fill:none;pointer-events:none}
.point-review-map-trigger.active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 18%,var(--panel-3));color:var(--text)}.point-review-pick-active #mapCanvas{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Crect x='2' y='2' width='10' height='10' fill='none' stroke='%2360a5fa' stroke-width='1.6'/%3E%3C/svg%3E") 7 7,crosshair!important}
body.point-review-open{overflow:hidden}
@media(max-width:700px){
  .point-review-modal{align-items:end;padding:0}.point-review-card{width:100%;max-height:94svh;border-radius:20px 20px 0 0}.point-review-header{padding:18px 16px 14px}.point-review-header h2{font-size:20px}.point-review-summary,.point-review-toolbar{padding-left:16px;padding-right:16px}.point-review-toolbar{align-items:stretch;flex-direction:column;gap:10px}.point-review-table-wrap{margin:0 16px}.point-review-actions{padding:12px 16px 6px}.point-review-actions .button{flex:1 1 30%;min-height:44px}.point-review-hint{padding:0 16px 16px}
}

.new-user-hint{display:block;margin:-6px 0 2px;color:var(--muted);font-size:11px;line-height:1.45}
.access-otp-heading{display:block;margin:-2px 0 7px;color:#c4b5fd;font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.access-account-choice{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:-5px;color:#94a3b8;font-size:14px;font-weight:600;text-align:center}.access-account-choice .access-link{padding:0;font-size:14px;font-weight:800}
.access-signup-fields{display:grid;gap:10px;padding:11px;border:1px solid #334155;border-radius:10px;background:rgba(15,23,42,.5)}.access-signup-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.access-signup-fields label{display:grid;gap:6px;color:#cbd5e1;font-size:10px;font-weight:700}.access-signup-fields label>span{color:#94a3b8;font-weight:500}.access-signup-fields input{width:100%;border:1px solid #334155;border-radius:8px;background:#080d18;color:#f8fafc;padding:9px 10px;font:500 12px inherit;outline:none}.access-signup-fields input:focus{border-color:#60a5fa;box-shadow:0 0 0 3px rgba(96,165,250,.15)}.access-account-choice .access-link{color:#60a5fa}.access-signup-fields[hidden]{display:none}


/* Map point insertion affordance */
.add-point-map-trigger.active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 18%,var(--panel-3));color:var(--text)}
.canvas-wrap.add-point-active #mapCanvas{cursor:crosshair!important}
/* Referral invite identity */
.referral-inviter-identity{margin:-5px 0 18px!important;color:var(--accent-2)!important;font-size:11px;font-weight:700;overflow-wrap:anywhere}