/* Lake v4: shared J/U/S mascots, pointer ripples and notes crossing the waterline. */
.story-sticky[data-lake-ready]{--lake-depth:13,36,30;--lake-light:176,226,201;--lake-shine:242,231,187;--lake-accent:155,217,177;--lake-toy-accent:#f88c49;--lake-paper:#cddcac;--lake-pulse-strength:0;isolation:isolate;background:rgb(var(--lake-depth))}
:root[data-theme=dark] .story-sticky[data-lake-ready]{--lake-depth:4,23,41;--lake-light:115,207,230;--lake-shine:198,239,255;--lake-accent:101,188,233;--lake-toy-accent:#69cfff;--lake-paper:#b0d6e8}
.lake-scene{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;contain:strict;user-select:none;background:radial-gradient(ellipse at 17% 12%,rgba(var(--lake-light),.18),transparent 49%),radial-gradient(ellipse at 81% 83%,rgba(var(--lake-accent),.13),transparent 48%),linear-gradient(157deg,rgba(var(--lake-depth),.08),rgba(var(--lake-depth),.67))}
.lake-scene::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 41% 47%,rgba(var(--lake-depth),.63),rgba(var(--lake-depth),.3) 38%,transparent 72%),linear-gradient(0deg,rgba(var(--lake-depth),.44),transparent 27%,transparent 90%,rgba(var(--lake-depth),.13))}
.lake-scene canvas{position:relative;z-index:1;display:block;width:100%;height:100%;pointer-events:none}
.lake-floater{position:absolute;left:0;top:0;z-index:2;width:var(--toy-size);height:var(--toy-size);transform:translate3d(var(--toy-x),var(--toy-y),0) rotate(var(--toy-turn));transform-origin:50% 76%;will-change:transform;pointer-events:none;opacity:var(--toy-reveal,1)}
.lake-toy-body{position:absolute;inset:0;z-index:2;filter:drop-shadow(3px 8px 8px #0005);mask-image:linear-gradient(#000 0 86%,#000b 94%,#0000 100%);-webkit-mask-image:linear-gradient(#000 0 86%,#000b 94%,#0000 100%)}
.lake-toy-body>img,.lake-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;transform:translate3d(0,var(--body-rise,0px),0)}
.lake-toy-body>img{opacity:0}
.lake-floater[data-loaded=true] .lake-toy-body>img{opacity:1}
.lake-floater[data-loaded=true] .lake-fallback{visibility:hidden}
.lake-fallback{padding:8%;filter:drop-shadow(1px 3px 2px #0002)}
.lake-waterline{position:absolute;z-index:3;left:12%;right:12%;top:87%;height:8%;border-bottom:1px solid rgba(var(--lake-light),.35);border-radius:50%;background:radial-gradient(ellipse,rgba(var(--lake-light),.10),transparent 65%);box-shadow:0 5px 9px rgba(var(--lake-depth),.28);transform:rotate(calc(var(--toy-turn)*-1));opacity:.74}
.lake-reflection{position:absolute;z-index:1;left:5%;right:5%;top:80%;height:55%;overflow:hidden;opacity:var(--reflection-alpha,.16);filter:blur(1.1px);mask-image:linear-gradient(#0009,#0000 86%);-webkit-mask-image:linear-gradient(#0009,#0000 86%);pointer-events:none}
.lake-reflection img{display:block;width:100%;height:170%;object-fit:contain;transform:scaleY(-1) skewX(-8deg);transform-origin:50% 28%}
.story-sticky[data-lake-ready]>.field-lines{display:none}
.story-sticky[data-lake-ready]>.story-float{z-index:3}
.story-sticky[data-lake-ready]>.story-meta,.story-sticky[data-lake-ready]>h2{z-index:4}
.story-sticky[data-lake-ready]>.story-bottom{z-index:5}
.story-sticky[data-lake-ready] .lake-lit-line{position:relative;isolation:isolate;width:fit-content;max-width:100%;border-radius:8px;outline:0;--line-light-x:50%;--line-light-y:50%}
.lake-lit-line::before{content:"";position:absolute;z-index:-1;inset:-14px -18px;pointer-events:none;opacity:0;background:radial-gradient(ellipse 170px 65px at var(--line-light-x) var(--line-light-y),rgba(var(--lake-shine),.16),rgba(var(--lake-light),.055) 55%,transparent 100%);transition:opacity .22s ease}
.story-sticky[data-lake-ready] .lake-lit-line[data-lake-lit=true]{text-shadow:0 0 32px rgba(var(--lake-light),.24)}
.lake-lit-line[data-lake-lit=true]::before{opacity:1}
.story-sticky[data-lake-ready] .lake-lit-line:focus-visible{outline:1px solid rgba(var(--lake-shine),.55);outline-offset:9px}
.story-sticky[data-lake-ready] .lake-impulse{position:absolute;z-index:6;left:5.5%;bottom:20%;width:82px;height:82px;padding:0;display:grid;place-items:center;border:1px solid rgba(var(--lake-light),.24);border-radius:50%;background:radial-gradient(circle at 33% 25%,rgba(var(--lake-light),.13),rgba(var(--lake-depth),.25));box-shadow:0 7px 28px #0002,inset 0 1px rgba(var(--lake-light),.12);font-family:inherit;font-size:64px;font-weight:400;line-height:1;color:rgb(var(--lake-shine));cursor:pointer;appearance:none;will-change:auto;touch-action:manipulation;transition:color .2s ease,box-shadow .2s ease,border-color .2s ease}
.lake-impulse::after{content:"";position:absolute;inset:-15px;z-index:-1;pointer-events:none;border-radius:50%;background:radial-gradient(circle,rgba(var(--lake-light),.28),transparent 70%);opacity:var(--lake-pulse-strength)}
.story-sticky[data-lake-ready] .lake-impulse:focus-visible{border-color:rgba(var(--lake-shine),.75);box-shadow:0 0 0 5px rgba(var(--lake-light),.07),0 8px 28px #0002,inset 0 1px rgba(var(--lake-shine),.24)}
.story-sticky[data-lake-ready] .lake-impulse:focus-visible{outline:2px solid rgb(var(--lake-shine));outline-offset:5px}
.story-sticky[data-lake-ready] .lake-impulse:active{scale:.96}
.story-sticky[data-lake-ready].lake-charged .lake-impulse{color:#f7ffef;border-color:rgba(var(--lake-light),.5)}
:root[data-theme=dark] .story-sticky[data-lake-ready].lake-charged .lake-impulse{color:#ebfaff}
.lake-scene[data-state=still] .lake-floater,.lake-scene[data-state=sleeping] .lake-floater{will-change:auto}
.story-sticky[data-lake-state=still] .lake-lit-line::before,.story-sticky[data-lake-state=still] .lake-impulse{transition:none}
@media(hover:hover) and (pointer:fine){.story-sticky[data-lake-ready] .lake-impulse:hover{border-color:rgba(var(--lake-shine),.75);box-shadow:0 0 0 5px rgba(var(--lake-light),.07),0 8px 28px #0002,inset 0 1px rgba(var(--lake-shine),.24)}}
@media(min-width:2200px){.story-sticky[data-lake-ready] .lake-impulse{width:96px;height:96px;font-size:75px;left:6%}.lake-lit-line::before{background:radial-gradient(ellipse 220px 80px at var(--line-light-x) var(--line-light-y),rgba(var(--lake-shine),.17),rgba(var(--lake-light),.05) 60%,transparent 100%)}}
@media(max-width:600px){.lake-scene{background:radial-gradient(ellipse at 15% 17%,rgba(var(--lake-light),.16),transparent 65%),radial-gradient(ellipse at 89% 70%,rgba(var(--lake-accent),.12),transparent 70%),rgb(var(--lake-depth))}.lake-scene::before{background:radial-gradient(ellipse at 47% 48%,rgba(var(--lake-depth),.38),transparent 70%)}.lake-toy-body{filter:drop-shadow(2px 5px 4px #0005)}.lake-reflection{opacity:var(--reflection-alpha,.12)}.story-sticky[data-lake-ready] .lake-impulse{left:6%;bottom:26%;width:56px;height:56px;font-size:44px}.lake-lit-line::before{inset:-9px;background:radial-gradient(ellipse 100px 40px at var(--line-light-x) var(--line-light-y),rgba(var(--lake-shine),.16),transparent 100%)}.story-sticky[data-lake-ready] .lake-lit-line:focus-visible{outline-offset:5px}}
@media(prefers-reduced-motion:reduce){.lake-floater{will-change:auto}.lake-lit-line::before,.story-sticky[data-lake-ready] .lake-impulse{transition:none}.story-sticky[data-lake-ready] .lake-impulse:active{scale:1}}
/* Small vector J-hook cursor remains crisp and does not obscure the water. */
@media(hover:hover) and (pointer:fine){
  .story-sticky[data-lake-ready]{--lake-cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='40' viewBox='0 0 32 40'%3E%3Cpath d='M23 12v14c0 13-18 13-18 0' fill='none' stroke='%23142526' stroke-width='7' stroke-linecap='round'/%3E%3Cpath d='M23 12v14c0 13-18 13-18 0' fill='none' stroke='%23e9f1ed' stroke-width='4' stroke-linecap='round'/%3E%3Ccircle cx='23' cy='7' r='4.5' fill='none' stroke='%23142526' stroke-width='5'/%3E%3Ccircle cx='23' cy='7' r='4.5' fill='none' stroke='%23e9f1ed' stroke-width='2.5'/%3E%3Cpath d='M2 27 7 18 10 28Z' fill='%23ff741f' stroke='%23142526' stroke-width='1'/%3E%3C/svg%3E") 23 7,pointer}
  :root[data-theme=dark] .story-sticky[data-lake-ready]{--lake-cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='40' viewBox='0 0 32 40'%3E%3Cpath d='M23 12v14c0 13-18 13-18 0' fill='none' stroke='%23071729' stroke-width='7' stroke-linecap='round'/%3E%3Cpath d='M23 12v14c0 13-18 13-18 0' fill='none' stroke='%23e8f6ff' stroke-width='4' stroke-linecap='round'/%3E%3Ccircle cx='23' cy='7' r='4.5' fill='none' stroke='%23071729' stroke-width='5'/%3E%3Ccircle cx='23' cy='7' r='4.5' fill='none' stroke='%23e8f6ff' stroke-width='2.5'/%3E%3Cpath d='M2 27 7 18 10 28Z' fill='%2369cfff' stroke='%23071729' stroke-width='1'/%3E%3C/svg%3E") 23 7,pointer}
  .story-sticky[data-lake-ready],.story-sticky[data-lake-ready] *,.story-sticky[data-lake-ready] .lake-impulse{cursor:var(--lake-cursor)}
}
