/* new feature/ui/initial-design.css
   Initial Design — VISION reskin: light "editorial" theme (cream surfaces,
   rust-orange primary, JetBrains-Mono caps labels, Hanken Grotesk headings),
   adapted onto the EXISTING markup. Structure & behaviour are unchanged — only
   colour and type. Self-contained, .idz- prefixed, no JS touched.
   Rollback ("psuhback banana"): restore initial-design.css.prevision. */

@import url('https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@600;700;800&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

.idz-overlay {
  position: fixed; inset: 0; z-index: 4000;
  /* No backdrop-filter: the background is fully opaque, so a blur would show
     nothing — but it forces a GPU compositing layer over the whole page and
     triggers Chromium's intermittent "hardware cursor disappears" bug. */
  background: #fbf9f5;
  display: none; color: #1b1c1a;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
.idz-overlay.open { display: flex; flex-direction: column; }
/* While Markup is open (4000, its PDF preview 4100; 8900 when the report or
   the drafter lifts it) the app's toast (2200) and the pop-ups Markup itself
   opens (100) were drawn underneath, unseen: "Could not save markups...",
   the usage-limit pop-up and the licensed-copy check (audit, 8 Oct 2026). */
body.gx-markup-open #toast { z-index: 8970; }
body.gx-markup-open #rateLimitModal,
body.gx-markup-open #guidanceGateModal { z-index: 8962; }
/* Keyboard focus is moved onto the window itself when it opens (a dialog);
   the window is not a control, so it draws no focus ring of its own. */
.idz-overlay:focus { outline: none; }

.idz-head {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 18px; border-bottom: 1px solid #e8e6e0;
  background: #fbf9f5;
}
.idz-title { font-size: 15px; font-weight: 700; letter-spacing: -.01em; color: #111212; font-family: 'Hanken Grotesk', 'Inter', sans-serif; }
.idz-title small { color: #2f9c58; font-weight: 500; margin-left: 8px; font-size: 11px; font-family: 'JetBrains Mono', ui-monospace, monospace; letter-spacing: .06em; }
.idz-head .idz-spacer { flex: 1; }
.idz-head-field { display: inline-flex; align-items: center; gap: 5px; color: #536172; font-size: 10px; font-weight: 600; white-space: nowrap; }
.idz-head-field select { padding: 6px 24px 6px 7px; border: 1px solid #c9cfd8; border-radius: 3px; background: #fff; color: #26303a; font: inherit; }
.idz-select, .idz-btn {
  background: #f5f3ef; color: #1b1c1a; border: 1px solid #e8e6e0;
  border-radius: 6px; padding: 7px 12px; font-size: 13px; cursor: pointer; font-family: inherit;
}
.idz-btn.primary { background: var(--ink, #1a1d20); border-color: var(--ink, #1a1d20); color: #fff; font-weight: 600; }
.idz-btn.primary:hover { background: var(--green, #2f9c58); border-color: var(--green, #2f9c58); }
.idz-btn:disabled { opacity: .5; cursor: default; }
/* Zoom: Fit, then out and in — one joined control so it reads as a group
   rather than three loose buttons (owner, 22 Sep 2026). */
.idz-zoom-grp { display: inline-flex; align-items: stretch; }
.idz-zoom-grp .idz-btn { border-radius: 0; margin: 0; }
.idz-zoom-grp .idz-btn + .idz-btn { border-left: none; }
.idz-zoom-grp .idz-btn:first-child { border-radius: 6px 0 0 6px; }
.idz-zoom-grp .idz-btn:last-child { border-radius: 0 6px 6px 0; }
.idz-zoom-cycle { min-width: 82px; font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 11px; }
.idz-zoom-step {
  width: 28px; padding: 7px 0; text-align: center;
  font-size: 14px; line-height: 1; font-weight: 600;
}
.idz-zoom-step:disabled { opacity: .35; cursor: default; }
.idz-close { font-size: 22px; line-height: 1; background: none; border: none; color: #6b6b6b; cursor: pointer; padding: 4px 8px; }
.idz-close:hover { color: #111212; }

.idz-body { flex: 1; display: flex; min-height: 0; }

/* Left: plan + dots */
/* The surface cursor is ONE derived value written by markup-cursor.js —
   no stylesheet may promise grab/crosshair here (behaviour overhaul, R-B). */
.idz-planwrap { flex: 1; overflow: auto; padding: 22px; text-align: center; background: #ffffff; }
.idz-planbox { position: relative; display: inline-block; background: #fff; }
.idz-planimg { display: block; max-width: 100%; height: auto; border-radius: 3px; user-select: none; -webkit-user-drag: none; }

.idz-dot {
  position: absolute; width: 18px; height: 18px; border-radius: 50%;
  transform: translate(-50%, -50%); border: 2px solid #ffffff;
  cursor: pointer; box-shadow: 0 1px 4px rgba(0,0,0,.35); transition: transform .08s;
  display: flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 800; color: #fff; z-index: 3;
}
.idz-dot:hover, .idz-dot.sel { transform: translate(-50%, -50%) scale(1.35); z-index: 7; }
.idz-dot.green { background: #22c55e; }
.idz-dot.red { background: #ba1a1a; }
.idz-label {
  position: absolute; transform: translate(-50%, 10px); white-space: nowrap;
  font-size: 9.5px; color: #ffffff; background: rgba(17,18,18,.9); padding: 1px 6px;
  border-radius: 4px; cursor: pointer; z-index: 3; max-width: 130px;
  overflow: hidden; text-overflow: ellipsis;
  font-family: 'JetBrains Mono', ui-monospace, monospace; letter-spacing: .02em;
}
.idz-label.sel { background: #2f9c58; color: #fff; z-index: 6; }

/* Hover / pinned card on a pin — shows the five parameters.
   Positioned FIXED at the overlay level (portal pattern): never clipped by
   the pan/zoom container, and its scroll can't be swallowed by the plan's
   wheel-zoom. JS (showTip) flips it above/below the pin, clamps it into the
   viewport, and caps its height so long content scrolls INSIDE the card. */
.idz-tip {
  position: fixed;
  background: #ffffff; border: 1px solid #e8e6e0; border-radius: 8px;
  padding: 9px 11px; width: 264px; pointer-events: none; z-index: 200;
  box-shadow: 0 8px 28px rgba(0,0,0,.16);
  overflow-y: auto; overscroll-behavior: contain;
}
.idz-tt-head { font-size: 12.5px; font-weight: 700; display: flex; align-items: center; gap: 7px; color: #111212; font-family: 'Hanken Grotesk', 'Inter', sans-serif; }
.idz-tt-kind { color: #5f5e5e; font-weight: 500; font-size: 10.5px; font-family: 'JetBrains Mono', ui-monospace, monospace; letter-spacing: .06em; text-transform: uppercase; }
.idz-tt-badge { margin-left: auto; font-weight: 800; }
.idz-tt-badge.green { color: #166534; } .idz-tt-badge.red { color: #ba1a1a; }
.idz-tt-problem { font-size: 11.5px; color: #ba1a1a; margin-top: 6px; line-height: 1.4; }
.idz-tt-fe { font-size: 11px; color: #594138; margin-top: 5px; line-height: 1.4; }
.idz-tt-fe b { color: #2f9c58; }

/* Parameter rows (shared by tooltip + side detail) */
.idz-params { margin-top: 7px; display: flex; flex-direction: column; gap: 3px; }
.idz-prow { display: flex; align-items: baseline; gap: 8px; font-size: 11.5px; line-height: 1.35; }
.idz-prow .idz-plabel { color: #6b6b6b; flex: 0 0 42%; }
.idz-prow .idz-pval { color: #111212; flex: 1; text-align: right; font-weight: 600; }
.idz-prow .idz-pval.na, .idz-prow.na .idz-pval { color: #a8a59d; font-style: italic; font-weight: 400; }
.idz-prow .idz-cl { color: #2563eb; font-size: 10px; font-family: 'JetBrains Mono', ui-monospace, monospace; }
.idz-up { color: #2f9c58; font-weight: 800; }

.idz-sw { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; display: inline-block; }
.idz-sw.green { background: #22c55e; } .idz-sw.red { background: #ba1a1a; }

/* Left sidebar: building-wide (all-floor) findings; collapses when there are none */
.idz-leftbar { width: 320px; flex-shrink: 0; border-right: 1px solid #cfd6df;
  background: #f4f6f8; overflow-y: auto; padding: 14px; font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif; }
.idz-leftbar.empty { display: none; }

/* PLAN-ONLY MODE (the Fire Strategy drafter's markups, owner ruling 17 Sep
   2026): the same tool doing one job - mark up a plan, export that plan. The
   left sidebar holds the chat's saved notes and its Building review, neither
   of which belongs to the drafter, so it is not shown at all and the plan
   takes the full width. */
body.gx-markup-plan-only .idz-leftbar { display: none !important; }

/* Left sidebar mode pills (Initial assessment / Escape route / Findings) */
.idz-lb-pills { display: flex; flex-wrap: nowrap; gap: 5px; margin-bottom: 14px; }
.idz-lb-pill { font-size: 9px; padding: 5px 8px; border-radius: 20px; border: 1px solid #e8e6e0; background: #ffffff; color: #5f5e5e; cursor: pointer; white-space: nowrap; font-family: 'JetBrains Mono', ui-monospace, monospace; letter-spacing: .04em; text-transform: uppercase; transition: background .12s, color .12s, border-color .12s; }
.idz-lb-pill:hover { border-color: #2f9c58; color: #2f9c58; }
.idz-lb-pill.active { background: #2f9c58; border-color: #2f9c58; color: #fff; }

/* Left sidebar: icon-nav modes (vibe from the vision mockup) */
.idz-lb-nav { display: flex; flex-direction: column; gap: 4px; margin-bottom: 22px; }
.idz-nav-item { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 10px; border: 1px solid transparent; background: transparent; border-radius: 5px; cursor: pointer; color: #536172; font-family: inherit; font-size: 12.5px; font-weight: 600; text-align: left; transition: background .12s, color .12s, border-color .12s; }
.idz-nav-item:hover { background: #fff; border-color: #d7dee7; color: #26303a; }
.idz-nav-item.active { background: #e4f1fb; border-color: #afd0ed; color: #0c5e9e; font-weight: 700; }
.idz-nav-ic { width: 18px; height: 18px; flex-shrink: 0; }

.idz-lb-seclabel { font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: #6b6b6b; font-family: 'JetBrains Mono', ui-monospace, monospace; margin: 0 0 10px; }
.idz-lb-sub { font-size: 12px; color: #594138; line-height: 1.4; margin-bottom: 10px; }

/* Findings card (matches the mockup: warning icon + heading + bullets + view-all) */
.idz-find-card { background: #ffffff; border: 1px solid #e8e6e0; border-radius: 10px; padding: 12px 13px; }
.idz-find-head { display: flex; align-items: flex-start; gap: 8px; color: #2f9c58; font-weight: 700; font-size: 10.5px; text-transform: uppercase; letter-spacing: .07em; font-family: 'JetBrains Mono', ui-monospace, monospace; line-height: 1.35; margin-bottom: 11px; }
.idz-warn-ic { width: 15px; height: 15px; flex-shrink: 0; margin-top: -1px; }
.idz-find-list { margin: 0; padding-left: 16px; display: flex; flex-direction: column; gap: 9px; }
.idz-find-list li { font-size: 11.5px; color: #5f5e5e; line-height: 1.5; }
.idz-find-list li b { color: #1b1c1a; font-weight: 600; }
.idz-viewall { display: inline-block; margin-top: 11px; background: none; border: none; padding: 0; color: #2f9c58; font-weight: 700; font-size: 10px; text-transform: uppercase; letter-spacing: .09em; cursor: pointer; font-family: 'JetBrains Mono', ui-monospace, monospace; }
.idz-viewall:hover { text-decoration: underline; }

/* Escape-route cards in the sidebar */
.idz-route-row { margin: 6px 0; padding: 8px 10px; background: #ffffff; border: 1px solid #e8e6e0; border-radius: 8px; cursor: pointer; transition: border-color .12s, background .12s; }

/* Top-bar compliance tally chips (next to the title) */
.idz-headtally { display: inline-flex; align-items: center; gap: 8px; margin-left: 10px; }

/* Pinned (clicked) pin card — richer + interactive; hover stays compact */
.idz-tip.pinned { width: 320px; pointer-events: auto; box-shadow: 0 12px 40px rgba(0,0,0,.24); }
.idz-tip.pinned .idz-tt-head { padding-right: 20px; }
.idz-tip-close { position: absolute; top: 6px; right: 8px; border: none; background: none; font-size: 18px; line-height: 1; color: #6b6b6b; cursor: pointer; padding: 2px 4px; }
.idz-tip-close:hover { color: #111212; }

/* Escape-route highlight drawn on the plan (hover/click a route row on the left) */
.idz-route-row:hover { background: rgba(162,57,0,.06); border-color: #2f9c58; }
.idz-routes { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 2; overflow: visible; }
.idz-route-line { fill: none; stroke: #2f9c58; stroke-width: 2.5; vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 6 5; animation: idz-march .8s linear infinite; }
@keyframes idz-march { to { stroke-dashoffset: -22; } }
.idz-dot.route-hot { animation: idz-routepulse 1s ease-in-out infinite; }
@keyframes idz-routepulse {
  0%, 100% { box-shadow: 0 0 0 3px rgba(162,57,0,.4), 0 0 10px 3px rgba(162,57,0,.5); }
  50% { box-shadow: 0 0 0 5px rgba(162,57,0,.65), 0 0 18px 6px rgba(162,57,0,.7); }
}

/* Flat-zone highlight — outline the whole flat polygon (as drawn in the builder) */
.idz-zone { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 2; overflow: visible; }
.idz-zone-poly { fill: rgba(162,57,0,.14); stroke: #2f9c58; stroke-width: 2.5; vector-effect: non-scaling-stroke; stroke-linejoin: round; animation: idz-zonepulse 1.1s ease-in-out infinite; }
@keyframes idz-zonepulse { 0%, 100% { fill: rgba(162,57,0,.10); } 50% { fill: rgba(162,57,0,.24); } }

/* Right: side panel */
.idz-side { width: 380px; flex-shrink: 0; border-left: 1px solid #e8e6e0;
  background: #ffffff; overflow-y: auto; padding: 16px; }
.idz-banner { background: #f5f3ef; border: 1px solid #e8e6e0; border-radius: 8px; padding: 13px 14px; margin-bottom: 14px; }
.idz-banner h4 { margin: 0 0 6px; font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: #5f5e5e; font-family: 'JetBrains Mono', ui-monospace, monospace; }
.idz-banner .idz-sub { font-size: 12.5px; color: #594138; line-height: 1.4; }
.idz-tallyrow { display: flex; gap: 10px; margin-top: 10px; }
.idz-chip { font-size: 12px; padding: 3px 9px; border-radius: 12px; font-weight: 600; font-family: 'JetBrains Mono', ui-monospace, monospace; }
.idz-chip.green { background: #dcfce7; color: #166534; }
.idz-chip.red { background: #ffdad6; color: #93000a; }

.idz-secn { font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: #5f5e5e; margin: 14px 0 7px; font-family: 'JetBrains Mono', ui-monospace, monospace; }
.idz-secn.red { color: #ba1a1a; }
.idz-note { font-size: 12px; color: #6b6b6b; line-height: 1.5; padding: 6px 2px; }
.idz-empty { color: #6b6b6b; font-size: 13px; padding: 30px 10px; text-align: center; }
.idz-spin { display: inline-block; width: 15px; height: 15px; border: 2px solid rgba(0,0,0,.15); border-top-color: #2f9c58; border-radius: 50%; animation: idz-rot .8s linear infinite; vertical-align: -2px; margin-right: 7px; }
@keyframes idz-rot { to { transform: rotate(360deg); } }

.idz-detail .idz-drow { display: flex; align-items: center; gap: 8px; }
.idz-detail .idz-nm { font-size: 15px; font-weight: 700; color: #111212; font-family: 'Hanken Grotesk', 'Inter', sans-serif; text-transform: uppercase; letter-spacing: -.01em; }
.idz-detail .idz-badge { margin-left: auto; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; padding: 3px 8px; border-radius: 5px; font-family: 'JetBrains Mono', ui-monospace, monospace; }
.idz-detail .idz-badge.green { background: #dcfce7; color: #166534; }
.idz-detail .idz-badge.red { background: #ffdad6; color: #93000a; }
.idz-detail .idz-kind { font-size: 11px; color: #5f5e5e; margin-top: 3px; }
.idz-problem { font-size: 13px; color: #ba1a1a; line-height: 1.45; }
.idz-fe { font-size: 12.5px; color: #594138; line-height: 1.45; background: #f5f3ef; border: 1px solid #e8e6e0; border-radius: 6px; padding: 8px 10px; }
.idz-fulldetail { font-size: 12px; color: #594138; line-height: 1.55; background: #f5f3ef; border: 1px solid #e8e6e0; border-radius: 6px; padding: 10px 11px; white-space: pre-wrap; }

/* Questions modal (Pass 1.5 — ask the designer before picking parameters) */
.idz-qbackdrop { position: absolute; inset: 0; z-index: 60; display: flex; align-items: center; justify-content: center; background: rgba(27,28,26,.42); }
.idz-qmodal { width: min(560px, 92%); max-height: 86%; display: flex; flex-direction: column; background: #ffffff; border: 1px solid #e8e6e0; border-radius: 12px; box-shadow: 0 18px 60px rgba(0,0,0,.22); overflow: hidden; }
.idz-qhead { padding: 16px 18px 12px; font-size: 15px; font-weight: 700; border-bottom: 1px solid #e8e6e0; color: #111212; font-family: 'Hanken Grotesk', 'Inter', sans-serif; }
.idz-qhead small { display: block; margin-top: 5px; font-size: 12px; font-weight: 400; color: #5f5e5e; font-family: 'Inter', sans-serif; }
.idz-qbody { padding: 6px 18px; overflow-y: auto; }
.idz-q { padding: 13px 0; border-bottom: 1px solid #efeeea; }
.idz-q:last-child { border-bottom: 0; }
.idz-q-text { font-size: 13.5px; font-weight: 600; margin-bottom: 9px; line-height: 1.35; color: #1b1c1a; }
.idz-q-opts { display: flex; flex-wrap: wrap; gap: 7px; }
.idz-q-opt { display: inline-flex; align-items: center; gap: 6px; padding: 6px 11px; border: 1px solid #e8e6e0; border-radius: 20px; font-size: 12.5px; cursor: pointer; transition: border-color .12s, background .12s; background: #f5f3ef; color: #1b1c1a; }
.idz-q-opt:hover { border-color: #2f9c58; }
.idz-q-opt input { accent-color: #2f9c58; margin: 0; }
.idz-q-opt:has(input:checked) { background: rgba(162,57,0,.12); border-color: #2f9c58; }
.idz-qfoot { display: flex; align-items: center; gap: 10px; padding: 13px 18px; border-top: 1px solid #e8e6e0; }
.idz-qfoot .idz-spacer { flex: 1; }
.idz-qcount { font-size: 12px; color: #5f5e5e; font-family: 'JetBrains Mono', ui-monospace, monospace; }

/* Questions shown in the SIDE panel (beside the plan, not covering it) */
.idz-qpanel-head { font-size: 14px; font-weight: 700; padding-bottom: 6px; color: #111212; font-family: 'Hanken Grotesk', 'Inter', sans-serif; }
.idz-qpanel-head small { display: block; margin-top: 4px; font-size: 11.5px; font-weight: 400; color: #5f5e5e; line-height: 1.4; font-family: 'Inter', sans-serif; }
.idz-qpanel-foot { display: flex; align-items: center; gap: 8px; padding: 10px 0; margin-top: 8px; border-top: 1px solid #e8e6e0; position: sticky; bottom: -16px; background: #ffffff; }
.idz-qpanel-foot .idz-spacer { flex: 1; }
.idz-q-locate { cursor: pointer; margin-right: 5px; user-select: none; }

/* One question grouped over several pins (each pin answered + flashable separately) */
.idz-qg { padding: 12px 0; border-bottom: 1px solid #efeeea; }
.idz-qg:last-child { border-bottom: 0; }
.idz-qg .idz-q-text { font-size: 13px; font-weight: 600; margin-bottom: 8px; line-height: 1.35; }
.idz-qg-pins { display: flex; flex-direction: column; gap: 7px; }
.idz-qpin { padding: 6px 7px; border-radius: 6px; transition: background .12s; }
.idz-qpin[data-pin]:hover { background: rgba(162,57,0,.08); }
.idz-qpin-name { font-size: 12px; font-weight: 600; color: #2f9c58; margin-bottom: 5px; }

/* Neutral pins during the questions phase + flash/highlight when a question targets one */
.idz-dot.neutral { background: #6b6b6b; box-shadow: 0 1px 4px rgba(0,0,0,.35); }
.idz-dot.hot { transform: translate(-50%, -50%) scale(1.55); z-index: 9;
  box-shadow: 0 0 0 4px rgba(162,57,0,.4), 0 0 16px 5px rgba(162,57,0,.55); }
.idz-label.hot { background: #2f9c58; color: #fff; z-index: 9; }
@keyframes idz-flash {
  0%, 100% { box-shadow: 0 1px 4px rgba(0,0,0,.35); transform: translate(-50%, -50%) scale(1); }
  30%, 70% { box-shadow: 0 0 0 6px rgba(162,57,0,.6), 0 0 20px 7px rgba(162,57,0,.7); transform: translate(-50%, -50%) scale(1.6); }
}
.idz-dot.flash { animation: idz-flash .9s ease 2; }

/* Rule-engine extras: assumed marker + rule-determined requirement flags */
.idz-assumed { font-size: 10px; font-weight: 600; color: #9a6b00; background: #fff4d6;
  border: 1px solid #f0d28a; border-radius: 4px; padding: 0 5px; margin-left: 6px; vertical-align: middle; }
.idz-flags { margin: 4px 0 2px; padding-left: 18px; }
.idz-flags li { font-size: 12px; color: #33352f; margin: 2px 0; line-height: 1.35; }
.idz-flags li .idz-cl { color: #2563eb; font-size: 11px; }

/* Engine question help line */
.idz-q-help { font-size: 11px; color: #6b6b6b; margin: 2px 0 6px; line-height: 1.4; }

/* Cross-floor / building-wide findings card (in the left sidebar) */
.idz-xfloor { background: #eae8e4; border: 1px solid #e8e6e0; border-radius: 6px; padding: 10px 12px; margin: 0 0 10px; }
.idz-xfloor-head { font-weight: 700; color: #2f9c58; font-size: 11px; margin-bottom: 6px; display: flex; align-items: center; gap: 6px; font-family: 'JetBrains Mono', ui-monospace, monospace; text-transform: uppercase; letter-spacing: .08em; }
.idz-xfloor ul { margin: 0; padding-left: 18px; }
.idz-xfloor li { font-size: 12px; color: #5f5e5e; margin: 4px 0; line-height: 1.45; }

/* House fire-strategy panel (dwellinghouses) */
.idz-house { background: #eef6ff; border: 1px solid #b9d6f2; border-radius: 6px; padding: 10px 12px; margin: 0 0 10px; }
.idz-house-head { font-weight: 700; color: #1b4f8a; font-size: 13px; margin-bottom: 6px; }
.idz-house-topic { margin: 4px 0; }
.idz-house-tname { font-weight: 600; font-size: 12px; color: #2a5a3a; }
.idz-house-topic ul { margin: 2px 0 4px; padding-left: 18px; }
.idz-house-topic li { font-size: 12px; color: #33352f; margin: 1px 0; line-height: 1.35; }
.idz-house-topic li .idz-cl { color: #2563eb; font-size: 11px; }

/* ── Pin card restyle: low-opacity grey · orange labels · grey values · row lines ──
   Appended so it overrides the earlier .idz-tip rules WITHOUT editing them in place
   (cascade + specificity), to stay clear of concurrent edits above. */
.idz-tip {
  width: max-content; min-width: 260px; max-width: 380px;
  padding: 11px 13px; color: #d7dbe0;
  background: #0b0b0e;                                         /* solid BLACK, opaque */
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 13px;
  box-shadow: 0 12px 40px rgba(0,0,0,0.28);
}
.idz-tip.pinned { width: max-content; min-width: 320px; max-width: 420px; box-shadow: 0 16px 48px rgba(0,0,0,0.34); }
.idz-tip .idz-tt-head  { color: #e8eaee; }
.idz-tip .idz-tt-kind  { color: #9aa0aa; }
.idz-tip .idz-tt-badge.green { color: #4ade80; }
.idz-tip .idz-tt-badge.red   { color: #f87171; }
.idz-tip .idz-tt-problem { color: #f3a6a6; }
.idz-tip .idz-tt-fe { color: #d4c2b2; }
.idz-tip .idz-tt-fe b { color: #f0a15a; }
.idz-tip .idz-tip-close { color: #b8bcc4; }
.idz-tip .idz-params { margin-top: 9px; gap: 0; }
.idz-tip .idz-prow { align-items: stretch; gap: 0; padding: 0; }
.idz-tip .idz-prow + .idz-prow { border-top: 1px solid rgba(255,255,255,0.18); }  /* horizontal line between parameters */
.idz-tip .idz-prow .idz-plabel { flex: 0 0 34%; padding: 7px 11px; display: flex; align-items: center; justify-content: flex-start; text-align: left; background: #2f9c58; color: #ffffff; font-weight: 600; border-right: 1px solid rgba(0,0,0,0.28); }  /* LEFT column: filled rust-orange (sidebar accent), white text, left-aligned, narrower */
.idz-tip .idz-prow .idz-pval   { flex: 1; padding: 7px 11px; display: flex; align-items: center; justify-content: flex-end; text-align: right; gap: 6px; flex-wrap: wrap; color: #ffffff; font-weight: 500; }  /* RIGHT values = white */
.idz-tip .idz-prow .idz-pval.na { color: rgba(255,255,255,0.5); font-style: italic; font-weight: 400; }
.idz-tip .idz-prow .idz-cl { color: #93a4bd; }
.idz-tip .idz-assumed { color: #c9a06a; }
/* Pinned-card body text made white on the black card (scoped to .idz-tip only) */
.idz-tip .idz-secn { color: #ffffff; }
.idz-tip .idz-note { color: #cfd2d8; }
.idz-tip .idz-flags li { color: #ffffff; }
.idz-tip .idz-flags li .idz-cl { color: #9db8e0; }
.idz-tip .idz-fulldetail { color: #f0f0f2; background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.16); }

/* ── Pin card v3 — technical panel (matches the mockup): dark-warm, rust-orange
   MONOSPACE labels, muted values, edge-to-edge grid. Overrides the block above. ── */
.idz-tip {
  min-width: 300px; max-width: 400px;
  padding: 0; overflow: hidden; color: #cbb8ad;
  background: linear-gradient(180deg, #1c1613 0%, #120d0b 100%);   /* dark warm */
  border: 1px solid rgba(196,110,60,0.22); border-radius: 12px;
  box-shadow: 0 14px 44px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.04);
}
.idz-tip.pinned { min-width: 340px; max-width: 440px; }
.idz-tip .idz-tt-head { padding: 11px 13px; color: #efe7df; }
.idz-tip .idz-tt-kind { color: #9a8b7e; }
.idz-tip .idz-tt-badge.green,
.idz-tip .idz-tt-badge.red { border-radius: 50%; width: 17px; height: 17px; display: inline-flex;
  align-items: center; justify-content: center; font-size: 10px; margin-left: auto; }
.idz-tip .idz-tt-badge.green { color: #34d399; border: 1px solid rgba(52,211,153,.45); }
.idz-tip .idz-tt-badge.red   { color: #f87171; border: 1px solid rgba(248,113,113,.45); }
.idz-tip .idz-tt-problem { padding: 0 13px; color: #f0a58f; }
.idz-tip .idz-tt-fe { padding: 0 13px 4px; color: #cbb1a0; }
.idz-tip .idz-tt-fe b { color: #d8703f; }
.idz-tip .idz-params { margin: 0; border-top: 1px solid rgba(196,110,60,0.18); }
.idz-tip .idz-prow + .idz-prow { border-top: 1px solid rgba(196,110,60,0.16); }   /* horizontal grid lines */
.idz-tip .idz-prow .idz-plabel {
  flex: 0 0 52%; padding: 11px 13px; background: transparent;
  color: #c2562c; font-weight: 700; font-size: 10.5px; line-height: 1.3;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  text-transform: uppercase; letter-spacing: .04em;
  border-right: 1px solid rgba(196,110,60,0.18);                 /* vertical divider */
}
.idz-tip .idz-prow .idz-pval {
  padding: 11px 13px; color: #b7a99c; font-weight: 500; font-size: 11.5px;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
}
.idz-tip .idz-prow .idz-pval.na { color: #8a7d70; font-style: normal; font-weight: 600; letter-spacing: .05em; }
.idz-tip .idz-prow .idz-cl { color: #7f95b0; }
.idz-tip .idz-secn { padding: 0 13px; color: #efe7df; }
.idz-tip .idz-note { padding: 0 13px; color: #b7a99c; }
.idz-tip .idz-flags { padding-left: 31px; padding-right: 13px; }
.idz-tip .idz-flags li { color: #e8dfd6; }
.idz-tip .idz-flags li .idz-cl { color: #d8703f; }
.idz-tip .idz-fulldetail { margin: 6px 13px 13px; color: #d8cfc6; background: rgba(255,255,255,0.04); border-color: rgba(196,110,60,0.18); }

/* ── Initial Assessment PDF — plan-markup mode (Step 1: shell) ─────────────── */
/* Bottom-right toggle: a check-pill that lights up rust-orange when markup mode
   is on. Floats over the plan area; only shown once a design result is loaded. */
.idz-pdf-toggle {
  position: absolute; right: 22px; bottom: 22px; z-index: 80;
  display: inline-flex; align-items: center; gap: 9px;
  padding: 11px 16px; border-radius: 26px; cursor: pointer;
  background: #ffffff; color: #1b1c1a; border: 1px solid #e8e6e0;
  font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 600;
  box-shadow: 0 6px 20px rgba(0,0,0,.14);
  transition: background .12s, color .12s, border-color .12s, box-shadow .12s;
}
.idz-pdf-toggle:hover { border-color: #2f9c58; color: #2f9c58; }
.idz-pdf-check {
  width: 16px; height: 16px; border-radius: 4px; border: 1.5px solid #b7b3aa;
  flex-shrink: 0; position: relative; transition: background .12s, border-color .12s;
}
.idz-pdf-toggle.active { background: #2f9c58; color: #fff; border-color: #2f9c58; box-shadow: 0 8px 26px rgba(162,57,0,.4); }
.idz-pdf-toggle.active .idz-pdf-check { background: #fff; border-color: #fff; }
.idz-pdf-toggle.active .idz-pdf-check::after {
  content: '✓'; position: absolute; inset: 0; text-align: center;
  color: #2f9c58; font-size: 12px; font-weight: 800; line-height: 16px;
}

/* PDF Export — floating pill stacked ABOVE the Markup toggle (it only shows
   while markup mode is on). Ink-black in the app's monospace-label voice —
   a document tool's action, not a loud CTA. Without this the button had NO
   styles and rendered as a full-width orange bar across the overlay bottom. */
.idz-pdf-export.idz-btn.primary {
  position: absolute; right: 22px; bottom: 74px; z-index: 80;
  display: inline-flex; align-items: center; justify-content: center;
  width: auto; padding: 12px 18px; border-radius: 26px;
  background: #111212; border: 1px solid #111212; color: #fff;
  font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 11px;
  font-weight: 600; text-transform: uppercase; letter-spacing: .09em;
  box-shadow: 0 6px 20px rgba(0,0,0,.18);
  transition: background .12s, border-color .12s;
}
.idz-pdf-export.idz-btn.primary:hover { background: #2a2c2e; border-color: #2a2c2e; }

/* Infinite-canvas workspace: while markup mode is on, the plan area becomes a
   large pannable board (a soft dot-grid) with the plan floating on it as a
   shadowed "sheet". The big padding opens scroll room on every side so notes
   can live in the margins; JS centres the plan when the mode turns on. */
.idz-stage { display: contents; }   /* transparent to layout in the normal view */
.idz-planwrap.pdf {
  background-color: #ffffff;
  padding: 0;
  overscroll-behavior: contain;
}
/* A genuinely large board (not padding) gives reliable scroll room on ALL sides,
   including DOWN — padding-bottom on a scroll container is not scrollable-into, which
   made "scroll down" stop at the plan's edge. The plan is flex-centred on this board. */
.idz-planwrap.pdf .idz-stage {
  display: flex; align-items: center; justify-content: center;
  min-width: 500vw; min-height: 500vh;
  /* Slight graph-paper grid across the infinite board (sits behind the plan, which
     has its own white background, so the grid shows only in the empty canvas space). */
  background-image:
    linear-gradient(rgba(15, 23, 42, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15, 23, 42, .05) 1px, transparent 1px);
  background-size: 28px 28px;
}
.idz-planwrap.pdf .idz-planbox {
  border-radius: 3px;
  box-shadow: 0 4px 22px rgba(15, 23, 42, .14);   /* float the plan above the grid */
}

/* Right-hand toolbox panel (revealed while markup mode is on) */
.idz-pdfbar {
  width: 300px; flex-shrink: 0; border-left: 1px solid #e8e6e0;
  background: #f5f3ef; overflow-y: auto; padding: 16px;
  display: flex; flex-direction: column; gap: 14px;
}
.idz-pdfbar-head {
  font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: #5f5e5e;
  font-family: 'JetBrains Mono', ui-monospace, monospace; font-weight: 500;
}
.idz-pdfbar-body { font-size: 12px; }

/* Toolbox sections (scale, calibration, …) */
.idz-tb-sec { padding-bottom: 14px; margin-bottom: 14px; border-bottom: 1px solid #e8e6e0; }
.idz-tb-sec:last-child { border-bottom: 0; margin-bottom: 0; }
.idz-tb-label { font-size: 10px; text-transform: uppercase; letter-spacing: .1em; color: #5f5e5e; font-family: 'JetBrains Mono', ui-monospace, monospace; margin-bottom: 8px; }
.idz-tb-select { width: 100%; }
.idz-tb-hint { font-size: 11px; color: #8a877f; line-height: 1.45; margin-top: 8px; }
.idz-pdfbar .idz-btn { width: 100%; text-align: center; }

.idz-cal-status { font-size: 12.5px; color: #1b1c1a; margin-bottom: 10px; line-height: 1.45; }
.idz-cal-status.ok { color: #166534; }
.idz-cal-status.ok small { color: #4b7a58; font-size: 11px; }
.idz-cal-status.live { color: #2f9c58; }
.idz-cal-input { display: flex; gap: 6px; margin-bottom: 10px; }
.idz-cal-input input { flex: 1; min-width: 0; padding: 7px 9px; border: 1px solid #e8e6e0; border-radius: 6px; font: inherit; font-size: 13px; }
.idz-cal-input select { padding: 7px; border: 1px solid #e8e6e0; border-radius: 6px; font: inherit; background: #f5f3ef; }
.idz-cal-row { display: flex; gap: 8px; }
.idz-cal-row .idz-btn { width: auto; flex: 1; }

/* Calibration drawing on the plan */
.idz-measure { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 5; overflow: visible; }
.idz-measure line { stroke: #2f9c58; stroke-width: 2.5; vector-effect: non-scaling-stroke; stroke-linecap: round; }
.idz-cal-pt { position: absolute; width: 10px; height: 10px; border-radius: 50%; background: #2f9c58; border: 2px solid #fff; transform: translate(-50%, -50%); box-shadow: 0 1px 4px rgba(0,0,0,.4); z-index: 6; pointer-events: none; }
/* (The `.drawing * { cursor: crosshair !important }` rule that nuked every
   element's cursor while a tool was armed died with the behaviour overhaul —
   markup-cursor.js owns the surface cursor now.) */
.idz-planbox.calibrating .idz-dot, .idz-planbox.calibrating .idz-label,
.idz-planbox.drawing .idz-dot, .idz-planbox.drawing .idz-label { pointer-events: none; }

/* Measure tool buttons */
.idz-tb-tool { text-align: left !important; margin-bottom: 6px; display: flex; align-items: center; gap: 8px; }
.idz-tb-tool.active { background: #2f9c58 !important; color: #fff !important; border-color: #2f9c58 !important; }
.idz-sw-msr { width: 12px; height: 12px; border-radius: 3px; flex-shrink: 0; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15); }

/* Measurements drawn on the plan (colour comes from an inline style per type) */
.idz-marks { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 5; overflow: visible; }
/* ONE THICKNESS SCALE (owner, 23 Sep 2026). --u is screen pixels per unit of
   thickness (a thousandth of the plan's width, so ~1px with the plan fitted,
   growing with zoom); --w is the line's own thickness, 0.8 unless it saved
   another. The stroke stays non-scaling only because this svg is stretched
   to the plan's shape — --u puts the zoom back. It used to be a fixed 2.5
   SCREEN pixels, out of step with every other tool. */
.idz-mark-line { fill: none; stroke-width: calc(var(--u, 1) * var(--w, 0.8) * 1px); vector-effect: non-scaling-stroke; stroke-linejoin: round; stroke-linecap: round; }
.idz-mark-line.draft { stroke-dasharray: 6 5; }
/* The points of a line being drawn — sized from its thickness (--t) too. */
/* A point placed while drawing: a tiny hollow ring in the tool's colour, the
   SAME size on screen at every zoom, so the spot clicked shows through it
   (owner, 24 Sep 2026). It used to be a solid dot sized from the line, which
   grew as you zoomed in to be precise and hid exactly that spot. */
.idz-mark-pt { position: absolute; box-sizing: border-box; width: 5px; height: 5px; border-radius: 50%; background: transparent; border: 1px solid var(--c, #1f6f3a); transform: translate(-50%, -50%); z-index: 6; pointer-events: none; box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.85); }
.idz-mark-len { position: absolute; font-size: 10px; font-weight: 800; white-space: nowrap; z-index: 7; pointer-events: none; font-family: 'JetBrains Mono', ui-monospace, monospace; background: transparent; padding: 0; border-radius: 0; box-shadow: none; transform-origin: center; letter-spacing: -.01em; }
.idz-mark-len.draft { opacity: .95; }

/* Tool icons + scale-method selector */
.idz-tic { width: 16px; height: 16px; display: block; }
.idz-tic-wrap { display: inline-flex; align-items: center; }
.idz-method { display: flex; gap: 6px; margin-bottom: 10px; }
.idz-method-opt { flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 7px 6px; border: 1px solid #e8e6e0; border-radius: 6px; font-size: 11.5px; cursor: pointer; background: #fff; color: #5f5e5e; text-align: center; }
.idz-method-opt input { accent-color: #2f9c58; margin: 0; }
.idz-method-opt.active { border-color: #2f9c58; background: rgba(162,57,0,.08); color: #2f9c58; font-weight: 600; }

/* End decorations: perpendicular tick · start circle · ">" arrow — sized FROM
   the line's thickness (--dt = one line-width on screen), so they thicken and
   thin with it. They were fixed sizes that ignored the line. The proportions
   match the advanced toolbox's ends: a tick is 8 line-widths long, an
   arrowhead 7 long and 7 wide. The start ring is 3 across and see-through
   (owner, 24 Sep 2026 — at 6 across with a white middle it hid the start
   point). */
/* Each is drawn as an inline SVG filling its box (decoAt), because a CSS
   border is rounded to whole pixels and could not follow a thin line
   exactly. And each resets border/transition: the app's global .tick (the
   source-list checkbox, guide-x.css) matched the measurement tick too, and
   gave every one a grey 1.5px outline that made it look heavier than its
   line. Its `.tick svg` rule reached the drawing inside as well — opacity 0
   and half scale (the checkbox's hidden check mark) — so every measurement
   tick was invisible, on screen and in the PDF, until the drawing reset
   those too (24 Sep 2026). */
.idz-deco { position: absolute; z-index: 6; pointer-events: none; transform-origin: center; --dt: calc(var(--u, 1) * var(--t, 0.8) * 1px); border: 0; padding: 0; background: none; transition: none; display: block; }
.idz-deco > svg { display: block; width: 100%; height: 100%; overflow: visible; opacity: 1; transform: none; transition: none; }
.idz-deco.tick { width: var(--dt); height: calc(var(--dt) * 8); }
.idz-deco.circle { width: calc(var(--dt) * 3); height: calc(var(--dt) * 3); }
.idz-deco.arrow { width: calc(var(--dt) * 7); height: calc(var(--dt) * 7); }
.idz-deco.openarrow { width: calc(var(--dt) * 7); height: calc(var(--dt) * 7); }

/* Edit handles: shown only when a markup is SELECTED. What you SEE is a small
   hollow ring in the markup's colour, so the point itself shows through the
   middle and you can check it landed on the wall; what you GRAB is the clear
   square round it, as big as the old dot, so it is no harder to catch
   (owner, 24 Sep 2026 — the 13px solid dot, grown on hover, hid exactly the
   spot just clicked, and a finished line is left selected now). */
.idz-mark-h { position: absolute; width: 14px; height: 14px; transform: translate(-50%, -50%); z-index: 8; pointer-events: auto; cursor: grab; background: transparent; }
.idz-mark-h::after { content: ''; position: absolute; left: 50%; top: 50%; width: 7px; height: 7px; box-sizing: border-box; border-radius: 50%; border: 1.5px solid var(--hc, #111); background: transparent; transform: translate(-50%, -50%); box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.85); }
/* A Measurement's reference points — the two points it measures between —
   are small solid dots in its colour (owner, 25 Sep 2026); dragged, they move
   the whole measurement. A smaller grab square, so the vertical line through
   each one can still be taken just above or below it. */
.idz-mark-h.idz-ref { width: 10px; height: 10px; }
.idz-mark-h.idz-ref::after { width: 5px; height: 5px; border: 0; background: var(--hc, #111); }
.idz-mark-del { position: absolute; transform: translate(-150%, -150%); width: 16px; height: 16px; border-radius: 50%; background: #ba1a1a; color: #fff; font-size: 12px; line-height: 15px; text-align: center; font-weight: 700; z-index: 9; pointer-events: auto; cursor: pointer; box-shadow: 0 1px 4px rgba(0,0,0,.4); }
.idz-mark-del:hover { background: #93000a; }
/* Selection cue via a thicker stroke, NOT filter: drop-shadow — filters force
   a GPU compositing layer over the plan and trigger Chromium's intermittent
   "cursor disappears" bug while a mark is selected (i.e. constantly, in use).
   Twice the line's own thickness, as it always was (5 on a 2.5 line). A
   compartment's thickness is its --w like any other line's. */
.idz-mark-line.sel { stroke-width: calc(var(--u, 1) * var(--w, 0.8) * 2px); }
.idz-sym.sel { outline: 2px dashed #111; outline-offset: 3px; }

/* Findings as separate, draggable cards */
.idz-find-hint { font-size: 10.5px; color: #8a877f; margin: 2px 0 10px; line-height: 1.4; }
.idz-find-items { display: flex; flex-direction: column; gap: 8px; }
.idz-find-item { display: flex; gap: 8px; align-items: flex-start; background: #ffffff; border: 1px solid #e8e6e0; border-radius: 9px; padding: 9px 10px; font-size: 11.5px; color: #5f5e5e; line-height: 1.5; cursor: grab; transition: border-color .12s, box-shadow .12s; }
.idz-find-item:hover { border-color: #2f9c58; box-shadow: 0 2px 10px rgba(0,0,0,.08); }
.idz-find-item.dragging { opacity: .5; }
.idz-find-item b { color: #1b1c1a; font-weight: 600; }
.idz-find-grip { color: #b7b3aa; font-size: 12px; line-height: 1.3; letter-spacing: -1px; flex-shrink: 0; user-select: none; }

/* Sticky note dropped on the plan */
/* Numbered note badge — the plan-side face of every placed note. Semi-
   transparent accent circle (the accent follows the company logo, like the
   PDF report) so the drawing underneath stays visible. */
.idz-note-num { position: absolute; z-index: 8; width: 34px; height: 34px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: 'JetBrains Mono', ui-monospace, monospace; font-weight: 800; font-size: 15px; color: #fff;
  background: color-mix(in srgb, var(--pdf-accent, #2f9c58) 76%, transparent);
  box-shadow: 0 0 0 2px rgba(255,255,255,.9), 0 2px 8px rgba(0,0,0,.3);
  cursor: grab; transform-origin: center; }
.idz-note-num:active { cursor: grabbing; }
.idz-note-num.sel { outline: 2px dashed #111; outline-offset: 3px; }
/* Double-click popover for editing the note's text in place */
.idz-note-pop { position: absolute; z-index: 12; width: 260px; transform: translate(-50%, 24px) scale(calc(var(--z, 1) * var(--rel, 1))); transform-origin: top center;
  background: #fff; border: 1px solid #d8d4cc; border-radius: 8px; box-shadow: 0 8px 28px rgba(0,0,0,.3); padding: 8px 10px; }
.idz-note-pop-body { outline: none; font-size: 12.5px; line-height: 1.45; color: #23241f; min-height: 40px; white-space: pre-wrap; overflow-wrap: anywhere; }
.idz-note-pop-body:empty:before { content: 'Type the note…'; color: #9aa0a6; }

.idz-note-mark { position: absolute; width: 260px; min-height: 52px; background: #fff8c8; border: 1px solid #e6d97a; border-radius: 7px; box-shadow: 0 4px 16px rgba(0,0,0,.28); z-index: 8; overflow: hidden; transform: scale(calc(var(--z, 1) * var(--rel, 1))); transform-origin: 0 0; display: flex; flex-direction: column; cursor: grab; }
.idz-note-mark:active { cursor: grabbing; }
.idz-note-body { cursor: inherit; }
.idz-note-body.editing { cursor: text; background: rgba(255,255,255,.55); outline: none; }
/* ── Resize from any edge or corner ──
   Eight invisible zones sitting just OUTSIDE a selected mark's outline: four
   edges, four corners. Each zone's cursor (set in JS, so a label lying on a
   diagonal line gets diagonal arrows) says which way it pulls. They replace
   the old striped corner grip, which only ever resized diagonally
   (owner, 22 Sep 2026).
   Outside, not straddling: the inside of the mark stays a move handle in
   full, which matters on a door symbol only a few pixels across.
   A mark is scaled by its own transform — zoom × plan size × its own
   multiplier — so every length here divides that back out, keeping the zones
   the same size on screen at any zoom. pointer-events is INHERITED on
   purpose: a label while a drawing tool is armed offers no zones, exactly as
   the old grip behaved. */
.idz-rz {
  position: absolute; z-index: 4;
  --rz-k: calc(var(--z, 1) * var(--rel, 1) * var(--rz-own, 1));
}
.idz-rz.n, .idz-rz.s { left: 0; right: 0; height: calc(9px / var(--rz-k)); }
.idz-rz.w, .idz-rz.e { top: 0; bottom: 0; width: calc(9px / var(--rz-k)); }
.idz-rz.n { top:    calc(-8px / var(--rz-k)); }
.idz-rz.s { bottom: calc(-8px / var(--rz-k)); }
.idz-rz.w { left:   calc(-8px / var(--rz-k)); }
.idz-rz.e { right:  calc(-8px / var(--rz-k)); }
/* Corners sit above the edges they overlap, so the diagonal wins there. */
.idz-rz.nw, .idz-rz.ne, .idz-rz.sw, .idz-rz.se { z-index: 5; width: calc(12px / var(--rz-k)); height: calc(12px / var(--rz-k)); }
.idz-rz.nw { left:  calc(-10px / var(--rz-k)); top:    calc(-10px / var(--rz-k)); }
.idz-rz.ne { right: calc(-10px / var(--rz-k)); top:    calc(-10px / var(--rz-k)); }
.idz-rz.sw { left:  calc(-10px / var(--rz-k)); bottom: calc(-10px / var(--rz-k)); }
.idz-rz.se { right: calc(-10px / var(--rz-k)); bottom: calc(-10px / var(--rz-k)); }
/* Big, obvious affordances — dropped notes were too fiddly to drag/delete. */
.idz-note-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 6px 8px; background: #f2e58a; border-bottom: 1px solid #e6d97a;
  cursor: grab; flex-shrink: 0; min-height: 24px;
}
.idz-note-head:active { cursor: grabbing; }
.idz-note-grip { font-size: 13px; color: #8a7a2a; letter-spacing: -1px; user-select: none; }
.idz-note-del {
  border: none; background: none; color: #8a7a2a; font-size: 17px; line-height: 1;
  cursor: pointer; padding: 2px 6px; margin: -2px -4px -2px 0; border-radius: 5px;
  transition: background .15s, color .15s;
}
.idz-note-del:hover { color: #fff; background: #ba1a1a; }
.idz-note-mark:hover { box-shadow: 0 4px 16px rgba(0,0,0,.28), 0 0 0 2px rgba(47,111,235,.35); }
.idz-note-body { flex: 1; padding: 7px 9px; min-height: 30px; color: #3a3320; font-size: 12px; line-height: 1.45; outline: none; white-space: pre-wrap; overflow-wrap: anywhere; overflow: auto; }
.idz-note-body:focus { background: #fffdf0; }
.idz-note-body:empty:before { content: 'Type a note…'; color: #b3a86a; }

/* Callout: arrow + editable text box pointing at a pin/spot.
   A light DASHED box that hugs its text and GROWS as you type — wider up to a
   cap, then taller. No fixed size, no inner scrollbar, no heavy card chrome. */
.idz-callout { position: absolute; width: max-content; min-width: 90px; max-width: 260px; min-height: 0;
  background: rgba(255,255,255,.88); border: 1.5px dashed #2f9c58; border-radius: 4px;
  box-shadow: none; z-index: 8; overflow: visible; transform: scale(calc(var(--z, 1) * var(--rel, 1))); transform-origin: 0 0;
  display: flex; flex-direction: column; }
/* Selected: dashed → solid + a soft lift, so the editing state stays obvious. */
.idz-callout.sel { border-style: solid; outline: none; box-shadow: 0 2px 10px rgba(0,0,0,.18); }
/* The head is now just a slim invisible grab strip; the × appears on hover. */
.idz-callout-head { display: flex; align-items: center; justify-content: flex-end; padding: 0 3px;
  height: 12px; background: none; border-bottom: none; cursor: grab; flex-shrink: 0; }
.idz-callout-del { border: none; background: none; color: #8a7a6a; font-size: 14px; line-height: 1;
  cursor: pointer; padding: 0 2px; opacity: 0; transition: opacity 120ms ease; }
.idz-callout:hover .idz-callout-del, .idz-callout.sel .idz-callout-del { opacity: 1; }
.idz-callout-del:hover { color: #ba1a1a; }
.idz-callout-body { flex: 1; padding: 0 8px 6px; color: #3a3320; font-size: 12px; line-height: 1.4;
  outline: none; white-space: pre-wrap; overflow-wrap: anywhere; overflow: visible; }
.idz-callout-body:empty:before { content: 'Type a note…'; color: #b8ab9e; }


/* ═══ Toolbox reskin: professional PDF-markup tool chest (Bluebeam-style) ═══
   Neutral-gray panel, dense sections, compact square tool buttons, blue accent.
   Appended last so it overrides the earlier cream/editorial toolbox styling. */
.idz-pdfbar { width: 274px; background: #eef1f5; border-left: 1px solid #c4cad2; padding: 0; gap: 0; font-family: 'Inter', system-ui, -apple-system, sans-serif; }
.idz-pdfbar-head { padding: 8px 12px; background: linear-gradient(#eef1f5, #e1e6ec); border-bottom: 1px solid #c4cad2; color: #2b323b; font-family: inherit; font-weight: 700; font-size: 10.5px; letter-spacing: .09em; text-transform: uppercase; }
.idz-pdfbar-body { padding: 0; font-size: 12px; }
.idz-pdfbar .idz-tb-sec { padding: 9px 11px; margin: 0; border-bottom: 1px solid #d6dbe2; }
.idz-pdfbar .idz-tb-sec:last-child { border-bottom: 0; }
.idz-pdfbar .idz-tb-label { font-size: 9.5px; text-transform: uppercase; letter-spacing: .06em; color: #6a7686; font-family: inherit; font-weight: 700; margin-bottom: 6px; }
.idz-tb-field { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0 0 7px; color: #536172; font-size: 10.5px; }
.idz-tb-field select { width: 78px; padding: 4px 6px; border: 1px solid #c9cfd8; border-radius: 3px; background: #fff; color: #26303a; font: inherit; }
.idz-pdfbar .idz-tb-hint { font-size: 10px; color: #8a93a1; line-height: 1.4; margin-top: 6px; }
.idz-pdfbar .idz-btn { width: 100%; text-align: left; background: #ffffff; border: 1px solid #c9cfd8; border-radius: 3px; color: #2b323b; font-family: inherit; font-weight: 500; font-size: 12px; padding: 6px 8px; }
.idz-pdfbar .idz-btn:hover { background: #e7f0fb; border-color: #8fb4e2; }
.idz-pdfbar .idz-tb-tool { display: flex; align-items: center; gap: 8px; margin-bottom: 5px; text-align: left !important; }
.idz-pdfbar .idz-tb-tool.active { background: #1071bd !important; border-color: #0c5e9e !important; color: #fff !important; }
.idz-grid-snap { display: flex; align-items: center; gap: 6px; margin: 6px 1px 0; color: #536172; font-size: 10.5px; line-height: 1.3; cursor: pointer; }
.idz-grid-snap input { width: 13px; height: 13px; margin: 0; accent-color: #1071bd; }
.idz-measure-grid { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; opacity: .5; }
.idz-measure-grid line { stroke: #1071bd; stroke-width: .45; vector-effect: non-scaling-stroke; stroke-dasharray: 2 3; }
.idz-pdfbar .idz-tic { width: 16px; height: 16px; }
.idz-pdfbar .idz-btn.primary { background: #1071bd !important; border-color: #0c5e9e !important; color: #fff !important; font-weight: 600; }
.idz-pdfbar .idz-btn.primary:hover { background: #0e6cb3 !important; }
.idz-pdfbar .idz-cal-row .idz-btn { text-align: center; }
/* rating chips: tight square swatches */
.idz-pdfbar .idz-comp-ratings, .idz-pdfbar .idz-door-variants { gap: 4px; margin: 7px 0; }
.idz-pdfbar .idz-rchip { border-radius: 3px; padding: 3px 7px; font-size: 10.5px; }
/* scale method → segmented control */
.idz-pdfbar .idz-method { gap: 0; border: 1px solid #c9cfd8; border-radius: 4px; overflow: hidden; margin-bottom: 9px; }
.idz-pdfbar .idz-method-opt { border: 0; border-right: 1px solid #c9cfd8; border-radius: 0; background: #fff; color: #6a7686; font-size: 11px; padding: 6px 4px; }
.idz-pdfbar .idz-method-opt:last-child { border-right: 0; }
.idz-pdfbar .idz-method-opt.active { background: #1071bd; color: #fff; font-weight: 600; }
.idz-pdfbar .idz-method-opt input { display: none; }
.idz-pdfbar .idz-cal-status.ok, .idz-pdfbar .idz-cal-status.live { color: #0c5e9e; }
.idz-pdfbar .idz-cal-status.ok small { color: #4a6b8a; }
.idz-pdfbar .idz-tb-select, .idz-pdfbar select { border-radius: 3px; border-color: #c9cfd8; background: #fff; }
.idz-pdfbar .idz-cal-input input { border-radius: 3px; border-color: #c9cfd8; }
/* compact active-tool prompt + inline note (replaces the wordy hints) */
.idz-tb-active { padding: 7px 12px; background: #1071bd; color: #fff; font-size: 11px; font-weight: 600; }
.idz-tb-note { font-size: 10.5px; color: #0c5e9e; margin-top: 7px; }

/* ═══ Whole-overlay PDF-tool theme (only while markup mode is ON) ═══
   Recolours the top bar, left sidebar and chrome to the same neutral-gray/blue
   tool vibe so the entire screen reads like a real PDF markup app. */
.idz-overlay.pdfmode { background: #e9edf2; }
.idz-overlay.pdfmode .idz-head { background: #dfe4ea; border-bottom: 1px solid #c4cad2; }
.idz-overlay.pdfmode .idz-title { color: #26303a; }
.idz-overlay.pdfmode .idz-title small { color: #0c5e9e; }
.idz-overlay.pdfmode .idz-head .idz-select,
.idz-overlay.pdfmode .idz-head .idz-btn { background: #fff; border: 1px solid #c9cfd8; color: #26303a; border-radius: 3px; }
.idz-overlay.pdfmode .idz-head .idz-btn.primary { background: #1071bd; border-color: #0c5e9e; color: #fff; }
/* Markup is always in pdfmode, and the rule above would square off the zoom
   group's ends and put a border back between its buttons — restate the group
   here, at a specificity that wins. */
.idz-overlay.pdfmode .idz-head .idz-zoom-grp .idz-btn { border-radius: 0; }
.idz-overlay.pdfmode .idz-head .idz-zoom-grp .idz-btn + .idz-btn { border-left: none; }
.idz-overlay.pdfmode .idz-head .idz-zoom-grp .idz-btn:first-child { border-radius: 3px 0 0 3px; }
.idz-overlay.pdfmode .idz-head .idz-zoom-grp .idz-btn:last-child { border-radius: 0 3px 3px 0; }
.idz-overlay.pdfmode .idz-head .idz-btn.primary:hover { background: #0e6cb3; }
.idz-overlay.pdfmode .idz-chip.green { background: #dbeafe; color: #0c5e9e; }
.idz-overlay.pdfmode .idz-leftbar { background: #eef1f5; border-right: 1px solid #c4cad2; }
.idz-overlay.pdfmode .idz-nav-item.active { background: #1071bd; }
.idz-overlay.pdfmode .idz-nav-item:hover { background: #dde3ea; }
.idz-overlay.pdfmode .idz-find-item:hover { border-color: #1071bd; }
/* the bottom-right toggle turns blue in markup mode to match */
.idz-overlay.pdfmode .idz-pdf-toggle.active { background: #1071bd; border-color: #0c5e9e; box-shadow: 0 8px 26px rgba(16,113,189,.4); }
.idz-overlay.pdfmode .idz-pdf-toggle.active .idz-pdf-check::after { color: #1071bd; }

/* ═══ Far-right vertical tool strip (Bluebeam-style icon palette) ═══ */

/* Standalone text box */
.idz-textbox { position: absolute; min-width: 34px; z-index: 8; transform-origin: 0 0; }
.idz-textbox-body { padding: 3px 5px; font-size: 12px; color: #1b1c1a; line-height: 1.3; outline: none; white-space: pre-wrap; overflow-wrap: anywhere; min-width: 28px; min-height: 15px; border: 1px dashed transparent; }
.idz-textbox.sel .idz-textbox-body { border-color: #1071bd; }
.idz-textbox-body:empty:before { content: 'Text…'; color: #9aa0a6; }
.idz-tb-move { position: absolute; left: -15px; top: -1px; cursor: grab; color: #1071bd; font-size: 11px; letter-spacing: -1px; user-select: none; }
.idz-tb-del { position: absolute; right: -15px; top: -7px; }

/* Count marker */
.idz-count { position: absolute; width: 22px; height: 22px; border-radius: 50%; background: #e11d1d; color: #fff; font-size: 11px; font-weight: 700; display: flex; align-items: center; justify-content: center; transform: translate(-50%, -50%) scale(calc(var(--z, 1) * var(--rel, 1) * var(--mark-scale, 1))); z-index: 7; cursor: pointer; border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,.4); }
.idz-count.sel { outline: 2px dashed #111; outline-offset: 2px; }

/* Compartment / door rating chips */
.idz-comp-ratings, .idz-door-variants { display: flex; flex-wrap: wrap; gap: 5px; margin: 8px 0; }
.idz-rchip { padding: 4px 8px; border-radius: 6px; border: 2px solid var(--rc); background: #fff; color: var(--rc); font-size: 11px; font-weight: 700; cursor: pointer; font-family: 'JetBrains Mono', ui-monospace, monospace; }
.idz-rchip.active { background: var(--rc); color: #fff; }

/* Placed symbols: fire doors + final exit signs */
.idz-sym { position: absolute; transform: translate(-50%, -50%) scale(calc(var(--z, 1) * var(--rel, 1) * var(--mark-scale, 1))); z-index: 7; display: flex; align-items: center; justify-content: center; pointer-events: none; }
.idz-sym.editable { pointer-events: auto; cursor: grab; }
.idz-sym.door { width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--c); background: #fff; color: var(--c); font-size: 7px; font-weight: 800; font-family: 'JetBrains Mono', ui-monospace, monospace; box-shadow: 0 1px 3px rgba(0,0,0,.28); }
.idz-sym.door.s { box-shadow: 0 0 0 2px #ffe14d, 0 1px 4px rgba(0,0,0,.35); }   /* bright edge = smoke-seal "S" */
.idz-sym.exit { width: 27px; height: 20px; border-radius: 4px; background: #0a8f3c; color: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.35); }
.idz-sym.exit svg { width: 20px; height: 15px; }

/* ── AOV / fire-main block symbols + hob radiation radius (BS 9991:2024) ── */
/* Block symbols (AOV blue, fire main red) — solid label chips like the ref. */
.idz-sym.block {
  padding: 3px 9px; border-radius: 2px; font-weight: 800; font-size: 12px;
  letter-spacing: .02em; color: #fff; white-space: nowrap; line-height: 1.25;
  box-shadow: 0 1px 4px rgba(0,0,0,.35);
}
.idz-sym.aov { background: #1414f0; }
.idz-sym.fm  { background: #c81717; font-size: 10.5px; }
.idz-sym.block.sel { outline: 2px solid #2f6feb; outline-offset: 2px; }

/* Fire engine + fire hydrant (owner request 2026-07-30) — FIXED-SIZE drawn
   symbols, sized in px exactly like the exit sign. .idz-sym already applies
   scale(var(--z)), so these zoom with the plan and shrink proportionally in
   the PDF export without either needing a rule of its own. */
/* NO drop-shadow here. A CSS filter forces a GPU compositing layer, which is
   what triggers Chromium's "hardware cursor disappears" bug — the rule this
   file states at the top and markup-core.css repeats, which these two lines
   were quietly breaking on the plan surface itself. The hydrant is a square,
   so a box-shadow gives the identical lift without a filter; the engine is an
   irregular drawing, where a box-shadow would read as a card behind it, so it
   goes without. Both are strongly coloured and perfectly legible on white.
   (Owner, 22 Sep 2026: "the cursor itself is white and it is not visible".) */
.idz-sym.engine  { width: 34px; height: 19px; }
.idz-sym.hydrant { width: 20px; height: 20px; box-shadow: 0 1px 3px rgba(0,0,0,.4); border-radius: 1.5px; }
.idz-sym.engine svg,
.idz-sym.hydrant svg { width: 100%; height: 100%; display: block; }
.idz-sym.hydrant svg { border-radius: 1.5px; }
.idz-sym.engine.sel, .idz-sym.hydrant.sel { outline: 2px solid #2f6feb; outline-offset: 3px; }

/* ── Street line ─────────────────────────────────────────────────────────
   A carriageway band whose width the user drags, reported in real metres.
   The band is a POLYGON, not a thick stroke: the marks <svg> is
   preserveAspectRatio="none", so a stroke there is scaled unevenly on a
   non-square plan, and a non-scaling stroke would be a fixed SCREEN width —
   the opposite of true scale. Real geometry, mapped point by point, stays
   honest at any zoom and any aspect. */
.idz-street-road { fill: #f2c34d; fill-opacity: .38; stroke: none; }
.idz-street-road.draft { fill-opacity: .24; }
.idz-street-road.sel { fill: #efbd35; fill-opacity: .56; }
/* The kerb lines and the centre line are drawn on the one thickness scale at
   its 0.8 default, like every other line (they were 1.6 and 1.4 px × zoom). */
.idz-street-kerb {
  fill: none; stroke: #b8840a; stroke-width: calc(var(--u, 1) * 0.8px);
  vector-effect: non-scaling-stroke; stroke-linejoin: round;
}
.idz-street-centre {
  fill: none; stroke: #fff; stroke-width: calc(var(--u, 1) * 0.8px);
  stroke-dasharray: 9 7; vector-effect: non-scaling-stroke; stroke-linejoin: round;
}
/* Either kerb is the resize handle — an invisible fat line over the drawn
   edge, so the grab target is comfortable at any zoom without thickening the
   road itself. */
.idz-street-edge {
  fill: none; stroke: transparent; stroke-width: 14;
  pointer-events: stroke; vector-effect: non-scaling-stroke;
  /* Fallback only — the painter sets the real cursor inline, perpendicular to
     whatever angle the street runs at. A fixed value here would be right for
     a horizontal street and wrong for every other one. */
  cursor: ns-resize;
}
/* A lane's end handles are the standard handle (.idz-mark-h), ringed in the
   kerb's colour. */
.idz-mark-h.idz-street-end { --hc: #b8840a; }
/* The Plan Builder pins over the plan, and the names curled round them, are
   DRAWN on this canvas by js/core/pin-stamp.js — the same painter the chat's
   Plans pane uses, so a pin is the same pixels in both. They used to be HTML
   dots with the name in an SVG ring, which looked different from the pane's
   despite the same numbers (owner, 21 Sep 2026); there is nothing left here
   to style but where the canvas sits. Under the marks, over the plan. */
.idz-pin-layer {
  position: absolute; left: 0; top: 0; width: 100%; height: 100%;
  z-index: 6; pointer-events: none;
}
/* The width, written INSIDE the road on its centre line — it belongs to the
   thing it measures, not to a badge floating alongside. Click to type. */
.idz-street-w {
  position: absolute; transform: translate(-50%, -50%) scale(calc(var(--z, 1) * var(--rel, 1))); z-index: 7;
  padding: 1px 6px; border-radius: 3px; background: rgba(255,255,255,.94);
  border: 1px solid #7a7a72; font-size: 10.5px; font-weight: 800; color: #3d3d38;
  white-space: nowrap; font-family: 'JetBrains Mono', ui-monospace, monospace;
  cursor: text;
}
.idz-street-w.sel { border-color: #2f6feb; }
/* No scale set yet: say so rather than print a guessed figure onto a strategy. */
.idz-street-w.noscale { color: #8a6a1f; border-color: #d8b34a; background: #fffbe9; font-weight: 500; cursor: default; }
/* Typing an exact width. Sits exactly where the readout was, so the number
   does not jump when you click it. */
.idz-street-w-input {
  position: absolute; transform: translate(-50%, -50%) scale(calc(var(--z, 1) * var(--rel, 1))); z-index: 8;
  width: 58px; padding: 2px 5px; border-radius: 3px; border: 1px solid #2f6feb;
  background: #fff; color: #3d3d38; font-size: 10.5px; font-weight: 800; text-align: center;
  font-family: 'JetBrains Mono', ui-monospace, monospace; outline: none;
  box-shadow: 0 0 0 3px rgba(47,111,235,.18);
}

/* Their toolbox buttons show the real artwork rather than a lettered chip,
   so the button and the thing it places are unmistakably the same symbol. */
.idz-symchip { display: inline-flex; align-items: center; justify-content: center; width: 26px; margin-right: 6px; flex: none; }
.idz-symchip svg { display: block; width: 26px; height: auto; }
.idz-symchip.sq svg { width: 15px; height: 15px; border-radius: 1.5px; }

/* Toolbox mini-chips for the new symbol buttons */
.idz-blockchip {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 26px; height: 16px; padding: 0 4px; margin-right: 6px;
  border-radius: 2px; color: #fff; font-size: 9px; font-weight: 800;
}
.idz-blockchip.ring { background: transparent; border: 2px dashed #e04a00; border-radius: 50%; color: #e04a00; width: 18px; min-width: 18px; height: 18px; }

/* Hob radiation zone — a warm radial "heat" gradient fading outwards inside a
   dashed hazard ring, with a hob handle at the centre. TRUE-SCALE (sized in %
   of the plan) so it zooms with the drawing; the zone is visual-only — the
   centre grip is the click/drag target. */
.idz-hob {
  position: absolute; transform: translate(-50%, -50%); box-sizing: border-box;
  border: calc(var(--u, 1) * 0.8px) dashed #e04a00; border-radius: 50%;   /* the one thickness scale, 0.8 */
  background: radial-gradient(circle,
    rgba(255, 96, 0, 0.18) 0%,
    rgba(255, 120, 20, 0.11) 45%,
    rgba(255, 150, 40, 0.05) 75%,
    rgba(255, 170, 60, 0.02) 100%);
  container-type: size; z-index: 4; pointer-events: none;
}
.idz-hob.sel { box-shadow: 0 0 0 calc(3px * var(--z,1)) rgba(224,74,0,.35); }
.idz-hob-lbl {
  position: absolute; left: 50%; top: 76%; transform: translate(-50%, -50%);
  color: #9c3400; font-weight: 800; font-size: 9cqw; line-height: 1;
  letter-spacing: .04em; font-family: 'Inter', sans-serif; white-space: nowrap;
  background: rgba(255,255,255,.6); padding: 1.5cqw 3cqw; border-radius: 99px;
  pointer-events: none;
}
/* the hob itself — its centre handle (above the advanced layer, like other
   symbols). A small dot on the exact centre, on a CLEAR grab circle, the same
   size at every zoom: the plan shows through all of it but the dot (owner,
   24 Sep 2026 — an 18px solid target, growing with the zoom, hid what was
   under the hob: "the exact center just needs to be a small dot, basically
   maximum visibility"). Still the click / drag target; the zone lets clicks
   through. */
.idz-hob-grip {
  position: absolute; width: 16px; height: 16px;
  transform: translate(-50%, -50%);
  border-radius: 50%; background: transparent;
  z-index: 7; pointer-events: auto; cursor: grab;
}
.idz-hob-grip::after {
  content: ''; position: absolute; left: 50%; top: 50%; width: 5px; height: 5px;
  border-radius: 50%; background: #e04a00; transform: translate(-50%, -50%);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.85);
}
.idz-hob-grip.sel { outline: 2px solid #2f6feb; outline-offset: 2px; }

/* Compartment rating label sits IN the line: an opaque plate breaks the line
   and the rating text fills the gap. */
.idz-mark-len.comp { background: #fff; }

/* Greyscale button placement + neutral (non-blue) active state.
   (The live plan's greyscale is BAKED into a canvas copy in JS — never a CSS
   filter on the live plan surface: cursor-bug guard. Export pages use the
   export-only rule below.) */
.idz-overlay.pdfmode .idz-head #idzGrey { margin-left: 12px; }
.idz-overlay.pdfmode .idz-head .idz-btn.grey-on {
  background: #58606d; border-color: #6a7280; color: #fff;
  box-shadow: inset 0 1px 3px rgba(0,0,0,.35);
}
.idz-export.greyscale .fl-img { filter: grayscale(1); }
.idz-export.greyscale .fl-img.hd { filter: none; }

/* Right-click vertex menu (delete point / break here) */
.idz-vmenu { position: fixed; z-index: 5000; background: #fff; border: 1px solid #e8e6e0; border-radius: 8px; box-shadow: 0 8px 28px rgba(0,0,0,.22); overflow: hidden; min-width: 130px; }
.idz-vmenu-item { display: block; width: 100%; text-align: left; padding: 8px 14px; border: none; background: none; font: inherit; font-size: 12.5px; cursor: pointer; color: #1b1c1a; }
.idz-vmenu-item:hover { background: #f5f3ef; }

/* ── PDF Export — paginated print-quality preview ──────────────────────────── */
.idz-export { position: fixed; inset: 0; z-index: 4100; display: none; flex-direction: column;
  background: #d9d7d2; color: #1b1c1a; font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
.idz-export.open { display: flex; }
.idz-export-head { display: flex; align-items: center; gap: 14px; padding: 12px 20px; background: #fbf9f5; border-bottom: 1px solid #e8e6e0; }
.idz-export-title { font-family: 'Hanken Grotesk', 'Inter', sans-serif; font-weight: 700; font-size: 15px; color: #111212; letter-spacing: -.01em; }
.idz-export-sub { font-size: 11.5px; color: #6b6b6b; margin-top: 2px; }
.idz-export-spacer { flex: 1; }
/* Export-head buttons — quiet, print-dialog manners. The primary action is an
   ink-black button in the app's monospace-label voice (like the topbar pills),
   not a loud CTA — this is a document tool, not a marketing page. */
.idz-export-head .idz-btn { background: #fff; border-color: #ddd9d1; color: #3f4147; }
.idz-export-head .idz-btn:hover { border-color: #b9b3a7; background: #faf9f6; }
.idz-export-head .idz-btn.primary {
  background: #111212; border-color: #111212; color: #fff;
  font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 11px;
  font-weight: 600; text-transform: uppercase; letter-spacing: .09em;
  padding: 8px 16px; border-radius: 6px;
}
.idz-export-head .idz-btn.primary:hover { background: #2a2c2e; border-color: #2a2c2e; }
/* `safe center` + overflow-x: wide sheets stay reachable by horizontal scroll
   on narrow windows instead of being clipped off the left edge. Left-drag on
   any non-editable spot pans (free-roam), so the surface reads as grabbable. */
.idz-export-scroll { flex: 1; overflow-y: auto; overflow-x: auto; padding: 12px 12px 40px; display: flex; flex-direction: column; align-items: safe center; gap: 22px; cursor: grab; }
.idz-export-scroll.grabbing { cursor: grabbing; }
.idz-export-scroll .cov-edit, .idz-export-scroll .cov-cp, .idz-export-scroll .cov-cs { cursor: text; }
/* Export preview zoom */
.idz-export-zoom { display: inline-flex; align-items: center; gap: 6px; margin-right: 10px; }
.idz-export-zoom .idz-btn { width: 30px; padding: 5px 0; text-align: center; }
.idz-export-zoom #idzZoomPct { font-size: 12px; color: #5f5e5e; min-width: 40px; text-align: center; font-family: 'JetBrains Mono', ui-monospace, monospace; }
@media print { .idz-export.open #idzExportPages { zoom: 1 !important; } }

/* A4 LANDSCAPE sheet (297×210mm ≈ 1123×794 at 96dpi). The sheet is a CSS container
   so all content is sized in cq units and scales crisply at any preview width + in print. */
.idz-page.floorwide { width: min(1588px, calc(100vw - 60px)); }   /* 420mm wide sheet, same 210mm height */
.idz-page { width: min(1123px, calc(100vw - 60px)); height: min(794px, calc((100vw - 60px) * 0.7069));
  flex: 0 0 auto; background: #fff; box-sizing: border-box; position: relative; box-shadow: 0 3px 22px rgba(0,0,0,.22); container-type: size; }
.idz-page-label { position: absolute; top: -20px; left: 2px; font-size: 9.5px; text-transform: uppercase; letter-spacing: .14em;
  color: #6b6b6b; font-family: 'JetBrains Mono', ui-monospace, monospace; }

/* Cover page */
.cov { position: absolute; inset: 0; display: flex; flex-direction: column; padding: 7cqh 6cqw; box-sizing: border-box; }
.cov-rule { position: absolute; top: 0; left: 0; right: 0; height: .8cqh; background: #2f9c58; }
.cov-head { display: flex; justify-content: space-between; align-items: flex-start; }
.cov-logo { min-width: 24cqw; max-width: 55cqw; height: 15cqh; border: 1px dashed #d3d0c9; border-radius: 6px; display: flex; align-items: center;
  justify-content: center; text-align: center; color: #b3afa6; font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 1.15cqw;
  text-transform: uppercase; letter-spacing: .14em; cursor: pointer; overflow: hidden; transition: border-color .12s, color .12s; }
.cov-logo:hover { border-color: #2f9c58; color: #2f9c58; }
.cov-logo small { display: block; font-size: .82cqw; letter-spacing: .1em; opacity: .85; margin-top: .5cqh; }
.cov-logo.has-img { border: none; padding: 0; min-width: 0; justify-content: flex-start; }
.cov-logo-img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; object-position: left center; display: block; }

/* Inline-editable cover fields (typed straight on the page, saved to localStorage) */
.cov-edit { outline: none; cursor: text; border-radius: 3px; transition: box-shadow .12s, background .12s; }
.cov-edit:empty::before { content: attr(data-ph); color: #cbc7bf; }
.cov-edit:hover { box-shadow: inset 0 -1px 0 #ddd9d1; }
.cov-edit:focus { box-shadow: inset 0 -1.5px 0 #2f9c58; background: #fbf6f1; }
h1.cov-title.cov-edit:hover { box-shadow: inset 0 -2px 0 #e4e0d8; }
h1.cov-title.cov-edit:focus { box-shadow: inset 0 -2.5px 0 #2f9c58; }
.cov-docmeta { text-align: right; padding-top: .5cqh; }
.cov-doctype { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 1cqw; text-transform: uppercase; letter-spacing: .18em; color: #2f9c58; }
.cov-standard { font-family: 'Hanken Grotesk', 'Inter', sans-serif; font-size: 1.7cqw; font-weight: 700; color: #111212; margin-top: .6cqh; }
.cov-main { flex: 1; display: flex; flex-direction: column; justify-content: center; }
.cov-eyebrow { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 1.05cqw; text-transform: uppercase; letter-spacing: .24em; color: #2f9c58; margin-bottom: 2.4cqh; }
.cov-title { font-family: 'Hanken Grotesk', 'Inter', sans-serif; font-weight: 800; font-size: 6.4cqw; line-height: .98; letter-spacing: -.02em; color: #111212; margin: 0; max-width: 84%; }
.cov-loc { font-size: 2cqw; color: #594138; margin-top: 2cqh; }
.cov-meta { display: flex; border-top: 1.5px solid #1b1c1a; padding-top: 2.2cqh; }
.cov-field { flex: 1; padding: 0 1.8cqw; border-right: 1px solid #e8e6e0; }
.cov-field:first-child { padding-left: 0; }
.cov-field:last-child { border-right: none; padding-right: 0; }
.cov-fl { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: .85cqw; text-transform: uppercase; letter-spacing: .14em; color: #6b6b6b; margin-bottom: .9cqh; }
.cov-fv { font-size: 1.45cqw; font-weight: 600; color: #111212; }

/* Section pages (findings / floors) — clean headers; content filled in next steps */
.pg { position: absolute; inset: 0; padding: 8cqh 6cqw; box-sizing: border-box; }
.pg-eyebrow { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 1cqw; text-transform: uppercase; letter-spacing: .2em; color: #2f9c58; }
.pg-title { font-family: 'Hanken Grotesk', 'Inter', sans-serif; font-weight: 800; font-size: 3.6cqw; letter-spacing: -.02em; color: #111212; margin: 1.2cqh 0 .8cqh; }
.pg-sub { font-size: 1.5cqw; color: #594138; max-width: 62%; line-height: 1.4; }
.pg-ph { margin-top: 4cqh; border: 1px dashed #d8d5cf; border-radius: 10px; padding: 5cqh 4cqw; text-align: center; color: #b3afa6; font-size: 1.3cqw; }

/* ── Findings page ─────────────────────────────────────────────────────────── */
.pg-findings { display: flex; flex-direction: column; }
.fnd-grid { display: grid; grid-template-columns: 37% 1fr; gap: 4cqw; margin-top: 3cqh; flex: 1; min-height: 0; }
.fnd-h { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: .95cqw; text-transform: uppercase; letter-spacing: .16em; color: #6b6b6b; margin-bottom: 1.4cqh; padding-bottom: .8cqh; border-bottom: 1px solid #e8e6e0; }
.fnd-bw { margin: 0; padding-left: 1.4cqw; display: flex; flex-direction: column; gap: 1cqh; }
.fnd-bw li { font-size: 1.15cqw; line-height: 1.45; color: #594138; }
.fnd-bw li b { color: #111212; }
.fnd-bw li.fnd-empty { color: #a8a59d; list-style: none; }
.fnd-floor { margin-bottom: 1.6cqh; padding-bottom: 1.3cqh; border-bottom: 1px solid #f0eee9; }
.fnd-frow { display: flex; align-items: center; justify-content: space-between; gap: 1cqw; }
.fnd-fname { font-family: 'Hanken Grotesk', 'Inter', sans-serif; font-weight: 700; font-size: 1.5cqw; color: #111212; }
.fnd-chips { display: flex; gap: .6cqw; }
.fnd-chip { font-size: .85cqw; font-weight: 700; padding: .3cqh .9cqw; border-radius: 20px; font-family: 'JetBrains Mono', ui-monospace, monospace; }
.fnd-chip.ok { background: #dcfce7; color: #166534; }
.fnd-chip.bad { background: #ffdad6; color: #93000a; }
.fnd-redlist { margin: .8cqh 0 0; padding-left: 1.4cqw; display: flex; flex-direction: column; gap: .6cqh; }
.fnd-redlist li { font-size: 1.05cqw; line-height: 1.4; color: #ba1a1a; }
.fnd-redlist li b { color: #111212; }
.fnd-note { font-size: 1cqw; color: #6b6b6b; margin-top: .5cqh; }

/* ── Floor-plan page ───────────────────────────────────────────────────────── */
.fl { position: absolute; inset: 0; display: flex; flex-direction: column; padding: 4cqh 5cqw; box-sizing: border-box; }
.fl-head { display: flex; align-items: flex-end; justify-content: space-between; border-bottom: 1.5px solid #1b1c1a; padding-bottom: 1.3cqh; }
.fl-project { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: .9cqw; text-transform: uppercase; letter-spacing: .16em; color: #2f9c58; }
.fl-name { font-family: 'Hanken Grotesk', 'Inter', sans-serif; font-weight: 800; font-size: 2.6cqw; color: #111212; letter-spacing: -.01em; margin-top: .4cqh; }
.fl-chips { display: flex; align-items: center; }
.fl-chip { font-size: 1cqw; font-weight: 700; padding: .4cqh 1cqw; border-radius: 20px; font-family: 'JetBrains Mono', ui-monospace, monospace; margin-left: .5cqw; }
.fl-chip.ok { background: #dcfce7; color: #166534; }
.fl-chip.bad { background: #ffdad6; color: #93000a; }
.fl-chip.none { background: #efeeea; color: #6b6b6b; }
.fl-planwrap { flex: 1; min-height: 0; display: flex; align-items: center; justify-content: center; padding-top: 2.4cqh; }
.fl-planbox { position: relative; display: inline-block; max-width: 100%; max-height: 100%; }
.fl-img { display: block; max-width: 100%; max-height: 64cqh; width: auto; height: auto; }
.fl-dot { position: absolute; width: 2cqw; height: 2cqw; min-width: 13px; min-height: 13px; border-radius: 50%; transform: translate(-50%,-50%);
  border: 1.5px solid #fff; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 1.05cqw; font-weight: 800; box-shadow: 0 1px 3px rgba(0,0,0,.4); }
.fl-dot.g { background: #22c55e; }
.fl-dot.r { background: #ba1a1a; }
.fl-lab { position: absolute; transform: translate(-50%, 1.1cqh); font-size: .78cqw; background: rgba(17,18,18,.85); color: #fff; padding: 0 .5cqw;
  border-radius: 3px; white-space: nowrap; font-family: 'JetBrains Mono', ui-monospace, monospace; max-width: 16cqw; overflow: hidden; text-overflow: ellipsis; }

/* ── Print → PDF (landscape A4). Only active while the export preview is open. ── */
@media print {
  @page { size: A4 landscape; margin: 0; }
  /* The app shell pins html/body to the viewport (height:100% + overflow:
     hidden) — in print that CLIPS everything after the first sheet, so the
     exported PDF ended at the cover. Let the document flow for printing. */
  html, body { background: #fff !important; height: auto !important; overflow: visible !important; }
  /* Exact colours regardless of the print dialog's "Background graphics"
     setting — key swatches, accent bars and symbol fills must survive. */
  .idz-export.open, .idz-export.open * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
  body:has(.idz-export.open) > *:not(.idz-export) { display: none !important; }
  .idz-export.open { position: static !important; display: block !important; background: #fff !important; height: auto !important; }
  .idz-export.open .idz-export-head { display: none !important; }
  .idz-export.open .idz-export-scroll { display: block !important; overflow: visible !important; padding: 0 !important; gap: 0 !important; }
  .idz-export.open .idz-page { width: 297mm !important; height: 210mm !important; max-width: none !important; box-shadow: none !important; margin: 0 !important; page-break-after: always; break-after: page; overflow: hidden; }
  /* Wide floor sheets print on their own named page size (420×210mm) — the
     plan keeps its exact A4 layout, the extra paper carries the annotations. */
  @page wide { size: 420mm 210mm; margin: 0; }
  .idz-export.open .idz-page.floorwide { page: wide; width: 420mm !important; height: 210mm !important; }
  .idz-export.open .idz-page:last-child { page-break-after: auto; break-after: auto; }
  .idz-export.open .idz-page-label { display: none !important; }
  /* editing-only controls never appear in the exported PDF */
  .idz-export.open .idz-noprint,
  .idz-export.open .cs-del { display: none !important; }
  .cov-edit { box-shadow: none !important; background: none !important; }
}

/* ── Cover: key building parameters band ───────────────────────────────────── */
.cov-params { display: flex; gap: 3.4cqw; margin-top: 2.8cqh; }
.cov-pl { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: .78cqw; text-transform: uppercase; letter-spacing: .13em; color: #2f9c58; margin-bottom: .5cqh; }
.cov-pv { font-size: 1.25cqw; font-weight: 600; color: #1b1c1a; }

/* ── Initial Assessment narrative page (2 columns) ─────────────────────────── */
.pg-assess { display: flex; flex-direction: column; }
.as-cols { column-count: 2; column-gap: 5cqw; margin-top: 2.6cqh; flex: 1; min-height: 0; }
.as-sec { break-inside: avoid; margin-bottom: 1.9cqh; }
.as-h { font-family: 'Hanken Grotesk', 'Inter', sans-serif; font-weight: 700; font-size: 1.3cqw; color: #1b1c1a; margin: 0 0 .5cqh; padding-left: .9cqw; border-left: 2px solid #2f9c58; }
.as-p { font-size: 1.02cqw; line-height: 1.5; color: #33352f; margin: 0; }
.as-empty { margin-top: 4cqh; color: #a8a59d; font-size: 1.25cqw; border: 1px dashed #d8d5cf; border-radius: 10px; padding: 5cqh 4cqw; text-align: center; line-height: 1.5; }

/* ── Floor page: plan + numbered findings (two columns) ────────────────────── */
.fl-cols { flex: 1; min-height: 0; display: grid; grid-template-columns: 1fr 33%; gap: 4cqw; padding-top: 2.4cqh; }
/* Keep an over-sized callout inside the plan column — it clips at the edge instead of
   covering the annotations; the user can shrink it in Markup mode if they want it full. */
/* container-type makes the wrap's true size measurable (100cqw/100cqh below), so the
   plan image can fill ALL the space the page actually has for it. */
.fl-planwrap { min-height: 0; display: flex; align-items: center; justify-content: center; overflow: clip; container-type: size; }
.fl-planbox { position: relative; display: inline-block; max-width: 100%; max-height: 100%; }
.fl-img { display: block; max-width: 100%; max-height: 66cqh; width: auto; height: auto; }
.fl-mark { position: absolute; transform: translate(-50%,-50%); width: 2cqw; height: 2cqw; min-width: 18px; min-height: 18px; border-radius: 50%;
  background: #ba1a1a; color: #fff; border: 1.5px solid #fff; box-shadow: 0 1px 3px rgba(0,0,0,.45); display: flex; align-items: center; justify-content: center; font-size: 1.05cqw; font-weight: 700; }
/* `clip` (not `hidden`): a hidden-overflow box can still be silently scrolled
   by the browser chasing the caret while typing a long note — which shoved
   the first notes out of the top of the page. clip forbids ALL scrolling. */
.fl-side { min-height: 0; overflow: clip; }
.fl-side-h { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: .9cqw; text-transform: uppercase; letter-spacing: .14em; color: #6b6b6b; padding-bottom: .8cqh; border-bottom: 1px solid #e8e6e0; margin-bottom: 1.3cqh; }
.flf-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 1.3cqh; }
.flf-item { display: flex; gap: .9cqw; }
.flf-num { flex: 0 0 auto; width: 1.9cqw; height: 1.9cqw; min-width: 20px; min-height: 20px; border-radius: 50%; background: #ba1a1a; color: #fff; font-weight: 700; font-size: 1cqw; display: flex; align-items: center; justify-content: center; }
.flf-body { min-width: 0; }
.flf-title { font-family: 'Hanken Grotesk', 'Inter', sans-serif; font-weight: 700; font-size: 1.05cqw; color: #111212; }
.flf-prob { font-size: .95cqw; line-height: 1.4; color: #7a1a12; margin-top: .3cqh; }
.flf-fe { font-size: .9cqw; line-height: 1.4; color: #594138; margin-top: .4cqh; }
.flf-fe b { color: #2f9c58; }
.flf-none { font-size: 1cqw; color: #6b6b6b; line-height: 1.5; }

/* Floor page: full-width plan when there are no notes; wrap cover params */
.fl-cols.solo { grid-template-columns: 1fr; }
.cov-params { flex-wrap: wrap; row-gap: 1.6cqh; }
.cov-param { min-width: 18cqw; }
/* Static markups keep their live look but never intercept clicks in the export */
.idz-export .idz-marks, .idz-export .idz-note-mark, .idz-export .idz-note-num, .idz-export .idz-callout, .idz-export .idz-sym, .idz-export .idz-deco, .idz-export .idz-mark-len,
.idz-export .idz-textbox, .idz-export .idz-count, .idz-export .idz-hob, .idz-export .idz-hob-grip { pointer-events: none; }

/* Floor page: leave room for the Key footer; annotations list; the Key itself */
/* Floor page: the plan fills its ENTIRE available box (cq units resolve
   against .fl-planwrap, which already sits below the header and above the
   Key) — no fixed height cap leaving the drawing small in white space. */
.fl-img { max-width: 100cqw; max-height: 100cqh; }
/* Pasted images: click → ring + corner grip (resize), drag the image to move
   it in the text. The grip lives on <body> at fixed coords, so the print CSS
   (which hides everything except the export root) never shows it. */
.idz-export [contenteditable="true"] img { max-width: 100%; height: auto; }
img.gx-img-sel { outline: 2px dashed var(--pdf-accent, #2f9c58); outline-offset: 2px; }
.gx-img-grip { position: fixed; z-index: 6000; width: 16px; height: 16px; border-radius: 4px;
  background: #fff; border: 2px solid var(--pdf-accent, #2f9c58); box-shadow: 0 1px 5px rgba(0,0,0,.35);
  cursor: nwse-resize; }
.flf-note img { display: block; margin: .4cqh 0; border-radius: 4px; }
@media print { img.gx-img-sel { outline: none !important; } }

/* Annotation note ops (＋img / ×) — appear on hover, never print */
.flf-note-ops { flex: none; display: inline-flex; align-items: center; gap: 4px; opacity: 0; transition: opacity 120ms; }
.flf-note:hover .flf-note-ops { opacity: 1; }
.flf-imgbtn { border: 1px solid #d8d4cc; background: #fff; border-radius: 5px; font-size: 10px; padding: 1px 6px; cursor: pointer; color: #3f4147; white-space: nowrap; }
.flf-imgbtn:hover { border-color: #b9b3a7; }

/* Custom-page COMMENT BLOCKS — each its own editable with its own tools */
.cpb { position: relative; margin-top: 2.2cqh; padding-left: 1.2cqw;
  border-left: 2px solid color-mix(in srgb, var(--pdf-accent, #2f9c58) 40%, transparent); }
.cpb-body { outline: none; font-size: 1.1cqw; line-height: 1.55; color: #23241f; min-height: 2.8cqh; white-space: pre-wrap; overflow-wrap: anywhere; }
.cpb-body:empty:before { content: attr(data-ph); color: #a8a59d; }
.cpb-body img { max-width: 100%; height: auto; display: block; margin: .8cqh 0; border-radius: 4px; }
.cpb-tools { position: absolute; right: 0; top: -1.6cqh; display: none; gap: 6px; z-index: 3; }
.cpb:hover .cpb-tools { display: inline-flex; }
.cpb-btn { border: 1px solid #d8d4cc; background: #fff; border-radius: 5px; font-size: 11px; padding: 2px 8px; cursor: pointer; color: #3f4147; }
.cpb-btn:hover { border-color: #b9b3a7; }
.cpb-btn.del { color: #dc2626; }
.cpb-add { margin-top: 2.2cqh; border: 1px dashed #94a3b8; background: #f8fafc; color: #334155; border-radius: 6px; padding: 6px 12px; cursor: pointer; font-size: 12px; }
.cpb-add:hover { background: #eef2f7; }

/* WIDE floor sheet (420×210mm vs A4's 297×210) — used when a floor carries
   lots of annotations. flw-main is its OWN 297mm-equivalent CSS container,
   so the plan area lays out pixel-identically to a normal A4 floor page —
   the plan is NEVER shrunk; ALL the extra paper goes to the annotations
   column (flw-side, also its own container). Padding values on flw-main /
   flw-side are page-relative (420mm), chosen to equal the A4 page's 5cqw. */
.floorwide .fl { padding: 0; flex-direction: row; }
.flw-main { container-type: size; flex: 0 0 70.714%; min-width: 0; display: flex; flex-direction: column; padding: 4cqh 3.54cqw; box-sizing: border-box; }
.flw-side { container-type: size; flex: 1 1 auto; min-width: 0; box-sizing: border-box; padding: 4cqh 3.54cqw 4cqh 0; overflow: clip; }
/* side typography — cq units resolve against flw-side (~123mm), values match
   the A4 sizes exactly (e.g. header 2.67mm, list text 2.91mm) */
.flw-side .fl-side-h { font-size: 2.17cqw; }
.flw-side .flf-notes li { font-size: 2.37cqw; }
.flw-side .flf-note-num { min-width: 3.86cqw; height: 3.86cqw; font-size: 1.98cqw; padding: 0 .72cqw; }
.fl-side-h.mt { margin-top: 1.8cqh; }
.flf-notes { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .8cqh; }
.flf-notes li { font-size: .98cqw; line-height: 1.4; color: #33352f; }
.fl-legend { border-top: 1px solid #e8e6e0; padding-top: 1.4cqh; margin-top: 1.4cqh; }
.fl-key-h { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: .8cqw; text-transform: uppercase; letter-spacing: .14em; color: #6b6b6b; margin-bottom: .9cqh; }
.fl-key { display: flex; flex-wrap: wrap; gap: 1cqh 2.6cqw; }
.fl-key-i { display: flex; align-items: center; gap: .7cqw; font-size: .95cqw; color: #33352f; }
.fl-key-sw { flex: 0 0 auto; }
.fl-key-sw.line { width: 2.4cqw; height: 0; border-top: 2.5px solid var(--kc); }
.fl-key-sw.door { width: 1.35cqw; height: 1.35cqw; border-radius: 50%; background: #fff; border: 2px solid var(--kc); }
.fl-key-sw.exit { width: 1.35cqw; height: 1.35cqw; border-radius: 50%; background: var(--kc); }
.fl-key-sw.dot { width: 1.1cqw; height: 1.1cqw; border-radius: 50%; background: var(--kc); }

/* Export plan: shrink the live-editor-sized marks so they don't cover the layout */
.idz-export .fl-mark { width: 1.6cqw; height: 1.6cqw; min-width: 13px; min-height: 13px; font-size: .92cqw; border-width: 1px; }
/* (The old !important symbol shrinks are gone — the export plan box sets --z
   from its real width vs the live board, so the shared painter sizes symbols
   exactly like a proportionally shrunk live view.) */
/* Export markups use the SAME painter + base styles as the live Markup view;
   every element already scales through the box's --z var, so the plan looks
   exactly as drawn, just proportionally smaller. Only the edit chrome
   (grips, × buttons, hover targets) is hidden here. */
.idz-export .idz-note-grip, .idz-export .idz-note-del, .idz-export .idz-rz,
.idz-export .idz-callout-del, .idz-export .idz-tb-move, .idz-export .idz-tb-del { display: none !important; }

/* Key: FD..S = coloured door + yellow smoke-seal outer ring */
.fl-key-sw.door.s { box-shadow: 0 0 0 2px #ffe000; }
.idz-export .idz-mark-len { font-size: calc(12.5px); }
/* Key swatches that LOOK like the actual symbols */
.fl-key-sw.aov, .fl-key-sw.fmb {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 2.6cqw; height: 1.5cqw; padding: 0 .35cqw; border-radius: .18cqw;
  background: var(--kc); color: #fff; font-weight: 800; font-size: .85cqw; letter-spacing: .02em;
}
.fl-key-sw.aov::after { content: 'AOV'; }
.fl-key-sw.fmb.in::after { content: 'IN'; }
.fl-key-sw.fmb.out::after { content: 'OUT'; }
.fl-key-sw.hob {
  width: 1.7cqw; height: 1.7cqw; border-radius: 50%;
  border: .14cqw dashed var(--kc);
  background: radial-gradient(circle, rgba(255,96,0,.4), rgba(255,150,40,.05));
}

/* Delete buttons on findings + annotations */
.flf-item { align-items: flex-start; }
.flf-body { flex: 1; min-width: 0; }
.flf-note { display: flex; align-items: flex-start; gap: .5cqw; }
.flf-note .cov-edit { flex: 1; min-width: 0; }
/* Number chip — mirrors the note's badge on the plan (same accent + number) */
.flf-note-num { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
  min-width: 1.6cqw; height: 1.6cqw; padding: 0 .3cqw; border-radius: 999px; box-sizing: border-box;
  background: color-mix(in srgb, var(--pdf-accent, #2f9c58) 80%, transparent); color: #fff;
  font-family: 'JetBrains Mono', ui-monospace, monospace; font-weight: 800; font-size: .82cqw; margin-top: .1cqh; }
.rep-del { flex: 0 0 auto; border: none; background: none; color: #c0bcb3; cursor: pointer; font-size: 1.3cqw; line-height: 1; padding: 0 .2cqw; }
.rep-del:hover { color: #ba1a1a; }

/* PDF accent adapts to the uploaded logo's brand colour (falls back to brand green) */
.cov-rule { background: var(--pdf-accent, #2f9c58); }
.cov-doctype, .cov-eyebrow, .cov-pl, .pg-eyebrow, .fl-project, .flf-fe b { color: var(--pdf-accent, #2f9c58); }
.as-h { border-left-color: var(--pdf-accent, #2f9c58); }

/* Neutral pins/markers — no compliant/non-compliant meaning (slate = normal, amber = point to review) */
.idz-chip.neutral { background: #eceae5; color: #5f5e5e; }
.idz-dot.norm { background: #5b6b7f; }
.idz-dot.flag { background: #e08a00; }
.idz-sw.norm { background: #5b6b7f; }
.idz-sw.flag { background: #e08a00; }

/* Flagged pin = red "i" information marker (not a right/wrong verdict) */
.idz-dot.flag { background: #d0021b; font-family: Georgia, 'Times New Roman', serif; font-style: italic; font-weight: 700; }
.idz-sw.flag { background: #d0021b; }

/* Callout arrow-tip handle — clear, grabbable, always shown while editing */
.idz-callout-tip { position: absolute; transform: translate(-50%,-50%) scale(calc(var(--z, 1) * var(--rel, 1))); z-index: 8;
  width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 2px solid #333;
  box-shadow: 0 1px 3px rgba(0,0,0,.4); cursor: grab; pointer-events: auto; }
.idz-callout-tip:hover { border-color: #2f9c58; transform: translate(-50%,-50%) scale(calc(var(--z,1) * var(--rel,1) * 1.25)); }

/* Measurement number pulled out on a thin extension line */
.idz-mark-ext { fill: none; stroke-width: calc(var(--u, 1) * var(--w, 0.8) * 1px); stroke-dasharray: 3 2.5; vector-effect: non-scaling-stroke; opacity: .8; }
/* A Measurement slid off its points: the lines joining it back to them, at
   the line's own thickness, square-ended so they meet a tick or a ring
   exactly (owner, 24 Sep 2026). */
.idz-mark-dimext { fill: none; stroke-width: calc(var(--u, 1) * var(--w, 0.8) * 1px); vector-effect: non-scaling-stroke; stroke-linecap: butt; }

/* Folded "More questions" section (batch-added unknowables) */
.idz-qmore-head { font-size: 11px; font-weight: 700; color: #2f9c58; cursor: pointer; padding: 10px 2px 6px; text-transform: uppercase; letter-spacing: .06em; font-family: 'JetBrains Mono', ui-monospace, monospace; border-top: 1px dashed #e8e6e0; margin-top: 10px; }
.idz-qmore-head:hover { text-decoration: underline; }

/* ── The left sidebar: notes and the building review (owner, 27 Sep 2026) ──
   The Markup screen's own chrome: mono kickers, white cards on the grey
   sidebar, the screen's blue as the one accent. Motion is transform /
   background-position ONLY — no filter/backdrop-filter (this is the surface
   where filters made the mouse cursor vanish under GPU compositing; see the
   cursor-fix commits). */
.idz-leftbar { --lb-accent: #1071bd; --lb-accent-soft: #dbeafe; --lb-ink: #26303a; --lb-muted: #6b7684; --lb-line: #c4cad2; --lb-line-soft: #e6eaef; padding: 12px 12px 20px; }
.idz-lb-card { background: #fff; border: 1px solid var(--lb-line); border-radius: 8px; box-shadow: 0 1px 2px rgba(20,30,40,.04); overflow: hidden; }
.idz-lb-card + .idz-lb-card { margin-top: 14px; }
/* the card's title band: name on the left, detail on the right; folds the card */
.idz-lb-cardhead { display: flex; align-items: center; gap: 8px; padding: 9px 11px; background: #f6f9fc; border-bottom: 1px solid var(--lb-line-soft); cursor: pointer; user-select: none; }
.idz-lb-cardhead b { flex: 1; font: 600 12px/1 'Inter', sans-serif; color: var(--lb-ink); }
.idz-lb-cardhead:hover b { color: var(--lb-accent); }
.idz-lb-meta { font: 500 10.5px/1 'Inter', sans-serif; color: var(--lb-muted); }
.idz-lb-chev { color: #9aa5b1; font-size: 12px; line-height: 1; transform: rotate(90deg); transition: transform .12s; }
.idz-lb-cardhead.folded { border-bottom: 0; }
.idz-lb-cardhead.folded .idz-lb-chev { transform: none; }
.idz-lb-empty { padding: 12px 11px; font: 400 11.5px/1.5 'Inter', sans-serif; color: var(--lb-muted); }

/* notes */
.idz-savenote { display: grid; grid-template-columns: 22px 1fr 16px; gap: 9px; align-items: start; padding: 9px 10px 9px 9px;
  border-bottom: 1px solid var(--lb-line-soft); cursor: grab; }
.idz-savenote:last-child { border-bottom: 0; }
.idz-savenote:hover { background: #f6f9fc; }
.idz-savenote.dragging { opacity: .5; }
.idz-note-badge { width: 22px; height: 22px; border-radius: 999px; display: grid; place-items: center; margin-top: 1px;
  font: 700 11px/1 'Inter', sans-serif; color: #fff; background: var(--lb-accent); box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--lb-accent); }
.idz-note-badge.off { background: #fff; color: #5b6774; box-shadow: 0 0 0 1.5px #b8c0ca inset; }
.idz-savenote-text { font: 400 12px/1.45 'Inter', sans-serif; color: var(--lb-ink); min-width: 0;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.idz-savenote-del { border: 0; background: transparent; color: #b3bcc6; font-size: 15px; line-height: 1; cursor: pointer; padding: 1px 0 0; border-radius: 4px; }
.idz-savenote:hover .idz-savenote-del { color: #d1341a; }
.idz-note-hint { grid-column: 2; font: 500 10px/1 'Inter', sans-serif; color: #7b8794; margin-top: 4px; display: none; }
.idz-savenote:hover .idz-note-hint { display: block; }

/* the review */
.idz-rv-status { display: flex; align-items: center; gap: 8px; padding: 10px 11px; border-bottom: 1px solid var(--lb-line-soft);
  font: 500 11.5px/1.3 'Inter', sans-serif; color: var(--lb-ink); }
.idz-rv-dot { width: 8px; height: 8px; border-radius: 999px; background: #22a55b; box-shadow: 0 0 0 3px #dcf5e6; flex: none; }
.idz-rv-dot.off { background: #b8c0ca; box-shadow: 0 0 0 3px #eef1f5; }
.idz-rv-dot.live { background: var(--lb-accent); box-shadow: 0 0 0 3px var(--lb-accent-soft); animation: idzPulse 1.2s ease-in-out infinite; }
@keyframes idzPulse { 50% { transform: scale(1.35); } }
.idz-rv-when { color: var(--lb-muted); font-weight: 400; }
.idz-rv-spacer { flex: 1; }
.idz-rv-timer { font: 500 11px/1 'JetBrains Mono', ui-monospace, monospace; color: var(--lb-muted); }
.idz-rv-btn { font: 600 11px/1 'Inter', sans-serif; padding: 6px 10px; border-radius: 4px; cursor: pointer;
  border: 1px solid #0c5e9e; background: var(--lb-accent); color: #fff; }
.idz-rv-btn:hover { background: #0e6cb3; }
.idz-rv-btn.ghost { background: #fff; color: var(--lb-ink); border-color: #c9cfd8; }
.idz-rv-btn.ghost:hover { border-color: var(--lb-accent); color: var(--lb-accent); background: #fff; }
.idz-rv-row { display: grid; grid-template-columns: 26px 1fr 14px; gap: 8px; align-items: center; padding: 8px 11px;
  border-bottom: 1px solid #edf0f4; cursor: pointer; }
.idz-rv-row:last-child { border-bottom: 0; }
.idz-rv-row.wait { cursor: default; }
.idz-rv-row:not(.wait):hover { background: #f6f9fc; }
.idz-rv-n { font: 600 10px/1 'JetBrains Mono', ui-monospace, monospace; color: var(--lb-accent); }
.idz-rv-t { min-width: 0; font: 600 12px/1.3 'Inter', sans-serif; color: var(--lb-ink); }
.idz-rv-t small { display: block; font: 400 11px/1.4 'Inter', sans-serif; color: var(--lb-muted); margin-top: 2px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.idz-rv-c { color: #9aa5b1; font-size: 11px; text-align: right; transition: transform .12s; }
.idz-rv-row.open { background: #f6f9fc; align-items: start; }
.idz-rv-row.open .idz-rv-t small { white-space: pre-wrap; color: #3a4552; line-height: 1.5; margin-top: 5px; }
.idz-rv-row.open .idz-rv-c { transform: rotate(90deg); color: var(--lb-accent); }
.idz-rev-none { color: #a9a7a2; }
.idz-rv-progress { padding: 9px 11px 10px; border-bottom: 1px solid var(--lb-line-soft); }
.idz-rv-line { display: flex; justify-content: space-between; gap: 8px; font: 500 11px/1.2 'Inter', sans-serif; color: var(--lb-ink); margin-bottom: 7px; }
.idz-rv-stage { color: var(--lb-accent); }
.idz-rv-eta { font: 500 10px/1.2 'JetBrains Mono', ui-monospace, monospace; color: var(--lb-muted); white-space: nowrap; }
.idz-rv-rail { height: 4px; border-radius: 999px; background: #e3e8ee; overflow: hidden; }
.idz-rv-rail i { display: block; height: 100%; width: 38%; border-radius: 999px; background: linear-gradient(90deg, #1071bd, #3b95d8); animation: idzRail 1.8s ease-in-out infinite; }
@keyframes idzRail { 0% { transform: translateX(-100%); } 100% { transform: translateX(280%); } }
.idz-rv-foot { font: 400 10.5px/1.45 'Inter', sans-serif; color: var(--lb-muted); padding: 8px 11px 10px; border-top: 1px solid #edf0f4; }
.idz-skel-bar { height: 8px; border-radius: 4px; margin: 5px 0 0;
  background: linear-gradient(90deg, #e6eaef 25%, #f4f6f9 45%, #e6eaef 65%); background-size: 200% 100%;
  animation: idzShimmer 1.3s ease-in-out infinite; }
@keyframes idzShimmer { to { background-position: -200% 0; } }
@keyframes idzSpin { to { transform: rotate(360deg); } }

/* Custom keys list (Annotate section) — LIGHT theme, matching our toolbox.
   (The owner rejected the ported dark-chrome design system; the Keys rows
   keep his layout but take our light colours instead of the --gxm tokens.) */
.idz-keys { display: flex; flex-direction: column; gap: 4px; }
.idz-key-i {
  display: flex; align-items: center; gap: 8px; padding: 5px 8px;
  background: #fff; border: 1px solid #d8d4cc;
  border-radius: 6px; font-size: 11.5px; color: #2a2a28;
}
.idz-key-sw { width: 14px; height: 4px; border-radius: 2px; flex: 0 0 auto; }
.idz-key-t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.idz-key-x {
  border: 0; background: none; color: #8a877f; font-size: 14px;
  line-height: 1; cursor: pointer; padding: 1px 4px; border-radius: 4px;
  transition: background .15s, color .15s;
}
.idz-key-x:hover { background: #e11d2a; color: #fff; }
/* Keys are placeable tools — clickable rows */
.idz-key-i[data-keyuse] { cursor: pointer; transition: border-color .16s, background .16s, transform .12s; }
.idz-key-i[data-keyuse]:hover { border-color: #2f9c58; background: #f7f3ee; transform: translateY(-1px); }
/* Key swatches that are miniatures of the actual drawn markup */
.idz-key-sw.prev { width: 26px; height: 14px; background: none !important; border-radius: 0; display: inline-flex; }
/* Vector previews (street, fire engine, hydrant and saved custom keys) need a
   real miniature frame.  Without one, an inline <svg> uses the browser's
   300 × 150px intrinsic fallback size and can overwhelm the whole Key. */
.fl-key-sw.custom {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.6cqw;
  height: 1.5cqw;
  overflow: hidden;
}
.fl-key-sw.custom svg, .idz-key-sw.prev svg { width: 100%; height: 100%; display: block; }

/* Export pages: lines need no rule of their own any more — the page sets --u
   to a thousandth of the printed plan, so every line prints at exactly the
   weight, relative to the plan, that it has in Markup. */