
#deck-ads, #deck-matrix, #deck-select, #deck-agent, #deck-arch, #deck-routing {
  --tech-dark-bg: rgba(12, 26, 54, 0.72);
  --tech-dark-bg-soft: rgba(12, 26, 54, 0.55);
  --tech-panel: rgba(16, 31, 66, 0.65);

  --tech-blue: #38BDF8;       --tech-blue-rgb: 56, 189, 248;
  --tech-cyan: #22D3EE;       --tech-cyan-rgb: 34, 211, 238;
  --tech-green: #34D399;      --tech-green-rgb: 52, 211, 153;
  --tech-gold: #FBBF24;       --tech-gold-rgb: 251, 191, 36;
  --tech-amber: #F59E0B;      --tech-amber-rgb: 245, 158, 11;
  --tech-orange: #FB923C;     --tech-orange-rgb: 251, 146, 60;
  --tech-copper: #D4A373;     --tech-copper-rgb: 212, 163, 115;
  --tech-plum: #C084FC;       --tech-plum-rgb: 192, 132, 252;
  --tech-purple: #A78BFA;     --tech-purple-rgb: 167, 139, 250;
  --tech-red: #F87171;        --tech-red-rgb: 248, 113, 113;
  --tech-coral: #E2735A;      --tech-coral-rgb: 226, 115, 90;
  --tech-gray: #94A3B8;       --tech-gray-rgb: 148, 163, 184;
  --tech-silver: #CBD5E1;     --tech-silver-rgb: 203, 213, 225;
  --tech-teal: #2DD4BF;       --tech-teal-rgb: 45, 212, 191;
}

#deck-ads     { --deck-theme: var(--tech-amber);  --deck-theme-rgb: var(--tech-amber-rgb); }
#deck-matrix  { --deck-theme: var(--tech-red);    --deck-theme-rgb: var(--tech-red-rgb); }
#deck-select  { --deck-theme: var(--tech-orange); --deck-theme-rgb: var(--tech-orange-rgb); }
#deck-agent   { --deck-theme: var(--tech-cyan);   --deck-theme-rgb: var(--tech-cyan-rgb); }
#deck-arch    { --deck-theme: var(--tech-purple); --deck-theme-rgb: var(--tech-purple-rgb); }
#deck-routing { --deck-theme: var(--tech-green);  --deck-theme-rgb: var(--tech-green-rgb); }

#deck-ads .page-slide.light,
#deck-matrix .page-slide,
#deck-select .page-slide.light,
#deck-agent .page-slide.light,
#deck-arch .page-slide,
#deck-routing .page-slide {
  background: linear-gradient(180deg,
    #0B162E 0%,
    #101F42 18%,
    #16294F 38%,
    #223A68 58%,
    #2D4779 78%,
    #354E85 100%) !important;
}

#deck-ads .h1,
#deck-matrix .h1,
#deck-select .h1,
#deck-agent .h1,
#deck-arch .h1,
#deck-routing .h1,
#deck-matrix .titlebar,
#deck-arch .titlebar,
#deck-routing .titlebar {
  color: #ffffff;
  text-shadow: 0 0 16px rgba(var(--deck-theme-rgb), 0.55);
}

#deck-ads .h1,
#deck-select .h1,
#deck-agent .h1,
#deck-arch .h1,
#deck-routing .h1 {
  font-size: clamp(20px, 3.2vw, 32px);
  margin-bottom: clamp(10px, 1.5vw, 16px);
}

#deck-matrix .h1 {
  font-size: clamp(18px, 2.8vw, 28px);
  margin-bottom: clamp(10px, 1.5vw, 16px);
}

#deck-matrix .titlebar,
#deck-arch .titlebar,
#deck-routing .titlebar {
  background: rgba(var(--deck-theme-rgb), 0.18);
  border: 1px solid rgba(var(--deck-theme-rgb), 0.6);
  box-shadow:
    0 0 18px rgba(var(--deck-theme-rgb), 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  padding: clamp(11px, 1.6vw, 18px) clamp(14px, 2vw, 22px);
  font-size: clamp(15px, 2vw, 22px);
}

#deck-ads .legend-item,
#deck-matrix .legend-item,
#deck-select .legend-item,
#deck-agent .legend-item,
#deck-arch .legend-item,
#deck-routing .legend-item {
  color: rgba(255, 255, 255, 0.78);
  font-size: clamp(11px, 1.4vw, 14px);
}

#deck-ads .swatch,
#deck-matrix .swatch,
#deck-select .swatch,
#deck-agent .swatch,
#deck-arch .swatch,
#deck-routing .swatch {
  border-color: rgba(255, 255, 255, 0.25);
  width: clamp(11px, 1.4vw, 14px);
  height: clamp(11px, 1.4vw, 14px);
}

#deck-ads .swatch.d,
#deck-matrix .swatch.green-d,
#deck-select .swatch.d,
#deck-agent .swatch.d,
#deck-arch .swatch.green-d,
#deck-routing .swatch.gray-d {
  background: rgba(var(--tech-gold-rgb), 0.9);
  box-shadow: 0 0 8px rgba(var(--tech-gold-rgb), 0.35);
}

#deck-ads .swatch.l,
#deck-matrix .swatch.green-l,
#deck-select .swatch.l,
#deck-agent .swatch.l,
#deck-arch .swatch.green-l,
#deck-routing .swatch.gray-l,
#deck-routing .swatch.blue-l,
#deck-routing .swatch.yellow-l {
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.35);
}

#deck-agent .swatch.g {
  background: rgba(var(--tech-green-rgb), 0.25);
  border: 1px solid rgba(var(--tech-green-rgb), 0.6);
}

#deck-ads .swatch.r {
  border-top: 2px solid var(--tech-red);
  box-shadow: 0 -1px 6px rgba(var(--tech-red-rgb), 0.5);
}

#deck-ads .step-label,
#deck-matrix .step-label,
#deck-select .step-label,
#deck-agent .step-label,
#deck-arch .step-label,
#deck-routing .step-label {
  color: #ffffff;
  text-shadow: 0 0 10px rgba(var(--deck-theme-rgb), 0.4);
  font-size: clamp(13px, 1.7vw, 18px);
  margin: clamp(10px, 1.4vw, 16px) 0 clamp(8px, 1vw, 12px);
}

#deck-ads .step-num,
#deck-matrix .step-num,
#deck-select .step-num,
#deck-agent .step-num,
#deck-arch .step-num,
#deck-routing .step-num {
  width: clamp(20px, 2.6vw, 26px);
  height: clamp(20px, 2.6vw, 26px);
  font-size: clamp(10px, 1.2vw, 13px);
  color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}

#deck-ads .step-num.b,
#deck-matrix .step-num.b,
#deck-select .step-num.b,
#deck-agent .step-num.b,
#deck-arch .step-num.b,
#deck-routing .step-num.b {
  background: var(--tech-blue);
  box-shadow: 0 0 10px rgba(var(--tech-blue-rgb), 0.45);
}

#deck-ads .step-num.g,
#deck-matrix .step-num.g,
#deck-select .step-num.g,
#deck-agent .step-num.g,
#deck-arch .step-num.g,
#deck-routing .step-num.g {
  background: var(--tech-green);
  box-shadow: 0 0 10px rgba(var(--tech-green-rgb), 0.45);
}

#deck-ads .step-num.y,
#deck-matrix .step-num.t,
#deck-select .step-num.o,
#deck-agent .step-num.t,
#deck-arch .step-num.t,
#deck-routing .step-num.t {
  background: var(--tech-copper);
  box-shadow: 0 0 10px rgba(var(--tech-copper-rgb), 0.45);
}

#deck-ads .step-num.k,
#deck-matrix .step-num.o,
#deck-arch .step-num.o,
#deck-routing .step-num.o {
  background: var(--tech-orange);
  box-shadow: 0 0 10px rgba(var(--tech-orange-rgb), 0.45);
}

#deck-ads .box,
#deck-matrix .box,
#deck-select .box,
#deck-agent .box,
#deck-arch .box,
#deck-routing .box {
  background: var(--tech-dark-bg);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  color: #ffffff;
  border-radius: 12px;
  box-shadow:
    0 6px 18px rgba(0, 0, 0, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
  transition: transform .18s ease, box-shadow .18s ease;
}

#deck-ads .box .box-main,
#deck-matrix .box .box-main,
#deck-select .box .box-main,
#deck-agent .box .box-main,
#deck-arch .box .box-main,
#deck-routing .box .box-main,
#deck-ads .box .sub,
#deck-matrix .box .sub,
#deck-select .box .sub,
#deck-agent .box .sub,
#deck-arch .box .sub,
#deck-routing .box .sub {
  color: inherit;
}

#deck-agent .box .sub,
#deck-agent .box.blue .sub,
#deck-agent .box.tan .sub {
  color: rgba(255, 255, 255, 0.82);
}

#deck-ads .box.blue,
#deck-matrix .box.blue,
#deck-select .box.blue,
#deck-agent .box.blue,
#deck-arch .box.blue,
#deck-routing .box.blue,
#deck-agent .box.blue.model {
  background: rgba(var(--tech-blue-rgb), 0.16);
  border: 1.5px solid rgba(var(--tech-blue-rgb), 0.7);
  box-shadow:
    0 6px 18px rgba(0, 0, 0, 0.4),
    0 0 14px rgba(var(--tech-blue-rgb), 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

#deck-ads .box.green,
#deck-matrix .box.green,
#deck-select .box.green,
#deck-agent .box.green,
#deck-arch .box.green,
#deck-routing .box.green {
  background: rgba(var(--tech-green-rgb), 0.16);
  border: 1.5px solid rgba(var(--tech-green-rgb), 0.7);
  box-shadow:
    0 6px 18px rgba(0, 0, 0, 0.4),
    0 0 14px rgba(var(--tech-green-rgb), 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

#deck-ads .box.plum {
  background: rgba(var(--tech-plum-rgb), 0.16);
  border: 1.5px solid rgba(var(--tech-plum-rgb), 0.7);
  box-shadow:
    0 6px 18px rgba(0, 0, 0, 0.4),
    0 0 14px rgba(var(--tech-plum-rgb), 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

#deck-ads .box.tan,
#deck-agent .box.tan,
#deck-matrix .box.tan,
#deck-arch .box.tan,
#deck-routing .box.tan {
  background: rgba(var(--tech-copper-rgb), 0.16);
  border: 1.5px solid rgba(var(--tech-copper-rgb), 0.65);
  box-shadow:
    0 6px 18px rgba(0, 0, 0, 0.4),
    0 0 14px rgba(var(--tech-copper-rgb), 0.15),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

#deck-matrix .box.gray-d,
#deck-arch .box.gray-d,
#deck-routing .box.gray-d {
  background: rgba(var(--tech-gray-rgb), 0.35);
  border: 1.5px solid rgba(var(--tech-gray-rgb), 0.75);
  box-shadow:
    0 6px 18px rgba(0, 0, 0, 0.4),
    0 0 14px rgba(var(--tech-gray-rgb), 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

#deck-matrix .box.gray-l,
#deck-arch .box.gray-l,
#deck-routing .box.gray-l {
  background: rgba(var(--tech-gray-rgb), 0.14);
  border: 1.5px solid rgba(var(--tech-gray-rgb), 0.55);
  box-shadow:
    0 6px 18px rgba(0, 0, 0, 0.4),
    0 0 10px rgba(var(--tech-gray-rgb), 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

#deck-ads .box.gold,
#deck-matrix .box.green-solid,
#deck-matrix .box.yellow,
#deck-select .box.orange,
#deck-agent .box.core,
#deck-arch .box.green-solid,
#deck-arch .box.yellow,
#deck-routing .box.green-solid,
#deck-routing .box.yellow {
  background: linear-gradient(135deg,
    rgba(var(--tech-gold-rgb), 0.92),
    rgba(var(--tech-amber-rgb), 0.55));
  border: 2px solid rgba(var(--tech-gold-rgb), 0.85);
  color: #fff;
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.42),
    0 0 22px rgba(var(--tech-gold-rgb), 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

#deck-matrix .box.green-solid,
#deck-arch .box.green-solid,
#deck-routing .box.green-solid {
  background: linear-gradient(135deg,
    rgba(var(--tech-green-rgb), 0.92),
    rgba(var(--tech-green-rgb), 0.55));
  border-color: rgba(var(--tech-green-rgb), 0.85);
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.42),
    0 0 22px rgba(var(--tech-green-rgb), 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

#deck-matrix .box.yellow,
#deck-arch .box.yellow,
#deck-routing .box.yellow {
  background: linear-gradient(135deg,
    rgba(var(--tech-gold-rgb), 0.92),
    rgba(var(--tech-amber-rgb), 0.55));
}

#deck-select .box.orange {
  background: linear-gradient(135deg,
    rgba(var(--tech-orange-rgb), 0.92),
    rgba(var(--tech-orange-rgb), 0.55));
  border-color: rgba(var(--tech-orange-rgb), 0.85);
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.42),
    0 0 22px rgba(var(--tech-orange-rgb), 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

#deck-agent .box.core {
  background: linear-gradient(135deg,
    rgba(var(--tech-cyan-rgb), 0.92),
    rgba(var(--tech-blue-rgb), 0.55));
  border-color: rgba(var(--tech-cyan-rgb), 0.85);
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.42),
    0 0 22px rgba(var(--tech-cyan-rgb), 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

#deck-ads .arrow-wrap svg path,
#deck-matrix .arrow-wrap svg path,
#deck-select .arrow-wrap svg path,
#deck-agent .arrow-wrap svg path,
#deck-arch .arrow-wrap svg path,
#deck-routing .arrow-wrap svg path {
  stroke: rgba(var(--deck-theme-rgb), 0.55);
}

#deck-ads .arrow-label,
#deck-matrix .arrow-label,
#deck-select .arrow-label,
#deck-agent .arrow-label,
#deck-arch .arrow-label,
#deck-routing .arrow-label {
  color: rgba(255, 255, 255, 0.72);
  font-size: clamp(10.5px, 1.3vw, 14px);
}

#deck-ads .point,
#deck-matrix .point,
#deck-select .point,
#deck-agent .point,
#deck-arch .point,
#deck-routing .point {
  background: var(--tech-dark-bg);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-left: 4px solid var(--deck-theme);
  color: #ffffff;
  box-shadow:
    0 5px 16px rgba(0, 0, 0, 0.38),
    0 0 10px rgba(var(--deck-theme-rgb), 0.1);
  font-size: clamp(13px, 1.6vw, 17px);
  padding: clamp(12px, 1.6vw, 17px) clamp(14px, 2vw, 20px);
}

#deck-matrix .point.benefit,
#deck-arch .point.benefit,
#deck-routing .point.benefit {
  border-left-color: var(--tech-green);
}

#deck-matrix .point.redline,
#deck-arch .point.redline,
#deck-routing .point.redline {
  border-left-color: var(--tech-red);
}

#deck-arch .point.star {
  border: 2px solid var(--deck-theme);
  box-shadow:
    0 6px 18px rgba(0, 0, 0, 0.42),
    0 0 18px rgba(var(--deck-theme-rgb), 0.18);
}

#deck-matrix .point.benefit .step-num,
#deck-arch .point.benefit .step-num,
#deck-routing .point.benefit .step-num {
  background: var(--tech-green);
}

#deck-matrix .point.redline .step-num,
#deck-arch .point.redline .step-num,
#deck-routing .point.redline .step-num {
  background: var(--tech-red);
}

#deck-arch .point.star .step-num {
  background: var(--deck-theme);
}

#deck-arch .point.star b {
  color: var(--deck-theme);
}

#deck-ads .tag,
#deck-matrix .tag,
#deck-select .tag,
#deck-agent .tag,
#deck-arch .tag,
#deck-routing .tag {
  background: var(--deck-theme);
  box-shadow: 0 4px 14px rgba(var(--deck-theme-rgb), 0.3);
  font-size: clamp(13px, 1.7vw, 18px);
}

#deck-ads .corner-tag,
#deck-matrix .corner-tag,
#deck-select .corner-tag,
#deck-agent .corner-tag,
#deck-arch .corner-tag,
#deck-routing .corner-tag {
  background: rgba(var(--deck-theme-rgb), 0.9);
  border-color: rgba(255, 255, 255, 0.6);
  box-shadow: 0 3px 12px rgba(var(--deck-theme-rgb), 0.3);
}

#deck-ads .badge {
  background: rgba(var(--deck-theme-rgb), 0.9);
}

#deck-matrix .banner.blue,
#deck-matrix .banner.orange,
#deck-matrix .banner.yellow,
#deck-arch .banner.yellow,
#deck-arch .banner.blue,
#deck-arch .banner.orange,
#deck-routing .banner.yellow,
#deck-routing .banner.blue,
#deck-routing .banner.orange {
  color: #fff;
  border-radius: 14px;
  box-shadow:
    0 8px 24px rgba(0, 0, 0, 0.42),
    0 0 24px rgba(var(--deck-theme-rgb), 0.22);
}

#deck-matrix .banner.blue,
#deck-arch .banner.blue,
#deck-routing .banner.blue {
  background: linear-gradient(135deg,
    rgba(var(--tech-blue-rgb), 0.92),
    rgba(var(--tech-blue-rgb), 0.45));
  border: 2px solid rgba(var(--tech-blue-rgb), 0.8);
  box-shadow:
    0 8px 24px rgba(0, 0, 0, 0.42),
    0 0 24px rgba(var(--tech-blue-rgb), 0.25);
}

#deck-matrix .banner.orange,
#deck-arch .banner.orange,
#deck-routing .banner.orange {
  background: linear-gradient(135deg,
    rgba(var(--tech-orange-rgb), 0.92),
    rgba(var(--tech-orange-rgb), 0.45));
  border: 2px solid rgba(var(--tech-orange-rgb), 0.8);
  box-shadow:
    0 8px 24px rgba(0, 0, 0, 0.42),
    0 0 24px rgba(var(--tech-orange-rgb), 0.25);
}

#deck-matrix .banner.yellow,
#deck-arch .banner.yellow,
#deck-routing .banner.yellow {
  background: linear-gradient(135deg,
    rgba(var(--tech-gold-rgb), 0.92),
    rgba(var(--tech-amber-rgb), 0.45));
  border: 2px solid rgba(var(--tech-gold-rgb), 0.8);
  box-shadow:
    0 8px 24px rgba(0, 0, 0, 0.42),
    0 0 24px rgba(var(--tech-gold-rgb), 0.25);
}

#deck-matrix .banner .accent,
#deck-arch .banner .accent,
#deck-routing .banner .accent {
  color: #ffffff;
}

#deck-select .core-banner,
#deck-agent .core-bar {
  background: linear-gradient(135deg,
    rgba(var(--deck-theme-rgb), 0.92),
    rgba(var(--deck-theme-rgb), 0.45));
  border: 2px solid rgba(var(--deck-theme-rgb), 0.8);
  color: #fff;
  box-shadow:
    0 8px 24px rgba(0, 0, 0, 0.42),
    0 0 24px rgba(var(--deck-theme-rgb), 0.3);
}

#deck-ads .gold-bar {
  background: linear-gradient(135deg,
    rgba(var(--tech-gold-rgb), 0.92),
    rgba(var(--tech-amber-rgb), 0.55));
  border: 2px solid rgba(var(--tech-gold-rgb), 0.8);
  color: #fff;
  box-shadow:
    0 8px 24px rgba(0, 0, 0, 0.42),
    0 0 24px rgba(var(--tech-gold-rgb), 0.3);
}

#deck-ads .center-line,
#deck-matrix .center-line,
#deck-select .center-line,
#deck-agent .center-line,
#deck-arch .center-line,
#deck-routing .center-line,
#deck-matrix .subline,
#deck-arch .subline,
#deck-routing .subline {
  color: rgba(255, 255, 255, 0.92);
  text-shadow: 0 0 10px rgba(var(--deck-theme-rgb), 0.35);
  font-size: clamp(13px, 1.7vw, 18px);
}

#deck-routing .center-line {
  color: rgba(255, 255, 255, 0.92) !important;
}

#deck-matrix .split-row,
#deck-arch .split-row,
#deck-routing .split-row,
#deck-arch .boundary .split-row {
  background: var(--tech-panel);
  border: 1px solid rgba(var(--deck-theme-rgb), 0.45);
  color: #ffffff;
  font-size: clamp(11px, 1.4vw, 15px);
  padding: clamp(10px, 1.4vw, 14px) clamp(12px, 1.8vw, 18px);
}

#deck-matrix .split-row .chiplet,
#deck-arch .split-row .chiplet,
#deck-routing .split-row .chiplet {
  background: rgba(var(--deck-theme-rgb), 0.22);
  color: #ffffff;
  font-size: clamp(9px, 1.1vw, 12px);
}

#deck-arch .boundary {
  border-top-color: rgba(var(--deck-theme-rgb), 0.55);
}

#deck-arch .boundary .blabel {
  background: #0F1C3A;
  color: var(--deck-theme);
}

#deck-arch .cross-hint {
  color: rgba(255, 255, 255, 0.9) !important;
  text-shadow: 0 0 10px rgba(var(--deck-theme-rgb), 0.35);
}

#deck-arch .firsts-head {
  color: #ffffff;
  font-size: clamp(19px, 2.6vw, 25px);
}

#deck-arch .firsts-head .big6 {
  color: var(--deck-theme);
  text-shadow: 0 0 24px rgba(var(--deck-theme-rgb), 0.5);
}

#deck-ads .fb-line,
#deck-ads .fb-tick,
#deck-ads .fb-arrow {
  background: var(--tech-red);
}

#deck-ads .fb-arrow {
  border-right-color: var(--tech-red);
}

#deck-ads .fb-label {
  color: var(--tech-red);
  background: rgba(9, 15, 34, 0.75);
  border-color: rgba(var(--tech-red-rgb), 0.6);
  font-size: clamp(10.5px, 1.3vw, 14px);
}

#deck-agent .rail::before,
#deck-agent .rail::after {
  background: rgba(var(--deck-theme-rgb), 0.6);
}

#deck-agent .sidecar {
  background: rgba(12, 26, 54, 0.5);
  border-color: rgba(var(--deck-theme-rgb), 0.45);
}

#deck-agent .sidecar-title {
  color: rgba(255, 255, 255, 0.75);
}

#deck-agent .link.direct {
  color: var(--tech-green);
}

#deck-agent .link.vpn {
  color: var(--tech-red);
}

#deck-agent .chip.n8n,
#deck-agent .chip.dify {
  background: rgba(var(--deck-theme-rgb), 0.85);
  box-shadow: 0 4px 14px rgba(var(--deck-theme-rgb), 0.3);
}

#deck-agent .merge-flash {
  background: radial-gradient(circle, rgba(255,255,255,0.95) 0%, rgba(var(--deck-theme-rgb), 0) 70%);
}

#deck-routing .arrow-wrap svg path {
  stroke: rgba(var(--tech-green-rgb), 0.7);
}

#deck-matrix .stat-card,
#deck-arch .stat-card,
#deck-routing .stat-card {
  background: var(--tech-dark-bg);
  border: 2px solid rgba(var(--deck-theme-rgb), 0.7);
  box-shadow:
    0 16px 45px rgba(0, 0, 0, 0.5),
    0 0 24px rgba(var(--deck-theme-rgb), 0.2);
}

#deck-matrix .case-chip,
#deck-arch .case-chip,
#deck-routing .case-chip {
  background: rgba(var(--tech-copper-rgb), 0.14);
  border: 1px solid rgba(var(--tech-copper-rgb), 0.5);
}

#deck-matrix .case-chip .badge,
#deck-arch .case-chip .badge,
#deck-routing .case-chip .badge {
  background: rgba(var(--deck-theme-rgb), 0.9);
}

#deck-matrix .case-chip .txt,
#deck-arch .case-chip .txt,
#deck-routing .case-chip .txt {
  color: #ffffff;
}

#deck-ads .deck-dot.active,
#deck-matrix .deck-dot.active,
#deck-select .deck-dot.active,
#deck-agent .deck-dot.active,
#deck-arch .deck-dot.active,
#deck-routing .deck-dot.active {
  background: var(--deck-theme);
  box-shadow: 0 0 14px rgba(var(--deck-theme-rgb), 0.55);
}

#deck-ads .deck-close,
#deck-matrix .deck-close,
#deck-select .deck-close,
#deck-agent .deck-close,
#deck-arch .deck-close,
#deck-routing .deck-close {
  background: var(--tech-dark-bg);
  border: 1px solid rgba(var(--deck-theme-rgb), 0.55);
  color: #ffffff;
  box-shadow: 0 0 14px rgba(var(--deck-theme-rgb), 0.22);
}

#deck-ads .box.gold.show,
#deck-matrix .banner.show,
#deck-matrix .box.green-solid.show,
#deck-matrix .box.yellow.show,
#deck-matrix .punch-item.glow-blue.show,
#deck-matrix .punch-item.glow-yellow.show,
#deck-select .core-banner.show.glow,
#deck-agent .core-bar.show,
#deck-arch .banner.show,
#deck-arch .box.green-solid.show,
#deck-arch .box.yellow.show,
#deck-arch .point.star.show,
#deck-arch .punch-item.glow-yellow.show,
#deck-routing .banner.show,
#deck-routing .box.green-solid.show,
#deck-routing .box.yellow.show,
#deck-routing .punch-item.glow-blue.show,
#deck-routing .punch-item.glow-yellow.show {
  animation: deckGlow-theme 2.6s ease-in-out infinite;
}

@keyframes deckGlow-theme {
  0%, 100% { box-shadow: 0 8px 24px rgba(0,0,0,0.42), 0 0 18px rgba(var(--deck-theme-rgb), 0.22); }
  50% { box-shadow: 0 10px 30px rgba(0,0,0,0.48), 0 0 32px rgba(var(--deck-theme-rgb), 0.42); }
}

#deck-ads .box.gold,
#deck-ads .gold-bar,
#deck-matrix .box.green-solid,
#deck-matrix .box.yellow,
#deck-select .box.orange,
#deck-select .core-banner,
#deck-agent .box.core,
#deck-agent .core-bar,
#deck-arch .box.green-solid,
#deck-arch .box.yellow,
#deck-routing .box.green-solid,
#deck-routing .box.yellow {
  color: #0B162E;
}

#deck-ads .tag,
#deck-matrix .tag,
#deck-select .tag,
#deck-agent .tag,
#deck-arch .tag,
#deck-routing .tag,
#deck-ads .corner-tag,
#deck-matrix .corner-tag,
#deck-select .corner-tag,
#deck-agent .corner-tag,
#deck-arch .corner-tag,
#deck-routing .corner-tag,
#deck-ads .badge,
#deck-matrix .badge,
#deck-select .badge,
#deck-agent .badge,
#deck-arch .badge,
#deck-routing .badge,
#deck-agent .chip.n8n,
#deck-agent .chip.dify {
  color: #0B162E;
}

#deck-ads .step-num,
#deck-matrix .step-num,
#deck-select .step-num,
#deck-agent .step-num,
#deck-arch .step-num,
#deck-routing .step-num {
  color: #0B162E;
  text-shadow: none;
}

#deck-matrix .banner.blue,
#deck-matrix .banner.orange,
#deck-matrix .banner.yellow,
#deck-arch .banner.yellow,
#deck-arch .banner.blue,
#deck-arch .banner.orange,
#deck-routing .banner.yellow,
#deck-routing .banner.blue,
#deck-routing .banner.orange {
  color: #0B162E;
}

#deck-matrix .banner .accent,
#deck-arch .banner .accent,
#deck-routing .banner .accent {
  color: #0B162E;
}

#deck-ads .box.blue,
#deck-ads .box.green,
#deck-ads .box.plum,
#deck-ads .box.tan,
#deck-matrix .box.blue,
#deck-matrix .box.green,
#deck-matrix .box.tan,
#deck-matrix .box.gray-d,
#deck-matrix .box.gray-l,
#deck-select .box.blue,
#deck-select .box.green,
#deck-agent .box.blue,
#deck-agent .box.tan,
#deck-agent .box.green,
#deck-arch .box.blue,
#deck-arch .box.green,
#deck-arch .box.tan,
#deck-arch .box.gray-d,
#deck-arch .box.gray-l,
#deck-routing .box.blue,
#deck-routing .box.green,
#deck-routing .box.tan,
#deck-routing .box.gray-d,
#deck-routing .box.gray-l {
  color: #ffffff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
}

#deck-ads .point,
#deck-matrix .point,
#deck-select .point,
#deck-agent .point,
#deck-arch .point,
#deck-routing .point {
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
}

#deck-matrix .point.benefit,
#deck-matrix .point.redline,
#deck-arch .point.benefit,
#deck-arch .point.redline,
#deck-arch .point.star,
#deck-routing .point.benefit,
#deck-routing .point.redline {
  background: var(--tech-dark-bg);
  color: #ffffff;
}

#deck-ads .box.gold .sub,
#deck-ads .gold-bar .sub,
#deck-matrix .box.green-solid .sub,
#deck-matrix .box.yellow .sub,
#deck-select .box.orange .sub,
#deck-agent .box.core .sub,
#deck-agent .core-bar .sub,
#deck-arch .box.green-solid .sub,
#deck-arch .box.yellow .sub,
#deck-routing .box.green-solid .sub,
#deck-routing .box.yellow .sub {
  color: rgba(11, 22, 46, 0.78);
}

#deck-agent .box .sub,
#deck-agent .box.blue .sub,
#deck-agent .box.tan .sub {
  color: inherit;
}

#deck-agent .merge-flash {
  color: #0B162E;
  text-shadow: none;
}

#deck-ads .h1,
#deck-matrix .h1,
#deck-select .h1,
#deck-agent .h1,
#deck-arch .h1,
#deck-routing .h1 {
  position: relative;
  top: auto;
  height: auto;
  padding-left: 0;
}

#deck-agent .page-slide {
  padding-top: calc(clamp(60px, 5vw + 40px, 128px) + 8px);
}

#deck-agent .inner {
  margin: 0 auto;
}

#deck-agent .page-slide[data-idx="0"] .inner {
  display: flex;
  flex-direction: column;
  flex: none;
  min-height: 100%;
}

#deck-agent .h1 {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 30;
  flex: none;
  margin-left: -6px;
  margin-right: -6px;
  padding: 8px 6px 12px;
  background: linear-gradient(180deg,
    rgba(11, 22, 46, 1) 0%,
    rgba(11, 22, 46, 0.97) 78%,
    rgba(11, 22, 46, 0) 100%);
}

#deck-agent .page-slide[data-idx="0"] .h1 + * {
  margin-top: auto;
}

#deck-agent .page-slide[data-idx="0"] .inner > :last-child {
  margin-bottom: auto;
}

#deck-agent .page-slide[data-idx="1"] .inner {
  display: flex;
  flex-direction: column;
  flex: none;
  min-height: 100%;
}

#deck-agent .page-slide[data-idx="1"] .inner > :first-child {
  margin-top: auto;
}

#deck-agent .page-slide[data-idx="1"] .inner > :last-child {
  margin-bottom: auto;
}

#deck-agent .page-slide[data-idx="1"] .inner > .tag {
  align-self: flex-start;
}

@media only screen and (min-width: 1261px) {
  #deck-ads .box,
  #deck-matrix .box,
  #deck-select .box,
  #deck-agent .box,
  #deck-arch .box,
  #deck-routing .box {
    border-width: 2px;
  }

  #deck-ads .box.blue,
  #deck-ads .box.green,
  #deck-ads .box.plum,
  #deck-ads .box.tan,
  #deck-matrix .box.blue,
  #deck-matrix .box.green,
  #deck-matrix .box.tan,
  #deck-matrix .box.gray-d,
  #deck-matrix .box.gray-l,
  #deck-select .box.blue,
  #deck-select .box.green,
  #deck-agent .box.blue,
  #deck-agent .box.tan,
  #deck-agent .box.green,
  #deck-arch .box.blue,
  #deck-arch .box.green,
  #deck-arch .box.tan,
  #deck-arch .box.gray-d,
  #deck-arch .box.gray-l,
  #deck-routing .box.blue,
  #deck-routing .box.green,
  #deck-routing .box.tan,
  #deck-routing .box.gray-d,
  #deck-routing .box.gray-l {
    padding: clamp(16px, 1.8vw, 22px) clamp(12px, 1.6vw, 18px);
    font-size: clamp(15px, 1.7vw, 20px);
  }

  #deck-ads .box .box-main,
  #deck-matrix .box .box-main,
  #deck-select .box .box-main,
  #deck-agent .box .box-main,
  #deck-arch .box .box-main,
  #deck-routing .box .box-main {
    font-size: clamp(16px, 1.9vw, 22px);
  }

  #deck-ads .box .sub,
  #deck-matrix .box .sub,
  #deck-select .box .sub,
  #deck-agent .box .sub,
  #deck-arch .box .sub,
  #deck-routing .box .sub {
    font-size: clamp(12px, 1.3vw, 15px);
  }

  #deck-ads .point,
  #deck-matrix .point,
  #deck-select .point,
  #deck-agent .point,
  #deck-arch .point,
  #deck-routing .point {
    border-left-width: 5px;
    font-size: clamp(15px, 1.7vw, 19px);
    padding: clamp(14px, 1.8vw, 19px) clamp(16px, 2.2vw, 24px);
  }

  #deck-ads .step-label,
  #deck-matrix .step-label,
  #deck-select .step-label,
  #deck-agent .step-label,
  #deck-arch .step-label,
  #deck-routing .step-label {
    font-size: clamp(15px, 2vw, 22px);
  }

  #deck-ads .step-num,
  #deck-matrix .step-num,
  #deck-select .step-num,
  #deck-agent .step-num,
  #deck-arch .step-num,
  #deck-routing .step-num {
    width: clamp(24px, 2.8vw, 30px);
    height: clamp(24px, 2.8vw, 30px);
    font-size: clamp(12px, 1.4vw, 15px);
  }

  #deck-ads .arrow-label,
  #deck-matrix .arrow-label,
  #deck-select .arrow-label,
  #deck-agent .arrow-label,
  #deck-arch .arrow-label,
  #deck-routing .arrow-label {
    font-size: clamp(12px, 1.4vw, 15px);
  }

  #deck-ads .banner,
  #deck-matrix .banner,
  #deck-arch .banner,
  #deck-routing .banner {
    font-size: clamp(22px, 3vw, 32px);
    padding: clamp(22px, 2.6vw, 32px) clamp(18px, 2.4vw, 28px);
  }

  #deck-select .core-banner,
  #deck-agent .core-bar {
    font-size: clamp(28px, 3.8vw, 40px);
  }
}
