@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;1,500&display=swap');
:root{--bg:#0b0b0c;--panel:#141415;--line:#2b2b2e;--white:#f5f4f0;--muted:#96969c;--silver:#d0d0d2;--gold:#c8bda5}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--white);font-family:'DM Sans',sans-serif;font-size:14px}.topbar{min-height:72px;border-bottom:1px solid #252527;display:flex;align-items:center;justify-content:space-between;padding:12px clamp(16px,5vw,70px)}button,input,select{font:inherit}button{cursor:pointer;transition:.2s}button:disabled{opacity:.35;cursor:not-allowed}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--white);font-size:13px;letter-spacing:3px}.brand b{font-weight:400;color:#aaa}.brand small{display:block;color:#737378;font:9px 'DM Mono',monospace;letter-spacing:2px;margin-top:5px}.mark{display:grid;place-items:center;border:1px solid #777;border-radius:50%;width:36px;height:36px;font:italic 23px 'Playfair Display';color:#ddd}.shell{max-width:1240px;margin:auto;padding:0 clamp(14px,4vw,48px)}.intro{padding:34px 0 28px}.eyebrow{font:10px 'DM Mono',monospace;letter-spacing:1.5px;color:var(--gold);margin:0 0 12px}.intro h1{font-size:clamp(38px,6vw,60px);font-weight:500;letter-spacing:-2px;margin:0}.intro h1 i{font:italic 500 1em 'Playfair Display';color:#c9c4b9}.sub{color:#99999e;line-height:1.65;margin-top:12px}.booth-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(270px,.8fr);gap:16px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:8px}.camera-panel,.strip-panel,.options{padding:15px}.panel-head{display:flex;justify-content:space-between;align-items:center;color:#d9d9dc;min-height:20px;font:10px 'DM Mono',monospace;letter-spacing:1.3px}.muted{color:var(--muted);font-size:12px;letter-spacing:0;line-height:1.7}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#aaa;margin:0 7px 1px 0}.viewfinder{margin-top:14px;background:#090909;aspect-ratio:4/3;position:relative;overflow:hidden;border:1px solid #303033;display:grid;place-items:center}.viewfinder video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1);filter:none}.placeholder{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:9px;background:radial-gradient(ellipse,#222 0%,#0b0b0b 70%);color:#c9c9cc;text-align:center;padding:15px}.placeholder[hidden]{display:none}.placeholder span{font-size:12px;color:#777}.lens{font-size:38px;color:#777}.vf-label{position:absolute;bottom:10px;left:10px;color:#aaa;font:8px 'DM Mono',monospace;letter-spacing:1px}.countdown{position:absolute;inset:0;display:grid;place-items:center;font-size:clamp(60px,10vw,110px);font-weight:600;text-shadow:0 4px 20px #000;pointer-events:none}.controls{display:flex;align-items:end;gap:9px;flex-wrap:wrap;padding-top:14px}.field{display:flex;flex-direction:column;gap:7px;color:#888;flex:1;min-width:100px;font:9px 'DM Mono',monospace;letter-spacing:1.1px;margin:11px 0}.field select,.field input{width:100%;min-width:0;background:#0e0e0f;color:#e8e8e8;border:1px solid #363639;padding:11px 9px;border-radius:4px;outline:none;font:12px 'DM Sans',sans-serif;letter-spacing:0}.outline,.ghost,.primary{border-radius:4px;padding:12px 14px;font-size:11px;letter-spacing:.3px}.outline{border:1px solid #626267;background:transparent;color:#f0f0f0}.outline:hover,.ghost:hover{background:#252527}.ghost{background:transparent;border:1px solid transparent;color:#aaa}.primary{background:#e7e5df;color:#111;border:1px solid #e7e5df;font-weight:700}.primary:hover{background:#fff}.note,.micro{font-size:10px;color:#85858a;line-height:1.7}.side{display:flex;flex-direction:column;gap:16px}.strip-wrap{background:#0b0b0c;border:1px solid #252527;margin:14px auto 10px;width:min(100%,170px);aspect-ratio:1/2.5;position:relative;display:grid;place-items:center;overflow:hidden}.strip-wrap canvas{width:100%;height:100%;object-fit:contain}.strip-empty{position:absolute;color:#68686d;font:10px 'DM Mono',monospace;text-align:center;line-height:1.8;pointer-events:none}.row-actions{display:flex;justify-content:space-between}.options .field{margin:13px 0}.options .primary{width:100%;padding:15px}.micro{font:9px 'DM Mono',monospace;letter-spacing:.3px}.ad-slot{margin:22px 0;border:1px dashed #353539;border-radius:5px;min-height:92px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#777}.ad-label{font:8px 'DM Mono',monospace;letter-spacing:1.4px;color:#777}.ad-placeholder{font-size:11px;color:#59595e}.ad-top{margin-top:20px}.keepsake{padding:21px;display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center}.keepsake h2,.how h2{font:500 26px 'Playfair Display',serif;margin:0 0 8px}.keepsake p{margin:0}.actions{display:flex;gap:8px;flex-wrap:wrap}.share-status{grid-column:1/-1;color:#c8bda5;font-size:11px}.how{padding:42px 0 20px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px}.steps article{border:1px solid #29292c;border-radius:6px;padding:18px;background:#111112}.steps article span{font:11px 'DM Mono';color:var(--gold)}.steps h3{font:500 17px 'Playfair Display',serif;margin:16px 0 8px}.steps p{font-size:12px;line-height:1.7;color:#929297;margin:0}footer{border-top:1px solid #252527;padding:22px 0;color:#6f6f75;display:flex;justify-content:space-between;gap:12px;font:9px 'DM Mono',monospace;letter-spacing:1px}.ad-slot ins{display:block;width:100%}
@media(max-width:780px){.booth-grid{grid-template-columns:1fr}.side{display:grid;grid-template-columns:1fr 1fr;align-items:start}.strip-wrap{width:min(100%,150px)}.keepsake{grid-template-columns:1fr}.actions>*{flex:1}.steps{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.topbar{min-height:64px}.brand{font-size:11px;letter-spacing:2px}.intro{padding:28px 0 20px}.intro h1{letter-spacing:-1.5px}.side{display:flex}.strip-wrap{width:165px}.controls .field{min-width:calc(50% - 10px)}.controls button{flex:1}.keepsake{padding:16px}.actions{display:grid;grid-template-columns:1fr 1fr}.actions .primary{grid-column:1/-1}.steps{grid-template-columns:1fr}footer{flex-direction:column;line-height:1.7}.ad-slot{min-height:78px}}
.qr-result{margin-top:22px;padding:22px;border:1px solid #343434;border-radius:12px;text-align:center;background:#111}.qr-result h3{font-family:Georgia,serif;font-weight:400}.qr-result img{display:block;background:#fff;padding:10px;border-radius:6px;margin:14px auto;max-width:100%;height:auto}.qr-result a{color:#fff}.qr-result[hidden]{display:none}.ad-slot{margin:22px auto;text-align:center;min-height:40px;max-width:100%}.ad-placeholder{padding:12px;border:1px dashed #444;color:#666;font-size:11px}.ad-label{display:block;font-size:9px;letter-spacing:1.5px;color:#777;margin-bottom:7px}footer a{color:#eee}

.ad-recovery{margin:12px 0;padding:14px 16px;border:1px solid #696969;border-radius:10px;background:#171717;color:#e9e9e9;font-size:14px;line-height:1.55}.ad-recovery strong{display:block;margin-bottom:3px}.ad-recovery[hidden]{display:none!important}

/* Elegant motion system and animated installation experience */
@keyframes fade-up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@keyframes soft-glow{0%,100%{opacity:.35;transform:scale(1)}50%{opacity:.7;transform:scale(1.08)}}
@keyframes shimmer{0%{background-position:180% 0}100%{background-position:-180% 0}}
@keyframes float-in{0%{opacity:0;transform:translateY(12px) scale(.985)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes pulse-dot{0%,100%{box-shadow:0 0 0 0 #c8bda540}50%{box-shadow:0 0 0 7px #c8bda500}}
body{animation:fade-up .65s ease both}
.topbar,.intro,.camera-panel,.strip-panel,.options,.keepsake,.how,.ad-slot,footer{animation:float-in .7s cubic-bezier(.2,.75,.25,1) both}
.intro{animation-delay:.06s}.camera-panel{animation-delay:.12s}.strip-panel{animation-delay:.18s}.side .options{animation-delay:.24s}.keepsake{animation-delay:.3s}.how{animation-delay:.36s}
.panel{transition:border-color .25s ease,transform .25s ease,box-shadow .25s ease}
.panel:hover{border-color:#4a4845;box-shadow:0 12px 34px #00000024}
button,.outline,.ghost{transition:transform .22s ease,background .22s ease,border-color .22s ease,box-shadow .22s ease}
button:not(:disabled):hover{transform:translateY(-2px)}button:not(:disabled):active{transform:translateY(0) scale(.985)}
.brand .mark{transition:transform .4s ease,border-color .4s ease,box-shadow .4s ease}.brand:hover .mark{transform:rotate(-10deg) scale(1.06);border-color:var(--gold);box-shadow:0 0 22px #c8bda526}
.viewfinder{isolation:isolate}.viewfinder:after{content:"";position:absolute;inset:0;pointer-events:none;border:1px solid #ffffff12;background:linear-gradient(120deg,transparent 25%,#ffffff08 48%,transparent 68%);background-size:220% 100%;animation:shimmer 8s linear infinite}
.countdown{animation:float-in .25s ease both;text-shadow:0 0 32px #fff8}
.strip-wrap canvas{animation:float-in .45s ease both}
.primary{box-shadow:0 5px 18px #e7e5df0b}.primary:hover{box-shadow:0 8px 26px #e7e5df1a}
.installer-page{min-height:100vh;overflow-x:hidden;background:radial-gradient(ellipse at 50% -10%,#252321 0%,#101011 43%,#080809 100%)}
.installer-shell{position:relative;z-index:1;max-width:760px;padding-top:clamp(28px,7vh,76px);padding-bottom:36px}
.ambient{position:fixed;width:380px;height:380px;border-radius:50%;filter:blur(75px);pointer-events:none;z-index:0;background:#b9a98a16;animation:soft-glow 9s ease-in-out infinite}
.ambient-one{top:-150px;left:-130px}.ambient-two{right:-170px;bottom:-180px;background:#7c7c8517;animation-delay:-4.5s}
.installer-card{position:relative;overflow:hidden;padding:clamp(22px,5vw,48px);border-radius:22px;border-color:#44413b;background:linear-gradient(145deg,#1b1b1cfa,#111112fa);box-shadow:0 30px 90px #0008;animation:float-in .75s cubic-bezier(.2,.75,.25,1) both}
.installer-card:before{content:"";position:absolute;top:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,#d8ccb1aa,transparent)}
.install-logo{display:flex;align-items:center;gap:14px;margin-bottom:25px}.install-logo .mark{width:48px;height:48px;font-size:29px;border-color:#a99d86;box-shadow:0 0 28px #c8bda51c;animation:float-in .7s ease both}.install-logo .eyebrow{margin:0}
.installer-card h1{font-size:clamp(38px,7vw,58px);letter-spacing:-1.8px;font-weight:500;margin:0 0 10px}.installer-card h1 i{font-family:'Playfair Display',serif;color:#d1c5ad;font-weight:500}
.install-lead{max-width:510px;color:#aaa9ac;line-height:1.75;margin:0 0 30px}
.install-form{display:grid;gap:16px}.form-section-label{display:flex;align-items:center;gap:10px;margin:7px 0 0;color:#d0c5af;font:10px 'DM Mono',monospace;letter-spacing:1.6px}.form-section-label span{display:grid;place-items:center;width:25px;height:25px;border:1px solid #5d5548;border-radius:50%;color:#e8dfce}
.install-form .field{display:block;margin:0;color:#c8c7c4;font:10px 'DM Mono',monospace;letter-spacing:1.1px}.install-form input{width:100%;margin-top:9px;background:#0d0d0e;border:1px solid #39393c;border-radius:11px;padding:15px 14px;color:#f6f3ec;font:14px 'DM Sans',sans-serif;letter-spacing:0;outline:none;transition:border-color .25s,box-shadow .25s,background .25s}.install-form input:focus{border-color:#b9aa8e;box-shadow:0 0 0 4px #c8bda514;background:#111112}.install-form small{display:block;margin-top:7px;color:#7f7f84;font:11px 'DM Sans',sans-serif;letter-spacing:0;line-height:1.5}
.install-submit{display:flex;align-items:center;justify-content:center;gap:16px;width:100%;padding:16px;border-radius:11px;margin-top:8px}.install-submit span{font-size:20px;transition:transform .2s}.install-submit:hover span{transform:translateX(4px)}
.install-footnote{display:flex;align-items:center;gap:9px;color:#85858a;font-size:11px;margin:20px 0 0}.pulse-dot{width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:#c8bda5;animation:pulse-dot 2.3s ease-out infinite}
.install-error{border:1px solid #784c4c;background:#2a1717;color:#f3c9c9;padding:13px 15px;border-radius:10px;line-height:1.6}.success-card{padding:22px;border:1px solid #5b6556;background:linear-gradient(140deg,#1c251c,#141615);border-radius:14px;animation:float-in .4s ease both}.success-card h2{font:500 27px 'Playfair Display',serif;margin:7px 0}.success-card p{color:#c2c8c0;line-height:1.7}.success-card a{color:#fff}.success-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#d9e7d3;color:#182018;font-size:20px}.success-card code{color:#fff;background:#0005;padding:3px 6px;border-radius:4px}.install-footer{text-align:center;color:#67676d;padding:22px 0;font:10px 'DM Mono',monospace;letter-spacing:1.1px;animation:fade-up .9s ease both}
.footer-links{display:flex;flex-wrap:wrap;gap:12px}.footer-links a{color:#929096;text-decoration:none}.footer-links a:hover{color:#f5f4f0}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
@media(max-width:520px){.installer-shell{padding-top:18px}.installer-card{border-radius:16px}.install-logo{margin-bottom:20px}.install-lead{margin-bottom:23px}.footer-links{gap:10px}}
.legal-shell{max-width:900px;padding-top:clamp(30px,7vh,70px);padding-bottom:50px}.legal-card{padding:clamp(22px,5vw,48px);border-radius:16px;animation:float-in .55s ease both}.legal-card h1{font-size:clamp(36px,6vw,52px);font-weight:500;letter-spacing:-1.5px;margin:0 0 10px}.legal-intro{color:#c8bda5;font-size:16px;line-height:1.7;margin:0 0 30px}.legal-body{color:#b6b5b8;font-size:14px;line-height:1.85}.legal-body h2{font:500 23px 'Playfair Display',serif;color:#f2f0eb;margin:28px 0 8px}.legal-body p{margin:0 0 16px}.legal-body a,.legal-updated a{color:#e8dfce}.contact-link{display:inline-flex;padding:12px 16px;border:1px solid #686052;border-radius:9px;text-decoration:none}.legal-updated{border-top:1px solid #303033;padding-top:18px;margin-top:30px;color:#77777e;font-size:11px}.legal-footer{max-width:1150px;margin:0 auto;padding:22px 24px 35px;border-top:1px solid #252527;color:#6f6f75;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font:9px 'DM Mono',monospace;letter-spacing:1px}

/* E-Booth studio refresh */
[hidden]{display:none!important}
.hero{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:30px;padding:clamp(34px,6vw,72px) 0 52px;min-height:390px;overflow:hidden}
.hero-copy{position:relative;z-index:1}.hero h1{font-size:clamp(44px,6.4vw,76px);line-height:1.03;font-weight:500;letter-spacing:-2.8px;margin:0}.hero h1 i{font-family:'Playfair Display',serif;font-weight:500;color:#c8bda5}.hero .sub{max-width:480px;font-size:15px;line-height:1.85;margin:20px 0}.hero-meta{display:flex;flex-wrap:wrap;gap:18px;color:#77777e;font:9px 'DM Mono',monospace;letter-spacing:1px;margin:25px 0}.hero-art{height:300px;position:relative;max-width:440px;width:100%;margin:auto}.hero-photo{position:absolute;width:48%;height:78%;background:linear-gradient(145deg,#4a4844,#171718 72%);border:7px solid #f0eee8;box-shadow:0 20px 50px #0008;display:flex;align-items:end;padding:14px;color:#292827;font:9px 'DM Mono',monospace;letter-spacing:1.5px}.hero-photo:before{content:'✳';position:absolute;inset:12px 12px 35px;display:grid;place-items:center;color:#d4ccbb;font-size:64px;border:1px solid #ffffff26;background:radial-gradient(ellipse at center,#c6bba333,transparent 60%)}.hero-photo-a{left:8%;top:7%;transform:rotate(-9deg)}.hero-photo-b{right:7%;top:14%;transform:rotate(8deg);background:linear-gradient(145deg,#bdb4a5,#44413d 65%)}.hero-photo-b:before{color:#f4eee1}.hero-stamp{position:absolute;left:40%;bottom:0;transform:rotate(-8deg);width:98px;height:98px;border:1px solid #c8bda5;border-radius:50%;display:grid;place-content:center;text-align:center;color:#c8bda5;font:10px 'DM Mono',monospace;letter-spacing:2px;background:#111;box-shadow:0 10px 25px #0008}
.start-now{display:none;min-width:170px;padding:16px 20px;border-radius:999px;text-align:left;font-size:12px;box-shadow:0 10px 30px #e7e5df12}.start-now span{float:right;font-size:17px;margin-top:-4px}
.studio-section{scroll-margin-top:16px}.studio-title{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 0 18px;padding-top:10px}.studio-title h2,.finish-heading h2{font:500 clamp(28px,4vw,42px) 'Playfair Display',serif;margin:0 0 6px}.studio-title .muted{margin:0}.studio-pill{display:inline-flex;align-items:center;gap:8px;border:1px solid #353539;border-radius:999px;padding:9px 12px;color:#b6b5b8;font:9px 'DM Mono',monospace;letter-spacing:1px;white-space:nowrap}.studio-pill .dot{background:#9eae91;box-shadow:0 0 0 4px #9eae911a}
.booth-grid{grid-template-columns:minmax(0,1.45fr) minmax(255px,.68fr);align-items:start;gap:18px}.camera-panel,.strip-panel,.options{border-radius:12px;padding:clamp(13px,2vw,20px)}.viewfinder{aspect-ratio:4/3;border-radius:8px;margin-top:12px;background:#080808}.viewfinder video{display:block;width:100%;height:100%;object-fit:cover;transform:none;filter:none}.viewfinder:after{border-radius:8px;background:linear-gradient(180deg,#0003,transparent 24%,transparent 76%,#0004)}.vf-label{z-index:2;bottom:12px;left:13px;color:#f2f0eb;font-size:8px;text-shadow:0 1px 5px #000}.placeholder{z-index:3}.countdown{z-index:4;background:#0002;color:white;font-family:'Playfair Display',serif;font-weight:500}
.shutter-row{display:flex;align-items:center;gap:17px;padding:16px 0 7px;border-bottom:1px solid #29292c}.shutter{display:flex;align-items:center;gap:12px;background:transparent;border:0;color:#f5f4f0;padding:5px 8px 5px 0;font-size:12px;font-weight:600;letter-spacing:.2px}.shutter:disabled{opacity:.4}.shutter-ring{display:grid;place-items:center;width:58px;height:58px;border:2px solid #eeeae1;border-radius:50%;box-shadow:0 0 0 4px #eeeae11c;transition:transform .18s,box-shadow .18s}.shutter:not(:disabled):active .shutter-ring{transform:scale(.92);box-shadow:0 0 0 7px #eeeae122}.shutter-ring span{width:42px;height:42px;border-radius:50%;background:#f2f0e9;display:block;box-shadow:inset 0 0 0 1px #fff}.shutter-hint{display:flex;align-items:center;gap:10px;color:#9b9a9e;font-size:11px;line-height:1.5}.hint-icon{display:grid;place-items:center;width:29px;height:29px;border:1px solid #363639;border-radius:50%;font-size:17px;color:#c8bda5;flex-shrink:0}
.controls{padding-top:10px;gap:10px}.controls .field{min-width:110px}.controls .outline{min-height:40px}.studio-settings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px;border-top:1px solid #29292c;margin-top:7px;padding-top:4px}.field{font-family:'DM Mono',monospace;letter-spacing:.8px}.field select,.field input{border-radius:7px;background:#101011;border-color:#363639;padding:12px}.field select:focus,.field input:focus{border-color:#c8bda5}.capture-progress{margin:8px 0 10px;padding:13px;border:1px solid #2e2e31;border-radius:8px;background:#101011}.progress-label{display:flex;justify-content:space-between;gap:12px;color:#88888e;font:9px 'DM Mono',monospace;letter-spacing:1px}.progress-label strong{color:#e7e5df;font-weight:400;letter-spacing:0}.progress-track{height:3px;background:#2a2a2d;margin-top:10px;border-radius:4px;overflow:hidden}.progress-track span{display:block;width:0;height:100%;background:#c8bda5;transition:width .3s ease}.note{margin:12px 0 0}.side{gap:14px}.strip-panel{position:relative}.strip-subtitle{color:#85858a;font-size:11px;line-height:1.6;margin:8px 0 0}.strip-wrap{width:min(100%,205px);aspect-ratio:1/2.7;margin:15px auto 12px;border-radius:6px;background:#0a0a0a;border-color:#333}.strip-wrap canvas{display:block;width:100%;height:100%;object-fit:fill}.strip-empty{font-size:10px}.strip-empty span{font-size:26px;color:#c8bda5}.row-actions{border-top:1px solid #29292c;padding-top:8px}.row-actions button{font-size:10px}.finish-button{width:100%;border-radius:7px;padding:15px 16px;margin-top:12px;text-align:left}.finish-button span{float:right;font-size:17px;margin-top:-3px}.options h3{font:500 21px 'Playfair Display',serif;margin:0 0 8px}.options p:last-child{margin:0}.ad-slot{border-radius:8px}
.finish-page{padding:36px 0 55px;min-height:65vh}.back-button{padding-left:0;margin-bottom:28px}.finish-heading{text-align:center;max-width:650px;margin:0 auto 34px}.finish-heading h2{font-size:clamp(42px,6vw,64px);margin-bottom:12px}.finish-heading>p:last-child{color:#a2a1a5;line-height:1.8;font-size:13px}.finish-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.8fr);gap:18px;max-width:900px;margin:auto;align-items:start}.finish-preview,.qr-card,.final-note{border-radius:12px;padding:22px}.finish-preview{display:flex;align-items:center;flex-direction:column}.finish-label{align-self:flex-start;color:#aaa9ae;font:9px 'DM Mono',monospace;letter-spacing:1.5px}.finish-preview>img{display:block;max-width:min(100%,290px);max-height:620px;object-fit:contain;margin:20px auto;border:8px solid #f1eee7;background:#f1eee7;box-shadow:0 15px 45px #0007}.finish-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}.finish-actions>*{padding:13px 8px;border-radius:6px}.finish-actions #download{grid-column:1/-1}.finish-preview .share-status{margin:10px 0 0}.finish-details{display:flex;flex-direction:column;gap:14px}.qr-card{text-align:center}.qr-icon{display:grid;place-items:center;margin:0 auto 16px;width:44px;height:44px;border:1px solid #4b473e;border-radius:50%;color:#d1c6ae;font-size:23px}.qr-card h3{font:500 24px 'Playfair Display',serif;margin:0 0 8px}.qr-card>p.muted{max-width:270px;margin:0 auto 15px}.qr-result{border-top:1px solid #2c2c2f;padding-top:17px;margin-top:15px}.qr-result p{font-size:11px;color:#a4a3a8;line-height:1.7}.qr-result img{display:block;max-width:100%;height:auto;margin:14px auto;background:white;padding:8px;border-radius:5px}.qr-result a{color:#e8dfce;overflow-wrap:anywhere}.final-note{display:flex;gap:13px;align-items:flex-start}.final-note>span{color:#c8bda5;font-size:20px}.final-note strong{font:500 16px 'Playfair Display',serif}.final-note p{margin:5px 0 0}
@media(min-width:781px){.studio-section{display:block}.start-now{display:none}.hero{margin-bottom:8px}.side{position:relative}.strip-panel{position:sticky;top:15px}}
@media(max-width:780px){.hero{grid-template-columns:1fr;min-height:0;padding:34px 0 26px;gap:15px}.hero-art{height:210px;max-width:320px}.hero-photo{height:80%;width:45%;border-width:5px}.hero-stamp{width:76px;height:76px;font-size:8px}.hero h1{font-size:clamp(43px,10vw,62px)}.start-now{display:block}.studio-section{display:none}.studio-section.started{display:block}.studio-title{padding-top:22px}.booth-grid{grid-template-columns:minmax(0,1fr) minmax(180px,.65fr);gap:12px}.side{display:flex}.strip-wrap{width:min(100%,170px)}.finish-grid{grid-template-columns:minmax(0,1fr) minmax(240px,.9fr)}}
@media(max-width:560px){.shell{padding:0 15px}.topbar{padding:12px 15px}.hero{padding-top:27px;padding-bottom:18px}.hero h1{font-size:45px;letter-spacing:-1.8px}.hero .sub{font-size:13px;margin:15px 0}.hero-meta{gap:11px;font-size:8px;margin:19px 0}.hero-art{height:185px;width:90%}.studio-section.started{padding-top:4px}.studio-title{align-items:flex-start}.studio-title h2{font-size:30px}.studio-title .muted{font-size:11px}.studio-pill{font-size:8px;padding:8px}.booth-grid{grid-template-columns:1fr}.camera-panel{padding:12px}.viewfinder{aspect-ratio:3/4;max-height:62vh;min-height:280px}.shutter-row{gap:13px}.shutter-ring{width:56px;height:56px}.shutter-ring span{width:40px;height:40px}.controls{display:grid;grid-template-columns:1fr 1fr;gap:0 10px}.controls .field{min-width:0}.controls #enable-camera{grid-column:1/-1;width:100%;margin:4px 0 8px}.studio-settings{gap:0 10px}.field select,.field input{font-size:13px}.side{display:flex}.strip-panel{padding:15px}.strip-wrap{width:min(65%,190px);aspect-ratio:1/2.7}.options{display:none}.finish-page{padding-top:20px}.finish-heading{margin-bottom:22px}.finish-heading h2{font-size:45px}.finish-grid{grid-template-columns:1fr}.finish-preview,.qr-card,.final-note{padding:17px}.finish-preview>img{max-height:58vh}.finish-details{gap:12px}.finish-actions{grid-template-columns:1fr 1fr}.ad-slot{margin:15px 0}.how{padding-top:30px}}
.strip-wrap canvas{object-fit:contain!important}
body.finishing .ad-slot,body.finishing #how,body.finishing footer{display:none!important}

/* Mobile-first studio overlay: keep the landing page clean until Start now is tapped. */
.studio-title-actions{display:flex;align-items:center;gap:10px}.close-studio{display:none;white-space:nowrap}
@media(max-width:780px){
  .studio-section{display:none!important}
  body.mobile-studio-open{overflow:hidden}
  body.mobile-studio-open .studio-section,
  body.mobile-studio-open .studio-section.started{display:block!important;position:fixed;inset:0;z-index:1000;overflow-y:auto;overscroll-behavior:contain;background:#0b0b0c;padding:16px max(14px,env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));margin:0;scrollbar-width:thin}
  body.mobile-studio-open .studio-title{position:sticky;top:-16px;z-index:10;background:#0b0b0c;padding:12px 0 14px;margin:0 0 12px;border-bottom:1px solid #29292c}
  body.mobile-studio-open .close-studio{display:inline-flex;align-items:center;justify-content:center;border:1px solid #45454a;padding:10px 12px;border-radius:999px;font-size:11px}
  body.mobile-studio-open .studio-pill{display:none}
  body.mobile-studio-open .booth-grid{grid-template-columns:minmax(0,1fr);gap:12px}
  body.mobile-studio-open .camera-panel{width:100%;min-width:0}
  body.mobile-studio-open .viewfinder{width:100%;aspect-ratio:3/4;max-height:none;height:auto;min-height:0;overflow:hidden;position:relative}
  body.mobile-studio-open .viewfinder video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center}
  body.mobile-studio-open .shutter-row{position:relative;display:flex;align-items:center;gap:14px;padding:14px 0}
  body.mobile-studio-open .shutter{min-width:128px;min-height:62px;gap:12px;touch-action:manipulation}
  body.mobile-studio-open .shutter-ring{width:62px;height:62px;flex:0 0 62px}
  body.mobile-studio-open .shutter-ring span{width:46px;height:46px}
  body.mobile-studio-open .side{display:block;width:100%}
  body.mobile-studio-open .strip-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(90px,38%);column-gap:12px;align-items:start}
  body.mobile-studio-open .strip-panel .panel-head,body.mobile-studio-open .strip-panel .strip-subtitle,body.mobile-studio-open .strip-panel .row-actions,body.mobile-studio-open .strip-panel .finish-button{grid-column:1/-1}
  body.mobile-studio-open .strip-wrap{grid-column:2;grid-row:3 / span 2;width:100%;max-width:170px;aspect-ratio:1/2.7;margin:8px auto}
  body.mobile-studio-open .strip-empty{font-size:9px}
  body.mobile-studio-open .options{display:none}
  body.mobile-studio-open .studio-settings{grid-template-columns:repeat(2,minmax(0,1fr))}
  body.mobile-studio-open .finish-button{position:sticky;bottom:calc(8px + env(safe-area-inset-bottom));z-index:5;box-shadow:0 6px 28px #0009}
}
@media(min-width:781px){.close-studio{display:none!important}.studio-section{display:block!important}.studio-section[hidden]{display:none!important}}

/* Camera framing correction: keep the live preview optically centered and use the same center crop for captured frames. */
.viewfinder{display:block;position:relative;overflow:hidden;isolation:isolate}
.viewfinder video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover!important;object-position:50% 50%!important;max-width:none;max-height:none}
@media(max-width:780px){body.mobile-studio-open .viewfinder video{object-fit:cover!important;object-position:50% 50%!important}}


/* HAPPY PASTEL E-BOOTH THEME */
:root{--bg:#fff7fb;--white:#493d59;--panel:#ffffff;--line:#f0ddeb;--muted:#897b98;--gold:#d879a7;--pink:#f7c6dc;--lavender:#dcd2ff;--mint:#c9f0e2;--butter:#fff0b8;--peach:#ffdccb}
html,body{background:#fff7fb;color:#493d59}
body{background:radial-gradient(ellipse at 8% 0%,#ffe1ee 0,transparent 32%),radial-gradient(ellipse at 92% 10%,#e7e0ff 0,transparent 28%),#fff7fb}
.topbar{background:#ffffffc9;border-bottom:1px solid #f0ddeb;backdrop-filter:blur(14px)}
.brand,.brand:visited{color:#594764}.mark{border:0;background:linear-gradient(145deg,#f8cde0,#dcd2ff);color:#594764;font-style:normal;box-shadow:0 5px 14px #d8b5d333}
.brand small{color:#9b829e}.eyebrow{color:#c76b9a}.intro h1 i{color:#d879a7}.sub,.muted{color:#8d7d98}
.ad-slot{border-color:#f0ddeb;color:#b5a4bd}.ad-label,.ad-placeholder{color:#ad9bb8}
.panel,.steps article{background:#fff;border-color:#f0ddeb;box-shadow:0 10px 32px #b58ba50d}
.panel-head{color:#66516f}.dot{background:#78cbb0}.studio-pill{border-color:#d9c8f0;background:#f6f0ff;color:#8d6a9f}.studio-pill .dot{background:#65c8a7;box-shadow:0 0 0 4px #65c8a71f}
.viewfinder{background:#f3eaf5;border-color:#e7d8ef;box-shadow:inset 0 0 0 4px #fff}
.viewfinder:after{background:linear-gradient(180deg,#493d5910,transparent 25%,transparent 75%,#493d5915)}
.placeholder{background:radial-gradient(ellipse,#fff 0%,#f6eafa 75%);color:#6c5577}.placeholder span{color:#9d89a8}.lens{color:#d879a7}
.vf-label{color:#fff;background:#725c80a8;padding:7px 9px;border-radius:999px;text-shadow:none}
.primary{background:linear-gradient(135deg,#f7c6dc,#e2d6ff);border-color:#efc8e3;color:#634d70;box-shadow:0 7px 20px #dfb5d333}
.primary:hover{background:linear-gradient(135deg,#fbe0eb,#ece5ff)}
.outline{border-color:#e4d3ed;background:#fff;color:#775f85}.outline:hover,.ghost:hover{background:#f8effa}.ghost{color:#886d96}
.field{color:#9b829e}.field select,.field input{background:#fff;color:#5b4767;border-color:#ead9ef}.field select:focus,.field input:focus{border-color:#d879a7;box-shadow:0 0 0 3px #f7c6dc55}
.capture-progress{background:#fff5fa;border-color:#f0ddeb}.progress-label{color:#9c8aa5}.progress-label strong{color:#6a5276}.progress-track{background:#f0ddeb}.progress-track span{background:linear-gradient(90deg,#f5aeca,#c6b8ff,#9ee3cf)}
.strip-wrap{background:#fff9fc;border-color:#efddec;box-shadow:inset 0 0 0 5px #fff}.strip-empty{color:#aa95b3}.strip-empty span{color:#d879a7}.row-actions{border-color:#f0ddeb}
.shutter{background:linear-gradient(135deg,#ffb9d3,#d8c9ff);border:0;color:#60476f;border-radius:999px;box-shadow:0 8px 22px #d8b2df55}.shutter-ring{background:#fff;border-color:#fff}.shutter-ring span{background:#ed8fba}.shutter-hint{color:#9a84a5}.hint-icon{background:#f8e7f4;color:#bf6b9b}
.finish-preview>img{border-color:#fff0f7;background:#fff0f7;box-shadow:0 15px 45px #c99dbd35}.qr-card,.final-note{background:#fff;border-color:#f0ddeb}.qr-icon{border-color:#e8d5f2;color:#bd72a2;background:#fff5fa}.qr-result{border-color:#f0ddeb}.qr-result a{color:#b85e91}.finish-heading>p:last-child{color:#8d7d98}
.steps article{background:linear-gradient(145deg,#fff,#fff8fc)}.steps article:nth-child(1){background:linear-gradient(145deg,#fff,#fff0f6)}.steps article:nth-child(2){background:linear-gradient(145deg,#fff,#f4f0ff)}.steps article:nth-child(3){background:linear-gradient(145deg,#fff,#edfff7)}.steps article span{color:#c76b9a}.steps p{color:#8d7d98}
footer{border-color:#f0ddeb;color:#a18eab}footer a{color:#805e90}
.hero-photo-a{background:linear-gradient(155deg,#f9c9de,#e8dcff)}.hero-photo-b{background:linear-gradient(155deg,#c7efe1,#fff0b8)}.hero-photo span{color:#795d88}.hero-stamp{background:#fff9;border-color:#fff;color:#bd6d9b}
/* Mobile studio modal always wins over responsive layout rules. */
@media(max-width:780px){
 body.mobile-studio-open .studio-section,body.mobile-studio-open .studio-section.started{display:block!important;visibility:visible!important;opacity:1!important;position:fixed!important;inset:0!important;z-index:99999!important;overflow-y:auto!important;overscroll-behavior:contain;background:#fff7fb!important;padding:calc(12px + env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))!important;margin:0!important;width:100%!important;height:100dvh!important}
 body.mobile-studio-open .studio-title{background:#fff7fb!important;border-color:#f0ddeb!important;top:calc(-12px - env(safe-area-inset-top))!important}
 body.mobile-studio-open .camera-panel,body.mobile-studio-open .strip-panel{background:#fff!important}
 body.mobile-studio-open .studio-section .viewfinder{background:#f3eaf5!important;border-color:#e7d8ef!important}
 body.mobile-studio-open .close-studio{display:inline-flex!important;background:#fff;border-color:#e4d3ed;color:#775f85}
}