@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400;1,500&display=swap');
:root{color-scheme:dark;--white:#e4eaf0;--dim:#8092a8;--serif:'Cormorant Garamond',Georgia,serif}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#02050c;color:var(--white)}body{font-family:Arial,sans-serif;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;touch-action:manipulation}button:focus-visible,[role=button]:focus-visible{outline:1px solid #94b8d2;outline-offset:8px}button:disabled{opacity:.25;cursor:wait}[hidden]{display:none!important}#water,.vignette,#experience,#photographs{position:fixed;inset:0;width:100%;height:100%}#water{pointer-events:none;background:radial-gradient(ellipse at 50% 55%,#092545,#03070f 75%)}.vignette{pointer-events:none;background:radial-gradient(ellipse at 50% 50%,transparent 24%,#00030a66 72%,#00030abf 100%);z-index:1}#experience{z-index:2;isolation:isolate}#welcome,#ending{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;transition:opacity 1.8s ease,filter 1.8s ease;z-index:5}#welcome.leaving{opacity:0;filter:blur(8px);pointer-events:none}h1,h2{font:400 clamp(74px,8.4vw,134px)/.88 var(--serif);letter-spacing:-3px;margin:0;text-shadow:0 4px 55px #5b9cc529}h1 em,h2 em{font-weight:400;color:#a7c0d4}#begin{display:grid;place-items:center;width:58px;height:58px;margin-top:48px;border:1px solid #90aec34d;border-radius:50%;transition:border-color .5s,background .5s,opacity .5s;box-shadow:0 0 25px #7299bc09}#begin:hover{border-color:#b1d0e0aa;background:#8fb3d311}.play-symbol{display:block;width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:8px solid #d2dce4;transform:translateX(1px)}#welcomeStatus{font:10px var(--serif);letter-spacing:2px;color:#8b9fb1;margin-top:22px;opacity:.85}#silentStart{font-size:10px;color:#889bae;border-bottom:1px solid #889bae44;padding:10px 0;margin-top:7px}#photographs{pointer-events:none;z-index:2}.photo{position:absolute;left:50%;top:50%;margin:0;padding:5px;border:1px solid #bdc9d589;background:linear-gradient(140deg,#dbe5ed12,#02050d96);box-shadow:0 12px 45px #0009,0 0 20px #699bc00a;will-change:transform,opacity;touch-action:none;user-select:none;cursor:pointer;pointer-events:auto;opacity:0;transform-origin:50% 50%;border-radius:2px;overflow:hidden}.photo img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none}.photo.other{padding:4px;border:1px solid #70a6b76e;border-radius:13px;box-shadow:0 12px 40px #0008}.photo.other img{border-radius:8px}.photo.held{border-color:#d0e3f3b3;box-shadow:0 15px 80px #000b,0 0 45px #639ec423}#hint{position:absolute;left:calc(50% + 32px);top:calc(50% + 102px);z-index:8;pointer-events:none;opacity:0;transition:opacity 1.4s;display:flex;align-items:end;gap:5px;color:#a9c3d6}#hint.visible{opacity:.8}#hint svg{width:80px;height:65px;overflow:visible}#hint path{stroke:#9fbdd0;fill:none;stroke-width:1;stroke-linecap:round;stroke-linejoin:round}#hint span{font:italic 17px var(--serif);white-space:nowrap;padding-bottom:0}#transport{position:fixed;left:50%;bottom:max(22px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:15;display:flex;gap:20px;align-items:center;opacity:.45;transition:opacity .8s}#transport:hover,#transport:focus-within{opacity:1}#transport button{width:28px;height:28px;display:grid;place-items:center;color:#abc3d5;font-size:19px}.pause-symbol{width:8px;height:10px;display:block;border-left:2px solid #abc3d5;border-right:2px solid #abc3d5}.resume-symbol{width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:7px solid #abc3d5}#musicPanel{position:fixed;z-index:20;bottom:70px;left:50%;transform:translateX(-50%);width:min(350px,90vw);background:#080f19ed;backdrop-filter:blur(22px);padding:30px 14px 14px;border:1px solid #51657955;border-radius:8px;box-shadow:0 10px 70px #0009}#closeMusic{position:absolute;right:8px;top:3px;font-size:21px;color:#a8b8c6}#musicPanel iframe{width:100%;height:166px;border:0;border-radius:3px}#musicPanel a{display:block;margin-top:10px;color:#9dabb8;font-size:10px;text-decoration:none}#musicEmbed{min-height:166px}#ending{z-index:7;opacity:0;pointer-events:none}#ending.visible{opacity:1;pointer-events:auto}#ending h2{font-size:clamp(80px,9vw,142px)}#ending p{font:italic 18px var(--serif);color:#90a6ba;margin-top:27px}#infinity{font:70px/.9 var(--serif);color:#83a9c6;cursor:pointer;margin-bottom:28px;transition:color 1s;text-shadow:0 0 35px #71b6db33}#infinity:hover{color:#d1e5f3}#replay{font:25px var(--serif);margin-top:18px;color:#879eb1;padding:10px;opacity:.6}#message{position:fixed;bottom:85px;left:50%;transform:translateX(-50%);z-index:25;font-size:10px;color:#b0c2d0;opacity:0;transition:opacity 1s;text-align:center;width:85%;pointer-events:none}#message.visible{opacity:1}@media(max-width:600px){h1,h2{font-size:82px;letter-spacing:-2px}#begin{width:53px;height:53px;margin-top:40px}#welcomeStatus{font-size:10px}#hint{left:calc(50% + 4px);top:calc(50% + 110px)}#hint svg{width:57px;height:52px}#hint span{font-size:15px}#ending h2{font-size:90px}.photo{padding:4px}.photo.other{padding:3px;border-radius:10px}.photo.other img{border-radius:6px}}@media(prefers-reduced-motion:reduce){#welcome,#ending,#hint{transition-duration:.4s}}
#musicPanel{transition:opacity .8s ease}#musicPanel[hidden]{display:block!important;visibility:hidden;opacity:0;pointer-events:none}

/* Abstract nocturne: blue violet / violet / pink violet, 6:3:1. */
html,body{background:#050610}#water{background:radial-gradient(ellipse at 38% 45%,#262044,#10152f 60%,#050610)}.vignette{background:radial-gradient(ellipse at 50% 50%,transparent 30%,#04040b30 76%,#02030b88 100%)}h1 em,h2 em{color:#b9afd5}#welcomeStatus{color:#a79dbd}#begin{border-color:#a59ac044}#begin:hover{background:#9e7ac015;border-color:#c6b5db99}.photo{border:1px solid #c9bfdf30;padding:4px;border-radius:18px;background:#b2a4cb06;box-shadow:0 10px 35px #03030c35;mask-image:linear-gradient(to right,transparent,#000 3%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 3%,#000 97%,transparent);mask-composite:intersect;-webkit-mask-image:linear-gradient(to right,transparent,#000 3%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 3%,#000 97%,transparent);-webkit-mask-composite:source-in}.photo img{border-radius:14px}.photo.other{padding:3px;border-color:#a194ce25;border-radius:24px;background:#9283bd08;box-shadow:0 8px 30px #03030c25}.photo.other img{border-radius:20px}.photo.held{border-color:#c6b7e050;box-shadow:0 10px 50px #130d2420}#hint{color:#b7a6d2}#hint path{stroke:#b7a6d2}#infinity{color:#ad97cf}#ending p{color:#b5a1ca}#transport button{color:#b5a4ca}.pause-symbol{border-color:#b5a4ca}.resume-symbol{border-left-color:#b5a4ca}#musicPanel{width:268px;background:#151021a8;border:1px solid #b49bcb20;border-radius:19px;padding:22px 20px 17px;box-shadow:0 15px 55px #0003;backdrop-filter:blur(28px)}#closeMusic{font-size:17px;right:12px;top:6px;color:#b9a8cb88}#musicEmbed{position:absolute;left:-10000px;top:0;width:320px;height:166px;min-height:0;opacity:0;pointer-events:none}#musicEmbed iframe{width:320px;height:166px}.track-title{font:italic 21px var(--serif);color:#ded2ec}.track-title span{font:9px Arial,sans-serif;color:#b9a6c77d;display:block;margin-top:5px;letter-spacing:1px}.track-controls{display:flex;align-items:center;gap:13px;margin:19px 0 12px}.track-controls button{font-size:14px;color:#c1afd3;padding:0;width:16px}.track-controls input{appearance:none;height:2px;background:#b79bcd40;width:100%;outline:none;accent-color:#c7a7db;cursor:pointer}.track-controls input::-webkit-slider-thumb{appearance:none;background:#c7aedc;width:6px;height:6px;border-radius:50%}.track-controls input::-moz-range-thumb{background:#c7aedc;width:6px;height:6px;border:0;border-radius:50%}.track-foot{display:flex;justify-content:space-between;align-items:center;font-size:8px;color:#b4a1c278;letter-spacing:.5px}#musicPanel .track-foot a{font-size:8px;margin:0;color:#b4a1c278}#message{color:#c1afd0}@media(max-width:600px){.photo{border-radius:14px;padding:3px}.photo img{border-radius:11px}.photo.other{border-radius:20px;padding:2px}.photo.other img{border-radius:17px}}
/* A narrow rectangular edge feather; the interior stays intact. */
.photo,.photo.other,.photo.held{border-color:transparent;background:transparent;box-shadow:none;padding:0;mask-image:linear-gradient(to right,transparent,rgba(0,0,0,.6) 2px,#000 5px,#000 calc(100% - 5px),rgba(0,0,0,.6) calc(100% - 2px),transparent),linear-gradient(to bottom,transparent,rgba(0,0,0,.6) 2px,#000 5px,#000 calc(100% - 5px),rgba(0,0,0,.6) calc(100% - 2px),transparent);-webkit-mask-image:linear-gradient(to right,transparent,rgba(0,0,0,.6) 2px,#000 5px,#000 calc(100% - 5px),rgba(0,0,0,.6) calc(100% - 2px),transparent),linear-gradient(to bottom,transparent,rgba(0,0,0,.6) 2px,#000 5px,#000 calc(100% - 5px),rgba(0,0,0,.6) calc(100% - 2px),transparent);mask-composite:intersect;-webkit-mask-composite:source-in}
#ornaments{position:fixed;inset:0;z-index:1;pointer-events:none;overflow:hidden}#ornaments span{position:absolute;left:var(--x);top:var(--y);width:var(--s,15px);height:var(--s,15px);opacity:0;color:#c7a4d5;animation:quiet-glimmer var(--speed,16s) ease-in-out infinite;animation-delay:var(--delay,0s)}#ornaments svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:.85;overflow:visible}#ornaments .blue{color:#a4a8d8}#ornaments .dust{width:2px;height:2px;border-radius:50%;background:currentColor;box-shadow:0 0 9px currentColor}@keyframes quiet-glimmer{0%,100%{opacity:.025;transform:translate(0,4px) rotate(-8deg)}45%,60%{opacity:.25;transform:translate(5px,-6px) rotate(8deg)}}@media(prefers-reduced-motion:reduce){#ornaments span{animation:none;opacity:.12}}

#ornaments span{width:calc(var(--s,15px)*1.45);height:calc(var(--s,15px)*1.45)}#ornaments .dust{width:3px;height:3px}@keyframes quiet-glimmer{0%,100%{opacity:.04;transform:translate(0,4px) rotate(-8deg)}45%,60%{opacity:.29;transform:translate(6px,-8px) rotate(8deg)}}

#ornaments .heart-wrap{position:absolute;inset:0;pointer-events:none;transition:opacity 1.5s ease}
h1,h2{background:linear-gradient(165deg,#eeeaf4 5%,#e0d6ec 42%,#c1a7d5 100%);-webkit-background-clip:text;background-clip:text;color:transparent}h1 em,h2 em{color:inherit}#infinity{color:#c1a4d6}#ending p{color:#bda8ce}

/* Touch: one tap, no native image selection or long-press callout. */
.photo,.photo img{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.photo{touch-action:manipulation}
#beginWrap{position:relative;margin-top:48px;width:58px;height:58px}#beginWrap #begin{margin-top:0}
/* A real tap on the official player's play control starts audio on mobile.
   Keep the same iframe alive after playback; moving it would reload it. */
#beginWrap.touch-launch.music-ready:not(.music-started) #musicEmbed{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;border-radius:50%;opacity:.001;pointer-events:auto;z-index:2}
#beginWrap.touch-launch.music-ready:not(.music-started) #musicEmbed iframe{position:absolute;width:320px;height:166px;left:-6px;top:-6px;transform:none;border:0}
#beginWrap.touch-launch.music-ready:not(.music-started) #begin{pointer-events:none}
@media(max-width:600px){#beginWrap{margin-top:40px;width:53px;height:53px}}