/* ==========================================================================
   RGM Training Platform — v6 "All-Mono Blueprint"
   Matched to index-allmono.html: light drafting-paper ground (#F4F4F1),
   near-black ink, architectural blue, blueprint line, EVERYTHING in
   JetBrains Mono, faint dark-on-paper 80px blueprint grid, tight mono
   headlines, engineering title blocks. Per-page digital-architecture
   faded background (.bp-bg). Class names preserved.
   ========================================================================== */

:root{
--ac-blue:#1F4E8C;--ac-green:#2E7D32;--ac-amber:#9a6314;--ac-violet:#6D4AA8;--ac-teal:#0E7C86;--ac-red:#B5483C;

  --ink:#0A0B0D;            /* deep black text */
  --paper:#F4F4F1;          /* warm drafting paper */
  --paper-pure:#FFFFFF;
  --panel:#FFFFFF;
  --panel-2:#EEEEE8;        /* nested paper */
  --ink-soft:rgba(10,11,13,0.74);
  --mute:rgba(10,11,13,0.55);
  --ink-mute:rgba(10,11,13,0.55);
  --ink-faint:rgba(10,11,13,0.35);

  --blue:#1F4E8C;           /* architectural blue */
  --blue-line:#2E6BB8;      /* blueprint line */
  --cyan:#2E6BB8;           /* legacy alias -> blueprint line */
  --accent:#1F4E8C;
  --accent-soft:rgba(31,78,140,0.08);
  --amber:#B5791F;
  --gold:#B5791F;
  --green:#1F8C5A;
  --red:#B4313F;

  --rule:rgba(10,11,13,0.14);
  --rule-soft:rgba(10,11,13,0.06);
  --rule-strong:rgba(10,11,13,0.26);
  --line:rgba(10,11,13,0.14);
  --line-strong:rgba(10,11,13,0.26);
  --green-soft:rgba(31,140,90,0.10);
  --red-soft:rgba(180,49,63,0.07);
  --amber-soft:rgba(181,121,31,0.10);

  --grid:rgba(10,11,13,0.06);
  --shadow:0 18px 44px -28px rgba(10,11,13,0.30);

  /* all-mono */
  --display:'JetBrains Mono',ui-monospace,'SFMono-Regular',monospace;
  --serif:'JetBrains Mono',ui-monospace,monospace;
  --sans:'JetBrains Mono',ui-monospace,monospace;
  --mono:'JetBrains Mono',ui-monospace,'SFMono-Regular',monospace;

  --maxw:1180px;
  --read:760px;
  --radius:3px;
  --gutter:clamp(18px,4vw,52px);
}

/* Inverted dark blueprint (secondary toggle) */
[data-theme="dark"]{
--ac-blue:#7FB2F0;--ac-green:#5FD08A;--ac-amber:#E3B25C;--ac-violet:#B79BE0;--ac-teal:#4FD1E0;--ac-red:#F4708A;

  --ink:#FFFFFF;
  --paper:#0E2A4E;
  --paper-pure:#143A63;
  --panel:#143A63;
  --panel-2:#16406E;
  --ink-soft:rgba(231,240,255,0.82);
  --mute:rgba(231,240,255,0.62);
  --ink-mute:rgba(231,240,255,0.62);
  --ink-faint:rgba(231,240,255,0.40);
  --blue:#7FB2F0;--blue-line:#4FD1E0;--cyan:#4FD1E0;--accent:#4FD1E0;
  --accent-soft:rgba(79,209,224,0.12);
  --amber:#F4B740;--gold:#F4B740;--green:#2FA84F;--red:#F4708A;
  --rule:rgba(123,176,255,0.22);--rule-soft:rgba(123,176,255,0.10);--rule-strong:rgba(123,176,255,0.38);
  --line:rgba(123,176,255,0.22);--line-strong:rgba(123,176,255,0.38);
  --green-soft:rgba(47,168,79,0.14);--red-soft:rgba(244,112,138,0.12);--amber-soft:rgba(244,183,64,0.10);
  --grid:rgba(255,255,255,0.05);
}

/* ----- Base + blueprint grid (dark-on-paper, like homepage body) --------- */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--mono);
  color:var(--ink);
  background:var(--paper);
  background-image:
    linear-gradient(to right, var(--grid) 1px, transparent 1px),
    linear-gradient(to bottom, var(--grid) 1px, transparent 1px);
  background-size:80px 80px;
  background-attachment:fixed;
  line-height:1.6;
  font-size:15px;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%}
::selection{background:rgba(31,78,140,0.14)}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter)}
.read{max-width:var(--read);margin:0 auto}

/* ----- Per-page digital-architecture background -------------------------- */
.bp-bg{position:fixed;inset:0;z-index:-1;pointer-events:none;color:var(--blue-line);opacity:.20;overflow:hidden}
.bp-bg svg{position:absolute;top:50%;right:-6%;transform:translateY(-50%);height:128%;width:auto;min-width:62%;max-width:none}
[data-theme="dark"] .bp-bg{opacity:.16}
@media(max-width:760px){.bp-bg{opacity:.12}.bp-bg svg{right:-30%}}

/* ----- Engineering title block ------------------------------------------- */
.bp-titleblock{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;border:1px solid var(--rule);margin:0 0 26px;background:var(--paper-pure)}
.bp-titleblock span{font-family:var(--mono);font-size:10px;letter-spacing:0.16em;text-transform:uppercase;color:var(--mute);padding:11px 14px;border-right:1px solid var(--rule)}
.bp-titleblock span:last-child{border-right:0}
.bp-titleblock span b{color:var(--blue);font-weight:700}
@media(max-width:680px){.bp-titleblock{grid-template-columns:1fr 1fr}}

/* ----- Top nav ------------------------------------------------------------ */
.tnav{position:sticky;top:0;z-index:60;background:color-mix(in srgb,var(--paper) 88%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--rule)}
.tnav-row{max-width:var(--maxw);margin:0 auto;padding:13px var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:18px}
.tmark{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-weight:700;font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--ink)}
.tmark b{color:var(--blue);font-weight:700}
.tnav-links{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.tnav-links a{font-family:var(--mono);color:var(--mute);font-size:11px;letter-spacing:0.12em;text-transform:uppercase}
.tnav-links a:hover{color:var(--ink);text-decoration:none}
.theme-toggle{border:1px solid var(--rule);background:transparent;color:var(--mute);width:36px;height:32px;border-radius:3px;cursor:pointer;font-size:14px;line-height:1;display:inline-flex;align-items:center;justify-content:center;transition:.18s}
.theme-toggle:hover{color:var(--blue);border-color:var(--blue)}

/* ----- Reading progress bar ---------------------------------------------- */
.readbar{position:fixed;top:0;left:0;height:2px;width:0;z-index:70;background:var(--blue);transition:width .1s linear}

/* ----- Hero --------------------------------------------------------------- */
.hero{position:relative;padding:clamp(40px,7vw,84px) 0 clamp(28px,5vw,50px)}
.crumb{font-family:var(--mono);font-size:11px;letter-spacing:0.10em;text-transform:uppercase;color:var(--mute);margin-bottom:18px}
.crumb a{color:var(--mute)}
.crumb a:hover{color:var(--blue);text-decoration:none}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--blue);margin-bottom:16px}
.hero h1{font-family:var(--display);font-weight:800;font-size:clamp(32px,5.6vw,72px);line-height:0.98;letter-spacing:-0.03em;margin:0 0 20px;text-transform:none}
.lede{font-size:clamp(15px,1.7vw,18px);color:var(--ink-soft);max-width:66ch;margin:0 0 26px;line-height:1.55}

/* ----- Stat strip --------------------------------------------------------- */
.stats{display:flex;flex-wrap:wrap;gap:0;margin-top:10px;border:1px solid var(--rule);background:var(--paper-pure)}
.stat{padding:16px 22px;border-right:1px solid var(--rule);min-width:120px;flex:1 0 auto}
.stat:last-child{border-right:0}
.stat-num{font-family:var(--display);font-weight:800;font-size:24px;color:var(--ink);line-height:1;letter-spacing:-0.02em}
.stat-lab{font-family:var(--mono);font-size:10px;letter-spacing:0.12em;text-transform:uppercase;color:var(--mute);margin-top:8px}

/* ----- Buttons ------------------------------------------------------------ */
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-weight:700;font-size:12px;letter-spacing:0.10em;text-transform:uppercase;padding:13px 22px;border-radius:3px;cursor:pointer;border:1px solid transparent;transition:.16s;text-decoration:none;line-height:1}
.btn:hover{text-decoration:none}
.btn-primary{background:var(--blue);color:#fff;border-color:var(--blue)}
.btn-primary:hover{background:#1a4377}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--rule-strong)}
.btn-ghost:hover{border-color:var(--blue);color:var(--blue)}
.btn-gold{background:var(--amber);color:#fff;border-color:var(--amber)}
.btn-gold:hover{background:#9c6917}
.btn-row{display:flex;flex-wrap:wrap;gap:12px;margin:8px 0 4px}
.btn[disabled]{opacity:.5;pointer-events:none}

/* ----- Section headings --------------------------------------------------- */
.sec{position:relative;padding:clamp(32px,5vw,58px) 0}
.sec-label{font-family:var(--mono);font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--mute);margin-bottom:12px}
.sec h2{font-family:var(--display);font-weight:800;font-size:clamp(24px,3.4vw,40px);margin:0 0 10px;line-height:1.0;letter-spacing:-0.02em}
.sec p.sub{color:var(--ink-soft);max-width:66ch;margin:0 0 24px}

/* ----- Module cards (hub) ------------------------------------------------- */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:0;border:1px solid var(--rule);background:var(--paper-pure)}
.mcard{position:relative;display:block;background:var(--paper-pure);border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:22px;transition:.16s;overflow:hidden}
.mcard:hover{background:var(--panel-2)}
.mcard:hover h3{color:var(--blue)}
.mcard-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;gap:10px}
.mcard-no{font-family:var(--mono);font-size:10px;letter-spacing:0.12em;text-transform:uppercase;color:var(--mute)}
.mcard h3{font-family:var(--display);font-weight:700;font-size:18px;line-height:1.12;margin:0 0 10px;color:var(--ink);letter-spacing:-0.01em;transition:.16s}
.mcard p{font-size:13.5px;color:var(--ink-soft);margin:0 0 16px;line-height:1.5}
.mcard-meta{display:flex;gap:14px;font-family:var(--mono);font-size:10px;letter-spacing:0.06em;text-transform:uppercase;color:var(--mute);flex-wrap:wrap}
.mcard-status{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10px;letter-spacing:0.08em;text-transform:uppercase;color:var(--mute)}
.mcard.done{background:var(--green-soft)}
.mcard.done .mcard-status{color:var(--green)}
.mcard.done:before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--green)}
.dot{width:6px;height:6px;border-radius:99px;background:currentColor;display:inline-block}

/* ----- Module reading layout --------------------------------------------- */
.mlayout{display:grid;grid-template-columns:248px minmax(0,1fr);gap:clamp(24px,4vw,56px);max-width:var(--maxw);margin:0 auto;padding:34px var(--gutter) 80px}
.mside{position:sticky;top:84px;align-self:start;max-height:calc(100vh - 100px);overflow:auto}
.mside h4{font-family:var(--mono);font-size:10px;letter-spacing:0.16em;text-transform:uppercase;color:var(--mute);margin:0 0 12px}
.mside ol{list-style:none;margin:0;padding:0}
.mside li{margin:0 0 2px}
.mside a{display:flex;gap:10px;align-items:baseline;padding:8px 10px;border-radius:3px;font-family:var(--mono);font-size:11.5px;letter-spacing:0.04em;color:var(--mute);line-height:1.4;border:1px solid transparent}
.mside a:hover{background:var(--panel-2);color:var(--ink);text-decoration:none}
.mside a.cur{background:var(--accent-soft);color:var(--ink);border-color:var(--rule)}
.mside a .mi{font-family:var(--mono);font-size:10px;color:var(--mute);min-width:16px}
.mside a.ok .mi{color:var(--green)}
.mside-jump{margin-top:14px;padding-top:14px;border-top:1px solid var(--rule)}

.mbody{min-width:0}
.mbody .eyebrow{margin-bottom:12px}
.mbody h1{font-family:var(--display);font-weight:800;font-size:clamp(28px,4.6vw,52px);line-height:1.0;letter-spacing:-0.03em;margin:0 0 16px}
.mbody h2{font-family:var(--display);font-weight:700;font-size:clamp(21px,2.8vw,30px);line-height:1.05;letter-spacing:-0.015em;margin:48px 0 16px;padding-bottom:10px;border-bottom:1px solid var(--rule)}
.mbody h3{font-family:var(--mono);font-size:16px;font-weight:700;color:var(--blue);margin:30px 0 8px}
.mbody h4{font-family:var(--mono);font-size:14px;font-weight:700;margin:20px 0 6px}
.mbody p{margin:0 0 16px;color:var(--ink-soft)}
.mbody .lede{color:var(--ink-soft)}
.mbody ul,.mbody ol{margin:0 0 18px;padding-left:22px;color:var(--ink-soft)}
.mbody li{margin-bottom:8px}
.mbody strong{color:var(--ink);font-weight:700}
.mbody em{color:var(--ink)}
.mbody table{width:100%;border-collapse:collapse;margin:18px 0;font-size:13.5px}
.mbody th,.mbody td{padding:10px 13px;border:1px solid var(--rule);text-align:left;color:var(--ink-soft)}
.mbody th{background:var(--panel-2);color:var(--ink);font-weight:700}
.mbody a{color:var(--blue)}

.box,.toc,.tip,.anti,.formula,.note{background:var(--paper-pure);border:1px solid var(--rule);border-radius:3px;padding:18px 20px;margin:20px 0}
.toc h3{margin-top:0;font-family:var(--display);font-weight:700;color:var(--ink)}
.tip{border-left:2px solid var(--blue)}
.anti{border-left:2px solid var(--red);background:var(--red-soft)}
.formula{font-family:var(--mono);font-size:13px;border-left:2px solid var(--amber)}
.kbd{font-family:var(--mono);font-size:12px;background:var(--panel-2);border:1px solid var(--rule);padding:1px 6px;border-radius:3px}
.sources{font-size:13px;color:var(--mute);border-top:1px solid var(--rule);padding-top:18px;margin-top:46px}
.sources a{color:var(--blue)}
.mbody .breadcrumb{font-family:var(--mono);font-size:11px;letter-spacing:0.08em;text-transform:uppercase;color:var(--mute);margin-bottom:16px}
.mbody .breadcrumb a{color:var(--mute)}
.mbody .breadcrumb a:hover{color:var(--blue);text-decoration:none}
.mbody .toc ol{margin:0;padding-left:20px}
.mbody .toc h3{font-size:14px}

.panel{background:var(--paper-pure);border:1px solid var(--rule);border-radius:3px;padding:clamp(20px,3vw,32px)}

/* ----- CASE test / quiz --------------------------------------------------- */
.case-badge{display:inline-flex;font-family:var(--mono);font-size:10px;letter-spacing:0.14em;text-transform:uppercase;border:1px solid var(--rule);border-radius:3px;overflow:hidden;margin-bottom:10px;background:var(--paper-pure)}
.case-badge span{padding:6px 12px;border-right:1px solid var(--rule);color:var(--mute)}
.case-badge span:last-child{border-right:0}
.case-badge b{color:var(--blue);font-weight:700}

.quiz{margin:30px 0}
.q{background:var(--paper-pure);border:1px solid var(--rule);border-radius:3px;padding:22px 22px 18px;margin:0 0 14px}
.q-tag{font-family:var(--mono);font-size:10px;letter-spacing:0.10em;text-transform:uppercase;color:var(--mute);margin-bottom:9px}
.q-tag b{color:var(--blue)}
.q-context{background:var(--panel-2);border-left:2px solid var(--blue);border-radius:3px;padding:12px 15px;margin:0 0 14px;font-size:13.5px;color:var(--ink-soft)}
.q-stem{font-size:15.5px;font-weight:700;color:var(--ink);margin:0 0 14px;line-height:1.45}
.opts{display:grid;gap:8px}
.opt{display:flex;gap:11px;align-items:flex-start;padding:13px 15px;border:1px solid var(--rule);border-radius:3px;cursor:pointer;transition:.14s;font-size:14px;color:var(--ink-soft);background:var(--paper-pure)}
.opt:hover{border-color:var(--rule-strong);background:var(--panel-2)}
.opt input{margin-top:3px;accent-color:var(--blue)}
.opt.sel{border-color:var(--blue);background:var(--accent-soft);color:var(--ink)}
.opt.correct{border-color:var(--green);background:var(--green-soft);color:var(--ink)}
.opt.wrong{border-color:var(--red);background:var(--red-soft);color:var(--ink)}
.opt-key{font-family:var(--mono);font-size:12px;color:var(--mute);min-width:16px;font-weight:700}
.q-explain{margin-top:13px;padding:12px 15px;border-radius:3px;background:var(--panel-2);font-size:13px;color:var(--ink-soft);display:none;border-left:2px solid var(--mute)}
.q-explain.show{display:block}
.q-explain.ok{border-color:var(--green)}
.q-explain.no{border-color:var(--red)}

.quiz-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:8px}
.quiz-result{margin-top:22px;padding:24px;border-radius:3px;border:1px solid var(--rule);background:var(--paper-pure);display:none}
.quiz-result.show{display:block}
.quiz-result h3{font-family:var(--display);font-weight:800;font-size:26px;margin:0 0 6px}
.score-ring{font-family:var(--display);font-weight:800;font-size:44px}
.score-ring.pass{color:var(--green)}
.score-ring.fail{color:var(--red)}

.passcode{margin-top:18px;padding:20px;border:1px dashed var(--amber);border-radius:3px;background:var(--amber-soft)}
.passcode-label{font-family:var(--mono);font-size:10px;letter-spacing:0.14em;text-transform:uppercase;color:var(--mute)}
.passcode-code{font-family:var(--mono);font-size:30px;font-weight:700;letter-spacing:0.18em;color:var(--amber);margin:8px 0 6px}
.passcode small{color:var(--mute)}

.pc-entry{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:6px}
.pc-entry input{font-family:var(--mono);font-size:14px;letter-spacing:0.12em;text-transform:uppercase;padding:12px 14px;border-radius:3px;border:1px solid var(--rule-strong);background:var(--paper-pure);color:var(--ink);min-width:210px}
.pc-entry input:focus{outline:none;border-color:var(--blue)}
.pc-msg{font-size:12px;font-family:var(--mono);letter-spacing:0.04em}
.pc-msg.ok{color:var(--green)}
.pc-msg.no{color:var(--red)}

/* ----- Decision tree / growth story -------------------------------------- */
.gs-stage{background:var(--paper-pure);border:1px solid var(--rule);border-radius:3px;padding:clamp(22px,3vw,34px)}
.gs-meter{height:8px;border-radius:0;background:var(--panel-2);overflow:hidden;margin:0 0 6px;border:1px solid var(--rule-soft)}
.gs-meter > i{display:block;height:100%;width:0;transition:width .5s ease}
.gs-meter.short > i{background:var(--amber)}
.gs-meter.long > i{background:var(--green)}
.gs-meterlab{display:flex;justify-content:space-between;font-family:var(--mono);font-size:10px;letter-spacing:0.06em;text-transform:uppercase;color:var(--mute);margin-bottom:14px}
.gs-step{font-family:var(--mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--mute);margin-bottom:12px}
.gs-q{font-family:var(--display);font-weight:800;font-size:clamp(21px,2.8vw,30px);line-height:1.08;letter-spacing:-0.02em;margin:6px 0 6px}
.gs-ctx{color:var(--ink-soft);margin:0 0 20px;font-size:14.5px}
.gs-choices{display:grid;gap:10px}
.gs-choice{text-align:left;background:var(--paper-pure);border:1px solid var(--rule);border-radius:3px;padding:16px 18px;cursor:pointer;transition:.15s;color:var(--ink-soft);font-size:14.5px;line-height:1.45}
.gs-choice:hover{border-color:var(--blue);background:var(--panel-2);color:var(--ink)}
.gs-choice b{display:block;color:var(--ink);font-family:var(--mono);font-weight:700;font-size:15px;margin-bottom:3px}

/* immediate per-decision feedback */
.gs-feedback{border:1px solid var(--rule);border-radius:3px;padding:16px 18px;margin-top:14px}
.gs-feedback.strong{border-left:3px solid var(--green);background:var(--green-soft)}
.gs-feedback.mixed{border-left:3px solid var(--amber);background:var(--amber-soft)}
.gs-feedback.weak{border-left:3px solid var(--red);background:var(--red-soft)}
.gs-feedback .fv{font-family:var(--mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;font-weight:700;margin-bottom:6px;display:flex;align-items:center;gap:8px}
.gs-feedback.strong .fv{color:var(--green)}
.gs-feedback.mixed .fv{color:var(--amber)}
.gs-feedback.weak .fv{color:var(--red)}
.gs-feedback p{margin:0 0 6px;font-size:13.5px;color:var(--ink-soft)}
.gs-feedback .better{font-size:13px;color:var(--ink);margin-top:6px}
.gs-feedback .better b{color:var(--blue)}
.gs-next{margin-top:14px}

.gs-outcome{text-align:left}
.gs-verdict{font-family:var(--display);font-weight:800;font-size:clamp(28px,5vw,52px);line-height:0.98;letter-spacing:-0.03em;margin:6px 0 8px}
.gs-verdict.best{color:var(--green)}
.gs-verdict.contender{color:var(--blue)}
.gs-verdict.middling{color:var(--amber)}
.gs-verdict.below{color:var(--ac-red)}
.gs-verdict.tank{color:var(--red)}
.gs-curve{margin:20px 0;max-width:560px}
.gs-legend{display:flex;gap:18px;font-family:var(--mono);font-size:11px;color:var(--mute);margin:6px 0 0}
.gs-legend i{display:inline-block;width:18px;height:0;border-top:2px solid currentColor;vertical-align:middle;margin-right:6px}
.gs-scorecards{display:grid;grid-template-columns:1fr 1fr;gap:0;margin:24px 0;border:1px solid var(--rule);background:var(--paper-pure)}
.gs-scorecard{padding:18px;border-right:1px solid var(--rule)}
.gs-scorecard:last-child{border-right:0}
.gs-scorecard .n{font-family:var(--display);font-weight:800;font-size:34px}
.gs-scorecard .l{font-family:var(--mono);font-size:10px;color:var(--mute);text-transform:uppercase;letter-spacing:0.10em;margin-top:4px}
.gs-scorecard .d{font-size:12.5px;color:var(--ink-soft);margin-top:8px;line-height:1.4}
.gs-analysis{margin-top:10px}
.gs-analysis .ai{border:1px solid var(--rule);border-radius:3px;padding:14px 16px;margin:0 0 10px;background:var(--paper-pure)}
.gs-analysis .ai .row{display:flex;align-items:center;gap:10px;margin-bottom:6px;flex-wrap:wrap}
.gs-analysis .ai .rtag{font-family:var(--mono);font-size:10px;letter-spacing:0.10em;text-transform:uppercase;font-weight:700;padding:3px 8px;border-radius:3px}
.gs-analysis .ai.good{border-left:3px solid var(--green)}
.gs-analysis .ai.good .rtag{background:var(--green-soft);color:var(--green)}
.gs-analysis .ai.bad{border-left:3px solid var(--red)}
.gs-analysis .ai.bad .rtag{background:var(--red-soft);color:var(--red)}
.gs-analysis .ai.mid{border-left:3px solid var(--amber)}
.gs-analysis .ai.mid .rtag{background:var(--amber-soft);color:var(--amber)}
.gs-analysis .ai h5{margin:0;font-size:13.5px;color:var(--ink);font-family:var(--mono);font-weight:700}
.gs-analysis .ai .pick{font-size:13px;color:var(--ink-soft);margin:2px 0 0}
.gs-analysis .ai .pick b{color:var(--ink)}
.gs-analysis .ai p{margin:6px 0 0;font-size:13px;color:var(--ink-soft)}
.gs-analysis .ai .better{font-size:13px;color:var(--ink);margin-top:6px}
.gs-analysis .ai .better b{color:var(--blue)}
.gs-analysis .ai a{font-size:12.5px;color:var(--blue)}

/* ----- Footer ------------------------------------------------------------- */
.tfoot{border-top:1px solid var(--rule);padding:34px var(--gutter);background:var(--paper-pure)}
.tfoot-row{max-width:var(--maxw);margin:0 auto;display:flex;flex-wrap:wrap;gap:18px;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:11px;letter-spacing:0.06em;color:var(--mute)}
.tfoot-links{display:flex;gap:18px;flex-wrap:wrap}
.tfoot-links a{color:var(--mute);text-transform:uppercase;letter-spacing:0.10em}
.tfoot-links a:hover{color:var(--blue);text-decoration:none}

/* ----- Toast ------------------------------------------------------------- */
.toast{position:fixed;right:22px;bottom:22px;z-index:90;background:var(--paper-pure);border:1px solid var(--rule-strong);border-left:2px solid var(--green);border-radius:3px;padding:14px 18px;box-shadow:var(--shadow);max-width:320px;transform:translateY(20px);opacity:0;transition:.3s}
.toast.show{transform:translateY(0);opacity:1}
.toast b{display:block;font-size:13px;color:var(--ink);font-family:var(--mono);font-weight:700}
.toast span{font-size:12.5px;color:var(--ink-soft)}

/* ----- Responsive --------------------------------------------------------- */
@media(max-width:880px){
  .mlayout{grid-template-columns:1fr}
  .mside{position:static;max-height:none;border-bottom:1px solid var(--rule);padding-bottom:14px;margin-bottom:8px}
  .gs-scorecards{grid-template-columns:1fr}
  .tnav-links a:not(.theme-toggle){display:none}
}
@media(max-width:520px){.stat{flex:1 1 40%}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* ----- Growth-story: centered hero + stage (page-scoped) ----- */
.hero.center{text-align:center}
.hero.center .wrap{max-width:780px}
.hero.center .crumb,.hero.center .eyebrow{text-align:center}
.hero.center h1{font-size:clamp(28px,3.6vw,44px);margin-left:auto;margin-right:auto}
.hero.center .lede{margin-left:auto;margin-right:auto;max-width:58ch}
.hero.center .lede + .lede{margin-top:14px}
.gs-centered .gs-step,.gs-centered .gs-q,.gs-centered .gs-ctx{text-align:center}
.gs-centered .gs-ctx{margin-left:auto;margin-right:auto;max-width:58ch}

/* ===================================================================
   v6.1 — colour accents, texture & readability layer (additive)
   CASE phase colour system + richer treatments over the mono blueprint.
   =================================================================== */
:root{
  --c-context:#1F4E8C;   /* blue  */
  --c-analysis:#0E7C86;  /* teal  */
  --c-strategy:#B5791F;  /* ochre */
  --c-execution:#1F8C5A; /* green */
  --violet:#5A3FA0;
  --ink-soft:rgba(10,11,13,0.82);
  --c-context-soft:rgba(31,78,140,0.10);
  --c-analysis-soft:rgba(14,124,134,0.12);
  --c-strategy-soft:rgba(181,121,31,0.13);
  --c-execution-soft:rgba(31,140,90,0.12);
  --violet-soft:rgba(90,63,160,0.10);
}
[data-theme="dark"]{
  --c-context:#7FB2F0;--c-analysis:#54D1D8;--c-strategy:#F4B740;--c-execution:#54C98A;--violet:#B79CF0;
  --ink-soft:rgba(231,240,255,0.86);
  --c-context-soft:rgba(127,178,240,0.14);--c-analysis-soft:rgba(84,209,216,0.14);
  --c-strategy-soft:rgba(244,183,64,0.14);--c-execution-soft:rgba(84,201,138,0.14);--violet-soft:rgba(183,156,240,0.14);
}

/* readability: a touch larger + warmer contrast */
body{font-size:15.5px;line-height:1.62}
.mbody p,.mbody li{font-size:15.5px;line-height:1.72;color:var(--ink-soft)}
.lede,.sec p.sub,.gs-ctx{color:var(--ink-soft)}

/* hero: tinted wash + accent ticks on the eyebrow */
.hero:before{content:"";position:absolute;inset:0 0 auto 0;height:280px;z-index:-1;pointer-events:none;
  background:radial-gradient(680px 240px at 18% 0,var(--c-context-soft),transparent 70%)}
.hero.center:before{background:radial-gradient(680px 240px at 50% 0,var(--c-context-soft),transparent 70%)}
.eyebrow{display:inline-flex;align-items:center;gap:9px}
.eyebrow:before{content:"";width:24px;height:2px;background:var(--blue);flex:none}
.bp-titleblock{box-shadow:inset 4px 0 0 var(--blue)}

/* section labels get a colour tick */
.sec-label{display:inline-flex;align-items:center;gap:9px}
.sec-label:before{content:"";width:16px;height:2px;background:var(--c-strategy)}

/* stat strip: colour the figures + heavier divider */
.stats{box-shadow:inset 0 3px 0 var(--blue)}
.stats .stat:nth-child(1) .stat-num{color:var(--c-context)}
.stats .stat:nth-child(2) .stat-num{color:var(--c-analysis)}
.stats .stat:nth-child(3) .stat-num{color:var(--c-strategy)}
.stats .stat:nth-child(4) .stat-num{color:var(--c-execution)}

/* module cards: rotating top accent, big faded index numeral, lively hover */
.mcard{box-shadow:inset 0 3px 0 var(--c-context)}
.cards .mcard:nth-child(5n+2){box-shadow:inset 0 3px 0 var(--c-analysis)}
.cards .mcard:nth-child(5n+3){box-shadow:inset 0 3px 0 var(--c-strategy)}
.cards .mcard:nth-child(5n+4){box-shadow:inset 0 3px 0 var(--c-execution)}
.cards .mcard:nth-child(5n+5){box-shadow:inset 0 3px 0 var(--violet)}
.mcard[data-module-card]:after{content:attr(data-module-card);position:absolute;right:14px;bottom:2px;
  font-family:var(--display);font-weight:800;font-size:74px;line-height:1;color:var(--ink);opacity:.05;pointer-events:none}
.mcard:hover{transform:translateY(-2px);box-shadow:inset 0 3px 0 var(--blue),var(--shadow)}
.mcard.done{box-shadow:inset 0 3px 0 var(--green)}

/* CASE phase colour-coding on quiz questions */
.q{border-left:3px solid var(--rule-strong)}
.q.ph-context{border-left-color:var(--c-context)}
.q.ph-analysis{border-left-color:var(--c-analysis)}
.q.ph-strategy{border-left-color:var(--c-strategy)}
.q.ph-execution{border-left-color:var(--c-execution)}
.q-tag{display:inline-flex;align-items:center;gap:7px;padding:4px 10px;border-radius:99px;background:var(--panel-2);border:1px solid var(--rule)}
.q.ph-context .q-tag{background:var(--c-context-soft)}.q.ph-context .q-tag b{color:var(--c-context)}
.q.ph-analysis .q-tag{background:var(--c-analysis-soft)}.q.ph-analysis .q-tag b{color:var(--c-analysis)}
.q.ph-strategy .q-tag{background:var(--c-strategy-soft)}.q.ph-strategy .q-tag b{color:var(--c-strategy)}
.q.ph-execution .q-tag{background:var(--c-execution-soft)}.q.ph-execution .q-tag b{color:var(--c-execution)}
.q-context{background:var(--c-context-soft);border-left-color:var(--c-context)}

/* CASE badge in colour */
.case-badge span:nth-child(1) b{color:var(--c-context)}
.case-badge span:nth-child(2) b{color:var(--c-analysis)}
.case-badge span:nth-child(3) b{color:var(--c-strategy)}
.case-badge span:nth-child(4) b{color:var(--c-execution)}

/* option letters as chips + livelier states */
.opt{font-size:14.5px}
.opt-key{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:4px;
  background:var(--panel-2);border:1px solid var(--rule);color:var(--mute);font-size:11px}
.opt.sel{box-shadow:inset 3px 0 0 var(--blue)}
.opt.sel .opt-key{background:var(--blue);color:#fff;border-color:var(--blue)}
.opt.correct .opt-key{background:var(--green);color:#fff;border-color:var(--green)}
.opt.wrong .opt-key{background:var(--red);color:#fff;border-color:var(--red)}

/* blueprint registration ticks (texture) on big surfaces */
.gs-stage,.panel,.quiz-result,.passcode{position:relative}
.gs-stage:before,.panel:before,.quiz-result:before{content:"";position:absolute;top:9px;left:9px;width:11px;height:11px;
  border-left:1px solid var(--rule-strong);border-top:1px solid var(--rule-strong);pointer-events:none}
.gs-stage:after,.panel:after,.quiz-result:after{content:"";position:absolute;bottom:9px;right:9px;width:11px;height:11px;
  border-right:1px solid var(--rule-strong);border-bottom:1px solid var(--rule-strong);pointer-events:none}

/* growth-story: step as a chip, decision question gets a colour accent */
.gs-step{display:inline-block;padding:5px 12px;border-radius:99px;background:var(--c-context-soft);color:var(--c-context);border:1px solid var(--rule)}
.gs-centered .gs-step{margin-left:auto;margin-right:auto}
.gs-meter{height:9px}
.gs-meter.short > i{background:linear-gradient(90deg,var(--c-strategy),#d49a3a)}
.gs-meter.long > i{background:linear-gradient(90deg,var(--c-execution),#36b277)}
.gs-choice{transition:.15s}
.gs-choice:hover{box-shadow:inset 4px 0 0 var(--blue)}
.gs-choice b{color:var(--blue)}

/* buttons: subtle depth */
.btn-primary{box-shadow:0 1px 0 rgba(10,11,13,.18)}
.btn-primary:hover{transform:translateY(-1px)}
.btn-gold:hover{transform:translateY(-1px)}

/* passcode pops a little more */
.passcode{background:linear-gradient(180deg,var(--c-strategy-soft),transparent)}
.score-ring.pass{text-shadow:0 1px 0 var(--c-execution-soft)}

/* ===================================================================
   v6.2 — homepage GREEN accent, inline imagery/infographics,
   and a faded/masked background so it never fights the text.
   =================================================================== */
:root{
  --green:#1F8C5A;            /* homepage green (light) */
  --green-bright:#2FA84F;     /* homepage vivid green */
  --green-soft:rgba(47,168,79,0.12);
}
[data-theme="dark"]{
  --green:#2FA84F;--green-bright:#54C98A;--green-soft:rgba(47,168,79,0.16);
}

/* background: fainter + masked to the right edge so text reads clean */
.bp-bg{opacity:.12;
  -webkit-mask-image:linear-gradient(to left,#000 0,#000 26%,transparent 62%);
          mask-image:linear-gradient(to left,#000 0,#000 26%,transparent 62%)}
[data-theme="dark"] .bp-bg{opacity:.13}
@media(max-width:760px){.bp-bg{opacity:.07}}

/* progress + key actions go GREEN (go / grow) */
.readbar{background:linear-gradient(90deg,var(--green),var(--green-bright))}
.btn-primary{background:var(--green);border-color:var(--green);color:#fff}
.btn-primary:hover{background:var(--green-bright);border-color:var(--green-bright)}
.btn-primary .opt-key{color:#fff}
.pc-entry input:focus{border-color:var(--green)}

/* hero: a blue→green keyline + a soft dual wash */
.hero:before{background:
  radial-gradient(620px 220px at 16% 0,var(--c-context-soft),transparent 70%),
  radial-gradient(560px 220px at 88% 8%,var(--green-soft),transparent 72%)}
.hero.center:before{background:
  radial-gradient(640px 240px at 50% 0,var(--green-soft),transparent 70%)}
.hero h1{position:relative}
.hero .lede:first-of-type{position:relative}
.hero .btn-row{position:relative}
.hero:after{content:"";display:block;width:64px;height:4px;margin:22px 0 0;
  background:linear-gradient(90deg,var(--blue),var(--green-bright));border-radius:2px}
.hero.center:after{margin-left:auto;margin-right:auto}

/* section ticks alternate blue / green for rhythm */
.sec:nth-of-type(even) .sec-label:before{background:var(--green)}

/* ---- module card thumbnail (its own blueprint diagram, tinted) ---- */
.mcard-thumb{position:relative;height:108px;margin:-22px -22px 16px;overflow:hidden;
  border-bottom:1px solid var(--rule);background:
  linear-gradient(135deg,var(--panel-2),var(--paper-pure));color:var(--blue)}
.mcard-thumb svg{position:absolute;top:50%;left:50%;transform:translate(-34%,-46%);height:215%;width:auto;opacity:.55}
.mcard-thumb:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,var(--paper-pure))}
.cards .mcard:nth-child(5n+1) .mcard-thumb{color:var(--c-context)}
.cards .mcard:nth-child(5n+2) .mcard-thumb{color:var(--c-analysis)}
.cards .mcard:nth-child(5n+3) .mcard-thumb{color:var(--c-strategy)}
.cards .mcard:nth-child(5n+4) .mcard-thumb{color:var(--green)}
.cards .mcard:nth-child(5n+5) .mcard-thumb{color:var(--violet)}
.mcard:hover .mcard-thumb svg{opacity:.8;transform:translate(-32%,-46%) scale(1.04);transition:.3s}

/* ---- module hero diagram (inline infographic at top of a lesson) ---- */
.mfig{position:relative;height:210px;margin:6px 0 30px;overflow:hidden;border:1px solid var(--rule);
  border-radius:7px;background:
  radial-gradient(120% 140% at 80% 10%,var(--green-soft),transparent 60%),
  linear-gradient(135deg,var(--panel-2),var(--paper-pure));color:var(--blue);box-shadow:inset 0 3px 0 var(--green)}
.mfig svg{position:absolute;top:50%;left:58%;transform:translate(-50%,-50%);height:170%;width:auto;opacity:.6}
.mfig figcaption{position:absolute;left:14px;bottom:12px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink);background:var(--paper);padding:5px 10px;border:1px solid var(--rule);border-radius:3px}
.mfig figcaption b{color:var(--green)}
.mfig:before{content:"";position:absolute;top:10px;left:10px;width:12px;height:12px;border-left:1px solid var(--rule-strong);border-top:1px solid var(--rule-strong)}
.mfig:after{content:"";position:absolute;top:10px;right:10px;width:12px;height:12px;border-right:1px solid var(--rule-strong);border-top:1px solid var(--rule-strong)}

/* score ring + passcode lean green for the "win" moment */
.score-ring.pass{color:var(--green-bright)}
.quiz-result.show{box-shadow:inset 0 3px 0 var(--green)}
.gs-verdict.best{color:var(--green-bright)}

/* completed module: stronger green identity */
.mcard.done{box-shadow:inset 0 3px 0 var(--green-bright)}
.mcard.done .mcard-thumb{color:var(--green-bright)}

/* readability: a hair more line-height on dense lessons */
.mbody p{line-height:1.74}
.mbody li{line-height:1.66}

/* ===================================================================
   v6.3 — bespoke infographics kit (animated, colourful, scroll-cued)
   Drop <div class="ig" data-ig="NAME"></div> in content; JS fills it.
   =================================================================== */
.ig{margin:34px 0;opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}
.ig.in{opacity:1;transform:none}
.ig-head{display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);margin-bottom:12px}
.ig-head .tag{padding:3px 10px;border-radius:99px;background:var(--green-soft);color:var(--green);border:1px solid var(--rule);font-weight:700}
.ig-head .tag.blue{background:var(--c-context-soft);color:var(--c-context)}
.ig-head .tag.amber{background:var(--amber-soft);color:var(--amber)}
.ig-card{position:relative;background:var(--paper-pure);border:1px solid var(--rule);border-radius:8px;padding:22px;box-shadow:var(--shadow);overflow:hidden}
.ig-card:before{content:"";position:absolute;top:10px;left:10px;width:12px;height:12px;border-left:1px solid var(--rule-strong);border-top:1px solid var(--rule-strong)}
.ig-card:after{content:"";position:absolute;bottom:10px;right:10px;width:12px;height:12px;border-right:1px solid var(--rule-strong);border-bottom:1px solid var(--rule-strong)}
.ig-title{font-family:var(--display);font-weight:800;font-size:19px;letter-spacing:-.01em;margin:0 0 4px}
.ig-sub{font-size:13px;color:var(--ink-soft);margin:0 0 18px;line-height:1.5}

/* -- hierarchy: stacked levels with connectors, stagger-in -- */
.ig-tree{display:flex;flex-direction:column;gap:0}
.ig-lvl{display:grid;grid-template-columns:128px 1fr;gap:16px;align-items:center;padding:4px 0;position:relative;opacity:0;transform:translateX(-10px)}
.ig.in .ig-lvl{animation:igslide .5s ease forwards}
.ig.in .ig-lvl:nth-child(1){animation-delay:.05s}.ig.in .ig-lvl:nth-child(2){animation-delay:.18s}
.ig.in .ig-lvl:nth-child(3){animation-delay:.31s}.ig.in .ig-lvl:nth-child(4){animation-delay:.44s}.ig.in .ig-lvl:nth-child(5){animation-delay:.57s}
@keyframes igslide{to{opacity:1;transform:none}}
.ig-node{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:6px;border:1px solid var(--rule);
  font-weight:700;font-size:13px;color:#fff;position:relative}
.ig-node .ig-ico{width:20px;height:20px;flex:none}
.ig-lvl .ig-meta{font-size:12.5px;color:var(--ink-soft);line-height:1.45}
.ig-lvl .ig-meta b{color:var(--ink)}
.ig-lvl:not(:last-child):after{content:"";position:absolute;left:62px;bottom:-2px;width:2px;height:14px;background:var(--rule-strong)}
.ig-node.l1{background:var(--violet)}.ig-node.l2{background:var(--c-context)}
.ig-node.l3{background:var(--green)}.ig-node.l4{background:var(--c-analysis)}.ig-node.l5{background:var(--amber)}
.ig-pill{display:inline-block;font-size:10px;letter-spacing:.06em;text-transform:uppercase;padding:2px 8px;border-radius:99px;margin-left:6px;background:rgba(255,255,255,.22)}

/* -- comparison: tabs + animated bars -- */
.ig-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.ig-tab{flex:1 1 auto;text-align:center;font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.04em;
  padding:11px 12px;border:1px solid var(--rule);border-radius:6px;cursor:pointer;background:var(--paper);color:var(--ink-soft);transition:.15s;position:relative}
.ig-tab:hover{border-color:var(--rule-strong)}
.ig-tab.on{color:#fff;border-color:transparent}
.ig-tab.on[data-k="skag"]{background:var(--amber)}.ig-tab.on[data-k="stag"]{background:var(--c-analysis)}.ig-tab.on[data-k="haga"]{background:var(--green)}
.ig-tab .rec{position:absolute;top:-9px;right:8px;font-size:8px;background:var(--green);color:#fff;padding:2px 6px;border-radius:99px;letter-spacing:.08em}
.ig-panel{display:none}.ig-panel.on{display:block;animation:igfade .35s ease}
@keyframes igfade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.ig-bars{display:grid;gap:12px;margin:6px 0 14px}
.ig-bar{display:grid;grid-template-columns:140px 1fr 38px;gap:12px;align-items:center;font-size:12px;color:var(--ink-soft)}
.ig-bar .track{height:10px;background:var(--panel-2);border:1px solid var(--rule-soft);border-radius:99px;overflow:hidden}
.ig-bar .fill{height:100%;width:0;border-radius:99px;transition:width .9s cubic-bezier(.2,.8,.2,1)}
.ig-bar .val{font-family:var(--mono);font-weight:700;text-align:right;color:var(--ink)}
.ig-verdict{font-size:13px;color:var(--ink-soft);border-left:3px solid var(--green);background:var(--green-soft);padding:11px 14px;border-radius:4px}
.ig-verdict b{color:var(--green)}

/* -- mistakes grid: severity cards, stagger + hover reveal -- */
.ig-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.ig-mistake{position:relative;border:1px solid var(--rule);border-radius:7px;padding:14px 15px 15px;background:var(--paper);overflow:hidden;
  opacity:0;transform:translateY(10px)}
.ig.in .ig-mistake{animation:igslideup .5s ease forwards}
.ig.in .ig-mistake:nth-child(2){animation-delay:.06s}.ig.in .ig-mistake:nth-child(3){animation-delay:.12s}
.ig.in .ig-mistake:nth-child(4){animation-delay:.18s}.ig.in .ig-mistake:nth-child(5){animation-delay:.24s}
.ig.in .ig-mistake:nth-child(6){animation-delay:.30s}.ig.in .ig-mistake:nth-child(7){animation-delay:.36s}
.ig.in .ig-mistake:nth-child(8){animation-delay:.42s}.ig.in .ig-mistake:nth-child(9){animation-delay:.48s}
@keyframes igslideup{to{opacity:1;transform:none}}
.ig-mistake .num{font-family:var(--display);font-weight:800;font-size:30px;color:var(--ink);opacity:.10;position:absolute;right:10px;top:4px}
.ig-mistake .sev{display:inline-flex;align-items:center;gap:6px;font-size:9px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;margin-bottom:7px}
.ig-mistake .sev:before{content:"";width:8px;height:8px;border-radius:99px}
.ig-mistake.high{box-shadow:inset 3px 0 0 var(--red)}.ig-mistake.high .sev{color:var(--red)}.ig-mistake.high .sev:before{background:var(--red)}
.ig-mistake.med{box-shadow:inset 3px 0 0 var(--amber)}.ig-mistake.med .sev{color:var(--amber)}.ig-mistake.med .sev:before{background:var(--amber)}
.ig-mistake h5{font-size:13px;font-weight:700;margin:0 0 5px;color:var(--ink);line-height:1.3}
.ig-mistake p{font-size:12px;color:var(--ink-soft);margin:0;line-height:1.45}
.ig-mistake .fix{margin-top:8px;font-size:11.5px;color:var(--green);border-top:1px dashed var(--rule);padding-top:7px;opacity:.0;max-height:0;overflow:hidden;transition:.3s}
.ig-mistake:hover .fix{opacity:1;max-height:80px}
.ig-mistake .fix b{color:var(--green)}

/* -- campaign-type menu cards -- */
.ig-types{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.ig-type{border:1px solid var(--rule);border-radius:7px;padding:14px;background:var(--paper);transition:.15s}
.ig-type:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.ig-type .ig-ico{width:30px;height:30px;margin-bottom:8px}
.ig-type h5{font-size:13px;font-weight:700;margin:0 0 4px}
.ig-type p{font-size:11.5px;color:var(--ink-soft);margin:0;line-height:1.4}
.ig-type.b1{box-shadow:inset 0 3px 0 var(--c-context)}.ig-type.b2{box-shadow:inset 0 3px 0 var(--green)}
.ig-type.b3{box-shadow:inset 0 3px 0 var(--c-analysis)}.ig-type.b4{box-shadow:inset 0 3px 0 var(--amber)}.ig-type.b5{box-shadow:inset 0 3px 0 var(--violet)}

/* -- pull-stat band (breaks walls of text) -- */
.ig-statband{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:0;border:1px solid var(--rule);border-radius:8px;overflow:hidden;background:var(--paper-pure)}
.ig-statband .s{padding:18px 20px;border-right:1px solid var(--rule)}
.ig-statband .s:last-child{border-right:0}
.ig-statband .s .n{font-family:var(--display);font-weight:800;font-size:30px;line-height:1}
.ig-statband .s:nth-child(1) .n{color:var(--c-context)}.ig-statband .s:nth-child(2) .n{color:var(--green)}.ig-statband .s:nth-child(3) .n{color:var(--amber)}.ig-statband .s:nth-child(4) .n{color:var(--violet)}
.ig-statband .s .l{font-size:11px;color:var(--ink-soft);margin-top:6px;line-height:1.4}

/* growth-story live trajectory chart */
.gs-chart{margin:4px 0 16px;border:1px solid var(--rule);border-radius:6px;background:var(--paper-pure);padding:10px 12px 4px;position:relative}
.gs-chart .lbl{font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);margin-bottom:2px}
.gs-chart svg{display:block;width:100%;height:120px}
.gs-chart .ln{fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;transition:stroke-dashoffset 1s ease}
.gs-dot{transition:.5s}
@media(max-width:560px){.ig-bar{grid-template-columns:108px 1fr 34px}}

/* ===================================================================
   v6.4 — more interactive infographics: naming builder, migration
   timeline, architecture checklist.
   =================================================================== */
/* naming builder */
.ig-build .controls{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px}
.ig-build .ctl label{display:block;font-family:var(--mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);margin-bottom:5px}
.ig-build select{width:100%;font-family:var(--mono);font-size:12px;font-weight:700;padding:10px 11px;border:1px solid var(--rule-strong);border-radius:5px;background:var(--paper-pure);color:var(--ink);cursor:pointer}
.ig-build select:focus{outline:none;border-color:var(--green)}
.ig-build .out{display:flex;align-items:center;gap:0;flex-wrap:wrap;font-family:var(--mono);font-weight:700;font-size:clamp(14px,2.4vw,21px);background:#0e1014;color:#fff;border-radius:6px;padding:14px 16px;overflow-x:auto} /*fixed: dark code panel*/
.ig-build .out .seg{padding:2px 4px;white-space:nowrap}
.ig-build .out .sep{opacity:.45;padding:0 2px}
.ig-build .out .s1{color:#8FC0FF}.ig-build .out .s2{color:#6FE0A6}.ig-build .out .s3{color:#F4C879}.ig-build .out .s4{color:#C4B0F0} /*fixed*/
.ig-build .hint{font-size:11.5px;color:var(--ink-soft);margin-top:10px}.ig-build .hint b{color:var(--green)}

/* migration timeline */
.ig-timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative;margin-top:6px}
.ig-tstep{position:relative;padding:0 10px;text-align:center;opacity:0;transform:translateY(12px)}
.ig.in .ig-tstep{animation:igslideup .55s ease forwards}
.ig.in .ig-tstep:nth-child(1){animation-delay:.05s}.ig.in .ig-tstep:nth-child(2){animation-delay:.25s}
.ig.in .ig-tstep:nth-child(3){animation-delay:.45s}.ig.in .ig-tstep:nth-child(4){animation-delay:.65s}
.ig-tstep .dot{width:38px;height:38px;border-radius:99px;display:flex;align-items:center;justify-content:center;margin:0 auto 10px;color:#fff;font-family:var(--display);font-weight:800;font-size:15px;position:relative;z-index:1}
.ig-tstep:nth-child(1) .dot{background:var(--c-context)}.ig-tstep:nth-child(2) .dot{background:var(--green)}
.ig-tstep:nth-child(3) .dot{background:var(--amber)}.ig-tstep:nth-child(4) .dot{background:var(--violet)}
.ig-tstep:not(:last-child):before{content:"";position:absolute;top:19px;left:50%;width:100%;height:2px;background:var(--rule-strong);z-index:0}
.ig-tstep h5{font-size:12.5px;font-weight:700;margin:0 0 4px}
.ig-tstep p{font-size:11px;color:var(--ink-soft);margin:0;line-height:1.4}
@media(max-width:560px){.ig-timeline{grid-template-columns:1fr 1fr}.ig-tstep{margin-bottom:18px}.ig-tstep:not(:last-child):before{display:none}}

/* architecture checklist */
.ig-check{display:grid;gap:8px}
.ig-check .item{display:flex;gap:11px;align-items:flex-start;padding:11px 13px;border:1px solid var(--rule);border-radius:6px;background:var(--paper-pure);cursor:pointer;transition:.15s;font-size:13px;color:var(--ink-soft)}
.ig-check .item:hover{border-color:var(--rule-strong)}
.ig-check .item .box{flex:none;width:20px;height:20px;border-radius:5px;border:1.5px solid var(--rule-strong);display:flex;align-items:center;justify-content:center;transition:.15s}
.ig-check .item .box svg{width:13px;height:13px;opacity:0;transform:scale(.5);transition:.18s}
.ig-check .item.on{background:var(--green-soft);border-color:var(--green);color:var(--ink)}
.ig-check .item.on .box{background:var(--green);border-color:var(--green)}
.ig-check .item.on .box svg{opacity:1;transform:none}
.ig-progress{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.ig-progress .ring{flex:none}
.ig-progress .ring circle.bar{transition:stroke-dashoffset .5s ease}
.ig-progress .pt{font-family:var(--display);font-weight:800;font-size:20px}
.ig-progress .pl{font-size:11px;color:var(--ink-soft);line-height:1.4}
.ig-progress .pl b{color:var(--green)}

/* ===================================================================
   v6.5 — readable body face. Space Grotesk for long-form prose;
   JetBrains Mono stays on every heading, label, chip, button & code.
   =================================================================== */
:root{ --body:'Space Grotesk',ui-sans-serif,system-ui,-apple-system,sans-serif; }
body{ font-family:var(--body); font-size:16px; line-height:1.62; }
/* paragraphs / lesson prose: comfortable measure */
.mbody p,.mbody li{ font-family:var(--body); font-size:16.5px; line-height:1.74; letter-spacing:.001em; color:var(--ink-soft); }
.lede{ font-family:var(--body); font-size:clamp(16px,1.8vw,19px); line-height:1.62; }
.sec p.sub,.ig-sub,.ig-meta,.ig-verdict,.mcard p,.gs-ctx,.gs-feedback p,.gs-analysis .ai p,.gs-analysis .ai .pick,.gs-analysis .ai .better,
.q-stem,.q-context,.q-explain,.opt,.gs-choice,.ig-mistake p,.ig-type p,.ig-tstep p,.ig-statband .s .l,.ig-build .hint,.ig-bar span,.ig-check .item,
.toast span,.panel,.passcode small{ font-family:var(--body); }
.q-stem{ font-size:16px; line-height:1.45; }
.opt{ font-size:15px; line-height:1.5; }
.gs-choice{ font-size:15.5px; line-height:1.5; }
.mbody h3{ font-size:17px; }   /* sub-head bumps with the larger body */

/* ===================================================================
   v6.6 — fix hierarchy node overlap + subheadlines in Space Grotesk
   (big page headline H1 + numerals stay JetBrains Mono).
   =================================================================== */
/* node: stack the name row + the pill so neither overflows into the meta */
.ig-lvl{grid-template-columns:158px 1fr;gap:18px}
.ig-node{flex-direction:column;align-items:flex-start;gap:7px;padding:11px 13px}
.ig-nm{display:flex;align-items:center;gap:9px;font-size:13px;line-height:1.1}
.ig-node .ig-pill{margin-left:0}
.ig-lvl:not(:last-child):after{left:30px}
@media(max-width:560px){
  .ig-lvl{grid-template-columns:1fr;gap:6px}
  .ig-node{flex-direction:row;align-items:center}
  .ig-lvl:not(:last-child):after{display:none}
}

/* subheadlines -> readable Space Grotesk; keep hero/page H1 + numerals mono */
.sec h2,.mbody h2,.mbody h3,.mbody h4,.toc h3,.ig-title,.mcard h3,.gs-q,.quiz-result h3{font-family:var(--body)}
.sec h2,.mbody h2{font-weight:700;letter-spacing:-0.012em}
.ig-title,.mcard h3,.gs-q,.quiz-result h3,.mbody h3,.mbody h4,.toc h3{font-weight:700;letter-spacing:-0.004em}

/* v6.7 — naming builder: 5 segments, pipe separators */
.ig-build .controls{grid-template-columns:repeat(auto-fit,minmax(118px,1fr))}
.ig-build .out{font-size:clamp(13px,2vw,19px)}
.ig-build .out .sep{opacity:.4;padding:0 4px;color:#fff}
.ig-build .out .s5{color:#C4B0F0} /*fixed*/
.ig-build .out .s4{color:#F4C879} /*fixed*/
.ig-build .out .s3{color:#76D6DD} /*fixed*/

/* ===================================================================
   v6.8 — NO-ORPHAN RULE (Dave): never leave a single card or word
   alone on its own row. Card grids use column counts that fill rows
   evenly; on small screens they stack (full-width) or scroll, never
   stranding one item. Headings/prose use text-wrap to avoid widows.
   =================================================================== */
/* campaign-types: 5 cards on ONE line; phone -> swipeable row (no orphan) */
.ig-types{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:700px){
  .ig-types{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:80%;
    overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-bottom:6px}
  .ig-types .ig-type{scroll-snap-align:start}
}
/* 9-mistakes: 3 × 3 (was auto-fill -> 4/4/1 orphan). Phone -> 1-up */
.ig-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:680px){.ig-grid{grid-template-columns:1fr}}
/* stat band: 4-up; phone 2×2 (both even, no orphan) */
.ig-statband{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:560px){.ig-statband{grid-template-columns:1fr 1fr}}

/* no orphaned WORDS: balance headings, tidy paragraph rags */
.hero h1,.mbody h1,.mbody h2,.sec h2,.ig-title,.gs-q,.mcard h3,.q-stem,.ig-sub,.toc h3{text-wrap:balance}
.lede,.sub,.sec p.sub,.mbody p,.mbody li,.ig-meta,.mcard p,.gs-ctx,.ig-verdict,.q-context,.q-explain,.opt{text-wrap:pretty}

/* ===================================================================
   v6.9 — wow-factor components: count-up stats, auction simulator,
   animated donut, before/after compare slider.
   =================================================================== */
.ig-countup .n{font-variant-numeric:tabular-nums}

/* ---- auction simulator ---- */
.auc-ctrls{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:4px 0 18px}
.auc-c label{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.04em;color:var(--ink-soft);margin-bottom:9px}
.auc-c label b{color:var(--green);font-weight:700}
.ig-auction input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:99px;background:var(--panel-2);border:1px solid var(--rule-soft);outline:none}
.ig-auction input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:19px;height:19px;border-radius:99px;background:var(--green);cursor:pointer;border:2px solid var(--paper-pure);box-shadow:0 1px 3px rgba(10,11,13,.3)}
.ig-auction input[type=range]::-moz-range-thumb{width:19px;height:19px;border-radius:99px;background:var(--green);cursor:pointer;border:2px solid var(--paper-pure)}
.auc-rank{display:flex;flex-direction:column;gap:8px}
.auc-row{display:grid;grid-template-columns:34px 70px 1fr 42px;gap:10px;align-items:center;padding:8px 10px;border:1px solid var(--rule);border-radius:6px;background:var(--paper-pure);transition:order .3s}
.auc-row.you{border-color:var(--green);background:var(--green-soft);box-shadow:inset 3px 0 0 var(--green)}
.auc-pos{font-family:var(--display);font-weight:800;font-size:14px;color:var(--mute)}
.auc-row.you .auc-pos{color:var(--green)}
.auc-nm{font-family:var(--mono);font-size:12px;font-weight:700;color:var(--ink)}
.auc-track{height:11px;background:var(--panel-2);border-radius:99px;overflow:hidden}
.auc-track i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,var(--c-context),var(--blue-line));transition:width .55s cubic-bezier(.2,.8,.2,1)}
.auc-row.you .auc-track i{background:linear-gradient(90deg,var(--green),var(--green-bright))}
.auc-val{font-family:var(--mono);font-weight:700;font-size:12px;text-align:right;color:var(--ink)}
.auc-take{margin-top:14px;font-size:13.5px;color:var(--ink-soft);border-left:3px solid var(--green);background:var(--green-soft);padding:11px 14px;border-radius:4px}
.auc-take b{color:var(--green)}
@media(max-width:520px){.auc-ctrls{grid-template-columns:1fr}}

/* ---- animated donut ---- */
.don-wrap{display:grid;grid-template-columns:184px 1fr;gap:24px;align-items:center}
.don-svg{grid-area:1/1;width:184px;height:184px}
.don-seg{transition:stroke-dashoffset 1.05s cubic-bezier(.3,.9,.3,1)}
.don-center{grid-area:1/1;align-self:center;justify-self:center;text-align:center;pointer-events:none}
.don-center .n{font-family:var(--display);font-weight:800;font-size:30px;color:var(--ink);line-height:1}
.don-center .l{font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);margin-top:3px}
.don-legend{grid-area:1/2;display:grid;gap:9px}
.don-li{display:flex;align-items:center;gap:9px;font-size:14px;color:var(--ink-soft)}
.don-li b{font-family:var(--display);font-weight:800;color:var(--ink);min-width:38px}
.don-dot{width:11px;height:11px;border-radius:3px;flex:none}
@media(max-width:560px){.don-wrap{grid-template-columns:1fr;justify-items:center}.don-legend{grid-area:auto;width:100%;max-width:280px}}

/* before/after compare slider — styles consolidated in the block below */
/* removed stale .cmp-handle span (superseded by .cmp-grip; caused double-arrow overlay) */

/* ===================================================================
   v7.0 — premium tables. Any in-lesson <table> gets a high-end,
   readable treatment: rounded card, mono uppercase header with an
   architectural-blue underline, Space Grotesk body, zebra + hover,
   emphasised first column, horizontal scroll on small screens.
   =================================================================== */
.rgm-tablewrap{margin:26px 0;border:1px solid var(--rule);border-radius:11px;overflow:auto;
  background:var(--paper-pure);box-shadow:inset 0 3px 0 var(--blue),var(--shadow);-webkit-overflow-scrolling:touch;position:relative}
.mbody table.rgm-table{margin:0;border:0;border-collapse:collapse;width:100%;min-width:560px;font-size:14.5px;background:transparent}
.mbody .rgm-table th,.mbody .rgm-table td{border:0;text-align:left;vertical-align:top;padding:15px 20px}
.mbody .rgm-table thead th,.mbody .rgm-table tr:first-child th{
  font-family:var(--mono);font-weight:700;font-size:11px;letter-spacing:.10em;text-transform:uppercase;color:var(--ink);
  background:linear-gradient(180deg,var(--panel-2),var(--paper-pure));border-bottom:2px solid var(--blue);white-space:nowrap}
.mbody .rgm-table tbody td{font-family:var(--body);color:var(--ink-soft);line-height:1.55;border-bottom:1px solid var(--rule-soft)}
.mbody .rgm-table tbody tr:last-child td{border-bottom:0}
.mbody .rgm-table tbody tr:nth-child(even){background:color-mix(in srgb,var(--ink) 2.5%,transparent)}
.mbody .rgm-table tbody tr{transition:background .14s}
.mbody .rgm-table tbody tr:hover{background:var(--accent-soft)}
.mbody .rgm-table tbody td:first-child{font-family:var(--mono);font-weight:700;color:var(--blue);white-space:nowrap;letter-spacing:.01em}
.mbody .rgm-table tbody td:first-child:before{content:"";display:inline-block;width:6px;height:6px;border-radius:99px;background:var(--blue);margin-right:9px;vertical-align:middle;opacity:.5}
.mbody .rgm-table caption{caption-side:top;text-align:left;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);padding:12px 20px 0}
@media(max-width:560px){.mbody .rgm-table th,.mbody .rgm-table td{padding:12px 14px}}

/* ===================================================================
   v7.1 — tighten infographic card text. The global .mbody p
   line-height (1.74, for long-form prose) was leaking into component
   cards and stretching them. Give component paragraphs a tighter,
   higher-specificity line-height so cards read compact.
   =================================================================== */
.ig p{line-height:1.5}
.ig-type{padding:13px 14px}
.ig-type .ig-ico{margin-bottom:7px}
.ig-type h5{line-height:1.2;margin:0 0 3px}
.ig-type p{font-size:12px;line-height:1.32;margin:0}
.ig-mistake h5{line-height:1.25}
.ig-mistake p{line-height:1.34}
.ig-meta{line-height:1.42}
.ig-tstep p{line-height:1.34}
.mcard p{line-height:1.42}
.don-li{line-height:1.3}

/* ===================================================================
   v7.2 — "Search vs Performance Max" bespoke head-to-head (replaces a
   wide overflowing comparison table). Interactive: tap the side of each
   row that fits you; a lean-meter tips Search ◀ ▶ PMax. SEO-friendly
   (all criteria are crawlable text).
   =================================================================== */
.ig-vs .vs-heads{display:grid;grid-template-columns:1fr 46px 1fr;gap:10px;align-items:stretch;margin:4px 0 14px}
.vs-eng{display:flex;align-items:center;gap:11px;padding:13px 15px;border:1px solid var(--rule);border-radius:8px;background:var(--paper-pure)}
.vs-eng .ig-ico{width:24px;height:24px;flex:none}
.vs-eng h5{font-family:var(--display);font-weight:800;font-size:15px;margin:0;letter-spacing:-.01em}
.vs-eng span{font-size:11.5px;color:var(--ink-soft);line-height:1.25;display:block;margin-top:2px}
.vs-eng.s{box-shadow:inset 0 3px 0 var(--blue)}.vs-eng.s .ig-ico{color:var(--blue)}
.vs-eng.p{box-shadow:inset 0 3px 0 var(--green)}.vs-eng.p .ig-ico{color:var(--green)}
.vs-badge{display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:800;font-size:13px;color:var(--mute)}
.vs-rows{display:grid;gap:8px}
.vs-row{display:grid;grid-template-columns:1fr 46px 1fr;gap:10px;align-items:stretch}
.vs-side{position:relative;text-align:left;font-family:var(--body);font-size:13.5px;line-height:1.34;color:var(--ink-soft);
  background:var(--paper-pure);border:1px solid var(--rule);border-radius:8px;padding:12px 14px 12px 14px;cursor:pointer;transition:.15s;display:flex;gap:10px;align-items:flex-start}
.vs-side:hover{border-color:var(--rule-strong);background:var(--panel-2)}
.vs-side .vs-tick{flex:none;width:18px;height:18px;border-radius:99px;border:1.5px solid var(--rule-strong);display:flex;align-items:center;justify-content:center;margin-top:1px;transition:.15s}
.vs-side .vs-tick svg{width:11px;height:11px;opacity:0;transform:scale(.4);transition:.18s}
.vs-side.s.sel{border-color:var(--blue);background:var(--accent-soft);color:var(--ink)}
.vs-side.s.sel .vs-tick{background:var(--blue);border-color:var(--blue)}
.vs-side.p.sel{border-color:var(--green);background:var(--green-soft);color:var(--ink)}
.vs-side.p.sel .vs-tick{background:var(--green);border-color:var(--green)}
.vs-side.sel .vs-tick svg{opacity:1;transform:none}
.vs-mid{display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint)}
.vs-mid span{display:inline-block;border:1px solid var(--rule);border-radius:99px;padding:3px 0;width:30px;text-align:center}
.vs-meter{margin-top:16px}
.vs-track{position:relative;height:8px;border-radius:99px;background:linear-gradient(90deg,var(--accent-soft),var(--panel-2),var(--green-soft));border:1px solid var(--rule-soft)}
.vs-track i{position:absolute;top:50%;left:50%;width:18px;height:18px;border-radius:99px;background:var(--ink);border:3px solid var(--paper-pure);box-shadow:0 1px 4px rgba(10,11,13,.35);transform:translate(-50%,-50%);transition:left .45s cubic-bezier(.2,.8,.2,1)}
.vs-foot{display:flex;justify-content:space-between;align-items:center;margin-top:10px;font-size:13px;color:var(--ink-soft);gap:10px}
.vs-end{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.vs-end.s{color:var(--blue)}.vs-end.p{color:var(--green)}
.vs-foot b{text-align:center;font-family:var(--body);font-weight:700;color:var(--ink)}
.vs-foot b b{color:var(--green)}
.vs-actions{margin-top:12px;text-align:right}
.vs-reset{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);background:transparent;border:1px solid var(--rule);border-radius:6px;padding:7px 14px;cursor:pointer}
.vs-reset:hover{color:var(--ink);border-color:var(--rule-strong)}
@media(max-width:620px){
  .ig-vs .vs-heads,.vs-row{grid-template-columns:1fr;gap:7px}
  .vs-badge,.vs-mid{display:none}
  .vs-side.s{box-shadow:inset 3px 0 0 var(--blue)}.vs-side.p{box-shadow:inset 3px 0 0 var(--green)}
}

/* ===================================================================
   v7.3 — compare-slider rebuilt: aligned rows, obvious draggable grip
   (pulse + "drag me" hint + teaser sweep), readable at both extremes.
   =================================================================== */
.cmp{height:250px;cursor:ew-resize;border:1px solid var(--rule);border-radius:10px;overflow:hidden;position:relative;user-select:none;outline:none;box-shadow:var(--shadow)}
.cmp:focus-visible{box-shadow:0 0 0 2px var(--blue)}
.cmp-pane{position:absolute;inset:0;padding:46px 20px 16px;display:flex;flex-direction:column;gap:0}
.cmp-after{background:linear-gradient(180deg,var(--green-soft),transparent),var(--paper-pure)}
.cmp-before{width:50%;overflow:hidden;background:linear-gradient(180deg,var(--red-soft),transparent),var(--paper-pure)}
.cmp-row{height:42px;display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:12.5px;white-space:nowrap;border-top:1px dashed var(--rule-soft)}
.cmp-row:first-child{border-top:0}
.cmp-row svg{width:17px;height:17px;flex:none}
.cmp-row.no{color:var(--red)}.cmp-row.no span{color:var(--ink)}
.cmp-row.ok{color:var(--green)}.cmp-row.ok span{color:var(--ink)}
.cmp-tag{position:absolute;top:12px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;padding:4px 11px;border-radius:99px;z-index:5}
.cmp-tag.bad{left:14px;background:var(--red-soft);color:var(--red)}
.cmp-tag.good{right:14px;background:var(--green-soft);color:var(--green)}
.cmp-handle{position:absolute;top:0;bottom:0;left:50%;width:3px;background:linear-gradient(180deg,var(--blue),var(--blue-line));transform:translateX(-1.5px);z-index:6;cursor:ew-resize}
.cmp-grip{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:46px;height:46px;border-radius:99px;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:700;letter-spacing:-2px;box-shadow:0 4px 16px rgba(10,11,13,.42)}
.cmp-handle:after{content:"";position:absolute;top:50%;left:50%;width:46px;height:46px;border-radius:99px;border:2px solid var(--blue);transform:translate(-50%,-50%);animation:cmppulse 1.8s ease-out infinite;pointer-events:none}
.cmp.touched .cmp-handle:after{animation:none;opacity:0}
@keyframes cmppulse{0%{opacity:.75;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.75)}}
.cmp-hint{position:absolute;top:calc(50% - 46px);left:50%;transform:translateX(-50%);font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;background:var(--blue);color:#fff;padding:5px 11px;border-radius:99px;z-index:7;white-space:nowrap;animation:cmphint 1.3s ease-in-out infinite;pointer-events:none}
.cmp-hint:after{content:"";position:absolute;bottom:-5px;left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:var(--blue);border-bottom:0}
.cmp.touched .cmp-hint{opacity:0;transition:opacity .3s;animation:none}
@keyframes cmphint{0%,100%{margin-top:0}50%{margin-top:-5px}}

/* ===================================================================
   v7.4 — migration timeline: animated progress line, popping dots,
   tighter step text.
   =================================================================== */
.ig-timeline{position:relative;padding-top:6px}
.ig-tl-line{position:absolute;top:23px;left:12.5%;right:12.5%;height:3px;background:var(--rule-strong);border-radius:3px;overflow:hidden;z-index:0}
.ig-tl-line i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--c-context),var(--green) 38%,var(--amber) 70%,var(--violet));transition:width 1.5s cubic-bezier(.3,.8,.3,1) .25s}
.ig.in .ig-tl-line i{width:100%}
.ig-tstep{position:relative;z-index:1}
.ig-tstep:not(:last-child):before{display:none}
.ig-tstep .dot{box-shadow:0 0 0 5px var(--paper-pure);transform:scale(0)}
.ig.in .ig-tstep .dot{animation:tlpop .5s cubic-bezier(.2,1.35,.4,1) forwards}
.ig.in .ig-tstep:nth-child(3) .dot{animation-delay:.16s}
.ig.in .ig-tstep:nth-child(4) .dot{animation-delay:.36s}
.ig.in .ig-tstep:nth-child(5) .dot{animation-delay:.56s}
@keyframes tlpop{to{transform:scale(1)}}
.ig-tstep:hover .dot{transform:scale(1.12);transition:transform .2s;box-shadow:0 0 0 5px var(--paper-pure),0 6px 16px -6px currentColor}
.ig .ig-tstep h5{margin:0 0 3px}
.ig .ig-tstep p{font-size:12px;line-height:1.3;margin:0}

/* ===================================================================
   v7.5 — account-decision tool: pros/cons + interactive keep-vs-fresh
   scorer with a live recommendation. Reusable across platform trainings.
   =================================================================== */
.ad-prc{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:4px 0 18px}
.ad-pc{border:1px solid var(--rule);border-radius:8px;padding:14px 16px;background:var(--paper-pure)}
.ad-pc.s{box-shadow:inset 0 3px 0 var(--green)}.ad-pc.f{box-shadow:inset 0 3px 0 var(--red)}
.ad-pc h6{font-family:var(--display);font-weight:800;font-size:14px;margin:0 0 8px;letter-spacing:-.01em}
.ad-pc.s h6{color:var(--green)}.ad-pc.f h6{color:var(--red)}
.ad-pc ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.ad-pc li{font-size:12.5px;color:var(--ink-soft);line-height:1.3;padding-left:19px;position:relative}
.ad-pc li:before{position:absolute;left:0;top:-1px;font-weight:800}
.ad-pc li.p:before{content:"\2713";color:var(--green)}
.ad-pc li.c:before{content:"\0021";color:var(--amber)}
.ad-prompt{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);margin:4px 0 10px}
.ad-cols{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px}
.ad-h{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;margin-bottom:8px}
.ad-h.s{color:var(--green)}.ad-h.f{color:var(--red)}
.ad-col{display:grid;gap:7px;align-content:start}
.ad-chip{display:flex;align-items:center;gap:9px;text-align:left;font-family:var(--body);font-size:13px;line-height:1.25;color:var(--ink-soft);background:var(--paper-pure);border:1px solid var(--rule);border-radius:7px;padding:10px 12px;cursor:pointer;transition:.14s}
.ad-chip .ad-x{flex:none;width:17px;height:17px;border-radius:5px;border:1.5px solid var(--rule-strong);display:inline-flex;align-items:center;justify-content:center;transition:.14s}
.ad-chip.keep:hover{border-color:var(--green)}.ad-chip.fresh:hover{border-color:var(--red)}
.ad-chip.keep.sel{border-color:var(--green);background:var(--green-soft);color:var(--ink)}
.ad-chip.keep.sel .ad-x{background:var(--green);border-color:var(--green)}
.ad-chip.fresh.sel{border-color:var(--red);background:var(--red-soft);color:var(--ink)}
.ad-chip.fresh.sel .ad-x{background:var(--red);border-color:var(--red)}
.ad-chip.sel .ad-x:after{content:"";width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg);margin-top:-2px}
.ad-verdict{border:1px solid var(--rule);border-radius:8px;padding:16px;background:var(--panel-2);transition:.2s}
.ad-verdict.keep{border-color:var(--green);background:var(--green-soft)}
.ad-verdict.fresh{border-color:var(--red);background:var(--red-soft)}
.ad-verdict.mid{border-color:var(--amber);background:var(--amber-soft)}
.ad-meter{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.ad-end{font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.ad-end.f{color:var(--red)}.ad-end.s{color:var(--green)}
.ad-track{position:relative;flex:1;height:8px;border-radius:99px;background:linear-gradient(90deg,var(--red-soft),var(--panel-2),var(--green-soft));border:1px solid var(--rule-soft)}
.ad-track i{position:absolute;top:50%;left:50%;width:18px;height:18px;border-radius:99px;background:var(--ink);border:3px solid var(--paper-pure);box-shadow:0 1px 4px rgba(10,11,13,.35);transform:translate(-50%,-50%);transition:left .45s cubic-bezier(.2,.8,.2,1)}
.ad-rt{font-family:var(--display);font-weight:800;font-size:17px;display:block;margin-bottom:4px;letter-spacing:-.01em}
.ad-verdict.keep .ad-rt{color:var(--green)}.ad-verdict.fresh .ad-rt{color:var(--red)}.ad-verdict.mid .ad-rt{color:var(--amber)}
.ad-rb{font-size:13px;color:var(--ink-soft);margin:0;line-height:1.45}
@media(max-width:620px){.ad-prc,.ad-cols{grid-template-columns:1fr}}

/* ===================================================================
   v7.6 — RGM match-type rule component (exact + phrase, broken out).
   =================================================================== */
.mt-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:4px 0 16px}
.mt-card{position:relative;border:1px solid var(--rule);border-radius:8px;padding:14px;background:var(--paper-pure)}
.mt-card.keep{box-shadow:inset 0 3px 0 var(--green)}
.mt-card.avoid{box-shadow:inset 0 3px 0 var(--red)}
.mt-top{display:flex;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap}
.mt-ic{width:22px;height:22px;flex:none}.mt-card.keep .mt-ic{color:var(--green)}.mt-card.avoid .mt-ic{color:var(--red)}
.mt-card h5{font-family:var(--display);font-weight:800;font-size:15px;margin:0}
.mt-card code{font-family:var(--mono);font-size:11px;color:var(--mute);background:var(--panel-2);padding:2px 7px;border-radius:4px}
.mt-card.avoid code{text-decoration:line-through}
.mt-card p{font-size:12.5px;color:var(--ink-soft);line-height:1.34;margin:0}
.mt-flag{position:absolute;top:12px;right:12px;font-family:var(--mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;padding:2px 8px;border-radius:99px}
.mt-card.keep .mt-flag{background:var(--green-soft);color:var(--green)}
.mt-card.avoid .mt-flag{background:var(--red-soft);color:var(--red)}
.mt-flow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center;background:var(--panel-2);border:1px solid var(--rule);border-radius:8px;padding:13px;margin-bottom:14px}
.mt-node{font-family:var(--mono);font-size:12px;font-weight:700;padding:8px 14px;border-radius:6px;color:#fff}
.mt-node.p{background:var(--c-analysis)}.mt-node.e{background:var(--green)}
.mt-arr{font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.mt-why{border-left:3px solid var(--green);background:var(--green-soft);border-radius:4px;padding:12px 16px}
.mt-why-h{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--green);margin-bottom:8px}
.mt-why ul{margin:0;padding-left:18px;display:grid;gap:4px}
.mt-why li{font-size:13px;color:var(--ink-soft);line-height:1.35}
@media(max-width:620px){.mt-grid{grid-template-columns:1fr}}

/* ===================================================================
   v7.7 — slider content off the left edge + wider travel; intent×match
   matrix; tiered match-type cards.
   =================================================================== */
.cmp-pane{padding-left:58px}
.cmp-row{font-size:12px}

/* tiered match-type cards (broad = Tier 3, not "avoid") */
.mt-card.t1{box-shadow:inset 0 3px 0 var(--green)}
.mt-card.t2{box-shadow:inset 0 3px 0 var(--c-analysis)}
.mt-card.t3{box-shadow:inset 0 3px 0 var(--amber)}
.mt-tier{font-family:var(--mono);font-size:9px;font-weight:800;letter-spacing:.08em;padding:2px 8px;border-radius:99px}
.mt-card.t1 .mt-tier{background:var(--green-soft);color:var(--green)}
.mt-card.t2 .mt-tier{background:var(--c-analysis-soft);color:var(--c-analysis)}
.mt-card.t3 .mt-tier{background:var(--amber-soft);color:var(--amber)}
.mt-node.b{background:var(--amber)}

/* intent × match-type matrix */
.im-grid{border:1px solid var(--rule);border-radius:8px;overflow:hidden;margin:4px 0 12px}
.im-row{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr}
.im-cell{padding:11px 12px;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);font-size:12.5px;display:flex;align-items:center;gap:6px}
.im-row:last-child .im-cell{border-bottom:0}.im-cell:last-child{border-right:0}
.im-head .im-cell{background:var(--panel-2);font-family:var(--mono);font-size:10px;letter-spacing:.05em;text-transform:uppercase;font-weight:700;color:var(--ink)}
.im-corner{color:var(--mute)!important;font-size:9px!important}
.im-ih{font-family:var(--mono);font-weight:700;font-size:12px;background:var(--panel-2);color:var(--ink)}
.im-tier,.im-t{font-family:var(--mono);font-size:8px;font-weight:800;padding:1px 6px;border-radius:99px;background:var(--paper);color:var(--mute)}
.im-c{cursor:pointer;border:0;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);justify-content:center;transition:.14s;background:transparent}
.im-c .im-lab{font-family:var(--mono);font-size:10px;letter-spacing:.04em;text-transform:uppercase;font-weight:700}
.im-c.b0{background:rgba(31,140,90,.06)}.im-c.b1{background:rgba(31,140,90,.16)}.im-c.b2{background:rgba(31,140,90,.30)}.im-c.b3{background:rgba(31,140,90,.46)}.im-c.b4{background:rgba(31,140,90,.64)}
.im-c.b0 .im-lab,.im-c.b1 .im-lab{color:var(--green)}.im-c.b2 .im-lab{color:var(--ac-green)}.im-c.b3 .im-lab,.im-c.b4 .im-lab{color:#fff}
.im-c:hover{box-shadow:inset 0 0 0 2px var(--green)}
.im-c.on{box-shadow:inset 0 0 0 2px var(--ink)}
.im-legend{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:var(--mute);margin-bottom:12px;flex-wrap:wrap}
.im-legend i{width:20px;height:12px;border-radius:3px;display:inline-block}
.im-legend i.b0{background:rgba(31,140,90,.06)}.im-legend i.b1{background:rgba(31,140,90,.16)}.im-legend i.b2{background:rgba(31,140,90,.30)}.im-legend i.b3{background:rgba(31,140,90,.46)}.im-legend i.b4{background:rgba(31,140,90,.64)}
.im-detail{border-left:3px solid var(--green);background:var(--green-soft);border-radius:4px;padding:12px 14px;font-size:13px;color:var(--ink-soft);line-height:1.45}
.im-detail b{color:var(--green)}
@media(max-width:560px){.im-cell{padding:9px 7px;font-size:11px}.im-c .im-lab{font-size:9px}}

/* ===================================================================
   v7.8 — migration timeline dot fix: the progress line is the grid's
   first child, so step dots are nth-child(2..5). Recolour accordingly,
   make the final "Stable" step a green check (done), and size the SVG.
   =================================================================== */
.ig-timeline .ig-tstep:nth-child(2) .dot{background:var(--c-context)}
.ig-timeline .ig-tstep:nth-child(3) .dot{background:var(--c-analysis)}
.ig-timeline .ig-tstep:nth-child(4) .dot{background:var(--amber)}
.ig-timeline .ig-tstep:nth-child(5) .dot{background:var(--violet)}
.ig-timeline .ig-tstep.done .dot{background:var(--green)}
.ig-timeline .ig-tstep .dot svg{width:19px;height:19px}

/* ===================================================================
   v7.9 — Module 2 visuals: harvest loop (animated) + query routing
   (interactive toggle).
   =================================================================== */
.hl-wrap{display:grid;grid-template-columns:240px 1fr;gap:24px;align-items:center}
.hl-svg{width:240px;height:240px;flex:none}
.hl-spin{transform-origin:120px 120px;animation:hlspin 6s linear infinite}
@keyframes hlspin{to{transform:rotate(360deg)}}
.hl-n{fill:#fff;font-family:var(--display);font-weight:800;font-size:15px}
.hl-c1{fill:var(--mute);font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase}
.hl-c2{fill:var(--ink);font-family:var(--display);font-weight:800;font-size:16px}
.hl-steps{display:grid;gap:10px}
.hl-step{display:flex;gap:11px;align-items:flex-start;font-size:13.5px;color:var(--ink-soft);line-height:1.34}
.hl-step span{flex:none;width:24px;height:24px;border-radius:99px;color:#fff;font-family:var(--mono);font-weight:700;font-size:12px;display:flex;align-items:center;justify-content:center}
.hl-step.a span{background:var(--amber)}.hl-step.g span{background:var(--green)}.hl-step.b span{background:var(--blue)}
.hl-step b{color:var(--ink)}
@media(max-width:560px){.hl-wrap{grid-template-columns:1fr;justify-items:center}.hl-steps{width:100%}}

.qr-query{font-family:var(--mono);font-size:13px;color:var(--ink-soft);background:var(--panel-2);border:1px solid var(--rule);border-radius:6px;padding:11px 14px;margin:4px 0 14px}
.qr-query b{color:var(--ink)}
.qr-toggle{display:inline-flex;border:1px solid var(--rule-strong);border-radius:8px;overflow:hidden;margin-bottom:16px}
.qr-btn{font-family:var(--mono);font-size:12px;font-weight:700;padding:10px 16px;background:var(--paper-pure);color:var(--ink-soft);border:0;cursor:pointer;transition:.14s}
.qr-btn+.qr-btn{border-left:1px solid var(--rule)}
.qr-btn.on{background:var(--blue);color:#fff}
.qr-camps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:14px}
.qr-camp{position:relative;border:1px solid var(--rule);border-radius:8px;padding:14px;background:var(--paper-pure);transition:.18s;opacity:.5}
.qr-camp b{display:block;font-family:var(--mono);font-weight:700;font-size:13px;color:var(--ink)}
.qr-camp span{font-size:11.5px;color:var(--ink-soft)}
.qr-camp.live{opacity:1}
.qr-camp.exact.live{box-shadow:inset 0 3px 0 var(--green);border-color:var(--green)}
.qr-camp.phrase.live{box-shadow:inset 0 3px 0 var(--c-analysis);border-color:var(--c-analysis)}
.qr-camp.broad.live{box-shadow:inset 0 3px 0 var(--amber);border-color:var(--amber)}
.qr-camp.negated{opacity:.45}
.qr-camp.negated b,.qr-camp.negated span{text-decoration:line-through}
.qr-flag{position:absolute;top:10px;right:10px;font-family:var(--mono);font-size:8px;letter-spacing:.08em;text-transform:uppercase;font-weight:700}
.qr-camp.live .qr-flag:after{content:"eligible";background:var(--green-soft);color:var(--green);padding:2px 7px;border-radius:99px}
.qr-camp.negated .qr-flag:after{content:"negated";background:var(--red-soft);color:var(--red);padding:2px 7px;border-radius:99px}
.qr-verdict{border-left:3px solid var(--amber);background:var(--amber-soft);border-radius:4px;padding:12px 14px;font-size:13px;color:var(--ink-soft);line-height:1.45}
.qr-verdict.on{border-left-color:var(--green);background:var(--green-soft)}
.qr-verdict b{color:var(--ink)}
@media(max-width:560px){.qr-camps{grid-template-columns:1fr}}

/* ===================================================================
   v8.0 — hub "Get certified" section: full-width, left-aligned,
   visual 4-step process (replaces the centered "how it works").
   =================================================================== */
.cert-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:10px 0 22px}
.cert-step{position:relative;border:1px solid var(--rule);border-radius:10px;background:var(--paper-pure);padding:20px;overflow:hidden}
.cert-step.s1{box-shadow:inset 0 3px 0 var(--c-context)}
.cert-step.s2{box-shadow:inset 0 3px 0 var(--c-analysis)}
.cert-step.s3{box-shadow:inset 0 3px 0 var(--amber)}
.cert-step.s4{box-shadow:inset 0 3px 0 var(--green)}
.cert-ico{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.cert-ico svg{width:21px;height:21px}
.cert-step.s1 .cert-ico{background:var(--c-context)}.cert-step.s2 .cert-ico{background:var(--c-analysis)}
.cert-step.s3 .cert-ico{background:var(--amber)}.cert-step.s4 .cert-ico{background:var(--green)}
.cert-no{position:absolute;top:14px;right:18px;font-family:var(--display);font-weight:800;font-size:30px;color:var(--ink);opacity:.10;line-height:1}
.cert-step h4{font-family:var(--display);font-weight:800;font-size:16px;letter-spacing:-.01em;margin:0 0 6px}
.cert-step p{font-size:13px;color:var(--ink-soft);line-height:1.42;margin:0}
.cert-reclaim{display:flex;align-items:center;gap:20px;flex-wrap:wrap;border-top:1px solid var(--rule);padding-top:18px}
.cert-reclaim-txt{font-size:14px;color:var(--ink-soft);max-width:46ch;line-height:1.45}
.cert-reclaim-txt strong{color:var(--ink)}
.cert-reclaim .pc-entry{margin-top:0}
@media(max-width:880px){.cert-steps{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.cert-steps{grid-template-columns:1fr}}

/* ===================================================================
   v8.1 — auction theory: second-price simulator + video/resource block.
   =================================================================== */
.sp-headline{display:flex;align-items:center;gap:16px;flex-wrap:wrap;background:var(--panel-2);border:1px solid var(--rule);border-radius:10px;padding:16px 18px;margin:6px 0 14px}
.sp-big{display:flex;flex-direction:column}
.sp-big .sp-l{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.sp-big b{font-family:var(--display);font-weight:800;font-size:30px;line-height:1.1}
.sp-big.pay b{color:var(--green)}
.sp-arrow{font-size:22px;color:var(--mute)}
.sp-save{margin-left:auto;font-family:var(--mono);font-size:12px;font-weight:700;color:var(--green);background:var(--green-soft);padding:6px 12px;border-radius:99px}
.sp-rows{display:grid;gap:7px;margin-bottom:12px}
.sp-row{display:grid;grid-template-columns:34px 1fr auto auto;gap:12px;align-items:center;padding:9px 12px;border:1px solid var(--rule);border-radius:6px;font-size:13px;background:var(--paper-pure)}
.sp-row.you{border-color:var(--green);background:var(--green-soft)}
.sp-pos{font-family:var(--display);font-weight:800;color:var(--mute)}.sp-row.you .sp-pos{color:var(--green)}
.sp-nm{font-family:var(--mono);font-weight:700;color:var(--ink)}
.sp-ar{font-family:var(--mono);font-size:11px;color:var(--mute)}
.sp-pay{font-family:var(--mono);font-weight:700;color:var(--ink)}
.sp-note{font-size:13px;color:var(--ink-soft);border-left:3px solid var(--blue);background:var(--accent-soft);border-radius:4px;padding:12px 14px;line-height:1.45}
.sp-note b{color:var(--ink)}
@media(max-width:560px){.sp-row{grid-template-columns:30px 1fr}.sp-ar,.sp-pay{grid-column:2;font-size:11px}}

.req-badge{display:inline-block;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;background:var(--amber-soft);color:var(--amber);padding:4px 11px;border-radius:99px;margin:4px 0 10px}
.vid{position:relative;width:100%;aspect-ratio:16/9;border:1px solid var(--rule);border-radius:10px;overflow:hidden;background:#000;margin:6px 0 14px}
.vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.reslist{display:grid;gap:10px;margin:6px 0 10px}
.reslink{display:flex;gap:12px;align-items:center;border:1px solid var(--rule);border-radius:8px;padding:13px 15px;background:var(--paper-pure);text-decoration:none;color:var(--ink)}
.reslink:hover{border-color:var(--blue);text-decoration:none}
.reslink .rl-ic{width:34px;height:34px;border-radius:8px;background:var(--accent-soft);color:var(--blue);display:flex;align-items:center;justify-content:center;flex:none}
.reslink .rl-ic svg{width:18px;height:18px}
.reslink .rl-t b{display:block;font-size:13.5px;color:var(--ink);line-height:1.3}
.reslink .rl-t span{font-size:12px;color:var(--ink-soft)}

/* ============ v8.2 — Curriculum as compact numbered list (fits one screen, obvious 1–7) ============ */
#cards.cards,.cards{display:flex;flex-direction:column;gap:8px;border:0;background:transparent;grid-template-columns:none}
.mrow{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:18px;
  padding:12px 16px 12px 12px;border:1px solid var(--rule);border-left:4px solid var(--rule);
  border-radius:12px;background:var(--paper-pure);text-decoration:none;position:relative;
  transition:border-color .15s,transform .15s,box-shadow .15s}
.mrow:hover{border-color:var(--blue);border-left-color:var(--blue);transform:translateX(3px);
  box-shadow:0 6px 22px rgba(31,78,140,.10);text-decoration:none}
.mrow:hover .mrow-go{opacity:1;transform:translateX(0)}
/* big obvious number badge */
.mrow-num{flex:none;width:58px;height:58px;border-radius:13px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;color:#fff;line-height:1;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);position:relative}
.mrn-d{font-family:var(--display);font-weight:800;font-size:30px;letter-spacing:-.02em}
.mrn-k{font-family:var(--mono);font-size:7.5px;font-weight:600;letter-spacing:.18em;opacity:.85;margin-top:2px}
.mrow-num.n1{background:#1F4E8C}.mrow-num.n2{background:#0E7C86}.mrow-num.n3{background:#2E7D32}
.mrow-num.n4{background:#C9821B}.mrow-num.n5{background:#6D4AA8}.mrow-num.n6{background:#B5483C}
.mrow-num.n7{background:#2A6E8F}.mrow-num.nx{background:linear-gradient(135deg,#C9821B,#9a6314)}
/* middle */
.mrow-main{min-width:0}
.mrow-t{display:block;font-family:var(--display);font-weight:800;font-size:18px;color:var(--ink);
  letter-spacing:-.01em;line-height:1.12}
.mrow-d{display:block;font-family:var(--body);font-size:13px;color:var(--ink-soft);margin-top:3px;
  line-height:1.45;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
/* right meta */
.mrow-meta{flex:none;text-align:right;display:flex;flex-direction:column;gap:5px;align-items:flex-end}
.mrow .mcard-status{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.04em;
  text-transform:uppercase;color:var(--mute);display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.mrow .mcard-status .dot{width:7px;height:7px;border-radius:50%;background:var(--mute)}
.mrow-sub{font-family:var(--mono);font-size:9.5px;letter-spacing:.05em;color:var(--mute);white-space:nowrap}
.mrow-go{flex:none;font-family:var(--display);font-size:20px;color:var(--blue);opacity:.35;
  transform:translateX(-4px);transition:opacity .15s,transform .15s}
/* completed state */
.mrow.done{border-left-color:var(--ac-green)}
.mrow.done .mcard-status{color:var(--ac-green)}
.mrow.done .mcard-status .dot{background:#2E7D32}
.mrow.done .mrow-num{box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 0 0 2px rgba(46,125,50,.45)}
/* exam row accent */
.mrow.exam{border-left-color:var(--ac-amber)}
.mrow.exam .mcard-status{color:var(--ac-amber)}.mrow.exam .mcard-status .dot{background:#C9821B}
/* responsive: phone stacks, meta drops below, never orphan */
@media(max-width:640px){
  .mrow{grid-template-columns:auto 1fr;gap:12px;row-gap:8px;padding:12px}
  .mrow-num{width:48px;height:48px}.mrn-d{font-size:24px}
  .mrow-meta{grid-column:1 / -1;flex-direction:row;justify-content:space-between;align-items:center;text-align:left}
  .mrow-go{display:none}
}

/* ============ v8.3 — Interactive tool framework (.tool[data-tool]) ============ */
.tool{border:1px solid var(--rule);border-radius:14px;background:var(--paper-pure);overflow:hidden;margin:26px 0;
  box-shadow:0 1px 0 rgba(10,11,13,.03)}
.tool-hd{padding:16px 20px 14px;border-bottom:1px solid var(--rule);background:linear-gradient(0deg,transparent,rgba(31,78,140,.03))}
.tool-kicker{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  color:var(--blue);display:flex;align-items:center;gap:8px}
.tool-kicker svg{width:14px;height:14px}
.tool-title{font-family:var(--display);font-weight:800;font-size:20px;letter-spacing:-.01em;margin:5px 0 2px;color:var(--ink)}
.tool-sub{font-family:var(--body);font-size:13.5px;color:var(--ink-soft);line-height:1.5;margin:0}
.tool-bd{padding:18px 20px 20px}
.tool-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px 18px;margin-bottom:6px}
.tfield{display:flex;flex-direction:column;gap:5px;min-width:0}
.tfield>label{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--mute)}
.tfield .hint{font-family:var(--body);font-size:11px;color:var(--mute);line-height:1.35}
.tin,.tsel{font-family:var(--mono);font-size:15px;color:var(--ink);background:var(--paper);border:1px solid var(--rule);
  border-radius:8px;padding:9px 11px;width:100%;transition:border-color .15s,box-shadow .15s}
.tin:focus,.tsel:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(31,78,140,.12)}
.tin-money{position:relative}.tin-money::before{content:"$";position:absolute;left:11px;top:9px;font-family:var(--mono);font-size:15px;color:var(--mute);pointer-events:none}
.tin-money .tin{padding-left:22px}
.tin-pct{position:relative}.tin-pct::after{content:"%";position:absolute;right:12px;top:9px;font-family:var(--mono);font-size:15px;color:var(--mute);pointer-events:none}
/* scenario cards */
.scn{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0 4px}
.scn-c{border:1px solid var(--rule);border-top:3px solid var(--rule);border-radius:11px;padding:13px 14px;background:var(--paper)}
.scn-bad{border-top-color:var(--ac-red)}.scn-good{border-top-color:var(--ac-blue)}.scn-best{border-top-color:var(--ac-green)}
.scn-lab{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;display:flex;justify-content:space-between;align-items:center}
.scn-bad .scn-lab{color:var(--ac-red)}.scn-good .scn-lab{color:var(--ac-blue)}.scn-best .scn-lab{color:var(--ac-green)}
.scn-lab .scn-tag{font-size:8.5px;font-weight:600;opacity:.7;letter-spacing:.08em}
.scn-hero{font-family:var(--display);font-weight:800;font-size:25px;letter-spacing:-.02em;margin:8px 0 2px;color:var(--ink);line-height:1}
.scn-herol{font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.scn-rows{margin-top:10px;border-top:1px dashed var(--rule);padding-top:9px;display:flex;flex-direction:column;gap:5px}
.scn-row{display:flex;justify-content:space-between;font-family:var(--mono);font-size:11.5px}
.scn-row span:first-child{color:var(--mute)}.scn-row span:last-child{color:var(--ink);font-weight:600}
/* verdict banner */
.verdict{margin:16px 0 0;border-radius:12px;padding:15px 17px;border:1px solid var(--rule);border-left:5px solid var(--mute);background:var(--paper)}
.verdict.v-ok{border-left-color:var(--ac-green);background:rgba(46,125,50,.06)}
.verdict.v-stretch{border-left-color:var(--ac-amber);background:rgba(201,130,27,.07)}
.verdict.v-no{border-left-color:var(--ac-red);background:rgba(181,72,60,.06)}
.verdict-h{font-family:var(--display);font-weight:800;font-size:16px;letter-spacing:-.01em;display:flex;align-items:center;gap:9px;margin-bottom:5px}
.verdict.v-ok .verdict-h{color:var(--ac-green)}.verdict.v-stretch .verdict-h{color:var(--ac-amber)}.verdict.v-no .verdict-h{color:var(--ac-red)}
.verdict-h .vbadge{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.12em;padding:3px 8px;border-radius:20px;color:#fff}
.verdict.v-ok .vbadge{background:#2E7D32}.verdict.v-stretch .vbadge{background:#C9821B}.verdict.v-no .vbadge{background:#B5483C}
.verdict-b{font-family:var(--body);font-size:13.5px;color:var(--ink);line-height:1.55;margin:0}
.verdict-b b{font-weight:700}
.verdict-math{font-family:var(--mono);font-size:11px;color:var(--ink-soft);margin-top:8px;padding-top:8px;border-top:1px dashed var(--rule);line-height:1.5}
/* resourcing strip */
.resourcing{margin-top:14px;border:1px dashed var(--rule);border-radius:11px;padding:13px 15px;background:var(--paper)}
.resourcing-h{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);margin-bottom:6px;display:flex;align-items:center;gap:7px}
.resourcing-t{font-family:var(--mono);font-weight:800;font-size:13px;color:var(--ink);margin-bottom:3px}
.resourcing-b{font-family:var(--body);font-size:13px;color:var(--ink-soft);line-height:1.55;margin:0}
.tool-note{font-family:var(--body);font-size:11px;color:var(--mute);margin:20px 0 0;line-height:1.5}
.tool-note b{color:var(--ink-soft);font-weight:600}
@media(max-width:620px){.scn{grid-template-columns:1fr}.scn-c{border-top-width:3px}}

/* v8.3a — clamp tool icon sizes (verdict/resourcing SVGs were filling their box) */
.tool svg{max-width:100%}
.verdict-h svg{width:20px;height:20px;flex:none}
.resourcing-h svg{width:14px;height:14px;flex:none}
.tool-kicker svg{width:14px;height:14px;flex:none}

/* ============ v8.4 — Keyword research + intent tiering tool ============ */
.tta{font-family:var(--mono);font-size:13.5px;line-height:1.55;color:var(--ink);background:var(--paper);border:1px solid var(--rule);border-radius:8px;padding:11px 12px;width:100%;min-height:120px;resize:vertical;transition:border-color .15s,box-shadow .15s}
.tta:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(31,78,140,.12)}
.tbtn{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--blue);background:var(--paper);border:1px solid var(--rule);border-radius:7px;padding:8px 13px;cursor:pointer;transition:.15s;display:inline-flex;align-items:center;gap:7px}
.tbtn:hover{border-color:var(--blue);background:rgba(31,78,140,.06)}
.tbtn svg{width:14px;height:14px}
.tbtn.copied{color:var(--ac-green);border-color:var(--ac-green);background:rgba(46,125,50,.07)}
/* summary strip */
.kt-sum{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin:16px 0 6px}
.kt-stat{border:1px solid var(--rule);border-top:3px solid var(--mute);border-radius:10px;padding:10px 12px;background:var(--paper)}
.kt-stat.t-vh{border-top-color:var(--ac-green)}.kt-stat.t-h{border-top-color:var(--ac-blue)}.kt-stat.t-m{border-top-color:var(--ac-amber)}.kt-stat.t-l{border-top-color:var(--ac-violet)}
.kt-statn{font-family:var(--display);font-weight:800;font-size:24px;letter-spacing:-.02em;line-height:1}
.kt-statl{font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);margin-top:4px}
.kt-plan{margin:10px 0 0;border:1px dashed var(--rule);border-radius:10px;padding:12px 14px;background:var(--paper);font-family:var(--body);font-size:13px;color:var(--ink-soft);line-height:1.55}
.kt-plan b{color:var(--ink);font-weight:700}
/* tier groups */
.kt-group{margin-top:14px;border:1px solid var(--rule);border-radius:11px;overflow:hidden}
.kt-ghd{display:flex;align-items:center;gap:10px;padding:9px 13px;font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;border-bottom:1px solid var(--rule)}
.kt-ghd .kt-gn{margin-left:auto;font-size:10px;color:var(--mute)}
.kt-group.t-vh .kt-ghd{background:rgba(46,125,50,.07);color:var(--ac-green)}
.kt-group.t-h .kt-ghd{background:rgba(31,78,140,.06);color:var(--ac-blue)}
.kt-group.t-m .kt-ghd{background:rgba(201,130,27,.07);color:var(--ac-amber)}
.kt-group.t-l .kt-ghd{background:rgba(109,74,168,.07);color:var(--ac-violet)}
.kt-row{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:12px;padding:9px 13px;border-top:1px dashed var(--rule-soft);font-family:var(--mono);font-size:13px}
.kt-row:first-child{border-top:0}
.kt-kw{color:var(--ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kt-kw .kt-brand{font-size:8.5px;font-weight:700;letter-spacing:.08em;color:var(--blue);border:1px solid var(--blue);border-radius:4px;padding:1px 4px;margin-left:7px;vertical-align:1px}
.kt-chip{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:3px 8px;border-radius:20px;white-space:nowrap}
.kt-chip.m-exact{background:rgba(46,125,50,.12);color:var(--ac-green)}
.kt-chip.m-phrase{background:rgba(31,78,140,.12);color:var(--ac-blue)}
.kt-chip.m-broad{background:rgba(201,130,27,.14);color:var(--ac-amber)}
.kt-bid{font-size:10.5px;color:var(--mute);text-align:right;white-space:nowrap}
.kt-neg{margin-top:14px;border:1px solid var(--rule);border-left:4px solid #B5483C;border-radius:10px;padding:12px 14px;background:rgba(181,72,60,.05)}
.kt-neg-h{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ac-red);margin-bottom:6px}
.kt-neg-b{font-family:var(--body);font-size:13px;color:var(--ink-soft);line-height:1.55;margin:0}
.kt-neg-b code{font-family:var(--mono);background:var(--paper);border:1px solid var(--rule);border-radius:4px;padding:1px 6px;font-size:12px;color:var(--ink);margin:0 2px}
.kt-actions{display:flex;gap:9px;margin-top:14px;flex-wrap:wrap}
.kt-empty{font-family:var(--body);font-size:13px;color:var(--mute);padding:16px 2px}
@media(max-width:560px){.kt-row{grid-template-columns:1fr auto}.kt-bid{display:none}}

/* ============ v8.5 — Campaign + ad-group architecture builder ============ */
.ca-tree{margin:16px 0 4px;display:flex;flex-direction:column;gap:12px}
.ca-camp{border:1px solid var(--rule);border-radius:12px;overflow:hidden;background:var(--paper-pure)}
.ca-camphd{display:flex;align-items:center;gap:11px;padding:12px 15px;border-left:5px solid var(--mute);border-bottom:1px solid var(--rule)}
.ca-camp.m-exact .ca-camphd{border-left-color:var(--ac-green)}
.ca-camp.m-phrase .ca-camphd{border-left-color:var(--ac-blue)}
.ca-camp.m-broad .ca-camphd{border-left-color:var(--ac-amber)}
.ca-camp.m-brand .ca-camphd{border-left-color:var(--ac-violet)}
.ca-name{font-family:var(--mono);font-size:12.5px;font-weight:700;color:var(--ink);letter-spacing:-.01em;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ca-meta{margin-left:auto;display:flex;align-items:center;gap:10px;flex:none}
.ca-budget{font-family:var(--display);font-weight:800;font-size:15px;color:var(--ink)}
.ca-budgetl{font-family:var(--mono);font-size:8.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.ca-count{font-family:var(--mono);font-size:10px;color:var(--mute);white-space:nowrap}
.ca-body{padding:6px 15px 13px}
.ca-ag{margin-top:9px}
.ca-aghd{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--blue);display:flex;align-items:center;gap:7px;margin-bottom:6px}
.ca-aghd::before{content:"";width:6px;height:6px;border-radius:2px;background:var(--blue);flex:none}
.ca-kws{display:flex;flex-wrap:wrap;gap:6px;padding-left:13px}
.ca-kw{font-family:var(--mono);font-size:12px;padding:4px 9px;border-radius:6px;border:1px solid var(--rule);background:var(--paper);color:var(--ink);white-space:nowrap}
.ca-kw.m-exact{border-color:rgba(46,125,50,.4);color:var(--ac-green)}
.ca-kw.m-phrase{border-color:rgba(31,78,140,.4);color:var(--ac-blue)}
.ca-kw.m-broad{border-color:rgba(201,130,27,.45);color:var(--ac-amber)}
.ca-split{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin:14px 0 2px}
.ca-splitc{border:1px solid var(--rule);border-radius:10px;padding:10px 12px;background:var(--paper)}
.ca-splitn{font-family:var(--display);font-weight:800;font-size:20px}
.ca-splitl{font-family:var(--mono);font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);margin-top:3px}
.ca-bar{height:8px;border-radius:6px;background:var(--paper);border:1px solid var(--rule);overflow:hidden;display:flex;margin-top:10px}
.ca-bar i{display:block;height:100%}
.ca-bar .b-exact{background:#2E7D32}.ca-bar .b-phrase{background:#1F4E8C}.ca-bar .b-broad{background:#C9821B}.ca-bar .b-brand{background:#6D4AA8}

/* ============ v8.6 — High-CTR ad + cheap-CPC builder ============ */
.ad-sec-h{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);margin:14px 0 7px;display:flex;align-items:center;gap:8px}
.ad-sec-h span{margin-left:auto;font-weight:400;text-transform:none;letter-spacing:0}
.ad-list{display:flex;flex-direction:column;gap:7px}
.ad-row{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:9px}
.ad-in{font-family:var(--mono);font-size:13.5px;color:var(--ink);background:var(--paper);border:1px solid var(--rule);border-radius:8px;padding:9px 11px;width:100%;transition:border-color .15s,box-shadow .15s}
.ad-in:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(31,78,140,.12)}
.ad-in.over{border-color:var(--ac-red)}
.ad-ct{font-family:var(--mono);font-size:11px;color:var(--mute);min-width:42px;text-align:right;white-space:nowrap}
.ad-ct.over{color:var(--ac-red);font-weight:700}
.ad-rm{width:26px;height:26px;border-radius:7px;border:1px solid var(--rule);background:var(--paper);color:var(--mute);cursor:pointer;display:flex;align-items:center;justify-content:center;flex:none;transition:.15s}
.ad-rm:hover{border-color:var(--ac-red);color:var(--ac-red)}.ad-rm svg{width:13px;height:13px}
.ad-add{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--blue);background:transparent;border:1px dashed var(--rule);border-radius:8px;padding:8px;cursor:pointer;width:100%;margin-top:7px;transition:.15s}
.ad-add:hover{border-color:var(--blue);background:rgba(31,78,140,.05)}
.ad-add[disabled]{opacity:.4;cursor:not-allowed}
/* quality score gauge */
.qs-wrap{display:flex;align-items:center;gap:16px;border:1px solid var(--rule);border-radius:12px;padding:14px 16px;background:var(--paper);margin:18px 0 0}
.qs-dial{flex:none;text-align:center}
.qs-num{font-family:var(--display);font-weight:800;font-size:34px;line-height:1;letter-spacing:-.02em}
.qs-numl{font-family:var(--mono);font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);margin-top:3px}
.qs-mid{flex:1;min-width:0}
.qs-bar{height:10px;border-radius:6px;background:var(--rule-soft);overflow:hidden}
.qs-bar i{display:block;height:100%;border-radius:6px;transition:width .35s ease,background .35s}
.qs-cap{font-family:var(--body);font-size:12.5px;color:var(--ink-soft);margin-top:8px;line-height:1.45}
.cpc-pill{flex:none;text-align:center;border-left:1px solid var(--rule);padding-left:16px}
.cpc-pill .cpc-n{font-family:var(--display);font-weight:800;font-size:22px;line-height:1}
.cpc-pill .cpc-l{font-family:var(--mono);font-size:8.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--mute);margin-top:4px;max-width:96px}
.ad-checks{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:6px 16px;margin:14px 0 2px}
.ad-chk{display:flex;align-items:flex-start;gap:8px;font-family:var(--body);font-size:12.5px;line-height:1.4}
.ad-chk svg{width:15px;height:15px;flex:none;margin-top:2px}
.ad-chk.ok{color:var(--ink-soft)}.ad-chk.ok svg{stroke:var(--ac-green)}
.ad-chk.no{color:var(--ink-soft)}.ad-chk.no svg{stroke:var(--ac-red)}
.ad-tips{margin-top:14px;border:1px dashed var(--rule);border-radius:11px;padding:13px 15px;background:var(--paper)}
.ad-tips-h{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);margin-bottom:7px}
.ad-tips ul{margin:0;padding-left:18px}
.ad-tips li{font-family:var(--body);font-size:12.5px;color:var(--ink-soft);line-height:1.5;margin-bottom:4px}
@media(max-width:560px){.qs-wrap{flex-wrap:wrap}.cpc-pill{border-left:0;padding-left:0;border-top:1px solid var(--rule);padding-top:12px;width:100%;text-align:left;display:flex;gap:12px;align-items:center}.cpc-pill .cpc-l{max-width:none}}

/* ============ v8.7 — Conversion tracking + offline automation wizard ============ */
.cv-flow{display:flex;flex-wrap:wrap;align-items:stretch;gap:7px;margin:16px 0 6px}
.cv-node{flex:1 1 120px;min-width:120px;border:1px solid var(--rule);border-top:3px solid var(--blue);border-radius:10px;padding:10px 11px;background:var(--paper)}
.cv-node.n-data{border-top-color:var(--ac-green)}.cv-node.n-tool{border-top-color:var(--ac-amber)}.cv-node.n-goog{border-top-color:var(--ac-violet)}
.cv-nt{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.02em;color:var(--ink);margin-bottom:3px}
.cv-nd{font-family:var(--body);font-size:11.5px;color:var(--ink-soft);line-height:1.4}
.cv-arrow{align-self:center;font-family:var(--mono);font-size:16px;color:var(--blue);flex:none}
.cv-prog{display:flex;align-items:center;gap:13px;margin:18px 0 4px;border:1px solid var(--rule);border-radius:11px;padding:12px 15px;background:var(--paper)}
.cv-progn{font-family:var(--display);font-weight:800;font-size:22px;flex:none;color:var(--ink)}
.cv-progbar{flex:1;height:9px;border-radius:6px;background:var(--rule-soft);overflow:hidden}
.cv-progbar i{display:block;height:100%;background:#2E7D32;border-radius:6px;transition:width .3s ease}
.cv-progl{font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);flex:none}
.cv-steps{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.cv-step{display:flex;gap:12px;border:1px solid var(--rule);border-radius:11px;padding:12px 14px;background:var(--paper-pure);cursor:pointer;transition:border-color .15s,background .15s}
.cv-step:hover{border-color:var(--blue)}
.cv-step.done{background:rgba(46,125,50,.05);border-color:rgba(46,125,50,.4)}
.cv-box{width:24px;height:24px;border-radius:7px;border:2px solid var(--rule);flex:none;display:flex;align-items:center;justify-content:center;margin-top:1px;transition:.15s}
.cv-box svg{width:14px;height:14px;opacity:0;transition:opacity .15s;stroke:#fff}
.cv-step.done .cv-box{background:#2E7D32;border-color:var(--ac-green)}
.cv-step.done .cv-box svg{opacity:1}
.cv-sn{min-width:0}
.cv-snum{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blue)}
.cv-stitle{font-family:var(--display);font-weight:800;font-size:15px;letter-spacing:-.01em;color:var(--ink);margin:1px 0 3px;line-height:1.2}
.cv-sbody{font-family:var(--body);font-size:13px;color:var(--ink-soft);line-height:1.5;margin:0}
.cv-sbody code{font-family:var(--mono);font-size:12px;background:var(--paper);border:1px solid var(--rule);border-radius:4px;padding:1px 6px;color:var(--ink)}
.cv-tag{display:inline-block;font-family:var(--mono);font-size:8.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;padding:2px 7px;border-radius:20px;margin-left:7px;vertical-align:1px;background:rgba(201,130,27,.14);color:var(--ac-amber)}
.cv-done-banner{margin-top:14px;border:1px solid rgba(46,125,50,.4);border-left:5px solid #2E7D32;border-radius:11px;padding:14px 16px;background:rgba(46,125,50,.06);font-family:var(--body);font-size:13.5px;color:var(--ink);line-height:1.55;display:none}
.cv-done-banner.on{display:block}
.cv-done-banner b{color:var(--ac-green)}

/* ============ v8.8 — Competitive research tool ============ */
.cr-list{display:flex;flex-direction:column;gap:9px;margin-top:4px}
.cr-comp{border:1px solid var(--rule);border-radius:11px;padding:11px 13px;background:var(--paper)}
.cr-comptop{display:flex;align-items:center;gap:9px;margin-bottom:9px}
.cr-comptop .tin{flex:1}
.cr-rm{width:26px;height:26px;border-radius:7px;border:1px solid var(--rule);background:var(--paper-pure);color:var(--mute);cursor:pointer;display:flex;align-items:center;justify-content:center;flex:none}
.cr-rm:hover{border-color:var(--ac-red);color:var(--ac-red)}.cr-rm svg{width:13px;height:13px}
.cr-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:9px}
.cr-fields .tfield>label{font-size:9.5px}
.cr-tr{display:grid;grid-template-columns:1.1fr auto auto 2fr;gap:12px;align-items:center;padding:11px 13px;border-top:1px dashed var(--rule-soft)}
.cr-tr:first-child{border-top:0}
.cr-tname{font-family:var(--mono);font-size:13px;font-weight:700;color:var(--ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cr-tmetric{font-family:var(--mono);font-size:11px;color:var(--mute);text-align:right;white-space:nowrap}
.cr-badge{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:3px 9px;border-radius:20px;color:#fff;white-space:nowrap;text-align:center}
.cr-badge.hi{background:#B5483C}.cr-badge.med{background:#C9821B}.cr-badge.lo{background:var(--mute)}
.cr-move{font-family:var(--body);font-size:12.5px;color:var(--ink-soft);line-height:1.45}
.cr-diff{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-top:14px}
.cr-diffc{border:1px solid var(--rule);border-top:3px solid var(--mute);border-radius:11px;padding:12px 14px;background:var(--paper)}
.cr-diffc.d-sat{border-top-color:var(--ac-amber)}.cr-diffc.d-white{border-top-color:var(--ac-green)}.cr-diffc.d-gap{border-top-color:var(--ac-blue)}
.cr-diffh{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;margin-bottom:4px}
.cr-diffc.d-sat .cr-diffh{color:var(--ac-amber)}.cr-diffc.d-white .cr-diffh{color:var(--ac-green)}.cr-diffc.d-gap .cr-diffh{color:var(--ac-blue)}
.cr-diffd{font-family:var(--body);font-size:11.5px;color:var(--mute);line-height:1.4;margin-bottom:8px}
.cr-chips{display:flex;flex-wrap:wrap;gap:5px}
.cr-chip{font-family:var(--mono);font-size:12px;padding:3px 9px;border-radius:6px;border:1px solid var(--rule);background:var(--paper-pure);color:var(--ink)}
.cr-chip.empty{color:var(--mute);border-style:dashed;font-style:normal}
@media(max-width:580px){.cr-tr{grid-template-columns:1fr auto;row-gap:6px}.cr-tr .cr-move{grid-column:1/-1}}

/* ============ v8.9 — Smart Bidding strategy selector ============ */
.bs-rec{border:1px solid var(--rule);border-left:5px solid #2E7D32;border-radius:12px;padding:16px 18px;background:rgba(46,125,50,.05);margin:18px 0 0}
.bs-rl{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ac-green)}
.bs-name{display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin:4px 0 7px}
.bs-name b{font-family:var(--display);font-weight:800;font-size:22px;letter-spacing:-.01em;color:var(--ink)}
.bs-badge{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:3px 9px;border-radius:20px;background:#2E7D32;color:#fff}
.bs-why{font-family:var(--body);font-size:14px;color:var(--ink);line-height:1.55;margin:0}
.bs-why b{font-weight:700}
.bs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:13px 0 0}
.bs-note{border:1px solid var(--rule);border-radius:9px;padding:9px 11px;background:var(--paper)}
.bs-note-l{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--mute);margin-bottom:3px}
.bs-note-v{font-family:var(--body);font-size:12.5px;color:var(--ink);line-height:1.4}
.bs-caution{margin-top:11px;border-left:4px solid #C9821B;border-radius:8px;background:rgba(201,130,27,.07);padding:9px 12px;font-family:var(--body);font-size:12.5px;color:var(--ink-soft);line-height:1.5}
.bs-caution b{color:var(--ac-amber);font-weight:700}
.bs-runner{margin-top:11px;font-family:var(--mono);font-size:11px;color:var(--mute)}
.bs-runner b{color:var(--ink);font-weight:600}

/* ============ v9.0 — Smart Bidding bespoke infographics ============ */
.ig-sig{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:6px}
.ig-sig-list{flex:1;min-width:240px;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ig-sig-row{display:flex;align-items:flex-start;gap:9px;min-width:0;border:1px solid var(--rule);border-radius:9px;padding:9px 11px;background:var(--paper);opacity:0;transform:translateY(7px);transition:opacity .45s ease,transform .45s ease}
.ig.in .ig-sig-row{opacity:1;transform:none}
.ig.in .ig-sig-row:nth-child(1){transition-delay:.04s}.ig.in .ig-sig-row:nth-child(2){transition-delay:.10s}.ig.in .ig-sig-row:nth-child(3){transition-delay:.16s}.ig.in .ig-sig-row:nth-child(4){transition-delay:.22s}.ig.in .ig-sig-row:nth-child(5){transition-delay:.28s}.ig.in .ig-sig-row:nth-child(6){transition-delay:.34s}.ig.in .ig-sig-row:nth-child(7){transition-delay:.40s}.ig.in .ig-sig-row:nth-child(8){transition-delay:.46s}
.ig-sig-ic{width:30px;height:30px;border-radius:8px;background:rgba(31,78,140,.09);color:var(--blue);display:flex;align-items:center;justify-content:center;flex:none}
.ig-sig-ic svg{width:16px;height:16px}
.ig-sig-nm{display:block;font-family:var(--mono);font-size:12px;font-weight:700;color:var(--ink);line-height:1.2}
.ig-sig-ex{display:block;font-family:var(--body);font-size:11px;color:var(--mute);line-height:1.3;margin-top:2px}
.ig-sig-arrow{font-family:var(--mono);font-size:24px;color:var(--blue);flex:none}
.ig-sig-bid{flex:none;border:1px solid #2E7D32;border-radius:12px;padding:15px 20px;background:rgba(46,125,50,.06);text-align:center;opacity:0;transform:scale(.94);transition:opacity .5s ease .5s,transform .5s ease .5s}
.ig.in .ig-sig-bid{opacity:1;transform:none}
.ig-sig-bidn{font-family:var(--display);font-weight:800;font-size:30px;color:var(--ac-green);line-height:1;letter-spacing:-.02em}
.ig-sig-bidl{font-family:var(--mono);font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);margin-top:6px}
@media(max-width:560px){.ig-sig-list{grid-template-columns:1fr}.ig-sig-arrow{transform:rotate(90deg);align-self:center}}
/* learning phase timeline */
.ig-lp-track{display:flex;border:1px solid var(--rule);border-radius:11px;overflow:hidden;margin:8px 0 0}
.ig-lp-seg{padding:12px 14px;flex:1;border-right:1px solid var(--rule);position:relative}
.ig-lp-seg:last-child{border-right:0}
.ig-lp-day{font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.ig-lp-ttl{font-family:var(--mono);font-weight:700;font-size:12.5px;color:var(--ink);margin-top:3px}
.ig-lp-d{font-family:var(--body);font-size:11.5px;color:var(--ink-soft);line-height:1.4;margin-top:4px}
.ig-lp-seg.warn{background:rgba(201,130,27,.08)}.ig-lp-seg.warn .ig-lp-ttl{color:var(--ac-amber)}
.ig-lp-seg.ok{background:rgba(46,125,50,.07)}.ig-lp-seg.ok .ig-lp-ttl{color:var(--ac-green)}
.ig-lp-bar{height:5px;background:var(--rule-soft);border-radius:4px;margin-top:10px;overflow:hidden}
.ig-lp-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#C9821B,#2E7D32);border-radius:4px;transition:width 1.3s ease .2s}
.ig.in .ig-lp-bar i{width:100%}
.ig-lp-zone{margin-top:11px;border-left:4px solid #C9821B;background:rgba(201,130,27,.07);border-radius:8px;padding:10px 13px;font-family:var(--body);font-size:12.5px;color:var(--ink-soft);line-height:1.5}
.ig-lp-zone b{color:var(--ac-amber);font-weight:700}
@media(max-width:560px){.ig-lp-track{flex-direction:column}.ig-lp-seg{border-right:0;border-bottom:1px solid var(--rule)}.ig-lp-seg:last-child{border-bottom:0}}

/* ============ v9.1 — Performance Max tool + infographics ============ */
.pm-guards{margin:13px 0 0;display:flex;flex-direction:column;gap:7px}
.pm-guard{display:flex;gap:9px;align-items:flex-start;border:1px solid var(--rule);border-radius:9px;padding:9px 12px;background:var(--paper)}
.pm-guard svg{width:16px;height:16px;flex:none;margin-top:1px;stroke:var(--ac-blue)}
.pm-guard span{font-family:var(--body);font-size:12.5px;color:var(--ink-soft);line-height:1.45}
.pm-guard b{color:var(--ink);font-weight:700}
.pm-struct{margin-top:12px;border:1px dashed var(--rule);border-radius:10px;padding:12px 14px;background:var(--paper)}
.pm-struct-h{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);margin-bottom:5px}
.pm-struct p{font-family:var(--body);font-size:12.5px;color:var(--ink-soft);line-height:1.5;margin:0}
/* channel fan-out */
.ig-fan{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:6px}
.ig-fan-hub{flex:none;border:1px solid #6D4AA8;background:rgba(109,74,168,.07);border-radius:12px;padding:14px 18px;text-align:center}
.ig-fan-hub b{font-family:var(--display);font-weight:800;font-size:15px;color:var(--ac-violet);display:block;line-height:1.1}
.ig-fan-hub span{font-family:var(--mono);font-size:9px;letter-spacing:.07em;text-transform:uppercase;color:var(--mute)}
.ig-fan-arrow{font-family:var(--mono);font-size:22px;color:var(--ac-violet);flex:none}
.ig-fan-grid{flex:1;min-width:220px;display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:8px}
.ig-fan-ch{border:1px solid var(--rule);border-radius:9px;padding:9px 10px;background:var(--paper);text-align:center;opacity:0;transform:translateY(6px);transition:opacity .4s ease,transform .4s ease}
.ig.in .ig-fan-ch{opacity:1;transform:none}
.ig.in .ig-fan-ch:nth-child(1){transition-delay:.05s}.ig.in .ig-fan-ch:nth-child(2){transition-delay:.11s}.ig.in .ig-fan-ch:nth-child(3){transition-delay:.17s}.ig.in .ig-fan-ch:nth-child(4){transition-delay:.23s}.ig.in .ig-fan-ch:nth-child(5){transition-delay:.29s}.ig.in .ig-fan-ch:nth-child(6){transition-delay:.35s}.ig.in .ig-fan-ch:nth-child(7){transition-delay:.41s}
.ig-fan-ch b{font-family:var(--mono);font-size:11.5px;font-weight:700;color:var(--ink);display:block}
.ig-fan-ch span{font-family:var(--body);font-size:10px;color:var(--mute)}
@media(max-width:560px){.ig-fan-arrow{transform:rotate(90deg)}}
/* asset group anatomy */
.ig-ag{border:1px solid var(--rule);border-radius:12px;overflow:hidden;margin-top:6px}
.ig-ag-hd{display:flex;align-items:center;gap:9px;padding:11px 14px;background:rgba(109,74,168,.06);border-bottom:1px solid var(--rule);font-family:var(--mono);font-size:12px;font-weight:700;color:var(--ac-violet)}
.ig-ag-body{padding:12px 14px;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:9px}
.ig-ag-slot{border:1px solid var(--rule);border-radius:9px;padding:9px 11px;background:var(--paper)}
.ig-ag-slot.sig{border-color:rgba(46,125,50,.4);background:rgba(46,125,50,.05)}
.ig-ag-sl{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--mute);display:flex;justify-content:space-between}
.ig-ag-slot.sig .ig-ag-sl{color:var(--ac-green)}
.ig-ag-sv{font-family:var(--body);font-size:11.5px;color:var(--ink-soft);line-height:1.35;margin-top:3px}

/* ============ v9.2 — Ad copy (Module 5) bespoke infographics ============ */
.ig-rsa{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:6px}
.ig-rsa-pool{flex:none;display:flex;flex-direction:column;gap:7px;min-width:150px}
.ig-rsa-chip{border:1px solid var(--rule);border-radius:9px;padding:9px 12px;background:var(--paper);font-family:var(--mono);font-size:12px;color:var(--ink)}
.ig-rsa-chip b{font-family:var(--display);font-weight:800;font-size:17px;color:var(--blue);margin-right:6px}
.ig-rsa-arrow{font-family:var(--mono);font-size:22px;color:var(--blue);flex:none}
.ig-rsa-ad{flex:1;min-width:240px;border:1px solid #dadce0;border-radius:11px;padding:14px 16px;background:#ffffff;box-shadow:0 2px 10px rgba(10,11,13,.05)} /*fixed: SERP screenshot*/
.ig-rsa-ad-tag{font-family:var(--mono);font-size:11px;font-weight:700;color:#202124;display:inline-flex;align-items:center;gap:6px} /*fixed*/
.ig-rsa-ad-tag::before{content:"Ad";border:1px solid #202124;border-radius:3px;padding:0 4px;font-size:9px}
.ig-rsa-ad-url{font-family:var(--body);font-size:12px;color:#5f6368;margin:2px 0 6px} /*fixed*/
.ig-rsa-ad-ttl{font-family:var(--body);font-size:18px;line-height:1.25;color:#1a0dab;font-weight:500} /*fixed: SERP link*/
.ig-rsa-ad-ttl b{font-weight:500;background:linear-gradient(transparent 70%,rgba(31,140,90,.22) 0)}
.ig-rsa-ad-desc{font-family:var(--body);font-size:12.5px;color:#4d5156;line-height:1.5;margin-top:6px} /*fixed*/
.ig-rsa-note{font-family:var(--mono);font-size:10px;letter-spacing:.04em;color:var(--mute);text-align:center;margin-top:10px}
/* headline categories grid */
.ig-hc{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:9px;margin-top:6px}
.ig-hc-cell{border:1px solid var(--rule);border-left:3px solid var(--blue);border-radius:9px;padding:10px 12px;background:var(--paper);opacity:0;transform:translateY(6px);transition:opacity .4s ease,transform .4s ease}
.ig.in .ig-hc-cell{opacity:1;transform:none}
.ig.in .ig-hc-cell:nth-child(1){transition-delay:.04s}.ig.in .ig-hc-cell:nth-child(2){transition-delay:.09s}.ig.in .ig-hc-cell:nth-child(3){transition-delay:.14s}.ig.in .ig-hc-cell:nth-child(4){transition-delay:.19s}.ig.in .ig-hc-cell:nth-child(5){transition-delay:.24s}.ig.in .ig-hc-cell:nth-child(6){transition-delay:.29s}.ig.in .ig-hc-cell:nth-child(7){transition-delay:.34s}.ig.in .ig-hc-cell:nth-child(8){transition-delay:.39s}
.ig-hc-cat{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--blue)}
.ig-hc-ex{font-family:var(--body);font-size:13px;color:var(--ink);line-height:1.35;margin-top:4px}
.ig-hc-cell:nth-child(3n+2){border-left-color:var(--ac-green)}.ig-hc-cell:nth-child(3n+2) .ig-hc-cat{color:var(--ac-green)}
.ig-hc-cell:nth-child(3n+3){border-left-color:var(--ac-amber)}.ig-hc-cell:nth-child(3n+3) .ig-hc-cat{color:var(--ac-amber)}

/* ============ v9.3 — Conversion tracking (Module 6) bespoke infographics ============ */
.ig-ms{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.ig-ms-layer{border:1px solid var(--rule);border-radius:10px;padding:11px 14px;background:var(--paper);display:flex;align-items:flex-start;gap:12px;opacity:0;transform:translateX(-9px);transition:opacity .45s ease,transform .45s ease}
.ig.in .ig-ms-layer{opacity:1;transform:none}
.ig.in .ig-ms-layer:nth-child(1){transition-delay:.30s}.ig.in .ig-ms-layer:nth-child(2){transition-delay:.25s}.ig.in .ig-ms-layer:nth-child(3){transition-delay:.20s}.ig.in .ig-ms-layer:nth-child(4){transition-delay:.15s}.ig.in .ig-ms-layer:nth-child(5){transition-delay:.10s}.ig.in .ig-ms-layer:nth-child(6){transition-delay:.05s}
.ig-ms-n{flex:none;width:26px;height:26px;border-radius:7px;background:rgba(31,78,140,.1);color:var(--blue);font-family:var(--mono);font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center}
.ig-ms-layer.top{border-color:rgba(46,125,50,.4);background:rgba(46,125,50,.05)}
.ig-ms-layer.top .ig-ms-n{background:#2E7D32;color:#fff}
.ig-ms-t{font-family:var(--mono);font-size:12.5px;font-weight:700;color:var(--ink)}
.ig-ms-d{font-family:var(--body);font-size:12px;color:var(--ink-soft);line-height:1.4;margin-top:2px}
.ig-ms-foot{font-family:var(--mono);font-size:10px;letter-spacing:.04em;color:var(--mute);text-align:center;margin-top:9px}
/* attribution compare */
.ig-attr-legend{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 12px}
.ig-attr-tp{font-family:var(--mono);font-size:11px;color:var(--ink);border:1px solid var(--rule);border-radius:20px;padding:4px 11px;background:var(--paper)}
.ig-attr-row{margin-bottom:13px}
.ig-attr-lab{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--mute);margin-bottom:5px;display:flex;justify-content:space-between}
.ig-attr-lab b{color:var(--ink)}
.ig-attr-bar{display:flex;height:34px;border-radius:8px;overflow:hidden;border:1px solid var(--rule)}
.ig-attr-seg{display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:11px;font-weight:700;color:#fff;min-width:0;white-space:nowrap;transition:flex-grow .8s ease}
.ig-attr-seg.s0{background:#8896a8}.ig-attr-seg.s1{background:#5b7da8}.ig-attr-seg.s2{background:#1F4E8C}.ig-attr-seg.s3{background:#2E7D32}
.ig-attr-seg.empty{color:transparent}
.ig-attr-note{font-family:var(--body);font-size:12.5px;color:var(--ink-soft);line-height:1.5;margin-top:4px}
.ig-attr-note b{color:var(--ink);font-weight:700}

/* ============ v9.4 — Operating cadence (Module 7) tool + infographics ============ */
.oc-total{margin:16px 0 4px;border:1px solid var(--rule);border-left:5px solid var(--blue);border-radius:11px;padding:13px 16px;background:rgba(31,78,140,.05);display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.oc-total b{font-family:var(--display);font-weight:800;font-size:22px;color:var(--blue)}
.oc-total span{font-family:var(--body);font-size:13px;color:var(--ink-soft);line-height:1.4}
.oc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:14px 0 2px}@media(max-width:560px){.oc-grid{grid-template-columns:1fr}}
.oc-card{border:1px solid var(--rule);border-top:3px solid var(--mute);border-radius:11px;overflow:hidden;background:var(--paper-pure)}
.oc-card.f-d{border-top-color:var(--ac-blue)}.oc-card.f-w{border-top-color:var(--ac-teal)}.oc-card.f-m{border-top-color:var(--ac-amber)}.oc-card.f-q{border-top-color:var(--ac-violet)}
.oc-card-hd{display:flex;justify-content:space-between;align-items:center;padding:11px 14px;border-bottom:1px solid var(--rule)}
.oc-card-f{font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink)}
.oc-card.f-d .oc-card-f{color:var(--ac-blue)}.oc-card.f-w .oc-card-f{color:var(--ac-teal)}.oc-card.f-m .oc-card-f{color:var(--ac-amber)}.oc-card.f-q .oc-card-f{color:var(--ac-violet)}
.oc-time{font-family:var(--mono);font-size:9.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--mute);background:var(--paper);border:1px solid var(--rule);border-radius:20px;padding:3px 8px;white-space:nowrap}
.oc-tasks{padding:11px 14px;display:flex;flex-direction:column;gap:7px}
.oc-task{display:flex;gap:9px;align-items:flex-start;font-family:var(--body);font-size:12.5px;color:var(--ink-soft);line-height:1.4}
.oc-task::before{content:"";width:6px;height:6px;border-radius:2px;background:var(--rule);flex:none;margin-top:5px}
.oc-card.f-d .oc-task::before{background:#1F4E8C}.oc-card.f-w .oc-task::before{background:#0E7C86}.oc-card.f-m .oc-task::before{background:#C9821B}.oc-card.f-q .oc-task::before{background:#6D4AA8}
.oc-task b{color:var(--ink);font-weight:600}
/* cadence calendar infographic */
.ig-cal{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-top:6px}
.ig-cal-col{border:1px solid var(--rule);border-radius:10px;overflow:hidden;opacity:0;transform:translateY(7px);transition:opacity .45s ease,transform .45s ease}
.ig.in .ig-cal-col{opacity:1;transform:none}
.ig.in .ig-cal-col:nth-child(1){transition-delay:.05s}.ig.in .ig-cal-col:nth-child(2){transition-delay:.13s}.ig.in .ig-cal-col:nth-child(3){transition-delay:.21s}.ig.in .ig-cal-col:nth-child(4){transition-delay:.29s}
.ig-cal-hd{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:9px 12px;color:#fff}
.ig-cal-col:nth-child(1) .ig-cal-hd{background:#1F4E8C}.ig-cal-col:nth-child(2) .ig-cal-hd{background:#0E7C86}.ig-cal-col:nth-child(3) .ig-cal-hd{background:#C9821B}.ig-cal-col:nth-child(4) .ig-cal-hd{background:#6D4AA8}
.ig-cal-body{padding:10px 12px;display:flex;flex-direction:column;gap:6px}
.ig-cal-t{font-family:var(--body);font-size:12px;color:var(--ink-soft);line-height:1.35;padding-left:12px;position:relative}
.ig-cal-t::before{content:"›";position:absolute;left:0;color:var(--mute);font-family:var(--mono)}
/* optimization loop infographic */
.ig-loop{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:6px;justify-content:center}
.ig-loop-step{border:1px solid var(--rule);border-radius:11px;padding:11px 13px;background:var(--paper);text-align:center;min-width:96px;opacity:0;transform:scale(.92);transition:opacity .4s ease,transform .4s ease}
.ig.in .ig-loop-step{opacity:1;transform:none}
.ig.in .ig-loop-step:nth-child(1){transition-delay:.05s}.ig.in .ig-loop-step:nth-child(3){transition-delay:.15s}.ig.in .ig-loop-step:nth-child(5){transition-delay:.25s}.ig.in .ig-loop-step:nth-child(7){transition-delay:.35s}.ig.in .ig-loop-step:nth-child(9){transition-delay:.45s}
.ig-loop-n{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.08em;color:var(--blue)}
.ig-loop-t{font-family:var(--mono);font-size:12.5px;font-weight:700;color:var(--ink);margin-top:3px}
.ig-loop-arrow{font-family:var(--mono);font-size:18px;color:var(--blue);flex:none}
@media(max-width:560px){.ig-loop-arrow{transform:rotate(90deg)}}

/* ============ v9.5 — Case-study teaser card ============ */
.cs-teaser{display:flex;align-items:stretch;border:1px solid var(--rule);border-radius:13px;overflow:hidden;background:var(--paper-pure);margin:22px 0;text-decoration:none;transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease}
.cs-teaser:hover{border-color:var(--blue);box-shadow:0 8px 22px rgba(10,11,13,.08);transform:translateY(-2px);text-decoration:none}
.cs-teaser-stat{flex:none;width:132px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px 12px;border-right:1px solid var(--rule);background:rgba(31,78,140,.05)}
.cs-teaser-stat b{font-family:var(--display);font-weight:800;font-size:30px;color:var(--blue);line-height:1;letter-spacing:-.02em;text-align:center}
.cs-teaser-stat span{font-family:var(--mono);font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);margin-top:7px;text-align:center;line-height:1.3}
.cs-teaser-main{flex:1;min-width:0;padding:15px 17px;align-self:center}
.cs-teaser-eyebrow{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blue)}
.cs-teaser-title{font-family:var(--display);font-weight:800;font-size:16.5px;color:var(--ink);letter-spacing:-.01em;line-height:1.25;margin:5px 0}
.cs-teaser-body{font-family:var(--body);font-size:13px;color:var(--ink-soft);line-height:1.5;margin:0}
.cs-teaser-go{align-self:center;padding:0 16px;font-family:var(--display);font-size:20px;color:var(--blue);flex:none;opacity:.4;transition:opacity .15s ease,transform .15s ease}
.cs-teaser:hover .cs-teaser-go{opacity:1;transform:translateX(3px)}
@media(max-width:560px){.cs-teaser{flex-wrap:wrap}.cs-teaser-stat{width:100%;flex-direction:row;gap:12px;border-right:0;border-bottom:1px solid var(--rule);justify-content:flex-start}.cs-teaser-stat span{margin-top:0}.cs-teaser-go{display:none}}

/* ============ v9.6 — Thought-leader quote (linked to glossary) ============ */
.tl-quote{position:relative;border:1px solid var(--rule);border-left:4px solid var(--blue);border-radius:11px;padding:15px 18px 13px 48px;margin:22px 0;background:var(--paper)}
.tl-quote::before{content:"\201C";position:absolute;top:8px;left:15px;font-family:var(--display);font-weight:800;font-size:42px;color:rgba(31,78,140,.18);line-height:1}
.tl-quote p{font-family:var(--body);font-size:16px;color:var(--ink);line-height:1.56;margin:0 0 9px}
.tl-quote cite{font-style:normal;font-family:var(--mono);font-size:11.5px;color:var(--mute);display:block;line-height:1.4}
.tl-quote cite b{color:var(--ink);font-weight:700}
.tl-quote cite em{font-style:italic;color:var(--ink-soft)}
.tl-quote cite a{color:var(--blue);text-decoration:none;font-weight:600}
.tl-quote cite a:hover{text-decoration:underline}

/* ============ v9.7 — deep-enrichment components (theme-aware) ============ */
/* benchmark stat strip */
.statstrip{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:18px 0}
.statcard{border:1px solid var(--rule);border-top:3px solid var(--ac-blue);border-radius:11px;padding:13px 15px;background:var(--paper)}
.statcard.g{border-top-color:var(--ac-green)}.statcard.a{border-top-color:var(--ac-amber)}.statcard.v{border-top-color:var(--ac-violet)}
.statcard-n{font-family:var(--display);font-weight:800;font-size:clamp(25px,4vw,33px);letter-spacing:-.02em;line-height:1;color:var(--ac-blue)}
.statcard.g .statcard-n{color:var(--ac-green)}.statcard.a .statcard-n{color:var(--ac-amber)}.statcard.v .statcard-n{color:var(--ac-violet)}
.statcard-l{font-family:var(--body);font-size:12.5px;color:var(--ink);line-height:1.4;margin-top:6px}
.statcard-s{font-family:var(--mono);font-size:9px;letter-spacing:.03em;text-transform:uppercase;color:var(--mute);margin-top:7px}
.statcard-s a{color:var(--mute)}
/* server vs client compare */
.svc{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:6px}
.svc-col{border:1px solid var(--rule);border-radius:12px;overflow:hidden;background:var(--paper)}
.svc-col.rec{border-color:var(--ac-green)}
.svc-hd{padding:12px 14px;border-bottom:1px solid var(--rule);font-family:var(--mono);font-weight:700;font-size:13px;color:var(--ink);display:flex;justify-content:space-between;align-items:center;gap:8px}
.svc-col.rec .svc-hd{background:rgba(46,125,50,.06);color:var(--ac-green)}
.svc-tag{font-family:var(--mono);font-size:8.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:2px 7px;border-radius:20px;background:var(--ac-green);color:#fff;white-space:nowrap}
.svc-row{padding:9px 14px;border-top:1px dashed var(--rule-soft);font-family:var(--body);font-size:12.5px;color:var(--ink-soft);line-height:1.4;display:flex;gap:8px}
.svc-row:first-child{border-top:0}
.svc-row svg{width:15px;height:15px;flex:none;margin-top:1px}
.svc-row.pro svg{stroke:var(--ac-green)}.svc-row.con svg{stroke:var(--ac-red)}
@media(max-width:560px){.svc{grid-template-columns:1fr}}
/* ranked signal list (PMax audience signals) */
.ig-sr{display:flex;flex-direction:column;gap:7px;margin-top:6px}
.ig-sr-row{display:flex;align-items:center;gap:12px;border:1px solid var(--rule);border-radius:10px;padding:10px 13px;background:var(--paper);opacity:0;transform:translateX(-7px);transition:opacity .4s ease,transform .4s ease}
.ig.in .ig-sr-row{opacity:1;transform:none}
.ig.in .ig-sr-row:nth-child(1){transition-delay:.05s}.ig.in .ig-sr-row:nth-child(2){transition-delay:.12s}.ig.in .ig-sr-row:nth-child(3){transition-delay:.19s}.ig.in .ig-sr-row:nth-child(4){transition-delay:.26s}.ig.in .ig-sr-row:nth-child(5){transition-delay:.33s}
.ig-sr-rank{font-family:var(--mono);font-weight:800;font-size:13px;width:26px;height:26px;border-radius:7px;display:flex;align-items:center;justify-content:center;flex:none;color:#fff}
.ig-sr-row:nth-child(1) .ig-sr-rank{background:var(--ac-green)}.ig-sr-row:nth-child(2) .ig-sr-rank{background:var(--ac-blue)}.ig-sr-row:nth-child(3) .ig-sr-rank{background:var(--ac-amber)}.ig-sr-row:nth-child(4) .ig-sr-rank{background:var(--ac-violet)}.ig-sr-row:nth-child(5) .ig-sr-rank{background:var(--mute)}
.ig-sr-main{min-width:0;flex:1}
.ig-sr-t{font-family:var(--mono);font-size:12.5px;font-weight:700;color:var(--ink)}
.ig-sr-d{font-family:var(--body);font-size:11.5px;color:var(--ink-soft);line-height:1.35;margin-top:1px}
.ig-sr-bar{flex:none;width:64px;height:6px;border-radius:4px;background:var(--rule-soft);overflow:hidden}
.ig-sr-bar i{display:block;height:100%;border-radius:4px;background:var(--ac-green)}
/* recommended tools/tech */
.toolrec{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin:14px 0}
.toolrec-c{border:1px solid var(--rule);border-left:3px solid var(--ac-blue);border-radius:10px;padding:11px 13px;background:var(--paper)}
.toolrec-cat{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ac-blue);margin-bottom:4px}
.toolrec-n{font-family:var(--mono);font-weight:700;font-size:13px;color:var(--ink)}
.toolrec-d{font-family:var(--body);font-size:12px;color:var(--ink-soft);line-height:1.4;margin-top:2px}
/* step-by-step howto */
.howto{counter-reset:ht;display:flex;flex-direction:column;gap:9px;margin:14px 0}
.howto-step{display:flex;gap:13px;border:1px solid var(--rule);border-radius:11px;padding:12px 14px;background:var(--paper)}
.howto-step::before{counter-increment:ht;content:counter(ht);font-family:var(--display);font-weight:800;font-size:15px;color:#fff;background:var(--ac-blue);width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex:none}
.howto-t{font-family:var(--mono);font-weight:700;font-size:13.5px;color:var(--ink);margin-bottom:2px}
.howto-d{font-family:var(--body);font-size:13px;color:var(--ink-soft);line-height:1.5;margin:0}
.howto-d code{font-family:var(--mono);font-size:12px;background:var(--paper-pure);border:1px solid var(--rule);border-radius:4px;padding:1px 5px}

/* ============ v9.8 — PMax interactive structure explorer + industry benchmarks teaser ============ */
.pmx{margin-top:6px;position:relative}
.pmx input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.pmx-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.pmx-tab{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:7px 13px;border:1px solid var(--rule);border-radius:20px;cursor:pointer;color:var(--mute);background:var(--paper);transition:.15s;user-select:none}
.pmx-tab:hover{border-color:var(--ac-blue);color:var(--ink)}
#pmx1:checked~.pmx-tabs .l-acct,#pmx2:checked~.pmx-tabs .l-camp,#pmx3:checked~.pmx-tabs .l-ag,#pmx4:checked~.pmx-tabs .l-asset{color:#fff}
#pmx1:checked~.pmx-tabs .l-acct{background:var(--ac-blue);border-color:var(--ac-blue)}
#pmx2:checked~.pmx-tabs .l-camp{background:var(--ac-violet);border-color:var(--ac-violet)}
#pmx3:checked~.pmx-tabs .l-ag{background:var(--ac-green);border-color:var(--ac-green)}
#pmx4:checked~.pmx-tabs .l-asset{background:var(--ac-amber);border-color:var(--ac-amber)}
.pmx-stage{border:1px solid var(--rule);border-radius:12px;padding:14px;background:var(--paper)}
.lvl{border:2px solid var(--rule);border-radius:10px;padding:11px 13px;transition:box-shadow .2s ease,transform .2s ease}
.lvl-acct{border-color:var(--ac-blue)}.lvl-camp{border-color:var(--ac-violet);margin-top:11px}.lvl-ag{border-color:var(--ac-green)}
.lvl-label{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:7px}
.lvl-acct>.lvl-label{color:var(--ac-blue)}.lvl-camp>.lvl-label{color:var(--ac-violet)}.lvl-ag .lvl-label{color:var(--ac-green)}
.lvl-chips{display:flex;flex-wrap:wrap;gap:6px}
.lvl-chip{font-family:var(--mono);font-size:11px;border:1px solid var(--rule);border-radius:6px;padding:3px 8px;background:var(--paper-pure);color:var(--ink);white-space:nowrap}
.lvl-chip.amber{border-color:rgba(201,130,27,.5);color:var(--ac-amber)}
.ag-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:9px}.ag-row .lvl-ag{flex:1;min-width:155px}
#pmx1:checked~.pmx-stage .lvl-acct,#pmx2:checked~.pmx-stage .lvl-camp,#pmx3:checked~.pmx-stage .lvl-ag,#pmx4:checked~.pmx-stage .lvl-chip.amber{box-shadow:0 0 0 3px rgba(31,78,140,.16);transform:translateY(-1px)}
.pmx-detail{display:none;margin-top:12px;border-radius:11px;padding:14px 16px;border:1px solid var(--rule);border-left:4px solid var(--ac-blue);background:var(--paper)}
#pmx1:checked~.pmx-detail.d1,#pmx2:checked~.pmx-detail.d2,#pmx3:checked~.pmx-detail.d3,#pmx4:checked~.pmx-detail.d4{display:block}
.pmx-detail.d2{border-left-color:var(--ac-violet)}.pmx-detail.d3{border-left-color:var(--ac-green)}.pmx-detail.d4{border-left-color:var(--ac-amber)}
.pmx-detail h5{font-family:var(--display);font-weight:800;font-size:15px;margin:0 0 5px;color:var(--ink)}
.pmx-detail p{font-family:var(--body);font-size:13px;color:var(--ink-soft);line-height:1.5;margin:0 0 7px}
.pmx-detail .bp{font-family:var(--mono);font-size:11px;color:var(--ac-green);font-weight:700;display:block}
.pmx-hint{font-family:var(--mono);font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:var(--mute);margin:9px 0 0;text-align:center}
/* industry benchmarks teaser */
.indbench{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:16px 0}
.indbench-c{border:1px solid var(--rule);border-top:3px solid var(--ac-blue);border-radius:12px;padding:14px 16px;background:var(--paper);text-decoration:none;display:block;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}
.indbench-c:hover{border-color:var(--ac-blue);transform:translateY(-2px);box-shadow:0 8px 20px rgba(10,11,13,.07);text-decoration:none}
.indbench-c.i2{border-top-color:var(--ac-violet)}.indbench-c.i3{border-top-color:var(--ac-amber)}
.indbench-name{font-family:var(--display);font-weight:800;font-size:15px;color:var(--ink);margin-bottom:10px}
.indbench-rows{display:flex;flex-direction:column;gap:5px}
.indbench-row{display:flex;justify-content:space-between;font-family:var(--mono);font-size:12px}
.indbench-row span:first-child{color:var(--mute)}.indbench-row span:last-child{color:var(--ink);font-weight:700}
.indbench-go{font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--ac-blue);margin-top:11px;display:inline-block}
.indbench-c.i2 .indbench-go{color:var(--ac-violet)}.indbench-c.i3 .indbench-go{color:var(--ac-amber)}

/* ============ v9.9 — "What's inside" anchored TOC (replaces plain "What you will learn") ============ */
.tlearn{border:1px solid var(--rule);border-radius:12px;overflow:hidden;margin:18px 0 24px;background:var(--paper)}
.tlearn-head{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--rule);font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ac-green);cursor:pointer;list-style:none;user-select:none}
.tlearn-head::-webkit-details-marker{display:none}
.tlearn-head .tlearn-meta{color:var(--mute);letter-spacing:.06em;font-weight:500;display:flex;align-items:center;gap:10px}
.tlearn-head .tlearn-tog{font-size:14px;transition:transform .2s}
.tlearn[open] .tlearn-head .tlearn-tog{transform:rotate(180deg)}
.tlearn-grid{display:grid;grid-template-columns:1fr 1fr}
@media(max-width:560px){.tlearn-grid{grid-template-columns:1fr}}
.tlearn-i{display:flex;align-items:center;gap:12px;padding:11px 16px;text-decoration:none;border-top:1px solid var(--rule-soft);transition:background .15s ease,padding-left .15s ease}
.tlearn-grid .tlearn-i:nth-child(-n+2){border-top:0}
.tlearn-grid .tlearn-i:nth-child(odd){border-right:1px solid var(--rule-soft)}
@media(max-width:560px){.tlearn-grid .tlearn-i:nth-child(odd){border-right:0}.tlearn-grid .tlearn-i:nth-child(2){border-top:1px solid var(--rule-soft)}}
.tlearn-i.span2{grid-column:1 / -1;border-right:0}
.tlearn-n{font-family:var(--mono);font-size:12px;color:var(--ac-blue);font-weight:700;min-width:22px;flex:none}
.tlearn-t{font-family:var(--display);font-weight:700;font-size:14px;color:var(--ink);letter-spacing:-.01em;line-height:1.25}
.tlearn-i:hover{background:rgba(31,78,140,.05);padding-left:22px;text-decoration:none}
.tlearn-i:hover .tlearn-n{color:var(--ac-green)}
.tlearn-i:hover .tlearn-t{color:var(--ac-blue)}
/* smooth-scroll + offset so anchored headings clear the sticky nav */
html{scroll-behavior:smooth}
.mbody h2[id]{scroll-margin-top:80px}

/* ===== RGM Expert Trick — premium signature insider callout (self-contained surface; reads in both themes) ===== */
.rgm-trick{position:relative;margin:24px 0;border-radius:14px;overflow:hidden;background:linear-gradient(165deg,rgba(31,52,90,.6),#0c1729 62%),#0c1729;border:1px solid rgba(216,180,90,.5);box-shadow:0 14px 34px -14px rgba(3,8,18,.75)}
.rgm-trick::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#E9C76C,#C9A24B)}
.rgm-trick::after{content:"";position:absolute;right:-44px;top:-44px;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,rgba(216,180,90,.16),transparent 70%);pointer-events:none}
.rgm-trick-hd{position:relative;padding:16px 20px 0}
.rgm-trick-badge{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#15233d/*fixed*/;background:linear-gradient(180deg,#E9C76C,#CDA64E);padding:6px 12px 6px 10px;border-radius:999px;box-shadow:0 2px 10px rgba(216,180,90,.3)}
.rgm-trick-badge svg{width:14px;height:14px;flex:none}
.rgm-trick-t{position:relative;padding:12px 20px 0;font-family:var(--display);font-weight:800;font-size:18px;line-height:1.28;letter-spacing:-.01em;color:#F5F0E4/*fixed*/}
.rgm-trick-b{position:relative;padding:9px 20px 4px;font-family:var(--body);font-size:14px;line-height:1.6;color:#C7D1DF/*fixed*/;max-width:80ch}
.rgm-trick-b p{margin:0 0 9px}
.rgm-trick-b p:last-child{margin:0}
.rgm-trick-b strong{color:#F5F0E4/*fixed*/;font-weight:700}
.rgm-trick-b em{font-style:italic;color:#F5F0E4/*fixed*/}
.rgm-trick-b code{font-family:var(--mono);font-size:12.5px;background:rgba(216,180,90,.16);padding:1px 6px;border-radius:5px;color:#EEDCA8/*fixed*/}
.rgm-trick-tag{position:relative;margin:13px 20px 16px;padding-top:11px;border-top:1px solid rgba(216,180,90,.22);font-family:var(--mono);font-size:11.5px;color:#A1B2C6/*fixed*/;line-height:1.45}
.rgm-trick-tag b{color:#EAC86C/*fixed*/;font-weight:700;letter-spacing:.09em}