:root{--paper:#f4f3ed;--ink:#28362f;--sage:#4b614f;--sage-hover:#3c5140;--muted:#59675e;--line:#d0d7cc;--white:#fbfcf7;--soft:#e4eadf;--rose:#e9dfd8;--danger:#8c3e38;--on-primary:#ffffff;--focus:#87672f;--status:#5d795d;--line-strong:#87967e;--input-border:#74836c;--placeholder:#62715f;--button-border:#74836c;--danger-bg:#f5e4df;--danger-border:#c38b7e;--danger-hover:#eed6d0;--success-ink:#36533c;--error-bg:#f5e4df;--error-ink:#8c3e38;--subtitle-dot:#6d7e60;--overlay:rgba(18,29,21,.76);--image-bg:#e6e9e0;--confirm-bg:#f5e4df;--camera-chassis:#e4e8df;--camera-border:#bac7b3;--tool-hover:#2d482e;--shutter-hover:#3c5140;--shutter-active:#2d482e;--glass:rgba(251,252,247,.84);--glass-border:rgba(255,255,255,.85);--glow-sage:rgba(157,185,145,.23);--glow-rose:rgba(208,177,160,.19);--viewfinder-chrome:#263026;--viewfinder-bg:#192019;--viewfinder-ink:#e9eddd;--viewfinder-muted:#bdc8b4;--viewfinder-accent:#c6d7b5;--viewfinder-outline:#718968;color-scheme:light;font-family:Arial,Helvetica,sans-serif;font-size:15px;line-height:1.6;color:var(--ink);background:var(--paper)}
:root[data-theme="dark"]{--paper:#141d19;--ink:#edf1e8;--sage:#acbfa0;--sage-hover:#c0d0b5;--muted:#b2bdb0;--line:#455448;--white:#202c25;--soft:#2e3d31;--rose:#3d302d;--danger:#f0b8a7;--on-primary:#1b2a1c;--focus:#e5bd75;--status:#b3cf9f;--line-strong:#849b79;--input-border:#72846b;--placeholder:#a9b6a3;--button-border:#72846b;--danger-bg:#472f2b;--danger-border:#aa786b;--danger-hover:#593b34;--success-ink:#c1d8b5;--error-bg:#472f2b;--error-ink:#f0b8a7;--subtitle-dot:#a8bd96;--overlay:rgba(3,9,5,.86);--image-bg:#0f1712;--confirm-bg:#472f2b;--camera-chassis:#25342b;--camera-border:#61735a;--tool-hover:#d5e5c9;--shutter-hover:#c0d0b5;--shutter-active:#d5e5c9;--glass:rgba(32,44,37,.88);--glass-border:rgba(160,187,149,.26);--glow-sage:rgba(90,132,87,.20);--glow-rose:rgba(143,104,94,.12);color-scheme:dark}
@media(prefers-color-scheme:dark){:root:not([data-theme]){--paper:#141d19;--ink:#edf1e8;--sage:#acbfa0;--sage-hover:#c0d0b5;--muted:#b2bdb0;--line:#455448;--white:#202c25;--soft:#2e3d31;--rose:#3d302d;--danger:#f0b8a7;--on-primary:#1b2a1c;--focus:#e5bd75;--status:#b3cf9f;--line-strong:#849b79;--input-border:#72846b;--placeholder:#a9b6a3;--button-border:#72846b;--danger-bg:#472f2b;--danger-border:#aa786b;--danger-hover:#593b34;--success-ink:#c1d8b5;--error-bg:#472f2b;--error-ink:#f0b8a7;--subtitle-dot:#a8bd96;--overlay:rgba(3,9,5,.86);--image-bg:#0f1712;--confirm-bg:#472f2b;--camera-chassis:#25342b;--camera-border:#61735a;--tool-hover:#d5e5c9;--shutter-hover:#c0d0b5;--shutter-active:#d5e5c9;--glass:rgba(32,44,37,.88);--glass-border:rgba(160,187,149,.26);--glow-sage:rgba(90,132,87,.20);--glow-rose:rgba(143,104,94,.12);color-scheme:dark}}

/* Shared foundation. Wedding colors and invitation typography follow the event brief. */
* { box-sizing:border-box; }
body { margin:0; min-height:100dvh; background:radial-gradient(ellipse at 12% 0,var(--glow-sage),transparent 56%),radial-gradient(ellipse at 92% 28%,var(--glow-rose),transparent 48%),var(--paper); }
button,input,a { -webkit-tap-highlight-color:transparent; }
button,input { font:inherit; }
button,a { touch-action:manipulation; }
button { cursor:pointer; }
button:disabled { cursor:default; opacity:.65; }
a { color:inherit; }
[hidden] { display:none!important; }
button:focus-visible,a:focus-visible,input:focus-visible { outline:3px solid var(--focus); outline-offset:4px; }
button svg,.button svg { width:19px; height:19px; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
.wrap { max-width:1160px; margin:0 auto; padding-left:36px; padding-right:36px; }
h1,h2,p { margin-top:0; }
h1,h2 { font-family:Georgia,"Times New Roman",serif; font-weight:400; text-wrap:balance; }
h1 { font-size:72px; line-height:1.04; letter-spacing:-3.4px; margin-bottom:26px; }
h1 em { font-weight:400; color:var(--sage); }
.eyebrow { font-size:12px; letter-spacing:1.5px; font-weight:600; color:var(--sage); margin:0 0 23px; }
.muted { color:var(--muted); }
.skip-link { position:fixed; top:12px; left:12px; z-index:100; background:var(--white); color:var(--ink); border:1px solid var(--input-border); padding:12px 18px; border-radius:8px; transform:translateY(-160%); }
.skip-link:focus { transform:translateY(0); }
#main-content:focus-visible { outline:3px solid var(--focus); outline-offset:-3px; }
#main-content:focus:not(:focus-visible) { outline:none; }

/* One header contract for guest, public album and owner album. */
.site-header { display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:88px; padding-top:16px; padding-bottom:16px; background:var(--white); border-bottom:1px solid var(--line); border-radius:0 0 18px 18px; }
.brand { display:inline-flex; align-items:center; gap:11px; min-height:44px; min-width:0; text-decoration:none; font-size:12px; letter-spacing:1.8px; font-weight:600; line-height:1.4; flex-shrink:0; }
.brand img { width:32px; height:32px; flex-shrink:0; }
.brand small { display:block; font-size:11px; letter-spacing:.6px; color:var(--muted); font-weight:400; margin-top:3px; }
.header-actions { display:flex; align-items:center; justify-content:flex-end; gap:16px; min-width:0; }
.primary-nav { display:flex; align-items:center; gap:4px; }
.nav-link { display:inline-flex; align-items:center; justify-content:center; min-width:44px; min-height:44px; padding:10px 14px; border-radius:9px; color:var(--muted); font-size:13px; font-weight:500; white-space:nowrap; text-decoration:none; }
.nav-link:hover { color:var(--ink); background:var(--soft); }
.nav-link[aria-current="page"] { background:var(--soft); color:var(--ink); font-weight:600; text-decoration:underline; text-underline-offset:5px; text-decoration-thickness:1px; }
.nav-label-short { display:none; }
.theme-toggle { display:inline-grid; place-items:center; flex:0 0 44px; width:44px; height:44px; padding:10px; border:1px solid var(--button-border); border-radius:50%; background:var(--white); color:var(--sage); }
.theme-toggle svg { width:20px; height:20px; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.theme-toggle .theme-icon-sun { display:none; }
:root[data-theme="dark"] .theme-toggle .theme-icon-sun { display:block; }
:root[data-theme="dark"] .theme-toggle .theme-icon-moon { display:none; }
.theme-toggle:hover { background:var(--soft); }

/* Guest: identity alongside the task on desktop, short introduction on phones. */
.guest-layout { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:64px; align-items:center; min-height:650px; padding-top:48px; padding-bottom:56px; }
.story-panel { padding:15px 0 35px; min-width:0; }
.story-copy { max-width:300px; font-size:15px; color:var(--muted); line-height:1.8; margin-bottom:39px; text-wrap:pretty; }
.couple-sign { display:flex; gap:17px; align-items:flex-start; }
.sign-line { width:35px; flex-shrink:0; height:1px; background:var(--line-strong); margin-top:15px; }
.couple-sign p { font:22px Georgia,serif; margin:0 0 5px; max-width:270px; overflow-wrap:anywhere; }
.couple-sign small { font-size:12px; letter-spacing:.5px; color:var(--muted); }
.upload-panel { padding:34px 34px 28px; min-width:0; background:var(--white); border:1px solid var(--line); border-radius:20px; }
.camera-tile { width:53px; height:53px; display:grid; place-items:center; background:var(--soft); border-radius:15px; color:var(--sage); margin-bottom:20px; }
.camera-tile svg { width:29px; height:29px; stroke:currentColor; stroke-width:1.3; stroke-linecap:round; stroke-linejoin:round; }
.upload-panel .eyebrow { margin-bottom:10px; }
.upload-panel h2 { font-size:36px; line-height:1.2; letter-spacing:-1px; margin-bottom:14px; }
.panel-copy { font-size:14px; color:var(--muted); line-height:1.7; margin-bottom:22px; max-width:310px; text-wrap:pretty; }
.capture-steps { display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; list-style:none; margin:0 0 25px; padding:0 0 20px; border-bottom:1px solid var(--line); color:var(--muted); font-size:12px; }
.capture-steps li { display:flex; align-items:center; gap:7px; }
.capture-steps span { color:var(--sage); font-variant-numeric:tabular-nums; }
label { display:flex; align-items:center; gap:10px; font-size:14px; font-weight:500; margin-bottom:9px; }
.optional { font-size:12px; color:var(--muted); font-weight:400; border:1px solid var(--line); padding:0 7px; border-radius:12px; }
input { border:1px solid var(--input-border); background:var(--paper); border-radius:10px; color:var(--ink); width:100%; padding:14px; font-size:16px; min-height:51px; }
input::placeholder { color:var(--placeholder); font-size:14px; }
.field-hint { font-size:12px; color:var(--muted); margin:7px 0 21px; line-height:1.6; }
.button { display:inline-flex; justify-content:center; align-items:center; gap:9px; padding:12px 18px; min-height:48px; border:1px solid transparent; border-radius:10px; font-size:13px; font-weight:600; text-decoration:none; line-height:1.4; transition:background .15s,color .15s; }
.button:active:not(:disabled) { transform:translateY(1px); }
.button[aria-busy="true"] { cursor:progress; }
.button-primary { background:var(--sage); color:var(--on-primary); }
.button-primary:hover { background:var(--sage-hover); }
.button-secondary { background:transparent; color:var(--sage); border-color:var(--button-border); font-weight:500; }
.button-secondary:hover { background:var(--soft); }
.button-danger { background:var(--danger-bg); color:var(--danger); border-color:var(--danger-border); }
.button-danger:hover { background:var(--danger-hover); }
.button-wide { width:100%; min-height:54px; font-size:14px; }
.gallery-button { margin-top:10px; }
.gallery-hint { text-align:center; color:var(--muted); font-size:12px; margin:8px 0 0; line-height:1.6; }
.file-hint { font-size:12px; text-align:center; color:var(--muted); margin:13px 0 20px; line-height:1.7; }
.privacy-note { display:flex; align-items:flex-start; gap:9px; padding-top:20px; border-top:1px solid var(--line); font-size:12px; color:var(--muted); }
.privacy-note svg { width:15px; height:15px; stroke:var(--sage); stroke-width:1.5; flex-shrink:0; margin-top:2px; }
.privacy-note p { margin:0; line-height:1.8; }
.message { margin:16px 0 0; padding:13px 15px; border-radius:10px; background:var(--soft); color:var(--success-ink); font-size:13px; line-height:1.7; overflow-wrap:anywhere; }
.message.error { background:var(--error-bg); color:var(--error-ink); }
.success-link { display:flex; align-items:center; min-height:48px; margin-top:12px; padding:9px 4px; color:var(--sage); font-size:14px; font-weight:600; text-underline-offset:4px; }
.selected-photo { display:flex; align-items:center; gap:12px; background:var(--paper); border:1px solid var(--line); padding:10px; border-radius:10px; margin-bottom:14px; }
.selected-photo img,.heic-placeholder { width:58px; height:58px; flex-shrink:0; border-radius:6px; }
.selected-photo img { object-fit:cover; }
.heic-placeholder { background:var(--soft); color:var(--sage); display:grid; place-items:center; font-size:12px; font-weight:600; }
.selected-photo div { min-width:0; flex:1; }
.selected-photo strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; font-weight:400; }
.selected-photo span { font-size:12px; color:var(--muted); }
.icon-button { border:0; background:transparent; color:var(--muted); width:44px; height:44px; display:grid; place-items:center; font-size:25px; border-radius:5px; flex-shrink:0; }
.icon-button:hover { background:var(--soft); color:var(--ink); }
.upload-progress { margin-top:16px; }
progress { appearance:none; border:0; width:100%; height:5px; display:block; border-radius:8px; overflow:hidden; background:var(--soft); color:var(--sage); }
progress::-webkit-progress-bar { background:var(--soft); }
progress::-webkit-progress-value { background:var(--sage); }
progress::-moz-progress-bar { background:var(--sage); }
.upload-progress p { font-size:12px; color:var(--muted); margin:8px 0 0; }
.batch-panel { margin:0 0 16px; border:1px solid var(--line); border-radius:12px; background:var(--paper); overflow:hidden; }
.batch-heading { padding:13px 14px; display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; border-bottom:1px solid var(--line); }
.batch-heading strong { font-size:13px; font-weight:600; }
.batch-heading>span { font-size:12px; color:var(--muted); }
.batch-list { list-style:none; margin:0; padding:0; max-height:280px; overflow:auto; overscroll-behavior:contain; }
.batch-list li { display:flex; align-items:center; gap:10px; padding:9px 8px 9px 14px; border-bottom:1px solid var(--line); }
.batch-list li:last-child { border-bottom:0; }
.batch-list li>div { min-width:0; flex:1; }
.batch-list strong { display:block; font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:500; }
.batch-list span { display:block; font-size:12px; line-height:1.7; color:var(--muted); overflow-wrap:anywhere; }
.batch-list .batch-error { color:var(--error-ink); }
.batch-panel>.field-hint { padding:12px 14px; margin:0; border-top:1px solid var(--line); }
.site-footer { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:15px; min-height:95px; font-size:12px; color:var(--muted); border-top:1px solid var(--line); margin-top:25px; }
.site-footer a { min-height:44px; display:inline-flex; align-items:center; text-decoration:none; }
.site-footer a:hover { text-decoration:underline; }
.noscript-note { text-align:center; padding:16px; }

/* Album cards crop thumbnails; the viewer always contains the whole image. */
.album-view { min-height:440px; }
.album-intro { display:flex; justify-content:space-between; align-items:flex-end; gap:32px; flex-wrap:wrap; margin:48px 0 36px; }
.album-intro .eyebrow { margin-bottom:17px; }
.album-intro h1 { font-size:64px; letter-spacing:-2.4px; margin-bottom:19px; }
.album-subtitle { display:flex; flex-wrap:wrap; gap:9px; font-size:14px; color:var(--muted); margin:0; overflow-wrap:anywhere; }
.subtitle-dot { color:var(--subtitle-dot); }
.album-access-note { font-size:12px; line-height:1.7; color:var(--muted); margin:12px 0 0; max-width:400px; }
.album-actions { display:flex; gap:10px; padding-bottom:2px; flex-wrap:wrap; }
.album-meta { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; border-top:1px solid var(--line); padding:20px 0; font-size:12px; color:var(--muted); }
.album-meta span:first-child { color:var(--ink); }
#owner-mode-label { flex-basis:100%; color:var(--sage); font-weight:600; }
.photo-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:28px 20px; margin-top:3px; }
.photo-card { min-width:0; }
.photo-open { display:block; width:100%; border:1px solid var(--line); background:var(--soft); padding:0; border-radius:12px; overflow:hidden; aspect-ratio:4/5; position:relative; }
.photo-open img { width:100%; height:100%; object-fit:cover; display:block; }
.photo-caption { display:flex; justify-content:space-between; align-items:baseline; gap:8px; padding:12px 2px 0; font-size:13px; }
.photo-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:500; }
.photo-time { font-size:12px; color:var(--muted); white-space:nowrap; }
.load-more { text-align:center; margin:34px 0 50px; }
.photo-skeleton { aspect-ratio:4/5; background:var(--soft); border:1px solid var(--line); border-radius:12px; position:relative; margin-bottom:28px; }
.photo-skeleton::after { content:""; position:absolute; bottom:-22px; left:0; width:55%; height:9px; background:var(--soft); border-radius:4px; }
.thumbnail-error { position:absolute; inset:0; display:grid; place-content:center; padding:24px; color:var(--muted); font-size:13px; line-height:1.7; text-align:center; }
.empty-state { text-align:center; padding:56px 24px; border:1px solid var(--line); background:var(--white); border-radius:12px; }
.empty-state>span { font-size:32px; color:var(--sage); }
.empty-state h2 { font-size:30px; margin:12px 0; }
.empty-state p { font-size:14px; color:var(--muted); max-width:380px; margin:0 auto 22px; }
.load-error { margin-bottom:30px; }

/* Solid dialogs keep text and photos distinct from the glass beneath them. */
dialog:not([open]) { display:none; }
.photo-dialog { width:min(930px,calc(100% - 32px)); max-height:calc(100dvh - 40px); padding:0; background:var(--white); color:var(--ink); border:1px solid var(--line); border-radius:18px; overflow:auto; }
.photo-dialog::backdrop,.archive-dialog::backdrop,.camera-dialog::backdrop { background:var(--overlay); }
.dialog-toolbar { padding:14px 18px; display:flex; justify-content:space-between; align-items:center; gap:15px; }
.dialog-toolbar>div { min-width:0; flex:1; }
.dialog-toolbar strong { font-weight:500; font-size:15px; overflow-wrap:anywhere; }
.dialog-toolbar small { display:block; font-size:12px; color:var(--muted); margin-top:3px; }
.dialog-image-area { position:relative; background:var(--image-bg); display:flex; justify-content:center; align-items:center; min-height:240px; }
.dialog-image-area img { width:100%; height:min(56dvh,650px); object-fit:contain; display:block; }
.image-state { height:min(56dvh,650px); min-height:240px; width:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:18px; padding:24px; color:var(--muted); text-align:center; font-size:14px; }
.viewer-navigation { display:grid; grid-template-columns:minmax(44px,1fr) auto minmax(44px,1fr); align-items:center; gap:12px; padding:12px 16px; border-top:1px solid var(--line); }
.viewer-nav-button { min-width:44px; min-height:44px; gap:6px; padding:10px 12px; font-size:12px; white-space:nowrap; }
.viewer-nav-button:first-child { justify-self:start; }
.viewer-nav-button:last-child { justify-self:end; }
.viewer-position { display:flex; flex-direction:column; align-items:center; gap:2px; }
#dialog-position { font-size:12px; color:var(--muted); white-space:nowrap; font-variant-numeric:tabular-nums; text-align:center; }
.viewer-position small { font-size:12px; line-height:1.4; color:var(--muted); white-space:nowrap; }
.dialog-bottom { display:flex; justify-content:flex-end; align-items:center; gap:15px; flex-wrap:wrap; padding:0 16px 16px; }
.dialog-bottom>div { display:flex; gap:8px; flex-wrap:wrap; }
.delete-confirm { margin:0 18px 18px; padding:15px; background:var(--confirm-bg); border-radius:10px; }
.delete-confirm p { font-size:13px; }
.delete-confirm>div { display:flex; gap:8px; flex-wrap:wrap; }
.photo-dialog .message { margin:0 18px 18px; }
.archive-dialog { max-width:470px; width:calc(100% - 32px); max-height:calc(100dvh - 32px); overflow:auto; border:1px solid var(--line); border-radius:18px; background:var(--white); color:var(--ink); padding:30px; }
.archive-dialog h2 { font-size:29px; line-height:1.2; margin-bottom:16px; }
.archive-dialog p { font-size:14px; line-height:1.8; }
.dialog-buttons { display:flex; justify-content:flex-end; gap:9px; flex-wrap:wrap; margin-top:24px; }
.leave-dialog .eyebrow { font:600 12px Arial,Helvetica,sans-serif; letter-spacing:1.5px; margin-bottom:14px; }
.leave-dialog .dialog-buttons { justify-content:stretch; }
.leave-dialog .dialog-buttons .button { flex:1; min-width:145px; }
.dialog-fallback { display:block; position:fixed; inset:20px; margin:auto; z-index:20; box-shadow:0 0 0 100vmax var(--overlay); max-height:calc(100dvh - 40px); }

/* Camera controls stay outside the frame and never imply hardware filters. */
.camera-dialog { width:min(720px,calc(100% - 24px)); max-height:calc(100dvh - 24px); margin:auto; padding:21px; background:var(--camera-chassis); color:var(--ink); border:1px solid var(--camera-border); border-radius:18px; overflow:auto; }
.digicam-top { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:16px; }
.digicam-brand { font-size:12px; letter-spacing:1.5px; color:var(--sage); font-weight:600; }
.digicam-top h2 { font-size:24px; letter-spacing:-.6px; line-height:1.2; margin:3px 0 0; }
.digicam-display { background:var(--viewfinder-chrome); border-radius:9px; padding:11px; color:var(--viewfinder-ink); }
.digicam-meta,.digicam-bottom { display:flex; justify-content:space-between; gap:8px 12px; flex-wrap:wrap; font-size:12px; padding:1px 2px 10px; }
.digicam-meta>span:first-child { letter-spacing:.5px; }
.digicam-bottom { padding:10px 2px 0; color:var(--viewfinder-muted); }
.viewfinder { position:relative; background:var(--viewfinder-bg); height:min(50dvh,430px); min-height:180px; overflow:hidden; border-radius:3px; }
.viewfinder video,.viewfinder>img { display:block; width:100%; height:100%; object-fit:contain; }
.selfie-preview { transform:scaleX(-1); }
.camera-wait,.camera-success { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:10px; padding:24px; text-align:center; background:var(--viewfinder-chrome); }
.camera-wait p { font-size:13px; max-width:300px; margin:0; color:var(--viewfinder-ink); }
.camera-success>span { font-size:35px; border:1px solid var(--viewfinder-outline); color:var(--viewfinder-accent); width:59px; height:59px; border-radius:50%; display:grid; place-items:center; margin-bottom:12px; }
.camera-success h3 { font:400 29px Georgia,serif; margin:0; }
.camera-success p { font-size:13px; color:var(--viewfinder-muted); margin:0; }
.camera-live-controls { display:flex; align-items:center; justify-content:center; gap:35px; flex-wrap:wrap; padding-top:22px; }
.camera-tool { display:flex; flex-direction:column; align-items:center; gap:5px; padding:7px 4px; background:transparent; border:0; color:var(--sage); min-width:83px; min-height:48px; font-size:12px; }
.camera-tool svg { width:21px; height:21px; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.camera-tool:hover { color:var(--tool-hover); }
.shutter-button { width:70px; height:70px; flex-shrink:0; display:grid; place-items:center; border:2px solid var(--sage); border-radius:50%; background:transparent; padding:5px; }
.shutter-button>span { display:block; width:100%; height:100%; border-radius:50%; background:var(--sage); border:2px solid var(--camera-chassis); }
.shutter-button:hover>span { background:var(--shutter-hover); }
.shutter-button:active>span { background:var(--shutter-active); }
.camera-review-controls { display:flex; flex-wrap:wrap; gap:12px; margin-top:20px; }
.camera-review-controls>.button { flex:1; }
.camera-footnote { text-align:center; font-size:12px; color:var(--muted); margin:15px 0 0; }
.camera-dialog .message { margin-top:15px; }
.camera-dialog .upload-progress { margin-top:20px; }
#camera-resume { flex:0 0 100%; max-width:100%; margin:0; }

/* Glass is reserved for two primary surfaces; dialogs remain opaque. */
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  .site-header,.upload-panel { background:var(--glass); border-color:var(--glass-border); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); }
}
@media(hover:hover) { .photo-open:hover { border-color:var(--input-border); } }
@media(min-width:1500px) { .guest-layout { min-height:710px; } }
@media(max-width:960px) {
  .wrap { padding-left:26px; padding-right:26px; }
  .guest-layout { gap:32px; grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  h1 { font-size:59px; }
  .upload-panel { padding:28px 24px; }
  .photo-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px 16px; }
}
@media(max-width:680px) {
  .wrap { padding-left:20px; padding-right:20px; }
  .site-header { min-height:68px; gap:12px; padding-top:12px; padding-bottom:12px; border-radius:0 0 14px 14px; }
  .header-actions { gap:9px; }
  .primary-nav { gap:2px; }
  .nav-link { font-size:12px; padding:10px; }
  .brand { font-size:11px; letter-spacing:1.2px; gap:8px; }
  .brand small { display:none; }
  .brand img { width:30px; height:30px; }
  .guest-layout { display:flex; flex-direction:column; align-items:stretch; min-height:0; padding-top:24px; padding-bottom:24px; gap:22px; }
  .story-panel { padding:0; }
  .story-panel .eyebrow { margin-bottom:10px; }
  .guest-page h1 { font-size:clamp(30px,8vw,42px); line-height:1.12; letter-spacing:-1px; margin-bottom:12px; }
  .guest-page h1 br { display:none; }
  .story-copy { max-width:36ch; font-size:14px; line-height:1.6; margin-bottom:16px; }
  .couple-sign { gap:12px; }
  .couple-sign p { font-size:21px; }
  .upload-panel { border-radius:18px; padding:24px 22px 22px; }
  .upload-panel h2 { font-size:29px; margin-bottom:18px; }
  .upload-panel .camera-tile,.upload-panel .eyebrow,.upload-panel .panel-copy,.capture-steps { display:none; }
  .field-hint { margin-bottom:18px; }
  .site-footer { justify-content:center; text-align:center; gap:6px; margin-top:8px; padding-top:18px; padding-bottom:max(18px,env(safe-area-inset-bottom)); }
  .site-footer>span:first-child { width:100%; }
  .album-intro { margin:32px 0 28px; gap:24px; }
  .album-intro h1 { font-size:clamp(42px,10vw,54px); line-height:1.07; }
  .album-actions { width:100%; }
  .album-actions .button { flex:1; padding:11px 9px; font-size:12px; }
  .album-meta { gap:7px; padding:17px 0; }
  .photo-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px 12px; }
  .photo-open,.photo-skeleton { border-radius:9px; }
  .photo-caption { font-size:12px; gap:5px; padding-top:9px; flex-wrap:wrap; }
  .empty-state { padding:36px 20px; }
  .empty-state h2 { font-size:27px; }
  .photo-dialog { width:calc(100% - 16px); max-height:calc(100dvh - 20px); }
  .dialog-image-area,.image-state { min-height:220px; }
  .dialog-image-area img,.image-state { height:50dvh; }
  .image-state { font-size:13px; }
  .viewer-navigation { padding:12px; gap:8px; }
  .viewer-nav-button { padding:10px; }
  .dialog-bottom { padding:0 12px max(12px,env(safe-area-inset-bottom)); gap:12px; }
  .dialog-bottom>div { width:100%; justify-content:flex-end; }
  .dialog-bottom .button { min-height:44px; }
  .dialog-toolbar strong { font-size:14px; }
  .archive-dialog { padding:25px; }
  .camera-dialog { padding:15px; width:calc(100% - 16px); max-height:calc(100dvh - 16px); border-radius:14px; padding-bottom:max(15px,env(safe-area-inset-bottom)); }
  .digicam-top { margin-bottom:12px; }
  .digicam-top h2 { font-size:21px; }
  .digicam-display { padding:9px; }
  .digicam-meta,.digicam-bottom { gap:5px 8px; }
  .viewfinder { height:43dvh; min-height:160px; }
  .camera-live-controls { gap:18px; padding-top:18px; }
  .camera-tool { min-width:76px; }
  .shutter-button { width:65px; height:65px; }
  .camera-review-controls { gap:9px; margin-top:17px; }
  .camera-footnote { line-height:1.6; }
  .camera-success h3 { font-size:26px; }
  .photo-dialog.dialog-fallback { width:calc(100% - 16px); }
}
@media(max-width:480px) {
  .site-header { flex-wrap:nowrap; gap:8px; padding:12px 16px; }
  .brand { font-size:11px; letter-spacing:1px; gap:7px; }
  .brand img { width:28px; height:28px; }
  .header-actions { gap:7px; }
  .primary-nav .nav-link { padding:10px 9px; }
  .nav-label-full { display:none; }
  .nav-label-short { display:inline; }
}
@media(max-width:380px) {
  .viewer-nav-button>span { display:none; }
  .viewer-nav-button { width:44px; padding:10px; }
}
@media(max-width:360px) {
  .wrap { padding-left:16px; padding-right:16px; }
  .upload-panel { padding:22px 18px; }
  .camera-live-controls { gap:10px; }
}
@media(max-width:350px) {
  .brand { font-size:10px; letter-spacing:.6px; gap:5px; }
  .brand img { width:26px; height:26px; }
  .header-actions { gap:5px; }
  .primary-nav .nav-link { padding-left:7px; padding-right:7px; }
}
@media(max-width:300px) {
  .site-header { flex-wrap:wrap; }
  .header-actions { flex:1 0 100%; justify-content:space-between; }
  .primary-nav { flex:1; }
  .primary-nav .nav-link { flex:1; }
}
@media(max-height:520px) and (orientation:landscape) {
  .camera-dialog { max-width:680px; padding:12px; }
  .viewfinder { height:42dvh; min-height:100px; }
  .digicam-top { margin-bottom:9px; }
  .digicam-top h2 { font-size:18px; }
  .camera-live-controls { padding-top:10px; gap:30px; }
  .shutter-button { width:52px; height:52px; }
  .camera-footnote { margin-top:8px; }
  .digicam-meta { padding-bottom:5px; }
  .digicam-bottom { padding-top:5px; }
  .camera-review-controls { margin-top:12px; }
  .dialog-image-area,.image-state { min-height:100px; }
  .dialog-image-area img,.image-state { height:42dvh; }
  .viewer-navigation,.dialog-toolbar { padding:8px 12px; }
  .dialog-bottom { padding:0 12px 10px; }
}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more) {
  body { background:var(--paper); }
  .site-header,.upload-panel { background:var(--white); border-color:var(--input-border); -webkit-backdrop-filter:none; backdrop-filter:none; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { transition:none!important; animation:none!important; }
}
@media(forced-colors:active) {
  :root,:root[data-theme] { --paper:Canvas; --white:Canvas; --ink:CanvasText; --muted:CanvasText; --sage:LinkText; --on-primary:Canvas; --line:ButtonBorder; --button-border:ButtonBorder; --input-border:ButtonBorder; --soft:Canvas; --focus:Highlight; }
  body { background:Canvas; }
  .site-header,.upload-panel,.photo-dialog,.archive-dialog,.camera-dialog { background:Canvas; border:1px solid ButtonBorder; -webkit-backdrop-filter:none; backdrop-filter:none; }
  .theme-toggle,.button-primary { background:ButtonFace; color:ButtonText; border-color:ButtonBorder; }
  .nav-link[aria-current="page"] { color:LinkText; border:1px solid ButtonBorder; }
  .message,.message.error,.empty-state,.selected-photo,.batch-panel { background:Canvas; color:CanvasText; border:1px solid ButtonBorder; }
  .photo-skeleton,.photo-skeleton::after { background:Canvas; border:1px solid ButtonBorder; }
  .thumbnail-error,.image-state,.batch-list .batch-error { color:CanvasText; }
}