:root{--light: #d9d9d9;--dark: #191818;--ink: #191818;--paper: #f2f2f2;--accent: #d9e14d}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%}body{font-family:Space Grotesk,Helvetica Neue,Arial,sans-serif;background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased}#root{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px}.page{width:100%;display:flex;flex-direction:column;align-items:center;position:relative}#root{padding-bottom:40px}@media (min-width: 1401px){#root{padding-top:81px}}@media (min-width: 1401px){.player-bottom{position:absolute;left:0;right:0;bottom:clamp(30px,4cqw,55px);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 clamp(44px,6cqw,88px);z-index:1}.player-bottom .player-side{grid-row:1;grid-column:1;justify-self:start;position:static}.player-bottom .player-controls{grid-row:1;grid-column:2;justify-self:center}.player-bottom .player-vol{grid-row:1;grid-column:3;justify-self:end;position:static}body{position:relative;zoom:var(--fit, 1)}#root{min-height:calc(100dvh / var(--fit, 1))}body.is-scaled{overflow:hidden}}.card{position:relative;container-type:inline-size;width:min(1150px,90%);aspect-ratio:1400 / 780;border-radius:clamp(20px,3.14cqw,44px);overflow:hidden;background:var(--light);box-shadow:0 30px 80px #1918182e}.card-top{position:absolute;top:0;right:0;bottom:62%;left:0;background:var(--light)}.card-bottom{position:absolute;top:38%;right:0;bottom:0;left:0;background:var(--dark)}.koi-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.koi-zone{position:absolute;top:-1px;left:0;right:0;height:calc(38% + 1px);overflow:hidden}.koi-wrap{position:relative;width:100%;height:100%}.koi-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;cursor:crosshair}.pond-status{position:absolute;top:6px;right:10px;font-size:10px;font-family:ui-monospace,monospace;color:#ffffff8c;z-index:5;pointer-events:none}.koi-zone{position:absolute;top:0;left:0;right:0;height:38%;overflow:hidden}.water-wrap{position:relative;width:100%;height:100%}.water-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.water-status{position:absolute;top:6px;right:10px;font-size:10px;font-family:ui-monospace,monospace;color:#ffffff8c;z-index:5;pointer-events:none}.day-slider{display:flex;align-items:center;gap:8px;z-index:7;padding:6px 11px 6px 6px;border-radius:999px;background:#191818;animation:slider-blur-in .6s cubic-bezier(.22,1,.36,1) backwards}.day-slider.is-blurred{animation:none}@keyframes slider-blur-in{0%{opacity:0;filter:blur(10px)}to{opacity:1;filter:blur(0)}}.day-slider .day-label{color:#ffffffd9;flex:none}.day-slider input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:170px;height:3px;border-radius:2px;background:#ffffff4d;outline:none;cursor:pointer}.day-slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:12px;height:12px;border-radius:50%;background:#fff;border:none;box-shadow:0 1px 4px #0006}.day-slider input[type=range]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:#fff;border:none}.day-slider .day-live{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid rgba(255,255,255,.85);background:#fff;color:#0a0f14;font-size:11px;font-weight:800;letter-spacing:.12em;font-family:ui-monospace,monospace;padding:6px 13px;border-radius:999px;cursor:pointer;line-height:1;text-align:center;text-indent:2px;transition:background .15s ease}.day-slider .day-live:hover{background:#f2f2f2}.home-socials{position:absolute;top:calc(38% + 14px);right:2.3%;z-index:8;display:flex;gap:18px}.home-social{display:inline-flex;align-items:center;justify-content:center;transition:transform .15s ease,opacity .15s ease}.home-social:hover{transform:scale(1.08);opacity:.85}.home-social:active{transform:scale(.94)}.home-social img{width:26px;height:26px;object-fit:contain}.home-social img[alt=GitHub]{width:30px;height:30px}.work-with-me{position:absolute;right:2.6%;bottom:5%;z-index:8;display:inline-flex;align-items:center;gap:8px;padding:7px 14px 7px 23px;border-radius:999px;background:#fff;color:#151515;font-family:Inter,system-ui,sans-serif;font-size:15px;font-weight:700;letter-spacing:.02em;text-decoration:none;box-shadow:0 6px 20px #00000040;transition:transform .2s ease,box-shadow .2s ease}@media (hover: hover){.work-with-me:before{content:"";position:absolute;top:-14px;right:-14px;bottom:-14px;left:-14px;border-radius:inherit;pointer-events:auto}}.work-with-me:hover{transform:translateY(-2px);box-shadow:0 10px 28px #0000004d}.work-with-me:active{transform:translateY(0)}.follow-eyes{display:inline-flex;gap:6px;align-items:center;position:relative}.follow-eye{position:relative;width:16px;height:30px;transition:transform .15s ease-in-out}.follow-eye-oval{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:#151515}.follow-eyes.is-blinking .follow-eye{transform:scaleY(.06)}.follow-glint{position:absolute;left:50%;top:50%;width:73%;height:34%;border-radius:50%;background:#fff;display:block;z-index:1;will-change:transform}.follow-blush{position:absolute;width:38.26%;height:22.7%;border-radius:50%;background:#ff2e2e;opacity:0;transition:opacity .6s ease;pointer-events:none}.follow-blush.left{left:-7.6%;top:88.2%}.follow-blush.right{left:73.9%;top:88.2%}.work-with-me:hover .follow-blush,.work-with-me.is-touched .follow-blush{opacity:1}.wwm-button{display:inline-flex;align-items:center;gap:8px;padding:7px 16px;border-radius:999px;background:#fff;color:#151515;font-family:Inter,system-ui,sans-serif;font-size:15px;font-weight:700;letter-spacing:.02em;text-decoration:none;box-shadow:0 6px 20px #00000040;transition:transform .15s ease,box-shadow .15s ease;touch-action:manipulation;border:none;cursor:pointer;-webkit-tap-highlight-color:transparent}.wwm-button:hover{transform:translateY(-2px);box-shadow:0 10px 28px #0000004d}.wwm-button:active{transform:translateY(0)}.wwm-eyes{display:inline-flex;gap:6px;align-items:center;position:relative}.wwm-eye{position:relative;width:16px;height:30px;transition:transform .15s ease-in-out}.wwm-eye-oval{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:#151515}.wwm-eyes.is-blinking .wwm-eye{transform:scaleY(.06)}.wwm-glint{position:absolute;left:50%;top:50%;width:73%;height:34%;border-radius:50%;background:#fff;display:block;z-index:1;will-change:transform}.wwm-blush{position:absolute;width:38.26%;height:22.7%;border-radius:50%;background:#ff2e2e;opacity:0;transition:opacity .6s ease;pointer-events:none}.wwm-blush.left{left:-7.6%;top:88.2%}.wwm-blush.right{left:73.9%;top:88.2%}.wwm-button:hover .wwm-blush,.wwm-button.is-touched .wwm-blush{opacity:1}.component-card.is-expanded .wwm-button{margin:auto}.component-preview .wwm-button{margin:0 auto}.component-preview .wwm-button{pointer-events:none}.component-preview .wwm-button:hover{transform:none;box-shadow:0 6px 20px #00000040}.component-preview .wwm-button:hover .wwm-blush{opacity:0}.notfound-page{--page-radius: clamp(20px, 3.14cqw, 44px);width:min(1150px,90%);aspect-ratio:1400 / 780;border-radius:var(--page-radius);background:#151515;box-shadow:0 30px 80px #1918182e;padding:clamp(18px,2.2cqw,30px) clamp(44px,6cqw,88px) clamp(49px,5.2cqw,69px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#f2f2f2;overflow:hidden;position:relative}.nf-head{width:100%;display:flex;align-items:center;margin-bottom:clamp(8px,1cqw,14px)}.nf-ripple-text{position:relative;z-index:0;font-family:Fraunces,Georgia,serif;font-size:clamp(120px,18cqh,190px);font-weight:600;line-height:1.05;color:#f2ede4;background-size:100% 100%;background-repeat:no-repeat;background-position:0 0;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;cursor:crosshair}.nf-ripple-text.ripple{color:transparent}.nf-caption{font-family:Fraunces,Georgia,serif;font-size:clamp(20px,2.4cqw,34px);font-weight:500;color:#f2ede4;margin-top:clamp(10px,1.4cqw,20px);letter-spacing:.005em}.nf-body{max-width:46ch;font-family:Inter,system-ui,sans-serif;font-size:clamp(12px,1.15cqw,16px);line-height:1.65;color:#8a857c;margin-top:clamp(8px,1cqw,14px)}.nf-actions{display:flex;align-items:center;gap:clamp(10px,1.4cqw,20px);margin-top:clamp(16px,2.3cqw,32px)}.nf-home{border:none;border-radius:999px;background:#f2ede4;color:#151515;font-family:Inter,system-ui,sans-serif;font-size:clamp(12px,1.1cqw,15px);font-weight:600;padding:clamp(8px,.9cqw,12px) clamp(18px,2cqw,28px);cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}.nf-home:hover{transform:translateY(-1px);box-shadow:0 8px 24px #f2ede42e}.nf-ghost{border:1px solid #2e2d2b;border-radius:999px;background:transparent;color:#8a857c;font-family:Inter,system-ui,sans-serif;font-size:clamp(12px,1.1cqw,15px);font-weight:500;padding:clamp(8px,.9cqw,12px) clamp(18px,2cqw,28px);cursor:pointer;transition:color .15s ease,border-color .15s ease}.nf-ghost:hover{color:#f2ede4;border-color:#8a857c}.nf-hint{font-family:Inter,system-ui,sans-serif;font-size:clamp(10px,.9cqw,13px);letter-spacing:.02em;color:#5c5851;margin-top:clamp(14px,2cqw,28px)}.spotify-btn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;border:1px solid #282828;background:#1d1d1f;cursor:pointer;z-index:60;box-shadow:inset 0 1px #ffffff1f,inset 0 -2px 4px #0009,0 2px 6px #0000004d;transition:transform .15s ease,box-shadow .2s ease,opacity .4s ease}.spotify-btn:hover{transform:translateY(-1px);box-shadow:inset 0 1px #ffffff29,inset 0 -2px 4px #0009,0 0 14px #f2ede459}.spotify-btn:active{transform:scale(.94)}.spotify-btn.is-on{border-color:#1db95499;box-shadow:inset 0 1px #ffffff1f,inset 0 -2px 4px #0009,0 0 12px #1db95466}.spotify-btn.is-blurred{opacity:0;pointer-events:none}.player-overlay{position:absolute;top:0;left:0;right:0;bottom:0;z-index:30;animation:progressive-blur .6s cubic-bezier(.22,.9,.3,1) both}.player-overlay:before{content:"";position:absolute;top:38%;left:0;right:0;bottom:0;background:#151515;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);z-index:-1}.player-top{position:absolute;top:calc(38% + 14px);right:2.3%;display:flex;align-items:center;gap:10px;z-index:2}.player-top.is-above .player-search-btn,.player-top.is-closing .player-search-btn{position:relative;z-index:50}.player-top.is-above .player-exit{opacity:0;pointer-events:none;transition:opacity .25s ease}.player-top:not(.is-above) .player-exit{opacity:1;transition:opacity .25s ease}.player-search-btn{display:inline-flex;align-items:center;gap:7px;border:1px solid #282828;border-radius:999px;background:#19181899;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#a6a6a6;padding:clamp(7px,.8cqw,10px) clamp(14px,1.4cqw,18px);cursor:pointer;transition:color .15s ease,border-color .15s ease,transform .15s ease}.player-search-label{font-family:Space Grotesk,sans-serif;font-size:clamp(11px,1cqw,13px);font-weight:500;white-space:nowrap}.player-search-btn:hover{color:#f2ede4;border-color:#555}.player-search-btn:active{transform:scale(.95)}.player-search-btn.is-on{color:#151515;background:#f2ede4;border-color:#f2ede4}.player-exit{border:none;border-radius:999px;background:#f2ede4;color:#151515;font-family:Space Grotesk,sans-serif;font-size:clamp(12px,1.1cqw,15px);font-weight:600;padding:clamp(7px,.8cqw,10px) clamp(16px,1.6cqw,22px);cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}.player-exit:hover{transform:translateY(-1px);box-shadow:0 8px 24px #f2ede42e}.player-exit:active{transform:scale(.96)}.player-art{position:absolute;left:6.5%;top:38%;transform:translateY(-50%);width:clamp(100px,15.7cqw,220px);height:clamp(100px,15.7cqw,220px);border-radius:clamp(18px,2.57cqw,36px);border:clamp(3px,.43cqw,6px) solid var(--dark);overflow:hidden;box-shadow:0 12px 32px #00000073}.player-art img{width:100%;height:100%;object-fit:cover;display:block}.player-art-fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#191818}.player-meta{position:absolute;top:53.4%;left:0;right:0;display:flex;flex-direction:column;align-items:flex-start;gap:clamp(6px,.7cqw,10px);padding:0 clamp(44px,6cqw,88px);z-index:1}.player-title{font-family:Space Grotesk,sans-serif;font-size:clamp(18px,2.2cqw,30px);font-weight:600;letter-spacing:-.01em;line-height:1.25;padding-bottom:.08em;color:var(--paper);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.player-artist{font-family:Space Grotesk,sans-serif;font-size:clamp(9px,.9cqw,12px);font-weight:500;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;color:#f2f2f28c}.player-progress{position:absolute;top:66%;left:clamp(44px,6cqw,88px);right:clamp(44px,6cqw,88px);display:flex;flex-direction:column;gap:4px;z-index:1}.player-bar{position:relative;height:3px;border-radius:2px;background:#ffffff4d;cursor:pointer;touch-action:none}.player-bar-fill{height:100%;border-radius:2px;background:#f2ede4;transition:width .5s linear}.player-bar-thumb{position:absolute;top:50%;width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 1px 4px #0006;transform:translate(-50%,-50%);opacity:0;transition:opacity .15s ease;pointer-events:none}.player-bar:hover .player-bar-thumb,.player-bar.dragging .player-bar-thumb{opacity:1}.player-times{display:flex;justify-content:space-between;font-family:Space Grotesk,sans-serif;font-size:clamp(9px,.8cqw,11px);color:#5c5851}.player-controls{display:flex;align-items:center;gap:clamp(10px,1.2cqw,16px);z-index:1}.player-ctl{width:clamp(34px,3.4cqw,46px);height:clamp(34px,3.4cqw,46px);border-radius:50%;border:1px solid #282828;background:#191818;color:#f2ede4;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:transform .15s ease,background .15s ease,border-color .15s ease,color .15s ease}.player-ctl:hover{background:#282828;border-color:#555}.player-ctl:active{transform:scale(.92)}.player-ctl-sm{width:clamp(28px,2.8cqw,36px);height:clamp(28px,2.8cqw,36px);position:relative}.player-repeat-badge{position:absolute;top:-4px;right:-4px;width:13px;height:13px;border-radius:50%;background:#f2ede4;color:#151515;font-family:Space Grotesk,sans-serif;font-size:9px;font-weight:700;line-height:13px;text-align:center;pointer-events:none;box-shadow:0 1px 3px #00000080}.player-ctl.is-on{color:#151515;background:#f2ede4;border-color:#f2ede4}.player-play{width:clamp(44px,4.4cqw,58px);height:clamp(44px,4.4cqw,58px);background:#f2ede4;border-color:#f2ede4;color:#151515}.player-play:hover{background:#fff;border-color:#fff}.player-vol{position:absolute;right:clamp(44px,6cqw,88px);bottom:clamp(30px,4cqw,55px);display:flex;align-items:center;gap:6px;color:#8a857c}.player-vol-slider{width:clamp(50px,6cqw,80px);height:4px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#2e2d2b;border-radius:999px;outline:none;cursor:pointer}.player-vol-slider::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:#f2ede4;border:none;cursor:pointer}.player-vol-slider::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:#f2ede4;border:none;cursor:pointer}.player-side{position:absolute;left:clamp(44px,6cqw,88px);bottom:clamp(30px,4cqw,55px);z-index:1}.player-lyrics-btn{display:inline-flex;align-items:center;gap:7px;border:1px solid #282828;border-radius:999px;background:#191818;color:#a6a6a6;font-family:Space Grotesk,sans-serif;font-size:clamp(11px,1cqw,13px);font-weight:500;padding:clamp(7px,.8cqw,10px) clamp(14px,1.4cqw,18px);cursor:pointer;transition:color .15s ease,border-color .15s ease,background .15s ease}.player-lyrics-btn:hover{color:#f2ede4;border-color:#555}.player-lyrics-btn:active{transform:scale(.95)}.player-lyrics-btn.is-on{color:#151515;background:#f2ede4;border-color:#f2ede4}.player-browse-backdrop{position:absolute;top:0;left:0;right:0;bottom:0;z-index:40;display:flex;align-items:center;justify-content:center;background:#15151573;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);animation:browse-backdrop-in .3s cubic-bezier(.22,.9,.3,1) both}@keyframes browse-backdrop-in{0%{opacity:0}to{opacity:1}}.player-browse-backdrop.is-closing{animation:browse-backdrop-out .38s cubic-bezier(.16,1,.3,1) both}@keyframes browse-backdrop-out{to{opacity:0}}.player-browse{width:min(560px,78%);max-height:70%;display:flex;flex-direction:column;gap:12px;background:#151515;border:1px solid #282828;border-radius:20px;overflow:hidden;padding:clamp(16px,2cqw,24px);box-shadow:0 24px 64px #00000080;transform-origin:top right;animation:player-pop .35s cubic-bezier(.16,1,.3,1) both}.player-browse.is-closing{animation:player-pop-out .38s cubic-bezier(.16,1,.3,1) both}@keyframes player-pop-out{to{transform:scale(.6);opacity:0}}@keyframes player-pop{0%{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}.player-browse-search{position:relative;display:flex;align-items:center;gap:8px}.player-browse-search-icon{position:absolute;left:clamp(14px,1.5cqw,18px);color:#5c5851;pointer-events:none;z-index:1}.player-browse-search input{flex:1;min-width:0;background:#191818;border:1px solid #282828;border-radius:999px;color:#f2ede4;font-family:Space Grotesk,sans-serif;font-size:clamp(12px,1.1cqw,15px);padding:clamp(8px,.9cqw,11px) clamp(16px,1.6cqw,20px) clamp(8px,.9cqw,11px) clamp(36px,3.4cqw,44px);outline:none;transition:border-color .15s ease}.player-browse-search input::placeholder{color:#5c5851}.player-browse-search input:focus{border-color:#f2ede4}.player-browse-hint{font-family:Space Grotesk,sans-serif;font-size:clamp(10px,.9cqw,12px);color:#5c5851}.player-lyrics{width:min(480px,72%);max-height:72%}.player-lyrics-head{display:flex;flex-direction:column;gap:2px;padding-bottom:10px;border-bottom:1px solid #282828}.player-lyrics-title{font-family:Space Grotesk,sans-serif;font-size:clamp(15px,1.5cqw,20px);font-weight:600;color:#f2ede4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-lyrics-artist{font-family:Space Grotesk,sans-serif;font-size:clamp(10px,.9cqw,12px);color:#5c5851}.player-lyrics-stage{position:relative}.player-lyrics-body{overflow-y:auto;max-height:42vh;padding:14px 0;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none}.player-lyrics-body::-webkit-scrollbar{display:none}.player-lyrics-fade{position:absolute;left:0;right:0;height:40px;pointer-events:none;z-index:2;background:linear-gradient(to bottom,#151515,#151515e6 45%,#15151500);transition:opacity .35s ease}.player-lyrics-fade-top{top:0;opacity:0}.player-lyrics-fade-top.is-on{opacity:1}.player-lyrics-fade-bottom{bottom:0;background:linear-gradient(to top,#151515,#151515e6 45%,#15151500);opacity:1}.player-lyric-line{font-family:Space Grotesk,sans-serif;font-size:clamp(15px,1.6cqw,21px);line-height:1.5;color:#f2ede459;text-align:center;padding:6px 0;transition:color .3s ease,transform .3s ease}.player-lyric-line.is-active{color:#f2ede4;transform:scale(1.03)}.player-browse-list{display:flex;flex-direction:column;gap:6px;overflow-y:auto;max-height:40vh;padding-right:4px}.player-browse-list::-webkit-scrollbar{width:6px}.player-browse-list::-webkit-scrollbar-thumb{background:#2e2d2b;border-radius:999px}.player-result{display:flex;align-items:center;gap:10px;background:transparent;border:none;border-radius:10px;padding:6px 8px;cursor:pointer;text-align:left;transition:background .15s ease}.player-result:hover{background:#282828}.player-result img{width:34px;height:34px;border-radius:6px;object-fit:cover;flex:none}.player-result-meta{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}.player-result-name{font-family:Space Grotesk,sans-serif;font-size:clamp(11px,1cqw,13px);font-weight:600;color:#f2ede4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-result-artist{font-family:Space Grotesk,sans-serif;font-size:clamp(9px,.8cqw,11px);color:#8a857c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-result-play{color:#f2ede4;flex:none}.player-lib{display:flex;gap:8px}.player-lib-tab{border:1px solid #282828;border-radius:999px;background:#191818;color:#8a857c;font-family:Space Grotesk,sans-serif;font-size:clamp(9px,.85cqw,12px);font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:clamp(5px,.6cqw,8px) clamp(12px,1.2cqw,16px);cursor:pointer;transition:color .15s ease,border-color .15s ease,background .15s ease}.player-lib-tab:hover{color:#f2ede4;border-color:#555}.player-lib-tab.is-on{background:#f2ede4;border-color:#f2ede4;color:#151515}.player-more{border:1px solid #282828;border-radius:999px;background:#191818;color:#8a857c;font-family:Space Grotesk,sans-serif;font-size:clamp(9px,.85cqw,12px);font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:clamp(5px,.6cqw,8px) clamp(12px,1.2cqw,16px);cursor:pointer;transition:color .15s ease,border-color .15s ease}.player-more:hover{color:#f2ede4;border-color:#555}.player-wait,.player-error,.player-idle-text{font-family:Space Grotesk,sans-serif;font-size:clamp(11px,1cqw,14px);color:#8a857c}.player-idle{position:absolute;top:38%;left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:clamp(10px,1.2cqw,16px);transform:translateY(-50%)}.player-art-idle{position:static;transform:none;width:clamp(80px,10cqw,120px);height:clamp(80px,10cqw,120px)}.player-error{position:absolute;top:45%;left:0;right:0;text-align:center;color:#e05c5c;padding:0 clamp(44px,6cqw,88px)}.card.is-player .photo-tile,.card.is-player .home-socials,.card.is-player .work-with-me,.card.is-player .content{animation:none;opacity:0;pointer-events:none;transition:opacity .4s ease}.photo-tile{position:absolute;left:6.5%;top:38%;transform:translateY(-50%);width:clamp(100px,15.7cqw,220px);height:clamp(100px,15.7cqw,220px);border-radius:clamp(18px,2.57cqw,36px);border:clamp(3px,.43cqw,6px) solid var(--dark);overflow:hidden;background:var(--light);z-index:2}.photo-tile img{width:100%;height:100%;object-fit:cover;display:block}.content{position:absolute;top:53.4%;left:0;right:0;bottom:0;z-index:3;display:flex;flex-direction:column;justify-content:flex-start;padding:0 6.5% 5%;pointer-events:none}.name-block{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(6px,.7cqw,10px)}.name{font-size:clamp(32px,6cqw,84px);font-weight:700;letter-spacing:-.03em;line-height:.95;color:var(--paper)}.role{font-size:clamp(11px,1.14cqw,16px);font-weight:500;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;color:#f2f2f28c}.tagline{margin-top:clamp(19px,2.04cqw,27px);max-width:46ch;font-size:clamp(15px,1.63cqw,23px);line-height:1.55;color:#f2f2f2c7}.meta-row{margin-top:auto;padding-top:clamp(18px,2.2cqw,30px);display:flex;gap:clamp(14px,2cqw,28px);flex-wrap:wrap}.meta{font-size:clamp(10px,.93cqw,13px);font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:#f2f2f273}@media (max-width: 900px){#root{padding:16px}}@media (max-width: 1400px){#root{padding:84px 12px 28px}.card{display:flex;flex-direction:column;aspect-ratio:auto;width:100%;border-radius:24px;-webkit-clip-path:inset(0 round 24px);clip-path:inset(0 round 24px)}.card-top{position:relative;inset:auto;height:180px;flex:none}.card-bottom{position:absolute;top:180px;left:0;right:0;bottom:0;border-radius:0 0 24px 24px}.koi-zone{position:absolute;top:0;left:0;right:0;height:180px}.photo-tile{width:96px;height:96px;top:180px;left:5%;border-width:4px;border-radius:20px}.home-socials{top:auto;right:5.1%;bottom:3.6%}.home-social img{width:22px;height:22px}.work-with-me{left:3.6%;right:auto;bottom:3.6%;padding:7px 13px;font-size:13px;gap:8px;touch-action:manipulation}.follow-eye{width:14px;height:26px}.follow-glint{width:73%;height:34%}.content{position:static;padding:50px 5% 24px;justify-content:flex-start}.meta-row{margin-top:12px;padding-top:0;margin-bottom:clamp(7px,1.9vh,15px)}.name{font-size:36px}.role{font-size:11px}.tagline{font-size:13px}.meta{font-size:10px}.meta-row{gap:14px}}.water-wrap .split-flap-text{position:absolute;right:14px;bottom:12px;z-index:6;pointer-events:none;opacity:.94;text-shadow:0 1px 8px rgba(0,0,0,.5)}.split-flap-text{display:inline-flex;align-items:center;gap:var(--split-flap-gap, 6px);color:var(--split-flap-text-color, #f8fafc);font-family:SFMono-Regular,Roboto Mono,Cascadia Code,Liberation Mono,Menlo,monospace;font-size:var(--split-flap-font-size, 52px);font-weight:760;line-height:1;letter-spacing:.035em;white-space:pre;-webkit-user-select:none;user-select:none;font-variant-numeric:tabular-nums}.split-flap-text__tile{position:relative;width:.78em;height:1.08em;overflow:hidden;border-radius:var(--split-flap-radius, 8px);background:radial-gradient(circle at 50% 0%,rgba(255,255,255,.16),transparent 44%),linear-gradient(180deg,color-mix(in srgb,var(--split-flap-tile-color, #111827) 82%,white),var(--split-flap-tile-color, #111827));box-shadow:0 .035em .08em #ffffff14 inset,0 -.05em .1em #00000061 inset,0 .16em .38em #00000047;perspective:520px;transform-style:preserve-3d;isolation:isolate}.split-flap-text__tile:before{content:"";position:absolute;z-index:8;top:calc(50% - .5px);left:0;width:100%;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.18) 18%,rgba(0,0,0,.64) 50%,rgba(255,255,255,.14) 82%,transparent);box-shadow:0 -1px #ffffff14,0 1px #00000080;pointer-events:none}.split-flap-text__tile:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:9;border:1px solid rgba(255,255,255,.08);border-radius:inherit;box-shadow:0 0 0 1px #0003 inset;pointer-events:none}.split-flap-text__half,.split-flap-text__flap{position:absolute;left:0;width:100%;height:50%;overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.07),transparent 34%),var(--split-flap-tile-color, #111827);backface-visibility:hidden}.split-flap-text__half--top,.split-flap-text__flap--front{top:0}.split-flap-text__half--bottom,.split-flap-text__flap--back{bottom:0}.split-flap-text__half--bottom,.split-flap-text__flap--back{background:linear-gradient(0deg,rgba(255,255,255,.06),transparent 38%),color-mix(in srgb,var(--split-flap-tile-color, #111827) 92%,black)}.split-flap-text__char{position:absolute;left:0;width:100%;height:200%;display:flex;align-items:center;justify-content:center;color:var(--split-flap-text-color, #f8fafc);text-shadow:0 .025em 0 rgba(255,255,255,.16),0 .09em .16em rgba(0,0,0,.42)}.split-flap-text__half--top .split-flap-text__char,.split-flap-text__flap--front .split-flap-text__char{top:0}.split-flap-text__half--bottom .split-flap-text__char,.split-flap-text__flap--back .split-flap-text__char{bottom:0}.split-flap-text__flap{z-index:6;will-change:transform,filter;transform-style:preserve-3d}.split-flap-text__flap--front{transform-origin:center bottom;animation:split-flap-front var(--split-flap-flip-duration, .12s) cubic-bezier(.23,1,.32,1) both}.split-flap-text__flap--back{transform-origin:center top;transform:rotateX(90deg);animation:split-flap-back var(--split-flap-flip-duration, .12s) cubic-bezier(.23,1,.32,1) both}@keyframes split-flap-front{0%{transform:rotateX(0);filter:brightness(1.08)}to{transform:rotateX(-90deg);filter:brightness(.52)}}@keyframes split-flap-back{0%,45%{transform:rotateX(90deg);filter:brightness(.58)}to{transform:rotateX(0);filter:brightness(1)}}@media (prefers-reduced-motion: reduce){.split-flap-text__flap{animation:none!important}}.about-page{width:min(1150px,90%);aspect-ratio:1400 / 780;border-radius:clamp(20px,3.14cqw,44px);background:#151515;box-shadow:0 30px 80px #1918182e;padding:clamp(18px,2.2cqw,30px) clamp(44px,6cqw,88px) clamp(49px,5.2cqw,69px);display:flex;flex-direction:column;gap:clamp(12px,1.3cqw,18px);color:#f2f2f2;overflow:hidden}.about-head{display:flex;flex-direction:column;gap:clamp(6px,.7cqw,10px);margin-top:clamp(0px,.6vw,8px)}.about-kicker{font-size:clamp(10px,.93cqw,13px);font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#a6a6a6}.about-title{font-size:clamp(30px,5.2cqw,72px);font-weight:700;letter-spacing:-.03em;line-height:1.02;color:#f2f2f2}.about-bio{max-width:52ch;font-size:clamp(11px,1.05cqw,14px);line-height:1.45;color:#f2f2f2c7}.about-stack{display:flex;flex-direction:column;gap:clamp(8px,.9cqw,14px);margin-top:clamp(4px,.5cqw,8px);border-top:1px solid #282828;padding-top:clamp(8px,.9cqw,12px)}.stack-label{font-size:clamp(9px,.86cqw,12px);font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#a6a6a6}.about-tools{display:grid;grid-template-columns:repeat(7,1fr);gap:clamp(8px,.9cqw,14px)}.tool-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(5px,.6cqw,9px)}.tool-icon{display:flex;align-items:center;justify-content:center;width:clamp(28px,3.2cqw,44px);height:clamp(28px,3.2cqw,44px);background:#191818;border:1px solid #282828;border-radius:12px}.tool-icon img{width:clamp(15px,1.7cqw,24px);height:clamp(15px,1.7cqw,24px);object-fit:contain;filter:brightness(0) invert(1)}.tool-name{font-size:clamp(8px,.8cqw,11px);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#fff;white-space:nowrap}.lang-stack{display:flex;flex-direction:column;gap:clamp(8px,.9cqw,14px);border-top:1px solid #282828;padding-top:clamp(8px,.9cqw,12px)}.lang-buttons{display:flex;flex-wrap:wrap;gap:clamp(6px,.7cqw,10px)}.lang-btn{background:#191818;border:1px solid #282828;border-radius:999px;color:#fff;font-family:Space Grotesk,sans-serif;font-size:clamp(9px,.86cqw,12px);font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:clamp(5px,.6cqw,8px) clamp(12px,1.3cqw,18px);cursor:pointer;transition:background .15s ease,color .15s ease}.lang-btn:hover{background:#282828;color:#fff}.about-stats{display:flex;gap:clamp(20px,3.2cqw,44px);margin-top:clamp(6px,.7cqw,10px);padding-top:clamp(8px,.9cqw,12px);border-top:1px solid #282828}.stat{display:flex;flex-direction:column;gap:2px}.stat-num{font-size:clamp(16px,1.9cqw,26px);font-weight:700;color:#f2f2f2}border: 2px solid transparent; background-clip: content-box; border-radius: 999px; } .stat-label{font-size:clamp(9px,.86cqw,12px);letter-spacing:.12em;text-transform:uppercase;color:#f2f2f273}.archive-page{width:min(1150px,90%);aspect-ratio:1400 / 780;border-radius:clamp(20px,3.14cqw,44px);background:#151515;box-shadow:0 30px 80px #1918182e;padding:clamp(18px,2.2cqw,30px) clamp(44px,6cqw,88px) clamp(49px,5.2cqw,69px);display:flex;flex-direction:column;gap:clamp(12px,1.3cqw,18px);color:#f2f2f2;overflow:hidden}.archive-list{display:flex;flex-direction:column;gap:clamp(6px,.7cqw,10px);margin-top:auto;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#555555 transparent;padding-right:4px}.archive-list::-webkit-scrollbar{width:8px}.archive-list::-webkit-scrollbar-track{background:transparent}.archive-list::-webkit-scrollbar-thumb{background:#555;border:2px solid transparent;background-clip:content-box;border-radius:999px}.archive-toast{display:flex;align-items:center;gap:clamp(8px,.9cqw,14px);background:#191818;border:1px solid #282828;border-radius:14px;padding:clamp(7px,.8cqw,12px) clamp(10px,1.1cqw,16px);transition:border-color .15s ease}.archive-toast:hover{border-color:#555}.archive-pfp{width:clamp(30px,3.2cqw,44px);height:clamp(30px,3.2cqw,44px);border-radius:50%;border:1px solid #282828;flex:none;object-fit:cover}.archive-body{display:flex;flex-direction:column;gap:1px;min-width:0}.archive-author{font-size:clamp(10px,1cqw,14px);font-weight:700;color:#fff}.archive-skill{font-size:clamp(8px,.8cqw,11px);font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#a6a6a6}.archive-desc{font-size:clamp(9px,.86cqw,12px);line-height:1.35;color:#f2f2f299;margin-top:1px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.archive-arrow{display:inline-flex;align-items:center;justify-content:center;width:clamp(30px,3cqw,42px);height:clamp(30px,3cqw,42px);border:1px solid #282828;border-radius:50%;color:#fff;flex:none;margin-left:auto;transition:background .15s ease,border-color .15s ease}.archive-arrow:hover{background:#282828;border-color:#555}.contact-page{width:min(1150px,90%);aspect-ratio:1400 / 780;border-radius:clamp(20px,3.14cqw,44px);background:#151515;box-shadow:0 30px 80px #1918182e;padding:clamp(18px,2.2cqw,30px) clamp(44px,6cqw,88px) clamp(49px,5.2cqw,69px);display:flex;flex-direction:column;gap:clamp(12px,1.3cqw,18px);color:#f2f2f2;overflow:hidden}.contact-head{display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between;gap:clamp(6px,.7cqw,10px);margin-top:clamp(0px,.6vw,8px)}.contact-head-text{display:flex;flex-direction:column;gap:clamp(6px,.7cqw,10px)}.dm-x-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;margin-top:clamp(6px,.7cqw,10px);transition:opacity .15s ease}.dm-x-btn img{width:clamp(18px,1.7cqw,24px);height:clamp(18px,1.7cqw,24px)}.dm-x-btn:hover{opacity:.7}.contact-page .about-title{font-size:clamp(27px,4.68cqw,65px)}.contact-form{display:flex;flex-direction:column;gap:clamp(10px,1.1cqw,16px)}.contact-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(10px,1.1cqw,16px)}.contact-field{display:flex;flex-direction:column;gap:clamp(5px,.6cqw,9px)}.contact-label{font-size:clamp(9px,.86cqw,12px);font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#a6a6a6}.contact-field input,.contact-field textarea{background:#191818;border:1px solid #282828;border-radius:14px;color:#f2f2f2;font-family:Space Grotesk,sans-serif;font-size:clamp(12px,1.15cqw,16px);padding:clamp(10px,1.1cqw,16px) clamp(12px,1.3cqw,18px);outline:none;transition:border-color .15s ease}.contact-field input::placeholder,.contact-field textarea::placeholder{color:#f2f2f259}.contact-field input:focus,.contact-field textarea:focus{border-color:#a6a6a6}.contact-field textarea{resize:none;scrollbar-width:thin;scrollbar-color:#555555 transparent}.contact-textarea-wrap{border-radius:14px;overflow:hidden;border:1px solid #282828;background:#191818;padding-bottom:16px;transition:border-color .15s ease}.contact-textarea-wrap:focus-within{border-color:#a6a6a6}.contact-textarea-wrap textarea{border:none;background:transparent;border-radius:0;width:100%;display:block}.contact-textarea-wrap textarea::-webkit-scrollbar{width:8px}.contact-textarea-wrap textarea::-webkit-scrollbar-track{background:transparent}.contact-textarea-wrap textarea::-webkit-scrollbar-thumb{background:#555;border:2px solid transparent;background-clip:content-box;border-radius:999px}.contact-textarea-wrap textarea::-webkit-scrollbar-thumb:hover{background:#6a6a6a;border:2px solid transparent;background-clip:content-box}.contact-textarea-wrap textarea::-webkit-scrollbar-corner{background:transparent}.contact-send{align-self:flex-start;background:#191818;border:1px solid #282828;border-radius:999px;color:#fff;font-family:Space Grotesk,sans-serif;font-size:clamp(10px,.93cqw,13px);font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:clamp(8px,.9cqw,12px) clamp(18px,2cqw,28px);cursor:pointer;transition:background .15s ease}.contact-send:hover{background:#282828}.contact-foot{display:flex;gap:clamp(14px,2cqw,28px);flex-wrap:wrap;border-top:1px solid #282828;padding-top:clamp(10px,1.1cqw,16px)}@keyframes progressive-blur{0%{filter:blur(12px);opacity:.25}to{filter:blur(0);opacity:1}}.page>.nav-bar{animation:progressive-blur 1s cubic-bezier(.22,.9,.3,1) .2s both}.card>*{animation:progressive-blur 1.1s cubic-bezier(.22,.9,.3,1) both}.card>*:nth-child(1){animation-delay:.02s}.card>*:nth-child(2){animation-delay:.1s}.card>*:nth-child(3){animation-delay:.18s}.card>*:nth-child(4){animation-delay:.26s}.card>*:nth-child(5){animation-delay:.34s}.about-page>*{animation:progressive-blur 1.1s cubic-bezier(.22,.9,.3,1) both}.about-page>*:nth-child(1){animation-delay:.02s}.about-page>*:nth-child(2){animation-delay:.1s}.about-page>*:nth-child(3){animation-delay:.18s}.about-page>*:nth-child(4){animation-delay:.26s}.about-page>*:nth-child(5){animation-delay:.34s}.about-page>*:nth-child(6){animation-delay:.42s}.contact-page>*{animation:progressive-blur 1.1s cubic-bezier(.22,.9,.3,1) both}.contact-page>*:nth-child(1){animation-delay:.02s}.contact-page>*:nth-child(2){animation-delay:.1s}.contact-page>*:nth-child(3){animation-delay:.18s}.archive-page>*{animation:progressive-blur 1.1s cubic-bezier(.22,.9,.3,1) both}.archive-page>*:nth-child(1){animation-delay:.02s}.archive-page>*:nth-child(2){animation-delay:.1s}.archive-page>*:nth-child(3){animation-delay:.18s}.components-page>.about-head,.components-page>.about-bio,.notfound-page>*{animation:progressive-blur 1.1s cubic-bezier(.22,.9,.3,1) backwards}.components-page>.about-head{animation-delay:.02s}.components-page>.about-bio{animation-delay:.1s}.components-page .about-title{animation-delay:.02s}.notfound-page>*:nth-child(1){animation-delay:.02s}.notfound-page>*:nth-child(2){animation-delay:.08s}.notfound-page>*:nth-child(3){animation-delay:.16s}.notfound-page>*:nth-child(4){animation-delay:.24s}.notfound-page>*:nth-child(5){animation-delay:.32s}.notfound-page>*:nth-child(6){animation-delay:.4s}.components-grid .component-card{animation:progressive-blur 1.1s cubic-bezier(.22,.9,.3,1) backwards}.components-grid .component-card:nth-child(1){animation-delay:.18s}.components-grid .component-card:nth-child(2){animation-delay:.26s}.components-grid .component-card:nth-child(3){animation-delay:.34s}.components-grid .component-card:nth-child(4){animation-delay:.42s}.home-slot{display:contents}.home-slot.is-hidden .card{filter:blur(14px);opacity:0;pointer-events:none;transition:filter .5s ease,opacity .5s ease}.home-slot:not(.is-hidden) .card{filter:blur(0);opacity:1;transition:filter .5s ease,opacity .5s ease}.day-slider{transition:filter .5s ease,opacity .5s ease}.day-slider.is-blurred{filter:blur(10px);opacity:0;pointer-events:none}@media (max-width: 1400px){.day-slider{padding:4px 9px 4px 4px;gap:6px;transition:opacity .5s ease,filter .5s ease}.day-slider .day-live{font-size:10px;padding:4px 11px}.day-slider input[type=range]{width:128px}.day-slider input[type=range]::-webkit-slider-thumb,.day-slider input[type=range]::-moz-range-thumb{width:10px;height:10px}.day-slider .day-label{width:12px;height:12px}.day-slider.is-blurred{transform:none}}@media (min-width: 1401px){.about-page,.contact-page,.archive-page,.components-page,.notfound-page{position:absolute;top:0;left:50%;transform:translate(-50%)}}@media (prefers-reduced-motion: reduce){.page>.nav-bar,.card>*,.about-page>*,.contact-page>*,.archive-page>*,.home-slot .card,.day-slider{animation:none!important;transition:none!important}}.nav-bar{position:relative;margin-top:22px;width:min(510px,90%);height:76px;border-radius:26px;background:#151515;box-shadow:0 14px 17.6px #00000024;overflow:hidden}.nav-items{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;padding:0 6px}.nav-item{flex:1;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;background:none;border:none;color:#ffffffa6;cursor:pointer;padding:6px 0;transition:color .2s ease;z-index:2}.nav-item:hover{color:#fff}.nav-item-label{font-family:Space Grotesk,sans-serif;font-size:9px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#ffffff80;transition:color .2s ease}.nav-item:hover .nav-item-label{color:#ffffffd9}.nav-glint{position:absolute;top:8px;bottom:8px;border-radius:20px;background:radial-gradient(ellipse 150% 260% at 63% 100%,#7e7e7ed9,#a4a4a4d9,#c9c9c9d9);box-shadow:inset 0 0 8.1px 5px #ffffff40;z-index:1;pointer-events:none;transition:left .15s cubic-bezier(.25,.8,.3,1),width .15s cubic-bezier(.25,.8,.3,1)}.nav-item.is-active .nav-glint{opacity:1;transform:scale(1)}@media (max-width: 1400px){.about-page{width:100%;aspect-ratio:auto;height:auto;border-radius:24px;padding:20px 18px 22px;gap:12px}.about-head{margin-top:0}.about-title{font-size:24px}.about-bio{font-size:12px;margin:0}.about-stack{gap:8px}.about-stack h3,.lang-stack h3{font-size:11px}.about-tools{grid-template-columns:repeat(4,1fr);gap:5px}.tool-icon{width:28px;height:28px}.tool-tile{gap:3px}.tool-tile span:last-child{font-size:8px}.lang-buttons{gap:4px}.lang-btn{font-size:8.5px;padding:3px 8px}.lang-stack{gap:8px;padding-top:6px}.about-stats{display:none}}@media (max-width: 1400px){.archive-page{width:100%;aspect-ratio:auto;border-radius:24px;padding:20px 18px 22px;gap:12px}.archive-head{margin-top:0}.archive-list{margin-top:0;flex:1 1 auto;min-height:0;overflow:visible;max-height:none;gap:4px}.archive-toast{padding:4px 10px;gap:8px;border-radius:12px}.archive-pfp{width:26px;height:26px}.archive-author{font-size:12px}.archive-skill{font-size:8px}.archive-desc{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:9px;line-height:1.3;margin-top:0}}@media (max-width: 1400px){.contact-page{width:100%;aspect-ratio:auto;height:auto;border-radius:24px;padding:20px 18px 22px;gap:12px}.contact-head{margin-top:0;flex-direction:column;align-items:flex-start}.contact-page .about-title{font-size:24px}.dm-x-btn{margin-top:0}.contact-row{grid-template-columns:1fr;gap:12px}.contact-form{gap:12px}}@media (max-width: 1400px){.home-slot.is-hidden .card{display:none}}@media (max-width: 1400px){.card,.about-page,.archive-page,.contact-page,.notfound-page,.components-page{height:min(680px,calc(100svh - 192px));overflow:hidden}}@media (max-width: 1400px){.nav-bar{width:100%;height:64px;margin-top:16px}.nav-item{gap:3px;padding:4px 0}.nav-item svg{width:20px;height:20px}.nav-item-label{font-size:8px}.nav-glint{top:6px;bottom:6px;border-radius:18px}}.components-page{--page-radius: clamp(20px, 3.14cqw, 44px);width:min(1150px,90%);aspect-ratio:1400 / 780;border-radius:var(--page-radius);background:#151515;box-shadow:0 30px 80px #1918182e;padding:clamp(18px,2.2cqw,30px) clamp(44px,6cqw,88px) clamp(49px,5.2cqw,69px);display:flex;flex-direction:column;gap:clamp(12px,1.3cqw,18px);color:#f2f2f2;overflow:hidden}.components-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,1.6cqw,22px);flex:1 1 auto;min-height:0;align-content:start}.components-grid .component-card:nth-child(1){grid-column:1;grid-row:1}.components-grid .component-card:nth-child(2){grid-column:2;grid-row:1}.components-grid .component-card:nth-child(3){grid-column:1;grid-row:2}.components-grid .component-card:nth-child(4){grid-column:2;grid-row:2}.component-card{display:flex;flex-direction:column;gap:clamp(10px,1.1cqw,16px);background:#f5f5f0;border:1px solid #282828;border-radius:20px;padding:clamp(14px,1.6cqw,22px);min-height:0;overflow:hidden;transition:top .55s cubic-bezier(.16,1,.3,1),left .55s cubic-bezier(.16,1,.3,1),width .55s cubic-bezier(.16,1,.3,1),height .55s cubic-bezier(.16,1,.3,1)}.components-grid .component-card{background:linear-gradient(180deg,#fff,#ffffffeb,#fff0),#f5f5f0}.components-grid .component-card.is-expanded{background:#f5f5f0}.component-card.is-expanded{top:0;left:0;width:100%;height:100%;z-index:20;border-radius:var(--page-radius, 20px)}.component-card.is-expanded .wb-column,.component-preview .wb-column{gap:10px}.component-card.is-expanded .wb-water-button,.component-preview .wb-water-button{width:min(340px,85%)}.component-card.is-expanded .wb-pay-label,.component-card.is-expanded .wb-processing-label,.component-card.is-expanded .wb-result-label,.component-card.is-expanded .wb-retry-label,.component-card.is-expanded .wb-home-label,.component-preview .wb-pay-label{font-size:24px}.component-card.is-expanded .wb-toggle-option,.component-preview .wb-toggle-option{padding:6px 18px;font-size:13px}.component-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;position:relative;z-index:2}.component-head-right{display:flex;align-items:center;gap:10px}.component-name{font-size:clamp(12px,1.2cqw,16px);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#151515}.component-tag{font-size:clamp(8px,.8cqw,11px);font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#6b6b64;white-space:nowrap}.component-eye{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;border:1px solid #282828;background:#fff;color:#151515;cursor:pointer;transition:transform .15s ease,background .15s ease;flex:none}.component-eye:hover{transform:scale(1.08);background:#e9e9e4}.component-eye:active{transform:scale(.94)}.component-download{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;border:1px solid #282828;background:#fff;color:#151515;cursor:pointer;transition:transform .15s ease,background .15s ease;flex:none}.component-download:hover{transform:scale(1.08);background:#e9e9e4}.component-download:active{transform:scale(.94)}.component-card>.component-preview{transform:scale(.55);transform-origin:center;transition:transform .55s cubic-bezier(.16,1,.3,1)}.component-card.is-expanded>.component-preview{transform:scale(1)}@media (min-width: 1401px){.components-grid .component-card:nth-child(1)>.component-preview{transform:scale(.35)}.components-grid .component-card:nth-child(1).is-expanded>.component-preview{transform:scale(1)}.components-grid .component-card:nth-child(3)>.component-preview{transform:scale(.93)}.components-grid .component-card:nth-child(3).is-expanded>.component-preview{transform:scale(1)}.components-grid .component-card:nth-child(4)>.component-preview{transform:scale(.66)}.components-grid .component-card:nth-child(4).is-expanded>.component-preview{transform:scale(1)}}.component-card .ps-slider-wrap,.component-card.is-expanded .ps-slider-wrap{margin-top:22px}.component-card .ps-slide-text-wrap,.component-card.is-expanded .ps-slide-text-wrap{margin-bottom:0}@media (min-width: 1401px){.components-grid .component-card:nth-child(2)>.component-preview{transform:scale(.3);transform-origin:center;justify-content:center;transition:transform .55s cubic-bezier(.16,1,.3,1)}.components-grid .component-card:nth-child(2).is-expanded>.component-preview{transform:scale(1)}.components-grid .component-card:nth-child(2) .ps-slider-wrap{transform:none;margin-top:0}.components-grid .component-card:nth-child(2).is-expanded .ps-slider-wrap{margin-top:22px}}@media (min-width: 1401px){.components-grid .component-card:not(.is-expanded)>.component-preview,.components-grid .component-card:nth-child(2):not(.is-expanded)>.component-preview{padding-bottom:0}}.component-preview{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(10px,1.1cqw,16px)}.component-preview .ps-track:before,.component-preview .ps-track-chevrons,.component-preview .ps-slide-text svg animate{animation:none!important}.component-preview .ps-slide-text-wrap{transition:none!important}.wb-stage{display:flex;align-items:center;justify-content:center;flex:1 1 auto;min-height:0}.wb-home-view{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}.wb-home-view-icon{margin-bottom:4px}.wb-home-title{font-family:Inter,system-ui,sans-serif;font-size:28px;font-weight:600;color:#151515;letter-spacing:-.5px}.wb-home-sub{font-family:Inter,system-ui,sans-serif;font-size:15px;color:#a6a6a6}.wb-home-back{margin-top:10px;border:none;background:#151515;color:#fff;font-family:Inter,system-ui,sans-serif;font-size:14px;font-weight:600;padding:10px 24px;border-radius:999px;cursor:pointer;transition:transform .15s cubic-bezier(.22,1,.36,1),opacity .15s ease}.wb-home-back:hover{transform:translateY(-1px)}.wb-home-back:active{transform:translateY(1px)}.wb-column{display:flex;flex-direction:column;align-items:center;gap:24px;width:100%}.wb-toggle{position:relative;display:flex;background:#e6e6e0;border-radius:999px;padding:4px;gap:2px}.wb-toggle-option{flex:1 1 0;width:calc(50% - 1px);min-width:0;display:flex;align-items:center;justify-content:center;white-space:nowrap;position:relative;z-index:1;border:none;background:none;padding:8px 22px;border-radius:999px;font-family:Inter,system-ui,sans-serif;font-size:14px;font-weight:600;color:#6b6b64;cursor:pointer;transition:color .2s ease}.wb-toggle-option.active{color:#fff}.wb-toggle-option:disabled{cursor:default}.wb-toggle-thumb{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 5px);background:#181818;border-radius:999px;transition:left .25s cubic-bezier(.4,0,.2,1)}.wb-toggle-thumb.success{left:4px}.wb-toggle-thumb.failure{left:calc(50% + 1px)}.wb-water-button{width:min(516px,100%);aspect-ratio:516 / 106.9;height:auto;position:relative;z-index:0;border-radius:35px;overflow:hidden;box-shadow:0 6px 16px #0000001f;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;padding:0;background-color:transparent;background-size:100% 100%;background-repeat:no-repeat;background-position:0 0;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none}.component-preview .wb-water-button{box-shadow:none}.wb-pay-label,.wb-processing-label,.wb-result-label,.wb-retry-label,.wb-home-label{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:Inter,system-ui,-apple-system,sans-serif;font-weight:600;font-size:33px;letter-spacing:-.5px;white-space:nowrap;pointer-events:none}.wb-pay-label{color:#fff;text-shadow:0 4px 1.65px rgba(0,0,0,.13);transition:opacity .25s cubic-bezier(.22,1,.36,1),filter .25s cubic-bezier(.22,1,.36,1),transform .25s cubic-bezier(.22,1,.36,1)}.wb-water-button.processing .wb-pay-label,.wb-water-button.success .wb-pay-label,.wb-water-button.failed .wb-pay-label{opacity:0;filter:blur(8px);transform:translate(-50%,calc(-50% - 14px))}.wb-processing-label{display:flex;align-items:center;gap:12px;color:#fff;opacity:0;filter:blur(6px);transform:translate(-50%,calc(-50% + 10px));transition:opacity .4s cubic-bezier(.22,1,.36,1),filter .4s cubic-bezier(.22,1,.36,1),transform .4s cubic-bezier(.22,1,.36,1)}.wb-water-button.processing .wb-processing-label{opacity:1;filter:blur(0);transform:translate(-50%,-50%)}.wb-spinner{flex-shrink:0;width:32px;height:32px;border-radius:50%;border:3px solid rgba(255,255,255,.25);border-top-color:#fff;animation:wb-spin .8s linear infinite}@keyframes wb-spin{to{transform:rotate(360deg)}}.wb-shimmer-text{background:linear-gradient(100deg,#cfcfc9 25%,#9a9a94,#cfcfc9 55%,#cfcfc9);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:wb-shimmer 1.6s ease-in-out infinite}@keyframes wb-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.wb-result-label{opacity:0;filter:blur(6px);transform:translate(-50%,calc(-50% + 10px));transition:opacity .4s cubic-bezier(.22,1,.36,1),filter .4s cubic-bezier(.22,1,.36,1),transform .4s cubic-bezier(.22,1,.36,1)}.wb-water-button.success .wb-complete-label,.wb-water-button.failed .wb-failed-label{opacity:1;filter:blur(0);transform:translate(-50%,-50%)}.wb-water-button.failed .wb-failed-label{animation:wb-shiver .55s cubic-bezier(.36,.07,.19,.97) .15s both}@keyframes wb-shiver{0%,to{transform:translate(-50%,-50%) translate(0)}15%{transform:translate(-50%,-50%) translate(-12px)}30%{transform:translate(-50%,-50%) translate(9px)}45%{transform:translate(-50%,-50%) translate(-7px)}60%{transform:translate(-50%,-50%) translate(5px)}75%{transform:translate(-50%,-50%) translate(-3px)}90%{transform:translate(-50%,-50%) translate(2px)}}.wb-water-button.idle .wb-result-label{opacity:0;filter:blur(8px);transform:translate(-50%,calc(-50% - 14px));transition:opacity .25s cubic-bezier(.22,1,.36,1),filter .25s cubic-bezier(.22,1,.36,1),transform .25s cubic-bezier(.22,1,.36,1)}.wb-complete-label{display:flex;align-items:center;gap:10px;color:#4ade80}.wb-failed-label{display:flex;align-items:center;gap:10px;color:#f87171}.wb-retry-label{display:flex;align-items:center;gap:10px;color:#fff;opacity:0;filter:blur(6px);transform:translate(-50%,calc(-50% + 10px));transition:opacity .4s cubic-bezier(.22,1,.36,1),filter .4s cubic-bezier(.22,1,.36,1),transform .4s cubic-bezier(.22,1,.36,1)}.wb-water-button.retry .wb-retry-label{opacity:1;filter:blur(0);transform:translate(-50%,-50%)}.wb-water-button.retry .wb-failed-label{opacity:0;filter:blur(8px);transform:translate(-50%,calc(-50% - 14px));transition:opacity .25s cubic-bezier(.22,1,.36,1),filter .25s cubic-bezier(.22,1,.36,1),transform .25s cubic-bezier(.22,1,.36,1)}.wb-retry-icon{flex-shrink:0;transform:scale(.85);transition:transform .4s cubic-bezier(.22,1,.36,1)}.wb-water-button.retry .wb-retry-icon{transform:scale(1)}.wb-home-label{display:flex;align-items:center;gap:10px;color:#fff;opacity:0;filter:blur(6px);transform:translate(-50%,calc(-50% + 10px));transition:opacity .4s cubic-bezier(.22,1,.36,1),filter .4s cubic-bezier(.22,1,.36,1),transform .4s cubic-bezier(.22,1,.36,1)}.wb-water-button.home .wb-home-label{opacity:1;filter:blur(0);transform:translate(-50%,-50%)}.wb-water-button.home .wb-complete-label{opacity:0;filter:blur(8px);transform:translate(-50%,calc(-50% - 14px));transition:opacity .25s cubic-bezier(.22,1,.36,1),filter .25s cubic-bezier(.22,1,.36,1),transform .25s cubic-bezier(.22,1,.36,1)}.wb-home-icon{flex-shrink:0;transform:scale(.85);transition:transform .4s cubic-bezier(.22,1,.36,1)}.wb-water-button.home .wb-home-icon{transform:scale(1)}.wb-tick{flex-shrink:0;transform:scale(.85);transition:transform .4s cubic-bezier(.22,1,.36,1)}.wb-water-button.success .wb-tick,.wb-water-button.failed .wb-tick{transform:scale(1)}.wb-water-button.success .wb-processing-label,.wb-water-button.failed .wb-processing-label{opacity:0;filter:blur(8px);transform:translate(-50%,calc(-50% - 14px));transition:opacity .25s cubic-bezier(.22,1,.36,1),filter .25s cubic-bezier(.22,1,.36,1),transform .25s cubic-bezier(.22,1,.36,1)}@media (prefers-reduced-motion: reduce){.wb-spinner,.wb-shimmer-text,.wb-water-button.failed .wb-failed-label{animation:none!important}}.ps-stage{display:flex;align-items:center;justify-content:center;flex:1 1 auto;min-height:0}.ps-slider-wrap{display:flex;flex-direction:column;align-items:center;gap:16px;width:100%}.ps-slide-text-wrap{position:relative;width:54.4%;max-width:377.6px;pointer-events:none;margin-bottom:-14px;transition:opacity .15s ease-out}.ps-slider-wrap.smooth .ps-slide-text-wrap{transition:opacity .9s cubic-bezier(.22,1,.36,1)}.ps-slide-text{display:block;width:100%;height:auto}.ps-shell{position:relative;width:100%;max-width:693.849px;height:auto;display:flex;align-items:center;justify-content:center}.ps-track{position:relative;width:100%;aspect-ratio:693.849 / 156;height:auto;border-radius:999px;background:linear-gradient(200deg,#e7e7e7 4%,#06f 111%);background-size:calc(100% + var(--value, 0) * 1%);background-position:calc(var(--value, 0) * 1%) 50%;transition:background-size .15s ease-out,background-position .15s ease-out;border:1px solid #b1d0ff;box-shadow:0 14px 16.6px #0000001c;cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none;outline:none;overflow:hidden}.ps-track:focus-visible{box-shadow:0 14px 16.6px #0000001c,0 0 0 3px #106af28c}.ps-track.smooth{transition:background-size .9s cubic-bezier(.22,1,.36,1),background-position .9s cubic-bezier(.22,1,.36,1)}.ps-track:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:linear-gradient(200deg,#e7e7e7 4%,#06f 111%);background-size:calc(100% + var(--value, 0) * 1%);background-position:calc(var(--value, 0) * 1%) 50%;transition:background-size .15s ease-out,background-position .15s ease-out;animation:ps-gradient-sway 4.5s ease-in-out infinite alternate;pointer-events:none}.ps-track.smooth:before{transition:background-size .9s cubic-bezier(.22,1,.36,1),background-position .9s cubic-bezier(.22,1,.36,1)}@keyframes ps-gradient-sway{0%{transform:translate(-3%)}to{transform:translate(3%)}}.ps-chevron-fade{position:absolute;left:36%;top:19.81%;width:25.99%;height:60.38%;pointer-events:none;z-index:1;transition:opacity .15s ease-out}.ps-track.smooth .ps-chevron-fade{transition:opacity .9s cubic-bezier(.22,1,.36,1)}.ps-track-chevrons{display:block;width:100%;height:100%;animation:ps-chevron-flow 2.2s ease-in-out infinite}@keyframes ps-chevron-flow{0%{opacity:0;transform:translate(-8px)}25%{opacity:.9}75%{opacity:.9}to{opacity:0;transform:translate(24px)}}.ps-handle{position:absolute;top:50%;width:30.95%;aspect-ratio:214.75 / 130;height:auto;border-radius:999px;background:linear-gradient(184deg,#fff 4.7%,#b9d5ff 151%);border:2px solid #cce0ff;box-shadow:0 4px 2px #00000017;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;cursor:grab;touch-action:none;will-change:left;z-index:2}.ps-handle:active{cursor:grabbing}.ps-handle.smooth{transition:left .9s cubic-bezier(.22,1,.36,1)}.ps-handle .ps-pen-icon{display:block;pointer-events:none;width:61%;height:auto}.ps-track,.ps-handle{-webkit-tap-highlight-color:transparent}@media (max-width: 1400px){.components-page{--page-radius: 24px;width:100%;aspect-ratio:auto;border-radius:24px;padding:20px 18px 22px;gap:12px;position:relative}.components-head{margin-top:0}.components-page .about-title{font-size:18px}.components-page .about-bio{font-size:10px;line-height:1.25}.components-page .about-head{gap:3px}.components-grid{grid-template-columns:1fr;gap:10px;overflow-y:auto;scrollbar-width:none;overflow-anchor:none;scroll-snap-type:y proximity}.components-grid::-webkit-scrollbar{display:none}.components-grid .component-card:nth-child(1){grid-column:1;grid-row:1}.components-grid .component-card:nth-child(2){grid-column:1;grid-row:2}.components-grid .component-card:nth-child(3){grid-column:1;grid-row:3}.components-grid .component-card:nth-child(4){grid-column:1;grid-row:4}.component-card{padding:12px 14px 16px;gap:8px;border-radius:16px}.components-grid .component-card{min-height:96px;scroll-snap-align:start}.components-grid .component-card>.component-preview{transform:scale(.45)}.components-grid .component-card.is-expanded>.component-preview{transform:scale(1)}.component-card .wb-water-button,.component-card.is-expanded .wb-water-button{width:300px}.component-card .wb-column,.component-card.is-expanded .wb-column{gap:14px}.component-card .wb-toggle,.component-card.is-expanded .wb-toggle{padding:4px}.component-card .wb-toggle-option,.component-card.is-expanded .wb-toggle-option{font-size:12px;padding:6px 16px}.component-card .wb-pay-label,.component-card .wb-processing-label,.component-card .wb-result-label,.component-card .wb-retry-label,.component-card .wb-home-label,.component-card.is-expanded .wb-pay-label,.component-card.is-expanded .wb-processing-label,.component-card.is-expanded .wb-result-label,.component-card.is-expanded .wb-retry-label,.component-card.is-expanded .wb-home-label{font-size:20px}.component-card .ps-slider-wrap,.component-card.is-expanded .ps-slider-wrap{max-width:303px;transform:none}.components-grid .component-card:nth-child(2) .ps-slider-wrap{transition:transform .55s cubic-bezier(.16,1,.3,1)}.components-grid .component-card:nth-child(2):not(.is-expanded) .ps-slider-wrap{transform:translateY(-10px)}.component-card .wwm-button,.component-card.is-expanded .wwm-button{transform:none}.component-card.is-expanded{border-radius:var(--page-radius, 24px)}.component-name{font-size:12px}.component-tag{font-size:8px}.component-eye,.component-download{width:26px;height:26px}.wb-column{gap:14px}.wb-toggle-option{padding:6px 16px;font-size:12px}.wb-pay-label,.wb-processing-label,.wb-result-label,.wb-retry-label,.wb-home-label{font-size:20px}.wb-spinner{width:22px;height:22px}.wb-water-button{border-radius:24px}.ps-slide-text-wrap{margin-bottom:-8px}}.atc-wrap{display:inline-block;padding:14px;margin:-14px;border-radius:30px;cursor:pointer}.component-card.is-expanded .atc-wrap{margin:auto;padding:14px}.component-card>.component-preview .atc-wrap{margin:auto;padding:14px;pointer-events:none}.atc-wrap:hover .atc-btn{transform:translateY(-2px);background:#26262a;box-shadow:inset 0 1px #ffffff29,inset 0 -2px 4px #0000008c,0 2px 4px #00000040,0 14px 34px -10px #0006}.atc-wrap:hover .atc-btn:after{background:linear-gradient(180deg,#ffffff3d,#fff0)}.atc-btn{position:relative;display:inline-flex;align-items:center;gap:12px;padding:18px 30px;border:none;border-radius:16px;background:#1d1d1f;color:#fff;font:600 16px/1 -apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;letter-spacing:.01em;cursor:pointer;-webkit-user-select:none;user-select:none;overflow:hidden;box-shadow:inset 0 1px #ffffff1f,inset 0 -2px 4px #0009,0 1px 2px #00000040,0 8px 24px -8px #00000059;transition:transform .18s cubic-bezier(.34,1.56,.64,1),box-shadow .25s ease,background .25s ease}.component-preview .atc-btn{box-shadow:inset 0 1px #ffffff1f,inset 0 -2px 4px #0009,0 1px 2px #00000040,0 8px 24px -8px #00000059}.atc-btn:after{content:"";position:absolute;top:2px;left:6px;right:6px;height:45%;border-radius:999px;background:linear-gradient(180deg,#ffffff38,#fff0);-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 25%,#000 75%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0%,#000 25%,#000 75%,transparent 100%);pointer-events:none}.atc-morph{position:relative;width:var(--label-w, 90px);height:18px;display:grid;place-items:center}.atc-morph .atc-t1,.atc-morph .atc-t2{grid-area:1/1;white-space:nowrap}.atc-morph .atc-t1{opacity:1;filter:blur(0)}.atc-morph .atc-t2{display:inline-flex;align-items:center;gap:8px;opacity:0;filter:blur(7px)}.atc-morph .atc-check{width:18px;height:18px;transform:scale(0) rotate(-25deg);opacity:0}.atc-cart{position:relative;width:26px;height:26px;display:grid;place-items:center;flex:none}.atc-cart svg{width:26px;height:26px;display:block}@media (max-width: 1400px){.player-art{left:5%;top:180px;width:96px;height:96px;border-radius:20px;border-width:4px}.player-top{top:calc(38% + 10px);right:3%;gap:8px}.player-search-btn{padding:6px 12px}.player-search-label{font-size:11px}.player-exit{padding:6px 14px;font-size:12px}.player-meta{top:50%;left:0;right:0;padding:0 5%;align-items:center;text-align:center}.player-title{font-size:18px}.player-progress{top:63%;left:5%;right:5%}.player-bottom{display:contents}.player-controls{position:absolute;right:50%;transform:translate(50%);top:calc(66% + 30px);bottom:auto;gap:8px;padding-right:0}.player-side{position:absolute}.player-ctl{width:40px;height:40px}.player-ctl-sm{width:34px;height:34px}.player-play{width:52px;height:52px}.player-ctl svg{width:20px;height:20px}.player-ctl-sm svg{width:16px;height:16px}.player-play svg{width:24px;height:24px}.player-vol{position:absolute;right:5%;bottom:28px}.player-vol-slider{width:70px}.player-side{left:5%;bottom:18px}.player-lyrics-btn{padding:6px 12px;font-size:11px}}@media (min-width: 769px) and (max-width: 1400px){.card,.about-page,.archive-page,.contact-page,.notfound-page,.components-page{width:min(430px,100%);margin-left:auto;margin-right:auto;height:min(680px,calc(100svh - 192px))}.archive-list{overflow-y:auto}.nav-bar{width:min(430px,100%);margin-left:auto;margin-right:auto}}