.time-machine-hero{background-color:#f5e8cd!important;background-image:radial-gradient(ellipse at 0 0,#fff7e3,transparent 70%),radial-gradient(#8f593e18 .8px,transparent .8px)!important;background-size:auto,7px 7px!important}
.time-machine-hero .hero-inner{grid-template-columns:1fr 1fr;max-width:1240px;padding:58px 40px 66px;gap:64px}
.time-machine-hero h1{font-size:clamp(46px,5.3vw,76px)!important;line-height:1.1;letter-spacing:-.04em;max-width:600px}
.time-machine-hero h1 em{font-size:.94em;line-height:1.15;color:#a34329;position:relative}
.time-machine-hero .hero-description{max-width:39ch;font-size:17px!important}
.time-machine-hero .hero-kicker{font-size:10px!important;line-height:1.7;letter-spacing:.13em}
.time-machine-hero .hero-play{text-decoration:none;color:#fff5e1!important}
.gumti-photo-memory{display:flex;align-items:center;gap:19px;margin-top:35px;color:#72543b;font:italic 17px/1.5 Georgia,serif}
.gumti-photo-memory img{object-fit:cover;border:5px solid #fff8e9;box-shadow:0 5px 15px #6b43232b;transform:rotate(-7deg);flex:none;border-radius:2px}
.gumti-photo-memory strong{font-weight:400}.gumti-photo-memory small{display:block;font:11px/1.5 system-ui,sans-serif;letter-spacing:.1em;margin-top:9px}.memory-spark{font:48px Georgia,serif;color:#a34329}
.memory-machine{min-width:0;position:relative;padding:25px;background:linear-gradient(130deg,#244a3f,#102e27);color:#fff2d6;border-radius:20px;box-shadow:0 10px 0 #10251e,0 24px 42px #32231238;border:1px solid #6a8165;scroll-margin-top:180px;animation:machine-arrival .7s ease-out both}
.memory-machine:before,.memory-machine:after{content:'+';position:absolute;top:9px;left:10px;color:#a9b494;font:15px monospace}.memory-machine:after{left:auto;right:10px}
.machine-top{display:flex;align-items:center;justify-content:space-between;gap:10px;font:10px/1.4 system-ui,sans-serif;letter-spacing:.18em;margin-bottom:18px}.machine-light{width:7px;height:7px;background:#e8b161;border-radius:50%;box-shadow:0 0 12px #e8b16199;flex:none}
.era-switches{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;background:#0d241e;padding:5px;border-radius:8px;margin-bottom:20px}
.era-switches button{min-height:43px;border:1px solid transparent;background:transparent;color:#d2d9c8;font:600 14px system-ui,sans-serif;border-radius:5px;cursor:pointer}
.era-switches button[aria-pressed=true]{background:#e3bd77;border-color:#f1d59c;color:#2f2b20;box-shadow:0 2px 0 #aa8247}.era-switches button:hover{border-color:#e3bd77}
.tape-face{position:relative;background:#efdcb5;border:7px solid #1c332a;border-radius:10px;padding:12px 16px 9px;color:#383327;box-shadow:0 0 0 1px #869276}
.tape-caption,.tape-years{display:flex;justify-content:space-between;gap:8px;font:8px/1.6 system-ui,sans-serif;letter-spacing:.12em}.tape-title{font:italic 25px/1.3 Georgia,serif;margin:9px 0 11px;min-height:33px}.tape-reels{display:flex;align-items:center;justify-content:space-around;height:66px;background:#352e26;border-radius:9px;border:4px solid #aa5837;margin-bottom:8px}.tape-reels i{width:45px;height:45px;display:block;border-radius:50%;border:6px solid #cebf98;background:repeating-conic-gradient(#ece1bf 0 20deg,#4b493b 20deg 60deg);animation:reel-arrival 2.4s ease-out 1}.tape-reels span{width:60px;height:24px;border:3px solid #1c241e;background:linear-gradient(90deg,#887147,#c0a671,#887147)}
.era-context p{color:#d9ddca;font:14px/1.7 system-ui,sans-serif;margin:17px 0 12px;min-height:72px}
.era-preview{padding:0;margin:0 0 18px;list-style:none}.era-preview li{display:flex;align-items:center;gap:12px;border-top:1px solid #c8d2a826;padding:10px 0;margin:0}.era-preview li>span:first-child{color:#dabd87;font:11px monospace}.era-preview li>span:last-child{margin-left:auto;color:#97ae96}.era-preview li>div{min-width:0}.era-preview strong{display:block;font:500 13px/1.4 system-ui,sans-serif}.era-preview small{display:block;color:#acbfae;font:10px/1.6 system-ui,sans-serif}
.machine-play{width:100%;display:flex;align-items:center;justify-content:center;gap:13px;border:1px solid #e7c181;border-radius:7px;padding:14px 10px;min-height:49px;background:#e3bd77;color:#26352b;font:700 14px system-ui,sans-serif;box-shadow:0 4px 0 #927a4e;cursor:pointer;transition:transform .2s}.machine-play:hover{transform:translateY(-2px)}
.machine-share{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:13px}.machine-share button,.machine-share a{background:none;border:0;color:#e7d4ac!important;text-decoration:none;padding:10px 0;font:12px/1.5 system-ui,sans-serif;min-height:44px;cursor:pointer}.machine-share button:hover,.machine-share a:hover{text-decoration:underline}.machine-fineprint{margin:0;text-align:center;color:#afc0ac;font:10px/1.5 system-ui,sans-serif}
.gumti-journal{margin:64px 0;padding:0}.journal-top{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:24px}.journal-top h2{font:clamp(30px,4vw,44px)/1.2 Georgia,serif;margin:8px 0;color:#f1e3c3}.journal-top a{color:#e8bd79;min-height:44px;display:flex;align-items:center}.journal-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.journal-card{display:block;position:relative;padding:28px 24px;min-height:285px;background:#ecdcb9;color:#362d22!important;border-radius:3px 3px 24px 3px;text-decoration:none;border:1px solid #baa47e;transition:transform .2s}.journal-card:nth-child(2){background:#c5d2bd;transform:rotate(1deg)}.journal-card:nth-child(3){background:#dcb6a3;transform:rotate(-1deg)}.journal-card:hover{transform:translateY(-5px)}.journal-card .journal-number{display:block;font:italic 56px Georgia,serif;color:#775d425e;margin-bottom:22px}.journal-card small{font:10px/1.5 system-ui,sans-serif;letter-spacing:.13em;text-transform:uppercase;color:#65513f}.journal-card h3{font:26px/1.2 Georgia,serif;margin:12px 0}.journal-card p{font:14px/1.7 system-ui,sans-serif}.journal-card b{display:block;margin-top:20px;font:600 12px system-ui,sans-serif}
.gumti-story{max-width:760px;margin:auto}.gumti-story .story-deck{font:22px/1.6 Georgia,serif;color:#d4b687}.gumti-story h2{font:30px/1.3 Georgia,serif;color:#efd7ab;margin-top:42px}.gumti-story p{font:18px/1.9 system-ui,sans-serif;color:#e2d7c1}.story-callout{padding:26px;border-left:3px solid #d3a459;background:#334334;margin:32px 0}.story-byline{font:12px/1.5 system-ui,sans-serif;color:#b6ae9a}.story-links{display:flex;flex-wrap:wrap;gap:12px;margin:32px 0}.story-links a{padding:12px 18px;border:1px solid #a88b61;border-radius:5px}
@keyframes machine-arrival{from{opacity:0;transform:translateY(15px) rotate(2deg)}to{opacity:1;transform:none}}@keyframes reel-arrival{to{transform:rotate(360deg)}}
@media(max-width:900px){.time-machine-hero .hero-inner{gap:28px;padding:38px 24px 48px}.memory-machine{padding:21px}.time-machine-hero h1{font-size:49px!important}.tape-title{font-size:22px}.memory-spark{display:none}.journal-grid{gap:12px}.journal-card{padding:23px 18px}}
@media(max-width:700px){.time-machine-hero .hero-inner{grid-template-columns:1fr;padding:30px 20px 42px;gap:33px}.time-machine-hero h1{font-size:clamp(39px,9vw,58px)!important}.time-machine-hero .hero-handnote{margin-bottom:17px}.time-machine-hero .hero-description{font-size:16px!important}.time-machine-hero .hero-buttons{margin:22px 0}.time-machine-hero .hero-buttons>*{flex:1;justify-content:center;font-size:13px;padding:12px 9px}.gumti-photo-memory{margin-top:26px;font-size:15px}.gumti-photo-memory img{width:92px;height:69px}.memory-machine{max-width:510px;width:100%;justify-self:center;box-sizing:border-box}.era-context p{min-height:0}.hero-ribbon{flex-wrap:wrap;gap:12px 17px;font-size:9px!important}.hero-ribbon b{display:none}.journal-grid{grid-template-columns:1fr}.journal-card{min-height:0;padding:23px}.journal-card .journal-number{float:right;font-size:50px;margin:0 0 10px 15px}.journal-card:nth-child(n){transform:none}.journal-top{align-items:start;flex-direction:column;gap:4px}.gumti-story p{font-size:16px}.gumti-story .story-deck{font-size:20px}}
@media(prefers-reduced-motion:reduce){.memory-machine,.tape-reels i{animation:none}.machine-play,.journal-card{transition:none}}

/* Keep the tape's supporting copy readable without inheriting the legacy hero paragraph size. */
.time-machine-hero .era-context p{font-size:14px!important}
.time-machine-hero .machine-fineprint{font-size:10px!important}
.time-machine-hero .hero-ribbon{padding:16px 20px!important}
.memory-machine button:focus-visible,.memory-machine a:focus-visible,.journal-card:focus-visible{outline:3px solid #e7b75d;outline-offset:4px}


/* A richer arrival for first-time visitors. */
.time-machine-hero{position:relative;overflow:hidden;isolation:isolate}
.time-machine-hero::before{content:"";position:absolute;inset:-20%;z-index:-1;background:radial-gradient(circle at 80% 18%,#d6a64a2e 0 2%,transparent 22%),radial-gradient(circle at 17% 80%,#a3432922 0 1%,transparent 23%);filter:blur(2px);animation:gumtiGlow 10s ease-in-out infinite alternate}
.time-machine-hero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.45;background:linear-gradient(115deg,transparent 0 42%,#ffffff36 49%,transparent 56%);transform:translateX(-115%);animation:gumtiShimmer 11s ease-in-out infinite}
.hero-copy{animation:gumtiRise .7s .05s both}
.memory-machine{animation:machine-arrival .7s .18s ease-out both, gumtiFloat 6s 1.1s ease-in-out infinite}
.hero-trail{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 0;color:#624833;font:600 11px/1.35 system-ui,sans-serif;letter-spacing:.02em}
.hero-trail span{display:inline-flex;align-items:center;gap:6px;padding:7px 9px;border:1px solid #a9805f70;border-radius:999px;background:#fff8e755;backdrop-filter:blur(3px)}
.hero-trail b{color:#a34329;font-size:14px}
.hero-buttons{position:relative;z-index:1}
.hero-play{box-shadow:0 7px 0 #8b4127,0 15px 26px #8b41273b;transition:transform .2s,box-shadow .2s!important}
.hero-play:hover{transform:translateY(-3px);box-shadow:0 9px 0 #8b4127,0 20px 30px #8b41274b}
.era-switches{box-shadow:inset 0 1px 0 #ffffff10,0 8px 20px #00000022}
.tape-face{background:linear-gradient(135deg,#f9e8c1,#e6c589 48%,#f3ddb1);overflow:hidden}
.tape-face::after{content:"";position:absolute;inset:-30% 40% -30% -30%;background:linear-gradient(110deg,transparent,#fff9dc87,transparent);transform:rotate(10deg);pointer-events:none}
.tape-title,.tape-caption,.tape-years,.tape-reels{position:relative;z-index:1}
.hero-ribbon{position:relative;overflow:hidden}
.hero-ribbon::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,#e8bd7940,transparent);animation:gumtiRibbon 7s linear infinite}
.gumti-journal{position:relative}
.gumti-journal::before{content:"";position:absolute;width:220px;height:220px;right:-80px;top:-70px;border:1px dashed #e8bd7966;border-radius:50%;pointer-events:none}
.journal-card{box-shadow:7px 8px 0 #0d0a081f,0 18px 30px #00000017}
.gumti-collection{box-shadow:0 9px 19px #0000001e;transition:transform .22s,box-shadow .22s,border-color .22s}
.gumti-collection:hover{box-shadow:0 15px 28px #00000035}
@keyframes gumtiRise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes gumtiFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-5px) rotate(-.25deg)}}
@keyframes gumtiGlow{from{transform:scale(.96) rotate(-2deg);opacity:.55}to{transform:scale(1.04) rotate(2deg);opacity:1}}
@keyframes gumtiShimmer{0%,48%{transform:translateX(-115%)}65%,100%{transform:translateX(115%)}}
@keyframes gumtiRibbon{from{transform:translateX(-110%)}to{transform:translateX(110%)}}
@media(max-width:700px){.hero-trail{font-size:10px}.hero-trail span{padding:6px 8px}.memory-machine{animation:machine-arrival .7s .18s ease-out both}.time-machine-hero::after{animation:none}}
@media(prefers-reduced-motion:reduce){.time-machine-hero::before,.time-machine-hero::after,.hero-copy,.memory-machine,.hero-ribbon::before{animation:none!important}.hero-play{transition:none!important}}