/* 皮肤: 通过 <html data-skin="..."> 切换。classic 为默认(不需要覆盖)。 */
html[data-skin=space],html[data-skin=aurora],html[data-skin=neon]{color-scheme:dark}
html[data-skin=space],html[data-skin=aurora],html[data-skin=neon]{--ok-t:#5ce0a8;--warn-t:#ffd25a;--out-t:#ff8fa3;--new-t:#b9a8ff;--ok-bg:#0d3a2d;--warn-bg:#3e3410;--low-bg:#43230f;--out-bg:#471826;--new-bg:#2a2160}
html[data-skin=space] .notice span,html[data-skin=aurora] .notice span,html[data-skin=neon] .notice span{color:var(--muted)}
html[data-skin=space] .flash,html[data-skin=aurora] .flash,html[data-skin=neon] .flash{border-color:transparent}
html[data-skin=space] input:focus,html[data-skin=aurora] input:focus,html[data-skin=neon] input:focus,html[data-skin=space] select:focus,html[data-skin=aurora] select:focus,html[data-skin=neon] select:focus{outline-color:var(--brand)}
html[data-skin=space] ::-webkit-scrollbar,html[data-skin=aurora] ::-webkit-scrollbar,html[data-skin=neon] ::-webkit-scrollbar{width:9px;height:9px}
html[data-skin=space] ::-webkit-scrollbar-thumb,html[data-skin=aurora] ::-webkit-scrollbar-thumb,html[data-skin=neon] ::-webkit-scrollbar-thumb{background:var(--line);border-radius:5px}
html[data-skin] .shell,html[data-skin] .authwrap{position:relative;z-index:1}

/* 深空科技 */
html[data-skin=space]{--bg:#070d1c;--card:#0d1a33;--ink:#dce9ff;--ink2:#a9c3ee;--muted:#8aa6d6;--line:#1d3f7a;--line2:#16305c;--brand:#2f8bff;--brand-d:#1b6fe0;--side:#050a16;--top:#050a16;--head:#0a1630;--hover:#0f2142;--soft:#10305e;--btn-line:#25508f;--btn-h:#17356a;--input:#09142a;--side-ink:#aac3ee;--side-hov:#10224a;--side-mut:#5f7bb0}
html[data-skin=space] body{background:radial-gradient(1000px 600px at 92% -10%,rgba(47,123,255,.20),transparent 60%),radial-gradient(800px 500px at -10% 105%,rgba(39,211,255,.11),transparent 60%),var(--bg)}
html[data-skin=space] body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;background-image:linear-gradient(rgba(70,130,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(70,130,255,.06) 1px,transparent 1px);background-size:38px 38px}
html[data-skin=space] .card,html[data-skin=space] .stat,html[data-skin=space] .whbox,html[data-skin=space] .sidepanel{box-shadow:0 0 22px rgba(47,123,255,.07) inset}
html[data-skin=space] .top{border-bottom:1px solid #12306a;box-shadow:0 1px 18px rgba(39,139,255,.25)}
html[data-skin=space] .btn.primary{box-shadow:0 0 14px rgba(47,139,255,.45)}

/* 极光 */
html[data-skin=aurora]{--bg:#0a0920;--card:rgba(24,20,60,.78);--ink:#ece8ff;--ink2:#c9c0f5;--muted:#a79fd6;--line:#3b3485;--line2:#2b2563;--brand:#8b7bff;--brand-d:#6f5df0;--side:rgba(12,10,36,.88);--top:rgba(12,10,36,.82);--head:rgba(36,30,86,.75);--hover:rgba(46,38,108,.55);--soft:rgba(68,56,150,.45);--btn-line:#4b43a3;--btn-h:rgba(70,60,150,.6);--input:rgba(14,12,40,.8);--side-ink:#cfc8fb;--side-hov:rgba(80,68,170,.35);--side-mut:#8279c4;--cy:#5ef2d6;--bl:#8b7bff;--tline:#43399a;--tg1:rgba(139,123,255,.30);--tg2:rgba(94,242,214,.16);--techbg:#080718}
html[data-skin=aurora] body{background:var(--bg)}
html[data-skin=aurora] body:before{content:"";position:fixed;inset:-20%;pointer-events:none;z-index:0;background:radial-gradient(40% 35% at 20% 25%,rgba(94,242,214,.34),transparent 70%),radial-gradient(38% 40% at 80% 20%,rgba(139,123,255,.42),transparent 70%),radial-gradient(45% 40% at 60% 85%,rgba(255,110,196,.26),transparent 70%);filter:blur(40px);animation:rxaur 16s ease-in-out infinite alternate}
@keyframes rxaur{0%{transform:translate3d(-4%,-2%,0) scale(1)}50%{transform:translate3d(5%,3%,0) scale(1.08)}100%{transform:translate3d(-2%,5%,0) scale(1.03)}}
html[data-skin=aurora] .card,html[data-skin=aurora] .stat,html[data-skin=aurora] .whbox,html[data-skin=aurora] .sidepanel,html[data-skin=aurora] .mcard{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
html[data-skin=aurora] .side{backdrop-filter:blur(12px)}html[data-skin=aurora] .top{backdrop-filter:blur(12px);border-bottom:1px solid #3b3485}
html[data-skin=aurora] .btn.primary{background:linear-gradient(90deg,#8b7bff,#5ec6f2);border-color:transparent;color:#071022}
html[data-skin=aurora] .side a.on{background:linear-gradient(90deg,#8b7bff,#5ec6f2);color:#071022;font-weight:600}

/* 赛博霓虹 */
html[data-skin=neon]{--bg:#0a0612;--card:#150c26;--ink:#f4ecff;--ink2:#d9c6f5;--muted:#a78ccf;--line:#4d1f78;--line2:#33174f;--brand:#ff3ec9;--brand-d:#d62aa8;--side:#07040e;--top:#07040e;--head:#1d1034;--hover:#22123d;--soft:#33154f;--btn-line:#6a2a99;--btn-h:#2e1650;--input:#0d0719;--side-ink:#d9c1f5;--side-hov:#2a1248;--side-mut:#8b62b8;--cy:#20f0ff;--bl:#ff3ec9;--tline:#6a2a99;--tg1:rgba(255,62,201,.28);--tg2:rgba(32,240,255,.16);--techbg:#080410}
html[data-skin=neon] body{background:radial-gradient(900px 500px at 100% 0,rgba(255,62,201,.14),transparent 60%),radial-gradient(800px 500px at 0 100%,rgba(32,240,255,.10),transparent 60%),var(--bg)}
html[data-skin=neon] .card,html[data-skin=neon] .stat,html[data-skin=neon] .whbox,html[data-skin=neon] .sidepanel{box-shadow:0 0 0 1px rgba(255,62,201,.10),0 0 26px rgba(255,62,201,.08)}
html[data-skin=neon] h1,html[data-skin=neon] .brand{text-shadow:0 0 14px rgba(32,240,255,.55)}
html[data-skin=neon] .btn.primary{color:#fff;box-shadow:0 0 16px rgba(255,62,201,.65)}html[data-skin=neon] .btn.primary:hover{box-shadow:0 0 24px rgba(255,62,201,.9)}
html[data-skin=neon] .side a.on{box-shadow:0 0 16px rgba(255,62,201,.55)}
html[data-skin=neon] .top{position:sticky;border-bottom:0}html[data-skin=neon] .top:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,#ff3ec9,#20f0ff,#7a5cff,#ff3ec9);background-size:300% 100%;animation:rxneon 6s linear infinite;box-shadow:0 0 12px #ff3ec9}
@keyframes rxneon{to{background-position:300% 0}}

/* 森林(浅色) */
html[data-skin=forest]{--bg:#eef5f0;--ink:#16301f;--ink2:#35553f;--muted:#6a8374;--line:#cfe3d6;--line2:#e3efe7;--brand:#1f8a5b;--brand-d:#17694a;--side:#0f2a1f;--top:#0f2a1f;--head:#f1f8f3;--hover:#f6fbf8;--soft:#e8f5ee;--btn-line:#bcd5c6;--btn-h:#e9f4ee;--side-ink:#bcd9c8;--side-hov:#1b3d2d;--side-mut:#6f9a82;--cy:#3ee6a0;--bl:#1f8a5b;--tline:#1f6a4a;--tg1:rgba(31,138,91,.30);--tg2:rgba(62,230,160,.15);--techbg:#06140e}
html[data-skin=forest] body{background:linear-gradient(180deg,#dcefe3,#eef5f0 360px)}
html[data-skin=forest] .card{box-shadow:0 1px 3px rgba(20,70,45,.06)}
/* 暖阳(浅色) */
html[data-skin=sunrise]{--bg:#fbf4ea;--ink:#3a2a1c;--ink2:#6a5238;--muted:#8d7a64;--line:#eadbc7;--line2:#f2e7d6;--brand:#e8590c;--brand-d:#c4470a;--side:#3a2418;--top:#3a2418;--head:#fbf1e3;--hover:#fdf8f0;--soft:#fff1e0;--btn-line:#e3cfb4;--btn-h:#f8ead6;--side-ink:#ead7c0;--side-hov:#54352a;--side-mut:#a98a70;--cy:#ffb15c;--bl:#ff7a2f;--tline:#7a3d1a;--tg1:rgba(255,122,47,.28);--tg2:rgba(255,177,92,.15);--techbg:#170c06;--radius:14px}
html[data-skin=sunrise] body{background:linear-gradient(180deg,#fde9cf,#fbf4ea 380px)}
html[data-skin=sunrise] .card{box-shadow:0 2px 8px rgba(120,70,20,.07)}

/* 登录/注册页: 动态粒子背景 + 玻璃卡片(任何皮肤下都是深色科技风,颜色跟随皮肤) */
#fx{position:fixed;inset:0;z-index:0;pointer-events:none}
.authbody{background:radial-gradient(900px 600px at 80% -10%,var(--tg1),transparent 60%),radial-gradient(800px 500px at 0 110%,var(--tg2),transparent 60%),var(--techbg);color:#dff0ff}
.authbody .authwrap{position:relative;z-index:1;max-width:440px;margin:7vh auto 4vh}
.authbody .card.auth,.authbody .card{background:rgba(8,18,40,.58);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--tline);color:#e6f3ff;box-shadow:0 0 50px var(--tg1),0 0 0 1px rgba(255,255,255,.04) inset;border-radius:16px;animation:rxrise .7s cubic-bezier(.2,.8,.2,1) both}
@keyframes rxrise{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}
.authbody h1{color:#fff}.authbody .muted,.authbody small,.authbody label{color:#9ec0ea}.authbody a{color:var(--cy)}
.authbody input{background:rgba(5,12,30,.7);border:1px solid var(--tline);color:#fff}
.authbody input:focus{outline:0;border-color:var(--cy);box-shadow:0 0 0 3px var(--tg2),0 0 18px var(--tg2)}
.authbody input:-webkit-autofill{-webkit-text-fill-color:#fff;box-shadow:0 0 0 40px #0a1a3a inset}
.authbody .btn.primary{background:linear-gradient(90deg,var(--bl),var(--cy));border-color:transparent;color:#04101f;font-weight:700;box-shadow:0 0 22px var(--tg1);transition:.2s}
.authbody .btn.primary:hover{box-shadow:0 0 30px var(--cy);transform:translateY(-1px)}
.authbody .flash{background:rgba(255,90,110,.14);color:#ffb3bf;border-color:rgba(255,90,110,.4)}
.loginbox{text-align:center}
.loginbox .logo{position:relative;width:84px;height:84px;margin:0 auto 14px;display:grid;place-items:center}
.loginbox .logo span{font:700 36px/1 "PingFang SC","Microsoft YaHei",sans-serif;color:#fff;text-shadow:0 0 18px var(--cy);z-index:1}
.loginbox .logo .ring{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,var(--cy),transparent 30%,var(--bl),transparent 65%,var(--cy));-webkit-mask:radial-gradient(circle,transparent 58%,#000 60%);mask:radial-gradient(circle,transparent 58%,#000 60%);animation:rxspin 5s linear infinite;filter:drop-shadow(0 0 8px var(--cy))}
.loginbox .logo:after{content:"";position:absolute;inset:10px;border-radius:50%;border:1px dashed var(--tline);animation:rxspin 18s linear infinite reverse}
@keyframes rxspin{to{transform:rotate(360deg)}}
.loginbox h1.shimmer{margin:0 0 4px;font-size:25px;letter-spacing:2px;background:linear-gradient(90deg,#fff 0%,var(--cy) 30%,#fff 50%,var(--bl) 75%,#fff 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:rxshim 5s linear infinite}
@keyframes rxshim{to{background-position:-250% 0}}
.loginbox .sub{margin:0 0 20px;font-size:13px;letter-spacing:3px;color:#8fb4e6}
.loginbox .card{text-align:left;margin-bottom:12px}.loginbox .foot{font-size:12px;color:#6f94c8}
.loginbox .live{display:inline-flex;gap:6px;align-items:center;font:600 11px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:2px;color:var(--cy);margin-bottom:10px}
.loginbox .live i{width:7px;height:7px;border-radius:50%;background:#19e6a7;box-shadow:0 0 0 0 rgba(25,230,167,.7);animation:rxpulse 1.8s infinite}
@media (prefers-reduced-motion:reduce){.loginbox .logo .ring,.loginbox .logo:after,.loginbox h1.shimmer,.authbody .card{animation:none}}
/* 皮肤选择卡片 */
.skingrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.skincard{display:flex;flex-direction:column;gap:6px;text-align:left;padding:10px;border:2px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);cursor:pointer;transition:.15s}
.skincard:hover{border-color:var(--brand);transform:translateY(-2px)}.skincard.on{border-color:var(--brand);box-shadow:0 0 0 3px var(--soft)}
.skincard small{color:var(--muted)}.skincard .sw{position:relative;display:block;height:62px;border-radius:8px;border:1px solid rgba(128,128,128,.25);overflow:hidden}
.skincard .sw i{position:absolute;top:8px;height:34px;width:42%;border-radius:6px;opacity:.95}.skincard .sw i:nth-child(1){left:8px}.skincard .sw i:nth-child(2){right:8px}
.skincard .sw b{position:absolute;left:8px;bottom:7px;width:46%;height:8px;border-radius:4px}
.authbody{min-height:100vh;background-attachment:fixed}