/* LinkedERP Compass V2 — futuristic console theme.
   Brand DNA kept intact: red EE2E24 · navy 213840 · slate 3A5762 ·
   § NN · LABEL mono section labels · linkederp.com / AI-first ERP footer. */
:root {
  --red: #EE2E24;
  --red-glow: rgba(238, 46, 36, .4);
  --navy: #213840;
  --slate: #3A5762;
  --grey: #8FA3AB;
  --bg0: #0A1418;
  --bg1: #10212A;
  --ink: #E8EEF1;
  --ink-dim: #B8C6CC;
  --panel: rgba(33, 56, 64, .42);
  --panel-strong: rgba(33, 56, 64, .72);
  --line: rgba(227, 234, 238, .12);
  --line-strong: rgba(227, 234, 238, .22);
  --ok: #3DD68C;
  --warn: #FFC53D;
  --font: Aptos, "Segoe UI Variable Text", "Segoe UI", system-ui, sans-serif;
  --mono: "Cascadia Mono", Consolas, monospace;
  --radius: 14px;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; min-height: 100%; }
body {
  font-family: var(--font); color: var(--ink); font-size: 15px;
  background:
    radial-gradient(1100px 500px at 85% -10%, rgba(238, 46, 36, .12), transparent 60%),
    radial-gradient(900px 600px at -10% 110%, rgba(58, 87, 98, .35), transparent 60%),
    linear-gradient(160deg, var(--bg1), var(--bg0) 60%);
  background-attachment: fixed;
}
/* faint grid */
body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background-image: linear-gradient(rgba(227,234,238,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(227,234,238,.03) 1px, transparent 1px);
  background-size: 44px 44px;
}
#login-view, #app-view { position: relative; z-index: 1; }

h1, h2, h3, h4 { margin: 0 0 .4em; font-weight: 700; }
button { font-family: var(--font); cursor: pointer; }
input, select, textarea {
  font-family: var(--font); font-size: 14px; color: var(--ink);
  border: 1px solid var(--line-strong); border-radius: 9px; padding: 9px 12px;
  background: rgba(10, 20, 24, .55); width: 100%;
}
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--red); box-shadow: 0 0 0 3px rgba(238,46,36,.18); }
input::placeholder, textarea::placeholder { color: rgba(184,198,204,.45); }
select option { background: var(--bg1); color: var(--ink); }
textarea { resize: vertical; min-height: 130px; }
label { font-size: 12px; font-weight: 600; color: var(--grey); display: block; margin-bottom: 5px; letter-spacing: .02em; }

.hidden { display: none !important; }

/* ---------- atoms ---------- */
.seclabel { font-family: var(--mono); font-weight: 700; font-size: 10.5px; letter-spacing: .12em; color: var(--red); text-transform: uppercase; }
.btn {
  border: none; border-radius: 10px; padding: 10px 18px; font-weight: 650; font-size: 14px;
  transition: all .18s; position: relative;
}
.btn:hover { transform: translateY(-1px); }
.btn:disabled { opacity: .4; cursor: not-allowed; transform: none; }
.btn-red { background: linear-gradient(135deg, #FF4438, var(--red)); color: #fff; box-shadow: 0 4px 18px var(--red-glow); }
.btn-navy { background: linear-gradient(135deg, #2E4B56, var(--navy)); color: var(--ink); border: 1px solid var(--line-strong); }
.btn-slate { background: linear-gradient(135deg, #46697A, var(--slate)); color: #fff; }
.btn-ghost { background: transparent; color: var(--ink-dim); border: 1px solid var(--line-strong); }
.btn-sm { padding: 7px 13px; font-size: 13px; border-radius: 8px; }

.chip {
  display: inline-flex; align-items: center; gap: 5px; border-radius: 999px; padding: 3.5px 12px;
  font-size: 12px; font-weight: 600; background: rgba(58, 87, 98, .45); color: var(--ink-dim);
  border: 1px solid var(--line);
}
.chip.red { background: rgba(238, 46, 36, .16); color: #FF7A72; border-color: rgba(238,46,36,.35); }
.chip.navy { background: rgba(33, 56, 64, .9); color: var(--ink); }
.chip.ok { background: rgba(61, 214, 140, .14); color: var(--ok); border-color: rgba(61,214,140,.3); }
.chip.warn { background: rgba(255, 197, 61, .12); color: var(--warn); border-color: rgba(255,197,61,.3); }
.chip.mono { font-family: var(--mono); font-size: 10.5px; }

.card {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  padding: 20px 22px; margin-bottom: 16px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, .25);
}
.card h3 { font-size: 15.5px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.card .seclabel { display: block; margin-bottom: 8px; }

.callout { border-radius: 10px; padding: 11px 15px; font-size: 13.5px; display: flex; gap: 11px; align-items: baseline; margin: 10px 0; border: 1px solid var(--line); }
.callout .tag { font-family: var(--mono); font-size: 9.5px; font-weight: 700; color: #fff; border-radius: 5px; padding: 2.5px 8px; flex: none; letter-spacing: .08em; }
.callout.note { background: rgba(84, 104, 112, .18); } .callout.note .tag { background: #546870; }
.callout.warn { background: rgba(238, 46, 36, .1); border-color: rgba(238,46,36,.25); } .callout.warn .tag { background: var(--red); }
.callout.info { background: rgba(58, 87, 98, .25); } .callout.info .tag { background: var(--slate); }

.toast {
  position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%);
  background: rgba(33, 56, 64, .95); border: 1px solid var(--line-strong); color: var(--ink);
  padding: 12px 24px; border-radius: 12px; font-size: 14px; z-index: 99; max-width: 72vw;
  backdrop-filter: blur(10px); box-shadow: 0 10px 40px rgba(0,0,0,.5);
}
.toast.error { background: rgba(120, 25, 20, .95); border-color: rgba(238,46,36,.5); }

.spin { display: inline-block; width: 14px; height: 14px; border: 2px solid rgba(255,255,255,.3); border-top-color: #fff; border-radius: 50%; animation: spin .7s linear infinite; vertical-align: -2px; }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes pulse { 0%,100% { opacity: 1 } 50% { opacity: .45 } }
.pulsing { animation: pulse 1.6s ease-in-out infinite; }

table.t { width: 100%; border-collapse: collapse; font-size: 13.5px; }
table.t th {
  background: rgba(13, 27, 33, .85); color: var(--ink-dim); font-family: var(--mono);
  font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em;
  text-align: left; padding: 8px 11px; border-bottom: 1px solid var(--red);
}
table.t td { padding: 8px 11px; border-bottom: 1px solid var(--line); vertical-align: top; }
table.t tr.total td { font-weight: 700; border-top: 2px solid var(--red); color: var(--ink); font-size: 14px; }
table.t input, table.t select { padding: 5px 8px; font-size: 13px; border-radius: 6px; }

/* ---------- login ---------- */
#login-view { display: flex; min-height: 100vh; align-items: stretch; }
.login-brand { flex: 1.1; padding: 64px 68px; display: flex; flex-direction: column; position: relative; overflow: hidden; }
.login-brand .rose {
  position: absolute; right: -120px; top: 40px; width: 420px; height: 420px; opacity: .14; pointer-events: none;
  animation: rosespin 90s linear infinite;
}
@keyframes rosespin { to { transform: rotate(360deg); } }
.logo { font-size: 32px; font-weight: 800; letter-spacing: -.5px; color: var(--ink); }
.logo .red { color: var(--red); text-shadow: 0 0 24px var(--red-glow); }
.login-brand .tagline { font-style: italic; color: var(--grey); margin-top: 2px; }
.login-brand .compass { margin-top: 56px; font-size: 30px; font-weight: 800; }
.login-brand .compass .seclabel { display: block; font-size: 11px; margin-bottom: 8px; }
.login-brand p.lead { color: var(--ink-dim); line-height: 1.6; max-width: 48ch; }
.flowlist { margin-top: 28px; display: flex; flex-direction: column; gap: 10px; }
.flowlist .step { display: flex; gap: 14px; align-items: baseline; font-size: 14px; color: var(--ink-dim); }
.flowlist .num { font-family: var(--mono); font-size: 10.5px; color: var(--red); font-weight: 700; flex: none; width: 24px; }
.login-brand .foot { margin-top: auto; padding-top: 40px; font-size: 12.5px; color: var(--grey); display: flex; gap: 20px; }
.login-form-wrap { flex: 1; display: flex; align-items: center; justify-content: center; padding: 40px 34px; }
.login-card {
  width: 100%; max-width: 460px; background: var(--panel-strong); border: 1px solid var(--line-strong);
  border-radius: 20px; backdrop-filter: blur(20px); padding: 38px 40px;
  box-shadow: 0 20px 70px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.06);
}
.login-card h2 { font-size: 22px; }
.login-card .sub { color: var(--grey); font-size: 13.5px; margin-bottom: 24px; }
.fgroup { margin-bottom: 16px; }
.check-row {
  display: flex; align-items: flex-start; gap: 11px; background: rgba(58, 87, 98, .25);
  border: 1px solid var(--line); border-radius: 11px; padding: 12px 14px; margin: 14px 0; cursor: pointer;
}
.check-row input { width: 17px; height: 17px; margin-top: 2px; accent-color: var(--red); flex: none; }
.check-row .lbl { font-size: 13.5px; font-weight: 650; color: var(--ink); }
.check-row .muted { margin-top: 2px; }
.conn-status { display: flex; gap: 8px; margin-top: 16px; flex-wrap: wrap; }
.demo-link { text-align: center; margin-top: 14px; }
.demo-link a { color: var(--grey); font-size: 12.5px; text-decoration: underline; cursor: pointer; }

/* ---------- app shell ---------- */
#app-view { min-height: 100vh; display: flex; flex-direction: column; }
.topbar {
  display: flex; align-items: center; gap: 16px; padding: 0 26px; height: 58px; flex: none;
  background: rgba(13, 27, 33, .8); backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 10;
}
.topbar .logo { font-size: 18px; }
.topbar .app-name { font-family: var(--mono); font-size: 10.5px; color: var(--grey); border-left: 1px solid var(--line-strong); padding-left: 14px; letter-spacing: .14em; }
.topbar .grow { flex: 1; }
.topbar .uchip { font-size: 13px; color: var(--ink-dim); }
.topbar .btn { padding: 6px 13px; font-size: 12.5px; }
.appfoot {
  color: var(--grey); font-size: 12px; display: flex; justify-content: space-between;
  padding: 12px 26px; flex: none; border-top: 1px solid var(--line); background: rgba(13, 27, 33, .6);
}
.appfoot .mid { font-style: italic; }
#main { flex: 1; padding: 26px 30px; max-width: 1560px; width: 100%; margin: 0 auto; }

/* ---------- pipeline ---------- */
.pipe-head { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.pipe-head h2 { font-size: 20px; margin: 0; }
.kanban { display: flex; gap: 14px; overflow-x: auto; padding-bottom: 16px; align-items: flex-start; }
.kcol {
  flex: none; width: 248px; background: rgba(13, 27, 33, .5); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 12px; backdrop-filter: blur(8px);
}
.kcol h4 { font-size: 12px; display: flex; align-items: center; gap: 8px; margin-bottom: 11px; color: var(--ink-dim); }
.kcol h4 .n { font-family: var(--mono); font-size: 9.5px; color: var(--bg0); background: var(--red); border-radius: 5px; padding: 1.5px 7px; }
.kcol h4 .count { margin-left: auto; color: var(--grey); font-weight: 400; }
.kcard {
  background: var(--panel-strong); border: 1px solid var(--line); border-radius: 11px;
  padding: 12px 14px; margin-bottom: 10px; cursor: pointer; transition: all .18s; position: relative;
}
.kcard:hover { transform: translateY(-2px); border-color: rgba(238,46,36,.45); box-shadow: 0 8px 26px rgba(0,0,0,.35), 0 0 0 1px rgba(238,46,36,.2); }
.kcard.lost { opacity: .5; }
.kcard .co { font-weight: 700; font-size: 13.5px; }
.kcard .meta { color: var(--grey); font-size: 12px; margin: 3px 0 8px; }
.kcard .chips { display: flex; gap: 5px; flex-wrap: wrap; }
.kcard .chip { font-size: 10px; padding: 2px 8px; }
.scorebadge {
  position: absolute; top: 10px; right: 10px; font-family: var(--mono); font-size: 10px; font-weight: 700;
  border-radius: 6px; padding: 2px 7px; background: rgba(13,27,33,.8); border: 1px solid var(--line-strong);
}
.scorebadge.hot { color: var(--ok); border-color: rgba(61,214,140,.4); }
.scorebadge.warm { color: var(--warn); border-color: rgba(255,197,61,.4); }
.scorebadge.cold { color: #FF7A72; border-color: rgba(238,46,36,.4); }

/* ---------- workspace ---------- */
.ws-grid { display: grid; grid-template-columns: 220px 1fr 320px; gap: 20px; align-items: start; }
.ws-head { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; flex-wrap: wrap; }
.ws-head h2 { font-size: 20px; margin: 0; }
.ws-head .chips { display: flex; gap: 6px; flex-wrap: wrap; }
.status-banner { border-radius: 11px; padding: 11px 18px; font-weight: 700; margin-bottom: 16px; border: 1px solid; }
.status-banner.lost { background: rgba(238,46,36,.12); color: #FF7A72; border-color: rgba(238,46,36,.35); }
.status-banner.won, .status-banner.closed { background: rgba(61,214,140,.1); color: var(--ok); border-color: rgba(61,214,140,.3); }

.stepper {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  backdrop-filter: blur(14px); padding: 14px 10px; position: sticky; top: 76px;
}
.step-item { display: flex; gap: 11px; padding: 10px 9px; border-radius: 10px; cursor: pointer; align-items: flex-start; transition: background .15s; }
.step-item:hover { background: rgba(227,234,238,.05); }
.step-item.current { background: rgba(238, 46, 36, .1); border: 1px solid rgba(238,46,36,.3); }
.step-item .dot {
  flex: none; width: 26px; height: 26px; border-radius: 50%; background: rgba(13,27,33,.7);
  color: var(--grey); font-family: var(--mono); font-size: 11px; font-weight: 700;
  display: flex; align-items: center; justify-content: center; border: 1.5px solid var(--line-strong);
}
.step-item.current .dot { background: var(--red); border-color: var(--red); color: #fff; box-shadow: 0 0 16px var(--red-glow); }
.step-item.done .dot { background: var(--slate); border-color: var(--slate); color: var(--ink); }
.step-item .t { font-size: 13px; font-weight: 650; line-height: 1.25; color: var(--ink-dim); }
.step-item.current .t, .step-item.done .t { color: var(--ink); }
.step-item .c { font-family: var(--mono); font-size: 9px; color: var(--grey); letter-spacing: .06em; text-transform: uppercase; margin-top: 2px; }

.stage-panel h2.stage-title { font-size: 19px; margin-bottom: 2px; }
.stage-sub { color: var(--grey); font-size: 13px; margin-bottom: 18px; }

/* agent banner */
.agentbar {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
}
.agentbar .aname { font-size: 16px; font-weight: 800; letter-spacing: .01em; }
.agentbar .aname .emoji { margin-right: 6px; }
.agentbar .atag { color: var(--grey); font-size: 12.5px; font-style: italic; }

/* approval gate */
.gate {
  border: 1.5px dashed var(--line-strong); border-radius: var(--radius); padding: 16px 19px;
  margin: 16px 0; background: rgba(13, 27, 33, .4);
}
.gate .glabel { font-family: var(--mono); font-size: 10px; font-weight: 700; letter-spacing: .1em; color: var(--ink-dim); text-transform: uppercase; margin-bottom: 10px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.gate textarea { min-height: 76px; margin: 8px 0; }
.gate .actions { display: flex; gap: 10px; margin-top: 8px; align-items: center; flex-wrap: wrap; }
.gate.approved { border-color: rgba(61,214,140,.45); background: rgba(61,214,140,.06); }
.gate.changes { border-color: rgba(238,46,36,.5); background: rgba(238,46,36,.07); }

/* decision diamond */
.decision {
  background: var(--panel-strong); border: 1px solid var(--line); border-top: 3px solid var(--red);
  border-radius: var(--radius); padding: 20px 24px; margin: 16px 0; backdrop-filter: blur(14px);
}
.decision .q { font-weight: 750; font-size: 15.5px; display: flex; gap: 10px; align-items: center; }
.decision .q .diamond { color: var(--red); font-size: 18px; text-shadow: 0 0 12px var(--red-glow); }
.decision .actions { display: flex; gap: 10px; margin-top: 14px; flex-wrap: wrap; align-items: center; }
.decision textarea { margin-top: 10px; }

/* transcript picker */
.tr-tabs { display: flex; gap: 0; margin-bottom: 12px; border: 1px solid var(--line-strong); border-radius: 9px; overflow: hidden; width: fit-content; }
.tr-tabs button { background: transparent; border: none; color: var(--grey); font-size: 12.5px; font-weight: 650; padding: 8px 16px; }
.tr-tabs button.active { background: var(--slate); color: #fff; }
.tr-fathom { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; }
.tr-fathom .fgroup { margin: 0; flex: 1; min-width: 180px; }

/* artifacts */
.deck { display: grid; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); gap: 11px; margin-top: 8px; }
.slide { background: rgba(13, 27, 33, .55); border: 1px solid var(--line); border-top: 3px solid var(--slate); border-radius: 10px; padding: 12px 14px; }
.slide .sn { font-family: var(--mono); font-size: 9px; color: var(--grey); letter-spacing: .1em; }
.slide .st { font-weight: 700; font-size: 13px; margin: 4px 0 7px; }
.slide ul { margin: 0; padding-left: 17px; font-size: 12px; color: var(--ink-dim); }
.taglist { display: flex; gap: 6px; flex-wrap: wrap; margin: 6px 0; }
.kv { display: grid; grid-template-columns: 158px 1fr; gap: 7px 16px; font-size: 13.5px; margin: 8px 0; }
.kv dt { color: var(--grey); font-weight: 600; } .kv dd { margin: 0; color: var(--ink-dim); }
.kv dd b { color: var(--ink); }
.script { background: rgba(13, 27, 33, .55); border: 1px solid var(--line); border-radius: 10px; padding: 14px 17px; font-size: 13.5px; line-height: 1.55; color: var(--ink-dim); }
.script b { color: var(--ink); }

/* doc job */
.docjob { display: flex; align-items: center; gap: 12px; background: rgba(13,27,33,.55); border: 1px solid var(--line); border-radius: 10px; padding: 11px 15px; margin: 8px 0; font-size: 13px; flex-wrap: wrap; }
.docjob .jicon { font-size: 17px; }
.docjob .jname { font-weight: 650; font-family: var(--mono); font-size: 11.5px; }
.docjob a { color: var(--ok); font-weight: 700; }

/* BANT panel */
.bantgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; margin: 10px 0; }
.bantcell { background: rgba(13,27,33,.55); border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; }
.bantcell .bh { display: flex; align-items: baseline; gap: 8px; }
.bantcell .bl { font-family: var(--mono); font-size: 10px; letter-spacing: .1em; color: var(--grey); }
.bantcell .bs { font-size: 22px; font-weight: 800; }
.bantcell .bs.good { color: var(--ok); } .bantcell .bs.bad { color: #FF7A72; }
.bantcell .be { font-size: 12px; color: var(--ink-dim); margin-top: 5px; }
.bantcell .bg { font-size: 11.5px; color: var(--warn); margin-top: 4px; }

/* right rail */
.rail .card { padding: 16px 18px; }
.rail h3 { font-size: 13px; }
.synclog { max-height: 360px; overflow-y: auto; }
.sl-item { display: flex; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--line); font-size: 12px; }
.sl-item .ic { flex: none; width: 7px; height: 7px; border-radius: 50%; margin-top: 6px; background: var(--grey); }
.sl-item.ok .ic { background: var(--ok); box-shadow: 0 0 8px rgba(61,214,140,.6); }
.sl-item.error .ic { background: var(--red); box-shadow: 0 0 8px var(--red-glow); }
.sl-item.simulated .ic { background: var(--warn); }
.sl-item .a { font-weight: 650; color: var(--ink-dim); }
.sl-item .d { color: var(--grey); font-size: 11.5px; }
.sl-item .ts { color: rgba(143,163,171,.55); font-family: var(--mono); font-size: 9px; }

/* radar (pipeline strength) */
.radarwrap { display: flex; gap: 14px; align-items: center; }
.radarwrap svg { flex: none; }
.radar-axes { flex: 1; display: flex; flex-direction: column; gap: 5px; font-size: 11.5px; }
.radar-axes .ax { display: flex; justify-content: space-between; gap: 8px; color: var(--ink-dim); }
.radar-axes .ax .v { font-family: var(--mono); font-weight: 700; color: var(--ink); }
.radar-axes .ax.na { opacity: .42; }
.strengthbar { height: 7px; border-radius: 4px; background: rgba(13,27,33,.7); margin: 10px 0 4px; overflow: hidden; border: 1px solid var(--line); }
.strengthbar i { display: block; height: 100%; border-radius: 4px; background: linear-gradient(90deg, var(--red), var(--warn) 55%, var(--ok)); }

/* logo image */
.logoimg { height: 26px; width: auto; display: block; }
.logoimg.big { height: 44px; margin-bottom: 4px; }

/* settings panel */
.settings-panel { max-width: 1560px; margin: 14px auto 0; padding: 0 30px; }

/* doc job progress */
.docjob { display: block; }
.docjob .jrow { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.progressbar { height: 8px; border-radius: 5px; background: rgba(13,27,33,.7); border: 1px solid var(--line); overflow: hidden; margin-top: 8px; }
.progressbar i { display: block; height: 100%; border-radius: 5px; background: linear-gradient(90deg, var(--slate), var(--red)); transition: width .8s ease; box-shadow: 0 0 12px var(--red-glow); }
.docjob .jdetail { font-family: var(--mono); font-size: 10px; color: var(--grey); margin-top: 5px; letter-spacing: .03em; }

/* topbar nav */
.topbar .nav { display: flex; gap: 4px; margin-left: 10px; }
.navbtn { background: transparent; border: 1px solid transparent; color: var(--grey); font-size: 13px; font-weight: 650; padding: 7px 13px; border-radius: 9px; }
.navbtn:hover { color: var(--ink); border-color: var(--line-strong); }

/* home / mission select */
.home-wrap { max-width: 980px; margin: 7vh auto 0; }
.home-head h2 { font-size: 26px; margin-top: 6px; }
.home-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 26px; }
@media (max-width: 1180px) { .home-grid { grid-template-columns: 1fr 1fr; } }
.home-card {
  background: var(--panel-strong); border: 1px solid var(--line-strong); border-radius: 20px;
  padding: 34px 32px; cursor: pointer; transition: all .2s; backdrop-filter: blur(16px);
  box-shadow: 0 12px 44px rgba(0,0,0,.35);
}
.home-card:hover { transform: translateY(-4px); border-color: rgba(238,46,36,.5); box-shadow: 0 18px 60px rgba(0,0,0,.45), 0 0 0 1px rgba(238,46,36,.25); }
.home-card .hc-emoji { font-size: 44px; margin-bottom: 12px; }
.home-card h3 { font-size: 20px; }
.home-card p { color: var(--ink-dim); font-size: 14px; line-height: 1.55; min-height: 64px; }
.home-card.hawk { background: linear-gradient(160deg, rgba(238,46,36,.10), var(--panel-strong) 55%); }
.home-card.beacon { background: linear-gradient(160deg, rgba(255,197,61,.10), var(--panel-strong) 55%); }
@media (max-width: 860px) { .home-grid { grid-template-columns: 1fr; } }

/* nighthawk mission control */
.nh-hero {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px;
  background: var(--panel-strong); border: 1px solid var(--line-strong); border-radius: var(--radius);
  padding: 20px 22px; margin-bottom: 16px; backdrop-filter: blur(14px);
}
.nh-cell label { font-family: var(--mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.nh-big { font-family: var(--mono); font-size: 30px; font-weight: 800; color: var(--ink); margin: 4px 0; }
.nh-dim { color: var(--grey); font-size: 16px; font-weight: 600; }
.nh-mix { flex: 1; min-width: 220px; }
.flowrail { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 10px; margin-top: 10px; }
.fr-item { display: flex; gap: 11px; align-items: flex-start; background: rgba(13,27,33,.5); border: 1px solid var(--line); border-radius: 10px; padding: 11px 13px; }
.fr-num { font-family: var(--mono); font-size: 10px; font-weight: 700; color: var(--red); margin-top: 3px; }
.fr-icon { font-size: 17px; }
.fr-item b { font-size: 13px; }
.fr-item .muted { font-size: 11.5px; line-height: 1.45; }

/* economics strip */
.eco-strip { display: flex; align-items: stretch; gap: 14px; margin-top: 12px; flex-wrap: wrap; }
.eco-cell { flex: 1; min-width: 180px; background: rgba(13,27,33,.5); border: 1px solid var(--line); border-radius: 10px; padding: 12px 15px; }
.eco-cell label { font-family: var(--mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.eco-big { font-family: var(--mono); font-size: 24px; font-weight: 800; margin: 4px 0; }
.eco-arrow { align-self: center; color: var(--red); font-size: 20px; font-weight: 800; text-shadow: 0 0 10px var(--red-glow); }

/* usage panel */
.usagebox { margin: 0 0 16px; }
.usagebox summary { cursor: pointer; font-size: 13px; font-weight: 650; color: var(--ink-dim); padding: 11px 18px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); }
.usagebox summary:hover { color: var(--ink); }

/* structured ICP editors */
.prow { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.pnum {
  flex: none; min-width: 34px; text-align: center; font-family: var(--mono); font-size: 10.5px;
  font-weight: 700; color: var(--ink); background: rgba(58,87,98,.5); border: 1px solid var(--line);
  border-radius: 6px; padding: 5px 6px;
}
.pnum.red { background: rgba(238,46,36,.14); color: #FF7A72; border-color: rgba(238,46,36,.3); }
.prow input { padding: 7px 10px; font-size: 13px; }
.prow .prow-del { padding: 4px 9px; flex: none; }
.stars { flex: none; cursor: pointer; user-select: none; letter-spacing: 1px; font-size: 16px; }
.stars i { font-style: normal; color: var(--warn); text-shadow: 0 0 8px rgba(255,197,61,.4); }
.stars i.off { color: rgba(143,163,171,.3); text-shadow: none; }
.stars i:hover { transform: scale(1.15); display: inline-block; }

/* nighthawk run phases */
.nh-phases { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 12px; }
.nh-phase { font-family: var(--mono); font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--grey); padding: 4px 10px; border: 1px solid var(--line); border-radius: 999px; }
.nh-phase.done { color: var(--ok); border-color: rgba(61,214,140,.4); }
.nh-phase.now { color: #fff; background: var(--red); border-color: var(--red); box-shadow: 0 0 12px var(--red-glow); animation: pulse 1.6s ease-in-out infinite; }
.nh-arrow { color: rgba(143,163,171,.4); font-size: 11px; }
.rv-detail td { background: rgba(13,27,33,.45); }

/* step architecture */
.stepline { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.stepnum {
  flex: none; width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  font-family: var(--mono); font-size: 13px; font-weight: 800; color: #fff;
  background: linear-gradient(135deg, #FF4438, var(--red)); box-shadow: 0 0 14px var(--red-glow);
}
.stepline .aname { font-size: 15.5px; font-weight: 800; }
.stepline .aname .emoji { margin-right: 6px; }
.stepline .atag { color: var(--grey); font-size: 12px; font-style: italic; }
.card.locked { opacity: .45; pointer-events: none; filter: saturate(.6); }

/* ⚡ token report (leadership view) */
.trow { display: flex; gap: 16px; align-items: stretch; flex-wrap: wrap; }
.trow .card { margin-bottom: 0; }
.tk-bars { display: flex; align-items: flex-end; gap: 6px; margin-top: 14px; }
.tk-day { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.tk-col {
  display: flex; flex-direction: column; justify-content: flex-end; width: 100%; max-width: 36px; height: 122px;
  background: rgba(13,27,33,.45); border: 1px solid var(--line); border-radius: 6px 6px 3px 3px; overflow: hidden;
}
.tk-seg { width: 100%; flex: none; }
.tk-seg.nh { background: linear-gradient(180deg, #FF4438, var(--red)); }
.tk-seg.pipe { background: linear-gradient(180deg, #4A6B78, var(--slate)); }
.tk-seg.docs { background: linear-gradient(180deg, #A4B6BD, var(--grey)); }
.tk-val { font-family: var(--mono); font-size: 9px; color: var(--ink-dim); height: 12px; line-height: 12px; }
.tk-day label { font-family: var(--mono); font-size: 9.5px; color: var(--grey); }
.tk-dot { display: inline-block; width: 9px; height: 9px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
.tk-dot.nh { background: var(--red); }
.tk-dot.pipe { background: var(--slate); }
.tk-dot.docs { background: var(--grey); }
.tk-share { margin-top: 14px; }
.tk-share-head { display: flex; justify-content: space-between; align-items: baseline; font-size: 13.5px; font-weight: 650; margin-bottom: 5px; }
.tk-share-track { height: 10px; background: rgba(13,27,33,.6); border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.tk-share-fill { height: 100%; border-radius: 6px; transition: width .4s ease; }
.tk-share-fill.nh { background: linear-gradient(90deg, #B3221A, var(--red)); }
.tk-share-fill.pipe { background: linear-gradient(90deg, #2C424B, var(--slate)); }
.tk-share-fill.docs { background: linear-gradient(90deg, #6E828A, var(--grey)); }
.tk-share-fill.bc { background: linear-gradient(90deg, #C79A2A, var(--warn)); }
.tk-seg.bc { background: linear-gradient(180deg, #FFD66B, var(--warn)); }
.tk-dot.bc { background: var(--warn); }
.tk-month { cursor: pointer; }
.tk-month:hover { border-color: var(--line-strong); color: var(--ink); }

/* 🗞️ beacon (client newsletters · AI_Kallol) — two-report layout */
.bx-life {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  background: var(--panel-strong); border: 1px solid var(--line-strong); border-radius: var(--radius);
  padding: 12px 18px; margin-bottom: 14px; backdrop-filter: blur(12px);
}
.bx-stage {
  display: flex; align-items: center; gap: 7px; font-size: 13.5px; font-weight: 650; color: var(--ink-dim);
  background: rgba(13, 27, 33, .5); border: 1px solid var(--line); border-radius: 999px; padding: 7px 16px;
}
.bx-stage b { font-family: var(--mono); font-size: 14px; color: var(--ink); }
.bx-stage.ok { border-color: rgba(61, 214, 140, .55); color: var(--ok); background: rgba(61, 214, 140, .10); }
.bx-stage.ok b { color: var(--ok); }
.bx-stage.warn { border-color: rgba(255, 197, 61, .45); color: var(--warn); background: rgba(255, 197, 61, .08); }
.bx-arrow { color: var(--red); font-weight: 800; font-size: 15px; }

/* ─── ambient animation layer (home + login) ─────────────────────────── */
@keyframes orbFloat { 0%, 100% { transform: translate(0, 0) scale(1); } 50% { transform: translate(46px, -34px) scale(1.07); } }
@keyframes orbFloat2 { 0%, 100% { transform: translate(0, 0) scale(1); } 50% { transform: translate(-38px, 30px) scale(.94); } }
@keyframes ringPulse { 0%, 100% { opacity: .10; transform: scale(1); } 50% { opacity: .22; transform: scale(1.05); } }
@keyframes sweep { to { transform: rotate(360deg); } }
@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }

.home-bg, .login-bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.home-bg { position: fixed; }
.home-wrap > *:not(.home-bg), .login-brand, .login-form-wrap { position: relative; z-index: 1; }
.orb { position: absolute; border-radius: 50%; filter: blur(58px); }
.orb.o1 { width: 480px; height: 480px; top: -140px; right: -90px; background: radial-gradient(circle, rgba(238,46,36,.55), transparent 66%); animation: orbFloat 14s ease-in-out infinite; }
.orb.o2 { width: 600px; height: 600px; bottom: -230px; left: -170px; background: radial-gradient(circle, rgba(74,123,144,.65), transparent 66%); animation: orbFloat2 19s ease-in-out infinite; }
.orb.o3 { width: 360px; height: 360px; top: 36%; left: 55%; background: radial-gradient(circle, rgba(255,197,61,.28), transparent 66%); animation: orbFloat 24s ease-in-out infinite reverse; }
.hb-ring { position: absolute; border-radius: 50%; border: 1px solid rgba(227,234,238,.22); animation: ringPulse 8s ease-in-out infinite; }
.hb-ring.hr1 { width: 640px; height: 640px; top: 6%; right: -190px; }
.hb-ring.hr2 { width: 400px; height: 400px; top: 20%; right: -60px; animation-delay: 3s; border-color: rgba(238,46,36,.22); }
.hb-sweep {
  position: absolute; width: 980px; height: 980px; top: -280px; right: -450px; border-radius: 50%;
  background: conic-gradient(from 0deg, transparent 0deg, rgba(238,46,36,.12) 14deg, transparent 55deg);
  animation: sweep 30s linear infinite;
}

.home-wrap { position: relative; }
.home-head { animation: fadeUp .45s ease both; }
.home-card { animation: fadeUp .5s ease both; }
.home-grid .home-card:nth-child(2) { animation-delay: .09s; }
.home-grid .home-card:nth-child(3) { animation-delay: .18s; }
#home-eco { animation: fadeUp .55s ease both; animation-delay: .26s; }

#login-view { position: relative; overflow: hidden; }
.login-brand, .login-form-wrap { position: relative; z-index: 1; }
.flowlist .num { width: 26px; font-size: 14px; }
.flowlist .step { animation: fadeUp .5s ease both; }
.flowlist .step:nth-child(1) { animation-delay: .10s; }
.flowlist .step:nth-child(2) { animation-delay: .20s; }
.flowlist .step:nth-child(3) { animation-delay: .30s; }
.flowlist .step:nth-child(4) { animation-delay: .40s; }
.login-card { animation: fadeUp .55s ease both; animation-delay: .15s; }
.login-brand .compass, .login-brand p.lead { animation: fadeUp .5s ease both; }
.login-brand .rose { opacity: .22; }
.login-card { box-shadow: 0 18px 60px rgba(0,0,0,.45); }
@keyframes glowPulse { 0%, 100% { box-shadow: 0 18px 60px rgba(0,0,0,.45); } 50% { box-shadow: 0 18px 70px rgba(238,46,36,.18); } }
.login-card { animation: fadeUp .55s ease both, glowPulse 6s ease-in-out 1s infinite; }
@media (prefers-reduced-motion: reduce) {
  .orb, .hb-ring, .hb-sweep, .login-brand .rose, .login-card { animation: none; }
}
.bc-frame { width: 100%; height: 620px; border: 1px solid var(--line); border-radius: 10px; background: #eef1f4; }
.bx-pick { width: 15px; height: 15px; accent-color: var(--red); }
.bx-preset { cursor: pointer; }
.bx-preset:hover { border-color: var(--line-strong); color: var(--ink); }
.bx-detail > td { background: rgba(13, 27, 33, .5); padding: 14px !important; }
.bx-panel { display: flex; gap: 16px; align-items: stretch; flex-wrap: wrap; }
.bx-side { width: 330px; flex: none; display: flex; flex-direction: column; }
.bx-side textarea { width: 100%; }
.bx-edit { padding: 5px 8px; font-size: 12.5px; border-radius: 6px; }
input.bx-edit::placeholder { color: var(--warn); }
.bx-matrix th, .bx-matrix td { padding: 6px 5px; text-align: center; }
.bx-matrix th.bx-sticky, .bx-matrix td.bx-sticky {
  position: sticky; left: 0; z-index: 1; text-align: left; min-width: 170px;
  background: #101F27; box-shadow: 2px 0 6px rgba(0,0,0,.35);
}
/* frozen header: the week-number row stays pinned to the top while scrolling rows */
.bx-matrix thead th { position: sticky; top: 0; z-index: 4; background: #101F27; box-shadow: 0 2px 6px rgba(0,0,0,.4); }
/* corner (Customer header) pinned on BOTH axes, above everything else */
.bx-matrix thead th.bx-sticky { top: 0; left: 0; z-index: 6; }
.bx-cell { cursor: pointer; font-size: 13px; border-radius: 5px; }
.bx-cell:hover { background: rgba(58, 87, 98, .35); }
.bx-cell.cur { outline: 1px solid var(--red); outline-offset: -2px; }
.bx-cell.sel { background: rgba(238, 46, 36, .18); }
.bx-ovr { font-size: 9px; color: var(--warn); margin-left: 1px; vertical-align: super; }
.st-sent { color: var(--ok); font-weight: 800; }
.st-app { color: #4FA3E3; font-weight: 800; }
.st-draft { color: var(--warn); font-weight: 800; }
.st-plan { color: var(--grey); }
.st-skip { color: var(--red); font-weight: 800; }
.optstep { margin-bottom: 16px; }
.optstep summary { cursor: pointer; font-size: 13.5px; font-weight: 650; color: var(--ink-dim); padding: 12px 18px; background: var(--panel); border: 1px dashed var(--line-strong); border-radius: var(--radius); }
.optstep summary:hover { color: var(--ink); }
.optstep.locked { opacity: .45; pointer-events: none; }
.agentprog { margin: 10px 0 4px; }
textarea.cmt { min-height: 64px; }

/* meeting library */
.mlist { display: flex; flex-direction: column; gap: 6px; margin: 8px 0; }
.mitem { display: flex; align-items: center; gap: 8px; }
.mitem .chip { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mitem .m-del { padding: 2px 8px; }
.adhoc-wrap { margin: 0 0 16px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 12px 18px; backdrop-filter: blur(10px); }
.adhoc-wrap summary { cursor: pointer; font-size: 13px; font-weight: 650; color: var(--ink-dim); }
.adhoc-wrap summary:hover { color: var(--ink); }
.adhoc-wrap .card { margin: 12px 0 4px; }

/* score explainer */
.scorehelp { margin-top: 10px; }
.scorehelp summary { cursor: pointer; font-size: 11.5px; color: var(--grey); font-family: var(--mono); letter-spacing: .04em; }
.scorehelp summary:hover { color: var(--ink-dim); }
.scorehelp .shbody { font-size: 11.5px; color: var(--ink-dim); line-height: 1.5; background: rgba(13,27,33,.55); border: 1px solid var(--line); border-radius: 9px; padding: 10px 13px; margin-top: 8px; }
.scorehelp .shbody p { margin: 6px 0; }
.scorehelp .shbody b { color: var(--ink); }

.muted { color: var(--grey); font-size: 12.5px; }
.mt0 { margin-top: 0; } .mt8 { margin-top: 8px; } .mt14 { margin-top: 14px; }
.row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.grow { flex: 1; }
.frow { display: flex; gap: 12px; flex-wrap: wrap; } .frow .fgroup { flex: 1; min-width: 150px; }

/* calculator */
.rates-header { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; margin: 10px 0; }
.rates-header .rcell { background: rgba(13,27,33,.55); border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; }
.rates-header .rcell label { font-size: 10px; font-family: var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.calc-table td { padding: 5px 6px; }
.calc-table .del-row:hover { background: rgba(227,234,238,.03); }
.calc-table .auto { color: var(--grey); font-family: var(--mono); font-size: 11px; }
.num { text-align: right; font-variant-numeric: tabular-nums; }

@media (max-width: 1180px) { .ws-grid { grid-template-columns: 1fr; } .stepper { position: static; display: flex; flex-wrap: wrap; } }

/* ================= BEACON V2 REVAMP (2026-07-04) ================= */
/* ---- 📋 Review: list + live preview split ---- */
.rq-wrap { display:grid; grid-template-columns: 360px 1fr; gap:14px; padding:10px 0 8px; align-items:start; }
@media (max-width: 980px) { .rq-wrap { grid-template-columns: 1fr; } }
.rq-list { display:flex; flex-direction:column; gap:8px; max-height: calc(100vh - 215px); overflow-y:auto; padding-right:4px; }
.rq-item { border:1px solid var(--line); border-radius:12px; padding:10px 13px; background:var(--panel); cursor:pointer; transition: border-color .15s, background .15s; }
.rq-item:hover { border-color: var(--line-strong); }
.rq-item.sel { border-color: var(--red); background: rgba(238,46,36,.08); box-shadow: 0 0 0 1px var(--red); }
.rq-item.done { opacity:.55; }
.rq-co { font-weight:700; font-size:14px; display:flex; align-items:center; gap:7px; }
.rq-sub { font-size:12px; color:var(--ink-dim); margin-top:3px; line-height:1.45; }
.rq-meta { display:flex; gap:5px; margin-top:7px; flex-wrap:wrap; }
.rq-main { position:sticky; top:74px; }
.rq-actions { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:10px; }
.rq-prog { height:8px; border-radius:99px; background:rgba(227,234,238,.10); overflow:hidden; flex:1; min-width:120px; }
.rq-prog > div { height:100%; background:linear-gradient(90deg,#FF4438,var(--red)); border-radius:99px; transition: width .3s; }
.prevframe { width:100%; height: calc(100vh - 265px); min-height:420px; border:1px solid var(--line-strong); border-radius:14px; background:#EDF0F2; }
.rq-comment { margin-bottom:10px; }
.rq-comment textarea { min-height:64px; }
.kbd { font-family: var(--mono); font-size:10.5px; border:1px solid var(--line-strong); border-radius:5px; padding:1px 5px; color:var(--grey); }

/* ---- 👥 Leads table + drawer ---- */
.ld-bar { display:flex; gap:8px; align-items:center; flex-wrap:wrap; padding:0 0 12px; }
.ld-bar input[type=search] { width:220px; }
.fchip { cursor:pointer; user-select:none; }
.fchip.on { background: rgba(238,46,36,.16); color:#FF7A72; border-color: rgba(238,46,36,.35); }
.ld-table td { vertical-align: middle; }
.ld-row { cursor:pointer; }
.ld-row:hover td { background: rgba(227,234,238,.04); }
.wkpill { font-family:var(--mono); font-size:11px; color:var(--ink-dim); white-space:nowrap; }
.drawer-bg { position:fixed; inset:0; background:rgba(6,12,15,.55); backdrop-filter: blur(2px); z-index:40; }
.drawer { position:fixed; top:0; right:0; bottom:0; width:min(960px, 96vw); background:linear-gradient(160deg,var(--bg1),var(--bg0)); border-left:1px solid var(--line-strong); z-index:41; overflow-y:auto; padding:20px 22px 40px; box-shadow: -18px 0 50px rgba(0,0,0,.45); }
.dw-head { display:flex; align-items:center; gap:10px; margin-bottom:6px; }
.dw-x { margin-left:auto; }
.dw-kv { display:grid; grid-template-columns: repeat(auto-fit,minmax(230px,1fr)); gap:9px; margin:10px 0; }
.dw-kv .kv { background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:8px 11px; font-size:12.5px; min-width:0; overflow-wrap:anywhere; word-break:break-word; }
.dw-kv .kv b { display:block; font-size:10.5px; color:var(--grey); letter-spacing:.06em; text-transform:uppercase; margin-bottom:3px; }
.plan-t td { padding:6px 8px; font-size:12.5px; }
.plan-t tr.sent td { color:var(--grey); }
.plan-t tr.cur td { background:rgba(238,46,36,.07); }
.plan-t .wk { font-family:var(--mono); font-size:11px; white-space:nowrap; }
.plan-edit input, .plan-edit textarea { margin-top:5px; }
.loglines { font-size:11.5px; color:var(--ink-dim); line-height:1.7; max-height:180px; overflow-y:auto; font-family:var(--mono); }

/* ---- 🚀 Ops ---- */
.switch { position:relative; width:46px; height:25px; border-radius:99px; background:rgba(227,234,238,.14); border:1px solid var(--line-strong); cursor:pointer; transition:background .2s; flex:0 0 auto; }
.switch::after { content:''; position:absolute; top:2px; left:2px; width:19px; height:19px; border-radius:50%; background:#fff; transition:left .2s; }
.switch.on { background: linear-gradient(135deg,#FF4438,var(--red)); border-color:transparent; }
.switch.on::after { left:23px; }
.ops-grid { display:grid; grid-template-columns: repeat(auto-fit,minmax(330px,1fr)); gap:14px; }
.sendrow { display:flex; align-items:center; gap:10px; padding:9px 0; border-bottom:1px dashed var(--line); font-size:13px; }
.sendrow:last-child { border-bottom:none; }
.reasons { color:var(--warn); font-size:11.5px; }
.navbtn.active { color: var(--ink); border-color: var(--line-strong); background: rgba(238,46,36,.10); }
.mono { font-family: var(--mono); font-size: 12px; }

/* Review filters + per-issue layout picker */
.rq-filters { display:flex; gap:8px; align-items:center; flex-wrap:wrap; padding:2px 0 10px; }
.rq-filters input[type=search] { width:180px; }
.rq-filters input, .rq-filters select { padding:6px 9px; font-size:12.5px; width:auto; }
.rv-fmt { display:inline-flex; align-items:center; gap:5px; font-size:12px; color:var(--ink-dim); background:var(--panel); border:1px solid var(--line-strong); border-radius:9px; padding:2px 8px 2px 10px; }
.rv-fmt select { width:auto; border:none; background:transparent; padding:5px 4px; font-size:12.5px; }

/* meeting insights + sent list (drawer) */
.mtg textarea { min-height:90px; font-size:12.5px; }
.sentlist { display:flex; flex-direction:column; gap:6px; }
.sentrow2 { display:flex; align-items:center; gap:9px; padding:8px 10px; border:1px solid var(--line); border-radius:9px; background:var(--panel); font-size:12.5px; flex-wrap:wrap; }
.sentrow2 .to { color:var(--ink-dim); font-family:var(--mono); font-size:11px; }

/* 📤 Send screen */
.fri-head { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.fri-grid { display:grid; grid-template-columns: repeat(auto-fit,minmax(300px,1fr)); gap:12px; }
.fri-card { border:1px solid var(--line); border-radius:12px; background:var(--panel); padding:13px 15px; }
.fri-lead { display:flex; align-items:flex-start; gap:10px; padding:10px 0; border-bottom:1px dashed var(--line); }
.fri-lead:last-child { border-bottom:none; }
.fri-lead .co { font-weight:650; font-size:13.5px; }
.fri-to { font-family:var(--mono); font-size:11px; color:var(--ink-dim); margin-top:3px; line-height:1.6; }
.fri-n { flex:0 0 auto; width:26px; height:26px; border-radius:50%; background:rgba(238,46,36,.14); color:#FF7A72; font-weight:700; font-size:12px; display:flex; align-items:center; justify-content:center; }
.fri-blocked .fri-n { background:rgba(255,197,61,.16); color:var(--warn); }

/* Review: multi-select + triage + bulk bar */
.rq-item { display:flex; align-items:flex-start; gap:9px; }
.rq-item .rq-body { flex:1; min-width:0; }
.rq-item.picked { border-color:var(--red); box-shadow:inset 0 0 0 1px var(--red); }
.rq-cb { width:16px; height:16px; margin-top:3px; flex:0 0 auto; accent-color:var(--red); cursor:pointer; }
.rq-bulk { display:flex; align-items:center; gap:8px; padding:9px 13px; margin:0 0 8px; border:1px solid var(--red); background:rgba(238,46,36,.08); border-radius:10px; font-size:13px; }
.fchip.tri-needs.on { background:rgba(255,197,61,.18); color:var(--warn); border-color:rgba(255,197,61,.4); }
.fchip.tri-ready.on { background:rgba(61,214,140,.16); color:var(--ok); border-color:rgba(61,214,140,.35); }
.fchip.tri-nodraft.on { background:rgba(238,46,36,.14); color:#FF7A72; border-color:rgba(238,46,36,.35); }

/* Ops health strip */
.hstrip { display:flex; flex-wrap:wrap; gap:7px; margin:0 0 14px; }
.hpill { font-size:11.5px; font-weight:600; padding:4px 10px; border-radius:999px; border:1px solid var(--line); display:inline-flex; align-items:center; gap:5px; }
.hpill.ok { color:var(--ok); border-color:rgba(61,214,140,.3); background:rgba(61,214,140,.10); }
.hpill.warn { color:var(--warn); border-color:rgba(255,197,61,.3); background:rgba(255,197,61,.10); }
.hpill.bad { color:#FF7A72; border-color:rgba(238,46,36,.35); background:rgba(238,46,36,.12); }

/* ============ 📆 Planner (Leads + Send combined, 2026-07-16) ============ */
.lens { display:flex; border:1px solid var(--line-strong); border-radius:9px; overflow:hidden; }
.lens span { padding:6px 12px; font-size:12px; font-weight:700; cursor:pointer; color:var(--ink-dim); user-select:none; }
.lens span.on { background:rgba(238,46,36,.14); color:var(--ink); }
.planner { display:grid; grid-template-columns:1fr 288px; gap:0; align-items:start; }
@media (max-width:1020px) { .planner { grid-template-columns:1fr; } }
.cal-wrap { overflow-x:auto; padding:10px 6px 18px 2px; }
table.cal { border-collapse:separate; border-spacing:0; min-width:880px; width:100%; }
.cal th { font-family:var(--mono); font-size:10px; letter-spacing:.1em; color:var(--grey); text-transform:uppercase; font-weight:700; text-align:left; padding:8px 10px; border-bottom:1px solid var(--line-strong); white-space:nowrap; }
.cal th.today { color:var(--ink); }
.cal th.today .tdy { display:inline-block; background:var(--red); color:#fff; border-radius:99px; padding:1px 8px; margin-left:6px; font-size:9px; }
.cal td { border-bottom:1px solid var(--line); padding:9px 10px; vertical-align:top; }
.cal td.co { min-width:212px; cursor:pointer; }
.cal td.co:hover .co-name { color:#fff; text-decoration:underline dotted; }
.co-name { font-weight:700; font-size:13px; }
.co-sub { font-size:10.5px; color:var(--grey); margin-top:2px; }
.isschip { display:inline-flex; align-items:center; gap:5px; font-size:10.5px; font-weight:700; border-radius:8px; padding:3px 8px; margin:2px 4px 2px 0; cursor:pointer; border:1px solid transparent; white-space:nowrap; }
.iss-sent { background:rgba(61,214,140,.13); color:var(--ok); border-color:rgba(61,214,140,.35); }
.iss-approved { background:rgba(61,214,140,.09); color:#9fe8c4; border-color:rgba(61,214,140,.25); }
.iss-draft { background:rgba(255,197,61,.10); color:var(--warn); border-color:rgba(255,197,61,.30); }
.iss-planned { background:rgba(143,163,171,.08); color:var(--grey); border-color:var(--line-strong); }
.iss-blocked { background:rgba(238,46,36,.10); color:#ff8d87; border-color:rgba(238,46,36,.40); }
.cal tfoot td { font-family:var(--mono); font-size:10px; color:var(--grey); letter-spacing:.06em; padding:8px 10px; border-top:1px solid var(--line-strong); border-bottom:none; white-space:nowrap; }
.rail { border-left:1px solid var(--line); padding:12px 0 12px 14px; display:flex; flex-direction:column; gap:11px; }
@media (max-width:1020px) { .rail { border-left:none; border-top:1px solid var(--line); padding:14px 0 0; } }
.win { background:rgba(10,20,24,.45); border:1px solid var(--line); border-radius:11px; padding:11px 12px; }
.win .d { font-weight:800; font-size:12.5px; }
.win .m { font-size:11px; color:var(--ink-dim); margin-top:4px; line-height:1.6; }
.win.alert { border-color:rgba(238,46,36,.5); background:rgba(238,46,36,.07); }
.win.alert .d { color:#ff8d87; }

/* ---- the lead popup (replaces the drawer) ---- */
.pop { position:fixed; top:3.5vh; left:50%; transform:translateX(-50%); width:min(1020px,95vw); max-height:93vh; overflow:auto; z-index:41;
  background:linear-gradient(165deg,#132530,#0C1A21 70%); border:1px solid var(--line-strong); border-radius:16px; padding:18px 20px 0; box-shadow:0 30px 90px rgba(0,0,0,.6); }
.pop-head { display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-bottom:4px; }
.pop-head h3 { margin:0; font-size:19px; }
.pop-cols { display:grid; grid-template-columns:1.05fr 1fr; gap:14px; margin-top:12px; }
@media (max-width:880px) { .pop-cols { grid-template-columns:1fr; } }
.pcard { background:rgba(10,20,24,.4); border:1px solid var(--line); border-radius:12px; padding:12px 14px; }
.pcard + .pcard { margin-top:12px; }
.pcard textarea { min-height:84px; }
.fgrid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.fgrid .full { grid-column:1/-1; }
.days { display:flex; gap:5px; flex-wrap:wrap; }
.day { font-size:11px; font-weight:700; border:1px solid var(--line-strong); border-radius:8px; padding:5px 9px; cursor:pointer; color:var(--ink-dim); user-select:none; }
.day.on { background:rgba(238,46,36,.16); border-color:var(--red); color:var(--ink); }
.planstrip { display:flex; gap:4px; flex-wrap:wrap; margin-top:8px; }
.wkdot { width:23px; height:23px; border-radius:6px; display:flex; align-items:center; justify-content:center; font-size:9.5px; font-weight:800; cursor:pointer; border:1px solid var(--line-strong); color:var(--grey); }
.wkdot.sent { background:rgba(61,214,140,.15); color:var(--ok); border-color:rgba(61,214,140,.4); }
.wkdot.cur { border-color:var(--red); color:var(--ink); background:rgba(238,46,36,.15); }
.savebar { position:sticky; bottom:0; margin:16px -20px 0; padding:11px 20px; background:rgba(7,14,18,.94); border-top:1px solid var(--line-strong); display:flex; gap:8px; align-items:center; flex-wrap:wrap; border-radius:0 0 16px 16px; }