/* ====== 漫象数据 · 九法降妖 走势分析站 样式（深色主题） ====== */
:root{
  /* 深邃墨黑底 — 暖调非通用冷蓝 */
  --bg:#0c0d13; --bg2:#070810;
  --gold:#d9a84e; --gold-soft:#f5e0b0; --gold-soft2:#fff4d6; --gold-deep:#b88a2e;
  --ink:#06070c; --ink2:#0e0f18; --ink3:#161824; --ink4:#0c0d15; --ink5:#1d1f2e;
  --card:rgba(255,255,255,0.035); --card-solid:#131520;
  /* 灵玉青 取代通用cyan */
  --cyan:#34e0a4; --cyan2:#7ff0c8; --cyan3:#34e0a4; --blue:#34d8ff;
  --text:#e2e4ec; --text2:#969db0; --text3:#565d73;
  --line:rgba(217,168,78,0.10); --line2:rgba(255,255,255,0.05);
  --rainbow:linear-gradient(135deg,#ff39f6 0%,#37d8ff 22%,#60ff9b 43%,#ffe45f 62%,#ff6a3d 80%,#ff39f6 100%);
  --font:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  --ember:#ff6b3d; --violet:#8b5cf6;
  --shadow-sm:0 2px 8px rgba(0,0,0,.3);
  --shadow-md:0 8px 28px rgba(0,0,0,.35);
  --tr:.25s cubic-bezier(.4,0,.2,1);
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{height:100%;}
body{
  font-family:var(--font);
  background:
    radial-gradient(ellipse 800px 400px at 15% 0%,rgba(52,224,164,.04) 0%,transparent 60%),
    radial-gradient(ellipse 700px 500px at 85% 10%,rgba(255,107,61,.03) 0%,transparent 55%),
    radial-gradient(ellipse 600px 800px at 50% 100%,rgba(139,92,246,.03) 0%,transparent 60%),
    linear-gradient(180deg,#0c0d13 0%,#080910 50%,#070810 100%);
  background-attachment:fixed;
  color:var(--text);font-size:14px;line-height:1.5;min-height:100vh;
  -webkit-font-smoothing:antialiased;
}
/* 噪点纹理 */
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.025;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;}
input{font-family:inherit;}
a{color:inherit;text-decoration:none;}
#app{max-width:1200px;margin:0 auto;padding-bottom:72px;min-height:100vh;position:relative;z-index:1;}

/* ====== 顶部栏 ====== */
.tf-topbar{display:flex;align-items:center;gap:14px;padding:12px 18px;background:rgba(8,9,15,0.7);backdrop-filter:blur(20px) saturate(140%);-webkit-backdrop-filter:blur(20px) saturate(140%);border-bottom:1px solid var(--line2);position:sticky;top:0;z-index:50;flex-wrap:wrap;}
.tf-topbar::after{content:"";position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(52,224,164,.2),rgba(217,168,78,.15),transparent);}
.tf-top-left{display:flex;align-items:center;gap:10px;flex:1;min-width:200px;}
.tf-top-right{display:flex;align-items:center;gap:10px;}
.tf-banner{color:var(--text3);font-size:12px;flex:1;text-align:center;}
.tf-chip{padding:8px 16px;border-radius:20px;background:rgba(255,255,255,0.05);border:1px solid var(--line2);font-size:13px;color:var(--text2);transition:var(--tr);}
.tf-chip:active{transform:scale(.96);}
.tf-chip-primary{background:linear-gradient(135deg,var(--gold) 0%,var(--gold-deep) 100%);color:#1a1408;border:none;font-weight:600;box-shadow:0 4px 14px rgba(217,168,78,.2);}
.tf-room-status{display:flex;align-items:center;gap:8px;font-size:13px;}
.tf-room-name{font-weight:600;color:var(--text);max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.tf-sync{display:flex;align-items:center;gap:4px;color:var(--cyan3);font-size:12px;}
.tf-sync-dot{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 3px rgba(52,224,164,.12),0 0 8px rgba(52,224,164,.5);animation:tftpulse 2s ease-in-out infinite;}
@keyframes tftpulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.5;transform:scale(.85);}}
.tf-user-chip{display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;background:rgba(255,255,255,0.06);border:1px solid var(--line);}
.tf-username{font-size:13px;color:var(--text);}
.tf-vip-tag{font-size:11px;font-weight:700;color:#5a3d00;background:linear-gradient(135deg,var(--gold),var(--gold-deep));padding:2px 8px;border-radius:10px;}
.tf-ver-btn{padding:7px 14px;border-radius:20px;font-size:13px;background:rgba(255,255,255,0.06);border:1px solid var(--line);color:var(--text2);}
.tf-ver-btn.active{background:linear-gradient(135deg,rgba(52,224,164,.12),rgba(52,224,164,.04));color:var(--cyan);border-color:rgba(52,224,164,.25);}

/* ====== 主区 ====== */
.tf-main{display:flex;gap:16px;padding:16px;align-items:flex-start;}
.tf-beast-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;flex:1;max-width:560px;margin:0 auto;}

/* ====== spell-card 经典版兽卡（1:1 tafang 深色） ====== */
.spell-card{background:linear-gradient(180deg,rgba(255,255,255,.04) 0%,transparent 100%),var(--card);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-radius:10px;padding:10px 7px 7px;text-align:center;border:1px solid var(--line2);cursor:pointer;transition:var(--tr);position:relative;display:flex;flex-direction:column;align-items:center;min-height:152px;overflow:hidden;}
.spell-card::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:60%;height:2px;background:linear-gradient(90deg,transparent,var(--accent,#888),transparent);opacity:.6;transition:opacity .3s;}
.spell-card:hover::before{opacity:1;}
.spell-card:hover .beast-visual img{transform:scale(1.06);}.spell-card:hover{transform:translateY(-3px);background:linear-gradient(180deg,rgba(255,255,255,.06) 0%,transparent 100%),var(--card);box-shadow:0 8px 24px rgba(0,0,0,.3),0 0 0 1px var(--accent,rgba(255,255,255,.1));}
.spell-card.trace-on{box-shadow:0 0 0 1.5px var(--accent),0 0 24px rgba(0,0,0,.2);}
.beast-visual{display:flex;flex-direction:column;align-items:center;gap:3px;}
.beast-visual img{width:48px;height:48px;object-fit:cover;border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,.3);filter:saturate(1.1) contrast(1.05);transition:transform .25s;}
.beast-visual span{font-size:11px;color:var(--text);font-weight:500;}
.spell-main{display:flex;align-items:center;justify-content:center;gap:5px;margin:6px 0 4px;}
.spell-main strong{font-size:11px;color:#fff;background:var(--accent);padding:2px 7px;border-radius:6px;font-weight:600;}
.spell-main b{font-size:22px;font-weight:800;color:#fff;font-family:Arial,sans-serif;line-height:1;}
.spell-card footer{display:flex;justify-content:space-around;width:100%;font-size:10px;color:var(--text3);border-top:1px solid var(--line2);padding-top:5px;margin-top:auto;}
.omission-stat.cold{color:#ff6b3d;font-weight:700;}
/* 推荐卡(第10格,主防推荐) */
.recommend-card{border-color:rgba(217,168,78,.2);background:linear-gradient(160deg,rgba(217,168,78,.1),rgba(255,255,255,.02));justify-content:flex-start;}
.rec-head{font-size:10px;color:var(--gold);font-weight:700;text-align:center;width:100%;letter-spacing:1.5px;text-transform:uppercase;}
.recommend-panel{flex:1;display:flex;flex-direction:column;justify-content:space-around;gap:6px;width:100%;border-top:1px solid var(--line2);padding-top:6px;}
.rec-row{display:flex;align-items:center;gap:4px;}
.rec-picks{display:flex;gap:4px;}
.recommend-label{font-size:9px;font-weight:700;width:16px;height:20px;display:inline-flex;align-items:center;justify-content:center;border-radius:4px;flex-shrink:0;}
.recommend-label.main{background:linear-gradient(135deg,#ff6b3d,#e74c3c);color:#fff;box-shadow:0 2px 6px rgba(255,107,61,.3);}
.recommend-label.guard{background:linear-gradient(135deg,#34e0a4,#20c997);color:#062a20;box-shadow:0 2px 6px rgba(52,224,164,.3);}
.recommend-number{width:24px;height:24px;border-radius:7px;color:#fff;font-weight:700;font-size:13px;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(0,0,0,.25);}

/* 倒计时卡(第10格,跳动) */
.count-card{justify-content:center;border-color:rgba(217,168,78,.2);background:linear-gradient(160deg,rgba(217,168,78,.1),rgba(255,255,255,.02));}
.count-label{font-size:10px;color:var(--gold);text-align:center;width:100%;letter-spacing:1.5px;text-transform:uppercase;}
.count-num{font-size:42px;font-weight:800;color:#fff;font-family:'DIN Alternate','Helvetica Neue',Arial,sans-serif;line-height:1;margin:6px 0;text-shadow:0 0 18px rgba(217,168,78,.5),0 2px 6px rgba(0,0,0,.4);animation:countTick 1s ease-in-out infinite;}
.count-unit{font-size:10px;color:var(--text3);}
@keyframes countTick{0%,100%{transform:scale(1);}50%{transform:scale(.86);}}

/* 主区左列 + 24位走势 */
.tf-classic-col{display:flex;flex-direction:column;flex:1;min-width:0;gap:16px;}
.history-panel{background:linear-gradient(180deg,rgba(255,255,255,.03) 0%,transparent 50%),var(--card);border:1px solid var(--line2);border-radius:16px;padding:14px;box-shadow:var(--shadow-sm);}
.history-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.toolbar-right{display:flex;align-items:center;gap:8px;}
.room-profile{display:flex;flex-direction:column;gap:1px;}
.rp-name{font-size:14px;font-weight:600;color:var(--text);}
.rp-id{font-size:10px;color:var(--text3);}
.col-toggle{padding:5px 12px;border-radius:8px;background:rgba(255,255,255,0.06);border:1px solid var(--line);color:var(--gold);font-size:12px;}
select.col-toggle{appearance:none;-webkit-appearance:none;-moz-appearance:none;cursor:pointer;padding-right:24px;background-color:rgba(255,255,255,0.06);background-image:linear-gradient(45deg,transparent 50%,var(--gold) 50%),linear-gradient(135deg,var(--gold) 50%,transparent 50%);background-position:calc(100% - 14px) 50%,calc(100% - 9px) 50%;background-size:5px 5px;background-repeat:no-repeat;}
select.col-toggle option{background:#131520;color:var(--text);}
.history-grid{display:flex;flex-direction:column;gap:2px;align-items:center;overflow-x:auto;}
.history-row{display:flex;flex-wrap:nowrap;gap:2px;align-items:center;justify-content:center;}
.history-cell{width:15px;height:15px;border-radius:3px;color:#fff;font-weight:700;font-size:9px;display:flex;align-items:center;justify-content:center;}
.history-cell.rec-hit{z-index:2;font-weight:900;}
.hist-countdown{background:#fff;color:#d51f2a;font-weight:800;animation:pendingBlink 1s steps(1,end) infinite;padding:3px 8px;border-radius:6px;}
.cd-imminent{background:#d51f2a;color:#fff;animation:pendingBlink .5s steps(1,end) infinite;}
.cd-sealed{background:#fff3cd;color:#b8860b;animation:none;}
.cd-reveal{background:#d4edda;color:#155724;animation:none;}
@keyframes pendingBlink{0%,50%{opacity:1;}50.01%,100%{opacity:0.2;}}

/* 走势表格 trend-panel */
.trend-panel{background:linear-gradient(180deg,rgba(255,255,255,.03) 0%,transparent 50%),var(--card);border:1px solid var(--line2);border-radius:16px;padding:14px;overflow-x:auto;box-shadow:var(--shadow-sm);}
.trend-head,.trend-rows .tr{display:grid;grid-template-columns:46px repeat(9,minmax(20px,1fr)) repeat(4,minmax(20px,1fr));gap:2px;align-items:center;}
.trend-head{margin-bottom:6px;border-bottom:1px solid var(--line2);padding-bottom:5px;}
.th{font-size:10px;color:var(--text3);text-align:center;}
.tr{margin-bottom:2px;}
.tp{font-size:10px;color:var(--text3);text-align:center;}
.tc{height:20px;border-radius:3px;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;color:transparent;}
.tc.hit{color:#fff;}
.tf-download{display:block;text-align:center;padding:11px;margin:14px 0 4px;border-radius:12px;background:linear-gradient(135deg,var(--gold),var(--gold-deep));color:#5a3d00;font-weight:600;text-decoration:none;}
.tf-game-toast{text-align:center;padding:60px 24px;color:var(--text3);font-size:15px;}

/* ====== 高级版侧栏 ====== */
.tf-main:not(.tf-main-v2) .tf-sidebar{display:none;}
.tf-sidebar{width:380px;flex-shrink:0;background:linear-gradient(180deg,var(--ink3),var(--ink));border:1px solid var(--line2);border-radius:16px;color:#dff4ff;overflow:hidden;position:sticky;top:72px;}
.tf-sb-header{padding:14px 16px;font-size:14px;border-bottom:1px solid var(--line2);background:rgba(255,255,255,.03);}
.tf-sb-body{padding:0;}
.tf-build-placeholder{text-align:center;padding:30px 16px;color:var(--text3);}
.tf-build-icon{font-size:42px;margin-bottom:10px;}
.tf-build-placeholder p{font-size:14px;margin-bottom:6px;color:var(--text2);}
.tf-build-placeholder small{font-size:11px;line-height:1.7;display:block;}
.tf-sb-empty{padding:40px 16px;text-align:center;color:var(--text3);}
.tf-ws{background:rgba(255,255,255,.04);border:1px solid var(--line2);border-radius:12px;margin:12px;overflow:hidden;}
.tf-ws-head{padding:10px 12px;border-bottom:1px solid var(--line2);display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:rgba(0,0,0,.15);}
.tf-ws-head strong{font-size:13px;color:var(--gold);}
.tf-ws-tabs{display:flex;flex-wrap:wrap;gap:4px;flex:1;}
.tf-ws-tab{font-size:11px;padding:4px 9px;border-radius:8px;background:rgba(255,255,255,.06);color:#9fb0c8;}
.tf-ws-tab.on{background:linear-gradient(135deg,var(--cyan3),var(--blue));color:#06203a;font-weight:600;}
.tf-ws-body{padding:12px;}
.tf-mod-title{font-size:13px;color:#fff;margin-bottom:10px;font-weight:600;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;}
.tf-mod-title small{font-size:10px;color:var(--text3);font-weight:400;}
.tf-table{width:100%;border-collapse:collapse;font-size:11px;color:var(--text2);}
.tf-table th{font-weight:500;color:var(--text3);padding:5px 3px;text-align:center;border-bottom:1px solid var(--line2);font-size:10px;}
.tf-table td{padding:5px 3px;text-align:center;border-bottom:1px solid rgba(255,255,255,0.03);}
.tf-table td:first-child{text-align:left;}
.tf-dim{color:var(--text3);}
.dev-hot{color:#ff9f9f;font-weight:600;}
.dev-cold{color:var(--cyan);font-weight:600;}
.tf-num-chip{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:5px;color:#fff;font-weight:700;font-size:11px;margin-right:3px;}
.tf-state{font-size:10px;padding:2px 7px;border-radius:8px;background:rgba(255,255,255,.08);color:#9fb0c8;}
.tf-state.hot{background:rgba(52,224,164,.15);color:var(--cyan);}
.tf-state.cold{background:rgba(255,107,107,.18);color:#ff9f9f;}
.tf-bar{width:60px;height:8px;border-radius:4px;background:rgba(255,255,255,.08);overflow:hidden;}
.tf-bar-fill{height:100%;border-radius:4px;background:linear-gradient(90deg,#60ff9b,#ffe45f);}
.tf-bar-fill.warn{background:linear-gradient(90deg,#ffe45f,#ff9f9f);}
.tf-bar-fill.over{background:linear-gradient(90deg,#ff9f9f,#ff39f6);}
.tf-matrix{display:grid;grid-template-columns:32px repeat(9,1fr);gap:2px;}
.tf-mx-corner{font-size:8px;color:#5b6b8c;display:flex;align-items:center;justify-content:center;}
.tf-mx-h{font-size:10px;font-weight:700;text-align:center;padding:3px 0;}
.tf-mx-cell{height:24px;border-radius:4px;font-size:9px;font-weight:700;color:#06203a;display:flex;align-items:center;justify-content:center;}
.tf-table-omit td:nth-child(6){text-align:left;}
.tf-num-box{display:inline-flex;align-items:center;justify-content:center;width:20px;height:24px;border-radius:5px;color:#fff;font-weight:700;font-size:12px;margin:1px;}
.tf-stream-head{font-size:10px;color:var(--text3);margin:6px 0 4px;}
.tf-stream{display:flex;flex-wrap:wrap;gap:2px;padding:8px 6px;background:rgba(0,0,0,.22);border-radius:8px;margin-bottom:8px;}
.tf-back-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.tf-back-cell{background:rgba(255,255,255,.03);border:1px solid var(--line2);border-radius:8px;padding:10px 4px;text-align:center;transition:var(--tr);}
.tf-back-v{font-size:18px;font-weight:700;color:var(--cyan);font-family:'DIN Alternate',Arial,sans-serif;}
.tf-back-v.dim{color:var(--text3);}
.tf-back-l{font-size:9px;color:var(--text3);margin-top:3px;}
.tf-heat{font-size:9px;}
.tf-heat-row{display:flex;align-items:center;gap:2px;margin-bottom:2px;}
.tf-heat-h{width:14px;text-align:right;color:#5b6b8c;font-size:8px;flex-shrink:0;}
.tf-heat-hc{flex:1;text-align:center;font-weight:700;font-size:9px;}
.tf-heat-c{flex:1;height:15px;border-radius:3px;color:rgba(6,32,58,.85);font-weight:700;display:flex;align-items:center;justify-content:center;font-size:8px;}
.tf-bal{display:flex;flex-direction:column;gap:5px;}
.tf-bal-row{display:flex;align-items:center;gap:6px;font-size:11px;}
.tf-bal-bar{flex:1;height:8px;border-radius:4px;background:rgba(255,255,255,.08);overflow:hidden;}
.tf-bal-fill{height:100%;border-radius:4px;background:linear-gradient(90deg,#60ff9b,#ffe45f);}
.tf-order2{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:13px;padding:6px 0;}
.tf-order2-info{font-size:12px;line-height:1.8;color:var(--text2);padding:4px 0;}

/* ====== 底部导航 (v2 悬浮胶囊) ====== */
/* hide bottom nav when login gate is shown (not logged in) */
.login-gate ~ .tf-nav{display:none !important;}

.tf-nav{
  position:fixed;bottom:0;left:0;right:0;max-width:560px;margin:0 auto;
  display:flex;align-items:stretch;gap:4px;
  background:rgba(10,11,18,.92);
  backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);
  border-top:1px solid rgba(217,168,78,.12);
  border-radius:24px 24px 0 0;
  z-index:200;
  padding:6px 6px calc(6px + env(safe-area-inset-bottom,0px));
  box-shadow:0 -8px 40px rgba(0,0,0,.4),0 -1px 0 rgba(217,168,78,.06) inset;
}
.tf-nav::before{
  content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:120px;height:3px;border-radius:0 0 6px 6px;
  background:linear-gradient(90deg,transparent,var(--gold,#d9a84e),transparent);
  opacity:.4;
}
.tf-nav-btn{
  flex:1;padding:8px 4px 6px;font-size:11px;font-weight:500;
  color:var(--text3,#6b7280);text-align:center;
  display:flex;flex-direction:column;align-items:center;gap:3px;
  border-radius:16px;transition:all .2s cubic-bezier(.4,0,.2,1);
  position:relative;cursor:pointer;border:none;background:transparent;
  min-height:52px;
}
.tf-nav-btn:active{transform:scale(.92);}
.tf-nav-btn.active{
  color:var(--cyan,#34e0a4);font-weight:700;
  background:linear-gradient(180deg,rgba(52,224,164,.12),rgba(52,224,164,.04));
  box-shadow:0 0 20px rgba(52,224,164,.08),0 0 0 1px rgba(52,224,164,.12) inset;
}
.tf-nav-btn.active::after{
  content:'';position:absolute;top:2px;left:50%;transform:translateX(-50%);
  width:24px;height:3px;border-radius:2px;
  background:var(--cyan,#34e0a4);
  box-shadow:0 0 8px var(--cyan,#34e0a4);
}
/* icons — filled when active */
.tf-nav-btn::before{
  content:"";display:block;width:24px;height:24px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'/%3E%3Cpolyline points='9 22 9 12 15 12 15 22'/%3E%3C/svg%3E") no-repeat center/contain;
  transition:transform .2s;
}
.tf-nav-btn[data-tab="game"]::before{
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='12 2 22 8.5 22 15.5 12 22 2 15.5 2 8.5 12 2'/%3E%3Cline x1='12' y1='22' x2='12' y2='15.5'/%3E%3Cpolyline points='22 8.5 12 15.5 2 8.5'/%3E%3C/svg%3E") no-repeat center/contain;
}
.tf-nav-btn[data-tab="account"]::before{
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 20c0-4 4-6 8-6s8 2 8 6'/%3E%3C/svg%3E") no-repeat center/contain;
}
.tf-nav-btn.active::before{transform:scale(1.12);}
/* room select inside nav */
.tf-global-room{
  background:rgba(37,42,62,.9);color:var(--text,#e8eaf0);
  border:1px solid var(--border,#3a4060);border-radius:8px;
  padding:4px 6px;font-size:11px;max-width:120px;
  flex:0 0 auto;align-self:center;margin:0 4px;
}

/* tab 面板 */
.tf-tab-panel{padding:24px 16px;}
.tf-account-box{max-width:480px;margin:0 auto;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:24px;}
.tf-account-box h3{margin-bottom:16px;font-size:18px;color:var(--text);}
.tf-acc-row{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line2);margin-bottom:12px;color:var(--text2);}
.tf-add-room{display:flex;gap:8px;margin-top:14px;}
.tf-acc-rooms{display:flex;flex-direction:column;gap:6px;}
.tf-acc-room{display:flex;align-items:center;justify-content:space-between;padding:10px;border:1px solid var(--line2);border-radius:10px;background:rgba(255,255,255,.02);}
.tf-acc-room b{font-size:13px;color:var(--text);}
.tf-acc-room span{font-size:10px;color:var(--text3);display:block;}
.tf-acc-room-btns{display:flex;gap:6px;}
.tf-acc-room-btns .tf-chip{font-size:11px;padding:4px 10px;}
.tf-vs{display:flex;flex-direction:column;gap:5px;}
.tf-vs-row{display:flex;align-items:center;gap:8px;padding:7px 8px;border:1px solid var(--line2);border-radius:8px;background:rgba(255,255,255,.02);font-size:12px;}
.tf-vs-name{flex:1;color:var(--text);}
.tf-vs-row .tf-chip{font-size:10px;padding:3px 8px;}

/* ====== 弹层 ====== */
.tf-modal{display:none;position:fixed;inset:0;background:rgba(7,17,31,.65);backdrop-filter:blur(3px);z-index:100;align-items:center;justify-content:center;padding:16px;}
.tf-modal.show{display:flex;}
.tf-modal-card{background:linear-gradient(180deg,#131520,#0c0d15);border:1px solid var(--line2);border-radius:18px;width:100%;max-width:380px;max-height:86vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow-md);}
.tf-modal-wide{max-width:520px;}
.tf-modal-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--line2);}
.tf-modal-head h3{font-size:16px;color:var(--text);}
.tf-close{font-size:24px;color:var(--text3);line-height:1;width:28px;height:28px;}
.tf-modal-body{padding:18px;display:flex;flex-direction:column;gap:12px;}
.tf-modal-foot{padding:0 18px 14px;display:flex;gap:10px;}
.tf-modal-foot .tf-chip{flex:1;text-align:center;padding:11px;}
.tf-input{width:100%;padding:11px 14px;border:1px solid var(--line2);border-radius:10px;font-size:14px;background:rgba(0,0,0,.25);color:var(--text);}
.tf-input::placeholder{color:#5b6b8c;}
.tf-input:focus{outline:none;border-color:var(--cyan3);box-shadow:0 0 0 3px rgba(52,224,164,.1);}
.tf-err{color:#ef4444;font-size:12px;}
.tf-hint{text-align:center;color:var(--text3);font-size:12px;padding:0 18px 16px;}
.tf-tabs{display:flex;gap:8px;padding:12px 16px 0;}
.tf-tab{padding:8px 14px;border-radius:10px;font-size:13px;color:var(--text3);}
.tf-tab.active{background:linear-gradient(135deg,rgba(52,224,164,.12),rgba(52,224,164,.04));color:var(--cyan);}
.tf-badge{background:var(--cyan3);color:#06203a;border-radius:10px;padding:1px 7px;font-size:11px;margin-left:4px;}
.tf-modal-search{padding:12px 16px;}
.tf-modal-search .tf-input{border-radius:20px;}
.tf-room-list{padding:0 16px 16px;overflow-y:auto;flex:1;}
.tf-room-item{display:flex;align-items:center;gap:10px;padding:10px;border-radius:12px;margin-bottom:6px;border:1px solid var(--line2);transition:.12s;background:rgba(255,255,255,.02);}
.tf-room-item:active{background:rgba(255,255,255,.05);}
.tf-room-item.active{border-color:var(--cyan3);background:rgba(52,224,164,.08);}
.tf-room-avatar{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,var(--gold),var(--gold-deep));display:flex;align-items:center;justify-content:center;color:#5a3d00;font-weight:700;flex-shrink:0;overflow:hidden;}
.tf-room-avatar img{width:100%;height:100%;object-fit:cover;}
.tf-room-info{flex:1;min-width:0;}
.tf-room-info b{font-size:13px;display:block;color:var(--text);}
.tf-room-info span{font-size:11px;color:var(--text3);}
.tf-live-tag{font-size:10px;color:#fff;background:#ef4444;padding:2px 6px;border-radius:6px;}

.tf-loading{text-align:center;color:var(--text3);padding:40px;grid-column:1/-1;}

/* ====== 响应式 ====== */
@media(max-width:860px){
  .tf-banner{display:none;}
  .tf-main{flex-direction:column;padding:12px;}
  .tf-sidebar{width:100%;position:static;}
}
@media(max-width:420px){
  .tf-beast-grid{grid-template-columns:repeat(3,1fr);gap:6px;max-width:100%;}
  .tf-room-name{max-width:90px;}
}
/* ============ 九法降妖 游戏界面 ============ */
.tf-game-wrap{display:flex;flex-direction:column;gap:14px;padding:4px 0 20px;}
.tf-game-roombar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.tf-game-select{background:var(--bg,#252a3e);color:var(--text,#e8eaf0);border:1px solid var(--border,#3a4060);border-radius:8px;padding:7px 10px;font-size:13px;max-width:260px;}
.tf-game-account{font-size:12px;opacity:.8;}
/* 全局房间下拉(底部导航固定位置, 主页与游戏共用) */
.tf-global-room{background:rgba(37,42,62,.9);color:var(--text,#e8eaf0);border:1px solid var(--border,#3a4060);border-radius:8px;padding:6px 8px;font-size:12px;max-width:200px;margin-left:6px;flex:0 0 auto;}
.tf-game-roomhint{font-size:12px;opacity:.85;}
.tf-game-roomhint b{color:var(--gold,#e6c15a);}
.tf-game-round{display:flex;gap:14px;align-items:center;flex-wrap:wrap;background:rgba(255,255,255,.04);border-radius:10px;padding:10px 14px;font-size:13px;}
.tf-round-time{display:inline-flex;align-items:center;gap:4px;opacity:.95;}
.tf-round-status{color:#5ecf8a;font-weight:600;}
.tf-round-wait{color:#e85d68;}
.cd-label{color:var(--gold,#e6c15a);font-weight:600;white-space:nowrap;}
.cd-unit{opacity:.7;}
.cd-inline{font-size:13px;}
.tf-game-roundinfo{display:flex;align-items:center;gap:12px;padding:6px 0;font-size:14px;}
.tf-game-board{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;max-width:560px;margin:0 auto;width:100%;}
.tf-board-hint{grid-column:1/-1;text-align:center;color:var(--text);opacity:.6;padding:24px 0;font-size:13px;}
.tf-game-betpanel{background:rgba(230,193,90,.08);border:1px solid rgba(230,193,90,.3);border-radius:10px;padding:12px 14px;display:flex;flex-direction:column;gap:10px;}
.tf-bet-title{font-weight:600;font-size:14px;}
.tf-bet-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.tf-bet-row label{font-size:13px;display:flex;align-items:center;gap:6px;}
.tf-bet-row input{background:var(--bg,#252a3e);color:var(--text,#e8eaf0);border:1px solid var(--border,#3a4060);border-radius:6px;padding:6px 8px;}
.tf-bet-price{font-weight:700;color:var(--gold,#e6c15a);}
.tf-bet-msg{font-size:12px;min-height:16px;}
.tf-game-history-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;}
.tf-game-history-head strong{font-size:14px;}
.tf-chip{padding:8px 16px;border:none;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;}
.tf-chip-primary{background:linear-gradient(135deg,var(--gold,#d9a84e) 0%,var(--gold-deep,#b88a2e) 100%);color:#1a1408;box-shadow:0 4px 14px rgba(217,168,78,.2);}
.tf-chip-danger{background:#e85d68;color:#fff;}
.tf-chip:disabled{opacity:.5;cursor:not-allowed;}
/* ============ 登录门禁遮罩 ============ */
.login-gate{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;
  background:var(--bg,#1a1c29);}
.login-gate-card{background:linear-gradient(180deg,#131520,#0c0d15);border:1px solid var(--line2);
  border-radius:20px;padding:40px 44px;text-align:center;max-width:360px;width:90%;
  box-shadow:0 20px 60px rgba(0,0,0,.5);}
.login-gate-logo{font-size:22px;font-weight:800;background:linear-gradient(135deg,#d9a84e,#34e0a4);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:14px;}
.login-gate-tip{font-size:13px;opacity:.75;margin-bottom:24px;line-height:1.6;}
.login-gate-btn{width:100%;padding:12px;font-size:15px;}
.login-gate-hint{font-size:11px;opacity:.5;margin-top:14px;}

.tf-game-balance{font-size:12px;opacity:.85;}
.tf-game-balance b{color:var(--gold,#e6c15a);}
.tf-records-summary{padding:10px 18px;font-size:13px;color:var(--text2);border-bottom:1px solid var(--line2);}
.tf-records-summary b{color:var(--text);}
.tf-records-list{max-height:60vh;overflow-y:auto;padding:10px 14px;display:flex;flex-direction:column;gap:8px;}
.tf-record-item{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:3px;}
.tf-record-item.rec-win{border-color:rgba(34,197,94,.5);background:rgba(34,197,94,.08);}
.tf-record-item.rec-lose{opacity:.82;}
.tf-record-spell{font-weight:600;font-size:14px;color:var(--text);}
.tf-record-spell .tf-record-num{font-size:11px;opacity:.6;font-weight:400;}
.tf-record-detail{font-size:12px;color:var(--text2);}
.tf-record-result{font-size:13px;font-weight:600;color:var(--gold);}
.tf-record-item.rec-win .tf-record-result{color:#22c55e;}
.tf-record-item.rec-lose .tf-record-result{color:#e85d68;}
.tf-record-item.rec-pending .tf-record-result{color:#e6c15a;}
.tf-record-meta{font-size:11px;opacity:.6;}
.tf-records-empty,.tf-records-loading{text-align:center;color:var(--text3);padding:40px;}

/* ====== 房间对比分析（对齐漫象 vl） ====== */
.tf-vs-tbl-wrap{overflow-x:auto;margin-top:8px;}
.tf-vs-tbl{width:100%;border-collapse:collapse;font-size:12px;min-width:680px;}
.tf-vs-tbl th{white-space:nowrap;padding:7px 6px;text-align:center;color:var(--gold);font-weight:600;border-bottom:1px solid var(--line);background:rgba(217,168,78,0.04);}
.tf-vs-tbl td{padding:6px;text-align:center;border-bottom:1px solid rgba(255,255,255,0.04);color:var(--text2);}
.tf-vs-tbl td.tf-vs-name-cell{text-align:left;}
.tf-vs-tbl td.tf-vs-name-cell b{color:var(--text);font-size:12px;}
.tf-vs-tbl td.tf-vs-name-cell small{display:block;color:var(--text3);font-size:10px;}
.tf-vs-tbl tr.tf-vs-cur{background:rgba(217,168,78,0.06);}
.tf-vs-tbl tr.tf-vs-cur td:first-child::before{content:'▶';color:var(--gold);font-size:9px;margin-right:2px;}
.tf-vs-balls{display:flex;gap:2px;justify-content:center;}
.tf-vs-ball{display:inline-flex;width:18px;height:18px;border-radius:50%;align-items:center;justify-content:center;font-size:10px;font-weight:700;transition:all .2s;}
.tf-vs-tbl .dev-pos{color:#f87171;font-weight:700;}
.tf-vs-tbl .dev-neg{color:#4ade80;font-weight:700;}
.tf-st{display:inline-block;padding:2px 7px;border-radius:3px;font-size:11px;font-weight:600;}
.tf-st.st-bal{background:rgba(34,197,94,0.15);color:#22c55e;}
.tf-st.st-mild{background:rgba(245,158,11,0.15);color:#f59e0b;}
.tf-st.st-conc{background:rgba(239,68,68,0.15);color:#ef4444;}
.tf-vs-insight{margin:8px 0 0;padding:8px 12px;font-size:12px;color:var(--text2);background:rgba(255,255,255,0.03);border-radius:0 0 8px 8px;border-left:2px solid var(--gold);}
.tf-vs-insight b{color:var(--gold);}


/* ====== 推荐卡模型配置 ====== */
.rec-gear{ cursor:pointer; font-size:14px; margin-left:6px; opacity:0.7; transition:opacity .2s; }
.rec-gear:hover{ opacity:1; }
.rec-custom-badge{ display:inline-block; font-size:9px; padding:1px 5px; border-radius:8px; background:#6366f1; color:#fff; margin-left:4px; vertical-align:middle; }
.rec-official-badge{ display:inline-block; font-size:9px; padding:1px 5px; border-radius:8px; background:rgba(255,255,255,.15); color:#aaa; margin-left:4px; vertical-align:middle; }

.rec-config-box{ max-width:460px; }
.rec-config-body{ padding:16px 20px; max-height:70vh; overflow-y:auto; }
.rec-config-body h4{ margin:0 0 10px; font-size:14px; color:var(--gold,#f3cf4e); }
.cfg-section{ background:rgba(0,0,0,.2); border-radius:10px; padding:12px 14px; margin-bottom:14px; }
.cfg-row{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.cfg-row:last-child{ margin-bottom:0; }
.cfg-row label{ font-size:13px; opacity:.85; }
.cfg-row input[type="number"], .cfg-row select{
  width:80px; padding:4px 8px; border-radius:6px; border:1px solid rgba(255,255,255,.15);
  background:rgba(0,0,0,.3); color:#fff; font-size:13px; text-align:center;
}
.cfg-row input[type="number"]:focus, .cfg-row select:focus{ outline:none; border-color:var(--gold,#f3cf4e); }
.cfg-radio-group{ display:flex; gap:12px; }
.cfg-radio-group label{ font-size:12px; cursor:pointer; display:flex; align-items:center; gap:4px; }
.cfg-radio-group input{ width:auto; }
.cfg-mix-bar{ display:flex; height:24px; border-radius:6px; overflow:hidden; margin:8px 0 4px; }
.cfg-mix-bar span{ display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:bold; color:#fff; transition:width .3s; }
.cfg-hint{ font-size:11px; opacity:.5; display:block; margin-top:4px; }
.cfg-warn{
  background:rgba(245,158,11,.15); border:1px solid rgba(245,158,11,.3);
  border-radius:8px; padding:8px 12px; font-size:12px; margin-bottom:14px; color:#fbbf24;
}
.cfg-warn a{ text-decoration:underline; }
.cfg-actions{ display:flex; gap:10px; margin-top:16px; }
.cfg-btn-save{
  flex:1; padding:10px; border:none; border-radius:8px; font-size:14px; font-weight:bold;
  cursor:pointer; background:linear-gradient(135deg,#6366f1,#8b5cf6); color:#fff; transition:opacity .2s;
}
.cfg-btn-save:hover{ opacity:.85; }
.cfg-btn-reset{
  flex:1; padding:10px; border:1px solid rgba(255,255,255,.2); border-radius:8px; font-size:13px;
  cursor:pointer; background:transparent; color:#ccc; transition:all .2s;
}
.cfg-btn-reset:hover{ background:rgba(255,255,255,.08); }

/* 预设模式卡片 */
.preset-list{ display:flex; flex-direction:column; gap:10px; margin-bottom:14px; }
.preset-card{
  display:flex; align-items:center; gap:12px;
  padding:12px 14px; border-radius:12px;
  background:rgba(255,255,255,.04); border:2px solid transparent;
  cursor:pointer; transition:all .2s;
}
.preset-card:hover{ background:rgba(255,255,255,.08); }
.preset-card.active{ border-color:var(--gold,#f3cf4e); background:rgba(243,207,78,.1); }
.preset-icon{ font-size:28px; flex-shrink:0; }
.preset-info{ flex:1; min-width:0; }
.preset-name{ font-size:15px; font-weight:600; color:#fff; margin-bottom:2px; }
.preset-tag{
  display:inline-block; font-size:10px; padding:1px 6px; border-radius:8px;
  background:rgba(255,255,255,.15); color:#aaa; margin-left:4px; font-weight:400;
}
.preset-card.active .preset-tag{ background:var(--gold,#f3cf4e); color:#1a1a2e; }
.preset-desc{ font-size:12px; opacity:.6; line-height:1.4; }
.preset-radio{ font-size:18px; color:var(--gold,#f3cf4e); flex-shrink:0; }
.cfg-advanced-toggle{
  font-size:13px; opacity:.6; cursor:pointer; padding:8px 0;
  transition:opacity .2s;
}
.cfg-advanced-toggle:hover{ opacity:1; }

/* ====== AI 智能分析 ====== */
.cfg-ai-section{
  margin:12px 0; padding:14px;
  background:linear-gradient(135deg,rgba(99,102,241,.15),rgba(139,92,246,.08));
  border-radius:12px; border:1px solid rgba(99,102,241,.25);
}
.cfg-btn-ai{
  width:100%; padding:12px; font-size:15px; font-weight:600; color:#fff;
  background:linear-gradient(135deg,#6366f1,#8b5cf6); border:none; border-radius:10px;
  cursor:pointer; transition:all .2s;
}
.cfg-btn-ai:hover{ transform:translateY(-1px); box-shadow:0 4px 14px rgba(99,102,241,.4); }
.cfg-btn-ai:disabled{ opacity:.6; cursor:wait; transform:none; }
.cfg-ai-hint{ font-size:11px; opacity:.5; text-align:center; margin-top:6px; }
.ai-spinner{
  display:inline-block; width:14px; height:14px;
  border:2px solid rgba(255,255,255,.3); border-top-color:#fff;
  border-radius:50%; animation:ai-spin .6s linear infinite; vertical-align:middle;
}
@keyframes ai-spin{ to{ transform:rotate(360deg); } }
.cfg-ai-result{ margin-top:10px; padding:10px; background:rgba(0,0,0,.3); border-radius:8px; }
.ai-reason{ font-size:13px; color:#a5b4fc; line-height:1.5; margin-bottom:6px; }
.ai-params{ font-size:12px; opacity:.6; }
.rec-ai-badge{
  display:inline-block; font-size:10px; padding:1px 6px; border-radius:8px;
  background:linear-gradient(135deg,#6366f1,#8b5cf6); color:#fff; margin-left:4px;
}
.preset-card.ai-card{ border-color:#6366f1 !important; background:rgba(99,102,241,.1) !important; }
.preset-card.ai-card .preset-tag{ background:#6366f1 !important; color:#fff !important; }

/* ====== 双AI模型选择 ====== */
.ai-model-list{ display:flex; flex-direction:column; gap:10px; margin:12px 0; }
.ai-model-card{
  display:flex; align-items:center; gap:12px; padding:14px;
  background:linear-gradient(135deg,rgba(99,102,241,.12),rgba(139,92,246,.06));
  border-radius:12px; border:1px solid rgba(99,102,241,.2);
  transition:all .2s;
}
.ai-model-card:hover{ border-color:rgba(99,102,241,.45); transform:translateY(-1px); }
.ai-model-icon{ font-size:28px; }
.ai-model-info{ flex:1; }
.ai-model-name{ font-size:15px; font-weight:600; }
.ai-model-vendor{ font-size:10px; padding:1px 6px; border-radius:8px; background:rgba(99,102,241,.2); margin-left:4px; }
.ai-model-desc{ font-size:11px; opacity:.55; margin-top:2px; }
.ai-model-btn{
  padding:10px 18px; font-size:14px; font-weight:600; color:#fff;
  background:linear-gradient(135deg,#6366f1,#8b5cf6); border:none; border-radius:10px;
  cursor:pointer; transition:all .2s; white-space:nowrap;
}
.ai-model-btn:hover{ box-shadow:0 4px 14px rgba(99,102,241,.4); }
.ai-model-btn:disabled{ opacity:.6; cursor:wait; }
/* 兼容旧 .preset-card 引用（如已无引用可忽略） */
.ai-spinner{
  display:inline-block; width:13px; height:13px;
  border:2px solid rgba(255,255,255,.3); border-top-color:#fff;
  border-radius:50%; animation:ai-spin .6s linear infinite; vertical-align:middle;
}
@keyframes ai-spin{ to{ transform:rotate(360deg); } }
.cfg-ai-result{ margin-top:8px; padding:10px; background:rgba(0,0,0,.3); border-radius:8px; }
.ai-reason{ font-size:13px; color:#a5b4fc; line-height:1.5; margin-bottom:6px; }
.ai-reason strong{ color:#c7d2fe; }
.ai-params{ font-size:12px; opacity:.6; }
.rec-ai-badge{
  display:inline-block; font-size:10px; padding:1px 6px; border-radius:8px;
  background:linear-gradient(135deg,#6366f1,#8b5cf6); color:#fff; margin-left:4px;
}

/* ============================================================
   妖鉴·墨韵 v3.1 — 全端响应式 + 登录页背景图 + 统一增强
   ============================================================ */

/* --- 全面屏安全区适配 --- */
:root{
  --safe-top:env(safe-area-inset-top,0px);
  --safe-bot:env(safe-area-inset-bottom,0px);
  --safe-l:env(safe-area-inset-left,0px);
  --safe-r:env(safe-area-inset-right,0px);
}

/* --- 登录门禁遮罩：背景图 + 毛玻璃 --- */
.tf-login-gate,.login-gate{
  background:url('/assets/login-bg.png') center/cover no-repeat fixed,
    linear-gradient(180deg,#0c0d13 0%,#070810 100%) !important;
}
.tf-login-gate::before,.login-gate::before{
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse at center, rgba(12,13,19,.72) 0%, rgba(7,8,16,.92) 100%);
  pointer-events:none; z-index:0;
}
.tf-login-gate>*,.login-gate>*{ position:relative; z-index:1; }

/* --- 登录门禁卡片增强 --- */
.tf-login-gate .tf-login-card,.login-gate .tf-login-card,
.tf-login-gate .login-card,.login-gate .login-card{
  backdrop-filter:blur(24px) saturate(160%);
  -webkit-backdrop-filter:blur(24px) saturate(160%);
  background:rgba(12,13,19,.65) !important;
  border:1px solid rgba(217,168,78,.22) !important;
  box-shadow:0 24px 80px rgba(0,0,0,.55), 0 0 0 1px rgba(217,168,78,.08) inset !important;
  border-radius:20px !important;
}
.tf-login-gate h2,.login-gate h2{
  background:linear-gradient(135deg,var(--gold-soft2),var(--gold),var(--ember));
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
  letter-spacing:.12em; text-shadow:0 0 40px rgba(217,168,78,.35);
}

/* ============================================================
   响应式断点体系：
   - 1280px+ : 大屏/桌面端（放大间距）
   - 768–1024: 平板
   - 480–768 : 大手机/小平板
   - <480px  : 小手机（全面屏）
   ============================================================ */

/* === 超大屏 (>1440px) === */
@media(min-width:1441px){
  .tf-app{ max-width:1320px; margin:0 auto; }
  .tf-grid{ gap:16px; }
  .spell-card{ min-height:112px; }
  .tf-cell{ font-size:17px; }
}

/* === 大桌面 (1025–1440px) === */
@media(min-width:1025px) and (max-width:1440px){
  .tf-app{ max-width:1200px; margin:0 auto; }
}

/* === 平板 (769–1024px) === */
@media(min-width:769px) and (max-width:1024px){
  .tf-topbar{ flex-wrap:wrap; gap:8px; padding:10px 16px; }
  .tf-grid{ gap:10px; }
  .tf-cell{ font-size:15px; }
  .spell-card{ min-height:96px; }
}

/* === 手机 & 小平板 (≤768px) === */
@media(max-width:768px){
  :root{ --gold:#d9a84e; }
  body{ font-size:14px; padding:0; }
  body::before{ opacity:.018; }

  .tf-topbar{
    flex-direction:column; align-items:stretch;
    padding:calc(8px + var(--safe-top)) 12px 8px;
    gap:8px; position:sticky; top:0; z-index:1000;
  }
  .tf-topbar h1{ font-size:18px; text-align:center; }
  .tf-nav{ flex-wrap:nowrap; }
  .tf-nav-btn{ padding:8px 4px 6px; font-size:11px; min-height:48px; }
  .tf-nav-btn::before{ width:22px; height:22px; }
  .tf-global-room{ max-width:90px; font-size:10px; }

  .tf-toolbar{
    flex-direction:column; align-items:stretch;
    padding:8px 12px; gap:8px;
  }
  .tf-toolbar>label,.tf-toolbar>span,.tf-toolbar>div{
    width:100%; justify-content:space-between;
  }
  .tf-toolbar select,.tf-toolbar input[type=text]{
    width:100%; font-size:14px; min-height:38px;
  }

  .tf-grid{
    grid-template-columns:repeat(auto-fill,minmax(42px,1fr)) !important;
    gap:4px; padding:8px;
  }
  .tf-cell{
    font-size:13px; min-height:42px; border-radius:8px;
  }
  .tf-cell-head{ font-size:11px; }
  .spell-card{
    min-height:80px; border-radius:12px;
    padding:8px 6px; font-size:12px;
  }
  .spell-card .beast-name{ font-size:13px; }

  /* 卡片/面板 */
  .tf-card,.panel,.card{
    border-radius:14px; margin:8px 12px;
    padding:14px;
  }

  /* 追踪面板 */
  .tf-tracker,.tf-track{
    margin:0 12px 8px; border-radius:14px;
  }

  /* 版本切换 */
  .tf-version-bar,.tf-ver{
    padding:6px 12px; gap:4px; overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }

  /* 底部安全区 */
  .tf-footer,#footer{
    padding-bottom:calc(16px + var(--safe-bot));
  }

  /* Modal 全屏化 */
  .tf-modal,.modal-overlay,.qr-modal,.game-modal{
    padding:0 !important; align-items:stretch !important;
  }
  .tf-modal .tf-modal-box,.modal-box,.qr-box,.game-box{
    border-radius:0 !important;
    width:100% !important; max-width:100% !important;
    height:100vh !important; max-height:100vh !important;
    margin:0 !important;
    padding:calc(16px + var(--safe-top)) 16px calc(16px + var(--safe-bot));
    overflow-y:auto;
  }

  /* 表格 */
  table{ font-size:13px; }
  th,td{ padding:6px 8px; }
  .tf-table-wrap,.table-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }

  /* 按钮可触控 */
  button,.btn,.tf-btn,.tf-nav-btn{
    min-height:40px; touch-action:manipulation;
  }
}

/* === 小手机 (≤480px) === */
@media(max-width:480px){
  body{ font-size:13px; }
  .tf-topbar h1{ font-size:16px; letter-spacing:.06em; }
  .tf-nav-btn{
    padding:5px 8px; font-size:11px;
  }
  .tf-nav-btn .nav-icon{ width:16px; height:16px; }
  .tf-grid{
    grid-template-columns:repeat(auto-fill,minmax(38px,1fr)) !important;
    gap:3px;
  }
  .tf-cell{
    font-size:12px; min-height:38px; border-radius:6px;
  }
  .spell-card{
    min-height:72px; padding:6px 4px; font-size:11px;
  }
  .spell-card .beast-name{ font-size:12px; }
  .tf-card,.panel,.card{
    margin:6px 8px; padding:12px; border-radius:12px;
  }
}

/* === 横屏手机 === */
@media(max-height:480px) and (orientation:landscape){
  .tf-topbar{ padding:4px 12px; flex-direction:row; }
  .tf-topbar h1{ font-size:15px; }
  .tf-nav-btn{ padding:6px 2px 4px; font-size:10px; }
  .tf-nav-btn::before{ width:20px; height:20px; }
  .tf-global-room{ max-width:80px; }
}

/* ============================================================
   统一组件增强（所有页面共享）
   ============================================================ */

/* --- 统一按钮系 --- */
.btn-primary,.tf-btn-primary{
  background:linear-gradient(135deg,var(--gold),var(--gold-deep));
  color:#1a1208; font-weight:600; border:none;
  padding:10px 20px; border-radius:10px; cursor:pointer;
  transition:all .25s; min-height:40px; font-size:14px;
  box-shadow:0 4px 16px rgba(217,168,78,.22);
}
.btn-primary:hover,.tf-btn-primary:hover{
  box-shadow:0 6px 24px rgba(217,168,78,.4); transform:translateY(-1px);
}
.btn-primary:active,.tf-btn-primary:active{ transform:translateY(0); }

.btn-ghost,.tf-btn-ghost{
  background:rgba(255,255,255,.05); color:var(--gold-soft);
  border:1px solid rgba(217,168,78,.18);
  padding:9px 18px; border-radius:10px; cursor:pointer;
  transition:all .25s; min-height:40px; font-size:14px;
}
.btn-ghost:hover,.tf-btn-ghost:hover{
  background:rgba(217,168,78,.1); border-color:rgba(217,168,78,.35);
}

/* --- 统一输入框 --- */
input[type=text],input[type=password],input[type=number],
select,textarea,.tf-input,.tf-select{
  background:rgba(255,255,255,.04) !important;
  border:1px solid rgba(217,168,78,.15) !important;
  border-radius:10px; padding:10px 14px;
  color:var(--gold-soft); font-size:14px;
  transition:border-color .2s,box-shadow .2s;
  min-height:40px;
}
input:focus,select:focus,textarea:focus,.tf-input:focus,.tf-select:focus{
  outline:none;
  border-color:var(--gold) !important;
  box-shadow:0 0 0 3px rgba(217,168,78,.12);
}
input::placeholder{ color:rgba(255,255,255,.25); }

/* --- 统一卡片 --- */
.tf-card,.panel,.card,.info-card{
  background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,.01));
  border:1px solid rgba(217,168,78,.1);
  border-radius:16px;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}

/* --- 统一标题 --- */
h1,h2,h3{ letter-spacing:.06em; }
.tf-section-title,.section-title{
  color:var(--gold-soft); font-size:15px; font-weight:600;
  letter-spacing:.1em; margin-bottom:12px;
  display:flex; align-items:center; gap:8px;
}
.tf-section-title::before,.section-title::before{
  content:''; width:3px; height:16px;
  background:linear-gradient(180deg,var(--gold),var(--ember));
  border-radius:2px; flex-shrink:0;
}

/* --- 统一表格 --- */
table{
  border-collapse:separate; border-spacing:0;
  width:100%; font-size:14px;
}
thead th{
  background:rgba(217,168,78,.06);
  color:var(--gold-soft); font-weight:600;
  text-align:left; padding:10px 12px;
  border-bottom:1px solid rgba(217,168,78,.12);
  white-space:nowrap;
}
tbody td{
  padding:10px 12px;
  border-bottom:1px solid rgba(255,255,255,.04);
  color:rgba(255,255,255,.75);
}
tbody tr:hover{ background:rgba(217,168,78,.04); }

/* --- 统一徽章 --- */
.badge,.tag,.tf-tag{
  display:inline-flex; align-items:center;
  padding:2px 10px; border-radius:6px;
  font-size:12px; font-weight:500;
  background:rgba(217,168,78,.1); color:var(--gold-soft);
  border:1px solid rgba(217,168,78,.15);
}

/* --- 统一链接 --- */
a{ color:var(--gold); text-decoration:none; transition:color .2s; }
a:hover{ color:var(--gold-soft2); }

/* --- 统一滚动条（桌面端） --- */
::-webkit-scrollbar{ width:8px; height:8px; }
::-webkit-scrollbar-track{ background:rgba(0,0,0,.2); }
::-webkit-scrollbar-thumb{
  background:rgba(217,168,78,.2); border-radius:4px;
}
::-webkit-scrollbar-thumb:hover{ background:rgba(217,168,78,.35); }

/* --- 选中文字 --- */
::selection{ background:rgba(217,168,78,.25); color:var(--gold-soft2); }

/* --- 动画减弱模式（无障碍） --- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    transition-duration:.01ms !important;
  }
}

/* --- 深色/浅色自动 --- */
@media(prefers-color-scheme:light){
  /* 本站以深色为主，浅色下微调可读性（不做完整浅色） */
  .tf-login-gate .tf-login-card{
    background:rgba(12,13,19,.82) !important;
  }
}

/* ====== AI 直推模式样式 ====== */
.ai-model-actions{display:flex;gap:6px;flex-wrap:wrap}
.ai-direct-btn{background:linear-gradient(135deg,#667eea,#764ba2)!important;color:#fff!important}
.ai-direct-btn:hover{opacity:.88}
.ai-direct-card{border:1px solid rgba(118,75,162,.5)!important;box-shadow:0 0 12px rgba(118,75,162,.2)}
.ai-ev-section{margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.08)}
.ai-ev-title{font-size:11px;color:#a78bfa;font-weight:600;margin-bottom:4px}
.ai-ev-item{display:flex;align-items:center;gap:6px;font-size:11px;margin:3px 0}
.ai-ev-item .ev-num{width:18px;height:18px;border-radius:4px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:10px}
.ai-ev-item .ev-val{color:#fbbf24;font-weight:600;min-width:48px}
.ai-ev-item .ev-reason{color:#9ca3af;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ai-patterns{margin-top:6px}
.ai-pattern{font-size:11px;color:#9ca3af;margin:2px 0}
.ai-reason-text{margin-top:6px;font-size:11px;color:#a78bfa;line-height:1.4;padding:6px 8px;background:rgba(118,75,162,.1);border-radius:6px}
.ai-back-classic{margin-top:8px;width:100%;padding:4px;font-size:11px;border:1px solid rgba(255,255,255,.15);border-radius:6px;background:transparent;color:#9ca3af;cursor:pointer;transition:all .2s}
.ai-back-classic:hover{background:rgba(255,255,255,.05);color:#e5e7eb}

/* 未来10期预测（紧凑可折叠） */
/* 未来10期 各号出现几率面板（直推） */
.cov-panel{margin-top:6px;border-top:1px dashed rgba(167,139,250,.2);padding-top:6px}
.cov-head{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:5px}
.cov-title{font-size:11px;color:#c4b5fd;font-weight:600;display:flex;align-items:center;gap:4px}
.cov-focus-in{display:flex;align-items:center}
.ai-focus-input{
  width:64px;font-size:10px;padding:1px 5px;border-radius:5px;
  border:1px solid rgba(167,139,250,.25);background:rgba(167,139,250,.08);
  color:#e5e7eb;text-align:center;outline:none;
}
.ai-focus-input:focus{border-color:rgba(167,139,250,.6);background:rgba(167,139,250,.16)}
.cov-grid{
  display:grid;grid-template-columns:repeat(9,1fr);gap:4px;
}
.cov-cell{
  display:flex;flex-direction:column;align-items:center;gap:2px;
  padding:4px 2px;border-radius:5px;background:rgba(255,255,255,.03);
  border:1px solid transparent;transition:all .15s;
}
.cov-cell.focus{
  background:rgba(167,139,250,.14);border-color:rgba(167,139,250,.5);
  box-shadow:0 0 6px rgba(167,139,250,.3);
}
.cov-num{font-size:13px;font-weight:700;color:#e5e7eb;line-height:1}
.cov-bar{width:100%;height:4px;border-radius:2px;background:rgba(255,255,255,.08);overflow:hidden}
.cov-bar i{display:block;height:100%;background:linear-gradient(90deg,#667eea,#764ba2);border-radius:2px}
.cov-cell.focus .cov-bar i{background:linear-gradient(90deg,#a78bfa,#fbbf24)}
.cov-pct{font-size:9px;color:#94a3b8;font-weight:600}
.cov-summary{margin-top:6px;font-size:10px;color:#94a3b8;text-align:center}
.cov-summary b{color:#c4b5fd;font-size:11px}
@media (max-width:480px){
  .cov-grid{gap:3px}
  .cov-cell{padding:3px 1px}
  .cov-num{font-size:12px}
  .cov-pct{font-size:8px}
}


/* ====== AI 智能分析面板（紧凑版） ====== */
.ai-insight-section{
  flex:0 0 100%; width:100%; margin:1px 0; padding:0;
  background:linear-gradient(135deg,rgba(102,126,234,.06) 0%,rgba(118,75,162,.04) 100%);
  border:1px solid rgba(118,75,162,.15); border-radius:7px; overflow:hidden;
}
.ai-topbar-row{ flex:0 0 100%; width:100%; }

.ai-bar{
  display:flex; align-items:center; justify-content:space-between;
  gap:4px; padding:3px 6px; flex-wrap:wrap;
}
.ai-bar-left{ display:flex; align-items:center; gap:5px; flex:1; min-width:0; }
.ai-title{ font-size:11px; font-weight:700; color:#a78bfa; white-space:nowrap; flex-shrink:0; display:inline-flex; align-items:center; gap:3px; }
.ai-title svg{ width:14px; height:14px; flex-shrink:0; }
.ai-models{ display:flex; align-items:center; gap:3px; flex-wrap:wrap; }

/* 横排Tab式模型选择器 */
.ai-tabs{ display:flex; align-items:center; gap:3px; flex-wrap:wrap; }
.ai-tab{
  display:inline-flex; align-items:center; gap:2px;
  padding:1px 6px;
  background:rgba(167,139,250,.06); border:1px solid rgba(167,139,250,.18);
  border-radius:10px; white-space:nowrap; cursor:pointer; transition:all .12s;
  font-size:10px; font-weight:600; color:#c4b5fd;
}
.ai-tab:hover{ background:rgba(167,139,250,.14); border-color:rgba(167,139,250,.35); }
.ai-tab.active{
  background:rgba(167,139,250,.28); border-color:rgba(167,139,250,.55);
  color:#fff; box-shadow:0 0 6px rgba(167,139,250,.4);
}
.ai-tab-icon{ font-size:12px; line-height:1; }
.ai-tab-name{ font-size:10px; }

/* 操作按钮组（分析/直推） */
.ai-actions{ display:flex; align-items:center; gap:3px; flex-shrink:0; }
.ai-act-btn{
  font-size:10px; font-weight:600; padding:2px 8px;
  border:1px solid rgba(167,139,250,.25); border-radius:8px;
  background:rgba(167,139,250,.18); color:#c4b5fd;
  cursor:pointer; transition:all .12s; line-height:1.4; white-space:nowrap;
}
.ai-act-btn:hover{ background:rgba(167,139,250,.38); color:#fff; border-color:rgba(167,139,250,.5); }
.ai-act-btn:disabled{ opacity:.5; cursor:wait; }
.ai-act-btn.direct{
  background:rgba(251,146,60,.18); color:#fbbf24; border-color:rgba(251,146,60,.3);
}
.ai-act-btn.direct:hover{ background:rgba(251,146,60,.42); color:#fff; }

/* 第二行信息条 */
.ai-inline-info{
  display:flex; align-items:center; gap:4px;
  padding:1px 8px 3px; font-size:10px; color:#94a3b8;
  border-top:1px dashed rgba(167,139,250,.08);
}
.ai-reason-icon{ font-size:11px; }
.ai-hint-text{ color:#64748b; font-style:italic; }

/* 保留旧版以兼容历史DOM */
.ai-mcard{
  display:inline-flex; align-items:center; gap:2px;
  padding:1px 3px 1px 5px;
  background:rgba(167,139,250,.06); border:1px solid rgba(167,139,250,.15);
  border-radius:14px; white-space:nowrap; transition:all .12s;
}
.ai-mcard:hover{ background:rgba(167,139,250,.12); border-color:rgba(167,139,250,.3); }
.ai-micon{ font-size:11px; }
.ai-mname{ font-size:10px; font-weight:600; color:#c4b5fd; }
.ai-mbtn{
  font-size:9px; font-weight:600; padding:1px 6px;
  border:none; border-radius:8px;
  background:rgba(167,139,250,.18); color:#c4b5fd;
  cursor:pointer; transition:all .12s; line-height:1.4;
}
.ai-mbtn:hover{ background:rgba(167,139,250,.38); color:#fff; }
.ai-mbtn:disabled{ opacity:.5; cursor:wait; }
.ai-mbtn.direct{ background:rgba(251,146,60,.18); color:#fbbf24; }
.ai-mbtn.direct:hover{ background:rgba(251,146,60,.42); color:#fff; }

.ai-bar-tools{ display:flex; align-items:center; gap:2px; flex-shrink:0; }
.ai-tool{
  width:20px; height:20px; display:inline-flex; align-items:center; justify-content:center;
  font-size:11px; border:1px solid rgba(167,139,250,.15); border-radius:4px;
  background:rgba(167,139,250,.04); color:#a78bfa; cursor:pointer; transition:all .12s; padding:0;
}

/* 移动端紧凑布局 */
@media (max-width: 480px){
  .ai-bar{ gap:3px; padding:2px 4px; }
  .ai-title{ font-size:10px; }
  .ai-tab{ padding:1px 4px; }
  .ai-tab-name{ font-size:9px; }
  .ai-act-btn{ font-size:9px; padding:1px 5px; }
  .ai-tool{ width:18px; height:18px; font-size:10px; }
  .ai-inline-info{ font-size:9px; padding:1px 5px 2px; }
}
@media (max-width: 360px){
  .ai-tab-name{ display:none; } /* 超窄屏只显示图标 */
  .ai-act-btn{ padding:1px 4px; }
}
.ai-tool:hover{ background:rgba(167,139,250,.16); border-color:rgba(167,139,250,.35); }
.ai-tool.save{ color:#4ade80; border-color:rgba(74,222,128,.2); background:rgba(74,222,128,.04); }
.ai-tool.save:hover{ background:rgba(74,222,128,.14); }
.ai-tool.close:hover{ color:#f87171; background:rgba(248,113,113,.1); border-color:rgba(248,113,113,.25); }

/* 详情展开/收起按钮 */
.ai-detail-toggle{
  text-align:center; padding:3px 6px; margin:2px 6px;
  font-size:11px; font-weight:600; color:#a78bfa;
  background:rgba(167,139,250,.06); border:1px solid rgba(167,139,250,.12);
  border-radius:6px; cursor:pointer; transition:all .12s; user-select:none;
}
.ai-detail-toggle:hover{ background:rgba(167,139,250,.14); border-color:rgba(167,139,250,.25); }
.ai-detail-toggle:active{ background:rgba(167,139,250,.2); }

/* 底部操作栏 */
.ai-bottom-bar{
  display:flex; align-items:center; justify-content:center; gap:4px;
  padding:3px 6px; border-top:1px solid rgba(255,255,255,.04);
}
.ai-bottom-bar .ai-act-btn{ padding:2px 10px; font-size:11px; }

/* 关闭后的悬浮按钮 */
.ai-fab{
  position:fixed; right:14px; bottom:80px; z-index:9999;
  width:46px; height:46px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:22px; cursor:pointer; line-height:1;
  background:linear-gradient(135deg,#7c3aed,#6366f1);
  box-shadow:0 4px 14px rgba(99,102,241,.45);
  transition:transform .15s,box-shadow .15s;
  animation:aiFabPulse 2s ease-in-out infinite;
}
.ai-fab:hover{ transform:scale(1.1); box-shadow:0 6px 20px rgba(99,102,241,.6); }
.ai-fab:active{ transform:scale(.95); }
.ai-fab svg{ width:22px; height:22px; }
@keyframes aiFabPulse{
  0%,100%{ box-shadow:0 4px 14px rgba(99,102,241,.45); }
  50%{ box-shadow:0 4px 14px rgba(99,102,241,.45),0 0 0 8px rgba(99,102,241,.12); }
}

.ai-spinner{
  display:inline-block; width:8px; height:8px;
  border:1.5px solid rgba(167,139,250,.3); border-top-color:#a78bfa;
  border-radius:50%; animation:ai-spin .6s linear infinite; vertical-align:middle;
}
@keyframes ai-spin{ to{ transform:rotate(360deg); } }

.ai-result-row{
  display:flex; align-items:center; gap:5px;
  padding:2px 6px; border-top:1px solid rgba(255,255,255,.04);
}
.ai-picks{ display:flex; align-items:center; gap:2px; flex-wrap:wrap; flex:1; }
.ai-pick-label{ font-size:9px; font-weight:600; color:#9ca3af; margin-right:1px; margin-left:3px; }
.ai-pick-label:first-child{ margin-left:0; }
.ai-pick-label.sub{ color:#6b7280; }
.ai-chip{
  width:18px; height:18px; border-radius:3px;
  display:inline-flex; align-items:center; justify-content:center;
  font-weight:700; font-size:10px; flex-shrink:0;
}
.ai-chip.sm{ width:16px; height:16px; border-radius:3px; font-size:9px; opacity:.85; }
.ai-conf{ font-size:11px; font-weight:800; white-space:nowrap; flex-shrink:0; }
.ai-time{ font-size:9px; color:#7dd3fc; white-space:nowrap; }
.ai-model-tag{
  font-size:9px; color:#a78bfa; background:rgba(167,139,250,.1);
  padding:0 4px; border-radius:6px; white-space:nowrap;
}

.ai-reason{
  display:flex; align-items:flex-start; gap:3px;
  padding:2px 6px 3px; font-size:10px; color:#c4b5fd; line-height:1.4;
}
.ai-reason-icon{ flex-shrink:0; }

.ai-hint{ padding:2px 6px 4px; font-size:10px; color:#6b7280; }
.ai-model-used{ padding:0 6px 3px; font-size:9px; color:#7dd3fc; }

.ai-detail{ padding:3px 6px; border-top:1px solid rgba(255,255,255,.04); font-size:10px; }
.ai-sec-title{ font-size:10px; color:#a78bfa; font-weight:600; margin-bottom:2px; }
.ai-detail .ic-ev-item{ display:flex; align-items:center; gap:4px; font-size:10px; margin:2px 0; }
.ai-detail .ic-ev-n{
  width:16px; height:16px; border-radius:3px;
  display:inline-flex; align-items:center; justify-content:center;
  font-weight:700; font-size:9px;
}
.ai-detail .ic-ev-v{ color:#fbbf24; font-weight:600; min-width:40px; }
.ai-detail .ic-ev-r{ color:#9ca3af; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ai-detail .ic-pt{ font-size:10px; color:#9ca3af; margin:1px 0; }
/* 高权重号(3/4/9)分析卡片 */
.ic-hm-list{ margin-top:4px; display:flex; flex-direction:column; gap:5px; }
.ic-hm-item{
  background:rgba(167,139,250,.06); border:1px solid rgba(167,139,250,.12);
  border-radius:6px; padding:5px 7px;
}
.ic-hm-head{ display:flex; align-items:center; gap:5px; margin-bottom:3px; }
.ic-hm-num{
  width:28px; height:18px; border-radius:4px;
  display:inline-flex; align-items:center; justify-content:center;
  font-weight:700; font-size:10px;
}
.ic-hm-tag{ font-size:9px; color:#fbbf24; font-weight:600; }
.ic-hm-prob, .ic-hm-trig{ font-size:10px; color:#d1d5db; margin:2px 0; line-height:1.45; }
.ic-hm-label{
  display:inline-block; min-width:48px;
  font-size:9px; color:#a78bfa; font-weight:600;
}
.ai-nav-row{ display:flex; align-items:center; gap:5px; margin-top:3px; }
.ai-nav-arrow{
  font-size:10px; padding:1px 8px; border-radius:4px; cursor:pointer;
  border:1px solid rgba(167,139,250,.15); background:rgba(167,139,250,.04);
  color:#c4b5fd; transition:all .12s;
}
.ai-nav-arrow:hover:not(:disabled){ background:rgba(167,139,250,.16); }
.ai-nav-arrow:disabled{ opacity:.35; cursor:not-allowed; }
.ai-nav-pos{ font-size:10px; color:#6b7280; flex:1; text-align:center; }

.ai-adv-panel{ margin:0; padding:3px 6px; border-top:1px solid rgba(255,255,255,.04); }
.ai-adv-panel .cfg-section{ background:rgba(0,0,0,.1); border-radius:4px; padding:4px 6px; margin-bottom:4px; }
.ai-adv-panel .cfg-section h4{ font-size:10px; color:#a78bfa; margin:0 0 3px; }
.ai-adv-panel .cfg-row{ display:flex; align-items:center; justify-content:space-between; margin-bottom:3px; }
.ai-adv-panel .cfg-row label{ font-size:10px; opacity:.8; }
.ai-adv-panel .cfg-row input[type="number"],
.ai-adv-panel .cfg-row select{
  width:56px; padding:1px 3px; font-size:10px;
  border:1px solid rgba(167,139,250,.15); border-radius:3px;
  background:rgba(0,0,0,.2); color:#e5e7eb;
}
.ai-adv-panel .cfg-radio-group{ display:flex; gap:6px; }
.ai-adv-panel .cfg-radio-group label{ font-size:10px; display:flex; align-items:center; gap:2px; cursor:pointer; }
.ai-adv-panel .cfg-radio-group input{ width:auto; }
.ai-adv-panel .cfg-hint{ font-size:9px; opacity:.4; display:block; margin-top:1px; }

.ic-list-dd{
  margin:0; max-height:200px; overflow-y:auto;
  border-top:1px solid rgba(255,255,255,.05); background:rgba(0,0,0,.15);
}
.ic-list-item{
  display:flex; align-items:center; gap:8px; padding:5px 10px;
  cursor:pointer; border-bottom:1px solid rgba(255,255,255,.03); transition:background .15s;
}
.ic-list-item:hover{ background:rgba(118,75,162,.08); }
.ic-list-item.active{ background:rgba(118,75,162,.15); }
.ic-list-item:last-child{ border-bottom:none; }
.ic-list-time{ font-size:11px; color:#7dd3fc; min-width:70px; }
.ic-list-picks{ font-size:11px; color:#d1d5db; flex:1; }
.ic-list-conf{ font-size:11px; color:#fbbf24; font-weight:600; }

body.tf-dark .ai-insight-section{
  background:linear-gradient(135deg,rgba(102,126,234,.04) 0%,rgba(118,75,162,.03) 100%);
  border-color:rgba(118,75,162,.15);
}
body.tf-dark .ai-adv-panel .cfg-section{ background:rgba(0,0,0,.25); }
body.tf-dark .ai-adv-panel .cfg-row input[type="number"],
body.tf-dark .ai-adv-panel .cfg-row select{ background:rgba(0,0,0,.3); }

.cfg-warn{ font-size:11px; color:#fbbf24; padding:4px 10px; }


/* 日期分割线 */
.date-divider{display:flex;align-items:center;gap:10px;margin:6px 0 4px;padding:2px 0;}
.date-divider .dd-line{flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--line2) 20%,var(--line2) 80%,transparent);}
.date-divider .dd-label{font-size:12px;color:var(--cyan3);white-space:nowrap;padding:1px 10px;border-radius:10px;background:rgba(34,211,238,.08);border:1px solid rgba(34,211,238,.2);letter-spacing:.5px;}
.date-grid{display:flex;flex-direction:column;gap:2px;align-items:center;overflow-x:auto;margin-bottom:6px;}

/* 历史走势容器: 限高可滚动展示全部数据 */
#historyPanel{max-height:70vh;overflow-y:auto;overflow-x:hidden;padding-right:4px;}
#historyPanel::-webkit-scrollbar{width:8px;}
#historyPanel::-webkit-scrollbar-thumb{background:var(--line2);border-radius:4px;}
#historyPanel::-webkit-scrollbar-track{background:transparent;}