@font-face{font-family:"Alliance No.2";src:url("fonts/AllianceNo2-Light.ttf") format("truetype");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"Alliance No.2";src:url("fonts/AllianceNo2-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Alliance No.2";src:url("fonts/AllianceNo2-RegularItalic.ttf") format("truetype");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Alliance No.2";src:url("fonts/AllianceNo2-SemiBold.ttf") format("truetype");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Alliance No.2";src:url("fonts/AllianceNo2-Bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Alliance No.2";src:url("fonts/AllianceNo2-BoldItalic.ttf") format("truetype");font-weight:700;font-style:italic;font-display:swap}
:root{--ink:#111827;--muted:#64748b;--paper:#fff;--canvas:#f6f7fb;--panel:#fbfcff;--line:#e3e7ef;--line2:#cbd5e1;--navy:#052975;--cyan:#8ff8ff;--green:#16a34a;--amber:#d97706;--rose:#e11d48;--blue:#2563eb;--shadow:0 18px 45px -34px rgba(15,23,42,.65);--font:"Alliance No.2","Alliance No.1","Alliance",Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,system-ui,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--canvas);color:var(--ink);font-family:var(--font);line-height:1.45;-webkit-font-smoothing:antialiased}button,input{font:inherit}a{color:inherit}.app{min-height:100vh;display:grid;grid-template-columns:248px minmax(0,1fr)}.rail{position:sticky;top:0;height:100vh;background:#071f55;color:#dce7ff;border-right:1px solid rgba(255,255,255,.12);padding:18px 14px;display:flex;flex-direction:column;gap:18px}.brandmark{display:flex;align-items:center;gap:10px;padding:8px 8px 12px;border-bottom:1px solid rgba(255,255,255,.12)}.logo{width:34px;height:34px;border-radius:8px;background:linear-gradient(135deg,var(--cyan),#fff);box-shadow:inset 0 0 0 1px rgba(5,41,117,.12)}.brandmark b{display:block;color:#fff;font-size:14px}.brandmark span{display:block;color:#a9b9d8;font-size:12px;margin-top:2px}.nav{display:grid;gap:4px}.nav a{text-decoration:none;color:#b8c7e6;font-size:13px;font-weight:650;padding:9px 10px;border-radius:8px;display:flex;align-items:center;gap:9px}.nav a.active,.nav a:hover{background:rgba(255,255,255,.1);color:#fff}.nav .ico{width:16px;text-align:center;color:var(--cyan)}.rail-card{margin-top:auto;border:1px solid rgba(143,248,255,.25);background:rgba(143,248,255,.08);border-radius:8px;padding:13px}.rail-card .small{font-size:11px;color:#a9b9d8;text-transform:uppercase;letter-spacing:.08em;font-weight:750}.rail-card .big{color:#fff;font-size:22px;font-weight:850;line-height:1;margin-top:8px}.rail-card p{margin:8px 0 0;color:#c8d4ec;font-size:12px}.main{min-width:0}.topbar{position:sticky;top:0;z-index:20;height:76px;background:rgba(246,247,251,.86);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:9px 28px 0}.crumb{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--muted);font-weight:650;min-width:0}.crumb b{color:var(--ink);white-space:nowrap}.status{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);white-space:nowrap}.pulse{width:8px;height:8px;border-radius:50%;background:var(--navy);box-shadow:0 0 0 4px rgba(#052975)}.workspace{max-width:1440px;margin:0 auto;padding:24px 28px 42px}.hero{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px;align-items:stretch;margin-bottom:18px}.brief{background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:26px;box-shadow:var(--shadow)}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.12em;font-weight:800;color:var(--navy);display:flex;gap:8px;align-items:center;margin-bottom:12px}.eyebrow:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 3px rgba(143,248,255,.42);transform:translateY(-1px)}h1{margin:0;color:var(--ink);font-size:40px;line-height:1.05;letter-spacing:0;font-weight:850}.sub{margin:12px 0 0;max-width:780px;color:var(--muted);font-size:15px}.meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}.pill{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:#f8fafc;color:#334155;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:700}.pill b{color:var(--navy)}.watch{background:#0f172a;color:#e5edf8;border-radius:8px;padding:20px;display:grid;align-content:space-between;min-height:210px;box-shadow:var(--shadow)}.watch h2{font-size:14px;margin:0;color:#fff}.watch p{font-size:13px;color:#b9c5d8;margin:8px 0 0}.signal{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:end;margin-top:22px}.signal strong{font-size:65px;line-height:.82;color:#fff;letter-spacing:-.02em}.signal span{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--cyan);font-weight:850;text-align:right}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 20px}.metric{background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:22px 18px;min-height:160px;box-shadow:var(--shadow)}.metric .num{font-size:50px;line-height:1;font-weight:850;color:var(--navy)}.metric .lbl{font-size:11px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;color:#475569;margin-top:12px}.metric .note{font-size:12px;color:var(--muted);margin-top:4px}.grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:18px;align-items:start}.section{background:var(--paper);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);overflow:hidden;margin-bottom:18px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 18px;border-bottom:1px solid var(--line);background:var(--panel)}.section-head h2{font-size:21px;margin:0;letter-spacing:0;color:var(--ink)}.hint{font-size:12px;color:var(--muted);font-weight:650}.insights{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:14px}.insight{border:1px solid var(--line);border-radius:8px;padding:15px;background:#fff;min-height:160px;display:flex;flex-direction:column}.insight.primary{grid-column:1/-1;background:linear-gradient(180deg,#ffffff,#f7feff)}.tag{display:inline-flex;align-items:center;border:1px solid var(--line);background:#f8fafc;color:#334155;border-radius:999px;padding:4px 8px;font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}.insight h3{margin:0 0 4px;color:var(--ink);font-size:17px;line-height:1.22;letter-spacing:0}.insight.primary h3{font-size:21px}.insight p{margin:0;color:var(--muted);font-size:13px}.toolbar{display:grid;grid-template-columns:minmax(220px,1fr) auto;gap:12px;align-items:center;padding:14px;border-bottom:1px solid var(--line);background:#fff}.search{height:38px;border:1px solid var(--line2);border-radius:8px;padding:0 12px;background:#fff;color:var(--ink);min-width:0}.search:focus{outline:2px solid rgba(37,99,235,.18);border-color:#93b7ff}.filter-stack{display:grid;gap:8px;padding:0 14px 14px;border-bottom:1px solid var(--line)}.filter-row{display:flex;flex-wrap:wrap;gap:7px;align-items:center}.flabel{font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.08em;color:#64748b;width:132px}.chip{border:1px solid var(--line2);background:#fff;color:#334155;border-radius:8px;padding:7px 10px;font-size:12px;font-weight:750;cursor:pointer;transition:.16s;min-height:32px}.chip:hover{border-color:#94a3b8;background:#f8fafc}.chip.active{background:#0f172a;color:#fff;border-color:#0f172a}.dot{width:7px;height:7px;border-radius:50%;display:inline-block;margin-right:7px;vertical-align:1px;background:var(--blue)}.dot.ai{background:var(--cyan)}.dot.cons{background:var(--amber)}.dot.steady{background:var(--green)}.cards{display:grid;gap:0}.card{border-bottom:1px solid var(--line);background:#fff;transition:background .16s}.card:hover{background:#fbfdff}.card.hide{display:none}.ctop{display:grid;grid-template-columns:230px minmax(0,1fr) 210px 34px;gap:18px;align-items:center;padding:15px 16px;cursor:pointer}.brand .name{font-size:15px;font-weight:850;color:var(--ink);line-height:1.1}.brand .owner,.brand .cat{font-size:12px;color:var(--muted);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.headline{font-size:13px;color:#334155;min-width:0}.right{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.badge{font-size:11px;font-weight:850;border-radius:999px;padding:5px 8px;background:#f8fafc;border:1px solid var(--line);color:#334155;white-space:nowrap}.stance-ai .badge{background:#ecfeff;border-color:#a5f3fc;color:#0e7490}.stance-cons .badge{background:#fff7ed;border-color:#fed7aa;color:#9a3412}.stance-steady .badge{background:#f0fdf4;border-color:#bbf7d0;color:#166534}.prox{font-size:11px;color:var(--muted);white-space:nowrap}.prox b{color:var(--ink)}.chev{width:28px;height:28px;border:1px solid var(--line);border-radius:8px;display:grid;place-items:center;color:#475569;background:#fff}.carrow{transition:transform .22s;font-size:12px}.card.open .carrow{transform:rotate(90deg)}.detail{max-height:0;overflow:hidden;transition:max-height .35s ease;background:#fbfcff}.card.open .detail{max-height:760px;border-top:1px solid var(--line)}.din{padding:16px}.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.field{background:#fff;border:1px solid var(--line);border-radius:8px;padding:12px}.field .ft{font-size:10px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;color:#475569;margin-bottom:6px}.field p{font-size:13px;color:var(--muted);margin:0}.field .stat{font-weight:850;color:var(--navy)}.sources{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.sources a{text-decoration:none;border:1px solid var(--line2);border-radius:8px;padding:7px 10px;font-size:12px;font-weight:750;color:#334155;background:#fff}.sources a:hover{border-color:#93b7ff;color:var(--navy)}.noresult{display:none;text-align:center;color:var(--muted);font-size:13px;padding:28px}.events{display:grid;padding:4px 14px 14px}.ev{display:grid;grid-template-columns:106px minmax(0,1fr);gap:14px;padding:12px 0;border-bottom:1px solid var(--line)}.ev:last-child{border-bottom:0}.ev .when{font-size:12px;color:var(--muted);font-weight:800;display:flex;gap:8px;align-items:center}.ev .d{width:8px;height:8px;border-radius:50%;background:var(--c,var(--blue))}.ev .what{font-size:13px;color:#334155}.ev .what b{color:var(--ink)}.youtube-wrap{overflow-x:auto}.yt-table{width:100%;border-collapse:collapse;font-size:13px;min-width:780px}.yt-table th{padding:11px 12px;text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:#64748b;background:#f8fafc;border-bottom:1px solid var(--line)}.yt-table th.num,.yt-table td.num{text-align:right}.yt-table td{padding:12px;border-bottom:1px solid var(--line);color:#334155;vertical-align:middle}.yt-table tr.ours{background:#f0fdff}.channel{font-weight:850;color:var(--ink)}.handle{font-size:11px;color:var(--muted);margin-top:2px}.ours-badge{font-size:10px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;background:#0f172a;color:#fff;border-radius:999px;padding:3px 7px;margin-left:6px}.barline{display:flex;align-items:center;gap:10px;min-width:210px}.bar{height:8px;flex:1;background:#eaf0f7;border-radius:999px;overflow:hidden}.bar i{display:block;height:100%;width:var(--w);background:var(--blue);border-radius:999px}.bar i.hot{background:var(--cyan)}.bar i.down{background:var(--rose)}.barline span{min-width:52px;text-align:right;font-weight:850;color:var(--navy)}.barline span.down{color:var(--rose)}.footnote{padding:12px 16px;background:#f8fafc;color:var(--muted);font-size:11.5px;border-top:1px solid var(--line)}.method{padding:16px 18px;background:#0f172a;color:#e5edf8}.method h2{font-size:16px;margin:0 0 12px;color:#fff}.method ul{list-style:none;padding:0;margin:0;display:grid;gap:9px}.method li{font-size:13px;color:#cbd5e1;padding-left:18px;position:relative}.method li:before{content:"";position:absolute;left:0;top:8px;width:7px;height:7px;border-radius:50%;background:var(--cyan)}.method b{color:#fff}footer{text-align:center;font-size:12px;color:var(--muted);padding:8px 0 0}@media(max-width:1100px){.app{grid-template-columns:1fr}.rail{position:relative;height:auto;flex-direction:row;align-items:center;overflow:auto}.rail-card{display:none}.nav{display:flex}.hero,.grid{grid-template-columns:1fr}.metrics{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.workspace{padding:16px}.topbar{padding:0 16px}.status{display:none}.brief{padding:20px}h1{font-size:30px}.metrics{grid-template-columns:1fr}.insights{grid-template-columns:1fr}.insight.primary{grid-column:auto}.toolbar{grid-template-columns:1fr}.flabel{width:100%}.ctop{grid-template-columns:1fr;gap:10px}.right{justify-content:flex-start}.grid2{grid-template-columns:1fr}.ev{grid-template-columns:1fr;gap:4px}.rail{padding:12px}.brandmark{border-bottom:0}.nav a{white-space:nowrap}}
.app{display:block;min-height:100vh}.rail{display:none}.grid{grid-template-columns:minmax(0,1fr) minmax(340px,.82fr);align-items:stretch}.grid>.section:first-child{display:flex;flex-direction:column}.grid>.section:first-child .insights{grid-template-columns:1fr;gap:8px;align-content:start}#events{height:0;min-height:100%;display:flex;flex-direction:column}#eventsList{flex:1;min-height:0;overflow-y:auto}.insight{border-left:1px solid var(--line);min-height:auto;display:grid;grid-template-columns:142px minmax(0,1fr);gap:14px 18px;align-items:start}.insight.primary{grid-column:auto;border-left:1px solid var(--line);background:#fff;grid-template-columns:142px minmax(0,1fr);min-height:auto}.insight .tag{margin:0;width:max-content}.insight h3{margin:0 0 6px}.insight p{grid-column:2;margin:0}.insight.primary h3{font-size:18px}@media(max-width:1100px){.grid{grid-template-columns:1fr}.grid>.section:first-child{height:auto}.grid>.section:first-child .insights{grid-template-rows:none}#events{display:block;min-height:auto}#eventsList{overflow:visible}}@media(max-width:760px){.insight,.insight.primary{grid-template-columns:1fr}.insight p{grid-column:auto}}
:root{--font:"Alliance No.2",Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,system-ui,sans-serif;--shadow:0 18px 45px -34px rgba(15,23,42,.18)}
.brief,.watch,.metric,.section{box-shadow:0 14px 34px -30px rgba(15,23,42,.22)}
.watch{background:#0f172a}
.pulse{box-shadow:0 0 0 4px rgba(22,163,74,.08)}
.eyebrow:before{box-shadow:0 0 0 3px rgba(143,248,255,.24)}
.stance-ai .badge{background:#fff;border-color:#8ff8ff;color:#052975}
.stance-cons .badge{background:#fff;border-color:#5f9e8d;color:#315f54}
.stance-steady .badge{background:#fff;border-color:#983EAE;color:#983EAE}
.dot.ai{background:#8ff8ff}.dot.cons{background:#5f9e8d}.dot.steady{background:#983EAE}
.chip[data-type="stance"][data-val="ai"],.chip[data-type="stance"][data-val="cons"],.chip[data-type="stance"][data-val="steady"]{border-color:var(--line2);background:#fff;color:#334155}
.chip.active[data-type="stance"][data-val="ai"]{background:#fff;border-color:#8ff8ff;color:#052975}
.chip.active[data-type="stance"][data-val="cons"]{background:#fff;border-color:#5f9e8d;color:#315f54}
.chip.active[data-type="stance"][data-val="steady"]{background:#fff;border-color:#983EAE;color:#983EAE}
.chip.active[data-type="stance"][data-val="all"]{background:#052975;border-color:#052975;color:#fff}
.chip.active[data-type="prox"]{background:#052975;border-color:#052975;color:#fff}
#youtube .yt-table th:nth-child(4){text-align:right;padding-right:12px}
.filter-stack{padding-top:12px}
.grid>.section:first-child .insight{gap:4px 18px;align-content:start;padding:12px 14px}
.grid>.section:first-child .insight h3{margin:0}
.grid>.section:first-child .insight p{margin:0}
.grid{margin-bottom:18px}
.grid>.section{margin-bottom:0}
.brief{position:relative;overflow:hidden;background:#052975 url('./Assets/Dashboard_images_export.jpg') center/cover no-repeat;border-color:rgba(255,255,255,.18)}.brief-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;opacity:0;transition:opacity .9s ease}.brief-bg.is-playing{opacity:1}.brief:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(5,41,117,.72),rgba(15,23,42,.32))}.brief-body{position:relative;z-index:2}@media(prefers-reduced-motion:reduce){.brief-bg{transition:none}}
.brief,.brief h1,.brief .sub,.brief .eyebrow,.brief .pill,.brief .pill b{color:#fff}
.brief .eyebrow{color:#8ff8ff}
.brief .pill{background:rgba(143,248,255,.14);border-color:rgba(143,248,255,.5)}
.brief .eyebrow:before{background:#8ff8ff;box-shadow:0 0 0 3px rgba(143,248,255,.18);animation:heroPulse 2.4s infinite}
@keyframes heroPulse{0%{box-shadow:0 0 0 0 rgba(143,248,255,.46)}70%{box-shadow:0 0 0 9px rgba(143,248,255,0)}100%{box-shadow:0 0 0 0 rgba(143,248,255,0)}}
#continia-uploads .cu-wrap{padding:16px 18px;display:grid;gap:18px}
#continia-uploads .cu-periods{display:flex;gap:6px;flex-wrap:wrap}
#continia-uploads .cu-pd{display:inline-flex;align-items:center;justify-content:center;text-align:center;line-height:1;border:1px solid var(--line2);background:#fff;color:#334155;border-radius:8px;padding:7px 13px;font-size:12px;font-weight:850;cursor:pointer;transition:.15s}
#continia-uploads .cu-pd:hover{border-color:#94a3b8;background:#f8fafc}
#continia-uploads .cu-pd.active{background:#052975;border-color:#052975;color:#fff}
#continia-uploads .cu-split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
#continia-uploads .cu-block{border:1px solid var(--line);border-radius:8px;padding:15px 16px;background:#fff}
#continia-uploads .cu-h{font-size:11px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;color:#475569;margin-bottom:12px}
#continia-uploads .cu-bar{display:flex;height:12px;border-radius:999px;overflow:hidden;background:#eaf0f7}
#continia-uploads .cu-bar i{display:block;height:100%}
#continia-uploads .cu-bar i.lf{background:#052975}
#continia-uploads .cu-bar i.sh{background:#e2e8f0}
#continia-uploads .cu-legend{display:flex;justify-content:space-between;gap:10px;margin-top:12px;font-size:13px;color:#334155;flex-wrap:wrap}
#continia-uploads .cu-legend .k{display:flex;align-items:center;gap:7px}
#continia-uploads .cu-legend .sw{width:9px;height:9px;border-radius:50%;display:inline-block}
#continia-uploads .cu-legend .sw.lf{background:#052975}
#continia-uploads .cu-legend .sw.sh{background:#e2e8f0}
#continia-uploads .cu-legend b{color:var(--ink)}
#continia-uploads .cu-legend .pct{color:var(--muted);font-weight:700}
#continia-uploads .yt-table{min-width:540px}
#continia-uploads .cu-outlier{display:inline-block;background:#f3ecff;color:#983EAE;border:1px solid #e3d2f0;border-radius:999px;padding:3px 8px;font-size:12px;font-weight:850}
@media(max-width:760px){#continia-uploads .cu-split{grid-template-columns:1fr}}
.bar i{background:#052975}
.bar i.hot{background:#052975}
.vi-pair{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start;margin-bottom:18px}
.vi-pair>.section{margin-bottom:0}
#video-ideas{align-items:stretch;scroll-margin-top:84px}
#video-ideas>.section{display:flex;flex-direction:column}
#video-ideas>.section>.footnote{margin-top:auto}
.vi-stack{display:flex;flex-direction:column;gap:8px;padding:14px 18px 16px;flex:1}
.vi-stack>.ci-item{flex:1 0 auto;display:flex;flex-direction:column;justify-content:center}
.ci-row-static{cursor:default}
.vi-card{border:1px solid var(--line);border-radius:12px;background:#fff;padding:20px 18px;display:flex;flex-direction:column;gap:0}
.vi-pct{font-size:40px;font-weight:850;color:var(--ink);line-height:1;margin-bottom:14px}
.vi-ticks{display:flex;justify-content:space-between;align-items:stretch;height:36px;margin-bottom:12px}
.vi-ticks i{width:4px;flex:0 0 4px;border-radius:999px;background:#e2e8f0}
.vi-ticks i.on{background:#052975}
.vi-title{font-size:15px;font-weight:850;color:var(--ink);margin:0 0 5px;line-height:1.25}
.vi-desc{font-size:13px;color:var(--muted);margin:0;line-height:1.45}
.content-menu{padding:14px 18px 16px;display:grid;gap:8px}
.ci-item{border:1px solid var(--line);border-radius:8px;background:#fff;overflow:hidden}
.ci-item[open]{border-color:#b8c5d7;background:#fbfdff}
.ci-row{list-style:none;display:grid;grid-template-columns:max-content minmax(0,1fr) 82px 32px;gap:14px;align-items:center;padding:12px;cursor:pointer}
#contentIdeasList .ci-row{grid-template-columns:140px minmax(0,1fr) 82px 32px}
.ci-row::-webkit-details-marker{display:none}
.ci-type{display:inline-flex;width:max-content;align-items:center;border:1px solid var(--line);background:#f8fafc;color:#334155;border-radius:999px;padding:4px 8px;font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.08em}
.ci-title{display:block;font-size:15px;font-weight:850;color:var(--ink);line-height:1.25;margin-bottom:5px}
.ci-tease{display:block;font-size:12px;color:var(--muted);line-height:1.4}
.ci-fmt{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.ci-fmt-tag{font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#052975;background:#def5ff;border:1px solid #bfe7fb;border-radius:999px;padding:2px 8px}
.ci-score{text-align:right;font-size:22px;font-weight:850;color:var(--navy);line-height:1}
#contentIdeasList .ci-score,#video-ideas .ci-score{font-size:30px}
.ci-arrow{width:30px;height:30px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--navy);font-weight:850;transition:transform .18s}
.ci-item[open] .ci-arrow{transform:rotate(90deg)}
.ci-detail{border-top:1px solid var(--line);padding:14px 16px}
.ci-reason{font-size:13px;color:var(--muted);margin:0;line-height:1.45;max-width:108ch}
.ci-sources{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}
.ci-sources a{text-decoration:none;border:1px solid var(--line2);border-radius:8px;padding:7px 9px;font-size:12px;font-weight:750;color:#334155;background:#fff}
.ci-sources a:hover{border-color:#052975;background:#052975;color:#fff}
@media(max-width:760px){.vi-pair{grid-template-columns:1fr}}
@media(max-width:760px){.vi-ticks{height:32px}.vi-ticks i{width:3px;flex:0 0 3px}}
@media(max-width:760px){.ci-row,#contentIdeasList .ci-row{grid-template-columns:1fr auto;gap:8px}.ci-type,.ci-copy{grid-column:1}.ci-score{grid-column:1;text-align:left}.ci-arrow{grid-column:2;grid-row:1 / span 3}}
.imgbank .is-wrap{padding:16px 18px;display:flex;flex-direction:column;gap:14px}
.imgbank .is-search{position:relative}
.imgbank .is-search input{width:100%;height:44px;line-height:42px;border:1px solid var(--line2);border-radius:10px;padding:0 14px 0 40px;background:#fff;color:var(--ink);font-size:14px}
.imgbank .is-search input:focus{outline:2px solid rgba(5,41,117,.15);border-color:#052975}
.imgbank .is-search .ic{position:absolute;left:14px;top:0;height:44px;display:flex;align-items:center;color:#94a3b8;pointer-events:none}
.imgbank .is-meta{font-size:12px;color:var(--muted);font-weight:650}
.imgbank .is-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.imgbank .is-card{position:relative;margin:0;border-radius:12px;overflow:hidden;background:#f1f5f9;aspect-ratio:1/1;transform:translateZ(0);box-shadow:0 1px 3px rgba(15,23,42,.1);cursor:zoom-in;transition:transform .15s,box-shadow .15s}
.imgbank .is-card:hover{transform:translateY(-2px);box-shadow:0 12px 26px -16px rgba(15,23,42,.5)}
.imgbank .is-card img{width:100%;height:100%;object-fit:cover;display:block;border-radius:inherit}
/* A carousel is still a card - the badge is the only thing that says the cover
   has six more pages behind it. Top-left is the one corner these covers leave
   empty - the caption owns the foot and the logo sits across the top centre, so
   a badge on the right lands on the wordmark once the card drops to half width.
   It shrinks on a phone for the same reason: the pill does not scale with the
   card, so at 170px it would cross the whole cover. */
.imgbank .is-pdf{position:absolute;z-index:1;top:8px;left:8px;display:inline-flex;align-items:center;padding:3px 8px 4px;border-radius:999px;background:rgba(15,23,42,.82);color:#fff;font-size:10px;font-weight:800;letter-spacing:.02em;line-height:1.2;pointer-events:none}
@media(max-width:760px){.imgbank .is-pdf{top:6px;left:6px;padding:2px 6px 3px;font-size:9px}}
.imgbank .is-cap{position:absolute;inset:auto 0 0 0;padding:20px 12px 11px;background:linear-gradient(180deg,rgba(15,23,42,0),rgba(15,23,42,.8));color:#fff;font-size:12px;font-weight:700;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imgbank .is-empty{grid-column:1/-1;text-align:center;color:var(--muted);font-size:13px;padding:26px}
@media(max-width:760px){.imgbank .is-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
#youtube-bank .is-card{aspect-ratio:16/9}
.is-lightbox{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;background:rgba(8,12,24,.9);padding:24px;cursor:zoom-out;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.is-lightbox.open{display:flex}
.is-lightbox img{max-width:95vw;max-height:90vh;width:auto;height:auto;border-radius:10px;box-shadow:0 30px 90px -20px rgba(0,0,0,.75);cursor:default}
.is-lb-close{position:fixed;top:18px;right:22px;width:42px;height:42px;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font-size:24px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.is-lb-close:hover{background:rgba(255,255,255,.24)}
/* The carousel stage. One column of pages you scroll - the pages are the
   document, so they fill the column's width and the column, not the page, is
   what has a height limit. The single-image rules above cap every <img> at
   95vw/90vh, which inside a scroller would shrink each page to fit instead of
   letting the stack run. */
.is-lb-doc{display:none}
.is-lightbox .is-lb-doc.is-on{display:block;width:min(95vw,720px);max-height:90vh;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;border-radius:10px;box-shadow:0 30px 90px -20px rgba(0,0,0,.75);cursor:default;background:#0b1020}
.is-lightbox .is-lb-doc.is-on:focus{outline:none}
.is-lightbox .is-lb-doc img{display:block;width:100%;height:auto;max-width:none;max-height:none;border-radius:0;box-shadow:none}
.is-lightbox .is-lb-doc img+img{margin-top:4px}
.is-lb-cap{position:fixed;bottom:20px;left:0;right:0;text-align:center;color:#e5edf8;font-size:13px;font-weight:650;padding:0 24px;pointer-events:none}
.is-lb-nav{position:fixed;top:50%;transform:translateY(-50%);width:48px;height:48px;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font-size:30px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.is-lb-nav:hover{background:rgba(255,255,255,.24)}
.is-lb-prev{left:20px}
.is-lb-next{right:20px}
@media(max-width:760px){.is-lb-nav{width:40px;height:40px;font-size:24px}.is-lb-prev{left:10px}.is-lb-next{right:10px}}
.cmp-wrap{padding:16px 18px;display:flex;flex-direction:column;gap:14px}
.cmp-drop{display:block;border:2px dashed var(--line2);border-radius:12px;background:#f8fafc;padding:26px 18px;text-align:center;cursor:pointer;transition:.15s}
.cmp-drop:hover,.cmp-drop.drag{background:rgba(5,41,117,.05);color:#052975}
.cmp-drop .cmp-ico{color:#052975;display:inline-flex}
.cmp-drop b{display:block;color:var(--ink);font-size:14px;margin-top:8px}
.cmp-drop span{display:block;color:var(--muted);font-size:12px;margin-top:4px}
.cmp-list{display:flex;flex-direction:column;gap:10px}
.cmp-row{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:#fff}
.cmp-thumb{width:44px;height:44px;border-radius:8px;object-fit:cover;background:#eef2f7}
.cmp-name{font-size:13px;font-weight:750;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmp-meta{font-size:12px;color:var(--muted);margin-top:3px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.cmp-meta .save{color:#983eae;font-weight:850}
#pdf-compress .cmp-thumb{color:#052975}
.cmp-meta b{color:var(--ink)}
.cmp-right{display:flex;align-items:center;gap:10px;justify-self:end}
.cmp-btn{border:1px solid #052975;background:#052975;color:#fff;border-radius:8px;padding:8px 14px;font-size:12px;font-weight:850;cursor:pointer;white-space:nowrap;text-decoration:none;display:inline-block}
.cmp-btn:hover{background:#06317f}
.cmp-btn.ghost{background:#fff;color:#052975}
.cmp-btn.ghost:hover{background:#fff}
.cmp-spin{width:14px;height:14px;border:2px solid #cbd5e1;border-top-color:#052975;border-radius:50%;animation:cmpspin .7s linear infinite;display:inline-block}
@keyframes cmpspin{to{transform:rotate(360deg)}}
.cmp-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cmp-actions[hidden]{display:none}
.cmp-total{font-size:12px;color:var(--muted);font-weight:700}
.cmp-err{color:var(--rose);font-weight:750}
.cmp-note{font-size:12.5px;color:var(--muted)}
@media(max-width:760px){.cmp-row{grid-template-columns:40px minmax(0,1fr);gap:10px}.cmp-right{grid-column:1 / -1;justify-self:start}}
/* ---- Left sidebar navigation ---- */
.app{display:grid !important;grid-template-columns:312px minmax(0,1fr);min-height:100vh}
/* 312px is measured, not chosen. At 264px three sub-labels rendered with an
   ellipsis, and with the two that were abbreviated in the NAV data now reading in
   full the widest is "Platform & shared components" at 190px of text, which needs
   exactly 300px of rail. 312 leaves it 12px.

   Measuring this is fiddlier than it looks, and two obvious methods both lie.
   `a.scrollWidth > a.clientWidth` reports nothing, because .sb-sub a is a flex
   container and the text is an anonymous flex item that shrinks instead of
   overflowing. And a Range over the link's contents includes the icon, so
   subtracting the icon from the space available double-counts it and inflates the
   shortfall by ~30px. What works: clone the link at width:max-content, then
   subtract the icon, the gap and the padding from its width.

   The labels are nowrap with text-overflow:ellipsis, so one that outgrows this
   clips silently rather than wrapping - re-measure before adding a long one. */
.sidebar{position:sticky;top:0;height:100vh;overflow-y:auto;background:#fbfbfa;border-right:1px solid var(--line);padding:18px 14px;display:flex;flex-direction:column;gap:6px;z-index:30}
.sb-brand{display:flex;align-items:center;gap:11px;padding:6px 8px 15px;border-bottom:1px solid var(--line);margin-bottom:8px;text-decoration:none;cursor:pointer}
.sb-brand:hover b{color:var(--navy)}
.sb-logo{width:36px;height:36px;border-radius:9px;background:#052975;color:#fff;display:grid;place-items:center;font-weight:850;font-size:17px;flex:none}
.sb-logo img{width:19px;height:19px;display:block}
.sb-brand b{display:block;font-size:14px;color:var(--ink);line-height:1.15}
.sb-brand span{display:block;font-size:12px;color:var(--muted);margin-top:1px}
.sb-nav{display:flex;flex-direction:column;gap:3px}
.sb-head{display:flex;align-items:center;gap:11px;width:100%;border:0;background:none;cursor:pointer;padding:9px 10px;border-radius:9px;font:inherit;font-size:13.5px;font-weight:800;color:var(--ink);text-decoration:none}
.sb-head:hover{background:rgba(5,41,117,.05)}
.sb-head.active{background:rgba(5,41,117,.09);color:#052975}
.sb-head>i:first-child,.sb-head>svg:first-child{color:#052975;font-size:17px;width:21px;text-align:center;flex:none;transform:translateY(-1px)}
.sb-head span{flex:1;text-align:left}
.sb-caret{font-size:11px;color:var(--muted);transition:transform .2s}
.sb-group.collapsed .sb-caret{transform:rotate(-90deg)}
.sb-sub{display:flex;flex-direction:column;gap:1px;margin:2px 0 8px 20px;padding-left:13px;border-left:1px solid var(--line2)}
.sb-group.collapsed .sb-sub{display:none}
.sb-sub a{display:flex;align-items:center;gap:10px;text-decoration:none;color:#64748b;font-size:13px;font-weight:500;padding:7px 9px;border-radius:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb-sub a>i,.sb-sub a>svg{font-size:15px;width:19px;text-align:center;color:#94a3b8;flex:none;transform:translateY(-1px)}
.sb-sub a:hover{background:rgba(5,41,117,.05);color:var(--ink)}
.sb-sub a:hover>i{color:#052975}
.sb-sub a.active{color:#052975;font-weight:600}
.sb-sub a.active>i{color:#052975}
.sb-logout{margin-top:auto;display:flex;align-items:center;gap:11px;width:100%;border:0;border-top:1px solid var(--line);background:none;cursor:pointer;padding:13px 10px 4px;font:inherit;font-size:13.5px;font-weight:700;color:var(--muted);text-align:left;transition:.15s}
.sb-logout>i,.sb-logout>svg{font-size:15px;width:19px;text-align:center;color:#94a3b8;flex:none;transition:.15s}
.sb-logout span{flex:1}
.sb-logout:hover{color:#052975}
.sb-logout:hover>i,.sb-logout:hover>svg{color:#052975}
.sb-logout:focus-visible{outline:2px solid var(--navy);outline-offset:2px;border-radius:8px}
section[id],.metric[id],.watch[id]{scroll-margin-top:84px}
@media(max-width:1100px){.app{grid-template-columns:1fr !important}.sidebar{position:static;height:auto;overflow:visible;border-right:0;border-bottom:1px solid var(--line)}}
/* LinkedIn engagement: expandable per-company post list */
.li-row{cursor:pointer}
.li-row:hover{background:#f8fafc}
.li-row.ours{background:#f0fdff}
.li-row.ours:hover{background:#e8fbff}
.li-carrow{display:inline-block;font-size:13px;color:#475569;transition:transform .22s;margin-left:4px;vertical-align:1px}
.li-row.open .li-carrow{transform:rotate(90deg)}
.li-detail{display:none}
.li-detail.open{display:table-row}
.li-detail>td{padding:0;background:#fbfcff}
.li-posts{display:grid;gap:0;padding:4px 14px 10px}
.li-post{display:grid;grid-template-columns:26px minmax(0,1fr) auto;gap:14px;align-items:center;padding:9px 4px;border-bottom:1px solid var(--line)}
.li-post:last-child{border-bottom:0}
.li-pn{font-weight:850;color:#94a3b8;font-size:12px;text-align:center}
.li-pt{min-width:0;font-size:13px;color:#334155}
.li-pt b{color:var(--ink);font-weight:750}
.li-ty{display:inline-block;font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.06em;color:#475569;background:#f1f5f9;border:1px solid var(--line);border-radius:999px;padding:2px 7px;margin-left:4px;white-space:nowrap}
.li-pm{display:flex;gap:16px;white-space:nowrap;font-size:12px;color:var(--muted)}
.li-pm b{color:var(--navy);font-weight:850}
@media(max-width:760px){.li-post{grid-template-columns:22px minmax(0,1fr)}.li-pm{grid-column:2;gap:12px;margin-top:3px}}
/* SEO scanner */
.seo-wrap{padding:16px 18px}
.seo-bar{display:flex;gap:10px}
.seo-bar input{flex:1;min-width:0;height:42px;border:1px solid var(--line2);border-radius:8px;padding:0 14px;background:#fff;color:var(--ink);font-size:14px}
.seo-bar input:focus{outline:2px solid rgba(37,99,235,.18);border-color:#93b7ff}
.seo-bar .cmp-btn{height:42px;flex:none}
.seo-note{font-size:12px;margin:8px 0 0}
.seo-summary{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:12px 0 2px;font-size:13px;color:var(--muted)}
.seo-summary:empty{display:none}
.seo-score{display:flex;align-items:baseline;gap:3px}
.seo-score b{font-size:30px;font-weight:850;color:var(--navy);line-height:1}
.seo-score span{font-size:13px;color:var(--muted)}
.seo-counts{display:flex;gap:12px;font-weight:750}
.seo-c.err{color:#983eae}
.seo-c.warn{color:#a87c12}
.seo-c.info{color:#052975}
.seo-scanned{font-size:12px;color:var(--muted);margin-left:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:50%}
.seo-list{display:grid;gap:8px;margin-top:10px}
.seo-item{display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;border:1px solid var(--line);border-radius:8px;padding:12px 14px;background:#fff}
.seo-item.sev-error{background:#f5edfa}
.seo-item.sev-warn{background:#fff7e3}
.seo-item.sev-info{background:#def5ff}
.seo-item.sev-good{background:#eef5f2}
.seo-sev{font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.06em;padding-top:2px}
.sev-error .seo-sev{color:#983eae}
.sev-warn .seo-sev{color:#a87c12}
.sev-info .seo-sev{color:#052975}
.sev-good .seo-sev{color:#4f8576}
.seo-t{font-size:14px;font-weight:800;color:var(--ink)}
.seo-i{font-size:13px;color:var(--muted);margin-top:3px}
.seo-f{font-size:13px;color:#334155;margin-top:5px}
.seo-f b{color:var(--navy)}
@media(max-width:760px){.seo-item{grid-template-columns:1fr;gap:4px}.seo-scanned{margin-left:0;max-width:100%;flex-basis:100%}}
/* SEO keyword analysis */
.seo-kw{margin-top:14px;border-top:1px solid var(--line);padding-top:14px}
.seo-kw:empty{display:none}
.seo-kw-h{font-size:15px;font-weight:850;color:var(--ink)}
.kw-sub{font-size:12px;color:var(--muted);margin:3px 0 8px}
.kw-table{width:100%;border-collapse:collapse;font-size:13px;min-width:520px}
.kw-table th{text-align:left;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#64748b;padding:7px 10px;border-bottom:1px solid var(--line)}
.kw-table th.num,.kw-table td.num{text-align:right}
.kw-table td{padding:8px 10px;border-bottom:1px solid var(--line);color:#334155;vertical-align:middle}
.kw-term{font-weight:800;color:var(--ink)}
.kw-cov{white-space:nowrap;text-align:right}
.kw-badge{display:inline-block;font-size:10px;font-weight:800;border-radius:999px;padding:2px 7px;margin-left:4px;background:#eef1f6;color:#9aa3af}
.kw-badge.on{background:#def5ff;color:#052975}
.kw-phrases{margin-top:14px}
.kw-phrase{display:inline-block;font-size:12px;background:#f1f5f9;border:1px solid var(--line);border-radius:999px;padding:4px 11px;margin:0 6px 6px 0;color:#334155}
.kw-phrase b{color:var(--navy)}
.kw-focus{margin-top:16px}
.kw-focus-bar input{width:100%;height:40px;border:1px solid var(--line2);border-radius:8px;padding:0 12px;font-size:14px;background:#fff;color:var(--ink)}
.kw-focus-bar input:focus{outline:2px solid rgba(37,99,235,.18);border-color:#93b7ff}
.kw-focus-sum{font-size:13px;color:#334155;margin:11px 0 8px}
.kw-focus-sum b{color:var(--navy)}
.kw-chks{display:flex;flex-wrap:wrap;gap:8px}
.kw-chk{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:750;border:1px solid var(--line);border-radius:8px;padding:6px 10px;background:#f8fafc;color:#9aa3af}
.kw-chk.ok{color:#1f7a59;border-color:#bfe6d4;background:#eef5f2}
.kw-chk span{font-weight:850}

/* ---- Event Calendar ---- */
#event-calendar .cal-wrap{padding:16px 18px}
.cal-toolbar{display:flex;align-items:center;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.cal-nav{width:32px;height:32px;border:1px solid var(--line2);background:#fff;border-radius:8px;color:#334155;font-size:18px;line-height:1;cursor:pointer;display:grid;place-items:center;transition:.15s}
.cal-nav:hover{border-color:#94a3b8;background:#f8fafc}
.cal-title{font-size:16px;font-weight:850;color:var(--ink);min-width:150px;text-align:center}
.cal-today{border:1px solid var(--line2);background:#fff;color:#334155;border-radius:8px;padding:7px 12px;font-size:12px;font-weight:750;cursor:pointer;transition:.15s}
.cal-today:hover{border-color:#94a3b8;background:#f8fafc}
.cal-spacer{flex:1}
.cal-add{border:1px solid #052975;background:#052975;color:#fff;border-radius:8px;padding:8px 14px;font-size:12px;font-weight:800;cursor:pointer;transition:.15s}
.cal-add:hover{background:#0a3aa0;border-color:#0a3aa0}
.cal-form{border:1px solid var(--line);background:#fbfdff;border-radius:10px;padding:14px;margin-bottom:14px;display:grid;gap:12px}
.cal-form-row{display:grid;gap:6px}
.cal-form-row.two{grid-template-columns:1fr 1fr;gap:12px}
.cal-fl{font-size:11px;font-weight:850;letter-spacing:.06em;text-transform:uppercase;color:#475569;display:grid;gap:6px}
.cal-opt{text-transform:none;letter-spacing:0;color:var(--muted);font-weight:650}
.cal-form input[type=text],.cal-form input[type=date]{height:38px;border:1px solid var(--line2);border-radius:8px;padding:0 12px;background:#fff;color:var(--ink);font:inherit}
.cal-form input:focus{outline:2px solid rgba(5,41,117,.35);border-color:#052975}
.cal-swatches{display:flex;gap:9px;align-items:center}
.cal-sw{width:26px;height:26px;border-radius:50%;border:2px solid #fff;background:var(--cc);cursor:pointer;box-shadow:0 0 0 1px var(--line2);transition:.12s;padding:0}
.cal-sw.on{box-shadow:0 0 0 2px var(--cc);transform:scale(1.08)}
.cal-form-actions{display:flex;gap:8px;align-items:center}
.cal-btn{border:1px solid #052975;background:#052975;color:#fff;border-radius:8px;padding:8px 14px;font-size:12px;font-weight:800;cursor:pointer;transition:.15s}
.cal-btn:hover{background:#0a3aa0;border-color:#0a3aa0}
.cal-btn.ghost{background:#fff;color:#334155;border-color:var(--line2)}
.cal-btn.ghost:hover{background:#f8fafc;border-color:#94a3b8}
.cal-btn.danger{background:#fff;color:#983eae;border-color:#e3d2f0;margin-left:auto}
.cal-btn.danger:hover{background:#f5edfa;border-color:#d3b3e3}
.cal-btn:disabled{opacity:.6;cursor:default}
.cal-msg{font-size:12px;font-weight:700;color:#b4231f}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.cal-dow{font-size:11px;font-weight:850;letter-spacing:.05em;text-transform:uppercase;color:#64748b;text-align:center;padding:2px 0 4px}
.cal-cell{min-height:94px;border:1px solid var(--line);border-radius:8px;padding:6px;background:#fff;cursor:pointer;display:flex;flex-direction:column;gap:3px;overflow:hidden;transition:.13s}
.cal-cell:hover{background:rgba(5,41,117,.25)}
.cal-cell.other{background:#f8fafc}
.cal-cell.other .cal-daynum{color:#b0bccd}
.cal-cell.today{border-color:rgba(5,41,117,.5);box-shadow:inset 0 0 0 1px rgba(5,41,117,.5)}
.cal-cell.selected{background:rgba(5,41,117,.25)}
.cal-daynum{font-size:12px;font-weight:800;color:#334155;align-self:flex-start}
.cal-cell.today .cal-daynum{color:#052975}
.cal-chip{font-size:11px;font-weight:750;border-radius:5px;padding:2px 6px;color:#fff;background:var(--cc,#052975);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.35;cursor:pointer}
.cal-chip[data-locked="1"]{cursor:default}
.cal-more{font-size:10px;color:var(--muted);font-weight:800;padding-left:2px}
.cal-list{margin-top:16px;border-top:1px solid var(--line);padding-top:8px;display:grid;gap:2px}
.cal-li{display:grid;grid-template-columns:auto 152px minmax(0,1fr) auto;gap:12px;align-items:center;padding:9px 4px;border-bottom:1px solid var(--line)}
.cal-li:last-child{border-bottom:0}
.cal-li-dot{width:9px;height:9px;border-radius:50%;flex:none}
.cal-li-date{font-size:12px;font-weight:800;color:var(--muted);white-space:nowrap}
.cal-li-title{font-size:13px;color:var(--ink);font-weight:650;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cal-mine{font-size:9px;font-weight:850;letter-spacing:.06em;text-transform:uppercase;color:var(--navy);background:#e9f3ff;border:1px solid #c8e1fb;border-radius:999px;padding:1px 6px;margin-left:6px;vertical-align:1px}
.cal-li-actions{display:flex;gap:6px;align-items:center;justify-content:flex-end}
.cal-row-btn{width:28px;height:28px;border:1px solid var(--line2);background:#fff;border-radius:7px;color:#475569;cursor:pointer;display:grid;place-items:center;font-size:12px;transition:.13s}
.cal-row-btn:hover{border-color:#94a3b8;background:#f8fafc;color:var(--navy)}
.cal-lock{color:#aab4c4;font-size:12px;width:28px;height:28px;display:grid;place-items:center}
.cal-empty{font-size:13px;color:var(--muted);padding:16px 4px;text-align:center}
@media(max-width:760px){
  .cal-cell{min-height:62px;padding:4px;gap:2px}
  .cal-chip{font-size:9px;padding:1px 4px}
  .cal-daynum{font-size:11px}
  .cal-form-row.two{grid-template-columns:1fr}
  .cal-li{grid-template-columns:auto minmax(0,1fr) auto;gap:6px 10px}
  .cal-li-dot{grid-row:1/3}
  .cal-li-date{grid-column:2;grid-row:1}
  .cal-li-title{grid-column:2;grid-row:2;white-space:normal}
  .cal-li-actions{grid-row:1/3}
}

/* ============================== DARK MODE ============================== */
.theme-toggle{width:34px;height:34px;border:1px solid var(--line2);background:var(--paper);color:var(--ink);border-radius:9px;cursor:pointer;display:grid;place-items:center;font-size:15px;line-height:1;transition:.15s;flex:none}
.theme-toggle>i{display:block;line-height:1}
.theme-toggle>i.fa-moon{transform:translateX(1px)}
.theme-toggle:hover{border-color:#94a3b8}

html[data-theme="dark"]{--ink:#ffffff;--muted:#9aa7be;--paper:#141c2e;--canvas:#0b1120;--panel:#1a2336;--line:#28324a;--line2:#3a465f;--navy:#8ff8ff;--shadow:0 18px 40px -30px rgba(0,0,0,.8)}
html[data-theme="dark"] body{background:var(--canvas)}
html[data-theme="dark"] .topbar{background:rgba(11,17,32,.86)}
html[data-theme="dark"] .theme-toggle:hover{background:var(--panel);border-color:var(--line2)}
html[data-theme="dark"] .brief,html[data-theme="dark"] .watch,html[data-theme="dark"] .metric,html[data-theme="dark"] .section{box-shadow:0 18px 40px -30px rgba(0,0,0,.8)}

/* sidebar */
html[data-theme="dark"] .sidebar{background:#0d1424}
html[data-theme="dark"] .sb-head:hover,html[data-theme="dark"] .sb-sub a:hover{background:rgba(143,248,255,.10)}
html[data-theme="dark"] .sb-head.active{background:rgba(143,248,255,.16)}
html[data-theme="dark"] .sb-brand:hover b{color:var(--ink)}
html[data-theme="dark"] .sb-logout{color:#9aa7be}
html[data-theme="dark"] .sb-logout>i,html[data-theme="dark"] .sb-logout>svg{color:#9aa7be}
html[data-theme="dark"] .sb-logout:hover{color:#8ff8ff}
html[data-theme="dark"] .sb-logout:hover>i,html[data-theme="dark"] .sb-logout:hover>svg{color:#8ff8ff}

/* primary surfaces -> paper */
html[data-theme="dark"] .insight,
html[data-theme="dark"] .toolbar,
html[data-theme="dark"] .search,
html[data-theme="dark"] .chip,
html[data-theme="dark"] .card,
html[data-theme="dark"] .chev,
html[data-theme="dark"] .field,
html[data-theme="dark"] .sources a,
html[data-theme="dark"] .ci-sources a,
html[data-theme="dark"] .ci-item,
html[data-theme="dark"] .ci-arrow,
html[data-theme="dark"] .vi-card,
html[data-theme="dark"] .cal-nav,
html[data-theme="dark"] .cal-today,
html[data-theme="dark"] .cal-cell,
html[data-theme="dark"] .cal-row-btn,
html[data-theme="dark"] .cal-form input[type=text],
html[data-theme="dark"] .cal-form input[type=date],
html[data-theme="dark"] .seo-bar input,
html[data-theme="dark"] .kw-focus-bar input,
html[data-theme="dark"] .imgbank .is-search input,
html[data-theme="dark"] #continia-uploads .cu-block,
html[data-theme="dark"] #continia-uploads .cu-pd,
html[data-theme="dark"] .cmp-row,
html[data-theme="dark"] .cmp-thumb,
html[data-theme="dark"] .kw-chk,
html[data-theme="dark"] .kw-badge{background:var(--paper);color:var(--ink)}

/* secondary surfaces -> panel */
html[data-theme="dark"] .tag,
html[data-theme="dark"] .badge,
html[data-theme="dark"] .pill,
html[data-theme="dark"] .footnote,
html[data-theme="dark"] .yt-table th,
html[data-theme="dark"] .cal-cell.other{background:var(--panel)}

/* hovers / detail */
html[data-theme="dark"] .card:hover,
html[data-theme="dark"] .detail,
html[data-theme="dark"] .chip:hover,
html[data-theme="dark"] .sources a:hover,
html[data-theme="dark"] .cal-nav:hover,
html[data-theme="dark"] .cal-today:hover,
html[data-theme="dark"] .cal-row-btn:hover,
html[data-theme="dark"] #continia-uploads .cu-pd:hover{background:#1b2740}
html[data-theme="dark"] .cal-cell:hover{background:rgba(143,248,255,.25)}
html[data-theme="dark"] .cal-cell.selected{background:rgba(143,248,255,.25)}
html[data-theme="dark"] .cal-cell.today{border-color:rgba(143,248,255,.5);box-shadow:inset 0 0 0 1px rgba(143,248,255,.5)}
html[data-theme="dark"] .cal-form{background:#10182a}
html[data-theme="dark"] .cmp-drop{background:var(--paper)}
html[data-theme="dark"] .yt-table tr.ours{background:#10243a}
html[data-theme="dark"] .insight.primary{background:linear-gradient(180deg,#17223c,#121a2c)}

/* text-color fixes (hardcoded slate -> light) */
html[data-theme="dark"] #continia-uploads .cu-legend,
html[data-theme="dark"] .badge,
html[data-theme="dark"] .cal-btn.ghost,
html[data-theme="dark"] .cal-daynum,
html[data-theme="dark"] .cal-nav,
html[data-theme="dark"] .cal-today,
html[data-theme="dark"] .chip,
html[data-theme="dark"] .ci-sources a,
html[data-theme="dark"] .ci-type,
html[data-theme="dark"] .ev .what,
html[data-theme="dark"] .headline,
html[data-theme="dark"] .kw-focus-sum,
html[data-theme="dark"] .kw-phrase,
html[data-theme="dark"] .kw-table td,
html[data-theme="dark"] .li-pt,
html[data-theme="dark"] .pill,
html[data-theme="dark"] .seo-f,
html[data-theme="dark"] .sources a,
html[data-theme="dark"] .tag,
html[data-theme="dark"] .yt-table td{color:#cbd5e1}
html[data-theme="dark"] #continia-uploads .cu-h,
html[data-theme="dark"] .cal-fl,
html[data-theme="dark"] .cal-row-btn,
html[data-theme="dark"] .chev,
html[data-theme="dark"] .field .ft,
html[data-theme="dark"] .li-carrow,
html[data-theme="dark"] .li-ty,
html[data-theme="dark"] .metric .lbl{color:#9aa7be}

/* stance badges */
html[data-theme="dark"] .stance-ai .badge{color:#8ff8ff;border-color:#2b6f86;background:var(--paper)}
html[data-theme="dark"] .stance-cons .badge{color:#9fd3c4;border-color:#3c6d60;background:var(--paper)}
html[data-theme="dark"] .stance-steady .badge{color:#c79ae0;border-color:#6f4a86;background:var(--paper)}

/* format tag + bars + outlier */
html[data-theme="dark"] .ci-fmt-tag{background:#16263f;color:#8ff8ff;border-color:#2b4a6b}
html[data-theme="dark"] .bar,html[data-theme="dark"] #continia-uploads .cu-bar{background:#26304a}
html[data-theme="dark"] #continia-uploads .cu-bar i.sh{background:#3a465f}
html[data-theme="dark"] #continia-uploads .cu-outlier{background:#241a30;color:#c79ae0;border-color:#4a3560}

/* SEO severities */
html[data-theme="dark"] .seo-item{background:var(--paper)}
html[data-theme="dark"] .seo-item.sev-error{background:#221a2e}
html[data-theme="dark"] .seo-item.sev-warn{background:#2a2412}
html[data-theme="dark"] .seo-item.sev-info{background:#15233b}
html[data-theme="dark"] .seo-item.sev-good{background:#162a24}
html[data-theme="dark"] .sev-warn .seo-sev{color:#e3b94f}
html[data-theme="dark"] .sev-info .seo-sev{color:#8fb6ff}
html[data-theme="dark"] .seo-c.info{color:#8fb6ff}

/* kw chips */
html[data-theme="dark"] .kw-chk.ok{background:#162a24;border-color:#2f5f4d;color:#7fd3b3}
html[data-theme="dark"] .kw-badge.on{background:#16263f;color:#8ff8ff;border-color:#2b4a6b}

/* compress accents */
html[data-theme="dark"] .cmp-drop .cmp-ico,html[data-theme="dark"] .cmp-drop:hover,html[data-theme="dark"] .cmp-drop.drag,html[data-theme="dark"] .cmp-btn.ghost,html[data-theme="dark"] .cmp-spin,html[data-theme="dark"] .imgbank .is-search input:focus{color:#8ff8ff}

/* primary buttons -> header-pill look (faint cyan fill, inno-blue text + stroke) */
html[data-theme="dark"] .cal-btn,
html[data-theme="dark"] .cmp-btn{background:transparent;border-color:#8ff8ff;color:#8ff8ff}
html[data-theme="dark"] .cal-btn:hover,
html[data-theme="dark"] .cmp-btn:hover{background:rgba(143,248,255,.24);border-color:#8ff8ff}
html[data-theme="dark"] .cal-btn.ghost,
html[data-theme="dark"] .cmp-btn.ghost{background:var(--paper);border-color:var(--line2)}
html[data-theme="dark"] .cal-btn.danger{background:var(--paper);color:#c79ae0;border-color:#6f4a86}
html[data-theme="dark"] .chip.active,
html[data-theme="dark"] #continia-uploads .cu-pd.active,
html[data-theme="dark"] .chip.active[data-type="stance"][data-val="all"],
html[data-theme="dark"] .chip.active[data-type="prox"]{background:#C6FBFF;border-color:#C6FBFF;color:#052975}
html[data-theme="dark"] .chip.active[data-type="stance"][data-val="ai"]{background:var(--paper);color:#8ff8ff}
html[data-theme="dark"] .chip.active[data-type="stance"][data-val="cons"]{background:var(--paper);color:#9fd3c4}
html[data-theme="dark"] .chip.active[data-type="stance"][data-val="steady"]{background:var(--paper);color:#c79ae0}

/* dark: category pill matches the cyan format tags; metric number -> inno-blue */
html[data-theme="dark"] .ci-type{background:var(--panel);color:#cbd5e1;border-color:var(--line)}
html[data-theme="dark"] .metric .num{color:#fff}
html[data-theme="dark"] .ci-score{color:#8ff8ff}
html[data-theme="dark"] #linkedin-compare .barline span{color:#8ff8ff}
html[data-theme="dark"] #linkedin-compare .bar i{background:#8ff8ff}
/* dark: LinkedIn engagement expand panel + type pill + row hovers (were stuck light) */
html[data-theme="dark"] .li-detail>td{background:#10182a}
html[data-theme="dark"] .li-ty{background:var(--panel);border-color:var(--line)}
html[data-theme="dark"] .li-row:hover{background:#1b2740}
html[data-theme="dark"] .li-row.ours{background:#10243a}
html[data-theme="dark"] .li-row.ours:hover{background:#16335a}
html[data-theme="dark"] .li-pm b{color:#8ff8ff}
/* dark: thumbnail-bank search focus -> white ring + light text (was navy/blue) */
html[data-theme="dark"] .imgbank .is-search input:focus{border-color:#fff;outline-color:rgba(255,255,255,.3);color:var(--ink)}
html[data-theme="dark"] #youtube .barline span{color:#8ff8ff}
html[data-theme="dark"] #youtube .barline span.down{color:var(--rose)}
html[data-theme="dark"] #youtube .bar i{background:#8ff8ff}
html[data-theme="dark"] #youtube .bar i.down{background:var(--rose)}
html[data-theme="dark"] .cal-cell.today .cal-daynum{color:#fff}
html[data-theme="dark"] .cal-li-dot[style*="052975"]{background:#8ff8ff!important}
html[data-theme="dark"] .cal-form input:focus{outline:2px solid rgba(143,248,255,.35);border-color:#8ff8ff}
html[data-theme="dark"] #cal-f-end{color:#8ff8ff}
html[data-theme="dark"] .cmp-drop .cmp-ico{color:#8ff8ff}
html[data-theme="dark"] #pdf-compress .cmp-thumb{color:#8ff8ff}
html[data-theme="dark"] .cmp-meta .save{color:#8ff8ff}
/* drag-drop boxes: same hover as the buttons (gentle tint + inno-blue accent) */
html[data-theme="dark"] .cmp-drop:hover,html[data-theme="dark"] .cmp-drop.drag{background:rgba(143,248,255,.10);color:#8ff8ff}
/* Clear (ghost) buttons: white text + white-on-hover, gentle tint behind */
html[data-theme="dark"] .cmp-btn.ghost{color:#fff}
html[data-theme="dark"] .cmp-btn.ghost:hover{background:rgba(143,248,255,.10);border-color:var(--line2);color:#fff}
.brief .pill,.brief .pill b{color:#8ff8ff}
.brief .pill{border-color:rgba(143,248,255,.6)}
/* hero/brief is self-contained (navy bg) — force it identical in dark mode */
html[data-theme="dark"] .brief{box-shadow:0 14px 34px -30px rgba(15,23,42,.22)}
html[data-theme="dark"] .brief .pill{background:rgba(143,248,255,.14);border-color:rgba(143,248,255,.6);color:#8ff8ff}
html[data-theme="dark"] .brief .pill b{color:#8ff8ff}

/* dark: competitor filter chips */
/* group A — All (stance+prox) + prox High/Medium/Low: outline only, inno-blue */
/* group A — All(20)/All/High/Medium/Low: styled like the white Clear button */
html[data-theme="dark"] .chip[data-type="prox"],
html[data-theme="dark"] .chip[data-type="stance"][data-val="all"]{background:var(--paper);border-color:var(--line2);color:#fff}
html[data-theme="dark"] .chip.active[data-type="prox"],
html[data-theme="dark"] .chip.active[data-type="stance"][data-val="all"]{background:rgba(143,248,255,.10);border-color:var(--line2);color:#fff}
html[data-theme="dark"] .chip[data-type="prox"]:hover,
html[data-theme="dark"] .chip[data-type="stance"][data-val="all"]:hover{background:rgba(143,248,255,.10);border-color:var(--line2);color:#fff;opacity:1}
/* group B — stance dot chips: always pressed-look, 50% opacity when not active */
html[data-theme="dark"] .chip[data-type="stance"][data-val="ai"]{background:transparent;border-color:#8ff8ff;color:#8ff8ff}
html[data-theme="dark"] .chip[data-type="stance"][data-val="cons"]{background:transparent;border-color:#5f9e8d;color:#9fd3c4}
html[data-theme="dark"] .chip[data-type="stance"][data-val="steady"]{background:transparent;border-color:#983eae;color:#c79ae0}
html[data-theme="dark"] .chip[data-type="stance"][data-val="ai"]:not(.active),
html[data-theme="dark"] .chip[data-type="stance"][data-val="cons"]:not(.active),
html[data-theme="dark"] .chip[data-type="stance"][data-val="steady"]:not(.active){opacity:.5}
html[data-theme="dark"] .chip[data-type="prox"]:not(.active),
html[data-theme="dark"] .chip[data-type="stance"][data-val="all"]:not(.active){opacity:.5}

/* dark sidebar: group heads white when inactive, inno-blue when active (text + icon) */
html[data-theme="dark"] .sb-head{color:#fff}
html[data-theme="dark"] .sb-head>i:first-child,html[data-theme="dark"] .sb-head>svg:first-child{color:#fff}
html[data-theme="dark"] .sb-head.active,
html[data-theme="dark"] .sb-head.active>i:first-child,
html[data-theme="dark"] .sb-head.active>svg:first-child{color:#fff}
html[data-theme="dark"] .sb-sub a.active,
html[data-theme="dark"] .sb-sub a.active>i,
html[data-theme="dark"] .sb-sub a:hover>i{color:#fff}
html[data-theme="dark"] .sb-sub a.active>svg,
html[data-theme="dark"] .sb-sub a:hover>svg{color:#fff}
.cal-form[hidden]{display:none}
html[data-theme="dark"] .sb-head:hover,
html[data-theme="dark"] .sb-head:hover>i:first-child,
html[data-theme="dark"] .sb-head:hover>svg:first-child,
html[data-theme="dark"] .sb-sub a:hover,
html[data-theme="dark"] .sb-sub a:hover>i,
html[data-theme="dark"] .sb-sub a:hover>svg{color:#fff}
/* dark: period buttons match competitor filter chips (outline, 50% dim when inactive) */
html[data-theme="dark"] #continia-uploads .cu-pd,
html[data-theme="dark"] #continia-uploads .cu-pd.active{background:transparent;border-color:#fff;color:#fff}
html[data-theme="dark"] #continia-uploads .cu-pd:not(.active){opacity:.5}
html[data-theme="dark"] #continia-uploads .cu-pd.active{opacity:1}
html[data-theme="dark"] .field .stat{color:#8ff8ff}
/* video ideas: pill removed -> copy/score/arrow only, left-aligned */
#video-ideas .ci-row{grid-template-columns:minmax(0,1fr) 82px 32px}
/* dark: long-form upload bar + legend swatch -> inno-blue */
html[data-theme="dark"] #continia-uploads .cu-bar i.lf{background:#8ff8ff}
html[data-theme="dark"] #continia-uploads .cu-legend .sw.lf{background:#8ff8ff}

/* ===== Content-gap analysis (home) — theme bullet-bars, Continia vs field ===== */
/* ===== Content-Gap Analysis — "The Quiet Map" =====
   navy = Continia's voice · purple #983eae = the gap (conversation without us)
   cyan = the brand spark / hero figure · green = where we lead */
#content-gap{--cg-gap:#983eae;--cg-lead:#3f7d6c}
#content-gap .cg-wrap{padding:0}

/* --- hero band: the thesis --- */
.cg-hero{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:28px;align-items:end;padding:28px 26px 26px;background:#052975 url('./Assets/Dashboard_images_export.jpg') center/cover no-repeat;color:#eaf2ff}
.cg-hero-bg{z-index:0}
.cg-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(102deg,rgba(4,16,48,.93) 0%,rgba(5,26,74,.66) 52%,rgba(8,14,38,.16) 100%);z-index:1;pointer-events:none}
.cg-hero-main{position:relative;z-index:2}
.cg-eyebrow{font-size:11px;font-weight:850;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);margin-bottom:8px}
.cg-sov{display:flex;align-items:baseline;gap:3px;line-height:.86}
.cg-sov span{font-size:74px;font-weight:850;color:var(--cyan);letter-spacing:-.025em}
.cg-sov i{font-size:30px;font-weight:800;color:var(--cyan);font-style:normal}
.cg-verdict{margin:14px 0 0;max-width:58ch;font-size:15px;line-height:1.5;color:#d7e3fa}
.cg-verdict b{color:#fff;font-weight:800}
.cg-hero-side{position:relative;display:flex;flex-direction:column;align-items:flex-end;gap:9px;white-space:nowrap;z-index:2}
.cg-hero-side label{font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#9fb6e6}
.cg-hero-side select{font:inherit;font-size:13px;font-weight:750;color:#06204f;background:#fff;border:0;border-radius:9px;padding:9px 13px;cursor:pointer;box-shadow:0 6px 16px -8px rgba(0,0,0,.6)}
.cg-hero-side select:focus{outline:2px solid var(--cyan);outline-offset:2px}
.cg-captured{font-size:12px;color:#94abda}

/* --- context cards --- */
.cg-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:20px 26px 6px}
.cg-mcard{background:var(--panel);border:1px solid var(--line);border-radius:11px;padding:15px 16px}
.cg-mcard .lbl{font-size:10.5px;font-weight:850;letter-spacing:.07em;text-transform:uppercase;color:#64748b;margin-bottom:8px}
.cg-mcard .val{font-size:31px;font-weight:850;color:var(--navy);line-height:1}
.cg-mcard .val small{font-size:17px;color:var(--muted);font-weight:800}
.cg-mcard .sub{font-size:12px;margin-top:8px;color:var(--muted);line-height:1.35}
.cg-mcard .sub b{font-weight:850;color:var(--ink)}
.cg-mcard .sub.ahead b{color:#983eae}
.cg-mcard .sub.behind b{color:#052975}

/* --- chart --- */
.cg-chart{padding:14px 26px 6px}
.cg-legend{display:flex;align-items:center;gap:20px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin:4px 0 14px}
.cg-legend i{display:inline-block;width:16px;height:10px;border-radius:3px;margin-right:7px;vertical-align:middle}
.cg-legend .sw-you{background:#052975}
.cg-legend .sw-gap{background:#d0d8e4}
.cg-legend .cg-scale{margin-left:auto;color:#9aa3b6}
.cg-row{display:grid;grid-template-columns:202px minmax(0,1fr) 52px;align-items:center;gap:18px;padding:11px 0;border-top:1px solid var(--line)}
.cg-row:first-child{border-top:0}
.cg-theme b{display:block;font-size:13.5px;font-weight:750;color:var(--ink);line-height:1.2}
.cg-rsub{display:block;font-size:11.5px;color:#94a3b6;margin-top:3px;font-variant-numeric:tabular-nums}
.cg-flag{display:inline-block;margin:4px 0 1px;font-size:9.5px;font-weight:850;letter-spacing:.05em;text-transform:uppercase;color:#052975}
.cg-track{position:relative;height:26px;background:#e2e8f0;border-radius:8px;overflow:hidden}
.cg-track i{position:absolute;top:0;height:100%;transition:width .45s cubic-bezier(.4,0,.2,1),left .45s cubic-bezier(.4,0,.2,1)}
.cg-track .cg-you{left:0;background:#052975}
.cg-track .cg-them{background:#d0d8e4}
.cg-pct{font-size:14px;font-weight:850;text-align:right;font-variant-numeric:tabular-nums;color:#052975}

/* --- gaps to close --- */
.cg-gaps{padding:18px 26px 24px}
.cg-gaps h3{font-size:11px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;color:#64748b;margin:0 0 11px}
.cg-gap{display:flex;align-items:center;gap:16px;padding:13px 15px;border:1px solid var(--line);border-radius:11px;background:#fff;margin-bottom:9px}
.cg-gap:last-child{margin-bottom:0}
.cg-gnum{font-size:27px;font-weight:850;color:#052975;line-height:1;min-width:30px;text-align:center;font-variant-numeric:tabular-nums}
.cg-gmain{flex:1;min-width:0}
.cg-gt{font-size:14px;font-weight:800;color:var(--ink)}
.cg-gs{font-size:12.5px;color:var(--muted);margin-top:3px}
.cg-none{padding:14px;border:1px dashed var(--line2);border-radius:11px;color:var(--muted);font-size:13px}
@media(max-width:680px){
  .cg-hero{grid-template-columns:1fr;align-items:start;padding:22px 18px}
  .cg-hero-side{align-items:flex-start}
  .cg-sov span{font-size:60px}
  .cg-cards{grid-template-columns:1fr;padding:18px 18px 4px}
  .cg-chart,.cg-gaps{padding-left:18px;padding-right:18px}
  .cg-row{grid-template-columns:128px minmax(0,1fr) 44px;gap:11px}
}
/* dark */
html[data-theme="dark"] #content-gap{--cg-gap:#c98be0;--cg-lead:#86efac}
html[data-theme="dark"] .cg-hero-side select{background:#0b1120;color:#dbe7ff}
html[data-theme="dark"] .cg-mcard{background:var(--panel);border-color:var(--line)}
html[data-theme="dark"] .cg-mcard .val{color:var(--cyan)}
html[data-theme="dark"] .cg-mcard .sub b{color:#fff}
html[data-theme="dark"] .cg-mcard .sub.ahead b{color:#c98be0}
html[data-theme="dark"] .cg-mcard .sub.behind b{color:#8ff8ff}
html[data-theme="dark"] .cg-track{background:#28324a}
html[data-theme="dark"] .cg-track .cg-them{background:rgba(143,248,255,.15)}
html[data-theme="dark"] .cg-legend .sw-gap{background:rgba(143,248,255,.15)}
html[data-theme="dark"] .cg-legend .sw-you{background:#8ff8ff}
html[data-theme="dark"] .cg-track .cg-you{background:#8ff8ff}
html[data-theme="dark"] .cg-flag{color:#8ff8ff}
html[data-theme="dark"] .cg-pct{color:#8ff8ff}
html[data-theme="dark"] .cg-gnum{color:#8ff8ff}
html[data-theme="dark"] .cg-gap{background:#161f33;border-color:var(--line)}
html[data-theme="dark"] .cg-none{border-color:var(--line2)}

/* ---- Market map ---------------------------------------------------------- */
.mm-wrap{padding:14px}
.mm-stage{position:relative;border:1px solid var(--line);border-radius:10px;background:var(--canvas);overflow:hidden}
.mm-map{display:block;min-height:160px;color:var(--muted);font-size:13px;padding:0}
.mm-map .mm-svg{display:block;width:100%;height:auto}
.mm-svg path{fill:#ccd3dd;stroke:var(--canvas);stroke-width:.6;transition:fill .15s}
.mm-svg .mm-c{cursor:pointer}
.mm-svg .mm-live{fill:rgba(5,41,117,.5)}
.mm-svg .mm-c:hover{fill:#2f5fe0}
.mm-svg .mm-live.mm-c:hover{fill:#052975}
.mm-svg .mm-sel{fill:#2f5fe0}
.mm-svg .mm-live.mm-sel{fill:#052975}
.mm-card{position:absolute;z-index:6;min-width:208px;max-width:268px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 26px 64px -24px rgba(15,23,42,.55);padding:14px 14px 12px}
.mm-card[hidden]{display:none}
.mm-x{position:absolute;top:5px;right:7px;border:0;background:none;font-size:20px;line-height:1;color:var(--muted);cursor:pointer;padding:2px 6px;border-radius:6px}
.mm-x:hover{background:#f1f5f9;color:var(--ink)}
.mm-title{font-size:16px;font-weight:850;color:var(--ink);margin:0 18px 6px 0;letter-spacing:-.01em}
.mm-sub{font-size:10px;font-weight:850;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin:11px 0 5px}
.mm-row{display:flex;align-items:center;gap:8px;font-size:13px;color:#334155;padding:3px 0}
.mm-row.continia{font-size:14px;color:var(--ink)}
.mm-row.continia b{position:relative;top:1px}
.mm-dot{width:8px;height:8px;border-radius:50%;background:#94a3b8;flex:none}
.mm-dot.live{background:var(--navy)}
.mm-dot.off{background:var(--rose)}
.mm-badge{margin-left:auto;font-size:10px;font-weight:850;letter-spacing:.05em;text-transform:uppercase;background:var(--navy);color:#fff;border-radius:999px;padding:4px 8px 2px}
.mm-none{font-size:12.5px;color:var(--muted);margin-top:6px}
.mm-legend{display:flex;align-items:center;flex-wrap:wrap;gap:14px;padding:12px 2px 2px}
.mm-leg{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--muted);font-weight:650}
.mm-sw{width:12px;height:12px;border-radius:3px;display:inline-block}
.mm-sw.live{background:var(--navy)}
.mm-sw.idle{background:#ccd3dd}
.mm-leg-chips{display:flex;flex-wrap:wrap;gap:6px;margin-left:auto}
.mm-chip{border:1px solid var(--line2);background:#fff;color:#334155;border-radius:999px;padding:5px 10px;font-size:11.5px;font-weight:700;cursor:pointer;transition:.15s}
.mm-chip:hover{border-color:var(--navy);color:var(--navy)}
html[data-theme="dark"] .mm-svg path{fill:#2b3855}
html[data-theme="dark"] .mm-svg .mm-live{fill:rgba(143,248,255,.5)}
html[data-theme="dark"] .mm-svg .mm-c:hover{fill:rgba(143,248,255,.75)}
html[data-theme="dark"] .mm-svg .mm-live.mm-c:hover{fill:rgba(143,248,255,.75)}
html[data-theme="dark"] .mm-svg .mm-sel{fill:rgba(143,248,255,.75)}
html[data-theme="dark"] .mm-card{background:var(--panel);border-color:var(--line2)}
html[data-theme="dark"] .mm-x:hover{background:rgba(255,255,255,.08)}
html[data-theme="dark"] .mm-row{color:#cbd5e1}
html[data-theme="dark"] .mm-dot{background:#64748b}
html[data-theme="dark"] .mm-dot.live{background:#8ff8ff}
html[data-theme="dark"] .mm-badge{background:#8ff8ff;color:#052975}
html[data-theme="dark"] .mm-sw.live{background:#8ff8ff}
html[data-theme="dark"] .mm-sw.idle{background:#2b3855}
html[data-theme="dark"] .mm-chip{background:var(--panel);border-color:var(--line2);color:#cbd5e1}
html[data-theme="dark"] .mm-chip:hover{border-color:#8ff8ff;color:#8ff8ff}

/* ---- Lightbox download button (mirrors the close ×, sits to its left) ---- */
.is-lb-dl{position:fixed;top:18px;right:76px;width:42px;height:42px;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center}
.is-lb-dl:hover{background:rgba(255,255,255,.24)}
.is-lb-dl svg{width:20px;height:20px;display:block}

/* ---- Methodology dropdown + optically-centered bullet dots ---- */
.method>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:pointer;list-style:none}
.method>summary::-webkit-details-marker{display:none}
.method>summary h2{margin:0}
.method-chev{font-size:22px;line-height:1;color:var(--cyan);transition:transform .2s;flex:none}
.method[open] .method-chev{transform:rotate(90deg)}
.method[open] ul{margin-top:14px}
.method li:before{top:5px}

/* ---- E-invoicing timeline (alternating horizontal timeline; themes via vars) ---- */
.tl{overflow-x:auto;padding:10px 6px 6px}
.tl-row{position:relative;min-width:820px;height:300px}
.tl-row:before{content:"";position:absolute;left:0;right:0;top:50%;height:2px;background:var(--line2);transform:translateY(-50%)}
.tl-item{position:absolute;top:0;height:100%;width:0}
.tl-node{position:absolute;top:50%;left:0;width:13px;height:13px;border-radius:50%;background:var(--paper);border:2px solid var(--line2);transform:translate(-50%,-50%);z-index:2}
.tl-node.done{background:var(--navy);border-color:var(--navy)}
.tl-stem{position:absolute;left:0;width:2px;background:var(--line2);transform:translateX(-50%)}
.tl-up .tl-stem{bottom:50%;height:30px}
.tl-down .tl-stem{top:50%;height:30px}
.tl-card{position:absolute;left:-3px;width:160px;display:flex;flex-direction:column;gap:7px}
.tl-up .tl-card{bottom:calc(50% + 30px)}
.tl-down .tl-card{top:calc(50% + 30px);flex-direction:column-reverse}
.tl-date{align-self:flex-start;font-size:12.5px;font-weight:800;color:#fff;background:#052975;border:1px solid #052975;border-radius:999px;padding:5px 12px}
.tl-text{display:flex;flex-direction:column;gap:2px}
.tl-text b{font-size:13px;color:var(--ink);line-height:1.2;text-wrap:balance}
.tl-text span{font-size:12px;color:var(--muted);line-height:1.4;text-wrap:balance}
html[data-theme="dark"] .tl-node{background:var(--paper)}
html[data-theme="dark"] .tl-node.done{background:#8ff8ff;border-color:#8ff8ff}
html[data-theme="dark"] .tl-date{background:var(--panel);border-color:var(--line2);color:#8ff8ff;font-weight:700}

/* ---- AppSource Intelligence ---- */
.as-wrap{padding:16px 18px 6px}
.as-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}
.as-stat{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px 15px}
.as-v{font-size:26px;font-weight:850;color:var(--navy);line-height:1}
.as-l{font-size:11px;font-weight:850;letter-spacing:.05em;text-transform:uppercase;color:#475569;margin-top:9px}
.as-s{font-size:11.5px;color:var(--muted);margin-top:4px;line-height:1.35}
.as-table{width:100%;border-collapse:collapse;font-size:13px;min-width:760px}
.as-table th{padding:10px 12px;text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:#64748b;background:#f8fafc;border-bottom:1px solid var(--line)}
.as-table th.num,.as-table td.num{text-align:right}
.as-table td{padding:11px 12px;border-bottom:1px solid var(--line);color:#334155;vertical-align:top}
.as-table tr.ours td{background:#f0fdff}
.as-grp td{background:#eef2f9!important;font-size:10.5px;font-weight:850;letter-spacing:.06em;text-transform:uppercase;color:#475569;padding:7px 12px}
.as-name{font-weight:850;color:var(--ink);display:flex;align-items:center;gap:8px;flex-wrap:wrap;line-height:1.15}
.as-cat{font-size:11.5px;color:var(--muted);margin-top:3px}
.as-tag{font-size:9.5px;font-weight:850;letter-spacing:.05em;text-transform:uppercase;background:var(--navy);color:#fff;border-radius:999px;padding:2px 7px}
.as-rate{display:inline-flex;align-items:center;gap:8px}
.as-stars{position:relative;display:inline-block;font-size:14px;line-height:1;letter-spacing:1px;color:#d5dbe6;font-family:Arial,Helvetica,sans-serif}
.as-stars-f{position:absolute;left:0;top:0;overflow:hidden;white-space:nowrap;color:var(--navy)}
.as-rate b{font-size:13px;color:var(--ink);font-weight:850}
.as-nostar{font-size:12px;color:#94a3b6;font-style:italic}
.as-w{color:var(--muted);font-weight:600;font-size:11.5px}
.as-when{font-weight:750;color:var(--ink);white-space:nowrap}
.as-badge{display:inline-block;font-size:9.5px;font-weight:850;letter-spacing:.04em;text-transform:uppercase;border-radius:999px;padding:2px 7px}
.as-badge.fresh{background:rgba(95,158,141,.16);color:#3f7d68}
.as-badge.aging{background:rgba(152,62,174,.13);color:#8a37a0}
.as-badge.stale{background:#f1f5f9;color:#64748b}
.as-theme{color:var(--muted);font-size:12px;line-height:1.4;max-width:340px}
.as-also{display:block;margin-top:4px;font-size:11px;font-weight:750;color:#475569}
.as-ag-head{display:flex;flex-direction:column;gap:2px;margin:20px 0 11px}
.as-ag-head b{font-size:13.5px;color:var(--ink)}
.as-ag-head span{font-size:11.5px;color:var(--muted)}
.as-ag{display:grid;gap:8px}
.as-ag-row{display:grid;grid-template-columns:206px 58px minmax(70px,1fr) auto;align-items:center;gap:12px}
.as-ag-n{font-weight:750;color:var(--ink);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.as-ag-tag{display:inline-block;margin-left:7px;font-size:9px;font-weight:850;letter-spacing:.04em;text-transform:uppercase;background:var(--navy);color:#fff;border-radius:999px;padding:2px 6px;vertical-align:1px}
.as-ag-row.own .as-ag-n{color:var(--navy);font-weight:850;overflow:visible}
.as-ag-row.own .as-ag-r{color:var(--navy)}
.as-ag-r{font-size:11.5px;font-weight:800;color:var(--navy)}
.as-ag-bar{height:8px;background:#eaf0f7;border-radius:999px;overflow:hidden}
.as-ag-bar i{display:block;height:100%;min-width:5px;background:var(--navy);border-radius:999px}
.as-ag-k{font-size:12px;font-weight:800;color:var(--ink);text-align:right;white-space:nowrap}
.as-ag-note{font-weight:600;color:var(--muted)}
html[data-theme="dark"] .as-stat{background:var(--panel);border-color:var(--line2)}
html[data-theme="dark"] .as-v{color:#8ff8ff}
html[data-theme="dark"] .as-table th{background:rgba(255,255,255,.03);color:#94a3b8;border-color:var(--line2)}
html[data-theme="dark"] .as-table td{border-color:var(--line2);color:#cbd5e1}
html[data-theme="dark"] .as-table tr.ours td{background:rgba(143,248,255,.07)}
html[data-theme="dark"] .as-grp td{background:rgba(255,255,255,.05)!important;color:#cbd5e1}
html[data-theme="dark"] .as-name{color:#fff}
html[data-theme="dark"] .as-tag{background:#8ff8ff;color:#052975}
html[data-theme="dark"] .as-stars{color:#3a475f}
html[data-theme="dark"] .as-stars-f{color:#8ff8ff}
html[data-theme="dark"] .as-rate b{color:#fff}
html[data-theme="dark"] .as-when{color:#fff}
html[data-theme="dark"] .as-badge.fresh{background:rgba(95,158,141,.22);color:#5f9e8d}
html[data-theme="dark"] .as-badge.aging{background:rgba(152,62,174,.28);color:#d6a6e6}
html[data-theme="dark"] .as-badge.stale{background:rgba(255,255,255,.06);color:#94a3b8}
html[data-theme="dark"] .as-also{color:#94a3b8}
html[data-theme="dark"] .as-ag-r{color:#8ff8ff}
html[data-theme="dark"] .as-ag-bar{background:rgba(255,255,255,.08)}
html[data-theme="dark"] .as-ag-bar i{background:#8ff8ff}
html[data-theme="dark"] .as-ag-k{color:#fff}
html[data-theme="dark"] .as-ag-tag{background:#8ff8ff;color:#052975}
html[data-theme="dark"] .as-ag-row.own .as-ag-n,html[data-theme="dark"] .as-ag-row.own .as-ag-r{color:#8ff8ff}
@media(max-width:760px){.as-stats{grid-template-columns:repeat(2,1fr)}.as-ag-row{grid-template-columns:150px 46px 1fr auto;gap:8px}}

/* ---- module heading icon (mirrors the sidebar nav icon) ---- */
.section-head h2{display:inline-flex;align-items:center;gap:10px;line-height:1}
.h2-ico{color:var(--navy);font-size:18px;line-height:1;flex:none;transform:translateY(-1px)}
html[data-theme="dark"] .h2-ico{color:#8ff8ff}

/* ---- Battlecards + head-to-head comparator ---- */
.bc-wrap{padding:16px 18px 6px}
.bc-cmp{border:1px solid var(--line);border-radius:10px;background:var(--panel);padding:14px 16px;margin-bottom:18px}
.bc-cmp-top{display:flex;align-items:center;gap:10px;margin-bottom:13px;flex-wrap:wrap}
.bc-vs-us{font-weight:850;color:var(--navy);font-size:15px}
.bc-vs-x{font-size:11px;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.bc-select{height:36px;border:1px solid var(--line2);border-radius:8px;padding:0 10px;background:var(--paper);color:var(--ink);font:inherit;font-size:13px;font-weight:700;min-width:210px;cursor:pointer}
.bc-cmp-grid{display:grid;grid-template-columns:132px 1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:8px;overflow:hidden}
.bc-cmp-grid>div{background:var(--paper);padding:10px 12px;font-size:12.5px;line-height:1.42}
.bc-cmp-grid .us{background:#f4f8ff}
.bc-rowlbl{font-size:10.5px;font-weight:850;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center}
.bc-head{font-weight:850;font-size:14px;color:var(--ink);display:flex;align-items:center;gap:8px}
.bc-head.us{color:var(--navy)}
.bc-cell{color:var(--ink)}
.bc-cell.them{color:var(--muted)}
.bc-win{margin-top:12px;border:1px solid var(--line);border-radius:8px;background:var(--paper);padding:12px 14px}
.bc-win h5{margin:0 0 6px;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--navy);font-weight:850}
.bc-win ul{margin:0;padding-left:18px;display:grid;gap:5px}
.bc-win li{font-size:13px;color:var(--ink);line-height:1.45}
.bc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}
.bc-col{display:flex;flex-direction:column;gap:12px;min-width:0}
.bc-card{border:1px solid var(--line);border-radius:10px;background:var(--paper);overflow:hidden;height:max-content}
.bc-card[open]{border-color:var(--line2)}
.bc-cardhead{list-style:none;display:flex;align-items:center;gap:10px;padding:13px 14px;cursor:pointer}
.bc-cardhead::-webkit-details-marker{display:none}
.bc-cardhead .dot{flex:none}
.bc-cardhead b{font-size:14.5px;color:var(--ink);font-weight:850}
.bc-cat{font-size:11.5px;color:var(--muted);flex:1;min-width:60px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bc-prox{font-size:10px;font-weight:850;letter-spacing:.04em;text-transform:uppercase;border-radius:999px;padding:3px 8px;background:var(--canvas);color:var(--muted);flex:none}
.bc-p-High{background:rgba(5,41,117,.10);color:var(--navy)}
.bc-chev{font-size:17px;color:var(--muted);transition:transform .2s;flex:none}
.bc-card[open] .bc-chev{transform:rotate(90deg)}
.bc-cardbody{padding:12px 14px 14px;border-top:1px solid var(--line);display:grid;gap:13px}
.bc-sec h5{margin:0 0 5px;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;font-weight:850;color:var(--muted)}
.bc-sec p{margin:0;font-size:13px;color:var(--ink);line-height:1.45}
.bc-sub{color:var(--muted)!important;margin-top:4px!important;font-size:12.5px!important}
.bc-sec ul{margin:0;padding-left:17px;display:grid;gap:4px}
.bc-sec li{font-size:12.5px;color:var(--ink);line-height:1.42}
.bc-sec.sec-win h5{color:#3f7d68}
.bc-sec.sec-win li::marker{color:#5f9e8d}
.bc-sec.sec-watch h5{color:#983eae}
.bc-sec.sec-watch li::marker{color:#983eae}
.bc-obj{display:grid;gap:2px;padding-top:8px;margin-top:8px;border-top:1px dashed var(--line)}
.bc-obj:first-of-type{border-top:0;margin-top:0;padding-top:0}
.bc-q{font-size:12.5px;font-weight:800;color:var(--ink)}
.bc-a{font-size:12.5px;color:var(--muted);line-height:1.45}
.bc-empty{font-size:12px;color:var(--muted);font-style:italic}
html[data-theme="dark"] .bc-cmp-grid .us{background:#182742}
html[data-theme="dark"] .bc-vs-us,html[data-theme="dark"] .bc-head.us,html[data-theme="dark"] .bc-win h5{color:#8ff8ff}
html[data-theme="dark"] .bc-p-High{background:rgba(143,248,255,.14);color:#8ff8ff}
html[data-theme="dark"] .bc-sec.sec-win h5{color:#5f9e8d}
html[data-theme="dark"] .bc-sec.sec-win li::marker{color:#5f9e8d}
html[data-theme="dark"] .bc-sec.sec-watch h5{color:#983eae}
html[data-theme="dark"] .bc-sec.sec-watch li::marker{color:#983eae}
.bc-cmp-tac{margin-top:12px;border:1px solid var(--line);border-radius:8px;background:var(--paper);padding:12px 14px;display:grid;gap:13px}
.bc-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.bc-chips{display:flex;gap:6px;flex-wrap:wrap}
.bc-chip{border:1px solid var(--line2);background:var(--paper);color:var(--muted);border-radius:8px;padding:6px 11px;font:inherit;font-size:12px;font-weight:750;cursor:pointer;transition:.15s}
.bc-chip:hover{border-color:var(--navy);color:var(--navy)}
.bc-chip.active{background:var(--navy);color:#fff;border-color:var(--navy)}
.bc-search{flex:1;min-width:180px;height:36px;border:1px solid var(--line2);border-radius:8px;padding:0 12px;background:var(--paper);color:var(--ink);font:inherit;font-size:13px}
.bc-count{font-size:12px;color:var(--muted);font-weight:700;white-space:nowrap}
.bc-noresult{grid-column:1/-1;padding:24px;text-align:center;color:var(--muted);font-size:13px}
.bc-reviewed{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--muted);font-weight:650}
.bc-rev-dot{width:7px;height:7px;border-radius:50%;background:#5f9e8d;flex:none}
.bc-reviewed.stale .bc-rev-dot{background:var(--amber)}
.bc-copy{align-self:start;display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line2);background:var(--paper);color:var(--navy);border-radius:8px;padding:7px 12px;font:inherit;font-size:12px;font-weight:750;cursor:pointer;width:max-content;transition:.15s}
.bc-copy:hover{background:var(--navy);color:#fff;border-color:var(--navy)}
html[data-theme="dark"] .bc-chip:hover{border-color:#8ff8ff;color:#8ff8ff}
html[data-theme="dark"] .bc-chip.active{background:#8ff8ff;color:#052975;border-color:#8ff8ff}
html[data-theme="dark"] .bc-copy{color:#8ff8ff}
html[data-theme="dark"] .bc-copy:hover{background:#8ff8ff;color:#052975;border-color:#8ff8ff}
@media(max-width:900px){.bc-grid{grid-template-columns:1fr}}
@media(max-width:600px){.bc-cmp-grid{grid-template-columns:1fr;gap:0}.bc-cmp-grid>div{border-bottom:1px solid var(--line)}}

/* Latest News module (index) — reuses the .events/.ev feed, made compact + scrollable */
.news-legend{display:flex;flex-wrap:wrap;gap:16px;padding:12px 16px;border-bottom:1px solid var(--line);background:var(--paper)}
.news-legend .lg{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:750;color:var(--muted)}
.news-legend .lg i{width:9px;height:9px;border-radius:50%;display:inline-block;flex:none}
#news .events{max-height:420px;overflow-y:auto;padding:6px 16px 10px}
#news .ev:first-child{padding-top:6px}

/* Site-wide load-in reveal (fade + slide-up) — matches the Continia web easing.
   Gated on html.reveal-on, which the <head> sets pre-paint only when
   IntersectionObserver is available and reduced-motion is not requested, so a
   no-JS / reduced-motion / old browser never hides content. */
html.reveal-on .workspace>*{opacity:0;transform:translateY(18px);transition:opacity 640ms cubic-bezier(.16,1,.3,1),transform 640ms cubic-bezier(.16,1,.3,1);will-change:opacity,transform}
html.reveal-on .workspace>.rv-in{opacity:1;transform:none}

/* Video asset library (video page) — Tech Blue tiles with an Innovation-cyan glow
   that enters at the top-left corner and fades out toward the bottom-right, over a
   black-to-transparent wash running the same diagonal. Built only from the brand
   palette: Tech Blue #052975 ground, Innovation cyan #8ff8ff glow, white glyph.
   The base rule is the light-mode version (more vivid Tech Blue so it sits well on
   the white card); html[data-theme="dark"] deepens the ground for the dark canvas. */
.va-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;padding:24px}
.va-tile{position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;aspect-ratio:1/1;border:0;border-radius:15px;text-decoration:none;padding:14px;text-align:center;overflow:hidden;background:linear-gradient(rgba(5,41,117,.42),rgba(5,41,117,.42)),radial-gradient(68% 58% at 50% 44%,rgba(143,248,255,.62) 0%,rgba(143,248,255,.22) 46%,rgba(143,248,255,0) 74%),linear-gradient(180deg,rgba(0,0,0,.46) 0%,rgba(0,0,0,.62) 62%,rgba(0,0,0,.46) 100%),#052975;box-shadow:inset 0 0 0 2px rgba(5,41,117,.42),inset 0 0 0 2px rgba(143,248,255,.92),inset 0 0 26px -8px rgba(143,248,255,.45),0 0 20px -10px rgba(143,248,255,.45),0 12px 28px -22px rgba(5,41,117,.6);transition:transform .26s cubic-bezier(.16,1,.3,1),box-shadow .26s ease,background .26s ease}
.va-tile:hover{transform:translateY(-7px);background:linear-gradient(rgba(5,41,117,.34),rgba(5,41,117,.34)),radial-gradient(68% 58% at 50% 44%,rgba(143,248,255,.8) 0%,rgba(143,248,255,.3) 46%,rgba(143,248,255,0) 74%),linear-gradient(180deg,rgba(0,0,0,.38) 0%,rgba(0,0,0,.54) 62%,rgba(0,0,0,.38) 100%),#052975;box-shadow:inset 0 0 0 2px rgba(5,41,117,.3),inset 0 0 0 2px rgba(143,248,255,1),inset 0 0 32px -8px rgba(143,248,255,.58),0 0 30px -8px rgba(143,248,255,.6),0 20px 36px -22px rgba(5,41,117,.65)}
.va-tile:before,.va-tile:after{content:"";position:absolute;z-index:-1;pointer-events:none}.va-tile:before{left:6%;right:6%;bottom:-17%;height:34%;border-radius:50%;background:radial-gradient(closest-side,rgba(5,41,117,.34),rgba(5,41,117,.18) 52%,rgba(5,41,117,0) 100%),radial-gradient(closest-side,rgba(143,248,255,1),rgba(143,248,255,.5) 52%,rgba(143,248,255,0) 100%);filter:blur(7px);transition:transform .26s ease,opacity .26s ease}html[data-theme="dark"] .va-tile:before{background:radial-gradient(closest-side,rgba(143,248,255,1),rgba(143,248,255,.5) 52%,rgba(143,248,255,0) 100%)}.va-tile:after{inset:2px;border-radius:13px;background:linear-gradient(180deg,rgba(255,255,255,.12) 0%,rgba(255,255,255,0) 34%);mix-blend-mode:screen}.va-tile:hover:before{transform:scale(1.08)}
.va-tile:focus-visible{outline:3px solid #8ff8ff;outline-offset:3px}
.va-ic{font-size:34px;line-height:1;color:#fff;filter:drop-shadow(0 0 10px rgba(143,248,255,.55))}
.va-lbl{font-size:12.5px;font-weight:850;line-height:1.2;letter-spacing:.01em;color:#fff}
/* dark canvas: same diagonal cyan glow, deeper ground so the tile reads against the dark page */
html[data-theme="dark"] .va-ic{color:#8ff8ff;filter:drop-shadow(0 0 12px rgba(143,248,255,.55))}
html[data-theme="dark"] .va-lbl{color:#8ff8ff}
html[data-theme="dark"] .va-tile{background:radial-gradient(68% 58% at 50% 44%,rgba(143,248,255,.36) 0%,rgba(143,248,255,.12) 46%,rgba(143,248,255,0) 74%),linear-gradient(180deg,rgba(0,0,0,.66) 0%,rgba(0,0,0,.8) 62%,rgba(0,0,0,.66) 100%),#052975;box-shadow:inset 0 0 0 2px rgba(143,248,255,.5),inset 0 0 26px -8px rgba(143,248,255,.42),0 0 22px -8px rgba(143,248,255,.4),0 12px 30px -24px rgba(0,0,0,.7)}
html[data-theme="dark"] .va-tile:hover{background:radial-gradient(68% 58% at 50% 44%,rgba(143,248,255,.5) 0%,rgba(143,248,255,.18) 46%,rgba(143,248,255,0) 74%),linear-gradient(180deg,rgba(0,0,0,.58) 0%,rgba(0,0,0,.72) 62%,rgba(0,0,0,.58) 100%),#052975;box-shadow:inset 0 0 0 2px rgba(143,248,255,.8),inset 0 0 32px -8px rgba(143,248,255,.55),0 0 32px -6px rgba(143,248,255,.55),0 20px 38px -24px rgba(0,0,0,.72)}
@media(max-width:820px){.va-grid{grid-template-columns:repeat(3,1fr);padding:18px}.va-ic{font-size:38px}.va-lbl{font-size:13px}}
@media(max-width:480px){.va-grid{grid-template-columns:repeat(2,1fr)}}

/* competitor card: vendor website link (first chip in .sources) */
.sources a.wsite{border-color:var(--navy);color:var(--navy);font-weight:850}
.sources a.wsite:hover{background:#f5f9ff}
html[data-theme="dark"] .sources a.wsite{border-color:var(--cyan);color:var(--cyan)}

/* LinkedIn module: per-post date, link-out arrow, and the window/cadence header */
.li-post{grid-template-columns:22px minmax(0,1fr) 30px}
.li-pd{font-weight:750;color:#475569}
.li-plink{grid-column:3;grid-row:1/span 2;align-self:center;justify-self:end;display:grid;place-items:center;width:26px;height:26px;border:1px solid var(--line2);border-radius:8px;background:#fff;color:#475569;font-size:13px;text-decoration:none}
.li-plink:hover{border-color:var(--navy);color:var(--navy);background:#f5f9ff}
.li-cohead{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding:10px 18px 0;font-size:12px;color:var(--muted);font-weight:650}
.li-cohead a{text-decoration:none;font-weight:750;color:var(--navy);border:1px solid var(--line2);border-radius:8px;padding:5px 9px;background:#fff}
.li-cohead a:hover{border-color:var(--navy);background:#f5f9ff}
html[data-theme="dark"] .li-pd{color:#94a3b8}
html[data-theme="dark"] .li-plink,
html[data-theme="dark"] .li-cohead a{background:#0f1a33;border-color:#24365e;color:#8ff8ff}
html[data-theme="dark"] .li-plink:hover,
html[data-theme="dark"] .li-cohead a:hover{background:#152b4a;border-color:#8ff8ff;color:#8ff8ff}

/* LinkedIn module: sort bar, momentum column, benchmark rows, top-post marker */
.li-sortbar{display:flex;flex-wrap:wrap;gap:7px;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line);background:#fff}
.li-sortbar .flabel{width:auto;margin-right:4px}
.li-sub{display:block;font-size:11px;color:var(--muted);font-weight:650;margin-top:2px}
.li-off{color:var(--muted)!important}
.ours-badge.bench{background:#fff;color:#475569;border:1px solid var(--line2)}
.li-row.bench .channel{color:#475569}
.li-mix{display:block;margin-top:3px;color:var(--muted)}
.li-top{display:inline-block;font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.06em;color:#052975;background:#ecfeff;border:1px solid #a5f3fc;border-radius:999px;padding:2px 7px;margin-left:4px;white-space:nowrap}
.li-post.top{background:#f7feff}
html[data-theme="dark"] .li-sortbar{background:#0b1428;border-color:#1d2b4a}
html[data-theme="dark"] .li-post.top{background:#0f2033}
html[data-theme="dark"] .li-top{background:#0d2b3a;border-color:#155e75;color:#8ff8ff}
html[data-theme="dark"] .ours-badge.bench{background:#0f1a33;border-color:#24365e;color:#cbd5e1}

/* Tech Blue for the LinkedIn sort pills and the "Ours" badge (light mode).
   Dark mode keeps the near-black chip it already had - navy on a navy-ish
   surface would lose the contrast that makes the active state readable. */
.li-sortbar .chip.active{background:var(--navy);border-color:var(--navy);color:#fff}
.ours-badge{background:var(--navy)}
html[data-theme="dark"] .li-sortbar .chip.active{background:#0f172a;border-color:#0f172a;color:#fff}
html[data-theme="dark"] .ours-badge{background:#0f172a}
html[data-theme="dark"] .ours-badge.bench{background:#0f1a33;border-color:#24365e;color:#cbd5e1}

/* ---- Per-module "data updated" stamp ----
   Injected by dashboard.js as the last child of every data-backed .section
   (see MODULE_UPDATED there). Reads like the existing .footnote - same muted
   tone, same uniform 1px top border, no coloured edge stripe - because it is
   the same kind of small print. Where a section already ends in a .footnote
   the two share one border so they read as one block rather than two bars.
   The source label is set in Tech Blue so the eye can scan which routine
   produced the module without reading the whole line. */
.mod-stamp{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;
  padding:9px 16px;background:#f8fafc;color:var(--muted);font-size:11.5px;
  border-top:1px solid var(--line)}
.mod-stamp .ms-src{font-weight:850;letter-spacing:.06em;text-transform:uppercase;
  font-size:10px;color:var(--navy)}
.mod-stamp .ms-src:after{content:"\00b7";margin-left:8px;color:var(--line2)}
.footnote + .mod-stamp{border-top:0;padding-top:0}
html[data-theme="dark"] .mod-stamp{background:var(--panel)}
html[data-theme="dark"] .mod-stamp .ms-src{color:var(--cyan)}
/* Video-ideas sections push their footnote to the bottom of a flex column;
   the stamp has to follow it there instead of claiming the auto margin. */
#video-ideas>.section>.footnote{margin-top:auto}
#video-ideas>.section>.mod-stamp{margin-top:0}

/* ---- Continia knowledge base (knowledge.html) ---------------------------
   Help-centre layout: a search hero, a tile grid, and accordions underneath.
   Uniform 1px borders only (no accent stripes), tiles at 15px, brand palette
   only: Tech Blue #052975, cyan #8ff8ff, Smart Green #5f9e8d, Purple #983eae. */
.ck-lbl{font-size:9.5px;font-weight:850;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.ck-hide{display:none!important}

/* ----- Motion previews (video page) -----
   Big stages, no code. Uniform 1px borders, tiles at 15px, palette only, and
   the chrome's own transitions run on the motion tokens like everything else. */
.mvp-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding:14px 18px;
  border-bottom:1px solid var(--line);background:var(--paper)}
.mvp-fset{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.mvp-f{border:1px solid var(--line2);background:var(--paper);color:var(--ink);border-radius:999px;
  padding:5px 12px;font-size:11.5px;font-weight:750;cursor:pointer;
  transition:var(--motion-duration-fast) var(--motion-ease-standard)}
.mvp-f:hover{border-color:var(--navy)}
.mvp-f.on{background:var(--navy);border-color:var(--navy);color:#fff}
.mvp-sset{margin-left:6px}
.mvp-s{border:1px solid var(--line2);background:var(--paper);color:var(--muted);border-radius:999px;
  padding:5px 10px;font:inherit;font-size:11.5px;font-weight:800;cursor:pointer;
  transition:var(--motion-duration-fast) var(--motion-ease-standard)}
.mvp-s:hover{color:var(--ink);border-color:var(--navy)}
.mvp-s.on{background:var(--navy);border-color:var(--navy);color:#fff}
/* Search sits in front of Play all and pushes it to the right edge. */
.mvp-search{margin-left:auto;display:inline-flex;align-items:center;gap:7px;
  border:1px solid var(--line2);border-radius:999px;background:var(--paper);padding:0 12px;height:30px;
  transition:var(--motion-duration-fast) var(--motion-ease-standard)}
.mvp-search:focus-within{border-color:var(--navy)}
.mvp-search i{font-size:11px;color:var(--muted)}
.mvp-search input{width:150px;border:0;background:none;font:inherit;font-size:12px;font-weight:700;
  color:var(--ink);outline:none;padding:0}
.mvp-search input::placeholder{color:var(--muted);font-weight:700}
.mvp-search input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.mvp-empty{grid-column:1/-1;margin:0;padding:26px 2px;text-align:center;font-size:12.5px;color:var(--muted)}
.mvp-all{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--navy);
  background:var(--navy);color:#fff;border-radius:999px;padding:6px 14px;font:inherit;font-size:11.5px;
  font-weight:800;cursor:pointer;transition:var(--motion-duration-fast) var(--motion-ease-standard)}
.mvp-all:hover{opacity:.88}
.mvp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:18px}
.mvp-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:15px;
  background:var(--panel);overflow:hidden}
.mvp-card.hide{display:none}
.mvp-stage{position:relative;height:172px;display:grid;place-items:center;padding:18px;
  background:var(--canvas);border-bottom:1px solid var(--line);overflow:hidden}
.mvp-stage>div{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;
  text-align:center;max-width:100%}
.mvp-replay{position:absolute;top:9px;right:9px;z-index:2;width:28px;height:28px;border:1px solid var(--line);
  border-radius:8px;background:var(--paper);color:var(--muted);font-size:11px;cursor:pointer;
  display:grid;place-items:center;transition:var(--motion-duration-fast) var(--motion-ease-standard)}
.mvp-replay:hover{color:var(--navy);border-color:var(--line2)}
.mvp-body{flex:1;padding:15px 16px 0}
.mvp-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.mvp-name{font-size:15px;font-weight:850;color:var(--navy);line-height:1.15}
.mvp-cat{font-size:9.5px;font-weight:850;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);
  white-space:nowrap}
.mvp-feel{margin:9px 0 0;font-size:12.5px;line-height:1.6;color:var(--ink)}
.mvp-use{margin:10px 0 16px;padding-top:10px;border-top:1px solid var(--line);
  font-size:12px;line-height:1.6;color:var(--muted)}
.mvp-use b{display:block;margin-bottom:3px;font-size:9.5px;font-weight:850;letter-spacing:.07em;
  text-transform:uppercase;color:var(--ink)}
.mvp-copy{margin-top:auto;width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:12px 16px;border:0;border-top:1px solid var(--line);background:var(--paper);font:inherit;
  font-size:12px;font-weight:800;color:var(--ink);text-align:left;cursor:pointer;
  transition:var(--motion-duration-fast) var(--motion-ease-standard)}
.mvp-copy:hover{background:var(--panel);color:var(--navy)}
.mvp-copy.done{color:#5f9e8d}
.mvp-copy-i{flex:none;width:26px;height:26px;border:1px solid var(--line);border-radius:8px;
  display:grid;place-items:center;font-size:11px;color:var(--muted)}
.mvp-copy.done .mvp-copy-i{color:#5f9e8d;border-color:#5f9e8d}

/* preview furniture - the things the animations are applied to */
.mvp-lower{display:inline-flex;flex-direction:column;gap:3px;border:1px solid var(--line2);
  border-radius:8px;background:var(--paper);padding:11px 16px;max-width:100%}
.mvp-lower b{font-size:14px;font-weight:850;color:var(--navy);line-height:1.2}
.mvp-lower i{font-style:normal;font-size:11px;font-weight:750;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted)}
.mvp-title{font-size:19px;font-weight:850;line-height:1.2;color:var(--navy);max-width:14ch}
.mvp-live{display:inline-flex;align-items:center;gap:9px;border:1px solid var(--line2);border-radius:999px;
  background:var(--paper);padding:8px 15px;font-size:12.5px;font-weight:800;color:var(--navy)}
.mvp-dot{width:9px;height:9px;border-radius:50%;background:#983eae;flex:none}
.mvp-skel{display:block;width:172px;height:13px;border-radius:999px;background:var(--line)}
.mvp-skel.short{width:104px}
.mvp-title.wide{letter-spacing:.14em;font-size:17px;max-width:none}
/* Ken Burns needs something to scale, Background Pan paints its own gradient */
.mvp-plate{display:block;width:210px;height:112px;border-radius:12px;
  background:linear-gradient(135deg,#052975,#983eae 55%,#5f9e8d)}
.mvp-plate.bare{background:none}

/* A component mounts itself and sizes its own stage; the grid's centring and
   padding would only fight it, so the stage gets out of the way. */
.mvp-card.is-component .mvp-stage{padding:0;display:block}
/* the shared .mvp-stage>div rule centres and shrink-wraps; a mount fills the
   stage instead, and clips its own overflow */
.mvp-card.is-component .mvp-stage>.mvp-mount{display:block;width:100%;height:100%;max-width:100%}

@media(max-width:1280px){.mvp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.mvp-grid{grid-template-columns:1fr;padding-left:14px;padding-right:14px}
  .mvp-search{margin-left:0;flex:1 1 100%}
  .mvp-search input{width:100%}}
html[data-theme="dark"] .mvp-name,html[data-theme="dark"] .mvp-lower b,
html[data-theme="dark"] .mvp-title,html[data-theme="dark"] .mvp-live{color:#fff}
html[data-theme="dark"] .mvp-f.on{background:#8ff8ff;border-color:#8ff8ff;color:#052975}
html[data-theme="dark"] .mvp-all{background:#8ff8ff;border-color:#8ff8ff;color:#052975}
html[data-theme="dark"] .mvp-copy:hover{color:var(--cyan)}
html[data-theme="dark"] .mvp-search:focus-within{border-color:#8ff8ff}

/* ----- 3rd party tools: four cards on one row, each ending in a compliance
   accordion. Uniform 1px borders, tiles at 15px, palette only. ----- */
.ck3-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:18px}
.ck3-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:15px;
  background:var(--panel);overflow:hidden}
.ck3-top{flex:1;padding:16px 16px 14px}
.ck3-name{font-size:15px;font-weight:850;color:var(--navy);line-height:1.15}
.ck3-host{display:inline-block;margin-top:4px;font-size:12px;font-weight:750;color:var(--ink);text-decoration:none}
.ck3-host:hover{opacity:.66}
.ck3-what{margin:10px 0 0;font-size:12.5px;line-height:1.6;color:var(--muted)}
.ck3-badges{display:flex;flex-wrap:wrap;gap:5px;margin-top:12px}
.ck3-b{font-size:9.5px;font-weight:850;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);
  background:var(--paper);border:1px solid var(--line2);border-radius:999px;padding:3px 8px}
.ck3-b.gap{color:var(--rose);border-color:var(--rose)}
.ck3-use{margin:13px 0 0;padding-top:11px;border-top:1px solid var(--line);
  font-size:12px;line-height:1.6;color:var(--muted)}
.ck3-use b{display:block;margin-bottom:3px;font-size:9.5px;font-weight:850;letter-spacing:.07em;
  text-transform:uppercase;color:var(--ink)}
/* The card's footer button opens the dialog. The accordion it replaces is
   still in the card, hidden - the search indexes and moves it, and .ck-hits
   brings it back as an ordinary entry. */
.ck3-open{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:12px 16px;border:0;border-top:1px solid var(--line);background:var(--paper);
  font:inherit;color:var(--ink);text-align:left;cursor:pointer;transition:background .16s}
.ck3-open:hover{background:var(--panel)}
.ck3-open-t{font-size:12.5px;font-weight:800}
.ck3-mag{flex:none;width:28px;height:28px;border:1px solid var(--line);border-radius:8px;
  display:grid;place-items:center;font-size:11px;color:var(--muted);background:var(--paper);
  transition:color .16s,border-color .16s}
.ck3-open:hover .ck3-mag{color:var(--navy);border-color:var(--line2)}
.ck3-card>.ck3-acc{display:none}
.ck-hits>.ck3-acc{display:block;border:1px solid var(--line);border-radius:8px;background:var(--paper)}

/* ----- the compliance dialog ----- */
.ck3-ov{position:fixed;inset:0;z-index:60;display:none;align-items:flex-start;justify-content:center;
  padding:44px 20px;overflow:auto;background:rgba(5,15,35,.62);-webkit-backdrop-filter:blur(3px);
  backdrop-filter:blur(3px)}
.ck3-ov.is-open{display:flex;animation:ck3In .18s ease}
@keyframes ck3In{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.ck3-ov.is-open{animation:none}}
.ck3-dlg{width:min(780px,100%);background:var(--paper);border:1px solid var(--line);border-radius:15px;
  box-shadow:0 42px 90px -42px rgba(5,15,35,.8);overflow:hidden;margin:auto 0}
.ck3-dlg-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;
  padding:17px 20px;border-bottom:1px solid var(--line);background:var(--panel)}
.ck3-dlg-id{min-width:0}
.ck3-dlg-t{font-size:17px;font-weight:850;color:var(--navy);line-height:1.15}
.ck3-dlg-host{display:inline-block;margin-top:4px;font-size:12px;font-weight:750;color:var(--ink);
  text-decoration:none}
.ck3-dlg-host:hover{opacity:.66}
.ck3-x{flex:none;width:32px;height:32px;border:1px solid var(--line);border-radius:8px;
  background:var(--paper);color:var(--muted);font-size:13px;cursor:pointer;display:grid;place-items:center;
  transition:color .16s,border-color .16s}
.ck3-x:hover{color:var(--ink);border-color:var(--line2)}
.ck3-dlg-body{padding:18px 20px 20px;max-height:calc(100vh - 210px);overflow:auto}
.ck3-dlg-body>*:first-child{margin-top:0}
.ck3-dlg-body .ck-src{margin-bottom:0}
.ck3-rows{margin:0;font-size:12.5px}
.ck3-rows dt{font-size:9.5px;font-weight:850;letter-spacing:.07em;text-transform:uppercase;
  color:var(--navy);margin-bottom:3px}
.ck3-rows dd{margin:0 0 11px;line-height:1.65;color:var(--ink)}
.ck3-rows dd:last-child{margin-bottom:0}
.ck3-gb{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:14px}
.ck3-h4{margin:0 0 5px;font-size:9.5px;font-weight:850;letter-spacing:.07em;text-transform:uppercase;
  color:var(--navy)}
.ck3-gb .ck-ul{padding-left:17px;margin:0}
.ck3-gb .ck-ul li{font-size:12.5px;line-height:1.6}
.ck3-watch{margin:14px 0 0!important;padding:11px 13px;border:1px solid var(--line);border-radius:8px;
  background:var(--panel);font-size:12.5px;line-height:1.65;color:var(--ink)}
.ck3-watch b{display:block;margin-bottom:3px;font-size:9.5px;font-weight:850;letter-spacing:.07em;
  text-transform:uppercase;color:var(--navy)}
@media(max-width:1280px){.ck3-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.ck3-grid{grid-template-columns:1fr;padding-left:14px;padding-right:14px}
  .ck3-gb{grid-template-columns:1fr;gap:10px}}
html[data-theme="dark"] .ck3-name,html[data-theme="dark"] .ck3-rows dt,
html[data-theme="dark"] .ck3-h4,html[data-theme="dark"] .ck3-watch b{color:#fff}
html[data-theme="dark"] .ck3-host{color:var(--cyan)}
html[data-theme="dark"] .ck3-dlg-t{color:#fff}
html[data-theme="dark"] .ck3-dlg-host{color:var(--cyan)}
html[data-theme="dark"] .ck3-ov{background:rgba(2,8,20,.74)}

/* ----- AI model assessment (ck-ai) -----
   Two sides live in the DOM at once and the toggle only flips data-side on
   the section; the hide rules are scoped inside #ck-ai so anything the page
   search lifts into #ck-hits stays visible there. Uniform 1px borders, tiles
   at 15px, and no link ever takes the generic blue - light mode is --ink or
   --navy, dark mode is --cyan. */
.cka-switch{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:16px 18px 2px}
.cka-tabs{display:inline-flex;gap:4px;padding:4px;border:1px solid var(--line);border-radius:15px;background:var(--panel)}
.cka-tab{display:inline-flex;align-items:center;gap:7px;padding:8px 15px;border:0;border-radius:11px;
  background:transparent;cursor:pointer;font:inherit;font-size:12.5px;font-weight:850;
  letter-spacing:.02em;color:var(--muted);transition:background .16s ease,color .16s ease}
.cka-tab i{font-size:12px}
.cka-tab:hover{color:var(--ink)}
.cka-tab.is-on{background:var(--navy);color:#fff}
.cka-note{font-size:12px;line-height:1.5;color:var(--muted)}

.cka-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:14px 18px 4px}
#ck-ai[data-side="marketing"] .cka-card[data-side="rest"],
#ck-ai[data-side="rest"] .cka-card[data-side="marketing"],
#ck-ai[data-side="marketing"] .cka-role-rest,
#ck-ai[data-side="rest"] .cka-role-marketing{display:none}

.cka-card{display:flex;flex-direction:column;padding:16px 16px 14px;border:1px solid var(--line);
  border-radius:15px;background:var(--paper)}
.cka-c-head{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.cka-ic{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;
  flex:0 0 30px;border:1px solid var(--line);border-radius:9px;background:var(--panel);
  font-size:13px;color:var(--navy)}
.cka-c-head h3{margin:0;font-size:15px;font-weight:850;line-height:1.15;color:var(--navy)}
.cka-jobs{margin:0 0 12px;font-size:12.5px;line-height:1.6;color:var(--muted)}
.cka-picks{margin:0;display:grid;grid-template-columns:1fr;gap:9px}
.cka-picks dt{font-size:9.5px;font-weight:850;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.cka-picks dd{margin:3px 0 0;font-size:12.5px;line-height:1.65;color:var(--ink)}
.cka-picks dd b{color:var(--navy)}
.cka-careful{margin:13px 0 0;padding:11px 13px;border:1px solid var(--line);border-radius:8px;
  background:var(--panel);font-size:12.5px;line-height:1.65;color:var(--ink)}
.cka-careful b{display:block;margin-bottom:3px;font-size:9.5px;font-weight:850;letter-spacing:.07em;
  text-transform:uppercase;color:var(--navy)}

.cka-bench{margin-left:auto;padding-left:14px;font-size:11px;font-weight:700;color:var(--muted);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46%}
.cka-what{margin:0 0 12px!important;font-size:13px;line-height:1.7;color:var(--ink)}
.cka-bars{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.cka-bars li{display:grid;grid-template-columns:minmax(0,150px) 1fr 54px;align-items:center;gap:10px}
.cka-bn{font-size:12px;font-weight:700;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cka-bt{display:block;height:9px;border-radius:5px;background:var(--panel);border:1px solid var(--line);overflow:hidden}
.cka-bt i{display:block;height:100%;background:var(--navy)}
.cka-bv{font-size:12px;font-weight:850;color:var(--navy);text-align:right;font-variant-numeric:tabular-nums}
.cka-roster{margin:9px 0 0!important;font-size:11.5px;color:var(--muted)}
.cka-read{margin:13px 0 0!important;padding:11px 13px;border:1px solid var(--line);border-radius:8px;
  background:var(--panel);font-size:12.5px;line-height:1.65;color:var(--ink)}
.cka-read b{display:block;margin-bottom:3px;font-size:9.5px;font-weight:850;letter-spacing:.07em;
  text-transform:uppercase;color:var(--navy)}

.cka-tablewrap{padding:4px 18px 4px;overflow-x:auto}
.cka-tbl{width:100%;min-width:880px;border-collapse:collapse;border:1px solid var(--line);border-radius:8px}
.cka-tbl caption{caption-side:bottom;padding:10px 2px 0;text-align:left;font-size:11.5px;
  line-height:1.6;color:var(--muted)}
.cka-tbl th{padding:0;border-bottom:1px solid var(--line);background:var(--panel);text-align:left}
.cka-tbl th button{display:flex;align-items:center;gap:6px;width:100%;padding:9px 11px;border:0;
  background:transparent;cursor:pointer;font:inherit;font-size:9.5px;font-weight:850;
  letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.cka-tbl th.cka-n button{justify-content:flex-end}
.cka-tbl th button i{font-size:9px;opacity:.55}
.cka-tbl th.is-sorted button{color:var(--navy)}
.cka-tbl th.is-sorted button i{opacity:1}
.cka-tbl td{padding:9px 11px;font-size:12.5px;line-height:1.5;color:var(--ink);vertical-align:top}
.cka-tbl td b{color:var(--navy)}
.cka-tbl td.cka-n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.cka-noterow td{padding:0 11px 11px;border-bottom:1px solid var(--line);font-size:11.5px;
  line-height:1.6;color:var(--muted)}
.cka-tbl tbody tr:last-child td{border-bottom:0}

@media(max-width:1180px){.cka-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){
  .cka-grid{grid-template-columns:1fr;padding-left:14px;padding-right:14px}
  .cka-switch{padding-left:14px;padding-right:14px}
  .cka-tablewrap{padding-left:14px;padding-right:14px}
  .cka-bars li{grid-template-columns:minmax(0,110px) 1fr 48px;gap:8px}
  .cka-bench{display:none}}

html[data-theme="dark"] .cka-c-head h3,html[data-theme="dark"] .cka-picks dd b,
html[data-theme="dark"] .cka-careful b,html[data-theme="dark"] .cka-read b,
html[data-theme="dark"] .cka-bv,html[data-theme="dark"] .cka-tbl td b{color:#fff}
/* --navy is cyan in dark mode, so the "on" tab pairs the other way round -
   cyan text on a cyan fill does not read */
html[data-theme="dark"] .cka-tab.is-on{background:#8ff8ff;color:#052975}
html[data-theme="dark"] .cka-ic{color:var(--cyan)}
html[data-theme="dark"] .cka-tbl th.is-sorted button{color:var(--cyan)}

/* ----- effort levels -----
   The level is drawn as five pips rather than a coloured pill: the question
   is "how much of the scale", which a five-step meter answers at a glance and
   a colour ramp only answers once you have learned the ramp. It also keeps
   the whole section on one accent, which is what the palette rule wants. */
.cke-scale{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;padding:14px 18px 0}
.cke-lvl{padding:14px 15px 13px;border:1px solid var(--line);border-radius:15px;background:var(--paper)}
.cke-lvl h3{margin:0;font-size:14px;font-weight:850;letter-spacing:.02em;color:var(--navy)}
.cke-pips{display:flex;gap:3px;margin:9px 0 11px}
.cke-pips i{display:block;flex:1;height:6px;border-radius:3px;background:var(--panel);border:1px solid var(--line)}
.cke-pips i.on{background:var(--navy);border-color:var(--navy)}
.cke-lvl p{margin:0;font-size:12px;line-height:1.6;color:var(--ink)}
.cke-lvl p+p{margin-top:9px;color:var(--muted)}
.cke-scope{margin:0;padding:12px 18px 0;font-size:12px;line-height:1.65;color:var(--muted)}
.cke-scope b{color:var(--navy)}

#ck-effort[data-side="marketing"] .cke-g-rest,
#ck-effort[data-side="rest"] .cke-g-marketing{display:none}
.cke-ic{margin-right:10px;font-size:13px;color:var(--navy)}
.cke-tbl{width:100%;border-collapse:collapse}
.cke-tbl th{padding:3px 12px 7px 0;text-align:left;font-size:9.5px;font-weight:850;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line)}
.cke-tbl td{padding:11px 12px 11px 0;font-size:12.5px;line-height:1.65;color:var(--ink);
  vertical-align:top;border-bottom:1px solid var(--line)}
.cke-tbl tr:last-child td{border-bottom:0}
.cke-tbl td:last-child,.cke-tbl th:last-child{padding-right:0}
.cke-t{width:26%;font-weight:700}
.cke-m{width:16%;font-weight:700}
/* `.cke-tbl td` outranks a bare class, so the two coloured cells have to be
   qualified or they quietly inherit --ink */
.cke-tbl td.cke-m{color:var(--navy)}
.cke-tbl td.cke-w{color:var(--muted)}
.cke-ecol{width:17%}
.cke-e b{display:block;margin-bottom:6px;font-size:11px;font-weight:850;letter-spacing:.06em;
  text-transform:uppercase;color:var(--navy)}
.cke-e .cke-pips{margin:0}
.cke-na{color:var(--muted);font-weight:700}

@media(max-width:1180px){.cke-scale{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){
  .cke-scale{grid-template-columns:1fr;padding-left:14px;padding-right:14px}
  .cke-scope{padding-left:14px;padding-right:14px}
  .cke-tbl,.cke-tbl tbody,.cke-tbl tr,.cke-tbl td{display:block;width:auto}
  .cke-tbl thead{display:none}
  .cke-tbl tr{padding:12px 0;border-bottom:1px solid var(--line)}
  .cke-tbl tr:last-child{border-bottom:0}
  .cke-tbl tr:first-child{padding-top:0}
  .cke-tbl td{padding:0 0 6px;border-bottom:0}
  .cke-tbl td:last-child{padding-bottom:0}}

html[data-theme="dark"] .cke-lvl h3,html[data-theme="dark"] .cke-tbl td.cke-m,
html[data-theme="dark"] .cke-e b,html[data-theme="dark"] .cke-scope b{color:#fff}
html[data-theme="dark"] .cke-ic{color:var(--cyan)}

/* ----- hero ----- */
/* keep .section's overflow:hidden - it is what clips the blue hero to the
   card's 8px corners. Nothing inside the hero needs to escape the box. */
.ck-hero-sec{overflow:hidden}
.ck-hero{position:relative;overflow:hidden;padding:38px 32px 34px;
  background:#052975 url('./Assets/Dashboard_images_export.jpg') center/cover no-repeat}
/* the video sits over the poster jpg and crossfades in on first play - the
   shared .brief-bg handler in dashboard.js does that, same as the other pages */
.ck-hero .brief-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.ck-hero:before{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(100deg,rgba(5,41,117,.86) 0%,rgba(7,31,85,.74) 46%,rgba(10,21,51,.52) 100%)}
.ck-hero-in{position:relative;z-index:2;max-width:760px}
.ck-hero .eyebrow{color:var(--cyan)}
.ck-hero .eyebrow:before{background:var(--cyan);box-shadow:0 0 0 3px rgba(143,248,255,.18);animation:heroPulse 2.4s infinite}@media(prefers-reduced-motion:reduce){.brief .eyebrow:before,.ck-hero .eyebrow:before{animation:none}}
.ck-hero h1{color:#fff;font-size:34px;line-height:1.08}
.ck-hero-sub{margin:12px 0 0;color:#c3d2ee;font-size:14.5px;line-height:1.6;max-width:66ch}
.ck-hero-search{display:flex;align-items:center;gap:10px;margin-top:22px;background:#fff;border-radius:15px;
  padding:0 16px;height:52px;box-shadow:0 18px 40px -26px rgba(5,41,117,.9)}
.ck-hero-search .ic{display:grid;place-items:center;color:var(--navy);flex:none}
.ck-hero-search input{flex:1;min-width:0;border:0;background:transparent;color:var(--ink);font-size:14.5px;height:100%}
.ck-hero-search input:focus{outline:none}
.ck-hero-search input::-webkit-search-cancel-button{cursor:pointer}
.ck-popular{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin-top:16px}
.ck-popular .ck-lbl{color:#8fa6d0;margin-right:2px}
.ck-popular .ck-term{border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#dbe6fb}
.ck-popular .ck-term:hover{border-color:var(--cyan);color:var(--cyan);background:rgba(143,248,255,.10)}
/* results live in the hero module: the matching entries are moved in here so
   the answer sits directly under the search box */
.ck-results{padding:14px 18px 6px}
/* scoped to #ck-meta so the image banks' .is-meta lines are untouched.
   --navy is Innovation Blue #8ff8ff in dark mode and Tech Blue #052975 in
   light, where cyan on the white panel would not read. */
#ck-meta{font-weight:850;color:var(--navy)}
.ck-hits{margin-top:12px}
.ck-hits>.ckx{margin-bottom:8px}
.ck-hits>.ckx:last-child{margin-bottom:0}
.ck-nohit{font-size:13px;color:var(--muted);padding:6px 2px;max-width:70ch;line-height:1.6}
/* while a search is running the rest of the page steps out of the way */
.ck-page.ck-searching>.section:not(#ck-search){display:none}
.ck-page.ck-searching #ck-search .footnote{border-top:1px solid var(--line)}

/* ----- solution tiles ----- */
.ck-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:12px;padding:18px}
.ck-tile{position:relative;text-align:left;border:1px solid var(--line);border-radius:15px;background:var(--paper);
  padding:16px 16px 18px;cursor:pointer;font:inherit;display:flex;flex-direction:column;gap:3px;min-height:126px;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.ck-tile:hover{transform:translateY(-2px);border-color:var(--line2);box-shadow:0 16px 34px -26px rgba(15,23,42,.6)}
.ck-tile-k{font-size:9.5px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.ck-tile-n{font-size:15.5px;font-weight:850;color:var(--navy);line-height:1.2;margin-top:2px}
.ck-tile-m{font-size:12px;color:var(--muted);margin-top:auto}
.ck-tile-go{position:absolute;right:14px;bottom:14px;font-size:13px;color:var(--muted);transition:transform .18s ease}
.ck-tile:hover .ck-tile-go{transform:translateX(3px);color:var(--navy)}
.ck-tile-navy{background:#052975;border-color:#052975}
.ck-tile-green{background:#5f9e8d;border-color:#5f9e8d}
.ck-tile-purple{background:#983eae;border-color:#983eae}
.ck-tile-navy .ck-tile-n,.ck-tile-green .ck-tile-n,.ck-tile-purple .ck-tile-n{color:#fff}
.ck-tile-navy .ck-tile-k,.ck-tile-navy .ck-tile-m,.ck-tile-navy .ck-tile-go{color:rgba(255,255,255,.72)}
.ck-tile-green .ck-tile-k,.ck-tile-green .ck-tile-m,.ck-tile-green .ck-tile-go,
.ck-tile-purple .ck-tile-k,.ck-tile-purple .ck-tile-m,.ck-tile-purple .ck-tile-go{color:rgba(255,255,255,.82)}
.ck-tile-navy:hover .ck-tile-go,.ck-tile-green:hover .ck-tile-go,.ck-tile-purple:hover .ck-tile-go{color:#fff}

/* ----- accordions ----- */
.ck-body{padding:0 18px 18px}
.ckx{border:1px solid var(--line);border-radius:8px;background:var(--paper);margin-bottom:8px;scroll-margin-top:96px}
.ckx:last-child{margin-bottom:0}
.ckx.open{border-color:var(--line2)}
.ckx-top{width:100%;display:flex;align-items:flex-start;gap:14px;text-align:left;background:none;border:0;
  font:inherit;color:inherit;padding:15px 16px;cursor:pointer;border-radius:8px}
.ckx-top:hover{background:var(--panel)}
.ckx-h{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.ckx-t{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.ckx-t b{font-size:15.5px;font-weight:850;color:var(--navy)}
.ckx-one{font-size:13px;color:var(--muted);line-height:1.55;max-width:88ch}
.ckx-meta{font-size:11px;color:var(--muted);letter-spacing:.02em}
.ckx-chev{flex:none;width:28px;height:28px;border:1px solid var(--line);border-radius:8px;display:grid;
  place-items:center;color:var(--muted);font-size:11px;background:var(--paper);transition:transform .25s ease}
.ckx.open>.ckx-top .ckx-chev{transform:rotate(180deg);color:var(--navy);border-color:var(--line2)}
.ckx-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .28s ease}
.ckx.open>.ckx-body{grid-template-rows:1fr}
.ckx-in{overflow:hidden;min-height:0}
.ckx.open>.ckx-body>.ckx-in{border-top:1px solid var(--line)}
.ckx.open>.ckx-body>.ckx-in>*:first-child{margin-top:0}
.ckx-in>*{padding-left:16px;padding-right:16px}
.ckx-in>*:first-child{padding-top:14px}
.ckx-in>*:last-child{padding-bottom:14px}

/* nested: modules, gotchas, rules */
.ckx-sub{border-radius:8px;background:var(--panel);margin-bottom:6px}
.ckx-sub>.ckx-top{padding:11px 14px;align-items:center}
.ckx-sub .ckx-mn{font-size:13.5px;font-weight:800;color:var(--ink)}
.ckx-sub .ckx-mc{font-size:11px;color:var(--muted);margin-left:8px}
.ckx-sub .ckx-h{flex-direction:row;align-items:center;gap:0;flex-wrap:wrap}
.ckx-sub .ckx-chev{width:24px;height:24px;font-size:10px}
/* line-height:1 matters: the badge otherwise inherits 1.45 from body, so the
   centred line box is taller than the digit and the number rides high */
.ckx-rn{flex:none;width:20px;height:20px;border-radius:50%;background:var(--navy);color:#fff;font-size:10px;
  font-weight:850;line-height:1;font-variant-numeric:tabular-nums;
  display:inline-flex;align-items:center;justify-content:center;margin-right:10px}
.ck-mods{margin:0 0 4px}

/* ----- article content inside a panel ----- */
.ckx-in p{max-width:84ch;font-size:13.5px;line-height:1.7;color:var(--ink);margin:0 0 10px}
.ck-what{color:var(--ink)}
.ck-claim{color:var(--muted)!important}
.ck-claim b{color:var(--navy)}
.ck-h4{margin:16px 0 8px;font-size:11px;font-weight:850;letter-spacing:.07em;text-transform:uppercase;color:var(--navy)}
.ck-ul{margin:0 0 10px;padding-left:20px;max-width:84ch}
.ckx-in .ck-ul{padding-left:36px}
/* A table with border-collapse:collapse ignores padding on the table box - all
   four sides - so the gutter .ckx-in gives every other child did nothing for
   one: the text sat 1px off the card border and the header row sat on the
   panel's top rule. Padding the outer cells fixes left and right but not top,
   and breaks again wherever the table is switched to display:block for a
   narrow screen. The wrapper takes the padding as an ordinary block, at every
   breakpoint, and any future table in an accordion gets it for free. */
.ckx-tw{overflow-x:auto}
/* The wrapper's 16px is the ONLY horizontal gutter: an outer cell that keeps
   its own padding lands the text further in than every other module's body
   text, which is how the naming table sat at 27px against everyone else's 17. */
.ckx-tw th:first-child,.ckx-tw td:first-child{padding-left:0}
.ckx-tw th:last-child,.ckx-tw td:last-child{padding-right:0}
.ck-ul li{font-size:13.5px;line-height:1.65;color:var(--ink);margin-bottom:5px}
.ck-st{font-size:9.5px;font-weight:850;letter-spacing:.07em;text-transform:uppercase;
  border:1px solid var(--line);border-radius:999px;padding:3px 9px;background:var(--paper)}
.ck-st-active{color:#5f9e8d}
.ck-st-legacy{color:var(--amber)}
.ck-st-discontinued{color:var(--rose)}

.ck-terms,.ck-src{display:flex;flex-wrap:wrap;align-items:center;gap:6px 9px;margin:14px 0 2px}
.ck-src{padding-top:12px;border-top:1px solid var(--line)}
.ck-term{border:1px solid var(--line);border-radius:999px;background:var(--panel);color:var(--muted);
  font:inherit;font-size:11.5px;padding:4px 11px;cursor:pointer;transition:.16s}
.ck-term:hover{border-color:#5f9e8d;color:#5f9e8d}
.ck-src a{font-size:11.5px;font-weight:650;color:var(--ink);text-decoration:none;
  border:1px solid var(--line);border-radius:999px;padding:4px 11px}
.ck-src a:hover{border-color:var(--ink)}

/* ----- naming table ----- */
.ck-table{width:100%;border-collapse:collapse;font-size:13px}
.ck-table th{text-align:left;padding:3px 10px 8px;font-size:9.5px;font-weight:850;letter-spacing:.07em;
  text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line)}
.ck-table td{padding:8px 10px;border-bottom:1px solid var(--line);color:var(--ink);vertical-align:top}
.ck-table tbody tr:last-child td{border-bottom:0}
.ck-table td:nth-child(2){color:var(--muted)}

/* ----- portals ----- */
.ck-portals{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:12px;padding:18px}
.ck-portal{border:1px solid var(--line);border-radius:8px;background:var(--panel);padding:17px}
.ck-p-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:4px}
.ck-p-head h3{margin:0;font-size:15px;font-weight:850;color:var(--navy)}
.ck-tag{font-size:9.5px;font-weight:850;letter-spacing:.07em;text-transform:uppercase;color:#5f9e8d;
  border:1px solid var(--line);border-radius:999px;padding:3px 9px;white-space:nowrap;background:var(--paper)}
.ck-p-host{margin-bottom:9px}
.ck-p-host a{font-size:12.5px;font-weight:750;color:var(--ink);text-decoration:none}
.ck-p-host a:hover{opacity:.72}
.ck-portal p{margin:0 0 8px;font-size:13.5px;line-height:1.65;color:var(--ink);max-width:70ch}
.ck-wins{color:var(--muted)!important;font-style:italic}

.ck-sub{padding:16px 18px 8px}
.ck-sub h3{margin:0 0 5px;font-size:11px;font-weight:850;letter-spacing:.07em;text-transform:uppercase;color:var(--navy)}
.ck-sub p{margin:0;max-width:84ch;font-size:13px;line-height:1.6;color:var(--muted)}
.ck-proof-wrap{padding:0 18px 18px}
.ck-proof-row{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:10px}
.ck-proof{border:1px solid var(--line);border-radius:8px;background:var(--panel);padding:11px 15px;min-width:118px}
.ck-proof b{display:block;font-size:20px;font-weight:850;color:var(--navy);line-height:1.15}
.ck-proof span{font-size:11.5px;color:var(--muted)}

.ck-flash{box-shadow:0 0 0 2px rgba(143,248,255,.55)}

/* ----- dark mode ----- */
html[data-theme="dark"] .ckx,
html[data-theme="dark"] .ck-tile,
html[data-theme="dark"] .ckx-chev,
html[data-theme="dark"] .ck-hit,
html[data-theme="dark"] .ck-st{background:var(--panel)}
/* the three accent tiles keep their fill in dark mode - the rule above is
   more specific than the plain .ck-tile-navy/green/purple ones, so without
   these they lost the colour and kept only the border */
html[data-theme="dark"] .ck-tile-navy{background:#052975;border-color:#052975}
html[data-theme="dark"] .ck-tile-green{background:#5f9e8d;border-color:#5f9e8d}
html[data-theme="dark"] .ck-tile-purple{background:#983eae;border-color:#983eae}
html[data-theme="dark"] .ckx-top:hover{background:rgba(143,248,255,.05)}
html[data-theme="dark"] .ckx-sub,
html[data-theme="dark"] .ck-portal,
html[data-theme="dark"] .ck-proof,
html[data-theme="dark"] .ck-term{background:var(--canvas)}
/* every heading on this page is white in dark mode, whatever tile or panel it
   sits on - --navy resolves to a light blue in the dark theme, which is what
   made the plain tiles' names read blue while the filled ones read white */
html[data-theme="dark"] .ck-tile-n,
html[data-theme="dark"] .ckx-t b,
html[data-theme="dark"] .ckx-mn,
html[data-theme="dark"] .ck-h4,
html[data-theme="dark"] .ck-p-head h3,
html[data-theme="dark"] .ck-sub h3{color:#fff}
html[data-theme="dark"] .ck-proof b,
html[data-theme="dark"] .ckx.open>.ckx-top .ckx-chev{color:var(--cyan)}
html[data-theme="dark"] .ck-hero-search{background:var(--panel)}
html[data-theme="dark"] .ck-hero-search .ic{color:var(--cyan)}

@media(max-width:900px){
  .ck-hero{padding:28px 20px}
  .ck-hero h1{font-size:27px}
  .ck-tiles{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));padding:14px}
  .ck-body,.ck-portals{padding-left:14px;padding-right:14px}
  .ck-portals{grid-template-columns:1fr}
  .ck-table{font-size:12px}
}

/* ---- Dark mode: every source / reference link in Innovation Blue ---------
   The source pills kept `background:#fff; color:#334155` in dark mode, so they
   sat on the page as white chips - and `.sources a.wsite`, which is already
   cyan, was cyan text on a white pill. This applies the treatment `.li-cohead a`
   already uses (dark pill, cyan text) to every one of them. */
html[data-theme="dark"] .sources a,
html[data-theme="dark"] .ci-sources a,
html[data-theme="dark"] .ck-src a{background:#0f1a33;border-color:#24365e;color:#8ff8ff}
html[data-theme="dark"] .sources a:hover,
html[data-theme="dark"] .ci-sources a:hover,
html[data-theme="dark"] .ck-src a:hover{background:#152b4a;border-color:#8ff8ff;color:#8ff8ff}
html[data-theme="dark"] .sources a.wsite{border-color:#8ff8ff}
html[data-theme="dark"] .ck-p-host a{color:#8ff8ff}

/* the rule-number badge is the one place --navy is a background; cyan-on-white
   would not read, so it flips to the cyan-on-navy pairing used elsewhere */
html[data-theme="dark"] .ckx-rn{background:#8ff8ff;color:#052975}

/* search-term highlight inside the results; <mark>'s browser yellow is replaced
   by the brand cyan - solid on light, a tint on dark where the text is cyan */
mark.ck-mk{background:#8ff8ff;color:#052975;border-radius:3px;padding:0 2px;font-weight:inherit}
html[data-theme="dark"] mark.ck-mk{background:rgba(143,248,255,.24);color:#8ff8ff}

/* ==== Creative comparison (content.html) =================================
   The picker, the two sides and the two meta cards. The stage itself is the
   motion library's Comparison Slider - its shape lives in that entry's own
   stylesheet and nothing here redraws it; these rules only decide what goes
   INSIDE the two layers and how the controls sit above them. */
/* .section carries no padding of its own - every block inside one brings its
   own, the way .insights and .toolbar do. Without it the labels and the two
   dropdowns sat on the section's border and the frame's shadow was clipped
   by its overflow:hidden. 14px is the house figure. */
.lic{display:grid;gap:14px;padding:14px}
.lic-bar{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
.lic-f{display:grid;gap:6px;min-width:0}
.lic-f>span{font-size:11px;font-weight:850;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
/* The two long pickers share whatever the competitor dropdown leaves; min-width:0
   is what lets them actually shrink, since a grid/flex child will not go under
   its content width without it. */
.lic-grow{flex:1 1 240px}
.lic-grow .bc-select{width:100%;min-width:0}
.lic-bar .bc-select{max-width:100%;text-overflow:ellipsis}

/* Both sides are laid out at full size at every divider position - that is the
   slider's rule, not ours. contain, not cover: this section exists to compare
   two pieces of creative, and a crop is an edit. The ground is the page canvas
   so a portrait post and a square one read as the same frame. */
.lic-side{position:relative;display:grid;place-items:center;background:var(--canvas);overflow:hidden}
.lic-img{width:100%;height:100%;object-fit:contain;display:block}

/* No harvested picture: the post itself, rather than a hole. */
.lic-nopic{display:grid;gap:10px;align-content:center;justify-items:center;text-align:center;padding:22px;max-width:420px}
/* Eight lines is what a 520px stage holds; past that the post is cut by the
   frame instead of by the divider, and the meta card below carries it in
   full anyway. */
.lic-nopic p{margin:0;font-size:15px;font-weight:750;line-height:1.45;color:var(--ink);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:8;overflow:hidden}
.lic-kind{display:inline-flex;padding:4px 10px;border-radius:999px;border:1px solid var(--line);background:var(--paper);font-size:10px;font-weight:850;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.lic-nopic-foot{font-size:12px;font-weight:700;color:var(--muted)}

/* Nothing harvested yet: the one state where the section has no picture to
   show, so it explains itself instead of rendering empty controls. */
.lic-empty{border:1px solid var(--line);border-radius:8px;background:var(--panel);padding:16px 18px}
.lic-empty b{display:block;font-size:15px;font-weight:850;color:var(--ink);margin-bottom:8px}
.lic-empty p{margin:0 0 8px;font-size:13px;color:var(--muted);max-width:76ch}
.lic-empty p:last-child{margin-bottom:0}
.footnote code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;background:var(--paper);border:1px solid var(--line);border-radius:4px;padding:0 4px;color:var(--ink);overflow-wrap:anywhere}
.lic-empty code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;background:var(--canvas);border:1px solid var(--line);border-radius:5px;padding:1px 5px;color:var(--ink);overflow-wrap:anywhere}
.lic-meta{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.lic-card{display:grid;gap:5px;align-content:start;border:1px solid var(--line);border-radius:8px;background:var(--panel);padding:12px 14px;min-width:0}
.lic-card b{font-size:14px;font-weight:800;line-height:1.35;color:var(--ink);overflow-wrap:anywhere}
.lic-tag{font-size:10px;font-weight:850;letter-spacing:.06em;text-transform:uppercase;color:var(--navy)}
.lic-sub{font-size:12px;font-weight:700;color:var(--muted)}
.lic-open{justify-self:start;margin-top:3px;font-size:12px;font-weight:800;color:var(--ink);text-decoration:underline;text-underline-offset:3px}
html[data-theme="dark"] .lic-open{color:#8ff8ff}

/* The pager for a multi-page post. It lives in the card rather than on the
   stage because the stage is the slider's drag surface: a button sitting in
   the clipped half would be taking the pointer the divider needs. */
.lic-pager{display:flex;align-items:center;gap:8px;margin-top:6px}
.lic-pg{width:30px;height:30px;min-height:30px;border:1px solid var(--line2);border-radius:50%;display:grid;place-items:center;background:var(--paper);color:var(--navy);font-size:17px;font-weight:850;line-height:1;cursor:pointer;transition:.16s}
.lic-pg:hover{border-color:var(--navy);background:var(--canvas)}
.lic-pgn{font-size:12px;font-weight:800;color:var(--muted);font-variant-numeric:tabular-nums}
@media(hover:none){.lic-pg{width:36px;height:36px;min-height:36px}}

/* The slider failed to load. Both sides are still here and still readable, so
   the section stands them side by side instead of vanishing. */
.lic-flat{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.lic-flat .lic-side{aspect-ratio:1;border:1px solid var(--line);border-radius:15px}
.lic-warn{grid-column:1/-1;margin:0;font-size:12px;font-weight:700;color:var(--muted)}

@media(max-width:760px){
  .lic{padding:12px;gap:12px}
  .lic-empty{padding:13px 14px}
  .lic-nopic{padding:12px;gap:7px}
  .lic-nopic p{font-size:12px;-webkit-line-clamp:6}
  .lic-nopic-foot{font-size:10px}
  .lic-meta{grid-template-columns:1fr}
  .lic-f{width:100%}
  .lic-grow{flex:1 1 100%}
}

/* ==== Mobile / tablet navigation =========================================
   Below 1100px the shell is one column, and the sidebar used to become a
   static block at the top of the document: 1363px of navigation - roughly
   1.6 phone screens - before the first word of content on every page. The
   nav is now an off-canvas drawer behind a button in the topbar, so a page
   opens on its own content.

   The drawer is `position:fixed` rather than a transformed static block,
   because a transformed element still occupies its layout space; fixed
   takes it out of flow entirely, which is the only way the page starts at
   the topbar. `100dvh` rather than `100vh` so the drawer is not cut off by
   the iOS address bar, with a vh fallback for browsers without dvh. */
.sb-toggle{display:none;width:42px;height:42px;flex:none;border:1px solid var(--line2);border-radius:8px;background:var(--paper);color:var(--ink);cursor:pointer;place-items:center;font-size:17px;padding:0}
.sb-toggle:hover{border-color:var(--line2)}
.sb-toggle:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
.sb-scrim{display:none}

@media(max-width:1100px){
  .sb-toggle{display:grid}
  .topbar{gap:12px}
  /* The drawer itself. Overrides the static rule above it - same specificity,
     later in the file - so both can be read in one place. */
  .sidebar{position:fixed;top:0;left:0;bottom:0;height:100vh;height:100dvh;width:min(312px,84vw);max-width:84vw;
    transform:translateX(-101%);transition:transform .26s cubic-bezier(.4,0,.2,1);
    z-index:70;overflow-y:auto;overscroll-behavior:contain;
    border-right:1px solid var(--line);border-bottom:0;box-shadow:0 0 60px -12px rgba(8,15,33,.45)}
  /* `visibility` as well as the transform, or every link in the closed
     drawer stays in the tab order and Tab walks off into an invisible
     panel. Delayed on the way out so the slide is still seen. */
  .sidebar{visibility:hidden;transition:transform .26s cubic-bezier(.4,0,.2,1),visibility 0s linear .26s}
  body.nav-open .sidebar{transform:translateX(0);visibility:visible;transition-delay:0s,0s}
  .sb-scrim{display:block;position:fixed;inset:0;z-index:65;background:rgba(8,15,33,.46);
    opacity:0;pointer-events:none;transition:opacity .26s ease;border:0;padding:0}
  body.nav-open .sb-scrim{opacity:1;pointer-events:auto}
  /* Lock the page behind the drawer. `overflow:hidden` alone is ignored by
     iOS Safari, so the body is pinned and the scroll offset is carried on
     `top` by the JS, which puts it back on close. */
  body.nav-open{position:fixed;left:0;right:0;width:100%;overflow:hidden}
}
@media(prefers-reduced-motion:reduce){
  .sidebar,.sb-scrim{transition:none}
}
html[data-theme="dark"] .sb-scrim{background:rgba(2,6,16,.6)}

/* A grid item's default `min-width:auto` will not shrink below its content,
   so a `.youtube-wrap` (which scrolls its own table) placed in a grid pushed
   the whole section wide instead: #continia-uploads laid out at 558px inside
   a 356px card and `.section{overflow:hidden}` clipped the rest away, with no
   way to reach it. The table still scrolls; the section no longer grows. */
.youtube-wrap{min-width:0}
#continia-uploads .cu-wrap{grid-template-columns:minmax(0,1fr)}

/* Touch targets. A 12px chip with 7px of padding is 28px tall, under every
   platform's minimum, and these are the controls a phone visitor actually
   uses - the battlecard picker, the market chips, the period switch and the
   gallery filters. Raised only where the pointer is coarse, so the desktop
   density is untouched. */
@media(hover:none){
  .bc-chip,.mm-chip,#continia-uploads .cu-pd,.mvp-f,.ml-f,.ck-term,.chip,.cal-row-btn{min-height:36px}
  .ml-replay,.ml-play{min-width:36px;min-height:36px}
}

/* Second pass over the coarse-pointer targets, from a real measurement on a
   390px viewport rather than by eye: the knowledge base's 95 source pills,
   the 60 replay buttons on the Video page's motion cards, the 60 copy buttons
   in the gallery's code panes, the table sort headers and the reduced-motion
   checkbox were all between 15px and 29px tall. Everything here is inside
   `hover:none`, so a mouse still gets the dense version. */
@media(hover:none){
  .ck-src a,.ck3-host,.ck-p-host a,.cka-n button,.cka-tablewrap th button,
  .mvp-s,.mvp-all,.mvp-f,.ml-copy,.mlmc-btn{min-height:36px;display:inline-flex;align-items:center}
  .mvp-replay,.mvp-toggle,.ml-replay,.ml-play{width:36px;height:36px}
  /* The search field is 17px of input inside a 36px bordered wrapper, so the
     bottom half of what looks like the field does not focus it. */
  .mvp-search input{min-height:34px;padding:0 4px}
  /* A 15px checkbox is not a target. The label around it already is, so the
     box grows and the label gets the height to match. */
  #ml-rm-toggle{width:20px;height:20px}
  .ml-toggle{min-height:36px;display:inline-flex;align-items:center}
}

/* Truncation that is right on a desktop column is content loss on a phone:
   `.bc-cat` was showing 90px of a 216px category and `.cka-bn` 110px of 122.
   Both wrap instead once the column is narrow - there is vertical room on a
   phone, which is the one thing it has more of. */
@media(max-width:760px){
  .bc-cat,.cka-bn{white-space:normal;overflow:visible;text-overflow:clip}
}

/* The G2 standing rows are the second instance of the same bug the upload
   section had: a fixed-width grid column holding `white-space:nowrap` text
   that is allowed to overflow it. A 211px vendor name in a 150px column
   pushed the row to 507px inside a 320px card, and `.section{overflow:hidden}`
   took the rest of the module away - the bar and the review count were simply
   not on the page. On a phone the name gets its own line and wraps; the
   rating, bar and count share the line below it. */
@media(max-width:760px){
  .as-ag{gap:13px}
  .as-ag-row{grid-template-columns:auto minmax(0,1fr) auto;gap:5px 9px}
  .as-ag-n{grid-column:1 / -1;white-space:normal;overflow-wrap:anywhere}
  .as-ag-r{grid-column:1}
  .as-ag-bar{grid-column:2}
  .as-ag-k{grid-column:3}
  /* One word longer than the column is the only thing left that can push a
     wrapped cell wide. */
  .bc-cat,.cka-bn,.as-ag-n{overflow-wrap:anywhere}
  /* A filename is how you tell two bank images apart, and one line of a
     12px caption is about four words of it. Two lines on a phone, where
     there is vertical room to spend. */
  .imgbank .is-cap{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
}

/* A section head is a title and a caption side by side, which needs width it
   does not have on a phone: "Content-Gap Analysis" came out three lines tall
   in a 150px column with the caption squeezed beside it. Stacked, both read
   on one or two lines each. */
@media(max-width:760px){
  .section-head{flex-direction:column;align-items:flex-start;gap:5px;padding:14px 16px}
  .section-head h2{font-size:19px}
  .section-head .hint{font-size:11.5px}
}

/* Scrolling shadows on the horizontal scrollers. A table cut off mid-column
   with no edge treatment reads as broken rather than as scrollable, and the
   YouTube, AppSource, knowledge and timeline tables are all wider than a
   phone by design. The two `local` layers are painted in the content's
   coordinate space and the two `scroll` layers in the container's, so the
   shadow is covered at the start and revealed as you scroll - it appears and
   disappears on its own, with no JS and no scroll listener.

   The shadows are LINEAR, not the radial ones the trick is usually written
   with. `radial-gradient(farthest-side at 100% 50%, ...)` in a 15px x 100%
   box is an ellipse 15px wide and half the box tall, so on a 1900px table it
   has faded to nothing everywhere except the vertical middle - measured at
   the right edge of the YouTube table, there was no visible shadow at all. A
   linear gradient is the same strength at every row.

   It sits behind the rows, so a row with its own background hides it; that is
   why the highlighted "ours" row is the one place the edge goes quiet. */
.youtube-wrap,.cka-tablewrap,.ckx-tw,.tl{
  background-image:
    linear-gradient(90deg,var(--paper) 40%,rgba(255,255,255,0)),
    linear-gradient(90deg,rgba(255,255,255,0),var(--paper) 60%),
    linear-gradient(90deg,rgba(15,23,42,.19),rgba(15,23,42,0)),
    linear-gradient(270deg,rgba(15,23,42,.19),rgba(15,23,42,0));
  background-repeat:no-repeat;
  background-position:left center,right center,left center,right center;
  background-size:36px 100%,36px 100%,18px 100%,18px 100%;
  background-attachment:local,local,scroll,scroll;
  /* momentum scrolling on iOS, and a scrollbar that does not eat a row */
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain
}
html[data-theme="dark"] .youtube-wrap,
html[data-theme="dark"] .cka-tablewrap,
html[data-theme="dark"] .ckx-tw,
html[data-theme="dark"] .tl{
  background-image:
    linear-gradient(90deg,var(--paper) 40%,rgba(11,17,32,0)),
    linear-gradient(90deg,rgba(11,17,32,0),var(--paper) 60%),
    linear-gradient(90deg,rgba(0,0,0,.55),rgba(0,0,0,0)),
    linear-gradient(270deg,rgba(0,0,0,.55),rgba(0,0,0,0))
}

/* Tablet portrait, 761-1100px: the shell is already one column here, but the
   competitor row still used the desktop's `230px 1fr 210px 34px`. With 530px
   of that fixed, the headline got ~130px on a 768 iPad - six lines of three
   words, beside a right-hand column with slack to spare. The headline takes
   its own row instead, so every column gets the width it needs. */
@media(min-width:761px) and (max-width:1100px){
  .ctop{grid-template-columns:minmax(0,1fr) auto 34px;gap:10px 16px}
  .brand{grid-column:1;grid-row:1}
  .right{grid-column:2;grid-row:1;justify-content:flex-end}
  .chev{grid-column:3;grid-row:1}
  .headline{grid-column:1 / -1;grid-row:2}
  .brand .owner,.brand .cat{white-space:normal;overflow:visible;text-overflow:clip}
}
/* The bank captions truncate on a tablet for the same reason they do on a
   phone - four tiles across a 768px column is a 160px caption - so the
   two-line clamp runs to the same breakpoint as the drawer. */
@media(max-width:1100px){
  .imgbank .is-cap{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
}

/* Phones: iOS Safari zooms the whole page when a focused field is under 16px
   and never zooms back out, so the visitor is left panning a 1.2x page for the
   rest of the session. Every typeable field therefore reads at 16px on a phone.
   The :not() pairs are there for specificity as much as for correctness - the
   field rules they have to beat go up to (0,2,1). */
@media(max-width:760px){
  .app input:not([type=checkbox]):not([type=radio]),
  .app select:not([hidden]),
  .app textarea:not([hidden]){font-size:16px}
}

/* Phones: the topbar hides .status because "Updated <date>" has nowhere to sit,
   and the theme toggle went with it - it is injected into .status, not beside
   it. Bring the block back with only the button in it, and order it ahead of
   the crumb so the moon sits left of "Marketing Hub", next to the hamburger.
   .sb-toggle needs the lower order value or the button would jump in front of
   it. */
@media(max-width:760px){
  .topbar .status{display:flex;order:-1;gap:0;margin-right:auto}
  .topbar .status>span{display:none}
  .sb-toggle{order:-2}
  /* It stands next to the hamburger here rather than alone at the far end,
     so it takes the same 42px box - and 34px was under the touch floor
     every other control on a phone got. Tablet keeps its 34px button. */
  .theme-toggle{width:42px;height:42px;border-radius:8px;font-size:17px}
}