/* World Wide Vibes: the change is the first thing to understand. */
body[data-story=trajectory] { --story-rule: #bdcfe329; }
[data-story=trajectory] .chapter { max-width: 1560px; }
[data-story=trajectory] .site-header { height: 90px; }
[data-story=trajectory] .world-opening { display: block; padding: 125px clamp(26px,6.5vw,112px) 116px; min-height: 100svh; }
.quiet-earth { position: absolute; width: 460px; height: 460px; right: 1%; top: 38px; pointer-events: none; opacity: .3; overflow: hidden; border-radius: 50%; z-index: 0; }
.quiet-earth img { width: 118%; height: 118%; position: absolute; left: -9%; top: -9%; object-fit: cover; border-radius: 50%; filter: saturate(.6); }
.quiet-earth div { position: absolute; inset: 0; border-radius: 50%; background: linear-gradient(105deg,#05060a 3%,#05060a55 62%,#05060acc),linear-gradient(0deg,#05060a,transparent 50%); }
.world-opening-top { position: relative; display: grid; grid-template-columns: 1.35fr 1fr; align-items: center; gap: 80px; }
.world-signature { color: var(--muted); font: 400 21px/1.4 var(--serif); margin: 0 0 17px; letter-spacing: -.01em; }
[data-story=trajectory] .world-headline .reveal-title { font-size: clamp(66px,6.7vw,104px); line-height: 1.02; margin: 0 0 16px; letter-spacing: -.035em; }
.world-headline .line-clip>span { text-wrap: nowrap; }
.trend-description { max-width: 46ch; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.75; min-height: 46px; }
.world-invitation { padding-top: 25px; max-width: 37ch; }
.world-invitation .world-question { font: 400 28px/1.4 var(--serif); letter-spacing: -.015em; color: var(--ink); margin: 0 0 20px; }
.world-invitation>p { color: var(--muted); font-size: 13px; line-height: 1.85; margin: 0; }
.world-engine { display: inline-block; font-size: 10px; color: var(--faint); margin-top: 27px; }
.trajectory { position: relative; margin: 33px 0 0; }
.trajectory-caption { display: flex; justify-content: space-between; align-items: center; gap: 22px; font-size: 10px; line-height: 1.6; color: var(--muted); }
.sample-caption { color: var(--faint); white-space: nowrap; }
.trajectory-surface { position: relative; width: 100%; height: clamp(160px,22vh,235px); cursor: ew-resize; touch-action: pan-y; outline-offset: 8px; margin-top: 7px; }
.trajectory-surface:focus-visible { outline: 1px solid var(--accent); border-radius: 3px; }
.trajectory-surface svg { display: block; width: 100%; height: 100%; overflow: visible; }
.trajectory-guides { fill: none; stroke: var(--story-rule); stroke-width: 1; stroke-dasharray: 2 7; }
.trajectory-axis { fill: var(--faint); font: 9px Inter,system-ui,sans-serif; }
.trajectory-trace { fill: none; stroke: var(--ink); stroke-width: 2.8; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.js .trajectory-trace { stroke-dasharray: 1; animation: history-reveal 1.5s var(--ease) both; }
@keyframes history-reveal { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
.trajectory-points { fill: var(--ink); }
.trajectory-cursor { fill: none; stroke: var(--accent); stroke-opacity: .42; stroke-dasharray: 3 6; stroke-width: 1; }
.trajectory-halo { fill: #7fb4e613; stroke: #7fb4e64d; stroke-width: 1; }
.trajectory-selected { fill: var(--accent); stroke: var(--canvas); stroke-width: 2; }
.timeline-dates { display: flex; justify-content: space-between; gap: 18px; margin: -7px 4.4% 0; }
.timeline-dates button { min-height: 46px; min-width: 110px; padding: 0; text-align: center; color: var(--faint); position: relative; }
.timeline-dates button:first-child { text-align: left; }
.timeline-dates button:last-child { text-align: right; }
.timeline-dates time { font-size: 11px; display: block; }
.timeline-dates button>span { display: block; font-size: 9px; margin-top: 4px; }
.timeline-dates button[aria-pressed=true] { color: var(--ink); }
.timeline-dates button[aria-pressed=true] time { color: var(--accent); }
.trajectory-meta { display: flex; justify-content: space-between; gap: 20px; margin-top: 17px; color: var(--faint); font-size: 9px; line-height: 1.7; }
.trajectory-meta p { margin: 0; }
.change-inspector { position: relative; border-top: 1px solid var(--story-rule); margin-top: 21px; }
.change-inspector>summary { display: flex; align-items: center; justify-content: space-between; font-size: 12px; cursor: pointer; padding: 18px 0; list-style: none; min-height: 58px; }
summary::-webkit-details-marker { display: none; }
summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 6px; }
.disclosure-symbol { font-size: 23px; line-height: 1; color: var(--accent); transition: transform .4s var(--ease); }
.change-inspector[open]>summary .disclosure-symbol { transform: rotate(45deg); }
.change-inspector[open] { margin-top: 27px; scroll-margin-top: 95px; }
.change-inspector[open]>summary { border-bottom: 1px solid var(--story-rule); }
.inspection-content { padding-top: 38px; }
.inspection-intro { display: flex; align-items: end; justify-content: space-between; gap: 35px; margin-bottom: 33px; }
.inspection-intro h2 { font: 400 clamp(34px,3.7vw,52px)/1.2 var(--serif); margin: 0; letter-spacing: -.025em; }
.inspection-intro .world-signature { font-size: 17px; margin-bottom: 10px; }
.inspection-dates { display: flex; gap: 20px; }
.inspection-dates button { font-size: 11px; min-height: 44px; color: var(--faint); padding: 7px 0; border-bottom: 1px solid transparent; }
.inspection-dates button[aria-pressed=true] { color: var(--ink); border-color: var(--accent); }
.inspection-layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: clamp(40px,7vw,110px); align-items: start; }
.inspection-layout .reading-wrap { position: sticky; top: 117px; }
.inspection-layout .reading-card { transform: none; box-shadow: none; max-width: 560px; opacity: 1; }
.inspection-layout .score-value { font-size: 74px; }
.inspection-layout .emotion-bar { min-height: 33px; }
.inspection-layout .score-block,.inspection-layout .emotion-bars { scroll-margin-top: 115px; }
.inspection-label { color: var(--faint); font-size: 10px; }
.inspection-copy h3 { font: 400 28px/1.25 var(--serif); margin: 14px 0 12px; letter-spacing: -.015em; }
.inspection-copy p { color: var(--muted); font-size: 12px; line-height: 1.8; }
.emotion-comparison { display: flex; gap: 46px; font-size: 12px; margin: 22px 0; }
.emotion-comparison dt { color: var(--faint); margin-bottom: 5px; font-size: 10px; }
.emotion-comparison dd { margin: 0; font-variant-numeric: tabular-nums; }
.inspection-disclosure { border-top: 1px solid var(--story-rule); padding: 2px 0; }
.inspection-disclosure summary { list-style: none; cursor: pointer; font-size: 11px; padding: 14px 26px 14px 0; position: relative; }
.inspection-disclosure summary:after { content: '+'; position: absolute; right: 2px; top: 8px; color: var(--faint); font-size: 20px; }
.inspection-disclosure[open] summary:after { content: '−'; }
.inspection-disclosure p { color: var(--muted); font-size: 12px; line-height: 1.8; margin: 6px 0 17px; }
.world-emotion-lesson { padding: 9px 0 21px; }
.world-emotion-lesson .emotion-explainer { border: 0; margin-top: 10px; padding-top: 0; }
.world-emotion-lesson .emotion-focus-name { font-size: 23px; }
.world-emotion-lesson .emotion-focus-value { font-size: 27px; }
.world-emotion-lesson .emotion-focus-copy { min-height: 44px; margin-bottom: 12px; }
.world-emotion-lesson .fine-copy { font-size: 10px; margin: 15px 0 0; }
.world-emotion-lesson .unit-switch { margin-top: 13px; }
.source-disclosure { margin-top: 34px; }
.source-disclosure>summary { font-size: 13px; padding-block: 20px; }
.source-disclosure>summary:after { top: 13px; }
.source-context { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; padding: 10px 0 18px; }
.source-context h3 { font: 400 29px/1.3 var(--serif); margin: 0 0 13px; }
.close-inspector { margin: 17px 0 12px; font-size: 11px; padding: 13px 0; min-height: 44px; color: var(--muted); }
.world-continue { display: flex; align-items: center; justify-content: space-between; max-width: 230px; gap: 30px; padding-top: 19px; font-size: 10px; color: var(--faint); }
.world-continue span { font-size: 18px; }
[data-story=trajectory] .world-context { padding-top: 148px; padding-bottom: 126px; }
[data-story=trajectory] .world-context .reveal-title { font-size: clamp(48px,4.9vw,75px); }
[data-story=trajectory] .world-context .lede { font-size: 15px; line-height: 1.85; }
.history-questions { padding: 30px 0 0; }
.spoken-question { font: 400 clamp(35px,3.5vw,55px)/1.25 var(--serif); margin: 0; letter-spacing: -.025em; color: var(--muted); }
.question-reply { font: 400 clamp(29px,2.8vw,44px)/1.25 var(--serif); margin: 6px 0 37px; }
.history-lenses { display: flex; gap: 32px; border-bottom: 1px solid var(--story-rule); }
.history-lenses button { font-size: 11px; color: var(--faint); padding: 15px 0; border-bottom: 1px solid transparent; margin-bottom: -1px; }
.history-lenses button[aria-pressed=true] { color: var(--ink); border-color: var(--accent); }
.lens-answer { min-height: 226px; padding-top: 15px; }
.lens-answer h3 { font: 400 28px/1.3 var(--serif); margin: 18px 0 12px; }
.lens-answer p { color: var(--muted); font-size: 13px; line-height: 1.85; margin: 0; max-width: 46ch; }
.lens-answer .lens-example { border-top: 1px solid var(--story-rule); padding-top: 16px; margin-top: 20px; font-size: 11px; color: var(--faint); }
.context-questions>div { position: relative; padding: 26px 0 27px 50px; border-bottom: 1px solid var(--story-rule); }
.context-questions h3 { font: 400 31px/1.3 var(--serif); margin: 0 0 12px; }
.context-questions p { color: var(--muted); font-size: 13px; line-height: 1.85; margin: 0; max-width: 35ch; }
.context-symbol { position: absolute; left: 0; top: 25px; font-size: 24px; color: var(--accent); }
.context-questions .context-note { color: var(--faint); font-size: 11px; padding-top: 25px; max-width: 44ch; }
[data-story=trajectory] .atmosphere-chapter .brand-gallery { margin-top: 65px; }
[data-story=trajectory] .gallery-title { font-size: clamp(38px,4vw,60px); }
[data-story=trajectory] .finale .reveal-title { font-size: clamp(55px,6.1vw,94px); }
[data-story=trajectory] .finale .lede { font-size: 15px; }
.engine-bridge { font: 24px/1.8 var(--serif); margin-top: 32px; }
.engine-bridge>span { font: 11px/1.8 Inter,system-ui,sans-serif; color: var(--muted); }
[data-story=trajectory][data-chapter='3'] .scenery-image { opacity: .4; }
[data-story=trajectory][data-video=active][data-chapter='3'] .scenery-video.ready { opacity: .34; }
[data-story=trajectory] .journey-footer nav { gap: clamp(20px,4vw,60px); }
[data-story=trajectory] .journey-footer nav a { min-height: 44px; }
[data-story=trajectory].past-intro-top .site-header { background: linear-gradient(180deg,#05060a 72%,#05060a00); }
@media(min-width:761px) and (max-height:850px) {
  [data-story=trajectory] .world-opening { padding-top: 105px; }
  [data-story=trajectory] .world-headline .reveal-title { font-size: clamp(62px,5.8vw,82px); }
  .trend-description { min-height: 24px; max-width: 53ch; font-size: 12px; }
  .world-signature { margin-bottom: 13px; font-size: 19px; }
  .world-opening-top { gap: 75px; }
  .world-invitation { padding-top: 10px; }
  .world-invitation .world-question { font-size: 25px; margin-bottom: 14px; }
  .world-engine { margin-top: 20px; }
  .trajectory { margin-top: 17px; }
  .trajectory-surface { height: 128px; }
  .trajectory-meta { margin-top: 8px; }
  .change-inspector { margin-top: 13px; }
  .change-inspector>summary { min-height: 54px; padding: 14px 0; }
  .world-continue { display: none; }
}
@media(max-width:1000px) and (min-width:761px) {
  .world-opening-top { gap: 40px; grid-template-columns: 1.25fr 1fr; }
  [data-story=trajectory] .world-headline .reveal-title { font-size: 66px; }
  [data-story=trajectory] .world-context { gap: 45px; }
  .history-lenses { gap: 23px; }
}
@media(max-width:760px) {
  [data-story=trajectory] .site-header { height: 82px; }
  [data-story=trajectory] .world-opening { padding: 110px 25px 110px; display: flex; flex-direction: column; align-items: stretch; gap: 0; }
  .quiet-earth { width: 325px; height: 325px; max-width: 100%; top: 65px; right: 0; opacity: .25; }
  .world-opening-top { display: contents; }
  .world-headline { position: relative; order: 0; }
  .trajectory { order: 1; }
  .change-inspector { order: 2; }
  .world-invitation { order: 3; }
  .world-continue { order: 4; }
  .world-signature { font-size: 20px; margin-bottom: 17px; }
  [data-story=trajectory] .world-headline .reveal-title { font-size: clamp(62px,16.5vw,90px); line-height: 1.04; margin-bottom: 18px; }
  .trend-description { font-size: 12px; max-width: 35ch; min-height: 42px; }
  .world-invitation { padding: 0; margin-top: 37px; max-width: 40ch; }
  .world-invitation .world-question { font-size: 22px; line-height: 1.4; margin-bottom: 11px; }
  .world-invitation>p { font-size: 12px; line-height: 1.8; }
  .world-engine { margin-top: 17px; font-size: 9px; }
  .trajectory { margin-top: 28px; }
  .trajectory-caption { align-items: end; gap: 20px; font-size: 9px; }
  .trajectory-caption>span:first-child { max-width: 23ch; }
  .chart-unit { display: block; }
  .trajectory-surface { height: 158px; margin-top: 12px; }
  .trajectory-axis { font-size: 9px; }
  .trajectory-trace { stroke-width: 2.2; }
  .trajectory-selected { r: 4.5; stroke-width: 2; }
  .trajectory-halo { r: 11; }
  .trajectory-points circle { r: 3; }
  .timeline-dates { margin-top: -5px; margin-inline: 4.4%; gap: 8px; }
  .timeline-dates button { min-width: 0; width: 32%; }
  .timeline-dates time { font-size: 11px; }
  .timeline-dates button>span { font-size: 9px; }
  .trajectory-meta { display: block; font-size: 9px; margin-top: 20px; }
  .trajectory-meta p+p { margin-top: 6px; }
  .change-inspector { margin-top: 20px; }
  .change-inspector>summary { font-size: 13px; padding-block: 18px; }
  .inspection-intro { display: block; margin-bottom: 27px; }
  .inspection-dates { margin-top: 20px; gap: 34px; }
  .inspection-layout { display: block; }
  .inspection-layout .reading-wrap { position: static; }
  .inspection-layout .reading-card { padding: 20px 20px 17px; }
  .inspection-layout .score-value { font-size: 86px; }
  .inspection-layout .emotion-bar { min-height: 36px; }
  .inspection-copy { margin-top: 32px; }
  .inspection-copy h3 { font-size: 29px; }
  .inspection-copy p,.inspection-disclosure p { font-size: 13px; }
  .inspection-label { font-size: 10px; }
  .inspection-disclosure summary { min-height: 48px; font-size: 12px; }
  .world-emotion-lesson { scroll-margin-top: 108px; }
  .source-context { display: block; }
  .source-context>div+div { margin-top: 26px; }
  [data-story=trajectory] .world-context { padding: 117px 25px 105px; display: block; min-height: auto; }
  [data-story=trajectory] .world-context .reveal-title { font-size: 49px; line-height: 1.14; }
  [data-story=trajectory] .world-context .lede { font-size: 14px; }
  .history-questions { padding-top: 63px; }
  .spoken-question { font-size: 39px; }
  .question-reply { font-size: 32px; margin-top: 7px; }
  .history-lenses { gap: 33px; }
  .lens-answer { min-height: 244px; }
  .context-questions { padding-top: 37px; }
  .context-questions h3 { font-size: 28px; }
  [data-story=trajectory] .atmosphere-chapter .brand-gallery { margin-top: 47px; }
  [data-story=trajectory] .gallery-title { font-size: 40px; }
  [data-story=trajectory] .finale .reveal-title { font-size: 55px; }
  [data-story=trajectory] .finale { padding: 135px 25px; }
  [data-story=trajectory] .journey-footer nav { gap: 12px; }
  [data-story=trajectory] .journey-footer nav a { width: 30px; }
  .engine-bridge { font-size: 23px; }
  .engine-bridge>span { font-size: 10px; }
}
@media(max-width:370px) {
  [data-story=trajectory] .world-opening { padding-inline: 21px; }
  [data-story=trajectory] .world-headline .reveal-title { font-size: 58px; }
  [data-story=trajectory] .world-context { padding-inline: 21px; }
  [data-story=trajectory] .world-context .reveal-title { font-size: 43px; }
  .trajectory-axis { font-size: 9px; }
  .inspection-layout .reading-card { padding-inline: 16px; }
  .history-lenses { gap: 24px; }
  [data-story=trajectory] .finale .reveal-title { font-size: 46px; }
  [data-story=trajectory] .journey-footer nav { gap: 6px; }
}
body[data-motion=reduce] .disclosure-symbol { transition: none; }
body[data-motion=reduce] .trajectory-trace { animation: none; stroke-dashoffset: 0; }
@media(prefers-reduced-motion:reduce) { .disclosure-symbol { transition: none; } }
@media(prefers-reduced-motion:reduce) { .js .trajectory-trace { animation: none; stroke-dashoffset: 0; } }
