#read-progress{position:fixed;top:0;left:0;width:100%;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;z-index:15;pointer-events:none}header{transition:background .4s,padding .4s,backdrop-filter .4s}header.floating{position:fixed;background:#061c20ed;backdrop-filter:blur(18px);padding-top:13px;padding-bottom:13px}header.floating .brand img{width:40px;height:40px}.sensory-controls{display:flex;gap:8px}.sensory-controls button{font-size:9px;letter-spacing:1px;text-transform:uppercase;border:1px solid var(--line);padding:10px}#sound[aria-pressed=true]{border-color:var(--gold);color:var(--gold)}.chapter-tag{font-size:8px;letter-spacing:2px;color:var(--gold)}.hero .sunbeams{position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;opacity:.16;background:repeating-conic-gradient(from 190deg at 86% 27%,transparent 0deg 9deg,#f6da9e66 10deg 11deg,transparent 12deg 24deg);animation:sunlight 18s ease-in-out infinite alternate}.hero .salt-mist{position:absolute;inset:45% -10% 0;pointer-events:none;opacity:.18;background:radial-gradient(ellipse at 75% 65%,#a9ded155,transparent 60%);filter:blur(25px);animation:mist 16s ease-in-out infinite alternate}@keyframes sunlight{to{opacity:.07;transform:rotate(3deg) scale(1.1)}}@keyframes mist{to{transform:translate(-3%,-7%);opacity:.28}}.tide-transition{position:relative;overflow:hidden;height:170px;display:flex;align-items:center;justify-content:center;background:linear-gradient(#071d22,#0c3438,#061c20);isolation:isolate}.tide-transition:before,.tide-transition:after{content:'';position:absolute;inset:-60% -20%;z-index:-1;border-radius:45%;border:1px solid #89c9ba55;background:radial-gradient(ellipse,#8ecfbd16,transparent 62%);animation:tide 12s ease-in-out infinite alternate;transform:rotate(-8deg)}.tide-transition:after{inset:-90% -15%;animation-delay:-7s;transform:rotate(7deg)}@keyframes tide{to{transform:translateY(22%) rotate(6deg)}}.tide-transition p{font-family:Georgia,serif;font-size:clamp(23px,3vw,42px);font-style:italic;color:var(--sea);letter-spacing:-1px}.piece .photo{transition:transform .45s;transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transform-origin:center;box-shadow:0 25px 45px #0002}.photo:after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--shine,50%) 10%,#fff2,transparent 65%);opacity:0;transition:opacity .5s}.piece:hover .photo:after{opacity:1}.piece:focus-visible .expand{background:var(--gold)}.paused .piece .photo{transform:none!important}.viewer-controls{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-top:15px}.viewer-controls button{width:48px;height:44px;border:1px solid var(--line);font-size:22px}.viewer-controls button:hover{background:var(--gold);color:var(--ink)}#photo-position{font-size:10px;letter-spacing:2px;color:var(--gold)}#lightbox #large-photo{object-fit:contain;max-height:58svh;transition:opacity .2s}.reference-field{margin:18px 0 25px}.reference-field input{display:block;width:100%;font:11px Arial;color:var(--paper);padding:12px 0}.reference-field input::file-selector-button{background:#102a2e;color:var(--paper);border:1px solid var(--line);padding:12px;font:11px Arial;margin-right:12px;cursor:pointer}#reference-preview img{display:block;max-width:100%;max-height:170px;width:auto;height:auto;object-fit:contain;margin:10px 0}#reference-preview small{font-size:10px;color:var(--sea)}.reference-field>small{color:#eee8d788;font-size:10px}.closing:before{content:'✧';position:absolute;left:50%;top:40px;transform:translateX(-50%);font-size:390px;line-height:1;color:#7bbbb20a;pointer-events:none}.closing>*{position:relative}@media(max-width:700px){.sensory-controls{position:absolute;right:6%;top:90px}.sensory-controls #motion{position:static}.sensory-controls button{font-size:8px;padding:7px}.floating .sensory-controls{top:75px;right:4%;background:#061c20e8;padding:6px}.chapter-tag{display:none}.tide-transition{height:125px}.piece .photo{transform:none}.hero .sunbeams{display:none}.hero .salt-mist{opacity:.1}.viewer-controls button{width:44px}.viewer-controls{padding-top:10px}#lightbox{padding:35px 20px 25px}}@media(prefers-reduced-motion:reduce){.piece .photo{transform:none!important}.sunbeams,.salt-mist{animation:none!important}header{transition:none}}
