/* 万相智投 - 专业SaaS推广管理系统 */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#f5f6fa;--card:#fff;--border:#ebedf0;
  --text:#1a1a2e;--text2:#5a607f;--text3:#9ea3b5;
  --primary:#4361ee;--primary-light:#eef0ff;--primary-dark:#3651d4;
  --danger:#e74c3c;--danger-light:#fef0ef;
  --success:#27ae60;--success-light:#eafaf1;
  --warn:#f39c12;--warn-light:#fef9e7;
  --sidebar-w:220px;--header-h:48px;--radius:6px;
}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;background:var(--bg);color:var(--text);font-size:14px;line-height:1.5}
a{color:var(--primary);text-decoration:none}
button{cursor:pointer;border:none;font-size:14px;border-radius:var(--radius);padding:7px 16px;transition:all .15s;font-family:inherit}
input,select,textarea{border:1px solid var(--border);border-radius:var(--radius);padding:7px 12px;font-size:14px;outline:none;font-family:inherit;transition:border .15s;background:#fff;color:var(--text)}
input:focus,select:focus,textarea:focus{border-color:var(--primary);box-shadow:0 0 0 2px rgba(67,97,238,.1)}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:6px 8px;border-bottom:1px solid var(--border);font-size:13px;white-space:nowrap}
th{font-weight:600;font-size:11px;color:var(--text2);text-transform:uppercase;letter-spacing:.3px;background:#fafbfc;white-space:nowrap}
tbody tr:hover{background:#fafbfe}

/* Badge */
.badge{display:inline-block;padding:2px 8px;border-radius:3px;font-size:12px;font-weight:500}
.b-green{background:var(--success-light);color:#1e8449}.b-red{background:var(--danger-light);color:#c0392b}
.b-blue{background:var(--primary-light);color:#2c3e9a}.b-gray{background:#f0f1f3;color:#5a607f}
.b-yellow{background:var(--warn-light);color:#9a7d0a}

/* Button */
.btn{display:inline-flex;align-items:center;gap:4px;font-weight:500}
.btn-p{background:var(--primary);color:#fff}.btn-p:hover{background:var(--primary-dark)}
.btn-o{background:transparent;border:1px solid var(--border);color:var(--text)}.btn-o:hover{background:#fafbfc}
.btn-d{background:var(--danger);color:#fff}.btn-d:hover{background:#c0392b}
.btn-s{padding:4px 10px;font-size:13px}
.btn-icon{background:none;padding:4px 8px;color:var(--text2);border-radius:4px;font-size:18px;line-height:1}.btn-icon:hover{background:#f0f1f3}
.btn-success{background:var(--success);color:#fff}.btn-warn{background:var(--warn);color:#fff}
.btn[disabled]{opacity:.45;cursor:not-allowed}

/* Login */
#login-page{display:flex;align-items:center;justify-content:center;min-height:100vh;background:#f5f6fa}
#login-box{background:#fff;padding:40px 36px;border-radius:8px;width:380px;box-shadow:0 2px 12px rgba(0,0,0,.06);border:1px solid var(--border)}
#login-box h2{font-size:22px;margin-bottom:2px;color:var(--text);font-weight:700}
#login-box .sub{color:var(--text2);font-size:14px;margin-bottom:24px}
#login-box input{width:100%;margin-bottom:12px;padding:10px 12px}
#login-box .login-btn{width:100%;padding:10px;font-size:15px;font-weight:600}
#login-error{color:var(--danger);font-size:13px;margin-bottom:10px;display:none;padding:8px 10px;background:var(--danger-light);border-radius:var(--radius)}
.login-switch{text-align:center;margin-top:14px;font-size:13px;color:var(--text3)}
.login-switch a{color:var(--primary);font-weight:500}
.reg-email-hint{text-align:center;font-size:13px;color:var(--text2);margin-bottom:12px}
.reg-code-row{display:flex;gap:8px;margin-bottom:0}
.reg-code-row input{flex:1}
.reg-code-row .btn{white-space:nowrap;min-width:100px;height:42px;font-size:13px}

/* Layout */
#app{display:flex;min-height:100vh}
.sidebar{width:var(--sidebar-w);background:#1a1a2e;color:#c8cad8;flex-shrink:0;position:fixed;top:0;left:0;bottom:0;z-index:20;display:flex;flex-direction:column}
.sidebar-brand{padding:16px 18px 12px;border-bottom:1px solid rgba(255,255,255,.06)}
.sidebar-brand h1{font-size:16px;color:#fff;font-weight:700;letter-spacing:.5px}
.sidebar-brand .ver{font-size:11px;color:#5a607f;margin-top:2px}
.sidebar-nav{flex:1;padding:8px 0;overflow-y:auto}
.nav-sec{font-size:11px;color:#5a607f;padding:14px 18px 5px;text-transform:uppercase;letter-spacing:.8px;font-weight:600}
.nav-item{display:flex;align-items:center;padding:8px 18px;color:#9ea3b5;font-size:14px;cursor:pointer;transition:all .12s;border-left:3px solid transparent}
.nav-item:hover{background:rgba(255,255,255,.04);color:#d0d2de}
.nav-item.active{background:rgba(67,97,238,.12);color:#8fa4f7;border-left-color:#4361ee}
.nav-item.has-sub{justify-content:space-between}
.nav-item.has-sub .nav-arrow{width:14px;height:14px;transition:transform .2s;opacity:.4}
.nav-item.expanded .nav-arrow{transform:rotate(90deg)}
.nav-sub{max-height:0;overflow:hidden;transition:max-height .25s ease;background:rgba(0,0,0,.12)}
.nav-sub.open{max-height:300px}
.nav-sub .nav-item{padding:7px 18px 7px 36px;font-size:13px;border-left:none}
.nav-sub .nav-item::before{content:'';width:4px;height:4px;border-radius:50%;background:#4a4f6a;flex-shrink:0;margin-right:10px;transition:background .15s}
.nav-sub .nav-item.active::before{background:#8fa4f7}
.nav-sub .nav-item.active{border-left:none;background:rgba(67,97,238,.1)}
.sidebar-footer{padding:12px 18px;border-top:1px solid rgba(255,255,255,.06);font-size:12px;color:#5a607f}
.sidebar-footer .user-name{color:#9ea3b5;font-size:13px;font-weight:500}

/* Main */
.main{margin-left:var(--sidebar-w);flex:1;min-height:100vh;display:flex;flex-direction:column}
.header{height:var(--header-h);background:var(--card);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 20px;position:sticky;top:0;z-index:10}
.header-left{display:flex;align-items:center;gap:10px}
.header-title{font-size:16px;font-weight:700}
.header-right{display:flex;align-items:center;gap:12px}
.status-dot{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--text2)}
.status-dot::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--success)}
.status-dot.offline::before{background:var(--text3)}
.content{padding:16px 20px;flex:1}

/* Stats */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin-bottom:16px}
.stat{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px}
.stat .lbl{font-size:12px;color:var(--text2);margin-bottom:3px;font-weight:500}
.stat .val{font-size:22px;font-weight:700;letter-spacing:-.3px;color:var(--text)}
.stat .val small{font-size:13px;font-weight:400;color:var(--text3);margin-left:3px}

/* Card */
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:14px;overflow:hidden}
.card-h{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-bottom:1px solid var(--border)}
.card-h h3{font-size:14px;font-weight:600}
.card-h .actions{display:flex;gap:6px;align-items:center}
.card-b{padding:16px}.card-b.np{padding:0;overflow-x:auto}
.empty{text-align:center;padding:36px 20px;color:var(--text3);font-size:13px}
.empty-icon{font-size:32px;margin-bottom:8px;opacity:.5}
.empty-action{margin-top:14px}
.empty-action .btn{margin:0 4px}

/* Breadcrumb */
.breadcrumb{display:flex;align-items:center;gap:4px;font-size:13px;color:var(--text2);margin-bottom:12px}
.breadcrumb span{cursor:pointer}.breadcrumb span:hover{color:var(--primary)}.breadcrumb b{color:var(--text)}

/* Tab */
.tab-bar{display:flex;border-bottom:1px solid var(--border);margin-bottom:16px}
.tab{padding:8px 18px;font-size:13px;font-weight:600;color:var(--text2);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:all .15s}
.tab:hover{color:var(--text)}.tab.active{color:var(--primary);border-bottom-color:var(--primary)}

/* Detail Grid */
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:960px){.detail-grid{grid-template-columns:1fr}}

/* Filter Bar */
.filter-bar{display:flex;align-items:center;gap:8px;margin-bottom:14px;padding:8px 14px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);flex-wrap:wrap}
.filter-select{min-width:110px;padding:5px 8px;font-size:13px}
.filter-search{min-width:160px;padding:5px 8px;font-size:13px}
.filter-spacer{flex:1}
.filter-date{width:130px;padding:5px 8px;font-size:13px}
.filter-date-range{display:flex;align-items:center;gap:4px}
.date-sep{color:var(--text3);font-size:13px}
.filter-label{font-size:13px;color:var(--text2);font-weight:500}

/* Date-Time Range Picker */
.dr-wrap{position:relative;display:inline-flex}
.dr-trigger{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;background:#fff;font-size:13px;color:var(--text);transition:all .15s;white-space:nowrap;min-width:180px}
.dr-trigger:hover{border-color:var(--primary);background:#fafbfe}
.dr-trigger svg{color:var(--text3);flex-shrink:0}
.dr-display{flex:1;overflow:hidden;text-overflow:ellipsis}
.dr-arrow{margin-left:auto}

.dr-panel{position:fixed;z-index:200;background:#fff;border:1px solid var(--border);border-radius:10px;box-shadow:0 8px 32px rgba(0,0,0,.14);animation:dr-in .15s ease}
@keyframes dr-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}

.dr-body{display:flex}

/* Shortcuts */
.dr-shortcuts{width:110px;border-right:1px solid var(--border);padding:10px 0;flex-shrink:0}
.dr-sc-item{padding:7px 14px;font-size:13px;color:var(--text2);cursor:pointer;transition:all .1s;white-space:nowrap}
.dr-sc-item:hover{background:var(--primary-light);color:var(--primary)}

/* Main */
.dr-main{padding:12px 16px;min-width:0}

/* Input row */
.dr-inputs{display:flex;align-items:center;gap:6px;margin-bottom:12px}
.dr-input-group{display:flex;align-items:center;gap:4px}
.dr-date-input{width:100px;padding:5px 8px;font-size:13px;border:1px solid var(--border);border-radius:4px;background:#fafbfc;color:var(--text);text-align:center}
.dr-hour-sel{width:66px;padding:4px 4px;font-size:13px;border:1px solid var(--border);border-radius:4px;background:#fff;color:var(--text)}
.dr-sep{color:var(--text3);font-size:14px;margin:0 2px}

/* Calendars */
.dr-calendars{display:flex;gap:12px}
.dr-cal{width:230px}
.dr-cal-header{display:flex;align-items:center;justify-content:center;gap:8px;padding:4px 0 8px;font-size:14px;font-weight:600;color:var(--text)}
.dr-cal-nav{width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border-radius:4px;color:var(--text3);font-size:16px;transition:all .1s;user-select:none}
.dr-cal-nav:hover{background:var(--primary-light);color:var(--primary)}
.dr-cal-title{flex:1;text-align:center;font-size:13px}
.dr-cal-week{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;font-size:11px;color:var(--text3);font-weight:600;margin-bottom:4px;padding:0 0 4px;border-bottom:1px solid var(--border)}
.dr-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);text-align:center}
.dr-day{width:32px;height:28px;display:inline-flex;align-items:center;justify-content:center;font-size:13px;cursor:pointer;border-radius:0;transition:all .08s;color:var(--text);margin:0 auto}
.dr-day:hover{background:var(--primary-light);color:var(--primary)}
.dr-day-empty{cursor:default}
.dr-day-empty:hover{background:none}
.dr-day-today{font-weight:700;color:var(--primary)}
.dr-day-start,.dr-day-end{background:var(--primary) !important;color:#fff !important;border-radius:4px;font-weight:600}
.dr-day-single{border-radius:4px}
.dr-day-start{border-radius:4px 0 0 4px}
.dr-day-end{border-radius:0 4px 4px 0}
.dr-day-in{background:var(--primary-light);color:var(--primary)}

/* Footer */
.dr-footer{display:flex;align-items:center;gap:8px;padding-top:10px;border-top:1px solid var(--border);margin-top:10px}

/* Chart Legend */
.chart-legend{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--text2);margin-left:6px}
.chart-dot{display:inline-block;width:8px;height:8px;border-radius:50%;flex-shrink:0;box-shadow:0 0 3px rgba(0,0,0,.1)}
.chart-toggle{cursor:pointer;padding:2px 8px;border-radius:4px;transition:all .15s;border:1px solid transparent;user-select:none}
.chart-toggle:hover{background:#f0f1f3;border-color:var(--border)}
.chart-toggle.active{font-weight:500;color:var(--text);background:rgba(67,97,238,.04)}
.chart-toggle:not(.active){opacity:.45}
.chart-toggle:not(.active) .chart-dot{background:#ccc !important}

/* Edit Icon (inline budget edit) */
.edit-icon{cursor:pointer;font-size:13px;margin-left:4px;opacity:.5;transition:opacity .15s;vertical-align:middle}
.edit-icon:hover{opacity:1}

/* Status Trigger (clickable, opens dropdown) */
.status-trigger{display:inline-flex;align-items:center;gap:3px;cursor:pointer;border-radius:4px;padding:1px 4px;transition:all .12s;border:1px solid transparent;white-space:nowrap}
.status-trigger:hover{border-color:var(--border);background:#fafbfc}
.status-trigger .strat-arrow{margin-left:1px}

/* Status Dropdown Menu */
.status-dropdown{position:fixed;z-index:150;background:#fff;border:1px solid var(--border);border-radius:8px;box-shadow:0 6px 24px rgba(0,0,0,.12);min-width:150px;padding:4px 0;animation:strat-dd-in .12s ease}
.st-dd-item{padding:7px 14px;display:flex;align-items:center;gap:8px;font-size:13px;cursor:pointer;transition:background .1s}
.st-dd-item:hover{background:#fafbfe}
.st-dd-item.current{font-weight:600}
.st-dd-item.current:hover{background:transparent;cursor:default}
.st-dd-icon{font-size:11px;width:16px;text-align:center;flex-shrink:0}
.st-dd-check{margin-left:auto;color:var(--success);font-size:14px;font-weight:700}
.st-on{color:#1e8449}.st-pause{color:#9a7d0a}.st-off{color:#5a607f}

/* Status Distribution */
.status-dist{display:flex;gap:8px;margin-bottom:14px}

/* Pagination */
.pagination{display:flex;align-items:center;justify-content:space-between;padding:8px 14px;border-top:1px solid var(--border)}
.page-info{font-size:12px;color:var(--text2)}
.page-btns{display:flex;gap:3px}
.page-btn{min-width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:4px;font-size:13px;background:transparent;border:1px solid var(--border);color:var(--text);cursor:pointer;transition:all .15s}
.page-btn:hover{background:#f0f1f3}.page-btn.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.page-btn.disabled{opacity:.35;pointer-events:none}.page-dots{line-height:28px;padding:0 3px;color:var(--text3)}

/* Form */
.fg{margin-bottom:14px}
.fg label{display:block;font-size:12px;font-weight:600;color:var(--text2);margin-bottom:4px}
.fg input,.fg select,.fg textarea{width:100%}
.fg .hint{font-size:11px;color:var(--text3);margin-top:3px}
.create-form{max-width:560px}

/* Modal */
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.35);display:none;align-items:center;justify-content:center;z-index:100}
.modal-bg.show{display:flex}
.modal{background:#fff;border-radius:8px;width:480px;max-height:85vh;overflow:auto;box-shadow:0 8px 30px rgba(0,0,0,.12)}
.modal-h{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--border)}
.modal-h h3{font-size:16px;font-weight:600}
.modal-b{padding:20px}
.modal-f{padding:12px 20px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:8px}

/* Toast */
#toast-container{position:fixed;top:16px;right:16px;z-index:200;display:flex;flex-direction:column;gap:6px;pointer-events:none}
.toast{min-width:260px;max-width:380px;padding:10px 14px;border-radius:var(--radius);font-size:13px;display:flex;align-items:center;justify-content:space-between;gap:10px;box-shadow:0 2px 12px rgba(0,0,0,.08);pointer-events:all;transform:translateX(100%);opacity:0;transition:all .3s ease}
.toast.show{transform:translateX(0);opacity:1}
.toast-info{background:#eff3ff;color:#2c3e9a;border:1px solid #c6d2f7}
.toast-success{background:#eafaf1;color:#1e8449;border:1px solid #a9dfbf}
.toast-error{background:#fef0ef;color:#c0392b;border:1px solid #f5b7b1}
.toast-warn{background:#fef9e7;color:#9a7d0a;border:1px solid #f9e79f}
.toast-close{background:none;border:none;font-size:14px;cursor:pointer;color:inherit;opacity:.5;padding:0 2px;line-height:1}.toast-close:hover{opacity:1}

/* Loading */
.loading-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;color:var(--text3)}
.loading-spinner{width:24px;height:24px;border:2px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin .5s linear infinite;margin-bottom:10px}
@keyframes spin{to{transform:rotate(360deg)}}
.error-icon{width:36px;height:36px;border-radius:50%;background:var(--danger-light);color:var(--danger);display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;margin-bottom:10px}

/* Product Selector */
.products-selected{display:flex;flex-wrap:wrap;gap:6px;min-height:28px}
.product-tag{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;background:var(--primary-light);color:var(--primary);border-radius:4px;font-size:12px;font-weight:500}
.tag-remove{background:none;border:none;font-size:14px;cursor:pointer;color:inherit;padding:0;line-height:1;opacity:.6}
.tag-remove:hover{opacity:1}

.product-list-modal{max-height:400px;overflow:auto}
.product-grid{display:flex;flex-direction:column;gap:6px}
.product-item{display:flex;align-items:center;gap:10px;padding:8px 12px;border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;transition:all .15s}
.product-item:hover{background:#fafbfc}
.product-item.selected{background:var(--primary-light);border-color:var(--primary)}
.product-item input[type="checkbox"]{flex-shrink:0}
.product-info{display:flex;align-items:center;gap:10px;flex:1;min-width:0}
.product-thumb{width:40px;height:40px;border-radius:4px;object-fit:cover;flex-shrink:0}
.product-text{flex:1;min-width:0}
.product-title{font-size:13px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.product-price{font-size:12px;color:var(--danger);margin-top:2px}

/* Strategy Cell in Campaign List */
.strat-cell-wrap{display:flex;align-items:center;gap:6px}
.strat-cell{display:inline-flex;align-items:center;gap:4px;font-size:13px;white-space:nowrap}
.strat-dot{display:inline-block;width:6px;height:6px;border-radius:50%;flex-shrink:0}
.strat-dot-on{background:var(--success)}
.strat-dot-off{background:#c8cad8}
.strat-on{color:var(--success);font-weight:500}
.strat-off{color:var(--text3)}
.strat-edit-btn{padding:2px 8px !important;font-size:12px !important;margin-left:2px}

/* Strategy Inline Trigger (dashboard) */
.strat-inline{position:relative}
.strat-trigger{display:inline-flex;align-items:center;gap:4px;cursor:pointer;padding:3px 8px;border-radius:4px;font-size:12px;transition:all .12s;white-space:nowrap;border:1px solid transparent}
.strat-trigger:hover{background:#f0f1f3;border-color:var(--border)}
.strat-name-on{color:var(--success);font-weight:500;max-width:80px;overflow:hidden;text-overflow:ellipsis}
.strat-name-off{color:var(--text3);max-width:80px;overflow:hidden;text-overflow:ellipsis}
.strat-arrow{font-size:10px;color:var(--text3);margin-left:2px}

/* Strategy Dropdown Menu */
.strat-dropdown{position:fixed;z-index:150;background:#fff;border:1px solid var(--border);border-radius:8px;box-shadow:0 6px 24px rgba(0,0,0,.12);min-width:220px;max-width:280px;padding:6px 0;animation:strat-dd-in .12s ease}
@keyframes strat-dd-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.strat-dd-header{padding:6px 14px;font-size:12px;font-weight:600;color:var(--text2);border-bottom:1px solid var(--border);margin-bottom:2px}
.strat-dd-item{padding:6px 14px;display:flex;align-items:center;gap:8px;font-size:13px;transition:background .1s}
.strat-dd-item:hover{background:#fafbfe}
.strat-dd-item.active{background:var(--success-light)}
.strat-dd-toggle{display:flex;align-items:center;gap:6px;cursor:pointer;flex:1;min-width:0}
.strat-dd-toggle input[type="checkbox"]{flex-shrink:0;margin:0;accent-color:var(--success)}
.strat-dd-name{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.strat-dd-info{font-size:11px;color:var(--text3);white-space:nowrap;flex-shrink:0}
.strat-dd-edit{font-size:11px;color:var(--primary);cursor:pointer;flex-shrink:0;opacity:.7}
.strat-dd-edit:hover{opacity:1;text-decoration:underline}
.strat-dd-sep{height:1px;background:var(--border);margin:4px 0}
.strat-dd-label{padding:4px 14px;font-size:11px;font-weight:600;color:var(--text3);text-transform:uppercase;letter-spacing:.3px}
.strat-dd-tpl{padding:6px 14px;font-size:13px;color:var(--text);cursor:pointer;transition:background .1s}
.strat-dd-tpl:hover{background:#fafbfe;color:var(--primary)}

/* Strategy Cards */
.strategy-card{transition:border-color .15s}
.strategy-enabled{border-left:3px solid var(--success)}
.rule-list{display:flex;flex-direction:column;gap:6px}
.rule-item{display:flex;align-items:center;gap:8px;padding:6px 10px;background:#fafbfc;border-radius:4px;font-size:13px;flex-wrap:wrap}
.rule-num{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;background:var(--primary-light);color:var(--primary);border-radius:50%;font-size:11px;font-weight:700;flex-shrink:0}
.rule-part{color:var(--text2)}
.rule-part b{color:var(--text);font-weight:600}
.strat-meta{margin-top:8px;display:flex;gap:6px}

/* Strategy Editor */
.rule-editor-item{border:1px solid var(--border);border-radius:var(--radius);padding:14px;margin-bottom:12px;background:#fafbfc}
.rule-editor-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.rule-editor-actions{display:flex;gap:4px}
.rule-row{display:flex;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap}
.rule-label{font-size:13px;font-weight:600;color:var(--primary);min-width:24px;text-align:center}
.rule-input{padding:5px 8px;font-size:13px;border:1px solid var(--border);border-radius:4px;min-width:100px}
.rule-op{min-width:80px;max-width:110px}
.rule-val{min-width:80px;max-width:120px}

/* Schedule */
.schedule-rule{display:flex;align-items:center;gap:8px;margin-top:8px;padding:8px;background:#fafbfc;border-radius:4px}

/* Restart - Skip Hours */
.skip-hours{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.skip-hour{display:inline-flex;align-items:center;gap:3px;font-size:12px;padding:2px 6px;border:1px solid var(--border);border-radius:3px;cursor:pointer;transition:all .1s}
.skip-hour:hover{background:#fafbfc}
.skip-hour input{margin:0}

/* Template Grid */
.template-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.template-card{border:1px solid var(--border);border-radius:var(--radius);padding:14px;transition:all .15s}
.template-card:hover{border-color:var(--primary)}
.template-name{font-weight:600;font-size:14px;margin-bottom:4px}
.template-info{font-size:12px;color:var(--text2);margin-bottom:6px}
.template-rules{margin-bottom:8px}
.template-rule-item{font-size:12px;color:var(--text2);padding:3px 0;line-height:1.4}
.template-rule-item .rule-num{width:16px;height:16px;font-size:10px;display:inline-flex;align-items:center;justify-content:center}
.template-actions{display:flex;gap:4px}

/* Preset Template Grid */
.preset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.preset-card{border:1px solid var(--border);border-radius:8px;padding:16px;cursor:pointer;transition:all .15s}
.preset-card:hover{border-color:var(--primary);box-shadow:0 2px 8px rgba(0,0,0,.08)}
.preset-name{font-weight:600;font-size:14px;color:var(--text)}
.preset-desc{font-size:12px;color:var(--text2);margin-top:4px;line-height:1.5}
.preset-rules{margin-top:8px}
.preset-rule-text{font-size:11px;color:var(--text3);padding:2px 0;line-height:1.4}
.preset-use{margin-top:8px;font-size:12px;color:var(--primary);font-weight:600}

/* Hourly Budget Grid (24h) */
.hourly-budget-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.hour-cell{text-align:center;border:1px solid var(--border);border-radius:4px;padding:6px 4px;min-width:0}
.hour-cell-active{border-color:var(--primary);background:var(--primary-light)}
.hour-label{font-size:11px;color:var(--text3);margin-bottom:4px}
.hour-type-sel{width:100%;border:none;background:transparent;font-size:11px;color:var(--text2);text-align:center;padding:1px 0;margin-bottom:3px;outline:none;cursor:pointer}
.hour-budget-input{width:100%;text-align:center;border:none;border-bottom:1px solid var(--border);padding:2px;font-size:13px;background:transparent;outline:none}
.hour-budget-input:focus{border-bottom-color:var(--primary)}
.hour-pct-row{display:flex;align-items:center;gap:2px}
.hour-mode-sel{width:32px;flex-shrink:0;border:none;background:transparent;font-size:13px;font-weight:600;color:var(--primary);text-align:center;padding:0;outline:none;cursor:pointer}
.hour-unit{font-size:11px;color:var(--text3);flex-shrink:0}

/* Misc */
code{background:#f0f1f3;padding:1px 6px;border-radius:3px;font-size:12px;font-family:"SF Mono",monospace;color:#5a607f}
pre{background:#f0f1f3;padding:12px;border-radius:var(--radius);font-size:12px;overflow:auto;white-space:pre-wrap;line-height:1.5}
.dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:5px;flex-shrink:0}
.dot-g{background:#27ae60}.dot-x{background:#c8cad8}
.clickable{cursor:pointer}.clickable:hover{color:var(--primary)}
.row-chart-active{background:rgba(67,97,238,.08)!important;box-shadow:inset 3px 0 0 var(--primary)}.row-chart-active:hover{background:rgba(67,97,238,.12)!important}
.row-chart-focus{background:rgba(0,229,255,.08)!important;box-shadow:inset 3px 0 0 #00e5ff}.row-chart-focus:hover{background:rgba(0,229,255,.12)!important}
.sort-th{display:inline-flex;align-items:center;gap:2px;cursor:pointer;border-bottom:1px dashed var(--border);padding-bottom:1px;transition:all .15s}.sort-th:hover{color:var(--primary);border-bottom-color:var(--primary)}.sort-arrow{font-size:11px;color:var(--primary);min-width:12px;font-weight:700}
.text-muted{color:var(--text2)}.text-danger{color:var(--danger)}.text-success{color:var(--success)}.text-link{color:var(--primary);cursor:pointer;text-decoration:none}.text-link:hover{text-decoration:underline}
.money{font-family:"SF Mono",monospace;font-weight:600}
.action-btns{display:flex;gap:4px;flex-wrap:nowrap}.action-btns .btn{white-space:nowrap}

/* Group Chips (分组管理) */
.group-list{display:flex;flex-wrap:wrap;gap:8px}
.group-chip{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;background:#f5f6fa;border:1px solid var(--border);border-radius:6px;font-size:13px;cursor:pointer;transition:all .12s;user-select:none}
.group-chip:hover{border-color:var(--primary);background:var(--primary-light)}
.group-chip.active{border-color:var(--primary);background:var(--primary-light);color:var(--primary);font-weight:600}
.group-chip-name{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.group-chip-count{font-size:11px;color:var(--text3);background:#e8e9ed;border-radius:10px;padding:1px 6px;min-width:16px;text-align:center}
.group-chip.active .group-chip-count{background:var(--primary);color:#fff}
.group-chip-edit,.group-chip-del{font-size:13px;color:var(--text3);cursor:pointer;line-height:1;opacity:.5;transition:opacity .12s}
.group-chip-edit:hover{opacity:1;color:var(--primary)}
.group-chip-del:hover{opacity:1;color:var(--danger)}

/* Condition Editor (条件筛选) */
.cond-editor{margin-bottom:14px;padding:10px 14px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius)}
.cond-row{display:flex;align-items:center;gap:6px;margin-bottom:6px}
.cond-field{min-width:110px;padding:4px 6px;font-size:13px}
.cond-op{min-width:64px;padding:4px 6px;font-size:13px}
.cond-val{width:120px;padding:4px 6px;font-size:13px}
.cond-del{border:none;background:none;color:var(--text3);font-size:18px;cursor:pointer;padding:0 4px;line-height:1;transition:color .12s}
.cond-del:hover{color:var(--danger)}
.cond-actions{display:flex;gap:6px;align-items:center;margin-top:2px}

/* Column Sort (列设置拖拽排序) */
.col-sort-list{max-height:400px;overflow-y:auto;border:1px solid var(--border);border-radius:var(--radius);background:#fafbfc}
.col-sort-item{display:flex;align-items:center;gap:6px;padding:6px 10px;border-bottom:1px solid var(--border);background:#fff;transition:background .1s,box-shadow .1s;cursor:default}
.col-sort-item:last-child{border-bottom:none}
.col-sort-handle{cursor:grab;color:var(--text3);font-size:14px;user-select:none;flex-shrink:0;width:18px;text-align:center;line-height:1}
.col-sort-handle:active{cursor:grabbing}
.col-sort-label{display:flex;align-items:center;gap:6px;cursor:pointer;font-size:13px;flex:1;min-width:0}
.col-sort-dragging{opacity:.4;background:var(--primary-light) !important}
.col-sort-over-top{box-shadow:0 -2px 0 0 var(--primary) inset}
.col-sort-over-bot{box-shadow:0 2px 0 0 var(--primary) inset}

/* Keyword Section (关键词推广新建) */
.kw-section{margin-top:8px}
.kw-section .create-form{max-width:none}
.kw-row{display:flex;align-items:flex-end;gap:20px;flex-wrap:wrap}
.kw-field{display:flex;flex-direction:column;gap:4px}
.kw-field label{font-size:12px;font-weight:600;color:var(--text2)}
.kw-source-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.kw-radio{display:inline-flex;align-items:center;gap:4px;font-size:14px;cursor:pointer;white-space:nowrap}
.kw-radio input[type="radio"]{margin:0}
.kw-prefix-field{display:flex;align-items:center;gap:6px;margin-left:12px}
.kw-prefix-field label{font-size:13px;color:var(--text2);white-space:nowrap}
.kw-input-area{margin-top:12px;border:1px solid var(--border);border-radius:var(--radius);min-height:180px;background:#fafbfc;overflow:hidden}
.kw-input-area textarea{border:none;border-radius:0;background:transparent;padding:12px;min-height:180px;resize:vertical}
.kw-input-area textarea:focus{box-shadow:none}
.kw-list-header{font-size:13px;font-weight:600;color:var(--text2);margin-bottom:6px}
.kw-tag-list{display:flex;flex-wrap:wrap;gap:4px;max-height:200px;overflow-y:auto;padding:4px 0}
.kw-tag{display:inline-flex;align-items:center;gap:3px;padding:3px 8px;background:var(--primary-light);color:var(--primary);border-radius:4px;font-size:12px;font-weight:500}

/* Batch Product Grid (批量创建) */
.batch-mode-row{display:flex;align-items:center;flex-wrap:wrap}
.batch-product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:8px;max-height:420px;overflow-y:auto;padding:2px}
.batch-product-item{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;transition:all .12s;font-size:13px}
.batch-product-item:hover{background:#fafbfc;border-color:var(--primary-light)}
.batch-product-item.selected{background:var(--primary-light);border-color:var(--primary)}
.batch-product-item input[type="checkbox"]{flex-shrink:0;margin:0}
.batch-product-info{display:flex;align-items:center;gap:8px;flex:1;min-width:0}
.batch-product-thumb{width:36px;height:36px;border-radius:4px;object-fit:cover;flex-shrink:0}
.batch-product-text{flex:1;min-width:0}
.batch-product-title{font-size:13px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.batch-product-meta{font-size:12px;margin-top:2px;display:flex;gap:8px}

/* ===== Campaign Create (新建计划) ===== */

/* Page Container */
.cc-page{max-width:880px;margin:0 auto}

/* Page Header */
.cc-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;flex-wrap:wrap;gap:8px}
.cc-header-left{display:flex;align-items:center;gap:6px}
.cc-header-left h2{font-size:17px;font-weight:700;margin:0}
.cc-header-right{display:flex;align-items:center}

/* Mode Switch — Full / Template toggle */
/* (removed: mode-switch no longer used) */

/* Template Cards Grid */
.cc-tpl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.cc-tpl-card{border:2px solid var(--border);border-radius:var(--radius);padding:12px 14px;cursor:pointer;transition:all .15s}
.cc-tpl-card:hover{border-color:var(--primary);background:rgba(24,119,242,.03)}
.cc-tpl-card.active{border-color:var(--primary);background:rgba(24,119,242,.06);box-shadow:0 0 0 1px var(--primary)}
.cc-tpl-card-name{font-size:14px;font-weight:700;margin-bottom:8px;color:var(--text1)}
.cc-tpl-card-info{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:11px;color:var(--text2);line-height:1.6}
.cc-tpl-card-info span{white-space:nowrap}
.cc-tpl-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.cc-tpl-preview{background:#f9fafb;border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px}
.cc-tpl-preview-title{font-size:13px;font-weight:700;color:var(--text);margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--border)}
.cc-tpl-preview-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px 16px}
.cc-tpl-preview-item{display:flex;align-items:baseline;gap:8px;font-size:13px}
.cc-tpl-preview-label{color:var(--text3);white-space:nowrap;min-width:56px}
.cc-tpl-preview-value{color:var(--text);font-weight:500}
.cc-no-tpl{text-align:center;padding:32px 20px;background:#fafbfc;border:1px dashed var(--border);border-radius:var(--radius)}

/* Steps Indicator — compact horizontal breadcrumb */
.cc-steps{display:flex;align-items:center;margin-bottom:16px;padding:8px 16px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);overflow-x:auto;gap:0}
.cc-step{display:flex;align-items:center;gap:4px;font-size:12px;color:var(--text3);white-space:nowrap;flex-shrink:0}
.cc-step.active{color:var(--primary);font-weight:600}
.cc-step-num{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:#ebedf0;color:var(--text3);font-size:10px;font-weight:700;flex-shrink:0}
.cc-step.active .cc-step-num{background:var(--primary);color:#fff}
.cc-step-text{font-size:12px}
.cc-step-line{flex:1;min-width:12px;height:1px;background:var(--border);margin:0 4px}

/* Section (Card style) — more spacious */
.cc-section{background:var(--card);border:1px solid var(--border);border-radius:8px;margin-bottom:14px;overflow:hidden}
.cc-section-h{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;cursor:pointer;transition:background .12s;user-select:none}
.cc-section-h:hover{background:#fafbfc}
.cc-section-h-left{display:flex;align-items:center;gap:10px}
.cc-section-num{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:var(--primary);color:#fff;font-size:12px;font-weight:700;flex-shrink:0;transition:background .15s}
.cc-section-h h3{font-size:15px;font-weight:600;margin:0}
.cc-section-arrow{font-size:13px;color:var(--text3);transition:transform .2s}
.cc-section:not(.open) .cc-section-num{background:#d5d8e0;color:#fff}
.cc-section-b{padding:16px 18px;border-top:1px solid var(--border)}

/* Grid (responsive columns) */
.cc-grid{display:flex;gap:14px;flex-wrap:wrap;align-items:flex-start}
.cc-grid-2>.cc-field{min-width:200px;flex:1}
.cc-grid-3>.cc-field{min-width:140px;flex:1}

/* Field */
.cc-field{display:flex;flex-direction:column;gap:3px}
.cc-field label{font-size:12px;font-weight:600;color:var(--text2)}
.cc-field-actions{flex-direction:row !important;align-items:flex-end !important;gap:6px !important;align-self:flex-end}
.cc-field-hint{font-size:11px;color:var(--text3);margin-top:2px}
.cc-sub-title{font-size:13px;font-weight:600;color:var(--text);margin-bottom:6px;margin-top:2px}
.cc-divider{height:1px;background:var(--border);margin:16px 0}

/* Product Tabs */
.cc-product-tabs{display:flex;gap:0;margin-top:14px;border-bottom:2px solid var(--border)}
.cc-ptab{padding:7px 16px;font-size:13px;font-weight:600;color:var(--text2);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .12s;white-space:nowrap}
.cc-ptab:hover{color:var(--text)}
.cc-ptab.active{color:var(--primary);border-bottom-color:var(--primary)}
.cc-product-panel{padding-top:12px}

/* Product Tabs (new — shop/manual toggle) */
.cc-prod-tabs{display:flex;gap:0;margin-bottom:12px;border-bottom:2px solid var(--border)}
.cc-prod-tab{padding:7px 16px;font-size:13px;font-weight:600;color:var(--text2);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .12s;white-space:nowrap}
.cc-prod-tab:hover{color:var(--text)}
.cc-prod-tab.active{color:var(--primary);border-bottom-color:var(--primary)}
.cc-prod-panel{padding-top:4px}
.cc-prod-table{width:100%;border-collapse:collapse}
.cc-prod-table th{font-size:11px;font-weight:600;color:var(--text2);background:#fafbfc;padding:6px 8px;border-bottom:1px solid var(--border);text-align:left;white-space:nowrap;position:sticky;top:0;z-index:1}
.cc-prod-table td{padding:6px 8px;border-bottom:1px solid var(--border);font-size:13px}
.cc-prod-row{cursor:pointer;transition:background .1s}
.cc-prod-row:hover{background:#fafbfe}
.cc-prod-row.selected{background:var(--primary-light)}
.cc-prod-row input[type="checkbox"]{accent-color:var(--primary);margin:0}

/* Product Toolbar */
.cc-product-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.cc-check-all{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}
.cc-check-all input{margin:0}
.cc-product-search{width:220px;padding:5px 10px;font-size:13px}
.cc-sel-summary{font-size:13px;color:var(--text2);margin-left:auto}

/* Product Grid */
.cc-product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:6px;max-height:360px;overflow-y:auto;padding:2px}
.cc-product-item{display:flex;align-items:center;gap:8px;padding:7px 10px;border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;transition:all .12s;font-size:13px}
.cc-product-item:hover{background:#fafbfc;border-color:var(--primary-light)}
.cc-product-item.selected{background:var(--primary-light);border-color:var(--primary)}
.cc-product-item input[type="checkbox"]{flex-shrink:0;margin:0;accent-color:var(--primary)}
.cc-product-info{display:flex;align-items:center;gap:8px;flex:1;min-width:0}
.cc-product-thumb{width:34px;height:34px;border-radius:4px;object-fit:cover;flex-shrink:0}
.cc-product-text{flex:1;min-width:0}
.cc-product-title{font-size:13px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cc-product-meta{font-size:12px;margin-top:2px;display:flex;gap:8px}

/* ID Import */
.cc-import-box{display:flex;gap:14px;min-height:200px}
.cc-import-left{flex:1;display:flex;flex-direction:column;gap:8px}
.cc-import-left label{font-size:13px;font-weight:600;color:var(--text2)}
.cc-import-left textarea{flex:1;resize:vertical;font-size:13px;font-family:monospace}
.cc-import-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cc-import-right{flex:1;border:1px solid var(--border);border-radius:var(--radius);background:#fafbfc;display:flex;flex-direction:column;overflow:hidden}
.cc-import-result-h{padding:8px 12px;font-size:13px;font-weight:600;color:var(--text2);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.cc-import-result-h span{font-size:12px;font-weight:400;color:var(--text3)}
.cc-import-result{flex:1;overflow-y:auto;padding:8px 12px}
.cc-import-group{margin-bottom:10px}
.cc-import-group-h{font-size:12px;font-weight:600;margin-bottom:6px;padding:4px 8px;border-radius:4px}
.cc-import-ok{background:var(--success-light);color:#1e8449}
.cc-import-miss{background:var(--danger-light);color:#c0392b}
.cc-import-item{display:flex;align-items:center;gap:8px;padding:5px 0;font-size:13px}
.cc-import-thumb{width:28px;height:28px;border-radius:3px;object-fit:cover;flex-shrink:0}
.cc-import-item-info{min-width:0;flex:1}
.cc-import-item-title{font-size:13px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cc-import-miss-list{display:flex;flex-wrap:wrap;gap:4px}
.cc-import-miss-tag{padding:2px 8px;background:#f0f1f3;border-radius:3px;font-size:12px;font-family:monospace;color:var(--text2)}

/* Selection Bar */
.cc-selection-bar{display:flex;align-items:center;gap:10px;padding:10px 14px;margin-top:10px;background:var(--primary-light);border:1px solid rgba(67,97,238,.2);border-radius:var(--radius);font-size:13px;font-weight:500;color:var(--primary)}
.cc-sel-tags{display:flex;flex-wrap:wrap;gap:4px;flex:1;min-width:0}
.cc-sel-tag{display:inline-flex;align-items:center;gap:3px;padding:2px 8px;background:#fff;border:1px solid var(--border);border-radius:4px;font-size:12px;font-weight:400;color:var(--text);max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cc-sel-tag button{background:none;border:none;font-size:13px;cursor:pointer;color:var(--text3);padding:0;line-height:1;flex-shrink:0}
.cc-sel-tag button:hover{color:var(--danger)}
.cc-sel-more{background:none;border:1px dashed var(--border);color:var(--text3);font-weight:500}

/* Radio Card — compact, clean */
.cc-radio-card{display:flex;align-items:flex-start;gap:8px;padding:9px 14px;border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;transition:all .15s;margin-bottom:5px}
.cc-radio-card:hover{border-color:#c5cee8;background:#fcfcfe}
.cc-radio-card.active{border-color:var(--primary);background:#f5f7ff}
.cc-radio-card input[type="radio"]{margin-top:2px;flex-shrink:0;accent-color:var(--primary)}
.cc-radio-card-body{min-width:0}
.cc-radio-card-body b{font-size:14px;font-weight:600;display:block;line-height:1.3}
.cc-radio-card-body p{font-size:12px;color:var(--text3);margin:1px 0 0;line-height:1.3}
.cc-radio-row{display:flex;gap:6px;flex-wrap:wrap}
.cc-radio-row .cc-radio-card{flex:1;min-width:200px;margin-bottom:0}

/* Sub Panel */
.cc-sub-panel{margin-top:8px;padding:12px 14px;background:#f9fafb;border:1px solid var(--border);border-radius:var(--radius)}

/* Chip / Pill — smaller, tighter */
.cc-chip{display:inline-flex;align-items:center;gap:3px;padding:5px 10px;border:1px solid var(--border);border-radius:var(--radius);font-size:12px;cursor:pointer;transition:all .12s;white-space:nowrap}
.cc-chip:hover{border-color:#c5cee8;background:#fcfcfe}
.cc-chip.active{border-color:var(--primary);background:#f0f3ff;color:var(--primary);font-weight:600}
.cc-chip input[type="radio"]{display:none}
.cc-bid-targets{display:flex;flex-wrap:wrap;gap:5px}
.cc-pill-row{display:flex;gap:6px;flex-wrap:wrap}
.cc-pill{display:inline-flex;align-items:center;gap:3px;padding:5px 12px;border:1px solid var(--border);border-radius:20px;font-size:12px;cursor:pointer;transition:all .12s;white-space:nowrap}
.cc-pill:hover{border-color:#c5cee8}
.cc-pill.active{border-color:var(--primary);background:#f0f3ff;color:var(--primary);font-weight:600}
.cc-pill input[type="radio"]{display:none}

/* Info Box */
.cc-info-box{font-size:12px;padding:8px 12px;border-radius:var(--radius);line-height:1.5}
.cc-info-blue{background:#f0f7ff;border:1px solid #d0e3f7;color:#1a73e8}
.cc-info-warn{background:#fffdf0;border:1px solid #f0e4a8;color:#8a6d0a}
.cc-info-ok{background:#f0faf4;border:1px solid #b8e0c8;color:#1e8449}

/* Collapse (高级设置) */
.cc-collapse{border:1px solid var(--border);border-radius:var(--radius);margin-top:12px}
.cc-collapse-h{display:flex;align-items:center;justify-content:space-between;padding:7px 14px;cursor:pointer;font-size:12px;color:var(--text2);font-weight:500;transition:background .12s}
.cc-collapse-h:hover{background:#fafbfc;color:var(--primary)}
.cc-collapse-arrow{font-size:11px;color:var(--text3)}
.cc-collapse-b{padding:12px 14px;border-top:1px solid var(--border)}

/* Keyword Sys Area */
.cc-kw-sys-area{margin-top:6px;margin-bottom:6px;padding:0 0 0 26px}

/* Crowd Hint */
.cc-crowd-hint{padding:0 0 4px}

/* Crowd Quick Pack Grid — compact chips */
.cc-crowd-quick{margin-bottom:6px}
.cc-crowd-quick-grid{display:flex;flex-wrap:wrap;gap:6px}
.cc-crowd-quick-item{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid var(--border);border-radius:20px;cursor:pointer;transition:all .12s;background:#fff;white-space:nowrap}
.cc-crowd-quick-item:hover{border-color:#c5cee8;background:#fcfcfe}
.cc-crowd-quick-item.active{border-color:var(--primary);background:#f0f3ff}
.cc-crowd-quick-icon{font-size:14px;flex-shrink:0;line-height:1}
.cc-crowd-quick-info{min-width:0}
.cc-crowd-quick-label{font-size:12px;font-weight:600}
.cc-crowd-quick-desc{display:none}
.cc-crowd-quick-item.active .cc-crowd-quick-label{color:var(--primary)}

/* Crowd Actions */
.cc-crowd-actions{display:flex;align-items:center;gap:8px;margin-bottom:8px}

/* Submit Bar */
.cc-submit-bar{margin-top:14px;display:flex;gap:8px;align-items:center;padding:12px 18px;background:var(--card);border:1px solid var(--border);border-radius:8px;position:sticky;bottom:0;z-index:5;box-shadow:0 -2px 8px rgba(0,0,0,.04)}
.cc-submit-btn{min-width:130px;padding:8px 20px;font-size:14px;font-weight:600}

/* ===== Crowd Picker (人群选择器 Modal) ===== */
.crowd-picker{max-height:60vh;overflow:hidden;display:flex;flex-direction:column}
.crowd-tabs{display:flex;border-bottom:2px solid var(--border);flex-shrink:0}
.crowd-tab{padding:8px 16px;font-size:13px;font-weight:600;color:var(--text2);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .12s;white-space:nowrap}
.crowd-tab:hover{color:var(--text)}
.crowd-tab.active{color:var(--primary);border-bottom-color:var(--primary)}
.crowd-panel{flex:1;overflow-y:auto;min-height:0}
.crowd-panel-hint{padding:8px 0 4px;font-size:11px;color:var(--text3);line-height:1.4}
.crowd-sub-tabs{display:flex;flex-wrap:wrap;gap:4px;padding:10px 0 6px;border-bottom:1px solid var(--border)}
.crowd-sub-tab{padding:4px 10px;font-size:12px;border-radius:12px;cursor:pointer;color:var(--text2);transition:all .12s;border:1px solid transparent;white-space:nowrap}
.crowd-sub-tab:hover{background:#f0f1f3}
.crowd-sub-tab.active{background:var(--primary-light);color:var(--primary);border-color:var(--primary);font-weight:500}
.crowd-sub-panel{padding:6px 0}
.crowd-list{display:flex;flex-wrap:wrap;gap:6px;padding:4px 0}
.crowd-item{display:flex;align-items:flex-start;gap:6px;padding:7px 10px;border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;transition:all .12s;min-width:120px;max-width:240px;flex:1}
.crowd-item:hover{border-color:var(--primary-light);background:#fafbfe}
.crowd-item.selected{border-color:var(--primary);background:var(--primary-light)}
.crowd-item input[type="checkbox"]{margin-top:2px;flex-shrink:0;accent-color:var(--primary)}
.crowd-item-info{min-width:0}
.crowd-item-name{font-size:12px;font-weight:500}
.crowd-item-desc{font-size:11px;color:var(--text3);margin-top:1px;line-height:1.3}
/* 基础属性人群 - 属性分组 */
.crowd-attr-group{margin-bottom:10px}
.crowd-attr-group-label{font-size:12px;font-weight:600;color:var(--text2);padding:6px 0 2px;border-bottom:1px dashed var(--border);margin-bottom:4px}
.crowd-attr-group-items .crowd-list{padding:4px 0 6px}
.crowd-attr-group-items .crowd-item{min-width:80px;max-width:180px;padding:5px 8px}
.crowd-attr-group-items .crowd-item-name{font-size:12px}
/* Picker footer */
.crowd-picker-foot{flex-shrink:0;padding:8px 0 2px;border-top:1px solid var(--border);margin-top:6px}
.crowd-picker-foot-top{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.crowd-picker-selected{display:flex;flex-wrap:wrap;gap:4px;max-height:60px;overflow-y:auto;padding:2px 0}
.crowd-picker-tag{display:inline-flex;align-items:center;gap:2px;padding:2px 8px;font-size:11px;background:var(--primary-light);color:var(--primary);border-radius:10px;white-space:nowrap}
.crowd-picker-tag button{background:none;border:none;font-size:12px;color:var(--primary);cursor:pointer;padding:0 2px;line-height:1;opacity:.7}
.crowd-picker-tag button:hover{opacity:1;color:var(--danger)}

/* Selected Crowds (卡片网格) */
.crowd-selected-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:6px}
.crowd-sel-card{padding:8px 10px;border:1px solid var(--border);border-radius:var(--radius);background:#fafbfc;transition:border-color .12s}
.crowd-sel-card:hover{border-color:#c5cee8}
.crowd-sel-top{display:flex;align-items:center;justify-content:space-between}
.crowd-sel-name{font-size:13px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.crowd-sel-remove{background:none;border:none;font-size:14px;color:var(--text3);cursor:pointer;padding:0 2px;line-height:1}
.crowd-sel-remove:hover{color:var(--danger)}
.crowd-sel-desc{font-size:11px;color:var(--text3);margin-top:1px}
.crowd-sel-premium{display:flex;align-items:center;gap:4px;margin-top:5px;font-size:12px;color:var(--text2)}
.crowd-sel-premium label{font-weight:500;margin:0}
.crowd-sel-premium input{width:50px;padding:2px 4px;font-size:12px}
.crowd-sel-premium span{color:var(--text3)}

/* ===== Region Picker (地域选择器) ===== */
.cc-region-modes{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.cc-region-grid{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.cc-region-row{display:flex;border-bottom:1px solid var(--border)}
.cc-region-row:last-child{border-bottom:none}
.cc-region-group-label{width:48px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;color:var(--text2);background:#f7f8fa;border-right:1px solid var(--border);padding:6px 0}
.cc-region-group-items{display:flex;flex-wrap:wrap;gap:0;flex:1;padding:4px 6px}
.cc-region-item{display:inline-flex;align-items:center;gap:3px;padding:3px 6px;font-size:12px;cursor:pointer;border-radius:3px;transition:background .1s;white-space:nowrap}
.cc-region-item:hover{background:#f0f3ff}
.cc-region-item input[type="checkbox"]{margin:0;accent-color:var(--primary)}
.cc-region-remote span{color:var(--text3)}
.cc-region-item input:checked + span{color:var(--primary);font-weight:500}

/* Toggle switch */
.cc-switch{position:relative;display:inline-block;width:36px;height:20px;flex-shrink:0}
.cc-switch input{opacity:0;width:0;height:0}
.cc-switch-slider{position:absolute;cursor:pointer;inset:0;background:#ccc;border-radius:20px;transition:.2s}
.cc-switch-slider::before{content:'';position:absolute;height:16px;width:16px;left:2px;bottom:2px;background:#fff;border-radius:50%;transition:.2s}
.cc-switch input:checked + .cc-switch-slider{background:var(--primary)}
.cc-switch input:checked + .cc-switch-slider::before{transform:translateX(16px)}

/* 批量操作栏 */
.batch-bar{display:flex;align-items:center;gap:8px;padding:10px 14px;margin-bottom:14px;background:var(--primary-light);border:1px solid rgba(67,97,238,.2);border-radius:var(--radius);position:sticky;top:var(--header-h);z-index:8;box-shadow:0 2px 8px rgba(0,0,0,.04)}
.batch-count{font-size:14px;font-weight:600;color:var(--primary);margin-right:4px;white-space:nowrap}

/* Auto Flow Pipeline */
.af-pipeline{display:flex;align-items:center;gap:0;margin:16px 0;flex-wrap:wrap}
.af-stage-box{border:2px solid var(--border);border-radius:8px;padding:12px 16px;min-width:120px;text-align:center;transition:all .2s}
.af-stage-box.active{border-color:var(--primary);background:var(--primary-light)}
.af-stage-name{font-weight:600;font-size:14px;margin-bottom:4px}
.af-stage-count{font-size:22px;font-weight:700;color:var(--primary)}
.af-stage-count.zero{color:var(--text3)}
.af-stage-arrow{width:36px;height:2px;background:var(--border);position:relative;flex-shrink:0}
.af-stage-arrow::after{content:'';position:absolute;right:-1px;top:-4px;border:5px solid transparent;border-left:6px solid var(--border)}
.af-eliminated-box{background:var(--danger-light);border:2px solid var(--danger);border-radius:8px;padding:12px 16px;min-width:100px;text-align:center;margin-left:16px}
.af-eliminated-box .af-stage-count{color:var(--danger)}
.af-stage-editor{border:1px solid var(--border);border-radius:8px;padding:16px;margin-bottom:4px;background:var(--card)}
.af-stage-editor:hover{border-color:var(--primary)}
.af-stage-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.af-stage-num{background:var(--primary);color:#fff;border-radius:50%;width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;flex-shrink:0}
.af-stage-connector{width:2px;height:16px;background:var(--border);margin:0 auto}
.af-condition-row{display:flex;gap:6px;align-items:center;margin-bottom:6px}
.af-condition-row select,.af-condition-row input{padding:4px 8px;font-size:13px}
.af-condition-row input[type="number"]{width:80px}
.af-add-stage-btn{display:flex;align-items:center;justify-content:center;padding:10px;border:2px dashed var(--border);border-radius:8px;cursor:pointer;color:var(--text2);transition:all .15s;margin-top:4px}
.af-add-stage-btn:hover{border-color:var(--primary);color:var(--primary)}
.af-section{margin-bottom:8px}
.af-section-label{font-size:12px;font-weight:600;color:var(--text2);margin-bottom:6px}
.af-flow-card{border:1px solid var(--border);border-radius:8px;padding:16px;cursor:pointer;transition:all .15s}
.af-flow-card:hover{border-color:var(--primary);box-shadow:0 2px 8px rgba(0,0,0,.06)}
.af-flow-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.af-flow-name{font-weight:600;font-size:15px;margin-bottom:4px}
.af-flow-meta{font-size:12px;color:var(--text2);display:flex;gap:12px;margin-bottom:8px}
.af-flow-stages{display:flex;gap:4px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.af-flow-stage-chip{padding:2px 8px;border-radius:10px;font-size:11px;background:#f0f1f3;color:var(--text2)}
.af-flow-actions{display:flex;gap:6px}

/* Flowchart (auto-flow list) */
.af-flowchart{display:flex;align-items:stretch;gap:0;padding:8px 0 12px;width:100%}
.af-fc-node{flex:1;min-width:0;border-radius:var(--radius);overflow:hidden;border:1.5px solid var(--border);background:var(--card);box-shadow:0 1px 3px rgba(0,0,0,.06);display:flex;flex-direction:column}
.af-fc-node-header{padding:8px 12px;color:#fff;display:flex;align-items:center;gap:6px}
.af-fc-node-step{font-size:11px;font-weight:700;background:rgba(255,255,255,.25);border-radius:8px;padding:1px 7px;white-space:nowrap}
.af-fc-node-biz{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.af-fc-node-body{padding:10px 12px;display:flex;flex-direction:column;gap:5px;flex:1}
.af-fc-row{display:flex;align-items:baseline;gap:5px;font-size:12px;line-height:1.5}
.af-fc-label{color:var(--text3);white-space:nowrap;flex-shrink:0}
.af-fc-val{color:var(--text);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.af-fc-arrow{display:flex;align-items:center;flex-shrink:0;padding:0 4px;align-self:center}
.af-fc-arrow-line{width:32px;height:2px;background:#c5c9d0}
.af-fc-arrow-head{width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:7px solid #c5c9d0}
.af-fc-node-done{flex:0 0 72px;border-radius:var(--radius);border:2px solid var(--success);background:rgba(16,185,129,.08);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:var(--success);align-self:stretch}

/* Auto-flow Detail Page */
.afd-topbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:20px;padding:14px 20px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius)}
.afd-topbar-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.afd-topbar-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.afd-back{font-size:13px;color:var(--primary);cursor:pointer;text-decoration:none;font-weight:500}
.afd-back:hover{text-decoration:underline}
.afd-title{font-size:18px;font-weight:700;color:var(--text)}
.afd-auto-hint{font-size:11px;color:var(--text3);display:flex;align-items:center;gap:4px}
.afd-auto-hint::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--success);animation:afd-pulse 2s infinite}
@keyframes afd-pulse{0%,100%{opacity:.4}50%{opacity:1}}

.afd-overview{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.afd-pipeline-card,.afd-stats-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:18px 20px}
.afd-section-title{font-size:12px;font-weight:600;color:var(--text3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:14px}

/* Pipeline nodes */
.afd-pipe{display:flex;align-items:stretch;gap:0}
.afd-pipe-node{flex:1;min-width:0;text-align:center;padding:14px 8px;border:2px solid var(--border);border-radius:var(--radius);background:var(--bg);transition:all .2s;display:flex;flex-direction:column;justify-content:center}
.afd-pipe-node.has-items{border-color:var(--primary);background:var(--primary-light)}
.afd-pipe-node.done{border-color:var(--success)}
.afd-pipe-node.done.has-items{background:rgba(16,185,129,.08)}
.afd-pipe-node.elim{border-color:var(--danger)}
.afd-pipe-node.elim.has-items{background:rgba(239,68,68,.06)}
.afd-pipe-label{font-size:12px;font-weight:600;color:var(--text2);margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.afd-pipe-count{font-size:24px;font-weight:700;color:var(--primary);line-height:1.2}
.afd-pipe-node.done .afd-pipe-count{color:var(--success)}
.afd-pipe-node.elim .afd-pipe-count{color:var(--danger)}
.afd-pipe-node:not(.has-items) .afd-pipe-count{color:var(--text3)}
.afd-pipe-arrow{width:28px;display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative}
.afd-pipe-arrow::before{content:'';width:100%;height:2px;background:#d0d3d9}
.afd-pipe-arrow::after{content:'';position:absolute;right:0;border:4px solid transparent;border-left:5px solid #d0d3d9}

/* KPI grid */
.afd-kpi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:8px}
.afd-kpi{text-align:center;padding:8px 4px}
.afd-kpi-val{font-size:20px;font-weight:700;color:var(--text);line-height:1.2}
.afd-kpi-label{font-size:11px;color:var(--text3);margin-top:3px;font-weight:500}

/* Log event tags */
.afd-evt{font-size:12px;font-weight:500;padding:2px 8px;border-radius:10px;white-space:nowrap}
.afd-evt-error{background:rgba(239,68,68,.1);color:var(--danger)}
.afd-evt-success{background:rgba(16,185,129,.1);color:var(--success)}
.afd-evt-info{background:rgba(59,130,246,.1);color:var(--primary)}

/* Impersonation Banner */
#impersonate-banner{position:fixed;top:0;left:var(--sidebar-w);right:0;z-index:999;background:linear-gradient(90deg,#ff6d00,#ff9100);color:#fff;font-size:13px;font-weight:500;box-shadow:0 2px 8px rgba(255,109,0,.3)}
.imp-banner-inner{display:flex;align-items:center;justify-content:center;padding:8px 20px;gap:8px}

/* Sidebar toggle (hidden on desktop) */
.sidebar-toggle{display:none}
.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:19}
.sidebar-overlay.show{display:block}

/* --- Tablet breakpoint (1024px) --- */
@media(max-width:1024px){
  .filter-bar{flex-wrap:wrap}
  .filter-select{min-width:90px}
  .filter-search{min-width:120px}
  .detail-grid{grid-template-columns:1fr}
}

/* --- Mobile breakpoint (768px) --- */
@media(max-width:768px){
  .sidebar-toggle{display:inline-flex !important;font-size:20px;margin-right:4px}
  .sidebar{transform:translateX(-100%);transition:transform .25s ease}
  .sidebar.open{transform:translateX(0)}
  .main{margin-left:0 !important}
  :root{--sidebar-w:260px}
  .stats{grid-template-columns:repeat(2,1fr)}
  /* Filter bar: 2-column grid instead of stacking vertically */
  .filter-bar{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;gap:6px}
  .filter-spacer{display:none}
  .filter-select,.filter-search{width:100%}
  .cc-steps{overflow-x:auto}
  .cc-grid{flex-direction:column}
  .cc-import-box{flex-direction:column}
  .cc-radio-row{flex-direction:column}
  .crowd-selected-grid{grid-template-columns:1fr}
  .cc-bid-targets{flex-direction:column}
  .afd-overview{grid-template-columns:1fr}
  .afd-topbar{flex-direction:column;align-items:flex-start}
  .cc-product-grid{grid-template-columns:1fr}
  .cc-crowd-quick-grid{flex-wrap:wrap}
  .plan-cards{grid-template-columns:1fr}
  .header{padding:0 12px}
  .content{padding:12px !important}
  .batch-bar{flex-wrap:wrap}
  table{font-size:12px}
  th,td{padding:4px 6px}
  /* P1: Modal responsive */
  .modal{width:calc(100vw - 32px);max-width:480px}
  /* P1: Login box responsive */
  #login-box{width:calc(100vw - 32px);max-width:380px;padding:32px 20px}
  /* P1: Date range picker responsive — single calendar, hide shortcuts */
  .dr-panel{max-width:calc(100vw - 8px);overflow-x:auto}
  .dr-shortcuts{display:none}
  .dr-calendars{flex-direction:column}
  .dr-cal{width:100%}
  /* P1: Databoard date picker responsive */
  .db-dp-panel{min-width:0 !important;width:calc(100vw - 16px);max-width:520px;overflow-x:auto}
  /* P2: Toast responsive */
  .toast{min-width:0;max-width:calc(100vw - 32px)}
  /* P2: Table horizontal scroll hint */
  .card-b.np{position:relative}
  .card-b.np::after{content:'';position:absolute;top:0;right:0;bottom:0;width:20px;background:linear-gradient(to right,transparent,rgba(255,255,255,.85));pointer-events:none;z-index:1}
  /* P2: Hourly budget grid 6→4 columns */
  .hourly-budget-grid{grid-template-columns:repeat(4,1fr)}
  /* P2: Card padding reduction */
  .card-h{padding:8px 12px}
  .card-b{padding:12px}
  /* P2: Touch targets */
  .edit-icon{padding:6px;font-size:16px;min-width:32px;min-height:32px;display:inline-flex;align-items:center;justify-content:center}
  .page-btn{min-width:36px;height:36px}
  .strat-trigger{min-height:32px}
  .status-trigger{min-height:32px}
  /* P2: Auto-flow pipeline/flowchart horizontal scroll */
  .af-pipeline{overflow-x:auto;flex-wrap:nowrap;padding-bottom:8px;-webkit-overflow-scrolling:touch}
  .af-flowchart{overflow-x:auto;min-width:0;-webkit-overflow-scrolling:touch}
  .af-fc-node{min-width:100px}
  .afd-pipe{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .afd-pipe-node{min-width:80px}
}

/* --- Small phone breakpoint (480px) --- */
@media(max-width:480px){
  .stats{grid-template-columns:1fr}
  .hourly-budget-grid{grid-template-columns:repeat(3,1fr)}
  .filter-bar{grid-template-columns:1fr}
  .batch-bar{flex-direction:column;align-items:stretch}
  .header-title{font-size:14px}
  .stat .val{font-size:18px}
  .dr-cal{width:auto;min-width:0}
}

/* ========== Plan Cards ========== */
.plan-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-bottom:8px}
.plan-card{background:var(--card);border:1.5px solid var(--border);border-radius:10px;overflow:hidden;position:relative;display:flex;flex-direction:column;transition:box-shadow .2s,border-color .2s}
.plan-card:hover{box-shadow:0 4px 20px rgba(67,97,238,.1);border-color:rgba(67,97,238,.25)}
.plan-card-hot{border-color:var(--primary);box-shadow:0 2px 12px rgba(67,97,238,.12)}
.plan-card-disabled{opacity:.6}
.plan-hot-tag{position:absolute;top:12px;right:-28px;background:var(--primary);color:#fff;font-size:11px;font-weight:600;padding:2px 32px;transform:rotate(45deg);letter-spacing:1px}
.plan-card-head{padding:24px 20px 16px;text-align:center;border-bottom:1px solid var(--border)}
.plan-name{font-size:18px;font-weight:700;margin-bottom:8px;color:var(--text)}
.plan-price{display:flex;align-items:baseline;justify-content:center;gap:2px}
.plan-price-num{font-size:32px;font-weight:800;color:var(--primary)}
.plan-price-unit{font-size:13px;color:var(--text3)}
.plan-card-body{padding:16px 20px;flex:1}
.plan-features{list-style:none;margin:0;padding:0}
.plan-features li{padding:5px 0;font-size:13px;color:var(--text2);border-bottom:1px dashed rgba(0,0,0,.04)}
.plan-features li:last-child{border-bottom:none}
.plan-modules{display:flex;flex-direction:column;gap:6px;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--border)}
.plan-mod{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text)}
.plan-mod-off{color:var(--text3);text-decoration:line-through}
.plan-mod-icon{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;font-size:11px;font-weight:700}
.plan-mod .plan-mod-icon{background:var(--success-light);color:#1e8449}
.plan-mod-off .plan-mod-icon{background:#f0f1f3;color:var(--text3)}
.plan-card-foot{padding:12px 20px;border-top:1px solid var(--border);text-align:center;background:#fafbfc}

/* Subscription badge in shops */
.sub-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:3px;font-size:11px;font-weight:600}
.sub-active{background:var(--success-light);color:#1e8449}
.sub-expired{background:var(--danger-light);color:#c0392b}
.sub-none{background:#f0f1f3;color:var(--text3)}

/* Plan subscribe modal */
.plan-shop-list{display:flex;flex-direction:column;gap:4px;margin-top:6px}
.plan-shop-item{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1.5px solid var(--border);border-radius:var(--radius);cursor:pointer;transition:all .15s}
.plan-shop-item:hover{border-color:rgba(67,97,238,.3);background:var(--primary-light)}
.plan-shop-item input[type="radio"]{accent-color:var(--primary);width:16px;height:16px;margin:0}
.plan-shop-item:has(input:checked){border-color:var(--primary);background:var(--primary-light)}
.plan-shop-name{font-weight:600;font-size:14px}
.plan-order-summary{margin-top:16px;padding:12px 16px;background:#fafbfc;border-radius:var(--radius);border:1px solid var(--border)}
.plan-order-row{display:flex;justify-content:space-between;align-items:center;padding:6px 0;font-size:13px;color:var(--text2)}
.plan-order-total{border-top:1px solid var(--border);margin-top:6px;padding-top:10px}

/* ===== 数据大屏 (赛博科技风 v2) ===== */

/* --- 核心动画关键帧 --- */
@keyframes db-glow-pulse{0%,100%{opacity:.6}50%{opacity:1}}
@keyframes db-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes db-shimmer{0%{left:-100%}100%{left:200%}}
@keyframes db-fadein-up{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes db-twinkle{0%,100%{opacity:.2}50%{opacity:.9}}
@keyframes db-border-glow{0%,100%{opacity:.3}50%{opacity:.8}}
@keyframes db-data-rise{0%{transform:translateY(0);opacity:.6}100%{transform:translateY(-100vh);opacity:0}}
@keyframes db-holo-rotate{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
@keyframes db-breathe{0%,100%{box-shadow:inset 0 0 30px rgba(0,229,255,.03),0 0 15px rgba(0,229,255,.04)}50%{box-shadow:inset 0 0 50px rgba(0,229,255,.06),0 0 30px rgba(0,229,255,.08)}}
@keyframes db-line-flow{0%{background-position:200% 0}100%{background-position:-200% 0}}
@keyframes db-radar-sweep{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
@keyframes db-digit-flicker{0%,95%,100%{opacity:1}96%{opacity:.4}97%{opacity:1}98%{opacity:.6}}
@keyframes db-corner-pulse{0%,100%{opacity:.4}50%{opacity:1}}
@keyframes db-pulse{0%,100%{opacity:.3}50%{opacity:.6}}

/* 数据大屏页面：全深色，消除所有白边 */
.page-databoard{background:#020815}
.page-databoard .main{background:#020815}
.page-databoard .header{display:none}
.page-databoard .content{background:#020815}

/* --- 全屏容器 --- */
.db-screen{position:relative;min-height:calc(100vh - 60px);padding:24px 28px 36px;color:#e0e6ff;overflow:hidden;margin:-16px -20px;border-radius:0;
  background:#020815}
.db-screen:fullscreen,.db-screen:-webkit-full-screen{overflow-y:auto;margin:0;min-height:100vh;padding:24px 32px 40px}
.db-screen *{box-sizing:border-box}

/* --- 多层深空背景 --- */
.db-screen::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;
  background:
    radial-gradient(ellipse 80% 60% at 50% -10%,rgba(20,50,180,.18),transparent 65%),
    radial-gradient(ellipse 60% 50% at 95% 85%,rgba(80,30,160,.12),transparent 55%),
    radial-gradient(ellipse 50% 40% at 5% 60%,rgba(0,180,220,.06),transparent 55%),
    radial-gradient(ellipse 35% 35% at 50% 50%,rgba(10,30,120,.1),transparent 50%),
    radial-gradient(ellipse 25% 20% at 70% 20%,rgba(0,229,255,.04),transparent 45%),
    radial-gradient(ellipse 20% 25% at 20% 80%,rgba(120,0,255,.05),transparent 45%);
  pointer-events:none;z-index:0}

/* --- 六边形蜂窝网格(极淡) --- */
.db-screen::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='100'%3E%3Cpath d='M28 66L0 50L0 16L28 0L56 16L56 50L28 66L28 100' fill='none' stroke='rgba(67,97,238,0.04)' stroke-width='0.5'/%3E%3Cpath d='M28 0L28 34L0 50L0 84L28 100L56 84L56 50L28 34' fill='none' stroke='rgba(0,229,255,0.02)' stroke-width='0.3'/%3E%3C/svg%3E");
  background-size:56px 100px;opacity:.6;pointer-events:none;z-index:0}

.db-screen>*{position:relative;z-index:1}

/* --- 星星粒子 --- */
.db-stars{position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;pointer-events:none;overflow:hidden}
.db-star{position:absolute;border-radius:50%;background:#fff;animation:db-twinkle var(--dur,4s) ease-in-out var(--delay,0s) infinite}

/* --- 数据流光粒子 --- */
.db-data-particles{position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;pointer-events:none;overflow:hidden}
.db-data-p{position:absolute;width:1px;font-size:9px;color:rgba(0,229,255,.15);font-family:'Courier New',monospace;animation:db-data-rise var(--dur,12s) linear var(--delay,0s) infinite;white-space:nowrap}

/* --- 全局装饰边框 --- */
.db-frame{position:absolute;top:8px;left:8px;right:8px;bottom:8px;pointer-events:none;z-index:0}
.db-frame-corner{position:absolute;width:24px;height:24px}
.db-frame-corner.tl{top:0;left:0;border-top:2px solid rgba(0,229,255,.3);border-left:2px solid rgba(0,229,255,.3)}
.db-frame-corner.tr{top:0;right:0;border-top:2px solid rgba(0,229,255,.3);border-right:2px solid rgba(0,229,255,.3)}
.db-frame-corner.bl{bottom:0;left:0;border-bottom:2px solid rgba(0,229,255,.3);border-left:2px solid rgba(0,229,255,.3)}
.db-frame-corner.br{bottom:0;right:0;border-bottom:2px solid rgba(0,229,255,.3);border-right:2px solid rgba(0,229,255,.3)}
.db-frame-corner::after{content:'';position:absolute;width:4px;height:4px;background:#00e5ff;border-radius:50%;box-shadow:0 0 6px #00e5ff,0 0 12px rgba(0,229,255,.4);animation:db-corner-pulse 2s ease-in-out infinite}
.db-frame-corner.tl::after{top:-2px;left:-2px}
.db-frame-corner.tr::after{top:-2px;right:-2px}
.db-frame-corner.bl::after{bottom:-2px;left:-2px}
.db-frame-corner.br::after{bottom:-2px;right:-2px}
.db-frame-edge{position:absolute;background:linear-gradient(90deg,transparent,rgba(0,229,255,.12),transparent);background-size:200% 100%;animation:db-line-flow 8s linear infinite}
.db-frame-edge.top{top:0;left:40px;right:40px;height:1px}
.db-frame-edge.bottom{bottom:0;left:40px;right:40px;height:1px}
.db-frame-edge.left{top:40px;bottom:40px;left:0;width:1px;background:linear-gradient(180deg,transparent,rgba(0,229,255,.12),transparent);background-size:100% 200%;animation:db-line-flow 8s linear infinite}
.db-frame-edge.right{top:40px;bottom:40px;right:0;width:1px;background:linear-gradient(180deg,transparent,rgba(0,229,255,.12),transparent);background-size:100% 200%;animation:db-line-flow 8s linear infinite}

/* --- 标题区域 --- */
.db-header{display:flex;align-items:center;justify-content:center;gap:16px;margin-bottom:4px;padding-top:8px}
.db-logo{width:48px;height:48px;border-radius:12px;
  filter:drop-shadow(0 0 12px rgba(0,229,255,.5)) drop-shadow(0 0 24px rgba(67,97,238,.4));
  animation:db-glow-pulse 3s ease-in-out infinite;border:1px solid rgba(0,229,255,.2)}
.db-title{font-size:34px;font-weight:900;letter-spacing:10px;color:#fff;
  text-shadow:0 0 12px rgba(0,229,255,.7),0 0 36px rgba(67,97,238,.5),0 0 72px rgba(67,97,238,.25),0 2px 4px rgba(0,0,0,.5);
  animation:db-digit-flicker 8s ease-in-out infinite}
.db-subtitle{text-align:center;font-size:11px;color:rgba(100,180,255,.35);letter-spacing:5px;margin-bottom:6px;font-weight:400;font-family:'Courier New',monospace}

/* 标题装饰线 — 增强 */
.db-title-line{display:flex;align-items:center;justify-content:center;gap:0;margin-bottom:18px;position:relative}
.db-title-line .db-tl-wing{flex:0 0 180px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(0,229,255,.6),transparent);position:relative}
.db-title-line .db-tl-wing::after{content:'';position:absolute;top:-1px;height:3px;width:60%;
  background:linear-gradient(90deg,transparent,rgba(0,229,255,.2),transparent)}
.db-title-line .db-tl-wing:first-child::after{right:0}
.db-title-line .db-tl-wing:last-child::after{left:0}
.db-title-line .db-tl-diamond{width:10px;height:10px;background:linear-gradient(135deg,#00e5ff,#4361ee);transform:rotate(45deg);margin:0 14px;
  box-shadow:0 0 10px rgba(0,229,255,.7),0 0 20px rgba(0,229,255,.3);animation:db-glow-pulse 2s ease-in-out infinite}

/* 全息雷达装饰 */
.db-holo-radar{position:absolute;top:10px;right:30px;width:50px;height:50px;z-index:1;opacity:.25}
.db-holo-radar::before{content:'';position:absolute;width:100%;height:100%;border:1px solid rgba(0,229,255,.3);border-radius:50%}
.db-holo-radar::after{content:'';position:absolute;top:0;left:50%;width:50%;height:1px;background:linear-gradient(90deg,rgba(0,229,255,.8),transparent);transform-origin:left center;animation:db-radar-sweep 4s linear infinite}
.db-holo-ts{position:absolute;top:16px;left:30px;font-family:'Courier New',monospace;font-size:10px;color:rgba(0,229,255,.25);letter-spacing:1px;z-index:1}

/* --- 顶部工具栏 --- */
.db-toolbar{display:flex;align-items:center;gap:8px;margin-bottom:18px;flex-wrap:wrap;padding:10px 16px;
  background:linear-gradient(90deg,rgba(0,229,255,.02),rgba(67,97,238,.03),rgba(0,229,255,.02));
  border:1px solid rgba(0,229,255,.08);border-radius:8px;
  backdrop-filter:blur(8px);position:relative}
.db-toolbar::before{content:'';position:absolute;top:0;left:5%;right:5%;height:1px;background:linear-gradient(90deg,transparent,rgba(0,229,255,.25),transparent)}
.db-toolbar select,.db-toolbar input{background:rgba(10,15,40,.6);border:1px solid rgba(0,229,255,.12);color:#8ba4ff;font-size:12px;padding:6px 12px;border-radius:5px;outline:none;transition:all .3s;backdrop-filter:blur(4px)}
.db-toolbar select:focus,.db-toolbar input:focus{border-color:rgba(0,229,255,.5);box-shadow:0 0 12px rgba(0,229,255,.15),inset 0 0 8px rgba(0,229,255,.05)}
.db-toolbar select option{background:#0a0f2e;color:#c8d6ff}
.db-toolbar .db-tb-spacer{flex:1}
.db-toolbar button{background:linear-gradient(135deg,rgba(67,97,238,.12),rgba(0,229,255,.06));border:1px solid rgba(67,97,238,.2);color:#8ba4ff;font-size:12px;padding:6px 16px;border-radius:5px;cursor:pointer;transition:all .3s;letter-spacing:.5px;position:relative;overflow:hidden}
.db-toolbar button::after{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.05),transparent);transition:left .5s}
.db-toolbar button:hover::after{left:100%}
.db-toolbar button:hover{background:linear-gradient(135deg,rgba(67,97,238,.25),rgba(0,229,255,.15));border-color:rgba(0,229,255,.4);color:#fff;box-shadow:0 0 18px rgba(0,229,255,.15)}
.db-toolbar button.db-btn-active{background:linear-gradient(135deg,rgba(255,82,82,.15),rgba(255,40,40,.1));border-color:rgba(255,82,82,.35);color:#ff8a80}

/* --- 日期范围选择器 --- */
.db-date-wrap{display:inline-flex;align-items:center}
.db-dp-panel{position:fixed;z-index:9999;
  background:linear-gradient(160deg,rgba(8,14,45,.98),rgba(4,8,30,.99));
  border:1px solid rgba(0,229,255,.25);border-radius:10px;
  box-shadow:0 8px 48px rgba(0,0,0,.7),0 0 24px rgba(0,229,255,.1);
  backdrop-filter:blur(20px);min-width:520px;animation:db-dp-in .18s ease-out}
@keyframes db-dp-in{0%{opacity:0;transform:translateY(-6px)}100%{opacity:1;transform:translateY(0)}}
.db-dp-header{display:flex;align-items:center;justify-content:center;gap:12px;padding:14px 20px;border-bottom:1px solid rgba(0,229,255,.1);
  background:linear-gradient(90deg,rgba(0,229,255,.03),rgba(67,97,238,.05),rgba(0,229,255,.03))}
.db-dp-range-label{font-size:13px;color:rgba(180,200,255,.4);padding:4px 12px;border:1px solid rgba(0,229,255,.1);border-radius:6px;min-width:100px;text-align:center;transition:all .3s}
.db-dp-range-label.active{color:#00e5ff;border-color:rgba(0,229,255,.35);background:rgba(0,229,255,.06);text-shadow:0 0 8px rgba(0,229,255,.4)}
.db-dp-range-sep{color:rgba(0,229,255,.3);font-size:14px}
.db-dp-body{display:flex;gap:0}
.db-dp-shortcuts{display:flex;flex-direction:column;gap:4px;padding:14px 10px;border-right:1px solid rgba(0,229,255,.1);min-width:80px;
  background:linear-gradient(180deg,rgba(0,229,255,.02),transparent)}
.db-dp-sc-btn{background:transparent;border:1px solid rgba(67,97,238,.15);color:#8ba4ff;font-size:12px;padding:7px 12px;border-radius:5px;
  cursor:pointer;transition:all .3s;text-align:center;white-space:nowrap}
.db-dp-sc-btn:hover{background:linear-gradient(135deg,rgba(0,229,255,.12),rgba(67,97,238,.08));border-color:rgba(0,229,255,.4);color:#00e5ff;
  box-shadow:0 0 12px rgba(0,229,255,.15)}
.db-dp-calendars{display:flex;gap:8px;padding:14px 16px;flex:1}
.db-dp-month{flex:1;min-width:210px}
.db-dp-month-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;padding:0 4px}
.db-dp-month-title{font-size:13px;color:#c8d6ff;font-weight:600;letter-spacing:1px}
.db-dp-arrow{cursor:pointer;color:rgba(0,229,255,.6);font-size:18px;width:24px;height:24px;display:flex;align-items:center;justify-content:center;
  border-radius:4px;transition:all .2s;user-select:none}
.db-dp-arrow:hover{color:#00e5ff;background:rgba(0,229,255,.1)}
.db-dp-arrow-placeholder{width:24px}
.db-dp-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:0;margin-bottom:4px}
.db-dp-weekdays span{text-align:center;font-size:11px;color:rgba(180,200,255,.35);padding:4px 0;font-weight:500}
.db-dp-days{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.db-dp-day{text-align:center;font-size:12px;color:#c8d6ff;padding:6px 2px;border-radius:4px;cursor:pointer;transition:all .15s;user-select:none;line-height:1.2}
.db-dp-day:hover:not(.disabled):not(.empty){background:rgba(0,229,255,.12);color:#fff}
.db-dp-day.empty{cursor:default}
.db-dp-day.disabled{color:rgba(180,200,255,.15);cursor:not-allowed}
.db-dp-day.today{color:#00e5ff;font-weight:700;position:relative}
.db-dp-day.today::after{content:'';position:absolute;bottom:2px;left:50%;transform:translateX(-50%);width:4px;height:4px;border-radius:50%;background:#00e5ff;opacity:.6}
.db-dp-day.range-start,.db-dp-day.range-end{background:linear-gradient(135deg,rgba(0,229,255,.35),rgba(67,97,238,.25));color:#fff;font-weight:600;
  border-radius:4px;box-shadow:0 0 10px rgba(0,229,255,.2)}
.db-dp-day.in-range{background:rgba(0,229,255,.08);color:rgba(200,220,255,.9);border-radius:0}
.db-dp-day.range-start{border-radius:4px 0 0 4px}
.db-dp-day.range-end{border-radius:0 4px 4px 0}
.db-dp-day.range-start.range-end{border-radius:4px}
.db-dp-footer{display:flex;justify-content:flex-end;gap:10px;padding:12px 16px;border-top:1px solid rgba(0,229,255,.1);
  background:linear-gradient(90deg,rgba(0,229,255,.02),transparent)}
.db-dp-cancel{background:transparent;border:1px solid rgba(180,200,255,.2);color:rgba(180,200,255,.5);font-size:12px;padding:6px 20px;border-radius:5px;cursor:pointer;transition:all .2s}
.db-dp-cancel:hover{border-color:rgba(180,200,255,.4);color:#c8d6ff}
.db-dp-confirm{background:linear-gradient(135deg,rgba(0,229,255,.2),rgba(67,97,238,.15));border:1px solid rgba(0,229,255,.35);color:#00e5ff;font-size:12px;
  padding:6px 24px;border-radius:5px;cursor:pointer;transition:all .3s;font-weight:600;letter-spacing:.5px}
.db-dp-confirm:hover{background:linear-gradient(135deg,rgba(0,229,255,.3),rgba(67,97,238,.25));box-shadow:0 0 16px rgba(0,229,255,.2);color:#fff}

/* --- 4大KPI卡片 --- */
.db-hero-row{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:22px;animation:db-fadein-up .6s ease-out}
.db-hero-card{position:relative;background:linear-gradient(160deg,rgba(10,18,55,.85),rgba(5,10,35,.95));border:1px solid;border-radius:14px;padding:28px 22px 26px;text-align:center;overflow:hidden;transition:all .4s;animation:db-float 6s ease-in-out infinite}
.db-hero-card:nth-child(2){animation-delay:-.8s}
.db-hero-card:nth-child(3){animation-delay:-1.6s}
.db-hero-card:nth-child(4){animation-delay:-2.4s}

/* KPI顶部发光线 */
.db-hero-card::before{content:'';position:absolute;top:0;left:8%;right:8%;height:2px;border-radius:2px;opacity:.8}
/* KPI底部发光线 */
.db-hero-card::after{content:'';position:absolute;bottom:0;left:15%;right:15%;height:1px;border-radius:1px;opacity:.3}
/* 扫光效果 */
.db-hero-shimmer{position:absolute;top:0;left:-100%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.04),transparent);animation:db-shimmer 5s ease-in-out infinite;pointer-events:none}
.db-hero-card:nth-child(2) .db-hero-shimmer{animation-delay:-1.2s}
.db-hero-card:nth-child(3) .db-hero-shimmer{animation-delay:-2.4s}
.db-hero-card:nth-child(4) .db-hero-shimmer{animation-delay:-3.6s}

/* 四角装饰 — 增强 */
.db-hero-corner{position:absolute;width:16px;height:16px;pointer-events:none;animation:db-corner-pulse 3s ease-in-out infinite}
.db-hero-corner.tl{top:-1px;left:-1px;border-top:2px solid;border-left:2px solid;border-radius:4px 0 0 0}
.db-hero-corner.tr{top:-1px;right:-1px;border-top:2px solid;border-right:2px solid;border-radius:0 4px 0 0}
.db-hero-corner.bl{bottom:-1px;left:-1px;border-bottom:2px solid;border-left:2px solid;border-radius:0 0 0 4px}
.db-hero-corner.br{bottom:-1px;right:-1px;border-bottom:2px solid;border-right:2px solid;border-radius:0 0 4px 0}
.db-hero-corner.tr,.db-hero-corner.bl{animation-delay:-1.5s}

/* --- KPI颜色主题 (增强发光) --- */
.db-hero-card.c-cyan{border-color:rgba(0,229,255,.2);animation-name:db-float,db-breathe;
  box-shadow:inset 0 0 40px rgba(0,229,255,.03),0 0 20px rgba(0,229,255,.06),0 4px 20px rgba(0,0,0,.3)}
.db-hero-card.c-cyan::before,.db-hero-card.c-cyan::after{background:linear-gradient(90deg,transparent,rgba(0,229,255,.8),transparent)}
.db-hero-card.c-cyan:hover{border-color:rgba(0,229,255,.5);box-shadow:inset 0 0 60px rgba(0,229,255,.08),0 0 50px rgba(0,229,255,.15),0 4px 30px rgba(0,229,255,.1),0 8px 40px rgba(0,0,0,.3);transform:translateY(-6px)}
.db-hero-card.c-cyan .db-hero-corner{border-color:rgba(0,229,255,.6)}

.db-hero-card.c-green{border-color:rgba(0,230,118,.2);
  box-shadow:inset 0 0 40px rgba(0,230,118,.03),0 0 20px rgba(0,230,118,.06),0 4px 20px rgba(0,0,0,.3)}
.db-hero-card.c-green::before,.db-hero-card.c-green::after{background:linear-gradient(90deg,transparent,rgba(0,230,118,.8),transparent)}
.db-hero-card.c-green:hover{border-color:rgba(0,230,118,.5);box-shadow:inset 0 0 60px rgba(0,230,118,.08),0 0 50px rgba(0,230,118,.15),0 4px 30px rgba(0,230,118,.1),0 8px 40px rgba(0,0,0,.3);transform:translateY(-6px)}
.db-hero-card.c-green .db-hero-corner{border-color:rgba(0,230,118,.6)}

.db-hero-card.c-purple{border-color:rgba(179,136,255,.2);
  box-shadow:inset 0 0 40px rgba(179,136,255,.03),0 0 20px rgba(179,136,255,.06),0 4px 20px rgba(0,0,0,.3)}
.db-hero-card.c-purple::before,.db-hero-card.c-purple::after{background:linear-gradient(90deg,transparent,rgba(179,136,255,.8),transparent)}
.db-hero-card.c-purple:hover{border-color:rgba(179,136,255,.5);box-shadow:inset 0 0 60px rgba(179,136,255,.08),0 0 50px rgba(179,136,255,.15),0 4px 30px rgba(179,136,255,.1),0 8px 40px rgba(0,0,0,.3);transform:translateY(-6px)}
.db-hero-card.c-purple .db-hero-corner{border-color:rgba(179,136,255,.6)}

.db-hero-card.c-orange{border-color:rgba(255,171,64,.2);
  box-shadow:inset 0 0 40px rgba(255,171,64,.03),0 0 20px rgba(255,171,64,.06),0 4px 20px rgba(0,0,0,.3)}
.db-hero-card.c-orange::before,.db-hero-card.c-orange::after{background:linear-gradient(90deg,transparent,rgba(255,171,64,.8),transparent)}
.db-hero-card.c-orange:hover{border-color:rgba(255,171,64,.5);box-shadow:inset 0 0 60px rgba(255,171,64,.08),0 0 50px rgba(255,171,64,.15),0 4px 30px rgba(255,171,64,.1),0 8px 40px rgba(0,0,0,.3);transform:translateY(-6px)}
.db-hero-card.c-orange .db-hero-corner{border-color:rgba(255,171,64,.6)}

.db-hero-label{font-size:12px;color:rgba(180,200,255,.5);margin-bottom:14px;letter-spacing:3px;text-transform:uppercase;font-weight:500;font-family:'Courier New',monospace}
.db-hero-value{font-size:40px;font-weight:900;line-height:1;letter-spacing:2px;font-family:'DIN Alternate','Helvetica Neue',Arial,sans-serif;animation:db-digit-flicker 10s ease-in-out infinite}
.db-hero-value.v-cyan{color:#00e5ff;text-shadow:0 0 12px rgba(0,229,255,.6),0 0 36px rgba(0,229,255,.35),0 0 72px rgba(0,229,255,.15)}
.db-hero-value.v-green{color:#00e676;text-shadow:0 0 12px rgba(0,230,118,.6),0 0 36px rgba(0,230,118,.35),0 0 72px rgba(0,230,118,.15)}
.db-hero-value.v-purple{color:#b388ff;text-shadow:0 0 12px rgba(179,136,255,.6),0 0 36px rgba(179,136,255,.35),0 0 72px rgba(179,136,255,.15)}
.db-hero-value.v-orange{color:#ffab40;text-shadow:0 0 12px rgba(255,171,64,.6),0 0 36px rgba(255,171,64,.35),0 0 72px rgba(255,171,64,.15)}

/* --- 24H 分时折线图 --- */
.db-chart-panel{position:relative;background:linear-gradient(170deg,rgba(10,18,50,.75),rgba(5,10,30,.92));
  border:1px solid rgba(0,229,255,.08);border-radius:12px;padding:0;overflow:hidden;margin-bottom:18px;animation:db-fadein-up .6s ease-out}
.db-chart-panel::before{content:'';position:absolute;top:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,rgba(0,229,255,.4),transparent)}
.db-chart-head{display:flex;align-items:center;padding:14px 20px 10px;gap:12px;flex-wrap:wrap}
.db-chart-title{font-size:13px;font-weight:700;color:rgba(200,220,255,.9);letter-spacing:2px}
.db-chart-title::before{content:'';display:inline-block;width:3px;height:16px;background:linear-gradient(180deg,#00e5ff,#4361ee);border-radius:2px;margin-right:10px;vertical-align:middle;box-shadow:0 0 8px rgba(0,229,255,.6)}
.db-chart-legend{display:flex;align-items:center;gap:2px;margin-left:auto}
.db-chart-toggle{display:inline-flex;align-items:center;gap:4px;font-size:11px;color:rgba(200,220,255,.4);padding:3px 8px;border-radius:4px;cursor:pointer;transition:all .15s;border:1px solid transparent;user-select:none}
.db-chart-toggle:hover{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.1)}
.db-chart-toggle.active{color:rgba(200,220,255,.9);font-weight:500}
.db-chart-dot{display:inline-block;width:8px;height:8px;border-radius:50%;flex-shrink:0;box-shadow:0 0 6px currentColor}
.db-chart-time{font-size:10px;color:rgba(255,255,255,.3);margin-left:8px}
#db-trend-chart{display:block;padding:0 12px 10px}

/* --- 三栏面板区 --- */
.db-panels{display:grid;grid-template-columns:1fr 1.4fr 1fr;gap:18px;margin-bottom:20px;animation:db-fadein-up .8s ease-out}

/* --- 通用面板 (增强) --- */
.db-panel{position:relative;background:linear-gradient(170deg,rgba(10,18,50,.75),rgba(5,10,30,.92));
  border:1px solid rgba(0,229,255,.08);border-radius:12px;padding:0;overflow:hidden;transition:all .3s}
.db-panel:hover{border-color:rgba(0,229,255,.15);box-shadow:0 0 25px rgba(0,229,255,.05)}
.db-panel::before{content:'';position:absolute;top:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,rgba(0,229,255,.4),transparent)}
.db-panel::after{content:'';position:absolute;bottom:0;left:20%;right:20%;height:1px;background:linear-gradient(90deg,transparent,rgba(67,97,238,.2),transparent)}
.db-panel-head{display:flex;align-items:center;padding:16px 20px 12px;border-bottom:1px solid rgba(0,229,255,.06);gap:8px;position:relative}
.db-panel-head::after{content:'';position:absolute;bottom:-1px;left:0;width:60px;height:2px;background:linear-gradient(90deg,rgba(0,229,255,.5),transparent)}
.db-panel-title{font-size:13px;font-weight:700;color:rgba(200,220,255,.9);letter-spacing:2px}
.db-panel-title::before{content:'';display:inline-block;width:3px;height:16px;background:linear-gradient(180deg,#00e5ff,#4361ee);border-radius:2px;margin-right:10px;vertical-align:middle;box-shadow:0 0 8px rgba(0,229,255,.6),0 0 16px rgba(0,229,255,.3)}
.db-panel-body{padding:16px 20px 18px}

/* --- 排行条形图 (增强) --- */
.db-rank-item{display:flex;align-items:center;gap:10px;margin-bottom:10px;padding:4px 0;transition:all .2s}
.db-rank-item:hover{transform:translateX(3px)}
.db-rank-item:last-child{margin-bottom:0}
.db-rank-name{font-size:12px;color:rgba(200,214,255,.55);min-width:65px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:'Courier New',monospace}
.db-rank-bar-bg{flex:1;height:22px;background:rgba(0,229,255,.02);border-radius:3px;overflow:hidden;position:relative;border:1px solid rgba(0,229,255,.06)}
.db-rank-bar{height:100%;border-radius:2px;transition:width 1s cubic-bezier(.4,0,.2,1);position:relative}
.db-rank-bar::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(180deg,rgba(255,255,255,.08),transparent 50%);pointer-events:none}
.db-rank-bar::after{content:'';position:absolute;top:0;right:0;width:3px;height:100%;border-radius:1px;animation:db-glow-pulse 1.5s ease-in-out infinite}
.db-rank-bar.bar-cyan{background:linear-gradient(90deg,rgba(0,229,255,.05),rgba(0,229,255,.4),rgba(0,229,255,.7))}
.db-rank-bar.bar-cyan::after{background:#00e5ff;box-shadow:0 0 8px #00e5ff,0 0 16px rgba(0,229,255,.4)}
.db-rank-bar.bar-green{background:linear-gradient(90deg,rgba(0,230,118,.05),rgba(0,230,118,.4),rgba(0,230,118,.7))}
.db-rank-bar.bar-green::after{background:#00e676;box-shadow:0 0 8px #00e676,0 0 16px rgba(0,230,118,.4)}
.db-rank-val{font-size:12px;font-weight:700;color:rgba(200,220,255,.8);min-width:80px;text-align:right;font-family:'DIN Alternate','Courier New',monospace}

/* --- 中栏指标卡片 (增强) --- */
.db-metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.db-metric-item{background:linear-gradient(135deg,rgba(0,229,255,.02),rgba(67,97,238,.02));border:1px solid rgba(0,229,255,.06);border-radius:8px;padding:14px 12px;text-align:center;transition:all .3s;position:relative;overflow:hidden}
.db-metric-item::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(0,229,255,.15),transparent);opacity:0;transition:opacity .3s}
.db-metric-item:hover{border-color:rgba(0,229,255,.2);background:linear-gradient(135deg,rgba(0,229,255,.04),rgba(67,97,238,.04));transform:translateY(-2px);box-shadow:0 4px 15px rgba(0,0,0,.2)}
.db-metric-item:hover::before{opacity:1}
.db-metric-label{font-size:10px;color:rgba(160,180,255,.4);margin-bottom:6px;letter-spacing:1px;text-transform:uppercase;font-family:'Courier New',monospace}
.db-metric-val{font-size:22px;font-weight:800;font-family:'DIN Alternate','Helvetica Neue',monospace;line-height:1.1;animation:db-digit-flicker 12s ease-in-out infinite}
.db-metric-val.mc-cyan{color:#00e5ff;text-shadow:0 0 10px rgba(0,229,255,.35)}
.db-metric-val.mc-green{color:#00e676;text-shadow:0 0 10px rgba(0,230,118,.35)}
.db-metric-val.mc-purple{color:#b388ff;text-shadow:0 0 10px rgba(179,136,255,.35)}
.db-metric-val.mc-orange{color:#ffab40;text-shadow:0 0 10px rgba(255,171,64,.35)}

/* --- 利润排行 (增强) --- */
.db-profit-rank-item{display:flex;align-items:center;gap:10px;padding:10px 8px;border-bottom:1px solid rgba(0,229,255,.04);transition:all .2s}
.db-profit-rank-item:last-child{border-bottom:none}
.db-profit-rank-item:hover{background:rgba(0,229,255,.03);transform:translateX(2px)}
.db-profit-rank-num{font-size:15px;font-weight:900;min-width:26px;font-family:'DIN Alternate',monospace;text-align:center}
.db-profit-rank-num.top1{color:#ffab40;text-shadow:0 0 10px rgba(255,171,64,.5),0 0 20px rgba(255,171,64,.2);font-size:18px}
.db-profit-rank-num.top2{color:#00e5ff;text-shadow:0 0 8px rgba(0,229,255,.4)}
.db-profit-rank-num.top3{color:#b388ff;text-shadow:0 0 8px rgba(179,136,255,.4)}
.db-profit-rank-name{flex:1;font-size:12px;color:rgba(200,214,255,.6);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:'Courier New',monospace}
.db-profit-rank-val{font-size:13px;font-weight:700;min-width:85px;text-align:right;font-family:'DIN Alternate',monospace}
.db-profit-rank-val.positive{color:#00e676;text-shadow:0 0 8px rgba(0,230,118,.3)}
.db-profit-rank-val.negative{color:#ff5252;text-shadow:0 0 8px rgba(255,82,82,.3)}

/* --- 底部数据表格 (增强) --- */
.db-table-wrap{position:relative;background:linear-gradient(170deg,rgba(10,18,50,.65),rgba(5,10,30,.88));border:1px solid rgba(0,229,255,.08);border-radius:12px;overflow:hidden;transition:all .3s}
.db-table-wrap:hover{border-color:rgba(0,229,255,.12)}
.db-table-wrap::before{content:'';position:absolute;top:0;left:8%;right:8%;height:1px;background:linear-gradient(90deg,transparent,rgba(0,229,255,.35),transparent)}
.db-table-bar{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid rgba(0,229,255,.06)}
.db-table-bar-left{display:flex;gap:0;background:rgba(0,229,255,.03);border-radius:6px;padding:2px;border:1px solid rgba(0,229,255,.06)}
.db-table-bar-left .db-tab{padding:6px 18px;font-size:12px;border-radius:5px;cursor:pointer;color:rgba(160,180,255,.4);transition:all .3s;user-select:none;letter-spacing:1px;font-family:'Courier New',monospace}
.db-table-bar-left .db-tab:hover{color:#a0b4ff}
.db-table-bar-left .db-tab.active{background:linear-gradient(135deg,rgba(0,229,255,.15),rgba(67,97,238,.1));color:#00e5ff;font-weight:600;box-shadow:0 0 15px rgba(0,229,255,.1),inset 0 0 10px rgba(0,229,255,.05)}
.db-table-bar-right{display:flex;gap:6px}
.db-table-bar-right button{background:rgba(0,229,255,.04);border:1px solid rgba(0,229,255,.1);color:rgba(160,180,255,.45);font-size:11px;padding:5px 14px;border-radius:5px;cursor:pointer;transition:all .3s;font-family:'Courier New',monospace}
.db-table-bar-right button:hover{background:rgba(0,229,255,.1);color:#00e5ff;border-color:rgba(0,229,255,.3);box-shadow:0 0 10px rgba(0,229,255,.1)}

.db-table-scroll{overflow-x:auto}
.db-table-scroll table{width:100%;border-collapse:collapse}
.db-table-scroll thead th{font-size:11px;font-weight:600;color:rgba(0,229,255,.4);padding:12px 14px;border-bottom:1px solid rgba(0,229,255,.08);background:rgba(0,10,30,.3);white-space:nowrap;text-align:left;text-transform:uppercase;letter-spacing:1px;font-family:'Courier New',monospace}
.db-table-scroll tbody td{padding:11px 14px;font-size:12px;border-bottom:1px solid rgba(0,229,255,.03);color:rgba(200,220,255,.7);font-family:'DIN Alternate','Courier New',monospace}
.db-table-scroll tbody tr{transition:all .2s}
.db-table-scroll tbody tr:hover{background:linear-gradient(90deg,rgba(0,229,255,.04),rgba(67,97,238,.03))}
.db-table-scroll tbody tr.db-expandable{cursor:pointer}
.db-table-scroll tbody tr.db-expandable:hover{background:linear-gradient(90deg,rgba(0,229,255,.06),rgba(67,97,238,.04));box-shadow:inset 3px 0 0 rgba(0,229,255,.5)}
.db-table-scroll tbody tr.db-agg-total{background:linear-gradient(90deg,rgba(0,229,255,.04),rgba(67,97,238,.03),rgba(179,136,255,.02));font-weight:600}
.db-table-scroll tbody tr.db-agg-total td{color:#c8d6ff;border-bottom:1px solid rgba(0,229,255,.1)}

/* sub-table */
.db-table-scroll tr.db-sub-header>td{padding:0!important;background:rgba(0,5,15,.25)}
.db-table-scroll tr.db-sub-header table{width:100%;border-collapse:collapse}
.db-table-scroll tr.db-sub-header table th{font-size:10px;padding:7px 12px;background:rgba(0,10,25,.3);color:rgba(0,229,255,.3);border-bottom:1px solid rgba(0,229,255,.05);font-family:'Courier New',monospace}
.db-table-scroll tr.db-sub-header table td{font-size:11px;padding:6px 12px;color:rgba(200,220,255,.5);border-bottom:1px solid rgba(0,229,255,.02)}
.db-table-scroll tr.db-sub-header table tbody tr:hover{background:rgba(0,229,255,.04)}

/* expand icon */
.db-expand-icon{display:inline-flex;font-size:10px;color:rgba(0,229,255,.3);margin-right:6px;transition:.3s}
.db-expandable:hover .db-expand-icon{color:#00e5ff;text-shadow:0 0 6px rgba(0,229,255,.5)}

/* profit colors */
.db-profit-pos{color:#00e676!important;text-shadow:0 0 8px rgba(0,230,118,.25)}
.db-profit-neg{color:#ff5252!important;text-shadow:0 0 8px rgba(255,82,82,.25)}

/* empty */
.db-empty{text-align:center;padding:50px 20px;color:rgba(0,229,255,.2);font-size:13px;letter-spacing:2px;font-family:'Courier New',monospace}

/* --- ROI提示 --- */
.db-breakeven-hint{font-size:11px;color:rgba(0,229,255,.3);margin-bottom:16px;display:flex;align-items:center;gap:8px;padding-left:6px;font-family:'Courier New',monospace;letter-spacing:1px}
.db-breakeven-hint .db-be-dot{width:6px;height:6px;border-radius:50%;background:#00e5ff;display:inline-block;box-shadow:0 0 8px rgba(0,229,255,.7),0 0 16px rgba(0,229,255,.3);animation:db-glow-pulse 2s ease-in-out infinite}

/* --- Settings modal --- */
.db-settings-row{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.db-settings-row label{font-weight:600;font-size:13px;min-width:70px;margin:0}

/* --- Responsive --- */
@media(max-width:1100px){
  .db-hero-row{grid-template-columns:repeat(2,1fr)}
  .db-panels{grid-template-columns:1fr}
  .db-hero-value{font-size:30px}
  .db-holo-radar,.db-holo-ts{display:none}
}
@media(max-width:600px){
  .db-hero-row{grid-template-columns:1fr}
  .db-hero-value{font-size:26px}
  .db-title{font-size:22px;letter-spacing:3px}
  .db-frame{display:none}
}

/* ====== 计划模板 - 流量智选 ====== */
.ct-traffic-smart-area{margin-top:8px}
.ct-ts-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.ct-ts-item{border:1px solid var(--border);border-radius:var(--radius);padding:12px;background:#fafbfc;transition:border .15s}
.ct-ts-item:hover{border-color:var(--primary)}
.ct-ts-item-top{display:flex;align-items:center;gap:6px;margin-bottom:4px}
.ct-ts-item-top b{font-size:13px}
.ct-ts-item-desc{font-size:11px;color:var(--text3);margin-bottom:8px;line-height:1.4}
.ct-ts-item-bid{display:flex;align-items:center;gap:6px;font-size:12px}
.ct-ts-item-bid label{color:var(--text2);font-weight:500}
.ct-ts-item-bid input{width:80px;padding:4px 8px;font-size:12px}
.ct-ts-item-bid span{color:var(--text3)}

/* ====== 计划模板 - 营销场景 ====== */
.ct-scene-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.ct-scene-card{border:1px solid var(--border);border-radius:var(--radius);padding:14px 12px;cursor:pointer;transition:all .15s;background:#fff}
.ct-scene-card:hover{border-color:var(--primary);background:var(--primary-light)}
.ct-scene-card.active{border-color:var(--primary);background:var(--primary-light);box-shadow:0 0 0 2px rgba(67,97,238,.15)}
.ct-scene-card-title{font-weight:600;font-size:14px;margin-bottom:4px}
.ct-scene-card.active .ct-scene-card-title{color:var(--primary)}
.ct-scene-card-desc{font-size:11px;color:var(--text3);line-height:1.4}
.ct-scene-sub-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ct-scene-sub-item{border:1px solid var(--border);border-radius:var(--radius);padding:10px;cursor:pointer;transition:all .15s;display:flex;align-items:flex-start;gap:8px}
.ct-scene-sub-item:hover{border-color:var(--primary)}
.ct-scene-sub-item.active{border-color:var(--primary);background:var(--primary-light)}
.ct-scene-sub-item input[type="radio"]{margin-top:2px}
.ct-scene-sub-item b{font-size:13px;display:block;margin-bottom:2px}
.ct-scene-sub-item p{font-size:11px;color:var(--text3);margin:0;line-height:1.3}
@media(max-width:900px){
  .ct-scene-grid{grid-template-columns:repeat(2,1fr)}
  .ct-scene-sub-grid{grid-template-columns:1fr 1fr}
  .ct-ts-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:600px){
  .ct-scene-grid{grid-template-columns:1fr}
  .ct-scene-sub-grid{grid-template-columns:1fr}
  .ct-ts-grid{grid-template-columns:1fr}
}

/* ====== 计划模板 - 顶部Tab(营销场景/货品全站推广) ====== */
.ct-top-tabs{display:flex;gap:0;border-bottom:2px solid var(--border);margin-bottom:14px}
.ct-top-tab{padding:10px 24px;font-size:14px;font-weight:600;cursor:pointer;color:var(--text2);border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .15s}
.ct-top-tab:hover{color:var(--primary)}
.ct-top-tab.active{color:var(--primary);border-bottom-color:var(--primary)}

/* ====== 计划模板 - 小尺寸场景卡片(营销目标) ====== */
.ct-scene-card-sm{padding:10px}
.ct-scene-card-sm .ct-scene-card-title{font-size:13px;margin-bottom:2px}
.ct-scene-card-sm .ct-scene-card-desc{font-size:10px}

/* ====== 计划模板 - 卡位方式 ====== */
.ct-card-pos-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:8px}
.ct-card-pos-item{border:1px solid var(--border);border-radius:var(--radius);padding:10px;cursor:pointer;transition:all .15s;text-align:center}
.ct-card-pos-item:hover{border-color:var(--primary)}
.ct-card-pos-item.active{border-color:var(--primary);background:var(--primary-light);box-shadow:0 0 0 2px rgba(67,97,238,.12)}
.ct-card-pos-item .cp-label{font-weight:600;font-size:13px;margin-bottom:3px}
.ct-card-pos-item.active .cp-label{color:var(--primary)}
.ct-card-pos-item .cp-tag{display:inline-block;font-size:10px;padding:1px 5px;border-radius:3px;background:#fff3e0;color:#e65100;margin-left:4px}
.ct-card-pos-item .cp-tag.t-new{background:#e3f2fd;color:#1565c0}
.ct-card-pos-item .cp-desc{font-size:10px;color:var(--text3);line-height:1.3;margin-top:4px}
@media(max-width:900px){.ct-card-pos-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.ct-card-pos-grid{grid-template-columns:1fr}}

/* ====== 计划模板 - Pill Tabs ====== */
.ct-pill-tabs{display:flex;gap:8px;flex-wrap:wrap}

/* ====== Badge 补充 ====== */
.badge.b-orange{background:#fff3e0;color:#e65100}

/* ====== Loading Skeleton ====== */
.skeleton-row{height:16px;border-radius:4px;margin-bottom:12px;background:linear-gradient(90deg,var(--border) 25%,var(--card-bg) 50%,var(--border) 75%);background-size:200% 100%;animation:sk-shine 1.2s ease-in-out infinite}
@keyframes sk-shine{0%{background-position:200% 0}100%{background-position:-200% 0}}