/* AI: The Long Road to Now — single-screen interactive evolution map */
:root{color-scheme:dark;--bg:#080b18;--panel:#10172a;--stroke:rgba(162,182,223,.19);--text:#f2f3ff;--muted:#a2adc5;--subtle:#78849e;--violet:#b39fff;--blue:#77c8ff;--amber:#f1be8a;--font:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:var(--bg);color:var(--text);font:14px/1.5 var(--font);letter-spacing:-.018em;-webkit-font-smoothing:antialiased;overflow-x:hidden}button,input{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible,input:focus-visible,.chart-scroll:focus-visible{outline:2px solid #d7caff;outline-offset:3px}[hidden]{display:none!important}
::selection{background:#aa93ef;color:#090b18}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;z-index:300;left:16px;top:-100px;background:#fff;color:#111;padding:11px 16px;border-radius:9px}.skip-link:focus{top:15px}
.ambient{position:fixed;z-index:-1;pointer-events:none;border-radius:50%}.ambient-one{width:820px;height:750px;left:-320px;top:-230px;background:radial-gradient(ellipse,#38296b52,transparent 69%)}.ambient-two{width:760px;height:670px;right:-260px;bottom:-290px;background:radial-gradient(ellipse,#23598645,transparent 69%)}
.app-shell{width:min(100%,1800px);min-height:100svh;margin:auto;padding:0 clamp(20px,3.5vw,66px);display:flex;flex-direction:column}.topbar{height:70px;min-height:70px;display:flex;align-items:center;gap:26px;border-bottom:1px solid #acb3dd29}.brand{display:flex;align-items:center;gap:13px;white-space:nowrap;font-size:11px;font-weight:850;letter-spacing:.1em;line-height:1.25}.brand small{display:block;color:#9ba2c0;font-size:11px}.brand-dot{color:#c5b4ff}.brand-orbit{width:35px;height:35px;position:relative;border:1px solid #c0adff8c;border-radius:50%;display:grid;place-items:center;box-shadow:0 0 26px #8168ef26}.brand-orbit:before{content:"";position:absolute;inset:7px;border:1px dashed #ac9fff9e;border-radius:50%;transform:rotate(-24deg)}.brand-orbit:after{content:"";width:9px;height:9px;border-radius:50%;background:#c6b9ff;box-shadow:0 0 14px #af98ff}.brand-orbit span{position:absolute;right:2px;top:8px;width:6px;height:6px;border-radius:50%;background:#80ccff}
.header-divider{height:25px;width:1px;background:#7784a54b}.header-context{font-size:10px;font-weight:770;letter-spacing:.14em;color:#7f8daa}.topbar-actions{display:flex;gap:17px;align-items:center;margin-left:auto}.live-indicator{white-space:nowrap;color:#a9b3cb;font-size:10px;font-weight:770;letter-spacing:.10em}.live-indicator i{width:6px;height:6px;display:inline-block;margin-right:7px;border-radius:50%;background:#8eeac3;box-shadow:0 0 12px #8eeac3}.nav-button{display:inline-flex;align-items:center;gap:8px;border:1px solid #a8b3d643;border-radius:10px;background:#ffffff09;color:#e8e6fa;padding:9px 12px;font-size:11px;font-weight:740;white-space:nowrap}.nav-button:hover{background:#bba7ff20;border-color:#c4b4ff88}.nav-button svg{height:15px;width:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.experience{width:100%;flex:1;min-height:0;display:flex;flex-direction:column}.opening{display:flex;justify-content:space-between;align-items:center;gap:30px;padding:28px 0 25px}.opening-copy{min-width:0}.eyebrow{color:#b0a4e7;font-size:10px;font-weight:840;letter-spacing:.18em;margin:0 0 12px}.star-mark{color:#cdbaff;margin-right:5px}.opening h1{font-size:clamp(30px,3vw,48px);letter-spacing:-.067em;line-height:1.12;margin:0 0 10px;font-weight:820;text-wrap:balance}.opening h1 em{font-style:normal;background:linear-gradient(105deg,#d1c1ff,#8bcaff);background-clip:text;-webkit-background-clip:text;color:transparent}.intro{max-width:910px;font-size:13px;color:#aeb4cc;line-height:1.6;margin:0}.intro strong{color:#ebdcff;font-weight:680}.opening-aside{flex:none;text-align:right}.overview-value{font-size:38px;font-weight:840;line-height:1.1;letter-spacing:-.08em;color:#e4dcff}.overview-value small{font-size:10px;font-weight:760;letter-spacing:.14em;color:#b5a6e1}.overview-mark{font-size:21px;color:#ae9dff;margin-right:9px;letter-spacing:0}.overview-caption{color:#77839f;font-size:10px}
.stage{display:grid;grid-template-columns:minmax(0,1fr) clamp(305px,23.8vw,366px);gap:15px;align-items:stretch;flex:1;min-height:585px;height:clamp(585px,calc(100svh - 259px),780px);max-height:830px}.timeline-pane,.story-pane{min-width:0;min-height:0;border:1px solid var(--stroke);border-radius:20px;overflow:hidden;box-shadow:0 23px 50px #0002}.timeline-pane{display:flex;flex-direction:column;background:radial-gradient(ellipse at 83% 44%,#25284b5b,transparent 46%),linear-gradient(145deg,#11192d,#0a1020 76%)}
.viz-toolbar{height:70px;min-height:70px;padding:0 21px;border-bottom:1px solid #a0afd52b;display:flex;align-items:center;justify-content:space-between;gap:12px;z-index:2}.chart-title{display:flex;align-items:center;gap:10px;color:#f3f2ff;white-space:nowrap;font-size:10px;font-weight:830;letter-spacing:.10em}.chart-title-icon{display:grid;place-items:center;width:31px;height:31px;border-radius:9px;background:#9981f722;border:1px solid #ab99ff73;color:#c8b8ff;font-size:17px}.chart-title small{display:block;font-size:9px;color:#7c8ba9;letter-spacing:.1em;margin-top:2px}
.track-controls{display:flex;gap:3px;padding:4px;border-radius:10px;border:1px solid #a4afe632;background:#060b188f}.track-toggle{display:flex;align-items:center;gap:6px;border:1px solid transparent;border-radius:7px;background:transparent;color:#909bbb;white-space:nowrap;padding:7px 9px;font-size:11px;font-weight:740}.track-toggle i{width:7px;height:7px;border-radius:50%;display:inline-block}.idea-key{background:#bea7ff}.compute-key{background:#79caff}.data-key{background:#ecc18a}.track-all-mark{color:#b3a4e9}.track-toggle:hover{color:#f4f2ff}.track-toggle.is-active{background:#69608a65;border-color:#b6a6ff4e;color:#fff}
.chart-main{min-height:0;flex:1;display:flex;flex-direction:column;position:relative}.chart-scroll{width:100%;flex:1;min-height:0;overflow:hidden;display:flex;position:relative}.history-map{width:100%;height:100%;display:block}.era-caption{fill:#5b698b;font-size:10px;font-weight:820;letter-spacing:1.1px}.lane-path{fill:none;stroke-width:3.5;stroke-linejoin:round;stroke-linecap:round;opacity:.88;transition:opacity .22s,stroke-width .22s}.lane-path.idea{stroke:url(#idea-gradient);filter:drop-shadow(0 0 8px #aa8cff)}.lane-path.compute{stroke:url(#compute-gradient);filter:drop-shadow(0 0 8px #72caff)}.lane-path.data{stroke:url(#data-gradient);filter:drop-shadow(0 0 8px #dda674)}.lane-label{font-size:11px;font-weight:850;letter-spacing:.6px}.idea-ink{fill:#c2b0ff}.compute-ink{fill:#92d8ff}.data-ink{fill:#f4c99e}.convergence-title{font-size:11px;fill:#c4b3ff;letter-spacing:.8px;font-weight:830}.convergence-em{fill:#8fa5c3;font-size:10px;font-weight:700;letter-spacing:.35px}.axis-tick{fill:#93a0c1;font-size:11px;letter-spacing:.5px;font-weight:810}.axis-tick.emphasis{fill:#d5c7ff}.axis-note{fill:#556887;letter-spacing:.9px;font-size:10px;font-weight:730}
.milestone{cursor:pointer;outline:none;transition:opacity .2s}.milestone .node-halo{fill:none;stroke-width:1.5;stroke-opacity:0;transition:stroke-opacity .2s}.milestone .node-disc{fill:#11172b;stroke-width:2.2;transition:fill .2s,stroke-width .2s}.milestone .node-core{stroke:none}.milestone .node-year{fill:#aeb8d2;font-weight:820;letter-spacing:.5px;font-size:11px;pointer-events:none}.milestone .node-target{fill:transparent;pointer-events:all}.milestone:hover .node-halo,.milestone.is-active .node-halo,.milestone:focus-visible .node-halo{stroke-opacity:.85}.milestone:hover .node-disc,.milestone.is-active .node-disc{stroke-width:3;fill:#252446}.milestone.is-active .node-halo{animation:pulse 2.4s ease-in-out infinite}@keyframes pulse{50%{stroke-opacity:.37}}
.history-map[data-filter="idea"] .lane-path:not(.idea),.history-map[data-filter="compute"] .lane-path:not(.compute),.history-map[data-filter="data"] .lane-path:not(.data){opacity:.09;filter:none}.history-map[data-filter="idea"] .milestone:not([data-lane="idea"]),.history-map[data-filter="compute"] .milestone:not([data-lane="compute"]),.history-map[data-filter="data"] .milestone:not([data-lane="data"]){opacity:.19}
.chart-help{height:38px;min-height:38px;border-top:1px solid #a2b0df25;padding:0 20px;display:flex;align-items:center;gap:9px;font-size:10px;color:#808da9;white-space:nowrap}.chart-help strong{color:#c2b2ee;font-size:10px;font-weight:830;letter-spacing:.06em}.chart-help-pulse{width:6px;height:6px;border-radius:50%;background:#c2a6ff;box-shadow:0 0 0 4px #aa90ff18,0 0 13px #ae96ff}.help-divider{color:#53627e}.mobile-pan-help{display:none}
.timeline-footer{height:72px;min-height:72px;border-top:1px solid #9da9d52c;background:#0b1325da;padding:0 19px;display:flex;align-items:center;gap:11px}.timeline-footer-heading{display:flex;align-items:center;gap:9px;color:#7f8ba7;font-size:9px;font-weight:760;letter-spacing:.08em;white-space:nowrap}.footer-step{font-size:11px;color:#d8caff}.step-control{width:34px;height:34px;min-width:34px;border-radius:8px;border:1px solid #a4acd351;background:#151c31;color:#e3dfff;font-size:18px;display:grid;place-items:center}.step-control:hover:not(:disabled){background:#6d5ca04d}.step-control:disabled{opacity:.3;cursor:not-allowed}
.time-range{appearance:none;-webkit-appearance:none;flex:1;min-width:40px;height:5px;border-radius:10px;background:linear-gradient(90deg,#b3a4ff var(--progress,81%),#34415c var(--progress,81%));cursor:pointer}.time-range::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;border:4px solid #9c8bf1;background:#ede7ff;box-shadow:0 0 0 4px #9882fe1e}.time-range::-moz-range-thumb{width:12px;height:12px;border:4px solid #9c8bf1;border-radius:50%;background:#ede7ff}
.play-button{border:1px solid #aa98ee5a;border-radius:9px;background:#62519e31;color:#e1d7ff;padding:9px 11px;white-space:nowrap;display:inline-flex;align-items:center;gap:7px;font-size:10px;font-weight:810}.play-button:hover{background:#7f64be66}#play-symbol{font-size:9px}
.story-pane{display:flex;flex-direction:column;position:relative;padding:19px 21px 18px;background:radial-gradient(ellipse at 65% 3%,#3431626e,transparent 41%),linear-gradient(145deg,#161b35,#10172a 77%)}.story-pane:after{content:"";position:absolute;top:0;left:20%;right:20%;height:1px;background:linear-gradient(90deg,transparent,#b8aaff7c,transparent)}.detail-topline{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:15px;color:#a39cce;font-size:9px;font-weight:830;letter-spacing:.12em}.detail-topline-mark{display:flex;align-items:center;gap:8px}.detail-topline-mark span{width:6px;height:6px;border-radius:50%;background:#beadff;box-shadow:0 0 14px #ad97ff}.detail-id{color:#7a86a1}
.visual-box{height:clamp(132px,19vh,191px);min-height:132px;border:1px solid #aaa2ed49;border-radius:14px;background:radial-gradient(ellipse at 50% 44%,#483b7659,transparent 72%),linear-gradient(130deg,#1a2340,#1b1d35);position:relative;overflow:hidden;flex:none}.visual-box[data-kind="compute"]{background:radial-gradient(ellipse at 52% 42%,#227eaa51,transparent 74%),linear-gradient(130deg,#142037,#161c30)}.visual-box[data-kind="data"]{background:radial-gradient(ellipse at 52% 42%,#a3784c53,transparent 74%),linear-gradient(130deg,#241e31,#1c2030)}.visual-grid{position:absolute;inset:0;background-image:linear-gradient(#a4c0ff0d 1px,transparent 1px),linear-gradient(90deg,#a4c0ff0d 1px,transparent 1px);background-size:22px 22px;mask-image:radial-gradient(ellipse,#000,transparent 83%)}.milestone-illustration{position:relative;z-index:1;height:100%;width:100%;display:grid;place-items:center}.milestone-illustration svg{display:block;height:100%;width:min(100%,280px);filter:drop-shadow(0 0 11px #9c7af048)}.milestone-illustration .draw-stroke{stroke:#bca8ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;fill:none}.milestone-illustration .draw-accent{stroke:#85d4fc;stroke-width:2;fill:none;stroke-linecap:round}.milestone-illustration .draw-dot{fill:#d9cdff}.milestone-illustration .draw-ghost{stroke:#b1a4e9;stroke-opacity:.26;fill:none;stroke-width:1.5}.visual-overlay{position:absolute;z-index:2;bottom:0;left:0;right:0;display:flex;justify-content:space-between;gap:7px;padding:12px;background:linear-gradient(transparent,#0d1224bb);font-size:8px;letter-spacing:.08em;font-weight:750;color:#9f9cbc}
.detail-year-row{display:flex;align-items:center;justify-content:space-between;gap:13px;margin-top:16px}.detail-year{font-size:clamp(32px,3.05vw,46px);font-weight:840;line-height:1;letter-spacing:-.08em;color:#e7dcff}.detail-tag{color:#a1e8d4;font-size:8px;font-weight:830;letter-spacing:.05em;border:1px solid #84dfc74a;background:#8de4c01c;border-radius:99px;padding:6px 10px;white-space:nowrap}.detail-title{font-size:clamp(21px,1.7vw,28px);line-height:1.15;letter-spacing:-.056em;margin:12px 0 8px;font-weight:790}.detail-summary{font-size:12px;color:#c6bbed;line-height:1.55;margin:0 0 13px;font-weight:600}.detail-explanation{border-top:1px solid #aeb6dc2c;padding-top:13px;margin-top:auto}.explain-label{display:flex;align-items:center;gap:8px;color:#ac9cdd;font-size:9px;font-weight:820;letter-spacing:.11em}.explain-line{height:6px;width:6px;background:#b19df8;border-radius:50%}.detail-explanation p{font-size:12px;line-height:1.68;color:#aeb3cc;margin:10px 0 12px}.detail-bottom{border-top:1px solid #aeb6dc2a;padding-top:12px;display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:auto}.detail-bottom a{color:#c3b1ff;font-size:11px;font-weight:760}.detail-bottom a:hover{color:#fff}.detail-bottom>span{font-size:8px;color:#687798;letter-spacing:.03em;text-align:right}
.site-footer{min-height:49px;display:flex;justify-content:space-between;align-items:center;gap:20px;color:#72809e;font-size:9px;font-weight:760;letter-spacing:.045em}.footer-left{color:#a59bce}.footer-glint{color:#b49fff;margin-right:6px;font-size:12px}.footer-right{display:flex;align-items:center;gap:12px}.footer-right a{color:#c5b7ef}.footer-separator{height:12px;width:1px;background:#4c5c7b}
/* About and source references modal */
.source-dialog{width:min(550px,calc(100% - 28px));max-height:min(730px,calc(100dvh - 36px));overflow:auto;border:1px solid #a99eff66;border-radius:20px;padding:28px 31px 24px;color:#f1efff;background:linear-gradient(150deg,#1c1e3b,#0f1528);box-shadow:0 30px 140px #000c}.source-dialog::backdrop{background:#030712bd;backdrop-filter:blur(8px)}.dialog-head{display:flex;justify-content:space-between;align-items:center}.dialog-kicker{font-size:10px;letter-spacing:.17em;color:#bbaafa;font-weight:790}.dialog-close{border:1px solid #a6a0dd5e;background:#ffffff0c;color:#fff;border-radius:9px;height:31px;width:31px}.source-dialog h2{font-size:clamp(34px,5vw,48px);line-height:1.11;letter-spacing:-.07em;margin:21px 0 19px}.source-dialog h2 em{color:#b8a6ff;font-style:normal}.source-dialog>p{color:#b4b7d1;font-size:13px;line-height:1.75}.source-dialog>p strong{color:#e7d9ff}.source-dialog h3{font-size:14px;margin:25px 0 11px;color:#e5e1ff}.dialog-sources{display:grid;grid-template-columns:1fr 1fr;gap:8px}.dialog-sources a{font-size:11px;color:#d5caff;line-height:1.4;padding:12px;border:1px solid #a2a5dc30;border-radius:10px;background:#ffffff07}.dialog-sources a:hover{border-color:#a99ff58c}.dialog-sources small{display:block;margin-bottom:5px;color:#888fb3;font-size:8px;letter-spacing:.06em}.dialog-bottom{display:flex;justify-content:space-between;gap:10px;border-top:1px solid #a1a4dc2a;padding-top:15px;margin-top:22px;font-size:10px;color:#8690ae}
/* Laptop / tablet */
@media(max-width:1280px){.app-shell{padding:0 24px}.header-context{font-size:9px}.opening-aside{display:none}.stage{grid-template-columns:minmax(0,1fr) 310px}.detail-bottom>span{display:none}.timeline-footer-heading>span:last-child{display:none}}
@media(max-width:1080px){.topbar{height:65px;min-height:65px}.header-context,.header-divider{display:none}.opening{padding:23px 0}.opening h1{font-size:clamp(29px,4.1vw,39px)}.stage{grid-template-columns:minmax(0,1fr) 290px}.viz-toolbar{height:61px;min-height:61px}.chart-title small{display:none}.track-toggle{padding:6px}.story-pane{padding:15px}.detail-title{font-size:22px}.chart-help{font-size:9px}.chart-help strong{font-size:9px}.timeline-footer{gap:8px;padding:0 12px}.timeline-footer-heading{display:none}}
@media(max-width:850px){.app-shell{padding:0 19px}.opening{padding:27px 0 23px}.opening h1{font-size:clamp(34px,5.5vw,48px)}.stage{display:flex;flex-direction:column;max-height:none;height:auto;min-height:0;flex:none}.timeline-pane{height:clamp(430px,59svh,540px);flex:none}.story-pane{min-height:0}.visual-box{height:180px}.detail-explanation{margin-top:10px}.detail-bottom{margin-top:8px}.chart-scroll{overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#565379 transparent}.history-map{min-width:980px}.mobile-pan-help{display:block;margin-left:auto;color:#ac9cf4}.chart-help{padding:0 15px}.chart-help>span:not(.chart-help-pulse):not(.mobile-pan-help){display:none}.site-footer{padding:17px 0;align-items:flex-start;line-height:1.5}.footer-right>span:first-child{display:none}.footer-separator{display:none}}
@media(max-width:520px){.app-shell{padding:0 14px}.topbar{gap:9px;height:62px;min-height:62px}.brand{font-size:9px;gap:8px}.brand small{font-size:9px}.brand-orbit{width:30px;height:30px}.live-indicator{display:none}.nav-button{padding:8px 10px;font-size:10px}.nav-button svg{height:13px;width:13px}.opening{padding:27px 1px 23px}.opening h1{font-size:clamp(30px,8vw,41px)}.eyebrow{font-size:9px}.intro{font-size:12px}.stage{gap:11px}.timeline-pane,.story-pane{border-radius:16px}.timeline-pane{height:480px}.viz-toolbar{height:auto;min-height:77px;display:block;padding:12px 14px 9px}.chart-title{margin-bottom:8px}.track-controls{width:max-content;max-width:100%}.track-toggle{padding:5px 9px;font-size:10px}.chart-scroll{overflow-x:auto}.history-map{min-width:1050px}.chart-help{min-height:30px;height:30px;font-size:9px}.chart-help strong{font-size:9px}.timeline-footer{height:63px;min-height:63px;padding:0 9px;gap:7px}.step-control{height:30px;width:30px;min-width:30px}.play-button{padding:8px 9px;font-size:9px}.story-pane{padding:16px}.visual-box{height:176px}.detail-title{font-size:25px}.detail-summary,.detail-explanation p{font-size:13px}.detail-bottom>span{display:none}.site-footer{font-size:8px;gap:10px}.footer-right a{white-space:nowrap}.source-dialog{padding:20px}.dialog-sources{grid-template-columns:1fr}}
@media(max-height:760px) and (min-width:851px){.opening{padding:17px 0}.opening h1{font-size:32px}.eyebrow{margin-bottom:7px}.stage{min-height:490px;height:calc(100svh - 222px)}.visual-box{height:125px;min-height:125px}.detail-topline{margin-bottom:9px}.detail-year-row{margin-top:9px}.detail-title{margin:7px 0}.detail-summary{margin-bottom:7px}.detail-explanation{padding-top:8px}.detail-explanation p{margin:7px 0}.site-footer{min-height:40px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}


/* ============================================
   Mobile portrait timeline v2
   A truly native small-screen chart — no sideways
   scrolling of the 1180px desktop illustration.
   ============================================ */
.mobile-map-shell,.mobile-map-intro,.mobile-detail-close{display:none}
.mobile-scrim[hidden]{display:none!important}
.mobile-scrim{display:none}
@media (max-width:850px){
  body{overflow-x:hidden}
  .experience{display:block}
  .opening{padding:24px 0 21px}
  .opening h1{max-width:630px}
  .opening .intro{max-width:640px}
  .stage{display:flex;flex-direction:column;min-height:0;height:auto;max-height:none;gap:0}
  .timeline-pane{width:100%;min-height:0;height:auto;max-height:none;flex:none;border-radius:19px}
  .chart-main{display:block;min-height:0;flex:none;padding:0 10px}
  .chart-scroll,.chart-help{display:none!important}
  .mobile-map-intro{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 11px 5px}
  .mobile-map-badge{font-size:9px;color:#aa99dc;font-weight:820;letter-spacing:.13em}
  .mobile-map-hint{font-size:11px;color:#a5b3d2;font-weight:650;text-align:right}
  .mobile-map-shell{display:block;width:min(100%,390px);margin:0 auto;position:relative;padding:0 0 7px}
  .mobile-map-top{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;gap:7px;max-width:100%;height:39px}
  .mobile-track-label{display:flex;align-items:center;justify-content:center;gap:6px;border:1px solid rgba(180,164,235,.23);background:#161d36b0;border-radius:8px;padding:7px 5px;font-size:9px;font-weight:830;letter-spacing:.06em;white-space:nowrap}
  .mobile-track-label i{height:7px;width:7px;border-radius:50%;background:currentColor;box-shadow:0 0 10px currentColor}
  .mobile-track-idea{color:#c4acff}.mobile-track-compute{color:#8cd1ff}.mobile-track-data{color:#efc28b}
  .mobile-history-map{display:block;width:100%;height:auto;overflow:visible;touch-action:pan-y;user-select:none}
  .mobile-map-bottom{font-size:10px;text-align:center;color:#919cba;letter-spacing:.13em;font-weight:800;margin:-12px 0 15px;position:relative}
  .mobile-era-label{font-size:9px;letter-spacing:1.3px;fill:#7888ad;font-weight:770}
  .mobile-era-guide{stroke:#97a9c7;stroke-opacity:.14;stroke-dasharray:3 8}
  .mobile-lane-line{fill:none;stroke-width:3;stroke-linecap:round;opacity:.87}
  .mobile-lane-line.idea{stroke:url(#mobile-idea-gradient);filter:drop-shadow(0 0 5px #a689ff)}
  .mobile-lane-line.compute{stroke:url(#mobile-compute-gradient);filter:drop-shadow(0 0 5px #70c6ff)}
  .mobile-lane-line.data{stroke:url(#mobile-data-gradient);filter:drop-shadow(0 0 5px #eab785)}
  .mobile-map-dot{cursor:pointer;outline:none}
  .mobile-map-dot .mobile-hit{fill:transparent;pointer-events:all}
  .mobile-map-dot .mobile-disc{fill:#141b33;stroke-width:2;transition:fill .2s,stroke-width .2s}
  .mobile-map-dot .mobile-inner{transition:opacity .2s}
  .mobile-map-dot .mobile-ring{stroke-width:1.6;stroke-opacity:0;fill:none;transition:stroke-opacity .18s}
  .mobile-map-dot .mobile-year-text{font-size:11.5px;fill:#d7dcf1;font-weight:850;letter-spacing:.4px;pointer-events:none}
  .mobile-map-dot.is-active .mobile-ring,.mobile-map-dot:hover .mobile-ring,.mobile-map-dot:focus-visible .mobile-ring{stroke-opacity:.97}
  .mobile-map-dot.is-active .mobile-disc{fill:#363055;stroke-width:3}
  .mobile-map-dot:focus-visible .mobile-ring{stroke-opacity:1;stroke-width:3}
  .mobile-map-dot.is-active .mobile-year-text{fill:#fff}
  .mobile-current-halo{fill:url(#mobile-halo-gradient)}
  .mobile-era-now{fill:#decfff;font-size:12px;font-weight:900;letter-spacing:.11em}
  .mobile-history-map[data-filter="idea"] .mobile-lane-line:not(.idea),
  .mobile-history-map[data-filter="compute"] .mobile-lane-line:not(.compute),
  .mobile-history-map[data-filter="data"] .mobile-lane-line:not(.data){opacity:.12;filter:none}
  .mobile-history-map[data-filter="idea"] .mobile-map-dot:not([data-lane="idea"]),
  .mobile-history-map[data-filter="compute"] .mobile-map-dot:not([data-lane="compute"]),
  .mobile-history-map[data-filter="data"] .mobile-map-dot:not([data-lane="data"]){opacity:.22}
  .mobile-map-dot{transition:opacity .2s}
  .timeline-footer{height:64px;min-height:64px;padding:0 16px}
  .timeline-footer-heading{display:flex}
  .timeline-footer-heading>span:last-child{display:none}
  .site-footer{min-height:57px}
  /* Bottom sheet makes events readable without losing the timeline context. */
  .mobile-scrim{display:block;position:fixed;inset:0;background:rgba(3,5,15,.7);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:189}
  .story-pane{
    position:fixed!important;top:auto!important;bottom:0;left:0;right:0;z-index:190;
    width:100%;height:auto!important;max-height:min(84dvh,770px);min-height:0;
    padding:23px clamp(18px,5vw,32px) max(22px,env(safe-area-inset-bottom,0px));
    border:1px solid #b4a6ff66;border-bottom:0;border-radius:24px 24px 0 0;
    background:radial-gradient(circle at 70% 0%,#37306075,transparent 37%),linear-gradient(145deg,#171e38,#0d1325);
    box-shadow:0 -22px 76px #02030fd9;overflow-y:auto;overscroll-behavior:contain;
    transform:translateY(105%);visibility:hidden;pointer-events:none;
    transition:transform .3s cubic-bezier(.2,.84,.2,1),visibility .3s;
  }
  body.mobile-detail-open{overflow:hidden}
  body.mobile-detail-open .story-pane{transform:translateY(0);visibility:visible;pointer-events:auto}
  .story-pane::before{content:"";display:block;position:absolute;top:9px;left:calc(50% - 23px);width:46px;height:4px;border-radius:10px;background:#d3c5ff78}
  .mobile-detail-close{display:grid;place-items:center;position:absolute;top:26px;right:22px;z-index:2;border:1px solid #a89ae76a;border-radius:10px;width:36px;height:36px;background:#ffffff11;color:#fff;font-size:14px}
  .mobile-detail-close:hover{background:#b3a2ff33}
  .detail-topline{padding-right:45px;margin-top:8px}
  .visual-box{height:clamp(135px,21dvh,186px);min-height:135px}
  .detail-year-row{margin-top:15px}
  .detail-title{font-size:clamp(24px,5vw,32px)}
  .detail-summary,.detail-explanation p{font-size:13px}
  .detail-explanation{margin-top:10px}
  .detail-bottom{padding-bottom:2px}
}
@media(max-width:520px){
  .timeline-pane{height:auto!important;min-height:0}
  .chart-main{padding:0 7px}
  .viz-toolbar{padding:13px 12px 9px}
  .mobile-map-intro{padding:12px 7px 3px;gap:6px}
  .mobile-map-badge{font-size:8px;letter-spacing:.08em}
  .mobile-map-hint{font-size:10px}
  .mobile-map-top{height:37px}
  .mobile-track-label{font-size:9px;letter-spacing:.02em}
  .mobile-map-shell{width:min(100%,360px)}
  .mobile-history-map{width:100%}
  .timeline-footer{height:65px;min-height:65px;gap:8px;padding:0 11px}
  .timeline-footer-heading{display:flex;gap:5px}
  .detail-bottom>span{display:none}
  .footer-right>a{flex:none}
}
@media(max-width:350px){
  .app-shell{padding:0 10px}
  .mobile-map-badge{display:none}
  .mobile-map-intro{justify-content:flex-end}
  .timeline-footer-heading{display:none}
  .play-button{font-size:9px}
}
@media(prefers-reduced-motion:reduce){
  .story-pane{transition:none!important}
  .mobile-map-dot .mobile-disc,.mobile-map-dot .mobile-ring{transition:none!important}
}