:root{--paper:#f8f3e9;--ink:#193b35;--gold:#a57c41;--line:#ded5c5}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--paper);color:var(--ink);font:14px/1.35 Arial,sans-serif}a{color:inherit;text-decoration:none}button,select{font:inherit;color:inherit;touch-action:manipulation}button,select{border:1px solid var(--line);background:#fffcf5;border-radius:18px;padding:7px 11px}button{cursor:pointer}button:hover,select:hover{background:#eee5d6}a:focus-visible,button:focus-visible,select:focus-visible{outline:3px solid var(--gold);outline-offset:2px}.display-shell{height:100vh;height:100dvh;display:grid;grid-template-rows:64px minmax(0,1fr) 40px;padding:0 18px;gap:8px}header{display:flex;align-items:center;gap:20px;border-bottom:1px solid var(--line);min-width:0}.brand img{display:block;width:80px;height:58px;object-fit:contain}.brand-line{font-size:10px;letter-spacing:2px;font-weight:bold}.brand-line span{display:block;font-size:8px;margin-top:3px;color:var(--gold)}.header-actions{margin-inline-start:auto;display:flex;align-items:center;gap:10px}#exit{font-size:10px;color:#677269;padding:7px}.header-actions select{max-width:140px;font-size:11px}main{display:grid;grid-template-columns:minmax(0,1fr) clamp(145px,23vw,245px);gap:18px;min-height:0}.story{display:grid;grid-template-rows:minmax(0,1fr) auto 3px;min-height:0;min-width:0;background:#fffdf7;border:1px solid #e6ddcd;border-radius:12px;overflow:hidden}.photo-stage{min-height:0;display:grid;grid-template-rows:35px minmax(0,1fr);padding:0 12px}.photo-label{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:9px;letter-spacing:1.5px;color:#9b743f;font-weight:bold;min-width:0}.photo-label #counter{letter-spacing:0;white-space:nowrap;color:#737f73}.photo-grid{display:flex;justify-content:center;align-items:center;gap:12px;min-height:0;min-width:0;overflow:hidden}.photo-tile{margin:0;width:calc((100% - 24px)/3);max-width:calc(100dvh - 280px);min-width:0;flex:0 1 auto}.photo-grid[data-count="2"] .photo-tile{width:calc((100% - 12px)/2);max-width:min(29vw,calc(100dvh - 280px))}.photo-tile img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;border-radius:0;background:transparent}.photo-tile figcaption{font-size:7px;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#899083;padding:4px 2px 0}.story-copy{padding:13px 16px 12px;display:flex;align-items:center;gap:12px;border-top:1px solid #eee7d9}.story-text{min-width:0;flex:1}h1{font:clamp(22px,2.7vw,35px)/1.1 Georgia,serif;margin:0 0 6px;letter-spacing:-.6px}#slide-subtitle{font-size:clamp(11px,1.3vw,16px);margin:0;color:#55635a}.translation{font-size:10px;margin:4px 0 0;color:#798077}.slide-controls{display:flex;align-items:center;gap:5px;flex-shrink:0}.slide-controls button{min-height:36px;min-width:36px;padding:7px 9px;font-size:11px}.progress-track{background:#e8dfcf}#progress{height:100%;width:100%;transform:scaleX(0);transform-origin:left;background:var(--gold)}[dir=rtl] #progress{transform-origin:right}.invitation{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;min-width:0;min-height:0;text-align:center;padding:8px 0 0}.eyebrow{font-size:8px;letter-spacing:1.5px;color:var(--gold);font-weight:bold;margin:0 0 8px}.invitation h2{font:clamp(21px,2.6vw,32px)/1.05 Georgia,serif;letter-spacing:-.4px;margin:0 0 10px}.invitation>p:not(.eyebrow){font-size:11px;margin:0 0 10px;max-width:230px;color:#667266}.book{display:block;padding:9px 12px;border-radius:22px;background:var(--ink);color:white;font-weight:bold;font-size:10px;width:100%;max-width:220px;margin-bottom:10px}.qr-corner{margin-top:auto;width:100%;max-width:220px;align-self:flex-end;display:flex;align-items:center;flex-direction:column}.qr-link{display:block;width:clamp(120px,16vw,190px);max-width:100%;background:white;border:1px solid #e4dccc;border-radius:10px;padding:3px;flex-shrink:0}.qr-link img{display:block;width:100%;height:auto;background:#fff}.scan{font-size:9px;line-height:1.4;margin:6px 0 2px;font-weight:bold}.scan span{display:block;font-size:8px;font-weight:normal;color:#798077}.site-link{font-size:9px;color:#647262;white-space:nowrap;margin-bottom:2px}footer{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--line);font-size:8px;color:#6d796c;min-width:0}.loop-state,.display-settings{display:flex;align-items:center;gap:7px}.status-dot{width:6px;height:6px;background:#a57c41;border-radius:50%;flex-shrink:0}.display-settings select{padding:4px 6px;font-size:9px}.display-settings button{font-size:9px;padding:5px 9px}.park-note{font-size:8px}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}[hidden]{display:none!important}@media(max-height:570px){.display-shell{grid-template-rows:50px minmax(0,1fr) 30px;gap:6px;padding:0 12px}header{gap:12px}.brand img{width:65px;height:47px}.invitation{padding-top:3px}.invitation h2{font-size:23px;margin-bottom:6px}.eyebrow{margin-bottom:5px}.invitation>p:not(.eyebrow){font-size:10px;margin-bottom:7px}.qr-link{width:140px}.book{padding:7px 10px;margin-bottom:8px}.photo-stage{grid-template-rows:28px minmax(0,1fr)}.photo-tile{max-width:calc(100dvh - 280px)}.photo-grid[data-count="2"] .photo-tile{max-width:min(29vw,calc(100dvh - 280px))}.story-copy{padding:9px 12px}h1{font-size:25px}.translation{font-size:9px}.park-note{display:none}}@media(max-width:800px){.brand-line{display:none}.header-actions{gap:4px}.photo-grid{gap:7px}.photo-stage{padding:0 8px}.photo-label{font-size:8px;letter-spacing:.7px}.photo-tile{width:calc((100% - 14px)/3)}main{gap:10px;grid-template-columns:minmax(0,1fr) 150px}.story-copy{display:block}.slide-controls{justify-content:flex-end;margin-top:7px}.invitation h2{font-size:24px}.invitation>p:not(.eyebrow){font-size:10px}.qr-link{width:140px}.eyebrow{font-size:7px}.site-link{font-size:8px}.park-note{display:none}.loop-state{max-width:45%}.display-settings{gap:4px}}@media(max-width:520px){.display-shell{padding:0 8px;grid-template-rows:52px minmax(0,1fr) 38px;gap:5px}.brand img{width:59px;height:45px}.header-actions select{max-width:116px;font-size:10px}#exit{max-width:90px;font-size:9px}main{grid-template-columns:minmax(0,1fr) 124px;gap:8px}.photo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:center;gap:7px}.photo-tile,.photo-grid[data-count="2"] .photo-tile{width:100%;max-width:none}.photo-tile:nth-child(3){grid-column:1/-1;width:calc((100% - 7px)/2);justify-self:center}.photo-tile figcaption{font-size:6px}.photo-label #counter{font-size:7px}.photo-label{gap:4px;letter-spacing:0}.invitation h2{font-size:21px}.invitation>p:not(.eyebrow){font-size:9px}.qr-link{width:120px}.scan{font-size:8px}.scan span{font-size:7px}.site-link{font-size:7px}.book{font-size:9px;padding:8px 6px}.story-copy{padding:9px}h1{font-size:22px}#slide-subtitle{font-size:10px}.translation{font-size:8px}.slide-controls button{padding:5px;min-width:29px;min-height:32px;font-size:10px}.display-settings button{display:none}footer{gap:6px;font-size:7px}.display-settings select{font-size:8px}.display-settings label{font-size:7px}.eyebrow{font-size:6px;letter-spacing:.6px}}@media(max-height:420px){.invitation>p:not(.eyebrow){display:none}.invitation h2{font-size:19px}.eyebrow{font-size:7px}.qr-link{width:110px}.scan{font-size:8px}.scan span{display:none}.photo-tile{max-width:calc(100dvh - 280px)}.photo-grid[data-count="2"] .photo-tile{max-width:min(29vw,calc(100dvh - 280px))}.translation{display:none}h1{font-size:22px}.brand-line{display:none}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}

@media(max-width:520px) and (max-height:570px){.photo-grid{display:flex;align-items:center;justify-content:center}.photo-tile,.photo-grid[data-count="2"] .photo-tile,.photo-tile:nth-child(3){width:calc((100% - 14px)/3);max-width:calc(100dvh - 280px);grid-column:auto}.photo-grid[data-count="2"] .photo-tile{width:calc((100% - 7px)/2)}}

.story{position:relative}.photo-button{display:block;width:100%;border:0;padding:0;border-radius:0;background:transparent;box-shadow:none;line-height:0}.photo-button:hover{background:transparent}.photo-preview{position:absolute;inset:0;z-index:10;background:#fffdf7;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:8px;padding:42px 14px 12px;border-radius:12px}.photo-preview img{display:block;max-width:100%;max-height:100%;width:100%;height:100%;min-height:0;object-fit:contain;background:transparent}.photo-preview #preview-close{position:absolute;top:8px;inset-inline-end:10px;font-size:11px;padding:6px 12px}.photo-preview p{font-size:10px;color:#6d796c;text-align:center;margin:0}.photo-preview[hidden]{display:none!important}@media(max-height:420px){.photo-preview{padding:35px 8px 7px;gap:4px}.photo-preview #preview-close{top:5px;font-size:10px;padding:4px 8px}.photo-preview p{font-size:8px}}

.side-action{display:block;width:100%;max-width:220px;padding:7px 10px;margin:0 0 6px;border:1px solid var(--gold);border-radius:22px;font-size:10px;font-weight:bold;background:#fffdf7}.side-action:hover{background:#eee5d6}.side-action.portal{color:var(--ink)}@media(max-height:570px){.invitation>p:not(.eyebrow){display:none}.invitation h2{font-size:22px;margin-bottom:8px}.side-action{padding:6px 8px;font-size:10px;margin-bottom:5px}.book{margin-bottom:5px}.qr-link{width:125px}}@media(max-height:420px){.invitation h2{font-size:18px;margin-bottom:5px}.eyebrow{margin-bottom:3px}.side-action,.book{padding:4px 6px;font-size:9px;margin-bottom:4px}.qr-link{width:90px}.scan{margin-top:3px;font-size:7px}}

@media(max-height:420px){.invitation .eyebrow{display:none}.invitation h2{font-size:16px;margin-bottom:4px}.side-action,.book{padding:3px 5px;font-size:8px;margin-bottom:3px}.qr-link{width:82px}.scan{font-size:7px}}

/* Two larger photographs, fitted to the actual available panel height. */
.photo-grid{display:flex;align-items:stretch;gap:12px;padding:7px 0}.photo-tile,.photo-grid[data-count="2"] .photo-tile,.photo-tile:nth-child(3){display:grid;grid-template-rows:minmax(0,1fr) 16px;flex:1 1 0;width:calc((100% - 12px)/2);max-width:none;min-height:0;height:100%;grid-column:auto}.photo-button{height:100%;min-height:0}.photo-tile img{height:100%;width:100%;aspect-ratio:auto;object-fit:contain}.photo-grid[data-count="1"] .photo-tile{max-width:85%}@media(max-height:570px){.story-copy{align-items:flex-end}h1{font-size:23px}}

.music-link{display:inline-block;font-size:11px;font-weight:bold;margin-top:5px;color:#805c2d;text-decoration:underline}

/* Travel album: soft silhouettes, a gentle moving camera and no form-like frame. */
.story{background:transparent;border:0;border-radius:0;overflow:hidden}.photo-stage{padding:0 4px}.photo-grid{gap:16px;padding:8px 0 10px;align-items:stretch}.photo-tile,.photo-grid[data-count="2"] .photo-tile{flex:1.08 1 0;height:100%;animation:album-arrive .9s ease-out both}.photo-tile:nth-child(2){flex:.92 1 0;padding-top:18px;animation-delay:.12s}.photo-button{overflow:hidden;border-radius:20px 44px 20px 20px;isolation:isolate;transform:translateZ(0)}.photo-tile:nth-child(2) .photo-button{border-radius:36px 20px 36px 20px}.photo-tile img{object-fit:cover;transform-origin:45% 50%;animation:album-camera 20s ease-in-out infinite alternate;will-change:transform}.photo-tile:nth-child(2) img{transform-origin:60% 45%;animation-direction:alternate-reverse}.photo-tile figcaption{padding-inline:8px;padding-top:4px;font-size:7px}.story-copy{background:transparent;border-top:0;padding:10px 5px 9px}.progress-track{margin:0 5px;background:#e8dfcf;border-radius:3px}.slideshow-paused .photo-tile img{animation-play-state:paused}.photo-button:focus-visible{outline-offset:-4px;outline-color:#fff}.photo-button:hover{background:transparent}@keyframes album-camera{from{transform:scale(1.015) translateX(-.3%)}to{transform:scale(1.075) translateX(.4%)}}@keyframes album-arrive{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}@media(max-width:520px){.photo-grid{gap:9px}.photo-tile:nth-child(2){padding-top:10px}.photo-button{border-radius:14px 27px 14px 14px}.photo-tile:nth-child(2) .photo-button{border-radius:24px 14px 24px 14px}}@media(prefers-reduced-motion:reduce){.photo-tile,.photo-tile img{animation:none!important;transform:none!important;will-change:auto}}
