:root{
  --paper:#EDF2F7;
  --paper-2:#E4EBF2;
  --panel:#FFFFFF;
  --ink:#10243A;
  --ink-2:#1B344D;
  --muted:#365069;
  --soft:#526A82;
  --line:#C3D0DE;
  --line-2:#D9E2EC;
  --steel:#245B87;
  --steel-2:#1A4468;
  --steel-pale:#E8F0F7;
  --copper:#8A5A2B;
  --copper-pale:#F4ECE1;
  --brick:#9A3D2B;
  --brick-pale:#F4E8E4;
  --navy:#10283F;
  --navy-2:#173A57;
  --white:#FFFFFF;
  --serif:'Songti SC','Noto Serif SC','STSong',serif;
  --sans:'PingFang SC','Noto Sans SC','Microsoft YaHei',sans-serif;
  --mono:'SFMono-Regular',Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html,body{
  margin:0;width:100%;height:100%;overflow:hidden;
  background:#D7DFE8;color:var(--ink);font-family:var(--sans);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
#viewport{position:fixed;inset:0;overflow:hidden}
#deck{position:absolute;left:50%;top:50%;width:1600px;height:900px;transform-origin:center center}

.slide{
  position:absolute;inset:0;padding:42px 60px 34px;
  background-color:var(--paper);
  background-image:
    radial-gradient(ellipse at 94% 2%,rgba(36,91,135,.08),transparent 31%),
    linear-gradient(138deg,#F8FAFC 0%,#EDF2F7 62%,#E8EEF5 100%);
  color:var(--ink);display:flex;flex-direction:column;overflow:hidden;
  opacity:0;visibility:hidden;
}
.slide.active{opacity:1;visibility:visible}
.slide:before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(22,56,88,.026) 1px,transparent 1px),
    linear-gradient(90deg,rgba(22,56,88,.026) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(180deg,rgba(0,0,0,.75),transparent 88%);
}
.slide.dark{
  background-color:var(--navy);
  background-image:
    radial-gradient(ellipse at 86% 8%,rgba(95,139,180,.24),transparent 34%),
    radial-gradient(ellipse at 10% 92%,rgba(138,90,43,.12),transparent 28%),
    linear-gradient(142deg,#10283F 0%,#142F49 48%,#183B59 100%);
  color:#F3F7FB;
}
.slide.dark:before{
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  mask-image:linear-gradient(180deg,rgba(0,0,0,.65),transparent 82%);
}

.top{
  position:relative;z-index:3;height:38px;flex:none;
  display:flex;justify-content:space-between;align-items:center;
  border-bottom:1px solid var(--line);color:var(--soft);
  font-size:13px;letter-spacing:.08em;
}
.brand{display:flex;align-items:center;gap:10px}
.seal{width:14px;height:14px;border-radius:50%;border:1.5px solid var(--brick);position:relative}
.seal:after{content:'';position:absolute;inset:3.5px;border-radius:50%;background:var(--brick)}
.brand-label{font-size:13px;font-weight:700;letter-spacing:.12em;color:var(--steel)}
.dark .top{border-color:rgba(255,255,255,.19);color:#C8D7E5}
.dark .brand-label{color:#F0B096}
.dark .seal{border-color:#F0B096}
.dark .seal:after{background:#F0B096}

.body{
  position:relative;z-index:2;flex:1;min-height:0;
  display:flex;flex-direction:column;justify-content:center;
  padding:20px 0 14px;
}
.foot{
  position:relative;z-index:3;height:30px;flex:none;
  display:flex;align-items:center;justify-content:space-between;
  border-top:1px solid var(--line);padding-top:8px;
  color:var(--soft);font-size:12.5px;letter-spacing:.05em;
}
.dark .foot{border-color:rgba(255,255,255,.18);color:#B9CBDB}

.section{
  font-size:12.5px;font-weight:700;letter-spacing:.18em;
  color:var(--steel);margin:0 0 10px;text-transform:uppercase;
}
.dark .section{color:#E9A083}
.title{
  font-family:var(--serif);font-weight:600;font-size:42px;line-height:1.2;
  letter-spacing:.01em;color:var(--ink);max-width:1450px;margin:0;text-wrap:balance;
}
.lead{
  font-size:18.5px;line-height:1.55;color:var(--muted);
  max-width:1330px;margin:10px 0 0;
}
.dark .title{color:#F8FAFC}
.dark .lead{color:#D4E0EC}
.quote{
  font-family:var(--serif);font-weight:600;font-size:50px;line-height:1.25;
  max-width:1420px;margin:0;color:var(--ink);text-wrap:balance;
}
.dark .quote{color:#F8FAFC}

.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:22px}
.cards.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.cards.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{
  position:relative;background:var(--panel);border:1px solid var(--line);
  border-top:3px solid var(--steel);border-radius:3px;
  padding:18px 20px;min-height:150px;
  box-shadow:0 14px 30px -27px rgba(16,36,58,.46);
}
.card:nth-child(3n+2){border-top-color:var(--copper)}
.card:nth-child(3n){border-top-color:var(--brick)}
.cards.four .card{padding:16px 17px;min-height:166px}
.card .n{
  display:inline-block;padding:2px 6px;border-radius:2px;
  background:var(--steel-pale);color:var(--steel);
  font:700 10.5px/1.4 var(--mono);letter-spacing:.12em;
}
.card h3{font:600 20px/1.38 var(--serif);margin:12px 0 6px;color:var(--ink)}
.card p{font-size:15px;line-height:1.6;color:var(--muted);margin:0}
.cards.four .card h3{font-size:18px;margin-top:10px}
.cards.four .card p{font-size:14px;line-height:1.55}
.dark .card{background:var(--panel);border-color:rgba(255,255,255,.42);border-top-color:var(--steel)}
.dark .card:nth-child(3n+2){border-top-color:var(--copper)}
.dark .card:nth-child(3n){border-top-color:var(--brick)}
.dark .card h3{color:var(--ink)}
.dark .card p{color:var(--muted)}

.steps{display:flex;align-items:stretch;gap:10px;margin-top:22px}
.step{
  flex:1;min-width:0;padding:16px 14px 14px;
  background:linear-gradient(180deg,#FFFFFF,#F4F8FC);
  border:1px solid var(--line);border-top:3px solid var(--steel);
}
.step:nth-child(2){border-top-color:var(--copper)}
.step:nth-child(3){border-top-color:var(--steel-2)}
.step:nth-child(4){border-top-color:var(--brick)}
.step:nth-child(5){border-top-color:var(--copper)}
.step .n{font:700 11px var(--mono);color:var(--steel);letter-spacing:.14em}
.step h3{font:600 20px/1.38 var(--serif);margin:9px 0 6px;color:var(--ink)}
.step p{font-size:14.5px;line-height:1.55;color:var(--muted);margin:0}
.journey .step h3{font-size:19px}

.bodygrid{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center;width:100%}
.photo-wrap{
  position:relative;padding:6px;background:#FFFFFF;
  border:1px solid var(--line);border-radius:4px;
  box-shadow:0 18px 38px -30px rgba(16,36,58,.52);
}
.photo-wrap img{display:block;width:100%;max-height:445px;object-fit:contain;object-position:center}
.caption{
  display:flex;justify-content:space-between;gap:12px;margin-top:9px;
  color:var(--soft);font-size:12.5px;line-height:1.45;
}
.pill{
  display:inline-flex;align-items:center;border:1px solid #B9C9D9;
  border-radius:99px;padding:6px 11px;margin:5px 5px 5px 0;
  background:#FFFFFF;color:var(--muted);font-size:13px;
}
.dark .pill{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.28);color:#E4EDF5}
.pill-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}

.icon-line{display:flex;gap:10px;align-items:center;font-size:17px;color:var(--muted);margin:12px 0}
.dot{width:8px;height:8px;border-radius:50%;background:var(--steel);flex:none}
.compare-note{font-size:14.5px;font-weight:600;letter-spacing:.05em;color:var(--soft);margin:18px 0 0}

.arch-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:20px;position:relative}
.arch-node{
  position:relative;background:#FFFFFF;border:1px solid var(--line);
  border-top:4px solid var(--tone);border-radius:3px;
  padding:16px 16px 14px;min-height:164px;
  box-shadow:0 14px 30px -28px rgba(16,36,58,.48);
}
.arch-node:not(:last-child):after{
  content:'→';position:absolute;right:-14px;top:46%;
  transform:translateY(-50%);color:#8FA5BA;font-size:18px;font-weight:700;z-index:2;
}
.arch-node>b{font:700 11px var(--mono);letter-spacing:.12em;color:var(--tone)}
.arch-node h3{font:600 19px/1.35 var(--serif);margin:9px 0 6px;color:var(--ink)}
.arch-node p{font-size:13.5px;line-height:1.5;color:var(--muted);margin:0 0 6px}
.arch-node span{font-size:12.5px;line-height:1.45;color:var(--soft)}
.arch-band{
  display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;
  margin-top:14px;padding:10px 14px;background:var(--steel-pale);
  border-left:4px solid var(--steel);border-radius:2px;
  color:var(--muted);font-size:13.5px;
}
.arch-band b{color:var(--steel);font-size:12px;letter-spacing:.07em}
.arch-link{align-self:flex-start;margin-top:8px;color:var(--steel);text-decoration:none;font-size:13px;border-bottom:1px solid #9EB8CE;padding-bottom:2px}

.insight-rail{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  margin-top:14px;background:#FFFFFF;border:1px solid var(--line);
  border-left:4px solid var(--steel);border-radius:3px;overflow:hidden;
  color:var(--muted);box-shadow:0 14px 30px -28px rgba(16,36,58,.5);
}
.insight-rail.has-extension{grid-template-columns:repeat(4,minmax(0,1fr))}
.insight-rail .detail{padding:12px 14px;min-width:0}
.insight-rail .detail+.detail{border-left:1px solid var(--line-2)}
.insight-rail .detail b{
  display:block;margin-bottom:5px;font-size:11.5px;letter-spacing:.09em;
  color:var(--steel);
}
.insight-rail .detail:nth-child(2) b{color:var(--copper)}
.insight-rail .detail:nth-child(3) b{color:var(--brick)}
.insight-rail .detail:nth-child(4) b{color:var(--steel-2)}
.insight-rail .detail span{display:block;font-size:14.5px;line-height:1.52;color:var(--muted)}
.dark .insight-rail{background:#FFFFFF;border-color:rgba(255,255,255,.55);border-left-color:#EFA487;box-shadow:none}
.dark .insight-rail .detail span{color:#2F485F}
.dark .insight-rail .detail b{color:var(--steel)}
.dark .insight-rail .detail:nth-child(2) b{color:var(--copper)}
.dark .insight-rail .detail:nth-child(3) b{color:var(--brick)}
.dark .insight-rail .detail:nth-child(4) b{color:var(--steel-2)}

.deliverable-line{
  display:flex;gap:10px;align-items:baseline;margin-top:8px;
  padding:9px 13px;background:#FFFFFF;border:1px solid var(--line);
  border-left:4px solid var(--brick);border-radius:2px;
  color:var(--muted);font-size:13.2px;line-height:1.5;
}
.deliverable-line b{flex:none;color:var(--brick);font-size:11px;letter-spacing:.08em}
.dark .deliverable-line{background:#FFFFFF;border-color:rgba(255,255,255,.55);border-left-color:var(--brick);color:#2F485F}
.dark .deliverable-line b{color:var(--brick)}

.slide[data-type=quote] .body{padding-top:14px}
.slide[data-type=quote] .cards{margin-top:18px}
.slide[data-type=quote] .card{min-height:0;padding:16px 18px}
.slide[data-type=quote] .card h3{font-size:19px;margin:8px 0 0}
.slide[data-type=quote] .insight-rail{margin-top:12px}
.slide[data-type=quote] .insight-rail .detail{padding:12px 13px}
.slide[data-type=quote] .insight-rail .detail span{font-size:15.5px;line-height:1.5}
.slide[data-type=quote] .deliverable-line{font-size:13px}

.algorithm-layout{
  display:grid;grid-template-columns:minmax(0,1fr) 296px;
  gap:18px;height:588px;align-items:stretch;flex:none;
}
.algorithm-frame{
  position:relative;display:grid;place-items:center;
  height:588px;padding:6px;overflow:hidden;
  background:#F9FBFD;border:1px solid var(--line);border-radius:4px;
  box-shadow:0 18px 40px -32px rgba(16,36,58,.55);
  text-decoration:none;
}
.algorithm-frame img{display:block;width:100%;height:100%;object-fit:contain;object-position:center}
.frame-hint{
  position:absolute;right:10px;bottom:10px;padding:5px 9px;border-radius:99px;
  background:rgba(16,40,63,.82);color:#FFFFFF;font-size:11px;letter-spacing:.03em;
  opacity:0;transform:translateY(3px);transition:opacity .18s ease,transform .18s ease;
}
.algorithm-frame:hover .frame-hint{opacity:1;transform:none}
.algorithm-side{
  height:588px;padding:20px 18px;display:flex;flex-direction:column;
  justify-content:center;gap:12px;background:#FFFFFF;
  border:1px solid var(--line);border-left:4px solid var(--steel);
  border-radius:3px;box-shadow:0 16px 34px -30px rgba(16,36,58,.52);
}
.algorithm-kicker{font-size:11px;font-weight:700;letter-spacing:.09em;color:var(--brick)}
.algorithm-big{
  font-family:var(--serif);font-size:17px;font-weight:600;line-height:1.52;
  color:var(--ink);margin:0;
}
.algorithm-insights{display:grid;gap:8px}
.side-detail{padding-left:9px;border-left:2px solid var(--line-2)}
.side-detail b{display:block;margin-bottom:2px;font-size:11px;letter-spacing:.07em;color:var(--steel)}
.side-detail:nth-child(2) b{color:var(--copper)}
.side-detail:nth-child(3) b{color:var(--brick)}
.side-detail span{display:block;font-size:13.8px;line-height:1.48;color:var(--muted)}
.algo-open{
  display:inline-flex;align-self:flex-start;padding:7px 11px;border-radius:3px;
  background:var(--steel);color:#FFFFFF;text-decoration:none;
  font-size:12.5px;font-weight:600;letter-spacing:.02em;
}
.algorithm-delivery{
  padding:8px 10px;background:#F1F6FA;border-left:3px solid var(--brick);
  border-radius:2px;color:var(--muted);
}
.algorithm-delivery b{display:block;margin-bottom:2px;font-size:10.5px;letter-spacing:.07em;color:var(--brick)}
.algorithm-delivery span{display:block;font-size:12.4px;line-height:1.45;color:var(--muted)}
.algo-caption{margin-top:7px;color:var(--soft);font-size:12px;line-height:1.4}
.slide[data-type=algorithm] .body{padding:16px 0 10px}
.slide[data-type=algorithm] .section{margin-bottom:7px}
.slide[data-type=algorithm] .title{font-size:38px;line-height:1.18;margin-bottom:12px}

.cover-main{
  display:grid;grid-template-columns:minmax(0,1.02fr) minmax(430px,.98fr);
  gap:34px;align-items:center;max-width:1480px;margin:0 auto;width:100%;
}
.cover-title{
  font-family:var(--serif);font-weight:600;font-size:64px;line-height:1.14;
  letter-spacing:.015em;color:#F8FAFC;max-width:760px;margin:14px 0 16px;
}
.cover-sub{font-size:21px;line-height:1.55;color:#D4E0EC;max-width:700px;margin:0}
.cover-mark{font-size:13px;letter-spacing:.16em;color:#E9A083;margin-bottom:4px}
.mini-bar{height:1px;background:rgba(255,255,255,.18);margin:18px 0 14px;max-width:640px}
.tagline{display:block;font-size:13px;font-weight:600;letter-spacing:.09em;color:#B9CBDC}
.notes{font-size:13.5px;line-height:1.5;color:#AFC2D4;margin:8px 0 0}
.cover-points{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  margin-top:22px;border:1px solid rgba(255,255,255,.19);
  border-radius:3px;background:rgba(255,255,255,.055);overflow:hidden;
}
.cover-points span{padding:11px 14px;font-size:14px;line-height:1.45;color:#DCE7F1}
.cover-points span:nth-child(2n){border-left:1px solid rgba(255,255,255,.14)}
.cover-points span:nth-child(n+3){border-top:1px solid rgba(255,255,255,.14)}
.cover-points b{display:block;margin-bottom:3px;color:#F0B096;font-size:10.5px;letter-spacing:.1em}

.hero-architecture{
  position:relative;min-height:552px;isolation:isolate;perspective:1200px;overflow:hidden;
  border:1px solid rgba(75,107,140,.28);border-radius:16px;
  background:
    radial-gradient(ellipse at 47% 42%,rgba(70,116,158,.19),transparent 55%),
    linear-gradient(145deg,#FAFCFE,#E3EBF3);
  box-shadow:0 32px 72px -48px rgba(0,0,0,.55);
}
.hero-architecture:before{
  content:'';position:absolute;inset:28px;
  background-image:
    linear-gradient(rgba(36,83,120,.09) 1px,transparent 1px),
    linear-gradient(90deg,rgba(36,83,120,.09) 1px,transparent 1px);
  background-size:30px 30px;
  mask-image:radial-gradient(ellipse at center,#000 0,transparent 76%);
  z-index:-1;
}
.stack-glow{
  position:absolute;left:9%;top:17%;width:50%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(42,98,145,.23),rgba(154,61,43,.08) 43%,transparent 70%);
  filter:blur(10px);
}
.stack-rig{
  position:absolute;left:1%;top:15%;width:65%;height:70%;
  transform-style:preserve-3d;transform:rotateX(61deg) rotateZ(-28deg);
}
.stack-plane{
  --plane-color:var(--steel);position:absolute;inset:13%;
  border:2px solid color-mix(in srgb,var(--plane-color) 72%,white);
  border-radius:20px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--plane-color) 26%,white),color-mix(in srgb,var(--plane-color) 12%,#E3EBF3));
  box-shadow:0 22px 45px -22px color-mix(in srgb,var(--plane-color) 42%,transparent),inset 0 1px 0 rgba(255,255,255,.9);
  transform:translateZ(calc(var(--layer) * 42px));
}
.stack-plane:nth-child(1){--plane-color:#9A3D2B}
.stack-plane:nth-child(2){--plane-color:#8A5A2B}
.stack-plane:nth-child(3){--plane-color:#456A8C}
.stack-plane:nth-child(4){--plane-color:#245B87}
.stack-plane:after{
  content:'';position:absolute;inset:12px;border:1px solid rgba(255,255,255,.78);
  border-radius:14px;
  background:linear-gradient(120deg,transparent 35%,rgba(255,255,255,.46) 48%,transparent 59%);
  background-size:220% 100%;
}
.stack-labels{
  position:absolute;right:4%;top:13%;bottom:13%;width:47%;
  display:grid;grid-template-rows:repeat(4,1fr);align-items:center;
}
.stack-label{
  display:grid;grid-template-columns:34px 1fr;column-gap:10px;align-items:center;
  padding:8px 11px;border-left:3px solid var(--tone);border-radius:0 3px 3px 0;
  background:linear-gradient(90deg,rgba(255,255,255,.98),rgba(255,255,255,.72));
  box-shadow:0 8px 22px -18px rgba(16,36,58,.5);
}
.stack-label b{grid-row:span 2;color:var(--tone);font:700 12px var(--mono)}
.stack-label strong{font:700 15px/1.3 var(--sans);color:#10243A}
.stack-label small{font:500 11.5px/1.45 var(--sans);color:#405A73}
.stack-label:nth-child(1){--tone:#245B87}
.stack-label:nth-child(2){--tone:#8A5A2B}
.stack-label:nth-child(3){--tone:#456A8C}
.stack-label:nth-child(4){--tone:#9A3D2B}
.stack-caption{
  position:absolute;left:20px;bottom:15px;font:700 10.5px var(--mono);
  letter-spacing:.15em;color:#4C657D;
}
.stack-orbit{
  position:absolute;left:4%;top:9%;width:57%;height:73%;
  border:1px solid rgba(36,91,135,.2);border-radius:50%;transform:rotate(-20deg);
}
.stack-orbit:after{
  content:'';position:absolute;top:10%;left:78%;width:7px;height:7px;border-radius:50%;
  background:#9A3D2B;box-shadow:0 0 20px 5px rgba(154,61,43,.2);
}

.close-layout{
  display:grid;grid-template-columns:1fr .84fr;align-items:center;gap:40px;
  width:100%;max-width:1450px;margin:auto;
}
.close-layout .cover-title{font-size:56px}
.close-layout .cover-sub{font-size:20px}
.close-layout .hero-architecture{min-height:470px}
.close-layout .stack-rig{left:0;width:64%;height:72%}
.close-layout .stack-labels{right:2%;width:50%}

.controls{
  position:fixed;z-index:20;left:50%;bottom:16px;transform:translateX(-50%);
  display:flex;align-items:center;gap:9px;padding:7px 11px;
  background:rgba(13,32,49,.94);border:1px solid rgba(255,255,255,.22);
  border-radius:99px;color:#FFFFFF;font:13px var(--mono);
  box-shadow:0 10px 28px rgba(8,20,32,.26);
}
.controls button{border:0;background:transparent;color:#FFFFFF;font-size:15px;padding:6px 10px;cursor:pointer}
.controls button:hover{color:#F0B096}
.controls input{width:126px;accent-color:#C77A4A}
.controls .count{min-width:64px;text-align:center}
.controls .hint{color:#C7D4E0;font:12px var(--sans);padding:0 7px}
.progress{position:fixed;left:0;top:0;height:3px;z-index:30;background:var(--brick);width:0;transition:width .2s}
.video-link{
  position:fixed;right:58px;top:12px;z-index:25;padding:6px 11px;
  border:1px solid #BFCDDA;border-radius:99px;background:#FFFFFF;
  color:var(--steel);text-decoration:none;font-size:12px;font-weight:600;
  box-shadow:0 7px 18px -14px rgba(16,36,58,.5);
}
.slides-overview{
  display:none;position:fixed;z-index:40;inset:0;padding:46px;overflow:auto;
  grid-template-columns:repeat(5,1fr);gap:12px;background:rgba(12,28,43,.95);
}
.slides-overview.open{display:grid}
.thumb{
  height:98px;padding:11px;background:#F5F8FB;color:var(--ink);
  border:1px solid #8296A9;border-radius:3px;cursor:pointer;
  font:14px/1.4 var(--serif);text-align:left;
}
.thumb b{display:block;margin-bottom:7px;font:10.5px var(--mono);color:var(--brick)}

@media(prefers-reduced-motion:reduce){
  .slide,.progress{transition:none}
}

/* Refinement layer: projector-first contrast, calmer editorial rhythm. */
:root{
  --paper:#F2F4F3;
  --paper-2:#E9EDEC;
  --panel:#FFFDF9;
  --ink:#10263B;
  --ink-2:#1B354D;
  --muted:#2B465E;
  --soft:#4C6277;
  --line:#BECBD6;
  --line-2:#D5DFE7;
  --steel:#1E577F;
  --steel-2:#143F61;
  --steel-pale:#E7EFF5;
  --copper:#8A5A26;
  --copper-pale:#F2E8D9;
  --brick:#9E3D2C;
  --brick-pale:#F3E5DF;
  --navy:#10283F;
  --navy-2:#173B59;
}

html,body{background:#CCD5DE;color:var(--ink)}
.slide{
  background-color:var(--paper);
  background-image:
    radial-gradient(ellipse at 95% 0%,rgba(32,88,124,.09),transparent 32%),
    radial-gradient(ellipse at 0% 100%,rgba(158,61,44,.045),transparent 30%),
    linear-gradient(138deg,#F8F9F8 0%,#F0F3F2 62%,#E8EDED 100%);
}
.slide.dark{
  background-color:var(--navy);
  background-image:
    radial-gradient(ellipse at 88% 5%,rgba(102,146,178,.21),transparent 34%),
    radial-gradient(ellipse at 8% 98%,rgba(158,61,44,.12),transparent 30%),
    linear-gradient(142deg,#10283F 0%,#15334E 52%,#1A405D 100%);
}
.top{height:40px;font-size:13.5px;color:#486176}
.brand-label{font-weight:800;color:var(--steel)}
.section{font-size:13px;font-weight:800;color:#1C5A83}
.title{font-size:43px;color:#10263B}
.lead{font-size:19.5px;line-height:1.55;color:#29445C}
.quote{font-size:52px;color:#10263B}
.dark .lead{color:#E8F0F6}
.dark .section{color:#F0B093}

.card{background:var(--panel);border-color:#C8D3DD;border-top-width:4px}
.card h3{font-size:21px;color:#122A40}
.card p{font-size:16.2px;line-height:1.55;color:#2C465D}
.cards.four .card h3{font-size:19.5px}
.cards.four .card p{font-size:15.4px}
.step h3{font-size:21px;color:#122A40}
.step p{font-size:15.5px;line-height:1.53;color:#2C465D}
.arch-node p{font-size:14.5px;color:#29445B}
.arch-node span{font-size:13.7px;color:#405B70}
.icon-line{color:#29445B}
.caption,.algo-caption{font-size:13.2px;color:#405A6F}

.insight-rail{
  border:1px solid #C4D0DB;
  border-left:5px solid var(--steel);
  box-shadow:0 16px 34px -31px rgba(16,38,59,.56);
}
.insight-rail .detail{padding:14px 16px}
.insight-rail .detail b{font-size:12.5px;font-weight:800;letter-spacing:.08em;color:#15517A}
.insight-rail .detail span{font-size:16.1px;line-height:1.47;color:#29445C}
.deliverable-line{
  margin-top:10px;padding:11px 14px;border-left-width:5px;
  font-size:14.4px;line-height:1.48;color:#29445C;
}
.deliverable-line b{font-size:12px;font-weight:800;color:#8D3426}
.dark .insight-rail .detail span,.dark .deliverable-line{color:#263F55}

/* The opening proposition needs a stronger reading hierarchy than the other pages. */
.page-2 .quote{font-size:53px;line-height:1.26;max-width:1490px}
.page-2 .lead{font-size:21px;color:#E5EEF6;max-width:1380px;margin-top:8px}
.page-2 .cards{gap:16px;margin-top:23px}
.page-2 .card{min-height:112px;padding:17px 20px;background:#FFFCF7}
.page-2 .card h3{font-size:22px;margin:10px 0 0;color:#10263B}
.page-2 .insight-rail{
  grid-template-columns:repeat(2,minmax(0,1fr));
  margin-top:14px;border-left-width:5px;box-shadow:none;
}
.page-2 .insight-rail .detail{padding:14px 17px}
.page-2 .insight-rail .detail+.detail{border-left:1px solid var(--line-2)}
.page-2 .insight-rail .detail:nth-child(even){border-left:1px solid var(--line-2)}
.page-2 .insight-rail .detail:nth-child(n+3){border-top:1px solid var(--line-2)}
.page-2 .insight-rail .detail b{font-size:13px}
.page-2 .insight-rail .detail span{font-size:16.4px;line-height:1.45;color:#233E56}
.page-2 .deliverable-line{margin-top:12px;padding:12px 15px;font-size:14.8px}

/* Algorithm pages: give the real micro-lesson the visual priority. */
.slide[data-type=algorithm] .body{padding:8px 0 3px}
.slide[data-type=algorithm] .section{margin-bottom:7px}
.slide[data-type=algorithm] .title{font-size:37px;line-height:1.18;margin-bottom:10px}
.slide[data-type=algorithm] .algorithm-layout{
  grid-template-columns:minmax(0,1fr) 232px;
  gap:14px;height:628px;
}
.slide[data-type=algorithm] .algorithm-frame{
  height:628px;padding:4px;background:#F7F9F9;border-color:#B9C8D4;
}
.slide[data-type=algorithm] .algorithm-frame img{
  width:100%;height:100%;object-fit:contain;object-position:center;
}
.slide[data-type=algorithm] .algorithm-side{
  height:628px;padding:18px 16px;gap:11px;
  border-left-width:5px;background:#FFFCF8;
  box-shadow:0 16px 34px -30px rgba(16,38,59,.54);
}
.algorithm-kicker{font-size:11.5px;font-weight:800;color:#8D3426}
.algorithm-big{font-size:16.3px;line-height:1.46;color:#10263B}
.algorithm-insights{gap:7px}
.side-detail{padding-left:8px;border-left-width:3px}
.side-detail b{font-size:11.5px;font-weight:800;margin-bottom:1px}
.side-detail span{font-size:13.2px;line-height:1.4;color:#29445C}
.algo-open{font-size:12.5px;padding:7px 10px;background:#174E74}
.algorithm-delivery{padding:8px 10px;background:#F1ECE2;border-left-width:4px}
.algorithm-delivery b{font-size:10.8px;font-weight:800;color:#8D3426}
.algorithm-delivery span{font-size:12.3px;line-height:1.36;color:#29445C}
.slide[data-type=algorithm] .algo-caption{margin-top:6px;font-size:12.5px;color:#39556B}

/* Keep all body content optically centred without disturbing the fixed chrome. */
.body{padding-top:14px;padding-bottom:10px}
.slide[data-type=quote] .body{padding-top:12px;padding-bottom:12px}
.slide[data-type=algorithm] .body{padding-top:8px;padding-bottom:3px}

/* Projector readability pass: larger type, decisive hierarchy, no washed-out labels. */
:root{
  --paper:#F3F5F4;
  --paper-2:#E8EDEC;
  --panel:#FFFDF9;
  --ink:#10263B;
  --ink-2:#1A344B;
  --muted:#29455C;
  --soft:#3D586F;
  --line:#BDCAD6;
  --line-2:#D9E2E9;
  --steel:#1B587F;
  --steel-2:#123F60;
  --steel-pale:#E5EEF5;
  --copper:#7D4C1E;
  --copper-pale:#F2E6D4;
  --brick:#963725;
  --brick-pale:#F3E2DB;
  --navy:#0E263D;
  --navy-2:#153B59;
}

html,body{background:#C9D3DD}
.slide{
  background-image:
    radial-gradient(ellipse at 92% 0%,rgba(37,91,126,.10),transparent 30%),
    radial-gradient(ellipse at 2% 100%,rgba(150,55,37,.055),transparent 28%),
    linear-gradient(138deg,#F9FAF9 0%,#F2F5F4 58%,#E8EEEE 100%);
}
.slide.dark{
  background-image:
    radial-gradient(ellipse at 88% 4%,rgba(94,144,181,.24),transparent 34%),
    radial-gradient(ellipse at 6% 98%,rgba(150,55,37,.14),transparent 30%),
    linear-gradient(142deg,#0E263D 0%,#163651 54%,#1C4866 100%);
}
.top{
  height:42px;
  color:#405D74;
  font-size:15px;
  font-weight:600;
  letter-spacing:.055em;
  border-color:#BCCBD8;
}
.brand-label{color:#164C70;font-weight:800}
.section{
  margin-bottom:9px;
  color:#9A3A28;
  font-size:15px;
  font-weight:800;
  letter-spacing:.15em;
}
.title{color:#0D2237;font-size:45px;line-height:1.24}
.lead{color:#203D55;font-size:21px;line-height:1.56}
.quote{color:#0D2237;font-size:53px}
.dark .top,.dark .foot{color:#D5E4F1;border-color:rgba(255,255,255,.24)}
.dark .brand-label,.dark .section{color:#F2A382}
.dark .title,.dark .quote{color:#FFFFFF}
.dark .lead{color:#E4EEF7}

.card{background:#FFFEFB;border-color:#C4D1DD;border-top-width:4px}
.card .n,.step .n{
  display:inline-block;
  width:fit-content;
  padding:4px 7px 3px;
  border-radius:4px;
  background:#F3E5DF;
  color:#8E3424;
  font-size:13px;
  font-weight:800;
  letter-spacing:.11em;
}
.card h3{color:#10273D;font-size:22px;font-weight:700}
.card p{color:#29455C;font-size:17.2px;line-height:1.58}
.cards.four .card h3{font-size:20px}
.cards.four .card p{font-size:16.3px;line-height:1.55}
.step h3{color:#10273D;font-size:21px;font-weight:700}
.step p{color:#29455C;font-size:16.4px;line-height:1.56}
.icon-line{color:#2C485E;font-size:18px;font-weight:600}
.arch-node h3{color:#10273D}
.arch-node p{color:#29465D;font-size:15.4px;line-height:1.52}
.arch-node span{color:#3C596F;font-size:14.4px;line-height:1.48}
.caption,.algo-caption{color:#344F65;font-size:14.6px;line-height:1.48}
.tagline{
  display:block;
  margin-top:16px;
  color:#29465D;
  font-size:18px;
  font-weight:750;
  letter-spacing:.075em;
}
.dark .tagline,.slide.dark .tagline{color:#E7F0F8}

.insight-rail{
  border-color:#C2D0DC;
  border-left-color:#1B587F;
  box-shadow:0 18px 38px -34px rgba(12,34,52,.55);
}
.insight-rail .detail{padding:14px 16px}
.insight-rail .detail b{
  color:#134E77;
  font-size:14px;
  font-weight:850;
  letter-spacing:.07em;
}
.insight-rail .detail span{color:#29455C;font-size:16.4px;line-height:1.48}
.insight-rail .detail:nth-child(2) b{color:#765018}
.insight-rail .detail:nth-child(3) b{color:#4E477C}
.deliverable-line{
  margin-top:10px;
  padding:11px 14px;
  color:#29455C;
  font-size:15.2px;
  line-height:1.48;
}
.deliverable-line b{color:#863323;font-size:13px;font-weight:850}
.dark .insight-rail{border-color:rgba(255,255,255,.24);border-left-color:#F2A382}
.dark .insight-rail .detail span,.slide.dark .insight-rail .detail span,
.dark .deliverable-line,.slide.dark .deliverable-line{color:#E8F1F9}

/* Comparison pages: the "before" column remains secondary, never illegible. */
.slide[data-type=compare] .card .icon-line{color:#334F64;font-size:18px;font-weight:600}
.slide[data-type=compare] .card:first-child .icon-line{color:#40596D}
.slide[data-type=compare] .card:first-child .dot{background:#6E8798}
.slide[data-type=compare] .tagline{
  margin-top:12px;
  padding-left:13px;
  border-left:4px solid #963725;
  color:#203D55;
  font-size:18px;
}

/* Page 2 and dense evidence pages keep a clear two-column reading order. */
.page-2 .quote{font-size:54px;line-height:1.25;max-width:1490px}
.page-2 .lead{font-size:21.5px;color:#E7F0F8}
.page-2 .card{padding:18px 20px}
.page-2 .card h3{font-size:22px}
.page-2 .insight-rail .detail b{font-size:14px}
.page-2 .insight-rail .detail span{font-size:16.6px;line-height:1.46}
.page-2 .deliverable-line{font-size:15.4px}

/* Algorithm pages: 2:1 real interface at full width; compact evidence rail. */
.slide[data-type=algorithm] .body,
.slide[data-type=demo] .body{
  justify-content:center;
  padding:5px 0 2px;
}
.slide[data-type=algorithm] .section,
.slide[data-type=demo] .section{margin-bottom:5px;font-size:14px}
.slide[data-type=algorithm] .title,
.slide[data-type=demo] .title{
  margin:0 0 8px;
  font-size:37px;
  line-height:1.17;
  max-width:1440px;
}
.slide[data-type=algorithm] .algorithm-layout,
.slide[data-type=demo] .algorithm-layout{
  grid-template-columns:minmax(0,1fr) 218px;
  gap:12px;
  height:600px;
  align-items:stretch;
}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame{
  width:100%;
  height:600px;
  padding:3px;
  overflow:hidden;
  border:1px solid #B7C7D4;
  border-radius:8px;
  background:#EFF3F5;
  box-shadow:0 24px 54px -40px rgba(12,34,52,.62);
}
.slide[data-type=algorithm] .algorithm-frame img,
.slide[data-type=demo] .algorithm-frame img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
}
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{
  height:600px;
  padding:14px 12px;
  gap:8px;
  border:1px solid #BFCEDB;
  border-left:4px solid #1B587F;
  border-radius:8px;
  background:linear-gradient(158deg,#FFFFFF 0%,#EEF3F8 100%);
  box-shadow:0 18px 38px -33px rgba(12,34,52,.58);
}
.algorithm-kicker{
  color:#873322;
  font-size:12.8px;
  font-weight:850;
  letter-spacing:.105em;
  line-height:1.35;
}
.algorithm-big{
  color:#12324F;
  font-size:17.2px;
  line-height:1.5;
  font-weight:700;
}
.algorithm-insights{gap:7px}
.side-detail{
  padding:7px 8px;
  border-left-width:3px;
  background:#F4F8FB;
  border-radius:0 4px 4px 0;
}
.side-detail b{font-size:12.7px;font-weight:850;line-height:1.25;margin-bottom:2px}
.side-detail span{color:#29455C;font-size:14.2px;line-height:1.45}
.algo-open{font-size:13.2px;font-weight:750;padding:7px 10px;background:#174E74}
.algorithm-delivery{padding:7px 8px;background:#F2E8D9;border-left-width:3px}
.algorithm-delivery b{font-size:12.2px;font-weight:850;color:#873322}
.algorithm-delivery span{color:#29455C;font-size:13.5px;line-height:1.43}
.slide[data-type=algorithm] .algo-caption,
.slide[data-type=demo] .algo-caption{
  margin-top:5px;
  color:#36536A;
  font-size:14.2px;
  line-height:1.4;
}

/* Cover and close: stronger small-type contrast without changing the composition. */
.cover-points span{color:#29465D;font-size:15.8px}
.cover-points b{color:#8E3424;font-size:12.5px;font-weight:850}
.cover-main .notes{color:#36536A;font-size:15px}
.stack-label b{color:var(--tone);font-size:15px;font-weight:850}
.stack-label strong{color:#0B2033;font-size:16.5px;font-weight:800}
.stack-label small{color:#29465D;font-size:13.2px;font-weight:600}
.stack-label:nth-child(1){--tone:#174B70}
.stack-label:nth-child(2){--tone:#765018}
.stack-label:nth-child(3){--tone:#3E537C}
.stack-label:nth-child(4){--tone:#873322}
.stack-caption{color:#36536A;font-size:12.5px;font-weight:800}
.close-layout .pill{font-size:15px;font-weight:650;color:#29465D}
.video-link{font-size:13.5px;font-weight:750}

/* ===== Final legibility + algorithm-stage pass (do not move above earlier theme layers) =====
   Some dark slides intentionally use white evidence cards. Their text must stay dark;
   the cover and close pages use dark backgrounds, so their translucent pills need
   light type or an explicitly white surface. Keep these declarations last. */
.slide .top{font-size:15px}
.slide .foot{font-size:13.8px}
.slide .section{font-size:14.2px}

/* Cover: the four proof points are a white information strip, not glass on navy. */
.page-1 .cover-points{
  background:#FFFFFF;
  border:1px solid #C7D4E3;
  border-radius:10px;
  box-shadow:0 18px 42px -34px rgba(3,17,34,.72);
}
.page-1 .cover-points span{
  color:#233E56;
  font-size:15.8px;
  line-height:1.5;
}
.page-1 .cover-points span:nth-child(2n){border-left-color:#D4DFEB}
.page-1 .cover-points span:nth-child(n+3){border-top-color:#D4DFEB}
.page-1 .cover-points b{color:#8E3424;font-size:12.5px}
.page-1 .cover-main .notes{color:#C7D8E8;font-size:15px}
.page-1 .cover-main .tagline{color:#DCE8F3;font-size:16.5px}

/* Dark chapter pages: white evidence rails with ink type, never light-on-white. */
.slide.dark .insight-rail{
  background:#FFFFFF;
  border-color:#CBD8E6;
  border-left-color:#A5482F;
  box-shadow:0 18px 38px -34px rgba(3,17,34,.62);
}
.slide.dark .insight-rail .detail,
.slide.dark .insight-rail .detail span{color:#233E56}
.slide.dark .insight-rail .detail b{color:#7C2D20}
.slide.dark .insight-rail .detail:nth-child(2) b{color:#765018}
.slide.dark .insight-rail .detail:nth-child(3) b{color:#4B3D80}
.slide.dark .insight-rail .detail:nth-child(4) b{color:#174E74}
.slide.dark .insight-rail .detail+.detail{border-left-color:#D4DFEB}
.slide.dark .insight-rail .detail-full{
  background:#EEF3F8;
  border-top-color:#D4DFEB;
  border-left-color:#D4DFEB;
  color:#233E56;
}
.slide.dark .insight-rail .detail-full b{color:#7C2D20}
.slide.dark .deliverable-line{
  background:#FFFFFF;
  border-color:#CBD8E6;
  border-left-color:#A5482F;
  color:#233E56;
}
.slide.dark .deliverable-line b{color:#8E3424}

/* Page 2 is the densest white-rail page: slightly larger secondary text and a
   cleaner 2 x 2 reading order. */
.page-2 .insight-rail{
  background:#FFFFFF;
  border-color:#CBD8E6;
  border-left-color:#A5482F;
  box-shadow:0 18px 38px -34px rgba(3,17,34,.62);
}
.page-2 .insight-rail .detail{padding:15px 17px}
.page-2 .insight-rail .detail span{color:#233E56;font-size:16.4px;line-height:1.5}
.page-2 .insight-rail .detail b{font-size:13.6px}
.page-2 .deliverable-line{
  background:#FFFFFF;
  border-color:#CBD8E6;
  border-left-color:#A5482F;
  color:#233E56;
  font-size:15.2px;
}
.page-2 .deliverable-line b{color:#8E3424;font-size:13px}
.page-2 .card{box-shadow:0 14px 30px -28px rgba(3,17,34,.5)}

/* Architecture labels: all four tones clear of 4.5:1 on white. */
.arch-flow .arch-node:nth-child(1)>b{color:#174E74}
.arch-flow .arch-node:nth-child(2)>b{color:#765018}
.arch-flow .arch-node:nth-child(3)>b{color:#4B3D80}
.arch-flow .arch-node:nth-child(4)>b{color:#8E2F27}

/* Close page: white pills on navy, consistent with the cover proof strip. */
.page-30 .pill{
  background:#FFFFFF;
  border-color:#C7D4E3;
  color:#233E56;
  font-size:15.2px;
  font-weight:650;
}
.page-30 .stack-label{
  background:linear-gradient(90deg,#FFFFFF,#F7FAFD);
  border-left-width:4px;
}
.page-30 .stack-label b{font-size:14px}
.page-30 .stack-label strong{color:#10243D;font-size:16px}
.page-30 .stack-label small{color:#2B455D;font-size:13px}

/* Algorithm stages: give the real interface more area and keep the evidence rail
   compact. The capture is 2:1, so a 1264 x 620 frame renders it without distortion. */
.slide[data-type=algorithm] .body,
.slide[data-type=demo] .body{padding:4px 0 2px}
.slide[data-type=algorithm] .title,
.slide[data-type=demo] .title{font-size:36px;line-height:1.15;margin-bottom:7px}
.slide[data-type=algorithm] .algorithm-layout,
.slide[data-type=demo] .algorithm-layout{
  grid-template-columns:minmax(0,1fr) 196px;
  gap:12px;
  height:620px;
}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame{
  height:620px;
  padding:0;
  border:2px solid #2C4B68;
  border-radius:10px;
  background:#DCE5EF;
  box-shadow:0 26px 56px -38px rgba(7,24,42,.72);
}
.slide[data-type=algorithm] .algorithm-frame img,
.slide[data-type=demo] .algorithm-frame img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  background:#F3F6F9;
}
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{
  height:620px;
  padding:14px 12px;
  gap:8px;
}
.algorithm-kicker{font-size:13.2px;line-height:1.35}
.algorithm-big{font-size:17.8px;line-height:1.48}
.side-detail{padding:8px 8px}
.side-detail b{font-size:13.2px;line-height:1.3}
.side-detail span{font-size:14.8px;line-height:1.46}
.algo-open{font-size:13.6px;padding:8px 10px}
.algorithm-delivery span{font-size:14px;line-height:1.45}
.slide[data-type=algorithm] .algo-caption,
.slide[data-type=demo] .algo-caption{font-size:14.6px;margin-top:5px}

/* ===== Delivery pass: cool consulting deck, isolated from the cinematic film =====
   The HTML deck is deliberately cool-white / steel-blue. The Motion film uses a
   dark navy stage with warm copper highlights, so the two artefacts read as a
   family rather than two copies of the same template. */
:root{
  --paper:#F5F8FC;
  --paper-2:#EAF0F7;
  --panel:#FFFFFF;
  --ink:#0B2035;
  --ink-2:#17344F;
  --muted:#29465F;
  --soft:#46627A;
  --line:#C7D4E2;
  --line-2:#DCE5EE;
  --steel:#1B5A86;
  --steel-2:#123F63;
  --steel-pale:#E8F0F7;
  --copper:#815224;
  --copper-pale:#F3EADF;
  --brick:#9A3929;
  --brick-pale:#F3E5E0;
  --navy:#0B2035;
  --navy-2:#143754;
}

html,body{background:#C9D4E0}
.slide{
  background-color:var(--paper);
  background-image:
    radial-gradient(ellipse at 94% 0%,rgba(28,91,134,.095),transparent 32%),
    radial-gradient(ellipse at 0% 100%,rgba(154,57,41,.035),transparent 28%),
    linear-gradient(138deg,#FFFFFF 0%,#F4F8FC 58%,#E9F0F7 100%);
}
.slide.dark{
  background-color:var(--navy);
  background-image:
    radial-gradient(ellipse at 88% 4%,rgba(91,140,178,.25),transparent 35%),
    radial-gradient(ellipse at 6% 98%,rgba(154,57,41,.13),transparent 30%),
    linear-gradient(142deg,#0B2035 0%,#12314B 54%,#193F5D 100%);
}
.slide .card,
.slide .step,
.slide .arch-node,
.slide .photo-wrap,
.slide .insight-rail,
.slide .deliverable-line,
.page-2 .card{background:#FFFFFF}
.slide .card{border-color:#CCD8E5;box-shadow:0 16px 34px -30px rgba(8,28,47,.5)}
.slide .step{background:linear-gradient(180deg,#FFFFFF,#F3F7FB)}
.card p,.step p,.arch-node p,.arch-node span,.insight-rail .detail span,
.deliverable-line,.caption{color:#29465F}
.section{color:#9A3929}
.brand-label{color:#154E75}

/* Algorithm pages: the actual interactive canvas is the hero; the evidence rail
   is a compact, high-contrast annotation rather than a second content column. */
.slide[data-type=algorithm] .algorithm-layout,
.slide[data-type=demo] .algorithm-layout{
  grid-template-columns:minmax(0,1042px) 232px;
  justify-content:center;
  align-items:stretch;
  gap:18px;
  height:620px;
}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame{
  width:100%;
  height:620px;
  padding:0;
  border:1px solid #9DB2C7;
  border-radius:12px;
  background:
    linear-gradient(180deg,#F8FAFD 0%,#EFF4F9 100%);
  box-shadow:
    0 0 0 5px rgba(255,255,255,.72),
    0 26px 54px -36px rgba(8,28,47,.66);
}
.slide[data-type=algorithm] .algorithm-frame img,
.slide[data-type=demo] .algorithm-frame img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  background:#F7F9FB;
}
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{
  height:620px;
  padding:20px 16px;
  gap:11px;
  border:1px solid #244A69;
  border-left:4px solid #C66F4E;
  border-radius:10px;
  background:
    radial-gradient(ellipse at 110% 0%,rgba(109,157,193,.28),transparent 42%),
    linear-gradient(158deg,#0E2A43 0%,#163D5C 100%);
  box-shadow:0 22px 48px -34px rgba(3,17,32,.72);
}
.slide[data-type=algorithm] .algorithm-kicker,
.slide[data-type=demo] .algorithm-kicker{
  color:#F1B79C;
  font-size:13.2px;
  line-height:1.4;
}
.slide[data-type=algorithm] .algorithm-big,
.slide[data-type=demo] .algorithm-big{
  color:#FFFFFF;
  font-size:18px;
  line-height:1.52;
  font-weight:650;
}
.slide[data-type=algorithm] .algorithm-insights,
.slide[data-type=demo] .algorithm-insights{gap:8px}
.slide[data-type=algorithm] .side-detail,
.slide[data-type=demo] .side-detail{
  padding:8px 0 8px 10px;
  background:transparent;
  border-left:2px solid rgba(167,196,220,.42);
  border-radius:0;
}
.slide[data-type=algorithm] .side-detail b,
.slide[data-type=demo] .side-detail b{
  color:#A9CEEB;
  font-size:13px;
  line-height:1.3;
}
.slide[data-type=algorithm] .side-detail:nth-child(2) b,
.slide[data-type=demo] .side-detail:nth-child(2) b{color:#F0C493}
.slide[data-type=algorithm] .side-detail:nth-child(3) b,
.slide[data-type=demo] .side-detail:nth-child(3) b{color:#F1A98D}
.slide[data-type=algorithm] .side-detail span,
.slide[data-type=demo] .side-detail span{
  color:#E4EEF7;
  font-size:14.5px;
  line-height:1.48;
}
.slide[data-type=algorithm] .algo-open,
.slide[data-type=demo] .algo-open{
  background:#F7FAFD;
  color:#123A59;
  font-size:13.4px;
  font-weight:800;
  padding:8px 11px;
  border-radius:5px;
}
.slide[data-type=algorithm] .algorithm-delivery,
.slide[data-type=demo] .algorithm-delivery{
  padding:9px 10px;
  background:rgba(255,255,255,.085);
  border-left:3px solid #C66F4E;
  border-radius:0 5px 5px 0;
}
.slide[data-type=algorithm] .algorithm-delivery b,
.slide[data-type=demo] .algorithm-delivery b{color:#F1B79C;font-size:12.2px}
.slide[data-type=algorithm] .algorithm-delivery span,
.slide[data-type=demo] .algorithm-delivery span{
  color:#E8F1F9;
  font-size:14px;
  line-height:1.46;
}
.slide[data-type=algorithm] .algo-caption,
.slide[data-type=demo] .algo-caption{
  margin-top:8px;
  color:#344F65;
  font-size:14.2px;
}

/* Small labels on the cover and closing architecture must remain dark-on-white. */
.page-1 .stack-label b,.page-30 .stack-label b{color:var(--tone);font-size:14px}
.page-1 .stack-label strong,.page-30 .stack-label strong{color:#0B2035;font-size:16px}
.page-1 .stack-label small,.page-30 .stack-label small{color:#1D3B54;font-size:13px}
.page-2 .insight-rail .detail span{color:#1E3C55}
.page-2 .deliverable-line{color:#233F57}

/* ===== Final production pass ===============================================
   One cool consulting palette for the deck. The film stays warm ivory; this
   deck is cool white / steel blue with restrained brass, so the two artefacts
   never look like the same template. Text colours are set explicitly instead
   of inheriting from older warm-paper rules. */
:root{
  --red:#1B5A86;
  --red2:#2C709E;
  --blue:#1B5A86;
  --gold:#80622A;
  --violet:#5B567F;
  --ink:#10263D;
  --muted:#24435B;
  --soft:#405D76;
}

.slide:not(.dark) .title,
.slide:not(.dark) .cover-title,
.slide:not(.dark) .quote,
.slide:not(.dark) .card h3,
.slide:not(.dark) .step h3,
.slide:not(.dark) .arch-node h3{color:#10263D}
.slide:not(.dark) .lead,
.slide:not(.dark) .cover-sub,
.slide:not(.dark) .card p,
.slide:not(.dark) .step p,
.slide:not(.dark) .arch-node p,
.slide:not(.dark) .arch-node span,
.slide:not(.dark) .caption,
.slide:not(.dark) .tagline,
.slide:not(.dark) .notes{color:#24435B}
.slide:not(.dark) .section{color:#1B5A86}
.slide:not(.dark) .brand-label{color:#1B5A86}
.slide:not(.dark) .card .n,
.slide:not(.dark) .step .n{color:#1B5A86}

.slide.dark .title,
.slide.dark .quote,
.slide.dark .cover-title{color:#FFFFFF}
.slide.dark .lead,
.slide.dark .cover-sub,
.slide.dark .tagline,
.slide.dark .notes{color:#E4EEF7}
.slide.dark .section,
.slide.dark .brand-label{color:#A9D0EB}
.slide.dark .card h3{color:#10263D}
.slide.dark .card p{color:#24435B}
.slide.dark .pill{color:#17344F;background:#FFFFFF;border-color:#C7D4E3}
.slide.dark .insight-rail{background:#FFFFFF;border-color:#C8D5E3;border-left-color:#1B5A86}
.slide.dark .insight-rail .detail span,
.slide.dark .insight-rail .detail-full,
.slide.dark .deliverable-line{color:#1E3A52!important}
.slide.dark .insight-rail .detail b{color:#1B5A86}
.slide.dark .insight-rail .detail:nth-child(2) b{color:#80622A}
.slide.dark .insight-rail .detail:nth-child(3) b{color:#5B567F}
.slide.dark .insight-rail .detail:nth-child(4) b{color:#1B5A86}
.slide.dark .deliverable-line b{color:#1B5A86}

.video-link{color:#1B5A86}
.progress{background:#1B5A86}

/* Algorithm pages: the real 30-second canvas is the hero. The old capture
   included a full right-hand explanation column inside the image; the plot-only
   crop lets the drawing occupy the full height while the HTML result block keeps
   the vote count / convergence sentence complete and legible. */
.slide[data-type=algorithm] .body,
.slide[data-type=demo] .body{
  justify-content:center;
  padding:0;
}
.slide[data-type=algorithm] .section,
.slide[data-type=demo] .section{margin-bottom:8px}
.slide[data-type=algorithm] .title,
.slide[data-type=demo] .title{
  font-size:37px;
  line-height:1.16;
  margin:0 0 12px;
}
.slide[data-type=algorithm] .algorithm-layout,
.slide[data-type=demo] .algorithm-layout{
  display:grid;
  grid-template-columns:minmax(0,1000px) 216px;
  grid-template-rows:1fr;
  justify-content:center;
  align-items:stretch;
  gap:16px;
  height:640px;
  flex:none;
}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame{
  width:100%;
  height:640px;
  padding:0;
  overflow:hidden;
  border:1px solid #BFAF98;
  border-radius:8px;
  background:#F4EFE3;
  box-shadow:
    0 0 0 5px rgba(255,255,255,.78),
    0 28px 58px -38px rgba(8,28,47,.64);
}
.slide[data-type=algorithm] .algorithm-frame img,
.slide[data-type=demo] .algorithm-frame img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  background:#F4EFE3;
}
.frame-hint{display:none}
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  height:640px;
  padding:16px 13px;
  gap:10px;
  border:1px solid #214763;
  border-left:4px solid #C07A4E;
  border-radius:8px;
  background:
    radial-gradient(ellipse at 110% 0%,rgba(106,154,190,.25),transparent 42%),
    linear-gradient(160deg,#0C263D 0%,#153A57 100%);
  box-shadow:0 24px 50px -36px rgba(3,17,32,.74);
}
.slide[data-type=algorithm] .algorithm-kicker,
.slide[data-type=demo] .algorithm-kicker{
  color:#F0B394;
  font-size:11.6px;
  line-height:1.35;
  letter-spacing:.06em;
  font-weight:800;
}
.slide[data-type=algorithm] .algorithm-result,
.slide[data-type=demo] .algorithm-result{
  padding:9px 10px;
  border-left:3px solid #C07A4E;
  border-radius:0 4px 4px 0;
  background:#F7EEE2;
}
.slide[data-type=algorithm] .algorithm-result b,
.slide[data-type=demo] .algorithm-result b{
  display:block;
  margin-bottom:4px;
  color:#8A4128;
  font-size:10.8px;
  line-height:1.2;
  letter-spacing:.12em;
}
.slide[data-type=algorithm] .algorithm-result span,
.slide[data-type=demo] .algorithm-result span{
  display:block;
  color:#122A3F;
  font-size:14.2px;
  line-height:1.48;
  font-weight:750;
}
.slide[data-type=algorithm] .algorithm-insights,
.slide[data-type=demo] .algorithm-insights{gap:6px}
.slide[data-type=algorithm] .side-detail,
.slide[data-type=demo] .side-detail{
  padding:6px 0 6px 9px;
  background:transparent;
  border-left:2px solid rgba(164,196,220,.45);
  border-radius:0;
}
.slide[data-type=algorithm] .side-detail b,
.slide[data-type=demo] .side-detail b{
  color:#A9CEEB;
  font-size:11.4px;
  line-height:1.25;
  letter-spacing:.03em;
}
.slide[data-type=algorithm] .side-detail:nth-child(2) b,
.slide[data-type=demo] .side-detail:nth-child(2) b{color:#F0C493}
.slide[data-type=algorithm] .side-detail:nth-child(3) b,
.slide[data-type=demo] .side-detail:nth-child(3) b{color:#F1A98D}
.slide[data-type=algorithm] .side-detail span,
.slide[data-type=demo] .side-detail span{
  color:#E7F0F8;
  font-size:13.4px;
  line-height:1.46;
}
.slide[data-type=algorithm] .algo-open,
.slide[data-type=demo] .algo-open{
  display:block;
  margin-top:auto;
  text-align:center;
  background:#F8FBFE;
  color:#123A59;
  font-size:12.8px;
  font-weight:800;
  padding:8px 9px;
  border-radius:4px;
}
.slide[data-type=algorithm] .algorithm-delivery,
.slide[data-type=demo] .algorithm-delivery{
  padding:8px 9px;
  background:rgba(255,255,255,.085);
  border-left:3px solid #C07A4E;
  border-radius:0 4px 4px 0;
}
.slide[data-type=algorithm] .algorithm-delivery b,
.slide[data-type=demo] .algorithm-delivery b{
  color:#F0B394;
  font-size:10.8px;
  line-height:1.2;
}
.slide[data-type=algorithm] .algorithm-delivery span,
.slide[data-type=demo] .algorithm-delivery span{
  color:#EAF3FA;
  font-size:12.9px;
  line-height:1.44;
}
.slide[data-type=algorithm] .algo-caption,
.slide[data-type=demo] .algo-caption{
  margin-top:9px;
  color:#1B3A52;
  font-size:13.6px;
  line-height:1.4;
}

@media(max-height:760px){
  .slide[data-type=algorithm] .algorithm-layout,
  .slide[data-type=demo] .algorithm-layout,
  .slide[data-type=algorithm] .algorithm-frame,
  .slide[data-type=demo] .algorithm-frame,
  .slide[data-type=algorithm] .algorithm-side,
  .slide[data-type=demo] .algorithm-side{height:560px}
}

/* ===== Final art direction =================================================
   Editorial consulting deck: cold white paper, steel-blue structure, deep ink.
   Page 2 becomes a two-column argument instead of a flat card matrix. The three
   interactive lessons become a full-height product canvas with a compact, light
   evidence rail. Nothing is green, pure black, or stretched. */
:root{
  --paper:#F4F7FA;
  --paper-2:#EAF0F6;
  --panel:#FFFFFF;
  --ink:#0C2238;
  --ink-2:#18364F;
  --muted:#29465E;
  --soft:#49647A;
  --line:#C5D2DE;
  --line-2:#DAE3EC;
  --steel:#185777;
  --steel-2:#103E5A;
  --steel-pale:#EAF2F8;
  --copper:#7D5A2B;
  --copper-pale:#F4ECE1;
  --brick:#8F3D2B;
  --navy:#0B2136;
  --navy-2:#153A56;
}

/* --- Page 2: thesis on the left, evidence on the right ------------------- */
.slide.page-2{background-image:
  radial-gradient(ellipse at 92% 8%,rgba(76,130,168,.24),transparent 34%),
  linear-gradient(143deg,#0A2035 0%,#11314B 58%,#17415F 100%);
}
.page-2 .body{
  display:grid;
  grid-template-columns:minmax(0,1.54fr) minmax(420px,.76fr);
  grid-template-rows:auto auto auto auto auto;
  column-gap:38px;
  align-content:center;
  align-items:start;
  width:100%;
  max-width:1472px;
  margin:0 auto;
  padding:4px 0 0;
}
.page-2 .section{
  grid-column:1;
  grid-row:1;
  margin:0 0 14px;
  color:#A8D0E8;
  font-size:13.5px;
  font-weight:800;
  letter-spacing:.19em;
}
.page-2 .quote{
  grid-column:1;
  grid-row:2;
  max-width:860px;
  margin:0;
  color:#FFFFFF;
  font-size:47px;
  line-height:1.25;
  letter-spacing:.012em;
}
.page-2 .lead{
  grid-column:1;
  grid-row:3;
  max-width:840px;
  margin:15px 0 0;
  color:#D8E7F2;
  font-size:19px;
  line-height:1.62;
}
.page-2 .cards{
  grid-column:1;
  grid-row:4;
  align-self:start;
  display:grid;
  grid-template-columns:1fr;
  gap:0;
  margin-top:25px;
  border-top:1px solid rgba(206,225,238,.24);
}
.page-2 .card{
  display:grid;
  grid-template-columns:48px 1fr;
  align-items:center;
  min-height:64px;
  padding:11px 2px;
  border:0;
  border-bottom:1px solid rgba(206,225,238,.2);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.page-2 .card .n{
  display:flex;
  align-items:center;
  height:100%;
  margin:0;
  color:#8FC3E1;
  font-size:11.5px;
  font-weight:850;
  letter-spacing:.13em;
}
.page-2 .card h3{
  margin:0;
  color:#FFFFFF;
  font-size:20px;
  line-height:1.4;
  font-weight:600;
}
.page-2 .insight-rail{
  grid-column:2;
  grid-row:1 / span 4;
  display:grid;
  grid-template-columns:1fr;
  align-self:stretch;
  margin:0;
  border:1px solid rgba(200,218,231,.55);
  border-left:4px solid #79B3D5;
  border-radius:9px;
  background:#FFFFFF;
  box-shadow:0 28px 58px -42px rgba(0,10,22,.78);
  overflow:hidden;
}
.page-2 .insight-rail .detail{
  display:block;
  padding:16px 20px 15px;
  border:0;
  border-bottom:1px solid #DCE5ED;
  background:#FFFFFF;
}
.page-2 .insight-rail .detail:last-child{border-bottom:0}
.page-2 .insight-rail .detail b{
  display:block;
  margin:0 0 5px;
  color:#185777;
  font-size:12.5px;
  font-weight:850;
  letter-spacing:.09em;
}
.page-2 .insight-rail .detail:nth-child(2) b{color:#7D5A2B}
.page-2 .insight-rail .detail:nth-child(3) b{color:#8F3D2B}
.page-2 .insight-rail .detail:nth-child(4) b{color:#103E5A}
.page-2 .insight-rail .detail span{
  display:block;
  color:#17344B!important;
  font-size:15.3px;
  line-height:1.52;
}
.page-2 .deliverable-line{
  grid-column:1 / -1;
  grid-row:5;
  margin-top:18px;
  padding:12px 16px;
  border:1px solid rgba(202,222,236,.24);
  border-left:4px solid #C77955;
  border-radius:0 5px 5px 0;
  background:rgba(255,255,255,.075);
  color:#DDEAF3!important;
  font-size:14.2px;
  line-height:1.5;
}
.page-2 .deliverable-line b{
  color:#F1B397!important;
  font-size:11.5px;
  letter-spacing:.09em;
}

/* --- Interactive lessons: product canvas first, quiet evidence rail ------ */
.slide[data-type=algorithm] .section,
.slide[data-type=demo] .section{
  margin:0 0 8px;
  color:#185777;
  font-size:13px;
  font-weight:800;
  letter-spacing:.17em;
}
.slide[data-type=algorithm] .title,
.slide[data-type=demo] .title{
  max-width:1110px;
  margin:0 0 13px;
  color:#0C2238;
  font-size:36px;
  line-height:1.18;
}
.slide[data-type=algorithm] .algorithm-layout,
.slide[data-type=demo] .algorithm-layout{
  display:grid;
  grid-template-columns:minmax(0,1040px) 236px;
  grid-template-rows:1fr;
  justify-content:center;
  align-items:stretch;
  gap:20px;
  height:624px;
  max-width:1296px;
  margin:0 auto;
}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame{
  position:relative;
  width:100%;
  height:624px;
  padding:0;
  overflow:hidden;
  border:1px solid #AABFCE;
  border-radius:12px;
  background:#F4EFE3;
  box-shadow:
    0 0 0 5px rgba(255,255,255,.85),
    0 26px 56px -38px rgba(10,34,54,.5);
}
.slide[data-type=algorithm] .algorithm-frame:before,
.slide[data-type=demo] .algorithm-frame:before{
  content:'';
  position:absolute;
  z-index:2;
  left:0;right:0;top:0;
  height:4px;
  background:linear-gradient(90deg,#185777 0 42%,#7D5A2B 42% 68%,#8F3D2B 68% 100%);
}
.slide[data-type=algorithm] .algorithm-frame img,
.slide[data-type=demo] .algorithm-frame img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  background:#F4EFE3;
}
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  height:624px;
  padding:17px 15px 14px;
  gap:9px;
  border:1px solid #C2D0DD;
  border-top:4px solid #185777;
  border-radius:10px;
  background:linear-gradient(180deg,#FFFFFF 0%,#F9FBFD 100%);
  box-shadow:0 22px 46px -38px rgba(10,34,54,.54);
}
.slide[data-type=algorithm] .algorithm-kicker,
.slide[data-type=demo] .algorithm-kicker{
  color:#185777;
  font-size:10.8px;
  line-height:1.35;
  letter-spacing:.095em;
  font-weight:850;
}
.slide[data-type=algorithm] .algorithm-result,
.slide[data-type=demo] .algorithm-result{
  padding:10px 11px;
  border:0;
  border-left:3px solid #185777;
  border-radius:0 5px 5px 0;
  background:#EAF2F8;
}
.slide[data-type=algorithm] .algorithm-result b,
.slide[data-type=demo] .algorithm-result b{
  margin-bottom:5px;
  color:#185777;
  font-size:10.5px;
  letter-spacing:.11em;
}
.slide[data-type=algorithm] .algorithm-result span,
.slide[data-type=demo] .algorithm-result span{
  color:#0C2238;
  font-size:14.2px;
  line-height:1.5;
  font-weight:750;
}
.slide[data-type=algorithm] .algorithm-insights,
.slide[data-type=demo] .algorithm-insights{
  display:grid;
  gap:0;
  border-top:1px solid #DCE5ED;
}
.slide[data-type=algorithm] .side-detail,
.slide[data-type=demo] .side-detail{
  padding:9px 0 8px;
  border:0;
  border-bottom:1px solid #E2E9EF;
  border-radius:0;
  background:transparent;
}
.slide[data-type=algorithm] .side-detail b,
.slide[data-type=demo] .side-detail b{
  margin-bottom:3px;
  color:#185777;
  font-size:11.1px;
  line-height:1.25;
  letter-spacing:.055em;
}
.slide[data-type=algorithm] .side-detail:nth-child(2) b,
.slide[data-type=demo] .side-detail:nth-child(2) b{color:#7D5A2B}
.slide[data-type=algorithm] .side-detail:nth-child(3) b,
.slide[data-type=demo] .side-detail:nth-child(3) b{color:#8F3D2B}
.slide[data-type=algorithm] .side-detail span,
.slide[data-type=demo] .side-detail span{
  color:#203E55;
  font-size:13.2px;
  line-height:1.48;
}
.slide[data-type=algorithm] .algo-open,
.slide[data-type=demo] .algo-open{
  display:block;
  margin-top:auto;
  padding:8px 9px;
  border:1px solid #9FB9CC;
  border-radius:4px;
  background:#FFFFFF;
  color:#124866;
  font-size:12.7px;
  font-weight:850;
  text-align:center;
  text-decoration:none;
}
.slide[data-type=algorithm] .algorithm-delivery,
.slide[data-type=demo] .algorithm-delivery{
  padding:8px 9px;
  border:0;
  border-left:3px solid #A66A47;
  border-radius:0 4px 4px 0;
  background:#F6F0E8;
}
.slide[data-type=algorithm] .algorithm-delivery b,
.slide[data-type=demo] .algorithm-delivery b{
  color:#7A432B;
  font-size:10.4px;
}
.slide[data-type=algorithm] .algorithm-delivery span,
.slide[data-type=demo] .algorithm-delivery span{
  color:#233E53;
  font-size:12.2px;
  line-height:1.46;
}
.slide[data-type=algorithm] .algo-caption,
.slide[data-type=demo] .algo-caption{
  max-width:1296px;
  margin:8px auto 0;
  color:#29485F;
  font-size:13px;
  line-height:1.4;
}

/* Keep body copy legible on every dark slide, including cards nested on light
   surfaces. Explicit colours avoid inheritance from earlier warm-paper styles. */
.slide.dark .card p,
.slide.dark .step p,
.slide.dark .arch-node p,
.slide.dark .arch-node span{color:#24435B}
.slide.dark .card h3,
.slide.dark .step h3,
.slide.dark .arch-node h3{color:#10263D}
.slide.dark .insight-rail .detail span,
.slide.dark .insight-rail .detail-full,
.slide.dark .deliverable-line{color:#17344B!important}

/* Page-specific contrast guard: page 2's argument rows live directly on navy,
   unlike the white cards used elsewhere on dark slides. */
.slide.page-2 .card h3,
.slide.page-2 .card .n{color:#FFFFFF!important}
.slide.page-2 .card .n{
  display:flex;
  align-items:center;
  justify-content:center;
  width:31px;
  height:31px;
  border:1px solid rgba(171,207,229,.48);
  border-radius:3px;
  color:#CFE5F2!important;
  background:rgba(255,255,255,.07);
}
.page-2 .insight-rail .detail{
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.slide[data-type=algorithm] .algorithm-result span,
.slide[data-type=demo] .algorithm-result span{font-size:15.1px}
.slide[data-type=algorithm] .side-detail span,
.slide[data-type=demo] .side-detail span{font-size:13.9px;line-height:1.5}
.slide[data-type=algorithm] .algorithm-delivery span,
.slide[data-type=demo] .algorithm-delivery span{font-size:12.8px}

/* ===== Final legibility and evidence-canvas pass ==========================
   Page 2's action strip sits on the navy field, not on a white evidence card.
   The old inherited white surface made its pale copy effectively disappear. */
.slide.page-2 .quote{color:#FFFFFF!important}
.slide.page-2 .deliverable-line{
  background:rgba(255,255,255,.075)!important;
  border-color:rgba(202,222,236,.32)!important;
  border-left-color:#C77955!important;
  color:#E8F1F8!important;
  box-shadow:none!important;
}
.slide.page-2 .deliverable-line b{color:#F3B596!important}

/* Algorithm pages: the real canvas gets the width, the reading rail becomes
   a compact annotation column. Nothing is allowed to stretch the image. */
.slide[data-type=algorithm] .algorithm-layout,
.slide[data-type=demo] .algorithm-layout{
  grid-template-columns:minmax(0,1094px) 208px;
  justify-content:center;
  gap:16px;
  height:620px;
  max-width:1318px;
  margin:0 auto;
}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame{
  display:block;
  width:100%;
  height:620px;
  padding:0;
  overflow:hidden;
  border:1px solid #A9BECF;
  border-radius:10px;
  background:#F4EFE3;
  box-shadow:
    0 0 0 4px rgba(255,255,255,.82),
    0 24px 54px -38px rgba(10,34,54,.48);
}
.slide[data-type=algorithm] .algorithm-frame:before,
.slide[data-type=demo] .algorithm-frame:before{
  height:4px;
  background:linear-gradient(90deg,#185777 0%,#0C2238 100%);
}
.slide[data-type=algorithm] .algorithm-frame img,
.slide[data-type=demo] .algorithm-frame img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
}
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{
  justify-content:center;
  height:620px;
  padding:14px 12px 12px;
  gap:8px;
  border-top-width:3px;
  border-radius:9px;
}
.slide[data-type=algorithm] .algorithm-kicker,
.slide[data-type=demo] .algorithm-kicker{
  font-size:9.8px;
  line-height:1.32;
  letter-spacing:.06em;
}
.slide[data-type=algorithm] .algorithm-result,
.slide[data-type=demo] .algorithm-result{padding:9px 9px}
.slide[data-type=algorithm] .algorithm-result b,
.slide[data-type=demo] .algorithm-result b{font-size:9.6px;letter-spacing:.08em}
.slide[data-type=algorithm] .algorithm-result span,
.slide[data-type=demo] .algorithm-result span{font-size:13.6px;line-height:1.48}
.slide[data-type=algorithm] .side-detail,
.slide[data-type=demo] .side-detail{padding:7px 0 6px}
.slide[data-type=algorithm] .side-detail b,
.slide[data-type=demo] .side-detail b{font-size:10.1px;letter-spacing:.035em}
.slide[data-type=algorithm] .side-detail span,
.slide[data-type=demo] .side-detail span{font-size:12.8px;line-height:1.46}
.slide[data-type=algorithm] .algorithm-delivery,
.slide[data-type=demo] .algorithm-delivery{padding:7px 8px}
.slide[data-type=algorithm] .algorithm-delivery b,
.slide[data-type=demo] .algorithm-delivery b{font-size:9.6px}
.slide[data-type=algorithm] .algorithm-delivery span,
.slide[data-type=demo] .algorithm-delivery span{font-size:12.2px;line-height:1.44}
.slide[data-type=algorithm] .algo-caption,
.slide[data-type=demo] .algo-caption{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  max-width:1318px;
  margin:8px auto 0;
  padding-top:7px;
  border-top:1px solid #CBD7E3;
  color:#29485F;
  font-size:12.5px;
  line-height:1.35;
}
.live-mark{display:inline-flex;align-items:center;gap:7px;font-weight:650;letter-spacing:.02em}
.live-mark i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#9A3D2B;
  box-shadow:0 0 0 3px rgba(154,61,43,.12);
}
.algo-caption-link{
  flex:none;
  color:#124866;
  font-weight:800;
  text-decoration:none;
  border-bottom:1px solid #8FB0C6;
  padding-bottom:1px;
}

/* ===== Final legibility and evidence-canvas refinement ====================
   This pass is intentionally last: it replaces the accumulated algorithm-page
   experiments with one stable composition and lifts the projection-critical
   type on page 2. The HTML deck stays cool, editorial and restrained; the
   Motion remains warm ivory. */

/* Page 2: a clear thesis column plus a brighter, larger evidence rail. */
.slide.page-2 .body{
  grid-template-columns:minmax(0,1.48fr) minmax(448px,.72fr);
  column-gap:42px;
}
.page-2 .quote{
  font-size:49px;
  line-height:1.24;
}
.page-2 .lead{
  max-width:820px;
  font-size:20.5px;
  line-height:1.62;
  color:#E2EDF6;
}
.page-2 .cards{
  margin-top:27px;
  border-top-color:rgba(214,231,242,.32);
}
.page-2 .card{
  min-height:70px;
  padding:13px 4px;
  border-bottom-color:rgba(214,231,242,.27);
}
.page-2 .card .n{
  font-size:12.8px;
  color:#A9D2EA;
}
.page-2 .card h3{
  font-size:21.5px;
  line-height:1.45;
  color:#FFFFFF;
}
.page-2 .insight-rail{
  border:1px solid rgba(229,239,247,.82);
  border-left:5px solid #83BADD;
  background:#FFFFFF;
  box-shadow:0 30px 64px -42px rgba(0,8,20,.88);
}
.page-2 .insight-rail .detail{
  padding:18px 21px 17px;
}
.page-2 .insight-rail .detail b{
  margin-bottom:6px;
  font-size:13.7px;
  letter-spacing:.075em;
  color:#14506F;
}
.page-2 .insight-rail .detail:nth-child(2) b{color:#755323}
.page-2 .insight-rail .detail:nth-child(3) b{color:#843728}
.page-2 .insight-rail .detail:nth-child(4) b{color:#183F5A}
.page-2 .insight-rail .detail span{
  color:#122F46!important;
  font-size:16.9px;
  line-height:1.56;
}
.page-2 .deliverable-line{
  margin-top:20px;
  padding:14px 18px;
  border-color:rgba(214,231,242,.34);
  border-left-color:#D08A67;
  background:rgba(255,255,255,.095);
  color:#EDF5FB!important;
  font-size:15.4px;
  line-height:1.55;
}
.page-2 .deliverable-line b{
  color:#FFC7AA!important;
  font-size:12.2px;
}

/* Three real micro-lessons: the complete interface is the hero. Nothing is
   cropped or stretched; the annotation rail is deliberately compact. */
.slide[data-type=algorithm] .body,
.slide[data-type=demo] .body{
  justify-content:center;
  padding:0 0 4px;
}
.slide[data-type=algorithm] .section,
.slide[data-type=demo] .section{
  margin:0 0 8px;
  color:#165578;
  font-size:13.4px;
  letter-spacing:.17em;
}
.slide[data-type=algorithm] .title,
.slide[data-type=demo] .title{
  max-width:1472px;
  margin:0 0 15px;
  color:#0A1F34;
  font-size:36px;
  line-height:1.16;
}
.slide[data-type=algorithm] .algorithm-layout,
.slide[data-type=demo] .algorithm-layout{
  display:grid;
  grid-template-columns:minmax(0,1216px) 236px;
  grid-template-rows:1fr;
  justify-content:center;
  align-items:stretch;
  gap:20px;
  width:100%;
  max-width:1472px;
  height:608px;
  margin:0 auto;
}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame{
  position:relative;
  display:grid;
  place-items:center;
  width:100%;
  height:608px;
  padding:0;
  overflow:hidden;
  border:1px solid #9EB3C6;
  border-radius:12px;
  background:#F5F8FB;
  box-shadow:
    0 0 0 5px rgba(255,255,255,.86),
    0 28px 60px -38px rgba(5,24,43,.62);
}
.slide[data-type=algorithm] .algorithm-frame:before,
.slide[data-type=demo] .algorithm-frame:before{
  content:'';
  position:absolute;
  z-index:2;
  inset:0 0 auto;
  height:4px;
  background:linear-gradient(90deg,#1A5C83 0 42%,#8E6732 42% 70%,#974631 70% 100%);
}
.slide[data-type=algorithm] .algorithm-frame img,
.slide[data-type=demo] .algorithm-frame img{
  display:block;
  width:100%;
  height:100%;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  object-position:center;
  background:#F5F8FB;
}
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  height:608px;
  padding:16px 15px 14px;
  gap:9px;
  border:1px solid #214764;
  border-left:4px solid #79AECD;
  border-radius:11px;
  background:
    radial-gradient(ellipse at 108% -4%,rgba(120,166,199,.3),transparent 40%),
    linear-gradient(158deg,#0B243A 0%,#133B58 100%);
  box-shadow:0 26px 54px -36px rgba(3,17,32,.76);
}
.slide[data-type=algorithm] .algorithm-layout[data-algorithm=gradient] .algorithm-side,
.slide[data-type=demo] .algorithm-layout[data-algorithm=gradient] .algorithm-side{border-left-color:#C18A54}
.slide[data-type=algorithm] .algorithm-layout[data-algorithm=kmeans] .algorithm-side,
.slide[data-type=demo] .algorithm-layout[data-algorithm=kmeans] .algorithm-side{border-left-color:#C47A60}
.slide[data-type=algorithm] .algorithm-side-head,
.slide[data-type=demo] .algorithm-side-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  padding-bottom:9px;
  border-bottom:1px solid rgba(192,216,234,.22);
}
.slide[data-type=algorithm] .algorithm-kicker,
.slide[data-type=demo] .algorithm-kicker{
  color:#F1B89E;
  font-size:11.7px;
  line-height:1.42;
  letter-spacing:.055em;
  font-weight:850;
}
.algorithm-kicker i{
  width:6px;
  height:6px;
  margin-right:6px;
  background:#E59A74;
  box-shadow:0 0 0 3px rgba(229,154,116,.14);
}
.algorithm-index{
  flex:none;
  color:rgba(216,234,246,.48);
  font:600 17px/1 var(--serif);
  letter-spacing:.02em;
}
.slide[data-type=algorithm] .algorithm-result,
.slide[data-type=demo] .algorithm-result{
  padding:12px 13px;
  border:0;
  border-left:3px solid #E1A47F;
  border-radius:0 5px 5px 0;
  background:#F7EDE1;
}
.slide[data-type=algorithm] .algorithm-result b,
.slide[data-type=demo] .algorithm-result b{
  display:block;
  margin-bottom:5px;
  color:#884025;
  font-size:11.3px;
  line-height:1.2;
  letter-spacing:.12em;
}
.slide[data-type=algorithm] .algorithm-result span,
.slide[data-type=demo] .algorithm-result span{
  display:block;
  color:#10293D;
  font-size:15.1px;
  line-height:1.5;
  font-weight:750;
}
.slide[data-type=algorithm] .algorithm-insights,
.slide[data-type=demo] .algorithm-insights{
  display:grid;
  gap:0;
  border-top:0;
}
.slide[data-type=algorithm] .side-detail,
.slide[data-type=demo] .side-detail{
  padding:9px 0 9px 11px;
  border:0;
  border-left:2px solid rgba(172,203,225,.42);
  border-bottom:1px solid rgba(187,214,232,.14);
  border-radius:0;
  background:transparent;
}
.slide[data-type=algorithm] .side-detail:last-child,
.slide[data-type=demo] .side-detail:last-child{border-bottom:0}
.slide[data-type=algorithm] .side-detail b,
.slide[data-type=demo] .side-detail b{
  display:flex;
  align-items:center;
  gap:7px;
  margin-bottom:3px;
  color:#AAD2ED;
  font-size:12px;
  line-height:1.28;
  letter-spacing:.025em;
}
.slide[data-type=algorithm] .side-detail b i,
.slide[data-type=demo] .side-detail b i{
  color:#E5A886;
  font:500 10.5px/1 var(--mono);
  font-style:normal;
  letter-spacing:0;
}
.slide[data-type=algorithm] .side-detail:nth-child(2) b,
.slide[data-type=demo] .side-detail:nth-child(2) b{color:#E9C698}
.slide[data-type=algorithm] .side-detail:nth-child(3) b,
.slide[data-type=demo] .side-detail:nth-child(3) b{color:#EFA98F}
.slide[data-type=algorithm] .side-detail span,
.slide[data-type=demo] .side-detail span{
  color:#E8F1F8;
  font-size:15.1px;
  line-height:1.52;
}
.slide[data-type=algorithm] .algorithm-delivery,
.slide[data-type=demo] .algorithm-delivery{
  padding:10px 11px;
  border:0;
  border-left:3px solid #C37854;
  border-radius:0 5px 5px 0;
  background:rgba(255,255,255,.075);
}
.slide[data-type=algorithm] .algorithm-delivery b,
.slide[data-type=demo] .algorithm-delivery b{
  display:block;
  margin-bottom:3px;
  color:#F1B79C;
  font-size:11.2px;
  line-height:1.2;
  letter-spacing:.08em;
}
.slide[data-type=algorithm] .algorithm-delivery span,
.slide[data-type=demo] .algorithm-delivery span{
  display:block;
  color:#EAF2F9;
  font-size:14.1px;
  line-height:1.5;
}
.slide[data-type=algorithm] .algo-open,
.slide[data-type=demo] .algo-open{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  margin-top:auto;
  min-height:38px;
  padding:9px 10px;
  border:1px solid rgba(213,231,243,.45);
  border-radius:5px;
  background:#F7FAFC;
  color:#103A57;
  font-size:13.2px;
  font-weight:850;
  letter-spacing:.015em;
  text-decoration:none;
}
.slide[data-type=algorithm] .algo-open span,
.slide[data-type=demo] .algo-open span{color:#9A4A30}

/* Projection legibility across the evidence rails. */
.slide.dark .insight-rail .detail b{font-size:13.2px}
.slide.dark .insight-rail .detail span,
.slide.dark .insight-rail .detail-full{font-size:16.3px;line-height:1.52}

/* ===== Final delivery pass: one cool, high-contrast deck language =====
   The HTML deck is deliberately cooler and more restrained than the warm
   Motion film. Every projection-critical surface gets an explicit
   foreground/background pair so no text can disappear into a gradient. */
:root{
  --paper:#F3F6FA;
  --white:#FFFFFF;
  --ink:#102A43;
  --muted:#2E465F;
  --soft:#4A6178;
  --line:#C5D2E0;
  --red:#A64B36;
  --red2:#C26A50;
  --gold:#8A6410;
  --blue:#1F5B88;
  --violet:#5B4B78;
  --night:#0E2238;
}

/* Page 2 is the first argument page, not a second cover. A light editorial
   canvas makes the thesis unmistakable, while the dark evidence rail keeps
   the page from feeling flat. */
.slide.page-2{
  background:
    radial-gradient(ellipse at 88% 10%,rgba(31,91,136,.11),transparent 34%),
    linear-gradient(135deg,#FCFDFE 0%,#F1F5F9 62%,#E7EEF6 100%)!important;
  color:#102A43!important;
}
.slide.page-2:before{
  opacity:.24;
  background-image:
    linear-gradient(rgba(21,58,93,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(21,58,93,.045) 1px,transparent 1px);
}
.slide.page-2 .top,
.slide.page-2 .foot{color:#4A6178;border-color:#C5D2E0}
.slide.page-2 .section{color:#9E3F2F!important}
.slide.page-2 .quote{
  color:#102A43!important;
  font-size:52px;
  line-height:1.22;
  letter-spacing:-.006em;
  text-shadow:none;
}
.slide.page-2 .lead{
  color:#2E465F!important;
  font-size:21px;
  line-height:1.6;
  max-width:760px;
}
.slide.page-2 .cards{border-top-color:#C5D2E0}
.slide.page-2 .card{
  background:transparent!important;
  border-bottom-color:#C9D6E3!important;
  box-shadow:none!important;
}
.slide.page-2 .card .n{
  display:inline-grid;
  place-items:center;
  width:34px;
  height:30px;
  border:1px solid #CDD9E5;
  border-radius:7px;
  background:#FFFFFF;
  color:#9E3F2F!important;
}
.slide.page-2 .card h3{color:#102A43!important}
.slide.page-2 .insight-rail{
  background:linear-gradient(160deg,#10263D 0%,#183B59 100%)!important;
  border:1px solid #234A6B!important;
  border-left:5px solid #D08A67!important;
  box-shadow:0 30px 62px -42px rgba(4,18,34,.78)!important;
}
.slide.page-2 .insight-rail .detail{border-bottom:1px solid rgba(255,255,255,.14)!important}
.slide.page-2 .insight-rail .detail b{color:#9EC9E8!important;font-size:13.4px!important}
.slide.page-2 .insight-rail .detail:nth-child(2) b{color:#E7C38D!important}
.slide.page-2 .insight-rail .detail:nth-child(3) b{color:#F0B59D!important}
.slide.page-2 .insight-rail .detail:nth-child(4) b{color:#B8C9E8!important}
.slide.page-2 .insight-rail .detail span{
  color:#F4F8FC!important;
  font-size:17px!important;
  line-height:1.55!important;
}
.slide.page-2 .deliverable-line{
  background:#FFFFFF!important;
  border:1px solid #C7D4E2!important;
  border-left:4px solid #A64B36!important;
  color:#203B52!important;
  box-shadow:0 14px 30px -28px rgba(11,31,52,.55);
}
.slide.page-2 .deliverable-line b{color:#8E3F2E!important;font-size:12.4px!important}
.slide.page-2 .deliverable-line span{
  color:#203B52!important;
  font-size:15.3px!important;
  line-height:1.5!important;
  font-weight:600;
}

/* Dark chapter pages: lift every foreground off the navy ground and turn
   evidence strips into white specification cards. */
.slide.dark .title,
.slide.dark .quote,
.slide.dark .cover-title{color:#FBFDFF!important}
.slide.dark .lead,
.slide.dark .cover-sub{color:#D9E6F2!important}
.slide.dark .card{
  background:rgba(255,255,255,.09)!important;
  border-color:rgba(255,255,255,.28)!important;
}
.slide.dark .card h3{color:#FFFFFF!important}
.slide.dark .card p{color:#D9E6F2!important}
.slide.dark .insight-rail{
  background:#FFFFFF!important;
  border-color:#FFFFFF!important;
  border-left-color:#83BADD!important;
}
.slide.dark .insight-rail .detail b{color:#14506F!important}
.slide.dark .insight-rail .detail span,
.slide.dark .insight-rail .detail-full{color:#1B3850!important}
.slide.dark .deliverable-line{
  background:#FFFFFF!important;
  border-color:#FFFFFF!important;
  border-left-color:#C77955!important;
  color:#1B3850!important;
}
.slide.dark .deliverable-line b{color:#8E3F2E!important}
.slide.dark .deliverable-line span{color:#1B3850!important}

/* All evidence cards and captions share one legible foreground. */
.insight-rail .detail span,
.insight-rail .detail-full,
.deliverable-line span{color:#1F3A51!important}
.caption,
.algo-caption{color:#3E5670!important}

/* Algorithm pages: give the real interface the width, keep the annotation
   rail compact, and make it read like a specification sheet rather than a
   second dark video panel. */
.slide[data-type=algorithm],
.slide[data-type=demo]{padding-left:64px!important;padding-right:64px!important}
.slide[data-type=algorithm] .algorithm-layout,
.slide[data-type=demo] .algorithm-layout{
  grid-template-columns:minmax(0,1fr) 208px!important;
  gap:16px!important;
  max-width:1472px!important;
  height:612px!important;
  margin:0 auto!important;
}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame{
  height:612px!important;
  border:1px solid #8FA7BE!important;
  border-radius:10px!important;
  background:#FFFFFF!important;
  box-shadow:
    0 0 0 5px rgba(255,255,255,.9),
    0 30px 64px -40px rgba(5,24,43,.62)!important;
}
.slide[data-type=algorithm] .algorithm-frame:before,
.slide[data-type=demo] .algorithm-frame:before{
  height:4px;
  background:linear-gradient(90deg,#1F5B88 0 52%,#A64B36 52% 76%,#8A6410 76% 100%);
}
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{
  height:612px!important;
  padding:14px 13px 12px!important;
  gap:8px!important;
  border:1px solid #C2D0DF!important;
  border-left:5px solid #1F5B88!important;
  border-radius:9px!important;
  background:
    radial-gradient(ellipse at 108% -4%,rgba(100,150,190,.14),transparent 40%),
    linear-gradient(165deg,#FFFFFF 0%,#EFF4F9 100%)!important;
  box-shadow:0 24px 50px -34px rgba(12,34,56,.55)!important;
}
.slide[data-type=algorithm] .algorithm-layout[data-algorithm=gradient] .algorithm-side,
.slide[data-type=demo] .algorithm-layout[data-algorithm=gradient] .algorithm-side{border-left-color:#8A6410!important}
.slide[data-type=algorithm] .algorithm-layout[data-algorithm=kmeans] .algorithm-side,
.slide[data-type=demo] .algorithm-layout[data-algorithm=kmeans] .algorithm-side{border-left-color:#A64B36!important}
.slide[data-type=algorithm] .algorithm-side-head,
.slide[data-type=demo] .algorithm-side-head{
  padding-bottom:8px;
  border-bottom:1px solid #D2DEE9!important;
}
.slide[data-type=algorithm] .algorithm-kicker,
.slide[data-type=demo] .algorithm-kicker{color:#8E3F2E!important;font-size:11.2px!important}
.algorithm-index{color:#8093A5!important;font-size:16px!important}
.slide[data-type=algorithm] .algorithm-result,
.slide[data-type=demo] .algorithm-result{
  padding:10px 11px!important;
  border-left:3px solid #A64B36!important;
  border-radius:0 6px 6px 0!important;
  background:#E9F1F8!important;
}
.slide[data-type=algorithm] .algorithm-result b,
.slide[data-type=demo] .algorithm-result b{color:#8E3F2E!important;font-size:10.8px!important}
.slide[data-type=algorithm] .algorithm-result span,
.slide[data-type=demo] .algorithm-result span{
  color:#102A43!important;
  font-size:14.5px!important;
  line-height:1.45!important;
  font-weight:700!important;
}
.slide[data-type=algorithm] .side-detail,
.slide[data-type=demo] .side-detail{
  padding:8px 0 8px 10px!important;
  border-left:2px solid #B9CADB!important;
  border-bottom:1px solid #DCE5EE!important;
}
.slide[data-type=algorithm] .side-detail b,
.slide[data-type=demo] .side-detail b{color:#1F5B88!important;font-size:11.3px!important}
.slide[data-type=algorithm] .side-detail:nth-child(2) b,
.slide[data-type=demo] .side-detail:nth-child(2) b{color:#8A6410!important}
.slide[data-type=algorithm] .side-detail:nth-child(3) b,
.slide[data-type=demo] .side-detail:nth-child(3) b{color:#8B3B2C!important}
.slide[data-type=algorithm] .side-detail span,
.slide[data-type=demo] .side-detail span{
  color:#263F57!important;
  font-size:14.6px!important;
  line-height:1.48!important;
}
.slide[data-type=algorithm] .algorithm-delivery,
.slide[data-type=demo] .algorithm-delivery{
  padding:9px 10px!important;
  border-left:3px solid #A64B36!important;
  border-radius:0 6px 6px 0!important;
  background:#F7F1E8!important;
}
.slide[data-type=algorithm] .algorithm-delivery b,
.slide[data-type=demo] .algorithm-delivery b{color:#8E3F2E!important;font-size:10.8px!important}
.slide[data-type=algorithm] .algorithm-delivery span,
.slide[data-type=demo] .algorithm-delivery span{
  color:#2B4258!important;
  font-size:13.5px!important;
  line-height:1.45!important;
}
.slide[data-type=algorithm] .algo-open,
.slide[data-type=demo] .algo-open{
  min-height:34px!important;
  padding:8px 9px!important;
  border:1px solid #102A43!important;
  background:#102A43!important;
  color:#FFFFFF!important;
  font-size:12.3px!important;
}
.slide[data-type=algorithm] .algo-open span,
.slide[data-type=demo] .algo-open span{color:#F0B59D!important}

/* ===== Final readability + evidence-canvas pass ==========================
   One last, deliberately narrow layer. It does not restyle the deck; it
   removes the last grey-on-grey text and gives the real micro-lesson
   captures the largest possible 2:1 canvas. */

/* Global legibility. Light pages first, dark pages restored immediately after. */
.top,.foot{
  color:#28475F!important;
  border-color:#B7C7D6!important;
  font-weight:650!important;
}
.top{font-size:15.5px!important}
.foot{font-size:14.5px!important}
.brand-label{
  color:#8C3D2D!important;
  font-weight:800!important;
  letter-spacing:.085em!important;
}
.section{color:#8C3D2D!important;font-weight:800!important}
.lead{color:#28445E!important}
.caption,.notes,.tagline{color:#3A5570!important}
.insight-rail .detail span{color:#29455F!important}
.insight-rail .detail b{color:#8C3D2D!important}
.deliverable-line span{color:#243F58!important}
.dark .top,.dark .foot{color:#DCE8F3!important;border-color:rgba(255,255,255,.25)!important}
.dark .brand-label,.dark .section{color:#F2B295!important}
.dark .lead,.dark .caption,.dark .notes,.dark .tagline{color:#DCE7F3!important}
.slide.page-7 .top,.slide.page-7 .foot,
.slide.page-18 .top,.slide.page-18 .foot,
.slide.page-29 .top,.slide.page-29 .foot,
.slide.page-30 .top,.slide.page-30 .foot{color:#E2ECF6!important;border-color:rgba(255,255,255,.27)!important}
.slide.page-7 .section,.slide.page-18 .section,
.slide.page-29 .section,.slide.page-30 .section{color:#F3B79E!important}

/* Page 2 is a light editorial page carrying the chapter's dark class.
   Keep its type dark, and make the evidence rail a confident ink panel. */
.slide.page-2 .top,.slide.page-2 .foot{color:#2F4A62!important;border-color:#B7C7D6!important}
.slide.page-2 .brand-label{color:#8C3D2D!important}
.slide.page-2 .section{color:#8C3D2D!important}
.slide.page-2 .quote{color:#0B2238!important}
.slide.page-2 .lead{color:#203C56!important}
.slide.page-2 .card{
  background:#FFFFFF!important;
  border-color:#BFCDDB!important;
  box-shadow:0 14px 30px -27px rgba(11,34,56,.58)!important;
}
.slide.page-2 .card h3{color:#0B2238!important;font-size:19px!important}
.slide.page-2 .card .n{color:#9A3E2D!important;font-size:14.5px!important}
.slide.page-2.dark .insight-rail{
  background:#0B2238!important;
  border:1px solid #234A6B!important;
  border-left:5px solid #C87652!important;
}
.slide.page-2 .insight-rail .detail{border-bottom-color:rgba(255,255,255,.2)!important}
.slide.page-2 .insight-rail .detail b,
.slide.page-2.dark .insight-rail .detail b{color:#F2B295!important;font-size:14px!important}
.slide.page-2 .insight-rail .detail:nth-child(2) b,
.slide.page-2.dark .insight-rail .detail:nth-child(2) b{color:#EBC98F!important}
.slide.page-2 .insight-rail .detail:nth-child(3) b,
.slide.page-2.dark .insight-rail .detail:nth-child(3) b{color:#A9CCE8!important}
.slide.page-2 .insight-rail .detail:nth-child(4) b,
.slide.page-2.dark .insight-rail .detail:nth-child(4) b{color:#F2B295!important}
.slide.page-2 .insight-rail .detail span,
.slide.page-2.dark .insight-rail .detail span{
  color:#FFFFFF!important;
  font-size:17px!important;
  line-height:1.56!important;
  font-weight:500!important;
}
.slide.page-2 .deliverable-line{background:#FFFFFF!important;border-color:#BFCDDB!important}
.slide.page-2 .deliverable-line b{color:#8C3D2D!important;font-size:13.5px!important}
.slide.page-2 .deliverable-line span{color:#203B52!important;font-size:15.3px!important;line-height:1.5!important}

/* The three real micro-lessons: maximise the 2:1 capture, compress the rail. */
.slide[data-type=algorithm],
.slide[data-type=demo]{padding-left:44px!important;padding-right:44px!important}
.slide[data-type=algorithm] .algorithm-layout,
.slide[data-type=demo] .algorithm-layout{
  grid-template-columns:minmax(0,1fr) 190px!important;
  gap:14px!important;
  width:100%!important;
  max-width:1508px!important;
  height:652px!important;
  margin:0 auto!important;
  align-items:stretch!important;
}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame,
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{height:652px!important}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame{
  padding:0!important;
  border:1px solid #6F8DA7!important;
  border-radius:10px!important;
  background:#0E2740!important;
  background-image:none!important;
  box-shadow:0 0 0 4px rgba(255,255,255,.92),0 30px 62px -40px rgba(5,24,43,.68)!important;
}
.slide[data-type=algorithm] .algorithm-frame img,
.slide[data-type=demo] .algorithm-frame img{
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  border:0!important;
  border-radius:8px!important;
  background:#F7F3EB!important;
  filter:none!important;
}
.slide[data-type=algorithm] .algorithm-frame .frame-hint,
.slide[data-type=demo] .algorithm-frame .frame-hint{display:none!important}

/* Ink specification rail: compact, but every line deliberately readable. */
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{
  justify-content:flex-start!important;
  gap:8px!important;
  padding:13px 12px 12px!important;
  border:1px solid #31516C!important;
  border-left:4px solid #C06A4A!important;
  border-radius:9px!important;
  background:#0E2941!important;
  background-image:none!important;
  box-shadow:0 22px 46px -34px rgba(5,24,43,.7)!important;
  overflow:hidden!important;
}
.slide[data-type=algorithm] .algorithm-layout[data-algorithm=knn] .algorithm-side,
.slide[data-type=demo] .algorithm-layout[data-algorithm=knn] .algorithm-side{border-left-color:#5D9ACB!important}
.slide[data-type=algorithm] .algorithm-layout[data-algorithm=gradient] .algorithm-side,
.slide[data-type=demo] .algorithm-layout[data-algorithm=gradient] .algorithm-side{border-left-color:#C79A4B!important}
.slide[data-type=algorithm] .algorithm-layout[data-algorithm=kmeans] .algorithm-side,
.slide[data-type=demo] .algorithm-layout[data-algorithm=kmeans] .algorithm-side{border-left-color:#C06A4A!important}
.slide[data-type=algorithm] .algorithm-side-head,
.slide[data-type=demo] .algorithm-side-head{
  min-height:24px!important;
  padding-bottom:8px!important;
  border-bottom:1px solid rgba(255,255,255,.2)!important;
}
.slide[data-type=algorithm] .algorithm-kicker,
.slide[data-type=demo] .algorithm-kicker{
  color:#E9BBA4!important;
  font-size:10.4px!important;
  font-weight:750!important;
  letter-spacing:.04em!important;
}
.algorithm-kicker i{background:#E5A183!important;box-shadow:0 0 0 3px rgba(229,161,131,.15)!important}
.algorithm-index{color:#D9E7F2!important;font-size:13.5px!important}
.slide[data-type=algorithm] .algorithm-result,
.slide[data-type=demo] .algorithm-result{
  padding:9px 10px 10px!important;
  border-left:3px solid #C06A4A!important;
  border-radius:0 6px 6px 0!important;
  background:rgba(255,255,255,.075)!important;
}
.slide[data-type=algorithm] .algorithm-result b,
.slide[data-type=demo] .algorithm-result b{
  color:#F2B295!important;
  font-size:10px!important;
  letter-spacing:.1em!important;
}
.result-metric{color:#FFFFFF!important;font-size:31px!important;margin:0 0 3px!important}
.result-metric small{color:#C7D8E6!important;font-size:11px!important}
.slide[data-type=algorithm] .algorithm-result p,
.slide[data-type=demo] .algorithm-result p{
  color:#E9F1F8!important;
  font-size:12.4px!important;
  line-height:1.42!important;
  font-weight:550!important;
}
.slide[data-type=algorithm] .algorithm-insights,
.slide[data-type=demo] .algorithm-insights{gap:0!important}
.slide[data-type=algorithm] .side-detail,
.slide[data-type=demo] .side-detail{
  padding:8px 0 8px 8px!important;
  border-left:2px solid rgba(255,255,255,.25)!important;
  border-bottom:1px solid rgba(255,255,255,.14)!important;
}
.slide[data-type=algorithm] .side-detail b,
.slide[data-type=demo] .side-detail b{
  color:#A9CCE8!important;
  font-size:10.2px!important;
  letter-spacing:.03em!important;
}
.slide[data-type=algorithm] .side-detail b i,
.slide[data-type=demo] .side-detail b i{color:#7FA6C3!important;font-size:9.2px!important}
.slide[data-type=algorithm] .side-detail span,
.slide[data-type=demo] .side-detail span{
  color:#F4F8FC!important;
  font-size:12.2px!important;
  line-height:1.42!important;
  font-weight:500!important;
}
.slide[data-type=algorithm] .algo-open,
.slide[data-type=demo] .algo-open{
  margin-top:auto!important;
  min-height:32px!important;
  padding:7px 8px!important;
  border:1px solid #E9EEF4!important;
  background:#E9EEF4!important;
  color:#0E2941!important;
  font-size:11.4px!important;
  font-weight:750!important;
}
.slide[data-type=algorithm] .algo-open span,
.slide[data-type=demo] .algo-open span{color:#A64B36!important}
.slide[data-type=algorithm] .section,
.slide[data-type=demo] .section{color:#8C3D2D!important;font-size:12.8px!important}
.slide[data-type=algorithm] .title,
.slide[data-type=demo] .title{color:#0B2238!important;font-size:34px!important}

/* ===== 2026-11-12 final client-review pass ===============================
   The HTML deck is intentionally not a copy of the warm Motion film. This
   last layer establishes one cool report palette, raises every projection-
   critical foreground, and gives the three real algorithm canvases the page.
   Keep this block last so it overrides the accumulated art-direction passes. */

html,
body{background:#C9D4E0}
.slide:not(.dark){
  background-color:#F1F5F9;
  background-image:
    radial-gradient(ellipse at 94% 0%,rgba(31,91,136,.08),transparent 31%),
    linear-gradient(136deg,#FBFCFE 0%,#F1F5F9 58%,#E7EEF6 100%)!important;
}
.slide:not(.dark):before{opacity:.24}
.slide:not(.dark) .top,
.slide:not(.dark) .foot{color:#3A566F!important;border-color:#C1D0DE!important}
.slide:not(.dark) .brand-label{color:#174E75!important}
.slide:not(.dark) .section{color:#1B557D!important;font-size:13.8px!important}
.slide:not(.dark) .title{color:#0B2238!important}
.slide:not(.dark) .lead{color:#27445C!important}
.slide:not(.dark) .tagline,
.slide:not(.dark) .notes,
.slide:not(.dark) .caption{color:#304D65!important}
.slide.dark .top,
.slide.dark .foot{color:#D8E6F2!important;border-color:rgba(216,230,242,.28)!important}
.slide.dark .section,
.slide.dark .brand-label{color:#F0B096!important}

/* One accent grammar across the deck: steel-blue, ink and restrained brick. */
.insight-rail .detail b,
.insight-rail .detail:nth-child(2) b,
.insight-rail .detail:nth-child(3) b,
.insight-rail .detail:nth-child(4) b{color:#1A5278!important}
.insight-rail .detail:nth-child(3) b{color:#7C3D2D!important}
.insight-rail .detail span,
.insight-rail .detail-full,
.deliverable-line,
.deliverable-line span{color:#1B3850!important}
.deliverable-line b{color:#7C3D2D!important}
.arch-flow .arch-node{border-top-color:#245B86!important}
.arch-flow .arch-node:nth-child(4){border-top-color:#9A4934!important}
.arch-flow .arch-node>b{color:#1D557D!important}
.arch-flow .arch-node:nth-child(4)>b{color:#8C3D2D!important}

/* Cool the cover/close 3D stack; the film remains warm ivory. */
.stack-glow{
  background:radial-gradient(circle,rgba(38,93,132,.24),rgba(154,73,52,.07) 43%,transparent 70%)!important;
}
.stack-plane:nth-child(1){--plane-color:#245B86}
.stack-plane:nth-child(2){--plane-color:#466A86}
.stack-plane:nth-child(3){--plane-color:#315D7C}
.stack-plane:nth-child(4){--plane-color:#8C3D2D}
.stack-label:nth-child(1){--tone:#174E75}
.stack-label:nth-child(2){--tone:#315D7C}
.stack-label:nth-child(3){--tone:#46657D}
.stack-label:nth-child(4){--tone:#8C3D2D}

/* Page 2: dark evidence rail, larger type, and explicit light-canvas inks. */
.slide.page-2,
.slide.page-2.dark{
  background:#F1F5F9!important;
  background-image:
    radial-gradient(ellipse at 88% 8%,rgba(31,91,136,.09),transparent 34%),
    linear-gradient(135deg,#FCFDFE 0%,#F1F5F9 62%,#E6EDF5 100%)!important;
  color:#102A43!important;
}
.slide.page-2 .top,
.slide.page-2 .foot,
.slide.page-2.dark .top,
.slide.page-2.dark .foot{color:#3A566F!important;border-color:#C1D0DE!important}
.slide.page-2 .section,
.slide.page-2.dark .section{color:#8C3D2D!important;font-size:14px!important}
.slide.page-2 .quote,
.slide.page-2.dark .quote{
  color:#0B2238!important;
  font-size:51px!important;
  line-height:1.17!important;
}
.slide.page-2 .lead,
.slide.page-2.dark .lead{
  color:#27445C!important;
  font-size:21px!important;
  line-height:1.6!important;
}
.slide.page-2 .card h3,
.slide.page-2.dark .card h3{color:#102A43!important;font-size:19px!important}
.slide.page-2 .card .n,
.slide.page-2.dark .card .n{color:#7C3D2D!important}
.slide.page-2 .insight-rail,
.slide.page-2.dark .insight-rail{
  background:#071B2D!important;
  background-image:none!important;
  border:1px solid #294A65!important;
  border-left:5px solid #C77858!important;
  box-shadow:0 30px 64px -42px rgba(2,13,25,.9)!important;
}
.slide.page-2 .insight-rail .detail,
.slide.page-2.dark .insight-rail .detail{
  grid-template-columns:92px minmax(0,1fr)!important;
  gap:13px!important;
  padding:17px 19px!important;
  background:transparent!important;
  border-bottom:1px solid rgba(226,239,249,.2)!important;
}
.slide.page-2 .insight-rail .detail b,
.slide.page-2.dark .insight-rail .detail b{
  color:#F0C3A2!important;
  font-size:14.2px!important;
  line-height:1.5!important;
  letter-spacing:.065em!important;
}
.slide.page-2 .insight-rail .detail span,
.slide.page-2.dark .insight-rail .detail span{
  color:#FFFFFF!important;
  font-size:17.4px!important;
  line-height:1.58!important;
  font-weight:500!important;
}
.slide.page-2 .deliverable-line{
  background:#FFFFFF!important;
  border:1px solid #BECEDD!important;
  border-left:4px solid #A65332!important;
  color:#1C374F!important;
}
.slide.page-2 .deliverable-line span{color:#1C374F!important;font-size:15.4px!important}

/* Algorithm pages: 1300 × 650 running canvas, 188px annotation rail.
   The screenshot is 2:1, so this frame shows the complete interface without
   cropping or stretching. The right rail is deliberately reduced to a result
   card, three notes and one action. */
.slide[data-type=algorithm],
.slide[data-type=demo]{
  padding-left:49px!important;
  padding-right:49px!important;
}
.slide[data-type=algorithm] .body,
.slide[data-type=demo] .body{
  justify-content:center!important;
  padding:0!important;
}
.slide[data-type=algorithm] .section,
.slide[data-type=demo] .section{
  margin:0 0 7px!important;
  color:#245573!important;
  font-size:13.4px!important;
  letter-spacing:.16em!important;
}
.slide[data-type=algorithm] .title,
.slide[data-type=demo] .title{
  max-width:1502px!important;
  margin:0 0 11px!important;
  color:#0A1F34!important;
  font-size:34px!important;
  line-height:1.14!important;
}
.slide[data-type=algorithm] .algorithm-layout,
.slide[data-type=demo] .algorithm-layout{
  grid-template-columns:minmax(0,1fr) 188px!important;
  gap:14px!important;
  width:100%!important;
  max-width:1502px!important;
  height:650px!important;
  margin:0 auto!important;
}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame,
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{height:650px!important}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame{
  display:block!important;
  min-width:0!important;
  padding:0!important;
  overflow:hidden!important;
  border:1px solid #7897B2!important;
  border-radius:10px!important;
  background:#F5F0E7!important;
  box-shadow:
    0 0 0 4px rgba(255,255,255,.94),
    0 30px 62px -38px rgba(4,23,42,.7)!important;
}
.slide[data-type=algorithm] .algorithm-frame:before,
.slide[data-type=demo] .algorithm-frame:before{
  height:3px!important;
  background:linear-gradient(90deg,#245B86 0 64%,#A64B36 64% 100%)!important;
}
.slide[data-type=algorithm] .algorithm-frame img,
.slide[data-type=demo] .algorithm-frame img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:center!important;
  background:#F5F0E7!important;
}
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:10px!important;
  min-width:0!important;
  padding:17px 12px 15px!important;
  border:1px solid #B4C6D7!important;
  border-left:4px solid #245B86!important;
  border-radius:9px!important;
  background:linear-gradient(168deg,#FFFFFF 0%,#EDF3F8 100%)!important;
  box-shadow:0 26px 50px -34px rgba(5,25,44,.62)!important;
}
.slide[data-type=algorithm] .algorithm-layout[data-algorithm=gradient] .algorithm-side,
.slide[data-type=demo] .algorithm-layout[data-algorithm=gradient] .algorithm-side{border-left-color:#8A6410!important}
.slide[data-type=algorithm] .algorithm-layout[data-algorithm=kmeans] .algorithm-side,
.slide[data-type=demo] .algorithm-layout[data-algorithm=kmeans] .algorithm-side{border-left-color:#A65332!important}
.slide[data-type=algorithm] .algorithm-side-head,
.slide[data-type=demo] .algorithm-side-head{
  min-height:25px!important;
  padding-bottom:9px!important;
  border-bottom:1px solid #D2DEE9!important;
}
.slide[data-type=algorithm] .algorithm-kicker,
.slide[data-type=demo] .algorithm-kicker{
  color:#315D7E!important;
  font-size:10px!important;
  line-height:1.35!important;
  letter-spacing:.025em!important;
  white-space:nowrap!important;
}
.algorithm-index{font-size:14px!important;color:#3B5C79!important}
.slide[data-type=algorithm] .algorithm-result,
.slide[data-type=demo] .algorithm-result{
  padding:11px 11px 12px!important;
  border-left:3px solid #A65332!important;
  border-radius:0 6px 6px 0!important;
  background:#E7F0F7!important;
}
.slide[data-type=algorithm] .algorithm-result b,
.slide[data-type=demo] .algorithm-result b{
  font-size:10.2px!important;
  color:#743A2B!important;
}
.result-metric{font-size:32px!important;color:#0B2238!important;margin:2px 0 5px!important}
.result-metric small{font-size:11px!important;color:#355069!important}
.slide[data-type=algorithm] .algorithm-result p,
.slide[data-type=demo] .algorithm-result p{
  color:#172F47!important;
  font-size:13.2px!important;
  line-height:1.5!important;
  font-weight:600!important;
}
.slide[data-type=algorithm] .side-detail,
.slide[data-type=demo] .side-detail{
  padding:8px 0 8px 8px!important;
  border-left:2px solid #AFC3D6!important;
  border-bottom:1px solid #D7E2EC!important;
}
.slide[data-type=algorithm] .side-detail:last-child,
.slide[data-type=demo] .side-detail:last-child{border-bottom:0!important}
.slide[data-type=algorithm] .side-detail b,
.slide[data-type=demo] .side-detail b{font-size:10.8px!important}
.slide[data-type=algorithm] .side-detail span,
.slide[data-type=demo] .side-detail span{
  color:#1E3A53!important;
  font-size:12.6px!important;
  line-height:1.5!important;
}
.slide[data-type=algorithm] .algo-open,
.slide[data-type=demo] .algo-open{
  min-height:34px!important;
  margin-top:1px!important;
  padding:8px 7px!important;
  border:1px solid #102A43!important;
  border-radius:6px!important;
  background:#102A43!important;
  color:#FFFFFF!important;
  font-size:11.8px!important;
}
.slide[data-type=algorithm] .algo-open span,
.slide[data-type=demo] .algo-open span{color:#F0B59D!important}

@media(max-height:760px){
  .slide[data-type=algorithm] .algorithm-layout,
  .slide[data-type=demo] .algorithm-layout,
  .slide[data-type=algorithm] .algorithm-frame,
  .slide[data-type=demo] .algorithm-frame,
  .slide[data-type=algorithm] .algorithm-side,
  .slide[data-type=demo] .algorithm-side{height:590px!important}
}

/* ===== 2026-11-12 projection pass =======================================
   One restrained cool-slate system, strong dark-page contrast, and a larger
   evidence canvas for the three real micro-lesson captures. The earlier
   layers stay in place; this block is the final art-direction authority. */
:root{
  --paper:#EDF2F7;
  --white:#FFFFFF;
  --ink:#0E2741;
  --muted:#2C465F;
  --soft:#435C74;
  --line:#C5D2E0;
  --red:#A64B36;
  --blue:#245B86;
  --steel:#44657E;
}

/* Dark chapter pages: no inherited dark-on-dark labels. */
.slide.dark .section,
.slide.dark .brand-label{color:#F2B49A!important}
.slide.dark .top,
.slide.dark .top span,
.slide.dark .foot{color:#D5E2EF!important;border-color:rgba(213,226,239,.28)!important}
.slide.dark .title,
.slide.dark .quote{color:#FFFFFF!important}
.slide.dark .lead,
.slide.dark .notes,
.slide.dark .tagline{color:#DCE7F2!important}
.slide.dark .card{background:#FFFFFF!important;border-color:#C7D5E3!important}
.slide.dark .card h3{color:#102A43!important}
.slide.dark .card p,
.slide.dark .card span{color:#334C63!important}

/* Readable annotation rails everywhere. */
.insight-rail{border-color:#C4D2E1!important;background:linear-gradient(145deg,#FFFFFF,#F4F8FC)!important}
.insight-rail .detail{padding:14px 16px!important}
.insight-rail .detail b{font-size:13.2px!important;line-height:1.3!important;letter-spacing:.075em!important}
.insight-rail .detail span{color:#203B54!important;font-size:15.2px!important;line-height:1.55!important;font-weight:500!important}
.insight-rail .detail-full{color:#203B54!important;font-size:14.8px!important;line-height:1.5!important}
.deliverable-line{border-color:#C8D5E3!important;background:#FFFFFF!important}
.deliverable-line b{font-size:12.6px!important}
.deliverable-line span{color:#29445C!important;font-size:14.6px!important;line-height:1.5!important;font-weight:500!important}

/* Page 2: the argument, the three learning shifts, and the evidence card. */
.slide.page-2 .body{gap:0!important}
.slide.page-2 .section{color:#F2B49A!important;font-size:14px!important;margin-bottom:16px!important}
.slide.page-2 .quote{max-width:800px!important;color:#FFFFFF!important;font-size:52px!important;line-height:1.16!important}
.slide.page-2 .lead{max-width:800px!important;color:#DCE7F2!important;font-size:21px!important;line-height:1.58!important;margin-top:15px!important}
.slide.page-2 .cards{gap:12px!important;margin-top:26px!important}
.slide.page-2 .card{
  min-height:84px!important;
  display:flex!important;
  align-items:center!important;
  gap:15px!important;
  padding:15px 18px!important;
  border:1px solid #CDD9E6!important;
  border-left:4px solid #B95A44!important;
  border-radius:7px!important;
  background:#FFFFFF!important;
  box-shadow:0 12px 28px -24px rgba(4,24,43,.68)!important;
}
.slide.page-2 .card .n{flex:none!important;width:36px!important;height:30px!important;margin:0!important;display:grid!important;place-items:center!important;border-radius:5px!important;background:#F3E7E2!important;color:#8E3D2C!important;font-size:13px!important}
.slide.page-2 .card h3{margin:0!important;color:#102A43!important;font-size:18px!important;line-height:1.4!important}

.slide.page-2 .insight-rail{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:0!important;
  overflow:hidden!important;
  border:1px solid #3B668B!important;
  border-left:5px solid #C77B5A!important;
  border-radius:9px!important;
  background:linear-gradient(160deg,#0A2946 0%,#123B5F 100%)!important;
  box-shadow:0 28px 58px -34px rgba(3,20,37,.72)!important;
}
.slide.page-2 .insight-rail .detail{
  display:grid!important;
  grid-template-columns:88px minmax(0,1fr)!important;
  gap:12px!important;
  align-items:start!important;
  padding:15px 18px!important;
  border-bottom:1px solid rgba(213,228,242,.18)!important;
}
.slide.page-2 .insight-rail .detail:last-child{border-bottom:0!important}
.slide.page-2 .insight-rail .detail b,
.slide.page-2.dark .insight-rail .detail:nth-child(2) b,
.slide.page-2.dark .insight-rail .detail:nth-child(3) b,
.slide.page-2.dark .insight-rail .detail:nth-child(4) b{color:#F0C5A5!important;font-size:13.8px!important;line-height:1.45!important}
.slide.page-2 .insight-rail .detail span,
.slide.page-2.dark .insight-rail .detail span{color:#FFFFFF!important;font-size:17px!important;line-height:1.58!important;font-weight:500!important}
.slide.page-2 .deliverable-line{background:#FFFFFF!important;border-color:#C8D5E3!important;border-left-color:#A64B36!important}
.slide.page-2 .deliverable-line span{font-size:15.2px!important;line-height:1.5!important}

/* Algorithm pages: the real interface is the page; the rail is an annotation. */
.slide[data-type=algorithm],
.slide[data-type=demo]{padding-left:42px!important;padding-right:42px!important}
.slide[data-type=algorithm] .body,
.slide[data-type=demo] .body{justify-content:center!important;padding:0!important}
.slide[data-type=algorithm] .section,
.slide[data-type=demo] .section{margin-bottom:7px!important;color:#245573!important;font-size:13px!important;letter-spacing:.16em!important}
.slide[data-type=algorithm] .title,
.slide[data-type=demo] .title{max-width:1516px!important;margin:0 0 10px!important;color:#0A1F34!important;font-size:33px!important;line-height:1.14!important}
.slide[data-type=algorithm] .algorithm-layout,
.slide[data-type=demo] .algorithm-layout{
  grid-template-columns:minmax(0,1fr) 198px!important;
  gap:14px!important;
  width:100%!important;
  max-width:1516px!important;
  height:636px!important;
  margin:0 auto!important;
}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame,
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{height:636px!important}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame{
  display:block!important;
  min-width:0!important;
  padding:0!important;
  overflow:hidden!important;
  border:1px solid #7F9CB6!important;
  border-radius:10px!important;
  background:#F6F2E9!important;
  box-shadow:0 0 0 4px rgba(255,255,255,.94),0 30px 62px -36px rgba(4,23,42,.7)!important;
}
.slide[data-type=algorithm] .algorithm-frame img,
.slide[data-type=demo] .algorithm-frame img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:center!important;
  background:#F6F2E9!important;
}
.slide[data-type=algorithm] .algorithm-frame:before,
.slide[data-type=demo] .algorithm-frame:before{height:3px!important;z-index:4!important;background:linear-gradient(90deg,#245B86 0 58%,#A64B36 58% 100%)!important}
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:9px!important;
  min-width:0!important;
  padding:13px 12px 12px!important;
  border:1px solid #B7C8D8!important;
  border-left:4px solid #245B86!important;
  border-radius:9px!important;
  background:linear-gradient(165deg,#FFFFFF 0%,#EDF3F8 100%)!important;
  box-shadow:0 26px 50px -34px rgba(5,25,44,.6)!important;
}
.slide[data-type=algorithm] .algorithm-side-head,
.slide[data-type=demo] .algorithm-side-head{min-height:24px!important;padding-bottom:8px!important}
.slide[data-type=algorithm] .algorithm-kicker,
.slide[data-type=demo] .algorithm-kicker{font-size:10px!important;letter-spacing:.035em!important;white-space:nowrap!important;color:#315D7E!important}
.algorithm-index{font-size:14px!important;color:#3B5C79!important}
.slide[data-type=algorithm] .algorithm-result,
.slide[data-type=demo] .algorithm-result{
  padding:10px 11px 11px!important;
  border-left:3px solid #A64B36!important;
  border-radius:0 6px 6px 0!important;
  background:#E4EEF6!important;
}
.slide[data-type=algorithm] .algorithm-result b,
.slide[data-type=demo] .algorithm-result b{font-size:10px!important;color:#773B2C!important}
.result-metric{font-size:33px!important;color:#0B2238!important;margin:2px 0 5px!important}
.result-metric small{font-size:11px!important;color:#355069!important}
.slide[data-type=algorithm] .algorithm-result p,
.slide[data-type=demo] .algorithm-result p{font-size:12.7px!important;line-height:1.5!important;color:#172F47!important;font-weight:650!important}
.slide[data-type=algorithm] .side-detail,
.slide[data-type=demo] .side-detail{padding:7px 0 7px 8px!important}
.slide[data-type=algorithm] .side-detail b,
.slide[data-type=demo] .side-detail b{font-size:10.3px!important}
.slide[data-type=algorithm] .side-detail span,
.slide[data-type=demo] .side-detail span{font-size:12.6px!important;line-height:1.45!important;color:#1D354C!important}
.slide[data-type=algorithm] .algorithm-delivery,
.slide[data-type=demo] .algorithm-delivery{padding:8px 9px!important}
.slide[data-type=algorithm] .algorithm-delivery b,
.slide[data-type=demo] .algorithm-delivery b{font-size:9.8px!important}
.slide[data-type=algorithm] .algorithm-delivery span,
.slide[data-type=demo] .algorithm-delivery span{font-size:11.9px!important;line-height:1.45!important;color:#263E54!important}
.slide[data-type=algorithm] .algo-open,
.slide[data-type=demo] .algo-open{min-height:32px!important;margin-top:2px!important;padding:7px 8px!important;font-size:11.3px!important}

/* ===== Final review pass: editorial contrast and full algorithm canvases =====
   The deck uses a cool report palette, deliberately separated from the warm
   film palette of the Motion. Evidence images are pre-cropped to the running
   algorithm canvas, so nothing is stretched and the annotation stays outside. */

.slide{
  background-color:#F4F7FA;
  background-image:linear-gradient(132deg,#FBFCFE 0%,#F1F5F9 58%,#E9EFF6 100%);
}
.slide:before{opacity:.28}
.section,
.slide .section{
  color:#1D5B94!important;
  font-weight:750!important;
  letter-spacing:.16em!important;
}
.title,
.slide .title{color:#10263E!important}
.lead,
.slide .lead{color:#2E465F!important}
.top,.foot{font-size:15px!important;color:#415A73!important}
.brand-label{color:#1D5B94!important}

/* Page 2: no atmospheric gradient behind the evidence rail. A solid ink panel
   keeps every label readable on projectors and older displays. */
.slide.page-2 .quote,
.slide.page-2.dark .quote{
  color:#0B2238!important;
  font-size:51px!important;
  line-height:1.16!important;
}
.slide.page-2 .lead,
.slide.page-2.dark .lead{
  color:#203C56!important;
  font-size:21px!important;
  line-height:1.6!important;
}
.slide.page-2 .insight-rail,
.slide.page-2.dark .insight-rail{
  background:#0A2036!important;
  background-image:none!important;
  border:1px solid #2C5272!important;
  border-left:5px solid #C77A4D!important;
  box-shadow:0 30px 62px -42px rgba(3,16,30,.86)!important;
}
.slide.page-2 .insight-rail .detail,
.slide.page-2.dark .insight-rail .detail{
  background:transparent!important;
  background-image:none!important;
  border-bottom:1px solid rgba(255,255,255,.2)!important;
  padding:15px 17px!important;
}
.slide.page-2 .insight-rail .detail b,
.slide.page-2.dark .insight-rail .detail b{
  font-size:14.4px!important;
  font-weight:800!important;
  letter-spacing:.09em!important;
}
.slide.page-2 .insight-rail .detail span,
.slide.page-2.dark .insight-rail .detail span{
  color:#FFFFFF!important;
  font-size:17.4px!important;
  line-height:1.56!important;
  font-weight:500!important;
}
.slide.page-2 .deliverable-line{
  background:#FFFFFF!important;
  border:1px solid #BECEDD!important;
  border-left:4px solid #A65332!important;
  box-shadow:0 10px 26px -24px rgba(10,32,54,.5)!important;
}
.slide.page-2 .deliverable-line span{color:#1C374F!important;font-size:15.3px!important}

/* Algorithm evidence pages: bigger picture, quieter rail, real running frames. */
.slide[data-type=algorithm],
.slide[data-type=demo]{padding-left:46px!important;padding-right:46px!important}
.slide[data-type=algorithm] .title,
.slide[data-type=demo] .title{
  font-size:35px!important;
  line-height:1.14!important;
  letter-spacing:.005em!important;
}
.slide[data-type=algorithm] .lead,
.slide[data-type=demo] .lead{
  max-width:1410px!important;
  margin-top:7px!important;
  color:#29455F!important;
  font-size:18px!important;
  line-height:1.48!important;
}
.slide[data-type=algorithm] .algorithm-layout,
.slide[data-type=demo] .algorithm-layout{
  grid-template-columns:minmax(0,1fr) 258px!important;
  gap:17px!important;
  height:638px!important;
}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame,
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{height:638px!important}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame{
  position:relative!important;
  display:grid!important;
  place-items:center!important;
  padding:12px!important;
  overflow:hidden!important;
  border:1px solid #7F9AB3!important;
  border-radius:12px!important;
  background:#E7EDF4!important;
  background-image:
    linear-gradient(rgba(29,91,148,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(29,91,148,.055) 1px,transparent 1px)!important;
  background-size:32px 32px!important;
  box-shadow:
    0 0 0 4px rgba(255,255,255,.9),
    0 30px 62px -40px rgba(5,24,43,.66)!important;
}
.slide[data-type=algorithm] .algorithm-frame:before,
.slide[data-type=demo] .algorithm-frame:before{
  content:''!important;
  position:absolute!important;
  left:0!important;right:0!important;top:0!important;
  height:4px!important;
  background:linear-gradient(90deg,#1D5B94 0 62%,#A65332 62% 100%)!important;
  z-index:2!important;
}
.slide[data-type=algorithm] .algorithm-frame img,
.slide[data-type=demo] .algorithm-frame img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  border:1px solid rgba(31,68,104,.2)!important;
  border-radius:6px!important;
  background:#F7F3EA!important;
  box-shadow:0 18px 34px -28px rgba(8,28,48,.55)!important;
  filter:saturate(.96) contrast(1.02)!important;
}
.slide[data-type=algorithm] .algorithm-frame .frame-hint,
.slide[data-type=demo] .algorithm-frame .frame-hint{
  z-index:3!important;
  right:18px!important;
  bottom:18px!important;
}
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{
  gap:8px!important;
  padding:15px 15px 14px!important;
  border:1px solid #B7C8D9!important;
  border-left:4px solid #1D5B94!important;
  border-radius:10px!important;
  background:#FFFFFF!important;
  background-image:none!important;
  box-shadow:0 22px 44px -34px rgba(9,29,49,.52)!important;
}
.slide[data-type=algorithm] .algorithm-layout[data-algorithm=gradient] .algorithm-side,
.slide[data-type=demo] .algorithm-layout[data-algorithm=gradient] .algorithm-side{border-left-color:#8A6410!important}
.slide[data-type=algorithm] .algorithm-layout[data-algorithm=kmeans] .algorithm-side,
.slide[data-type=demo] .algorithm-layout[data-algorithm=kmeans] .algorithm-side{border-left-color:#A65332!important}
.slide[data-type=algorithm] .algorithm-kicker,
.slide[data-type=demo] .algorithm-kicker{
  color:#245573!important;
  font-size:11.4px!important;
  font-weight:750!important;
}
.slide[data-type=algorithm] .algorithm-index,
.slide[data-type=demo] .algorithm-index{font-size:15.5px!important;color:#31536F!important}
.slide[data-type=algorithm] .algorithm-result,
.slide[data-type=demo] .algorithm-result{
  padding:12px 13px 13px!important;
  border-left:3px solid #A65332!important;
  border-radius:0 7px 7px 0!important;
  background:#EAF1F8!important;
}
.slide[data-type=algorithm] .algorithm-result b,
.slide[data-type=demo] .algorithm-result b{
  font-size:11.2px!important;
  color:#743A2B!important;
}
.result-metric{font-size:37px!important;color:#0B2740!important}
.result-metric small{font-size:12.8px!important;color:#29455F!important}
.slide[data-type=algorithm] .algorithm-result p,
.slide[data-type=demo] .algorithm-result p{
  color:#183550!important;
  font-size:13.8px!important;
  line-height:1.5!important;
  font-weight:600!important;
}
.slide[data-type=algorithm] .side-detail,
.slide[data-type=demo] .side-detail{
  padding:7px 0 7px 9px!important;
  border-left:2px solid #AFC3D6!important;
  border-bottom:1px solid #D7E2EC!important;
}
.slide[data-type=algorithm] .side-detail b,
.slide[data-type=demo] .side-detail b{font-size:11.5px!important;font-weight:800!important}
.slide[data-type=algorithm] .side-detail span,
.slide[data-type=demo] .side-detail span{
  color:#1E3A53!important;
  font-size:13.7px!important;
  line-height:1.48!important;
}
.slide[data-type=algorithm] .algorithm-delivery,
.slide[data-type=demo] .algorithm-delivery{
  padding:8px 10px!important;
  background:#F7F1E8!important;
  border-left:3px solid #A65332!important;
}
.slide[data-type=algorithm] .algorithm-delivery b,
.slide[data-type=demo] .algorithm-delivery b{font-size:10.9px!important;color:#743A2B!important}
.slide[data-type=algorithm] .algorithm-delivery span,
.slide[data-type=demo] .algorithm-delivery span{
  color:#213D55!important;
  font-size:13px!important;
  line-height:1.45!important;
}
.slide[data-type=algorithm] .algo-open,
.slide[data-type=demo] .algo-open{
  min-height:36px!important;
  font-size:12.2px!important;
  border-radius:6px!important;
  background:#102A43!important;
  border-color:#102A43!important;
}

/* ===== Final review correction ===========================================
   Page 2 and the three algorithm pages are projection-critical. They use
   solid foreground/background pairs, not atmospheric gradients, so text
   contrast and the full micro-lesson canvas remain stable on every screen. */

.slide.page-2 .quote,
.slide.page-2.dark .quote{color:#0B2238!important}
.slide.page-2 .lead,
.slide.page-2.dark .lead{color:#29455F!important}
.slide.page-2 .insight-rail,
.slide.page-2.dark .insight-rail{
  background:#0B2238!important;
  border:1px solid #2B4E6C!important;
  border-left:5px solid #D08A67!important;
  box-shadow:0 30px 62px -42px rgba(4,18,34,.82)!important;
}
.slide.page-2 .insight-rail .detail,
.slide.page-2.dark .insight-rail .detail{
  background:transparent!important;
  border-bottom:1px solid rgba(225,238,248,.18)!important;
}
.slide.page-2 .insight-rail .detail b,
.slide.page-2.dark .insight-rail .detail b{color:#9CC9E8!important}
.slide.page-2 .insight-rail .detail:nth-child(2) b,
.slide.page-2.dark .insight-rail .detail:nth-child(2) b{color:#EFCB95!important}
.slide.page-2 .insight-rail .detail:nth-child(3) b,
.slide.page-2.dark .insight-rail .detail:nth-child(3) b{color:#F2B7A0!important}
.slide.page-2 .insight-rail .detail:nth-child(4) b,
.slide.page-2.dark .insight-rail .detail:nth-child(4) b{color:#C2D5EC!important}
.slide.page-2 .insight-rail .detail span,
.slide.page-2.dark .insight-rail .detail span{color:#FFFFFF!important}
.slide.page-2.dark .top,
.slide.page-2.dark .foot{
  color:#4A6178!important;
  border-color:#C5D2E0!important;
}

.caption,
.algo-caption{color:#273F56!important}
.slide.dark .top,
.slide.dark .foot{color:#BFD0E1!important}
.slide.dark .tag{color:#EAF3FB!important;background:rgba(255,255,255,.12)!important}

.slide[data-type=algorithm] .algorithm-layout,
.slide[data-type=demo] .algorithm-layout{
  grid-template-columns:minmax(0,1fr) 212px!important;
  gap:16px!important;
  height:640px!important;
}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame,
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{height:640px!important}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame{
  place-items:center!important;
  background:#E8EEF4!important;
  border:1px solid #6F8DAA!important;
  border-radius:10px!important;
  box-shadow:
    0 0 0 4px rgba(255,255,255,.94),
    0 30px 62px -38px rgba(5,24,43,.62)!important;
}
.slide[data-type=algorithm] .algorithm-frame img,
.slide[data-type=demo] .algorithm-frame img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
}
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{
  padding:14px 13px 13px!important;
  gap:8px!important;
  background:#F7FAFD!important;
  border:1px solid #B5C7D8!important;
  border-left:4px solid #1F5B88!important;
  border-radius:9px!important;
  box-shadow:0 24px 48px -34px rgba(9,29,49,.5)!important;
}
.slide[data-type=algorithm] .algorithm-side-head,
.slide[data-type=demo] .algorithm-side-head{
  min-height:28px!important;
  padding-bottom:9px!important;
}
.slide[data-type=algorithm] .algorithm-kicker,
.slide[data-type=demo] .algorithm-kicker{
  color:#284F6B!important;
  font-size:10.4px!important;
  font-weight:850!important;
}
.slide[data-type=algorithm] .algorithm-index,
.slide[data-type=demo] .algorithm-index{
  color:#43627F!important;
  font-size:14px!important;
  font-weight:850!important;
}
.slide[data-type=algorithm] .algorithm-result,
.slide[data-type=demo] .algorithm-result{
  padding:11px 11px 12px!important;
  background:#E5EEF7!important;
  border-left-color:#A64B36!important;
}
.slide[data-type=algorithm] .algorithm-result b,
.slide[data-type=demo] .algorithm-result b{
  color:#763B2C!important;
  font-size:10px!important;
}
.slide[data-type=algorithm] .result-metric,
.slide[data-type=demo] .result-metric{
  margin:2px 0 5px!important;
  color:#0B2238!important;
  font-size:31px!important;
}
.slide[data-type=algorithm] .result-metric small,
.slide[data-type=demo] .result-metric small{color:#344F68!important}
.slide[data-type=algorithm] .algorithm-result p,
.slide[data-type=demo] .algorithm-result p{
  color:#132B41!important;
  font-size:13.5px!important;
  line-height:1.5!important;
  font-weight:700!important;
}
.slide[data-type=algorithm] .side-detail,
.slide[data-type=demo] .side-detail{
  padding:9px 0 9px 9px!important;
  border-left-color:#AFC5D8!important;
  border-bottom-color:#D5E1EB!important;
}
.slide[data-type=algorithm] .side-detail b,
.slide[data-type=demo] .side-detail b{
  margin-bottom:3px!important;
  color:#1E537C!important;
  font-size:11px!important;
  font-weight:850!important;
}
.slide[data-type=algorithm] .side-detail:nth-child(2) b,
.slide[data-type=demo] .side-detail:nth-child(2) b{color:#76550E!important}
.slide[data-type=algorithm] .side-detail:nth-child(3) b,
.slide[data-type=demo] .side-detail:nth-child(3) b{color:#7F382A!important}
.slide[data-type=algorithm] .side-detail span,
.slide[data-type=demo] .side-detail span{
  color:#1B344C!important;
  font-size:13.5px!important;
  line-height:1.5!important;
  font-weight:600!important;
}
.slide[data-type=algorithm] .algorithm-delivery,
.slide[data-type=demo] .algorithm-delivery{
  padding:10px 10px!important;
  background:#F4EDE3!important;
  border-left-color:#A64B36!important;
}
.slide[data-type=algorithm] .algorithm-delivery b,
.slide[data-type=demo] .algorithm-delivery b{
  color:#7A3829!important;
  font-size:10px!important;
}
.slide[data-type=algorithm] .algorithm-delivery span,
.slide[data-type=demo] .algorithm-delivery span{
  color:#263E55!important;
  font-size:12.7px!important;
  line-height:1.48!important;
  font-weight:600!important;
}
.slide[data-type=algorithm] .algo-open,
.slide[data-type=demo] .algo-open{
  min-height:34px!important;
  background:#0B2238!important;
  border-color:#0B2238!important;
  color:#FFFFFF!important;
  font-size:11.6px!important;
}

/* Page 2 carries the dark chapter class, so its editorial light treatment
   must be scoped one step more specifically than the dark-page rules. */
.slide.page-2.dark .quote{color:#102A43!important}
.slide.page-2.dark .lead{color:#2E465F!important}
.slide.page-2.dark .card h3{color:#102A43!important}
.slide.page-2.dark .card .n{color:#9E3F2F!important}
.slide.page-2.dark .insight-rail{
  background:linear-gradient(160deg,#10263D 0%,#183B59 100%)!important;
  border:1px solid #234A6B!important;
  border-left:5px solid #D08A67!important;
}
.slide.page-2.dark .insight-rail .detail b{color:#9EC9E8!important}
.slide.page-2.dark .insight-rail .detail:nth-child(2) b{color:#E7C38D!important}
.slide.page-2.dark .insight-rail .detail:nth-child(3) b{color:#F0B59D!important}
.slide.page-2.dark .insight-rail .detail:nth-child(4) b{color:#B8C9E8!important}
.slide.page-2.dark .insight-rail .detail{
  background:transparent!important;
  border-bottom-color:rgba(255,255,255,.14)!important;
}
.slide.page-2.dark .insight-rail .detail span{color:#F4F8FC!important}
.slide.page-2.dark .deliverable-line{
  background:#FFFFFF!important;
  border-color:#C7D4E2!important;
  border-left-color:#A64B36!important;
}
.slide.page-2.dark .deliverable-line b{color:#8E3F2E!important}
.slide.page-2.dark .deliverable-line span{color:#203B52!important}

/* Delivery polish: the algorithm capture is the evidence, the rail is an
   annotation, never a competing panel. */
.slide[data-type=algorithm] .algorithm-layout,
.slide[data-type=demo] .algorithm-layout{
  grid-template-columns:minmax(0,1fr) 198px!important;
  gap:14px!important;
  height:620px!important;
}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame,
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{height:620px!important}
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{
  padding:12px 12px 11px!important;
  gap:7px!important;
}
.slide[data-type=algorithm] .algorithm-side-head,
.slide[data-type=demo] .algorithm-side-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:6px!important;
  min-height:28px!important;
}
.slide[data-type=algorithm] .algorithm-kicker,
.slide[data-type=demo] .algorithm-kicker{
  font-size:10.2px!important;
  line-height:1.25!important;
  letter-spacing:.045em!important;
  white-space:nowrap!important;
}
.algorithm-index{font-size:14px!important}
.slide[data-type=algorithm] .algorithm-result,
.slide[data-type=demo] .algorithm-result{padding:9px 10px!important}
.slide[data-type=algorithm] .algorithm-result span,
.slide[data-type=demo] .algorithm-result span{
  font-size:13.6px!important;
  line-height:1.38!important;
}
.slide[data-type=algorithm] .side-detail,
.slide[data-type=demo] .side-detail{padding:7px 0 7px 8px!important}
.slide[data-type=algorithm] .side-detail b,
.slide[data-type=demo] .side-detail b{font-size:10.6px!important}
.slide[data-type=algorithm] .side-detail span,
.slide[data-type=demo] .side-detail span{font-size:13.6px!important;line-height:1.42!important}
.slide[data-type=algorithm] .algorithm-delivery,
.slide[data-type=demo] .algorithm-delivery{padding:8px 9px!important}
.slide[data-type=algorithm] .algorithm-delivery span,
.slide[data-type=demo] .algorithm-delivery span{font-size:12.9px!important;line-height:1.4!important}
.slide[data-type=algorithm] .algo-open,
.slide[data-type=demo] .algo-open{
  min-height:32px!important;
  padding:7px 8px!important;
  font-size:11.8px!important;
}
.slide[data-type=algorithm] .title,
.slide[data-type=demo] .title{font-size:34px!important;margin-bottom:8px!important}
.slide[data-type=algorithm] .lead,
.slide[data-type=demo] .lead{font-size:16.5px!important;line-height:1.45!important;margin-top:7px!important}

/* ===== Review pass: stronger hierarchy, calmer colour, complete canvases ===
   The three micro-lessons keep the whole simulated interface visible. The
   right rail is widened enough to read as a specification card, not a receipt. */

.slide.page-2 .body{
  align-content:center!important;
  padding-top:0!important;
  padding-bottom:0!important;
}
.slide.page-2 .section{margin-bottom:18px!important}
.slide.page-2 .quote{
  max-width:790px;
  font-size:49px!important;
  line-height:1.18!important;
  letter-spacing:-.012em;
}
.slide.page-2 .lead{
  max-width:790px!important;
  margin-top:15px!important;
  color:#29455F!important;
  font-size:20px!important;
  line-height:1.62!important;
}
.slide.page-2 .cards{margin-top:26px!important}
.slide.page-2 .card{min-height:78px!important}
.slide.page-2 .card h3{font-size:17px!important}
.slide.page-2 .insight-rail .detail b{
  font-size:13.8px!important;
  letter-spacing:.085em!important;
}
.slide.page-2 .insight-rail .detail span{
  color:#FFFFFF!important;
  font-size:16.8px!important;
  line-height:1.58!important;
}
.slide.page-2 .deliverable-line span{font-size:14.7px!important}

.slide[data-type=algorithm],
.slide[data-type=demo]{
  padding-left:44px!important;
  padding-right:44px!important;
}
.slide[data-type=algorithm] .body,
.slide[data-type=demo] .body{
  justify-content:center!important;
  padding:0!important;
}
.slide[data-type=algorithm] .section,
.slide[data-type=demo] .section{
  margin-bottom:8px!important;
  color:#245573!important;
  font-size:12.8px!important;
}
.slide[data-type=algorithm] .title,
.slide[data-type=demo] .title{
  max-width:1512px!important;
  margin:0 0 9px!important;
  color:#0A1F34!important;
  font-size:34px!important;
  line-height:1.15!important;
}
.slide[data-type=algorithm] .algorithm-layout,
.slide[data-type=demo] .algorithm-layout{
  grid-template-columns:minmax(0,1fr) 252px!important;
  gap:18px!important;
  width:100%!important;
  max-width:1512px!important;
  height:622px!important;
  margin:0 auto!important;
}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame,
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{height:622px!important}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame{
  border:1px solid #8EA7BC!important;
  border-radius:11px!important;
  background:#F7F9FB!important;
  box-shadow:
    0 0 0 4px rgba(255,255,255,.92),
    0 28px 58px -38px rgba(5,24,43,.58)!important;
}
.slide[data-type=algorithm] .algorithm-frame:before,
.slide[data-type=demo] .algorithm-frame:before{
  height:3px!important;
  background:linear-gradient(90deg,#1F5B88 0 56%,#A64B36 56% 100%)!important;
}
.slide[data-type=algorithm] .algorithm-frame img,
.slide[data-type=demo] .algorithm-frame img{
  object-fit:contain!important;
  object-position:center!important;
}
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{
  gap:9px!important;
  padding:14px 15px 13px!important;
  border:1px solid #B9C9D8!important;
  border-left:4px solid #1F5B88!important;
  border-radius:10px!important;
  background:
    radial-gradient(ellipse at 108% -4%,rgba(91,139,178,.14),transparent 40%),
    linear-gradient(165deg,#FFFFFF 0%,#EDF3F8 100%)!important;
  box-shadow:0 24px 48px -34px rgba(9,29,49,.48)!important;
}
.slide[data-type=algorithm] .algorithm-layout[data-algorithm=gradient] .algorithm-side,
.slide[data-type=demo] .algorithm-layout[data-algorithm=gradient] .algorithm-side{
  border-left-color:#8A6410!important;
}
.slide[data-type=algorithm] .algorithm-layout[data-algorithm=kmeans] .algorithm-side,
.slide[data-type=demo] .algorithm-layout[data-algorithm=kmeans] .algorithm-side{
  border-left-color:#A64B36!important;
}
.slide[data-type=algorithm] .algorithm-side-head,
.slide[data-type=demo] .algorithm-side-head{
  min-height:25px!important;
  padding-bottom:9px!important;
  border-bottom:1px solid #D4E0EA!important;
}
.slide[data-type=algorithm] .algorithm-kicker,
.slide[data-type=demo] .algorithm-kicker{
  color:#315D7E!important;
  font-size:10.5px!important;
  line-height:1.3!important;
  letter-spacing:.055em!important;
  white-space:nowrap!important;
}
.algorithm-kicker i{
  width:6px!important;
  height:6px!important;
  background:#A64B36!important;
  box-shadow:0 0 0 3px rgba(166,75,54,.12)!important;
}
.algorithm-index{
  color:#45627F!important;
  font-size:14.5px!important;
  font-weight:800!important;
}
.slide[data-type=algorithm] .algorithm-result,
.slide[data-type=demo] .algorithm-result{
  padding:11px 12px 12px!important;
  border-left:3px solid #A64B36!important;
  border-radius:0 7px 7px 0!important;
  background:#E8F0F7!important;
}
.slide[data-type=algorithm] .algorithm-result b,
.slide[data-type=demo] .algorithm-result b{
  margin-bottom:5px!important;
  color:#783C2D!important;
  font-size:10.2px!important;
  letter-spacing:.11em!important;
}
.result-metric{
  display:flex;
  align-items:baseline;
  gap:6px;
  margin:1px 0 4px;
  color:#102A43;
  font:700 34px/1 var(--serif);
  letter-spacing:-.02em;
}
.result-metric small{
  color:#405A70;
  font:700 12px/1 var(--sans);
  letter-spacing:.055em;
}
.slide[data-type=algorithm] .algorithm-result p,
.slide[data-type=demo] .algorithm-result p{
  margin:0;
  color:#203A52!important;
  font-size:13.2px!important;
  line-height:1.48!important;
  font-weight:650!important;
}
.slide[data-type=algorithm] .algorithm-insights,
.slide[data-type=demo] .algorithm-insights{gap:0!important}
.slide[data-type=algorithm] .side-detail,
.slide[data-type=demo] .side-detail{
  padding:8px 0 8px 9px!important;
  border-left:2px solid #B8CADA!important;
  border-bottom:1px solid #DDE6EE!important;
}
.slide[data-type=algorithm] .side-detail b,
.slide[data-type=demo] .side-detail b{
  gap:6px!important;
  margin-bottom:2px!important;
  font-size:10.8px!important;
  letter-spacing:.045em!important;
}
.slide[data-type=algorithm] .side-detail b i,
.slide[data-type=demo] .side-detail b i{
  color:#4B6882!important;
  font-size:9.8px!important;
  font-weight:700!important;
}
.slide[data-type=algorithm] .side-detail span,
.slide[data-type=demo] .side-detail span{
  color:#243D55!important;
  font-size:13.2px!important;
  line-height:1.48!important;
}
.slide[data-type=algorithm] .algorithm-delivery,
.slide[data-type=demo] .algorithm-delivery{
  padding:9px 10px!important;
  border-left:3px solid #A64B36!important;
  border-radius:0 6px 6px 0!important;
  background:#F5F0E8!important;
}
.slide[data-type=algorithm] .algorithm-delivery b,
.slide[data-type=demo] .algorithm-delivery b{font-size:10.2px!important}
.slide[data-type=algorithm] .algorithm-delivery span,
.slide[data-type=demo] .algorithm-delivery span{
  color:#273F55!important;
  font-size:12.4px!important;
  line-height:1.46!important;
}
.slide[data-type=algorithm] .algo-open,
.slide[data-type=demo] .algo-open{
  min-height:33px!important;
  padding:7px 9px!important;
  border-color:#102A43!important;
  background:#102A43!important;
  color:#FFFFFF!important;
  font-size:11.5px!important;
}
.slide[data-type=algorithm] .algo-open span,
.slide[data-type=demo] .algo-open span{color:#F0B59D!important}
/* ===== Final projection pass ============================================
   Loaded last on purpose: this is the single place for the final client
   review, after the accumulated art-direction layers above. */

/* Global legibility. Cool ink on light pages; warm paper-white on dark. */
.slide:not(.dark) .top,
.slide:not(.dark) .foot{
  color:#294963!important;
  border-color:#B4C5D5!important;
  font-weight:650!important;
}
.slide:not(.dark) .top{font-size:15.5px!important}
.slide:not(.dark) .foot{font-size:14.5px!important}
.slide:not(.dark) .brand-label{
  color:#8C3D2D!important;
  font-size:14px!important;
  font-weight:800!important;
  letter-spacing:.08em!important;
}
.slide:not(.dark) .section{
  color:#8C3D2D!important;
  font-size:13.6px!important;
  font-weight:800!important;
}
.slide:not(.dark) .lead{color:#27445C!important}
.slide:not(.dark) .caption,
.slide:not(.dark) .notes,
.slide:not(.dark) .tagline{color:#34536D!important}
.slide:not(.dark) .insight-rail .detail b{color:#8C3D2D!important;font-size:13.6px!important}
.slide:not(.dark) .insight-rail .detail span{color:#29455F!important;font-size:15.6px!important}
.slide:not(.dark) .deliverable-line b{color:#8C3D2D!important}
.slide:not(.dark) .deliverable-line span{color:#203B52!important;font-size:14.8px!important}

.slide.dark .top,
.slide.dark .foot{color:#DCE9F4!important;border-color:rgba(255,255,255,.26)!important}
.slide.dark .brand-label,
.slide.dark .section{color:#F2B295!important}
.slide.dark .lead,
.slide.dark .caption,
.slide.dark .notes,
.slide.dark .tagline{color:#DCE7F3!important}

.slide.page-7 .top,.slide.page-7 .foot,
.slide.page-18 .top,.slide.page-18 .foot,
.slide.page-29 .top,.slide.page-29 .foot,
.slide.page-30 .top,.slide.page-30 .foot{color:#E3EDF7!important;border-color:rgba(255,255,255,.28)!important}
.slide.page-7 .section,.slide.page-18 .section,
.slide.page-29 .section,.slide.page-30 .section{color:#F3B79E!important}

/* Page 2 is a light editorial page carrying the chapter's dark class.
   Keep the left column cool and dark; turn the right rail into ink. */
.slide.page-2 .top,
.slide.page-2 .foot{color:#2F4A62!important;border-color:#B4C5D5!important}
.slide.page-2 .brand-label{color:#8C3D2D!important;font-size:14px!important}
.slide.page-2 .section{color:#8C3D2D!important;font-size:13.6px!important}
.slide.page-2 .quote{color:#0B2238!important}
.slide.page-2 .lead{color:#203C56!important;font-size:20px!important;line-height:1.62!important}
.slide.page-2 .card{
  background:#FFFFFF!important;
  border-color:#BACBDA!important;
  box-shadow:0 14px 30px -27px rgba(11,34,56,.58)!important;
}
.slide.page-2 .card h3{color:#0B2238!important;font-size:19px!important}
.slide.page-2 .card .n{color:#9A3E2D!important;font-size:14.2px!important}

.slide.page-2 .insight-rail,
.slide.page-2.dark .insight-rail{
  background:#0B2238!important;
  background-image:none!important;
  border:1px solid #234A6B!important;
  border-left:5px solid #C87652!important;
  box-shadow:0 30px 64px -42px rgba(2,13,25,.86)!important;
}
.slide.page-2 .insight-rail .detail,
.slide.page-2.dark .insight-rail .detail{
  background:transparent!important;
  border-bottom:1px solid rgba(255,255,255,.2)!important;
  padding:16px 18px!important;
}
.slide.page-2 .insight-rail .detail b,
.slide.page-2.dark .insight-rail .detail b{
  color:#F2B295!important;
  font-size:14px!important;
  line-height:1.5!important;
  letter-spacing:.06em!important;
}
.slide.page-2 .insight-rail .detail:nth-child(2) b,
.slide.page-2.dark .insight-rail .detail:nth-child(2) b{color:#EBC98F!important}
.slide.page-2 .insight-rail .detail:nth-child(3) b,
.slide.page-2.dark .insight-rail .detail:nth-child(3) b{color:#A9CCE8!important}
.slide.page-2 .insight-rail .detail:nth-child(4) b,
.slide.page-2.dark .insight-rail .detail:nth-child(4) b{color:#F2B295!important}
.slide.page-2 .insight-rail .detail span,
.slide.page-2.dark .insight-rail .detail span{
  color:#FFFFFF!important;
  font-size:17px!important;
  line-height:1.56!important;
  font-weight:500!important;
}
.slide.page-2 .deliverable-line{
  background:#FFFFFF!important;
  border:1px solid #BACBDA!important;
  border-left:4px solid #8C3D2D!important;
}
.slide.page-2 .deliverable-line b{color:#8C3D2D!important;font-size:13.4px!important}
.slide.page-2 .deliverable-line span{color:#203B52!important;font-size:15.2px!important;line-height:1.5!important}

/* P13-P15: the complete 2:1 lesson capture is the page. The rail is a
   narrow ink specification, never a competing panel. */
.slide[data-type=algorithm],
.slide[data-type=demo]{padding-left:44px!important;padding-right:44px!important}
.slide[data-type=algorithm] .algorithm-layout,
.slide[data-type=demo] .algorithm-layout{
  grid-template-columns:minmax(0,1fr) 190px!important;
  grid-template-rows:1fr!important;
  gap:14px!important;
  width:100%!important;
  max-width:1508px!important;
  height:652px!important;
  margin:0 auto!important;
  align-items:stretch!important;
}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame,
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{height:652px!important}

.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame{
  display:block!important;
  padding:0!important;
  border:1px solid #6F8DA7!important;
  border-radius:10px!important;
  background:#0E2941!important;
  background-image:none!important;
  box-shadow:
    0 0 0 4px rgba(255,255,255,.92),
    0 30px 62px -40px rgba(5,24,43,.68)!important;
}
.slide[data-type=algorithm] .algorithm-frame img,
.slide[data-type=demo] .algorithm-frame img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  border:0!important;
  border-radius:9px!important;
  background:#F7F3EB!important;
  filter:none!important;
}
.slide[data-type=algorithm] .algorithm-frame .frame-hint,
.slide[data-type=demo] .algorithm-frame .frame-hint{display:none!important}

.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
  align-items:stretch!important;
  gap:8px!important;
  padding:13px 12px 12px!important;
  border:1px solid #31516C!important;
  border-left:4px solid #C06A4A!important;
  border-radius:9px!important;
  background:#0E2941!important;
  background-image:none!important;
  box-shadow:0 22px 46px -34px rgba(5,24,43,.72)!important;
  overflow:hidden!important;
}
.slide[data-type=algorithm] .algorithm-layout[data-algorithm=knn] .algorithm-side,
.slide[data-type=demo] .algorithm-layout[data-algorithm=knn] .algorithm-side{border-left-color:#5D9ACB!important}
.slide[data-type=algorithm] .algorithm-layout[data-algorithm=gradient] .algorithm-side,
.slide[data-type=demo] .algorithm-layout[data-algorithm=gradient] .algorithm-side{border-left-color:#C79A4B!important}
.slide[data-type=algorithm] .algorithm-layout[data-algorithm=kmeans] .algorithm-side,
.slide[data-type=demo] .algorithm-layout[data-algorithm=kmeans] .algorithm-side{border-left-color:#C06A4A!important}

.slide[data-type=algorithm] .algorithm-side-head,
.slide[data-type=demo] .algorithm-side-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  min-height:24px!important;
  padding-bottom:8px!important;
  border-bottom:1px solid rgba(255,255,255,.2)!important;
}
.slide[data-type=algorithm] .algorithm-kicker,
.slide[data-type=demo] .algorithm-kicker{
  color:#E9BBA4!important;
  font-size:10.4px!important;
  font-weight:750!important;
  letter-spacing:.035em!important;
  white-space:nowrap!important;
}
.algorithm-kicker i{background:#E5A183!important;box-shadow:0 0 0 3px rgba(229,161,131,.16)!important}
.algorithm-index{color:#D9E7F2!important;font-size:13.5px!important}

.slide[data-type=algorithm] .algorithm-result,
.slide[data-type=demo] .algorithm-result{
  padding:9px 10px 10px!important;
  border-left:3px solid #C06A4A!important;
  border-radius:0 6px 6px 0!important;
  background:rgba(255,255,255,.075)!important;
}
.slide[data-type=algorithm] .algorithm-result b,
.slide[data-type=demo] .algorithm-result b{
  color:#F2B295!important;
  font-size:10px!important;
  letter-spacing:.1em!important;
}
.result-metric{color:#FFFFFF!important;font-size:31px!important;margin:0 0 3px!important}
.result-metric small{color:#C7D8E6!important;font-size:11px!important}
.slide[data-type=algorithm] .algorithm-result p,
.slide[data-type=demo] .algorithm-result p{
  color:#E9F1F8!important;
  font-size:12.4px!important;
  line-height:1.42!important;
  font-weight:550!important;
}

.slide[data-type=algorithm] .algorithm-insights,
.slide[data-type=demo] .algorithm-insights{display:grid!important;gap:0!important;margin:0!important}
.slide[data-type=algorithm] .side-detail,
.slide[data-type=demo] .side-detail{
  padding:8px 0 8px 8px!important;
  border-left:2px solid rgba(255,255,255,.25)!important;
  border-bottom:1px solid rgba(255,255,255,.14)!important;
}
.slide[data-type=algorithm] .side-detail b,
.slide[data-type=demo] .side-detail b{
  display:flex!important;
  align-items:baseline!important;
  gap:5px!important;
  margin-bottom:2px!important;
  color:#A9CCE8!important;
  font-size:10.2px!important;
  letter-spacing:.03em!important;
}
.slide[data-type=algorithm] .side-detail b i,
.slide[data-type=demo] .side-detail b i{color:#7FA6C3!important;font-size:9.2px!important}
.slide[data-type=algorithm] .side-detail span,
.slide[data-type=demo] .side-detail span{
  color:#F4F8FC!important;
  font-size:12.2px!important;
  line-height:1.42!important;
  font-weight:500!important;
}
.slide[data-type=algorithm] .algo-open,
.slide[data-type=demo] .algo-open{
  margin-top:auto!important;
  min-height:32px!important;
  padding:7px 8px!important;
  border:1px solid #E9EEF4!important;
  background:#E9EEF4!important;
  color:#0E2941!important;
  font-size:11.4px!important;
  font-weight:750!important;
}
.slide[data-type=algorithm] .algo-open span,
.slide[data-type=demo] .algo-open span{color:#A64B36!important}

.slide[data-type=algorithm] .section,
.slide[data-type=demo] .section{color:#8C3D2D!important;font-size:12.8px!important}
.slide[data-type=algorithm] .title,
.slide[data-type=demo] .title{color:#0B2238!important;font-size:34px!important;line-height:1.15!important}

/* P2 is the only light slide that also carries the dark chapter class.
   The chapter rule targets `.top span`, so override the child directly. */
.slide.page-2 .top .brand-label{color:#8C3D2D!important}
.slide.page-2 .top>span:last-child{color:#2F4A62!important}

/* P18 is a light teacher-workflow page, but it inherited the dark-chapter
   exception list. Restore ink labels for the header, footer and captions. */
.slide.page-18 .top,
.slide.page-18 .foot{color:#294963!important;border-color:#B4C5D5!important}
.slide.page-18 .top span{color:#294963!important}
.slide.page-18 .brand-label,
.slide.page-18 .section{color:#8C3D2D!important}
.slide.page-18 .caption{color:#34536D!important}

/* Final projection pass for the three algorithm pages: keep the complete
   2:1 live capture intact, and spend the spare height in the narrow rail on
   larger result and reading text rather than decorative chrome. */
.slide[data-type=algorithm] .algorithm-layout,
.slide[data-type=demo] .algorithm-layout{
  grid-template-columns:minmax(0,1fr) 202px!important;
  gap:12px!important;
}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame{
  min-width:0!important;
  overflow:hidden!important;
}
.slide[data-type=algorithm] .algorithm-frame img,
.slide[data-type=demo] .algorithm-frame img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  transform:none!important;
}
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{
  padding:15px 14px 13px!important;
  gap:9px!important;
}
.slide[data-type=algorithm] .algorithm-kicker,
.slide[data-type=demo] .algorithm-kicker{font-size:11.2px!important}
.slide[data-type=algorithm] .algorithm-index,
.slide[data-type=demo] .algorithm-index{font-size:14px!important}
.slide[data-type=algorithm] .algorithm-result,
.slide[data-type=demo] .algorithm-result{padding:10px 11px 11px!important}
.slide[data-type=algorithm] .algorithm-result b,
.slide[data-type=demo] .algorithm-result b{font-size:10.6px!important}
.slide[data-type=algorithm] .result-metric,
.slide[data-type=demo] .result-metric{font-size:33px!important;line-height:1.05!important}
.slide[data-type=algorithm] .algorithm-result p,
.slide[data-type=demo] .algorithm-result p{
  font-size:13.4px!important;
  line-height:1.52!important;
}
.slide[data-type=algorithm] .side-detail,
.slide[data-type=demo] .side-detail{padding:11px 0 11px 9px!important}
.slide[data-type=algorithm] .side-detail b,
.slide[data-type=demo] .side-detail b{
  font-size:11.1px!important;
  margin-bottom:3px!important;
}
.slide[data-type=algorithm] .side-detail span,
.slide[data-type=demo] .side-detail span{
  font-size:13.4px!important;
  line-height:1.5!important;
}
.slide[data-type=algorithm] .algo-open,
.slide[data-type=demo] .algo-open{
  min-height:36px!important;
  font-size:12.2px!important;
}

/* ===== Final deck system ==================================================
   One light editorial canvas for pages 2-29, with ink-blue only on the cover
   and closing page. Every content page shares the same fixed header origin:
   section label, title and lead start at exactly the same top-left position. */
.slide{padding:38px 64px 34px}
.top{height:38px}
.slide:not([data-type=cover]):not([data-type=close]) .body{
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
  align-items:stretch!important;
  gap:0!important;
  width:100%!important;
  max-width:1472px!important;
  margin:0 auto!important;
  padding:0!important;
  min-height:0!important;
  overflow:hidden!important;
}
.page-head{
  position:relative;
  z-index:1;
  flex:none;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  width:100%;
  min-height:154px;
  padding:18px 0 12px;
}
.page-head .section{
  margin:0 0 8px;
  color:#9A3E2D!important;
  font-size:13.2px;
  font-weight:800;
  line-height:1.2;
  letter-spacing:.19em;
}
.page-title{
  display:block;
  max-width:1390px;
  margin:0;
  color:#0F2740!important;
  font-family:var(--serif);
  font-size:43px;
  font-weight:600;
  line-height:1.18;
  letter-spacing:.005em;
  text-wrap:balance;
}
.slide[data-type=quote] .page-title{
  max-width:1380px;
  font-size:49px;
  line-height:1.2;
}
.page-lead{
  max-width:1330px;
  margin:10px 0 0;
  color:#324A62!important;
  font-size:19px;
  line-height:1.58;
}
.page-content{
  flex:1;
  min-height:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}
.page-main{
  flex:1;
  min-height:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:stretch;
  padding:2px 0 0;
}
.page-main>.cards,
.page-main>.steps,
.page-main>.compare-stage,
.page-main>.arch-stage{
  margin-top:0;
}
.page-content>.insight-rail{
  flex:none;
  width:100%;
  margin:10px 0 0;
}
.page-content>.deliverable-line{
  flex:none;
  width:100%;
  margin:8px 0 0;
}

/* Restrained accent grammar: blue for structure, one brick cue per group. */
.card{--card-accent:#245B86!important}
.cards .card:nth-child(2n){--card-accent:#466A86!important}
.cards .card:nth-child(4n){--card-accent:#9A4934!important}
.step{--card-accent:#245B86!important}
.steps .step:nth-child(2n){--card-accent:#466A86!important}
.steps .step:nth-child(4n){--card-accent:#9A4934!important}
.card .n{background:#EDF3F9!important;color:var(--card-accent)!important}
.step .n{background:var(--card-accent)!important}
.step .n{color:#FFFFFF!important;background:var(--card-accent)!important}
.steps .step:nth-child(2n) .n{background:#466A86!important}
.steps .step:nth-child(4n) .n{background:#9A4934!important}
.steps .step:nth-child(2n){border-top-color:#466A86!important}
.steps .step:nth-child(4n){border-top-color:#9A4934!important}
.card h3{color:#10263D!important}
.card p{color:#334B63!important}
.step h3{color:#10263D!important}
.step p{color:#334B63!important}
.tagline{color:#29455E!important}

/* Quote pages are statements, not chapter dividers: same header origin,
   same light canvas, with a single editorial accent rule above the title. */
.slide[data-type=quote] .page-head:before{
  content:none;
  width:54px;
  height:3px;
  margin:0 0 13px;
  background:#9A3E2D;
}
.slide[data-type=quote] .page-head{padding-top:18px}
.slide.page-2 .page-head .section{margin-bottom:8px!important}
.quote-points{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:16px!important;
  margin:0!important;
  border:0!important;
  width:100%!important;
  align-self:stretch!important;
}
.quote-points .card,
.slide.page-2 .quote-points .card{
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  min-height:96px!important;
  height:auto!important;
  width:auto!important;
  max-width:none!important;
  padding:18px 20px!important;
  border:1px solid #C7D3E1!important;
  border-top:4px solid var(--card-accent)!important;
  border-radius:9px!important;
  background:#FFFFFF!important;
  box-shadow:0 14px 30px -28px rgba(16,36,61,.5)!important;
}
.quote-points .card .n,
.slide.page-2 .quote-points .card .n{
  display:inline-grid!important;
  place-items:center!important;
  flex:none!important;
  width:34px!important;
  height:30px!important;
  margin:0!important;
  border:1px solid #CBD7E4!important;
  border-radius:6px!important;
  background:#EDF3F9!important;
  color:var(--card-accent)!important;
  font-size:11px!important;
}
.quote-points .card h3,
.slide.page-2 .quote-points .card h3{
  margin:0!important;
  color:#10263D!important;
  font-size:20px!important;
  line-height:1.42!important;
}

/* Photo pages: image-led evidence, aligned to the same header and footer. */
.slide[data-type=photo] .page-main{justify-content:center}
.photo-stage{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:22px;
  width:100%;
  max-width:1180px;
  margin:0 auto;
}
.photo-figure{display:flex;justify-content:center;flex:0 1 auto;min-width:0}
.photo-figure .photo-wrap{
  display:flex;
  align-items:center;
  justify-content:center;
  width:auto;
  max-width:100%;
  padding:7px;
}
.photo-figure img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:388px;
  margin:0;
  object-fit:contain;
  object-position:center;
  border-radius:4px;
}
.photo-meta{
  flex:0 0 258px;
  align-self:center;
  padding:20px 20px 18px;
  border:1px solid #C7D3E1;
  border-left:4px solid #9A3E2D;
  border-radius:0 8px 8px 0;
  background:linear-gradient(155deg,#FFFFFF,#F5F8FC);
  box-shadow:0 18px 38px -32px rgba(16,36,61,.55);
}
.photo-meta-label{
  margin-bottom:10px;
  color:#9A3E2D;
  font-size:12px;
  font-weight:800;
  letter-spacing:.16em;
}
.photo-meta p{
  margin:0;
  color:#17314A;
  font-size:16px;
  line-height:1.58;
  font-weight:600;
}
.photo-meta .mini-bar{margin:16px 0 12px}
.photo-meta .pill{margin:0 6px 7px 0;font-size:13px;padding:6px 10px}

/* Architecture page: more air around the four capability blocks. */
.arch-stage{width:100%;max-width:1420px;margin:0 auto;padding:0 0 2px}
.arch-flow{margin-top:0!important}
.arch-node{min-height:188px!important;padding:19px 18px 17px!important}
.arch-node h3{font-size:21px!important}
.arch-node p{font-size:14.5px!important;line-height:1.55!important}
.arch-node span{font-size:13.5px!important;line-height:1.5!important}
.arch-band{margin-top:14px!important;padding:11px 15px!important}
.arch-link{margin-top:10px!important}

/* Algorithm pages: the fixed header takes vertical space, so the complete
   2:1 capture is sized to the remaining content area without any distortion. */
.slide[data-type=algorithm] .algorithm-layout,
.slide[data-type=demo] .algorithm-layout{
  width:100%!important;
  max-width:1472px!important;
  height:100%!important;
  max-height:552px!important;
  min-height:0!important;
  margin:0 auto!important;
}
.slide[data-type=algorithm] .algorithm-frame,
.slide[data-type=demo] .algorithm-frame,
.slide[data-type=algorithm] .algorithm-side,
.slide[data-type=demo] .algorithm-side{height:100%!important}

/* Page 2 still carries legacy page-specific rules. Neutralise its former
   dark body grid and dark rail so it matches the light system. */
.slide.page-2 .body{
  display:flex!important;
  flex-direction:column!important;
  align-content:stretch!important;
  align-items:stretch!important;
  width:100%!important;
  max-width:1472px!important;
  margin:0 auto!important;
  padding:0!important;
}
.slide.page-2 .insight-rail{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  align-self:stretch!important;
  margin:10px 0 0!important;
  border:1px solid #C7D3E1!important;
  border-left:5px solid #245B86!important;
  border-radius:8px!important;
  background:#FFFFFF!important;
  box-shadow:0 14px 30px -28px rgba(16,36,61,.5)!important;
}
.slide.page-2 .insight-rail .detail,
.slide.page-2 .insight-rail .detail:nth-child(n+3){
  display:block!important;
  padding:11px 13px!important;
  border:0!important;
  border-left:1px solid #DCE4EE!important;
  border-top:0!important;
  background:#FFFFFF!important;
}
.slide.page-2 .insight-rail .detail:first-child{border-left:0!important}
.slide.page-2 .insight-rail .detail b{color:#245B86!important;font-size:12px!important}
.slide.page-2 .insight-rail .detail span{color:#29455F!important;font-size:14px!important;line-height:1.45!important}
.slide.page-2 .deliverable-line{
  margin:8px 0 0!important;
  border:1px solid #C7D3E1!important;
  border-left:4px solid #9A3E2D!important;
  background:#FFFFFF!important;
  color:#29455F!important;
  box-shadow:0 10px 24px -26px rgba(16,36,61,.5)!important;
}
.slide.page-2 .deliverable-line b{color:#9A3E2D!important}
.slide.page-2 .deliverable-line span{color:#29455F!important;font-size:14px!important}

/* Remove the last dark-page header leftovers from quote pages 7 and 29. */
.slide.page-7 .top,
.slide.page-7 .foot,
.slide.page-29 .top,
.slide.page-29 .foot{
  color:#294963!important;
  border-color:#C6D2E0!important;
}
.slide.page-7 .top span,
.slide.page-29 .top span{color:#294963!important}
.slide.page-7 .brand-label,
.slide.page-29 .brand-label,
.slide.page-7 .section,
.slide.page-29 .section{color:#8C3D2D!important}

/* One consistent four-cell evidence rail on every non-cover page. */
.page-content .insight-rail{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
.page-content .insight-rail .detail{padding:11px 13px!important}
.page-content .insight-rail .detail b{font-size:12px!important}
.page-content .insight-rail .detail span{font-size:14.2px!important;line-height:1.46!important}

/* ===== Chinese typography and body-system refinement =====================
   The chapter label already lives in the top bar, so the duplicate kicker is
   removed. Body copy follows CJK line-breaking rules; every content type gets
   its own structural grammar instead of repeating the same white-card grid. */
.page-head .section{display:none!important}
.page-head{
  min-height:132px!important;
  padding:24px 0 10px!important;
}
.page-title{
  max-width:1400px;
  font-size:44px!important;
  line-height:1.17!important;
  text-align:left;
  text-wrap:balance;
}
.slide[data-type=quote] .page-title{font-size:50px!important;line-height:1.18!important}
.page-lead{
  max-width:1248px!important;
  margin-top:9px!important;
  color:#2F475F!important;
  font-size:19.2px!important;
  line-height:1.58!important;
  word-break:normal;
  line-break:strict;
  overflow-wrap:break-word;
  hyphens:none;
  text-align:justify;
  text-justify:inter-character;
  text-wrap:pretty;
}
.card p,
.step p,
.arch-node p,
.arch-node span,
.photo-meta p,
.insight-rail .detail span,
.deliverable-line span,
.compare-stage .icon-line{
  word-break:normal;
  line-break:strict;
  overflow-wrap:break-word;
  hyphens:none;
  text-align:justify;
  text-justify:inter-character;
  text-wrap:pretty;
}
.card h3,
.step h3,
.arch-node h3{text-align:left;text-wrap:balance}
.page-title,
.result-metric,
.step .n,
.card .n{font-variant-numeric:tabular-nums}

/* Three-card pages: a horizontal editorial rail, not three floating boxes. */
.slide[data-type=cards] .page-main>.cards{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:0!important;
  margin-top:0!important;
  border-top:2px solid #BCCBD9;
  border-bottom:1px solid #C9D5E2;
  background:linear-gradient(180deg,rgba(255,255,255,.58),rgba(255,255,255,.12));
}
.slide[data-type=cards] .page-main>.cards>.card{
  min-height:194px!important;
  padding:24px 26px 22px!important;
  border:0!important;
  border-left:1px solid #C9D5E2!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.slide[data-type=cards] .page-main>.cards>.card:first-child{border-left:0!important}
.slide[data-type=cards] .card .n{
  display:block!important;
  width:auto!important;
  height:auto!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:var(--card-accent)!important;
  font-size:27px!important;
  line-height:1!important;
  letter-spacing:.04em!important;
}
.slide[data-type=cards] .card h3{
  margin:24px 0 10px!important;
  font-size:23px!important;
}
.slide[data-type=cards] .card p{
  max-width:360px;
  font-size:16.8px!important;
  line-height:1.64!important;
}

/* Four-card pages: a calmer 2×2 panel grid with room for the subject name. */
.slide[data-type=cards4] .page-main>.cards{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:14px!important;
  margin-top:0!important;
}
.slide[data-type=cards4] .page-main>.cards>.card{
  display:grid;
  grid-template-columns:52px minmax(0,1fr);
  grid-template-rows:auto auto;
  column-gap:15px;
  align-items:start;
  min-height:132px!important;
  padding:22px 24px!important;
}
.slide[data-type=cards4] .card .n{
  grid-row:1/span 2;
  margin:1px 0 0!important;
}
.slide[data-type=cards4] .card h3{
  grid-column:2;
  margin:0 0 7px!important;
  font-size:22px!important;
}
.slide[data-type=cards4] .card p{
  grid-column:2;
  font-size:16.6px!important;
  line-height:1.58!important;
}

/* Process pages: numbered columns on one continuous rail. */
.slide[data-type=steps] .page-main>.steps,
.slide[data-type=journey] .page-main>.steps{
  gap:0!important;
  margin-top:0!important;
  border-top:2px solid #BCCBD9;
  border-bottom:1px solid #C9D5E2;
  background:linear-gradient(180deg,rgba(255,255,255,.56),rgba(255,255,255,.1));
}
.slide[data-type=steps] .step,
.slide[data-type=journey] .step{
  min-height:188px!important;
  padding:24px 24px 22px!important;
  border:0!important;
  border-top:3px solid var(--card-accent)!important;
  border-left:1px solid #C9D5E2!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.slide[data-type=steps] .step:first-child,
.slide[data-type=journey] .step:first-child{border-left:0!important}
.slide[data-type=steps] .step .n,
.slide[data-type=journey] .step .n{
  display:block!important;
  width:auto!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--card-accent)!important;
  font-size:28px!important;
  line-height:1!important;
  letter-spacing:.04em!important;
}
.slide[data-type=steps] .step h3,
.slide[data-type=journey] .step h3{
  margin:20px 0 9px!important;
  font-size:22px!important;
}
.slide[data-type=steps] .step p,
.slide[data-type=journey] .step p{
  font-size:16px!important;
  line-height:1.58!important;
}

/* Contrast page: one panel with two reading states and a conclusion bar. */
.slide[data-type=compare] .compare-stage{
  width:100%;
  max-width:1420px;
  margin:0 auto;
}
.slide[data-type=compare] .compare-stage .bodygrid{
  position:relative;
  gap:0!important;
  overflow:hidden;
  border:1px solid #C7D3E1;
  border-radius:12px;
  background:#FFFFFF;
  box-shadow:0 20px 44px -38px rgba(16,36,61,.48);
}
.slide[data-type=compare] .compare-stage .card{
  min-height:252px;
  padding:30px 34px!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
.slide[data-type=compare] .compare-stage .card:first-child{
  background:linear-gradient(145deg,#F0F4F8,#F7F9FC);
  border-right:1px solid #C7D3E1!important;
}
.slide[data-type=compare] .compare-stage .card:last-child{
  background:linear-gradient(145deg,#FFFFFF,#F5F8FC);
}
.slide[data-type=compare] .compare-stage .bodygrid:after{
  content:'→';
  position:absolute;
  left:50%;
  top:50%;
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  transform:translate(-50%,-50%);
  border:1px solid #B9C9D9;
  border-radius:50%;
  background:#FFFFFF;
  color:#9A3E2D;
  font:700 20px/1 var(--sans);
  box-shadow:0 8px 20px -14px rgba(16,36,61,.55);
}
.slide[data-type=compare] .compare-stage .card .n{
  display:block;
  margin-bottom:20px;
  font-size:12px;
  letter-spacing:.12em;
}
.slide[data-type=compare] .compare-stage .icon-line{
  margin:13px 0;
  font-size:18px!important;
  line-height:1.5!important;
}
.slide[data-type=compare] .compare-stage .tagline{
  margin:14px 0 0!important;
  padding:14px 18px!important;
  border:1px solid #C7D3E1;
  border-left:4px solid #9A3E2D;
  border-radius:0 8px 8px 0;
  background:#FFFFFF;
  color:#17314A!important;
  font-size:17px!important;
  line-height:1.5;
  box-shadow:0 12px 28px -28px rgba(16,36,61,.5);
}

/* Architecture: four capability panels with a large index watermark. */
.arch-node{
  overflow:hidden!important;
  background:linear-gradient(155deg,#FFFFFF,#F3F7FB)!important;
}
.arch-node>b{
  position:absolute!important;
  right:16px!important;
  top:12px!important;
  color:var(--tone)!important;
  font-size:32px!important;
  line-height:1!important;
  letter-spacing:.02em!important;
  opacity:.18;
}
.arch-node h3{max-width:86%;font-size:22px!important}

/* Quote pages: editorial principle columns, not a second card grid. */
.slide[data-type=quote] .quote-points{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:0!important;
  border-top:2px solid #BCCBD9!important;
  border-bottom:1px solid #C9D5E2!important;
  background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,.08));
}
.slide[data-type=quote] .quote-points .card{
  display:block!important;
  min-height:152px!important;
  padding:24px 26px!important;
  border:0!important;
  border-left:1px solid #C9D5E2!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.slide[data-type=quote] .quote-points .card:first-child{border-left:0!important}
.slide[data-type=quote] .quote-points .card .n{
  display:block!important;
  width:auto!important;
  height:auto!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:var(--card-accent)!important;
  font-size:27px!important;
  line-height:1!important;
}
.slide[data-type=quote] .quote-points .card h3{
  margin:24px 0 0!important;
  font-size:21px!important;
  line-height:1.48!important;
}

/* Photo pages alternate the evidence side, keeping the same fixed header. */
.slide[data-type=photo][data-side=right] .photo-stage{flex-direction:row-reverse}
.slide[data-type=photo][data-side=right] .photo-meta{
  border-left:1px solid #C7D3E1;
  border-right:4px solid #9A3E2D;
  border-radius:8px 0 0 8px;
}
.algorithm-result .result-copy{
  margin:0;
  color:#E9F1F8;
  font-size:13.4px;
  line-height:1.52;
  font-weight:550;
  text-align:left;
}

/* Keep the light architecture plate opaque so its labels remain readable
   even when the cover gradient is flattened for print or capture. */
.hero-architecture{background-color:#F7FAFD!important}
.stack-label{background-color:#FFFFFF!important;color:#142C4D!important}
.hero-architecture,.stack-labels,.cover-points{color:#142C4D!important}
.slide.dark .section{color:#FFC2A4!important}

/* ===== Information diagrams and evidence-page refinement =================
   Diagram language follows the deck: ink-blue structure, one brick accent,
   white nodes, and the same CJK type stack as the page copy. */
.diagram-stage{
  width:100%;
  max-width:1420px;
  margin:0 auto;
}
.diagram-svg{
  display:block;
  width:100%;
  height:auto;
  overflow:visible;
  shape-rendering:geometricPrecision;
}
.diagram-svg text{
  font-family:var(--sans);
  letter-spacing:0;
}

/* Screenshot pages: a formal evidence layout with observation and meaning. */
.slide[data-type=photo] .photo-stage{
  max-width:1240px;
  gap:26px;
}
.slide[data-type=photo] .photo-figure{
  flex:0 1 auto;
}
.slide[data-type=photo] .photo-wrap{
  border-top:4px solid #245B86;
  border-radius:10px;
  box-shadow:
    0 0 0 4px rgba(255,255,255,.88),
    0 24px 52px -36px rgba(16,36,61,.62);
}
.slide[data-type=photo] .photo-wrap img{
  max-height:370px;
  border-radius:3px;
}
.slide[data-type=photo] .photo-meta{
  flex:0 0 300px;
  padding:19px 19px 17px;
  border-radius:0 10px 10px 0;
  background:linear-gradient(155deg,#FFFFFF,#F2F6FA);
  box-shadow:0 20px 42px -34px rgba(16,36,61,.58);
}
.photo-meta-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding-bottom:10px;
  border-bottom:1px solid #D8E1EB;
}
.photo-meta-label{
  margin:0!important;
  color:#9A3E2D!important;
  font-size:11.5px!important;
  font-weight:800;
  letter-spacing:.16em;
}
.photo-meta-index{
  color:#71869B;
  font:700 11px/1 ui-monospace,monospace;
  letter-spacing:.08em;
}
.photo-meta .photo-caption{
  margin:12px 0 0!important;
  color:#17314A!important;
  font-size:17px!important;
  font-weight:600;
  line-height:1.5!important;
  text-align:left!important;
}
.photo-observations{
  display:grid;
  gap:12px;
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid #D8E1EB;
}
.photo-observations>div{min-width:0}
.photo-observations b{
  display:block;
  margin-bottom:4px;
  color:#245B86;
  font-size:11.5px;
  font-weight:800;
  letter-spacing:.08em;
}
.photo-observations span{
  display:block;
  color:#334B63;
  font-size:14.4px;
  line-height:1.52;
  word-break:normal;
  line-break:strict;
  overflow-wrap:break-word;
  text-align:justify;
  text-justify:inter-character;
}
.photo-flags{margin-top:15px}
.photo-flags .pill{
  margin:0 6px 6px 0;
  padding:6px 10px;
  font-size:12.8px;
}
.slide[data-type=photo][data-side=right] .photo-meta{
  border-left:1px solid #C7D3E1!important;
  border-right:4px solid #9A3E2D!important;
  border-radius:10px 0 0 10px!important;
}

/* Pages 2–7: centre the body and its evidence rail as one composition,
   instead of pinning the rail to the bottom and leaving the content low. */
.slide.page-2 .page-content,
.slide.page-3 .page-content,
.slide.page-4 .page-content,
.slide.page-5 .page-content,
.slide.page-6 .page-content,
.slide.page-7 .page-content{
  justify-content:center!important;
}
.slide.page-2 .page-main,
.slide.page-3 .page-main,
.slide.page-4 .page-main,
.slide.page-5 .page-main,
.slide.page-6 .page-main,
.slide.page-7 .page-main{
  flex:none!important;
  justify-content:flex-start!important;
  padding:0!important;
}

/* Evidence pages: let the real interface carry the page. The side rail
   absorbs the teaching note, so the screenshot can grow substantially. */
.slide[data-type=photo] .photo-stage{max-width:1280px!important}
.slide[data-type=photo] .photo-wrap img{max-height:460px!important}
.slide[data-type=photo] .photo-meta{flex:0 0 306px!important}
.slide[data-type=photo] .photo-observations{gap:10px!important}
.slide[data-type=photo] .photo-observations span{font-size:14.2px!important;line-height:1.48!important}

/* ===== Editorial title and body voice =====================================
   Content pages share one baseline, one title size and one uninterrupted line.
   Serif accents break long Chinese passages into readable emphasis without
   changing the source meaning. */
.slide:not([data-type=cover]):not([data-type=close]) .page-head{
  position:relative;
  height:132px!important;
  min-height:132px!important;
  padding:24px 0 10px!important;
  justify-content:flex-start!important;
}
.page-head:before{
  content:''!important;
  position:absolute;
  left:-18px;
  top:29px;
  width:4px;
  height:50px;
  background:linear-gradient(180deg,#9A3E2D 0 52%,#A97943 52% 100%);
  box-shadow:0 8px 18px -12px rgba(112,56,35,.55);
}
.page-head:after{
  content:attr(data-page);
  position:absolute;
  right:0;
  top:16px;
  color:rgba(30,67,98,.065);
  font:600 88px/1 var(--serif);
  letter-spacing:-.04em;
  pointer-events:none;
}
.page-head .page-title,
.slide[data-type=quote] .page-title{
  width:max-content;
  max-width:none;
  padding-right:108px;
  font-size:44px!important;
  line-height:1.17!important;
  letter-spacing:.004em!important;
  white-space:nowrap!important;
  text-wrap:nowrap!important;
  overflow:visible;
}
.page-lead{
  max-width:1300px!important;
  font-size:20px!important;
  line-height:1.56!important;
}
.copy-accent{
  display:inline;
  padding:0 .06em;
  color:#0D3B5C;
  font-family:var(--serif);
  font-weight:700;
  font-style:normal;
  background:linear-gradient(180deg,transparent 66%,rgba(163,111,57,.18) 66%);
  box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
}
.page-lead .copy-accent{font-size:1.06em;color:#133F5E}
.insight-rail .copy-accent,
.photo-meta .copy-accent{
  color:#173F5E;
  font-size:1.03em;
  background:none;
}
.deliverable-line .copy-accent{color:#7D3426;background:none}
.slide[data-type=cards] .card p{font-size:17.2px!important;line-height:1.62!important}
.slide[data-type=cards4] .card p{font-size:17px!important;line-height:1.58!important}
.slide[data-type=steps] .step p,
.slide[data-type=journey] .step p{font-size:16.6px!important;line-height:1.58!important}
.page-content .insight-rail .detail span{font-size:14.6px!important;line-height:1.5!important}

@media(prefers-reduced-motion:no-preference){
  .slide.active .page-head{animation:editorial-head-in .38s cubic-bezier(.16,1,.3,1) both}
  .slide.active .copy-accent{animation:editorial-accent-in .5s .08s cubic-bezier(.33,1,.68,1) both}
}
@keyframes editorial-head-in{from{opacity:.3;transform:translateY(7px)}to{opacity:1;transform:none}}
@keyframes editorial-accent-in{from{opacity:.35}to{opacity:1}}

.controls button:focus-visible,
.video-link:focus-visible,
.thumb:focus-visible,
#scrub:focus-visible{
  outline:3px solid #F2A24F;
  outline-offset:3px;
}
