:root{color-scheme:dark;--bg:#0c0c0e;--text:#f2f0ec;--muted:#909094;--line:#3c3c40}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Georgia,'Times New Roman',serif;min-height:100svh}a{color:inherit;text-decoration:none}button{color:inherit;background:transparent;cursor:pointer;font:inherit}button,a{-webkit-tap-highlight-color:transparent}button:hover,a:hover{color:#fff;opacity:.75}button:focus-visible,a:focus-visible{outline:1px solid white;outline-offset:6px}#snow{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1}.topbar{height:52px;border-bottom:1px solid #858589;display:flex;justify-content:center;align-items:center}.topbar nav{display:flex;align-items:center;gap:28px}.topbar button{border:1px solid #d2d0cc;padding:3px 13px;font-family:monospace;font-size:11px;font-weight:700}.little-star{font-size:23px;line-height:1}.landing{min-height:calc(100svh - 144px);display:flex;align-items:center;justify-content:space-between;padding:0 8.5%;gap:60px}.side-links{display:flex;flex-direction:column;gap:12px;margin-top:45px}.side-links button{border:0;display:flex;align-items:center;gap:15px;padding:0;text-align:left;font-size:25px;font-weight:bold;font-style:italic;white-space:nowrap}.side-links span{font-style:normal;font-weight:400;font-size:30px;width:30px;text-align:center}.identity{text-align:right;margin-top:25px}.identity h1{font-size:clamp(110px,13vw,220px);font-style:italic;font-weight:400;line-height:.9;letter-spacing:-8px;margin:0}.identity p{font-family:monospace;font-size:11px;letter-spacing:.3px;margin:28px 3px 0;color:var(--muted)}footer{height:92px;display:flex;align-items:flex-end;padding:0 30px 26px;gap:25px;font-family:monospace;font-size:10px;color:var(--muted)}.footer-note{display:flex;flex-direction:column;gap:7px;margin-right:auto}.location{color:#626268}.secret{font-size:11px}#snow-toggle{height:31px;border:1px solid #68686e;padding:0 10px;font-family:monospace;font-size:12px}#snow-toggle span{font-size:10px;margin-left:5px}dialog{color:var(--text);background:#111114;border:1px solid #626268;width:min(560px,calc(100% - 36px));padding:55px;box-shadow:0 20px 100px #0009}dialog::backdrop{background:#08080bc9;backdrop-filter:blur(5px)}dialog .close{position:absolute;right:18px;top:12px;border:0;font:26px monospace}dialog h2{font-size:44px;font-weight:400;font-style:italic;line-height:1.1;margin:25px 0}dialog p:not(.eyebrow){font:14px/1.9 monospace;color:#a8a8ad}.eyebrow{font:10px monospace;letter-spacing:1px;color:var(--muted)}article{display:flex;gap:24px;border-top:1px solid var(--line);margin-top:35px;padding-top:25px}.project-number{font:11px monospace;color:var(--muted);padding-top:7px}h3{font-size:25px;font-weight:400;margin:0}.tag{font:10px monospace;border:1px solid var(--line);padding:4px 8px;display:inline-block;color:var(--muted)}.entrance{max-width:850px;margin:auto;padding:70px 30px}.wordmark{font-size:26px;font-style:italic}.wordmark span{display:none}.entrance .eyebrow{margin-top:100px}.entrance h1{font-weight:400;font-size:clamp(50px,7vw,90px);line-height:1.1}.entrance p:not(.eyebrow){color:var(--muted)}.back{display:inline-block;margin-top:30px;font:12px monospace}@media(max-width:650px){.topbar{height:49px}.landing{min-height:calc(100svh - 149px);padding:75px 9% 55px;flex-direction:column-reverse;justify-content:center;align-items:flex-start;gap:65px}.identity{text-align:left;margin-top:0}.identity h1{font-size:clamp(100px,25vw,160px);letter-spacing:-5px}.identity p{font-size:9px;margin-top:22px}.side-links{margin:0;gap:14px}.side-links button{font-size:22px}.side-links span{font-size:25px}footer{height:100px;padding:0 22px 25px;gap:18px}.footer-note{font-size:8px}dialog{padding:45px 28px}dialog h2{font-size:36px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
:root{--journal:'Segoe Print','Bradley Hand','Comic Sans MS',cursive;--neon:#a4a9ff}
body{background:#0b0b10}.landing{position:relative;justify-content:center;isolation:isolate}.identity{text-align:center;margin-top:0;position:relative;z-index:1}.identity h1{font-family:var(--journal);font-style:normal;font-weight:400;font-size:clamp(110px,13vw,210px);letter-spacing:-9px;color:#eeeaff;text-shadow:0 0 8px #b6a6ff70,0 0 35px #7d73ff50,0 0 90px #5865f235;transition:text-shadow .4s}.identity p{color:#a19aaf;font-size:10px;letter-spacing:1px}
.socials{position:absolute;left:8%;top:50%;transform:translateY(-50%);margin:0;gap:16px;z-index:2}.socials a,.socials button{--link-color:#b9dfff;display:flex;align-items:center;gap:12px;border:0;padding:0;font-family:var(--journal);font-style:normal;font-size:22px;font-weight:400;color:var(--link-color);text-shadow:0 0 15px color-mix(in srgb,var(--link-color) 35%,transparent);transition:filter .2s,transform .2s}.socials .discord{--link-color:#a1a7ff}.socials .twitch{--link-color:#c99aff}.socials .riot{--link-color:#ff909b}.socials a:hover,.socials button:hover{opacity:1;filter:brightness(1.25);transform:translateX(3px)}.socials .social-icon{font-family:monospace;font-size:17px;font-weight:400;font-style:normal;width:27px;height:27px;border:1px solid currentColor;border-radius:7px;display:grid;place-items:center;box-shadow:0 0 12px color-mix(in srgb,var(--link-color) 15%,transparent)}.socials .outbound{font:11px monospace;width:auto;margin-left:4px;opacity:.5}.socials .riot-tag{font:9px monospace;width:auto;opacity:.65;margin-left:3px}.copy-status{position:absolute;top:calc(100% + 14px);font:10px monospace;color:#ffb3bc}
.topbar .little-star{border:0;padding:0;width:32px;height:32px;font-size:28px;line-height:1;color:#dedaff;text-shadow:0 0 7px #aaa2ff,0 0 20px #5865f2;transition:transform .35s,text-shadow .35s,color .35s}.topbar .little-star:hover,.topbar .little-star:focus-visible{opacity:1;transform:rotate(35deg) scale(1.18);color:white;text-shadow:0 0 8px white,0 0 25px #9583ff,0 0 45px #5865f2}.topbar .little-star[aria-pressed=true]{color:#fff;text-shadow:0 0 8px white,0 0 24px #a88dff,0 0 55px #5865f2;transform:rotate(90deg)}.star-bright .identity h1{text-shadow:0 0 12px #c4baffb0,0 0 45px #9485ff80,0 0 100px #5865f255}dialog h2{font-family:var(--journal);font-style:normal;color:#eeeaff;text-shadow:0 0 20px #5865f240}
@media(min-width:651px) and (max-width:1100px){.socials{left:6%}.socials a,.socials button{font-size:18px}.identity{transform:none}}
@media(max-width:650px){.landing{flex-direction:column;justify-content:center;align-items:center;gap:55px;padding:65px 9% 45px}.identity{transform:none;text-align:center}.identity h1{font-size:clamp(100px,28vw,160px);letter-spacing:-6px}.identity p{font-size:8px;letter-spacing:.3px}.socials{position:relative;left:auto;top:auto;transform:none;align-self:center;order:2;gap:13px}.socials a,.socials button{font-size:21px}}
@media(prefers-reduced-motion:reduce){.socials a,.socials button,.identity h1,.topbar .little-star{transition:none}.socials a:hover,.socials button:hover,.topbar .little-star:hover{transform:none}}


.socials .copy-status{width:auto;white-space:nowrap;font:10px monospace;text-align:left}
/* Restore the original italic serif typography. */
.identity h1{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:400;letter-spacing:-8px}
.socials a,.socials button{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:bold}
dialog h2{font-family:Georgia,'Times New Roman',serif;font-style:italic}
.socials .steam{--link-color:#63b4df}.socials .discord{--link-color:#747cff}.socials .twitch{--link-color:#aa88d7}.socials .riot{--link-color:#ef6666}
.socials .social-icon{width:30px;height:30px;border:0;border-radius:0;box-shadow:none;object-fit:contain;filter:drop-shadow(0 0 5px color-mix(in srgb,var(--link-color) 25%,transparent))}
.secret{font-size:14px;display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 13px;border:1px solid #777780;color:#c3bdc9;transition:color .2s,border-color .2s,box-shadow .2s;opacity:1}
.secret:hover,.secret:focus-visible{color:#ff94cb;border-color:#ff94cb;box-shadow:0 0 16px #ff65b530;opacity:1}
@media(max-width:650px){.identity h1{letter-spacing:-6px}}
@media(prefers-reduced-motion:reduce){.secret{transition:none}}
/* The supplied animation stays intact; blur and dimming are display effects. */
body{isolation:isolate}.moon-background{position:fixed;inset:-5px;z-index:-2;background:url('/backgrounds/moon.gif') center center / cover no-repeat;filter:blur(1.4px);opacity:.45;pointer-events:none}
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#09091120,#09091180),radial-gradient(ellipse at center,transparent 15%,#08080d75 100%)}
#snow{z-index:-1}.topbar,footer{position:relative}.location{color:#a2a0aa}.motion-paused .moon-background{background-image:url('/backgrounds/moon-still.png')}
@media(prefers-reduced-motion:reduce){.moon-background{background-image:url('/backgrounds/moon-still.png')}}
@font-face{font-family:'Sakura';src:url('/fonts/cherry-bomb-one.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
.identity h1{font-family:'Sakura',sans-serif;font-style:normal;letter-spacing:-3px;font-size:clamp(100px,12vw,190px)}
.socials a,.socials button{font-family:'Sakura',sans-serif;font-weight:400;font-style:normal;font-size:21px}
.secret,#snow-toggle{width:64px;height:31px;min-height:31px;padding:0 8px;font:11px monospace;box-sizing:border-box}
.topbar .little-star svg{display:block;filter:drop-shadow(0 0 5px #a79aff);transition:filter .3s}
.topbar .little-star:hover{transform:rotate(-12deg) scale(1.12)}
.topbar .little-star[aria-pressed=true]{transform:rotate(-15deg)}
.topbar .little-star[aria-pressed=true] svg{filter:drop-shadow(0 0 9px #bca9ff)}
@media(max-width:650px){.identity h1{font-size:clamp(95px,26vw,145px);letter-spacing:-2px}}
@media(prefers-reduced-motion:reduce){.topbar .little-star svg{transition:none}}
/* Strong soft focus: CSS blur uses pixels rather than percentages. */
.moon-background{inset:-24px;background-image:url('/backgrounds/pink.gif');filter:blur(12px);opacity:.65}
.motion-paused .moon-background{background-image:url('/backgrounds/pink-still.png')}
body::before{background:linear-gradient(180deg,#10081235,#10081265),radial-gradient(ellipse at center,transparent 10%,#08060e70 100%)}
.water-ripple{position:fixed;width:180px;height:180px;margin:-90px 0 0 -90px;border:1px solid #ffcfeb9c;border-radius:50%;pointer-events:none;z-index:10;box-shadow:0 0 9px #ff90ce30,inset 0 0 10px #ffd6ed18;animation:water-drop 1.2s ease-out forwards}
.water-ripple::after{content:'';position:absolute;inset:22%;border:1px solid #f7e7ff80;border-radius:50%;box-shadow:0 0 6px #ffcfeb25}
@keyframes water-drop{0%{transform:scale(.04);opacity:.9}55%{opacity:.45}100%{transform:scale(1.65);opacity:0}}
@media(prefers-reduced-motion:reduce){.moon-background{background-image:url('/backgrounds/pink-still.png')}.water-ripple{display:none}}
/* Pink lighting ties the name and crescent to the artwork. */
.identity h1{color:#ffe1ef;text-shadow:0 0 10px #ffacd070,0 0 38px #ef479d50,0 0 90px #c2186a35}
.star-bright .identity h1{text-shadow:0 0 12px #ffc4dfb0,0 0 45px #ff65b580,0 0 100px #d92a8755}
.topbar .little-star{color:#ffdaeb;text-shadow:0 0 7px #ffa2d0,0 0 20px #e94698}
.topbar .little-star svg{filter:drop-shadow(0 0 5px #ff86be)}
.topbar .little-star:hover,.topbar .little-star:focus-visible{color:#fff0f7;text-shadow:0 0 8px #ffe0ee,0 0 25px #ff83be,0 0 45px #ed479b}
.topbar .little-star[aria-pressed=true] svg{filter:drop-shadow(0 0 9px #ffa8d0)}
body.intro-playing .identity{animation:name-arrival 1.15s cubic-bezier(.22,.7,.22,1) .8s both}
body.intro-playing .socials{animation:links-arrival .75s ease-out 1.8s both}
@keyframes name-arrival{from{transform:translateX(0)}to{transform:translateX(22vw)}}
@keyframes links-arrival{from{opacity:0;visibility:hidden}to{opacity:1;visibility:visible}}
@media(max-width:650px){body.intro-playing .identity{animation-name:name-arrival-mobile}body.intro-playing .socials{animation-delay:1.3s}@keyframes name-arrival-mobile{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}}
@media(prefers-reduced-motion:reduce){body.intro-playing .identity,body.intro-playing .socials{animation:none}.identity{transform:translateX(22vw)}@media(max-width:650px){.identity{transform:none}}}
/* Letters arrive first, then a longer pause before the name moves. */
.name-letter{display:inline-block}
body.intro-playing .identity{animation-delay:2.8s;animation-duration:1.2s}
body.intro-playing .name-letter{animation:letter-arrival .65s ease-out both}
body.intro-playing .name-letter:nth-child(1){animation-delay:.3s}
body.intro-playing .name-letter:nth-child(2){animation-delay:.6s}
body.intro-playing .name-letter:nth-child(3){animation-delay:.9s}
body.intro-playing .name-letter:nth-child(4){animation-delay:1.2s}
body.intro-playing .socials{animation:none}
body.intro-playing .socials>a,body.intro-playing .socials>button{animation:social-arrival .7s ease-out both}
body.intro-playing .socials>:nth-child(1){animation-delay:4s}
body.intro-playing .socials>:nth-child(2){animation-delay:4.3s}
body.intro-playing .socials>:nth-child(3){animation-delay:4.6s}
body.intro-playing .socials>:nth-child(4){animation-delay:4.9s}
@keyframes letter-arrival{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
@keyframes social-arrival{from{opacity:0;visibility:hidden;transform:translateY(8px)}to{opacity:1;visibility:visible;transform:translateY(0)}}
@media(max-width:650px){body.intro-playing .identity{animation:none}}
@media(prefers-reduced-motion:reduce){body.intro-playing .name-letter,body.intro-playing .socials>a,body.intro-playing .socials>button{animation:none}}
/* Frosted glass controls and panels. */
.topbar{border-bottom:1px solid #ffd6eb16;background:#2c14241a;backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%)}
.topbar button:not(.little-star){border:1px solid #ffe4f03d;border-radius:18px;padding:7px 17px;background:linear-gradient(150deg,#ffeaf51c,#ffc1df08);box-shadow:inset 0 1px 0 #ffffff30,0 3px 14px #0002;color:#ffeaf5;transition:background .2s,box-shadow .2s;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.topbar button:not(.little-star):hover{opacity:1;background:linear-gradient(150deg,#ffeaf533,#ffc1df16);box-shadow:inset 0 1px 0 #ffffff40,0 0 18px #ff94cb13}
dialog{border:1px solid #ffe1ef35;border-radius:26px;background:linear-gradient(135deg,#4c34415c,#211620a6);backdrop-filter:blur(28px) saturate(140%);-webkit-backdrop-filter:blur(28px) saturate(140%);box-shadow:inset 0 1px 0 #ffffff25,0 24px 90px #0005;color:#fff0f7}
dialog::backdrop{background:#0a050c65;backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
dialog .close{right:16px;top:16px;width:30px;height:30px;display:grid;place-items:center;border:1px solid #ffffff25;border-radius:50%;background:#ffffff0c;font-size:21px;color:#f4d9e8}
dialog h2{color:#ffe1ef;text-shadow:0 0 22px #ff7eb530}dialog p:not(.eyebrow){color:#e0ced9}.eyebrow{color:#bdaab6}
.secret,#snow-toggle{border-radius:11px;border-color:#ffe4f038;background:linear-gradient(150deg,#ffeaf515,#ffc1df06);box-shadow:inset 0 1px 0 #ffffff20;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.secret:hover,.secret:focus-visible{border-color:#ff94cb;box-shadow:inset 0 1px 0 #ffffff25,0 0 16px #ff65b530}
@media(prefers-reduced-motion:reduce){.topbar button:not(.little-star){transition:none}}
.identity h1{user-select:none;-webkit-user-select:none;cursor:default;touch-action:pan-y}
.identity h1.water-held .name-letter{animation:held-water 1.6s ease-in-out infinite !important;opacity:1}
.identity h1.water-held .name-letter:nth-child(2){animation-delay:-.2s !important}
.identity h1.water-held .name-letter:nth-child(3){animation-delay:-.4s !important}
.identity h1.water-held .name-letter:nth-child(4){animation-delay:-.6s !important}
@keyframes held-water{0%,100%{transform:translateY(0) rotate(-2deg) scaleY(1)}50%{transform:translateY(-9px) rotate(2deg) scaleY(.95)}}
.identity h1.water-settling .name-letter{animation:water-settle .45s ease-out both !important;opacity:1}
@keyframes water-settle{from{transform:translateY(-4px) rotate(1deg)}to{transform:translateY(0) rotate(0)}}
@media(prefers-reduced-motion:reduce){.identity h1.water-held .name-letter,.identity h1.water-settling .name-letter{animation:none !important}}
/* Finished letters must not replay their entrance after a hold. */
body.intro-playing .name-letter.letter-arrived{animation:none;opacity:1}
body.intro-playing .name-letter.letter-arrived{transform:none}
.water-ripple{border:0;border-radius:43% 57% 55% 45%;width:145px;height:115px;margin:-57px 0 0 -72px;background:radial-gradient(ellipse at 35% 30%,#fff5fa20,transparent 55%),linear-gradient(140deg,#ffa9d315,transparent 45%,#ffc6e818);backdrop-filter:blur(3px) contrast(1.13);-webkit-backdrop-filter:blur(3px) contrast(1.13);box-shadow:inset 5px 3px 14px #ffe2f017,inset -7px -4px 17px #260b251f;filter:blur(1px);animation:water-wash .85s ease-out forwards}
.water-ripple::after{inset:12% 18%;border:0;border-radius:60% 40% 35% 65%;background:linear-gradient(145deg,#ffe8f51f,transparent 48%);filter:blur(8px);box-shadow:none}
@keyframes water-wash{0%{transform:scale(.3) rotate(-18deg);opacity:0}18%{opacity:.85}55%{transform:translate(9px,-5px) scale(1.15,.85) rotate(6deg);opacity:.5}100%{transform:translate(22px,-12px) scale(1.45,1.15) rotate(15deg);opacity:0}}
@media(prefers-reduced-motion:reduce){.water-ripple{display:none}}
.storm-lightning{position:fixed;inset:0;background:#dcd8ff;opacity:0;pointer-events:none;z-index:-1}
.lightning-flash{animation:soft-lightning 1.1s ease-out}
@keyframes soft-lightning{0%{opacity:0}12%{opacity:.075}27%{opacity:.015}40%{opacity:.045}100%{opacity:0}}
.motion-paused .storm-lightning{display:none}
@media(prefers-reduced-motion:reduce){.storm-lightning{display:none}}
.glow-cursor{display:none;position:fixed;width:30px;height:36px;margin-left:-5px;margin-top:-2px;pointer-events:none;z-index:1000;filter:drop-shadow(0 0 3px #ffffffa0) drop-shadow(0 0 8px #ff83bd90)}
.glow-cursor svg{width:100%;height:100%}
@media(hover:hover) and (pointer:fine){.glow-cursor-active,.glow-cursor-active a,.glow-cursor-active button,.glow-cursor-active .identity h1{cursor:none}.glow-cursor-active .glow-cursor{display:block}}

.water-ripple{width:46px;height:32px;margin:-16px 0 0 -23px;animation:tiny-water-swoosh .65s ease-out forwards;filter:blur(.7px);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
@keyframes tiny-water-swoosh{0%{transform:rotate(var(--swoosh-direction,0deg)) scale(.3);opacity:0}20%{opacity:.75}55%{transform:rotate(var(--swoosh-direction,0deg)) translateX(5px) scale(1,.75);opacity:.45}100%{transform:rotate(var(--swoosh-direction,0deg)) translateX(13px) scale(1.15,.9);opacity:0}}
.water-ripple{width:24px;height:17px;margin:-8px 0 0 -12px}
@keyframes tiny-water-swoosh{0%{transform:rotate(var(--swoosh-direction,0deg)) scale(.3);opacity:0}20%{opacity:.75}55%{transform:rotate(var(--swoosh-direction,0deg)) translateX(3px) scale(1,.75);opacity:.45}100%{transform:rotate(var(--swoosh-direction,0deg)) translateX(7px) scale(1.15,.9);opacity:0}}
.glow-cursor{width:24px;height:28px;margin-left:-6px;margin-top:-4px;filter:drop-shadow(0 0 3px #ff736f50) drop-shadow(0 0 7px #ff736f30)}
.glow-cursor{filter:drop-shadow(0 0 3px #ffffff80) drop-shadow(0 0 8px #ff9bc65c)}
.identity h1{color:#ffb5d8;text-shadow:0 0 9px #ff83bb60,0 0 32px #ef3a9850,0 0 70px #b7136730;animation:logo-idle 5.5s ease-in-out infinite}
.star-bright .identity h1{color:#ffd4e8;text-shadow:0 0 12px #ffacd8a0,0 0 45px #ff55aa70,0 0 90px #d61d7c45}
@keyframes logo-idle{0%,100%{translate:0 0;filter:brightness(1)}50%{translate:0 -5px;filter:brightness(1.08)}}
@media(prefers-reduced-motion:reduce){.identity h1{animation:none}}
/* Rain spans the viewport and remains visible over the glass navigation. */
#snow{position:fixed;inset:0;width:100vw;height:100dvh;z-index:2;pointer-events:none}
/* Native cursors remain visible inside the browser's modal top layer. */
dialog,dialog *,dialog::backdrop{cursor:url("/icons/cursor.svg") 9 8,auto !important}
dialog button,dialog a{cursor:pointer !important}
body:has(dialog[open]) .glow-cursor{display:none !important}


.music-player{height:31px;display:flex;align-items:center;gap:9px;padding:0 10px 0 5px;border:1px solid #ffe4f038;border-radius:11px;background:linear-gradient(150deg,#ffeaf515,#ffc1df06);box-shadow:inset 0 1px 0 #ffffff20;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.music-player button{width:25px;height:25px;border:0;font:11px monospace;color:#ffe1ef;padding:0}.music-player button:disabled{opacity:.35;cursor:default}.music-player input{width:65px;height:15px;margin:0;accent-color:#ffacd1;cursor:pointer}
@media(max-width:650px){footer{gap:9px;flex-wrap:wrap}.music-player{gap:5px;padding-right:7px}.music-player input{width:48px}}
.entry-screen{position:fixed;inset:0;z-index:200;display:grid;place-items:center;background:#160c184d;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);transition:opacity .85s ease,backdrop-filter .85s ease}
#enter-portfolio{border:1px solid #ffd4e944;border-radius:24px;padding:15px 28px;background:linear-gradient(140deg,#ffe7f21a,#ffe7f207);box-shadow:inset 0 1px 0 #ffffff20,0 0 35px #ff86bc12;color:#ffe2ef;font:13px monospace;letter-spacing:2px;text-shadow:0 0 12px #ff87c050}
#enter-portfolio:hover{opacity:1;background:#ffbadf20;box-shadow:0 0 30px #ff86bc25}
.awaiting-entry .identity,.awaiting-entry .socials{visibility:hidden}
.portfolio-entered .entry-screen{opacity:0;backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0);pointer-events:none}
@media(prefers-reduced-motion:reduce){.entry-screen{transition:none}}
.name-letter{-webkit-text-stroke:.5px #080508;paint-order:stroke fill;transition:translate .35s cubic-bezier(.2,.75,.3,1);translate:var(--push-x,0px) var(--push-y,0px)}
.identity h1.water-held .name-letter,.identity h1.water-settling .name-letter{animation:none !important;transform:none !important;opacity:1}
@media(prefers-reduced-motion:reduce){.name-letter{transition:none;translate:none}}
.identity h1.neon-flicker .name-letter{animation:neon-flicker .75s ease-out !important}
@keyframes neon-flicker{0%,100%{color:#ffb5d8;text-shadow:0 0 9px #ff83bb60,0 0 32px #ef3a9850}14%,35%{color:#fff1f8;text-shadow:0 0 7px #fff4fa90,0 0 22px #ffb5d8a0,0 0 55px #ff4aa56a}24%{color:#f5a1c8;text-shadow:0 0 5px #ff83bb40,0 0 16px #ef3a9830}55%{color:#ffd9eb;text-shadow:0 0 10px #ffb6d890,0 0 38px #ff4aa55a}}
@media(prefers-reduced-motion:reduce){.identity h1.neon-flicker .name-letter{animation:none !important}}
.bizu-entrance{min-height:100svh;display:grid;place-items:center;padding:30px 20px}
.bizu-card{width:min(440px,100%);text-align:center;padding:42px 30px;border:1px solid #ffe1ef35;border-radius:26px;background:linear-gradient(135deg,#4c34415c,#211620a6);backdrop-filter:blur(28px) saturate(140%);-webkit-backdrop-filter:blur(28px) saturate(140%);box-shadow:inset 0 1px 0 #ffffff25,0 24px 90px #0005}
.bizu-moon{font-size:40px;color:#ffd4e9;text-shadow:0 0 15px #ff86be80}.bizu-card .eyebrow{margin:22px 0 18px}.bizu-card h1{font-family:'Sakura',sans-serif;font-size:85px;font-weight:400;margin:0;color:#ffb5d8;text-shadow:0 0 10px #ff83bb60,0 0 35px #ef3a9850}
.bizu-card>p:not(.eyebrow){font:12px/1.8 monospace;color:#ead3e1}.bizu-card .bizu-note{font-size:10px!important;color:#b9a4b1!important;margin-top:18px}
.bizu-card .back{margin-top:24px;padding:10px 17px;border:1px solid #ffe4f038;border-radius:16px;background:#ffeaf50c;color:#f2d5e5;font:11px monospace}.bizu-card .back:hover{color:#ff94cb;border-color:#ff94cb;opacity:1;box-shadow:0 0 15px #ff65b525}
.bizu-card>p.bizu-warning{color:#ff646f}
.bizu-dialog{padding:0;width:min(440px,calc(100% - 36px));overflow:visible}
.bizu-dialog .bizu-card{width:100%;border:0;background:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
button.secret{cursor:pointer}
/* Floating navigation without a full-width background layer. */
.topbar{background:transparent;border-bottom:0;backdrop-filter:none;-webkit-backdrop-filter:none}
.awaiting-entry .topbar nav{visibility:hidden}
body.intro-playing .topbar nav{animation:top-navigation-arrival 1s ease-out .35s both}
@keyframes top-navigation-arrival{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){body.intro-playing .topbar nav{animation:none}}
.bizu-login { display:grid; gap:16px; margin:24px auto; max-width:280px; }
.bizu-login label { display:grid; gap:8px; text-align:left; font-size:13px; color:#dfb6cc; }
.bizu-login input { width:100%; box-sizing:border-box; border:1px solid #e7a0c940; border-radius:12px; padding:12px; background:#180e1b80; color:#fff; font:inherit; outline:none; }
.bizu-login input:focus { border-color:#efa1ce; box-shadow:0 0 12px #ff8dcb30; }
.bizu-login button,.bizu-logout { border:1px solid #e7a0c950; border-radius:12px; padding:10px 20px; color:#ffe7f5; background:#b5689430; font:inherit; }
.bizu-login button:hover,.bizu-logout:hover { background:#dd87b650; }
.bizu-status { font-size:13px; color:#efb2cf; min-height:20px; }
.bizu-private { padding:20px 0; color:#ead1df; }
.bizu-card [hidden] { display:none; }
.bizu-hint { margin:12px auto 20px; font-size:13px; color:#e5b2ce; }
.bizu-hint summary { display:inline-block; padding:6px 12px; border:1px solid #e7a0c940; border-radius:10px; background:#b5689420; }
.bizu-hint summary:hover { color:#ffb5df; background:#dd87b630; }
.bizu-hint p { margin:12px 0 0; }
.bizu-hint a { color:#efb2d5; text-decoration:underline; text-underline-offset:3px; }
.bizu-hint a:hover { color:#ffd4ee; }
.bizu-hint a { color:#79baff; }
.bizu-hint a:hover { color:#b1d8ff; }
.bizu-start { margin:18px auto; padding:10px 26px; border:1px solid #e7a0c950; border-radius:12px; background:#b5689430; color:#ffe7f5; font:inherit; }
.bizu-start:hover { background:#dd87b650; box-shadow:0 0 16px #ef99c52a; }
.bizu-private h2 { font-size:24px; font-weight:normal; color:#efb2cf; margin:24px 0 50px; }
.bizu-question-link { color:#79baff; text-decoration:underline; text-underline-offset:3px; }
.bizu-letter { white-space:pre-wrap; overflow-wrap:anywhere; text-align:left; line-height:1.9; font-size:17px; padding:24px; border:1px solid #e7a0c925; border-radius:18px; background:#21121d40; min-height:160px; }
.bizu-letter-card .bizu-warning,.bizu-letter-card .bizu-moon,.bizu-letter-card > h1 { display:none; }
.bizu-letter-card .bizu-private h2 { margin:0 0 24px; }