/*
 * THE OLD COMPUTER — ABOUT / OUR STORY
 * ------------------------------------
 *
 * Page-only styles. Our shared palette, body type, menu, social icons,
 * TOC 1702 CRT casing, buttons, heritage collage and footer are defined
 * in /toc-theme/css/toc-theme.css and MUST remain shared across pages.
 *
 * Original artwork is intentionally displayed in full without cropping.
 * The history and contributor credits are adapted from the original page.
 */

.about-page {background:#0a0e17}
.about-page .eyebrow {color:var(--green)}
.about-section-kicker {display:block;font-size:11px;letter-spacing:.13em;margin-bottom:21px}
/* Keep the page's large headings out of the universal dropdown and footer. */
.about-page main h2 {font:700 clamp(40px,4.65vw,63px)/1.04 'Space Grotesk',sans-serif;letter-spacing:-.065em;color:var(--cream);margin:0 0 27px}
.about-page main h2 em {font-style:normal;color:var(--orange)}
.about-page main h2 span {color:var(--orange)}

/* Hero: the SAME background artwork treatment and SAME CRT shell as Donate. */
.about-hero {border-bottom:1px solid #2a4047}
.about-hero-grid {position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:35px;align-items:center}
.about-hero-copy {padding:15px 0}
.about-kicker {display:inline-flex;align-items:center;gap:11px;padding:10px 14px;border:1px solid #325444;background:rgba(36,77,58,.15);border-radius:4px;color:var(--green);font:700 11px 'Space Mono',monospace;letter-spacing:.11em}
.about-signal {flex:none;width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 12px rgba(180,245,137,.7)}
.about-hero h1 {color:var(--cream);font-size:clamp(55px,5.1vw,78px);max-width:660px;margin:30px 0 22px}
.about-hero h1 span {color:var(--orange)}
.about-hero-lead {font:700 12px/1.7 'Space Mono',monospace;letter-spacing:.035em;color:var(--cyan);margin:0 0 21px}
.about-hero-text {font-size:17px;line-height:1.78;color:#becbd2;max-width:570px;margin:0 0 29px}
.about-hero-text strong {color:var(--cream)}
.about-actions {display:flex;align-items:center;flex-wrap:wrap;gap:13px}
.about-hero-footnote {display:flex;align-items:center;gap:10px;color:#a4bdb6;font-size:12px;line-height:1.5;margin:25px 0 0}
.about-hero-footnote span {font-size:18px;color:var(--green)}
.about-machine-stage {height:560px}
/* The optional, playable PONG Easter egg stays inside the common CRT shell. */
.about-crt-screen {padding:15px 20px}
.about-crt-screen .screen-top {padding-bottom:5px;margin-bottom:8px;font-size:10px}
.about-pong-heading {display:flex;justify-content:space-between;gap:10px;color:#b9f3ba;font:700 9px/1.5 'Space Mono',monospace;letter-spacing:.08em;margin:0 0 4px}
.about-pong-heading span:last-child {color:#72b994}
.about-pong-field {position:relative;width:min(100%,330px);margin:0 auto;background:radial-gradient(ellipse at center,rgba(39,91,58,.15),transparent 75%),#071f1c;border-top:1px solid rgba(155,239,168,.13);border-bottom:1px solid rgba(155,239,168,.13)}
.about-pong-field canvas {display:block;width:100%;height:auto;image-rendering:pixelated;filter:drop-shadow(0 0 3px rgba(143,255,154,.4))}
.about-pong-field.is-playing canvas {cursor:ns-resize;touch-action:none}
.about-pong-field:focus-visible {outline:2px solid #b9ff9f;outline-offset:2px}
.about-pong-launch,.about-pong-result {position:absolute;z-index:1;left:0;right:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;pointer-events:none}
.about-pong-launch {bottom:20px}
.about-pong-result {inset:34px 0 0;background:rgba(2,22,18,.76)}
.about-pong-result strong {max-width:90%;color:#c4ffab;font:700 13px/1.4 'Space Mono',monospace;text-shadow:0 0 8px rgba(142,255,148,.65)}
.about-pong-launch[hidden],.about-pong-result[hidden],.about-pong-options [hidden] {display:none}
.about-pong-start {pointer-events:auto;border:1px solid #a3e59c;border-radius:2px;padding:6px 11px;background:#173e2f;color:#d1ffc4;font:700 9px/1.4 'Space Mono',monospace;letter-spacing:.055em;cursor:pointer;box-shadow:0 0 12px rgba(120,225,144,.21)}
.about-pong-start:hover,.about-pong-start:focus-visible {color:#061c19;background:#b9ff9f;outline:1px solid #d8ffbd;outline-offset:1px}
.about-pong-noscript {position:absolute;inset:0;display:grid;place-content:center;text-align:center;color:var(--green);font:12px 'Space Mono',monospace}
.about-pong-status {display:flex;align-items:center;justify-content:center;gap:8px;margin-top:7px;color:#b8efae;font:700 8px/1.4 'Space Mono',monospace;letter-spacing:.07em}
.about-pong-status .cursor {height:9px;width:5px}
.about-pong-options {display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:5px;color:#86b997;font:700 8px/1.4 'Space Mono',monospace;letter-spacing:.02em}
.about-pong-options label {display:inline-flex;align-items:center;gap:3px}
.about-pong-options select,.about-pong-options button {font:inherit;color:#bff6b2;background:#0a2822;border:1px solid #3c785c;border-radius:2px;padding:2px 4px;cursor:pointer}
.about-pong-options :is(select,button):focus-visible {outline:2px solid #b9ff9f;outline-offset:2px}

/* What the archive preserves, including artwork from the original About. */
.about-mission-section {padding:110px 0 98px;background:radial-gradient(ellipse at 0 20%,rgba(68,94,89,.13),transparent 55%),#0c1420}
.about-mission-grid {display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:70px;align-items:center}
.about-mission-copy {max-width:650px}
.about-mission-copy p {font-size:16px;line-height:1.83;color:#b5c6cc;margin-bottom:19px}
.about-mission-copy .about-intro,.about-founder-copy .about-intro {font-size:20px;line-height:1.55;color:var(--cream)}
.about-text-link {display:inline-flex;align-items:center;gap:9px;border-bottom:1px solid #5c855e;padding-bottom:7px;font:700 12px 'Space Mono',monospace;color:var(--green);transition:color .2s,border-color .2s}
.about-text-link:hover,.about-text-link:focus-visible {color:var(--orange);border-color:var(--orange)}
.about-inline-link {color:var(--green);text-decoration:underline;text-decoration-color:#557c68;text-underline-offset:3px}
.about-inline-link:hover,.about-inline-link:focus-visible {color:var(--orange)}
.about-archive-panel {max-width:430px;justify-self:center;width:100%;padding:20px 23px 16px;background:#172936;border:1px solid #486366;border-radius:6px;box-shadow:0 17px 48px rgba(0,0,0,.22);transform:rotate(2deg)}
.about-panel-top {display:flex;justify-content:space-between;gap:12px;align-items:center;color:var(--green);font:700 10px/1.5 'Space Mono',monospace;letter-spacing:.035em}
.about-panel-top span {color:#8b9fa6;text-align:right}
.about-archive-image {margin:22px 0 13px;padding:24px 14px;background:#06090f;border:1px solid #3b4850;text-align:center}
.about-archive-image img {display:block;max-width:100%;height:auto;margin:auto}
.about-archive-panel p {text-align:center;color:#bbccd0;font-size:12px;line-height:1.6;margin:0 0 20px}
.about-panel-bottom {display:flex;justify-content:space-between;border-top:1px dashed #425d63;padding-top:13px;color:#759398;font:700 9px 'Space Mono',monospace;letter-spacing:.04em}
.about-panel-bottom span {color:var(--orange)}

/* The seven 2003 collecting commitments are reproduced here as a slightly
   angled archival sheet, not a link out to a retired standalone page. */
.about-code-grid {display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);align-items:center;gap:90px;border-top:1px dashed #3c5961;margin-top:85px;padding-top:80px}
.about-code-story {max-width:440px}
.about-code-story h3 {margin:0 0 28px;color:var(--cream);font:700 clamp(36px,4vw,55px)/1.06 'Space Grotesk',sans-serif;letter-spacing:-.06em}
.about-code-story h3 em {font-style:normal;color:var(--orange)}
.about-code-story p {margin:0 0 20px;color:#bacbd0;font-size:15px;line-height:1.84}
.about-code-story .about-text-link {margin-top:8px}
.about-code-paper {position:relative;box-sizing:border-box;max-width:650px;width:100%;justify-self:center;margin:7px 0 5px;padding:37px 43px 25px;color:#2d3431;background:repeating-linear-gradient(0deg,transparent 0,transparent 29px,rgba(102,112,95,.065) 30px),linear-gradient(140deg,#eee6d2,#dcd6bd 92%);border:1px solid #b4ad91;border-radius:2px;box-shadow:0 28px 56px rgba(0,0,0,.42),-5px 7px 0 #b1ad94;transform:rotate(2.3deg)}
.about-code-paper:before {content:"";position:absolute;top:0;right:0;width:39px;height:39px;background:linear-gradient(225deg,#0c1420 0 49%,#c8c2a9 50% 100%);box-shadow:-1px 2px 4px rgba(0,0,0,.15)}
.about-code-paper-stamp {display:flex;justify-content:space-between;gap:10px;color:#59645c;font:700 9px/1.6 'Space Mono',monospace;letter-spacing:.1em}
.about-code-paper-stamp span {color:#788277}
.about-code-paper-rule {height:3px;margin:11px 0 22px;background:linear-gradient(90deg,#637e6c,#98a790 70%,transparent)}
.about-code-paper-overline {margin:0 0 7px;color:#657268;font:700 9px/1.6 'Space Mono',monospace;letter-spacing:.1em}
.about-code-paper h4 {margin:0 0 15px;color:#263b35;font:700 clamp(26px,3vw,38px)/1.1 Georgia,serif;letter-spacing:-.04em}
.about-code-paper-intro {margin:0 0 19px;color:#3c4c44;font:italic 13px/1.6 Georgia,serif}
.about-code-paper-list {list-style:none;counter-reset:collectors-code;display:grid;gap:14px;margin:0;padding:0}
.about-code-paper-list li {position:relative;counter-increment:collectors-code;margin:0;padding-left:34px;color:#26342f;font:13px/1.58 Georgia,serif}
.about-code-paper-list li:before {content:counter(collectors-code,decimal-leading-zero);position:absolute;top:1px;left:0;color:#496c5d;font:700 12px/1.4 'Space Mono',monospace}
.about-code-paper figcaption {margin-top:25px;padding-top:13px;border-top:1px solid #aab19a;color:#6a776b;text-align:right;font:700 9px/1.5 'Space Mono',monospace;letter-spacing:.08em}

/* A timeline brings the founder's original first-person history into focus. */
.about-timeline-section {padding:105px 0 115px;background:#101a28;border-top:1px solid #263b45;border-bottom:1px solid #2d434c}
.about-section-heading {display:flex;align-items:end;justify-content:space-between;gap:34px;margin-bottom:46px}
.about-section-heading h2 {margin-bottom:0}
.about-section-heading>p {max-width:340px;margin:0 0 4px;color:#aebec5;font-size:15px;line-height:1.75}
.about-timeline {list-style:none;position:relative;display:grid;gap:0;margin:0;padding:0}
.about-timeline:before {content:'';position:absolute;top:26px;bottom:36px;left:182px;width:2px;background:linear-gradient(var(--green),#365c65)}
.about-timeline li {position:relative;display:grid;grid-template-columns:140px 30px minmax(0,1fr) 173px;gap:25px;align-items:start;padding:24px 0;border-bottom:1px solid #31414d}
.about-timeline li:first-child {border-top:1px solid #31414d}
.about-timeline-year {padding-top:4px;color:var(--orange);font:700 clamp(19px,2.3vw,28px) 'Space Grotesk',sans-serif;letter-spacing:-.04em}
.about-timeline-dot {z-index:1;width:13px;height:13px;margin:10px auto 0;background:var(--green);border:3px solid #142534;box-shadow:0 0 0 3px #4b7b69,0 0 15px rgba(180,245,137,.45)}
.about-timeline-detail h3 {color:var(--cream);font:700 20px 'Space Grotesk',sans-serif;letter-spacing:-.02em;margin:0 0 9px}
.about-timeline-detail p {color:#adc1c6;font-size:14px;line-height:1.75;max-width:660px;margin:0}
.about-timeline-tag {justify-self:end;margin-top:7px;padding:7px 9px;border:1px dashed #4b6869;color:#85b5aa;white-space:nowrap;font:700 9px 'Space Mono',monospace}

/* An original, un-cropped 2002 photo is the founder section's focal point. */
.about-founder-section {padding:115px 0 110px;background:radial-gradient(ellipse at 0 40%,rgba(53,87,94,.17),transparent 52%),#0a111d}
.about-founder-grid {display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:80px;align-items:center}
.about-founder-photo-area {position:relative;max-width:460px;margin:0 auto;width:100%}
.about-photo-file {background:#c7c5b6;color:#16272d;padding:16px 17px 21px;transform:rotate(-3deg);border-radius:3px;box-shadow:0 25px 65px rgba(0,0,0,.42)}
.about-photo-heading {display:flex;justify-content:space-between;gap:12px;color:#41534e;font:700 10px 'Space Mono',monospace;letter-spacing:.03em}
.about-founder-photo {display:block;max-width:100%;height:auto;margin:22px auto 18px;border:7px solid #e3e0d2;box-shadow:0 0 0 1px #8d988e;object-fit:contain}
.about-photo-file>p {display:flex;justify-content:space-between;align-items:center;gap:10px;margin:0;font:700 18px 'Space Grotesk',sans-serif;letter-spacing:-.02em}
.about-photo-file>p span {font:700 8px 'Space Mono',monospace;letter-spacing:0;text-align:right}
.about-avatar-stamp {position:absolute;bottom:-30px;right:-24px;display:flex;align-items:center;gap:13px;background:#152a34;padding:13px 15px;border:1px solid #4f716a;transform:rotate(6deg);box-shadow:0 12px 28px rgba(0,0,0,.4)}
.about-avatar-stamp img {width:67px;height:auto;border:2px solid #8cb0a2}
.about-avatar-stamp span {font:700 9px/1.7 'Space Mono',monospace;color:var(--green)}
.about-founder-copy {max-width:710px}
.about-founder-copy p {font-size:15px;line-height:1.84;color:#b4c3cc;margin:0 0 18px}
.about-founder-actions {display:flex;flex-wrap:wrap;align-items:center;gap:20px;margin-top:28px}
.about-contact-hint {color:#97b1b2;font:11px/1.7 'Space Mono',monospace}

/* Credits to the team named on the original About page, with no invented faces. */
.about-crew-section {padding:108px 0 113px;background:#101928;border-top:1px solid #2c414b}
.about-crew-heading {margin-bottom:41px}
.about-crew-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.about-crew-card {display:grid;grid-template-columns:56px minmax(0,1fr);align-items:start;gap:16px;min-width:0;padding:28px 22px 26px;background:linear-gradient(155deg,#1c303b,#14232f);border:1px solid #355358;border-top:2px solid #74b992;border-radius:5px;box-shadow:0 12px 24px rgba(0,0,0,.1)}
.about-crew-icon {display:grid;place-items:center;width:56px;height:56px;background:#0e242c;border:2px solid #4c8f79;color:var(--green);box-shadow:inset 0 0 0 4px #173840;font:700 21px 'Space Mono',monospace;text-shadow:0 0 12px rgba(180,245,137,.35)}
.about-crew-icon--avatar {overflow:hidden;padding:3px;border-radius:5px;box-sizing:border-box;box-shadow:inset 0 0 0 2px #173840,0 2px 11px rgba(0,0,0,.22)}
.about-crew-icon--avatar img {display:block;width:100%;height:100%;object-fit:contain;image-rendering:auto}
.about-crew-role {color:var(--green);font:700 9px/1.7 'Space Mono',monospace;letter-spacing:.025em}
.about-crew-card h3 {margin:8px 0 11px;color:var(--cream);font:700 22px/1.18 'Space Grotesk',sans-serif;letter-spacing:-.035em;overflow-wrap:anywhere}
.about-crew-card h3 small {display:block;margin-top:4px;font:11px 'DM Sans',sans-serif;color:#a9bcc5;letter-spacing:0}
.about-crew-card p {font-size:13px;line-height:1.75;color:#b2c5c9;margin:0}
.about-crew-card--memorial {border-top-color:#e5bd9f;background:linear-gradient(155deg,#253638,#16252f)}
.about-crew-tribute {grid-column:1/-1;margin-top:4px;padding-top:16px;border-top:1px dashed rgba(226,192,160,.4)}
.about-crew-tribute span {display:block;color:#e8c7a9;font:700 10px/1.6 'Space Mono',monospace;letter-spacing:.035em;margin-bottom:9px}
.about-crew-tribute p {font-style:italic;color:#d6d2c5;line-height:1.76}
.about-extra-thanks {display:flex;align-items:center;gap:24px;margin-top:21px;padding:23px 30px;border:1px dashed #577168;background:rgba(25,49,53,.35);border-radius:5px}
.about-extra-symbol {flex:none;color:var(--green);font:55px 'Space Grotesk',sans-serif;text-shadow:0 0 18px rgba(180,245,137,.45)}
.about-extra-thanks .eyebrow {font-size:9px}
.about-extra-thanks h3 {margin:7px 0;color:var(--cream);font:700 22px 'Space Grotesk',sans-serif}
.about-extra-thanks p {margin:0;color:#b1c5c7;font-size:13px;line-height:1.65}

/* TV show: the prominent editorial chapter and the complete, uncropped reel.
   It replaces the duplicate archive cards/old standalone film-photo feature.
   Seven real photos, original notes, and no dependence on the old gallery URL.
   Square sprocket holes are CSS, never painted over the source photographs. */
.about-tv-section {padding:111px 0 110px;background:radial-gradient(ellipse at 92% 4%,rgba(58,115,105,.18),transparent 56%),#0b1420;border-top:1px solid #35515c}
.about-tv-intro {display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:72px;align-items:end;margin-bottom:66px}
.about-tv-headline h2 {font-size:clamp(52px,5.5vw,76px);line-height:.98;margin-bottom:25px}
.about-tv-standfirst {max-width:440px;font:700 19px/1.6 'Space Grotesk',sans-serif;color:var(--orange);margin:0}
.about-tv-story p {font-size:15px;line-height:1.84;color:#b9c9d0;margin:0 0 16px}
.about-tv-story p:last-child {margin-bottom:0}
.about-tv-story strong {color:var(--cream)}
.about-tv-story em {color:#e6d9b8}
.about-reel-shell {position:relative;background:linear-gradient(155deg,#1a2934,#111922);border:1px solid #516c6b;border-radius:6px;box-shadow:0 23px 60px rgba(0,0,0,.32);overflow:hidden}
.about-reel-label {display:flex;justify-content:space-between;align-items:center;gap:14px;padding:19px 32px;color:var(--green);font:700 10px/1.6 'Space Mono',monospace;letter-spacing:.08em;border-bottom:1px solid #40555b}
.about-reel-label span:first-child {display:flex;align-items:center;gap:11px}
.about-reel-label i {display:block;width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green)}
.about-reel-label output {color:var(--orange);font:inherit}
.about-reel-window {overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.about-reel-window::-webkit-scrollbar {display:none}
.about-reel-window:focus-visible {outline:3px solid var(--green);outline-offset:-3px}
.about-reel-track {display:flex;position:relative;width:100%}
.about-reel-slide {flex:none;width:100%;min-width:0;box-sizing:border-box;scroll-snap-align:start;margin:0;padding:44px 56px 36px}
.about-reel-frame {position:relative;max-width:810px;width:100%;box-sizing:border-box;padding:35px 22px;background:linear-gradient(145deg,#292c30,#12161b 70%,#32353a);border:2px solid #616d6c;box-shadow:0 18px 40px rgba(0,0,0,.4),inset 0 0 0 3px #0d1115;transform:rotate(-1.3deg);margin:0 auto}
.about-reel-frame:before,.about-reel-frame:after {content:'';position:absolute;left:20px;right:20px;height:13px;background:repeating-linear-gradient(90deg,#091522 0 16px,#292d33 16px 41px);border-top:1px solid rgba(166,173,166,.18);border-bottom:1px solid rgba(166,173,166,.18)}
.about-reel-frame:before {top:9px}
.about-reel-frame:after {bottom:9px}
.about-reel-frame img {display:block;width:100%;max-width:100%;height:auto;object-fit:contain;padding:4px;background:#03070b;border:1px solid #687574;box-sizing:border-box}
.about-reel-caption {display:block;max-width:780px;min-height:136px;box-sizing:border-box;margin:30px auto 0;padding:18px 24px 19px;border-left:3px solid var(--green);background:rgba(9,24,33,.42)}
.about-reel-caption>span {display:flex;align-items:baseline;flex-wrap:wrap;gap:11px;color:var(--green);font:700 10px/1.6 'Space Mono',monospace;letter-spacing:.05em}
.about-reel-caption b {font-weight:700;color:var(--cream)}
.about-reel-caption p {margin:9px 0 0;font-size:15px;line-height:1.69;color:#c2d1d3}
.about-reel-controls {display:flex;justify-content:center;align-items:center;gap:14px;flex-wrap:wrap;padding:26px 22px 27px;border-top:1px solid #3a5559;background:#12212c}
.about-reel-controls button {cursor:pointer;font-family:'Space Mono',monospace;font-size:10px;font-weight:700;letter-spacing:.04em;border-radius:4px}
.about-reel-arrow {display:inline-flex;align-items:center;justify-content:center;gap:10px;min-width:110px;min-height:43px;padding:9px 14px;background:transparent;border:1px solid #51736f;color:var(--green)}
.about-reel-arrow:not(:disabled):hover,.about-reel-arrow:focus-visible {border-color:var(--green);color:var(--cream);background:#1c4143}
.about-reel-arrow:disabled {opacity:.35;cursor:default}
.about-reel-arrow span {font-size:15px}
.about-reel-dots {display:flex;justify-content:center;align-items:center;gap:6px}
.about-reel-dots button {min-width:34px;min-height:34px;border:1px solid #425c61;background:#14232c;color:#9cafb0}
.about-reel-dots button[aria-current="true"] {color:#0e2019;background:var(--green);border-color:var(--green);box-shadow:0 0 16px rgba(172,243,142,.28)}
.about-reel-dots button:not([aria-current="true"]):hover,.about-reel-dots button:focus-visible {border-color:var(--green);color:var(--cream)}
.about-reel-play {min-width:120px;min-height:43px;padding:9px 13px;background:#314c4b;border:1px solid #6a9990;color:#d2f5ce}
.about-reel-play:hover,.about-reel-play:focus-visible,.about-reel-play[aria-pressed="true"] {background:#2b624f;color:var(--cream);border-color:var(--green)}
.about-tv-afterword {display:flex;align-items:flex-start;gap:24px;max-width:850px;margin:48px auto 0;padding:22px 25px;border-top:1px dashed #50776e;border-bottom:1px dashed #50776e}
.about-tv-afterword-icon {flex:none;color:var(--green);font-size:36px;text-shadow:0 0 14px rgba(172,243,142,.5)}
.about-tv-afterword p {margin:0;color:#b9cbd0;font-size:14px;line-height:1.8}
.about-tv-afterword em {color:var(--orange)}

/* Same heritage collage, final message and shared CTA style as our other pages. */
.about-last-section {position:relative;overflow:hidden;padding:92px 0;background:linear-gradient(90deg,rgba(15,45,47,.94),rgba(13,35,47,.9)),url('/toc-theme/images/toc-legacy-system-collage.gif') center/auto 480px repeat;border-top:1px solid #3d615f}
.about-last-grid {display:flex;align-items:center;justify-content:space-between;gap:65px}
.about-last-grid h2 {margin:0 0 18px}
.about-last-grid p {max-width:670px;color:#c4d4d2;font-size:16px;line-height:1.78;margin:0}
.about-last-actions {flex:none;display:flex;flex-direction:column;align-items:flex-start;gap:20px}

/* Shared header and footer already have their own responsive breakpoints. */
@media(max-width:1080px) {
  .about-hero-grid {gap:20px}
  .about-mission-grid,.about-founder-grid {gap:44px}
  .about-code-grid {gap:48px}
  .about-tv-intro {gap:40px}
  .about-timeline li {grid-template-columns:105px 25px minmax(0,1fr);gap:20px}
  .about-timeline:before {left:137px}
  .about-timeline-tag {display:none}
  .about-crew-card {grid-template-columns:1fr;gap:14px}
}
@media(max-width:850px) {
  .about-hero {padding:70px 0}
  .about-hero-grid,.about-mission-grid,.about-founder-grid,.about-tv-intro {grid-template-columns:1fr}
  .about-hero-copy {max-width:680px}
  .about-machine-stage {max-width:550px;width:100%;margin:0 auto}
  .about-mission-section,.about-timeline-section,.about-founder-section,.about-crew-section,.about-tv-section {padding:75px 0}
  .about-archive-panel {max-width:510px;margin-top:14px}
  .about-code-grid {grid-template-columns:1fr;gap:38px;margin-top:68px;padding-top:65px}
  .about-code-story {max-width:660px}
  .about-code-paper {max-width:670px;transform:rotate(1deg)}
  .about-section-heading {align-items:flex-start;flex-direction:column;gap:18px}
  .about-section-heading>p {max-width:640px}
  .about-founder-photo-area {max-width:340px;margin:15px auto 65px}
  .about-founder-copy {max-width:700px}
  .about-crew-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
  .about-tv-intro {gap:27px;margin-bottom:47px}
  .about-tv-story {max-width:740px}
  .about-reel-slide {padding:35px 24px 26px}
  .about-reel-controls {gap:10px}
  .about-last-grid {align-items:flex-start;flex-direction:column;gap:30px}
}
@media(max-width:620px) {
  .about-hero {padding:56px 0 65px}
  .about-kicker {font-size:9px;letter-spacing:.04em}
  .about-hero h1 {font-size:clamp(47px,11vw,67px)}
  .about-hero-text {font-size:15px}
  .about-actions {align-items:stretch;flex-direction:column}
  .about-actions .button {width:100%}
  .about-machine-stage {height:440px}
  .about-machine-stage .crt {transform:rotate(-3deg) scale(.81);transform-origin:center}
  .about-crt-screen {padding:15px 15px}
  .about-pong-heading {font-size:8px}
  .about-page main h2 {font-size:clamp(37px,9vw,52px)}
  .about-mission-section,.about-timeline-section,.about-founder-section,.about-crew-section,.about-tv-section {padding:64px 0}
  .about-mission-copy p,.about-founder-copy p {font-size:14px}
  .about-mission-copy .about-intro,.about-founder-copy .about-intro {font-size:18px}
  .about-archive-panel {padding:15px;transform:none}
  .about-code-grid {margin-top:53px;padding-top:54px;gap:29px}
  .about-code-story h3 {font-size:clamp(34px,9vw,46px)}
  .about-code-story p {font-size:14px}
  .about-code-paper {padding:29px 22px 22px;transform:rotate(.5deg)}
  .about-code-paper h4 {font-size:clamp(26px,7vw,34px)}
  .about-code-paper-list {gap:13px}
  .about-code-paper-list li {font-size:12px;line-height:1.6;padding-left:30px}
  .about-code-paper-list li:before {font-size:11px}
  .about-timeline:before {left:95px;top:29px}
  .about-timeline li {grid-template-columns:72px 17px minmax(0,1fr);gap:14px;padding:21px 0}
  .about-timeline-year {font-size:17px}
  .about-timeline-dot {width:11px;height:11px}
  .about-timeline-detail h3 {font-size:17px}
  .about-timeline-detail p {font-size:12px}
  .about-founder-photo-area {max-width:290px}
  .about-avatar-stamp {right:-8px;bottom:-23px;padding:9px}
  .about-avatar-stamp img {width:45px}
  .about-crew-grid {grid-template-columns:1fr}
  .about-crew-card {grid-template-columns:54px 1fr;padding:23px 19px}
  .about-extra-thanks {align-items:flex-start;padding:18px;gap:15px}
  .about-extra-symbol {font-size:40px}
  .about-extra-thanks h3 {font-size:18px}
  .about-tv-headline h2 {font-size:clamp(44px,11vw,62px)}
  .about-tv-standfirst {font-size:16px}
  .about-tv-story p {font-size:14px}
  .about-reel-label {padding:14px 15px;font-size:8px;flex-wrap:wrap}
  .about-reel-slide {padding:25px 12px 20px}
  .about-reel-frame {padding:26px 10px;transform:rotate(-.8deg)}
  .about-reel-frame:before,.about-reel-frame:after {left:9px;right:9px;height:11px;background:repeating-linear-gradient(90deg,#091522 0 11px,#292d33 11px 28px)}
  .about-reel-frame:before {top:7px}
  .about-reel-frame:after {bottom:7px}
  .about-reel-caption {padding:15px 13px;min-height:200px;margin-top:22px}
  .about-reel-caption>span {font-size:9px}
  .about-reel-caption p {font-size:12px;line-height:1.7}
  .about-reel-controls {display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:17px 13px}
  .about-reel-arrow {min-width:0;min-height:40px}
  .about-reel-dots {grid-row:2;grid-column:1/-1;gap:5px}
  .about-reel-dots button {min-width:33px;min-height:33px}
  .about-reel-play {grid-row:3;grid-column:1/-1;min-height:41px}
  .about-tv-afterword {padding:16px;gap:11px;margin-top:34px}
  .about-tv-afterword-icon {font-size:26px}
  .about-tv-afterword p {font-size:12px}
  .about-last-section {padding:67px 0}
  .about-last-actions,.about-last-actions .button {width:100%}
}
@media(prefers-reduced-motion:reduce) {
  .about-reel-window {scroll-behavior:auto}
}