@import"https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@300&family=Noto+Sans+SC:wght@300&display=swap";*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;font-size:16px;text-rendering:optimizeLegibility}body{min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content-visibility:auto;contain:style layout}ul,ol{list-style:none}a{text-decoration:none;color:inherit;transition:color var(--dur-base) var(--ease-smooth)}img{display:block;max-width:100%}button{border:none;background:none;cursor:pointer;font-family:inherit}*{font-weight:inherit}b,strong{font-weight:300}:root{--bg-primary: #0a0a0f;--bg-secondary: #0f0f17;--bg-tertiary: #161625;--glass-bg: rgba(255, 255, 255, .04);--glass-bg-hover: rgba(255, 255, 255, .08);--glass-border: rgba(255, 255, 255, .08);--glass-border-hover: rgba(255, 255, 255, .16);--text-primary: rgba(255, 255, 255, .87);--text-secondary: rgba(255, 255, 255, .58);--text-tertiary: rgba(255, 255, 255, .32);--accent-fog-blue: #6e8fad;--accent-smoke-purple: #8878a8;--accent-ink-cyan: #5d8a87;--accent-mist-rose: #97788a;--accent-fog-blue-alpha: rgba(110, 143, 173, .25);--shadow-soft: 0 8px 32px rgba(0, 0, 0, .35);--shadow-glow: 0 0 24px rgba(110, 143, 173, .08);--shadow-elevated: 0 16px 48px rgba(0, 0, 0, .4);--font-en: "Josefin Sans", sans-serif;--font-cn: "Noto Sans SC", sans-serif;--font-weight: 300;--ls-base: 2px;--ls-title: 5px;--ls-hero: 10px;--ts-base: 0 0 8px rgba(255, 255, 255, .08);--ts-title: 0 0 16px rgba(110, 143, 173, .15);--ts-hero: 0 0 30px rgba(110, 143, 173, .2), 0 0 60px rgba(110, 143, 173, .1);--nav-h: 72px;--max-w: 1200px;--radius: 16px;--radius-lg: 24px;--sp-xs: 8px;--sp-sm: 16px;--sp-md: 28px;--sp-lg: 48px;--sp-xl: 80px;--sp-2xl: 120px;--ease-out: cubic-bezier(.22, .61, .36, 1);--ease-smooth: cubic-bezier(.4, 0, .2, 1);--dur-fast: .2s;--dur-base: .4s;--dur-slow: .8s;--dur-glacial: 1.2s}body{font-family:var(--font-en),var(--font-cn),sans-serif;font-weight:var(--font-weight);letter-spacing:var(--ls-base);color:var(--text-primary);text-shadow:var(--ts-base);background-color:var(--bg-primary)}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:999px}::-webkit-scrollbar-thumb:hover{background:#ffffff4d}*{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.15) transparent}::selection{background:var(--accent-fog-blue-alpha);color:#fff}*:focus-visible{outline:2px solid var(--accent-fog-blue);outline-offset:2px}.container{max-width:var(--max-w);margin-left:auto;margin-right:auto;padding-left:var(--sp-md);padding-right:var(--sp-md)}h1,h2,h3,h4,h5,h6{line-height:1.2;letter-spacing:var(--ls-title);text-shadow:var(--ts-title)}h1{font-size:2.5rem}h2{font-size:2rem}h3{font-size:1.5rem}h4{font-size:1.25rem}p{line-height:1.8;margin-bottom:var(--sp-sm);color:var(--text-secondary)}.main-content{position:relative;z-index:1;padding-top:var(--nav-h);min-height:100vh}.page-header{text-align:center;padding:var(--sp-xl) var(--sp-md) var(--sp-md)}.page-title{margin-bottom:var(--sp-xs);letter-spacing:var(--ls-title)}.page-subtitle{color:var(--text-tertiary);font-size:1.1rem}.mini-player{position:fixed;bottom:var(--sp-md);left:50%;transform:translate(-50%);z-index:900;display:flex;align-items:center;gap:var(--sp-sm);padding:var(--sp-xs) var(--sp-md) var(--sp-xs) var(--sp-xs);background:#0a0a0fd9;backdrop-filter:blur(16px) saturate(1.2);-webkit-backdrop-filter:blur(16px) saturate(1.2);border:1px solid var(--glass-border);border-radius:50px;box-shadow:0 8px 32px #0006;opacity:0;pointer-events:none;transform:translate(-50%) translateY(20px);transition:opacity var(--dur-base) var(--ease-smooth),transform var(--dur-base) var(--ease-smooth)}.mini-player.visible{opacity:1;pointer-events:auto;transform:translate(-50%) translateY(0)}.mini-player__art{flex-shrink:0;width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#1a2535,#0d1520)}.mini-player__info{flex:1;min-width:0}.mini-player__name{font-size:.82rem;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}.mini-player__artist{font-size:.7rem;color:var(--text-tertiary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini-player__play{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:var(--accent-fog-blue-alpha);border:1px solid rgba(110,143,173,.2);cursor:pointer;transition:all var(--dur-fast) var(--ease-smooth)}.mini-player__play:hover{background:#6e8fad40;transform:scale(1.05)}.mini-player__play-icon{font-size:1rem;color:var(--accent-fog-blue);line-height:1}.mini-player__link{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;color:var(--text-tertiary);text-decoration:none;transition:color var(--dur-fast) var(--ease-smooth)}.mini-player__link:hover{color:var(--text-primary)}.glass-card{background:var(--glass-bg);backdrop-filter:blur(18px) saturate(1.15);-webkit-backdrop-filter:blur(18px) saturate(1.15);border:1px solid var(--glass-border);border-radius:var(--radius);padding:var(--sp-lg);box-shadow:var(--shadow-soft);transition:transform var(--dur-base) var(--ease-smooth),box-shadow var(--dur-base) var(--ease-smooth),background var(--dur-base) var(--ease-smooth),border-color var(--dur-base) var(--ease-smooth);will-change:transform,box-shadow}.glass-card:hover{background:var(--glass-bg-hover);border-color:var(--glass-border-hover);transform:translateY(-3px);box-shadow:var(--shadow-elevated)}.glass-card:active{transform:scale(.975);transition-duration:.15s}.glass-card-lg{background:var(--glass-bg);backdrop-filter:blur(24px) saturate(1.15);-webkit-backdrop-filter:blur(24px) saturate(1.15);border:1px solid var(--glass-border);border-radius:var(--radius-lg);padding:var(--sp-xl);box-shadow:var(--shadow-soft);transition:transform var(--dur-base) var(--ease-smooth),box-shadow var(--dur-base) var(--ease-smooth),background var(--dur-base) var(--ease-smooth),border-color var(--dur-base) var(--ease-smooth);will-change:transform,box-shadow}.glass-card-lg:hover{background:var(--glass-bg-hover);border-color:var(--glass-border-hover);transform:translateY(-3px);box-shadow:var(--shadow-elevated)}.glass-card-lg:active{transform:scale(.975);transition-duration:.15s}.glass-card-hover-glow{transition:transform var(--dur-base) var(--ease-smooth),box-shadow var(--dur-base) var(--ease-smooth),background var(--dur-base) var(--ease-smooth),border-color var(--dur-base) var(--ease-smooth)}.glass-card-hover-glow:hover{box-shadow:var(--shadow-soft),var(--shadow-glow)}.glass-nav{position:fixed;top:0;left:0;right:0;height:var(--nav-h);display:flex;align-items:center;justify-content:center;padding:0;background:#0a0a0fa6;backdrop-filter:blur(20px) saturate(1.2);-webkit-backdrop-filter:blur(20px) saturate(1.2);border-bottom:1px solid var(--glass-border);z-index:1000}.glass-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-xs);padding:10px 30px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:999px;font-family:var(--font-en),var(--font-cn),sans-serif;font-weight:var(--font-weight);font-size:.85rem;letter-spacing:var(--ls-base);color:var(--text-secondary);cursor:pointer;transition:background var(--dur-fast) var(--ease-smooth),border-color var(--dur-fast) var(--ease-smooth),color var(--dur-fast) var(--ease-smooth),transform var(--dur-fast) var(--ease-smooth),box-shadow var(--dur-fast) var(--ease-smooth)}.glass-btn:hover{background:var(--glass-bg-hover);border-color:var(--accent-fog-blue-alpha);color:var(--text-primary)}.glass-btn:active{transform:scale(.95)}.glass-btn-accent{background:#6e8fad1a;border-color:var(--accent-fog-blue-alpha);color:var(--text-primary)}.glass-btn-accent:hover{background:#6e8fad2e;border-color:var(--accent-fog-blue);box-shadow:var(--shadow-glow)}.glass-input{width:100%;padding:12px 0;background:#ffffff05;border:none;border-bottom:2px solid var(--glass-border);border-radius:0;outline:none;font-family:var(--font-en),var(--font-cn),sans-serif;font-weight:var(--font-weight);font-size:1rem;letter-spacing:var(--ls-base);color:var(--text-primary);transition:border-color var(--dur-base) var(--ease-smooth),background var(--dur-base) var(--ease-smooth)}.glass-input:focus{border-bottom-color:var(--accent-fog-blue);background:#ffffff0a}.glass-input::placeholder{color:var(--text-tertiary)}.glass-tag{display:inline-block;padding:5px 16px;border-radius:999px;font-family:var(--font-en),var(--font-cn),sans-serif;font-weight:var(--font-weight);font-size:.72rem;letter-spacing:var(--ls-base);color:var(--text-tertiary);background:#ffffff08;border:1px solid rgba(255,255,255,.06);cursor:default;transition:background var(--dur-fast) var(--ease-smooth),color var(--dur-fast) var(--ease-smooth)}.glass-tag:hover{background:#ffffff0f;color:var(--text-secondary)}.glass-divider{height:1px;margin:var(--sp-lg) 0;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.08) 50%,transparent 100%);border:none}.glass-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;background:#0009;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:2000;opacity:0;pointer-events:none;visibility:hidden;transition:opacity var(--dur-slow) var(--ease-smooth),visibility var(--dur-slow) var(--ease-smooth)}.glass-modal-overlay.active{opacity:1;pointer-events:auto;visibility:visible}.glass-modal-content{background:var(--glass-bg);backdrop-filter:blur(24px) saturate(1.15);-webkit-backdrop-filter:blur(24px) saturate(1.15);border:1px solid var(--glass-border);border-radius:var(--radius-lg);padding:var(--sp-xl);box-shadow:var(--shadow-elevated);max-width:600px;width:calc(100% - var(--sp-lg) * 2);max-height:calc(100vh - var(--sp-xl) * 2);overflow-y:auto;transform:scale(.95);opacity:0;transition:transform var(--dur-slow) var(--ease-smooth),opacity var(--dur-slow) var(--ease-smooth)}.glass-modal-overlay.active .glass-modal-content{transform:scale(1);opacity:1}@keyframes breathe{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.015);opacity:.92}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(25px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInScale{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes floatGentle{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes glowPulse{0%,to{box-shadow:0 0 20px #6e8fad0f}50%{box-shadow:0 0 40px #6e8fad1f}}@keyframes typewriter{0%{width:0}to{width:100%}}@keyframes cursorBlink{0%,to{border-right-color:transparent}50%{border-right-color:var(--text-primary)}}@keyframes liquidShift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes hueRotate{0%{filter:hue-rotate(0deg)}to{filter:hue-rotate(360deg)}}.anim-breathe{animation:breathe 8s ease-in-out infinite}.anim-float{animation:floatGentle 6s ease-in-out infinite}.anim-glow{animation:glowPulse 4s ease-in-out infinite}.anim-fade-in{animation:fadeIn .6s var(--ease-out) forwards}.anim-fade-in-up{animation:fadeInUp .8s var(--ease-out) forwards}.scroll-reveal{opacity:0;transform:translateY(25px);transition:opacity var(--dur-slow) var(--ease-out),transform var(--dur-slow) var(--ease-out);will-change:opacity,transform}.scroll-reveal.revealed{opacity:1;transform:translateY(0)}.scroll-reveal-delay-1{transition-delay:.1s}.scroll-reveal-delay-2{transition-delay:.2s}.scroll-reveal-delay-3{transition-delay:.3s}.scroll-reveal-delay-4{transition-delay:.4s}.scroll-reveal-delay-5{transition-delay:.5s}.page-enter{opacity:0;transform:translateY(10px)}.page-enter-active{opacity:1;transform:translateY(0);transition:opacity var(--dur-glacial) var(--ease-out),transform var(--dur-glacial) var(--ease-out)}.page-loading{opacity:0}
