@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400;600&family=Cormorant+Garamond:wght@400;600;700&family=Nunito:wght@400;500;600;700&display=swap');
:root{--paper:#fffaf9;--pink:#e5a1b5;--deep:#9e5870;--ink:#614c51;--muted:#a68d94;--line:#eedde1;--serif:'Cormorant Garamond',Georgia,serif;--sans:'Nunito',Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:14px;background-image:radial-gradient(#dfbec533 .8px,transparent .8px);background-size:9px 9px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #b05c7c;outline-offset:5px}button{touch-action:manipulation}[hidden]{display:none!important}.svg-library{position:absolute;width:0;height:0;overflow:hidden}.topbar{height:88px;max-width:1320px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:0 56px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);font:italic 20px Georgia,serif}.brand svg{width:32px;height:28px;color:var(--pink)}.top-note{font:italic 14px Georgia,serif;color:var(--muted)}.edition{font-size:9px;letter-spacing:2px;color:var(--deep);border:1px solid var(--line);padding:9px 12px;border-radius:3px}.screen{position:relative;max-width:1120px;margin:auto;text-align:center;padding:40px 24px 30px;animation:appear .55s ease both}.welcome{min-height:calc(100svh - 146px)}.hero-stage{height:285px;width:340px;position:relative;margin:0 auto}.hero-sticker{position:absolute;width:193px;height:160px;top:0;left:73px;transform:rotate(-8deg);filter:drop-shadow(0 5px 0 #efd6de66)}.hero-sticker svg{width:100%;height:100%}.hero-envelope{position:absolute;left:42px;top:120px;width:252px;height:146px;border:1px solid #dfb3c0;border-radius:7px;transform:rotate(-7deg);background:#f8dfe7;box-shadow:0 12px 28px #b5708820;overflow:hidden}.envelope-flap{position:absolute;inset:0;background:#fff1f4;clip-path:polygon(0 0,100% 0,50% 65%);filter:drop-shadow(0 2px 0 #dab5c2)}.envelope-face{position:absolute;inset:0;background:#f6dbe3;clip-path:polygon(0 0,50% 70%,100% 0,100% 100%,0 100%)}.seal{position:absolute;left:108px;top:66px;width:39px;height:39px;border-radius:50%;background:#d792aa;color:#fff;display:grid;place-items:center;font:28px Georgia;box-shadow:0 2px 3px #ad6c8520}.postage{position:absolute;right:12px;top:91px;transform:rotate(13deg);border:1px dashed #cba6b4;outline:5px solid #fff6f7;background:#fff6f7;font-size:7px;letter-spacing:1px;padding:8px;color:var(--deep);line-height:1.7}.postage span{font-size:25px}.handwritten{font-family:'Nanum Pen Script',cursive;font-size:24px}.envelope-note{position:absolute;right:-35px;bottom:2px;transform:rotate(-8deg);color:#b47c8e;font-size:23px}.sparkle{position:absolute;color:#c99567;font-size:34px}.sparkle-one{left:14px;top:54px}.sparkle-two{right:19px;top:29px;font-size:23px}.tiny-heart{position:absolute;color:#c887a0;font:26px Georgia}.heart-one{left:-4px;top:153px;transform:rotate(-18deg)}.heart-two{right:-8px;top:190px;transform:rotate(15deg)}.hero-copy{padding-top:24px}.eyebrow{font-size:9px;letter-spacing:2.8px;color:var(--deep);font-weight:600;margin:0 0 18px}h1{font:700 49px/1.4 var(--serif);letter-spacing:-2px;margin:0 0 20px}h1 span{color:#c77e97}h1 i{font:normal 28px Georgia;color:#cc8da3;display:inline-block;transform:rotate(15deg);vertical-align:top;margin:0 0 0 9px}.intro{line-height:1.95;color:#8c757d;font-size:14px;margin:0 0 27px}.primary{background:#c9829b;border:1px solid #c9829b;color:white;border-radius:7px;padding:17px 29px;min-width:211px;box-shadow:0 4px 0 #b5748b1c;transition:transform .2s,background .2s}.primary span{margin-left:28px}.primary:hover{background:#b66b86;transform:translateY(-2px)}.small-hint{font-size:10px;color:#aa939b;margin:17px 0}.side-note{position:absolute;font:italic 15px/1.8 Georgia;color:#b69aa3}.left-note{left:30px;top:232px;transform:rotate(-9deg);text-align:left}.right-note{right:18px;top:299px;transform:rotate(8deg)}.right-note .handwritten{font-size:25px}.bottom-decoration{margin:29px auto 0;display:flex;align-items:center;justify-content:center;gap:19px;color:#b0929e;font:italic 13px Georgia}.bottom-decoration>span:first-child{font-size:26px;color:#dca1b5}.dotted-line{width:49px;border-top:1px dashed #ddc3cd}.bottom-decoration svg{width:38px;height:45px;transform:rotate(12deg)}footer{display:flex;justify-content:center;gap:15px;padding:20px 12px 24px;color:#b199a1;font:italic 11px Georgia;text-align:center}footer span{color:#cf98ad}h2{font:700 32px/1.5 var(--serif);letter-spacing:-1px;margin:0 0 13px}h2 span{color:#cf8ca3}.section-description{line-height:1.9;color:#9c838c;font-size:13px}.game-screen,.gift-screen{padding-top:66px;min-height:calc(100svh - 146px)}.game-status{max-width:430px;margin:33px auto 14px;display:flex;justify-content:space-between;font-size:11px;color:var(--deep)}.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:430px;margin:auto}.memory-card{aspect-ratio:1/1.15;position:relative;border:0;padding:0;background:transparent;perspective:600px;transition:transform .2s}.memory-card:hover{transform:translateY(-3px)}.card-inner{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .4s}.memory-card.flipped .card-inner,.memory-card.matched .card-inner{transform:rotateY(180deg)}.card-front,.card-back{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;backface-visibility:hidden;border-radius:10px}.card-back{background:#f9e6ec;border:1px solid #e7baca;box-shadow:inset 0 0 0 6px #fff5f7,0 4px 10px #c789a010}.card-back:after{content:'';position:absolute;inset:12px;border:1px dashed #e7bfcd;border-radius:4px}.card-back svg{width:54px;height:39px;color:#e0a1b6}.card-back small{font:italic 10px Georgia;color:#b58496;margin-top:8px}.card-front{transform:rotateY(180deg);background:#fff;border:1px solid #e6c4cf;gap:10px;font-size:34px}.card-front small{font-size:10px;color:#9e7786}.matched .card-front{background:#fdf0f4;border-color:#d49ab0}.matched .card-front:after{content:'♡';position:absolute;right:9px;top:5px;color:#c77e97;font-size:17px}.game-message{font-size:12px;color:var(--deep);margin:23px 0;min-height:20px}.text-button{display:block;margin:18px auto;border:0;border-bottom:1px solid #e8ccd6;background:none;padding:5px 0;color:#a67e8f;font-size:11px}.text-button:hover{color:#80425a}.back{border:0;margin-top:26px;color:#ac969e}.letter-envelope{display:block;width:min(100%,390px);height:230px;margin:36px auto;background:linear-gradient(148deg,#fff6f8 49.5%,#e9becd 50%,#f6dce5 50.5%);border:1px solid #e1b8c7;border-radius:8px;box-shadow:0 12px 35px #b6789020;position:relative;color:var(--deep);transition:transform .3s}.letter-envelope:hover{transform:rotate(-2deg)}.envelope-address{position:absolute;left:25px;top:25px;font:16px var(--serif)}.letter-envelope svg{position:absolute;left:calc(50% - 45px);top:75px;width:90px;height:60px;color:#dda0b5}.open-label{position:absolute;bottom:25px;left:0;right:0;font-size:11px}.letter-paper{position:relative;max-width:620px;background:#fffefa;padding:55px 48px;margin:35px auto 60px;text-align:left;border:1px solid #eee1dc;box-shadow:0 9px 36px #a6797e0c;transform:rotate(-.5deg)}.letter-paper:before{content:'';position:absolute;top:-12px;left:calc(50% - 42px);height:27px;width:84px;background:#e6bccb70;transform:rotate(-6deg)}.letter-date{font-size:9px;letter-spacing:2px;color:#be94a3}.letter-paper h3{font:700 24px var(--serif);margin:25px 0}.letter-paper p{font:15px/2.25 var(--serif);white-space:pre-line}.letter-paper .draft-label{font:10px var(--sans);color:#ad99a0;border-bottom:1px dashed #e9d8de;padding-bottom:15px}.letter-sign{text-align:right;margin-top:32px!important}.memories-heading h3{font:700 25px var(--serif)}.memories-heading>p:last-child{font-size:11px;color:#a38b94}.photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;max-width:790px;margin:35px auto 0}.polaroid{background:#fff;padding:11px 11px 19px;margin:0;box-shadow:0 4px 20px #9d727c12;border:1px solid #eddfdf;transform:rotate(-4deg)}.polaroid:nth-child(2){transform:rotate(3deg);margin-top:14px}.polaroid:nth-child(3){transform:rotate(-2deg)}.photo-placeholder{aspect-ratio:1/1.1;background:#f3e4e2;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:17px}.photo-placeholder span{font-size:48px}.photo-placeholder small{font:italic 11px Georgia;color:#a27f89}.picnic{background:linear-gradient(160deg,#f7e6ea,#e9eadb)}.cafe{background:linear-gradient(160deg,#eee2d7,#f5e8e4)}.night{background:linear-gradient(160deg,#dbdce8,#efe4ed)}figcaption{font-family:'Nanum Pen Script',cursive;font-size:22px;margin-top:14px;color:#936b7b}.ending{margin:70px auto 25px}.ending svg{width:90px;height:75px}.ending p{font:20px var(--serif);margin:15px 0}.ending>span{font-size:9px;letter-spacing:2px;color:#b18999}.confetti{position:fixed;pointer-events:none;top:-30px;z-index:10;font-size:19px;animation:fall 2.8s ease-in forwards}@keyframes appear{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes fall{to{transform:translateY(105vh) rotate(280deg);opacity:0}}
@media(min-width:1450px){.welcome{padding-top:65px}.hero-stage{height:295px}.hero-copy{padding-top:34px}.bottom-decoration{margin-top:42px}}
@media(max-width:700px){.topbar{height:70px;padding:0 23px}.brand{font-size:17px;gap:8px}.brand svg{width:26px}.top-note{display:none}.edition{font-size:7px;letter-spacing:1px;padding:7px}.welcome{min-height:calc(100svh - 124px);padding-top:35px}.side-note{display:none}.hero-stage{transform:scale(.88);transform-origin:top center;margin-bottom:-25px}.hero-copy{padding-top:18px}h1{font-size:36px;letter-spacing:-1.5px;margin-bottom:18px}h1 i{font-size:22px;margin-left:4px}.eyebrow{font-size:8px;letter-spacing:2px}.intro{font-size:12px}.primary{padding:16px 24px;font-size:13px}.small-hint{font-size:9px}.bottom-decoration{margin-top:26px;gap:13px}footer{font-size:10px}.game-screen,.gift-screen{padding-top:43px}h2{font-size:26px}.section-description{font-size:12px}.card-grid{gap:11px}.card-front{font-size:30px}.card-front small{font-size:9px}.letter-paper{padding:35px 25px}.letter-paper h3{font-size:21px}.letter-paper p{font-size:14px}.photo-grid{gap:30px;grid-template-columns:1fr;max-width:270px}.polaroid:nth-child(2){margin-top:0}.memories-heading h3{font-size:22px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.confetti{display:none}}

/* Ukrainian typography and the photo-puzzle / gift-choice flow. */
.welcome{overflow-x:clip}h1 span{white-space:nowrap}
.handwritten,figcaption{font-family:'Caveat',cursive}h1,h2{letter-spacing:0}h1{font-size:58px}.hero-copy .intro{max-width:550px;margin-left:auto;margin-right:auto}.primary{font-weight:700;font-size:15px}.small-hint{font-size:12px}.section-description{font-size:15px;max-width:600px;margin:0 auto;line-height:1.7}.game-status{max-width:520px;font-size:13px}.puzzle-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:min(100%,520px);aspect-ratio:4/3;gap:3px;padding:4px;margin:0 auto;background:#fff;border:1px solid #e7c2d0;border-radius:10px;overflow:hidden;box-shadow:0 10px 35px #b6789017}.puzzle-piece{display:block;border:0;padding:0;min-width:0;min-height:0;background-size:400% 300%;background-repeat:no-repeat;background-color:#f8dfe7;border-radius:3px;position:relative;outline-offset:-5px!important}.puzzle-piece.selected{box-shadow:inset 0 0 0 4px #b35d7f;z-index:1}.puzzle-piece.selected:after{content:'♡';position:absolute;right:6px;top:4px;color:#854460;background:#fff9f9ed;border-radius:50%;width:24px;height:24px;font-size:20px}.puzzle-piece:hover{filter:brightness(1.06)}.puzzle-grid.solved{gap:0;padding:0;border-color:#c28a9f}.puzzle-tools{display:flex;align-items:center;justify-content:center;gap:28px;margin:22px auto 0;flex-wrap:wrap}.puzzle-tools .text-button{margin:0}.text-button{font-size:13px}.photo-picker{color:#a67e8f;cursor:pointer;font-size:13px;position:relative;border-bottom:1px solid #e8ccd6;padding:5px 0}.photo-picker:focus-within{outline:3px solid #b05c7c;outline-offset:4px}.photo-picker input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.demo-note{font-size:12px;color:#a38b94;max-width:520px;margin:14px auto 0;line-height:1.6}.photo-error{font-size:13px;line-height:1.6;color:#a34769;max-width:520px;margin:12px auto}.reference-photo{width:190px;aspect-ratio:4/3;object-fit:cover;border:6px solid white;box-shadow:0 4px 12px #b6789022;margin:18px auto 0;display:block;transform:rotate(-2deg)}.game-message{font-size:14px;line-height:1.6;max-width:520px;margin:19px auto}.game-screen .eyebrow,.gift-screen .eyebrow{font-size:10px}.game-screen{padding-top:40px}.gift-choices{padding-bottom:20px}.gift-choices .letter-envelope{cursor:default}.gift-choices .letter-envelope:hover{transform:none}.envelope-address{font-size:22px}.choice-buttons{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}.choice-buttons .primary{min-width:195px}.choice-buttons .primary span{margin-left:16px}.hot-button{min-width:155px;border:1px solid #ddbac8;background:#fff3f7;color:#a15b77;border-radius:7px;padding:17px 23px;font-size:12px;font-weight:700;letter-spacing:1px;transition:background .2s,transform .2s}.hot-button span{margin-left:12px}.hot-button:hover{background:#f8e0ea;transform:translateY(-2px)}.letter-paper h3{font-size:30px}.letter-paper p{font-size:20px;line-height:1.8}.letter-paper .draft-label{font-size:12px;line-height:1.6}.memories-heading h3{font-size:31px}.memories-heading>p:last-child{font-size:14px}.photo-grid{row-gap:36px}.polaroid:nth-child(3n+2){transform:rotate(3deg);margin-top:14px}.polaroid:nth-child(3n){transform:rotate(-2deg)}.gallery-photo{display:block;width:100%;aspect-ratio:1/1.1;object-fit:cover}.ending p{font-size:25px}dialog{border:1px solid #ead0da;border-radius:20px;padding:40px 30px 32px;background:#fffafa;color:var(--ink);width:min(90vw,400px);text-align:center;box-shadow:0 20px 90px #71415230}dialog::backdrop{background:#61434d55;backdrop-filter:blur(5px)}dialog h2{font-size:38px;margin:12px 0}dialog .eyebrow{font-size:9px;margin:14px 0}dialog #tease-copy{font-size:19px;margin:0 0 27px}dialog .primary{min-width:0}dialog .primary span{margin:0}.dialog-x{position:absolute;right:13px;top:9px;font-size:26px;line-height:1;padding:5px 9px;color:#a67e8f;background:none;border:0;border-radius:5px}.tease-heart{font:50px Georgia;color:#d18ca5;display:block}
@media(max-width:700px){h1{font-size:43px}h2{font-size:30px}.intro{font-size:14px}.hero-copy .intro{font-size:14px}.small-hint{font-size:11px}.section-description{font-size:14px}.hero-stage{left:50%;margin-left:-170px}.game-screen{padding-top:32px}.game-status{font-size:12px}.puzzle-tools{gap:18px}.puzzle-tools .text-button,.photo-picker{font-size:12px}.demo-note{font-size:11px}.game-message{font-size:13px}.choice-buttons{gap:11px}.choice-buttons .primary,.hot-button{min-width:0;padding:16px 20px}.choice-buttons .primary{font-size:14px}.hot-button{font-size:11px}.letter-paper p{font-size:19px}.letter-paper h3{font-size:28px}.memories-heading h3{font-size:28px}.memories-heading>p:last-child{font-size:13px}.photo-grid{max-width:285px}.polaroid:nth-child(3n+2){margin-top:0}.envelope-address{font-size:19px}.ending p{font-size:25px}}

/* A cheeky, brighter invitation. */
.hot-button{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:12px;background:linear-gradient(120deg,#dc537f,#c63d70);border:1px solid #b93765;color:#fff;font-size:13px;font-weight:800;letter-spacing:1.2px;box-shadow:0 5px 16px #ce497c40;animation:hot-glow 2.8s ease-in-out infinite}
.hot-button .hot-heart{margin:0;font-size:23px;line-height:1;filter:drop-shadow(0 1px 2px #80244835)}
.hot-button:before{content:'';position:absolute;inset:-50% auto -50% -80%;width:40%;background:linear-gradient(90deg,transparent,#ffffff55,transparent);transform:skewX(-20deg);pointer-events:none;animation:hot-shimmer 4.5s ease-in-out infinite}
.hot-button:hover{background:linear-gradient(120deg,#e35d8a,#b93165);transform:translateY(-3px);box-shadow:0 8px 23px #ce497c55}
.hot-button:active{transform:translateY(0)}
@keyframes hot-glow{0%,100%{box-shadow:0 5px 16px #ce497c40}50%{box-shadow:0 5px 24px #ce497c65,0 0 0 4px #e89bb51a}}
@keyframes hot-shimmer{0%,65%{left:-80%}100%{left:150%}}
@media(max-width:700px){.hot-button{font-size:12px}.hot-button .hot-heart{font-size:22px}}

/* Official Hello Kitty peeking out of the envelope; preserve image proportions. */
.hero-sticker.official-kitty{width:210px;height:160px;left:65px;top:-1px;overflow:hidden;transform:rotate(-5deg);filter:drop-shadow(0 4px 0 #efd6de55)}
.hero-sticker.official-kitty img{position:absolute;display:block;height:220px;width:auto;max-width:none;left:50%;top:0;transform:translateX(-55%)}

/* Official Sanrio character decorations and temporary gallery artwork. */
.bottom-decoration .melody-decoration{width:40px;height:45px;object-fit:contain;transform:rotate(10deg)}
.ending .ending-kitty{width:140px;height:90px;object-fit:contain}
.gallery-photo.official-gallery-art{object-fit:contain;background:#fff9fb}

/* Birthday quiz before the surprise. */
.gate-screen{min-height:100svh;display:grid;place-items:center;padding:35px 22px}
.gate-card{width:min(100%,450px);padding:43px 32px 30px;background:#fffdfc;border:1px solid #ecd3de;border-radius:20px;box-shadow:0 12px 50px #a56a8210;position:relative}
.gate-bow{width:65px;height:45px;color:#e5a1b5;margin-bottom:22px}
.gate-card h1{font-size:36px;line-height:1.2;margin:0 0 22px;letter-spacing:0}
.gate-card h1 span{font-size:27px}
.gate-description{font-size:16px;line-height:1.7;color:#8e6f7c;margin:0 0 28px}
#birthday-form label{display:block;font-size:14px;font-weight:700;color:#8b6174}
.gate-hint{font-size:12px;line-height:1.6;color:#9d818d;margin:9px 0 16px}
#birthday-code{display:block;width:190px;margin:0 auto;padding:13px 10px 13px 21px;border:1px solid #ddb3c5;border-radius:9px;background:#fff7fa;color:#95516e;font:24px var(--sans);letter-spacing:11px;text-align:center;outline-offset:4px}
#birthday-code::placeholder{color:#d6b5c3;opacity:1}
#birthday-code:focus{outline:2px solid #bc7896}
#birthday-code[aria-invalid=true]{border-color:#aa456d}
.gate-error{min-height:39px;margin:10px 0 5px;font-size:12px;line-height:1.6;color:#a4466c}
.gate-footnote{font:italic 16px var(--serif);color:#a98a98;margin:23px 0 0}
@media(max-width:420px){.gate-card{padding:33px 23px 27px}.gate-card h1{font-size:32px}.gate-description{font-size:15px}.gate-card .eyebrow{letter-spacing:2px}}

/* Let the completed memory linger before the next surprise. */
.puzzle-memory{width:min(100%,520px);margin:20px auto;padding:22px 20px 19px;border:1px solid #e6c6d3;border-radius:12px;background:#fff4f8;animation:appear .5s ease both}
.puzzle-memory>span{font-size:25px;color:#c27b98}
.puzzle-memory p{font:600 24px/1.35 var(--serif);color:#87566d;margin:9px 0 12px}
.puzzle-memory small{font-size:12px;color:#a07b8d;line-height:1.6}
@media(max-width:700px){.puzzle-memory p{font-size:22px}}
.puzzle-grid.solved .puzzle-piece{border-radius:0}

/* Preserve each personal photo in full, including tall calls and wide game scenes. */
.photo-grid{align-items:start}
.gallery-photo{aspect-ratio:auto;height:auto;object-fit:contain;background:#fff9fb}
.memory-date{display:block;font:11px/1.6 var(--sans);letter-spacing:1px;color:#a27d8e;margin:0 0 7px}
figcaption>span{display:block;line-height:1.3}

/* Quiet music, deliberate touch targets, and a full-photo memory viewer. */
.music-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:8px 13px;border:1px solid #e6cbd5;border-radius:24px;background:#fff8fb;color:#8c526b;font-size:12px;white-space:nowrap}
.music-button>span:first-child{font-size:20px}.music-button[aria-pressed=true]{background:#f6dfe9;border-color:#ca8da6}
.primary:disabled{opacity:.55;cursor:wait}.puzzle-tools .text-button{min-height:44px;padding:10px 16px;border:1px solid #e8ccd6;border-radius:24px;background:#fff7fa}
.puzzle-piece{transition:box-shadow .18s,filter .18s;user-select:none;-webkit-user-select:none}
.puzzle-piece.selected{box-shadow:inset 0 0 0 4px #b5537c,inset 0 0 0 7px #fff8fc;filter:brightness(1.13);z-index:2}
.puzzle-piece.selected:after{right:7px;top:7px;box-shadow:0 1px 5px #60304944}
.puzzle-piece.just-swapped{animation:piece-swap .28s ease}.puzzle-piece.just-matched{animation:piece-match .65s ease}
@keyframes piece-swap{from{opacity:.55;transform:scale(.94)}to{opacity:1;transform:scale(1)}}
@keyframes piece-match{0%,100%{filter:brightness(1)}40%{filter:brightness(1.3);box-shadow:inset 0 0 0 4px #f8d9a7}}
.photo-open{display:block;width:100%;padding:0;border:0;background:#fff9fb;cursor:zoom-in;border-radius:2px;overflow:hidden}
.photo-open .gallery-photo{transition:transform .3s}.photo-open:hover .gallery-photo{transform:scale(1.025)}
.gallery-hint{font-size:12px!important;color:#a67b8e!important;margin-top:15px}
.viewer-open{overflow:hidden}
.photo-dialog{width:min(94vw,1000px);max-width:none;max-height:94svh;padding:0;border-radius:18px;overflow:auto;background:#fffafa}
.photo-dialog::backdrop{background:#35242bd9;backdrop-filter:blur(7px)}
.viewer-top{display:flex;justify-content:space-between;align-items:center;padding:8px 15px;color:#986c7e;font-size:12px;letter-spacing:2px}
.viewer-top button,.viewer-controls button{min-width:44px;min-height:44px;border:1px solid #e7cdd7;border-radius:50%;background:#fff4f8;color:#87516a;font-size:23px}
.viewer-top button{border:0;background:transparent;font-size:28px}
.viewer-stage{height:min(61svh,650px);display:flex;align-items:center;justify-content:center;background:#f4e9ed;touch-action:pan-y pinch-zoom;overflow:hidden}
.viewer-stage img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;user-select:none;-webkit-user-drag:none}
.viewer-caption{padding:17px 22px 0}.viewer-caption time{font:11px var(--sans);letter-spacing:1px;color:#a27d8e}.viewer-caption p{font:24px/1.3 'Caveat',cursive;margin:8px 0 0;color:#87516a}
.viewer-controls{display:flex;align-items:center;justify-content:center;gap:25px;padding:15px 16px 20px}.viewer-controls span{font-size:12px;color:#a67b8e}
.text-button.back,#shuffle-button,#skip-button,#replay-button{min-height:44px}
@media(max-width:700px){
  .topbar{padding:0 16px;gap:10px}.brand{font-size:15px;gap:5px}.brand svg{width:23px}.music-button{font-size:10px;padding:7px 10px;gap:5px}
  .game-screen{padding-left:12px;padding-right:12px}.game-status{margin-top:24px}.puzzle-grid{gap:2px;padding:3px;border-radius:8px}
  .puzzle-piece.selected{box-shadow:inset 0 0 0 3px #b5537c,inset 0 0 0 5px #fff8fc}.puzzle-piece.selected:after{width:20px;height:20px;font-size:17px;right:4px;top:4px}
  .photo-dialog{width:100%;max-height:100svh;height:100svh;margin:0;border:0;border-radius:0;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}
  .viewer-stage{height:60svh}.viewer-caption p{font-size:23px}.viewer-controls{gap:20px}.photo-grid{max-width:310px}
  .ending p{max-width:290px;margin:16px auto;line-height:1.45}
}
