:root[data-theme=dark]{--bg: #0b1020;--ink: #e8ecf8;--muted: #93a1bb;--card: rgba(255, 255, 255, .055);--card-border: rgba(255, 255, 255, .1);--accent: #ff5e7a;--accent-2: #6c8cff;--gradient: linear-gradient(120deg, #6c8cff, #a06cff 45%, #ff5e7a);--glow-a: rgba(108, 140, 255, .28);--glow-b: rgba(255, 94, 122, .22);--glow-c: rgba(160, 108, 255, .2);--shadow: 0 10px 30px rgba(0, 0, 0, .35)}:root[data-theme=light]{--bg: #f2f5fc;--ink: #1d2740;--muted: #66738e;--card: rgba(255, 255, 255, .8);--card-border: rgba(29, 39, 64, .08);--accent: #e6397c;--accent-2: #4a6bff;--gradient: linear-gradient(120deg, #4a6bff, #9b59ff 45%, #e6397c);--glow-a: rgba(74, 107, 255, .15);--glow-b: rgba(230, 57, 124, .12);--glow-c: rgba(155, 89, 255, .12);--shadow: 0 10px 30px rgba(29, 39, 64, .1)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;background:var(--bg);color:var(--ink);line-height:1.7;transition:background .35s ease,color .35s ease;overflow-x:hidden}body:before,body:after{content:"";position:fixed;z-index:-1;border-radius:50%;filter:blur(90px);pointer-events:none}body:before{width:46vw;height:46vw;top:-18vh;left:-12vw;background:radial-gradient(circle,var(--glow-a),transparent 70%)}body:after{width:50vw;height:50vw;bottom:-22vh;right:-14vw;background:radial-gradient(circle,var(--glow-b),transparent 70%)}.wrap{max-width:1000px;margin:0 auto;padding:0 22px}#progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--gradient);z-index:50;border-radius:0 4px 4px 0}nav{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--bg) 72%,transparent);backdrop-filter:blur(14px);border-bottom:1px solid var(--card-border)}nav .wrap{display:flex;align-items:center;gap:16px;height:60px}nav .logo{margin-right:auto;font-weight:800;font-size:19px;text-decoration:none;background:var(--gradient);-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:.5px}nav a.item{color:var(--muted);text-decoration:none;font-size:15px;padding:6px 10px;border-radius:10px;transition:all .2s}nav a.item:hover{color:var(--ink);background:var(--card)}nav a.item.join{color:#fff;background:var(--gradient);font-weight:700;box-shadow:0 4px 14px var(--glow-a)}nav a.item.join:hover{transform:translateY(-2px);color:#fff}#themeBtn{border:1px solid var(--card-border);background:var(--card);color:var(--ink);border-radius:12px;width:38px;height:38px;cursor:pointer;font-size:17px;transition:transform .2s}#themeBtn:hover{transform:rotate(15deg) scale(1.08)}header.hero{padding:90px 0 70px;text-align:center;position:relative}header.hero h1{font-size:clamp(44px,8vw,76px);margin:0;letter-spacing:2px;font-weight:800;background:var(--gradient);-webkit-background-clip:text;background-clip:text;color:transparent}header.hero .slogan{font-size:clamp(17px,2.6vw,22px);color:var(--muted);min-height:1.8em;margin:14px 0 26px}header.hero .slogan .caret{display:inline-block;width:2px;height:1.05em;background:var(--accent-2);vertical-align:-.18em;animation:blink 1s steps(1) infinite}@keyframes blink{50%{opacity:0}}.hero .avatar{width:116px;height:116px;border-radius:50%;object-fit:cover;border:3px solid transparent;background:var(--gradient);padding:3px;box-shadow:var(--shadow);margin-bottom:18px}.hero .avatar.Photo{display:none}.cta{display:flex;gap:14px;justify-content:center;margin-top:8px;flex-wrap:wrap}.btn{display:inline-block;padding:12px 30px;border-radius:999px;text-decoration:none;font-weight:700;font-size:15px;transition:transform .18s ease,box-shadow .18s ease}.btn.primary{color:#fff;background:var(--gradient);box-shadow:0 8px 24px var(--glow-a)}.btn.ghost{color:var(--ink);border:1.5px solid var(--card-border);background:var(--card)}.btn:hover{transform:translateY(-3px)}.float-note{position:absolute;opacity:.5;animation:floaty 7s ease-in-out infinite;font-size:26px;pointer-events:none}@keyframes floaty{0%,to{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(-26px) rotate(8deg)}}section{padding:46px 0}section h2{font-size:26px;margin:0 0 20px;font-weight:800}section h2 .hl{background:var(--gradient);-webkit-background-clip:text;background-clip:text;color:transparent}.about-text{white-space:pre-line;color:var(--muted);font-size:16.5px;max-width:760px;margin:0}.tagwall{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}.tagwall span{padding:7px 18px;border-radius:999px;font-size:14px;border:1px solid var(--card-border);background:var(--card);color:var(--muted);cursor:default;transition:all .2s}.tagwall span:hover{color:#fff;background:var(--gradient);border-color:transparent;transform:translateY(-2px)}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}.card{background:var(--card);border:1px solid var(--card-border);border-radius:20px;padding:18px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:10px;backdrop-filter:blur(12px);transition:transform .22s ease,box-shadow .22s ease}.card:hover{transform:translateY(-6px);box-shadow:0 18px 40px var(--glow-a)}.card h3{margin:0;font-size:17px}.card .note{color:var(--muted);font-size:13px}.card .row{display:flex;align-items:center;justify-content:space-between;gap:10px}.cover{height:150px;border-radius:16px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;font-size:44px;background:linear-gradient(135deg,#2b3a67,#6c8cff 55%,#ff5e7a);color:#fff}.cover img{width:100%;height:150px;object-fit:cover;display:block}.cover .hole{position:absolute;width:14px;height:14px;border-radius:50%;background:#0000008c;border:2px solid rgba(255,255,255,.65)}.playing .cover{animation:spin 3.2s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.eq{display:none;align-items:flex-end;gap:3px;height:16px}.playing .eq{display:flex}.eq i{width:4px;background:var(--gradient);border-radius:2px;animation:bounce .9s ease-in-out infinite}.eq i:nth-child(2){animation-delay:.18s}.eq i:nth-child(3){animation-delay:.36s}.eq i:nth-child(4){animation-delay:.54s}.eq i{height:16px}@keyframes bounce{0%,to{transform:scaleY(.35)}50%{transform:scaleY(1)}}audio{width:100%}audio::-webkit-media-controls-panel{background:var(--card)}.like{border:none;background:none;cursor:pointer;font-size:17px;line-height:1;padding:6px 8px;border-radius:10px;color:var(--muted);transition:transform .15s}.like:hover{transform:scale(1.25)}.like.on{color:var(--accent);animation:pop .3s ease}@keyframes pop{40%{transform:scale(1.5)}}.video-card iframe{width:100%;aspect-ratio:16 / 9;border:0;border-radius:14px;background:#000}.comment-box{min-height:90px}.empty{color:var(--muted);background:var(--card);border:1px dashed var(--card-border);border-radius:20px;padding:22px;font-size:14px;text-align:center}.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease}.reveal.in{opacity:1;transform:none}.contact-list{display:flex;flex-wrap:wrap;gap:12px}.contact-list a{background:var(--card);padding:11px 22px;border-radius:999px;color:var(--ink);text-decoration:none;border:1px solid var(--card-border);font-size:15px;transition:all .2s}.contact-list a:hover{color:#fff;background:var(--gradient);border-color:transparent}footer.site{padding:34px 0 44px;text-align:center;color:var(--muted);font-size:14px}#mini{position:fixed;left:50%;bottom:18px;transform:translate(-50%);z-index:60;width:min(560px,calc(100vw - 32px));display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:18px;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(16px);border:1px solid var(--card-border);box-shadow:var(--shadow);animation:rise .35s ease}@keyframes rise{0%{transform:translate(-50%,14px);opacity:0}}.mini-cover{width:44px;height:44px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;background:repeating-radial-gradient(circle at 50% 50%,#15161b 0 1.5px,#1e2027 1.5px 3px);box-shadow:inset 0 0 0 1px #ffffff12,0 2px 8px #00000059}.mini-cover .disc-label{position:relative;width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-style:normal;color:#fff;background:linear-gradient(135deg,#2b3a67,#6c8cff 55%,#ff5e7a);background-size:cover;background-position:center;box-shadow:0 0 0 2px #0a0b0f99}.mini-cover .disc-label:after{content:"";width:4px;height:4px;border-radius:50%;background:#0a0b0f;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #ffffff26}.mini-cover.spin{animation:spin 3.2s linear infinite}.mini-info{flex:1;min-width:0}.mini-info strong{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini-bar{height:4px;border-radius:2px;background:var(--card-border);margin-top:6px;overflow:hidden}.mini-bar i{display:block;height:100%;width:0;background:var(--gradient);border-radius:2px;transition:width .2s linear}#mini button{border:1px solid var(--card-border);background:var(--card);color:var(--ink);border-radius:12px;width:34px;height:34px;cursor:pointer;font-size:14px;flex:none}#mini button:hover{background:var(--gradient);color:#fff;border-color:transparent}#toTop{position:fixed;right:20px;bottom:20px;z-index:55;width:42px;height:42px;border-radius:50%;cursor:pointer;border:1px solid var(--card-border);background:var(--card);color:var(--ink);backdrop-filter:blur(10px);font-size:17px;opacity:0;pointer-events:none;transform:translateY(8px);transition:opacity .3s,transform .3s}#toTop.show{opacity:1;pointer-events:auto;transform:none}#toTop:hover{background:var(--gradient);color:#fff;border-color:transparent}#mini~#toTop,#mini:not([hidden])~#toTop{bottom:84px}@media(max-width:640px){header.hero{padding:56px 0 44px}nav .wrap{flex-wrap:wrap;height:auto;row-gap:2px;padding:10px 16px 8px}nav .logo{width:100%;font-size:17px}nav .item{flex:1 1 auto;text-align:center;font-size:13px;padding:7px 6px}.btn{padding:11px 24px;font-size:14px}.grid{grid-template-columns:1fr}.cover{height:170px}#mini{bottom:12px;padding:8px 10px;gap:10px}#mini~#toTop{bottom:76px}#toTop{right:14px}}:focus-visible{outline:2px solid var(--accent-2);outline-offset:3px;border-radius:8px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent-2);outline-offset:2px}.skip-link{position:absolute;left:-9999px;top:0;z-index:100;background:var(--accent);color:#fff;padding:10px 16px;border-radius:0 0 12px}.skip-link:focus{left:0}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.reveal{opacity:1!important;transform:none!important}header.hero .slogan .caret{display:none}}@media(min-width:641px)and (max-width:900px){.wrap{padding:0 18px}.grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
