:root {
    --bg:#fafbfc; --surface:#ffffff; --sidebar:#f2f4f3; --sidebar-soft:#e8ebe9;
    --hover:#edf0ee; --flame-soft:#dff2e1; --flame-tint:rgba(99,199,106,.09);
    --ink:#1a1d20; --ink-soft:#374151; --muted:#6b7280; --muted-2:#9ca3af;
    --border:#e5e7eb; --border-strong:#d1d5db;
    /* Brand accent went green 2026-07-31 ("approved green"). --flame keeps its
       name so every existing reference follows. No brand orange remains —
       the logo lockups went green with everything else (owner call, same day). */
    --flame:#63c76a; --flame-deep:#2f9c58;
    --green:#2f9c58; --green-deep:#257844; --green-soft:rgba(47,156,88,.12);
    --red:#d44d4d; --red-soft:rgba(212,77,77,.09);
    --paper:#f9fafb;
    --r-sm:6px; --r:8px; --r-lg:10px; --r-xl:14px; --r-pill:999px;
    --font-display:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
    --font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
    --font-mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,monospace;
    --shadow-soft:0 1px 2px rgba(40,30,14,.04),0 8px 24px rgba(40,30,14,.06);
    --shadow-lift:0 1px 2px rgba(40,30,14,.05),0 12px 32px rgba(40,30,14,.10);
    --ease:cubic-bezier(.2,.7,.2,1);
    --side-w:280px;
    --pdf-w:0px;
  }
  *{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden}
  html{overflow-x:hidden}
  body{font-family:var(--font);color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:14px;line-height:1.45;overflow:hidden}
  button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
  input,textarea{font:inherit;color:inherit}
  kbd{font:500 10px/1 var(--font-mono);letter-spacing:.04em}
  /* `hidden` always wins. With no global reset, any rule that gave an element
     a display value silently beat its `hidden` property — .cta-assess kept the
     Plans and Report top-bar buttons on screen after the code had hidden them.
     Guarded by backend/scripts/test-screen-visibility.js. */
  [hidden]{display:none!important}

  .app{display:grid;grid-template-columns:var(--side-w) 1fr var(--pdf-w);grid-template-rows:56px 1fr;height:100vh;min-height:720px;width:100vw;max-width:100vw;background:var(--bg);position:relative;overflow:hidden;transition:grid-template-columns 420ms var(--ease)}
  .app[data-pdf="open"]{--side-w:240px;--pdf-w:520px}
  /* On viewports shorter than the app's 720px min-height, allow the page to
     scroll so the bottom of the app (chat composer + send button) is reachable
     instead of being clipped off-screen by the body{overflow:hidden} above. */
  @media (max-height: 719px) { html, body { overflow-y: auto; } }

  .sidebar{grid-row:1/3;background:var(--sidebar);border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;min-width:0}
  /* ── Guidex lockup — "Full lockup · primary" from the 2026-07 brand sheet,
     with one owner deviation (2026-07-31): the >_ symbol uses the app's
     terminal mark recipe (JetBrains Mono 600, like the chat .gx-mark) instead
     of the sheet's Be Vietnam Pro — the owner preferred the chat mark's look.
     Wordmark stays Rethink Sans 500, everything one brand green. Scale via
     font-size on .gx-lockup; used in the sidebar brand-rect and the
     landing/billing headers. (Replaced the two-tone Fraunces wordmark.) */
  .gx-lockup{display:inline-flex;align-items:baseline;gap:.06em;color:var(--flame);font-family:'Rethink Sans','Helvetica Neue',Helvetica,sans-serif;font-weight:500;letter-spacing:-.03em;line-height:1}
  .gx-lockup-sym{display:inline-flex;align-items:baseline;gap:.02em;font-family:var(--font-mono);font-weight:600;font-size:.62em;letter-spacing:-.03em}
  .gx-lockup-gt,.gx-lockup-us{display:inline-block}
  /* Both nudges are measured from glyph ink (canvas TextMetrics), not
     eyeballed. > is lifted so its ink centre sits exactly on the centre of
     the wordmark's G (G centre = 35.16% of the parent em above the baseline,
     > centre = 32.81% of its own em). _ is lifted so its ink bottom lands
     exactly on the wordmark's bottom edge (JetBrains Mono's _ sits 14.063%
     of its em below the baseline, the wordmark's ink bottom 1.563% of the
     parent em). Owner-tuned, 2026-07-31. */
  .gx-lockup-gt{transform:translateY(-.2389em)}
  .gx-lockup-us{transform:translateY(-.1154em)}
  .brand-rect .gx-lockup{font-size:26px}
  .gf-pl-brand .gx-lockup{font-size:30px}

  /* Sidebar brand-rect — static logo container. NOT tied to the current project. */
  .brand-rect{margin:12px 14px 8px;display:flex;align-items:center;gap:6px;padding:4px 12px;background:transparent;border:0;border-radius:var(--r)}

  .nav{flex:1;overflow-y:auto;overflow-x:hidden;padding:4px 12px 12px}
  .nav::-webkit-scrollbar{width:6px}.nav::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:999px}

  .section-head{display:flex;align-items:center;justify-content:space-between;padding:14px 8px 8px;font-size:11px;letter-spacing:.12em;font-weight:600;color:var(--muted);text-transform:uppercase}
  .section-head .count{font-family:var(--font-mono);font-size:11px;color:var(--muted-2);letter-spacing:0;font-weight:500;transition:color 240ms var(--ease)}
  .section-head .count.bumped{color:var(--flame)}

  /* Flat, non-interactive demo label — sits beside the 2D Layout heading */
  .demo-tag{display:inline-flex;align-items:center;gap:4px;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--muted);background:transparent;border:1px solid var(--border-strong);padding:2px 6px;border-radius:3px;line-height:1}
  .demo-tag::before{content:"";width:5px;height:5px;border-radius:999px;background:var(--muted-2);flex:none}

  .src-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--r);cursor:pointer;transition:background 180ms var(--ease);position:relative}
  .src-item:hover{background:var(--hover)}
  .src-item.muted{opacity:.55}
  .src-item.muted .name,.src-item.muted .label{color:var(--muted)}

  .tick{width:16px;height:16px;border-radius:4px;border:1.5px solid var(--border-strong);background:var(--surface);flex:none;display:grid;place-items:center;transition:background 160ms var(--ease),border-color 160ms var(--ease),transform 160ms var(--ease)}
  .tick svg{width:10px;height:10px;color:#fff;opacity:0;transform:scale(.5);transition:opacity 160ms var(--ease),transform 200ms var(--ease)}
  .src-item.on .tick{background:var(--ink);border-color:var(--ink)}
  .src-item.on .tick svg{opacity:1;transform:scale(1)}
  .src-item:active .tick{transform:scale(.92)}

  .src-item .label,.src-item .name{flex:1;font-size:13px;font-weight:500;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.005em}
  .ribbon{font-family:var(--font-mono);font-size:10px;letter-spacing:.04em;padding:2px 6px;border-radius:4px;color:var(--muted);background:transparent;transition:color 200ms var(--ease),background 200ms var(--ease)}
  /* Calculator launcher next to BS 9999 — only flame-active when BS 9999 is selected */
  .calc-launch{width:22px;height:22px;border-radius:5px;display:grid;place-items:center;flex:none;border:1px solid transparent;background:transparent;color:var(--muted-2);cursor:pointer;transition:color 180ms var(--ease),background 180ms var(--ease),border-color 180ms var(--ease),transform 180ms var(--ease);position:relative}
  .calc-launch svg{width:13px;height:13px}
  .calc-launch.idle{opacity:.62;cursor:pointer;color:var(--muted)}
  .calc-launch.idle:hover{opacity:1;color:var(--ink);background:var(--hover);border-color:var(--border)}
  .calc-launch.live{color:var(--flame);background:var(--flame-soft);border-color:var(--flame-soft);opacity:1}
  .calc-launch.live::after{content:"";position:absolute;top:2px;right:2px;width:5px;height:5px;border-radius:999px;background:var(--flame);box-shadow:0 0 0 2px var(--surface)}
  .calc-launch.live:hover{background:var(--flame-soft);color:var(--flame);border-color:var(--flame-soft)}
  .calc-launch.live:hover::after{background:var(--flame);box-shadow:0 0 0 2px var(--surface)}
  .calc-launch.live:active{transform:translateY(0) scale(.96)}
  .ribbon.resi{color:var(--flame);background:var(--flame-soft)}
  .ribbon.comm{color:var(--flame);background:var(--flame-soft)}
  .src-item.muted .ribbon.resi,
  .src-item.muted .ribbon.comm{color:var(--muted-2);background:rgba(122,111,94,.06)}

  .file-icon{width:22px;height:22px;display:grid;place-items:center;color:var(--muted);flex:none}
  .file-icon svg{width:14px;height:14px}
  .src-item.on .file-icon{color:var(--ink-soft)}
  .src-item .size{font-family:var(--font-mono);font-size:10.5px;color:var(--muted-2);letter-spacing:.02em;flex:none}

  .assessed{display:inline-flex;align-items:center;gap:0;height:18px;padding:0;background:var(--green);color:#fff;border-radius:999px;flex:none;overflow:hidden;width:18px;transition:width 320ms var(--ease),box-shadow 320ms var(--ease);cursor:pointer}
  .assessed .check{width:18px;height:18px;display:grid;place-items:center;flex:none}
  .assessed .check svg{width:10px;height:10px}
  .assessed .word{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;line-height:1;white-space:nowrap;opacity:0;transform:translateX(-4px);transition:opacity 240ms var(--ease) 80ms,transform 240ms var(--ease) 80ms;padding-right:8px}
  .assessed:hover{width:84px;box-shadow:0 1px 2px rgba(20,14,4,.08)}
  .assessed:hover .word{opacity:1;transform:translateX(0)}

  .del{width:18px;height:18px;border-radius:5px;display:grid;place-items:center;color:var(--muted-2);background:transparent;flex:none;opacity:0;transform:scale(.85);transition:opacity 160ms var(--ease),transform 160ms var(--ease),background 160ms var(--ease),color 160ms var(--ease)}
  .src-item:hover .del{opacity:1;transform:scale(1)}
  .del:hover{background:var(--red-soft);color:var(--red)}
  .del svg{width:10px;height:10px}
  /* Pen / edit affordance — same shape as .del, flame on hover, only on layout items with markup */
  .edit-pen{width:18px;height:18px;border-radius:5px;display:grid;place-items:center;color:var(--muted-2);background:transparent;flex:none;opacity:0;transform:scale(.85);transition:opacity 160ms var(--ease),transform 160ms var(--ease),background 160ms var(--ease),color 160ms var(--ease)}
  .src-item:hover .edit-pen{opacity:1;transform:scale(1)}
  .edit-pen:hover{background:var(--hover);color:var(--ink)}
  .edit-pen svg{width:11px;height:11px}

  .upload-tile{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--r-lg);border:1px dashed var(--border-strong);background:var(--surface);margin:4px 0;cursor:pointer;transition:border-color 180ms var(--ease),background 180ms var(--ease),transform 120ms var(--ease);width:100%;text-align:left;position:relative}
  .upload-tile:hover{border-color:var(--ink-soft);background:var(--hover)}
  .upload-tile:active{transform:scale(.99)}
  .upload-tile .icon{width:28px;height:28px;border-radius:var(--r);background:var(--bg);border:1px solid var(--border);display:grid;place-items:center;color:var(--ink-soft);flex:none}
  .upload-tile .icon svg{width:14px;height:14px}
  .upload-tile .meta{display:flex;flex-direction:column;min-width:0;flex:1}
  .upload-tile .meta .t{font-size:12.5px;font-weight:600;color:var(--ink)}
  .upload-tile .meta .s{font-size:11px;color:var(--muted);margin-top:1px;font-family:var(--font-mono);letter-spacing:.02em}

  /* Solid variant — used for the Project Context tile so it reads as an action, not a drop target */
  .upload-tile.solid{border-style:solid;border-color:var(--border)}
  .upload-tile.solid:hover{border-color:var(--ink-soft);background:var(--hover)}
  /* Completed state — neutral surface with a small green tick instead of a green wash. */
  .upload-tile.solid.complete{border-color:var(--border);background:var(--surface)}
  .upload-tile.solid.complete:hover{background:var(--hover);border-color:var(--border-strong)}
  .upload-tile.solid.complete .icon{background:transparent;border-color:var(--border);color:var(--ink-soft)}
  /* Tiny tick badge sits in the corner — quiet acknowledgement, not a loud chip. */
  .upload-tile .complete-tick{display:none !important}
  .upload-tile .complete-tick span{display:none}
  .upload-tile.solid.complete .complete-tick{display:none !important}
  .upload-tile.solid.complete .meta .s{color:var(--muted)}
  .upload-tile .complete-tick svg{width:8px;height:8px;color:#fff}

  .empty{padding:8px 10px;font-size:11.5px;color:var(--muted-2);font-style:italic}

  .profile{border-top:1px solid var(--border);padding:12px 14px;display:flex;align-items:center;gap:10px;cursor:pointer;transition:background 180ms var(--ease)}
  .profile:hover{background:var(--sidebar-soft)}
  .profile .avatar{width:32px;height:32px;border-radius:999px;background:var(--ink);color:var(--bg);display:grid;place-items:center;font-family:var(--font-display);font-weight:500;font-size:12px;letter-spacing:.5px;flex:none}
  .profile .info{flex:1;min-width:0}
  .profile .pname{font-size:13px;font-weight:600;color:var(--ink)}
  .profile .plan{font-size:11px;color:var(--muted);margin-top:1px}
  .profile .chevron{color:var(--muted-2)}.profile .chevron svg{width:14px;height:14px}

  .topbar{grid-column:2;grid-row:1;border-bottom:1px solid var(--border);background:var(--bg);display:flex;align-items:center;padding:0 24px;gap:12px;min-width:0}
  .back-btn{width:30px;height:30px;border-radius:var(--r);border:1px solid var(--border);background:var(--surface);color:var(--ink-soft);display:grid;place-items:center;transition:background 180ms var(--ease),border-color 180ms var(--ease),color 180ms var(--ease),transform 200ms var(--ease);flex:none}
  .back-btn:hover{background:var(--hover);border-color:var(--border-strong);color:var(--ink)}
  .back-btn:active{transform:translateX(-2px)}
  .back-btn svg{width:13px;height:13px}
  .project-title{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:var(--r);color:var(--ink);font-size:13.5px;font-weight:600;letter-spacing:-.005em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
  .topbar-status{display:inline-flex;align-items:center;gap:10px;padding:0 4px;min-width:0}
  .topbar-status .pill{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:500;color:var(--muted)}
  .topbar-status .pill .dot{width:6px;height:6px;border-radius:999px;background:var(--flame);box-shadow:0 0 0 3px rgba(99,199,106,.16)}
  .topbar-status .pill .num{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
  .topbar-status .pill .modeword{color:var(--ink);font-weight:600}
  .topbar-status .sep{width:3px;height:3px;border-radius:999px;background:var(--border-strong)}
  .topbar .spacer{flex:1}
  .icon-btn{width:32px;height:32px;border-radius:var(--r);border:1px solid var(--border);background:var(--surface);color:var(--ink-soft);display:grid;place-items:center;transition:background 180ms var(--ease),border-color 180ms var(--ease),color 180ms var(--ease);flex:none}
  .icon-btn:hover{background:var(--hover);border-color:var(--border-strong);color:var(--ink)}
  .icon-btn svg{width:14px;height:14px}

  .cta-assess{position:relative;display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:var(--r);background:var(--ink);color:var(--bg);font-size:13px;font-weight:600;letter-spacing:-.005em;transition:background 280ms var(--ease),box-shadow 280ms var(--ease),transform 120ms var(--ease),opacity 220ms var(--ease);flex:none;white-space:nowrap}
  .cta-assess:hover{background:var(--green);box-shadow:0 1px 2px rgba(20,14,4,.08)}
  .cta-assess:active{transform:translateY(1px)}
  .cta-assess svg{width:14px;height:14px}
  .cta-assess[data-locked="true"]{cursor:not-allowed;background:rgba(31,26,20,.45);box-shadow:none}
  .cta-assess[data-locked="true"]:hover{background:rgba(31,26,20,.45);box-shadow:none}
  .cta-assess[data-locked="true"] .lock{display:inline-flex;width:13px;height:13px;align-items:center;justify-content:center;color:rgba(253,250,243,.78);margin-left:2px}
  .cta-assess[data-locked="true"] .lock svg{width:11px;height:11px}
  .cta-assess .lock{display:none}

  .main{grid-column:2;grid-row:2;display:flex;flex-direction:column;position:relative;background:var(--bg);min-width:0;overflow:hidden}
  .main-scroll{flex:1;overflow-y:auto;overflow-x:hidden;position:relative;padding:0 32px 32px 28px}
  .main-scroll::-webkit-scrollbar{width:6px}.main-scroll::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:999px}
  .main-inner{width:100%;max-width:100%;margin:0;padding-top:0}
  .app[data-pdf="open"] .main-scroll{padding:0 40px 32px}
  .app[data-pdf="open"] .main-inner{max-width:none}

  .status-row{position:sticky;top:0;z-index:6;display:flex;align-items:center;gap:18px;padding:28px 0 14px;margin:0 0 12px;color:var(--muted);background:linear-gradient(to bottom,var(--bg) 0%,var(--bg) 60%,rgba(253,250,243,.88) 100%);backdrop-filter:saturate(140%) blur(8px);-webkit-backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid transparent;transition:border-color 240ms var(--ease)}
  .main-scroll.scrolled .status-row{border-bottom-color:var(--border)}
  .status-row .pill{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:500;transition:color 240ms var(--ease)}
  .status-row .pill .dot{width:6px;height:6px;border-radius:999px;background:var(--flame);box-shadow:0 0 0 3px rgba(99,199,106,.16);transition:transform 220ms var(--ease)}
  .status-row .pill.bump .dot{animation:dotPulse 480ms var(--ease)}
  @keyframes dotPulse{0%{transform:scale(1)}40%{transform:scale(1.6)}100%{transform:scale(1)}}
  .status-row .sep{width:3px;height:3px;border-radius:999px;background:var(--border-strong)}
  .status-row .pill .num{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
  .status-row .pill .modeword{color:var(--ink);font-weight:600;transition:opacity 240ms var(--ease)}

  .greeting{font-family:var(--font-display);font-weight:500;font-size:clamp(36px,4.4vw,56px);line-height:1.06;letter-spacing:-1.5px;color:var(--ink);margin:0 0 18px;text-wrap:balance}
  .greeting .soft{color:var(--muted-2);font-weight:400}
  .deck{font-size:15.5px;line-height:1.55;color:var(--ink-soft);max-width:640px;margin:0 0 36px}
  .deck .accent{color:var(--flame);font-weight:500}

  .suggestions{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:4px}
  .suggestions.hidden{display:none}
  .sg-card{display:flex;align-items:center;justify-content:flex-start;padding:11px 14px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);cursor:pointer;text-align:left;transition:border-color 180ms var(--ease),background 180ms var(--ease);min-width:0}
  .sg-card:hover{background:var(--hover);border-color:var(--border-strong)}
  .sg-card .ico{display:none}
  .sg-card .body{flex:1;min-width:0;display:flex;align-items:center}
  .sg-card .ttl{font-size:12.5px;font-weight:500;color:var(--ink);letter-spacing:-.005em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .sg-card .sub{display:none}

  .start-block{padding-top:32px;transition:opacity 320ms var(--ease),transform 320ms var(--ease);transform-origin:top}
  .start-block.hidden{opacity:0;transform:translateY(-12px);pointer-events:none;height:0;margin:0;overflow:hidden;transition:opacity 240ms var(--ease),transform 240ms var(--ease),height 320ms var(--ease) 80ms,margin 320ms var(--ease) 80ms}

  /* Thread + messages — user is now LEFT-ALIGNED, same side as AI */
  .thread{display:none;flex-direction:column;gap:24px;padding-top:8px;width:100%;min-width:0}
  .thread.active{display:flex}
  .msg{display:flex;gap:14px;width:100%;max-width:none;min-width:0;animation:msgIn 360ms var(--ease) both;align-self:flex-start}
  @keyframes msgIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
  .msg .avatar{width:32px;height:32px;flex:none;display:flex;align-items:center;justify-content:center}
  .msg.user{align-items:flex-start}
  .msg.user .avatar{display:none}
  .msg.user .bubble{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);padding:9px 14px;font-size:14px;line-height:1.55;color:var(--ink);flex:0 0 auto;max-width:80%;min-width:0;overflow-wrap:anywhere;word-break:break-word;white-space:pre-wrap;box-shadow:none}
  .msg.ai .bubble{background:transparent;padding:6px 0 0;border-radius:0;font-size:14.5px;line-height:1.65;color:var(--ink-soft);flex:1;min-width:0;overflow-wrap:anywhere;word-break:break-word}
  .msg.ai .bubble pre,.msg.ai .bubble code{white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere}
  /* Optimistic typing reveal — each block fades + slides up in sequence,
     with a brief flame caret trailing the newest block. */
  .msg.ai .bubble > *{position:relative;animation:aiType 520ms var(--ease) both;animation-delay:calc(var(--i,0) * 220ms)}
  .msg.ai .bubble > *::after{
    content:'';position:absolute;right:-10px;bottom:6px;width:6px;height:14px;background:var(--flame);
    opacity:0;animation:aiCaret 520ms var(--ease) both;animation-delay:calc(var(--i,0) * 220ms);pointer-events:none
  }
  .msg.ai .bubble > *:last-child::after{display:none}
  @keyframes aiType{
    0%{opacity:0;transform:translateY(10px);filter:blur(2px)}
    60%{opacity:.92;transform:translateY(0);filter:blur(0)}
    100%{opacity:1;transform:none;filter:blur(0)}
  }
  @keyframes aiCaret{
    0%,40%{opacity:0}
    50%,80%{opacity:1}
    100%{opacity:0}
  }
  .msg.ai .bubble strong{color:var(--ink);font-weight:600}
  .msg.ai .bubble h3{font-family:var(--font-display);font-weight:500;font-size:18px;letter-spacing:-.01em;color:var(--ink);margin:0 0 12px}
  .msg.ai .bubble p{margin:0 0 12px}
  .msg.ai .bubble ul{margin:0 0 12px;padding-left:18px}
  .msg.ai .bubble ul li{margin-bottom:5px}
  .msg.ai .bubble .citations{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}
  .msg.ai .bubble .citations .label{font-family:var(--font-mono);font-size:10px;color:var(--muted);letter-spacing:.1em;text-transform:uppercase;width:100%;margin-bottom:2px;font-weight:500}
  .msg.ai .bubble .citations .chip{display:inline-flex;align-items:center;gap:5px;padding:3px 8px;border-radius:999px;background:var(--surface);border:1px solid var(--border);font-size:11px;font-weight:500;color:var(--ink-soft);transition:background 180ms var(--ease),border-color 180ms var(--ease);cursor:pointer}
  .msg.ai .bubble .citations .chip:hover{background:var(--hover);border-color:var(--ink-soft)}
  .msg.ai .bubble .citations .chip .dot{width:6px;height:6px;border-radius:999px;background:var(--flame)}

  /* Inline citations */
  .cite{color:var(--ink);font-weight:500;text-decoration:none;border-bottom:1px dashed var(--ink-soft);cursor:pointer;padding-bottom:1px;transition:color 180ms var(--ease),background 180ms var(--ease),border-color 180ms var(--ease);white-space:nowrap}
  .cite::after{content:'↗';display:inline-block;margin-left:2px;font-size:.82em;opacity:.6;transition:transform 180ms var(--ease)}
  .cite:hover{color:var(--ink);background:var(--hover);border-bottom-color:var(--ink);border-radius:3px;padding:0 4px 1px;margin:0 -2px}
  .cite:hover::after{transform:translate(1px,-1px);opacity:.9}
  .cite.active{background:var(--hover);color:var(--ink);border-bottom-color:var(--ink);border-radius:3px;padding:0 4px 1px;margin:0 -2px}

  /* gx-mark — Guidex terminal-style >_ prompt */
  .gx-mark{width:32px;height:32px;border-radius:0;background:transparent;border:0;color:var(--flame);display:inline-flex;align-items:center;justify-content:center;gap:0;flex:none;user-select:none;font-family:var(--font-mono);font-size:15px;font-weight:600;line-height:1;letter-spacing:-.5px}
  .gx-mark__prompt{display:inline-block;line-height:1}
  .gx-mark__cursor{display:inline-block;line-height:1;width:7px;text-align:left;color:var(--flame)}
  .gx-mark.loading{border-color:transparent}
  .gx-mark.loading .gx-mark__cursor{animation:gxBlink .58s step-end infinite}
  @keyframes gxBlink{0%,50%{opacity:1}50.01%,100%{opacity:0}}
  @keyframes gxHalo{0%,100%{box-shadow:0 0 0 0 rgba(99,199,106,.28)}50%{box-shadow:0 0 0 6px rgba(99,199,106,0)}}

  /* Loader bubble — clean, no warm tint while pending */
  .msg.ai[data-loader] .bubble{background:transparent;animation:none;padding:6px 0 0}

  /* Loader text effect — typewriter types each message, then deletes, then types the next. Cursor sits flush at end. */
  .gx-loader{display:flex;align-items:center;color:var(--muted);font-family:var(--font-mono);font-size:12.5px;line-height:1.4;min-height:32px;min-width:0}
  .gx-loader__line{display:inline-flex;align-items:baseline;white-space:nowrap;min-height:18px;max-width:100%;overflow:hidden}
  .gx-loader__text{display:inline-block;white-space:nowrap}
  .gx-loader__caret{display:inline-block;width:7px;height:13px;margin-left:3px;background:var(--flame);animation:gxBlink 1.05s step-end infinite;flex-shrink:0;transform:translateY(2px)}
  .gx-loader[data-busy="1"] .gx-loader__caret{animation:none;opacity:1}

  /* Composer — mode pill on RIGHT, smaller, before send arrow. Flex child of .main so it always stays at bottom. */
  .composer-wrap{flex:none;position:relative;padding:14px 32px 18px 28px;background:var(--bg);z-index:5}
  .composer-wrap::before{content:"";position:absolute;left:0;right:0;top:-24px;height:24px;background:linear-gradient(to top,var(--bg),rgba(250,251,252,0));pointer-events:none}
  .app[data-pdf="open"] .composer-wrap{padding:14px 40px 18px}
  .composer{width:100%;max-width:100%;margin:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);padding:14px 16px 10px;box-shadow:var(--shadow-soft);transition:border-color 180ms var(--ease),box-shadow 180ms var(--ease)}
  .app[data-pdf="open"] .composer{max-width:100%}
  .composer:focus-within{border-color:var(--border-strong);box-shadow:var(--shadow-lift)}
  .composer textarea{width:100%;border:0;outline:0;resize:none;background:transparent;color:var(--ink);font-size:14px;line-height:1.5;min-height:22px;padding:4px 2px 8px;font-family:inherit}
  .composer textarea::placeholder{color:var(--muted-2)}
  .composer-footer{display:flex;align-items:center;justify-content:flex-end;margin-top:4px;gap:8px}

  .mode-seg{position:relative;display:inline-flex;align-items:center;background:var(--bg);border:1px solid var(--border);border-radius:var(--r-pill);padding:2px;cursor:pointer;user-select:none;transition:border-color 200ms var(--ease)}
  .mode-seg:hover{border-color:var(--border-strong)}
  .mode-seg .indicator{position:absolute;top:2px;bottom:2px;left:2px;width:calc(50% - 2px);background:var(--ink);border-radius:999px;transition:transform 360ms var(--ease),background 280ms var(--ease);box-shadow:0 1px 3px rgba(40,30,14,.18)}
  .mode-seg[data-mode="concise"] .indicator{transform:translateX(100%);background:var(--green)}
  .mode-seg .opt{position:relative;z-index:1;display:inline-flex;align-items:center;gap:4px;padding:3px 10px 3px 8px;font-size:10.5px;font-weight:500;color:var(--muted);transition:color 280ms var(--ease);letter-spacing:-.005em}
  .mode-seg[data-mode="default"] .opt[data-opt="default"]{color:#fff}
  .mode-seg[data-mode="concise"] .opt[data-opt="concise"]{color:#fff}
  .mode-seg .opt svg{width:9px;height:9px;transition:transform 360ms var(--ease)}

  .send-btn{width:30px;height:30px;border-radius:var(--r);background:var(--bg);border:1px solid var(--border);color:var(--muted);display:grid;place-items:center;transition:background 180ms var(--ease),color 180ms var(--ease),border-color 180ms var(--ease),transform 120ms var(--ease)}
  .send-btn:hover{background:var(--ink);color:var(--bg);border-color:var(--ink)}
  .send-btn:active{transform:scale(.94)}
  .send-btn.armed{background:var(--ink);color:var(--bg);border-color:var(--ink)}
  .send-btn svg{width:13px;height:13px}

  @keyframes fadeUp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
  .greeting,.deck,.suggestions,.status-row{animation:fadeUp 600ms var(--ease) both}
  .status-row{animation-delay:40ms}.greeting{animation-delay:90ms}.deck{animation-delay:180ms}.suggestions{animation-delay:260ms}

  /* PDF panel */
  .pdf-panel{grid-column:3;grid-row:1/3;background:var(--paper);border-left:1px solid var(--border);display:flex;flex-direction:column;min-width:0;overflow:hidden;opacity:0;pointer-events:none;transform:translateX(40px);transition:opacity 320ms var(--ease) 80ms,transform 360ms var(--ease) 80ms}
  .app[data-pdf="open"] .pdf-panel{opacity:1;pointer-events:auto;transform:none}

  /* Spatial split — sidebar collapses, floor plan slides in from right and zooms on a room. */
  .app[data-spatial="open"]{--side-w:0px;--pdf-w:560px}
  .app[data-spatial="open"][data-pdf="open"]{--side-w:0px;--pdf-w:560px}
  .app[data-spatial="open"] .sidebar{opacity:0;pointer-events:none;border-right:0;overflow:hidden}
  .app[data-spatial="open"] .pdf-panel{display:none}
  .app[data-spatial="open"] .main-scroll{padding:0 32px 32px}
  .app[data-spatial="open"] .composer-wrap{padding:14px 32px 18px}
  .app[data-spatial="open"] .main-inner{max-width:none}

  .spatial-panel{grid-column:3;grid-row:1/3;background:var(--paper);border-left:1px solid var(--border);display:flex;flex-direction:column;min-width:0;overflow:hidden;opacity:0;pointer-events:none;transform:translateX(40px);transition:opacity 320ms var(--ease) 80ms,transform 360ms var(--ease) 80ms}
  .app[data-spatial="open"] .spatial-panel{opacity:1;pointer-events:auto;transform:none}
  .spatial-head{padding:14px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:12px;background:var(--surface)}
  .spatial-head .spatial-icon{width:30px;height:30px;border-radius:7px;background:var(--ink);color:#fff;display:grid;place-items:center;flex:none}
  .spatial-head .spatial-icon svg{width:14px;height:14px}
  .spatial-meta{flex:1;min-width:0}
  .spatial-title{font-size:13.5px;font-weight:600;color:var(--ink);letter-spacing:-.005em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:var(--font-display)}
  .spatial-sub{font-size:11px;color:var(--muted);font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;margin-top:2px;font-weight:600}
  .spatial-body{flex:1;background:var(--paper);position:relative;overflow:hidden}
  .spatial-frame{position:absolute;inset:0;overflow:hidden;background:var(--paper)}
  .spatial-svg-wrap{position:absolute;left:0;top:0;width:880px;height:580px;transform-origin:0 0;transition:transform 760ms cubic-bezier(.22,.61,.36,1)}
  .spatial-svg-wrap svg{width:880px;height:580px;display:block}
  /* Soft spotlight that dims everything outside the focused room */
  .spatial-spotlight{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle var(--sp-r,140px) at var(--sp-x,50%) var(--sp-y,50%),transparent 0%,transparent 78%,rgba(20,14,4,.30) 100%);transition:background 720ms var(--ease)}
  /* Saved-markup pins inside spatial SVG */
  .spatial-pin-dot{transition:opacity 420ms var(--ease),transform 320ms var(--ease)}
  .spatial-pin-dot circle{stroke:#fff;stroke-width:2}
  .spatial-pin-dot text{fill:#fff;font-family:var(--font-mono);font-weight:700;font-size:10px;text-anchor:middle;dominant-baseline:central;pointer-events:none}
  .spatial-pin-dot.dim{opacity:.32}
  .spatial-pin-dot.match{opacity:1;animation:spatialPinPop 540ms var(--ease) both}
  .spatial-pin-dot.match circle{stroke:var(--flame);stroke-width:2.5}
  .spatial-pin-halo{fill:none;stroke:var(--flame);stroke-width:2;opacity:0;transform-origin:var(--hx,0px) var(--hy,0px);transform-box:fill-box}
  .spatial-pin-halo.on{opacity:1;animation:spatialHalo 2.4s var(--ease) infinite}
  @keyframes spatialPinPop{0%{transform:scale(.4);opacity:0}60%{;opacity:1}100%{transform:scale(1);opacity:1}}
  @keyframes spatialHalo{0%,100%{r:18;opacity:.85}50%{r:34;opacity:0}}
  .spatial-pin-name{position:absolute;transform:translate(-50%,-100%);pointer-events:none;background:var(--ink);color:#fff;padding:4px 8px;border-radius:6px;font-size:11px;font-family:var(--font-mono);font-weight:600;letter-spacing:.02em;white-space:nowrap;box-shadow:0 4px 12px rgba(20,14,4,.25);opacity:0;transition:opacity 320ms var(--ease) 480ms}
  .spatial-pin-name.on{opacity:1}
  .spatial-pin-name::after{content:"";position:absolute;left:50%;bottom:-4px;width:8px;height:8px;background:var(--ink);transform:translateX(-50%) rotate(45deg)}
  .spatial-ring{position:absolute;width:0;height:0;border-radius:50%;border:1.5px solid var(--flame);left:var(--sp-x,50%);top:var(--sp-y,50%);transform:translate(-50%,-50%);pointer-events:none;opacity:0;transition:opacity 320ms var(--ease) 480ms,width 720ms cubic-bezier(.22,.61,.36,1) 200ms,height 720ms cubic-bezier(.22,.61,.36,1) 200ms;box-shadow:0 0 0 0 rgba(99,199,106,.35)}
  .spatial-ring.on{opacity:1;animation:spatialPulse 2.4s var(--ease) 800ms infinite}
  @keyframes spatialPulse{0%,100%{box-shadow:0 0 0 0 rgba(99,199,106,.32)}50%{box-shadow:0 0 0 14px rgba(99,199,106,0)}}
  .spatial-foot{padding:10px 18px;border-top:1px solid var(--border);background:var(--surface);display:flex;align-items:center;justify-content:space-between;gap:12px}
  .spatial-room-tag{font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--flame);font-weight:600;display:inline-flex;align-items:center;gap:6px}
  .spatial-room-tag::before{content:"";width:6px;height:6px;border-radius:999px;background:var(--flame);box-shadow:0 0 0 3px rgba(99,199,106,.16)}
  .spatial-hint{font-size:11px;color:var(--muted);font-family:var(--font-mono);letter-spacing:.04em}

  /* Inline spatial hyperlink — visually distinct from .cite (sources). */
  .room-link{display:inline-flex;align-items:center;gap:4px;color:var(--ink);font-weight:600;text-decoration:none;border-bottom:1px solid var(--ink);cursor:pointer;padding:0 1px 1px;transition:color 180ms var(--ease),background 180ms var(--ease),border-color 180ms var(--ease)}
  .room-link::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ink);box-shadow:0 0 0 2px rgba(31,26,20,.08);flex:none;transition:background 180ms var(--ease),box-shadow 180ms var(--ease)}
  .room-link:hover{color:var(--ink);border-color:var(--ink-soft);background:var(--hover);border-radius:3px;padding:0 4px 1px;margin:0 -2px}
  .room-link:hover::before{background:var(--ink);box-shadow:0 0 0 3px rgba(31,29,32,.12)}
  .room-link.active{color:var(--flame);border-color:var(--flame);background:rgba(99,199,106,.06);border-radius:3px;padding:0 4px 1px;margin:0 -2px}
  .pdf-head{padding:14px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:12px;background:var(--surface)}
  .pdf-doc-info{display:flex;align-items:center;gap:10px;flex:1;min-width:0}
  .pdf-icon{width:30px;height:36px;border-radius:3px;background:var(--ink);color:#fff;display:grid;place-items:center;flex:none;font-family:var(--font-display);font-weight:500;font-size:11px;letter-spacing:.5px;position:relative;box-shadow:1px 1px 0 rgba(20,10,0,.08)}
  .pdf-icon::before{content:"";position:absolute;top:0;right:0;width:7px;height:7px;background:linear-gradient(225deg,var(--bg) 50%,transparent 50%)}
  .pdf-doc-info .doc-meta{flex:1;min-width:0}
  .pdf-doc-info .doc-title{font-size:13.5px;font-weight:600;color:var(--ink);letter-spacing:-.005em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .pdf-doc-info .doc-sub{font-size:11px;color:var(--muted);font-family:var(--font-mono);letter-spacing:.02em;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .pdf-tools{display:flex;align-items:center;gap:6px;flex:none}
  .pdf-page-num{font-family:var(--font-mono);font-size:11px;color:var(--muted);letter-spacing:.02em;padding:0 6px;white-space:nowrap}
  .pdf-page-num b{color:var(--ink);font-weight:600}
  .pdf-icon-btn{width:28px;height:28px;border-radius:6px;background:var(--bg);border:1px solid var(--border);color:var(--ink-soft);display:grid;place-items:center;transition:background 180ms var(--ease),border-color 180ms var(--ease),color 180ms var(--ease)}
  .pdf-icon-btn:hover{background:var(--hover);border-color:var(--border-strong);color:var(--ink)}
  .pdf-icon-btn svg{width:11px;height:11px}
  .pdf-close{width:32px;height:32px;border-radius:7px;background:var(--bg);border:1px solid var(--border);color:var(--ink-soft);display:grid;place-items:center;transition:background 180ms var(--ease),color 180ms var(--ease),border-color 180ms var(--ease),transform 280ms var(--ease)}
  .pdf-close:hover{background:var(--red-soft);color:var(--red);border-color:var(--red)}
  .pdf-close svg{width:12px;height:12px}

  .pdf-body{flex:1;overflow-y:auto;padding:24px 24px 80px;background:var(--paper);scroll-behavior:smooth}
  .pdf-body::-webkit-scrollbar{width:8px}
  .pdf-body::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:999px}
  .pdf-page-doc{background:#fff;border:1px solid var(--border);border-radius:4px;padding:48px 40px;margin-bottom:18px;box-shadow:0 1px 0 rgba(40,30,14,.04),0 8px 24px rgba(40,30,14,.05);font-family:var(--font-display);color:var(--ink);font-size:14px;line-height:1.65;position:relative}
  .pdf-page-doc::before{content:attr(data-pageno);position:absolute;top:18px;right:24px;font-family:var(--font-mono);font-size:10px;color:var(--muted-2);letter-spacing:.06em;text-transform:uppercase;font-weight:500}
  .pdf-page-doc h2{font-family:var(--font-display);font-weight:500;font-size:24px;letter-spacing:-.5px;margin:0 0 6px;color:var(--ink)}
  .pdf-page-doc .pdf-eyebrow{font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--flame-deep);font-weight:600;margin-bottom:8px;display:block}
  .pdf-page-doc h3{font-family:var(--font-display);font-weight:500;font-size:17px;letter-spacing:-.2px;margin:24px 0 8px;color:var(--ink)}
  .pdf-page-doc .clause-num{font-family:var(--font-mono);font-weight:600;color:var(--flame-deep);font-size:12.5px;margin-right:8px;display:inline-block;letter-spacing:.02em}
  .pdf-page-doc p{margin:0 0 14px;text-align:justify;hyphens:auto}
  .pdf-page-doc p strong{font-weight:600;color:var(--ink)}
  .pdf-page-doc table{width:100%;border-collapse:collapse;margin:14px 0;font-size:13px;font-family:var(--font)}
  .pdf-page-doc th, .pdf-page-doc td{border:1px solid var(--border-strong);padding:8px 10px;text-align:left;vertical-align:top}
  .pdf-page-doc th{background:var(--paper);font-weight:600;color:var(--ink);font-size:11.5px;letter-spacing:.04em;text-transform:uppercase;font-family:var(--font-mono)}
  .pdf-page-doc td{color:var(--ink-soft)}
  .pdf-page-doc td.num{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-weight:500}
  .pdf-page-doc figure{margin:18px 0;padding:14px;background:var(--paper);border:1px solid var(--border);border-radius:4px}
  .pdf-page-doc figcaption{font-family:var(--font-mono);font-size:10.5px;color:var(--muted);letter-spacing:.04em;text-transform:uppercase;font-weight:500;margin-bottom:6px}
  .pdf-page-doc .pdf-foot{margin-top:36px;padding-top:14px;border-top:1px solid var(--border);font-family:var(--font-mono);font-size:10.5px;color:var(--muted-2);letter-spacing:.04em;display:flex;justify-content:space-between}

  .pdf-ref{position:relative;background:var(--flame-soft);padding:10px 14px;border-left:3px solid var(--flame);border-radius:0 4px 4px 0;margin:18px 0;transition:box-shadow 360ms var(--ease)}
  .pdf-ref::before{content:"REFERENCED";position:absolute;top:-9px;left:8px;font-family:var(--font-mono);font-size:9px;color:#fff;background:var(--flame);padding:2px 6px;border-radius:3px;letter-spacing:.08em;font-weight:600}
  .pdf-ref.flash{animation:refFlash 1600ms var(--ease)}
  @keyframes refFlash{0%{box-shadow:0 0 0 0 rgba(99,199,106,.6)}40%{box-shadow:0 0 0 12px rgba(99,199,106,0)}100%{box-shadow:0 0 0 0 rgba(99,199,106,0)}}

  /* Projects home */
  .projects-home{position:fixed;inset:0;background:var(--bg);z-index:50;display:flex;flex-direction:column;opacity:0;pointer-events:none;transform:translateX(-24px);transition:opacity 360ms var(--ease),transform 360ms var(--ease)}
  .projects-home.visible{opacity:1;pointer-events:auto;transform:none}
  .ph-head{padding:20px 56px;display:flex;align-items:center;gap:14px;border-bottom:1px solid var(--border)}
  .ph-head .brand{padding:0;cursor:default}
  .ph-head .ph-close{margin-left:auto;width:32px;height:32px;border-radius:var(--r);border:1px solid var(--border);background:var(--surface);color:var(--ink-soft);display:grid;place-items:center;transition:background 180ms var(--ease),color 180ms var(--ease)}
  .ph-head .ph-close:hover{background:var(--hover);color:var(--ink)}
  .ph-head .ph-close svg{width:13px;height:13px}
  .ph-body{flex:1;overflow:auto;padding:64px 56px 80px}
  .ph-inner{max-width:1180px;margin:0 auto}
  .ph-eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:14px}
  .ph-title{font-family:var(--font-display);font-weight:500;font-size:clamp(40px,4.4vw,56px);line-height:1.05;letter-spacing:-1.5px;color:var(--ink);margin:0 0 14px}
  .ph-title em{font-style:normal;color:var(--muted-2);font-weight:400}
  .ph-sub{font-size:14.5px;color:var(--ink-soft);max-width:560px;margin:0 0 44px}
  .ph-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
  .ph-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);padding:20px;cursor:pointer;text-align:left;transition:border-color 200ms var(--ease),transform 220ms var(--ease),box-shadow 220ms var(--ease);display:flex;flex-direction:column;gap:14px;min-height:200px}
  .ph-card:hover{border-color:var(--border-strong);box-shadow:var(--shadow-soft)}
  .ph-card.current{border-color:var(--ink);box-shadow:0 0 0 3px rgba(31,26,20,.06),0 4px 14px rgba(20,14,4,.06)}
  .ph-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
  .ph-card .floor{width:60px;height:42px;background:var(--bg);border:1px solid var(--border);border-radius:var(--r);position:relative;overflow:hidden}
  .ph-card .floor::before{content:"";position:absolute;inset:6px;border:1px solid var(--border-strong);border-radius:3px}
  .ph-card .floor::after{content:"";position:absolute;left:30%;top:6px;bottom:6px;width:1px;background:var(--border-strong)}
  .ph-card .ph-status{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;padding:3px 7px;border-radius:4px;color:var(--muted);background:rgba(122,111,94,.08)}
  .ph-card .ph-status.live{color:var(--ink);background:var(--hover)}
  .ph-card .ph-status.archived{color:var(--muted)}
  .ph-card .ph-name{font-family:var(--font-display);font-weight:500;font-size:21px;letter-spacing:-.5px;color:var(--ink);margin:0;line-height:1.15}
  .ph-card .ph-meta{font-size:12.5px;color:var(--muted);margin:0;line-height:1.45}
  .ph-card .ph-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;padding-top:12px;border-top:1px solid var(--border);font-family:var(--font-mono);font-size:10px;color:var(--muted-2);letter-spacing:.06em;text-transform:uppercase}
  .ph-card .ph-foot .updated{color:var(--ink-soft)}
  .ph-new{background:var(--bg);border:1.5px dashed var(--border-strong);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;color:var(--muted);font-weight:500;transition:border-color 200ms var(--ease),color 200ms var(--ease),background 200ms var(--ease)}
  .ph-new:hover{border-color:var(--ink-soft);color:var(--ink);background:var(--hover)}
  .ph-new .plus{width:36px;height:36px;border-radius:999px;border:1.5px dashed currentColor;display:grid;place-items:center;font-size:18px;font-family:var(--font-display);font-weight:400;transition:transform 280ms var(--ease)}
  .ph-new:hover .plus{ scale(1.05)}

  /* ===== Plan builder overlay ===== */
  .plan-builder{position:fixed;inset:0;background:var(--bg);z-index:60;display:none;flex-direction:column}
  .plan-builder.visible{display:flex}
  .pb-head{display:flex;align-items:center;gap:14px;padding:14px 24px;border-bottom:1px solid var(--border);background:var(--bg);flex:none;height:60px}
  .pb-head .pb-brand{display:flex;align-items:center;gap:10px;cursor:default}
  .pb-head .pb-prompt{display:inline-flex;align-items:baseline;gap:1px;font-family:'JetBrains Mono','SF Mono',Menlo,Consolas,monospace;font-size:18px;font-weight:600;color:var(--flame);line-height:1}
  .pb-head .pb-prompt-gt,.pb-head .pb-prompt-cur{color:var(--flame)}
  .pb-head .pb-title{font-family:var(--font-display);font-size:18px;font-weight:500;letter-spacing:-.4px;color:var(--ink);white-space:nowrap}
  .pb-head .pb-doc{font-family:var(--font-mono);font-size:11px;color:var(--muted);letter-spacing:.04em;padding:3px 8px;border-radius:var(--r);background:var(--surface);border:1px solid var(--border);white-space:nowrap}
  .pb-stepper{display:flex;align-items:center;gap:0;margin-left:auto;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-pill);padding:3px;flex:none}
  .pb-step{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;font-size:11.5px;font-weight:500;color:var(--muted);border-radius:999px;transition:background 220ms var(--ease),color 220ms var(--ease);font-family:var(--font);letter-spacing:-.005em}
  .pb-step .pb-step-num{width:16px;height:16px;border-radius:999px;background:var(--bg);border:1px solid var(--border);color:var(--muted);font-family:var(--font-mono);font-size:9.5px;display:grid;place-items:center;font-weight:600;transition:all 220ms var(--ease)}
  .pb-step.done{color:var(--ink-soft)}
  .pb-step.done .pb-step-num{background:var(--green);border-color:var(--green);color:#fff}
  .pb-step.active{background:var(--ink);color:var(--bg)}
  .pb-step.active .pb-step-num{background:var(--bg);border-color:var(--bg);color:var(--ink)}
  .pb-close{width:32px;height:32px;border-radius:var(--r);border:1px solid var(--border);background:var(--surface);color:var(--ink-soft);display:grid;place-items:center;transition:all 180ms var(--ease);flex:none}
  .pb-close:hover{background:var(--red-soft);color:var(--red);border-color:var(--red)}
  .pb-close svg{width:13px;height:13px}
  .pb-body{flex:1;display:flex;overflow:hidden;background:var(--bg);min-height:0}
  .pb-foot{flex:none;display:flex;align-items:center;justify-content:space-between;padding:12px 24px;border-top:1px solid var(--border);background:var(--bg);gap:14px}
  .pb-foot .pb-foot-info{font-size:12px;color:var(--muted);font-family:var(--font-mono);letter-spacing:.02em}
  .pb-foot .pb-foot-info b{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
  .pb-foot .pb-foot-actions{display:flex;align-items:center;gap:10px}
  .pb-cta-secondary{display:inline-flex;align-items:center;gap:7px;padding:9px 16px;border-radius:var(--r);background:var(--surface);border:1px solid var(--border);color:var(--ink-soft);font-size:13px;font-weight:500;transition:all 200ms var(--ease)}
  .pb-cta-secondary:hover{background:var(--hover);border-color:var(--border-strong);color:var(--ink)}
  .pb-cta-secondary:disabled{opacity:.4;cursor:not-allowed}
  .pb-cta-secondary svg{width:13px;height:13px}
  .pb-cta-primary{display:inline-flex;align-items:center;gap:7px;padding:9px 18px;border-radius:var(--r);background:var(--ink);color:var(--bg);font-size:13px;font-weight:600;letter-spacing:-.005em;transition:all 220ms var(--ease)}
  .pb-cta-primary:hover{background:var(--green);box-shadow:0 1px 2px rgba(20,14,4,.08)}
  .pb-cta-primary:active{transform:translateY(1px)}
  .pb-cta-primary:disabled{opacity:.45;cursor:not-allowed;background:rgba(31,26,20,.45);box-shadow:none}
  .pb-cta-primary:disabled:hover{background:rgba(31,26,20,.45);box-shadow:none}
  .pb-cta-primary svg{width:13px;height:13px}
  .pb-cta-primary.assess{background:var(--ink);color:var(--bg)}
  .pb-cta-primary.assess:hover{background:var(--green)}
  .pb-cta-primary.save{background:var(--green);color:#fff}
  .pb-cta-primary.save:hover{background:var(--green-deep)}

  /* Step 1 — Pages */
  .pb-pages{flex:1;display:grid;grid-template-columns:280px 1fr;min-height:0}
  .pb-pages-list{border-right:1px solid var(--border);background:var(--sidebar);overflow-y:auto;padding:18px}
  .pb-pages-list::-webkit-scrollbar{width:6px}.pb-pages-list::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:999px}
  .pb-pages-eyebrow{font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-bottom:14px}
  .pb-thumb{display:flex;align-items:flex-start;gap:12px;padding:8px;border-radius:var(--r);cursor:pointer;margin-bottom:6px;transition:background 180ms var(--ease);width:100%;text-align:left;border:1px solid transparent}
  .pb-thumb:hover{background:var(--hover)}
  .pb-thumb.selected{background:var(--surface);border-color:var(--ink);box-shadow:0 0 0 3px rgba(31,26,20,.08)}
  .pb-thumb-prev{width:60px;height:80px;background:var(--surface);border:1px solid var(--border);border-radius:3px;flex:none;position:relative;overflow:hidden;box-shadow:0 1px 0 rgba(40,30,14,.05)}
  .pb-thumb-prev .pb-thumb-svg{width:100%;height:100%;display:block}
  .pb-thumb.selected .pb-thumb-prev{border-color:var(--ink)}
  .pb-thumb-meta{flex:1;min-width:0;padding-top:2px}
  .pb-thumb-meta .name{font-size:12.5px;font-weight:600;color:var(--ink);margin-bottom:2px;letter-spacing:-.005em}
  .pb-thumb-meta .desc{font-size:11px;color:var(--muted);line-height:1.45}
  .pb-thumb-tick{width:18px;height:18px;border-radius:4px;border:1.5px solid var(--border-strong);background:var(--surface);flex:none;display:grid;place-items:center;margin-top:4px;transition:all 180ms var(--ease)}
  .pb-thumb-tick svg{width:10px;height:10px;color:#fff;opacity:0;transform:scale(.5);transition:all 180ms var(--ease)}
  .pb-thumb.selected .pb-thumb-tick{background:var(--ink);border-color:var(--ink)}
  .pb-thumb.selected .pb-thumb-tick svg{opacity:1;transform:scale(1)}
  .pb-pages-preview{padding:32px 56px;overflow-y:auto;display:flex;flex-direction:column;align-items:center;background:linear-gradient(180deg,var(--bg) 0%,var(--paper) 100%)}
  .pb-pages-preview::-webkit-scrollbar{width:8px}.pb-pages-preview::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:999px}
  .pb-page-card{background:#fff;border:1px solid var(--border);border-radius:4px;box-shadow:0 1px 0 rgba(40,30,14,.05),0 12px 32px rgba(40,30,14,.08);width:540px;height:740px;margin-bottom:24px;position:relative;overflow:hidden}
  .pb-page-card .pb-page-no{position:absolute;top:12px;right:14px;font-family:var(--font-mono);font-size:10px;color:var(--muted-2);letter-spacing:.06em;text-transform:uppercase}
  .pb-page-card svg{width:100%;height:100%;display:block}

  /* Step 2 — Crop */
  .pb-crop{flex:1;display:grid;grid-template-columns:1fr 280px;min-height:0}
  .pb-crop-stage{position:relative;display:flex;align-items:center;justify-content:center;padding:32px;overflow:auto;background:linear-gradient(180deg,var(--bg) 0%,var(--paper) 100%)}
  .pb-crop-stage::-webkit-scrollbar{width:8px}.pb-crop-stage::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:999px}
  .pb-crop-canvas{position:relative;background:#fff;border:1px solid var(--border);border-radius:4px;box-shadow:0 1px 0 rgba(40,30,14,.05),0 12px 32px rgba(40,30,14,.08);width:680px;height:520px}
  .pb-crop-canvas svg.pb-floor{width:100%;height:100%;display:block}
  .pb-crop-rect{position:absolute;border:1.5px dashed rgba(99,199,106,.55);background:rgba(99,199,106,.04);box-shadow:0 0 0 9999px rgba(20,14,4,.38);cursor:move;border-radius:2px}
  .pb-crop-handle{position:absolute;width:10px;height:10px;background:#fff;border:1.5px solid rgba(99,199,106,.7);border-radius:2px}
  .pb-crop-handle.tl{top:-6px;left:-6px;cursor:nwse-resize}
  .pb-crop-handle.tr{top:-6px;right:-6px;cursor:nesw-resize}
  .pb-crop-handle.bl{bottom:-6px;left:-6px;cursor:nesw-resize}
  .pb-crop-handle.br{bottom:-6px;right:-6px;cursor:nwse-resize}
  .pb-crop-side{padding:32px 28px;background:var(--sidebar);border-left:1px solid var(--border);overflow-y:auto}
  .pb-crop-side h3{font-family:var(--font-display);font-size:18px;font-weight:500;letter-spacing:-.4px;color:var(--ink);margin:0 0 8px}
  .pb-crop-side p{font-size:13px;line-height:1.55;color:var(--ink-soft);margin:0 0 22px}
  .pb-crop-stat{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--border);font-size:12.5px}
  .pb-crop-stat .label{color:var(--muted)}
  .pb-crop-stat .value{font-family:var(--font-mono);color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
  .pb-crop-tip{margin-top:22px;padding:14px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);font-size:12px;line-height:1.55;color:var(--ink-soft)}
  .pb-crop-tip b{font-weight:600}
  .pb-crop-delete{margin-top:18px;display:flex;align-items:center;gap:8px;padding:10px 14px;background:transparent;border:1px solid var(--border-strong);border-radius:var(--r);color:var(--muted);font-size:12px;font-weight:500;cursor:pointer;transition:all 200ms var(--ease);width:100%}
  .pb-crop-delete:hover{background:rgba(180,50,30,.06);border-color:var(--red);color:var(--red)}
  .pb-crop-delete svg{width:14px;height:14px;flex-shrink:0}

  /* Step 3 — Markup */
  .pb-markup{flex:1;display:flex;flex-direction:column;min-height:0}
  .pb-markup-grid{flex:1;display:grid;grid-template-columns:auto 1fr 296px;min-height:0}
  .pb-markup-topbar{display:flex;align-items:center;gap:14px;padding:10px 22px;border-bottom:1px solid var(--border);background:var(--bg);flex:none}
  .pb-markup-topbar .eyebrow{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;color:var(--muted);text-transform:uppercase;font-weight:600}
  .pb-floor-select{position:relative}
  .pb-floor-select-btn{display:inline-flex;align-items:center;gap:8px;padding:7px 12px 7px 14px;border-radius:var(--r-pill,999px);border:1px solid var(--border);background:var(--surface);color:var(--ink);font-size:12.5px;font-weight:600;letter-spacing:-.005em;cursor:pointer;transition:background 200ms var(--ease),border-color 200ms var(--ease),box-shadow 240ms var(--ease)}
  .pb-floor-select-btn:hover{background:var(--hover);border-color:var(--border-strong);box-shadow:0 2px 8px rgba(40,30,14,.06)}
  .pb-floor-select-btn .fname{font-family:var(--font-mono);font-weight:500;font-size:12px;color:var(--ink-soft)}
  .pb-floor-select-btn .chev{color:var(--muted);transition:transform 220ms var(--ease)}
  .pb-floor-select.open .pb-floor-select-btn .chev{transform:rotate(180deg)}
  .pb-floor-select-btn svg{width:11px;height:11px}
  .pb-floor-select-menu{position:absolute;top:calc(100% + 6px);left:0;min-width:280px;background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:0 12px 32px rgba(40,30,14,.14);padding:6px;display:none;z-index:30;max-height:280px;overflow-y:auto}
  .pb-floor-select.open .pb-floor-select-menu{display:block}
  .pb-floor-select-item{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:6px;cursor:pointer;font-size:12.5px;color:var(--ink);transition:background 160ms var(--ease)}
  .pb-floor-select-item:hover{background:var(--hover)}
  .pb-floor-select-item.active{background:var(--hover);color:var(--ink);font-weight:600}
  .pb-floor-select-item .dot{width:6px;height:6px;border-radius:999px;background:var(--muted-2);flex:none}
  .pb-floor-select-item.active .dot{background:var(--ink)}
  .pb-floor-select-item .nm{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .pb-floor-select-item .sub{font-family:var(--font-mono);font-size:10.5px;color:var(--muted-2)}
  .pb-floor-select-empty{padding:10px 12px;font-size:12px;color:var(--muted-2);font-style:italic;text-align:center}
  .pb-toolrail{background:var(--sidebar);border-right:1px solid var(--border);display:flex;flex-direction:column;align-items:stretch;padding:14px 10px;gap:6px;overflow-y:auto;width:108px;min-width:108px;transition:opacity 240ms var(--ease)}
  /* Eraser tool: red cursor cue, hover-tint everything that can be erased. */
  #pb-canvas[data-tool="erase"]{cursor:crosshair}
  #pb-canvas[data-tool="erase"] .pb-pin,
  #pb-canvas[data-tool="erase"] .pb-zone-label{cursor:pointer;pointer-events:auto}
  #pb-canvas[data-tool="erase"] .pb-pin:hover{outline:2px solid var(--red);outline-offset:2px;filter:saturate(.6)}
  #pb-canvas[data-tool="erase"] .pb-zone-label:hover{box-shadow:0 0 0 2px var(--red);filter:saturate(.6)}
  #pb-overlay-svg .pb-zone[data-id]:hover{stroke:var(--red);stroke-width:2.4}
  #pb-canvas[data-tool="erase"] .pb-pin .pb-pin-del,#pb-canvas[data-tool="erase"] .pb-pin .pb-pin-rename{display:none !important}
  .pb-toolrail.disabled{opacity:.42;pointer-events:none;filter:grayscale(.4)}
  .pb-toolrail.disabled::after{content:"Read-only";position:sticky;bottom:0;left:0;right:0;display:block;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);text-align:center;padding:6px 0;border-top:1px dashed var(--border);background:var(--sidebar)}
  .pb-toolrail::-webkit-scrollbar{width:4px}.pb-toolrail::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:999px}
  .pb-tool{position:relative;width:100%;height:64px;border-radius:var(--r);background:transparent;border:1px solid transparent;color:var(--ink-soft);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer;transition:background 200ms var(--ease),border-color 200ms var(--ease),color 200ms var(--ease),transform 160ms var(--ease),box-shadow 240ms var(--ease)}
  .pb-tool:hover{background:var(--hover);border-color:var(--border-strong);color:var(--ink);box-shadow:0 2px 6px rgba(40,30,14,.06)}
  .pb-tool.active{background:var(--ink);color:var(--bg);border-color:var(--ink);box-shadow:0 4px 12px rgba(40,30,14,.18)}
  .pb-tool svg{width:18px;height:18px}
  .pb-tool .pb-tool-name{font-size:11px;font-weight:600;letter-spacing:.005em;line-height:1}
  .pb-tool .pb-tool-key{position:absolute;top:5px;right:7px;font-family:var(--font-mono);font-size:9px;color:var(--muted-2);font-weight:600;opacity:.7}
  .pb-tool.active .pb-tool-key{color:rgba(253,250,243,.55)}
  .pb-tool-divider{display:block;width:auto;height:1px;background:var(--border);margin:6px 4px}

  .pb-canvas-wrap{position:relative;background:linear-gradient(180deg,var(--bg) 0%,var(--paper) 100%);overflow:auto;display:flex;align-items:center;justify-content:center;padding:48px 32px 32px}
  .pb-canvas-wrap::-webkit-scrollbar{width:8px}.pb-canvas-wrap::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:999px}
  .pb-canvas-stage{position:relative;flex:none;transform:scale(var(--pb-zoom,1));transform-origin:center center;transition:transform 260ms var(--ease)}
  .pb-canvas{position:relative;background:#fff;border:1px solid var(--border);border-radius:4px;box-shadow:0 1px 0 rgba(40,30,14,.05),0 12px 32px rgba(40,30,14,.08);width:880px;height:580px;cursor:crosshair}
  .pb-zoombar{position:absolute;bottom:18px;right:18px;display:flex;align-items:center;gap:0;background:#fff;border:1px solid var(--border);border-radius:var(--r-pill);box-shadow:var(--shadow-soft);overflow:hidden;z-index:6;font-family:var(--font-mono)}
  .pb-zoombar button{width:32px;height:32px;display:grid;place-items:center;color:var(--ink-soft);background:transparent;border:0;cursor:pointer;transition:background 160ms var(--ease),color 160ms var(--ease)}
  .pb-zoombar button:hover{background:var(--hover);color:var(--ink)}
  .pb-zoombar button svg{width:13px;height:13px}
  .pb-zoom-val{padding:0 10px;font-size:11px;font-weight:600;color:var(--ink);min-width:42px;text-align:center;border-left:1px solid var(--border);border-right:1px solid var(--border);font-variant-numeric:tabular-nums;cursor:pointer;height:32px;display:grid;place-items:center;transition:background 160ms var(--ease)}
  .pb-zoom-val:hover{background:var(--hover)}
  .pb-canvas[data-tool="pin"]{cursor:crosshair}
  .pb-canvas[data-tool="link"]{cursor:cell}
  .pb-canvas[data-tool="zone"]{cursor:crosshair}
  .pb-canvas[data-tool="label"]{cursor:text}
  .pb-canvas[data-tool="select"]{cursor:default}
  .pb-canvas[data-tool="pan"]{cursor:grab}
  .pb-floor-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
  .pb-overlay-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}

  /* Pin colors */
  .pb-cat-room{--cat:#c9624a;--cat-soft:rgba(201,98,74,.14)}
  .pb-cat-corridor{--cat:#7a9874;--cat-soft:rgba(122,152,116,.16)}
  .pb-cat-lift{--cat:#5d7a99;--cat-soft:rgba(93,122,153,.14)}
  .pb-cat-stair{--cat:#c89b3f;--cat-soft:rgba(200,155,63,.16)}
  .pb-cat-exit{--cat:#2f9c58;--cat-soft:rgba(47,156,88,.14)}
  .pb-cat-zone{--cat:#8a6a8e;--cat-soft:rgba(138,106,142,.14)}

  .pb-pin{position:absolute;width:26px;height:26px;border-radius:999px;background:var(--cat,#c9624a);color:#fff;border:2px solid #fff;display:grid;place-items:center;font-family:var(--font-mono);font-weight:700;font-size:11px;cursor:pointer;transform:translate(-50%,-50%);transition:transform 200ms var(--ease),box-shadow 240ms var(--ease);box-shadow:0 2px 6px rgba(20,14,4,.22),0 0 0 0 rgba(99,199,106,0);user-select:none;z-index:2;pointer-events:auto;animation:pinIn 360ms var(--ease) both}
  @keyframes pinIn{from{opacity:0;transform:translate(-50%,-50%) scale(.4)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
  .pb-pin:hover{transform:translate(-50%,-50%);box-shadow:0 2px 6px rgba(20,14,4,.18)}
  .pb-pin.flash{animation:pinFlash 1100ms var(--ease)}
  @keyframes pinFlash{0%{box-shadow:0 0 0 0 var(--cat,#63c76a)}100%{box-shadow:0 0 0 16px rgba(99,199,106,0)}}
  .pb-pin.has-note::after{content:"";position:absolute;top:-2px;right:-2px;width:8px;height:8px;border-radius:999px;background:var(--flame);border:1.5px solid #fff;box-shadow:0 1px 2px rgba(99,199,106,.4)}
  .pb-pin.has-note{animation:pinIn 360ms var(--ease) both, hasNotePulse 2.6s var(--ease) infinite 600ms}
  @keyframes hasNotePulse{0%,100%{box-shadow:0 2px 6px rgba(20,14,4,.22),0 0 0 0 rgba(99,199,106,.0)}50%{box-shadow:0 2px 6px rgba(20,14,4,.22),0 0 0 7px rgba(99,199,106,.16)}}
  .pb-pin.dim{opacity:.5;transition:opacity 220ms var(--ease)}
  .pb-pin.fade{opacity:.25}
  .pb-pin.selected{box-shadow:0 0 0 3px #fff,0 0 0 5px var(--cat,#c9624a),0 4px 14px rgba(20,14,4,.28)}

  /* Pin custom name (rendered below pin) */
  .pb-pin-name{position:absolute;transform:translate(-50%,0);background:rgba(255,255,255,.94);color:var(--ink);font-family:var(--font);font-size:10.5px;font-weight:600;letter-spacing:-.005em;padding:2px 7px;border-radius:3px;border:1px solid var(--border);box-shadow:0 1px 3px rgba(20,14,4,.12);pointer-events:none;white-space:nowrap;z-index:2;animation:pinIn 320ms var(--ease) both}

  /* Pin name input prompt (appears immediately after radial pick) */
  .pb-pin-name-input{position:absolute;transform:translate(-50%,0);display:flex;align-items:center;gap:0;background:#fff;border:1.5px solid var(--cat,#c9624a);border-radius:5px;box-shadow:0 4px 14px rgba(20,14,4,.16);z-index:11;animation:pinIn 220ms var(--ease) both;pointer-events:auto}
  .pb-pin-name-input input{font:inherit;font-family:var(--font);font-size:11.5px;color:var(--ink);background:transparent;border:0;outline:0;padding:5px 9px;width:150px;letter-spacing:-.005em}
  .pb-pin-name-input input::placeholder{color:var(--muted);font-style:italic}
  .pb-pin-name-input button{display:grid;place-items:center;width:24px;height:24px;border:0;background:transparent;cursor:pointer;border-left:1px solid var(--border);transition:background 160ms var(--ease)}
  .pb-pin-name-input button.confirm{color:var(--green,#2fa974)}
  .pb-pin-name-input button.confirm:hover{background:rgba(47,169,116,.12)}
  .pb-pin-name-input button.dismiss{color:var(--muted);border-radius:0 4px 4px 0}
  .pb-pin-name-input button.dismiss:hover{background:rgba(212,77,77,.12);color:var(--red,#d44d4d)}
  .pb-pin-name-input button svg{width:11px;height:11px}

  .pb-link{stroke:var(--ink);stroke-width:1.5;stroke-dasharray:5 4;fill:none;opacity:.55;pointer-events:auto;cursor:pointer;transition:opacity 220ms var(--ease),stroke 220ms var(--ease),stroke-width 220ms var(--ease)}
  .pb-link:hover{opacity:1;stroke:var(--flame);stroke-width:2}
  .pb-link.dim{opacity:.18;transition:opacity 220ms var(--ease)}
  .pb-link.highlight{opacity:1;stroke:var(--flame);stroke-width:2.4;stroke-dasharray:6 4;animation:linkFlow 1.1s linear infinite}
  @keyframes linkFlow{from{stroke-dashoffset:0}to{stroke-dashoffset:-20}}
  .pb-link-temp{stroke:var(--flame);stroke-width:2;stroke-dasharray:6 4;fill:none;opacity:.7;pointer-events:none}
  /* Invisible thicker hit area for easier link hovering */
  .pb-link-hit{stroke:transparent;stroke-width:14;fill:none;cursor:pointer;pointer-events:auto}
  .pb-link-hit:hover ~ .pb-link-real,.pb-link-real.hover{stroke:var(--flame);stroke-width:2.2;opacity:1}
  /* Cut button on link midpoint */
  .pb-link-cut{position:absolute;transform:translate(-50%,-50%);width:24px;height:24px;border-radius:999px;background:#fff;border:1.5px solid var(--flame);color:var(--flame);display:grid;place-items:center;cursor:pointer;z-index:5;opacity:0;pointer-events:none;transition:opacity 160ms var(--ease),transform 220ms var(--ease),background 180ms var(--ease);box-shadow:0 2px 8px rgba(20,14,4,.2)}
  .pb-link-cut.visible{opacity:1;pointer-events:auto;animation:pinIn 220ms var(--ease) both}
  .pb-link-cut:hover{background:var(--flame);color:#fff;transform:translate(-50%,-50%)}
  .pb-link-cut svg{width:11px;height:11px}
  .pb-zone{fill:var(--cat-soft,rgba(138,106,142,.14));stroke:var(--cat,#8a6a8e);stroke-width:1.5;cursor:pointer;transition:stroke-width 220ms var(--ease)}
  .pb-zone:hover{stroke-width:2.4}
  .pb-zone.dim{opacity:.45}
  .pb-zone-label{position:absolute;transform:translate(-50%,-50%);background:var(--cat,#8a6a8e);color:#fff;font-family:var(--font-mono);font-size:10px;letter-spacing:.04em;font-weight:600;padding:3px 8px;border-radius:3px;pointer-events:none;white-space:nowrap;box-shadow:0 2px 6px rgba(20,14,4,.18);z-index:3}
  .pb-zone-label.input{padding:0;background:#fff;border:1.5px solid var(--cat,#8a6a8e);pointer-events:auto}
  .pb-zone-label.input input{font:inherit;color:var(--ink);background:transparent;border:0;outline:0;padding:5px 9px;width:140px;letter-spacing:.04em}

  /* Radial menu */
  .pb-radial{position:absolute;width:240px;height:240px;transform:translate(-50%,-50%);pointer-events:none;z-index:10;animation:radialIn 220ms var(--ease) both}
  @keyframes radialIn{from{opacity:0;transform:translate(-50%,-50%) scale(.7)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
  .pb-radial-bg{display:none}
  .pb-radial-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:36px;height:36px;border-radius:999px;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:12px;pointer-events:auto;cursor:pointer;transition:background 200ms var(--ease);font-family:var(--font-mono)}
  .pb-radial-center:hover{background:var(--red)}
  .pb-radial-center svg{width:11px;height:11px}
  .pb-radial-opt{position:absolute;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;pointer-events:auto;transform:translate(-50%,-50%);transition:transform 200ms var(--ease)}
  .pb-radial-opt .dot{width:50px;height:50px;border-radius:999px;background:var(--cat,#c9624a);color:#fff;display:grid;place-items:center;box-shadow:0 4px 12px rgba(20,14,4,.22);transition:transform 220ms var(--ease),box-shadow 220ms var(--ease)}
  .pb-radial-opt .ic{font-family:var(--font-mono);font-weight:700;font-size:15px;line-height:1}
  .pb-radial-opt .nm{font-size:11px;font-family:var(--font);font-weight:600;color:var(--ink);background:rgba(255,255,255,.9);padding:2px 8px;border-radius:3px;white-space:nowrap;letter-spacing:-.005em;box-shadow:0 1px 3px rgba(20,14,4,.1);transition:transform 180ms var(--ease),box-shadow 180ms var(--ease)}
  .pb-radial-opt:hover .dot{;box-shadow:0 2px 6px rgba(20,14,4,.10)}
  .pb-radial-opt:hover .nm{transform:translateY(1px);box-shadow:0 2px 5px rgba(20,14,4,.16)}
  .pb-radial-opt.has-subs .dot::after{content:"›";position:absolute;right:-2px;bottom:-2px;width:14px;height:14px;border-radius:999px;background:#fff;color:var(--cat,#7a9874);font-family:var(--font-mono);font-weight:700;font-size:11px;display:grid;place-items:center;box-shadow:0 1px 2px rgba(20,14,4,.12)}
  .pb-radial-opt.has-subs .dot{position:relative}
  .pb-radial-opt.dim{opacity:.45}
  .pb-radial-sub{position:absolute;left:calc(100% + 16px);top:50%;transform:translateY(-50%);background:#fff;border:1px solid var(--border);border-radius:var(--r);padding:6px;display:flex;flex-direction:column;gap:4px;box-shadow:var(--shadow-lift);pointer-events:auto;animation:radialSubIn 220ms var(--ease) both;z-index:2}
  .pb-radial-sub::before{content:"";position:absolute;right:100%;top:50%;transform:translateY(-50%);width:0;height:0;border:6px solid transparent;border-right-color:#fff;filter:drop-shadow(-1px 0 0 var(--border))}
  @keyframes radialSubIn{from{opacity:0;transform:translateY(-50%) translateX(-6px)}to{opacity:1;transform:translateY(-50%) translateX(0)}}
  .pb-radial-sub button{padding:7px 14px;font-size:12px;font-weight:500;color:var(--ink-soft);border-radius:5px;transition:background 180ms var(--ease),color 180ms var(--ease);text-align:left;display:flex;align-items:center;gap:8px;background:transparent;border:0;cursor:pointer;font-family:var(--font)}
  .pb-radial-sub button .sub-letter{font-family:var(--font-mono);font-weight:700;font-size:11px;color:var(--cat,#7a9874);width:18px;height:18px;border-radius:4px;background:var(--cat-soft,rgba(122,152,116,.16));display:grid;place-items:center}
  .pb-radial-sub button:hover{background:var(--cat-soft,rgba(122,152,116,.16));color:var(--cat,#7a9874)}

  /* Right rail — categories */
  .pb-side{background:var(--sidebar);border-left:1px solid var(--border);overflow-y:auto;display:flex;flex-direction:column}
  .pb-side::-webkit-scrollbar{width:6px}.pb-side::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:999px}
  .pb-side-head{padding:16px 18px 12px;border-bottom:1px solid var(--border)}
  .pb-side-head h3{font-family:var(--font-display);font-size:17px;font-weight:500;letter-spacing:-.3px;color:var(--ink);margin:0 0 4px}
  .pb-side-head p{font-size:12px;color:var(--muted);margin:0;line-height:1.45}
  .pb-cat-section{border-bottom:1px solid var(--border)}
  .pb-cat-head{display:flex;align-items:center;gap:10px;padding:11px 18px;cursor:pointer;transition:background 180ms var(--ease);user-select:none}
  .pb-cat-head:hover{background:var(--hover)}
  .pb-cat-head .swatch{width:14px;height:14px;border-radius:4px;background:var(--cat,#c9624a);flex:none;display:grid;place-items:center;color:#fff;font-family:var(--font-mono);font-weight:700;font-size:8.5px;letter-spacing:0}
  .pb-cat-head .name{flex:1;font-size:12.5px;font-weight:600;color:var(--ink);letter-spacing:-.005em}
  .pb-cat-head .count{font-family:var(--font-mono);font-size:11px;color:var(--muted-2);font-weight:500;font-variant-numeric:tabular-nums;transition:color 240ms var(--ease)}
  .pb-cat-head .count.bumped{color:var(--cat,#c9624a)}
  .pb-cat-head .chev{width:14px;height:14px;color:var(--muted-2);transition:transform 220ms var(--ease)}
  .pb-cat-head .chev svg{width:100%;height:100%}
  .pb-cat-section.open .pb-cat-head .chev{transform:rotate(180deg)}
  .pb-cat-list{display:none;padding:4px 12px 10px}
  .pb-cat-section.open .pb-cat-list{display:block}
  .pb-cat-row{display:flex;align-items:center;gap:9px;padding:6px 8px;border-radius:5px;cursor:pointer;font-size:12px;color:var(--ink-soft);transition:background 180ms var(--ease)}
  .pb-cat-row:hover{background:var(--hover);color:var(--ink)}
  .pb-cat-row .pb-cat-row-dot{width:8px;height:8px;border-radius:999px;background:var(--cat,#c9624a);flex:none}
  .pb-cat-row .pb-cat-row-name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .pb-cat-row .pb-cat-row-meta{font-family:var(--font-mono);font-size:10px;color:var(--muted-2);font-weight:500}
  .pb-cat-row-del,.pb-cat-row-rename{flex:none;width:20px;height:20px;border-radius:4px;border:1px solid var(--border);background:var(--surface);color:var(--muted);display:grid;place-items:center;cursor:pointer;opacity:1;transition:background 160ms var(--ease),color 160ms var(--ease),border-color 160ms var(--ease)}
  .pb-cat-row-del:hover{background:rgba(212,77,77,.10);border-color:rgba(212,77,77,.45);color:var(--red,#d44d4d)}
  .pb-cat-row-rename:hover{background:var(--hover);border-color:var(--ink-soft);color:var(--ink)}
  .pb-cat-row-del svg{width:9px;height:9px}
  .pb-cat-row-rename svg{width:11px;height:11px}
  .pb-cat-row.has-note .pb-cat-row-dot::after{content:"";position:absolute;width:4px;height:4px;border-radius:999px;background:var(--flame);transform:translate(8px,-3px)}
  .pb-cat-empty{padding:6px 12px;font-size:11px;color:var(--muted-2);font-style:italic}

  /* Step 4 — Assessed */
  .pb-assessed-loader{position:absolute;inset:0;background:rgba(253,250,243,.85);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:18px;z-index:50;animation:fadeIn 320ms var(--ease)}
  @keyframes fadeIn{from{opacity:0}to{opacity:1}}
  .pb-assessed-loader .gx-mark{width:48px;height:48px;border-radius:9px;font-size:21px}
  .pb-assessed-loader .gx-mark__cursor{width:11px;height:1em}
  .pb-assessed-loader .pb-loader-line{font-family:var(--font-mono);font-size:13px;color:var(--ink-soft);min-height:18px;display:inline-flex;align-items:baseline}
  .pb-assessed-loader .pb-loader-text{display:inline-block;white-space:nowrap}
  .pb-assessed-loader .pb-loader-caret{display:inline-block;width:7px;height:14px;margin-left:4px;background:var(--ink);animation:gxBlink 1.05s step-end infinite;transform:translateY(2px)}
  .pb-assessed-loader[data-busy="1"] .pb-loader-caret{animation:none;opacity:1}
  .pb-assessed-loader .pb-loader-tag{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600}
  .pb-assessed-loader .pb-loader-progress{width:240px;height:3px;background:var(--border);border-radius:999px;overflow:hidden;position:relative}
  .pb-assessed-loader .pb-loader-progress::after{content:"";position:absolute;left:0;top:0;bottom:0;width:30%;background:linear-gradient(90deg,transparent,var(--ink),transparent);animation:loaderSlide 1.6s ease-in-out infinite}
  @keyframes loaderSlide{from{transform:translateX(-100%)}to{transform:translateX(420%)}}

  .pb-note-card{position:absolute;background:rgba(255,253,247,.62);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);border:1px solid rgba(212,200,176,.55);border-left:3px solid rgba(99,199,106,.7);border-radius:var(--r);padding:12px 14px;width:280px;box-shadow:0 6px 18px rgba(20,14,4,.12);transform:translate(-50%,calc(-100% - 14px));z-index:30;font-size:12.5px;line-height:1.55;color:var(--ink-soft);pointer-events:none;animation:noteIn 220ms var(--ease) both;opacity:.78}
  .pb-note-card:hover{opacity:.95}
  @keyframes noteIn{from{opacity:0;transform:translate(-50%,calc(-100% - 8px))}to{opacity:1;transform:translate(-50%,calc(-100% - 14px))}}
  .pb-note-card::after{content:"";position:absolute;left:50%;bottom:-7px;transform:translateX(-50%) rotate(45deg);width:12px;height:12px;background:rgba(255,253,247,.62);border-right:1px solid rgba(212,200,176,.55);border-bottom:1px solid rgba(212,200,176,.55)}
  .pb-note-card .pb-note-tag{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);font-weight:600;margin-bottom:4px;display:block}
  .pb-note-card .pb-note-title{font-family:var(--font);font-size:12.5px;font-weight:600;color:var(--ink);margin-bottom:4px}
  .pb-note-card .pb-note-body{margin:0}
  .pb-note-card .pb-note-cite{display:inline-block;margin-top:6px;font-size:10.5px;color:var(--ink-soft);font-weight:500;border-bottom:1px dashed var(--border-strong);font-family:var(--font-mono);letter-spacing:.04em}

  .pb-findings-section{border-bottom:1px solid var(--border);padding:0}
  .pb-findings-head{padding:14px 18px 10px;display:flex;align-items:center;gap:10px}
  .pb-findings-head .label{font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600}
  .pb-findings-head .level{margin-left:auto;font-family:var(--font-mono);font-size:10px;padding:2px 8px;border-radius:3px;font-weight:600;letter-spacing:.04em}
  .pb-findings-head .level.warning{color:var(--ink);background:var(--hover)}
  .pb-findings-head .level.info{color:var(--muted);background:rgba(122,111,94,.08)}
  .pb-findings-head .level.ok{color:var(--green-deep);background:var(--green-soft)}
  .pb-finding{padding:10px 18px 14px}
  .pb-finding .ttl{font-family:var(--font-display);font-size:14.5px;font-weight:500;color:var(--ink);margin:0 0 4px;letter-spacing:-.2px}
  .pb-finding .desc{font-size:12px;line-height:1.55;color:var(--ink-soft);margin:0 0 8px}
  .pb-finding .pin-list{display:flex;flex-wrap:wrap;gap:5px}
  .pb-finding .pin-chip{display:inline-flex;align-items:center;gap:5px;padding:3px 8px;font-size:10.5px;border-radius:999px;background:var(--surface);border:1px solid var(--border);font-family:var(--font-mono);font-weight:600;color:var(--ink-soft);cursor:pointer;transition:all 180ms var(--ease)}
  .pb-finding .pin-chip:hover{background:var(--hover);border-color:var(--ink-soft);color:var(--ink)}
  .pb-finding .pin-chip .dot{width:6px;height:6px;border-radius:999px;background:var(--cat,#c9624a)}

  /* Plain B1–B5 findings — no pills, no chips, no level badges. Just labelled prose. */
  .pb-bsec{padding:14px 18px;border-bottom:1px solid var(--border)}
  .pb-bsec:last-child{border-bottom:0}
  .pb-bsec .pb-bsec-tag{display:inline-block;font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:600;margin:0 0 6px}
  .pb-bsec .pb-bsec-ttl{font-family:var(--font-display);font-size:14px;font-weight:500;color:var(--ink);margin:0 0 6px;letter-spacing:-.2px;line-height:1.3}
  .pb-bsec .pb-bsec-body{margin:0;font-size:12.25px;line-height:1.6;color:var(--ink-soft)}
  .pb-bsec .pb-bsec-body + .pb-bsec-body{margin-top:6px}
  .pb-bsec .pb-bsec-cite{display:inline-block;margin-top:8px;font-family:var(--font-mono);font-size:10.5px;color:var(--muted-2);letter-spacing:.04em}

  /* Generic */
  .pb-step-view{display:none;width:100%;height:100%}
  .pb-step-view.active{display:flex;flex:1}

  /* ===== Project Context modal ===== */
  /* Assessment picker — list of saved layouts */
  .ap-modal{width:min(560px,100%)}
  .ap-list{display:flex;flex-direction:column;gap:10px}
  .ap-empty{padding:48px 20px;text-align:center;color:var(--muted);font-size:13px;line-height:1.6}
  .ap-empty .ap-empty-ic{width:44px;height:44px;border-radius:var(--r);background:var(--bg);border:1px solid var(--border);display:grid;place-items:center;color:var(--muted-2);margin:0 auto 14px}
  .ap-empty .ap-empty-ic svg{width:20px;height:20px}
  .ap-row{display:flex;align-items:center;gap:14px;padding:14px 16px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);transition:border-color 200ms var(--ease),box-shadow 200ms var(--ease)}
  .ap-row:hover{border-color:var(--border-strong);box-shadow:var(--shadow-soft)}
  .ap-row .ap-ic{width:38px;height:38px;border-radius:var(--r);background:var(--bg);border:1px solid var(--border);display:grid;place-items:center;color:var(--ink-soft);flex:none}
  .ap-row .ap-ic svg{width:16px;height:16px}
  .ap-row .ap-meta{flex:1;min-width:0}
  .ap-row .ap-name{font-size:13.5px;font-weight:600;color:var(--ink);letter-spacing:-.005em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ap-row .ap-sub{font-size:11.5px;color:var(--muted);font-family:var(--font-mono);letter-spacing:.04em;margin-top:2px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
  .ap-row .ap-status{display:inline-flex;align-items:center;gap:5px;font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;padding:3px 8px;border-radius:999px}
  .ap-row .ap-status.assessed{color:var(--green);background:rgba(47,169,116,.10)}
  .ap-row .ap-status.assessed svg{width:9px;height:9px}
  .ap-row .ap-status.pending{color:var(--muted);background:rgba(122,111,94,.10)}
  .ap-row .ap-status.no-markup{color:var(--muted-2);background:rgba(122,111,94,.06)}
  .ap-row .ap-actions{display:flex;align-items:center;gap:6px;flex:none}
  .ap-row .ap-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:var(--r);font-size:12px;font-weight:600;letter-spacing:-.005em;border:1px solid var(--border);background:var(--surface);color:var(--ink-soft);cursor:pointer;transition:background 180ms var(--ease),border-color 180ms var(--ease),color 180ms var(--ease),transform 120ms var(--ease)}
  .ap-row .ap-btn:hover{background:var(--hover);border-color:var(--border-strong);color:var(--ink)}
  .ap-row .ap-btn.primary{background:var(--ink);color:var(--bg);border-color:var(--ink)}
  .ap-row .ap-btn.primary:hover{background:var(--green);border-color:var(--green)}
  .ap-row .ap-btn:active{transform:translateY(1px)}
  .ap-row .ap-btn svg{width:11px;height:11px}
  .ap-row .ap-btn[disabled]{opacity:.45;cursor:not-allowed;pointer-events:none}
  .ap-foot{padding:12px 22px;border-top:1px solid var(--border);font-size:11.5px;color:var(--muted);font-family:var(--font-mono);letter-spacing:.04em;background:var(--surface)}

  /* ===== BS 9999 calculator modal ===== */
  .bs-scrim{position:fixed;inset:0;background:rgba(20,14,4,.46);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);z-index:80;display:flex;align-items:center;justify-content:center;padding:24px;opacity:0;pointer-events:none;transition:opacity 240ms var(--ease)}
  .bs-scrim.visible{opacity:1;pointer-events:auto}
  .bs-modal{width:min(1200px,100%);height:min(820px,calc(100vh - 48px));background:var(--bg);border:1px solid var(--border);border-radius:var(--r-xl);box-shadow:0 32px 80px rgba(20,14,4,.36);display:flex;flex-direction:column;overflow:hidden;transform:translateY(10px);transition:transform 320ms var(--ease)}
  .bs-scrim.visible .bs-modal{transform:none}

  .bs-head{display:flex;align-items:center;gap:14px;padding:18px 22px 16px;border-bottom:1px solid var(--border);flex:none;background:var(--surface)}
  .bs-head .gxm{width:36px;height:36px;border-radius:8px;background:var(--surface);border:1px solid var(--border);color:var(--flame);display:grid;place-items:center;flex:none;font-family:var(--font-mono);font-weight:600;font-size:18px;line-height:1;letter-spacing:-.02em}
  .bs-head .gxm span{display:block;transform:translate(-.5px,2px)}
  .bs-head .bs-title{display:flex;flex-direction:column;min-width:0;flex:1}
  .bs-head h2{font-family:var(--font-display);font-size:20px;font-weight:500;letter-spacing:-.3px;color:var(--ink);margin:0;line-height:1.2}
  .bs-head .bs-eyebrow{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--flame);font-weight:600;margin-bottom:3px;display:inline-flex;align-items:center;gap:6px}
  .bs-head .bs-eyebrow::before{content:"";width:5px;height:5px;border-radius:999px;background:var(--flame)}
  .bs-head .bs-stamp{font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);background:var(--bg);border:1px solid var(--border);padding:5px 9px;border-radius:999px;font-weight:600;flex:none}
  .bs-head .bs-stamp b{color:var(--ink);font-weight:700}
  .bs-close{width:30px;height:30px;border-radius:var(--r);border:1px solid var(--border);background:var(--surface);color:var(--ink-soft);display:grid;place-items:center;transition:all 180ms var(--ease);flex:none;cursor:pointer}
  .bs-close:hover{background:var(--red-soft);color:var(--red);border-color:var(--red)}
  .bs-close svg{width:11px;height:11px}

  .bs-tabs{display:flex;gap:0;padding:0 22px;border-bottom:1px solid var(--border);background:var(--surface);flex:none;overflow-x:auto;scrollbar-width:none}
  .bs-tabs::-webkit-scrollbar{display:none}
  .bs-tab{appearance:none;border:0;background:transparent;padding:14px 4px;margin-right:22px;cursor:pointer;color:var(--muted);font-family:var(--font-body);font-size:13px;font-weight:500;letter-spacing:-.005em;display:flex;align-items:center;gap:8px;position:relative;white-space:nowrap;transition:color 180ms var(--ease)}
  .bs-tab .num{font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;color:var(--muted-2);font-weight:600}
  .bs-tab:hover{color:var(--ink-soft)}
  .bs-tab.active{color:var(--ink)}
  .bs-tab.active .num{color:var(--flame)}
  .bs-tab.active::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--flame);border-radius:2px 2px 0 0}

  .bs-body{flex:1;overflow:hidden;background:var(--bg);position:relative;display:flex;min-height:0}
  .bs-body #bs-frame{flex:1;width:100%;height:100%;background:var(--bg);display:block;border:0}

  .bs-pane{display:none;animation:bsFade .32s var(--ease) both}
  .bs-pane.active{display:block}
  @keyframes bsFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

  .bs-intro{display:flex;align-items:flex-start;gap:14px;padding:14px 16px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);margin-bottom:20px}
  .bs-intro .info{width:24px;height:24px;border-radius:6px;background:var(--flame-tint);color:var(--flame);display:grid;place-items:center;flex:none}
  .bs-intro .info svg{width:13px;height:13px}
  .bs-intro p{margin:0;font-size:13px;line-height:1.55;color:var(--ink-soft)}
  .bs-intro p .ref{font-family:var(--font-mono);font-size:11.5px;color:var(--flame);font-weight:600;letter-spacing:.02em}

  .bs-section-label{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600;margin:0 0 10px;display:flex;align-items:center;gap:8px}
  .bs-section-label::before{content:"";flex:1;border-top:1px solid var(--border)}
  .bs-section-label::after{content:"";flex:1;border-top:1px solid var(--border)}
  .bs-section-label > span{flex:none}

  .bs-floor{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;margin-bottom:14px}
  .bs-floor-head{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--border);background:var(--bg)}
  .bs-floor-num{font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--flame);font-weight:600;background:var(--flame-soft);padding:4px 8px;border-radius:4px;flex:none}
  .bs-floor-name{flex:1;border:0;background:transparent;font-family:var(--font-display);font-size:17px;font-weight:500;letter-spacing:-.2px;color:var(--ink);padding:2px 0;outline:none;min-width:0}
  .bs-floor-name::placeholder{color:var(--muted-2);font-style:italic;font-weight:400}
  .bs-floor-rm{width:26px;height:26px;border-radius:5px;border:1px solid transparent;background:transparent;color:var(--muted-2);display:grid;place-items:center;cursor:pointer;flex:none;transition:all 180ms var(--ease)}
  .bs-floor-rm:hover{background:var(--red-soft);color:var(--red);border-color:var(--red)}
  .bs-floor-rm svg{width:11px;height:11px}

  .bs-area-grid{display:grid;grid-template-columns:1.4fr 1.4fr 0.7fr 0.7fr 0.6fr 32px;gap:0;padding:0;background:var(--surface)}
  .bs-area-grid .bs-col-head{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:10px 12px 8px;border-bottom:1px solid var(--border);background:var(--bg)}
  .bs-area-grid .bs-col-head:first-child{padding-left:16px}
  .bs-area-grid .bs-col-head:last-child{padding-right:16px}
  .bs-area-cell{padding:10px 12px;border-bottom:1px solid var(--border);display:flex;align-items:center;min-width:0}
  .bs-area-cell:first-child{padding-left:16px}
  .bs-area-cell:last-child{padding-right:16px}
  .bs-area-row:last-of-type .bs-area-cell{border-bottom:0}

  .bs-input,.bs-select{width:100%;border:1px solid var(--border);background:var(--surface);border-radius:6px;padding:8px 10px;font-family:var(--font-body);font-size:13px;color:var(--ink);outline:none;transition:border-color 180ms var(--ease),background 180ms var(--ease),box-shadow 180ms var(--ease);min-width:0}
  .bs-input::placeholder{color:var(--muted-2)}
  .bs-input:focus,.bs-select:focus{border-color:var(--flame);background:var(--surface);box-shadow:0 0 0 3px var(--flame-tint)}
  .bs-input.num,.bs-select{font-family:var(--font-mono);font-size:12.5px;letter-spacing:.01em}
  .bs-input.derived{background:var(--bg);color:var(--flame);font-weight:600;border-style:dashed;cursor:default}
  .bs-area-rm{width:24px;height:24px;border-radius:5px;border:1px solid transparent;background:transparent;color:var(--muted-2);display:grid;place-items:center;cursor:pointer;transition:all 180ms var(--ease);justify-self:end}
  .bs-area-rm:hover{background:var(--red-soft);color:var(--red);border-color:var(--red)}
  .bs-area-rm svg{width:10px;height:10px}

  .bs-floor-foot{padding:10px 14px;border-top:1px solid var(--border);background:var(--bg);display:flex;justify-content:space-between;align-items:center;gap:10px}
  .bs-add{appearance:none;border:1px dashed var(--border-strong);background:transparent;color:var(--muted);padding:6px 10px;border-radius:6px;font-family:var(--font-mono);font-size:11px;letter-spacing:.04em;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:all 180ms var(--ease)}
  .bs-add:hover{border-color:var(--ink-soft);color:var(--ink);background:var(--hover)}
  .bs-add svg{width:10px;height:10px}
  .bs-floor-tot{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.02em;color:var(--ink-soft)}
  .bs-floor-tot b{color:var(--flame);font-weight:700;font-size:13px}

  .bs-add-floor{appearance:none;border:1px dashed var(--border-strong);background:transparent;color:var(--muted);padding:12px 16px;border-radius:var(--r-lg);font-family:var(--font-mono);font-size:11.5px;letter-spacing:.04em;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;transition:all 180ms var(--ease);margin-bottom:24px}
  .bs-add-floor:hover{border-color:var(--ink-soft);color:var(--ink);background:var(--hover)}
  .bs-add-floor svg{width:12px;height:12px}

  /* Summary card */
  .bs-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:18px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);position:relative;overflow:hidden}
  .bs-summary::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--flame)}
  .bs-stat{display:flex;flex-direction:column;gap:4px}
  .bs-stat .lbl{font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600}
  .bs-stat .val{font-family:var(--font-display);font-size:30px;font-weight:500;letter-spacing:-.5px;color:var(--ink);line-height:1;font-variant-numeric:tabular-nums}
  .bs-stat .val .unit{font-family:var(--font-mono);font-size:11px;color:var(--muted);margin-left:4px;letter-spacing:.04em;font-weight:500;text-transform:uppercase}
  .bs-stat.flame .val{color:var(--flame)}

  /* Risk profile + benefit form (Travel / Exit Width) */
  .bs-form{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:18px 20px;margin-bottom:18px}
  .bs-form .row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
  .bs-form .row.three{grid-template-columns:repeat(3,1fr)}
  .bs-form .row:last-child{margin-bottom:0}
  .bs-field{display:flex;flex-direction:column;gap:6px;min-width:0}
  .bs-field label{font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600}

  /* Result card */
  .bs-result{background:var(--bg);border:1px solid var(--border);border-radius:var(--r-lg);padding:18px 20px;margin-top:14px;display:flex;align-items:flex-start;gap:18px}
  .bs-result .res-figure{font-family:var(--font-display);font-size:42px;font-weight:500;letter-spacing:-.8px;color:var(--flame);line-height:1;font-variant-numeric:tabular-nums}
  .bs-result .res-figure .unit{font-family:var(--font-mono);font-size:13px;color:var(--muted);letter-spacing:.04em;margin-left:4px;font-weight:500;text-transform:uppercase}
  .bs-result .res-meta{flex:1;font-size:12.5px;line-height:1.6;color:var(--ink-soft)}
  .bs-result .res-meta b{color:var(--ink);font-weight:600}
  .bs-result .res-meta .clause{font-family:var(--font-mono);font-size:11px;color:var(--flame);letter-spacing:.02em}
  .bs-result.warn{border-color:var(--red);background:var(--red-soft)}
  .bs-result.warn .res-figure{color:var(--red)}

  .bs-bench{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
  .bs-bench .pill{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.04em;color:var(--ink-soft);background:var(--surface);border:1px solid var(--border);padding:4px 8px;border-radius:999px}
  .bs-bench .pill b{color:var(--flame);font-weight:700}

  .bs-foot{padding:14px 22px;border-top:1px solid var(--border);background:var(--surface);display:flex;align-items:center;justify-content:space-between;gap:14px;flex:none}
  .bs-foot .bs-note{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.06em;color:var(--muted);text-transform:uppercase;font-weight:600}
  .bs-foot .bs-actions{display:flex;gap:8px}
  .bs-foot button.bs-btn{appearance:none;padding:9px 16px;border-radius:8px;font-family:var(--font-mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;cursor:pointer;border:1px solid var(--border);background:var(--surface);color:var(--ink-soft);transition:all 180ms var(--ease)}
  .bs-foot button.bs-btn:hover{border-color:var(--ink);color:var(--ink)}
  .bs-foot button.bs-btn.primary{background:var(--ink);border-color:var(--ink);color:var(--bg)}
  .bs-foot button.bs-btn.primary:hover{background:var(--flame);border-color:var(--flame)}

  .ctx-scrim{position:fixed;inset:0;background:rgba(20,14,4,.42);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);z-index:70;display:flex;align-items:center;justify-content:center;padding:32px;opacity:0;pointer-events:none;transition:opacity 240ms var(--ease)}
  .ctx-scrim.visible{opacity:1;pointer-events:auto}
  .ctx-modal{width:min(680px,100%);max-height:calc(100vh - 64px);background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);box-shadow:0 24px 64px rgba(20,14,4,.32);display:flex;flex-direction:column;overflow:hidden;transform:translateY(8px);transition:transform 320ms var(--ease)}
  .ctx-scrim.visible .ctx-modal{transform:none}
  .ctx-head{display:flex;align-items:center;gap:14px;padding:18px 22px;border-bottom:1px solid var(--border);flex:none}
  .ctx-head .gxm{width:32px;height:32px;border-radius:7px;background:var(--ink);color:#fff;display:grid;place-items:center;flex:none;font-family:var(--font-mono);font-size:13px;font-weight:600}
  .ctx-head .gxm svg{width:14px;height:14px}
  .ctx-head h2{font-family:var(--font-display);font-size:19px;font-weight:500;letter-spacing:-.3px;color:var(--ink);margin:0;line-height:1.2}
  .ctx-head .ctx-sub{font-size:11.5px;color:var(--muted);margin-top:1px;font-family:var(--font-mono);letter-spacing:.04em;text-transform:uppercase;font-weight:600}
  .ctx-head .ctx-step-pill{margin-left:auto;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);background:var(--bg);border:1px solid var(--border);padding:4px 10px;border-radius:999px;font-weight:600;flex:none}
  .ctx-head .ctx-step-pill b{color:var(--ink);font-weight:700}
  .ctx-close{width:30px;height:30px;border-radius:var(--r);border:1px solid var(--border);background:var(--surface);color:var(--ink-soft);display:grid;place-items:center;transition:all 180ms var(--ease);flex:none}
  .ctx-close:hover{background:var(--red-soft);color:var(--red);border-color:var(--red)}
  .ctx-close svg{width:11px;height:11px}

  .ctx-body{flex:1;overflow-y:auto;padding:22px 26px;background:var(--bg)}
  .ctx-body::-webkit-scrollbar{width:6px}.ctx-body::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:999px}

  .ctx-step{display:none;animation:msgIn 320ms var(--ease) both}
  .ctx-step.active{display:block}
  .ctx-intro{font-size:13.5px;line-height:1.55;color:var(--ink-soft);margin:0 0 18px;max-width:560px}

  .ctx-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .ctx-card{display:flex;flex-direction:column;gap:10px;padding:20px 18px;border:1.5px solid var(--border);border-radius:var(--r-lg);background:var(--surface);cursor:pointer;text-align:left;transition:border-color 200ms var(--ease),background 200ms var(--ease),transform 180ms var(--ease),box-shadow 200ms var(--ease)}
  .ctx-card:hover{border-color:var(--border-strong);box-shadow:var(--shadow-soft)}
  .ctx-card.selected{border-color:var(--ink);background:var(--surface);box-shadow:0 0 0 2px rgba(31,26,20,.06)}
  .ctx-card .ctx-card-icon{width:40px;height:40px;border-radius:var(--r);background:var(--bg);border:1px solid var(--border);display:grid;place-items:center;color:var(--ink-soft)}
  .ctx-card.selected .ctx-card-icon{background:var(--ink);border-color:var(--ink);color:#fff}
  .ctx-card .ctx-card-icon svg{width:18px;height:18px}
  .ctx-card .ctx-card-name{font-family:var(--font-display);font-size:18px;font-weight:500;letter-spacing:-.2px;color:var(--ink)}
  .ctx-card .ctx-card-desc{font-size:12px;line-height:1.5;color:var(--muted)}

  .ctx-q{padding:18px 0 6px;border-bottom:1px solid var(--border)}
  .ctx-q:last-of-type{border-bottom:0}
  .ctx-q-head{display:flex;align-items:baseline;gap:10px;margin-bottom:10px}
  .ctx-q-num{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.04em;color:var(--muted-2);font-weight:600;width:18px;flex:none}
  .ctx-q-label{font-size:13.5px;font-weight:600;color:var(--ink);letter-spacing:-.005em}
  .ctx-q-help{margin-left:auto;font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted-2);font-weight:500}
  .ctx-q-help.required{color:var(--ink-soft)}

  .ctx-opts{display:flex;flex-wrap:wrap;gap:6px}
  .ctx-opt{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;font-size:12px;font-weight:500;color:var(--ink-soft);background:var(--surface);border:1px solid var(--border);border-radius:999px;cursor:pointer;transition:all 180ms var(--ease);font-family:inherit;letter-spacing:-.005em}
  .ctx-opt:hover{border-color:var(--border-strong);background:var(--hover);color:var(--ink)}
  .ctx-opt.selected{background:var(--ink);color:var(--bg);border-color:var(--ink)}
  .ctx-opt .ctx-opt-dot{width:6px;height:6px;border-radius:999px;background:var(--border-strong);transition:all 180ms var(--ease)}
  .ctx-opt.selected .ctx-opt-dot{background:var(--bg)}
  .ctx-opt.other{color:var(--ink-soft);background:var(--bg);border-color:var(--border-strong);border-style:dashed;font-weight:600}
  .ctx-opt.other:hover{background:var(--hover);color:var(--ink);border-color:var(--ink-soft)}
  .ctx-opt.other.selected{background:var(--ink);color:#fff;border-style:solid;border-color:var(--ink)}
  .ctx-opt.other .ctx-opt-pencil{display:inline-flex;width:11px;height:11px;color:currentColor;flex:none}
  .ctx-opt.other .ctx-opt-pencil svg{width:11px;height:11px}

  .ctx-other-input{margin-top:8px;display:none;animation:msgIn 200ms var(--ease) both}
  .ctx-other-input.visible{display:block}
  .ctx-other-input-shell{position:relative;display:flex;align-items:center;gap:6px;background:var(--surface);border:1.5px solid var(--border-strong);border-radius:var(--r);padding:6px 10px 6px 11px;transition:box-shadow 180ms var(--ease)}
  .ctx-other-input-shell:focus-within{border-color:var(--ink-soft);box-shadow:0 0 0 2px rgba(31,26,20,.06)}
  .ctx-other-input-shell .ctx-other-prefix{display:inline-flex;align-items:center;gap:6px;color:var(--ink-soft);font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;flex:none;padding-right:8px;border-right:1px dashed var(--border-strong)}
  .ctx-other-input-shell .ctx-other-prefix svg{width:11px;height:11px}
  .ctx-other-input-shell input{flex:1;min-width:0;background:transparent;border:0;padding:4px 0;font-size:12.5px;color:var(--ink);outline:0}
  .ctx-other-input-shell input::placeholder{color:var(--muted)}

  .ctx-foot{flex:none;display:flex;align-items:center;justify-content:space-between;padding:14px 22px;border-top:1px solid var(--border);background:var(--surface);gap:14px}
  .ctx-foot-info{font-size:11.5px;color:var(--muted);font-family:var(--font-mono);letter-spacing:.02em}
  .ctx-foot-info b{color:var(--ink);font-weight:700}
  .ctx-foot-actions{display:flex;align-items:center;gap:10px}
  .ctx-btn{display:inline-flex;align-items:center;gap:7px;padding:9px 16px;border-radius:var(--r);font-size:13px;font-weight:600;letter-spacing:-.005em;transition:all 200ms var(--ease);cursor:pointer;border:1px solid transparent;font-family:inherit}
  .ctx-btn.secondary{background:var(--surface);border-color:var(--border);color:var(--ink-soft)}
  .ctx-btn.secondary:hover{background:var(--hover);border-color:var(--border-strong);color:var(--ink)}
  .ctx-btn.primary{background:var(--ink);color:var(--bg)}
  .ctx-btn.primary:hover{background:#000;box-shadow:0 1px 2px rgba(20,14,4,.08)}
  .ctx-btn.primary:disabled{opacity:.45;cursor:not-allowed;background:rgba(31,26,20,.45);box-shadow:none}
  .ctx-btn.primary:disabled:hover{background:rgba(31,26,20,.45);box-shadow:none}
  .ctx-btn.save{background:var(--green);color:#fff}
  .ctx-btn.save:hover{background:var(--green-deep);box-shadow:0 1px 2px rgba(20,14,4,.08)}
  .ctx-btn svg{width:12px;height:12px}

  /* Saved confirmation toast */
  .ctx-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:var(--bg);padding:11px 18px;border-radius:var(--r);font-size:13px;font-weight:500;display:flex;align-items:center;gap:10px;box-shadow:0 8px 24px rgba(20,14,4,.32);z-index:90;opacity:0;pointer-events:none;transition:opacity 240ms var(--ease),transform 320ms var(--ease)}
  .ctx-toast.visible{opacity:1;transform:translateX(-50%) translateY(0);pointer-events:auto}
  .ctx-toast .check{width:18px;height:18px;border-radius:999px;background:var(--green);display:grid;place-items:center;color:#fff;flex:none}
  .ctx-toast .check svg{width:10px;height:10px}

  /* Home-screen badge — quiet, surface-toned with a small green tick. */
  .ph-card .ph-ctx-chip{display:inline-flex;align-items:center;gap:6px;padding:3px 8px;border-radius:999px;background:var(--surface);color:var(--ink-soft);font-family:var(--font-mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;margin-top:8px;align-self:flex-start;border:1px solid var(--border)}
  .ph-card .ph-ctx-chip svg{width:9px;height:9px;color:var(--green-deep)}

  /* Chat status chip — same quiet treatment. */
  .ctx-loaded-chip{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:999px;background:var(--surface);border:1px solid var(--border);color:var(--ink-soft);font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;cursor:pointer;transition:background 180ms var(--ease),border-color 180ms var(--ease)}
  .ctx-loaded-chip:hover{background:var(--hover);border-color:var(--border-strong)}
  .ctx-loaded-chip svg{width:10px;height:10px;color:var(--green-deep)}

  /* In-thread brief preview — shown above each AI answer when context is loaded */
  .ctx-brief-banner{display:none;margin:0 0 10px;padding:8px 12px;background:var(--green-soft);border:1px solid rgba(47,169,116,.3);border-radius:var(--r);font-size:11.5px;color:var(--green-deep);align-items:center;gap:8px;width:fit-content;max-width:100%;cursor:pointer;transition:background 180ms var(--ease)}
  .ctx-brief-banner.visible{display:flex}
  .ctx-brief-banner:hover{background:rgba(47,169,116,.22)}
  .ctx-brief-banner svg{width:11px;height:11px;flex:none}
  .ctx-brief-banner b{font-weight:700;color:var(--green-deep)}

  /* ===== Pin canvas action badges (delete + rename) + name-input error state ===== */
  .pb-pin .pb-pin-del,.pb-pin .pb-pin-rename{position:absolute;width:18px;height:18px;border-radius:999px;border:2px solid #fff;display:grid;place-items:center;cursor:pointer;opacity:0;transform:scale(.6);transition:opacity 160ms var(--ease),transform 200ms var(--ease),background 180ms var(--ease);box-shadow:0 2px 6px rgba(20,14,4,.28);z-index:3}
  .pb-pin .pb-pin-del{top:-8px;right:-8px;background:var(--red);color:#fff}
  .pb-pin .pb-pin-rename{top:-8px;left:-8px;background:var(--surface);color:var(--ink)}
  .pb-pin:hover .pb-pin-del,.pb-pin.selected .pb-pin-del,.pb-pin:hover .pb-pin-rename,.pb-pin.selected .pb-pin-rename{opacity:1;transform:scale(1)}
  .pb-pin .pb-pin-del:hover{background:#a83333}
  .pb-pin .pb-pin-rename:hover{background:var(--flame);color:#fff}
  .pb-pin .pb-pin-del svg,.pb-pin .pb-pin-rename svg{width:9px;height:9px}

  .pb-pin-name-input.error{border-color:var(--red);animation:nameShake 360ms var(--ease)}
  .pb-pin-name-input.error input::placeholder{color:var(--red)}
  @keyframes nameShake{0%,100%{transform:translate(-50%,0)}25%{transform:translate(calc(-50% - 5px),0)}75%{transform:translate(calc(-50% + 5px),0)}}
  .pb-pin-name-error{position:absolute;transform:translate(-50%,0);background:var(--red);color:#fff;font-family:var(--font-mono);font-size:10px;letter-spacing:.04em;font-weight:600;padding:3px 7px;border-radius:3px;white-space:nowrap;box-shadow:0 2px 6px rgba(168,51,51,.32);pointer-events:none;animation:msgIn 220ms var(--ease) both;z-index:12}
  .pb-pin-name-error::after{content:"";position:absolute;left:50%;top:-4px;transform:translateX(-50%) rotate(45deg);width:7px;height:7px;background:var(--red)}

  @media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0s!important;transition-duration:0s!important}}
  /* BS 9999 calculator mount — host React app inside the modal directly */
  #bs-frame{flex:1;width:100%;height:100%;border:0;background:var(--bg);display:block}

  /* ── Projects Landing ──────────────────────────────────────────────
     Cold-entry full-view screen (js/projects.js show/hideProjectsLanding).
     z-index:50 keeps it under .modal-backdrop (100) so the New-project
     modal opens over it. Reuses .greeting/.soft/.deck + gx-chrome chrome. */
  /* ── Launcher ─────────────────────────────────────────────────────────────
     The front door: Guide-x is three products sharing one account, and this is
     where you pick one. Deliberately the emptiest screen in the app — one
     heading and three cards, nothing to read past.

     Follows the Stitch "Aetheric Minimalist" design the report screen already
     uses: white chrome on a grey shell, hairline borders, no shadows, and the
     brand green as a single accent that appears on hover and nowhere else. */
  .gx-launcher{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;background:var(--bg)}
  .gx-launcher-bar{flex:none;display:flex;align-items:center;justify-content:space-between;height:64px;padding:0 24px;background:var(--surface);border-bottom:1px solid var(--border)}
  .gx-launcher-body{flex:1;overflow-y:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 40px;animation:fadeUp 500ms var(--ease) both}
  .gx-launcher-title{margin:0 0 8px;font-family:var(--font-display);font-size:40px;font-weight:700;letter-spacing:-.03em;color:var(--ink);text-align:center}
  .gx-launcher-deck{margin:0 0 48px;font-size:14px;color:var(--muted);text-align:center}
  .gx-launcher-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;width:100%;max-width:1040px}
  .gx-launcher-card{
    display:flex;flex-direction:column;align-items:stretch;text-align:left;
    min-height:300px;padding:24px;
    background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);
    font-family:var(--font);color:var(--ink);cursor:pointer;
    transition:border-color 180ms var(--ease),background 180ms var(--ease)
  }
  button.gx-launcher-card:hover{border-color:var(--flame);background:var(--paper)}
  button.gx-launcher-card:focus-visible{outline:none;border-color:var(--green);box-shadow:0 0 0 3px var(--flame-tint)}
  .gx-launcher-icon{width:26px;height:26px;color:var(--green);margin-bottom:14px;flex:none}
  .gx-launcher-card h2{margin:0 0 8px;font-family:var(--font-display);font-size:19px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
  .gx-launcher-card p{margin:0;font-size:13px;line-height:1.55;color:var(--muted)}
  .gx-launcher-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:18px;border-top:1px solid var(--border)}
  .gx-launcher-chips span{font-size:10.5px;font-weight:600;letter-spacing:.02em;color:var(--muted);background:var(--sidebar);border-radius:var(--r-sm);padding:4px 8px}
  .gx-launcher-card[hidden]{display:none}
  /* The version mark on a card (Fire Strategy Draft, v2.1; from the
     co-founder's copy, 18 Oct 2026). A soft light sweeps across the pill
     once, three seconds after the screen opens, then every three seconds
     after. Hovering the pill opens a short note on what the version does
     better. FRAEW carries the same pill, "v2.1", with no note (owner,
     27 Oct 2026), and FRAEW Audits "v1.3" (owner, 2 Nov 2026). */
  .gx-launcher-card.has-version{position:relative}
  .gx-version{position:absolute;top:20px;right:20px;z-index:5}
  .gx-version-pill{
    position:relative;overflow:hidden;display:inline-flex;align-items:center;
    font-size:10.5px;font-weight:700;letter-spacing:.04em;line-height:1;
    color:var(--green);background:var(--green-soft);border:1px solid rgba(47,156,88,.22);
    border-radius:var(--r-pill);padding:5px 9px;cursor:help
  }
  .gx-version-pill.gx-version-plain{cursor:default}
  .gx-version-pill::after{
    content:"";position:absolute;top:0;bottom:0;left:0;width:60%;
    background:linear-gradient(105deg,transparent 0%,rgba(255,255,255,.85) 50%,transparent 100%);
    transform:translateX(-160%);pointer-events:none;
    animation:gxVersionSweep 4.2s var(--ease) 3s infinite
  }
  @keyframes gxVersionSweep{0%{transform:translateX(-160%)}28%,100%{transform:translateX(260%)}}
  .gx-version-note{
    position:absolute;top:calc(100% + 10px);right:0;width:340px;max-width:calc(100vw - 44px);
    display:flex;flex-direction:column;gap:10px;padding:16px 18px;
    background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);
    box-shadow:var(--shadow-lift);text-align:left;cursor:default;
    opacity:0;visibility:hidden;transform:translateY(-4px);pointer-events:none;
    transition:opacity 180ms var(--ease),transform 180ms var(--ease),visibility 0s linear 180ms
  }
  .gx-version:hover .gx-version-note{
    opacity:1;visibility:visible;transform:none;
    transition:opacity 180ms var(--ease),transform 180ms var(--ease),visibility 0s
  }
  .gx-version-head{font-family:var(--font-display);font-size:14px;font-weight:700;letter-spacing:-.01em;color:var(--ink)}
  .gx-version-lede{font-size:12.5px;line-height:1.5;color:var(--ink-soft)}
  .gx-version-list{display:flex;flex-direction:column;gap:7px;padding-top:10px;border-top:1px solid var(--border)}
  .gx-version-list span{position:relative;padding-left:14px;font-size:12px;line-height:1.5;color:var(--muted)}
  .gx-version-list span::before{content:"";position:absolute;left:0;top:.6em;width:5px;height:5px;border-radius:50%;background:var(--green)}
  .gx-version-list b{font-weight:600;color:var(--ink)}
  .gx-version-foot{padding-top:10px;border-top:1px solid var(--border);font-size:12px;font-weight:600;color:var(--green)}
  @media (prefers-reduced-motion:reduce){.gx-version-pill::after{animation:none;display:none}}
  @media (max-width:980px){.gx-launcher-cards{grid-template-columns:1fr;max-width:520px}.gx-launcher-card{min-height:0}}
  @media (max-width:640px){.gx-launcher-body{padding:32px 22px;justify-content:flex-start}.gx-launcher-title{font-size:30px}}

  /* Back to the launcher, and the name of the product you are inside. */
  .gf-pl-up{flex:none;width:28px;height:28px;display:grid;place-items:center;border-radius:var(--r-sm);border:0;background:transparent;color:var(--muted);font-size:17px;line-height:1;cursor:pointer;transition:background 160ms var(--ease),color 160ms var(--ease)}
  .gf-pl-up:hover{background:var(--hover);color:var(--ink)}
  .gf-pl-product{font-size:12.5px;font-weight:600;color:var(--muted);border-left:1px solid var(--border);padding-left:10px;margin-left:2px}

  .gf-projects-landing{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;background:var(--bg)}
  /* Billing and Account access borrow .gf-projects-landing for layout, so a
     rule that forces that class up forces them up too — Account access, last
     in the page and so on top, flashed while a report project opened. They
     show ONLY while their own show() has marked them open. The id outranks
     any class rule, !important or not. Every other element carrying
     .gf-projects-landing must be listed here: test-screen-visibility.js. */
  #billingScreen:not(.gf-screen-open),#accessScreen:not(.gf-screen-open),#noAccessScreen:not(.gf-screen-open){display:none!important}
  .gf-pl-bar{flex:none;display:flex;align-items:center;justify-content:space-between;height:60px;padding:0 24px;background:var(--surface);border-bottom:1px solid var(--border)}
  .gf-pl-brand{display:inline-flex;align-items:center;gap:8px}
  .gf-pl-wordmark{font-family:var(--font-display);font-size:17px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
  .gf-pl-bar .gx-chrome-close{flex:none}
  .gf-pl-bar-actions{display:inline-flex;align-items:center;gap:12px}
  /* Log out deliberately reuses .gf-pl-new-btn wholesale, so it is identical
     to the primary "New project" button. The ONE opt-out below is not styling:
     the max-width:520px rule further down stretches .gf-pl-new-btn to
     width:100% for the controls row, which in this 60px header would make the
     button swallow the entire bar. */
  @media (max-width:520px){.gf-pl-bar .gf-pl-logout-btn{width:auto}}
  .gf-pl-scroll{flex:1;overflow-y:auto;overflow-x:hidden}
  .gf-pl-scroll::-webkit-scrollbar{width:6px}
  .gf-pl-scroll::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:999px}
  .gf-pl-inner{width:100%;max-width:1080px;margin:0 auto;padding:64px 40px 80px;animation:fadeUp 500ms var(--ease) both}
  .gf-pl-eyebrow{font-family:var(--font-mono);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-2);margin:0 0 14px}
  .gf-pl-title{margin:0 0 14px}
  .gf-pl-deck{margin:0 0 40px}
  .gf-pl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
  @media (max-width:980px){.gf-pl-grid{grid-template-columns:repeat(2,1fr)}}
  @media (max-width:640px){.gf-pl-grid{grid-template-columns:1fr}.gf-pl-inner{padding:40px 22px 64px}}

  .gf-pl-card{display:flex;flex-direction:column;align-items:stretch;text-align:left;min-height:172px;padding:18px 18px 0;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);font-family:var(--font);color:var(--ink);cursor:pointer;transition:border-color 180ms var(--ease),box-shadow 220ms var(--ease),transform 180ms var(--ease)}
  .gf-pl-card:hover{border-color:var(--border-strong);box-shadow:var(--shadow-soft);transform:translateY(-2px)}
  .gf-pl-card:focus-visible{outline:none;border-color:var(--ink);box-shadow:0 0 0 3px var(--flame-tint)}
  .gf-pl-card:active{transform:translateY(0)}
  /* Opening a project: the clicked card shows it, the rest wait. */
  .gf-pl-card{position:relative;overflow:hidden}
  .gf-pl-card.is-opening{border-color:var(--flame);box-shadow:0 0 0 3px var(--flame-tint)}
  .gf-pl-card.is-opening .gf-pl-open{color:var(--flame-deep);font-weight:600}
  .gf-pl-card.is-opening::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:35%;background:var(--flame);animation:gfCardOpening 1.2s var(--ease) infinite}
  body.gf-project-opening .gf-pl-card:not(.is-opening){opacity:.55;pointer-events:none}
  @keyframes gfCardOpening{from{left:-35%}to{left:100%}}
  @media (prefers-reduced-motion:reduce){.gf-pl-card.is-opening::after{animation:none;width:100%}}
  .gf-pl-thumb{width:44px;height:34px;border-radius:7px;border:1px solid var(--border);background:var(--paper);color:var(--muted-2);display:grid;place-items:center;flex:none}
  .gf-pl-thumb svg{width:18px;height:18px}
  .gf-pl-name{margin:14px 0 0;font-family:var(--font-display);font-size:17px;font-weight:600;letter-spacing:-.01em;color:var(--ink);line-height:1.3;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .gf-pl-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-top:1px solid var(--border);font-family:var(--font-mono);font-size:10px;font-weight:600;letter-spacing:.07em;text-transform:uppercase}
  .gf-pl-updated{color:var(--muted-2)}
  .gf-pl-open{color:var(--muted);transition:color 180ms var(--ease)}
  .gf-pl-open span{display:inline-block;transition:transform 180ms var(--ease)}
  .gf-pl-card:hover .gf-pl-open,.gf-pl-card:focus-visible .gf-pl-open{color:var(--flame-deep)}
  .gf-pl-card:hover .gf-pl-open span{transform:translateX(3px)}
  /* Delete on a project card. Deliberately the SAME shape, size, colours and
     hover behaviour as the ✕ on the dropdown rows (.proj-delete in
     guide-x-adapter.css) - one delete affordance, learned once.
     Hidden until hover or keyboard focus, so a grid of cards stays calm and a
     destructive action is never the first thing the eye lands on. The card is
     position:relative so this can sit in its corner. */
  .gf-pl-card{position:relative}
  .gf-pl-del{position:absolute;top:12px;right:12px;width:22px;height:22px;border-radius:5px;
    display:grid;place-items:center;font-size:11px;line-height:1;cursor:pointer;
    color:var(--muted-2);background:transparent;
    opacity:0;transition:opacity 160ms var(--ease),color 160ms var(--ease),background 160ms var(--ease)}
  .gf-pl-card:hover .gf-pl-del,.gf-pl-del:focus-visible{opacity:1}
  .gf-pl-del:hover{background:var(--red-soft);color:var(--red)}
  .gf-pl-del:focus-visible{outline:none;box-shadow:0 0 0 2px var(--red-soft);color:var(--red)}
  /* Touch has no hover, so it would never appear. Always visible there. */
  @media (hover:none){.gf-pl-del{opacity:1}}

  /* Landing controls row: search (flexible) + New project, pinned above the grid */
  .gf-pl-controls{display:flex;align-items:center;gap:12px;margin:0 0 22px}
  .gf-pl-search{position:relative;flex:1 1 auto;min-width:0}
  .gf-pl-search-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--muted-2);pointer-events:none}
  .gf-pl-search-input{width:100%;height:46px;padding:0 16px 0 40px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);font-family:var(--font);font-size:14px;color:var(--ink);transition:border-color 180ms var(--ease),box-shadow 180ms var(--ease)}
  .gf-pl-search-input::placeholder{color:var(--muted-2)}
  .gf-pl-search-input:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 3px var(--flame-tint)}
  .gf-pl-search-input::-webkit-search-cancel-button{cursor:pointer}
  .gf-pl-new-btn{flex:none;display:inline-flex;align-items:center;gap:8px;height:46px;padding:0 20px;background:var(--ink);border:1px solid var(--ink);border-radius:var(--r-lg);font-family:var(--font-display);font-size:14px;font-weight:600;letter-spacing:-.01em;color:#fff;cursor:pointer;transition:background 200ms var(--ease),border-color 200ms var(--ease),transform 160ms var(--ease),box-shadow 220ms var(--ease)}
  .gf-pl-new-btn:hover{background:var(--green);border-color:var(--green);box-shadow:var(--shadow-soft);transform:translateY(-1px)}
  .gf-pl-new-btn:active{transform:translateY(0)}
  .gf-pl-new-btn:focus-visible{outline:none;box-shadow:0 0 0 3px var(--flame-tint)}
  .gf-pl-new-btn svg{width:16px;height:16px}
  .gf-pl-empty{grid-column:1/-1;padding:36px 8px;text-align:center;font-family:var(--font);font-size:14px;color:var(--muted)}
  @media (max-width:520px){.gf-pl-controls{flex-wrap:wrap}.gf-pl-new-btn{width:100%;justify-content:center}}

  /* ── Billing & subscription screen (Phase 6) ──────────────────────
     The container reuses .gf-projects-landing + .gf-pl-* layout. These
     rules style the card content inside #billingBody. */
  .gf-billing-body{max-width:560px}
  .gf-billing-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);padding:26px 26px 22px}
  .gf-billing-plan{font-family:var(--font-display);font-size:20px;font-weight:700;letter-spacing:-.01em;color:var(--ink);margin:0 0 4px}
  .gf-billing-deck{color:var(--muted);margin:0 0 18px}
  .gf-billing-row{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:11px 0;border-top:1px solid var(--border)}
  .gf-billing-row:first-of-type{border-top:none}
  .gf-billing-row span{color:var(--muted);font-size:14px}
  .gf-billing-row b{color:var(--ink);font-weight:600;text-align:right}
  .gf-billing-action{margin-top:22px;width:100%}
  .gf-billing-note{color:var(--muted-2);font-size:12.5px;line-height:1.5;margin:12px 0 0;text-align:center}
  /* The admin's own seat (Phase 8.4). Set apart from the rows above because
     it is the one control here that changes what the org pays without
     leaving the page. Notes inside it read left-aligned — they are
     explanation, not the centred footnote .gf-billing-note is elsewhere. */
  .gf-billing-seat{margin-top:18px;padding:16px 16px 14px;background:var(--paper);border:1px solid var(--border);border-radius:var(--r-sm)}
  .gf-billing-seat-title{font-weight:600;font-size:14px;color:var(--ink);margin-bottom:4px}
  .gf-billing-seat .gf-billing-note{text-align:left;margin:6px 0 0}
  .gf-billing-seat .gf-billing-action{margin-top:14px}
  /* "Include a seat for me" on the Subscribe screen (Phase 8.3a). Reuses the
     seat card above so the question looks like the switch it replaces. */
  .gf-billing-seat-check{display:flex;align-items:center;gap:9px;cursor:pointer;
    font-weight:600;font-size:14px;color:var(--ink)}
  .gf-billing-seat-check input{width:16px;height:16px;accent-color:var(--flame);cursor:pointer;margin:0}
  /* Before paying (owner, 18 Oct 2026): the seat question in its own box
     above the payment card; the emails the seats are for; then the price
     box, where the seats and the price per seat are what the eye lands on
     and the total is quieter. */
  .gf-billing-seat.gf-billing-seat-top{margin:0 0 16px;background:var(--surface);border-radius:var(--r-xl);padding:16px 18px 14px}
  .gf-billing-people{padding:14px 0 4px;border-top:1px solid var(--border)}
  .gf-billing-person{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--ink-soft);padding:5px 0}
  .gf-billing-person>span:first-child{min-width:0;overflow-wrap:anywhere}
  .gf-billing-price{margin:12px 0 4px;padding:14px 16px;background:var(--paper);border:1px solid var(--border);border-radius:var(--r-lg)}
  .gf-billing-price-row{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:4px 0}
  .gf-billing-price-row>span:first-child{font-size:14px;color:var(--muted)}
  .gf-billing-price-big{font-family:var(--font-display);font-size:20px;font-weight:700;letter-spacing:-.01em;color:var(--ink)}
  .gf-billing-price-unit{font-size:13px;color:var(--muted);font-weight:500}
  .gf-billing-price-total{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-top:12px;padding-top:12px;border-top:1px solid var(--border)}
  .gf-billing-price-total>span:first-child{font-size:14px;font-weight:600;color:var(--ink-soft)}
  .gf-billing-price-total b{font-family:var(--font-display);font-size:17px;font-weight:600;letter-spacing:-.01em;color:var(--ink)}
  .gf-billing-price-when{margin-top:6px}
  /* A setup fee paid today (owner, 18 Oct 2026, option A). */
  .gf-billing-price-fee{margin-top:8px;padding-top:10px;border-top:1px solid var(--border)}
  .gf-billing-price-mid{font-family:var(--font-display);font-size:17px;font-weight:600;color:var(--ink)}
  .gf-billing-then{display:block;font-size:12px;color:var(--muted);margin-top:3px;font-weight:500}
  .gf-billing-sub{display:block;font-size:12px;color:var(--green);margin-top:3px;font-weight:500}
  #billingTotalRow+.gf-billing-terms{margin-top:16px}
  /* Trial cost notice. Deliberately quiet - a tinted panel, not a red alert:
     it is telling a customer what they signed up for, not reporting a fault. */
  .gf-billing-warn{text-align:left;background:var(--flame-tint);border:1px solid var(--border);
    border-radius:var(--r-sm);padding:10px 12px;color:var(--ink);margin-top:14px}
  .gf-billing-loading{color:var(--muted)}
  .gf-billing-error{color:var(--red)}

  /* Closed-access account administration. */
  .gf-access-body{max-width:720px}
  .gf-access-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);padding:24px;margin-bottom:16px}
  .gf-access-summary{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}
  .gf-access-summary strong{font-family:var(--font-display);font-size:20px}
  .gf-access-summary span{display:block;color:var(--muted);font-size:13px;margin-top:4px}
  .gf-access-count{font-weight:700;color:var(--ink);white-space:nowrap}
  /* Account access (owner, 18 Oct 2026): "Organisation admin" as a green
     badge, and "Guidex opens once you've paid." just under Continue to
     payment. */
  .gf-pl-eyebrow.gf-eyebrow-pill{display:inline-flex;align-items:center;font-size:12px;font-weight:700;letter-spacing:.1em;
    color:var(--green);background:var(--green-soft);border:1px solid rgba(47,156,88,.22);border-radius:999px;padding:6px 12px;margin-bottom:18px}
  .gf-billing-note.gf-access-pay-note{margin-top:8px}
  .gf-access-form{display:flex;gap:10px;margin-top:20px}
  .gf-access-form input{flex:1;min-width:0;height:44px;padding:0 13px;border:1px solid var(--border);border-radius:var(--r-sm);font:14px var(--font);background:var(--paper);color:var(--ink)}
  .gf-access-form input:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 3px var(--flame-tint)}
  .gf-access-list{margin-top:12px;border-top:1px solid var(--border)}
  .gf-access-person{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--border)}
  .gf-access-person-main{flex:1;min-width:0}
  .gf-access-person-main b,.gf-access-person-main span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .gf-access-person-main span{font-size:12px;color:var(--muted);margin-top:2px}
  .gf-access-tag{font-size:11px;color:var(--muted);background:var(--paper);border:1px solid var(--border);border-radius:999px;padding:4px 8px}
  .gf-access-remove{border:0;background:none;color:var(--red);font:600 12px var(--font);cursor:pointer;padding:7px}
  .gf-access-empty{color:var(--muted);font-size:13px;padding:16px 0 4px}
  /* The last look before an invitation goes, and the page for someone who may
     not use the tools (owner, 12 Oct 2026). */
  .gf-access-body [hidden]{display:none!important}
  .gf-access-confirm{margin-top:16px;padding:16px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--paper)}
  .gf-access-confirm-line{margin:0;color:var(--ink);font-size:14px;line-height:1.5}
  .gf-access-confirm-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
  .gf-no-access-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
  @media (max-width:600px){.gf-access-form{flex-direction:column}.gf-access-summary{flex-direction:column}.gf-access-form button{width:100%}}