.network-hero {
  padding-block: clamp(27px, 3.1vw, 48px) clamp(38px, 5vw, 67px);
}

.network-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(230px, 25%);
  align-items: end;
  gap: clamp(22px, 3vw, 48px);
  margin-bottom: 24px;
}

.network-intro .eyebrow { margin-bottom: 12px; }
.network-intro h1 {
  font-size: clamp(61px, 6.35vw, 102px);
  letter-spacing: -.063em;
  line-height: 1.02;
}
.network-intro h1 em { color: var(--orange); }
.network-promise {
  margin-top: 10px;
  font-size: clamp(18px, 1.6vw, 23px);
  color: var(--ink);
  letter-spacing: -.025em;
  line-height: 1.35;
}
.network-intro-guide p { font-size: 17px; line-height: 1.55; }
.network-intro-guide .text-link { margin-top: 3px; gap: 10px; padding-block: 6px; }
.network-intro-guide .text-link .icon { width: 17px; height: 17px; }

.poster-series {
  --poster-border: #dedfd4;
  --poster-ink: #223026;
  --flow-play-state: running;
  --gpu-fill: 50%;
  --cpu-fill: 37.5%;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  border: 1px solid var(--poster-border);
  border-radius: 18px;
  background: #f7f6f0;
  overflow: clip;
}
.poster-series [hidden] { display: none; }
.poster-tabs {
  display: flex;
  flex-direction: column;
  width: clamp(137px, 13vw, 178px);
  gap: 8px;
  padding: 17px 11px;
  background: #f0f1e9;
  border-right: 1px solid var(--poster-border);
}
.poster-tabs button {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  min-height: 51px;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid transparent;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.15;
  color: #525c4e;
  text-align: left;
}
.poster-tabs button .icon, .poster-tabs button .coin-symbol { width: 21px; height: 21px; }
.poster-tabs button:hover { background: #e6e9dd; color: var(--poster-ink); }
.poster-tabs button[aria-selected="true"] { background: #25352b; color: #fffdf7; }
.poster-tabs button:focus-visible, .poster-step:focus-visible, .poster-motion:focus-visible {
  outline-offset: 2px;
}
.poster-stage {
  display: flex;
  flex-direction: column;
  grid-column: 2;
  min-width: 0;
}
.coin-symbol { display: inline-block; flex: none; object-fit: contain; vertical-align: middle; }
.poster-controls {
  min-height: 41px;
  padding: 7px clamp(13px, 2.7vw, 38px) 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.poster-context {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #525a4d;
  font-size: 13px;
  line-height: 1.2;
}
.poster-context .status-dot { width: 6px; height: 6px; }
.poster-motion, .poster-step {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 32px;
  padding: 4px 9px;
  border-radius: 6px;
  font-size: 13px;
  color: #475142;
}
.poster-motion:hover, .poster-step:hover:not(:disabled) { background: #edeee5; }
.poster-motion .icon, .poster-step .icon { width: 16px; height: 16px; }
.poster-pagination {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 14px;
  padding: 6px clamp(13px, 2.7vw, 38px);
  background: #f9f8f4;
  border-top: 1px solid var(--poster-border);
}
.poster-position { color: #5a6355; font-size: 13px; font-variant-numeric: tabular-nums; }
.poster-step { min-height: 40px; font-size: 14px; justify-self: start; }
.poster-step:last-child { justify-self: end; }
.poster-step:first-child .icon { transform: rotate(180deg); }
.poster-step:disabled { opacity: .48; cursor: default; }

.story-poster {
  --poster-accent: #45634a;
  --poster-wash: #eaf0e3;
  background: radial-gradient(ellipse at 4% 55%, var(--poster-wash), transparent 74%), #f7f6f0;
  flex: 1;
  padding: 11px clamp(13px, 2.7vw, 38px) clamp(19px, 2.3vw, 29px);
  scroll-margin-top: 100px;
}
.story-poster + .story-poster { border-top: 1px solid var(--poster-border); }
.story-poster[role="tabpanel"] { border-top: 0; }
.story-poster:focus-visible { outline-offset: -3px; }
.media-poster { --poster-accent: #3c6372; --poster-wash: #e6edf0; }
.skill-poster { --poster-accent: #72538a; --poster-wash: #ede6f1; }
.bids-poster { --poster-accent: #915436; --poster-wash: #f4e9de; }
.coin-poster { --poster-accent: #775b21; --poster-wash: #f2ead5; }
.poster-heading { margin-bottom: clamp(14px, 1.9vw, 23px); }
.poster-heading h2 {
  color: var(--poster-ink);
  font-size: clamp(39px, 4.1vw, 58px);
  letter-spacing: -.053em;
  line-height: 1.02;
}
.poster-heading h2 em { color: var(--poster-accent); }
.poster-card {
  min-width: 0;
  border: 1px solid var(--poster-border);
  border-radius: 12px;
  background: #fffefb;
  box-shadow: 0 8px 24px -18px #323d3055;
  padding: clamp(13px, 1.6vw, 21px);
}
.story-poster h3 {
  color: var(--poster-ink);
  font-size: 20px;
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: -.028em;
}
.story-poster h3 .icon { width: 20px; height: 20px; color: var(--poster-accent); margin-right: 6px; }
.story-poster dl, .story-poster dd { margin: 0; }
.story-icon {
  display: grid;
  place-items: center;
  width: 37px;
  height: 37px;
  flex: none;
  border-radius: 8px;
  color: var(--poster-accent);
  background: var(--poster-wash);
}
.story-icon .icon { width: 21px; height: 21px; }

.resource-story, .skill-story, .coin-story {
  display: grid;
  grid-template-columns: minmax(0, 1.23fr) minmax(0, 1fr);
  gap: clamp(12px, 1.8vw, 24px);
  align-items: stretch;
}
.resource-topology {
  margin: 0;
  border: 1px solid #d9e1d4;
  border-radius: 12px;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 50% 48%, #fff4e2, transparent 59%),
    radial-gradient(circle, #50624426 .8px, transparent 1px) 0 0 / 14px 14px,
    #eef2e9;
}
.topology-grid {
  display: grid;
  grid-template-columns: repeat(30, minmax(0, 1fr));
  grid-template-rows: 30% 35% 35%;
  align-items: center;
  min-height: 321px;
  position: relative;
  isolation: isolate;
}
.topology-wires {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.wire-green { color: #55834b; --stream-speed: 3.8s; }
.wire-purple { color: #896096; --stream-speed: 4.5s; }
.wire-blue { color: #507890; --stream-speed: 4.2s; }
.wire-gold { color: #ad7831; --stream-speed: 4.1s; }
.poster-line { stroke: currentColor; stroke-width: 1.5; opacity: .68; vector-effect: non-scaling-stroke; }
.poster-stream {
  display: none;
  stroke: currentColor;
  stroke-width: 3.4;
  stroke-linecap: round;
  stroke-dasharray: 10 90;
}
.poster-series:is([data-motion="playing"], [data-motion="paused"]) .poster-stream {
  display: inline;
  animation: poster-stream var(--stream-speed) linear -1.5s infinite;
  animation-play-state: var(--flow-play-state);
}
.poster-series:is([data-motion="paused"], [data-out-of-view]) { --flow-play-state: paused; }
@keyframes poster-stream { to { stroke-dashoffset: -100; } }
.topology-node, .topology-hub {
  justify-self: center;
  position: relative;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 4px;
  text-align: center;
  line-height: 1.21;
}
.topology-node {
  width: 100%;
  padding: 2px 4px;
  color: #263c2a;
}
.topology-node .icon { width: 35px; height: 35px; color: #476f4d; }
.topology-node strong { font-size: 15px; font-weight: 500; }
.topology-node span { font-size: 13px; color: #51614f; }
.member-mina { grid-area: 1 / 1 / 2 / 11; }
.member-leo { grid-area: 1 / 11 / 2 / 21; }
.member-noor { grid-area: 1 / 21 / 2 / 31; }
.cloud-meddioo { grid-area: 3 / 4 / 4 / 16; }
.cloud-partner { grid-area: 3 / 16 / 4 / 28; }
.member-noor .icon { color: #775e8d; }
.cloud-meddioo .icon, .cloud-partner .icon { color: #476c86; width: 43px; height: 43px; }
.topology-hub {
  grid-area: 2 / 9 / 3 / 23;
  gap: 6px;
  padding-top: 4px;
}
.topology-hub img { width: 85px; height: 85px; }
.topology-hub strong { font-size: 15px; font-weight: 500; white-space: nowrap; }
.usage-card h3 { margin-bottom: 10px; }
.usage-counters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.usage-counters > div {
  background: #eef2ea;
  border-radius: 6px;
  padding: 7px 9px;
}
.usage-counters dt, .usage-control label { font-size: 14px; color: #495849; line-height: 1.27; }
.usage-counters dd { color: #314333; margin-top: 1px; line-height: 1.2; font-variant-numeric: tabular-nums; }
.usage-counters strong { font-size: 25px; font-weight: 500; }
.meter {
  display: block;
  height: 6px;
  margin-top: 6px;
  border-radius: 10px;
  background: #e0e7dc;
  overflow: hidden;
}
.meter > span {
  position: relative;
  display: block;
  width: var(--fill, 0%);
  height: 100%;
  background: var(--meter-color, #648256);
  border-radius: inherit;
  overflow: hidden;
}
.gpu-meter { --fill: var(--gpu-fill); }
.cpu-meter { --fill: var(--cpu-fill); --meter-color: #6587a0; }
.poster-series[data-motion="playing"] .meter > span { transition: width .44s cubic-bezier(.2,.62,.4,1); }
.poster-series:is([data-motion="playing"], [data-motion="paused"]) .meter > span::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 38%, #ffffff65 52%, transparent 65%);
  animation: meter-light 3.2s linear -1.2s infinite;
  animation-play-state: var(--flow-play-state);
}
@keyframes meter-light {
  0%, 50% { transform: translateX(-100%); }
  90%, 100% { transform: translateX(100%); }
}
.usage-control { display: flex; align-items: center; gap: 8px 13px; margin-top: 7px; flex-wrap: wrap; }
.usage-control input { flex: 1; min-width: 85px; margin: 0; height: 27px; accent-color: #537748; cursor: pointer; }
.coin-ledger { color: #29352a; font-variant-numeric: tabular-nums; }
.coin-ledger h4 {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 8px 0 3px;
  font-size: 15px;
  font-weight: 500;
  color: #664d1f;
}
.coin-ledger h4 .icon { width: 17px; height: 17px; }
.coin-ledger dl > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 4px 0;
  border-bottom: 1px solid #e9ebe3;
  font-size: 15px;
  line-height: 1.35;
}
.coin-ledger dd { flex: none; }
.coin-credit { color: #3c693e; }
.coin-ledger dl > .coin-ledger-total {
  margin-top: 6px;
  padding: 7px 9px;
  border: 0;
  border-radius: 6px;
  background: #f5ead2;
  color: #60471a;
  font-weight: 500;
}
.coin-ledger-total strong { font-size: 22px; line-height: 1; }

.media-path {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding: 0;
  margin: 0 0 12px;
  color: #345360;
  list-style: none;
}
.media-path li {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  position: relative;
  min-height: 39px;
  padding: 5px 7px;
  border-radius: 6px;
  background: #e8eff0;
  font-size: 14px;
  line-height: 1.18;
  text-align: center;
}
.media-path li:not(:last-child)::after {
  content: '';
  position: absolute;
  right: -11px;
  width: 10px;
  height: 1px;
  background: #829fa9;
}
.media-path .icon { width: 19px; height: 19px; }
.media-search-field { display: flex; gap: 8px; margin-bottom: 12px; }
.media-search-field input {
  flex: 1;
  min-width: 0;
  min-height: 42px;
  border: 1px solid #cfd9dc;
  border-radius: 7px;
  padding: 8px 12px;
  color: var(--poster-ink);
  background: #fffefb;
  font-size: 16px;
}
.poster-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 40px;
  padding: 7px 10px;
  border: 1px solid #d4dddc;
  border-radius: 6px;
  color: #223f4a;
  background: #f3f8f8;
  font-size: 14px;
  line-height: 1.3;
  font-weight: 500;
}
.poster-action:hover { background: #e4eef1; }
.poster-action .icon { width: 16px; height: 16px; }
.media-search-field .poster-action { background: #274451; color: white; border-color: transparent; }
.media-search-field .poster-action:hover { background: #365c6d; }
.media-result-grid, .bids-story { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(11px, 1.8vw, 24px); }
.media-result { padding: 0; overflow: hidden; }
.media-result[data-request-selected] { border-color: #5e8791; box-shadow: 0 0 0 1px #5e8791; }
.media-thumbnail { position: relative; overflow: hidden; height: clamp(123px, 12vw, 174px); background: #d6dfda; }
.media-thumbnail img { width: 100%; height: 100%; object-fit: cover; }
.media-thumbnail::after {
  content: '';
  position: absolute;
  inset: 0;
  transform: translateY(-100%);
  background: linear-gradient(180deg, transparent 77%, #e2faff35 94%, #e2faff9c 100%);
  pointer-events: none;
}
.poster-series[data-motion="playing"] .media-catalogue.is-scanning .media-thumbnail::after { animation: thumbnail-scan .62s ease-out; }
@keyframes thumbnail-scan { to { transform: translateY(100%); } }
.media-thumbnail > span {
  position: absolute;
  right: 8px;
  bottom: 7px;
  padding: 2px 6px;
  border-radius: 5px;
  background: #162323e8;
  color: #fff;
  font-size: 13px;
}
.media-result-body { padding: 12px clamp(10px, 1.4vw, 18px); }
.media-result-title, .skill-listing-heading { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; }
.media-result-title h3 { margin-right: auto; }
.offer-price {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 7px;
  background: #f5ebd4;
  color: #674c1c;
  border-radius: 5px;
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
}
.offer-price .icon { width: 15px; height: 15px; }
.offer-free { background: #e9f1e6; color: #305d37; }
.skill-listing-heading p {
  margin: 5px 0 0;
  color: #535d53;
  font-size: 15px;
  line-height: 1.38;
}
.media-metadata {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  gap: 4px 6px;
  padding: 0;
  margin: 9px 0 10px;
}
.media-metadata li { padding: 2px 6px; border-radius: 4px; background: #eef1ee; color: #4f5c51; font-size: 13px; }
.request-explanation, .sample-empty { margin-top: 10px; color: #49606a; font-size: 15px; line-height: 1.45; }
.sample-empty { padding: 15px; border-radius: 8px; background: #f5f9f9; }

.skill-workflow {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);
  align-items: stretch;
  gap: 6px;
  list-style: none;
  padding: 0;
  margin: 16px 0 0;
}
.skill-workflow li:not(.workflow-arrow) {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  min-height: 104px;
  padding: 10px;
  border: 1px solid #e7dceb;
  border-radius: 8px;
  background: #f7f2f8;
  color: #513d60;
  line-height: 1.25;
}
.skill-workflow li strong { font-size: 15px; font-weight: 500; }
.skill-workflow .icon { width: 23px; height: 23px; color: var(--poster-accent); }
.workflow-arrow { align-self: center; }
.workflow-arrow .visual-connector { width: 23px; }
.visual-connector {
  --connector-color: #8c6da1;
  display: block;
  height: 8px;
  position: relative;
  color: var(--connector-color);
}
.visual-connector::before {
  content: '';
  position: absolute;
  inset: 50% 1px auto 0;
  height: 1px;
  opacity: .74;
  background: currentColor;
}
.visual-connector::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 1px;
  width: 6px;
  height: 6px;
  border-top: 1px solid;
  border-right: 1px solid;
  transform: translateY(-44%) rotate(45deg);
}
.visual-connector.reverse { transform: rotate(180deg); }
.visual-connector > span {
  display: none;
  position: absolute;
  width: 6px;
  height: 6px;
  top: 1px;
  left: 0;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 7px currentColor;
}
.poster-series:is([data-motion="playing"], [data-motion="paused"]) .visual-connector > span {
  display: block;
  animation: arrow-travel 2.7s linear -.7s infinite;
  animation-play-state: var(--flow-play-state);
}
@keyframes arrow-travel {
  0% { left: 0; opacity: 0; }
  17%, 83% { opacity: 1; }
  100% { left: calc(100% - 5px); opacity: 0; }
}
.skill-trade-diagram {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 17px 0 5px;
}
.exchange-person, .exchange-lanes { display: grid; justify-items: center; gap: 4px; }
.exchange-person .icon { width: 37px; height: 37px; margin-bottom: 4px; color: #715581; }
.exchange-person strong { font-size: 16px; font-weight: 500; }
.exchange-person span { color: #60536b; font-size: 13px; }
.exchange-lanes { gap: 9px; }
.exchange-lane { width: 100%; display: grid; gap: 3px; }
.exchange-lane > span:not(.visual-connector) {
  display: flex;
  gap: 4px;
  justify-content: center;
  align-items: center;
  white-space: nowrap;
  color: #504159;
  font-size: 13px;
  line-height: 1.25;
}
.exchange-lane .icon { width: 15px; height: 15px; }
.coin-lane .visual-connector { --connector-color: #ac7a2e; }
.coin-lane > span:not(.visual-connector) { color: #74501b; }

.bid-card-heading { display: flex; align-items: center; gap: 9px; }
.bid-subject, .bid-outcome { display: flex; align-items: center; gap: 7px; color: #635747; }
.bid-subject { margin-top: 10px; font-size: 15px; }
.bid-subject .icon, .bid-outcome .icon { width: 16px; height: 16px; }
.bid-card .bid-rows { margin-top: 12px; }
.bid-rows > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 5px 8px;
  padding: 6px 0;
  font-size: 15px;
  line-height: 1.26;
}
.bid-rows dt span { display: block; color: #5b6556; font-size: 13px; margin-top: 2px; }
.bid-rows dd { font-variant-numeric: tabular-nums; }
.bid-rows .meter { grid-column: 1 / -1; margin-top: 0; --meter-color: #ab8162; }
.bid-rows .bid-leading { color: #2f613d; font-weight: 500; }
.bid-leading .meter { --meter-color: #5f845a; }
.bid-outcome { font-size: 14px; margin-top: 9px; }
.bid-outcome .icon { color: #55714e; }
.poster-series[data-motion="playing"] .bids-poster .meter > span { animation: bid-bar-in .58s ease-out backwards; }
.poster-series[data-motion="playing"] .bids-poster .meter > span::after { animation-delay: -.7s; }
@keyframes bid-bar-in { from { width: 0; } }

.coin-map {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: 1fr 1fr;
  align-items: center;
  position: relative;
  isolation: isolate;
  min-height: 289px;
  margin: 0;
  padding: 12px 9px;
  border-radius: 12px;
  background: radial-gradient(ellipse at 50% 50%, #fff1c4 2%, #f8efd9 55%, #f7f5ec);
}
.coin-map-wires { position: absolute; width: 100%; height: 100%; inset: 0; z-index: -1; }
.coin-map-node, .coin-map-center { display: grid; justify-items: center; text-align: center; line-height: 1.25; gap: 5px; }
.coin-map-node { padding: 3px 5px; font-size: 14px; color: #3a402a; }
.coin-map-node strong { font-weight: 500; }
.coin-map-node > span { font-size: 18px; font-weight: 500; font-variant-numeric: tabular-nums; }
.coin-map-node .icon { width: 25px; height: 25px; color: #866128; }
.coin-map-earn .icon { color: #608153; }
.coin-map-earn { grid-area: 1 / 1; }
.coin-map-compute { grid-area: 1 / 3; }
.coin-map-media { grid-area: 2 / 1; }
.coin-map-skill { grid-area: 2 / 3; }
.coin-map-center { grid-area: 1 / 2 / 3 / 3; color: #705322; font-size: 14px; font-weight: 500; }
.coin-face { width: min(100%, 118px); height: auto; filter: drop-shadow(3px 7px 8px #794a2835); }
.poster-series:is([data-motion="playing"], [data-motion="paused"]) .coin-face {
  animation: coin-rock 4.5s ease-in-out infinite;
  animation-play-state: var(--flow-play-state);
}
@keyframes coin-rock {
  0%, 100% { transform: translateY(0) rotate(-3deg); }
  50% { transform: translateY(-4px) rotate(4deg); }
}
.final-wallet h3 .coin-symbol { margin-right: 5px; }
.final-wallet h3 { margin-bottom: 8px; }
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

@media (max-height: 820px) and (min-width: 981px) {
  .network-hero { padding-top: 24px; }
  .network-intro { margin-bottom: 18px; }
  .network-intro h1 { font-size: clamp(60px, 6.1vw, 96px); }
}
@media (max-width: 980px) {
  .network-intro { grid-template-columns: minmax(0,1fr) minmax(180px,26%); gap: 20px; }
  .network-intro h1 { font-size: clamp(47px, 7.2vw, 75px); }
  .network-intro-guide p { font-size: 16px; }
  .poster-tabs { padding-inline: 8px; }
  .poster-tabs button { gap: 6px; font-size: 14px; padding-inline: 7px; }
  .poster-tabs button .icon, .poster-tabs button .coin-symbol { width: 19px; height: 19px; }
}
@media (max-width: 780px) {
  .network-intro { grid-template-columns: minmax(0,1fr); gap: 11px; }
  .network-intro h1 { font-size: clamp(42px, 8.8vw, 72px); }
  .network-intro-guide p { max-width: 52ch; }
  .poster-tabs { width: 104px; }
  .poster-tabs button { font-size: 13px; }
  .resource-story, .skill-story, .coin-story { grid-template-columns: minmax(0, 1fr); }
  .topology-grid { min-height: 285px; }
}
@media (max-width: 580px) {
  .network-hero { padding-top: 27px; }
  .network-intro { gap: 10px; margin-bottom: 16px; }
  .network-intro .eyebrow { font-size: 10px; margin-bottom: 10px; }
  .network-intro h1 { font-size: clamp(37px, 10.4vw, 60px); }
  .network-intro h1 em { display: block; }
  .network-promise { font-size: 18px; }
  .network-intro-guide .text-link { min-height: 38px; margin-top: 0; }
  .poster-series { border-radius: 12px; }
  .poster-tabs { width: 63px; gap: 7px; padding: 10px 4px; }
  .poster-tabs button {
    gap: 4px;
    flex-direction: column;
    justify-content: center;
    min-height: 55px;
    padding: 5px 2px;
    font-size: 11px;
    letter-spacing: -.018em;
    text-align: center;
  }
  .poster-tabs button .icon, .poster-tabs button .coin-symbol { width: 19px; height: 19px; }
  .poster-controls { min-height: 37px; padding-top: 5px; }
  .poster-context, .poster-motion { font-size: 12px; }
  .poster-heading h2 { font-size: clamp(28px, 8.2vw, 42px); }
  .poster-controls, .story-poster, .poster-pagination { padding-inline: 10px; }
  .topology-grid { min-height: 267px; }
  .topology-node { gap: 3px; padding: 3px 2px; }
  .topology-node strong { font-size: 13px; }
  .topology-node span { font-size: 11px; }
  .topology-node .icon { width: 26px; height: 26px; }
  .cloud-meddioo .icon, .cloud-partner .icon { width: 31px; height: 31px; }
  .topology-hub { gap: 3px; }
  .topology-hub img { width: 63px; height: 63px; }
  .topology-hub strong { font-size: 13px; }
  .coin-ledger dl > div { font-size: 14px; }
  .bids-story { grid-template-columns: minmax(0,1fr); }
  .media-path { gap: 6px; }
  .media-path li { font-size: 11px; flex-direction: column; gap: 4px; }
  .media-path li:not(:last-child)::after { right: -6px; width: 6px; }
  .media-path .icon { width: 16px; height: 16px; }
  .media-thumbnail { height: 105px; }
  .media-result-title h3 { font-size: 17px; }
  .media-result-title .offer-price { font-size: 12px; }
  .media-result-body .poster-action { justify-content: space-between; width: 100%; min-height: 43px; font-size: 13px; }
  .media-search-field { gap: 5px; }
  .media-search-field input { padding-inline: 7px; }
  .skill-workflow { gap: 4px; }
  .skill-workflow li:not(.workflow-arrow) { padding: 8px 6px; min-height: 96px; }
  .skill-workflow li strong { font-size: 13px; }
  .workflow-arrow .visual-connector { width: 12px; }
  .skill-trade-diagram { gap: 7px; }
  .coin-map { min-height: 257px; padding-inline: 5px; }
  .coin-map-node { padding-inline: 3px; font-size: 12px; }
  .coin-map-center { font-size: 12px; }
}
@media (max-width: 485px) {
  .media-result-grid { grid-template-columns: minmax(0,1fr); }
  .media-thumbnail { height: 132px; }
}
@media (max-width: 370px) {
  .poster-tabs { width: 57px; }
  .poster-tabs button { font-size: 10px; }
  .poster-controls { gap: 2px; }
  .poster-motion { padding-inline: 4px; min-width: 34px; }
  .poster-motion span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .usage-counters dt, .usage-control label { font-size: 13px; }
  .media-search-field input { font-size: 15px; }
  .skill-workflow li strong { font-size: 12px; overflow-wrap: anywhere; }
  .coin-map-node { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  .poster-series .poster-stream, .poster-series .visual-connector > span { display: none !important; }
}
@media print {
  .network-hero { padding-block: 10px; }
  .network-intro { display: block; }
  .network-intro h1 { font-size: 49px; }
  .poster-series { display: block; overflow: visible; border: 0; }
  .poster-stage { display: block; }
  .poster-tabs, .poster-pagination, .poster-motion, .usage-control, .media-example-search, .poster-action, .sample-empty, .poster-series .poster-stream { display: none !important; }
  .poster-series .story-poster[hidden] { display: block; }
  .poster-series .media-result[hidden] { display: block; }
  .story-poster { break-inside: avoid; margin-bottom: 15px; border: 1px solid #ddd; }
}