/* ═══════════════════════════════════════════════
   lark.cx Security Assessment — v9
   ═══════════════════════════════════════════════ */
:root {
  --bg: #070600; --panel: #111111; --code: #0d0d0d;
  --white: #ffffff; --text: #d9d9d9; --coral: #ff1053;
  --mauve: #d972ff; --blue: #1098f7; --pumpkin: #fc7a1e;
  --dim: #6d6875; --teal: #34d399; --gold: #ddb44b;
  --border: #6d6875; --red: #e8593c; --green: #34d399;
  --hd: "Bebas Neue", Impact, "Arial Black", sans-serif;
  --body: "Fira Sans Condensed", Calibri, sans-serif;
  --mono: "Fira Mono", Consolas, monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html{font-size:18px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{background:var(--bg);color:var(--text);font-family:var(--body);font-weight:300;font-size:1rem;line-height:1.55}
a{color:var(--blue);text-decoration:none}a:hover{text-decoration:underline}
.page{max-width:1120px;margin:0 auto;padding:2rem 1.25rem}

/* ═══ HERO ═══ */
.hero{margin-bottom:2rem}
.accent-bar{width:8px;min-width:8px;height:72px;background:var(--coral);margin-bottom:.75rem;flex-shrink:0}
.hero h1{font-family:var(--hd);font-size:3rem;line-height:.9;letter-spacing:1px;color:var(--white)}

/* ═══ NAV ═══ */
.progress-bar{display:flex;gap:2px;margin-bottom:14px;height:4px}
.progress-seg{flex:1;background:var(--dim);transition:background .3s}
.progress-seg.done{background:var(--coral)}.progress-seg.cur{background:var(--pumpkin)}
.lnav{display:flex;gap:0;margin-bottom:18px;border:1px solid var(--border);overflow:hidden;transition:all .3s}
.lnav.collapsed{height:0;border:none;margin:0}
.ltab{flex:1;padding:8px 4px;text-align:center;font-family:var(--mono);font-size:.7rem;cursor:pointer;background:var(--panel);color:var(--dim);border-right:1px solid var(--border);text-transform:uppercase;letter-spacing:1px;transition:all .2s}
.ltab:last-child{border-right:none}
.ltab:hover{background:var(--code);color:var(--text)}
.ltab.on{background:var(--coral);color:var(--bg)}
.ltab.done{border-bottom:3px solid var(--teal)}
.ltab .material-icons{font-size:16px;display:block;margin:0 auto 1px}
.nav-toggle{display:none;font-family:var(--mono);font-size:.7rem;color:var(--dim);cursor:pointer;padding:4px 0;margin-bottom:8px;text-transform:uppercase}
.nav-toggle:hover{color:var(--text)}.nav-toggle.vis{display:block}

/* ═══ PANELS ═══ */
.pnl{background:var(--panel);border:1px solid var(--border);padding:20px;margin-bottom:14px}
.pnl h2{font-family:var(--hd);font-size:1.5rem;letter-spacing:1px;color:var(--white);margin-bottom:4px}
.pnl .dsc{color:var(--dim);font-size:.85rem;margin-bottom:14px}
.cia3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-bottom:18px}
.cbox{border:1px solid var(--border);padding:10px}
.cbox h3{font-family:var(--hd);font-size:.95rem;letter-spacing:1px;color:var(--white);margin-bottom:4px;display:flex;align-items:center;gap:6px}
.dt{width:8px;height:8px;display:inline-block;flex-shrink:0}
.dt-c{background:var(--mauve)}.dt-i{background:var(--pumpkin)}.dt-a{background:var(--teal)}
.cbox .sc{font-size:.75rem;color:var(--dim);font-style:italic;padding:5px 7px;background:var(--bg);border-left:3px solid var(--dim)}

/* Questions */
.qb{margin-bottom:14px}
.qb label{display:block;font-size:.88rem;font-weight:700;color:var(--white);margin-bottom:2px}
.qb .qs{font-size:.75rem;color:var(--dim);margin-bottom:6px}
.opts{display:flex;flex-wrap:wrap;gap:5px}
.op{padding:6px 11px;border:1px solid var(--border);background:var(--code);font-family:var(--mono);font-size:.72rem;cursor:pointer;color:var(--dim);transition:all .15s;text-transform:uppercase;letter-spacing:.4px}
.op:hover{border-color:var(--coral);color:var(--text)}
.op.sel{border-color:var(--coral);background:var(--coral);color:var(--bg)}
.vp{margin-top:6px;padding:8px;background:var(--bg);border:1px solid var(--border);display:none}
.vp.vis{display:block}
.vp .vpl{font-family:var(--mono);font-size:.6rem;color:var(--dim);text-transform:uppercase;margin-bottom:4px}
.vchips{display:flex;flex-wrap:wrap;gap:4px}
.vc{padding:3px 7px;border:1px solid var(--border);background:var(--code);font-family:var(--mono);font-size:.58rem;cursor:pointer;color:var(--dim);text-transform:uppercase;transition:all .12s}
.vc:hover{border-color:var(--blue);color:var(--text)}
.vc.sel{border-color:var(--blue);background:rgba(16,152,247,.15);color:var(--blue)}
.navr{display:flex;justify-content:space-between;align-items:center;margin-top:16px}
.btn{padding:8px 20px;font-family:var(--hd);font-size:1rem;letter-spacing:2px;cursor:pointer;border:none;text-transform:uppercase}
.btn-p{background:var(--coral);color:var(--bg)}.btn-p:hover{filter:brightness(.9)}
.btn-g{background:transparent;color:var(--text);border:1px solid var(--border)}.btn-g:hover{background:var(--code)}

/* ═══ FLOATING TIER DROPDOWN (upper-right) ═══ */
.tier-fab{
  position:fixed;top:16px;right:16px;z-index:900;
  display:none;align-items:center;gap:0;
}
.tier-fab.vis{display:flex}
.tier-fab-btn{
  min-height:48px;padding:8px 12px;
  background:var(--panel);border:1px solid var(--border);
  font-family:var(--hd);font-size:.92rem;letter-spacing:1.2px;
  color:var(--dim);cursor:pointer;
  display:flex;align-items:center;gap:8px;text-transform:uppercase;
  transition:all .2s;
  box-shadow:0 8px 24px rgba(0,0,0,.35);
}
.tier-fab-btn:hover{border-color:var(--coral);color:var(--text)}
.tier-fab-btn .material-icons{font-size:18px}
.tier-fab-copy{display:flex;flex-direction:column;align-items:flex-start;line-height:1}
.tier-kicker{font-family:var(--mono);font-size:.58rem;letter-spacing:.08em;color:var(--dim)}
.tier-fab-btn .tier-label{color:var(--white);font-size:1rem}
.tier-fab-btn .tier-sub{font-family:var(--body);font-size:.72rem;letter-spacing:0;color:var(--dim);text-transform:none}
.tier-fab-btn .cart-n{
  background:var(--coral);color:var(--bg);
  font-family:var(--mono);font-size:.55rem;font-weight:700;
  padding:1px 5px;margin-left:4px;display:none;
}
.tier-fab-btn .cart-n.vis{display:inline}
.tier-menu{
  position:absolute;top:44px;right:0;
  background:var(--panel);border:1px solid var(--border);
  min-width:220px;display:none;
  box-shadow:0 8px 24px rgba(0,0,0,.6);
}
.tier-menu.open{display:block}
.tier-opt{
  padding:10px 14px;cursor:pointer;
  font-family:var(--body);font-size:.85rem;color:var(--dim);
  border-bottom:1px solid var(--border);
  transition:all .15s;display:flex;align-items:center;gap:8px;
}
.tier-opt:last-child{border-bottom:none}
.tier-opt:hover{background:var(--code);color:var(--text)}
.tier-opt.on{color:var(--white);background:var(--code)}
.tier-opt .to-dot{width:6px;height:6px;background:var(--coral);display:none}
.tier-opt.on .to-dot{display:block}
.tier-opt .to-sub{font-family:var(--mono);font-size:.6rem;color:var(--dim);margin-left:auto}
.tier-menu-hd{
  padding:10px 14px;font-family:var(--hd);font-size:.92rem;color:var(--dim);
  letter-spacing:1px;border-bottom:1px solid var(--border);text-transform:uppercase;
}
.tier-tools-btn{
  padding:8px 14px;cursor:pointer;font-family:var(--mono);font-size:.68rem;
  color:var(--blue);border-top:1px solid var(--border);
  display:flex;align-items:center;gap:6px;transition:all .15s;
}
.tier-tools-btn:hover{background:var(--code)}
.tier-tools-btn .material-icons{font-size:16px}

/* ═══ RESULTS ═══ */
.res{display:none}.res.vis{display:block}
.minfo{font-size:.72rem;color:var(--dim);margin-bottom:10px}

/* ═══ CHART ═══ */
.chart{margin-bottom:4px}
.chart-label{font-family:var(--mono);font-size:.72rem;color:var(--dim);text-transform:uppercase;letter-spacing:.06em;text-align:center;margin-bottom:10px}
.brow{display:flex;align-items:center;margin-bottom:8px;gap:12px}
.blbl{width:132px;min-width:132px;font-family:var(--mono);font-size:.76rem;text-transform:uppercase;color:var(--dim);text-align:right;line-height:1.15;flex-shrink:0;white-space:normal}
.btrk{flex:1;height:26px;overflow:hidden;border:1px solid var(--border);background:var(--code);position:relative}
.bghost{position:absolute;top:0;left:0;height:100%;width:100%;display:flex;opacity:.18;pointer-events:none}
.bghost-c{background:var(--mauve);height:100%}.bghost-i{background:var(--pumpkin);height:100%}.bghost-a{background:var(--teal);height:100%}
.blive{position:relative;height:100%;display:flex;z-index:1}
.bseg{height:100%;transition:width .55s cubic-bezier(.4,0,.2,1);cursor:default;min-width:0}
.bseg-c{background:var(--mauve)}.bseg-i{background:var(--pumpkin)}.bseg-a{background:var(--teal)}
.legend{display:flex;gap:14px;justify-content:center;margin:4px 0 14px}
.legend span{font-family:var(--mono);font-size:.72rem;color:var(--dim);display:flex;align-items:center;gap:4px}
.legend .sw{width:8px;height:8px}

/* ═══ TOOLTIP ═══ */
.tip{position:fixed;background:var(--panel);border:1px solid var(--border);padding:6px 10px;font-family:var(--mono);font-size:.62rem;color:var(--text);pointer-events:none;z-index:999;max-width:280px;line-height:1.4;display:none}

/* ═══ SIDEBAR ═══ */
.sidebar{
  position:fixed;top:0;right:-320px;width:310px;height:100vh;
  background:var(--panel);border-left:1px solid var(--border);z-index:950;
  display:flex;flex-direction:column;transition:right .3s ease;
  box-shadow:-4px 0 24px rgba(0,0,0,.5);
}
.sidebar.open{right:0}
.sidebar-hd{display:flex;align-items:center;gap:8px;padding:12px;border-bottom:1px solid var(--border)}
.sidebar-hd h2{font-family:var(--hd);font-size:1.2rem;color:var(--white);flex:1}
.sidebar-close{background:transparent;border:1px solid var(--border);color:var(--dim);width:28px;height:28px;padding:0;display:flex;align-items:center;justify-content:center;cursor:pointer;font-family:var(--mono);font-size:1rem}
.sidebar-close:hover{border-color:var(--coral);color:var(--coral)}
.sidebar-body{flex:1;overflow-y:auto;padding:10px 12px}
.sidebar-empty{color:var(--dim);font-style:italic;font-size:.85rem;padding:16px 0}
.sb-group{margin-bottom:10px}
.sb-group-hd{font-family:var(--mono);font-size:.55rem;color:var(--dim);text-transform:uppercase;letter-spacing:1px;padding:2px 0;border-bottom:1px solid rgba(109,104,117,.2);margin-bottom:4px}
.sb-item{padding:3px 0;font-family:var(--mono);font-size:.72rem;color:var(--white)}
.sidebar-ft{padding:10px 12px;border-top:1px solid var(--border);font-family:var(--mono);font-size:.7rem}

/* ═══ DOMAIN REPORT ═══ */
.domain-section{border:1px solid var(--border);margin-bottom:6px;background:var(--panel)}
.domain-hd{display:flex;align-items:center;gap:10px;padding:10px 14px;cursor:pointer;user-select:none}
.domain-hd:hover{background:var(--code)}
.domain-hd .material-icons{font-size:18px;color:var(--dim);transition:transform .2s}
.domain-hd.open .material-icons{transform:rotate(90deg)}
.domain-hd .dh-title{font-family:var(--hd);font-size:1.05rem;letter-spacing:1px;color:var(--white);flex:1}
.domain-body{display:none;padding:0 14px 14px}
.domain-body.open{display:block}
.domain-exp{font-size:.8rem;color:var(--dim);margin-bottom:10px;line-height:1.4}

/* Domain-level tool movers */
.domain-movers{margin-bottom:14px;padding:8px 10px;background:var(--bg);border:1px solid var(--border)}
.domain-movers-hd{font-family:var(--mono);font-size:.55rem;color:var(--dim);text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}
.domain-movers-list{font-family:var(--mono);font-size:.68rem;color:var(--teal);line-height:1.6}

/* Per-CIA block */
.cia-block{margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid rgba(109,104,117,.15)}
.cia-block:last-child{border-bottom:none;padding-bottom:0;margin-bottom:0}
.cia-block-hd{display:flex;align-items:center;gap:8px;margin-bottom:2px}
.cia-block-hd .cia-name{font-family:var(--hd);font-size:.88rem;letter-spacing:1px;color:var(--white)}
.cia-obj{font-size:.72rem;color:var(--dim);margin-bottom:6px;line-height:1.3}
.cia-content{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,320px);gap:12px;align-items:start}
.cia-left{min-width:0}
.cia-right{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.cia-minibar{display:flex;gap:4px;align-items:center;margin-bottom:3px}
.cia-minibar-label{width:58px;font-family:var(--mono);font-size:.68rem;text-transform:uppercase;color:var(--dim);text-align:right;flex-shrink:0}
.cia-minibar-track{flex:1;height:14px;background:var(--code);border:1px solid var(--border);position:relative;overflow:hidden}
.cia-minibar-ghost{position:absolute;top:0;left:0;height:100%;opacity:.2;transition:width .5s cubic-bezier(.4,0,.2,1)}
.cia-minibar-live{position:relative;height:100%;z-index:1;transition:width .5s cubic-bezier(.4,0,.2,1)}
.cia-refs{display:flex;flex-wrap:wrap;gap:6px;max-width:none;justify-content:flex-start;align-content:flex-start}
.cia-ref{padding:3px 7px;border:1px solid var(--border);font-family:var(--mono);font-size:.64rem;color:var(--dim);white-space:nowrap;cursor:default;position:relative;display:inline-flex;align-items:center}
.cia-ref:hover{border-color:var(--blue);color:var(--text)}

/* ═══ FEATURE COMPARE ═══ */
.comp-card{border:1px solid var(--border);background:var(--code);margin-bottom:8px;padding:12px}
.comp-hd{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.comp-arrow{color:var(--teal);font-family:var(--hd);font-size:1.1rem}
.comp-name{font-family:var(--mono);font-size:.86rem}
.comp-name.theirs{color:var(--pumpkin)}.comp-name.ours{color:var(--teal)}
.comp-grid{display:grid;grid-template-columns:minmax(180px,1fr) minmax(96px,auto) minmax(96px,auto);gap:0;font-family:var(--mono);font-size:.76rem}
.comp-grid .cg-label{padding:6px 10px;border-bottom:1px solid var(--border);color:var(--dim);text-transform:none;line-height:1.25}
.comp-grid .cg-them,.comp-grid .cg-us{padding:6px 10px;text-align:center;border-bottom:1px solid var(--border);border-left:1px solid var(--border);line-height:1.25}
.comp-grid .cg-head{color:var(--dim);text-transform:uppercase;font-size:.64rem;border-bottom:2px solid var(--border)}
.feat-yes{color:var(--green);font-weight:700}.feat-no{color:var(--red);font-weight:700}.feat-na{color:var(--dim)}
.feat-bool{display:inline-flex;align-items:center;justify-content:center;min-width:1.6em}
.feat-text{font-size:.84em;letter-spacing:.02em}

/* ═══ COST ═══ */
.cost-row{display:flex;align-items:center;gap:8px;margin-bottom:3px}
.cost-lbl{width:65px;font-family:var(--mono);font-size:.58rem;text-transform:uppercase;color:var(--dim);text-align:right;flex-shrink:0}
.cost-bar{height:20px;transition:width .5s ease;display:flex;align-items:center;padding-left:8px;font-family:var(--mono);font-size:.58rem;color:var(--white);font-weight:700;min-width:50px}
.cost-bar.theirs{background:var(--pumpkin)}.cost-bar.ours{background:var(--teal)}
.cost-assumptions{margin-top:10px;font-family:var(--mono);font-size:.58rem;color:var(--dim);line-height:1.7}
.cost-assumptions .ca-head{color:var(--text);font-weight:700;text-transform:uppercase;font-size:.52rem;letter-spacing:.5px;margin-top:6px;margin-bottom:2px}
.cost-savings{margin-top:10px;font-family:var(--hd);font-size:1.2rem;color:var(--teal);letter-spacing:1px}

/* ═══ STACK BUILDER ═══ */
.kt-section{border-top:1px solid var(--border);padding-top:12px;margin-top:12px}
.kt-section h3{font-family:var(--hd);font-size:.95rem;letter-spacing:1px;color:var(--dim);margin-bottom:6px}
.kt-row{display:flex;flex-wrap:wrap;gap:3px}
.kt{padding:3px 7px;border:1px solid var(--border);background:var(--code);font-family:var(--mono);font-size:.55rem;cursor:pointer;color:var(--dim);transition:all .12s;text-transform:uppercase;user-select:none}
.kt:hover{border-color:var(--blue);color:var(--text)}
.kt.on{border-color:var(--blue);background:rgba(16,152,247,.12);color:var(--blue)}
.kt-link{font-family:var(--mono);font-size:.6rem;color:var(--dim);margin-top:6px}

@media(max-width:900px){
  .page{padding:1.25rem .9rem}
  .blbl{width:110px;min-width:110px;font-size:.68rem}
  .comp-grid{grid-template-columns:minmax(140px,1fr) 88px 88px}
}
@media(max-width:700px){
  .cia3{grid-template-columns:1fr}.ltab{font-size:.6rem;padding:6px 2px}
  .cia-content{grid-template-columns:1fr}.hero h1{font-size:2.2rem}
  .cia-right{align-items:flex-start;max-width:none}
  .cia-refs{max-width:none;justify-content:flex-start}
  .tier-fab{top:10px;right:10px}
  .tier-fab-btn{padding:8px 10px}
  .tier-sub{display:none}
}


/* v10 multi-select survey controls */
.multi-opts{display:flex;flex-wrap:wrap;gap:8px}
.multi{flex:1 1 260px}
.multi-meta{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:8px;flex-wrap:wrap}
.multi-mini{font-family:var(--mono);font-size:.58rem;color:var(--dim);text-transform:uppercase;letter-spacing:.5px}
.multi-actions{display:flex;gap:6px;flex-wrap:wrap}
.mini-btn{background:transparent;border:1px solid var(--border);color:var(--dim);padding:5px 10px;cursor:pointer;font-family:var(--mono);font-size:.62rem}
.mini-btn:hover{border-color:var(--blue);color:var(--text)}
.mini-btn.sel{border-color:var(--blue);background:rgba(16,152,247,.15);color:var(--blue)}