/* 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; }

.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-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; }
.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 */
.idz-planwrap { flex: 1; overflow: auto; padding: 22px; text-align: center; background: #ffffff; cursor: grab; }
.idz-planwrap.grabbing { cursor: grabbing; }
.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: 344px; flex-shrink: 0; border-right: 1px solid #e8e6e0;
  background: #f5f3ef; overflow-y: auto; padding: 16px; }
.idz-leftbar.empty { display: none; }
.idz-leftbar .idz-lb-head { font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: #5f5e5e; margin: 0 0 10px; font-family: 'JetBrains Mono', ui-monospace, monospace; }

/* 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: 12px; width: 100%; padding: 9px 12px; border: none; background: none; border-radius: 8px; cursor: pointer; color: #5f5e5e; font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 500; text-align: left; transition: background .12s, color .12s; }
.idz-nav-item:hover { background: #eae8e4; color: #1b1c1a; }
.idz-nav-item.active { background: #2f9c58; color: #fff; 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; }
.idz-planwrap.calibrating, .idz-planwrap.calibrating *,
.idz-planwrap.drawing, .idz-planwrap.drawing * { cursor: crosshair !important; }
.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; }
.idz-mark-line { fill: none; stroke-width: 2.5; vector-effect: non-scaling-stroke; stroke-linejoin: round; stroke-linecap: round; }
.idz-mark-line.draft { stroke-dasharray: 6 5; }
.idz-mark-pt { position: absolute; width: 7px; height: 7px; border-radius: 50%; background: var(--c, #1f6f3a); border: 1.5px solid #fff; transform: translate(-50%, -50%) scale(var(--z, 1)); z-index: 6; pointer-events: none; box-shadow: 0 1px 3px rgba(0,0,0,.35); }
.idz-mark-len { position: absolute; font-size: 12.5px; font-weight: 800; white-space: nowrap; z-index: 7; pointer-events: none; font-family: 'JetBrains Mono', ui-monospace, monospace; background: rgba(255,255,255,.92); padding: 1px 6px; border-radius: 6px; box-shadow: 0 1px 4px rgba(0,0,0,.28); 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 */
.idz-deco { position: absolute; z-index: 6; pointer-events: none; transform-origin: center; }
.idz-deco.tick { width: 3px; height: 16px; background: var(--c); border-radius: 1px; }
.idz-deco.circle { width: 13px; height: 13px; border-radius: 50%; border: 3px solid var(--c); background: rgba(255,255,255,.65); box-sizing: border-box; }
.idz-deco.arrow { width: 0; height: 0; border-top: 7px solid transparent; border-bottom: 7px solid transparent; border-left: 12px solid var(--c); }

/* Edit handles: shown only when a markup is SELECTED, so they can be visible
   (a white dot ringed in the markup's colour) without hiding the clean view. */
.idz-mark-h { position: absolute; width: 13px; height: 13px; border-radius: 50%; background: var(--hc, #111); border: 2.5px solid #fff; transform: translate(-50%, -50%); z-index: 8; pointer-events: auto; cursor: grab; box-shadow: 0 1px 4px rgba(0,0,0,.4); }
.idz-mark-h:hover { transform: translate(-50%, -50%) scale(1.35); }
.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; }
.idz-mark-line.comp { stroke-width: 4; }
/* 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). */
.idz-mark-line.sel { stroke-width: 5; }
.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; }
.idz-note-num .idz-scale-grip { right: -7px; bottom: -7px; }
/* 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(var(--z, 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(var(--z, 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; }
/* Big, obvious affordances — dropped notes were too fiddly to drag/resize/delete. */
.idz-scale-grip {
  position: absolute; right: 0; bottom: 0; width: 22px; height: 22px;
  cursor: nwse-resize; z-index: 3;
  background:
    linear-gradient(135deg, transparent 46%, rgba(0,0,0,.35) 46%, rgba(0,0,0,.35) 54%, transparent 54%),
    linear-gradient(135deg, transparent 66%, rgba(0,0,0,.35) 66%, rgba(0,0,0,.35) 74%, transparent 74%);
}
.idz-scale-grip:hover { background-color: rgba(0,0,0,.08); border-top-left-radius: 6px; }
.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(var(--z, 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-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-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; }
.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(var(--z, 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(var(--z, 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: 24px; height: 24px; border-radius: 50%; border: 3px solid var(--c); background: #fff; color: var(--c); font-size: 9px; font-weight: 800; font-family: 'JetBrains Mono', ui-monospace, monospace; box-shadow: 0 1px 4px rgba(0,0,0,.3); }
.idz-sym.door.s { box-shadow: 0 0 0 3px #ffe14d, 0 1px 5px rgba(0,0,0,.4); }   /* 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. */
.idz-sym.engine  { width: 34px; height: 19px; filter: drop-shadow(0 1px 3px rgba(0,0,0,.4)); }
.idz-sym.hydrant { width: 20px; height: 20px; filter: drop-shadow(0 1px 3px rgba(0,0,0,.4)); }
.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: #d9d9d2; fill-opacity: .92; stroke: none; }
.idz-street-road.draft { fill-opacity: .5; }
.idz-street-road.sel { fill: #d3d8e4; }
.idz-street-kerb {
  fill: none; stroke: #7a7a72; stroke-width: calc(1.6px * var(--z, 1));
  vector-effect: non-scaling-stroke; stroke-linejoin: round;
}
.idz-street-centre {
  fill: none; stroke: #fff; stroke-width: calc(1.4px * var(--z, 1));
  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;
}
/* 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(var(--z, 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(var(--z, 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(2px * var(--z, 1)) dashed #e04a00; border-radius: 50%;
  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 — centre handle (above the advanced layer, like other symbols) */
.idz-hob-grip {
  position: absolute; width: 18px; height: 18px;
  transform: translate(-50%, -50%) scale(var(--z, 1));
  border-radius: 50%; background: #e04a00; border: 3px solid #fff;
  box-shadow: 0 0 0 1.5px #e04a00, 0 1px 5px rgba(0,0,0,.4);
  z-index: 7; pointer-events: auto; cursor: grab;
}
.idz-hob-grip::after {
  content: ''; position: absolute; inset: 3px; border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.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-scale-grip,
.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-line.comp { stroke-width: calc(4 * var(--z, 1)); }
.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(var(--z, 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) * 1.25)); }

/* Measurement number pulled out on a thin extension line */
.idz-mark-ext { fill: none; stroke-width: 1; stroke-dasharray: 3 2.5; vector-effect: non-scaling-stroke; opacity: .8; }

/* 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; }

/* ── Building review sidebar (chat-engine B1/B2 summary) ── */
.idz-rev-sec { background: #fff; border: 1px solid #e8e6e0; border-radius: 8px; padding: 10px 12px; margin-bottom: 8px; }
.idz-rev-h { font-size: 10px; text-transform: uppercase; letter-spacing: .1em; color: #2f9c58; font-weight: 600; margin-bottom: 5px; font-family: 'JetBrains Mono', ui-monospace, monospace; }
.idz-rev-p { font-size: 12px; line-height: 1.5; color: #3f3e3d; white-space: pre-wrap; }
.idz-rev-none { color: #a9a7a2; }
.idz-overlay.pdfmode .idz-rev-sec { border-color: #c4cad2; }
.idz-overlay.pdfmode .idz-rev-h { color: #1071bd; }

/* ── Always-on sidebar: collapsible section headers + review-run feedback ──
   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-lb-toggle { cursor: pointer; user-select: none; display: flex; align-items: center; gap: 6px; }
.idz-lb-toggle:hover { color: #2f9c58; }
.idz-lb-caret { font-size: 9px; flex: 0 0 10px; width: 10px; }
.idz-lb-empty { font-size: 11px; color: #8b8983; font-style: italic; margin: 0 0 12px; }
.idz-review-btn { display: inline-flex; align-items: center; gap: 7px; margin: 0 0 10px; }
.idz-review-btn.working, .idz-review-btn.working:disabled { opacity: 1; cursor: progress; }
.idz-btn-spin, .idz-lb-spin {
  width: 11px; height: 11px; border-radius: 50%; box-sizing: border-box;
  border: 1.5px solid currentColor; border-top-color: transparent;
  display: inline-block; flex: 0 0 11px;
  animation: idzSpin 700ms linear infinite;
}
.idz-lb-spin { margin-left: 7px; color: #2f9c58; }
@keyframes idzSpin { to { transform: rotate(360deg); } }
.idz-rev-wait { font-size: 11px; color: #7a7873; font-style: italic; margin: 0 0 10px; }
.idz-skel-bar {
  height: 9px; border-radius: 5px; margin: 6px 0 0;
  background: linear-gradient(90deg, #ece9e3 25%, #f8f6f2 45%, #ece9e3 65%);
  background-size: 200% 100%;
  animation: idzShimmer 1.3s ease-in-out infinite;
}
.idz-skel-bar.short { width: 62%; }
@keyframes idzShimmer { to { background-position: -200% 0; } }
.idz-overlay.pdfmode .idz-lb-toggle:hover { color: #1071bd; }
.idz-overlay.pdfmode .idz-lb-spin { color: #1071bd; }

/* ── Saved-notes sidebar (chat "Add to note" → drag onto plan) ── */
.idz-lb-head-gap { margin-top: 18px; }
.idz-note-hint { font-size: 10.5px; color: #7a7873; margin: 0 0 8px; font-style: italic; }
.idz-savenote {
  display: flex; align-items: flex-start; gap: 7px;
  background: #fff; border: 1px solid #e8e6e0; border-radius: 9px;
  padding: 8px 9px; margin-bottom: 7px; cursor: grab;
  transition: border-color .12s, box-shadow .12s;
}
.idz-savenote:hover { border-color: #2f9c58; box-shadow: 0 2px 8px -4px rgba(20,14,4,.18); }
.idz-savenote.dragging { opacity: .5; }
.idz-savenote-grip { color: #b8b5ad; font-size: 12px; line-height: 1.5; flex: none; }
/* The note's badge number on the plan, mirrored in the left Notes bar */
.idz-savenote-num { flex: none; display: inline-flex; align-items: center; justify-content: center;
  min-width: 18px; height: 18px; padding: 0 4px; border-radius: 999px; box-sizing: border-box; margin-top: 1px;
  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: 10.5px; }
.idz-savenote-text {
  flex: 1; min-width: 0; font-size: 12px; line-height: 1.45; color: #3f3e3d;
  display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;
}
.idz-savenote-del {
  flex: none; border: 0; background: transparent; color: #b8b5ad;
  font-size: 15px; line-height: 1; cursor: pointer; padding: 0 2px; border-radius: 4px;
}
.idz-savenote-del:hover { color: #d1341a; background: #f3ece9; }

/* (Placed chat-notes now render as numbered badges — .idz-note-num above.
   The dotted-box + free-resize styles that lived here are retired.) */

/* 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; }
.fl-key-sw.custom svg, .idz-key-sw.prev svg { width: 100%; height: 100%; display: block; }

/* Export pages: line strokes shrink with the plan (like the symbols via --z) */
.idz-export .idz-mark-line { stroke-width: calc(2.5 * var(--z, 1)); }
