@import url('https://fonts.googleapis.com/css2?family=Alexandria:wght@500;600;700;800;900&family=Almarai:wght@400;700;800&family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap');

:root {
  --paper: #FBF4ED;
  --paper-2: #F3EBE0;
  --ink: #0A0A08;
  --ink-2: #4A443C;
  --ink-3: #8C8578;
  --line: #E0D6C8;
  --yellow: #FEE649;
  --pink: #FECEE9;
  --orange: #FD8F5D;
  --yellow-tint: #FCF0BC;
  --orange-tint: #FBDBC9;
  --reading-width: 720px;
  --wide-width: 1120px;
}

* { box-sizing: border-box; }
html { max-width: 100%; overflow-x: clip; scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  min-width: 320px;
  max-width: 100%;
  margin: 0;
  overflow-x: clip;
  background: var(--paper);
  color: var(--ink);
  font-family: "Almarai", sans-serif;
  font-size: 19px;
  line-height: 1.85;
}
img, svg { max-width: 100%; height: auto; }
a { color: inherit; }
button, a { touch-action: manipulation; }
button, input { font: inherit; }
:focus-visible { outline: 3px solid var(--orange); outline-offset: 4px; }
[hidden] { display: none !important; }
.ltr { display: inline-block; direction: ltr; unicode-bidi: isolate; font-family: "IBM Plex Sans Arabic", sans-serif; }

.blog-wrap { width: min(calc(100% - 32px), var(--wide-width)); margin-inline: auto; }
.article-wrap { width: min(calc(100% - 32px), var(--reading-width)); margin-inline: auto; }

.skip-link {
  position: fixed;
  z-index: 1000;
  top: 10px;
  right: 10px;
  padding: 10px 14px;
  border: 2px solid var(--ink);
  background: var(--yellow);
  transform: translateY(-160%);
}
.skip-link:focus { transform: translateY(0); }

.blog-nav {
  position: relative;
  z-index: 30;
  border-bottom: 1px solid var(--line);
  background: var(--paper);
}
.blog-nav__inner {
  min-height: 70px;
  display: flex;
  align-items: center;
  gap: 14px;
}
.blog-brand {
  font-family: "Alexandria", sans-serif;
  font-size: 18px;
  font-weight: 900;
  text-decoration: none;
}
.blog-nav__links {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-inline-start: auto;
}
.blog-nav__links a {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}
.blog-nav__links a:hover { background: var(--paper-2); }
.blog-nav__links .blog-nav__cta { background: var(--ink); color: var(--paper); }
.blog-nav__toggle {
  width: 48px;
  height: 48px;
  display: none;
  margin-inline-start: auto;
  border: 2px solid var(--ink);
  background: var(--paper);
  cursor: pointer;
}
.blog-nav__toggle::before,
.blog-nav__toggle::after {
  content: "";
  width: 22px;
  height: 2px;
  display: block;
  margin: 6px auto;
  background: var(--ink);
}

.blog-hero {
  position: relative;
  min-height: 450px;
  display: grid;
  align-items: end;
  overflow: hidden;
  padding-block: 78px 64px;
  border-bottom: 2px solid var(--ink);
  background: var(--paper);
}
.radar-arcs { position: absolute; z-index: 0; top: -210px; left: -210px; width: 560px; height: 560px; pointer-events: none; }
.radar-arc { position: absolute; top: 50%; left: 50%; border: 2px solid; border-radius: 50%; transform: translate(-50%, -50%); }
.radar-arc--yellow { width: 290px; height: 290px; border-color: var(--yellow); }
.radar-arc--pink { width: 390px; height: 390px; border-color: var(--pink); }
.radar-arc--orange { width: 500px; height: 500px; border-color: var(--orange); }
.radar-line { position: absolute; top: 50%; left: 50%; width: 390px; height: 1px; background: var(--line); transform: rotate(50deg); transform-origin: left center; }
.blog-hero__content { position: relative; z-index: 1; }
.eyebrow {
  display: inline-block;
  margin-bottom: 15px;
  padding: 4px 9px;
  background: var(--orange);
  font-family: "IBM Plex Sans Arabic", sans-serif;
  font-size: 13px;
  font-weight: 700;
}
h1, h2, h3 { margin-top: 0; font-family: "Alexandria", sans-serif; line-height: 1.32; }
.blog-hero h1 { max-width: 850px; margin-bottom: 18px; font-size: clamp(42px, 11vw, 66px); font-weight: 900; }
.blog-hero p { max-width: 700px; margin: 0; color: var(--ink-2); font-size: 19px; }

.blog-catalog { padding-block: 66px 90px; }
.pillar-filters { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 38px; }
.pillar-filter {
  min-height: 48px;
  padding: 9px 14px;
  border: 2px solid transparent;
  color: var(--ink);
  font-family: "Alexandria", sans-serif;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}
.pillar-filter:nth-child(1) { background: var(--paper-2); transform: rotate(.6deg); }
.pillar-filter:nth-child(2) { background: var(--yellow); transform: rotate(-1.2deg); }
.pillar-filter:nth-child(3) { background: var(--pink); transform: rotate(.8deg); }
.pillar-filter:nth-child(4) { background: var(--orange); transform: rotate(-.7deg); }
.pillar-filter[aria-pressed="true"] { border-color: var(--ink); }
.pillar-block + .pillar-block { margin-top: 70px; }
.pillar-heading { max-width: 760px; margin-bottom: 26px; }
.pillar-heading__number { color: var(--ink-3); font-family: "IBM Plex Sans Arabic", sans-serif; font-size: 13px; font-weight: 700; }
.pillar-heading h2 { margin: 4px 0 8px; font-size: clamp(29px, 8vw, 42px); }
.pillar-heading p { margin: 0; color: var(--ink-2); }
.article-grid { display: grid; gap: 14px; }
.article-card {
  min-width: 0;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: var(--paper);
}
.article-card:hover { border-color: var(--ink); }
.article-card__pillar {
  display: inline-block;
  margin-bottom: 13px;
  padding: 3px 7px;
  font-family: "IBM Plex Sans Arabic", sans-serif;
  font-size: 11px;
  font-weight: 700;
}
.article-card[data-pillar="validation"] .article-card__pillar { background: var(--yellow); }
.article-card[data-pillar="micro"] .article-card__pillar { background: var(--pink); }
.article-card[data-pillar="ai"] .article-card__pillar { background: var(--orange); }
.article-card h3 { margin-bottom: 10px; font-size: 22px; font-weight: 700; }
.article-card h3 a { text-decoration: none; }
.article-card h3 a::after { content: ""; position: absolute; inset: 0; }
.article-card p { margin: 0 0 18px; color: var(--ink-2); font-size: 16px; line-height: 1.7; }
.article-card__meta { color: var(--ink-3); font-family: "IBM Plex Sans Arabic", sans-serif; font-size: 13px; font-weight: 600; }
.article-card { position: relative; }
.article-card--planned h3 a::after { display: none; }
.article-card--planned { background: var(--paper-2); }
.article-card--planned .article-card__status { color: var(--ink-3); }
.empty-filter { padding: 24px; border: 1px solid var(--line); background: var(--paper-2); }

/* Motion system for the blog index only. Content remains visible if JavaScript is unavailable. */
.blog-index-page .blog-nav__links a,
.blog-index-page .blog-brand,
.blog-index-page .pillar-filter,
.blog-index-page .article-card,
.blog-index-page .article-card__pillar,
.blog-index-page .article-card__meta,
.blog-index-page .blog-footer a {
  transition: transform 220ms ease, border-color 220ms ease, background-color 220ms ease, color 220ms ease;
}
.blog-index-page .blog-brand:hover,
.blog-index-page .blog-brand:focus-visible { transform: rotate(-1.5deg) translateY(-2px); }
.blog-index-page .blog-nav__links a:not(.blog-nav__cta):hover,
.blog-index-page .blog-nav__links a:not(.blog-nav__cta):focus-visible { transform: translateY(-2px); background: var(--yellow-tint); }
.blog-index-page .blog-nav__cta:hover,
.blog-index-page .blog-nav__cta:focus-visible { transform: translate(-3px, -2px) rotate(-1deg); background: var(--orange); color: var(--ink); }
.blog-index-page .radar-arcs { animation: catalog-radar-drift 18s linear infinite; transform-origin: center; }
.blog-index-page .radar-line { animation: catalog-radar-scan 7s ease-in-out infinite alternate; }
.blog-index-page .eyebrow { animation: catalog-label-tilt 4s ease-in-out infinite; }
.blog-index-page .pillar-filter:nth-child(1) { --filter-rotate: .6deg; }
.blog-index-page .pillar-filter:nth-child(2) { --filter-rotate: -1.2deg; }
.blog-index-page .pillar-filter:nth-child(3) { --filter-rotate: .8deg; }
.blog-index-page .pillar-filter:nth-child(4) { --filter-rotate: -.7deg; }
.blog-index-page .pillar-filter:hover,
.blog-index-page .pillar-filter:focus-visible { transform: translateY(-4px) rotate(var(--filter-rotate)); border-color: var(--ink); }
.blog-index-page .pillar-filter:active { transform: translateY(1px) rotate(0); }
.blog-index-page .pillar-filter[aria-pressed="true"] { transform: translateY(-2px) rotate(var(--filter-rotate)); }
.blog-index-page .article-card:hover,
.blog-index-page .article-card:focus-within { z-index: 2; border-color: var(--ink); transform: translateY(-7px) rotate(-.35deg); background: var(--yellow-tint); }
.blog-index-page .article-card:nth-child(even):hover,
.blog-index-page .article-card:nth-child(even):focus-within { transform: translateY(-7px) rotate(.35deg); }
.blog-index-page .article-card:hover .article-card__pillar,
.blog-index-page .article-card:focus-within .article-card__pillar { transform: translateY(-2px) rotate(-1.5deg); }
.blog-index-page .article-card__meta::after { content: " ←"; display: inline-block; transition: transform 220ms ease; }
.blog-index-page .article-card:hover .article-card__meta::after,
.blog-index-page .article-card:focus-within .article-card__meta::after { transform: translateX(-6px); }
.blog-index-page .blog-footer a:hover,
.blog-index-page .blog-footer a:focus-visible { transform: translateY(-3px); color: var(--yellow); }

.blog-index-page.motion-ready [data-scroll-reveal] {
  opacity: .78;
  transform: translateY(34px) rotate(.35deg);
  transition: opacity 620ms ease, transform 620ms cubic-bezier(.2, .75, .25, 1);
  transition-delay: var(--reveal-delay, 0ms);
}
.blog-index-page.motion-ready [data-scroll-reveal="from-right"] { transform: translateX(34px); }
.blog-index-page.motion-ready [data-scroll-reveal="from-left"] { transform: translateX(-34px); }
.blog-index-page.motion-ready [data-scroll-reveal].is-visible { opacity: 1; transform: translate(0, 0) rotate(0); }
.blog-index-page .article-card.is-filter-entering { animation: catalog-card-enter 460ms cubic-bezier(.2, .75, .25, 1) both; animation-delay: var(--filter-delay, 0ms); }

.article-progress { position: fixed; z-index: 100; top: 0; right: 0; left: 0; height: 3px; display: none; background: transparent; }
.article-progress__bar { width: 100%; height: 100%; background: var(--orange); transform: scaleX(0); transform-origin: right center; }
.article-header { padding-block: 46px 42px; border-bottom: 1px solid var(--line); }
.article-back {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
  color: var(--ink-2);
  font-family: "IBM Plex Sans Arabic", sans-serif;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}
.article-back::before { content: "←"; font-size: 20px; transition: transform 180ms ease; }
.article-back:hover::before { transform: translateX(-5px); }
.breadcrumb { margin-bottom: 30px; color: var(--ink-3); font-family: "IBM Plex Sans Arabic", sans-serif; font-size: 15px; }
.breadcrumb ol { display: flex; flex-wrap: wrap; gap: 7px; margin: 0; padding: 0; list-style: none; }
.breadcrumb li + li::before { content: "/"; margin-left: 7px; }
.breadcrumb a { text-decoration: none; }
.article-header h1 { margin-bottom: 22px; font-size: clamp(40px, 10.4vw, 60px); font-weight: 900; }
.article-meta { display: flex; flex-wrap: wrap; gap: 8px 16px; color: var(--ink-3); font-family: "IBM Plex Sans Arabic", sans-serif; font-size: 14px; }
.article-meta__pillar { padding: 2px 7px; background: var(--yellow); color: var(--ink); font-weight: 700; }
.article-main { padding-block: 36px 84px; }
.article-visual {
  position: relative;
  min-height: 300px;
  margin: 0 0 38px;
  overflow: hidden;
  border: 2px solid var(--ink);
  background: var(--paper-2);
  isolation: isolate;
}
.article-visual__label {
  position: absolute;
  z-index: 5;
  top: 16px;
  right: 16px;
  padding: 4px 9px;
  border: 1px solid var(--ink);
  background: var(--paper);
  font-family: "IBM Plex Sans Arabic", sans-serif;
  font-size: 12px;
  font-weight: 700;
}
.idea-radar__ring {
  position: absolute;
  top: 52%;
  right: 50%;
  border: 2px solid var(--line);
  border-radius: 50%;
  translate: 50% -50%;
}
.idea-radar__ring--one { width: 250px; height: 250px; border-color: var(--orange); }
.idea-radar__ring--two { width: 180px; height: 180px; border-color: var(--pink); }
.idea-radar__ring--three { width: 110px; height: 110px; border-color: var(--yellow); }
.idea-radar__sweep {
  position: absolute;
  z-index: 1;
  top: 52%;
  right: 50%;
  width: 122px;
  height: 2px;
  background: var(--ink);
  transform-origin: right center;
  animation: article-scan 6s linear infinite;
}
.idea-radar__card {
  position: absolute;
  z-index: 3;
  top: 52%;
  right: 50%;
  width: 112px;
  min-height: 78px;
  display: grid;
  place-items: center;
  border: 2px solid var(--ink);
  background: var(--yellow);
  font-family: "Alexandria", sans-serif;
  font-weight: 900;
  translate: 50% -50%;
  rotate: -2deg;
  animation: article-float 3.4s ease-in-out infinite;
}
.idea-radar__signal {
  position: absolute;
  z-index: 4;
  min-width: 70px;
  padding: 5px 8px;
  border: 1px solid var(--ink);
  background: var(--paper);
  font-family: "Alexandria", sans-serif;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  animation: article-pop 3.2s ease-in-out infinite;
}
.idea-radar__signal--one { top: 28%; left: 9%; background: var(--pink); }
.idea-radar__signal--two { right: 8%; bottom: 20%; background: var(--orange); animation-delay: .8s; }
.idea-radar__signal--three { bottom: 12%; left: 28%; animation-delay: 1.5s; }

/* Each article opens with its own topic-specific CSS scene. */
.article-visual :where(span, strong, small, p, b, i) { box-sizing: border-box; }
.article-visual :where(strong, span, small, p) { font-family: "Alexandria", sans-serif; }

.validation-route__track {
  position: absolute;
  right: 6%;
  bottom: 72px;
  left: 6%;
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  align-items: center;
  gap: 7px;
}
.validation-route__track::before {
  content: "";
  position: absolute;
  z-index: -1;
  right: 3%;
  left: 3%;
  height: 3px;
  background: var(--ink);
}
.validation-route__track > span:not(.validation-route__marker) {
  min-height: 58px;
  display: grid;
  place-items: center;
  padding: 6px;
  border: 2px solid var(--ink);
  background: var(--paper);
  font-size: 11px;
  font-weight: 800;
  text-align: center;
}
.validation-route__start { background: var(--pink) !important; rotate: 2deg; }
.validation-route__station:nth-child(3n) { background: var(--yellow) !important; }
.validation-route__station:nth-child(3n + 1) { background: var(--orange-tint) !important; }
.validation-route__decision { background: var(--orange) !important; rotate: -2deg; }
.validation-route__marker {
  position: absolute;
  z-index: 3;
  top: -22px;
  right: 2%;
  width: 14px;
  height: 14px;
  border: 2px solid var(--ink);
  border-radius: 50%;
  background: var(--yellow);
  animation: route-marker 7s steps(7, end) infinite;
}

.smoke-test-flow__offer {
  position: absolute;
  top: 88px;
  right: 7%;
  width: 155px;
  height: 142px;
  padding: 18px 14px;
  border: 2px solid var(--ink);
  background: var(--paper);
  rotate: 1deg;
}
.smoke-test-flow__offer::before { content: ""; display: block; width: 54%; height: 8px; margin-bottom: 20px; background: var(--pink); }
.smoke-test-flow__offer span { display: block; margin-bottom: 20px; font-size: 16px; font-weight: 800; }
.smoke-test-flow__offer strong { display: block; padding: 5px; border: 2px solid var(--ink); background: var(--yellow); font-size: 12px; text-align: center; }
.smoke-test-flow__step, .smoke-test-flow__arrow { position: absolute; top: 150px; }
.smoke-test-flow__step { min-width: 70px; padding: 7px; border: 2px solid var(--ink); background: var(--paper); font-size: 12px; font-weight: 800; text-align: center; }
.smoke-test-flow__step--visit { right: 38%; }
.smoke-test-flow__step--click { right: 58%; background: var(--pink); animation: flow-pulse 3s 1s infinite; }
.smoke-test-flow__step--book { right: 80%; background: var(--orange); animation: flow-pulse 3s 2s infinite; }
.smoke-test-flow__arrow { font-size: 25px; font-weight: 900; animation: arrow-nudge 1.5s infinite; }
.smoke-test-flow__arrow--one { right: 51%; }
.smoke-test-flow__arrow--two { right: 72%; animation-delay: .5s; }
.smoke-test-flow__timer { position: absolute; right: 43%; bottom: 35px; padding: 4px 10px; border: 2px solid var(--ink); background: var(--yellow); font-size: 20px; font-weight: 800; rotate: -2deg; }

.comment-miner__feed { position: absolute; top: 82px; right: 7%; width: 43%; display: grid; gap: 10px; }
.comment-miner__feed span { position: relative; width: 88%; padding: 9px 13px; border: 2px solid var(--ink); background: var(--paper); font-size: 12px; font-weight: 700; }
.comment-miner__feed span:nth-child(2) { margin-right: 12%; background: var(--pink); }
.comment-miner__feed span:nth-child(3) { margin-right: 4%; background: var(--yellow-tint); }
.comment-miner__feed span::after { content: ""; position: absolute; bottom: -8px; right: 16px; width: 12px; height: 12px; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); background: inherit; rotate: 45deg; }
.comment-miner__cursor { position: absolute; z-index: 3; top: 110px; right: 36%; width: 64px; height: 22px; border: 3px solid var(--orange); animation: mine-comments 4s steps(3, end) infinite; }
.comment-miner__pattern { position: absolute; top: 92px; left: 7%; width: 38%; padding: 16px; border: 2px solid var(--ink); background: var(--orange); rotate: -1deg; }
.comment-miner__pattern small, .comment-miner__pattern strong, .comment-miner__pattern span { display: block; }
.comment-miner__pattern small { font-size: 10px; }
.comment-miner__pattern strong { margin: 5px 0 14px; font-size: 20px; }
.comment-miner__pattern span { padding-top: 10px; border-top: 2px solid var(--ink); font-size: 11px; }

.payment-scale__beam { position: absolute; top: 105px; right: 16%; left: 16%; height: 100px; border-top: 5px solid var(--ink); transform-origin: center; rotate: -4deg; animation: scale-settle 4s ease-in-out infinite; }
.payment-scale__pivot { position: absolute; top: -6px; right: calc(50% - 24px); width: 48px; height: 90px; border-right: 24px solid transparent; border-left: 24px solid transparent; border-bottom: 90px solid var(--ink); }
.payment-scale__pivot::after { content: ""; position: absolute; right: -19px; bottom: -84px; border-right: 19px solid transparent; border-left: 19px solid transparent; border-bottom: 74px solid var(--paper-2); }
.payment-scale__pan { position: absolute; top: 24px; width: 122px; min-height: 58px; display: grid; place-items: center; border: 2px solid var(--ink); font-size: 14px; font-weight: 800; }
.payment-scale__pan--words { right: -18px; background: var(--pink); }
.payment-scale__pan--action { left: -18px; background: var(--yellow); }
.payment-scale__tokens { position: absolute; bottom: 28px; left: 12%; display: flex; gap: 7px; }
.payment-scale__tokens span { padding: 4px 8px; border: 1px solid var(--ink); background: var(--orange); font-size: 11px; font-weight: 800; animation: token-drop 3s ease-in-out infinite; }
.payment-scale__tokens span:nth-child(2) { animation-delay: .4s; }
.payment-scale__tokens span:nth-child(3) { animation-delay: .8s; }

.launch-pipeline__line { position: absolute; top: 137px; right: 7%; left: 7%; display: grid; grid-template-columns: repeat(5, 1fr); gap: 18px; }
.launch-pipeline__line::before { content: ""; position: absolute; z-index: -1; top: 23px; right: 4%; left: 4%; height: 4px; background: var(--ink); }
.launch-pipeline__line span { min-height: 50px; display: grid; place-items: center; border: 2px solid var(--ink); background: var(--paper); font-size: 12px; font-weight: 800; }
.launch-pipeline__line span:nth-child(2) { background: var(--yellow); }
.launch-pipeline__line span:nth-child(4) { background: var(--pink); opacity: .55; }
.launch-pipeline__line span:nth-child(5) { background: var(--orange-tint); opacity: .45; }
.launch-pipeline__broken { position: relative; background: var(--orange) !important; }
.launch-pipeline__broken::after { content: "×"; position: absolute; top: -31px; font-size: 28px; font-weight: 900; }
.launch-pipeline__line i { position: absolute; z-index: 3; top: 15px; right: 3%; width: 18px; height: 18px; border: 2px solid var(--ink); border-radius: 50%; background: var(--yellow); animation: pipeline-inspect 5s steps(4, end) infinite; }
.launch-pipeline__diagnosis { position: absolute; top: 75px; right: calc(50% - 54px); padding: 4px 9px; border: 2px solid var(--ink); background: var(--paper); font-size: 11px; rotate: 2deg; }

.license-checker__document { position: absolute; top: 77px; right: 14%; width: 190px; min-height: 170px; padding: 18px; border: 2px solid var(--ink); background: var(--paper); rotate: 2deg; }
.license-checker__document strong { display: block; margin-bottom: 17px; font-size: 27px; }
.license-checker__document span { display: block; margin-top: 9px; border-bottom: 2px solid var(--line); font-size: 11px; }
.license-checker__document i { position: absolute; left: 12px; bottom: 14px; padding: 2px 7px; border: 3px solid var(--orange); color: var(--ink); font-family: "Alexandria", sans-serif; font-size: 12px; font-style: normal; font-weight: 900; rotate: -8deg; animation: stamp-license 3s ease-in-out infinite; }
.license-checker__checks { position: absolute; top: 89px; left: 13%; width: 210px; display: grid; gap: 11px; }
.license-checker__checks span { display: flex; align-items: center; justify-content: space-between; padding: 8px 11px; border: 2px solid var(--ink); background: var(--paper); font-size: 12px; font-weight: 800; }
.license-checker__checks span:first-child { background: var(--yellow); }
.license-checker__checks b { width: 27px; height: 27px; display: grid; place-items: center; border: 2px solid var(--ink); background: var(--paper); }

.value-pricer__meter { position: absolute; top: 104px; right: 12%; left: 12%; display: grid; grid-template-columns: 100px 1fr 110px; gap: 14px; align-items: center; }
.value-pricer__meter span { font-size: 12px; font-weight: 800; text-align: center; }
.value-pricer__meter i { position: relative; height: 22px; border: 2px solid var(--ink); background: var(--paper); }
.value-pricer__meter i::before { content: ""; position: absolute; top: 8px; right: 8px; left: 8px; height: 2px; background: var(--ink); }
.value-pricer__meter b { position: absolute; z-index: 2; top: -8px; right: 20%; width: 34px; height: 34px; border: 2px solid var(--ink); border-radius: 50%; background: var(--orange); animation: price-calibrate 4s ease-in-out infinite; }
.value-pricer__price { position: absolute; right: calc(50% - 85px); bottom: 48px; width: 170px; padding: 9px; border: 2px solid var(--ink); background: var(--yellow); font-size: 13px; text-align: center; rotate: -1deg; }
.value-pricer__pages { position: absolute; right: 8%; bottom: 25px; padding: 3px 7px; background: var(--pink); font-size: 11px; font-weight: 800; rotate: 3deg; }

.idea-filter__wall { position: absolute; top: 75px; right: 5%; width: 44%; display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
.idea-filter__wall span { aspect-ratio: 1; display: grid; place-items: center; border: 2px solid var(--ink); background: var(--paper); font-size: 11px; font-weight: 800; }
.idea-filter__wall span:nth-child(3n) { background: var(--pink); }
.idea-filter__wall span:nth-child(4n) { background: var(--yellow); }
.idea-filter__funnel { position: absolute; top: 92px; right: 53%; width: 20%; display: grid; gap: 4px; clip-path: polygon(0 0, 100% 0, 66% 100%, 34% 100%); }
.idea-filter__funnel span { padding: 3px 16px; border: 2px solid var(--ink); background: var(--orange-tint); font-size: 10px; font-weight: 800; text-align: center; }
.idea-filter__output { position: absolute; top: 145px; left: 5%; width: 20%; padding: 10px 5px; border: 2px solid var(--ink); background: var(--orange); font-size: 12px; text-align: center; animation: filter-output 3s ease-in-out infinite; }

.format-comparison__small { position: absolute; top: 104px; right: 10%; width: 165px; padding: 20px 12px; border: 2px solid var(--ink); background: var(--yellow); rotate: 2deg; }
.format-comparison__small small, .format-comparison__small strong { display: block; }
.format-comparison__small small { font-size: 10px; }
.format-comparison__small strong { margin-top: 8px; font-size: 17px; }
.format-comparison__course { position: absolute; top: 90px; left: 9%; width: 180px; display: grid; gap: 5px; }
.format-comparison__course span { padding: 4px; border: 2px solid var(--ink); background: var(--paper); font-size: 10px; text-align: center; }
.format-comparison__course span:nth-child(2) { background: var(--pink); }
.format-comparison__course strong { padding: 5px; border: 2px solid var(--ink); background: var(--orange); font-size: 12px; text-align: center; }
.format-comparison__slider { position: absolute; right: 24%; bottom: 24px; left: 24%; display: grid; grid-template-columns: 55px 1fr 80px; gap: 8px; align-items: center; }
.format-comparison__slider span { font-size: 9px; font-weight: 800; text-align: center; }
.format-comparison__slider i { position: relative; height: 6px; background: var(--ink); }
.format-comparison__slider b { position: absolute; top: -8px; right: 12%; width: 21px; height: 21px; border: 2px solid var(--ink); border-radius: 50%; background: var(--paper); animation: format-slide 4s ease-in-out infinite; }

.prompt-comparison { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; padding: 75px 6% 28px; }
.prompt-comparison__panel { min-width: 0; padding: 14px; border: 2px solid var(--ink); background: var(--paper); }
.prompt-comparison__panel small { display: block; font-size: 10px; font-weight: 800; }
.prompt-comparison__panel p { margin: 8px 0 !important; padding: 7px; border: 1px solid var(--ink); font-size: 11px; line-height: 1.5; }
.prompt-comparison__panel span { display: block; min-height: 74px; padding: 9px; border: 2px solid var(--ink); font-size: 12px; line-height: 1.55; }
.prompt-comparison__panel--generic span { color: var(--ink-3); background: var(--paper-2); animation: generic-shift 2s steps(2, end) infinite; }
.prompt-comparison__panel--specific { background: var(--yellow-tint); }
.prompt-comparison__panel--specific p { display: flex; flex-wrap: wrap; gap: 4px; }
.prompt-comparison__panel--specific b { padding: 2px 5px; background: var(--orange); font-size: 9px; }
.prompt-comparison__panel--specific span { background: var(--yellow); }

.content-editor__stack { position: absolute; top: 72px; right: 8%; width: 190px; display: grid; gap: 5px; }
.content-editor__stack span { padding: 5px 9px; border: 2px solid var(--ink); background: var(--paper); font-size: 11px; font-weight: 800; }
.content-editor__remove { background: var(--pink) !important; text-decoration: line-through; animation: remove-block 4s ease-in-out infinite; }
.content-editor__keep:nth-child(3) { background: var(--yellow); }
.content-editor__path { position: absolute; top: 112px; left: 7%; width: 45%; display: flex; align-items: center; }
.content-editor__path span { flex: 1; min-height: 48px; display: grid; place-items: center; border: 2px solid var(--ink); background: var(--yellow); font-size: 10px; font-weight: 800; }
.content-editor__path i { width: 18px; height: 3px; background: var(--ink); }
.content-editor__note { position: absolute; left: 14%; bottom: 28px; padding: 4px 8px; border: 2px solid var(--ink); background: var(--orange); font-size: 11px; rotate: -2deg; }

.command-flow__rail { position: absolute; top: 102px; right: 6%; left: 6%; display: grid; grid-template-columns: 1fr 55px 1fr 55px 1fr 55px; align-items: center; }
.command-flow__rail span { min-height: 72px; display: grid; place-items: center; border: 2px solid var(--ink); background: var(--paper); font-size: 13px; font-weight: 800; }
.command-flow__rail span:nth-of-type(2) { background: var(--yellow); }
.command-flow__rail span:nth-of-type(3) { background: var(--orange-tint); }
.command-flow__rail span b { margin-left: 4px; }
.command-flow__rail i { min-height: 42px; display: grid; place-items: center; border-block: 2px solid var(--ink); background: var(--pink); font-family: "Alexandria", sans-serif; font-size: 9px; font-style: normal; font-weight: 800; animation: gate-check 3s steps(2, end) infinite; }
.command-flow__rail i:nth-of-type(2) { animation-delay: .6s; }
.command-flow__rail i:nth-of-type(3) { animation-delay: 1.2s; }
.command-flow__output { position: absolute; right: calc(50% - 70px); bottom: 26px; width: 140px; padding: 7px; border: 2px solid var(--ink); background: var(--orange); font-size: 11px; text-align: center; }

.direct-answer {
  margin: 0 0 28px;
  padding: 22px 22px 22px 24px;
  border-left: 4px solid var(--orange);
  background: var(--yellow-tint);
  color: var(--ink);
  font-family: "Alexandria", sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.75;
}
.quick-summary { margin-bottom: 48px; padding: 22px; background: var(--paper-2); }
.quick-summary h2 { margin-bottom: 12px; font-size: 22px; }
.quick-summary ul { margin: 0; padding-right: 22px; }
.article-content > section { margin-top: 54px; }
.article-content h2 { margin-bottom: 20px; font-size: clamp(29px, 8vw, 38px); font-weight: 700; }
.article-content h3 { margin: 32px 0 12px; font-size: 23px; }
.article-content p { margin: 0 0 22px; }
.article-content ul, .article-content ol { margin: 0 0 24px; padding-right: 26px; }
.article-content li + li { margin-top: 10px; }
.market-quote {
  margin: 28px 0;
  padding: 21px 22px;
  border-right: 4px solid var(--orange);
  background: var(--yellow-tint);
  font-size: 21px;
  line-height: 1.75;
}
.callout { margin: 28px 0; padding: 20px 22px; }
.callout--yellow { background: var(--yellow-tint); }
.callout--orange { background: var(--orange-tint); }
.callout--plain { background: var(--paper-2); }
.callout strong { display: block; margin-bottom: 6px; font-family: "Alexandria", sans-serif; }
.steps { display: grid; gap: 18px; margin-top: 26px; }
.step { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 15px; align-items: start; }
.step__number { color: #EDE2D4; font-family: "IBM Plex Sans Arabic", sans-serif; font-size: 64px; font-weight: 700; line-height: 1; }
.step h3 { margin: 4px 0 7px; }
.step p { margin: 0; }
.table-scroll { margin: 28px 0; overflow-x: auto; }
table { width: 100%; min-width: 620px; border-collapse: collapse; font-size: 16px; }
th, td { padding: 13px; border: 1px solid var(--line); text-align: right; vertical-align: top; }
th { background: var(--paper-2); font-family: "Alexandria", sans-serif; }
.source-note { color: var(--ink-3); font-family: "IBM Plex Sans Arabic", sans-serif; font-size: 14px; }

.evidence-visual {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 32px 0;
  padding: 18px;
  border: 2px solid var(--ink);
  background: var(--paper-2);
}
.evidence-visual__item {
  position: relative;
  min-height: 126px;
  display: grid;
  align-content: end;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--ink);
  background: var(--paper);
  font-family: "Alexandria", sans-serif;
  font-size: 13px;
  font-weight: 700;
}
.evidence-visual__item:nth-child(2) { background: var(--pink); }
.evidence-visual__item:nth-child(3) { background: var(--yellow); }
.evidence-visual__meter { height: 8px; border: 1px solid var(--ink); background: var(--paper); overflow: hidden; }
.evidence-visual__meter::after {
  content: "";
  width: var(--signal-width);
  height: 100%;
  display: block;
  background: var(--orange);
  transform: scaleX(.2);
  transform-origin: right center;
  animation: evidence-grow 2.8s ease-in-out infinite alternate;
}
.evidence-visual__item:nth-child(2) .evidence-visual__meter::after { animation-delay: .35s; }
.evidence-visual__item:nth-child(3) .evidence-visual__meter::after { animation-delay: .7s; }

.verdict-visual {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin: 30px 0;
  padding: 42px 14px 14px;
  border: 2px solid var(--ink);
  background: var(--paper-2);
}
.verdict-visual__pointer {
  position: absolute;
  top: 10px;
  right: calc(16.666% - 10px);
  width: 20px;
  height: 20px;
  border: 2px solid var(--ink);
  border-radius: 50%;
  background: var(--paper);
  animation: verdict-route 6s steps(2, end) infinite;
}
.verdict-visual__option { min-height: 76px; display: grid; place-items: center; border: 2px solid var(--ink); font-family: "Alexandria", sans-serif; font-weight: 900; }
.verdict-visual__option--build { background: var(--yellow); }
.verdict-visual__option--change { background: var(--pink); }
.verdict-visual__option--stop { background: var(--orange); }

.tool-box { margin: 64px 0 54px; padding: 28px; background: var(--ink); color: var(--paper); }
.tool-box__label { display: inline-block; margin-bottom: 12px; padding: 3px 8px; background: var(--orange); color: var(--ink); font-family: "IBM Plex Sans Arabic", sans-serif; font-size: 12px; font-weight: 700; }
.tool-box h2 { margin-bottom: 9px; color: var(--paper); font-size: 28px; }
.tool-box p { margin-bottom: 20px; color: var(--paper-2); }
.outline-button, .solid-button {
  min-height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 11px 18px;
  border: 2px solid;
  font-family: "Alexandria", sans-serif;
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
}
.outline-button { border-color: var(--paper); color: var(--paper); }
.outline-button:hover { background: var(--paper); color: var(--ink); }
.solid-button { border-color: var(--ink); background: var(--ink); color: var(--paper); }

.faq-list { border-top: 1px solid var(--line); }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-question {
  width: 100%;
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 0;
  border: 0;
  background: transparent;
  color: var(--ink);
  font-family: "Alexandria", sans-serif;
  font-size: 18px;
  font-weight: 700;
  text-align: right;
  cursor: pointer;
}
.faq-question::after { content: "+"; width: 34px; height: 34px; display: grid; flex: 0 0 auto; place-items: center; border: 2px solid var(--ink); border-radius: 50%; }
.faq-question[aria-expanded="true"]::after { content: "−"; background: var(--yellow); }
.faq-answer { padding: 0 0 22px; color: var(--ink-2); }
.faq-answer p { margin: 0; }
.author-box { display: flex; gap: 15px; align-items: center; margin-top: 54px; padding: 20px; border: 1px solid var(--line); }
.author-box img { width: 56px; height: 56px; flex: 0 0 auto; border: 2px solid var(--ink); border-radius: 50%; object-fit: cover; }
.author-box strong { display: block; font-family: "Alexandria", sans-serif; }
.author-box p { margin: 2px 0; color: var(--ink-2); font-size: 15px; line-height: 1.6; }
.author-box a { font-size: 14px; font-weight: 700; }
.related { padding-block: 70px; border-top: 1px solid var(--line); background: var(--paper-2); }
.related h2 { margin-bottom: 22px; font-size: 30px; }
.related-grid { display: grid; gap: 12px; }
.related-card { padding: 20px; border: 1px solid var(--line); background: var(--paper); }
.related-card span { color: var(--ink-3); font-family: "IBM Plex Sans Arabic", sans-serif; font-size: 12px; }
.related-card h3 { margin: 8px 0 0; font-size: 19px; }
.related-card a { text-decoration: none; }
.article-end-cta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }

.blog-footer { padding-block: 48px; border-top: 2px solid var(--ink); background: var(--ink); color: var(--paper); }
.blog-footer__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; }
.blog-footer p { margin: 0; color: var(--paper-2); font-size: 14px; }
.blog-footer a { min-height: 48px; display: inline-flex; align-items: center; padding: 8px; font-size: 14px; font-weight: 700; text-decoration: none; }

.canvas-page { background: var(--paper-2); }
.canvas-header { padding-block: 48px 32px; }
.canvas-header h1 { margin-bottom: 10px; font-size: clamp(38px, 10vw, 58px); }
.canvas-header p { max-width: 720px; margin: 0; color: var(--ink-2); }
.canvas-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.canvas-sheet { margin-bottom: 70px; padding: 24px; border: 2px solid var(--ink); background: var(--paper); }
.canvas-grid { display: grid; gap: 12px; }
.canvas-cell { min-height: 160px; padding: 16px; border: 1px solid var(--line); }
.canvas-cell__head { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.canvas-cell__number { width: 34px; height: 34px; display: grid; place-items: center; background: var(--yellow); font-family: "IBM Plex Sans Arabic", sans-serif; font-weight: 700; }
.canvas-cell h2 { margin: 0; font-size: 20px; }
.canvas-lines {
  min-height: 80px;
  padding: 10px 2px;
  border-block: 1px dashed var(--line);
  color: var(--ink-2);
  outline: none;
  white-space: pre-wrap;
}
.canvas-lines:empty::before { content: attr(data-placeholder); color: var(--ink-3); }
.canvas-lines:focus { border-color: var(--orange); background: var(--yellow-tint); }
.canvas-note { margin: 14px 0 0; color: var(--ink-3); font-family: "IBM Plex Sans Arabic", sans-serif; font-size: 13px; }
.canvas-verdict { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.canvas-verdict span { min-height: 58px; display: grid; place-items: center; border: 1px solid var(--ink); font-family: "Alexandria", sans-serif; font-weight: 800; }
.canvas-verdict span:nth-child(1) { background: var(--yellow); }
.canvas-verdict span:nth-child(2) { background: var(--pink); }
.canvas-verdict span:nth-child(3) { background: var(--orange); }

@media (min-width: 760px) {
  .blog-nav__links[hidden] { display: flex !important; }
  .article-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .related-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .canvas-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .canvas-cell--wide { grid-column: 1 / -1; }
}

@media (max-width: 759px) {
  .article-progress { display: block; }
  .article-visual { min-height: 260px; margin-inline: -4px; }
  .idea-radar__ring--one { width: 210px; height: 210px; }
  .idea-radar__ring--two { width: 150px; height: 150px; }
  .idea-radar__ring--three { width: 90px; height: 90px; }
  .idea-radar__sweep { width: 102px; }
  .article-visual__label { top: 12px; right: 12px; max-width: calc(100% - 24px); line-height: 1.5; }
  .validation-route__track { right: 5%; bottom: 30px; left: 5%; grid-template-columns: repeat(4, 1fr); gap: 5px; }
  .validation-route__track::before { display: none; }
  .validation-route__track > span:not(.validation-route__marker) { min-height: 44px; font-size: 9px; }
  .validation-route__marker { top: -14px; right: 3%; animation-name: route-marker-mobile; }
  .smoke-test-flow__offer { top: 74px; right: 5%; width: 112px; height: 112px; padding: 10px; }
  .smoke-test-flow__offer::before { margin-bottom: 10px; }
  .smoke-test-flow__offer span { margin-bottom: 9px; font-size: 12px; }
  .smoke-test-flow__step { top: auto; bottom: 27px; min-width: 58px; padding: 5px; font-size: 10px; }
  .smoke-test-flow__step--visit { right: 6%; }
  .smoke-test-flow__step--click { right: calc(50% - 29px); }
  .smoke-test-flow__step--book { right: auto; left: 6%; }
  .smoke-test-flow__arrow { display: none; }
  .smoke-test-flow__timer { top: 98px; right: auto; bottom: auto; left: 14%; font-size: 17px; }
  .comment-miner__feed { top: 72px; right: 4%; width: 48%; gap: 8px; }
  .comment-miner__feed span { padding: 7px 9px; font-size: 9px; }
  .comment-miner__cursor { top: 95px; right: 36%; width: 48px; }
  .comment-miner__pattern { top: 83px; left: 4%; width: 40%; padding: 10px; }
  .comment-miner__pattern strong { font-size: 15px; }
  .comment-miner__pattern span { font-size: 9px; }
  .payment-scale__beam { top: 110px; right: 8%; left: 8%; }
  .payment-scale__pan { width: 94px; min-height: 50px; font-size: 11px; }
  .payment-scale__tokens { left: 5%; bottom: 22px; }
  .payment-scale__tokens span { padding: 3px 5px; font-size: 9px; }
  .launch-pipeline__line { top: 125px; right: 3%; left: 3%; gap: 4px; }
  .launch-pipeline__line span { min-height: 45px; font-size: 9px; }
  .launch-pipeline__diagnosis { top: 76px; right: calc(50% - 45px); font-size: 9px; }
  .license-checker__document { top: 74px; right: 5%; width: 142px; min-height: 156px; padding: 13px; }
  .license-checker__checks { top: 83px; left: 5%; width: 142px; gap: 8px; }
  .license-checker__checks span { padding: 6px 8px; font-size: 10px; }
  .license-checker__checks b { width: 23px; height: 23px; }
  .value-pricer__meter { top: 98px; right: 5%; left: 5%; grid-template-columns: 68px 1fr 76px; gap: 7px; }
  .value-pricer__meter span { font-size: 9px; }
  .value-pricer__price { bottom: 54px; }
  .value-pricer__pages { right: 5%; bottom: 20px; }
  .idea-filter__wall { top: 74px; right: 4%; width: 45%; gap: 4px; }
  .idea-filter__funnel { top: 92px; right: 52%; width: 23%; }
  .idea-filter__funnel span { padding-inline: 5px; font-size: 8px; }
  .idea-filter__output { top: 140px; left: 3%; width: 23%; font-size: 9px; }
  .format-comparison__small { top: 92px; right: 5%; width: 125px; padding: 15px 9px; }
  .format-comparison__small strong { font-size: 14px; }
  .format-comparison__course { top: 80px; left: 5%; width: 130px; }
  .format-comparison__slider { right: 9%; bottom: 20px; left: 9%; }
  .prompt-comparison { gap: 6px; padding: 69px 3% 20px; }
  .prompt-comparison__panel { padding: 8px; }
  .prompt-comparison__panel p { padding: 5px; font-size: 9px; }
  .prompt-comparison__panel span { min-height: 72px; padding: 6px; font-size: 9px; }
  .content-editor__stack { top: 69px; right: 4%; width: 130px; }
  .content-editor__stack span { padding: 4px 6px; font-size: 9px; }
  .content-editor__path { top: 102px; left: 3%; width: 52%; }
  .content-editor__path span { min-height: 42px; font-size: 8px; }
  .content-editor__note { left: 8%; bottom: 21px; }
  .command-flow__rail { top: 94px; right: 3%; left: 3%; grid-template-columns: 1fr 30px 1fr 30px 1fr 30px; }
  .command-flow__rail span { min-height: 64px; font-size: 10px; }
  .command-flow__rail i { min-height: 36px; font-size: 7px; writing-mode: vertical-rl; }
  .command-flow__output { bottom: 25px; }
  .evidence-visual { grid-template-columns: 1fr; padding: 12px; }
  .evidence-visual__item { min-height: 100px; }
  .verdict-visual { padding-inline: 8px; }
  .verdict-visual__option { min-height: 64px; font-size: 15px; }
  .blog-nav { position: sticky; top: 0; }
  .blog-nav__toggle { display: block; }
  .blog-nav__links {
    position: absolute;
    top: 70px;
    right: 0;
    left: 0;
    display: grid;
    gap: 0;
    padding: 10px 16px 16px;
    border-bottom: 2px solid var(--ink);
    background: var(--paper);
  }
  .blog-nav__links a { min-height: 52px; border-bottom: 1px solid var(--line); }
  .blog-nav__links[hidden] { display: none; }
  .blog-hero { min-height: 420px; padding-block: 70px 54px; }
  .radar-arcs { top: -185px; left: -260px; }
  .blog-catalog { padding-block: 52px 76px; }
  .pillar-filters {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 34px;
  }
  .pillar-filter {
    width: 100%;
    min-width: 0;
    padding-inline: 8px;
    line-height: 1.45;
    text-wrap: balance;
  }
  .article-card { padding: 20px; overflow-wrap: anywhere; }
  .article-card h3 { font-size: clamp(20px, 5.6vw, 22px); }
  .article-card__meta { display: block; line-height: 1.7; }
  .article-header { padding-block: 34px 30px; }
  .article-main { padding-block: 28px 68px; }
  .direct-answer { margin-inline: -4px; padding: 20px; font-size: 19px; }
  .step { grid-template-columns: 52px minmax(0, 1fr); }
  .step__number { font-size: 52px; }
  .tool-box { margin-inline: -4px; padding: 24px 20px; }
  .outline-button, .solid-button { width: 100%; }
  .author-box { align-items: flex-start; }
  .canvas-sheet { padding: 14px; }
}

@keyframes catalog-radar-drift {
  0% { transform: rotate(0deg) scale(1); }
  50% { transform: rotate(7deg) scale(1.025); }
  100% { transform: rotate(0deg) scale(1); }
}
@keyframes catalog-radar-scan {
  0% { transform: rotate(42deg); }
  100% { transform: rotate(62deg); }
}
@keyframes catalog-label-tilt {
  0%, 100% { transform: rotate(0); }
  50% { transform: rotate(-1.5deg) translateY(-2px); }
}
@keyframes catalog-card-enter {
  from { opacity: 0; transform: translateY(20px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes article-scan {
  to { transform: rotate(360deg); }
}
@keyframes article-float {
  0%, 100% { translate: 50% -50%; rotate: -2deg; }
  50% { translate: 50% calc(-50% - 8px); rotate: 2deg; }
}
@keyframes article-pop {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}
@keyframes route-marker {
  to { right: calc(98% - 14px); }
}
@keyframes route-marker-mobile {
  0%, 45% { right: 3%; top: -14px; }
  50%, 100% { right: 76%; top: calc(50% + 8px); }
}
@keyframes flow-pulse {
  0%, 100% { translate: 0 0; }
  50% { translate: 0 -7px; }
}
@keyframes arrow-nudge {
  0%, 100% { translate: 0 0; }
  50% { translate: -7px 0; }
}
@keyframes mine-comments {
  0% { top: 99px; }
  34% { top: 143px; }
  67%, 100% { top: 187px; }
}
@keyframes scale-settle {
  0%, 100% { rotate: -4deg; }
  50% { rotate: 3deg; }
}
@keyframes token-drop {
  0%, 100% { translate: 0 0; }
  50% { translate: 0 -8px; }
}
@keyframes pipeline-inspect {
  to { right: calc(97% - 18px); }
}
@keyframes stamp-license {
  0%, 65%, 100% { scale: 1; }
  75% { scale: 1.22; }
}
@keyframes price-calibrate {
  0%, 100% { right: 15%; }
  50% { right: calc(85% - 34px); }
}
@keyframes filter-output {
  0%, 100% { translate: 0 0; }
  50% { translate: -8px 0; }
}
@keyframes format-slide {
  0%, 100% { right: 8%; }
  50% { right: calc(92% - 21px); }
}
@keyframes generic-shift {
  50% { translate: 3px 0; }
}
@keyframes remove-block {
  0%, 45% { opacity: 1; translate: 0 0; }
  60%, 100% { opacity: .18; translate: 34px 0; }
}
@keyframes gate-check {
  50% { background: var(--yellow); }
}
@keyframes evidence-grow {
  to { transform: scaleX(1); }
}
@keyframes verdict-route {
  0% { right: calc(16.666% - 10px); background: var(--yellow); }
  50% { right: calc(50% - 10px); background: var(--pink); }
  100% { right: calc(83.333% - 10px); background: var(--orange); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
  .blog-index-page .radar-arcs,
  .blog-index-page .radar-line,
  .blog-index-page .eyebrow,
  .blog-index-page .article-card { animation: none !important; }
  .blog-index-page.motion-ready [data-scroll-reveal] { opacity: 1; transform: none; }
}

@media print {
  .blog-nav, .canvas-actions, .blog-footer, .canvas-note, .article-visual, .evidence-visual, .verdict-visual { display: none !important; }
  body { background: #fff; font-size: 12pt; }
  .canvas-header { padding-block: 12mm 6mm; }
  .canvas-sheet { margin: 0; padding: 8mm; border-color: #000; }
  .canvas-grid { grid-template-columns: repeat(2, 1fr); gap: 4mm; }
  .canvas-cell { min-height: 54mm; break-inside: avoid; }
  .canvas-cell--wide { grid-column: 1 / -1; min-height: 38mm; }
}