:root { color-scheme: dark; --bg:#07111e; --panel:#0d2035; --border:#1b3955; --muted:#7890a8; --text:#e7f2fc; --accent:#4cc8ff; --positive:#30d68c; --negative:#fa6074; font-family: Inter, "Segoe UI", "Microsoft YaHei", sans-serif; }
* { box-sizing:border-box; }
body { font-size:16px; line-height:1.5; }
.control-shell label, .control-shell .intro p, .control-shell .section-title > span, .control-shell .rule-status, .control-shell .rule-section-heading p { font-size:14px; }
.control-shell input, .control-shell select, .control-shell button { font-size:16px; min-height:42px; }
.control-shell small, .control-shell .record small, .control-shell .record em, .control-shell .token-panel small { font-size:13px; }
.control-shell .record strong, .control-shell .rule-enable, .control-shell .rule-schedule, .control-shell .stat span, .control-shell .record-list.empty { font-size:15px; }
.control-shell .section-title h2 { font-size:24px; }
.control-shell .panel h3 { font-size:18px; }
.control-shell .section-nav a { font-size:14px; }
.control-shell .eyebrow { font-size:12px !important; }
.control-header .brand, .control-header .back-link { font-size:14px; }
.control-shell .record > div:first-child { display:grid; gap:4px; }
#provider-list .record { grid-template-columns:minmax(0,1fr) auto auto auto; align-items:center; }
.model-test-result { grid-column:1/-1; white-space:normal; overflow-wrap:anywhere; }
.provider-advanced summary, .policy-panel summary { cursor:pointer; color:var(--accent); font-size:14px; }
.provider-advanced[open] summary, .policy-panel[open] summary { margin-bottom:16px; }
#toast { font-size:14px !important; }
html, body { margin:0; min-height:100%; background:radial-gradient(circle at 80% -10%, #123657 0, transparent 38%), var(--bg); color:var(--text); overflow-x: hidden; }
body { min-width:0; }
button, input, select { font:inherit; }
.control-header { height:58px; display:flex; align-items:center; justify-content:space-between; padding:0 max(18px, calc((100% - 1280px)/2)); border-bottom:1px solid #142c43; background:rgba(5,15,26,.86); backdrop-filter:blur(14px); position:sticky; top:0; z-index:5; }
.brand, .back-link { color:#dceeff; text-decoration:none; font-size:12px; font-weight:700; letter-spacing:.09em; }.brand span { color:#63819c; }.back-link { color:var(--accent); font-size:10px; }
.control-shell { width:min(1280px, calc(100% - 34px)); margin:0 auto; padding:30px 0 70px; }
.intro { display:grid; grid-template-columns:1fr minmax(300px,420px); gap:22px; align-items:end; }.intro h1 { margin:4px 0 7px; font-size:30px; }.intro p { margin:0; color:var(--muted); font-size:12px; }.eyebrow { margin:0 !important; color:var(--accent) !important; font-size:9px !important; font-weight:700; letter-spacing:.17em; }
.panel, .token-panel { border:1px solid var(--border); border-radius:13px; background:linear-gradient(145deg, rgba(15,34,55,.96), rgba(8,23,39,.98)); box-shadow:0 18px 45px rgba(0,0,0,.18); }.token-panel { padding:14px; }.token-panel label { display:block; margin-bottom:7px; color:#9db4ca; font-size:10px; }.token-panel div { display:flex; gap:8px; }.token-panel small { display:block; margin-top:7px; color:#607a94; font-size:9px; }
.section-nav { display:flex; gap:8px; margin:24px 0 4px; overflow:auto; scrollbar-width:none; }.section-nav a { flex:none; padding:7px 11px; border:1px solid #183650; border-radius:99px; color:#91aac1; font-size:9px; text-decoration:none; }
.control-section { scroll-margin-top:75px; margin-top:31px; }.section-title { display:flex; align-items:end; justify-content:space-between; gap:12px; margin-bottom:10px; }.section-title h2 { margin:4px 0 0; font-size:17px; }.section-title > span { color:var(--muted); font-size:9px; }
.two-column { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.panel { min-width:0; padding:16px; }.panel h3 { margin:0 0 13px; color:#bad0e5; font-size:12px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.form-grid .wide { grid-column:1/-1; }.form-grid button { justify-self:start; }.inline-form { display:flex; flex-wrap:wrap; align-items:end; gap:12px; }.inline-form label { min-width:150px; flex:1; }.inline-form button { flex:none; }
label { display:grid; gap:6px; color:#8ea7bf; font-size:9px; }input, select { min-width:0; width:100%; border:1px solid #23445f; border-radius:8px; padding:9px 10px; color:#e5f2fd; background:#08192a; outline:none; }input:focus, select:focus { border-color:var(--accent); box-shadow:0 0 0 2px rgba(76,200,255,.09); }.toggle { display:flex; grid-column:1/-1; flex-direction:row; align-items:center; }.toggle input { width:auto; }
button { border:1px solid #2b6a8d; border-radius:8px; padding:9px 13px; color:#dff5ff; background:#123d58; cursor:pointer; }button:hover { border-color:var(--accent); }.primary { background:#125173; }.ghost { padding:6px 10px; color:#90cdea; background:transparent; font-size:9px; }
.policy-panel { margin-top:12px; }.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:10px; }.stat { min-height:90px; display:flex; flex-direction:column; justify-content:space-between; }.stat span { color:var(--muted); font-size:9px; }.stat strong { color:var(--accent); font-size:22px; }
.record-list { display:grid; gap:8px; }.record-list.empty { color:#607b94; font-size:10px; }.record { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; padding:10px; border:1px solid #173650; border-radius:8px; background:#091a2b; }.record strong { overflow:hidden; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }.record small { color:var(--muted); font-size:8px; }.record em { color:var(--positive); font-size:8px; font-style:normal; }.record[data-state="failed"] em { color:var(--negative); }
.record-actions { display:flex; align-items:center; gap:8px; }.channel-test { min-width:66px; }.channel-test:disabled { cursor:wait; opacity:.65; }
.danger { border-color:#7c3144; color:#ff9eae; background:#351826; }.danger:hover { border-color:#ff5f78; }.channel-delete:disabled { cursor:wait; opacity:.65; }
.notification-rule-stack { display:grid; gap:12px; margin-top:12px; }.notification-rule-section { display:grid; gap:8px; }.rule-section-heading { display:flex; justify-content:space-between; gap:12px; }.rule-section-heading h3 { margin-bottom:4px; }.rule-section-heading p { margin:0; color:var(--muted); font-size:9px; }.notification-rule-form { display:grid; grid-template-columns:minmax(130px,.8fr) minmax(150px,.8fr) minmax(210px,1.4fr) minmax(120px,.7fr) auto; align-items:center; gap:12px; padding:12px; border:1px solid #173650; border-radius:10px; background:#091a2b; }.rule-enable { display:flex; flex-direction:row; align-items:center; gap:8px; color:#dcebf8; font-size:11px; font-weight:700; }.rule-enable input { width:auto; }.rule-schedule { color:#b9d0e4; font-size:10px; }.rule-status { color:var(--muted); font-size:9px; }.notification-rule-form select[multiple] { min-height:58px; }.danger-text { color:var(--negative); }.positive-text { color:var(--positive); }
#toast { position:fixed; right:18px; bottom:18px; max-width:min(360px,calc(100% - 36px)); padding:10px 13px; border:1px solid #25506f; border-radius:9px; background:#0e2b42; color:#dff4ff; font-size:10px; opacity:0; pointer-events:none; transform:translateY(8px); transition:.2s; }#toast.visible { opacity:1; transform:none; }#toast.error { border-color:#783647; color:#ffb5bf; }
@media (max-width:780px) { .control-shell { width:calc(100% - 20px); padding-top:18px; }.intro, .two-column { grid-template-columns:1fr; }.intro h1 { font-size:23px; }.control-header { height:52px; padding:0 12px; }.brand span { display:none; }.section-title > span { display:none; }.stats-grid { grid-template-columns:1fr 1fr; }.form-grid { grid-template-columns:1fr; }.form-grid .wide { grid-column:auto; }.panel { padding:12px; border-radius:10px; }.inline-form, .notification-rule-form { display:grid; grid-template-columns:1fr; }.inline-form label { min-width:0; }.notification-rule-form button { width:100%; }.section-nav { margin-top:14px; }.control-section { margin-top:24px; } }