/* Exa Insights — the Exa family look (charcoal bar, warm illustrations, calm surfaces) with its own teal accent.
   Built from Exa People's stylesheet; fonts are shared with every Exa platform. */
@font-face{font-family:"Public Sans";src:url(fonts/public-sans-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Public Sans";src:url(fonts/public-sans-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Public Sans";src:url(fonts/public-sans-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Public Sans";src:url(fonts/public-sans-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Schibsted Grotesk";src:url(fonts/schibsted-grotesk-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Schibsted Grotesk";src:url(fonts/schibsted-grotesk-latin-800-normal.woff2) format("woff2");font-weight:800;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(fonts/jetbrains-mono-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}

:root{
  --page:#f5f6f7; --surface:#ffffff; --raised:#f9fafb; --sunk:#eef0f2;
  --ink:#1e2125; --muted:#5c6370; --faint:#8b929c;
  --line:#e2e5e9; --line-strong:#c9ced5;
  --bar:#26282b; --bar-ink:#f4f5f6; --bar-muted:#b3b8bf; --bar-hover:#34373b;
  --brand:#2a9d9b;                       /* Insights teal: indicators and highlights */
  --exa:#f47b20;                         /* Exa orange: the logo mark and illustrations */
  --act:#1d6b6e; --act-hover:#15585a; --act-ink:#ffffff; --act-soft:#e1f1f0;   /* buttons and links (AA on white) */
  --good:#1d7a4c; --good-soft:#e1f2e8; --warn:#9a5b07; --warn-soft:#fbefd9; --bad:#b3332a; --bad-soft:#f9e3e1;
  --info:#1f6a8a; --info-soft:#e2f0f6;
  --teal:#2e8b8b; --sky:#9cc9e3; --sage:#8db580; --sand:#f2c38b; --rose:#ee9a8f; --skin:#e8b08c;
  --top:#2e8b5a; --core:#2f6fb0; --under:#c0392b;      /* 9-box subgroups (Exa's grid colours) */
  --f-display:"Schibsted Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-body:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
  --r-sm:6px; --r:10px; --r-lg:14px;
  --shadow:0 1px 2px rgba(30,33,37,.06),0 4px 14px rgba(30,33,37,.06);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --page:#14161a; --surface:#1c1f24; --raised:#21252b; --sunk:#181b1f; --ink:#eceef1; --muted:#a5acb6; --faint:#7a828d;
  --line:#2c3138; --line-strong:#3b414a; --bar:#0f1113; --bar-hover:#1d2024;
  --act:#5cc6c2; --act-hover:#7fd5d1; --act-ink:#071a19; --act-soft:#123433; --brand:#4fbab6;
  --good:#5cc08a; --good-soft:#173324; --warn:#e3a54c; --warn-soft:#382a14; --bad:#ef7d72; --bad-soft:#3b1d1a;
  --info:#7cc1df; --info-soft:#15303b; --shadow:0 1px 2px rgba(0,0,0,.3);color-scheme:dark}}
:root[data-theme="dark"]{
  --page:#14161a; --surface:#1c1f24; --raised:#21252b; --sunk:#181b1f; --ink:#eceef1; --muted:#a5acb6; --faint:#7a828d;
  --line:#2c3138; --line-strong:#3b414a; --bar:#0f1113; --bar-hover:#1d2024;
  --act:#5cc6c2; --act-hover:#7fd5d1; --act-ink:#071a19; --act-soft:#123433; --brand:#4fbab6;
  --good:#5cc08a; --good-soft:#173324; --warn:#e3a54c; --warn-soft:#382a14; --bad:#ef7d72; --bad-soft:#3b1d1a;
  --info:#7cc1df; --info-soft:#15303b; --shadow:0 1px 2px rgba(0,0,0,.3);color-scheme:dark}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--page);color:var(--ink);font:15px/1.55 var(--f-body)}
/* figures line up in tables and stats; headings and prose keep normal punctuation widths (tabular figures widen commas) */
table,.num,.stat,.bignum,.kpi,input,output{font-variant-numeric:tabular-nums}
a{color:var(--act);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{font-family:var(--f-display);margin:0;letter-spacing:-.012em;text-wrap:balance}
h1{font-size:clamp(24px,2.8vw,32px);font-weight:800;line-height:1.12}
h2{font-size:20px;font-weight:700;line-height:1.25}
h3{font-size:16px;font-weight:700}
h4{font-size:14px;font-weight:700}
p{margin:0}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:3px}
.muted{color:var(--muted)} .faint{color:var(--faint)} .small{font-size:13px} .tiny{font-size:12px}
.mono{font-family:var(--f-mono);font-size:.92em} .nowrap{white-space:nowrap} .right{text-align:right} .center{text-align:center}
.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.devbanner{background:var(--warn);color:#fff;text-align:center;font:600 12px var(--f-body);padding:4px}

/* ---------- top bar with dropdown menus ---------- */
.topbar{background:var(--bar);color:var(--bar-ink);position:sticky;top:0;z-index:40}
.topbar .in{max-width:1320px;margin:0 auto;padding:0 18px;height:60px;display:flex;align-items:stretch;gap:6px}
.brand{display:flex;align-items:center;gap:9px;color:var(--bar-ink);padding-right:14px;margin-right:4px;white-space:nowrap}
.brand img{height:22px;width:auto;display:block}
.brand b{font:700 17px var(--f-display);letter-spacing:-.01em}
.brand:hover{text-decoration:none}
.menus{display:flex;align-items:stretch;gap:0;flex:1;min-width:0}
.menu{position:relative;display:flex}
.menu>a,.menu>button{display:flex;align-items:center;gap:4px;padding:0 9px;color:var(--bar-ink);font:600 14px var(--f-body);
  background:none;border:0;cursor:pointer;white-space:nowrap;position:relative;text-decoration:none}
.menu>a:hover,.menu>button:hover,.menu>button[aria-expanded="true"]{background:var(--bar-hover);text-decoration:none}
.menu.on>a::after,.menu.on>button::after{content:"";position:absolute;left:10px;right:10px;bottom:0;height:3px;border-radius:3px 3px 0 0;background:var(--brand)}
.menu svg.chev{width:10px;height:10px;opacity:.7}
.menu-panel{position:absolute;top:calc(100% + 6px);left:0;min-width:240px;background:var(--surface);color:var(--ink);border:1px solid var(--line);
  border-radius:var(--r);box-shadow:0 10px 30px rgba(20,22,26,.18);padding:8px;z-index:50}
.menu-panel a{display:block;padding:8px 12px;border-radius:var(--r-sm);color:var(--ink);font-size:14.5px}
.menu-panel a:hover,.menu-panel a:focus{background:var(--sunk);text-decoration:none}
.menu-panel a.here{color:var(--act);font-weight:600}
.menu-panel .sect{border-top:1px solid var(--line);margin:6px 4px 4px;padding:8px 8px 2px;font:700 13px var(--f-body);color:var(--muted)}
.tools{display:flex;align-items:center;gap:4px;margin-left:auto}
.tool{display:flex;align-items:center;gap:6px;color:var(--bar-muted);padding:7px 9px;border-radius:var(--r-sm);font-size:14px;position:relative;white-space:nowrap}
.tool:hover{color:var(--bar-ink);background:var(--bar-hover);text-decoration:none}
.tool svg{width:18px;height:18px}
.tool .count{position:absolute;top:2px;right:0;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--brand);color:#061615;font:700 10.5px/17px var(--f-body);text-align:center}
.avatar{width:34px;height:34px;border-radius:50%;background:#d6eeec;color:#0f4746;display:inline-grid;place-items:center;font:700 13px var(--f-body);flex:none}
.avatar.lg{width:72px;height:72px;font-size:24px}
.avatar.sm{width:26px;height:26px;font-size:11px}
.avatar.has-photo{background:var(--sunk);overflow:hidden}
.avatar>img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.userpick{position:relative}
.userpick>summary{list-style:none;cursor:pointer;padding:4px;border-radius:50%}
.userpick>summary::-webkit-details-marker{display:none}
.userpick .menu-panel{left:auto;right:0}
.navtoggle{display:none;background:none;border:0;color:var(--bar-ink);padding:0 8px;cursor:pointer}
.navtoggle svg{width:22px;height:22px}
@media (max-width:1180px){.tool .lbl{display:none}}
@media (max-width:1140px){
  .navtoggle{display:flex;align-items:center}
  .menus{display:none;position:absolute;top:60px;left:0;right:0;background:var(--bar);flex-direction:column;padding:8px 10px 14px;max-height:calc(100vh - 60px);overflow:auto}
  .menus.open{display:flex}
  .menu{flex-direction:column}
  .menu>a,.menu>button{padding:12px 10px}
  .menu.on>a::after,.menu.on>button::after{left:0;right:auto;top:10px;bottom:10px;width:3px;height:auto}
  .menu-panel{position:static;box-shadow:none;margin:0 0 6px 10px}
}

/* ---------- page ---------- */
.page{max-width:1320px;margin:0 auto;padding:28px 22px 80px}
.page.narrow{max-width:900px}
.pagehead{display:flex;flex-wrap:wrap;gap:14px 24px;align-items:flex-end;justify-content:space-between;padding-bottom:18px;margin-bottom:22px;border-bottom:1px solid var(--line)}
.pagehead .sub{color:var(--muted);margin-top:8px;max-width:72ch}
.crumbs{font-size:13.5px;color:var(--muted);margin-bottom:8px}
.crumbs a{color:var(--muted)}
.actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.stack{display:flex;flex-direction:column;gap:18px}
.stack.tight{gap:10px}
.row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.row.between{justify-content:space-between}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.grid4{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.cols{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:22px;align-items:start}
@media (max-width:1000px){.cols{grid-template-columns:minmax(0,1fr)}}
.section-title{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:6px 0 12px}

/* ---------- surfaces ---------- */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg)}
.card>.hd{display:flex;gap:10px 18px;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--line)}
.card>.bd{padding:18px 20px}
.card>.ft{padding:12px 20px;border-top:1px solid var(--line);background:var(--raised);border-radius:0 0 var(--r-lg) var(--r-lg)}
.card.flat{background:var(--raised)}
.panel{background:var(--raised);border-radius:var(--r-lg);padding:22px 24px}
.note{background:var(--info-soft);color:var(--ink);border-radius:var(--r);padding:12px 16px;font-size:14px}
.note.warn{background:var(--warn-soft)} .note.bad{background:var(--bad-soft)} .note.good{background:var(--good-soft)}
.flash{border-radius:var(--r);padding:11px 16px;margin-bottom:18px;font-weight:500;background:var(--good-soft);color:var(--good)}
.flash.err{background:var(--bad-soft);color:var(--bad)}
.errors{background:var(--bad-soft);color:var(--bad);border-radius:var(--r);padding:12px 16px}
.errors ul{margin:4px 0 0;padding-left:18px}
hr.sep{border:0;border-top:1px solid var(--line);margin:18px 0}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;font:600 14px var(--f-body);padding:9px 16px;border-radius:var(--r-sm);
  border:1.5px solid var(--line-strong);background:var(--surface);color:var(--ink);cursor:pointer;white-space:nowrap;text-decoration:none!important;line-height:1.2}
.btn:hover{border-color:var(--ink)}
.btn.primary{background:var(--act);border-color:var(--act);color:var(--act-ink)}
.btn.primary:hover{background:var(--act-hover);border-color:var(--act-hover)}
.btn.dark{background:var(--bar);border-color:var(--bar);color:#fff}
.btn.danger{color:var(--bad);border-color:var(--bad)}
.btn.ghost{background:none;border-color:transparent;color:var(--act);padding-inline:8px}
.btn.ghost:hover{background:var(--act-soft)}
.btn.sm{padding:6px 11px;font-size:13px}
.btn:disabled{opacity:.5;cursor:not-allowed}
.linkbtn{background:none;border:0;padding:0;color:var(--act);font:inherit;cursor:pointer}
.linkbtn:hover{text-decoration:underline}
form.inline{display:inline}

/* ---------- forms ---------- */
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field>span,.label{font:600 13.5px var(--f-body);color:var(--ink)}
.field>small,.help{font-size:13px;color:var(--muted)}
.req::after{content:" *";color:var(--bad)}
input[type=text],input[type=email],input[type=search],input[type=date],input[type=number],input[type=url],input[type=tel],input[type=password],select,textarea{
  font:400 15px var(--f-body);color:var(--ink);background:var(--surface);border:1.5px solid var(--line-strong);border-radius:var(--r-sm);padding:9px 11px;width:100%;min-width:0}
textarea{resize:vertical;min-height:96px;line-height:1.5}
textarea.short{min-height:60px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--act);box-shadow:0 0 0 3px var(--act-soft)}
input[type=checkbox],input[type=radio]{accent-color:var(--act);width:16px;height:16px}
.check{display:flex;gap:9px;align-items:flex-start;font-size:14.5px}
.check input{margin-top:3px}
.choices{display:flex;flex-wrap:wrap;gap:8px}
.choice{position:relative}
.choice input{position:absolute;opacity:0}
.choice span{display:inline-block;padding:7px 13px;border:1.5px solid var(--line-strong);border-radius:20px;font-size:14px;cursor:pointer}
.choice input:checked+span{background:var(--act-soft);border-color:var(--act);color:var(--act);font-weight:600}
.choice input:focus-visible+span{outline:2px solid var(--brand);outline-offset:2px}
.formgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.formactions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;padding-top:6px}
.filters{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin-bottom:16px}
.filters .field{min-width:160px}
.filters input[type=search]{min-width:240px}
fieldset{border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;margin:0}
legend{font-weight:700;padding:0 6px}

/* ---------- tables ---------- */
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface)}
table.t{width:100%;border-collapse:collapse;font-size:14px}
table.t th{text-align:left;font:600 12.5px var(--f-body);color:var(--muted);padding:11px 14px;border-bottom:1px solid var(--line);background:var(--raised);white-space:nowrap}
table.t td{padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:top}
table.t tr:last-child td{border-bottom:0}
table.t tbody tr:hover td{background:var(--raised)}
table.t td.num,table.t th.num{text-align:right}
table.t.compact td,table.t.compact th{padding:7px 10px}
table.t tfoot td{font-weight:700;background:var(--raised);border-top:1px solid var(--line-strong)}
.who{display:flex;align-items:center;gap:10px;min-width:0}
.who b{font-weight:600;display:block;line-height:1.25}
.who small{display:block;color:var(--muted);font-size:12.5px;line-height:1.3}
.pager{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 2px;font-size:13.5px;color:var(--muted)}

/* ---------- pills, tags, status ---------- */
.pill{display:inline-flex;align-items:center;gap:5px;font:600 12px/1 var(--f-body);padding:5px 9px;border-radius:12px;white-space:nowrap;background:var(--sunk);color:var(--muted)}
.pill.good{background:var(--good-soft);color:var(--good)} .pill.warn{background:var(--warn-soft);color:var(--warn)}
.pill.bad{background:var(--bad-soft);color:var(--bad)} .pill.act{background:var(--act-soft);color:var(--act)} .pill.info{background:var(--info-soft);color:var(--info)}
.rating{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:13.5px}
.rating i{width:10px;height:10px;border-radius:50%;display:inline-block}
.r1 i{background:var(--bad)} .r2 i{background:var(--warn)} .r3 i{background:var(--good)} .r4 i{background:var(--info)} .r5 i{background:#7b4fb5}
.box-top{color:var(--top)} .box-core{color:var(--core)} .box-under{color:var(--under)}
.tag{display:inline-block;font-size:12px;padding:2px 8px;border-radius:4px;background:var(--sunk);color:var(--muted)}

/* ---------- tabs ---------- */
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:22px;overflow-x:auto}
.tabs a{padding:10px 14px;color:var(--muted);font-weight:600;font-size:14.5px;border-bottom:3px solid transparent;margin-bottom:-1px;white-space:nowrap}
.tabs a:hover{color:var(--ink);text-decoration:none}
.tabs a.on{color:var(--ink);border-bottom-color:var(--brand)}

/* ---------- stats ---------- */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:20px}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:14px 16px}
.stat b{display:block;font:800 26px/1.1 var(--f-display);letter-spacing:-.02em}
.stat span{color:var(--muted);font-size:13.5px}
.bar{height:8px;border-radius:4px;background:var(--sunk);overflow:hidden}
.bar>i{display:block;height:100%;background:var(--act);border-radius:4px}
.bar.good>i{background:var(--good)}

/* ---------- home: tasks, feed, quick actions (Culture Amp-style warmth) ---------- */
.hello{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}
.hello h1{font-size:clamp(26px,3vw,34px)}
.tasks{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg)}
.tasks>.hd{display:flex;justify-content:space-between;align-items:center;padding:18px 22px 6px}
.task{display:flex;gap:14px;align-items:center;padding:14px 22px;border-top:1px solid var(--line)}
.task:first-of-type{border-top:0}
.task .ico{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;flex:none;background:var(--act-soft);color:var(--act)}
.task .ico svg{width:20px;height:20px}
.task .what{flex:1;min-width:0}
.task .what b{display:block;font-weight:600}
.task .what small{color:var(--muted);font-size:13px}
.task .due{font-size:13px;color:var(--muted);white-space:nowrap}
.task .due.late{color:var(--bad);font-weight:600}
.empty{display:flex;gap:28px;align-items:center;padding:26px 28px;background:var(--raised);border-radius:var(--r-lg)}
.empty svg.illus{width:120px;height:120px;flex:none}
.empty h3{font-size:19px;margin-bottom:6px}
.empty p{color:var(--muted)}
@media (max-width:640px){.empty{flex-direction:column;text-align:center}}
.prompt{display:flex;gap:26px;align-items:center;padding:24px 28px;border-radius:var(--r-lg);background:var(--act-soft);border:1px solid color-mix(in srgb,var(--act) 30%,transparent)}
.prompt svg.illus{width:110px;height:110px;flex:none}
.prompt h3{font-size:19px;margin-bottom:6px}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.tile{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:22px 20px 20px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px;color:var(--ink)}
.tile:hover{border-color:var(--line-strong);text-decoration:none;box-shadow:var(--shadow)}
.tile svg.illus{width:110px;height:110px}
.tile h3{font-size:17px}
.tile p{color:var(--muted);font-size:14px;flex:1}
.tile .btn{margin-top:6px}
.feed{display:flex;flex-direction:column}
.feeditem{display:flex;gap:12px;padding:14px 0;border-top:1px solid var(--line)}
.feeditem:first-child{border-top:0}
.feeditem .body{flex:1;min-width:0}
.feeditem .meta{font-size:12.5px;color:var(--muted);margin-top:4px}
.shout{background:linear-gradient(0deg,var(--surface),var(--surface)) padding-box;border-left:3px solid var(--brand);padding-left:12px}

/* ---------- review forms ---------- */
.q{padding:18px 0;border-top:1px solid var(--line)}
.q:first-child{border-top:0;padding-top:0}
.q h3{margin-bottom:4px}
.q .help{margin-bottom:10px}
.scale{display:flex;flex-wrap:wrap;gap:8px}
.answer{white-space:pre-wrap;background:var(--raised);border-radius:var(--r);padding:12px 14px;font-size:14.5px}
.side{position:sticky;top:80px}

/* ---------- misc ---------- */
.timeline{list-style:none;margin:0;padding:0}
.timeline li{position:relative;padding:0 0 16px 22px;border-left:2px solid var(--line);margin-left:6px}
.timeline li::before{content:"";position:absolute;left:-7px;top:4px;width:12px;height:12px;border-radius:50%;background:var(--surface);border:2px solid var(--line-strong)}
.timeline li.done::before{background:var(--good);border-color:var(--good)}
.timeline li.now::before{background:var(--brand);border-color:var(--brand)}
.timeline li:last-child{border-left-color:transparent}
.steps{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:18px}
.steps span{font-size:13px;padding:5px 10px;border-radius:14px;background:var(--sunk);color:var(--muted)}
.steps span.done{background:var(--good-soft);color:var(--good)}
.steps span.now{background:var(--act-soft);color:var(--act);font-weight:600}
.kanban{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,1fr);gap:12px;overflow-x:auto;padding-bottom:6px}
.lane{background:var(--sunk);border-radius:var(--r);padding:10px;min-height:120px}
.lane h4{font-size:13px;margin:2px 4px 10px;display:flex;justify-content:space-between}
.lane .cardlet{display:block;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:9px 11px;margin-bottom:8px;color:var(--ink);font-size:14px}
.lane .cardlet:hover{border-color:var(--act);text-decoration:none}
.login{min-height:100vh;display:grid;place-items:center;padding:24px;background:var(--bar)}
.login .box{background:var(--surface);border-radius:var(--r-lg);padding:34px;width:min(440px,100%);box-shadow:0 20px 60px rgba(0,0,0,.35)}
.login .brand{color:var(--ink);padding:0}
.login .brand b{font-size:22px}
.btn.ms{gap:10px;padding:11px 18px;width:100%}
.btn.ms svg{width:18px;height:18px}
@media print{.topbar,.noprint{display:none!important}.page{padding:0}body{background:#fff}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* light / dark switch: show the moon in light mode and the sun in dark mode */
.themepick{position:relative}
.themepick>summary{list-style:none;cursor:pointer}
.themepick>summary::-webkit-details-marker{display:none}
.themepick .menu-panel{left:auto;right:0;min-width:230px;margin:0}
.themepick .themes button svg{width:17px;height:17px;flex:none}
.themepick .themes button{display:flex;gap:10px;align-items:center;width:100%;background:none;border:0;padding:8px 12px;border-radius:var(--r-sm);font:inherit;font-size:14.5px;color:var(--ink);cursor:pointer;text-align:left}
.themepick .themes button:hover,.themepick .themes button:focus-visible{background:var(--sunk)}
.themepick .themes button[aria-checked=true]{color:var(--act);font-weight:600}
.themepick .themes button[aria-checked=true]::after{content:"✓";margin-left:auto}
.themepick summary .i-sun{display:none}
:root[data-theme="dark"] .themepick summary .i-sun{display:block}
:root[data-theme="dark"] .themepick summary .i-moon{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .themepick summary .i-sun{display:block}
  :root:not([data-theme="light"]) .themepick summary .i-moon{display:none}}

/* Export menu (partials/ui.html export_menu) */
.exportmenu{position:relative;display:inline-block}
.exportmenu>summary{list-style:none;display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.exportmenu>summary::-webkit-details-marker{display:none}
.exportmenu .chev{width:10px;height:10px}
.exportmenu .menu-panel{position:absolute;right:0;top:calc(100% + 6px);min-width:140px;z-index:40;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r-sm);box-shadow:0 8px 24px rgba(0,0,0,.12);padding:6px;display:flex;flex-direction:column}
.exportmenu .menu-panel a{padding:8px 10px;border-radius:6px;color:var(--ink);text-decoration:none}
.exportmenu .menu-panel a:hover{background:var(--hover, rgba(0,0,0,.05))}
.exportmenu .menu-panel a.busy{opacity:.6}

/* Print / PDF layout */
.printhead{display:none}
@media print{
  @page{size:A4 landscape;margin:10mm}
}
html.printmode .topbar,html.printmode .devbanner,html.printmode .noprint,html.printmode .exportmenu,
html.printmode .flash,html.printmode .aipanel,html.printmode .navtoggle{display:none!important}
html.printmode .printhead{display:block;font-size:11px;color:#555;padding:8px 24px 0}
html.printmode body{background:#fff}
html.printmode .page{max-width:none;padding-top:8px}
html.printmode .card,html.printmode table,html.printmode .chartbox,html.printmode tr{break-inside:avoid}
html.printmode details>*{display:block}
@media print{
  .topbar,.devbanner,.noprint,.exportmenu,.flash,.navtoggle,.aipanel{display:none!important}
  .printhead{display:block;font-size:11px;color:#555}
}
.pagehead .pageexport{margin-left:auto;align-self:flex-start}

/* phones: the top bar keeps every tool within 390px (the light/dark switch is also in Email and display settings) */
@media (max-width:560px){
  .topbar .in{gap:6px;padding-left:12px;padding-right:12px}
  .brand b{display:none}
  .tools{gap:0}
  .tool{padding:6px 6px}
  .themepick{display:none}
}

/* =====================================================================================================
   Exa Insights
   ===================================================================================================== */
.brand .mark{width:20px;height:22px;display:block}
.brand b small{font:600 11px var(--f-body);color:var(--bar-muted);margin-left:6px;letter-spacing:.02em}

/* home */
.welcome{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:24px;align-items:center;padding:26px 30px;border-radius:var(--r-lg);
  background:linear-gradient(120deg,var(--act-soft),var(--surface) 70%);border:1px solid var(--line);margin-bottom:24px}
.welcome h1{font-size:clamp(26px,3vw,34px)}
.welcome p{color:var(--muted);margin-top:8px;max-width:60ch}
.welcome>svg{width:200px;height:170px}
@media (max-width:760px){.welcome{grid-template-columns:1fr}.welcome>svg,.welcome>svg.pbi{display:none}}
.kpis{display:flex;gap:26px;flex-wrap:wrap;margin-top:16px}
.kpis div b{display:block;font:800 26px/1 var(--f-display)}
.kpis div span{font-size:13px;color:var(--muted)}
.kpis .bad b{color:var(--bad)}

/* course cards */
.cgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;list-style:none;margin:0;padding:0}
.ccard{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;position:relative}
.ccard:hover{border-color:var(--line-strong);box-shadow:var(--shadow)}
.ccard .art{height:118px;background:var(--raised);display:grid;place-items:center;border-bottom:1px solid var(--line)}
.ccard .art svg{height:104px;width:auto}
.ccard .art.k-link{background:color-mix(in srgb,var(--info-soft) 70%,var(--surface))}
.ccard .art.k-playbook{background:color-mix(in srgb,var(--warn-soft) 60%,var(--surface))}
.ccard .art.k-module{background:color-mix(in srgb,var(--act-soft) 70%,var(--surface))}
.ccard .body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1}
.ccard h3{font-size:16px;line-height:1.3}
.ccard h3 a{color:var(--ink)}
.ccard h3 a::after{content:"";position:absolute;inset:0}
.ccard p.sum{color:var(--muted);font-size:13.5px;flex:1}
.ccard .meta{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;font-size:12.5px;color:var(--muted)}
.ccard .bar{margin-top:4px}
.eyebrow{font:700 11.5px var(--f-body);letter-spacing:.06em;text-transform:uppercase;color:var(--act)}

/* course page */
.chero{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:28px;align-items:center;margin-bottom:24px}
.chero h1{margin:6px 0 10px}
.chero .sub{color:var(--muted);font-size:16.5px;max-width:64ch}
.chero .art{background:var(--raised);border-radius:var(--r-lg);display:grid;place-items:center;padding:14px}
.chero .art svg{width:100%;height:180px}
@media (max-width:860px){.chero{grid-template-columns:1fr}.chero .art{display:none}}
.facts{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:13.5px;color:var(--muted);margin-top:14px}
.facts b{color:var(--ink);font-weight:600}
.lessonlist{list-style:none;margin:0;padding:0;counter-reset:l}
.lessonlist li{display:flex;gap:12px;align-items:center;padding:12px 4px;border-top:1px solid var(--line)}
.lessonlist li:first-child{border-top:0}
.lessonlist .n{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font:700 12.5px var(--f-body);background:var(--sunk);color:var(--muted);flex:none}
.lessonlist li.done .n{background:var(--good);color:#fff}
.lessonlist li.here .n{background:var(--act);color:var(--act-ink)}
.lessonlist .t{flex:1;min-width:0}
.lessonlist .t small{display:block;color:var(--muted);font-size:12.5px}
.learnbox ul{margin:8px 0 0;padding-left:20px}
.learnbox li{margin:4px 0}

/* lesson player */
.player{display:grid;grid-template-columns:280px minmax(0,1fr);gap:28px;align-items:start}
.player aside{position:sticky;top:80px}
.player aside .lessonlist li{padding:9px 2px}
.player aside .lessonlist a{color:var(--ink)}
.player article{max-width:760px}
.player article h1{font-size:28px;margin-bottom:14px}
@media (max-width:900px){.player{grid-template-columns:1fr}.player aside{position:static}}
.lesson-body{font-size:16px;line-height:1.65}
.lesson-body h3{margin:22px 0 8px;font-size:18px}
.lesson-body p{margin:0 0 12px}
.lesson-body ul,.lesson-body ol{margin:0 0 12px}
.video{position:relative;padding-top:56.25%;border-radius:var(--r);overflow:hidden;background:#000;margin-bottom:16px}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.lessonnav{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:28px;padding-top:18px;border-top:1px solid var(--line)}
.check-q{background:var(--raised);border-radius:var(--r-lg);padding:18px 20px;margin-top:22px}

/* quiz */
.quiz .q{padding:20px 0}
.quiz .q h3{font-size:16.5px;margin-bottom:10px;line-height:1.4}
.opts{display:flex;flex-direction:column;gap:8px}
.opt{display:flex;gap:10px;align-items:flex-start;padding:11px 14px;border:1.5px solid var(--line-strong);border-radius:var(--r);cursor:pointer;font-size:15px}
.opt:hover{border-color:var(--act)}
.opt:has(input:checked){border-color:var(--act);background:var(--act-soft)}
.opt input{margin-top:3px}
.opt.right{border-color:var(--good);background:var(--good-soft)}
.opt.wrong{border-color:var(--bad);background:var(--bad-soft)}
.why{margin-top:8px;font-size:14px;color:var(--muted)}
.score{display:flex;gap:22px;align-items:center;padding:22px 26px;border-radius:var(--r-lg);margin-bottom:20px}
.score.pass{background:var(--good-soft)} .score.fail{background:var(--warn-soft)}
.score b.big{font:800 44px/1 var(--f-display)}

/* paths */
.pathsteps{list-style:none;margin:0;padding:0;position:relative}
.pathsteps li{display:flex;gap:16px;padding:0 0 22px 0;position:relative}
.pathsteps li::before{content:"";position:absolute;left:17px;top:38px;bottom:0;width:2px;background:var(--line)}
.pathsteps li:last-child::before{display:none}
.pathsteps .dot{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font:700 14px var(--f-body);background:var(--sunk);color:var(--muted);flex:none;border:2px solid var(--line)}
.pathsteps li.completed .dot{background:var(--good);border-color:var(--good);color:#fff}
.pathsteps li.in_progress .dot,.pathsteps li.assigned .dot,.pathsteps li.overdue .dot{border-color:var(--act);color:var(--act)}
.pathsteps .card{flex:1}

/* app card (KnowBe4) */
.appcard{display:flex;gap:16px;align-items:center;padding:16px 18px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface)}
.appcard .logo{width:44px;height:44px;border-radius:10px;display:grid;place-items:center;background:var(--info-soft);color:var(--info);flex:none}
.appcard .logo svg{width:24px;height:24px}
.appcard .what{flex:1}
.appcard .what small{display:block;color:var(--muted);font-size:13px}

/* author */
.audgroup{border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;margin-top:10px}
.audgroup legend{font-size:13.5px}
.audgroup .choices{gap:6px}
.audgroup .choice span{padding:5px 10px;font-size:13px}
.statusbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:12px 16px;border-radius:var(--r);background:var(--raised);margin-bottom:18px}
.qedit{border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;margin-bottom:12px;background:var(--surface)}
.qedit .optrow{display:flex;gap:8px;align-items:center;margin-top:6px}
.qedit .optrow input[type=text]{flex:1}
.markup-help{font-size:13px;color:var(--muted)}
.markup-help code{font-family:var(--f-mono);font-size:12px;background:var(--sunk);padding:1px 4px;border-radius:3px}

/* ask */
.askbox{display:flex;gap:10px}
.askbox input{flex:1}
.answer-text{white-space:pre-wrap;line-height:1.6;font-size:15.5px}
.sources{margin:12px 0 0;padding-left:20px;font-size:14px}

/* certificates */
.certlist{list-style:none;margin:0;padding:0}
.certlist li{display:flex;gap:14px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
.certlist li:first-child{border-top:0}
.certlist .seal{width:36px;height:36px;border-radius:50%;background:var(--good-soft);color:var(--good);display:grid;place-items:center;flex:none}
.certlist .seal svg{width:20px;height:20px}
.certlist .t{flex:1;min-width:0}
.certlist .t small{display:block;color:var(--muted);font-size:12.5px}
.swatch{display:inline-block;width:14px;height:14px;border-radius:4px;vertical-align:middle;border:1px solid var(--line)}
.login-art svg{display:block;height:120px;width:auto;margin:0 auto}
/* pictures */
.ccard .art.photo{padding:0;display:block;background:var(--sunk)}
.ccard .art.photo img{width:100%;height:118px;object-fit:cover;display:block}
.chero .art.photo{padding:0;overflow:hidden}
.chero .art.photo img{width:100%;height:208px;object-fit:cover;display:block}
.pb-figure{margin:18px 0}
.pb-figure img{display:block;max-width:100%;height:auto;border-radius:var(--r);border:1px solid var(--line)}
.pb-figure.half img{max-width:min(100%,380px)}
.pb-figure.small img{max-width:min(100%,220px)}
.pb-figure figcaption{font-size:13.5px;color:var(--muted);margin-top:6px}
.imglist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}
.imglist li{display:flex;flex-direction:column;gap:4px}
.imglist img{width:100%;height:80px;object-fit:cover;border-radius:6px;border:1px solid var(--line)}
.imglist code{font:11.5px var(--f-mono);word-break:break-all;user-select:all;background:var(--sunk);padding:2px 4px;border-radius:3px}

/* lesson editor (static/editor.js) */
.rte{border:1.5px solid var(--line-strong);border-radius:var(--r);background:var(--surface);position:relative}
.rte:focus-within{border-color:var(--act);box-shadow:0 0 0 3px var(--act-soft)}
.rte-toolbar{position:sticky;top:60px;z-index:5;display:flex;flex-wrap:wrap;gap:6px 10px;padding:8px 10px;border-bottom:1px solid var(--line);
  background:var(--raised);border-radius:var(--r) var(--r) 0 0}
.rte-group{display:inline-flex;gap:2px;padding-right:10px;border-right:1px solid var(--line)}
.rte-group:last-of-type{border-right:0}
.rte-toolbar button{font:600 13px var(--f-body);color:var(--ink);background:none;border:1px solid transparent;border-radius:6px;padding:5px 8px;cursor:pointer;white-space:nowrap}
.rte-toolbar button:hover{background:var(--sunk);border-color:var(--line)}
.rte-toolbar button.rte-primary{color:var(--act)}
.rte-imgtools{display:none;gap:2px}
.rte.img-on .rte-imgtools{display:inline-flex}
.rte.img-on .rte-imgtools button{color:var(--act)}
.rte-area{min-height:320px;padding:18px 22px;outline:none;font-size:16px;line-height:1.65}
.rte.tall .rte-area{min-height:520px}
.rte-area:empty::before,.rte-area>p:only-child:has(br:only-child)::before{content:"Type here, or paste the module (Cmd+V / Ctrl+V)…";color:var(--faint);position:absolute;pointer-events:none}
.rte-area img{cursor:pointer}
.rte-area img.rte-selected{outline:3px solid var(--act);outline-offset:2px}
.rte-area h2{font-size:22px;margin:22px 0 8px}
.rte-area h3{font-size:18px;margin:18px 0 6px}
.rte-status{min-height:22px;padding:6px 12px;font-size:13px;color:var(--muted);border-top:1px solid var(--line)}
.rte-status.ok{color:var(--good)} .rte-status.warn{color:var(--warn)} .rte-status.err{color:var(--bad)}
.rte.busy .rte-status::before{content:"";display:inline-block;width:10px;height:10px;margin-right:6px;border:2px solid var(--act);border-right-color:transparent;border-radius:50%;animation:rtespin .8s linear infinite;vertical-align:-1px}
@keyframes rtespin{to{transform:rotate(360deg)}}
.pb-prose table,.lesson-body table{border-collapse:collapse;margin:14px 0;width:100%;font-size:14.5px}
.pb-prose th,.pb-prose td{border:1px solid var(--line-strong);padding:7px 10px;text-align:left;vertical-align:top}
.pb-prose th{background:var(--raised)}
.pb-prose blockquote:not(.pb-quote):not(.pb-say){margin:14px 0;padding:6px 0 6px 18px;border-left:4px solid var(--line-strong);color:var(--muted)}
.lesson-body h2{font-size:22px;margin:24px 0 8px}
.pb-prose img,.lesson-body img{max-width:100%;height:auto;border-radius:6px}

/* metric cards (Exa 101): name, baseline, formula, what it tells us */
.pb-metrics{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;margin:16px 0 22px}
.pb-metric{background:var(--surface);border:1px solid var(--line);border-top:4px solid var(--act);border-radius:12px;padding:16px 18px;display:flex;flex-direction:column;gap:8px}
.pb-prose .pb-metric h4,.lesson-body .pb-metric h4{margin:0;font:700 17px/1.25 var(--f-display)}
.pb-prose .pb-metric p{margin:0}
.pb-metric-target{font-weight:700;font-size:13.5px;color:#c55f12}
:root[data-theme="dark"] .pb-metric-target{color:#f2a15f}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .pb-metric-target{color:#f2a15f}}
.pb-metric-formula{font-size:14px;background:var(--sunk);border-radius:8px;padding:9px 11px;font-variant-numeric:tabular-nums}
.pb-metric-label{font:700 11.5px var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-top:2px!important}
.pb-kicker{font:700 12px var(--f-body);letter-spacing:.12em;text-transform:uppercase;color:var(--act);margin:26px 0 -4px!important}
.pb-scroll{overflow-x:auto;margin:14px 0}
.pb-prose table.pb-table{font-size:14.5px;border:1px solid var(--line);border-radius:12px;border-collapse:separate;border-spacing:0;overflow:hidden;margin:0}
.pb-prose table.pb-table th{background:var(--raised);border:0;border-bottom:2px solid var(--act);font-weight:700;padding:10px 12px}
.pb-prose table.pb-table td{border:0;border-top:1px solid var(--line);padding:10px 12px}
.pb-prose table.pb-table td:first-child{font-weight:700}
.pb-prose table.pb-table ul{margin:0;padding-left:18px}
.pb-prose table.pb-table td:first-child,.pb-prose table.pb-table th:first-child{white-space:nowrap}

/* ---------- learning path launch page (e.g. Exa 101) ---------- */
.lessoncount{font-size:12.5px;font-weight:600;color:var(--muted);margin-bottom:6px;letter-spacing:.01em}
.lp-hero{position:relative;overflow:hidden;border-radius:22px;background:#0a1f28;color:#fff;min-height:400px;display:flex;align-items:flex-end;margin-bottom:18px;box-shadow:0 20px 50px rgba(10,31,40,.25)}
.lp-hero-img{position:absolute;right:0;top:0;height:100%;width:auto;max-width:none}
.lp-hero.has-img::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,31,40,.96) 0%,rgba(10,31,40,.85) 34%,rgba(10,31,40,.15) 62%,rgba(10,31,40,0) 100%)}
.lp-hero-art{position:absolute;right:4%;top:50%;transform:translateY(-50%);width:34%;opacity:.95}
.lp-hero-in{position:relative;z-index:1;padding:44px 48px;max-width:640px}
.lp-eyebrow{display:inline-block;font:700 12px var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:#7fd5d1}
.lp-hero h1{font:800 clamp(40px,6vw,64px)/1 var(--f-display);letter-spacing:-.02em;margin:10px 0 12px;color:#fff}
.lp-lede{font-size:19px;line-height:1.45;color:#d6e4e8;margin:0 0 20px;max-width:46ch}
.lp-stats{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0 0 20px}
.lp-stats li{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:6px 13px;font-size:13.5px;color:#d6e4e8;backdrop-filter:blur(6px)}
.lp-stats b{color:#fff}
.lp-progress{display:flex;align-items:center;gap:12px;margin-bottom:22px;font-size:13.5px;color:#b9cbd1}
.lp-bar{flex:0 0 220px;height:8px;border-radius:99px;background:rgba(255,255,255,.14);overflow:hidden}
.lp-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#2a9d9b,#7fd5d1)}
.lp-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.btn.lg{padding:12px 20px;font-size:15px;border-radius:12px}
.lp-hero .btn.primary{background:#f47b20;border-color:#f47b20;color:#fff}
.lp-hero .btn.primary:hover{background:#e06a14;border-color:#e06a14}
.btn.lp-ghost{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.28);color:#fff}
.btn.lp-ghost:hover{background:rgba(255,255,255,.16)}
.lp-chip{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:8px 14px;background:rgba(127,213,209,.16);color:#7fd5d1;font-weight:600;font-size:14px}

.lp-steps{display:flex;gap:6px;overflow-x:auto;padding:4px 2px 10px;margin:0 0 26px;scrollbar-width:thin}
.lp-step{flex:1 0 118px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;text-decoration:none;color:var(--ink);padding:12px 8px;border-radius:14px;position:relative}
.lp-step:hover{background:var(--surface);text-decoration:none}
.lp-step:not(:last-child)::after{content:"";position:absolute;top:30px;left:calc(50% + 22px);right:calc(-50% + 22px);height:2px;background:var(--line-strong)}
.lp-step .n{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font:800 15px var(--f-display);background:var(--surface);border:2px solid var(--act);color:var(--act);position:relative;z-index:1}
.lp-step.completed .n{background:var(--act);color:var(--act-ink)}
.lp-step.in_progress .n{box-shadow:0 0 0 5px var(--act-soft)}
.lp-step.soon .n{border-style:dashed;border-color:var(--line-strong);color:var(--faint)}
.lp-step .t{font-size:12.5px;font-weight:600;line-height:1.25;color:var(--muted)}
.lp-step.soon .t{color:var(--faint)}

.lp-about{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(260px,1fr);gap:18px;margin-bottom:22px}
.lp-about-main{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:26px 30px}
.lp-about-main h3:first-child{margin-top:0;font:800 22px/1.2 var(--f-display)}
.lp-glance{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:22px 24px;align-self:start}
.lp-glance h2{font:800 16px var(--f-display);margin:0 0 12px}
.lp-glance dl{margin:0;display:grid;gap:12px}
.lp-glance dt{font:700 11.5px var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.lp-glance dd{margin:2px 0 0;font-size:14.5px}

.lp-pre{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:20px 24px;margin-bottom:30px}
.lp-pre.locked{border:2px solid #f47b20;background:linear-gradient(0deg,var(--surface),var(--surface)) padding-box}
.lp-pre-head{display:flex;gap:14px;align-items:flex-start;margin-bottom:14px}
.lp-pre-head h2{font:800 18px var(--f-display);margin:0 0 2px}
.lp-pre-head p{margin:0;color:var(--muted)}
.lp-pre-icon{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--act-soft);color:var(--act);font-weight:800}
.lp-pre.locked .lp-pre-icon{background:#fdebdc;color:#c55f12}
.lp-pre-course{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;padding:12px;border-radius:14px;background:var(--raised)}
.lp-pre-course img{width:132px;height:74px;object-fit:cover;border-radius:10px}
.lp-pre-course .t{display:flex;flex-direction:column;gap:3px;min-width:0}
.lp-pre-course .t small{color:var(--muted);font-size:13.5px}
.lp-pre-course .a{display:flex;gap:10px;align-items:center}

.lp-h2{font:800 26px var(--f-display);letter-spacing:-.01em;margin:6px 0 16px}
.lp-mods{list-style:none;padding:0;margin:0 0 40px;display:grid;gap:20px}
.lp-mod{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);border-radius:20px;overflow:hidden;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);transition:transform .25s ease,box-shadow .25s ease;scroll-margin-top:90px}
.lp-mod:hover{transform:translateY(-3px);box-shadow:0 2px 4px rgba(30,33,37,.06),0 18px 40px rgba(30,33,37,.12)}
.lp-mod.flip .lp-mod-art{order:2}
.lp-mod-art{position:relative;min-height:280px;overflow:hidden;background:#0a1f28}
.lp-mod-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.lp-mod:hover .lp-mod-art img{transform:scale(1.035)}
.lp-mod-illus{position:absolute;inset:12%}
.lp-mod.soon .lp-mod-art img{filter:saturate(.8) brightness(.94)}
.lp-flag{position:absolute;left:18px;top:18px;background:rgba(10,31,40,.78);color:#fff;font:700 12.5px var(--f-body);letter-spacing:.04em;padding:7px 12px;border-radius:999px;backdrop-filter:blur(6px)}
.lp-flag.good{background:#2e8b5a}
.lp-mod-body{padding:34px 38px;display:flex;flex-direction:column;gap:12px;justify-content:center}
.lp-mod-num{font:700 12px var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--act)}
.lp-mod-body h3{font:800 clamp(24px,2.6vw,30px)/1.12 var(--f-display);letter-spacing:-.01em;margin:0}
.lp-mod-body h3 a{color:inherit;text-decoration:none}
.lp-mod-body h3 a:hover{color:var(--act)}
.lp-mod-text{color:var(--muted);font-size:15.5px;line-height:1.6}
.lp-mod-text p{margin:0 0 8px}
.lp-mod-text ul{margin:4px 0 8px}
.lp-mod-meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.lp-mod-meta>span:not(.pill){font-size:13px;font-weight:600;color:var(--ink);background:var(--sunk);border-radius:8px;padding:5px 10px}
.lp-mod-cta{margin-top:4px}
.lp-soon{color:var(--faint);font-size:14px;font-style:italic}
.lp-locked{display:inline-flex;gap:7px;align-items:center;color:#c55f12;font-weight:600;font-size:14px}
.lp-mod.gated .lp-mod-art img{filter:saturate(.7)}

@media (max-width:860px){
  .lp-hero{flex-direction:column;align-items:stretch;min-height:0}
  .lp-hero-img{position:relative;height:210px;width:100%;object-fit:cover;object-position:right center}
  .lp-hero.has-img::after{background:linear-gradient(180deg,rgba(10,31,40,0) 0%,rgba(10,31,40,0) 120px,#0a1f28 210px)}
  .lp-hero-art{display:none}
  .lp-hero-in{padding:6px 22px 26px}
  .lp-lede{font-size:17px}
  .lp-bar{flex-basis:150px}
  .lp-about{grid-template-columns:1fr}
  .lp-mod,.lp-mod.flip{grid-template-columns:1fr}
  .lp-mod.flip .lp-mod-art{order:0}
  .lp-mod-art{min-height:190px}
  .lp-mod-body{padding:22px 22px 26px}
  .lp-pre-course{grid-template-columns:1fr}
  .lp-pre-course img{width:100%;height:120px}
  .lp-step{flex-basis:96px}
}
/* "Exa" keeps its case inside labels styled in capitals (app/brand.py) */
x-nx{text-transform:none}
/* Audience editor ("Who it's for"), simplified 9 Nov 2026 */
.aud-presets{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px}
.aud-preset{position:relative;display:flex;flex-direction:column;gap:2px;padding:10px 12px 10px 36px;border:1.5px solid var(--line-strong);border-radius:var(--r);cursor:pointer;background:var(--card, transparent)}
.aud-preset input{position:absolute;left:12px;top:13px;margin:0;accent-color:var(--act)}
.aud-preset b{font-size:14px} .aud-preset small{font-size:12.5px;color:var(--muted);line-height:1.35}
.aud-preset:has(input:checked){border-color:var(--act);background:var(--act-soft)}
.aud-preset:has(input:focus-visible){outline:2px solid var(--brand);outline-offset:2px}
.aud-row{display:grid;grid-template-columns:1.1fr 1.6fr .9fr;gap:14px}
@media (max-width:900px){.aud-row{grid-template-columns:1fr}}
.aud-more{margin-top:10px} .aud-more summary,.aud-add summary{cursor:pointer;font-size:13.5px;font-weight:600;color:var(--act)}
.aud-more[open] summary{margin-bottom:8px}
details.audgroup:not([open]){border-style:dashed}
.aud-reach{margin:4px 0 0;font-size:13.5px;color:var(--muted)} .aud-reach b{color:var(--ink)}
/* Fireside (9 Nov 2026) */
.fs-hero{display:flex;flex-wrap:wrap;gap:16px 24px;align-items:flex-end;justify-content:space-between;padding:28px 30px;margin-bottom:24px;border-radius:var(--r-lg);color:#fff;
  background:radial-gradient(circle at 88% 20%,rgba(240,160,32,.55),transparent 42%),linear-gradient(135deg,#1b1f2b,#3b2a1f)}
.fs-hero .eyebrow{color:#f6c06a} .fs-hero h1{color:#fff;font-size:clamp(28px,3.2vw,38px);margin:4px 0 8px} .fs-hero p{color:#e6e1d9;max-width:62ch}
.fs-hero .btn{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.35)}
.fs-upcoming{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.fs-up{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:18px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px 18px}
.fs-up.first{border-color:color-mix(in srgb,#f0a020 55%,var(--line));box-shadow:0 0 0 3px color-mix(in srgb,#f0a020 14%,transparent)}
.fs-date{width:64px;height:68px;border-radius:14px;background:#2b2118;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center}
.fs-date b{font:800 26px/1 var(--f-head,inherit)} .fs-date span{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#f6c06a;margin-top:3px}
.fs-up h3{font-size:17px;margin:3px 0 4px} .fs-up h3 a{color:var(--ink)} .fs-up .sum{color:var(--muted);margin:0 0 6px}
.fs-up .meta,.fs-ep .meta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13px;color:var(--muted);align-items:center}
.fs-up-act{display:flex;flex-direction:column;gap:8px;align-items:stretch;min-width:150px}
.fs-up-act form{display:contents}
@media (max-width:720px){.fs-up{grid-template-columns:56px minmax(0,1fr)} .fs-up-act{grid-column:1 / -1;flex-direction:row;flex-wrap:wrap}}
.ccard .art.k-fireside{background:linear-gradient(135deg,#2b2118,#4a3424);position:relative}
.fs-ep .art{position:relative;text-decoration:none}
.fs-play{position:absolute;right:12px;bottom:10px;width:38px;height:38px;border-radius:50%;background:#f0a020;color:#2b1a00;display:grid;place-items:center;font-size:15px;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.video.audio{padding-top:0;height:180px}
.fs-guest{display:flex;gap:10px;align-items:center}
/* Built-in reports (9 Nov 2026) */
.rb-group{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:14px 0 8px}
.rb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.rb-card{display:flex;flex-direction:column;gap:4px;padding:14px 16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);color:var(--ink);text-decoration:none}
.rb-card:hover{border-color:var(--act);box-shadow:var(--shadow)} .rb-card b{font-size:15px;color:var(--act)} .rb-card span{font-size:13px;color:var(--muted);line-height:1.4}
.rb-bar{display:grid;grid-template-columns:minmax(120px,220px) 1fr 60px;gap:10px;align-items:center;margin:5px 0;font-size:13px}
.rb-bar .l{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .rb-bar .v{text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
.rb-bar .b{height:16px;background:var(--sunk);border-radius:5px;overflow:hidden} .rb-bar .b i{display:block;height:100%;background:var(--brand);border-radius:5px}
/* Welcome video on Home (10 Nov 2026): a card at the top, like Exa Atlas */
.intro-card{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,520px);gap:28px;align-items:center;
  background:var(--surface);border:1px solid var(--line);border-left:4px solid #f47b20;border-radius:var(--r-lg);padding:20px 56px 20px 26px;margin-bottom:22px}
.intro-card h2{font-size:21px;margin:6px 0 8px} .intro-card p{color:var(--muted);margin:0;max-width:52ch;line-height:1.5}
.intro-card video{display:block;width:100%;aspect-ratio:16/9;background:#000;border-radius:12px}
.intro-x{position:absolute;top:10px;right:10px;width:36px;height:36px;border-radius:50%;border:0;background:transparent;color:var(--muted);font-size:24px;line-height:1;cursor:pointer}
.intro-x:hover{background:var(--sunk);color:var(--ink)} .intro-x:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
@media (max-width:900px){.intro-card{grid-template-columns:1fr;padding-right:26px}}
.intro-link{margin-top:6px} .intro-link a{font-weight:600}
.section-title.start{justify-content:flex-start}

/* ---- Building blocks (blocks.py): charts, big numbers, steps, timeline, recordings ------------------------------ */
:root{--c0:#1d6b6e;--c1:#f47b20;--c2:#8b929c;--c3:#2f6fb0}
:root[data-theme="dark"]{--c0:#5cc6c2;--c1:#f59a52;--c2:#a5acb6;--c3:#7cb0e6}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--c0:#5cc6c2;--c1:#f59a52;--c2:#a5acb6;--c3:#7cb0e6}}
.pb-chartfig{margin:22px 0;padding:16px 18px 10px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg)}
.pb-chartfig figcaption{font:700 16px/1.3 var(--f-display);color:var(--ink);margin-bottom:6px}
.pb-chart-svg{display:block;width:100%;height:auto;overflow:visible}
.pb-chart-svg .s0{fill:var(--c0);stroke:var(--c0)} .pb-chart-svg .s1{fill:var(--c1);stroke:var(--c1)}
.pb-chart-svg .s2{fill:var(--c2);stroke:var(--c2)} .pb-chart-svg .s3{fill:var(--c3);stroke:var(--c3)}
.pb-chart-svg rect{stroke:none} .pb-chart-svg .ln{fill:none;stroke-width:3;stroke-linejoin:round;stroke-linecap:round}
.pb-chart-svg circle{stroke:var(--surface);stroke-width:2}
.pb-chart-svg .grid{stroke:var(--line);stroke-width:1} .pb-chart-svg .axis{stroke:var(--line-strong);stroke-width:1.5}
.pb-chart-svg text{font:12.5px var(--f-body);fill:var(--muted)} .pb-chart-svg .lab{fill:var(--ink);font-weight:600}
.pb-chart-svg .val{fill:var(--ink);font-weight:700;font-size:12px}
.pb-chart-legend{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13px;color:var(--muted);margin:0 0 6px}
.pb-chart-legend span{display:inline-flex;align-items:center;gap:6px} .pb-chart-legend i{width:12px;height:12px;border-radius:3px;display:inline-block}
.pb-chart-legend i.s0{background:var(--c0)} .pb-chart-legend i.s1{background:var(--c1)} .pb-chart-legend i.s2{background:var(--c2)} .pb-chart-legend i.s3{background:var(--c3)}
.pb-chart-data{margin-top:6px;font-size:13px} .pb-chart-data summary{cursor:pointer;color:var(--act);font-weight:600}
.pb-chart-data table{margin-top:8px;border-collapse:collapse} .pb-chart-data td,.pb-chart-data th{padding:4px 12px 4px 0;text-align:left;border-bottom:1px solid var(--line)}
.pb-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:22px 0}
.pb-stat{background:var(--act-soft);border-radius:var(--r-lg);padding:16px 18px}
.pb-stat .pb-stat-num,.pb-stat-num{font:800 clamp(28px,4vw,38px)/1.05 var(--f-display);color:var(--act);margin:0;letter-spacing:-.02em}
.pb-stat .pb-stat-label,.pb-stat-label{font-size:14px;color:var(--ink);margin:6px 0 0}
/* steps use the Playbooks style (playbooks.css .pb-steps); blocks.py adds the step body wrapper */
ol.pb-timeline{list-style:none;padding:0 0 0 22px;margin:20px 0;border-left:3px solid var(--line-strong)}
ol.pb-timeline>li{position:relative;padding:0 0 16px 12px}
ol.pb-timeline>li::before{content:"";position:absolute;left:-31px;top:4px;width:15px;height:15px;border-radius:50%;background:var(--surface);border:3px solid var(--exa)}
ol.pb-timeline>li>strong:first-child{display:block;font:800 17px var(--f-display);color:var(--act)}
.pb-media{margin:20px 0} .pb-media video{display:block;width:100%;max-height:70vh;border-radius:var(--r);background:#000}
.pb-media audio{display:block;width:100%} .pb-media figcaption{font-size:13.5px;color:var(--muted);margin-top:6px}
.pb-media-frame{position:relative;padding-top:56.25%;border-radius:var(--r);overflow:hidden;background:#000}
.pb-media-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
/* in the editor: blocks stay editable text, with a label saying what they'll become */
.rte-area .pb-chart,.rte-area a.pb-media{display:block;position:relative;border:1px dashed var(--line-strong);border-radius:var(--r);padding:28px 12px 10px;margin:14px 0}
.rte-area .pb-chart::before{content:"Chart (" attr(class) ") · edit the title and numbers here; Preview shows it drawn";position:absolute;top:6px;left:12px;font:700 11px var(--f-body);letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.rte-area .pb-chart.bar::before{content:"Bar chart · edit the title and numbers here; Preview shows it drawn"}
.rte-area .pb-chart.hbar::before{content:"Horizontal bar chart · edit the title and numbers here; Preview shows it drawn"}
.rte-area .pb-chart.line::before{content:"Line chart · edit the title and numbers here; Preview shows it drawn"}
.rte-area .pb-chart-title{font-weight:700}
.rte-area a.pb-media::before{content:"Recording · plays here on the lesson page";position:absolute;top:6px;left:12px;font:700 11px var(--f-body);letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.rte-area a.pb-media.audio::before{content:"Audio · plays here on the lesson page"}
.rte-dialog{border:0;border-radius:var(--r-lg);padding:22px 24px;width:min(560px,calc(100vw - 32px));background:var(--surface);color:var(--ink);box-shadow:0 20px 60px rgba(0,0,0,.3)}
.rte-dialog::backdrop{background:rgba(15,17,19,.45)} .rte-dialog h2{font-size:19px}
.rte-dialog textarea{font-family:var(--f-mono);font-size:13px} .rte-dialog-err{color:var(--bad)}
.rte-add button{font-weight:600}

/* ---- Guided steps, templates, checks, feedback ---------------------------------------------------------------- */
.wizard-steps{list-style:none;display:flex;flex-wrap:wrap;gap:6px;padding:0;margin:0 0 20px;counter-reset:none}
.wizard-steps li{font:600 13px var(--f-body);padding:7px 12px;border-radius:20px;background:var(--sunk);color:var(--muted)}
.wizard-steps li a{color:inherit;text-decoration:none}
.wizard-steps li.on{background:var(--act);color:var(--act-ink)}
.wizard-steps li.done{background:var(--good-soft);color:var(--good)} .wizard-steps li.done::before{content:"✓ "}
.section-h{font-size:17px;margin:8px 0 12px}
.starter-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin-bottom:26px}
.starter{display:flex;flex-direction:column;gap:6px;padding:16px 18px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);color:var(--ink);text-decoration:none;transition:border-color .15s,box-shadow .15s}
.starter:hover{border-color:var(--act);box-shadow:var(--shadow);text-decoration:none}
.starter b{font:700 16px var(--f-display)} .starter span{font-size:14px;color:var(--muted)} .starter small{font-size:12px;color:var(--act);font-weight:600;margin-top:auto}
.starter-grid.small .starter b{font-size:15px}
.starter-ico{width:36px;height:36px;border-radius:10px;background:var(--act-soft);display:grid;place-items:center}
.starter-ico::before{font:800 16px var(--f-display);color:var(--act)}
.ico-quiz::before{content:"?"} .ico-policy::before{content:"§"} .ico-onboarding::before{content:"★"} .ico-steps::before{content:"1·2"} .ico-blank::before{content:"+"}
.checklist{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.checklist li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px}
.checklist .ck{flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font:800 12px var(--f-body);background:var(--sunk);color:var(--muted)}
.checklist li.ok .ck{background:var(--good-soft);color:var(--good)} .checklist li.must .ck{background:var(--warn-soft);color:var(--warn)}
.checklist li.ok{color:var(--muted)}
.fb{margin:26px 0 8px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r);background:var(--raised)}
.fb-ask{display:flex;flex-wrap:wrap;gap:8px;align-items:center} .fb-ask span{margin-right:6px}
.fb .btn.on{border-color:var(--act);background:var(--act-soft);color:var(--act)}

/* ---- Phones (10 Nov 2026): the lesson comes first, filters take less room, tables drop secondary columns -------- */
.lessons-toc>summary{display:none}
@media (max-width:900px){
  .lessons-toc>summary{display:flex;align-items:center;justify-content:space-between;cursor:pointer;font:600 14px var(--f-body);color:var(--act);padding:8px 0;list-style:none}
  .lessons-toc>summary::-webkit-details-marker{display:none}
  .lessons-toc>summary::after{content:"▾";font-size:12px} .lessons-toc[open]>summary::after{content:"▴"}
  .player{gap:12px}
}
@media (max-width:600px){
  .filters{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .filters .field{min-width:0} .filters input[type=search]{min-width:0}
  .filters .field:first-child{grid-column:1/-1}
  .filters .btn{align-self:end;justify-self:start}
  .hide-sm{display:none}
  .player article h1{font-size:24px}
  .pb-chartfig{padding:12px 10px 8px} .pb-chart-svg text{font-size:15px} .pb-chart-svg .val{font-size:14px}
  .fb-ask{gap:6px}
  .lessonnav{position:sticky;bottom:0;background:var(--page);padding:10px 0;margin-top:8px;border-top:1px solid var(--line);z-index:3}
  .wizard-steps li{font-size:12px;padding:6px 10px}
  .rte-toolbar{top:56px}
}

/* ---- Fireside transcripts ---------------------------------------------------------------------------------- */
.transcript p.ts-who{margin:22px 0 4px;font-size:14px} .transcript p.ts-who:first-child{margin-top:0}
.transcript p.ts-who b{font:700 15px var(--f-display);color:var(--act)} .transcript p.ts-who span{color:var(--muted);margin-left:6px}
.ts-card>summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center}
.ts-card>summary::-webkit-details-marker{display:none} .ts-card[open]>summary .small{display:none}
textarea.tall{min-height:320px}