:root{
  --brand-50:#eef2ff; --brand-100:#e0e7ff; --brand-200:#c7d2fe; --brand-300:#a5b4fc;
  --brand-400:#818cf8; --brand-500:#6366f1; --brand-600:#4f46e5; --brand-700:#4338ca;
  --success:#16a34a; --warning:#eab308; --danger:#dc2626;
  --text:#0f172a; --muted:#64748b; --muted-2:#94a3b8;
  --surface:#ffffff; --surface-2:#f7f9fc; --surface-3:#eef2f7; --hair:#e5e7eb; --border:#e2e8f0;
  --container:1120px;
  --radius-s:8px; --radius-m:12px; --radius-l:18px; --radius-pill:999px;
  --shadow-s:0 1px 2px rgba(2,6,23,.06); --shadow-m:0 4px 12px rgba(2,6,23,.08); --shadow-l:0 12px 24px rgba(2,6,23,.14);
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px; --space-6:24px; --space-7:28px; --space-8:32px; --space-9:36px; --space-10:40px; --space-12:48px; --space-14:56px; --space-16:64px;
  --font-sans: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  --size-xs:12px; --size-sm:13px; --size-base:16px; --size-lg:18px; --size-xl:22px; --size-2xl:28px; --size-3xl:36px; --size-4xl:48px;
  --leading-tight:1.15; --leading-normal:1.5;
  --hero-start:#eef2ff; --hero-end:#f5f7ff;
}
*{ box-sizing:border-box; }
html, body{ margin:0; padding:0; }
body{ font-family:var(--font-sans); color:var(--text); background:var(--surface-2); font-size:var(--size-base); line-height:var(--leading-normal); -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
a{ color: color-mix(in oklab, var(--brand-700), black 5%); }
a:hover{ text-decoration: underline; text-underline-offset: 3px; }
.container{ max-width:var(--container); margin:0 auto; padding:0 var(--space-5); }
.section{ padding:var(--space-12) 0; }
.flow > * + *{ margin-top:var(--space-4); }
.grid-2{ display:grid; grid-template-columns:1.05fr .95fr; gap:var(--space-8); }
.grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-6); }
.grid-4{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-6); }
.cluster{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-3); }
.divider{ height:1px; background:var(--hair); margin:var(--space-6) 0; }
.muted{ color:var(--muted); }
.list-flat{ list-style:none; padding:0; margin:8px 0 0; }
.badge{ border:1px solid var(--border); background:var(--surface); color:var(--muted); border-radius:var(--radius-pill); padding:4px 10px; font-size:var(--size-sm); }
.badge.brand{ background:var(--brand-50); color:var(--brand-700); border-color:var(--brand-200); }
.badge.green{ background:#ecfdf5; border-color:#86efac; color:#166534; }
.badge.amber{ background:#fffbeb; border-color:#fcd34d; color:#7c2d12; }
.pill{ border-radius:var(--radius-pill); padding:4px 10px; border:1px solid var(--border); background:var(--surface); font-size:var(--size-sm); color:var(--text); }
.pill.muted{ color:var(--muted); }

h1{ font-size:clamp(36px,5vw,56px); letter-spacing:-0.02em; line-height:1.05; margin:0 0 var(--space-3); font-weight:800; }
h2{ font-size:clamp(26px,3vw,36px); letter-spacing:-0.01em; line-height:1.1; margin:0 0 var(--space-2); font-weight:800; }
h3{ font-size:clamp(20px,2.2vw,24px); letter-spacing:-0.005em; line-height:1.2; margin:0 0 var(--space-2); font-weight:800; }
.lead{ font-size:var(--size-lg); color:var(--muted); max-width:62ch; }

.btn{ appearance:none; border:none; border-radius:var(--radius-pill); padding:10px 14px; cursor:pointer; transition:transform .18s ease, box-shadow .18s ease, background .18s ease; font-weight:700; }
.btn:focus-visible{ outline:3px solid color-mix(in oklab, var(--brand-700), #fff 70%); outline-offset:1px; }
.btn-primary{ background:var(--brand-700); color:#fff; box-shadow:var(--shadow-s); }
.btn-primary:hover{ transform:translateY(-1px); box-shadow:var(--shadow-m); }
.btn-secondary{ background:var(--surface); color:var(--text); border:1px solid var(--border); }
.btn-secondary:hover{ background:var(--surface-3); }
.btn-ghost{ background:transparent; color:var(--text); border:1px solid var(--hair); }
.btn-ghost:hover{ background:var(--surface-3); }
.btn-success{ background:#059669; color:#fff; }

.card{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-m); padding:var(--space-5); box-shadow:var(--shadow-s); }
.kpi{ display:grid; gap:4px; }
.kpi .num{ font-size:28px; font-weight:800; letter-spacing:-0.02em; }
.kpi .sub{ font-size:var(--size-sm); color:var(--muted); }

.navbar{ background:var(--surface); position:sticky; top:0; z-index:60; border-bottom:1px solid var(--hair); }
.nav-inner{ height:64px; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.brand{ display:flex; align-items:center; gap:10px; font-weight:800; text-decoration:none; color:var(--text); }
.brand-logo{ width:28px; height:28px; border-radius:8px; background:linear-gradient(180deg, var(--brand-500), var(--brand-700)); color:#fff; font-size:14px; font-weight:800; display:flex; align-items:center; justify-content:center; box-shadow:var(--shadow-s); }
.navlinks{ display:flex; gap:8px; }
.navlinks a{ text-decoration:none; color:var(--text); padding:8px 10px; border-radius:8px; font-weight:600; }
.navlinks a:hover{ background:var(--surface-3); }
.nav-cta{ display:flex; align-items:center; gap:8px; }

/* Hamburger & Drawer */
.hamburger{ display:none; width:40px; height:40px; border-radius:8px; border:1px solid var(--border); background:var(--surface); align-items:center; justify-content:center; gap:4px; }
.hamburger span{ width:18px; height:2px; background:#0f172a; display:block; }
.nav-drawer{ position:fixed; inset:0; background:rgba(15,23,42,.36); display:grid; justify-items:end; }
.nav-drawer > *{ background:var(--surface); width:min(88vw,360px); height:100%; padding:16px; border-left:1px solid var(--hair); overflow:auto; }
.nav-drawer-header{ display:flex; align-items:center; justify-content:space-between; }
.nav-drawer a{ display:block; padding:12px; text-decoration:none; color:var(--text); border-radius:8px; }
.nav-drawer a:hover{ background:var(--surface-3); }
.drawer-close{ background:transparent; border:1px solid var(--border); border-radius:8px; height:36px; width:36px; cursor:pointer; }

.footer{ background:var(--surface); border-top:1px solid var(--hair); }
.footer-grid{ display:grid; grid-template-columns:2fr repeat(4,1fr); gap:var(--space-8); }

/* Hero */
.hero{ background:linear-gradient(180deg, var(--hero-start), var(--hero-end)); border:1px solid var(--hair); border-radius:var(--radius-l); padding:var(--space-8); }
.hero-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:var(--space-8); align-items:start; }
.hero .support{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-6); margin-top:var(--space-8); }

/* Result card */
.result-card{ background:var(--surface); border:1px solid var(--border); border-left:5px solid var(--brand-700); border-radius:14px; padding:var(--space-4); box-shadow:var(--shadow-s); }
.result-card .title{ font-weight:800; font-size:var(--size-xl); letter-spacing:-0.01em; margin:0 0 6px 0; }
.result-card .status{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; color:var(--muted); }
.result-card .snippet{ margin:10px 0 8px; color:var(--text); }
.result-card .evidence{ display:flex; gap:8px; flex-wrap:wrap; margin:10px 0 12px; }
.result-card .chip{ background:var(--surface-3); color:var(--text); border:1px solid var(--hair); border-radius:var(--radius-pill); padding:4px 10px; font-size:var(--size-sm); }
.dot{ width:8px; height:8px; border-radius:999px; display:inline-block; margin-right:6px; background:#9ca3af; }
.dot.open{ background:var(--brand-600); }
.dot.upcoming{ background:var(--warning); }

/* Context-aware search */
.ctx-box{ border:2px dashed var(--border); background: color-mix(in oklab, var(--surface), var(--brand-50) 18%); padding:var(--space-5); border-radius:var(--radius-l); }
.ctx-textarea{ width:100%; min-height:140px; border:1px solid var(--hair); border-radius:var(--radius-m); padding:var(--space-4); background:var(--surface); resize:vertical; font-family:var(--font-sans); font-size:var(--size-base); color:var(--text); }
.ctx-actions{ display:flex; align-items:center; gap:var(--space-3); margin-top:var(--space-3); }
.ctx-summary{ font-size:var(--size-sm); color:var(--muted); margin-left:auto; }

/* Toolbar & lists */
.cards{ display:grid; gap:var(--space-4); }
.toolbar{ display:flex; flex-wrap:wrap; gap:var(--space-3); align-items:center; justify-content:space-between; padding:var(--space-4); background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-m); box-shadow:var(--shadow-s); }
.input,.select{ height:40px; padding:0 12px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-pill); font-size:var(--size-base); color:var(--text); }
.toggle{ display:flex; align-items:center; gap:8px; cursor:pointer; }
.toggle input{ width:18px; height:18px; }

/* Forms */
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:var(--space-6); }
.form-grid .field{ display:grid; gap:6px; }
.help{ font-size:var(--size-sm); color:var(--muted); }

/* Responsive */
@media (max-width:980px){
  .navlinks{ display:none; }
  .hamburger{ display:flex; }
  .grid-2,.grid-3,.grid-4{ grid-template-columns:1fr; }
  .hero-grid{ grid-template-columns:1fr; }
  .hero .support{ grid-template-columns:repeat(2,1fr); }
  .footer-grid{ grid-template-columns:1fr 1fr; }
}
/* Compatibility aliases */
:root{
  --fl-bg: var(--surface-2); --fl-surface: var(--surface); --fl-text: var(--text); --fl-muted: var(--muted); --fl-border: var(--border);
  --fl-accent: var(--brand-700); --fl-accent-600: var(--brand-600); --fl-green: #16a34a; --fl-amber: #b26a00; --fl-red: #c12b3a;
  --bg: var(--surface-2); --panel: var(--surface-2); --card: var(--surface); --accent: color-mix(in oklab, var(--brand-700), black 10%); --accent-2: #34d399; --radius: var(--radius-m); --shadow: var(--shadow-s);
}