/* One fixed glass reader with a connected tab bar and an internal scroll area. */
:root { color-scheme: light; --reader-top: clamp(260px, 38.5svh, 356px); --reader-bottom: max(20px, env(safe-area-inset-bottom)); }
html { height: 100%; overflow: hidden; scroll-padding-top: 0; overscroll-behavior: none; }
body { height: 100%; min-height: 0; overflow: hidden; overscroll-behavior: none; background: radial-gradient(ellipse at 87% 17%, #e0e8e2 0, transparent 50%), linear-gradient(140deg, #a8c1c6, #c6d7d5 45%, #a4bfc1); background-attachment: fixed; }
.site-frame { position: fixed; inset: 0; height: 100vh; height: 100dvh; min-height: 0; overflow: hidden; transform-origin: center top; }
.scene-background { display: contents; }
.masthead { height: 82px; border-bottom-color: rgba(40,77,81,.12); }
.wordmark { border-radius: 14px; box-shadow: inset 0 1px 0 rgba(255,255,255,.8), 0 8px 25px rgba(31,74,79,.06); }
.intro-replay { border: 1px solid rgba(62,99,102,.18); background: rgba(246,251,246,.43); border-radius: 30px; display: inline-flex; align-items: center; gap: 7px; padding: 8px 12px; margin-left: 20px; color: #466d70; font-size: 9px; letter-spacing: 1px; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.intro-replay > span { font-size: 19px; line-height: .6; }
.intro-replay:hover { background: rgba(255,255,249,.75); }
.hero { height: calc(var(--reader-top) - 82px); }
.portrait-stage { top: -82px; width: 63%; height: max(850px, 96vh); pointer-events: none; }
.hero-portrait { top: 0; left: -1.2vw; width: 100%; max-width: 860px; }
.hero-copy { margin-left: 54%; width: 42%; padding-top: 15px; }
.eyebrow { font-size: 12px; letter-spacing: 4px; gap: 12px; }
.tiny-line { width: 23px; }
.hero-copy h1 { font-size: 90px; line-height: 1.18; letter-spacing: 9px; margin: 8px 0 6px; }
.hero-rule { margin: 8px 0 11px; width: 67%; }
.hero-deck { font-size: 14px; line-height: 1.8; letter-spacing: 2px; }
.hero-signature { margin-top: 14px; gap: 13px; font-size: 9px; }
.hero-signature .name { font-size: 18px; }
.signature-divider { height: 23px; }
.signature-en { font-size: 6px; margin-top: 4px; }
.hero-bottom { bottom: 16px; }
.hero-bottom > span { border-radius: 8px; padding: 6px 11px; }
.explore-link { display: none; }
.hero-vertical { top: 55px; font-size: 9px; }
.reader-track { display: contents; }
.main-shell { position: absolute; top: var(--reader-top); bottom: var(--reader-bottom); left: 50%; transform: translateX(-50%); margin: 0; display: flex; flex-direction: column; min-height: 0; border-radius: 28px; overflow: hidden; border: 1px solid rgba(255,255,255,.88); background: rgba(241,248,239,.45); backdrop-filter: blur(26px) saturate(1.14); -webkit-backdrop-filter: blur(26px) saturate(1.14); box-shadow: 0 12px 0 -4px rgba(225,237,228,.6), 0 24px 0 -10px rgba(206,225,219,.42), 0 30px 74px rgba(19,53,63,.27), 0 8px 24px rgba(18,57,66,.12), inset 0 1px 0 rgba(255,255,255,.9); }
.section-tabs { flex: 0 0 83px; position: relative; top: auto; height: 83px; border-radius: 0; overflow: hidden; padding: 7px; gap: 6px; background: rgba(233,245,239,.61); border: 0; border-bottom: 1px solid rgba(255,255,255,.8); backdrop-filter: blur(26px) saturate(1.25); -webkit-backdrop-filter: blur(26px) saturate(1.25); box-shadow: inset 0 1px 0 rgba(255,255,255,.85); }
.section-tabs button { border-radius: 14px; padding: 13px 20px; gap: 15px; }
.section-tabs button.is-active { margin: 0; background: linear-gradient(130deg, rgba(50,104,110,.96), rgba(30,75,85,.96)); box-shadow: 0 6px 15px rgba(21,64,71,.22), inset 0 1px 0 rgba(255,255,255,.19); }
.section-tabs button + button:before { height: 25px; top: 20px; left: -4px; }
.section-tabs button > span:nth-child(2) { font-size: 15px; }
.section-tabs small { margin-top: 7px; }
.section-tabs .reading-progress { bottom: 0; border-radius: 10px; }
.paper-stack { flex: 1 1 auto; min-height: 0; margin: 0; border: 0; border-radius: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scroll-behavior: auto; scroll-padding-top: 24px; scrollbar-width: thin; scrollbar-color: rgba(64,110,113,.35) transparent; background: rgba(250,251,245,.87); backdrop-filter: blur(30px) saturate(1.08); -webkit-backdrop-filter: blur(30px) saturate(1.08); box-shadow: none; -webkit-overflow-scrolling: touch; }
.paper-stack::-webkit-scrollbar { width: 6px; }
.paper-stack::-webkit-scrollbar-thumb { background: rgba(64,110,113,.35); border-radius: 8px; }
.paper-stack:focus-visible { outline: none; box-shadow: inset 0 0 0 2px rgba(64,110,113,.24); }
.paper-stack:before, .paper-stack:after { display: none; }
.tab-panel { border-radius: 0; padding-top: 38px; }
.panel-heading { margin-bottom: 34px; }
.article-sidebar { top: 20px; }
.chapter { scroll-margin-top: 0; }
.article-content > .article-intro, .chapter > p { text-indent: 2em; }
.article-intro:first-letter { font-family: inherit; font-size: 1em; color: inherit; padding-right: 0; }
.chapter h3 { font-weight: 700; color: var(--deep); }
.chapter-label { font-weight: 700; color: #4f736d; }
.feature-quote { border-radius: 0 19px 19px 0; background: linear-gradient(120deg, rgba(217,232,220,.8), rgba(237,245,236,.7)); box-shadow: 0 8px 20px rgba(48,82,72,.045), inset 0 1px 0 rgba(255,255,255,.8); }
.article-seal { border-radius: 5px; }
.font-toggle { border-radius: 8px; }
.profile-portrait, .video-placeholder { border-radius: 22px; box-shadow: 0 16px 36px rgba(20,58,65,.16); }
.primary-link { border-radius: 10px; box-shadow: 0 7px 18px rgba(31,79,84,.14); }
.profile-facts, .work-item { border-color: rgba(61,98,97,.15); }
.site-footer { margin: 0 6%; padding: 26px 0; border-top: 1px solid var(--hairline); }

/* The entrance stays independent of the readable page beneath it. */
.entry-scene { display: none; position: fixed; inset: 0; z-index: 100; overflow: hidden; color: #21454d; --origin-x: 50%; --origin-y: 50%; --opening: 0px; --wave-scale: 16; }
.intro-pending { overflow: hidden; }
.intro-pending body { overflow: hidden; }
.intro-pending .entry-scene { display: block; }
.intro-pending .site-frame { filter: blur(4px); transform: scale(1.016); pointer-events: none; }
.intro-opening .site-frame { filter: blur(0); transform: scale(1); transition: filter 1.35s ease, transform 1.65s cubic-bezier(.2,.7,.2,1); }
.intro-surface { position: absolute; inset: 0; overflow: hidden; background: #bacfd1; isolation: isolate; }
.intro-surface:after { content: ''; position: absolute; inset: 0; z-index: 3; pointer-events: none; opacity: .055; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%232b4f56' filter='url(%23g)' d='M0 0h180v180H0z'/%3E%3C/svg%3E"); }
.intro-photo-wrap { position: absolute; inset: 0; mask-image: linear-gradient(90deg, #000 0%, #000 44%, transparent 75%), linear-gradient(#000 0%, #000 80%, transparent 100%); mask-composite: intersect; -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 44%, transparent 75%), linear-gradient(#000 0%, #000 80%, transparent 100%); -webkit-mask-composite: source-in; }
.intro-photo { position: absolute; top: -1%; left: 0; height: 108%; width: auto; max-width: none; mix-blend-mode: multiply; mask-image: linear-gradient(90deg,#000 0%,#000 73%,transparent 100%), linear-gradient(transparent 0%,#000 3%,#000 94%,transparent 100%); mask-composite: intersect; -webkit-mask-image: linear-gradient(90deg,#000 0%,#000 73%,transparent 100%), linear-gradient(transparent 0%,#000 3%,#000 94%,transparent 100%); -webkit-mask-composite: source-in; transform-origin: 30% 35%; animation: portrait-arrives 5.8s cubic-bezier(.17,.55,.3,1) both; }
.intro-light { position: absolute; inset: 0; background: radial-gradient(ellipse at 78% 36%, rgba(243,249,237,.34), transparent 63%); pointer-events: none; }
.intro-edition { position: absolute; top: 6.2%; left: 6.2%; right: 6.2%; display: flex; justify-content: space-between; align-items: center; letter-spacing: 4px; font-size: 12px; }
.intro-edition > span:first-child { background: rgba(228,240,233,.68); border: 1px solid rgba(255,255,255,.55); padding: 10px 16px; border-radius: 12px; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.intro-edition > span:last-child { font-size: 8px; letter-spacing: 2px; opacity: .6; }
.intro-copy { position: absolute; left: 54%; top: 25%; width: 42%; animation: title-arrives 1.2s .15s both; }
.intro-eyebrow { margin: 0 0 17px; font-size: 17px; letter-spacing: 6px; }
.intro-copy h2 { font-family: var(--serif); font-size: clamp(118px, 13.6vw, 210px); font-weight: 500; line-height: 1.2; letter-spacing: .06em; white-space: nowrap; margin: 0 0 25px; position: relative; left: -.1em; }
.intro-copy h2 > span { font-size: .27em; display: inline-block; vertical-align: top; padding-top: .45em; letter-spacing: 0; }
.intro-copy h2 > span:last-child { vertical-align: bottom; padding: 0 0 .13em; margin-left: -.3em; }
.intro-rule { width: 70%; height: 1px; background: rgba(39,78,83,.25); }
.intro-deck { font-family: var(--serif); font-size: 18px; letter-spacing: 3px; line-height: 2; margin: 24px 0; }
.intro-name { font-family: var(--serif); font-size: 23px; letter-spacing: 6px; margin-top: 30px; }
.intro-name > span { font-family: var(--sans); font-size: 10px; letter-spacing: 2px; margin-left: 18px; vertical-align: middle; border-left: 1px solid rgba(39,78,83,.3); padding-left: 20px; }
.intro-side { position: absolute; top: 33%; right: 2.7%; writing-mode: vertical-rl; font-size: 9px; letter-spacing: 5px; opacity: .45; }
.entry-center { position: absolute; left: 50%; bottom: 8%; transform: translateX(-50%); z-index: 5; transition: opacity .3s, transform .4s; }
.intro-enter { display: flex; align-items: center; gap: 18px; border: 1px solid rgba(255,255,255,.75); background: rgba(226,241,232,.6); box-shadow: 0 10px 28px rgba(38,78,82,.12), inset 0 1px 0 rgba(255,255,255,.75); border-radius: 60px; padding: 14px 26px 14px 16px; color: #315c62; text-align: left; backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); font-size: 12px; letter-spacing: 5px; }
.intro-enter:hover { background: rgba(244,250,239,.8); }
.entry-scene:not(.uses-keyboard) button:focus-visible { outline: none; }
.entry-orbit { width: 38px; height: 38px; border: 1px solid rgba(78,129,129,.32); border-radius: 50%; display: grid; place-items: center; position: relative; }
.entry-orbit:before, .entry-orbit:after { content: ''; position: absolute; inset: 5px; border: 1px solid rgba(78,129,129,.18); border-radius: 50%; }
.entry-orbit:after { inset: -5px; border-color: rgba(78,129,129,.14); animation: orbit-breathe 2.4s ease-in-out infinite; }
.entry-orbit > i { width: 4px; height: 4px; background: #57888b; border-radius: 50%; }
.entry-scene[data-state="flying"] .entry-center, .entry-scene[data-state="rippling"] .entry-center { opacity: 0; transform: translate(-50%, 8px); pointer-events: none; }
.intro-butterfly { position: absolute; left: 0; top: 0; width: 100px; height: 84px; z-index: 7; opacity: 0; pointer-events: none; filter: drop-shadow(0 4px 8px rgba(26,67,73,.24)); will-change: transform; }
.intro-butterfly svg { display: block; width: 100%; height: 100%; overflow: visible; position: relative; z-index: 2; }
.butterfly-wing { transform-box: view-box; transform-origin: 60px 51px; animation: wing-beat .23s ease-in-out infinite alternate; }
.wing-right { animation-delay: -.025s; }
.butterfly-glow { position: absolute; width: 72%; height: 50%; left: 14%; top: 30%; border-radius: 50%; filter: blur(17px); background: rgba(250,248,216,.65); z-index: 1; }
.entry-scene[data-state="rippling"] .intro-surface { filter: url(#intro-water); mask-image: radial-gradient(circle at var(--origin-x) var(--origin-y), transparent max(0px, calc(var(--opening) - 30px)), #000 calc(var(--opening) + 34px)); -webkit-mask-image: radial-gradient(circle at var(--origin-x) var(--origin-y), transparent max(0px, calc(var(--opening) - 30px)), #000 calc(var(--opening) + 34px)); }
.water-waves { position: absolute; left: var(--origin-x); top: var(--origin-y); z-index: 6; pointer-events: none; }
.water-wave { position: absolute; display: block; left: 0; top: 0; width: 160px; height: 160px; border: 1px solid rgba(241,255,246,.72); border-radius: 50%; box-shadow: 0 0 3px rgba(238,253,242,.7), inset 0 0 12px rgba(219,250,239,.32), 0 4px 10px rgba(41,106,113,.16); opacity: 0; transform: translate(-50%, -50%) scale(0); }
.water-wave:nth-child(2) { border-color: rgba(107,171,178,.4); }
.water-wave:nth-child(3) { border-color: rgba(243,255,240,.6); }
.water-filter { position: absolute; pointer-events: none; }
.entry-scene.is-fading { opacity: 0; transition: opacity .2s; }
@keyframes portrait-arrives { from { transform: scale(1.045); } to { transform: scale(1); } }
@keyframes title-arrives { from { transform: translateY(13px); } to { transform: translateY(0); } }
@keyframes orbit-breathe { 50% { transform: scale(1.13); opacity: .4; } }
@keyframes wing-beat { from { transform: scaleX(1) rotate(-3deg); } to { transform: scaleX(.22) rotate(4deg); } }

@media(min-width:1600px) { .hero-copy { padding-top: 20px; } .hero-copy h1 { font-size: 100px; } .hero-portrait { left: 3vw; width: 85%; max-width: 920px; } }
@media(max-width:1100px) { .hero-copy { margin-left: 53%; padding-top: 22px; } .hero-copy h1 { font-size: 80px; } .hero-deck { font-size: 13px; } .section-tabs button { padding: 12px 14px; gap: 10px; } .section-tabs button > span:nth-child(2) { font-size: 13px; } .intro-copy { left: 53%; } .intro-eyebrow { font-size: 14px; letter-spacing: 4px; } .intro-copy h2 { font-size: 130px; } .intro-deck { font-size: 16px; letter-spacing: 2px; } }
@media(max-width:760px) {
  :root { --reader-top: clamp(238px, 39svh, 329px); --reader-bottom: max(12px, env(safe-area-inset-bottom)); }
  .masthead { height: 74px; }
  .masthead-right { font-size: 8px; gap: 5px; }
  .intro-replay { margin-left: 8px; padding: 7px 9px; font-size: 8px; letter-spacing: .5px; gap: 4px; }
  .intro-replay > span { font-size: 16px; }
  .hero { height: calc(var(--reader-top) - 74px); }
  .portrait-stage { top: -20px; width: 84%; height: 620px; }
  .hero-portrait { width: 110%; left: -7%; top: 0; }
  .hero-copy { margin-left: 51%; width: 46%; padding-top: 34px; }
  .eyebrow { font-size: 10px; letter-spacing: 1px; gap: 6px; }
  .tiny-line { width: 11px; }
  .hero-copy h1 { font-size: clamp(62px, 13.5vw, 85px); letter-spacing: 0; margin: 12px 0 10px; }
  .hero-rule { margin: 8px 0 11px; width: 84%; }
  .hero-deck { font-size: 11px; line-height: 1.85; letter-spacing: .4px; }
  .hero-signature { margin-top: 14px; gap: 8px; font-size: 8px; }
  .hero-signature .name { font-size: 16px; letter-spacing: 2px; }
  .signature-divider { height: 21px; }
  .signature-en { font-size: 4.5px; letter-spacing: .6px; }
  .main-shell { width: 92%; border-radius: 23px; }
  .section-tabs { flex-basis: 73px; height: 73px; top: auto; padding: 5px; gap: 3px; border-radius: 0; }
  .section-tabs button { padding: 9px 2px; border-radius: 12px; gap: 0; }
  .section-tabs button > span:nth-child(2) { font-size: 11px; letter-spacing: 1px; }
  .section-tabs small { font-size: 5px; letter-spacing: .35px; margin-top: 7px; }
  .section-tabs button + button:before { top: 17px; height: 25px; left: -2px; }
  .paper-stack { margin: 0; border-radius: 0; background: rgba(250,251,246,.89); box-shadow: none; }
  .paper-stack:before { inset: 12px 8px -10px; border-radius: 23px; }
  .paper-stack:after { inset: 23px 17px -18px; border-radius: 23px; }
  .tab-panel { border-radius: 0; padding-top: 29px; }
  .panel-heading { margin-bottom: 25px; }
  .article-sidebar { top: auto; }
  .chapter { scroll-margin-top: 0; }
  .feature-quote { border-radius: 0 15px 15px 0; }
  .profile-portrait, .video-placeholder { border-radius: 17px; }
  .intro-photo { width: 126vw; height: auto; top: 11%; left: -7%; }
  .intro-photo-wrap { mask-image: linear-gradient(90deg, #000 0%, #000 42%, transparent 92%), linear-gradient(#000 0%, #000 75%, transparent 96%); -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 42%, transparent 92%), linear-gradient(#000 0%, #000 75%, transparent 96%); }
  .intro-edition { top: 5%; left: 5%; right: 5%; font-size: 10px; }
  .intro-edition > span:first-child { padding: 9px 12px; }
  .intro-edition > span:last-child { font-size: 5px; letter-spacing: .8px; max-width: 110px; text-align: right; line-height: 1.9; }
  .intro-copy { left: 51%; width: 47%; top: 29%; }
  .intro-eyebrow { font-size: 11px; letter-spacing: 1.5px; margin-bottom: 18px; }
  .intro-copy h2 { font-size: clamp(71px, 17vw, 105px); letter-spacing: 0; margin-bottom: 17px; }
  .intro-deck { font-size: 12px; line-height: 2; letter-spacing: .5px; margin: 18px 0; }
  .intro-rule { width: 82%; }
  .intro-name { font-size: 18px; letter-spacing: 3px; margin-top: 22px; }
  .intro-name > span { font-size: 8px; letter-spacing: 1px; padding-left: 10px; margin-left: 7px; }
  .intro-side { display: none; }
  .entry-center { bottom: 11%; }
  .intro-enter { padding: 13px 21px 13px 15px; gap: 13px; font-size: 11px; letter-spacing: 2px; }
  .entry-orbit { width: 32px; height: 32px; }
  .intro-butterfly { width: 79px; height: 66px; }
}
@media(max-width:390px) { .masthead-right > .status-dot { display: none; } .masthead-right { font-size: 7px; letter-spacing: .5px; } .intro-replay { margin-left: 5px; font-size: 7px; padding: 7px 8px; } .hero-copy { margin-left: 49%; width: 49%; } .hero-deck { font-size: 10px; } .section-tabs button > span:nth-child(2) { font-size: 10px; } .section-tabs small { font-size: 4.5px; } }
/* All screen sizes share the same lift, dock and reading sequence. */
.site-frame.is-sequential-reader { --reader-dock-gap: max(24px, env(safe-area-inset-top)); overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scroll-behavior: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.is-sequential-reader::-webkit-scrollbar { display: none; }
.is-sequential-reader .scene-background { display: block; position: sticky; top: calc(var(--reader-dock-gap) - var(--reader-top)); height: var(--reader-top); z-index: 0; }
.is-sequential-reader .reader-track { display: block; position: relative; z-index: 1; min-height: calc(100dvh - var(--reader-dock-gap)); }
.is-sequential-reader .main-shell { --reader-radius: 28px; position: sticky; top: var(--reader-dock-gap); bottom: auto; left: auto; transform: none; height: calc(100dvh - var(--reader-dock-gap) - var(--reader-bottom)); margin: 0 auto; overflow: visible; border-radius: var(--reader-radius) var(--reader-radius) 0 0; border-bottom-color: transparent; box-shadow: 0 16px 48px rgba(19,53,63,.14), inset 0 1px 0 rgba(255,255,255,.9); }
.is-sequential-reader .main-shell::after { content: ''; position: absolute; top: calc(100% - 1px); left: -1px; right: -1px; height: calc(var(--reader-bottom) + 2px); border: solid rgba(255,255,255,.88); border-width: 0 1px; background: rgba(248,250,242,.95); backdrop-filter: blur(30px) saturate(1.08); -webkit-backdrop-filter: blur(30px) saturate(1.08); pointer-events: none; }
.is-sequential-reader .section-tabs { border-radius: calc(var(--reader-radius) - 1px) calc(var(--reader-radius) - 1px) 0 0; }
.is-sequential-reader .paper-stack { overflow-y: hidden; overscroll-behavior: auto; scrollbar-width: none; }
.is-sequential-reader .tab-panel { animation: none; }
.is-sequential-reader[data-reader-end="true"] .main-shell { border-radius: var(--reader-radius); border-bottom-color: rgba(255,255,255,.88); box-shadow: 0 12px 0 -4px rgba(225,237,228,.6), 0 24px 0 -10px rgba(206,225,219,.42), 0 30px 74px rgba(19,53,63,.27), 0 8px 24px rgba(18,57,66,.12), inset 0 1px 0 rgba(255,255,255,.9); }
.is-sequential-reader[data-reader-end="true"] .main-shell::after { display: none; }
.is-sequential-reader[data-reader-end="true"] .paper-stack { border-radius: 0 0 calc(var(--reader-radius) - 1px) calc(var(--reader-radius) - 1px); }
@media(max-width:760px) { .is-sequential-reader .main-shell { --reader-radius: 23px; } }
@media(max-height:740px) { :root { --reader-top: clamp(196px, 36svh, 280px); } .masthead { height: 62px; } .hero { height: calc(var(--reader-top) - 62px); } .hero-copy { padding-top: 10px; } .hero-copy h1 { font-size: 58px; margin-top: 7px; margin-bottom: 6px; } .eyebrow { font-size: 10px; } .hero-rule { margin: 6px 0 8px; } .hero-deck { font-size: 11px; line-height: 1.7; } .hero-signature { display: none; } .hero-bottom { bottom: 8px; } .hero-bottom > span { font-size: 8px; } }
@media(max-height:600px) and (min-width:761px) { .intro-copy { top: 17%; } .intro-copy h2 { font-size: 115px; margin-bottom: 10px; } .intro-deck { font-size: 13px; margin: 13px 0; } .intro-name { font-size: 17px; margin-top: 15px; } .entry-center { bottom: 5%; } }
@media(prefers-reduced-motion:reduce) { .intro-photo, .intro-copy, .entry-orbit:after, .butterfly-wing { animation: none; } .intro-pending .site-frame { filter: none; transform: none; } .entry-scene, .intro-opening .site-frame { transition-duration: .15s; } }

/* The desktop reading surface is the main destination after the entrance. */
@media(min-width:761px) {
  :root { --reader-top: clamp(300px, 37svh, 390px); --reader-bottom: 20px; }
  .masthead { height: 56px; margin: 0 12px; }
  .wordmark { margin-left: 0; padding: 5px 10px; }
  .hero { height: calc(var(--reader-top) - 56px); }
  .portrait-stage { top: -56px; }
  .hero-portrait { width: calc(var(--reader-top) * 1.8); max-width: 700px; left: clamp(12px, 5vw, 100px); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 72%, transparent), linear-gradient(#000 86%, transparent); mask-composite: intersect; -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 72%, transparent), linear-gradient(#000 86%, transparent); -webkit-mask-composite: source-in; }
  .hero-copy { margin-left: 53%; width: 43%; max-width: none; padding-top: 20px; display: block; }
  .eyebrow { font-size: 12px; letter-spacing: 3px; gap: 12px; }
  .hero-copy h1 { font-size: clamp(76px, 7vw, 108px); line-height: 1.12; letter-spacing: 8px; margin: 10px 0 14px; }
  .hero-deck { border-left: 0; padding-left: 0; font-size: 14px; line-height: 1.9; letter-spacing: 2px; }
  .hero-rule, .hero-signature, .hero-bottom, .hero-vertical { display: none; }
  .main-shell { width: calc(100% - 24px); max-width: none; }
  .section-tabs { flex-basis: 74px; height: 74px; padding: 6px; }
  .section-tabs button { padding: 10px 22px; }
  .section-tabs small { margin-top: 5px; }
  .section-tabs button + button:before { top: 18px; }
  .tab-panel { padding: 26px clamp(20px, 2vw, 40px) 44px; }
  .panel-heading { padding-bottom: 20px; margin-bottom: 24px; }
  .article-title-row { margin-top: 12px; }
  .article-title-row h2 { font-size: clamp(30px, 2.8vw, 42px); line-height: 1.4; }
  .article-meta { margin-top: 13px; }
  .interview-panel .panel-heading { max-width: 1680px; margin-left: auto; margin-right: auto; }
  .article-layout { grid-template-columns: clamp(135px, 10vw, 160px) minmax(0, 1fr); gap: clamp(24px, 2.4vw, 44px); max-width: 1680px; margin: 0 auto; }
  .article-content { max-width: none; }
}