/* Shared Spotted brand: the same palette and typefaces as the public landing. */
:root{color-scheme:light;--ink:#1d2d25;--lime:#e4ff8f;--paper:#fff;--soft:#f5f6f2;--color-bg:var(--paper);--color-bg-elevated:var(--soft);--color-card:var(--soft);--color-field:var(--soft);--color-border:#dce1da;--color-text:var(--ink);--color-muted:#5e685f;--color-faint:#5e685f;--color-brand:var(--lime);--color-brand-hi:#d8f97b;--color-hover:#eef2e9;--color-chip:#edf1e9;--color-focus:#52662f;--color-danger:#b42318;--page-pad:24px;--radius-sm:12px;--radius-md:20px;--radius-lg:24px;--radius-pill:999px;--shadow-card:0 8px 22px #1d2d2508;--type-title:400 2.25rem/1.12 var(--font-editorial);--type-heading:400 1.5rem/1.2 var(--font-editorial);--type-body:400 1rem/1.5 var(--font);--type-label:600 1rem/1.4 var(--font);--type-meta:500 .875rem/1.45 var(--font);--app-height:100dvh}
.camera-screen,.reveal-screen,.capture-zoom-dialog{color-scheme:dark;--color-bg:var(--ink);--color-bg-elevated:#2b3e32;--color-card:#2b3e32;--color-field:#2b3e32;--color-border:#526458;--color-text:#fff;--color-muted:#c5cec7;--color-faint:#c5cec7;--color-hover:#354e3f;--color-chip:#354e3f;--color-focus:var(--lime)}
html,body,.app-shell,.screen{background:var(--color-bg);color:var(--color-text)}
.app-shell{border:0;border-radius:0;min-height:var(--app-height);box-shadow:none;overflow:clip}
.screen{min-height:var(--app-height);padding-bottom:calc(80px + env(safe-area-inset-bottom))}
h1,h2,h3,.display,.brand{color:var(--color-text)}
a,.text-button{color:var(--color-text)}
.body,.microcopy,.optional,.eyebrow{color:var(--color-muted)}
.button{min-height:58px;background:var(--color-text);color:var(--color-bg);border:1px solid transparent;border-radius:999px;box-shadow:none;padding:16px 24px;margin-top:24px;font-weight:700}
.button.secondary{border:1px solid var(--color-text);box-shadow:none}
.button:disabled{opacity:.45;cursor:default}
.button:focus-visible,button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--color-brand);outline-offset:4px}
.button:active{transform:scale(.985)}
label,legend{color:var(--color-text)}input,select,textarea{background:var(--color-card);color:var(--color-text);border:1px solid transparent;border-radius:14px;min-height:50px;width:100%;max-width:100%;padding:16px 16px;box-shadow:none;color-scheme:inherit}
input::placeholder,textarea::placeholder{color:var(--color-muted);opacity:1}
input:focus,select:focus,textarea:focus{border-color:var(--color-brand)}
input[type=date],input[type=datetime-local]{display:block;min-width:0;appearance:auto}
input::-webkit-date-and-time-value{text-align:left;min-height:1.4em}
.page-header,.settings-screen .page-header{min-height:54px;padding:16px 24px;background:var(--color-card);border:0;backdrop-filter:none;color:var(--color-text);top:0}
.page-header>div{display:flex;align-items:center;gap:16px;min-width:0}
.back{padding:0;color:var(--color-text);line-height:1}
.page-header h1,.camera-screen .page-header h1{margin:0;font:var(--type-heading)}
.camera-screen .page-header h1,.account-screen .page-header h1{font:var(--type-body)}
.page-header h1{overflow-wrap:break-word}
.badge,.shots,.pill,.wedding-state{border:0;border-radius:999px;box-shadow:none;font-weight:700;text-transform:uppercase;padding:8px 16px;line-height:1.15}
.shots{white-space:nowrap;flex-shrink:0}
/* Splash: white brand navigation and colour photography. */
.splash-nav{height:54px;min-height:54px;padding:0;display:flex;align-items:center;justify-content:center;background:#fff;border:0}
.splash-nav .brand{font:400 2rem/1 var(--font-editorial);color:var(--color-bg);margin:0;padding:0}
.splash-nav .brand:after{display:none}
.hero{min-height:calc(var(--app-height) - 54px);height:auto;display:block;padding:0;background-position:center;background-size:cover;border:0;border-radius:0}
.hero:before{background:linear-gradient(180deg,#1119 0%,#111a 42%,var(--color-bg) 100%);inset:0}
.hero-copy,.couple-splash .hero-copy{padding:24px 24px 32px;margin:0;max-width:none}
.hero .display{font:400 3rem/1 var(--font-editorial);letter-spacing:-.025em;margin:0 0 16px;color:var(--color-text)}
.hero .badge{display:inline-flex;margin:0 0 16px;background:#faf6f033;color:var(--color-text);max-width:100%;white-space:normal}
.hero .body{font:var(--type-meta);line-height:1.25;margin:0;color:#c4c2bd}
.hero .button{margin-top:32px}
.couple-splash .google-login{margin-top:32px;width:100%;max-width:400px;min-width:0;padding:8px 0;background:white;border-radius:999px;overflow:visible;display:flex;flex-direction:column;align-items:center}
.google-login>div{max-width:100%}
.google-login iframe{max-width:100%!important}
.google-login .google-placeholder{min-height:42px!important;border:0;padding:8px 16px;color:var(--color-bg)!important;box-shadow:none;font-weight:700}
.google-status{color:var(--color-muted);font:var(--type-meta);margin:8px 16px;max-width:90%}
.google-login[data-ready=true]{padding-block:8px}
.splash-legal{display:flex;justify-content:center;gap:16px}
.splash-legal a{color:#bdbbb5;font:var(--type-meta);padding:8px 0;text-underline-offset:3px}
/* Challenge board. Counts stay driven by the persisted guest session. */
.hunt-header{min-height:90px;align-items:center;margin:0;padding:16px 24px;background:var(--color-card);border:0}
.hunt-header h1{font:var(--type-title);white-space:normal}
.hunt-header .shots{padding:8px 16px;max-width:144px;white-space:normal;text-align:center}
.progress-copy{margin:8px 0 0;color:var(--color-text);font:var(--type-meta)}
.hunt-screen .instruction:not(.visually-hidden){margin:16px 24px 0}
.bingo{padding:24px;gap:16px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.spot{min-height:124px;padding:16px 8px;gap:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--color-card);color:var(--color-text);box-shadow:0 8px 20px #0004;aspect-ratio:auto}
.spot .emoji{font-size:22px;margin-bottom:8px;filter:none}
.spot .name{font:var(--type-body);line-height:1.15;text-align:center}
.progress-dots{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:8px;color:var(--color-muted)}
.progress-dot{width:10px;height:10px;background:var(--color-border);border:0;box-shadow:none;border-radius:50%}
.progress-dot.filled{background:var(--color-text);border:0}
.progress-dots .count{font:var(--type-meta);font-weight:600;margin-left:8px;color:var(--color-muted)}
.spot.done{background:var(--color-chip);border-color:var(--color-brand);box-shadow:0 0 0 1px #1d2d2510,0 6px 24px #1d2d2510;color:var(--color-text)}
.done-mark{color:var(--color-brand);text-transform:uppercase;font:var(--type-meta);font-weight:700;margin-top:16px}
.spot.done .progress-dot.filled{background:var(--color-text)}
.spot:hover{background:var(--color-hover)}
.spot.done:hover{background:var(--color-hover)}
.tabs{border-top:1px solid var(--color-border);box-shadow:none;min-height:54px;height:auto;padding:0 16px env(safe-area-inset-bottom);display:flex;bottom:0}
.tabs button{min-height:54px;text-transform:uppercase;font:var(--type-meta);font-weight:700;padding:16px 8px 16px;position:relative}
.tabs button.active{color:var(--color-text)}
.tabs button.active:before{display:none}
.tabs button.active:after{content:'';position:absolute;width:16px;height:2px;bottom:12px;left:calc(50% - 8px);background:var(--color-text);border-radius:2px}
.tab-lock{filter:none;border-color:currentColor}
/* Actual camera and capture confirmation: 4:5 portrait media, no bottom guest menu. */
.camera-screen{display:block;height:auto;min-height:var(--app-height);padding:0 0 32px;--camera-footer-height:0px}
.camera-meta{padding:24px 24px 24px;min-height:72px;margin:0;display:flex;align-items:center;gap:8px}
.camera-meta h2{font:var(--type-heading);letter-spacing:-.02em;color:var(--color-text)}
.camera-meta .emoji{font-size:20px}
.camera-meta .shots{font-size:.75rem;padding:8px 8px}
.camera-stage,.capture-confirm .camera-stage{display:flex;justify-content:center;padding:24px 24px 0;container-type:normal;min-height:0;flex:none}
.camera-screen .viewfinder,.camera-screen .captured{aspect-ratio:4/5;width:100%;height:auto;max-height:none;min-height:0;max-width:100%;border-radius:24px;overflow:hidden;border:0;background:#000;box-shadow:none}
.camera-screen .viewfinder video,.camera-screen .captured img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover}
.camera-screen .viewfinder,.camera-screen .captured{position:relative}
.camera-screen .crosshair{border-color:var(--color-text);filter:none}
.camera-footer{position:static;transform:none;width:100%;background:var(--color-bg);padding:0;box-shadow:none}
.camera-controls{margin:0;display:flex;justify-content:space-evenly;align-items:center;padding:24px 40px 0;gap:16px;background:transparent;min-height:0}
.camera-controls .flash,.camera-controls .camera-switch{color:var(--color-text);width:68px;text-transform:uppercase;font:var(--type-meta);font-weight:600}
.flash .flash-icon,.camera-switch span{background:var(--color-card);border:1px solid var(--color-border);width:48px;height:48px;border-radius:50%;margin-bottom:8px}
.flash .flash-icon img,.camera-switch img{filter:brightness(0) invert(1);opacity:1;width:24px;height:24px}
.flash:not(.active){opacity:.55}
.camera-controls .shutter{height:84px;width:84px;min-width:84px;border:4px solid var(--color-brand);padding:8px;background:var(--color-bg);box-shadow:none}
.camera-controls .shutter-inner{display:block;width:100%;height:100%;border-radius:50%;background:var(--color-text);border:0}
.shutter:disabled{opacity:.45}
.capture-confirm .camera-stage{padding:24px 24px 0}
.capture-confirm .captured{width:100%;border:4px solid var(--color-text);border-radius:30px;box-shadow:0 8px 36px #1d2d2510}
.capture-confirm .confirm{padding:24px 24px 0;margin:0;text-align:center}
.capture-confirm .confirm h2{font:var(--type-title);margin:0 0 8px}
.capture-confirm .confirm .body{font:var(--type-meta);color:var(--color-muted);line-height:1.25}
.capture-confirm .capture-actions{display:flex;flex-direction:column;position:static;background:none;padding:24px 24px 0;gap:8px}
.capture-actions .button{margin:0;min-height:58px}
.celebration-layer{pointer-events:none;z-index:8}
.camera-recovery{background:var(--color-bg);color:var(--color-text);margin:16px 24px 0;border:0;padding:0}
.camera-recovery .button{margin:8px 0 0;min-height:48px}
.camera-loading{color:var(--color-text);background:#0009}
/* Reveal. */
.reveal{padding:24px;min-height:calc(var(--app-height) - 54px);display:flex;align-items:center;justify-content:center;text-align:center}
.reveal>div{width:100%}
.reveal .couple{font:var(--type-meta);font-weight:700;text-transform:uppercase;margin:0 0 8px;color:var(--color-text)}
.reveal h1{font:var(--type-title);margin:0;color:var(--color-text)}
.reveal .body{font:var(--type-meta);color:var(--color-muted);margin-top:16px;line-height:1.25}
.reveal .button{margin-top:24px}
.countdown,.stat{border:1px solid var(--color-border);border-radius:20px;box-shadow:none;color:var(--color-text)}
.countdown{width:100%;padding:16px 24px;margin:24px auto 0;justify-content:center;gap:16px}
.unit{min-width:40px}.unit b{color:var(--color-text)}.unit span{color:var(--color-muted);text-transform:uppercase;font:var(--type-meta);font-weight:600;margin-top:8px}
.countdown-separator{color:var(--color-text);align-self:center}
.reveal .stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:24px 0 0}
.reveal .stat{padding:16px 8px}.stat b{color:var(--color-text)}.stat span{font:var(--type-meta);font-weight:600;text-transform:uppercase;color:var(--color-muted)}
.reveal-screen{padding-bottom:56px}
/* Gallery and image viewer. */
.editorial-header{padding:16px 24px;background:var(--color-card);border:0;min-height:90px;position:sticky;top:0;z-index:8}
.gallery-heading{display:flex;justify-content:space-between;align-items:center;gap:8px}.gallery-heading>div{min-width:0}
.editorial-header h1{font:var(--type-title);letter-spacing:-.025em;margin:0}
.editorial-couple{font:var(--type-meta);color:var(--color-text);margin:8px 0 0}
.gallery-heading .shots{font-size:.75rem;padding:8px 16px}
.filters{padding:8px 16px;gap:8px;background:var(--color-bg);border:0;overflow-x:auto;scrollbar-width:none;display:flex}
.filters::-webkit-scrollbar{display:none}
.filter,.workspace-filters .filter{min-height:28px;padding:8px 16px;color:var(--color-muted);background:var(--color-card);border:1px solid var(--color-border);border-radius:999px;font:var(--type-meta);font-weight:700;text-transform:uppercase;white-space:nowrap;flex:0 0 auto}
.filter.active,.filter[aria-pressed=true]{background:var(--color-text);color:var(--color-bg);border-color:var(--color-text)}
.gallery{padding:8px 24px 24px}.editorial-gallery .category{margin:8px 0 24px;border:0}
.editorial-gallery .category-title{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 16px;padding:0;border:0}
.category-title h2{font:var(--type-heading);color:var(--color-text);letter-spacing:-.03em}
.category-title .emoji{font-size:24px}.category-title>span{font-weight:700;text-transform:uppercase;color:var(--color-text);white-space:nowrap}
.gallery .photo-grid{display:grid;gap:8px 16px}
.gallery .photo-card{padding:0;margin:0;border:0;border-radius:14px;background:none;color:var(--color-text);transform:none}
.gallery .photo-window{display:block;aspect-ratio:4/5;width:100%;border-radius:14px;overflow:hidden}
.gallery .photo-card .photo-window img{width:100%;height:100%;object-fit:cover;filter:none;transform:none}
.gallery-owner-tools{padding:0 24px}
.viewer{min-height:600px;display:flex;flex-direction:column;background:var(--color-bg);padding-bottom:calc(80px + env(safe-area-inset-bottom));color:var(--color-text)}
.viewer-head{padding:16px 24px;background:var(--color-card);border:0;min-height:84px;display:flex;align-items:center;gap:16px}
.viewer-head h1{font:var(--type-heading);margin:0}.viewer-head p{font:var(--type-meta);color:var(--color-text);margin-top:8px}
.icon-btn{width:40px;height:40px;background:none;border:0;color:var(--color-text)}
.viewer-main{flex:1;display:flex;align-items:center;justify-content:center;padding:24px;min-height:0;position:relative}
.viewer-main>img{border-radius:24px}
.viewer-main:after{color:var(--color-muted);background:#111c}
.viewer-main .arrow{background:#faf6f055;border:0;width:40px;height:40px;top:50%;transform:translateY(-50%);border-radius:50%}
.viewer-main .prev{left:34px}.viewer-main .next{right:34px}
.thumbs{display:flex;overflow-x:auto;padding:16px 24px;background:var(--color-bg);border:0;flex-shrink:0}
.thumbs button{border-radius:8px;height:54px;min-width:50px;border:2px solid transparent;overflow:hidden;padding:0;opacity:.55}
.thumbs button.active{border-color:var(--color-text);opacity:1}.thumbs img{width:100%;height:100%;object-fit:cover}
/* Onboarding and organizer surfaces. */
.onboarding-screen,.ready-screen{padding-bottom:104px}
.onboarding-screen .page-header,.ready-screen .page-header{min-height:62px}
.stepper{display:flex;gap:8px;margin:0;padding:24px 24px 16px;border:0}
.stepper>span{display:block;color:var(--color-bg)}.stepper b{width:24px;height:24px;border:0;background:var(--color-muted);color:var(--color-bg);font:var(--type-meta);border-radius:50%;display:grid;place-items:center}
.stepper [aria-current=step] b{background:var(--color-text);color:var(--color-bg)}.stepper .complete b{background:var(--color-brand);color:var(--color-bg)}
.onboarding-screen .content,.ready-screen .content{display:block;padding:0 24px 24px}
.onboarding-heading{margin:0 0 32px}.onboarding-heading h1{font:var(--type-title);margin:0 0 8px}.onboarding-heading .body{font:var(--type-meta)}
.settings-screen label,.onboarding-screen label{font:var(--type-meta);font-weight:700;text-transform:uppercase;color:var(--color-text);margin:16px 0 8px}
.onboarding-screen .form-actions,.sticky-primary,.settings-screen .form-actions{background:var(--color-bg);border:0;box-shadow:none;padding:16px 24px calc(24px + env(safe-area-inset-bottom));bottom:0}
.sticky-primary .button,.settings-screen .form-actions .button{min-height:58px;margin:0}
.step-actions{display:block!important}
.step-back-link{margin-top:16px;color:var(--color-muted)}
.onboarding-step-2 .form-actions{position:fixed;left:50%;transform:translateX(-50%);width:min(100%,var(--screen-max));padding:16px 24px calc(24px + env(safe-area-inset-bottom))}
.onboarding-step-2{padding-bottom:calc(112px + env(safe-area-inset-bottom))}
.onboarding-step-2 .onboarding-heading{margin-bottom:16px}
.invitation-preview{position:relative;margin:16px 0 16px;padding:16px;aspect-ratio:1.72;border-radius:14px;background-position:center;background-size:cover;display:flex;align-items:flex-end;justify-content:flex-end;min-height:0}
.invitation-preview strong{font:var(--type-heading);text-shadow:0 1px 5px #0008;margin:0}
.cover-edit{position:absolute;top:16px;right:16px;display:flex;gap:8px;align-items:center;border:0;border-radius:999px;background:var(--color-text);color:var(--color-bg);padding:8px 16px;min-height:32px;font:var(--type-meta);z-index:2}
.onboarding-screen .camera-style-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 16px;margin-top:16px}
.camera-style{padding:8px;border:1px solid transparent;background:transparent;color:var(--color-muted);border-radius:8px;box-shadow:none}
.settings-screen .camera-style{display:block;padding:8px}
.settings-screen .camera-style-copy{overflow-wrap:normal}
.settings-screen .camera-style-check{left:auto;right:12px}
.camera-style.selected{border-color:var(--color-text);background:var(--color-card);box-shadow:none;color:var(--color-text)}
.onboarding-screen .camera-style-preview{height:66px;border-radius:8px}
.camera-style-copy{padding:8px 0 0!important}.camera-style-copy b{font:var(--type-meta);font-weight:500}.camera-style-copy small{font:var(--type-meta);color:var(--color-muted);margin-top:8px}
.camera-style-check{background:var(--color-bg);color:var(--color-text);width:24px;height:24px;right:12px;top:12px;border:0}
.invitation-card{background:var(--color-card);border:0;border-radius:16px;padding:24px 16px 16px;text-align:center}
.invitation-card h2{font:var(--type-heading)}.invitation-card>.microcopy{margin:8px 0 0}
.ready-screen .qr-card{padding:8px;width:164px;height:164px;border-radius:16px;margin:16px auto;background:var(--color-text)}
.ready-screen .qr{width:100%;height:100%;max-width:none;object-fit:contain;margin:0}
.ready-screen .share-link{font:var(--type-meta);color:var(--color-muted);margin:16px 0;overflow-wrap:anywhere}
.invitation-card .button{margin-top:8px}
.workspace-screen .content{padding:24px 24px 104px}
.organizer-header{border-bottom:1px solid var(--color-border)}.organizer-brand{font:var(--type-heading)}
.workspace-screen .collection-heading h1{font:var(--type-heading);margin:0}.collection-screen .content{padding-top:24px}
.workspace-filters{margin:16px -8px 24px;padding:0;gap:8px}
.wedding-card,.card,.choice-card,.permission-row,.settings-screen .permission-row{background:var(--color-card);color:var(--color-text);border:1px solid var(--color-border);border-radius:20px}
.compact-wedding{padding:16px;margin-bottom:24px;background:var(--color-card)}
.compact-wedding .wedding-open{color:var(--color-text);font:var(--type-heading)}
.wedding-card .microcopy{color:var(--color-muted);margin:16px 0 8px}
.wedding-card h2{margin:0}.wedding-state{font:var(--type-meta);color:var(--color-muted);background:var(--color-card);border:1px solid var(--color-border);padding:8px 16px;display:inline-flex}
.wedding-options{color:var(--color-text)}.wedding-options>div{background:var(--color-card);border:1px solid var(--color-border)}
.choice-card>span,.permission-row small{color:var(--color-muted)}.choice-card:hover{background:var(--color-hover)}
.account-notice,.account-payment-status{background:var(--color-card);color:var(--color-text);border:1px solid var(--color-border);border-radius:16px}
.account-screen .content{min-height:calc(var(--app-height) - 54px);display:flex;flex-direction:column;padding:16px 24px}
.account-current .eyebrow{font:var(--type-meta);font-weight:700;text-transform:uppercase;color:var(--color-muted);margin:0 0 8px}
.account-current h1{font:var(--type-title);margin:0 0 8px!important}.account-current .body{font:var(--type-meta)}
.account-current>.text-button{color:var(--color-muted);font:var(--type-meta);margin-top:8px}
.account-plan-picker{margin-top:16px}.account-plan-picker>summary{margin:0;list-style:none;display:flex;align-items:center;justify-content:center;gap:8px}
.account-plan-picker>summary::-webkit-details-marker{display:none}
.account-footer{margin-top:auto;padding-top:32px;padding-bottom:0;border:0}
.account-footer .danger-action{display:block;width:100%;min-height:58px;border:1px solid var(--color-danger);border-radius:999px;font-weight:700;text-decoration:none;padding:16px}
.danger-action,.danger-action:visited,.dashboard-delete{color:var(--color-danger)!important}
.plan-card .pill{color:var(--color-text);background:var(--color-chip)}.plan-price{color:var(--color-text)}
.dashboard-screen .content{padding:24px 24px 112px}.dashboard-title h1{font:var(--type-title);margin:0 0 16px}.dashboard-title .microcopy{margin:0;color:var(--color-muted)}
.dashboard-title{position:relative;padding-bottom:24px;border-bottom:1px solid var(--color-border)}
.dashboard-screen .wedding-state{margin-top:16px}
.dashboard-disclosures,.dashboard-disclosure{background:transparent;color:var(--color-text);border:0;box-shadow:none}
.dashboard-disclosures{padding:0}.dashboard-link,.dashboard-disclosure summary{color:var(--color-text)}.dashboard-link{min-height:54px}
.dashboard-screen .photo-empty{background:var(--color-card);border:1px solid var(--color-border);color:var(--color-muted);border-radius:20px}
.dashboard-photos .section-heading{color:var(--color-text)}.photo-total,.disclosure-state{color:var(--color-muted)}
.dashboard-screen .photo-preview img{border-radius:14px}
.empty-review,.empty-workspace{color:var(--color-text)}.empty-review .body{color:var(--color-muted)}
.card label{color:var(--color-text)}.book-photo-grid label{padding:0}
dialog{background:var(--color-card);color:var(--color-text);border:1px solid var(--color-border);border-radius:24px;box-shadow:0 16px 80px #0008}
dialog .body,dialog p,dialog .microcopy{color:var(--color-muted)}.dialog-header h2{color:var(--color-text)}.dialog-close{color:var(--color-text);background:transparent;border:0}
.toast{background:var(--color-text);color:var(--color-bg);border:0;box-shadow:0 8px 28px #0006}.toast-error{background:#3c1b1b;color:#ffe9e7}.toast-success .toast-icon{color:#257347}
.sync-notice{margin:16px 24px 0;width:calc(100% - 48px);background:var(--color-card);color:var(--color-text);border:1px solid var(--color-brand);border-radius:14px}
@media(min-width:700px){:root{--app-height:100dvh}.app-shell{margin:0 auto;min-height:100dvh;border-inline:1px solid var(--color-card)}.tabs,.sticky-primary,.settings-screen .form-actions{bottom:0}.screen{min-height:100dvh}}
@media(max-width:359px){:root{--page-pad:16px}.hero-copy,.couple-splash .hero-copy{padding-inline:24px}.bingo{padding:16px;gap:16px}.hunt-header{padding-inline:16px}.hunt-header h1{font-size:1.75rem}.shots{padding:8px 8px}.camera-meta{padding-inline:16px}.camera-meta .shots{font-size:.75rem}.gallery{padding-inline:16px}.gallery .photo-grid{gap:8px 8px}.countdown{padding:16px 8px;gap:8px}.category-title>span{font-size:.75rem}}
@media(max-height:700px){.camera-stage,.capture-confirm .camera-stage{padding-top:8px}.camera-meta{padding-block:16px;min-height:58px}.camera-controls{padding-top:16px}.capture-confirm .confirm{padding-top:16px}.capture-confirm .capture-actions{padding-top:16px}.reveal{padding-block:32px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important}.unit b{animation:none}.button:active{transform:none}}
/* Wedding management uses the same compact fields and photo surfaces. */
.dashboard-name-row{display:flex;align-items:center;justify-content:space-between;gap:16px}
.dashboard-name-row h1{margin:0;min-width:0;overflow-wrap:anywhere}
.dashboard-name-row .text-button{flex-shrink:0;font:var(--type-meta);font-weight:600}
.dashboard-title{border:0;padding-bottom:16px}.dashboard-title .microcopy{margin-top:16px}
.dashboard-reveal{padding:16px 0;border-top:1px solid var(--color-border)}
.dashboard-reveal>label{display:block;font:var(--type-meta);text-transform:uppercase;font-weight:700;margin:0 0 8px}
.reveal-shortcut{width:100%;border:1px solid var(--color-border);border-radius:14px;background:var(--color-card);color:var(--color-text);min-height:50px;padding:16px 16px;display:flex;align-items:center;justify-content:space-between;text-align:left;font:var(--type-body)}
.dashboard-reveal>.text-button{font:var(--type-meta);padding:8px 0}
.dashboard-photos{margin:16px 0 0;padding:0;border:0}
.dashboard-section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 16px}
.dashboard-section-heading h2{font:var(--type-label);font-weight:700;margin:0;display:flex;gap:8px}.photo-total{font:inherit;color:var(--color-text)}
.guest-count{color:var(--color-muted);border:1px solid var(--color-muted);border-radius:999px;padding:8px 16px;white-space:nowrap}
.moderation-empty{min-height:84px;padding:24px 16px;display:grid;place-items:center;background:var(--color-card);color:var(--color-muted);border:1px solid var(--color-muted);border-radius:20px;text-align:center;font:var(--type-body)}
.moderation-empty p{margin:0}.moderation-grid{gap:8px}.moderation-grid button{border-radius:14px;overflow:hidden}
.dashboard-tools{background:none;border:0;border-radius:0;padding:0;margin-top:24px;display:flex;flex-direction:column;gap:0}
.dashboard-tools .button{margin:0;min-height:50px;font-weight:500}
.dashboard-delete{display:block;text-align:center;width:100%;min-height:44px;margin-top:8px;font:var(--type-meta);font-weight:700;text-decoration:underline}
.wedding-editor .content{padding:24px 24px 112px}.wedding-editor .dashboard-title{margin-bottom:8px}.wedding-editor .dashboard-title h1{font:var(--type-heading)}
.field-heading{display:flex;align-items:baseline;justify-content:space-between;gap:16px}.field-heading .text-button{font:var(--type-meta);font-weight:700;padding:8px 0}.field-heading .text-button:disabled{opacity:.5}
.wedding-editor .camera-style-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 16px;margin-top:16px}
.wedding-editor .camera-style-preview{height:66px;border-radius:8px}.wedding-editor .dashboard-photos{margin:24px 0}
.advanced-settings{margin:24px 0 0;border-top:1px solid var(--color-border);padding-top:16px}.advanced-settings summary{font:var(--type-meta);color:var(--color-muted);padding-block:8px}
.wedding-editor .dashboard-tools{margin-top:16px}.wedding-view-label{font:var(--type-meta);font-weight:600;white-space:nowrap}
.collection-screen .sticky-primary{position:static;transform:none;width:auto;max-width:none;padding-top:0}.collection-screen .content{padding-bottom:24px}.collection-screen{padding-bottom:24px}
.splash-nav+.hero{min-height:calc(var(--app-height) - 54px);filter:none}
.splash-nav+.hero .hero-copy{margin-top:0}
.capture-live .camera-stage{padding:24px 24px 0}
.camera-controls .flash{width:76px;white-space:nowrap}
.camera-controls .flash,.camera-controls .camera-switch{font-size:.75rem}
.settings-screen label,.onboarding-screen label,.dashboard-reveal>label{font-size:.75rem}
.onboarding-screen .invitation-preview{margin-top:16px;aspect-ratio:1.72;background-repeat:no-repeat}
.hero .button{background:var(--color-text);border-color:var(--color-text);min-height:58px}
.ready-screen .onboarding-heading{margin-bottom:16px}
.ready-screen .share-link{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
@media(max-height:700px){.capture-live .camera-stage{padding-top:8px}}
.account-plan-picker>summary{width:100%;min-height:58px}
.account-current{padding-bottom:0}.account-current>.text-button{font-size:.75rem;padding:0;min-height:32px}
.account-current .eyebrow{font-size:.75rem}.account-plan-picker{margin:16px 0 24px}
.account-footer .purchase-links{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin:0 0 16px}
.account-footer .purchase-links a,.account-footer .text-button:not(.danger-action){font:var(--type-meta);padding:8px 0;font-weight:400;text-align:left}
.account-footer .purchase-links .text-button{margin:0}
/* Feedback stays separate from the Google control. */
.couple-splash .google-login{background:transparent;padding:0;border-radius:0}
.couple-splash .google-login[data-ready=true]{background:white;border-radius:999px;padding:8px 0}
.couple-splash .google-login .google-placeholder{min-height:58px!important;width:100%;margin:0!important}
.google-login .google-status{margin:8px 0 0;max-width:100%;font-size:.75rem}
.celebration-emoji{font-size:var(--emoji-size);line-height:1;animation-name:celebrate-scatter;animation-duration:2.4s}
@keyframes celebrate-scatter{0%{opacity:0;transform:translate(calc(-50% + var(--emoji-x)*.65),calc(-50% + var(--emoji-y)*.65)) scale(.6) rotate(0deg)}15%,65%{opacity:1}85%{opacity:.8}100%{opacity:0;transform:translate(calc(-50% + var(--emoji-x)),calc(-50% + var(--emoji-y))) scale(1) rotate(var(--emoji-rotate))}}
@media(prefers-reduced-motion:reduce){.celebration-emoji{animation:none;opacity:0}}
.settings-screen input:not([type=checkbox]),.settings-screen select{min-height:50px;height:50px}
.gallery .photo-grid{grid-template-columns:repeat(3,minmax(0,100px));justify-content:start}
.back{font-size:28px;min-width:24px;min-height:30px}
.reveal:has(.button){padding:24px;min-height:calc(var(--app-height) - 54px)}
.reveal .button{position:static;transform:none;left:auto;right:auto;bottom:auto;width:100%;max-width:none;margin:24px 0 0}
.countdown .unit{min-width:44px;width:44px;overflow:visible;flex-shrink:0}
.countdown .unit span{font-size:.75rem;white-space:nowrap}.countdown .unit b{animation:none!important;font-size:24px}
.viewer{height:var(--app-height);min-height:0;padding-bottom:calc(24px + env(safe-area-inset-bottom))}
.viewer-head>div{display:flex;align-items:center;justify-content:space-between;flex:1;gap:16px;min-width:0}
.viewer-head p{font-size:.75rem;white-space:nowrap;color:var(--color-muted);margin:0}.viewer-head .icon-btn{background:var(--color-border);border:1px solid var(--color-border);border-radius:50%;font-size:22px;flex-shrink:0}
.viewer-main:after{display:none}.viewer-main .arrow{font-size:26px;background:#2228}
.viewer-dots{display:flex;justify-content:center;align-items:center;gap:8px;height:8px;margin-bottom:16px;flex-shrink:0}
.viewer-dots span{height:6px;width:6px;background:var(--color-border);border-radius:99px}.viewer-dots .active{width:18px;background:var(--color-text)}
.thumbs{scrollbar-width:none;padding:8px 24px 16px;gap:8px}.thumbs::-webkit-scrollbar{display:none}
.back{font-size:20px}
.page-header.organizer-header{min-height:54px;padding-block:8px}
.collection-heading{margin:0 0 16px}
.collection-screen .workspace-filters{padding:0;gap:8px;margin:16px -8px 24px}
.collection-screen .workspace-filters .filter{padding:8px 16px;min-height:28px;border:1px solid var(--color-border);font-size:.75rem}
.collection-screen .workspace-filters .filter[aria-pressed=true]{background:var(--color-text);color:var(--color-bg);border-color:var(--color-text)}
.compact-wedding .wedding-open{min-height:30px;justify-content:space-between;padding:0}
.compact-wedding .microcopy{margin:16px 0 8px}.compact-wedding .wedding-state{margin:0;font-size:.75rem}
.compact-wedding{margin-bottom:0}.wedding-list{gap:24px}
@media(max-width:600px){html{scrollbar-width:none}html::-webkit-scrollbar{display:none}}
.viewer-main .arrow{font-family:var(--font);font-size:24px;line-height:1}
.camera-footer .camera-controls{display:grid;grid-template-columns:minmax(0,1fr) 84px minmax(0,1fr);justify-items:center;align-items:start;flex-wrap:nowrap;gap:16px;padding:24px 24px calc(16px + env(safe-area-inset-bottom))}
@media(max-height:700px){.camera-footer .camera-controls{padding-top:16px}}


/* Captured photos keep their full width even in short/private-preview viewports. */
.capture-confirm .captured{padding:0;cursor:zoom-in}
.capture-expand{position:absolute;right:12px;bottom:12px;width:36px;height:36px;display:grid;place-items:center;background:#111b;color:#fff;border-radius:50%;font:24px/1 var(--font)}
.capture-confirm .confirmation-footer{position:sticky;bottom:0;z-index:5;padding-bottom:env(safe-area-inset-bottom,0px)}
.capture-confirm .capture-actions{padding:16px 24px;flex-direction:row}
.capture-confirm .capture-actions .button{flex:1;min-width:0;padding-inline:16px}
dialog.capture-zoom-dialog{width:100vw;max-width:none;height:100dvh;max-height:100dvh;margin:0;padding:16px;box-sizing:border-box;border:0;border-radius:0;background:var(--color-bg);color:var(--color-text);overflow:hidden}
.capture-zoom-dialog .dialog-header{height:48px;margin:0;align-items:center}
.capture-zoom-dialog .dialog-header h2{font:var(--type-meta);margin:0}
.capture-zoom-dialog .dialog-content{height:calc(100% - 48px);display:flex;flex-direction:column;gap:16px}
.capture-zoom-stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:none;cursor:zoom-in}
.capture-zoom-stage.is-zoomed{cursor:grab}
.capture-zoom-stage>img{width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.capture-zoom-controls{display:flex;justify-content:center;align-items:center;gap:24px;padding-bottom:env(safe-area-inset-bottom,0px)}
.capture-zoom-controls button{width:48px;height:48px;border:1px solid var(--color-muted);border-radius:50%;color:#fff;font:24px/1 var(--font)}
.capture-zoom-controls output{min-width:52px;text-align:center;font:var(--type-meta)}

.spot-prompt{font:var(--type-meta);color:var(--color-muted);margin:0;padding:0 24px;text-align:center;line-height:1.4}


/* Every photo surface uses the portrait capture format; QR codes stay square. */
.gallery .photo-card:nth-child(n) .photo-window,
.personal-photo-grid button,.photo-grid button,.moderation-grid button,
.book-photo,.pending-photo>img{aspect-ratio:4/5}
.thumbs button{width:50px;height:auto;aspect-ratio:4/5}
.viewer-main>img{width:100%;height:auto;max-height:100%;aspect-ratio:4/5;object-fit:contain}
.capture-live .camera-footer{position:sticky;bottom:0;z-index:5;padding-bottom:max(16px,env(safe-area-inset-bottom,0px))}
.capture-live .camera-controls{padding-top:16px}

/* Landing-aligned controls and five shared type roles. */
:root{--muted:var(--color-muted)}
html,body{background:var(--soft)}
.button,.hero .button{background:var(--lime);color:var(--ink);border-color:transparent;border-radius:8px;font:var(--type-label);transition:background .18s ease,transform .18s ease}
.button.secondary{background:transparent;color:var(--color-text);border-color:var(--color-border)}
.button:focus-visible,button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.dialog-close:focus-visible,.cover-edit:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}
input:focus,select:focus,textarea:focus{border-color:var(--color-focus)}
input,select,textarea{border-color:var(--color-border);border-radius:12px}
input[type=checkbox],input[type=radio],.plan-option input,.book-photo input,.check-row input{accent-color:var(--ink)}
.page-header,.settings-screen .page-header,.hunt-header,.editorial-header,.viewer-head{background:var(--color-bg)}
.back,.icon-btn{min-width:44px;min-height:44px}
.badge,.shots,.pill,.wedding-state{background:var(--color-chip);color:var(--color-text);font:var(--type-meta);text-transform:none}
.camera-meta .shots,.gallery-heading .shots,.camera-controls .flash,.camera-controls .camera-switch,.countdown .unit span,.viewer-head p,.collection-screen .workspace-filters .filter,.compact-wedding .wedding-state,.account-current .eyebrow,.account-current>.text-button,.google-login .google-status{font:var(--type-meta)}
.settings-screen label,.onboarding-screen label,.dashboard-reveal>label{font:var(--type-meta);color:var(--color-muted);text-transform:none}
.hero .display{letter-spacing:-.035em}.hero .body{font:var(--type-body);color:var(--color-muted)}
.splash-nav{height:64px;min-height:64px;background:var(--paper)}
.splash-nav .brand,.organizer-brand{color:var(--ink);font:400 2.35rem/1 var(--font-editorial);letter-spacing:-.065em}
.splash-nav .brand:after,.organizer-brand:after{content:'.';display:inline;color:#84a044;background:none;width:auto;height:auto;margin:0}
.hero:before{background:linear-gradient(180deg,#1d2d25e0 0%,#1d2d2590 48%,#1d2d25cc 100%)}
.photo-splash{--color-text:#fff;--color-muted:#e2e8e2;--color-focus:var(--lime)}
.photo-splash .display{color:#fff}.photo-splash .badge{background:#1d2d25cc;color:#fff}
.hero .splash-legal a{color:var(--color-muted)}
/* Both onboarding entries share the same photographic splash. */
.splash-nav+.photo-splash{min-height:calc(var(--app-height) - 64px)}
.photo-splash .hero-copy{padding:24px 24px calc(32px + env(safe-area-inset-bottom))}
.photo-splash .google-login,.photo-splash .google-login[data-ready=true]{margin-top:32px;padding:0;background:transparent;border-radius:0}
.photo-splash .google-login .button{margin-top:0}
.google-login .google-placeholder{border-radius:999px;background:white;color:var(--ink)!important}
.splash-legal{margin-top:16px}.google-login .google-status{color:var(--color-muted)}
.spot{box-shadow:none;border:1px solid transparent;background:var(--soft);border-radius:20px}
.spot .emoji{font-size:1.75rem}.spot .name{font:var(--type-label)}
.spot.done{background:#edf5dc;border-color:var(--color-focus);box-shadow:none}
.done-mark{color:var(--color-focus);text-transform:none}
.spot.done .progress-dot.filled,.progress-dot.filled{background:var(--ink)}
.spot.done:hover{background:#e6efd3}
.tabs{border:0;background:var(--color-bg);box-shadow:0 -5px 20px #1d2d2508}
.tabs button{font:var(--type-label);text-transform:none;color:var(--color-muted);padding:16px 8px}
.tabs button.active{color:var(--color-text)}
.tabs button.active:after{width:32px;height:4px;left:calc(50% - 16px);bottom:7px;background:var(--color-focus)}
.camera-screen .tabs button.active{color:var(--lime)}
.camera-controls .shutter{border-color:var(--lime);background:var(--ink)}
.camera-controls .shutter-inner{background:var(--paper)}
.capture-confirm .captured{border:2px solid var(--color-border);box-shadow:none;border-radius:24px}
.camera-screen .crosshair{border-color:white}
.camera-loading,.camera-loading strong,.camera-loading.error strong{color:#fff}
.camera-loading .button{color:var(--ink);background:var(--lime)}
.camera-loading .button.secondary{color:#fff;background:transparent;border-color:#c5cec7}
.capture-expand{background:#1d2d25cc}
.camera-recovery{padding-bottom:16px}
.countdown,.stat{border:0;background:var(--color-card)}
.reveal .couple,.unit span,.stat span{font:var(--type-meta);text-transform:none}
.filter,.workspace-filters .filter,.collection-screen .workspace-filters .filter{min-height:44px;font:var(--type-meta);text-transform:none;background:var(--color-card);border-color:transparent;padding:8px 16px}
.filter.active,.filter[aria-pressed=true],.collection-screen .workspace-filters .filter[aria-pressed=true]{background:var(--lime);color:var(--ink);border-color:var(--color-focus)}
.category-title>span{font:var(--type-meta);text-transform:none}
.gallery .photo-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.gallery .photo-card{box-shadow:none}
.viewer-head .icon-btn{background:var(--color-card);border:0}
.viewer-main .arrow{background:#1d2d25cc;color:white;min-width:44px;min-height:44px}
.viewer-dots .active{background:var(--color-focus)}
.thumbs button.active{border-color:var(--color-focus)}
.stepper b{width:32px;height:32px;background:var(--soft);color:var(--color-muted)}
.stepper [aria-current=step] b{background:var(--lime);color:var(--ink);outline:1px solid var(--color-focus)}
.stepper .complete b{background:var(--ink);color:white}
.camera-style.selected{border-color:var(--color-focus);background:var(--soft)}
.camera-style-check{background:var(--lime);color:var(--ink)}
.invitation-preview strong{color:#fff}.cover-edit{background:var(--paper);color:var(--ink);border-radius:8px;min-height:44px}
.wedding-card,.card,.choice-card,.permission-row,.settings-screen .permission-row{border:0;background:var(--soft);box-shadow:none}
.compact-wedding{background:var(--soft);padding:24px}
.wedding-options>div{background:var(--paper);box-shadow:0 12px 30px #1d2d2515}
.account-footer .danger-action{border:0;border-radius:8px;color:var(--color-danger);font:var(--type-label)}
.account-plan-picker>summary{border-radius:8px}
.plan-card .pill{background:var(--lime);color:var(--ink)}
.dashboard-screen .photo-empty,.moderation-empty{border:0;background:var(--soft)}
.dashboard-tools .button{font:var(--type-label)}
.guest-count{border:0;background:var(--soft);font:var(--type-meta)}
.plan-option strong,.payment-state,.payment-state.paid{color:var(--ink)}
.plan-option:has(input:checked){box-shadow:inset 0 0 0 2px var(--color-focus)}
.book-photo:has(input:checked) img{outline-color:var(--color-focus)}
.review-actions,.dashboard-actions,.operator-order details,.image-retry{background:var(--color-bg);color:var(--color-text)}
.preview-banner{background:var(--ink);color:white}.preview-banner button{background:var(--lime);color:var(--ink);border-radius:8px}
.shots.gallery-live{background:var(--color-chip);color:var(--color-text)}
.layout-switch button{color:var(--color-muted)}.layout-switch button[aria-pressed=true]{color:var(--ink);border-color:var(--color-focus)}
.dialog-close:hover{background:var(--color-hover)}
dialog{background:var(--paper);border:0;box-shadow:0 16px 80px #1d2d2538}
dialog::backdrop{background:#1d2d2580}
.dialog-content>[role=alert]{color:var(--color-danger)}
.toast{background:var(--ink);color:#fff;box-shadow:0 8px 28px #1d2d2526}
.toast-success .toast-icon{color:var(--lime)}
.toast button{color:var(--ink);background:var(--lime);border:0;border-radius:8px}
.toast-error{background:#fff0ee;color:#8f2018}.toast-error .toast-icon{color:#b42318}
.sync-notice{border-color:var(--color-focus);background:var(--soft);color:var(--ink)}
.capture-zoom-controls button{background:var(--color-card);color:var(--color-text);border-color:var(--color-border)}
@media(hover:hover){.button:not(:disabled):not(.secondary):hover{background:var(--color-brand-hi)}.button.secondary:not(:disabled):hover{background:var(--color-card)}.choice-card:hover{background:var(--color-hover)}}
@media(prefers-reduced-motion:reduce){.button{transition:none}}

/* Local Google Material icons; notification timing lives in app.js. */
.material-status-icon{display:block;flex:0 0 24px;width:24px;height:24px;background:currentColor;-webkit-mask:var(--status-mask) center/contain no-repeat;mask:var(--status-mask) center/contain no-repeat}
.material-status-success{--status-mask:url('assets/material/check_circle-rounded.svg')}
.material-status-error{--status-mask:url('assets/material/cancel-rounded.svg')}
.material-status-info{--status-mask:url('assets/material/info-rounded.svg')}
.toast{font:var(--type-meta);padding:16px 16px;gap:8px;animation:notification-in .16s ease-out}
.toast .toast-message{min-width:0}
@keyframes notification-in{from{opacity:0;translate:0 6px}to{opacity:1;translate:0 0}}
#confirm-delete,#confirm-remove-pending,.delete-photo{background:#b42318;color:#fff;border-color:transparent;border-radius:8px}
#confirm-delete:hover,#confirm-remove-pending:hover{background:#941b12}
@media(prefers-reduced-motion:reduce){.toast{animation:none}}

/* Request recovery uses the existing status icon and button styles. */
.inline-status-icon{width:20px;height:20px;vertical-align:middle;flex-shrink:0}
.book-support-link{display:block;overflow-wrap:anywhere}

/* Wedding details, editing and guest QR are separate, predictable surfaces. */
.wedding-details .dashboard-title h1{font:var(--type-heading)}
.header-action{width:auto;min-width:76px;min-height:44px!important;margin:0;padding:8px 16px}
.wedding-details .content{padding-bottom:128px}
.wedding-facts{margin:16px 0 24px;display:grid;gap:16px}
.wedding-facts dt,.wedding-appearance h2{font:var(--type-meta);color:var(--color-muted);margin:0 0 8px;font-weight:500}
.wedding-facts dd{margin:0;font:var(--type-body)}
.wedding-facts .detail-timezone{font:var(--type-meta);color:var(--color-muted);margin-top:8px}
.wedding-facts .text-button{padding:8px 0;margin:0}
.qr-availability{margin:0 0 8px;color:var(--color-muted)}
.wedding-appearance{margin-top:24px}
.wedding-appearance .invitation-preview{margin:8px 0 24px}
.selected-photo-style{display:flex;align-items:center;gap:16px;margin:8px 0 0}
.selected-photo-style .camera-style-preview{width:88px;height:110px;flex-shrink:0;border-radius:12px;overflow:hidden}
.selected-photo-style figcaption{display:grid;gap:8px;font:var(--type-meta);color:var(--color-muted)}
.selected-photo-style strong{font:var(--type-label);color:var(--color-text)}
.wedding-editor .content{padding-bottom:32px}
.wedding-editor .dashboard-title{margin-bottom:24px}
.qr-screen .content{padding:24px 24px 120px;text-align:center}
.qr-screen .qr-card{display:flex;flex-direction:column;align-items:center;width:min(280px,100%);height:auto;margin:16px auto;padding:24px;background:#e8ff46;color:#151515;border-radius:24px}
.qr-screen .qr-wordmark{font-family:"Instrument Serif",serif;font-size:2.4rem;line-height:1}
.qr-screen .qr-wordmark span{color:#151515}
.qr-screen .qr-code-field{display:block;width:100%;margin:22px 0 18px;padding:12px;background:#fff;border-radius:10px}
.qr-screen .qr{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;margin:0;padding:0;border-radius:0}
.qr-screen .qr-poster-copy{font:500 1rem/1.35 "DM Sans",sans-serif;letter-spacing:-.01em;text-align:center}
.qr-screen .qr[hidden]{display:none}
.qr-screen .invitation-link-field{position:relative;margin:24px 0 8px}
.qr-screen .share-link{width:100%;min-width:0;margin:0;padding:16px 104px 16px 16px;font:var(--type-meta);text-overflow:ellipsis;min-height:56px}
.invitation-link-actions{position:absolute;right:5px;top:50%;transform:translateY(-50%);display:flex;gap:8px}
.invitation-icon{display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:10px;background:transparent;color:var(--ink);padding:8px;cursor:pointer}
.invitation-icon svg{width:22px;height:22px;fill:currentColor}
.invitation-icon:hover{background:var(--color-hover)}
.invitation-icon:focus-visible{outline:2px solid var(--color-focus);outline-offset:1px}
.qr-secondary-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:center}
.qr-screen .qr-secondary-links .text-button{margin:0;padding:8px 0;min-height:44px;font:var(--type-meta);text-decoration:underline;text-underline-offset:3px}
.qr-screen #qr-status{margin:8px 0}
.qr-screen .onboarding-heading h2{font:var(--type-heading);margin:0 0 8px;overflow-wrap:anywhere}

/* Revealed guest photos: one individual download and readable empty-state copy. */
.viewer .viewer-download{flex-shrink:0;width:calc(100% - 48px);margin:0 24px;min-height:44px}
.view-spot,.spot-gallery-head p,.spot-empty .body{color:var(--color-muted)}

/* Private payment setup uses the existing form and card tokens. */
#stripe-settings-form{display:grid;gap:24px;min-width:0}#stripe-settings-form .card{display:grid;gap:16px}#stripe-settings-form textarea{width:100%;min-height:100px;box-sizing:border-box}#stripe-settings-form .check-row{display:flex;gap:16px;align-items:flex-start}

.stripe-save-actions{display:grid;gap:16px;padding-block:16px}#stripe-settings-status{margin:0;overflow-wrap:anywhere}#stripe-settings-status[data-error="true"],.stripe-field-error{color:#a82020}.stripe-field-error{font-size:14px;margin:0}#stripe-settings-form [aria-invalid="true"]{border-color:#a82020}#stripe-settings-form [aria-invalid="true"]:focus{outline:2px solid #a82020;outline-offset:2px}

/* Branded loading state and concise purchase review. */
.loading-screen{min-height:var(--app-height);display:flex;flex-direction:column;background:var(--soft)}
.loading-screen .splash-nav{flex:none}
.loading-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px 24px calc(64px + env(safe-area-inset-bottom));min-height:calc(var(--app-height) - 64px)}
.loading-content h1{font:var(--type-title);max-width:320px;margin:0 0 16px;letter-spacing:-.035em;text-wrap:balance}
.loading-spots{display:flex;gap:8px;margin-bottom:32px;padding:16px 24px;border-radius:var(--radius-pill);background:var(--ink)}
.loading-spots span{width:10px;height:10px;border-radius:50%;background:var(--lime);animation:loading-spot 1.4s ease-in-out infinite}
.loading-spots span:nth-child(2){animation-delay:.16s}.loading-spots span:nth-child(3){animation-delay:.32s}
@keyframes loading-spot{0%,80%,100%{opacity:.35;transform:scale(.85)}40%{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.loading-spots span{animation:none}}
.purchase-dialog{width:min(480px,calc(100vw - 32px))}
.purchase-dialog .dialog-header{padding:24px 16px 16px 24px}
.purchase-dialog .dialog-header h2{font:var(--type-heading)}
.purchase-summary{background:var(--soft);border-radius:var(--radius-md);padding:16px}
.purchase-summary-heading{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.purchase-summary-heading strong{font:var(--type-label)}
.purchase-summary-heading>span{font:var(--type-title);white-space:nowrap}
#purchase-review .purchase-summary .microcopy{margin-top:8px}
#purchase-review .purchase-validity,.purchase-details p{font:var(--type-meta);color:var(--color-muted)}
.purchase-details{font:var(--type-meta);color:var(--color-muted)}
.purchase-details summary{min-height:32px;cursor:pointer;font:var(--type-meta);color:var(--ink)}
#purchase-review .purchase-details p{margin-top:8px}
.purchase-consents{display:grid;gap:16px;padding-top:8px}
#purchase-review .check-row{margin:0;font:var(--type-body);color:var(--ink)}
#purchase-review input[type=checkbox]{min-height:22px;padding:0;border-radius:6px}
.purchase-consents small{display:block;margin-top:8px;color:var(--color-muted);font:var(--type-meta)}
.purchase-privacy{text-align:center}

/* A single entry for photobook requests and their current status. */
.dashboard-tools .photobook-action{display:flex;flex-direction:column;gap:8px;padding:16px 24px}
.photobook-action .photobook-status{font:var(--type-meta);color:var(--color-muted)}

/* Extend the native details button across its card; keep options above it. */
.compact-wedding .wedding-open:not(:disabled)::after{content:"";position:absolute;inset:0;z-index:1;border-radius:20px;cursor:pointer}
.compact-wedding .wedding-open:focus-visible::after{outline:2px solid var(--color-text);outline-offset:4px}
.compact-wedding .wedding-options>summary{position:relative;z-index:2}
.wedding-view-label{text-decoration:underline;text-underline-offset:3px}

/* Shared 8 px rhythm. Device safe-area insets are added by the browser. */
:root{--space-1:8px;--space-2:16px;--space-3:24px;--space-4:32px;--space-5:40px;--space-6:48px}
/* A single scroll area in dialogs avoids intrinsic grid collapse in mobile Safari. */
dialog[open]{display:flex;flex-direction:column;max-height:calc(100svh - 32px);max-height:calc(100dvh - 32px)}
.dialog-header,.purchase-dialog .dialog-header{flex:none;align-items:center;gap:16px;padding:16px 16px 16px 24px}
.dialog-header h2{padding:0;margin:0}
.dialog-close{position:relative;z-index:1;flex:0 0 48px;width:48px;height:48px;min-height:48px;line-height:1;touch-action:manipulation}
.dialog-content{flex:1 1 auto;min-height:0;overflow:auto;padding:0 24px 24px}
.purchase-dialog[open]{height:min(720px,calc(100svh - 32px));height:min(720px,calc(100dvh - 32px))}
.purchase-dialog .dialog-content{display:flex;flex-direction:column;overflow:hidden}
#purchase-review{flex:1 1 auto;display:flex;flex-direction:column;min-height:0;gap:16px}
.purchase-review-copy{flex:1 1 auto;display:flex;flex-direction:column;min-height:0;overflow-y:auto;gap:16px;padding:8px;scroll-padding:8px;-webkit-overflow-scrolling:touch}
.purchase-review-copy>*{flex-shrink:0}
#purchase-review>.button{flex:none;width:100%;margin:0}
#purchase-review input[type=checkbox]{width:24px;height:24px;min-height:24px;flex-basis:24px;margin:0}
.capture-zoom-dialog .dialog-content{flex:1;min-height:0;padding:0}

/* A package chosen on the landing remains identifiable after sign-in. */
.plan-card.selected-package { outline: 2px solid var(--ink); outline-offset: -2px; }