/* Delivery Damage — scroll story UI.
   Layer 1: original poster design (from uber-eats-wrapped.html, Sep 16 2026).
   Layer 2: original refinements (wrapped-refinements.css).
   Layer 3: app layer for upload, scope, dynamic recap, accessibility and mobile. */
:root{--ink:#171319;--cream:#f7f1df;--lime:#d7ff20;--blue:#0a42f5;--purple:#26164d;--orange:#ff5c1b;--pink:#ffb4d2;--white:#fff}*{box-sizing:border-box}html,body{margin:0;background:var(--purple);font-family:Outfit,Arial,sans-serif;color:var(--ink)}button{font:inherit;cursor:pointer}.story{scroll-snap-type:y mandatory;height:100dvh;overflow-y:auto;overflow-x:hidden}.slide{min-height:100dvh;scroll-snap-align:start;scroll-snap-stop:always;position:relative;padding:clamp(74px,9vh,105px) max(7vw,28px) 72px;display:flex;flex-direction:column;justify-content:center;isolation:isolate;overflow:hidden}.topbar{position:fixed;z-index:15;top:0;left:0;right:0;padding:19px max(28px,5vw);display:flex;justify-content:space-between;align-items:center;color:#fff;mix-blend-mode:difference;font:500 11px DM Mono,monospace;letter-spacing:.07em}.logo b{font-weight:500;background:#fff;color:#000;padding:2px 4px;margin-left:2px}.logo sup{font-size:14px;color:var(--lime)}#mute{border:0;background:transparent;color:#fff;font:500 10px DM Mono,monospace}.progress{position:fixed;z-index:16;top:56px;left:max(28px,5vw);right:max(28px,5vw);display:grid;grid-template-columns:repeat(9,1fr);gap:4px}.progress i{height:3px;background:rgba(255,255,255,.35);transition:background .25s}.progress i.seen{background:#fff}.eyebrow{font:500 11px DM Mono,monospace;letter-spacing:.09em;margin:0 0 15px}.next{border:0;position:absolute;bottom:22px;left:50%;transform:translateX(-50%);font:500 11px DM Mono,monospace;letter-spacing:.05em;background:transparent;z-index:3;white-space:nowrap}.next b{font-size:17px;padding-left:6px}.next.light{color:#fff}.next.dark{color:var(--ink)}.caption{font-size:clamp(16px,2vw,22px);line-height:1.18;letter-spacing:-.04em}.cover{background:var(--blue);color:#fff;padding-left:max(7vw,28px)}.art-wrap{position:absolute;inset:0;z-index:-1}.art-wrap:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,66,245,.99) 0%,rgba(10,66,245,.78) 41%,rgba(10,66,245,.06) 76%),linear-gradient(0deg,rgba(10,66,245,.3),transparent 52%)}.art-wrap img{height:100%;width:100%;object-fit:cover;object-position:70% center}.cover-copy{max-width:650px;position:relative;z-index:1}.cover h1{font-size:clamp(75px,12vw,170px);line-height:.78;letter-spacing:-.09em;margin:0;font-weight:900}.cover h1 em{font-style:normal;color:var(--lime)}.cover-sub{font-size:clamp(16px,1.8vw,22px);max-width:340px;line-height:1.18;margin:29px 0 0;letter-spacing:-.03em}.corner-note{position:absolute;right:max(7vw,28px);bottom:35px;text-align:right;font:500 10px/1.35 DM Mono,monospace;letter-spacing:.06em}.corner-note span{color:var(--lime)}.total{background:var(--lime);align-items:center;text-align:center}.total .checker{position:absolute;inset:0;opacity:.13;background-image:linear-gradient(45deg,#171319 25%,transparent 25%),linear-gradient(-45deg,#171319 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#171319 75%),linear-gradient(-45deg,transparent 75%,#171319 75%);background-size:42px 42px;background-position:0 0,0 21px,21px -21px,-21px 0}.total>*:not(.checker){position:relative}.total h2{margin:0;display:flex;align-items:center;flex-direction:column}.total h2 .reveal{font-size:clamp(22px,3vw,44px);font-weight:800;letter-spacing:-.05em;line-height:.88}.total h2 strong{font-size:clamp(135px,26vw,330px);font-weight:900;letter-spacing:-.115em;line-height:.75;color:var(--blue);padding-right:.1em}.total .caption{max-width:480px;margin:37px 0 0}.stat-pill{font:500 11px DM Mono,monospace;letter-spacing:.04em;margin-top:30px;border:2px solid var(--ink);padding:11px 14px;background:var(--cream)}.stat-pill b{color:var(--blue);font-size:17px}.spend{background:var(--purple);color:#fff;display:grid;grid-template-columns:minmax(250px,.8fr) 1.1fr;gap:clamp(30px,8vw,125px);align-items:center}.receipt{background:var(--cream);color:var(--ink);width:min(100%,355px);padding:27px 25px 33px;transform:rotate(-4deg);box-shadow:12px 13px 0 var(--orange);clip-path:polygon(0 0,100% 0,100% 97%,97% 100%,94% 97%,91% 100%,88% 97%,85% 100%,82% 97%,79% 100%,76% 97%,73% 100%,70% 97%,67% 100%,64% 97%,61% 100%,58% 97%,55% 100%,52% 97%,49% 100%,46% 97%,43% 100%,40% 97%,37% 100%,34% 97%,31% 100%,28% 97%,25% 100%,22% 97%,19% 100%,16% 97%,13% 100%,10% 97%,7% 100%,4% 97%,0 100%)}.receipt span,.receipt p{font:500 10px/1.4 DM Mono,monospace;letter-spacing:.06em}.receipt-line{height:2px;background:var(--ink);margin:17px 0}.receipt strong{font-size:clamp(48px,6vw,78px);letter-spacing:-.1em;line-height:.83}.receipt strong small{font-size:.43em}.receipt p{margin:0}.spend-copy h2,.year h2,.night h2,.fav-copy h2,.wraps h2,.perspective h2,.end h2{font-size:clamp(52px,7.4vw,112px);line-height:.82;letter-spacing:-.09em;margin:0;font-weight:900}.spend-copy h2 em,.year h2 em,.night h2 em,.fav-copy h2 em,.wraps h2 em,.perspective h2 em,.end h2 em{font-style:normal;color:var(--lime)}.spend-copy>p:last-child{max-width:340px;font-size:clamp(16px,1.8vw,20px);line-height:1.2;letter-spacing:-.035em}.scribble{position:absolute;right:7vw;top:17%;padding:15px;border:2px solid var(--lime);border-radius:50%;color:var(--lime);font:500 11px DM Mono,monospace;text-align:center;transform:rotate(13deg)}.year{background:var(--cream)}.year-head{display:flex;align-items:end;justify-content:space-between;gap:30px;position:relative;z-index:1}.year h2 em{color:var(--blue)}.chart-wrap{height:min(46vh,390px);border:3px solid var(--ink);background:#fff;margin-top:clamp(30px,6vh,70px);padding:27px 20px 31px;position:relative}.chart{height:100%;display:grid;grid-template-columns:repeat(6,1fr);align-items:end;gap:10px;border-bottom:2px solid var(--ink)}.bar-slot{height:100%;display:flex;align-items:end;justify-content:center;position:relative}.bar-slot i{display:block;width:min(72%,78px);background:var(--orange);height:20%;border:2px solid var(--ink);border-bottom:0;transition:height 1s cubic-bezier(.2,.8,.2,1)}.bar-slot i.latest{background:var(--blue)}.bar-slot strong{position:absolute;top:-7px;left:50%;transform:translateX(-50%);font:600 11px DM Mono,monospace;white-space:nowrap}.bar-slot span{position:absolute;bottom:-23px;font:500 12px DM Mono,monospace}.bar-slot span small{display:block;color:var(--blue);font-size:8px;text-align:center}.chart-foot{display:flex;justify-content:space-between;font:500 9px DM Mono,monospace;margin-top:9px}.year-takeaway{display:flex;gap:18px;align-items:baseline;margin-top:26px;max-width:690px}.year-takeaway b{font-size:clamp(18px,2.5vw,28px);line-height:1;letter-spacing:-.05em}.year-takeaway span{font-size:14px;line-height:1.2}.night{background:#12111b;color:#fff;text-align:center;align-items:center}.night>*:not(.moon,.stars){position:relative}.moon{position:absolute;width:min(60vw,680px);aspect-ratio:1;border-radius:50%;background:var(--lime);top:-20%;right:-10%;box-shadow:0 0 0 25px rgba(215,255,32,.07),0 0 0 60px rgba(215,255,32,.04)}.stars{position:absolute;top:18%;left:9%;font-size:clamp(19px,4vw,42px);color:var(--pink);line-height:1.8;transform:rotate(-13deg)}.night .eyebrow{color:var(--lime)}.time{font-size:clamp(105px,22vw,290px);font-weight:900;letter-spacing:-.12em;line-height:.72;color:var(--pink)}.time span{animation:blink 1.3s steps(2) infinite}.time small{font:500 19px DM Mono,monospace;letter-spacing:-.04em;color:#fff;margin-left:13px}.night h2{font-size:clamp(42px,5vw,78px);margin-top:40px}.night h2 em{color:var(--pink)}.night .caption{max-width:490px;margin:25px 0 0;color:#d5d2dd}.night-tag{margin-top:27px;padding:9px 14px;border:1px solid var(--pink);border-radius:99px;color:var(--pink);font:500 10px DM Mono,monospace;letter-spacing:.08em}.favourite{background:var(--orange);display:grid;grid-template-columns:.9fr 1fr;gap:8vw;align-items:center}.gyro-coin{position:relative;width:min(39vw,420px);aspect-ratio:1;border-radius:50%;background:var(--lime);border:3px solid var(--ink);box-shadow:15px 15px 0 var(--ink);display:grid;place-items:center;transform:rotate(-8deg)}.gyro-coin span{font-size:clamp(110px,17vw,220px);filter:drop-shadow(7px 8px 0 rgba(0,0,0,.15))}.gyro-coin small{position:absolute;top:20px;left:23px;font:900 18px/.85 Outfit,sans-serif;letter-spacing:-.08em}.fav-copy h2 em{color:var(--blue)}.fav-copy>p:last-child{font-size:clamp(17px,2vw,23px);line-height:1.18;letter-spacing:-.04em;max-width:390px}.seal{position:absolute;right:10%;bottom:15%;padding:17px;border:2px solid var(--ink);border-radius:50%;width:117px;aspect-ratio:1;text-align:center;display:grid;place-content:center;background:var(--cream);font:600 10px/.92 DM Mono,monospace;transform:rotate(14deg);box-shadow:4px 5px 0 var(--ink)}.seal b{font:800 28px Outfit,sans-serif;letter-spacing:-.08em}.wraps{background:var(--pink);align-items:center;text-align:center}.wraps .eyebrow{color:var(--blue)}.wraps h2{font-size:clamp(100px,19vw,250px);line-height:.63;color:var(--blue)}.wraps h2 em{color:var(--orange)}.wrap-count{margin-top:65px;position:relative;z-index:1}.wrap-count span{font-size:clamp(115px,20vw,270px);font-weight:900;line-height:.65;letter-spacing:-.13em}.wrap-count small{display:block;margin-top:10px;font:500 11px DM Mono,monospace;letter-spacing:.05em}.wraps .caption{max-width:430px;position:relative;z-index:1;margin:35px 0 0}.wrap-word{position:absolute;left:-8%;right:-8%;bottom:4%;font-size:clamp(42px,8vw,110px);font-weight:900;letter-spacing:-.08em;color:rgba(10,66,245,.11);line-height:.72;transform:rotate(-7deg);word-spacing:25px}.perspective{background:var(--blue);color:#fff;display:grid;grid-template-columns:1fr .68fr;gap:9vw;align-items:center}.perspective h2 em{color:var(--lime)}.perspective-copy>p:nth-of-type(2){max-width:480px;font-size:clamp(16px,1.8vw,21px);letter-spacing:-.035em;line-height:1.22}.fine{font:500 10px/1.3 DM Mono,monospace;max-width:390px;color:#b8c6ff!important;margin-top:27px}.future-card{background:var(--lime);color:var(--ink);padding:30px 25px;transform:rotate(5deg);box-shadow:12px 13px 0 #111;min-width:260px}.future-card span,.future-card p{font:500 10px DM Mono,monospace;letter-spacing:.06em}.future-card strong{display:block;font-size:clamp(54px,6vw,84px);line-height:.85;letter-spacing:-.11em;margin-top:29px}.future-card strong small{font-size:.42em}.future-card p{border-top:1px solid var(--ink);padding-top:15px;margin-top:25px}.future-card i{font-size:50px;color:var(--orange);font-style:normal}.end{background:var(--purple);color:#fff;align-items:center;text-align:center}.end h2{font-size:clamp(62px,10vw,140px);line-height:.73;position:relative;z-index:1}.end h2 em{color:var(--lime)}.end>p:not(.eyebrow){max-width:430px;font-size:clamp(17px,2vw,22px);line-height:1.15;letter-spacing:-.04em;position:relative;z-index:1}.end .eyebrow{color:var(--pink);position:relative;z-index:1}.end-orbit{position:absolute;border:1px solid var(--pink);border-radius:50%;display:grid;place-items:center;font:500 10px DM Mono,monospace;letter-spacing:.06em;color:var(--pink);animation:spin 18s linear infinite}.orbit-a{width:clamp(280px,45vw,620px);aspect-ratio:1;left:-15%;top:-14%}.orbit-b{width:clamp(160px,27vw,350px);aspect-ratio:1;right:-5%;top:17%;animation-direction:reverse}.orbit-c{width:clamp(190px,30vw,400px);aspect-ratio:1;left:-9%;bottom:-17%;animation-duration:26s}.share-card{position:relative;z-index:2;margin-top:30px;border:0;background:var(--lime);color:var(--ink);padding:16px 20px;border-radius:99px;font-weight:800;font-size:16px;letter-spacing:-.04em;box-shadow:0 5px 0 #000}.share-card span{padding-left:7px}.data-note{position:absolute;bottom:26px;color:#b6a6e8;font:500 9px DM Mono,monospace;letter-spacing:.04em}.still *{animation-play-state:paused!important;transition:none!important}@keyframes blink{50%{opacity:0}}@keyframes spin{to{transform:rotate(360deg)}}
    @media(max-width:650px){.slide{padding:84px 28px 58px}.cover{justify-content:flex-start;padding-top:22vh}.art-wrap img{object-position:67% center}.art-wrap:after{background:linear-gradient(0deg,rgba(10,66,245,.35),rgba(10,66,245,.05) 45%),linear-gradient(90deg,rgba(10,66,245,.95),rgba(10,66,245,.27))}.corner-note{display:none}.spend,.favourite,.perspective{display:flex;gap:28px}.spend{justify-content:center}.receipt{width:267px;order:2;align-self:center}.spend-copy{order:1}.scribble{right:8%;top:4.5%;font-size:9px;padding:10px}.year-head{display:block}.year h2{margin-top:3px}.chart-wrap{margin-top:32px;height:42vh;padding:20px 7px 30px}.chart{gap:1px}.bar-slot strong{font-size:8px;top:0}.bar-slot span{font-size:9px;bottom:-20px}.year-takeaway{display:block;margin-top:25px}.year-takeaway span{display:block;margin-top:10px}.night .caption{font-size:17px}.moon{top:-7%;right:-31%;width:85vw}.favourite{justify-content:center}.gyro-coin{width:225px;position:absolute;right:-40px;top:78px;opacity:.95}.gyro-coin span{font-size:120px}.gyro-coin small{font-size:13px}.fav-copy{margin-top:130px;position:relative;z-index:1}.seal{right:28px;bottom:18%;width:100px}.wraps h2{font-size:24vw}.wrap-count{margin-top:55px}.wraps .caption{font-size:17px}.perspective{justify-content:center}.future-card{width:254px;align-self:center}.end h2{font-size:17vw}.end-orbit{opacity:.7}}

/* ===== Refinements ===== */
/* Preserve the palette and posters; make typography and flow safe at every size. */
.story{scroll-snap-type:y proximity}.slide{padding:110px max(6vw,24px) 86px;overflow:clip;min-height:100svh;height:auto;gap:0}.slide>*{min-width:0}.slide h1,.slide h2{line-height:1.02!important;letter-spacing:-.055em!important;overflow-wrap:normal}.slide h2{font-size:clamp(44px,6.5vw,92px)}.cover h1{font-size:clamp(64px,10.5vw,148px)}.caption,.cover-sub,.slide p{line-height:1.4;letter-spacing:-.02em}.eyebrow{font-size:12px;line-height:1.5!important;letter-spacing:.075em!important}.topbar{background:#211238;color:white;mix-blend-mode:normal;padding:12px 24px;min-height:52px}.progress{top:52px;left:0;right:0;gap:2px;background:#211238;padding:0 0 4px}.progress i{height:4px}.next{min-height:44px;font-size:13px;bottom:16px}.total>.next,.night>.next{position:absolute}.total h2{gap:14px}.total h2 strong{line-height:1!important;letter-spacing:-.06em;font-size:clamp(128px,23vw,270px)}.total h2 .reveal{line-height:1.15}.receipt strong{font-size:clamp(40px,4.8vw,64px);line-height:1.15;letter-spacing:-.065em;white-space:nowrap}.receipt{padding:28px 22px 40px;max-width:100%}.scribble{display:none}.spend,.perspective{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:6vw}.spend-copy h2{font-size:clamp(44px,6vw,86px)}.year-head{display:block}.year h2{font-size:clamp(44px,5.5vw,76px)}.chart-wrap{height:300px;margin-top:28px;padding:38px 16px 48px}.chart-foot{margin-top:34px;font-size:12px}.bar-slot strong{font-size:12px;top:-25px;background:#fff}.bar-slot span{font-size:12px;bottom:-23px}.bar-slot span small{display:inline;margin-left:3px;font-size:10px}.year-takeaway{margin-top:32px;max-width:900px}.year-takeaway b{line-height:1.2}.yoy-callout{display:flex;flex-direction:column;gap:8px;margin-top:24px;max-width:850px;font-size:16px}.yoy-callout b{color:#063ec7}.yoy-callout span{font-size:14px;line-height:1.5}.year-detail{margin-top:20px;font-size:14px;max-width:850px}summary{cursor:pointer;padding:12px 0;min-height:44px}.moon{opacity:.14;z-index:-1}.stars{opacity:.25;z-index:-1}.time{font-size:clamp(100px,18vw,230px);line-height:1.1;letter-spacing:-.07em}.night h2{margin-top:20px}.favourite{gap:5vw}.gyro-coin{width:min(34vw,370px);align-self:center}.seal{position:static;grid-column:2;justify-self:start;transform:rotate(8deg);margin-top:14px;width:105px}.wraps h2{font-size:clamp(75px,14vw,180px)}.wraps h2 em{color:#ac2913}.wrap-count{margin-top:30px}.wrap-count span{line-height:1!important;letter-spacing:-.06em;font-size:clamp(110px,18vw,225px)}.wrap-count small{font-size:14px;line-height:1.4}.wrap-word{z-index:-1}.future-card strong{font-size:clamp(48px,5.5vw,76px);letter-spacing:-.065em;line-height:1.1}.fine{font-size:13px!important;line-height:1.5!important}.end h2{font-size:clamp(48px,8vw,108px)}.end-orbit{opacity:.2;z-index:-1}.data-note{position:static;display:block;font-size:12px;line-height:1.5;margin-top:35px;max-width:650px}.method{text-align:left;max-width:750px;margin-top:18px;color:#ded3ff;font-size:14px}.method p{font-size:14px;line-height:1.6}#share-status{font-size:14px;min-height:20px}.extra-inner{max-width:1040px;width:100%;margin:auto}.extra h2{font-size:clamp(48px,7.5vw,105px);font-weight:900;margin:0 0 30px}.extra h2 em{font-style:normal}.extra .caption{max-width:690px;font-size:clamp(18px,2.2vw,25px);margin:28px 0 0}.support{font-size:14px!important;line-height:1.5!important;max-width:770px;margin-top:20px}.origin{background:var(--pink)}.origin em{color:var(--blue)}.detail-ticket{padding:28px;background:var(--cream);color:var(--ink);border:2px solid var(--ink);box-shadow:7px 8px 0 var(--ink);max-width:680px}.detail-ticket>span{font:500 12px/1.5 'DM Mono',monospace}.detail-ticket>strong{display:block;font-size:56px;font-weight:900;letter-spacing:-.04em;margin:12px 0}.detail-ticket h3{font-size:28px;margin:12px 0}.detail-ticket p{font-size:18px;margin:12px 0 0}.patterns{background:var(--blue);color:white}.patterns em{color:var(--lime)}.extra .next{color:inherit}.fact-duo{display:grid;grid-template-columns:1fr 1fr;gap:28px;max-width:800px;margin:25px 0}.fact-duo strong{display:block;font-weight:900;font-size:clamp(58px,9vw,115px);line-height:1.1;letter-spacing:-.055em}.fact-duo span{font-size:16px;line-height:1.45;display:block;margin-top:8px}.midnight{background:#12111b;color:var(--pink)}.midnight em{color:var(--lime)}.explorer{background:var(--lime)}.explorer em{color:var(--blue)}.rank-list{max-width:780px;margin-top:25px}.rank-list>div{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px 0;border-bottom:1px solid currentColor;font-size:16px}.rank-list b{flex-shrink:0}.extras{background:var(--purple);color:white}.extras em{color:var(--lime)}.record{background:var(--orange)}.record em{color:var(--ink)}.alternatives{background:var(--cream)}.alternatives em{color:var(--blue)}.alternative-list small{display:block;font-size:14px;margin-top:8px}.alternative-list strong{font-size:18px;white-space:nowrap}.alternative-list b{font-size:24px}.extra [aria-hidden]{pointer-events:none}
@media(max-width:760px){.slide{padding:95px 24px 85px;min-height:100svh;overflow:clip}.cover{padding-top:20vh}.cover h1{font-size:clamp(60px,15vw,100px)}.slide h2{font-size:clamp(40px,10.8vw,68px)}.spend,.favourite,.perspective{display:flex;gap:30px}.receipt{width:min(100%,340px);transform:rotate(-2deg)}.spend-copy{width:100%}.gyro-coin{position:relative;top:auto;right:auto;width:180px;flex-shrink:0;margin:5px auto 12px}.gyro-coin span{font-size:110px}.fav-copy{margin-top:0}.seal{align-self:flex-start;margin-bottom:12px}.chart-wrap{height:255px;padding:38px 8px 52px}.chart{gap:2px}.bar-slot strong{font-size:10px}.bar-slot span{font-size:11px}.bar-slot span small{display:block;margin:0}.chart-foot{font-size:11px;margin-top:39px}.year-takeaway{display:block;margin-top:30px}.year-takeaway span{display:block;font-size:16px;margin-top:10px}.wraps h2{font-size:clamp(68px,19vw,115px)}.wrap-count span{font-size:145px}.end h2{font-size:clamp(39px,10.2vw,70px)}.end>p:not(.eyebrow){font-size:18px}.future-card{min-width:0;width:min(100%,310px)}.fact-duo{gap:20px}.fact-duo strong{font-size:64px}.detail-ticket{padding:22px}.detail-ticket>strong{font-size:48px}.rank-list>div{gap:16px;align-items:start}.rank-list b{flex-shrink:1;text-align:right}.alternative-list>div{display:block}.alternative-list strong{display:block;margin-top:12px}.alternative-list b{text-align:left}.extra h2{margin-bottom:25px}.topbar{padding-inline:18px}.logo{font-size:10px}#mute{min-height:32px}.corner-note{display:none}.share-card{margin-top:22px}.data-note{margin-top:30px}.method{width:100%}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important;transition:none!important}}

/* ===== App layer (Sep 24 2026): upload, guide, scope, dynamic recap, accessibility, mobile ===== */
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--lime);outline-offset:4px}
.topbar{gap:12px;padding-top:max(12px,env(safe-area-inset-top))}
.logo{color:#fff;text-decoration:none;display:inline-flex;align-items:center;min-height:44px;font-size:12px!important}
.topbar-actions{display:flex;gap:4px;align-items:center}
#mute,#clear-top{min-height:44px;min-width:44px;padding:0 10px;font:500 12px DM Mono,monospace!important;border:0;background:transparent;color:#fff;letter-spacing:.05em}
/* No text below 12px anywhere */
.stat-pill,.receipt span,.receipt p,.corner-note,.night-tag,.future-card span,.future-card p,.end-orbit,.seal,.bar-slot span small,.bar-slot strong,.bar-slot span,.chart-foot,.data-note,.eyebrow{font-size:12px!important}
.next{min-height:44px;padding:0 14px;font-size:13px!important}
/* Cover with upload */
.cover-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px;align-items:center}
.file-label,.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 20px;border-radius:99px;font:800 16px/1.1 Outfit,Arial,sans-serif;letter-spacing:-.02em;cursor:pointer;text-decoration:none;border:2px solid var(--ink);box-shadow:0 5px 0 #000;text-align:center}
.file-label,.btn.primary{background:var(--lime);color:var(--ink)}
.btn.ghost{background:transparent;color:inherit;border-color:currentColor;box-shadow:none}
.btn:disabled{opacity:.45;cursor:default}
#files{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0;padding:0}
.file-label:has(+ #files:focus-visible){outline:3px solid var(--lime);outline-offset:4px}
.cover.dragging{box-shadow:inset 0 0 0 8px var(--lime)}
.cover-meta{margin:18px 0 0!important;font:500 12px/1.55 DM Mono,monospace!important;letter-spacing:.03em!important;max-width:520px;color:#e6ecff}
.cover-meta a,.cover-meta code{color:var(--lime);font:inherit}
#import-status{margin-top:12px;font:500 13px/1.5 DM Mono,monospace;min-height:20px}
#import-error{margin-top:10px;background:var(--cream);color:#8a1010;padding:10px 14px;border:2px solid var(--ink);font-weight:700;max-width:560px;line-height:1.4}
#import-error:empty{display:none}
/* Guide */
.guide{background:var(--cream);color:var(--ink)}
.guide h2 em{color:var(--blue)}
.steps{list-style:none;padding:0;margin:26px 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;counter-reset:s}
.steps li{counter-increment:s;background:#fff;border:2px solid var(--ink);box-shadow:6px 6px 0 var(--ink);padding:20px;min-width:0}
.steps li:before{content:'0' counter(s);font:500 14px DM Mono,monospace;color:var(--blue)}
.steps h3{font-size:22px;letter-spacing:-.03em;margin:8px 0}
.steps p{font-size:16px!important;line-height:1.45!important;margin:8px 0 14px}
.steps code{font:500 13px DM Mono,monospace;background:var(--cream);padding:1px 4px;overflow-wrap:anywhere}
.guide details,.scope-slide details{margin-top:18px;max-width:780px;font-size:16px}
.guide details li,.guide details p{margin:8px 0;line-height:1.5;font-size:16px}
.guide a:not(.btn),.scope-slide a{color:inherit;text-underline-offset:3px}
.legal{display:flex;flex-wrap:wrap;gap:0 18px;margin-top:20px;font:500 12px DM Mono,monospace;letter-spacing:.04em}
.legal a{display:inline-flex;align-items:center;min-height:44px;color:inherit;text-underline-offset:3px}
/* Scope */
.scope-slide{background:var(--purple);color:#fff}
.scope-slide h2 em{color:var(--lime)}
.scope-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:22px 0;max-width:900px}
.scope-controls label{font:500 12px DM Mono,monospace;letter-spacing:.05em}
.scope-controls select{display:block;width:100%;margin-top:8px;min-height:48px;padding:10px 12px;font:600 16px Outfit,Arial,sans-serif;background:var(--cream);color:var(--ink);border:2px solid var(--ink);border-radius:0}
#coverage,#scope-warning{font-size:15px!important;line-height:1.5;max-width:780px;color:#ded3ff}
#scope-summary{font-size:clamp(20px,2.4vw,28px)!important;font-weight:800;letter-spacing:-.03em;max-width:900px}
.scope-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
/* Recap polish */
.recap h2{overflow-wrap:break-word;hyphens:manual}
.recap h2.long{font-size:clamp(34px,5vw,64px)!important}
.wraps h2.long{font-size:clamp(40px,8vw,96px)!important}
.support{color:inherit;opacity:.85}
.detail-ticket h3{overflow-wrap:anywhere}
.rank-list span{overflow-wrap:anywhere;min-width:0}
.chart{grid-template-columns:repeat(var(--n,6),minmax(0,1fr))}
.bar-slot{min-width:0}
.bar-slot i{height:4%}
.busiest{background:var(--orange)}
.busiest em{color:var(--ink)}
.end .share-row{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;align-items:center;margin-top:18px;position:relative;z-index:2}
.end .check{display:inline-flex;align-items:center;gap:10px;min-height:44px;font:500 13px DM Mono,monospace;color:#fff;cursor:pointer}
.end .check input{width:24px;height:24px}
.end .share-card{margin-top:0;min-height:48px}
.light-btn{color:#fff!important}
#card-preview{display:block;width:150px;aspect-ratio:1080/1350;margin:18px auto 0;border:2px solid var(--pink);position:relative;z-index:2;background:#1b0f36}
#share-status{position:relative;z-index:2;min-height:20px;font-size:14px}
.kofi{position:relative;z-index:2;margin:16px 0 0!important}
.kofi a{color:var(--lime);display:inline-flex;min-height:44px;align-items:center;font-weight:800;font-size:16px}
.end .legal{justify-content:center;position:relative;z-index:2;color:#ded3ff}
.end .method{position:relative;z-index:2}
.end .method a{color:var(--lime)}
@media(max-width:760px){
 .steps{grid-template-columns:1fr}
 .scope-controls{grid-template-columns:1fr}
 .cover-actions{flex-direction:column;align-items:stretch}
 .cover-actions .file-label,.cover-actions .btn{width:100%}
 .cover{padding-top:16vh}
 .bar-slot strong.minor{display:none}
 .bar-slot strong{font-size:12px!important}
 .topbar-actions #clear-top{padding:0 6px}
 .end .share-row{flex-direction:column}
}

/* ===== Fixes from the first scroll-UI device run ===== */
.recap h2{max-width:100%;overflow-wrap:normal;word-break:normal}
.share-slide{background:var(--purple);color:#fff}
.share-slide h2 em{color:var(--lime)}
.share-grid{display:grid;grid-template-columns:auto minmax(0,1fr);gap:28px;align-items:center;margin-top:22px}
.share-slide #card-preview{width:190px;margin:0;border:2px solid var(--pink)}
.share-tools{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.share-tools .share-card{margin:0}
.share-slide .check{display:inline-flex;align-items:center;gap:10px;min-height:44px;font:500 13px DM Mono,monospace;color:#fff;cursor:pointer}
.share-slide .check input{width:24px;height:24px}
.share-slide .method{margin-top:18px;color:#ded3ff}
.share-slide .method a{color:var(--lime)}
.share-slide .legal{color:#ded3ff}
.share-slide .data-note{margin-top:14px;color:#b6a6e8}
@media(max-width:760px){
 .share-grid{grid-template-columns:1fr;gap:16px}
 .share-slide #card-preview{width:140px}
 .share-tools{align-items:stretch}
 .share-tools .share-card,.share-tools .btn{width:100%}
}
@media(max-width:760px) and (max-height:720px){
 .slide{padding-top:78px;padding-bottom:70px}
 .gyro-coin{width:120px!important;margin:0 auto 6px}
 .gyro-coin span{font-size:70px!important}
 .gyro-coin small{font-size:12px!important}
 .seal{display:none}
 .detail-ticket{padding:16px}
 .detail-ticket>strong{font-size:40px!important}
 .fact-duo strong{font-size:48px!important}
 .fact-duo{margin:16px 0}
 .rank-list>div{padding:10px 0}
 .caption{margin-top:16px!important}
 .support{display:none}
}

/* Share slide: preview beside the buttons on phones so it fits one screen */
@media(max-width:760px){
 .share-slide .extra-inner>h2{font-size:clamp(34px,10vw,52px)!important;margin-bottom:6px}
 .share-grid{grid-template-columns:104px minmax(0,1fr);gap:14px;align-items:start;margin-top:14px}
 .share-slide #card-preview{width:104px}
 .share-tools{gap:8px}
 .share-tools .share-card{font-size:15px;padding:12px 14px}
 .share-slide .check{font-size:12px;min-height:44px}
 .share-slide .kofi{margin:0!important}
 .share-slide .kofi a{font-size:14px}
 .share-slide .method{margin-top:10px}
 .share-slide .scope-actions{flex-wrap:nowrap}
 .share-slide .scope-actions .btn{flex:1;min-height:44px;padding:8px 10px;font-size:14px}
 .share-slide .legal{margin-top:8px;gap:0 12px}
 .share-slide .data-note{margin-top:6px}
}

/* ===== Personal hero, per-card story sharing, toast (Sep 24 2026) ===== */
.hero-me{background:var(--blue);color:#fff}
.hero-me h2 em{color:var(--lime)}
.me-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:6vw;align-items:center}
.me-sub{font-size:clamp(18px,2vw,24px)!important;line-height:1.35!important;max-width:520px;margin-top:22px}
.me-sub b{color:var(--lime);font-weight:800}
.me-art{position:relative;width:min(100%,400px);aspect-ratio:1;justify-self:center}
.me-bag{position:absolute;left:14%;right:14%;top:24%;bottom:4%;background:var(--cream);color:var(--ink);border:3px solid var(--ink);border-radius:18px 18px 10px 10px;box-shadow:12px 12px 0 var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:12% 8% 8%;text-align:center}
.me-bag:before{content:"";position:absolute;top:-17%;left:30%;right:30%;height:22%;border:3px solid var(--ink);border-bottom:0;border-radius:60px 60px 0 0}
.me-label{font:900 clamp(16px,2.6vw,28px)/1.05 Outfit,Arial,sans-serif;letter-spacing:-.03em;border:2px dashed var(--ink);padding:10px 12px;overflow-wrap:anywhere;max-width:100%}
.me-bag small{font:500 12px DM Mono,monospace;letter-spacing:.06em;text-transform:uppercase}
.me-sticker{position:absolute;width:30%;aspect-ratio:1;border-radius:50%;border:3px solid var(--ink);display:grid;place-items:center;font-size:clamp(34px,5.5vw,62px);box-shadow:5px 5px 0 var(--ink);line-height:1}
.me-sticker.s1{background:var(--lime);top:0;left:-2%;transform:rotate(-10deg)}
.me-sticker.s2{background:var(--pink);top:8%;right:-4%;transform:rotate(8deg)}
.me-sticker.s3{background:var(--orange);bottom:-4%;right:4%;transform:rotate(-5deg)}
.card-share{position:fixed;z-index:30;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));display:inline-flex;align-items:center;gap:8px;min-height:52px;min-width:52px;padding:0 18px;border-radius:99px;border:2px solid var(--ink);background:var(--lime);color:var(--ink);font:800 15px Outfit,Arial,sans-serif;box-shadow:0 5px 0 #000;cursor:pointer}
.card-share span{font-size:20px;line-height:1}
.toast{position:fixed;z-index:31;left:50%;bottom:max(84px,calc(env(safe-area-inset-bottom) + 84px));transform:translateX(-50%);width:min(92vw,520px);background:var(--ink);color:#fff;border:2px solid var(--lime);padding:12px 14px;display:flex;gap:12px;align-items:center;justify-content:space-between;font:500 14px/1.4 Outfit,Arial,sans-serif;box-shadow:0 6px 0 #000}
.toast button{flex:0 0 auto;min-height:44px;padding:0 14px;border-radius:99px;border:0;background:var(--lime);color:var(--ink);font:800 14px Outfit,Arial,sans-serif;cursor:pointer}
.scope-controls select:not(:disabled){box-shadow:0 0 0 3px var(--lime)}
.share-slide #card-preview{aspect-ratio:1080/1920}
@media(max-width:760px){
 .me-grid{grid-template-columns:1fr;gap:26px}
 .me-art{width:min(78vw,260px)}
 .card-share{padding:0;width:52px;justify-content:center}
 .card-share b{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .next{max-width:calc(100vw - 150px)}
}
@media(max-width:480px){#clear-top{display:none}}

/* Share buttons live inside each poster's bottom margin, so they never cover content */
.card-share{position:absolute;z-index:4;right:max(16px,env(safe-area-inset-right));bottom:16px;min-height:48px;min-width:48px;padding:0 16px;box-shadow:0 4px 0 #000}
@media(max-width:760px){.card-share{bottom:12px;width:48px;padding:0}.card-share b{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.next{bottom:14px}}

/* Keep the share button out of the flow on posters whose children are forced relative (.total, .night) */
.slide>.card-share{position:absolute!important}
@media(max-width:760px){.next{max-width:calc(100vw - 150px);overflow:hidden;text-overflow:ellipsis}}

/* The tip line on the receipt: noticeable, never pushy */
.receipt-line.dashed{height:0;background:none;border-top:2px dashed var(--ink);margin:14px 0 4px}
.receipt-tip{display:flex;align-items:center;gap:8px;min-height:44px;color:var(--ink);text-decoration:none;font:500 12px/1.2 DM Mono,monospace;letter-spacing:.06em}
.receipt-tip i{flex:1;border-bottom:2px dotted rgba(23,19,25,.45);transform:translateY(-3px)}
.receipt-tip span:last-child{white-space:nowrap}
.receipt-tip:hover span,.receipt-tip:focus-visible span{text-decoration:underline;text-underline-offset:3px}
.kofi a{font-weight:700;opacity:.92}

/* Body text on posters wraps even very long unbroken names (headings are fitted separately) */
.recap p,.recap .caption,.recap small,.recap .rank-list span,.recap .me-sub,.recap .stat-pill{overflow-wrap:anywhere}

/* Extremely long restaurant or dish names: cap at three lines on tickets, two in lists */
.detail-ticket h3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.rank-list span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* Coffee button in the top bar: on every screen, secondary to the main actions */
.coffee-top{display:inline-flex;align-items:center;gap:6px;min-height:36px;min-width:44px;justify-content:center;padding:0 12px;margin-right:6px;border-radius:99px;background:#d7ff20;color:#171319;text-decoration:none;font:700 12px DM Mono,monospace;letter-spacing:.06em;position:relative;white-space:nowrap}
.coffee-top::after{content:"";position:absolute;inset:-4px -2px}
.coffee-top span{font-size:15px;line-height:1}
.coffee-top:hover,.coffee-top:focus-visible{background:#fff}
@media(max-width:560px){.coffee-top{padding:0;width:44px}.coffee-top b{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}}
.cover-coffee{margin-top:14px;font-size:14px;line-height:1.45;opacity:.92}
.cover-coffee a{color:#d7ff20;font-weight:700;text-underline-offset:3px;display:inline-block;padding:10px 0}

/* ===== Coffee, made visible ===== */
.btn.coffee-btn{background:var(--pink);color:var(--ink);border-color:var(--ink);box-shadow:0 5px 0 #000;gap:8px}
.btn.coffee-btn:hover,.btn.coffee-btn:focus-visible{background:#fff}
.btn.coffee-btn.big{min-height:60px;padding:14px 28px;font-size:20px;background:var(--lime)}
.coffee-break{background:#2b1a12;color:#f7f1df}
.coffee-break .extra-inner{position:relative;max-width:720px}
.coffee-break h2 em{color:var(--lime)}
.coffee-break .caption{max-width:560px;margin:18px 0 26px}
.coffee-break .cup{position:absolute;right:-2%;top:-6%;font-size:clamp(120px,26vw,300px);line-height:1;opacity:.14;transform:rotate(12deg);pointer-events:none}
.coffee-note{margin-top:14px!important;font:500 12px DM Mono,monospace;letter-spacing:.06em;text-transform:uppercase;opacity:.7}
.share-tools .btn.coffee-btn{margin-top:4px}
@keyframes coffee-wiggle{0%,100%{transform:rotate(0)}20%{transform:rotate(-14deg)}40%{transform:rotate(12deg)}60%{transform:rotate(-8deg)}80%{transform:rotate(5deg)}}
.coffee-top span{display:inline-block;animation:coffee-wiggle .9s ease-in-out 1.2s 2}
@media(prefers-reduced-motion:reduce){.coffee-top span{animation:none}}
@media(max-width:560px){.coffee-top{box-shadow:0 0 0 3px rgba(215,255,32,.35)}.coffee-top span{font-size:18px}}

/* Coffee balance: one clear ask (intermission), quieter everywhere else */
.cover-actions .btn.coffee-btn{width:auto;flex:0 0 auto;align-self:flex-start;min-height:44px;padding:8px 18px;font-size:15px;box-shadow:0 3px 0 #000}
.coffee-top span{animation-iteration-count:1}

/* Coffee pill label: full on larger screens, short on phones (Motion toggle removed, so it fits) */
.coffee-top b.short{display:none}
@media(max-width:560px){
 .coffee-top{width:auto;padding:0 12px;font-size:11px}
 .coffee-top b.long{display:none}
 .coffee-top b.short{display:inline;position:static;width:auto;height:auto;overflow:visible;clip-path:none}
}