/* ============================================================
ATE 工具箱 · 统一主题系统 v1
6 套视觉风格，通过 切换
clay(默认) / dark / glass / brutal / swiss / term
用法：在页面 之后加
============================================================ */
/* ---------- 通用：跨页面变量别名（yield.html 用的另一套名字） ---------- */
html[data-theme]{
--bg-card:var(--panel);
--bg-soft:var(--panel2);
--text:var(--tx);
--accent:var(--acc);
--accent2:var(--purple);
--failSoft:var(--failSoft2);
}
/* 主题切换器（由 theme.js 注入，样式与主题无关，独立自持） */
#themeFab{position:fixed;right:18px;bottom:18px;z-index:99998;width:44px;height:44px;border-radius:50%;
border:0;cursor:pointer;display:grid;place-items:center;padding:0;
background:var(--acc,#7c6df2);box-shadow:0 6px 20px rgba(0,0,0,.28);transition:transform .18s,box-shadow .18s}
#themeFab:hover{transform:scale(1.08) rotate(15deg);box-shadow:0 10px 28px rgba(0,0,0,.34)}
#themeFab svg{width:21px;height:21px;stroke:#fff;stroke-width:1.9;fill:none}
#themePop{position:fixed;right:18px;bottom:72px;z-index:99999;width:236px;padding:12px;border-radius:16px;
background:var(--panel,#fff);border:1px solid var(--border,#e4e9f0);
box-shadow:0 18px 50px rgba(10,15,30,.30);
display:none;flex-direction:column;gap:5px;
font-family:"Inter","PingFang SC","Microsoft YaHei",system-ui,sans-serif}
#themePop.on{display:flex;animation:tmpop .18s ease}
@keyframes tmpop{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}
#themePop .tmh{font-size:11px;font-weight:800;letter-spacing:1.2px;color:var(--tx3,#94a0b3);
padding:2px 6px 7px;text-transform:uppercase}
#themePop button{display:flex;align-items:center;gap:10px;width:100%;padding:8px 9px;border:1px solid transparent;
border-radius:10px;background:transparent;cursor:pointer;text-align:left;transition:.14s;
font-family:inherit;color:var(--tx,#16203a)}
#themePop button:hover{background:var(--panel3,#f0f3f8)}
#themePop button.sel{border-color:var(--acc,#7c6df2);background:var(--accSoft,#eef0ff)}
#themePop .sw{width:30px;height:30px;border-radius:9px;flex:0 0 30px;position:relative;overflow:hidden;
border:1px solid rgba(125,125,140,.28)}
#themePop .sw i{position:absolute;right:4px;bottom:4px;width:11px;height:11px;border-radius:50%;display:block}
#themePop .nm{font-size:12.5px;font-weight:700;line-height:1.25}
#themePop .ds{font-size:10.5px;opacity:.62;line-height:1.3;margin-top:1px}
@media(max-width:560px){#themePop{right:12px;left:12px;width:auto}#themeFab{right:14px;bottom:14px}}
/* ============================================================
1) CLAY · 黏土拟态（默认）
============================================================ */
html[data-theme="clay"]{
--bg:#e9eaf3; --panel:#f6f7fc; --panel2:#eef0f8; --panel3:#e4e6f2;
--border:#dcdff0; --border2:#ccd0e6;
--tx:#3a3752; --tx2:#6b6885; --tx3:#9c99b4;
--acc:#7c6df2; --acc2:#6355e0; --accSoft:#eae7fe;
--pass:#3fb984; --passSoft:#e2f7ee; --fail:#f2707a; --failSoft2:#fdeaec;
--warn:#f0b03e; --warnSoft:#fdf3e0;
--mute:#8b88a3; --muteSoft:#e9eaf5; --info:#5b8def; --infoSoft:#e6eefe;
--purple:#a78bfa; --cyan:#4cc9d6;
--grad:linear-gradient(145deg,#8b7bf5,#6d5ce8);
--sh1:5px 5px 12px rgba(159,162,196,.30),-5px -5px 12px rgba(255,255,255,.92);
--sh2:8px 8px 20px rgba(159,162,196,.36),-8px -8px 20px rgba(255,255,255,.95);
--sh3:14px 14px 38px rgba(140,143,180,.40),-10px -10px 30px rgba(255,255,255,.9);
--r:22px; --r2:15px;
}
html[data-theme="clay"] body{background:var(--bg);background-image:none}
html[data-theme="clay"] .pcard,html[data-theme="clay"] .lead,html[data-theme="clay"] .lk,
html[data-theme="clay"] .card,html[data-theme="clay"] .panel{border:0;box-shadow:var(--sh1)}
html[data-theme="clay"] .pcard:hover{transform:translateY(-4px);box-shadow:var(--sh2)}
html[data-theme="clay"] .badge,html[data-theme="clay"] .logo,html[data-theme="clay"] .lk .ic{
border-radius:17px;box-shadow:4px 4px 10px rgba(140,143,180,.42),-3px -3px 8px rgba(255,255,255,.75)}
html[data-theme="clay"] .pw button,html[data-theme="clay"] button.primary{
background:var(--grad);border-radius:14px;box-shadow:4px 4px 11px rgba(124,109,242,.34),-3px -3px 8px rgba(255,255,255,.7)}
html[data-theme="clay"] .pw input,html[data-theme="clay"] input,html[data-theme="clay"] select,
html[data-theme="clay"] textarea{
border:0;background:var(--panel2);border-radius:13px;
box-shadow:inset 3px 3px 7px rgba(159,162,196,.34),inset -3px -3px 7px rgba(255,255,255,.9)}
html[data-theme="clay"] .pill{box-shadow:2px 2px 5px rgba(159,162,196,.24),-2px -2px 5px rgba(255,255,255,.8)}
html[data-theme="clay"] ::-webkit-scrollbar-thumb{background:#c9cce2}
html[data-theme="clay"] #toast{background:#4a4666;border-radius:14px}
/* ============================================================
2) DARK · 深色专业（Linear 风）
============================================================ */
html[data-theme="dark"]{
--bg:#0c0d11; --panel:#15171d; --panel2:#1b1e26; --panel3:#22252e;
--border:#252832; --border2:#333744;
--tx:#e8eaf0; --tx2:#9ba1b0; --tx3:#6b7280;
--acc:#5b8cff; --acc2:#3d6ee8; --accSoft:#182238;
--pass:#3fb950; --passSoft:#12241a; --fail:#f85149; --failSoft2:#2a1517;
--warn:#d29922; --warnSoft:#2a2113;
--mute:#7c8394; --muteSoft:#1e212a; --info:#58a6ff; --infoSoft:#152238;
--purple:#a371f7; --cyan:#39c5cf;
--grad:linear-gradient(135deg,#5b8cff,#a371f7);
--sh1:0 1px 2px rgba(0,0,0,.5); --sh2:0 8px 26px rgba(0,0,0,.55);
--sh3:0 24px 60px rgba(0,0,0,.7);
--r:12px; --r2:8px;
}
html[data-theme="dark"] body{background:var(--bg);
background-image:radial-gradient(900px 400px at 82% -12%,rgba(91,140,255,.10),transparent 62%),
radial-gradient(760px 360px at -6% 0%,rgba(163,113,247,.08),transparent 58%)}
html[data-theme="dark"] .pcard,html[data-theme="dark"] .lead,html[data-theme="dark"] .lk{position:relative}
html[data-theme="dark"] .pcard::after{content:"";position:absolute;inset:0 0 auto 0;height:1px;
background:linear-gradient(90deg,transparent,rgba(255,255,255,.11),transparent);pointer-events:none}
html[data-theme="dark"] .pcard:hover{border-color:#3a3f4d}
html[data-theme="dark"] ::-webkit-scrollbar-thumb{background:#2f3340}
html[data-theme="dark"] #toast{background:#272b36;border:1px solid #363b48}
html[data-theme="dark"] .pcard.ph{background:repeating-linear-gradient(135deg,#15171d,#15171d 10px,#191c23 10px,#191c23 20px)}
/* ============================================================
3) GLASS · 玻璃拟态
============================================================ */
html[data-theme="glass"]{
--bg:#15112a; --panel:rgba(255,255,255,.075); --panel2:rgba(255,255,255,.05);
--panel3:rgba(255,255,255,.11);
--border:rgba(255,255,255,.15); --border2:rgba(255,255,255,.22);
--tx:#f2eeff; --tx2:#c3bade; --tx3:#8f86ad;
--acc:#a78bfa; --acc2:#8b6df0; --accSoft:rgba(167,139,250,.18);
--pass:#4ade80; --passSoft:rgba(74,222,128,.15); --fail:#fb7185; --failSoft2:rgba(251,113,133,.15);
--warn:#fbbf24; --warnSoft:rgba(251,191,36,.15);
--mute:#a79fc0; --muteSoft:rgba(255,255,255,.09); --info:#60a5fa; --infoSoft:rgba(96,165,250,.16);
--purple:#c084fc; --cyan:#22d3ee;
--grad:linear-gradient(135deg,#a78bfa,#f472b6);
--sh1:0 4px 20px rgba(0,0,0,.30); --sh2:0 12px 42px rgba(0,0,0,.42);
--sh3:0 26px 70px rgba(0,0,0,.55);
--r:20px; --r2:13px;
}
html[data-theme="glass"] body{background:#15112a;
background-image:radial-gradient(720px 520px at 12% 8%,rgba(167,139,250,.40),transparent 62%),
radial-gradient(680px 500px at 88% 18%,rgba(236,72,153,.28),transparent 60%),
radial-gradient(620px 480px at 50% 96%,rgba(56,189,248,.24),transparent 62%)}
html[data-theme="glass"] .pcard,html[data-theme="glass"] .lead,html[data-theme="glass"] .lk,
html[data-theme="glass"] #themePop{
backdrop-filter:blur(22px) saturate(160%);-webkit-backdrop-filter:blur(22px) saturate(160%)}
html[data-theme="glass"] .pcard{background:linear-gradient(150deg,rgba(255,255,255,.13),rgba(255,255,255,.05))}
html[data-theme="glass"] .pcard:hover{background:linear-gradient(150deg,rgba(255,255,255,.19),rgba(255,255,255,.08));
border-color:rgba(255,255,255,.30)}
html[data-theme="glass"] .badge,html[data-theme="glass"] .logo{box-shadow:0 8px 26px rgba(167,139,250,.45)}
html[data-theme="glass"] ::-webkit-scrollbar-thumb{background:rgba(255,255,255,.22)}
html[data-theme="glass"] #toast{background:rgba(30,22,58,.86);backdrop-filter:blur(18px);
border:1px solid rgba(255,255,255,.18)}
html[data-theme="glass"] .pcard.ph{background:rgba(255,255,255,.04)}
/* ============================================================
4) BRUTAL · 新粗野主义
============================================================ */
html[data-theme="brutal"]{
--bg:#ffd93d; --panel:#ffffff; --panel2:#fffbe8; --panel3:#ffef9e;
--border:#000000; --border2:#000000;
--tx:#000000; --tx2:#2b2b2b; --tx3:#555555;
--acc:#2b5cff; --acc2:#1a3fd0; --accSoft:#d6e0ff;
--pass:#00994d; --passSoft:#b8f5d4; --fail:#ff2d20; --failSoft2:#ffd4d0;
--warn:#ff8a00; --warnSoft:#ffe4bf;
--mute:#444444; --muteSoft:#e8e8e8; --info:#2b5cff; --infoSoft:#d6e0ff;
--purple:#8b3ff5; --cyan:#00b8d4;
--grad:#2b5cff;
--sh1:4px 4px 0 #000; --sh2:7px 7px 0 #000; --sh3:10px 10px 0 #000;
--r:0px; --r2:0px;
}
html[data-theme="brutal"] body{background:var(--bg);background-image:none;
font-family:"Archivo Black","Inter","PingFang SC","Microsoft YaHei",system-ui,sans-serif}
html[data-theme="brutal"] .pcard,html[data-theme="brutal"] .lead,html[data-theme="brutal"] .lk,
html[data-theme="brutal"] #themePop{border:3px solid #000;box-shadow:var(--sh1)}
html[data-theme="brutal"] .pcard:hover{transform:translate(-3px,-3px);box-shadow:var(--sh2)}
html[data-theme="brutal"] .badge,html[data-theme="brutal"] .logo,html[data-theme="brutal"] .lk .ic{
border:2.5px solid #000;box-shadow:3px 3px 0 #000;border-radius:0}
html[data-theme="brutal"] h1,html[data-theme="brutal"] h2,html[data-theme="brutal"] h3{
font-weight:900;letter-spacing:-.6px;text-transform:uppercase}
html[data-theme="brutal"] .pw button,html[data-theme="brutal"] button{
border:2.5px solid #000!important;box-shadow:3px 3px 0 #000;border-radius:0;font-weight:800}
html[data-theme="brutal"] .pw button:active,html[data-theme="brutal"] button:active{
transform:translate(3px,3px);box-shadow:0 0 0 #000}
html[data-theme="brutal"] .pw input,html[data-theme="brutal"] input,html[data-theme="brutal"] select,
html[data-theme="brutal"] textarea{border:2.5px solid #000;border-radius:0;background:#fff}
html[data-theme="brutal"] .pill{border:2px solid #000;border-radius:0;font-weight:800}
html[data-theme="brutal"] ::-webkit-scrollbar-thumb{background:#000;border-radius:0}
html[data-theme="brutal"] #toast{background:#000;border:3px solid #fff;border-radius:0;font-weight:800}
html[data-theme="brutal"] #themeFab{border:3px solid #000;border-radius:0;box-shadow:4px 4px 0 #000}
html[data-theme="brutal"] #themePop button{border-radius:0}
html[data-theme="brutal"] #themePop button.sel{border:2.5px solid #000}
/* ============================================================
5) SWISS · 瑞士国际主义
============================================================ */
html[data-theme="swiss"]{
--bg:#ffffff; --panel:#ffffff; --panel2:#f7f7f7; --panel3:#efefef;
--border:#111111; --border2:#111111;
--tx:#000000; --tx2:#444444; --tx3:#8a8a8a;
--acc:#e5231b; --acc2:#b81c15; --accSoft:#fdecea;
--pass:#000000; --passSoft:#efefef; --fail:#e5231b; --failSoft2:#fdecea;
--warn:#000000; --warnSoft:#efefef;
--mute:#8a8a8a; --muteSoft:#f2f2f2; --info:#000000; --infoSoft:#efefef;
--purple:#000000; --cyan:#000000;
--grad:#e5231b;
--sh1:none; --sh2:none; --sh3:none;
--r:0px; --r2:0px;
}
html[data-theme="swiss"] body{background:#fff;background-image:none;
font-family:"Helvetica Neue",Helvetica,Arial,"PingFang SC","Microsoft YaHei",sans-serif;
letter-spacing:-.1px}
html[data-theme="swiss"] .pcard,html[data-theme="swiss"] .lead,html[data-theme="swiss"] .lk,
html[data-theme="swiss"] #themePop{border:1px solid #111;box-shadow:none;border-radius:0}
html[data-theme="swiss"] .pcard:hover{transform:none;background:#f7f7f7;border-color:#000}
html[data-theme="swiss"] .pcard::before{display:none}
html[data-theme="swiss"] .badge,html[data-theme="swiss"] .logo,html[data-theme="swiss"] .lk .ic{
background:#000!important;border-radius:0;box-shadow:none}
html[data-theme="swiss"] .pcard.lk .badge{background:var(--acc)!important}
html[data-theme="swiss"] h1,html[data-theme="swiss"] h2{font-weight:800;letter-spacing:-1px}
html[data-theme="swiss"] .pw button,html[data-theme="swiss"] button{
background:#000!important;border-radius:0;box-shadow:none;font-weight:700}
html[data-theme="swiss"] .pw input,html[data-theme="swiss"] input,html[data-theme="swiss"] select,
html[data-theme="swiss"] textarea{border:1px solid #111;border-radius:0;background:#fff}
html[data-theme="swiss"] .pill{border-radius:0;border:1px solid currentColor;font-weight:700}
html[data-theme="swiss"] ::-webkit-scrollbar-thumb{background:#000;border-radius:0}
html[data-theme="swiss"] #toast{background:#000;border-radius:0}
html[data-theme="swiss"] #themeFab{border-radius:0;background:#e5231b}
html[data-theme="swiss"] #themePop button{border-radius:0}
html[data-theme="swiss"] .go{color:var(--acc)}
/* ============================================================
6) TERM · 赛博终端
============================================================ */
html[data-theme="term"]{
--bg:#050a06; --panel:#0a1109; --panel2:#0d1710; --panel3:#122016;
--border:#1e3d22; --border2:#2a5730;
--tx:#7dffa0; --tx2:#4fbf6c; --tx3:#2f8046;
--acc:#39ff88; --acc2:#22cc66; --accSoft:#0d2415;
--pass:#39ff88; --passSoft:#0d2415; --fail:#ff4d5e; --failSoft2:#2a0d11;
--warn:#ffd24d; --warnSoft:#2a2410;
--mute:#3f7a52; --muteSoft:#0e1a11; --info:#4dd8ff; --infoSoft:#0a2029;
--purple:#c77dff; --cyan:#4dd8ff;
--grad:linear-gradient(135deg,#39ff88,#1fa85c);
--sh1:0 0 0 1px rgba(57,255,136,.10); --sh2:0 0 22px rgba(57,255,136,.18);
--sh3:0 0 44px rgba(57,255,136,.24);
--r:3px; --r2:2px;
}
html[data-theme="term"] body{background:#050a06;background-image:none;
font-family:"SFMono-Regular",Consolas,"JetBrains Mono","Cascadia Mono",Menlo,monospace}
html[data-theme="term"] body::after{content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;
background:repeating-linear-gradient(0deg,rgba(0,0,0,.22) 0 1px,transparent 1px 3px)}
html[data-theme="term"] .pcard,html[data-theme="term"] .lead,html[data-theme="term"] .lk,
html[data-theme="term"] #themePop{border:1px solid var(--border);box-shadow:var(--sh1)}
html[data-theme="term"] .pcard:hover{border-color:var(--acc);box-shadow:var(--sh2);transform:none}
html[data-theme="term"] .badge,html[data-theme="term"] .logo,html[data-theme="term"] .lk .ic{
background:transparent!important;border:1px solid var(--acc);border-radius:3px;box-shadow:0 0 14px rgba(57,255,136,.22)}
html[data-theme="term"] .badge svg,html[data-theme="term"] .logo svg,html[data-theme="term"] .lk .ic svg{stroke:var(--acc)}
html[data-theme="term"] h1::before,html[data-theme="term"] .sec h2::before{content:"> ";color:var(--acc2)}
html[data-theme="term"] .pw button,html[data-theme="term"] button{
background:var(--accSoft)!important;color:var(--acc)!important;border:1px solid var(--acc)!important;
border-radius:3px;box-shadow:none;text-transform:uppercase;letter-spacing:.6px}
html[data-theme="term"] .pw input,html[data-theme="term"] input,html[data-theme="term"] select,
html[data-theme="term"] textarea{background:#0a1109;border:1px solid var(--border2);border-radius:3px;color:var(--acc)}
html[data-theme="term"] .pill{border-radius:2px;border:1px solid currentColor;background:transparent!important}
html[data-theme="term"] ::-webkit-scrollbar-thumb{background:#1e5c2e;border-radius:0}
html[data-theme="term"] #toast{background:#0a1109;border:1px solid var(--acc);color:var(--acc);border-radius:3px}
html[data-theme="term"] #themeFab{background:#0a1109;border:1px solid var(--acc);box-shadow:0 0 18px rgba(57,255,136,.3)}
html[data-theme="term"] #themeFab svg{stroke:var(--acc)}
html[data-theme="term"] .pcard.ph{background:#080d08;border-style:dashed}
/* ============================================================
工具页兼容层（yield.html：深色专用变量名）
============================================================ */
html[data-theme="clay"] .wb-home,html[data-theme="swiss"] .wb-home,
html[data-theme="brutal"] .wb-home{color:#fff}
html[data-theme="swiss"] .wb-home{background:#000}
html[data-theme="brutal"] .wb-home{background:#2b5cff;border:2.5px solid #000;box-shadow:3px 3px 0 #000}
/* 浅色主题下让深色工具页的硬编码区域跟随 */
html[data-theme="clay"] .head,html[data-theme="swiss"] .head,html[data-theme="brutal"] .head{
background:var(--panel)}
/* 平滑过渡（切换主题时） */
html.tm-anim,html.tm-anim body,html.tm-anim .pcard,html.tm-anim .lead,html.tm-anim .lk,
html.tm-anim .badge,html.tm-anim .logo,html.tm-anim .pill,html.tm-anim input,html.tm-anim button{
transition:background-color .28s ease,color .28s ease,border-color .28s ease,box-shadow .28s ease!important}
@media(prefers-reduced-motion:reduce){html.tm-anim *{transition:none!important}}