@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',system-ui,sans-serif;color:#24273c;background:#f7f8fc;font-synthesis:none}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;overscroll-behavior:none}body{height:100dvh;display:flex;flex-direction:column}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #5960ed;outline-offset:4px}button:disabled{cursor:default;opacity:.3}header{height:76px;flex-shrink:0;display:flex;align-items:center;gap:20px;padding:0 max(24px,calc((100vw - 1200px)/2));background:white;border-bottom:1px solid #e8e9f1}.brand{text-decoration:none;color:#25273a;font-size:23px;letter-spacing:-1px;font-weight:700;display:flex;align-items:center}.brand-mark{display:inline-grid;place-items:center;background:#4449e4;color:white;width:40px;height:40px;border-radius:12px;margin-right:11px;font-size:32px;font-weight:400}.brand-end{color:#5157df}.prototype{font-size:11px;font-weight:700;letter-spacing:1.2px;background:#f1f2fb;padding:6px 9px;border-radius:5px;color:#6b708e}#savedView{margin-left:auto;background:none;border:0;padding:10px;font-size:15px;color:#454862}#saveCount{background:#eff0fb;color:#484ed3;padding:3px 8px;border-radius:7px;margin-left:7px}#savedView[aria-pressed=true]{color:#4449e4}main{width:100%;max-width:1150px;margin:0 auto;flex:1;min-height:0;display:flex;flex-direction:column;padding:0 32px}.topline{height:65px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between}#viewTitle{font-size:11px;font-weight:700;letter-spacing:2px;color:#747b9c}#shuffle{background:none;border:0;color:#5056d7;font-size:14px;padding:9px 0 9px 12px}#stage{flex:1;min-height:0;touch-action:none;position:relative;padding:0 5px 5px}#feed{height:100%;width:100%;display:grid;place-items:center}.card{width:100%;height:100%;max-height:600px;display:grid;grid-template-columns:55% 45%;border-radius:27px;background:white;border:1px solid #e4e6f2;overflow:hidden;box-shadow:0 10px 35px #30375c08;position:relative}.visual{position:relative;min-width:0;min-height:0;background:var(--tint);display:flex;align-items:center;justify-content:center}.product-open{height:100%;width:100%;border:0;background:none;padding:35px;display:grid;place-items:center}.product-open img{height:100%;width:100%;max-height:440px;object-fit:contain;mix-blend-mode:multiply;transition:transform .3s cubic-bezier(.2,.8,.2,1)}.product-open:hover img{transform:scale(1.07)}.category{position:absolute;top:22px;left:22px;border-radius:7px;padding:6px 10px;background:#ffffffd9;font-size:13px;color:#656a83;pointer-events:none}.save{position:absolute;top:20px;right:20px;border:1px solid #e5e7f1;border-radius:50%;background:white;color:#727693;width:43px;height:43px;font-size:26px;display:grid;place-items:center}.save[aria-pressed=true]{color:#5055df}.info{padding:clamp(25px,4vw,55px);display:flex;flex-direction:column;justify-content:center;position:relative;min-width:0}.find-label{font-size:11px;letter-spacing:2px;font-weight:700;color:#9095ac;margin:0 0 20px}.info h1{font-family:Manrope,system-ui;font-size:clamp(24px,3vw,38px);line-height:1.2;font-weight:800;letter-spacing:-1.3px;margin:0;overflow-wrap:anywhere}.title-button{font:inherit;color:inherit;text-align:left;border:0;padding:0;background:none}.note{font-size:16px;line-height:1.65;color:#7d8299;margin:20px 0 28px}.price{font-family:Manrope,system-ui;font-size:30px;font-weight:800;letter-spacing:-1px}.sample-label{font-size:12px;letter-spacing:0;color:#999db0;font-weight:400;display:block;margin-top:4px}.merchant{color:#747a95;font-size:14px;margin-top:23px;display:flex;align-items:center;gap:10px}.merchant::before{content:'';width:18px;height:1px;background:#d8daea}.peek{align-self:flex-start;border:0;border-bottom:1px solid #d3d5f4;padding:5px 0;background:none;color:#5359d6;font-size:14px;margin-top:28px}.navigation{height:80px;flex-shrink:0;display:flex;gap:23px;align-items:center;justify-content:center}.direction{border:1px solid #dce0ef;border-radius:50%;width:43px;height:43px;font-size:24px;color:#6f7694;background:white}.direction.next{background:#4b51df;color:white;border-color:#4b51df;box-shadow:0 5px 15px #4b51df22}.direction:not(:disabled):hover{transform:translateY(2px)}.nav-copy{text-align:center;min-width:230px;display:flex;flex-direction:column;gap:5px}#progress{font-size:14px;font-weight:500;color:#505672}.instruction{font-size:12px;color:#9095ac}.demo-note{text-align:center;color:#9196aa;font-size:11px;padding-bottom:14px;flex-shrink:0}.empty{text-align:center;max-width:360px;line-height:1.6;color:#7e849b;font-size:16px}.empty h1{color:#333957;font-size:26px}.primary{border:0;border-radius:12px;background:#4b51df;color:white;padding:13px 20px;font-size:15px}.toast{position:fixed;bottom:110px;left:50%;transform:translate(-50%,15px);opacity:0;pointer-events:none;background:#292e4e;color:white;border-radius:11px;padding:12px 20px;font-size:14px;transition:.2s;z-index:5;white-space:nowrap}.toast.show{opacity:1;transform:translate(-50%,0)}dialog{border:0;border-radius:24px;padding:0;width:min(500px,calc(100% - 32px));max-height:90dvh;overflow:auto;box-shadow:0 24px 90px #131a4f33;color:#25283c}dialog::backdrop{background:#171a385e;backdrop-filter:blur(5px)}.close{position:absolute;top:14px;right:14px;z-index:2;border:0;background:white;border-radius:50%;width:36px;height:36px;font-size:24px}.preview-img{background:#eff0fa;height:240px;padding:25px}.preview-img img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}.preview-info{padding:25px}.preview-info h2{font-size:24px;line-height:1.3;margin:10px 0}.preview-info p{font-size:15px;color:#75798d;line-height:1.5}.preview-info .disclaimer{font-size:12px;border-top:1px solid #e7e9f1;padding-top:18px}.image-fallback{font-size:14px;color:#7b8096}button[hidden]{display:none}
@media(max-width:700px){header{height:62px;padding:0 18px;gap:10px}.brand{font-size:20px}.brand-mark{width:34px;height:34px;border-radius:10px;font-size:28px;margin-right:8px}.prototype{display:none}main{padding:0 16px}.topline{height:48px}#viewTitle{font-size:10px;letter-spacing:1.5px}#shuffle{font-size:13px}.card{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto;border-radius:22px;max-height:none}.product-open{padding:25px;height:100%;min-height:0}.product-open img{max-height:100%}.info{padding:20px 22px}.find-label{display:none}.info h1{font-size:clamp(20px,5.5vw,25px);letter-spacing:-.7px;line-height:1.25;padding-right:10px}.note{font-size:14px;line-height:1.4;margin:9px 0 13px}.price{font-size:25px}.sample-label{font-size:11px;display:inline;margin-left:8px}.merchant{position:absolute;bottom:23px;right:22px;max-width:40%;font-size:12px;margin:0}.merchant::before{display:none}.peek{display:none}.category{top:16px;left:16px;font-size:12px}.save{top:15px;right:15px;width:39px;height:39px;font-size:24px}.navigation{height:74px;gap:16px}.nav-copy{min-width:215px}.direction{width:39px;height:39px}.instruction{font-size:11px}.demo-note{font-size:10px;padding-bottom:12px}.toast{bottom:100px}}
@media(max-height:680px) and (max-width:700px){header{height:54px}.topline{height:36px}.navigation{height:59px}.info{padding:13px 18px}.info h1{font-size:19px}.note{margin:7px 0 9px;font-size:12px}.price{font-size:22px}.merchant{bottom:16px;right:18px}.product-open{padding:16px}.demo-note{padding-bottom:8px;font-size:9px}}
@media(max-height:460px) and (min-width:500px){header{height:50px}.topline{height:32px}.card{grid-template-columns:50% 50%;grid-template-rows:1fr}.info{padding:15px}.info h1{font-size:20px}.find-label,.note,.peek{display:none}.price{font-size:24px;margin-top:12px}.merchant{position:static;margin-top:12px}.product-open{padding:15px}.navigation{height:55px}.demo-note{padding-bottom:6px}}
@media(max-width:360px){.nav-copy{min-width:0;max-width:190px}.navigation{gap:12px}.instruction{font-size:10px}.merchant{display:none}.sample-label{display:block;margin:3px 0 0}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* Full-screen product scenes; controls float above the moving pages. */
:root{--ink:#24273c;--muted:#7d8299;--surface:#fff;--line:#e4e6f2;--accent:#5056dc;--control:#ffffffd9;--page:#f7f8fc;color-scheme:light}
html[data-theme=dark]{--ink:#f1f2fa;--muted:#adb3cc;--surface:#101322;--line:#2c3148;--accent:#a4a7ff;--control:#24283ee8;--page:#101322;color-scheme:dark}
body{background:var(--page);color:var(--ink)}header{position:absolute;inset:0 0 auto;height:78px;z-index:10;background:transparent;border:0;padding:0 32px;pointer-events:none}header>*{pointer-events:auto}.brand{color:var(--ink)}.brand-end{color:var(--accent)}.prototype{display:none}#themeToggle{margin-left:auto;border:1px solid var(--line);border-radius:22px;background:var(--control);color:var(--ink);padding:9px 15px;font-size:14px;backdrop-filter:blur(15px)}#savedView{margin-left:0;border-radius:22px;background:var(--control);color:var(--ink);backdrop-filter:blur(15px)}#saveCount{background:var(--page);color:var(--accent)}main{position:absolute;inset:0;max-width:none;padding:0;display:block}.topline{position:absolute;top:82px;right:34px;height:auto;z-index:10}#viewTitle{display:none}#shuffle{color:var(--accent);font-size:14px;background:var(--control);border-radius:20px;padding:8px 13px;backdrop-filter:blur(15px)}#stage{position:absolute;inset:0;padding:0;overflow:hidden}#feed{position:relative;overflow:hidden;height:100%;width:100%;background:var(--surface)}.card{position:absolute;inset:0;max-height:none;height:100%;width:100%;border-radius:0;border:0;box-shadow:none;grid-template-columns:58% 42%;background:var(--surface);will-change:transform}.card.outgoing{z-index:2;pointer-events:none}.visual{height:100%;background:var(--tint)}.product-open{padding:100px 55px 120px}.product-open img{max-height:66vh;width:100%;height:100%;filter:drop-shadow(0 22px 30px #242a4815)}.info{padding:110px 60px 130px;background:var(--surface)}.info h1{font-size:clamp(30px,3.7vw,56px);letter-spacing:-1.8px;color:var(--ink);padding-right:0}.find-label{color:var(--muted);margin-bottom:24px}.note{color:var(--muted);font-size:18px;margin:22px 0 35px}.price{font-size:36px;color:var(--ink)}.sample-label,.merchant{color:var(--muted)}.category{top:100px;left:35px;font-size:13px;background:var(--control);color:var(--muted)}.save{top:auto;right:60px;bottom:140px;background:var(--control);border-color:var(--line);color:var(--muted);width:48px;height:48px}.save[aria-pressed=true]{color:var(--accent)}.peek{color:var(--accent);border-color:var(--line)}.navigation{position:absolute;z-index:10;bottom:36px;left:50%;transform:translateX(-50%);height:66px;padding:8px 14px;gap:20px;border:1px solid var(--line);border-radius:40px;background:var(--control);backdrop-filter:blur(22px);box-shadow:0 5px 30px #161c3c0a}.direction{background:var(--surface);color:var(--muted);border-color:var(--line);flex-shrink:0}.direction.next{background:#4b51df;color:white}#progress{color:var(--ink)}.instruction{color:var(--muted);white-space:nowrap}.demo-note{position:absolute;bottom:11px;left:0;right:0;z-index:10;padding:0;color:var(--muted);font-size:10px;pointer-events:none}.toast{bottom:115px}.empty{color:var(--muted);padding:80px 20px}.empty h1{color:var(--ink)}dialog{background:var(--surface);color:var(--ink)}.close{background:var(--control);color:var(--ink)}.preview-info p{color:var(--muted)}.preview-img{background:var(--page)}html[data-theme=dark] .visual{background:#191d30}html[data-theme=dark] .product-open img,html[data-theme=dark] .preview-img img{mix-blend-mode:normal}html[data-theme=dark] .brand-end{color:#a4a7ff}
@media(max-width:1000px) and (min-width:701px){.info{padding:110px 35px 135px}.info h1{font-size:34px}.note{font-size:16px}.save{right:35px;bottom:128px}.product-open{padding:110px 35px 140px}}
@media(max-width:700px){header{height:65px;padding:0 18px;gap:9px}.brand{font-size:20px}#themeToggle{font-size:12px;padding:8px 11px}#savedView{font-size:13px;padding:8px}#saveCount{margin-left:3px;padding:2px 5px}.topline{top:76px;right:17px}#shuffle{font-size:12px}.card{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}.visual{min-height:0}.product-open{padding:105px 32px 24px}.product-open img{max-height:100%;filter:drop-shadow(0 15px 20px #242a4810)}.category{top:79px;left:20px;font-size:11px}.info{padding:23px 26px 126px}.info h1{font-size:clamp(24px,6.7vw,34px);line-height:1.15;padding-right:32px;letter-spacing:-1px}.note{margin:10px 0 17px;font-size:14px;line-height:1.45}.price{font-size:29px}.sample-label{font-size:11px;display:inline;margin-left:8px}.merchant{position:static;margin-top:12px;font-size:12px;max-width:none}.save{bottom:auto;top:24px;right:20px;width:37px;height:37px;font-size:23px}.peek,.find-label{display:none}.navigation{bottom:36px;width:calc(100% - 36px);max-width:380px;gap:13px;padding:7px 10px;height:62px}.nav-copy{flex:1;min-width:0}.instruction{font-size:10px}.direction{width:37px;height:37px}.demo-note{font-size:9px;bottom:13px}.toast{bottom:112px}html[data-theme=dark] .info{background:#101322}}
@media(max-height:680px) and (max-width:700px){header{height:54px}.category{top:66px}.topline{top:63px}.product-open{padding:85px 35px 14px}.info{padding:15px 23px 112px}.info h1{font-size:22px}.note{font-size:12px;margin:8px 0 10px}.price{font-size:25px}.merchant{margin-top:7px;font-size:11px}.save{top:14px}.navigation{height:56px;bottom:30px}.demo-note{bottom:10px}}
@media(max-height:460px) and (min-width:500px){header{height:52px}.topline{top:58px}.card{grid-template-columns:55% 45%;grid-template-rows:1fr}.info{padding:75px 22px 90px}.info h1{font-size:25px}.note,.find-label,.peek{display:none}.price{font-size:26px;margin-top:17px}.merchant{margin-top:10px}.product-open{padding:65px 40px 80px}.category{top:65px;left:20px}.save{top:auto;bottom:100px;right:20px}.navigation{height:52px;bottom:25px;width:auto}.demo-note{bottom:8px}}

/* Browser-native full-screen paging; momentum stops at each scene. */
#stage{touch-action:pan-y}#feed{display:block;overflow-y:auto;overflow-x:hidden;scroll-snap-type:y mandatory;overscroll-behavior-y:contain;scrollbar-width:none}#feed::-webkit-scrollbar{display:none}.card{position:relative;inset:auto;height:100%;min-height:100%;max-height:none;scroll-snap-align:start;scroll-snap-stop:always}.empty{margin:35vh auto 0}

/* Keep the native scroll surface light on both desktop and phones. */
.card{will-change:auto;contain:layout paint style}.product-open img{filter:none}#themeToggle,#savedView,#shuffle,.navigation{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--surface)}
@media(hover:none){.product-open:hover img{transform:none}}
/* Prototype v2: photos travel; product details stay in place and fade. */
#stage{touch-action:auto;background:var(--surface)}#feed{background:transparent}.card{display:block;background:transparent;contain:layout paint style}.visual{width:58%;height:100%;background:#eef0fa}.gallery{height:100%;width:100%;display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;touch-action:pan-x pan-y}.gallery::-webkit-scrollbar{display:none}.gallery .product-open{flex:0 0 100%;min-width:0;height:100%;scroll-snap-align:start;scroll-snap-stop:always;padding:105px 55px 155px}.gallery .product-open img{max-height:66vh;pointer-events:none}.card-details{position:absolute;inset:0;z-index:3;pointer-events:none;will-change:opacity}.card-details .info{position:absolute;right:0;top:0;width:42%;height:100%;background:var(--surface)}.card-details button{pointer-events:auto}.card-details .category{background:var(--surface)}.photo-controls{position:absolute;left:29%;bottom:115px;transform:translateX(-50%);display:flex;align-items:center;gap:14px;background:var(--surface);border:1px solid var(--line);border-radius:24px;padding:6px 9px;color:var(--muted);font-size:12px}.photo-controls[hidden]{display:none}.photo-controls button{border:0;background:transparent;color:var(--ink);font-size:24px;width:32px;height:32px;border-radius:50%}.photo-controls button:hover{background:var(--page)}.photo-controls button:disabled{opacity:.25}.navigation{gap:15px}html[data-theme=dark] .visual{background:#191d30}
@media(max-width:700px){.visual{width:100%;height:calc(100% - var(--detail-height,340px))}.gallery .product-open{padding:105px 30px 55px}.gallery .product-open img{max-height:100%}.card-details .info{top:auto;bottom:0;width:100%;height:auto;padding:23px 26px 126px;min-height:0}.photo-controls{left:50%;bottom:calc(var(--detail-height,340px) + 8px);gap:7px;padding:2px 6px;font-size:11px}.photo-controls button{height:27px;width:27px;font-size:22px}}
@media(max-height:680px) and (max-width:700px){.gallery .product-open{padding:85px 30px 45px}.card-details .info{padding:15px 23px 112px}}
@media(max-height:460px) and (min-width:500px){.visual{width:55%;height:100%}.card-details .info{top:0;bottom:auto;width:45%;height:100%;padding:75px 22px 90px}.gallery .product-open{padding:65px 35px 105px}.photo-controls{left:27.5%;bottom:82px}.gallery .product-open img{max-height:100%}}
@media(prefers-reduced-motion:reduce){.card-details{will-change:auto}}

#imageTrack{height:100%;width:100%}.card-details{position:fixed}

/* Full-card scrolling. Only text and its controls fade before the header. */
.card-details{position:absolute;inset:0;will-change:auto;opacity:1;mask-image:linear-gradient(to bottom,transparent var(--text-fade-start,86px),#000 var(--text-fade-end,116px));-webkit-mask-image:linear-gradient(to bottom,transparent var(--text-fade-start,86px),#000 var(--text-fade-end,116px))}.gallery .product-open img{mask-image:none;-webkit-mask-image:none}

/* Gallery controls stay below the image, outside its hit area. */
.photo-controls{pointer-events:auto}.photo-controls button:disabled{pointer-events:auto;cursor:default}.photo-controls .photo-progress{white-space:nowrap}.gallery.is-stretching{will-change:transform}.product-open{cursor:pointer}

/* Quiet photo discovery: no counts or boundary indicators. */
.photo-controls{gap:14px;background:transparent;border:0;padding:0}.photo-controls button{background:var(--surface);border:1px solid var(--line);font-size:22px;width:34px;height:34px}.photo-controls button:hover{background:var(--control)}
@media(max-width:700px){.photo-controls{display:none}}

.photo-controls[hidden]{display:none}

/* V3 experiment: reveal is driven by scroll distance, never a timer. */
.lead-price{position:absolute;left:35px;top:130px;color:var(--ink);z-index:2}.lead-price .price{font-size:clamp(42px,4.6vw,64px);letter-spacing:-2px;line-height:1.1}.lead-price .sample-label{font-size:12px;letter-spacing:0;display:block;margin:7px 0 0}.gallery .product-open img{opacity:var(--image-reveal,.15)}.card-details .info{opacity:var(--details-reveal,0)}.gallery .product-open{padding-top:165px}.category{top:100px}
@media(max-width:700px){.lead-price{left:26px;top:110px}.lead-price .price{font-size:44px}.lead-price .sample-label{font-size:11px}.gallery .product-open{padding-top:185px}}
@media(max-height:680px) and (max-width:700px){.lead-price{left:23px;top:96px}.lead-price .price{font-size:36px}.gallery .product-open{padding-top:156px}}
@media(max-height:460px) and (min-width:500px){.lead-price{top:86px;left:23px}.lead-price .price{font-size:35px}.gallery .product-open{padding-top:130px}}
@media(prefers-reduced-motion:reduce){.gallery .product-open img,.card-details .info{opacity:1}}

.card-details .category{position:static;align-self:flex-start;padding:0;margin:0 0 10px;background:transparent;color:var(--muted);font-size:11px}.card-details .find-label{display:none}

/* V3 refinement: quiet price, tactile scene edges, and clear gallery geometry. */
.lead-price .price{font-size:clamp(30px,3.1vw,42px);letter-spacing:-1px}
.card{--rest-inset:16px;--rest-radius:28px;clip-path:inset(calc(var(--rest-inset) + var(--card-inset,0px)) round calc(var(--rest-radius) + var(--card-radius,0px)))}
.gallery{min-width:0;overflow-anchor:none;direction:ltr}
.gallery .product-open{flex:0 0 100%;width:100%;max-width:100%;min-width:0;min-height:0;display:flex;align-items:center;justify-content:center}
.gallery .product-open img{display:block;min-width:0;min-height:0;object-position:center;width:100%;height:100%}
.save{transition:color .2s,background-color .2s,border-color .2s}
.save[aria-pressed=true]{color:#d6497d;background:#fff0f5;border-color:#f1b9cf}
html[data-theme=dark] .save[aria-pressed=true]{color:#ff91b7;background:#392438;border-color:#754058}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.navigation{left:auto;right:28px;bottom:28px;transform:none;width:auto;max-width:none;height:auto;min-height:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;gap:8px}
.nav-copy{min-width:0;flex:none}.instruction{font-size:12px}.direction.next{width:28px;height:28px;font-size:19px;background:transparent;color:var(--muted);border:0;box-shadow:none}
@media(max-width:700px){.lead-price .price{font-size:32px}.gallery .product-open{padding:155px 30px 40px}.navigation{right:18px;bottom:28px;width:auto;max-width:none;height:auto;padding:0;gap:4px}.instruction{font-size:10px}.direction.next{width:26px;height:26px}.card-details .info{padding-bottom:105px}}
@media(max-height:680px) and (max-width:700px){.lead-price .price{font-size:28px}.gallery .product-open{padding-top:138px}}
@media(max-height:460px) and (min-width:500px){.lead-price .price{font-size:28px}.gallery .product-open{padding-top:120px}.navigation{bottom:24px}}
@media(prefers-reduced-motion:reduce){.card{clip-path:inset(var(--rest-inset) round var(--rest-radius))}}

/* Stronger card separation; eased endpoints avoid an abrupt edge snap. */
#stage,#feed{background:#dfe3ef}.card{background:var(--surface)}
html[data-theme=dark] #stage,html[data-theme=dark] #feed{background:#080b14}

/* Settled scenes retain their rounded card silhouette. */
@media(max-width:700px){.card{--rest-inset:10px;--rest-radius:24px}}
.demo-note{bottom:19px}
@media(max-width:700px){.demo-note{bottom:16px}}

/* V4 glass study: small surfaces, static highlights, no full-scene blur. */
:root{--glass-fill:linear-gradient(145deg,#ffffffed,#ffffff91);--glass-edge:#ffffffeb;--glass-shadow:#222b5010;--glass-shine:#ffffff91}
html[data-theme=dark]{--glass-fill:linear-gradient(145deg,#3b4269bf,#21273ca3);--glass-edge:#d4ddff38;--glass-shadow:#00000024;--glass-shine:#d5dfff18}
#themeToggle,#savedView,#shuffle,.save,.photo-controls button{background:var(--glass-fill);border:1px solid var(--glass-edge);box-shadow:inset 0 1px 0 var(--glass-shine),0 3px 10px var(--glass-shadow);backdrop-filter:none;-webkit-backdrop-filter:none}
#savedView{padding:9px 12px}#saveCount{background:transparent}
.save[aria-pressed=true]{background:linear-gradient(145deg,#fff6fae8,#f9ccdfb8);border-color:#f0b7ce}
html[data-theme=dark] .save[aria-pressed=true]{background:linear-gradient(145deg,#633951c9,#38283eae);border-color:#e991b954}
.visual{background:linear-gradient(145deg,#f4f6ff,#e9edf9 65%,#e0e6f4)}
html[data-theme=dark] .visual{background:linear-gradient(145deg,#252c46,#191d30 65%,#141a2c)}
.card::after{content:'';position:absolute;inset:calc(var(--rest-inset) + var(--card-inset,0px));border-radius:calc(var(--rest-radius) + var(--card-radius,0px));border:1px solid var(--glass-edge);box-shadow:inset 0 1px 0 var(--glass-shine);pointer-events:none;z-index:6}
@media(min-width:701px) and (hover:hover) and (pointer:fine){#themeToggle,#savedView,#shuffle{backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}}
@media(prefers-reduced-motion:reduce){.card::after{inset:var(--rest-inset);border-radius:var(--rest-radius)}}
@media(prefers-reduced-transparency:reduce){#themeToggle,#savedView,#shuffle,.save,.photo-controls button{background:var(--surface);backdrop-filter:none;-webkit-backdrop-filter:none}}

/* Tiny save accents animate only transforms and opacity. */


.save,#previewSave{overflow:visible}.save-sprinkles{position:absolute;inset:0;pointer-events:none}.save-sprinkles i{position:absolute;left:50%;top:50%;width:4px;height:4px;border-radius:50%;margin:-2px;animation:save-spark .48s cubic-bezier(.15,.7,.3,1) both}
#previewSave{position:relative}
@keyframes save-spark{0%{transform:translate(0,0) scale(.3);opacity:0}15%{opacity:1}100%{transform:translate(var(--dx),var(--dy)) scale(.5);opacity:0}}
@media(max-width:700px){header{gap:6px}#themeToggle{padding:8px}#savedView{padding:8px}header .brand{font-size:19px}}
@media(max-width:360px){header{padding:0 15px;gap:4px}.brand-mark{margin-right:5px}header .brand{font-size:17px}#themeToggle{font-size:11px;padding:7px}#savedView{font-size:12px;padding:7px}}
@media(prefers-reduced-motion:reduce){.save-sprinkles{display:none}}

/* Bolder save celebration remains a short, bounded compositor animation. */
.save-sprinkles i{width:6px;height:6px;margin:-3px;animation:save-spark .68s cubic-bezier(.15,.7,.3,1) both}
.save-sprinkles i.confetti-piece{width:5px;height:9px;border-radius:1px}
@keyframes save-spark{0%{transform:translate(0,0) scale(.2) rotate(0);opacity:0}12%{opacity:1}65%{opacity:1}100%{transform:translate(var(--dx),var(--dy)) scale(.65) rotate(var(--spin));opacity:0}}

/* Saved heart follows the infinitefinds purple branding. */
.save[aria-pressed=true]{color:#5056dc;background:linear-gradient(145deg,#f7f6ffe8,#dcd8ffb8);border-color:#c7c3f0}
html[data-theme=dark] .save[aria-pressed=true]{color:#a4a7ff;background:linear-gradient(145deg,#49406bc9,#2e2948ae);border-color:#a4a7ff54}

#soundToggle{flex-shrink:0;width:34px;height:34px;padding:0;border-radius:50%;border:1px solid var(--glass-edge);color:var(--muted);background:var(--glass-fill);font-size:16px;box-shadow:inset 0 1px 0 var(--glass-shine)}
#soundToggle[aria-pressed=true]{color:var(--accent)}#soundToggle[aria-pressed=false]{opacity:.7}
@media(max-width:700px){#soundToggle{width:28px;height:30px}}
@media(max-width:360px){#soundToggle{width:25px}}

/* Experimental mobile slash and two short-lived card halves. */








.music-panel{position:fixed;right:28px;top:70px;z-index:30;width:260px;padding:18px;border:1px solid var(--glass-edge);border-radius:20px;background:var(--surface);color:var(--ink);box-shadow:0 12px 35px #0002}.music-panel[hidden]{display:none}.music-heading{display:flex;justify-content:space-between;align-items:center}.music-heading strong{font-size:16px}.music-heading button{border:0;background:none;color:var(--muted);font-size:23px;width:30px;height:30px}.music-panel a{display:block;color:var(--accent);font-size:12px;margin:3px 0 14px}.music-play{width:100%;border:1px solid var(--line);border-radius:12px;padding:10px;background:var(--glass-fill);color:var(--ink);font-size:14px}.music-volume{display:flex;gap:12px;align-items:center;font-size:13px;margin:16px 0}.music-volume input{min-width:0;flex:1;accent-color:var(--accent)}.chime-toggle{border:1px solid var(--line);border-radius:50%;width:32px;height:32px;background:var(--glass-fill);color:var(--muted)}.chime-toggle[aria-pressed=true]{color:var(--accent)}.chime-label{font-size:13px;margin-left:9px}
@media(max-width:700px){.music-panel{right:18px;top:64px;width:min(260px,calc(100vw - 36px))}}

.preview-share{display:block;margin-top:14px;padding:8px 0;border:0;background:transparent;color:var(--muted);font-size:14px;text-decoration:underline;text-underline-offset:4px}.audio-settings{position:fixed;z-index:40;top:66px;right:24px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px 18px;width:230px;padding:20px;border-radius:18px;border:1px solid var(--glass-edge);background:var(--surface);color:var(--ink);box-shadow:0 8px 28px #0002;font-size:14px}.audio-settings[hidden]{display:none}.audio-settings input{grid-column:1/-1;width:100%;accent-color:var(--accent)}.audio-settings button{border:1px solid var(--line);border-radius:20px;min-width:48px;min-height:34px;display:inline-flex;align-items:center;justify-content:center;line-height:1;padding:5px 10px;background:var(--glass-fill);color:var(--muted)}.audio-settings button[aria-pressed=true]{color:var(--accent)}@media(max-width:700px){.audio-settings{right:12px;top:60px;width:210px}}

/* Preserve the visible scene when old batches are retired. */
#feed,#imageTrack{overflow-anchor:none}

/* Empty scroll slots keep geometry without allocating card artwork. */
.card:empty{clip-path:none;box-shadow:none;background:transparent;border:0;contain:strict}

.share{position:absolute;right:120px;bottom:140px;width:48px;height:48px;display:grid;place-items:center;padding:0;border-radius:50%;color:var(--muted);border:1px solid var(--glass-edge);background:var(--glass-fill);box-shadow:inset 0 1px 0 var(--glass-shine),0 3px 10px var(--glass-shadow);pointer-events:auto}
@media(max-width:1000px) and (min-width:701px){.share{right:95px;bottom:128px}}
@media(max-width:700px){.share{right:66px;bottom:auto;top:24px;width:37px;height:37px}.card-details .info h1{padding-right:76px}}
@media(max-height:680px) and (max-width:700px){.share{top:14px}}
@media(max-height:460px) and (min-width:500px){.share{right:80px;top:auto;bottom:100px;width:48px;height:48px}}

.card{height:var(--scene-height,100%);min-height:var(--scene-height,100%)}
.audio-settings{grid-template-columns:auto minmax(0,1fr);gap:10px 14px;padding:14px 16px}.audio-settings input{grid-column:auto;margin:0;height:30px}.audio-settings button{justify-self:end}

/* The resting card edge sits below the header; the scene still travels freely. */
.card{clip-path:inset(calc(var(--header-clearance,86px) + var(--card-inset,0px)) calc(var(--rest-inset) + var(--card-inset,0px)) calc(var(--rest-inset) + var(--card-inset,0px)) round calc(var(--rest-radius) + var(--card-radius,0px)))}
.card::after{top:calc(var(--header-clearance,86px) + var(--card-inset,0px))}
@media(prefers-reduced-motion:reduce){.card{clip-path:inset(var(--header-clearance,86px) var(--rest-inset) var(--rest-inset) round var(--rest-radius))}.card::after{top:var(--header-clearance,86px)}}
.card:empty{clip-path:none}

/* Match the header's outer edges to the resting card. */
header{padding-left:16px;padding-right:16px}#themeToggle{width:38px;height:38px;padding:0;display:grid;place-items:center;font-size:20px;flex-shrink:0}@media(max-width:700px){header{padding-left:10px;padding-right:10px}}

/* One compact header menu. */
header #soundToggle{margin-left:auto;width:40px;height:40px;display:grid;place-items:center;color:var(--ink);border-radius:50%;padding:0}
.audio-settings{top:70px;right:16px;width:250px;max-width:calc(100vw - 20px);grid-template-columns:auto minmax(0,1fr)}
.audio-settings #themeToggle{margin-left:0;width:38px;height:34px;font-size:20px}
.audio-settings #savedView{grid-column:1/-1;width:100%;justify-content:space-between;margin:2px 0 0;padding:10px 12px;border-radius:12px;font-size:14px}
@media(max-width:700px){.audio-settings{top:59px;right:10px}header #soundToggle{width:38px;height:38px}}
@media(max-height:680px) and (max-width:700px){.audio-settings{top:50px}}

/* Small photo controls below the image, also on phones. */
@media(max-width:700px){.photo-controls:not([hidden]){display:flex;gap:10px}.photo-controls button{width:36px;height:36px;font-size:22px;color:var(--muted);background:var(--glass-fill)}#preview{overscroll-behavior:contain}}

/* Rapid photo-arrow taps change photos without double-tap page zoom. */
.photo-controls button{touch-action:manipulation}

/* Give phone photos more room without cropping or changing the price position. */
@media(max-width:700px) and (min-height:461px){.gallery .product-open{padding-left:18px;padding-right:18px;padding-bottom:44px}.card-details .info{padding-bottom:85px}}
@media(max-width:499px) and (max-height:460px){.gallery .product-open{padding-left:18px;padding-right:18px}}

/* Photos are gesture surfaces, not preview buttons. */
.gallery .product-open{cursor:default}

.navigation{display:none}
.swipe-intro{position:fixed;z-index:12;right:22px;bottom:55px;pointer-events:none;display:flex;align-items:center;gap:12px;padding:12px 16px;border:1px solid var(--glass-edge);border-radius:18px;background:var(--surface);color:var(--muted);font-size:12px;box-shadow:0 4px 20px #0001;animation:intro-fade 4.2s both}
.swipe-intro svg{color:var(--accent);animation:intro-swipe 2s ease-in-out 2}
@keyframes intro-swipe{0%,100%{transform:translateY(9px);opacity:.5}45%{transform:translateY(-9px);opacity:1}}
@keyframes intro-fade{0%,100%{opacity:0}10%,85%{opacity:1}}
@media(prefers-reduced-motion:reduce){.swipe-intro,.swipe-intro svg{animation:none}}

/* Only the current saved card carries the moving ember edge. */
body[data-view="saved"] .card[aria-hidden="false"]:not(:empty)::after{
 border:0;padding:4px;background:radial-gradient(ellipse at 12% 20%,#ffe0a0 0, #ffad52 5%,transparent 16%),radial-gradient(ellipse at 77% 83%,#ffd284 0,#ff9650 5%,transparent 17%),radial-gradient(ellipse at 80% 12%,#ddd0ff 0,#a787ff 7%,transparent 21%),linear-gradient(125deg,#6750d9 0%,#c37aff 20%,#ffd08c 33%,#8a5bf1 47%,#ffa354 60%,#b48aff 77%,#6750d9 100%);
 background-size:160% 160%;background-position:0% 0%;
 -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
 box-shadow:none;animation:saved-embers 4s ease-in-out infinite;pointer-events:none;
}
@keyframes saved-embers{0%,100%{background-position:0% 15%;opacity:.85}35%{background-position:80% 70%;opacity:1}65%{background-position:35% 100%;opacity:.9}}
@media(prefers-reduced-motion:reduce){body[data-view="saved"] .card[aria-hidden="false"]:not(:empty)::after{animation:none}}

/* Alternate-theme tip is a normal swipeable scene, not a popup. */
.theme-scene{position:absolute;inset:0;background:#141628;color:#f1efff}
.theme-scene[data-look="light"]{background:#f1f3fa;color:#24273c}
.theme-copy{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:calc(var(--header-clearance,86px) + 30px) 36px 60px;text-align:center;mask-image:linear-gradient(to bottom,transparent var(--text-fade-start,86px),#000 var(--text-fade-end,116px));-webkit-mask-image:linear-gradient(to bottom,transparent var(--text-fade-start,86px),#000 var(--text-fade-end,116px))}
.theme-message{max-width:560px}.theme-glyph{display:block;color:#bba8ff;font-size:86px;line-height:1.2;margin-bottom:28px}
.theme-scene[data-look="light"] .theme-glyph{color:#6755d9}
.theme-eyebrow{font-size:12px;letter-spacing:2.5px;opacity:.6;margin:0 0 20px}
.theme-message h1{font-family:Manrope,system-ui;font-size:clamp(36px,5vw,60px);letter-spacing:-1.6px;margin:0 0 22px;line-height:1.12}
.theme-message > p:last-child{font-size:18px;line-height:1.7;opacity:.8;margin:0}
@media(max-width:700px){.theme-copy{padding-left:26px;padding-right:26px}.theme-glyph{font-size:72px}.theme-message > p:last-child{font-size:16px}}

/* Direct controls on the theme and music discovery cards. */
.tip-theme-toggle{margin-top:28px;border:1px solid currentColor;border-radius:24px;padding:12px 22px;color:inherit;background:transparent;font-size:16px;touch-action:manipulation}
.tip-music-control{margin:28px auto 0;display:flex;align-items:center;gap:16px;width:min(300px,100%);font-size:16px;text-align:left}
.tip-music-control input{flex:1;min-width:0;height:44px;margin:0;accent-color:#9680ec;cursor:pointer}
.theme-scene{cursor:pointer}.tip-theme-toggle,.tip-music-control{cursor:auto}
@media(max-height:680px){.theme-glyph{font-size:54px;margin-bottom:16px}.theme-eyebrow{margin-bottom:12px}.tip-theme-toggle,.tip-music-control{margin-top:18px}}

/* Temporary demo counter and upcoming discovery tips. */
header .demo-card-count{margin-left:auto;font-size:12px;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}header #soundToggle{margin-left:4px}.milestone-scene{cursor:default}.milestone-soon{display:block;margin-top:24px;font-size:12px;opacity:.55}.milestone-scene:not(.mix-scene) .theme-message>p:not(.theme-eyebrow){font-size:18px;line-height:1.7;opacity:.8}.milestone-scene .theme-glyph{font-size:64px}@media(max-width:700px){header .demo-card-count{font-size:11px}.milestone-scene:not(.mix-scene) .theme-message>p:not(.theme-eyebrow){font-size:16px}}

/* Brief save reminder at the discovery backtracking boundary. */
.save.save-reminder::after{content:"";position:absolute;inset:-7px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,transparent 43%,#a995ffb3 56%,#ddd2ffcc 64%,transparent 73%);opacity:0;animation:save-reminder-shine 900ms ease-out both}
@keyframes save-reminder-shine{0%{opacity:0;transform:scale(.8)}25%{opacity:1;transform:scale(1)}60%{opacity:.8;transform:scale(1.12)}100%{opacity:0;transform:scale(1.22)}}
@media(prefers-reduced-motion:reduce){.save.save-reminder::after{animation:none;opacity:.75}}
/* Compact Your mix menu, preserving the existing audio controls. */
.audio-settings{width:340px;max-width:calc(100vw - 20px);gap:8px 14px;padding:16px 18px;background:var(--surface);max-height:calc(100dvh - 92px);overflow-y:auto;overscroll-behavior:contain}
.mix-menu-heading{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;margin-bottom:3px}.mix-menu-heading h2{font-size:21px;letter-spacing:-.6px;margin:0;color:var(--ink)}
.audio-settings #closeMenu{background:transparent;border:0;min-width:36px;min-height:36px;font-size:24px;padding:0}.audio-settings #savedView{margin:4px 0;font-size:13px;min-height:38px}
.mix-menu-controls{grid-column:1/-1;border-top:1px solid var(--line);padding-top:6px}
.audio-settings .mix-disclosure{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:44px;border:0;background:transparent;border-radius:0;padding:8px 0;color:var(--ink);font-size:13px;line-height:1.4}
.mix-disclosure span:last-child{color:var(--muted);font-size:12px;text-align:right}.audio-settings .mix-disclosure:disabled{opacity:1}.mix-disclosure[aria-expanded=true] span:last-child{color:var(--accent)}
.mix-options{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:2px 0 12px}.mix-options[hidden]{display:none}
.audio-settings .mix-options button,.mix-card-options button{justify-self:stretch;min-width:0;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);padding:10px 9px;min-height:44px;font-size:12px;line-height:1.3;text-align:left;touch-action:manipulation;white-space:normal}
.audio-settings .mix-options button[aria-pressed=true],.mix-card-options button[aria-pressed=true]{background:var(--control);border-color:var(--accent);color:var(--accent)}
.mix-feedback{font-size:12px;line-height:1.45;color:var(--muted);margin:0 0 10px}.mix-feedback:empty{display:none}
.audio-settings .mix-primary,.mix-primary{display:block;width:100%;border:0;border-radius:14px;padding:13px 16px;min-height:44px;line-height:1.3;font-size:14px;font-weight:600;background:var(--accent);color:#fff;touch-action:manipulation}.mix-primary[hidden]{display:none}
html[data-theme=dark] .mix-primary{background:#7062ea;color:#fff}
.mix-scene{cursor:pointer}.mix-scene .theme-copy{padding:30px 30px}.mix-scene .theme-message{width:100%;max-width:420px}
.mix-scene .theme-message h1{font-size:clamp(30px,4vw,44px);margin-bottom:16px;letter-spacing:-1px}.mix-scene .theme-eyebrow{font-size:11px;letter-spacing:1.6px;margin:0 0 16px}.mix-scene .mix-intro{font-size:15px;line-height:1.5;margin:0 0 22px}
.mix-card-options{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:18px;text-align:left}.mix-card-options button{font-size:14px;min-height:48px;padding:12px}.mix-scene .mix-skip{display:block;border:0;background:transparent;color:inherit;opacity:.7;width:100%;font-size:13px;min-height:44px;touch-action:manipulation;margin-top:5px}
.mix-scene .mix-feedback{margin-bottom:14px;color:inherit}.mix-scene[data-look=dark] .mix-card-options button{background:#24263c;color:#f1efff;border-color:#41435b}.mix-scene[data-look=dark] .mix-card-options button[aria-pressed=true]{background:#35304e;border-color:#bba8ff;color:#bba8ff}
.mix-scene[data-look=light] .mix-card-options button{background:#fff;color:#24273c;border-color:#dedfed}.mix-scene[data-look=light] .mix-card-options button[aria-pressed=true]{background:#eeebff;border-color:#6755d9;color:#6755d9}
@media(max-width:700px){.audio-settings{width:340px}.mix-scene .theme-copy{padding:22px 24px}.mix-scene .theme-message h1{font-size:30px}.mix-scene .mix-intro{font-size:14px}.mix-card-options button{font-size:13px;padding:10px}.mix-scene .theme-eyebrow{font-size:11px}}
@media(max-height:600px){.audio-settings{padding:10px 14px;gap:4px 12px}.mix-menu-heading h2{font-size:18px}.mix-scene .theme-copy{padding:16px 24px}.mix-scene .theme-message h1{font-size:26px;margin-bottom:10px}.mix-scene .mix-intro{font-size:13px;margin-bottom:12px}.mix-scene .theme-eyebrow{margin-bottom:10px}.mix-card-options{gap:6px;margin-bottom:12px}.mix-card-options button{min-height:40px;padding:8px}.mix-scene .mix-skip{min-height:36px}}

/* Welcoming discovery, with an optional recommended starting mix. */
.welcome-symbol{display:block;color:var(--accent);font-size:58px;line-height:1;margin-bottom:24px}.welcome-scene .mix-intro{line-height:1.65}.mix-options button,.mix-card-options button{display:flex;flex-direction:column;justify-content:center;gap:4px}.mix-options small,.mix-card-options small{font-size:10px;opacity:.75}.mix-scene .theme-message h1{overflow-wrap:anywhere}

.combined-mix .theme-copy{overflow-y:auto;overscroll-behavior:contain}.mix-card-disclosure{width:100%;display:flex;justify-content:space-between;align-items:center;min-height:44px;padding:10px 0;color:inherit;background:transparent;border:0;border-bottom:1px solid var(--glass-edge);font-size:15px;text-align:left;touch-action:manipulation}.combined-mix .mix-card-options{margin-top:10px}.combined-mix [hidden]{display:none}.combined-mix .mix-feedback:empty{margin:12px 0}.swipe-intro small{display:inline-block;margin-top:5px;font-size:11px;opacity:.75}

/* Keep the mix heading stable as choices expand, including short phone viewports. */
.combined-mix .theme-copy{align-items:flex-start;padding:calc(var(--header-clearance,86px) + 40px) 30px 30px;scroll-padding-top:24px}.combined-mix .theme-message{flex-shrink:0;text-align:left}.combined-mix .mix-primary{width:100%;margin-top:12px}.combined-mix .mix-skip{text-align:center}.combined-mix .mix-card-options button{align-items:flex-start}.combined-mix .theme-eyebrow{margin-bottom:12px}.combined-mix .mix-intro{margin-bottom:18px}
@media(max-width:700px){.combined-mix .theme-copy{padding:calc(var(--header-clearance,86px) + 28px) 24px 28px}.combined-mix .theme-message h1{font-size:30px}}
@media(max-height:600px){.combined-mix .theme-copy{padding:calc(var(--header-clearance,86px) + 16px) 24px 24px}.combined-mix .theme-message h1{font-size:26px}}

/* Visual first-product guidance: composited motion only, never blocks input. */
.gesture-intro{position:absolute;z-index:5;left:50%;top:55%;width:64px;height:120px;transform:translate(-50%,-50%);pointer-events:none;color:var(--accent);transition:opacity .25s}.gesture-intro.gesture-done{opacity:0}.gesture-path{position:absolute;left:28px;top:0;width:4px;height:100px;border-radius:8px;background:linear-gradient(transparent,var(--accent));opacity:.3;animation:gesture-path-reveal 1.5s ease-in-out both}.gesture-hand{position:absolute;left:4px;top:65px;animation:gesture-hand-up 1.5s cubic-bezier(.2,.7,.2,1) both}.save.save-onboarding{color:var(--accent);border-color:var(--accent)}.save.save-onboarding::after{content:"";position:absolute;inset:-9px;border:2px solid var(--accent);border-radius:50%;pointer-events:none;animation:save-onboarding-pulse 1.2s ease-out 2 both}
@keyframes gesture-hand-up{0%{opacity:0;transform:translateY(24px)}18%{opacity:1}75%{opacity:1;transform:translateY(-64px)}100%{opacity:0;transform:translateY(-72px)}}
@keyframes gesture-path-reveal{0%,100%{opacity:0}30%,70%{opacity:.35}}
@keyframes save-onboarding-pulse{0%{opacity:0;transform:scale(.9)}25%{opacity:.65}100%{opacity:0;transform:scale(1.45)}}
@media(prefers-reduced-motion:reduce){.gesture-hand,.gesture-path{animation:none;opacity:.75}.gesture-hand{top:20px}.gesture-path{height:60px}.save.save-onboarding::after{animation:none;opacity:.55;transform:none}.gesture-intro{transition:none}}

.intro-welcome{background:radial-gradient(ellipse at 50% 25%,#7463dd24,transparent 65%),var(--surface)}.intro-welcome .theme-copy{padding:calc(var(--header-clearance,86px) + 24px) 28px 48px;overflow-y:auto}.intro-welcome .theme-message{width:100%;max-width:450px;flex-shrink:0}.intro-welcome .theme-eyebrow{font-size:11px;letter-spacing:1.7px;margin:32px 0 16px;opacity:.6}.intro-welcome h1{font-size:clamp(30px,4vw,44px);line-height:1.15}.intro-description{font-size:17px;line-height:1.7;opacity:.75;margin:0 0 32px}.intro-welcome .mix-primary{min-height:50px;padding:14px 26px;border-radius:16px;display:inline-flex;gap:24px;align-items:center;justify-content:center}.intro-orbit{position:relative;width:120px;height:120px;margin:0 auto;border:1px solid #a995ff35;border-radius:38px;display:grid;place-items:center;background:linear-gradient(145deg,#a995ff20,#7463dd0a);box-shadow:0 16px 50px #7463dd15;color:var(--accent)}.intro-orbit span{font-size:80px;line-height:1}.intro-orbit i{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--accent);opacity:.45}.intro-orbit i:nth-of-type(1){left:-16px;top:20px}.intro-orbit i:nth-of-type(2){right:-18px;bottom:24px;width:5px;height:5px}.intro-orbit i:nth-of-type(3){right:10px;top:-17px;width:4px;height:4px}@media(max-width:700px){.intro-welcome h1{font-size:32px}.intro-description{font-size:16px}.intro-orbit{width:100px;height:100px;border-radius:30px}.intro-orbit span{font-size:68px}}@media(max-height:600px){.intro-welcome .theme-copy{align-items:flex-start;padding-top:calc(var(--header-clearance,86px) + 20px)}.intro-orbit{width:72px;height:72px}.intro-orbit span{font-size:50px}.intro-welcome .theme-eyebrow{margin-top:20px}.intro-description{margin-bottom:20px}}

#fullscreenToggle{display:grid;place-items:center;width:44px;height:36px;border:1px solid var(--glass-edge);border-radius:12px;background:var(--glass-fill);color:var(--ink)}.exit-fullscreen{position:fixed;z-index:25;right:max(20px,env(safe-area-inset-right));top:calc(env(safe-area-inset-top,0px) + 20px);width:44px;height:44px;display:grid;place-items:center;color:var(--ink);background:var(--glass-fill);border:1px solid var(--glass-edge);border-radius:50%;touch-action:manipulation}.exit-fullscreen[hidden]{display:none}body.immersive header,body.immersive .demo-note,body.immersive .topline,body.immersive .navigation{display:none}body.immersive .card{--rest-inset:0px;--rest-radius:0px;clip-path:inset(0);border-radius:0}body.immersive .card::after{display:none}body.immersive #stage,body.immersive #feed{border-radius:0}body.immersive .lead-price{top:calc(env(safe-area-inset-top,0px) + 42px)}body.immersive .card-details{mask-image:none;-webkit-mask-image:none}body.immersive .intro-welcome .theme-copy{padding-top:calc(env(safe-area-inset-top,0px) + 78px)}body.immersive .combined-mix .theme-copy{padding-top:calc(env(safe-area-inset-top,0px) + 82px)}body.immersive .gallery .product-open{padding-top:120px}@media(max-width:700px){body.immersive .lead-price{left:24px;top:calc(env(safe-area-inset-top,0px) + 36px)}body.immersive .gallery .product-open{padding-top:130px}.exit-fullscreen{right:20px}}

/* Share stays accessible but quieter than saving. */
.share{background:transparent;border-color:transparent;box-shadow:none;opacity:.65}.share:hover,.share:focus-visible{opacity:1;background:var(--glass-fill);border-color:var(--glass-edge)}