/* LENQARO design system — single source of truth (F1) + Direction C grammar.
   Consumed by the public site (public_site.py) and every authenticated template.
   Token values are the accepted ones (UX QA: "sound"); what is new is that they
   are declared ONCE, plus the semantic layers Direction C needs:
     · status ramp        (success / warning / info / critical / neutral)
     · identity grammar   (human = circle · agent = square · vacant = dashed)
     · consequence weight (T0 quiet → T3 heavy) — consequence, NOT authority
     · proof-state        (PROOF · PROVENANCE · INVALIDATED · NONE)
     · truth-state        (AVAILABLE · DESIGNED · FUTURE)
     · Work Pulse         (live activity, reduced-motion safe)
     · session stepper    (REQUESTED … CLOSED)
   Nothing here decides anything: every chip renders a server-provided state. */

:root {
  /* surfaces + ink */
  --ground:#F4F5F8; --surface:#FFFFFF; --surface-2:#EDEEF3; --rail:#EEF0F5;
  --ink:#171922; --ink-2:#40434F; --muted:#6B6F7E; --line:#E4E6EE; --line-2:#CFD2DD;
  --accent:#4C4E86; --accent-2:#6E70B0; --accent-fill:#ECEDF7; --accent-line:#C9CBEC;
  --hold:#6B6F7E; --hold-fill:#EDEEF3; --crit:#A81D28; --crit-fill:#FBEBEC;
  --ok:#4C4E86; --ok-fill:#ECEDF7; --info:#4C4E86; --info-fill:#ECEDF7;
  --me:#4C4E86; --me-ink:#FFFFFF; --code-bg:#F1F1F8;
  --shadow:0 1px 2px rgba(20,20,40,.05),0 14px 34px -22px rgba(20,20,40,.28);
  --radius:11px; --t-a:#4C4E86; --t-b:#6E70B0;
  /* DS1 semantic status ramp (all pairs ≥ 4.5:1 on their fills) */
  --s-success:#1F6B4A; --s-success-fill:#E4F3EB;
  --s-warning:#8A5A00; --s-warning-fill:#FBF1DC;
  --s-info:#2F4F9E; --s-info-fill:#E6ECFA;
  --s-critical:#A81D28; --s-critical-fill:#FBEBEC;
  --s-neutral:#5E6272; --s-neutral-fill:#EDEEF3;
  /* DS2 type scale — whole pixels, 7 steps */
  --fs-display:40px; --fs-h1:30px; --fs-h2:22px; --fs-h3:17px; --fs-body:15px; --fs-small:13px; --fs-micro:11px;
  /* spacing scale */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px;
  /* elevation scale */
  --e-0:none; --e-1:0 1px 2px rgba(20,20,40,.06); --e-2:var(--shadow); --e-3:0 2px 6px rgba(20,20,40,.08),0 24px 48px -24px rgba(20,20,40,.35);
  /* consequence weight (T0 quiet → T3 heavy) — visual weight only */
  --w-t0:var(--s-neutral); --w-t1:var(--s-info); --w-t2:var(--s-warning); --w-t3:var(--s-critical);
  /* motion */
  --dur-fast:120ms; --dur:220ms; --ease:cubic-bezier(.2,.7,.2,1);
  /* touch */
  --tap:44px;
}

/* dark theme — the only other place tokens are declared (same single file) */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --ground:#0B0D13;--surface:#14161F;--surface-2:#1B1E2A;--rail:#0F111A;
  --ink:#E9EBF2;--ink-2:#B9BDCC;--muted:#7E8397;--line:#23262F;--line-2:#333748;
  --accent:#8688C6;--accent-2:#A2A4E0;--accent-fill:#191B2C;--accent-line:#33366A;
  --hold:#7E8397;--hold-fill:#1B1E2A;--crit:#EC7A7A;--crit-fill:#2A1517;
  --ok:#8688C6;--ok-fill:#191B2C;--info:#8688C6;--info-fill:#191B2C;
  --me:#5254A0;--me-ink:#FFFFFF;--code-bg:#0F1119;
  --s-success:#7FD3A8;--s-success-fill:#12271C;--s-warning:#E7B65A;--s-warning-fill:#2A2110;
  --s-info:#9DB2F0;--s-info-fill:#161E33;--s-critical:#EC7A7A;--s-critical-fill:#2A1517;
  --s-neutral:#9AA0B4;--s-neutral-fill:#1B1E2A;
  --shadow:0 1px 2px rgba(0,0,0,.5),0 18px 40px -24px rgba(0,0,0,.95);
  --e-1:0 1px 2px rgba(0,0,0,.5);--e-2:var(--shadow);--e-3:0 2px 8px rgba(0,0,0,.6),0 28px 56px -28px rgba(0,0,0,.95);
}}
:root[data-theme="dark"]{
  --ground:#0B0D13;--surface:#14161F;--surface-2:#1B1E2A;--rail:#0F111A;
  --ink:#E9EBF2;--ink-2:#B9BDCC;--muted:#7E8397;--line:#23262F;--line-2:#333748;
  --accent:#8688C6;--accent-2:#A2A4E0;--accent-fill:#191B2C;--accent-line:#33366A;
  --hold:#7E8397;--hold-fill:#1B1E2A;--crit:#EC7A7A;--crit-fill:#2A1517;
  --ok:#8688C6;--ok-fill:#191B2C;--info:#8688C6;--info-fill:#191B2C;
  --me:#5254A0;--me-ink:#FFFFFF;--code-bg:#0F1119;
  --s-success:#7FD3A8;--s-success-fill:#12271C;--s-warning:#E7B65A;--s-warning-fill:#2A2110;
  --s-info:#9DB2F0;--s-info-fill:#161E33;--s-critical:#EC7A7A;--s-critical-fill:#2A1517;
  --s-neutral:#9AA0B4;--s-neutral-fill:#1B1E2A;
  --shadow:0 1px 2px rgba(0,0,0,.5),0 18px 40px -24px rgba(0,0,0,.95);
  --e-1:0 1px 2px rgba(0,0,0,.5);--e-2:var(--shadow);--e-3:0 2px 8px rgba(0,0,0,.6),0 28px 56px -28px rgba(0,0,0,.95);
}

/* ---------- primitives ---------- */
.lq-chip{display:inline-flex;align-items:center;gap:6px;font:600 var(--fs-micro)/1 "JetBrains Mono",ui-monospace,monospace;letter-spacing:.04em;text-transform:uppercase;padding:5px 8px;border-radius:999px;border:1px solid var(--line-2);color:var(--ink-2);background:var(--surface-2);vertical-align:middle;white-space:nowrap}
.lq-chip.success{color:var(--s-success);background:var(--s-success-fill);border-color:transparent}
.lq-chip.warning{color:var(--s-warning);background:var(--s-warning-fill);border-color:transparent}
.lq-chip.info{color:var(--s-info);background:var(--s-info-fill);border-color:transparent}
.lq-chip.critical{color:var(--s-critical);background:var(--s-critical-fill);border-color:transparent}
.lq-chip.neutral{color:var(--s-neutral);background:var(--s-neutral-fill);border-color:transparent}

/* truth-state: AVAILABLE / DESIGNED / FUTURE */
.lq-truth.available{color:var(--s-success);background:var(--s-success-fill);border-color:transparent}
.lq-truth.designed{color:var(--ink-2);background:transparent;border:1px dashed var(--line-2)}
.lq-truth.future{color:var(--muted);background:transparent;border:1px dotted var(--line-2)}

/* proof-state: PROOF / PROVENANCE / INVALIDATED / NONE */
.lq-proof.proof{color:var(--s-success);background:var(--s-success-fill);border-color:transparent}
.lq-proof.provenance{color:var(--s-info);background:var(--s-info-fill);border-color:transparent}
.lq-proof.invalidated{color:var(--s-critical);background:var(--s-critical-fill);border-color:transparent;text-decoration:line-through}
.lq-proof.none{color:var(--muted);background:transparent;border:1px dashed var(--line-2)}

/* consequence weight — displays "Consequence T0..T3"; never labelled as authority */
.lq-conseq{border-left:3px solid var(--w-t0);padding-left:8px}
.lq-conseq[data-tier="T1"]{border-left-color:var(--w-t1)}
.lq-conseq[data-tier="T2"]{border-left-color:var(--w-t2);border-left-width:4px}
.lq-conseq[data-tier="T3"]{border-left-color:var(--w-t3);border-left-width:6px}
.lq-chip.tier{background:var(--surface);border-color:var(--line-2)}
.lq-chip.tier[data-tier="T2"]{color:var(--s-warning)}
.lq-chip.tier[data-tier="T3"]{color:var(--s-critical);border-color:var(--s-critical)}

/* identity grammar */
.lq-id{display:inline-grid;place-items:center;width:28px;height:28px;flex:none;font:700 var(--fs-micro)/1 "JetBrains Mono",ui-monospace,monospace;color:var(--ink-2);background:var(--surface-2);border:2px solid var(--line-2)}
.lq-id.human{border-radius:50%;border-color:var(--accent);color:var(--accent);background:var(--accent-fill)}
.lq-id.agent{border-radius:6px;border-color:var(--ink-2);background:var(--surface)}
.lq-id.vacant{border-radius:6px;border-style:dashed;color:var(--muted);background:transparent}
.lq-id.lg{width:44px;height:44px;font-size:var(--fs-small)}

/* Work Pulse */
.lq-pulse{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--s-neutral);vertical-align:middle}
.lq-pulse.live{background:var(--s-success);box-shadow:0 0 0 0 rgba(31,107,74,.45);animation:lq-pulse 1.6s var(--ease) infinite}
.lq-pulse.attention{background:var(--s-warning)}
.lq-pulse.blocked{background:var(--s-critical)}
@keyframes lq-pulse{0%{box-shadow:0 0 0 0 rgba(31,107,74,.45)}70%{box-shadow:0 0 0 8px rgba(31,107,74,0)}100%{box-shadow:0 0 0 0 rgba(31,107,74,0)}}
@media (prefers-reduced-motion:reduce){.lq-pulse.live{animation:none}*{transition-duration:0ms!important}}

/* session stepper */
.lq-steps{display:flex;flex-wrap:wrap;gap:4px;list-style:none;margin:0;padding:0}
.lq-steps li{font:600 var(--fs-micro)/1 "JetBrains Mono",ui-monospace,monospace;letter-spacing:.04em;padding:6px 8px;border-radius:6px;border:1px solid var(--line);color:var(--muted);background:var(--surface)}
.lq-steps li.done{color:var(--s-success);border-color:var(--s-success-fill);background:var(--s-success-fill)}
.lq-steps li.current{color:var(--accent);border-color:var(--accent);background:var(--accent-fill)}
.lq-steps li.terminal{color:var(--ink-2)}

/* composition bands (DS3): hero > demo > evidence (dense) > quiet */
.lq-band{padding:var(--sp-5) 0}
.lq-band.hero{padding:var(--sp-6) 0}
.lq-band.evidence{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.lq-band.quiet{color:var(--ink-2);font-size:var(--fs-small)}
.lq-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-4) var(--sp-5);box-shadow:var(--e-1)}
.lq-card.raised{box-shadow:var(--e-2)}
.lq-card h3{font-size:var(--fs-h3);margin:0 0 var(--sp-2)}
.lq-grid{display:grid;gap:var(--sp-4);grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.lq-kv{display:grid;grid-template-columns:minmax(120px,max-content) 1fr;gap:var(--sp-1) var(--sp-4);font-size:var(--fs-small)}
.lq-kv dt{color:var(--muted)}.lq-kv dd{margin:0;color:var(--ink)}
.lq-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--tap);padding:0 var(--sp-4);border-radius:9px;border:1px solid var(--line-2);background:var(--surface);color:var(--ink);font:600 var(--fs-body)/1 inherit;cursor:pointer;text-decoration:none}
.lq-btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.lq-btn.primary:hover{background:var(--accent-2)}
.lq-btn.danger{color:var(--s-critical);border-color:var(--s-critical)}
.lq-btn[disabled]{opacity:.55;cursor:not-allowed}
.lq-btn:focus-visible,.lq-rail a:focus-visible,.lq-tab:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.lq-notice{border:1px solid var(--accent-line);background:var(--accent-fill);border-radius:10px;padding:var(--sp-3) var(--sp-4);font-size:var(--fs-small)}
.lq-notice.warning{border-color:var(--s-warning);background:var(--s-warning-fill)}
.lq-notice.critical{border-color:var(--s-critical);background:var(--s-critical-fill)}
.lq-empty{color:var(--muted);font-size:var(--fs-small);padding:var(--sp-3) 0}
.lq-table{width:100%;border-collapse:collapse;font-size:var(--fs-small)}
.lq-table th,.lq-table td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.lq-table th{font-size:var(--fs-micro);text-transform:uppercase;letter-spacing:.04em;color:var(--muted);background:var(--surface-2)}
.lq-mono{font-family:"JetBrains Mono",ui-monospace,monospace}
.lq-sr{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}

/* seat rail (labelled, keyboard operable, 44px targets) */
.lq-rail{display:flex;flex-direction:column;gap:2px;padding:var(--sp-2);background:var(--rail);border-right:1px solid var(--line);min-width:196px}
.lq-rail a{display:flex;align-items:center;gap:10px;min-height:var(--tap);padding:0 10px;border-radius:9px;text-decoration:none;color:var(--ink-2);font-size:var(--fs-small);font-weight:600}
.lq-rail a:hover{background:var(--surface)}
.lq-rail a[aria-current="true"]{background:var(--surface);color:var(--accent);box-shadow:var(--e-1)}
.lq-rail a .lq-chip{margin-left:auto}
@media (max-width:900px){.lq-rail{flex-direction:row;overflow-x:auto;min-width:0;border-right:none;border-bottom:1px solid var(--line)}.lq-rail a{flex:none}.lq-rail a .lq-chip{display:none}}