/* Release B media and reading edition. Release A CSS stays byte-identical. */
.release-media { margin-top: 42px; padding: clamp(20px,3vw,34px); border: 1px solid #40657a; border-radius: 17px; background: #0b2138; color: #e9f7ff; }
.release-media-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 25px; margin-bottom: 26px; }
.release-media-heading > div { max-width: 740px; }
.release-kicker { margin: 0 0 11px; color: #87e9f1; font-size: 11px; font-weight: 800; letter-spacing: .14em; }
.release-media h3 { margin: 0 0 12px; color: #fff; font-size: clamp(25px,3vw,34px); line-height: 1.2; }
.release-media-heading p:not(.release-kicker), .release-media-note, .release-video-copy p { color: #c9dce8; font-size: 14px; line-height: 1.7; }
.release-hold { flex: none; border: 1px solid #e9ba7c; border-radius: 999px; padding: 8px 11px; color: #ffe5bc; font-size: 11px; font-weight: 800; letter-spacing: .05em; }
.release-media a { color: #98f0f6; text-decoration: underline; text-underline-offset: 3px; }
.release-slides { list-style: none; margin: 0; padding: 0; }
.release-slide { display: grid; grid-template-columns: minmax(0,430px) minmax(0,1fr); gap: clamp(20px,3vw,34px); align-items: start; padding: 0 0 28px; }
.release-slide + .release-slide { border-top: 1px solid #35516a; padding-top: 28px; }
.release-slide[hidden] { display: none; }
.release-slide-visual { touch-action: pan-y; }
.release-slide-visual img { display: block; width: 100%; height: auto; aspect-ratio: 4/5; object-fit: contain; border: 1px solid #568397; border-radius: 9px; background: #06182c; }
.release-swipe-hint { display: none; margin: 9px 0 0; color: #b9d5e3; font-size: 12px; line-height: 1.4; text-align: center; }
.release-slide-reading { min-width: 0; }
.release-slide-count { color: #8de9f1; font-size: 12px; font-weight: 800; letter-spacing: .06em; }
.release-slide h4 { margin: 9px 0 3px; font-size: 23px; line-height: 1.3; color: #fff; }
.release-slide-title-en { margin: 0 0 18px; color: #b9d5e3; font-size: 14px; }
.release-slide-copies { display: flex; flex-direction: column; gap: 15px; }
html[lang="en"] .release-slide-copies > [lang="en"] { order: -1; }
.release-slide-copies > div { border: 1px solid #365a70; border-radius: 10px; padding: 14px 17px; background: #102c45; }
.release-slide-copies h5 { margin: 0 0 8px; color: #a6ecf2; font-size: 12px; line-height: 1.5; }
.release-slide-copies ol { margin: 0; padding-left: 20px; color: #edf7fb; font-size: 13px; line-height: 1.6; }
.release-slide-copies li { padding: 2px 0; }
.release-carousel-controls { display: none; align-items: center; justify-content: center; gap: 18px; padding: 8px 0 2px; }
.release-b-ready .release-carousel-controls { display: flex; }
.release-carousel-controls button { min-height: 44px; padding: 9px 15px; border: 1px solid #86deeb; border-radius: 7px; background: #153b55; color: #f0fcff; font: inherit; font-size: 14px; cursor: pointer; }
.release-carousel-controls button:disabled { opacity: .45; cursor: default; }
.release-carousel-controls button:focus-visible, .release-media a:focus-visible { outline: 3px solid #a3f8ff; outline-offset: 3px; }
.release-carousel-controls #slide-status { min-width: 82px; text-align: center; color: #dffaff; font-size: 13px; font-variant-numeric: tabular-nums; }
.release-video-layout { display: grid; grid-template-columns: minmax(0,340px) minmax(0,1fr); gap: clamp(24px,4vw,45px); align-items: start; }
.release-video-frame video { display: block; width: 100%; max-width: 340px; aspect-ratio: 9/16; height: auto; background: #030e19; border: 1px solid #5b8aa0; border-radius: 9px; }
.release-video-copy { max-width: 500px; }
.release-video-copy p { margin: 0 0 18px; }
.release-portfolio { margin: 38px 0 0; }
.release-portfolio-links { display: flex; flex-wrap: wrap; gap: 13px; }
.release-portfolio-links a { display: inline-flex; align-items: center; min-height: 44px; padding: 10px 14px; border: 1px solid #6995a7; border-radius: 7px; background: #153b55; }
@media (max-width: 780px) {
  .release-media-heading { flex-direction: column; gap: 12px; }
  .release-slide, .release-video-layout { grid-template-columns: 1fr; }
  .release-slide-visual img { max-width: 430px; margin-inline: auto; }
  .release-swipe-hint { display: block; }
  .release-video-frame video { margin-inline: auto; }
}
@media (max-width: 480px) {
  .release-carousel-controls { gap: 8px; }
  .release-carousel-controls button { padding-inline: 9px; font-size: 12px; }
  .release-carousel-controls #slide-status { min-width: 64px; font-size: 11px; }
}

/* Standalone semantic reading pages. */
.reading-page { margin: 0; background: #f4f8fa; color: #173147; font: 16px/1.72 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.reading-page * { box-sizing: border-box; }
.reading-page .skip { position: absolute; left: -9999px; }
.reading-page .skip:focus { left: 12px; top: 12px; z-index: 10; background: white; padding: 8px; }
.reading-header { display: flex; justify-content: space-between; gap: 12px; padding: 17px max(22px,calc((100vw - 1000px)/2)); background: #071b31; color: #bde7ee; font-size: 12px; font-weight: 700; letter-spacing: .04em; }
.reading-header a { color: #c5f6ff; }
.reading-main { max-width: 1000px; margin: 0 auto; padding: 38px 22px 80px; }
.reading-main h1 { margin: 8px 0 25px; font-size: clamp(30px,4vw,43px); line-height: 1.18; }
.reading-main h2 { margin: 43px 0 13px; padding-top: 10px; border-top: 1px solid #b9cbd2; font-size: clamp(23px,2.8vw,29px); line-height: 1.25; }
.reading-main p, .reading-main li { max-width: 78ch; }
.reading-main a { color: #075e76; text-underline-offset: 3px; overflow-wrap: anywhere; }
.reading-kicker { color: #126b82; font-size: 12px; font-weight: 800; letter-spacing: .12em; }
.reading-alert { padding: 17px 20px; border-left: 5px solid #b8732c; background: #fff2df; }
.reading-table-wrap { max-width: 100%; overflow-x: auto; }
.reading-main table { width: 100%; border-collapse: collapse; background: white; font-size: 14px; line-height: 1.5; }
.reading-main th, .reading-main td { border: 1px solid #b9cbd2; padding: 10px; text-align: left; vertical-align: top; }
.reading-main thead th { background: #dcecf0; }
.reading-main code { background: #e4eff2; padding: 1px 4px; }
.reading-footer { padding: 22px; text-align: center; background: #071b31; color: #bde7ee; font-size: 12px; }
@media (max-width: 620px) { .reading-header { flex-direction: column; } .reading-main table { min-width: 600px; } }