@font-face{font-family:Manrope;src:url('./assets/manrope-regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Manrope;src:url('./assets/manrope-semibold.ttf') format('truetype');font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:Manrope;src:url('./assets/manrope-extrabold.ttf') format('truetype');font-style:normal;font-weight:800;font-display:swap}

:root{color-scheme:dark;--background:#070c0d;--text:#eff8f8;--muted:#a8bec1;--accent:#63f5e6;--accent-rgb:99 245 230;--line:rgb(255 255 255 / 13%);font-family:Manrope,Arial,sans-serif;font-synthesis:none;color:var(--text);background:var(--background)}
*{box-sizing:border-box}
body{margin:0;min-width:280px;min-height:100dvh;isolation:isolate}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;border:0}
button,input,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
button,a[href],label[for]{cursor:pointer}
button:disabled,input:disabled{cursor:not-allowed;opacity:.45}
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

/* A short, non-spatial reveal replaces the loading screen entirely. */
.site-content{min-height:100dvh;animation:page-reveal .7s cubic-bezier(.22,1,.36,1) .5s both}
@keyframes page-reveal{from{opacity:0;visibility:hidden}to{opacity:1;visibility:visible}}

/* The waveform replaces the portrait with a borderless glass surface. */
.atmosphere{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:var(--background)}
#smoke-canvas{display:block;width:100%;height:100%;opacity:0}
.has-smoke-canvas #smoke-canvas{opacity:1}
.smoke-fallback{position:absolute;inset:-25%;background:radial-gradient(ellipse at 25% 40%,#124d4999,transparent 50%),radial-gradient(ellipse at 70% 65%,#0c3b3daa,transparent 48%),radial-gradient(ellipse at 55% 20%,#10494c88,transparent 55%);filter:blur(45px) brightness(calc(1 + var(--audio-energy,0)*.2));animation:smoke-fallback-flow 9s ease-in-out infinite alternate}
.has-smoke-canvas .smoke-fallback{display:none}
.is-motion-paused .smoke-fallback{animation-play-state:paused}
@keyframes smoke-fallback-flow{from{transform:translate3d(-8%,6%,0) rotate(-12deg) scale(1)}to{transform:translate3d(9%,-9%,0) rotate(14deg) scale(1.3)}}
main{min-height:100dvh;display:grid;place-items:center;grid-template-columns:minmax(0,1fr);padding:155px 40px 65px}
.profile-panel{width:min(100%,1240px);min-width:0;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1.12fr) minmax(0,.9fr);column-gap:38px;align-items:center}
.identity{grid-column:1;grid-row:1;align-self:end;min-width:0}
h1{font-size:clamp(78px,8.1vw,124px);font-weight:800;line-height:1.04;letter-spacing:-.075em;margin:0;white-space:nowrap}
.name-period{color:var(--accent)}
.bio{margin:25px 0 0;display:flex;flex-direction:column;gap:7px;font-size:clamp(15px,1.35vw,20px);line-height:1.45;color:#c2d8da;letter-spacing:-.35px}
.bio span{display:block}
.wave-stage{grid-column:2;grid-row:1 / 3;justify-self:center;align-self:center;position:relative;width:min(100%,350px);aspect-ratio:1.15;border:0;border-radius:32px;overflow:hidden;background:rgb(170 255 246 / 3%);backdrop-filter:blur(12px) saturate(150%);-webkit-backdrop-filter:blur(12px) saturate(150%);box-shadow:inset 0 1px 2px rgb(255 255 255 / 13%),inset 0 -1px 12px rgb(var(--accent-rgb) / 4%),0 20px 50px rgb(0 0 0 / 12%)}
#waveform{display:block;width:100%;height:100%}
.wave-stage:not(.has-waveform)::after{content:"";position:absolute;inset:50% 11% auto;height:1px;background:var(--accent);opacity:.6}
.discord-row{grid-column:1;grid-row:2;align-self:start;display:flex;justify-content:space-between;align-items:center;gap:16px;width:min(100%,300px);min-height:60px;margin-top:32px;padding:0 16px;border:1px solid rgb(var(--accent-rgb) / 22%);border-radius:12px;background:rgb(var(--accent-rgb) / 6%);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);transition:background-color .18s,border-color .18s}
.discord-brand{display:flex;align-items:center;gap:9px;color:#deeeee;font-size:12px;font-weight:600}
.discord-brand img{filter:invert(1);opacity:.85}
.discord-action{display:flex;align-items:center;gap:10px;color:var(--accent);font-size:14px;font-weight:600}
.discord-action .icon{color:#a6c5c7;width:15px;height:15px}
.discord-row:hover{background:rgb(var(--accent-rgb) / 12%);border-color:rgb(var(--accent-rgb) / 45%)}
.discord-row:active{background:rgb(var(--accent-rgb) / 18%)}
.discord-row[data-copied=true]{border-color:var(--accent)}
.copy-status:not(.sr-only){grid-column:1;font-size:12px;line-height:1.5;color:var(--muted);margin:8px 0 0}
.accounts{grid-column:3;grid-row:1 / 3;min-width:0;padding-left:20px}
h2{margin:0 0 12px;font-size:12px;font-weight:600;line-height:20px;color:var(--muted)}
.account-list{list-style:none;margin:0;padding:0}
.account-list li+li{border-top:1px solid var(--line)}
.account-link{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:89px;padding:17px 0;background:transparent;transform:none}
.account-text{display:flex;flex-direction:column;gap:5px;min-width:0}
.account-name{font-size:21px;line-height:1.35;font-weight:600;letter-spacing:-.6px;text-decoration-thickness:1px;text-underline-offset:5px;transition:color .18s}
.account-domain{font-size:11px;line-height:18px;color:var(--muted);overflow-wrap:anywhere}
.account-link:hover,.account-link:active,.account-link:focus-visible{background:transparent;transform:none}
.account-link:hover .account-name,.account-link:focus-visible .account-name{color:var(--accent);text-decoration-line:underline}
.account-link:active .account-name{color:#b3fff7}
.external-icon{flex:0 0 19px;width:19px;height:19px;color:var(--muted)}
.account-link:hover .external-icon,.account-link:focus-visible .external-icon{color:var(--accent)}

.sound-header{position:absolute;right:32px;top:24px;z-index:2;width:360px}
/* Transparent web glass approximation; moving smoke remains visible through it. */
.audio-dock{--muted:#c9e3e2;padding:10px 14px 0;border:1px solid rgb(255 255 255 / 30%);border-radius:18px;background:rgb(9 28 30 / 3%);backdrop-filter:blur(9px) saturate(145%);-webkit-backdrop-filter:blur(9px) saturate(145%);box-shadow:inset 0 1px 1px rgb(255 255 255 / 38%),inset 1px 0 1px rgb(255 255 255 / 10%),inset 0 -1px 1px rgb(var(--accent-rgb) / 20%),0 8px 28px rgb(0 0 0 / 16%)}
.player-main{display:flex;align-items:center;gap:12px;min-height:48px}
.play-button{flex:0 0 48px;width:48px;height:48px;display:grid;place-items:center;border:1px solid rgb(255 255 255 / 30%);border-radius:14px;background:rgb(255 255 255 / 3%);color:#d0fffa;box-shadow:inset 0 1px 1px rgb(255 255 255 / 38%),inset 0 -1px 1px rgb(var(--accent-rgb) / 20%);transition:color .2s,border-color .2s}
.audio-dock[data-playing=true] .play-button{border-color:rgb(var(--accent-rgb) / 45%);color:var(--accent)}
.play-button .icon{width:22px;height:22px}
.play-button[aria-busy=true]{outline:1px solid var(--text);outline-offset:3px}
.track{min-width:0;display:flex;flex:1;flex-direction:column;gap:3px}
.track-name{font-size:16px;line-height:23px;font-weight:600;letter-spacing:-.35px;white-space:nowrap}
.track-artist{font-size:12px;line-height:17px;color:#c9e3e2;white-space:nowrap}
.volume-control{position:relative;width:88px;height:44px;flex-shrink:0}
.volume-control label{position:absolute;top:-2px;left:0;right:0;display:flex;justify-content:space-between;align-items:center;font-size:10px;line-height:16px;color:var(--muted);pointer-events:none}
.volume-control output{font-variant-numeric:tabular-nums}
.volume-input{display:flex;align-items:center;gap:0;height:44px;padding-top:13px}
.mute-button{background:transparent;display:grid;place-items:center;width:44px;min-height:44px;flex:0 0 44px;margin-left:-8px;border-radius:7px;color:#cfe9e9}
.mute-button .icon{width:16px;height:16px}
.audio-dock button:hover{transform:none}
.audio-dock button:active{opacity:.7;transform:none}
input[type=range]{--progress:5%;appearance:none;-webkit-appearance:none;width:52px;height:44px;margin:0;background:transparent;cursor:pointer}
input[type=range]::-webkit-slider-runnable-track{height:3px;border-radius:3px;background:linear-gradient(to right,var(--accent) 0%,var(--accent) var(--progress),#344b4e var(--progress),#344b4e 100%)}
input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:10px;height:10px;border-radius:50%;background:var(--text);margin-top:-3.5px}
input[type=range]::-moz-range-track{height:3px;border-radius:3px;background:#344b4e}
input[type=range]::-moz-range-progress{height:3px;background:var(--accent)}
input[type=range]::-moz-range-thumb{width:10px;height:10px;background:var(--text);border:0;border-radius:50%}
.track-timeline{display:grid;grid-template-columns:32px minmax(0,1fr) 32px;align-items:center;gap:10px;min-height:44px}
.track-time{font-size:11px;font-weight:400;font-variant-numeric:tabular-nums;color:#c9e3e2;white-space:nowrap}
.track-duration{text-align:right}
#seek{--progress:0%;width:100%;min-width:44px;height:44px}
#seek::-webkit-slider-runnable-track{height:2px}
#seek::-webkit-slider-thumb{width:8px;height:8px;margin-top:-3px;background:var(--accent)}
#seek::-moz-range-track,#seek::-moz-range-progress{height:2px}
#seek::-moz-range-thumb{width:8px;height:8px;background:var(--accent)}
.music-message{margin:8px 4px 0;color:var(--muted);font-size:11px;text-align:right;min-height:16px}
.music-message:empty{display:none}
.motion-footer{position:absolute;right:32px;bottom:16px}
.motion-toggle{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 8px;background:transparent;color:var(--muted);font-size:11px}
.motion-toggle .icon{width:12px;height:12px}
.motion-toggle:hover{color:var(--text);text-decoration:underline;text-underline-offset:4px}
.motion-toggle:active{opacity:.7}
.icon{display:inline-block;background:currentColor;mask-size:contain;mask-repeat:no-repeat;mask-position:center;-webkit-mask-size:contain;-webkit-mask-repeat:no-repeat;-webkit-mask-position:center}
.play-icon{mask-image:url('./assets/play-fill.svg')}.pause-icon{mask-image:url('./assets/pause-fill.svg')}.volume-icon{mask-image:url('./assets/volume-up-fill.svg')}.muted-icon{mask-image:url('./assets/volume-mute-fill.svg')}.copy-icon{mask-image:url('./assets/copy.svg')}.check-icon{mask-image:url('./assets/check2.svg')}.external-icon{mask-image:url('./assets/arrow-up-right.svg')}
.noscript-message{position:fixed;bottom:10px;left:10px;right:10px;background:#12262a;padding:12px;font-size:12px;text-align:center}

@media(min-width:1001px) and (max-width:1200px){main{padding-inline:32px}.profile-panel{column-gap:24px}.accounts{padding-left:10px}.account-name{font-size:20px}.account-domain{font-size:10px}.discord-row{padding-inline:12px}}
@media(min-width:601px) and (max-width:1000px) and (min-height:561px){
  .profile-panel{max-width:780px;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);column-gap:55px}
  .wave-stage{grid-column:1;grid-row:1;justify-self:start;width:160px;aspect-ratio:2;margin-bottom:23px;border-radius:18px}
  .identity{grid-column:1;grid-row:2;align-self:start}
  h1{font-size:80px}
  .bio{font-size:16px;margin-top:18px;gap:5px}
  .discord-row{grid-column:1;grid-row:3;margin-top:26px}
  .accounts{grid-column:2;grid-row:1 / 4;padding-left:0}
}
@media(max-width:600px){
  .sound-header{top:max(18px,env(safe-area-inset-top));right:18px;width:calc(100% - 36px);max-width:360px}
  main{padding:150px 28px 55px}
  .profile-panel{width:min(100%,420px);grid-template-columns:80px minmax(0,1fr);column-gap:20px;align-items:start}
  .wave-stage{grid-column:1;grid-row:1;width:80px;aspect-ratio:1;border-radius:18px;align-self:start;margin-top:6px}
  .identity{grid-column:2;grid-row:1;align-self:start}
  h1{font-size:clamp(45px,12vw,65px);letter-spacing:-.065em}
  .bio{font-size:12px;line-height:1.45;gap:3px;margin-top:12px;letter-spacing:-.2px}
  .discord-row{grid-column:1 / 3;grid-row:2;max-width:none;width:100%;min-height:54px;margin-top:25px}
  .accounts{grid-column:1 / 3;grid-row:3;padding:0;margin-top:26px}
  h2{font-size:11px;margin-bottom:6px}
  .account-link{min-height:68px;padding:10px 0}
  .account-name{font-size:18px}
  .account-domain{font-size:11px}
  .copy-status:not(.sr-only){grid-column:1 / 3;grid-row:4}
  .motion-footer{right:20px;bottom:10px}
}
@media(max-width:360px){main{padding-inline:20px}.sound-header{right:14px;width:calc(100% - 28px)}.profile-panel{grid-template-columns:65px minmax(0,1fr);gap:0 16px}.wave-stage{width:65px}.bio{font-size:11px}h1{font-size:46px}.play-button{width:44px;height:44px;flex-basis:44px;border-radius:12px}.player-main{min-height:44px}.track-name{font-size:15px}}
@media(max-width:600px) and (max-height:710px){main{padding-top:139px;padding-bottom:44px}.sound-header{top:14px}.bio{margin-top:8px;gap:1px}.discord-row{min-height:50px;margin-top:16px}.accounts{margin-top:12px}h2{margin-bottom:4px}.account-link{min-height:52px;padding-block:5px}.account-text{gap:2px}.account-name{font-size:17px}.account-domain{line-height:17px}.motion-footer{bottom:0;right:12px}}
@media(min-width:601px) and (max-height:560px){
  .sound-header{top:10px;right:24px}
  main{padding:130px 28px 44px}
  .profile-panel{grid-template-columns:minmax(0,1fr) 120px minmax(0,1fr);column-gap:28px;max-width:900px}
  h1{font-size:64px}.bio{font-size:12px;gap:2px;margin-top:10px}
  .wave-stage{width:120px;border-radius:20px}
  .discord-row{min-height:48px;margin-top:16px}
  .accounts{padding-left:0}.account-link{min-height:59px;padding-block:6px}.account-name{font-size:17px}.account-domain{font-size:10px;line-height:16px}
  h2{margin-bottom:4px;font-size:11px}.motion-footer{bottom:0;right:20px}
}
@media(prefers-reduced-motion:reduce){.site-content{animation-duration:.2s}.discord-row,.account-name,.play-button{transition:none}.smoke-fallback{animation-duration:16s}}
@media(prefers-reduced-transparency:reduce){.audio-dock,.discord-row,.wave-stage{backdrop-filter:none;-webkit-backdrop-filter:none;background:#12282b}}
@supports not (backdrop-filter:blur(1px)){.audio-dock,.discord-row,.wave-stage{background:#12282b}}