:root { --bg:#f7f8fa; --panel:#fff; --soft:#f1f4f8; --line:#e8ecf2; --line-strong:#dbe1ea; --text:#0f172a; --muted:#64748b; --faint:#94a3b8; --accent:#0f172a; --signal-green:#16a34a; --signal-wait:#64748b; --signal-red:#dc2626; --signal-green-soft:rgba(22,163,74,.10); --accent-soft:rgba(15,23,42,.08); }
body.studio-theme-dark, html.studio-theme-dark body { --bg:#0e1014; --panel:#1c1e26; --soft:#272a33; --line:#323540; --line-strong:#3f424d; --text:#e8e8ea; --muted:#a4adbf; --faint:#7a8497; --accent:#f5f6f8; --signal-green:#4ade80; --signal-wait:#a4adbf; --signal-red:#f87171; --signal-green-soft:rgba(74,222,128,.10); --accent-soft:rgba(245,246,248,.08); }
* { box-sizing:border-box; }
html { min-height:100%; overflow-y:auto; overscroll-behavior:auto; }
body { margin:0; min-height:100vh; overflow-y:auto; background:var(--bg); color:var(--text); font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; -webkit-font-smoothing:antialiased; -webkit-overflow-scrolling:touch; overscroll-behavior:auto; }
* { scrollbar-width:none !important; -ms-overflow-style:none !important; }
*::-webkit-scrollbar,
*::-webkit-scrollbar-thumb,
*::-webkit-scrollbar-track,
*::-webkit-scrollbar-corner { width:0 !important; height:0 !important; display:none !important; background:transparent !important; }
button { font-family:inherit; cursor:pointer; border:0; background:transparent; color:inherit; }
.page { min-height:100vh; padding:40px 32px 80px; }
.wrap { max-width:1100px; margin:0 auto; }
.page-head { padding:0 4px 28px; display:flex; justify-content:space-between; align-items:end; gap:24px; flex-wrap:wrap; }
.page-head .title { font-size:17px; line-height:1.2; font-weight:800; letter-spacing:-.015em; }
.page-head .sub { margin-top:8px; color:var(--muted); font-size:12.5px; line-height:1.55; font-weight:600; max-width:520px; }
.page-head .status { color:var(--muted); font-size:11.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; min-height:16px; }
.layout { display:grid; grid-template-columns:252px minmax(0,1fr); gap:18px; align-items:start; }
/* Sidebar */
.sidebar { display:flex; flex-direction:column; gap:12px; position:sticky; top:18px; max-height:calc(100vh - 64px); overflow-y:auto; -webkit-overflow-scrolling:touch; padding:16px; background:var(--panel); border:1px solid var(--line); border-radius:10px; }
.side-section-title { color:var(--faint); font-size:10px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; padding:2px 4px; }
.provider-list { display:flex; flex-direction:column; gap:4px; padding-bottom:8px; border-bottom:1px solid var(--line); margin-bottom:4px; }
.provider-card { width:100%; text-align:left; border:1px solid transparent; background:transparent; border-radius:12px; padding:8px 10px; display:flex; align-items:center; gap:10px; color:var(--muted); transition:all .15s ease; min-height:48px; }
.provider-card:hover { border-color:var(--text); color:var(--text); }
.provider-card.active { background:var(--soft); color:var(--text); border-color:transparent; }
.provider-card.active:hover { border-color:var(--text); }
.provider-card.active .provider-name { color:var(--text); }
.provider-card.active .provider-meta { color:var(--muted); }
.provider-mark { width:28px; height:28px; border-radius:8px; display:flex; align-items:center; justify-content:center; flex:0 0 auto; background:var(--soft); color:var(--muted); }
.provider-card.active .provider-mark { background:var(--panel); color:var(--text); }
.provider-card.provider-card-banner { padding:8px 10px; justify-content:center; min-height:44px; border-color:var(--line); }
.provider-card.provider-card-banner:hover { border-color:var(--line-strong); }
.provider-card.provider-card-banner.active { border-color:var(--line-strong); box-shadow:inset 0 0 0 1px rgba(15,23,42,.025); }
body.studio-theme-dark .provider-card.provider-card-banner,
html.studio-theme-dark body .provider-card.provider-card-banner { border-color:var(--line-strong); }
body.studio-theme-dark .provider-card.provider-card-banner.active,
html.studio-theme-dark body .provider-card.provider-card-banner.active { box-shadow:inset 0 0 0 1px rgba(255,255,255,.035); }
.provider-card-banner img { height:22px; width:auto; max-width:100%; object-fit:contain; display:block; }
.provider-card-banner .runninghub-icon { height:18px; max-width:132px; }
.provider-card-banner .volcengine-icon { height:22px; max-width:132px; }
.provider-card-banner .ms-icon-dark { display:none; }
body.studio-theme-dark .provider-card-banner .ms-icon-light,
html.studio-theme-dark body .provider-card-banner .ms-icon-light { display:none; }
body.studio-theme-dark .provider-card-banner .ms-icon-dark,
html.studio-theme-dark body .provider-card-banner .ms-icon-dark { display:block; }
.provider-name { min-width:0; font-size:12.5px; font-weight:800; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.provider-meta { margin-top:1px; color:var(--faint); font-size:10px; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.add-btn { width:100%; height:40px; border:1px dashed var(--line-strong); border-radius:12px; color:var(--muted); display:inline-flex; align-items:center; justify-content:center; gap:6px; font-size:12px; font-weight:800; transition:all .15s ease; }
.add-btn:hover { color:var(--text); border-color:var(--faint); background:var(--soft); }
.api-link-btn { width:100%; height:40px; border:1px solid var(--line); border-radius:12px; background:var(--soft); color:var(--text); display:inline-flex; align-items:center; justify-content:center; gap:6px; font-size:12px; font-weight:850; text-decoration:none; transition:all .15s ease; }
.api-link-btn:hover { border-color:var(--text); background:var(--text); color:var(--bg); transform:translateY(-1px); box-shadow:0 8px 18px rgba(15,23,42,.12); }
body.studio-theme-dark .api-link-btn,
html.studio-theme-dark body .api-link-btn { background:#f5f6f8; border-color:#f5f6f8; color:#0e1014; box-shadow:0 8px 18px rgba(0,0,0,.24); }
body.studio-theme-dark .api-link-btn:hover,
html.studio-theme-dark body .api-link-btn:hover { background:#ffffff; border-color:#ffffff; color:#05070b; }
.recommend-api-body { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px; padding:18px 20px 6px; }
.recommend-card { min-width:0; border:1px solid var(--line); border-radius:16px; background:var(--panel); padding:16px; display:flex; flex-direction:column; gap:12px; box-shadow:0 10px 24px rgba(15,23,42,.06); }
.recommend-card:hover { border-color:var(--line-strong); box-shadow:0 14px 30px rgba(15,23,42,.1); }
.recommend-name { display:flex; align-items:center; justify-content:space-between; gap:10px; color:var(--text); font-size:16px; font-weight:950; letter-spacing:.02em; }
.recommend-badge { height:22px; padding:0 8px; border-radius:999px; background:var(--soft); color:var(--muted); border:1px solid var(--line); display:inline-flex; align-items:center; font-size:10px; font-weight:850; white-space:nowrap; }
/* 「推荐API」按钮图标小跳动动画 */
.api-link-btn i, .api-link-btn svg { animation:apiLinkBounce 1.4s ease-in-out infinite; transform-origin:center bottom; }
.api-link-btn:hover i, .api-link-btn:hover svg { animation-play-state:paused; }
@keyframes apiLinkBounce { 0%,100% { transform:translateY(0); } 30% { transform:translateY(-3px); } 55% { transform:translateY(0); } 70% { transform:translateY(-1.5px); } }
.recommend-tags { display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.recommend-tag { height:24px; padding:0 8px; border-radius:8px; background:var(--soft); color:var(--text); border:1px solid var(--line); display:inline-flex; align-items:center; gap:4px; font-size:10.5px; font-weight:850; line-height:1; white-space:nowrap; }
/* 「签到送积分」胶囊：紫色边框 + 紫色文字，无动画，效果克制 */
.recommend-tag.recommend-perk-tag { padding:0 10px !important; background:transparent !important; border:1px solid #8a3cff !important; color:#8a3cff !important; }
.recommend-tag.recommend-perk-tag > span { color:#8a3cff !important; }
.recommend-tag.recommend-perk-tag i, .recommend-tag.recommend-perk-tag svg { color:#8a3cff !important; stroke:#8a3cff !important; }
body.studio-theme-dark .recommend-tag.recommend-perk-tag,
html.studio-theme-dark body .recommend-tag.recommend-perk-tag { border-color:#b98cff !important; color:#b98cff !important; }
body.studio-theme-dark .recommend-tag.recommend-perk-tag > span,
html.studio-theme-dark body .recommend-tag.recommend-perk-tag > span { color:#b98cff !important; }
body.studio-theme-dark .recommend-tag.recommend-perk-tag i,
body.studio-theme-dark .recommend-tag.recommend-perk-tag svg,
html.studio-theme-dark body .recommend-tag.recommend-perk-tag i,
html.studio-theme-dark body .recommend-tag.recommend-perk-tag svg { color:#b98cff !important; stroke:#b98cff !important; }
.recommend-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:auto; padding-top:10px; }
.recommend-actions a,.recommend-actions button { min-width:0; height:34px; border-radius:10px; display:inline-flex; align-items:center; justify-content:center; gap:6px; text-decoration:none; font-size:11.5px; font-weight:900; border:1px solid var(--line); transition:all .15s ease; }
.recommend-register { background:var(--text); color:var(--bg); border-color:var(--text) !important; }
.recommend-register:hover { transform:translateY(-1px); box-shadow:0 8px 18px rgba(15,23,42,.18); }
.recommend-fill { background:var(--soft); color:var(--text); }
.recommend-fill:hover { border-color:var(--text); }
.recommend-note { margin:8px 20px 18px; padding:10px 12px; border-radius:12px; background:var(--soft); color:var(--muted); border:1px solid var(--line); font-size:11px; line-height:1.55; font-weight:750; }
@media (max-width:720px) { .recommend-api-body { grid-template-columns:1fr; } }
/* Content */
.content { display:flex; flex-direction:column; gap:20px; min-width:0; }
.content-head { display:flex; align-items:end; justify-content:space-between; gap:16px; flex-wrap:wrap; padding:20px 24px; background:var(--panel); border:1px solid var(--line); border-radius:16px; }
.content-head .editor-title { font-size:22px; line-height:1.1; font-weight:900; letter-spacing:-.01em; }
.content-head .editor-sub { margin-top:4px; color:var(--muted); font-size:11.5px; font-weight:700; letter-spacing:.02em; }
.content-actions { display:flex; gap:8px; align-items:center; }
.block { display:flex; flex-direction:column; gap:14px; padding:22px 24px; background:var(--panel); border:1px solid var(--line); border-radius:10px; }
.block-head { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; padding-bottom:14px; border-bottom:1px solid var(--line); margin-bottom:2px; }
.block-head > div { min-width:0; flex:1 1 280px; }
.block-title { font-size:12px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; color:var(--text); }
.block-desc { color:var(--muted); font-size:11.5px; line-height:1.55; font-weight:600; margin-top:4px; max-width:480px; }
.agent-llm-block { margin-bottom: 18px; }
.agent-llm-form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
@media (max-width: 860px) { .agent-llm-form { grid-template-columns: 1fr; } }
.form { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.field { display:flex; flex-direction:column; gap:7px; min-width:0; }
.field.full { grid-column:1/-1; }
.label { color:var(--muted); font-size:11px; font-weight:800; letter-spacing:.02em; }
/* 输入框：外层 frame 提供边框 + padding，内部 input 透明无边框，让文字跟边框有视觉距离 */
.field-frame { display:flex; align-items:center; padding:4px; border:1px solid var(--line); border-radius:11px; background:var(--panel); transition:border-color .15s ease; }
.field-frame:focus-within { border-color:var(--text); }
.field-frame.is-disabled { background:var(--soft); border-color:var(--line); cursor:not-allowed; }
.field-frame input { width:100%; height:34px; padding:0 10px; border:0; background:transparent; color:var(--text); outline:none; font-size:13px; font-weight:650; }
.field-frame input:disabled { color:var(--muted); cursor:not-allowed; }
/* 暗色下让输入框/模型行底色比卡片更浅一档，形成层次 */
body.studio-theme-dark .field-frame { background:var(--soft); border-color:var(--line-strong); }
body.studio-theme-dark .field-frame:focus-within { border-color:#f5f6f8; }
.hint { color:var(--faint); font-size:11px; line-height:1.5; font-weight:600; }
/* Key row */
.key-row { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:8px; align-items:center; }
.key-row .field-frame { width:100%; }
.key-panel { padding:12px; border:1px solid var(--line); border-radius:14px; background:var(--soft); }
.key-input-line { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; }
.key-input-line .field-frame { width:100%; background:var(--panel); }
.key-actions { display:flex; gap:8px; align-items:center; }
.verify-action-row { grid-column:1/-1; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.provider-protocol-hint { grid-column:1/-1; padding:12px 14px; border:1px solid #f6d7a7; border-radius:12px; background:#fff8ea; color:#92400e; }
.provider-protocol-hint-title { font-size:11px; font-weight:900; letter-spacing:.04em; text-transform:uppercase; }
.provider-protocol-hint-body { margin-top:4px; font-size:11.5px; line-height:1.6; font-weight:700; }
.provider-protocol-hint code { padding:1px 6px; border-radius:6px; border:1px solid rgba(146,64,14,.14); background:rgba(255,255,255,.72); color:#7c2d12; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:10.5px; }
body.studio-theme-dark .provider-protocol-hint,
html.studio-theme-dark body .provider-protocol-hint { background:rgba(146,64,14,.14); border-color:rgba(251,191,36,.24); color:#fdba74; }
body.studio-theme-dark .provider-protocol-hint code,
html.studio-theme-dark body .provider-protocol-hint code { background:rgba(15,23,42,.28); border-color:rgba(251,191,36,.18); color:#fde68a; }
.advanced-endpoints { grid-column:1/-1; display:none; padding:12px; border:1px solid var(--line); border-radius:12px; background:var(--soft); }
.advanced-endpoints.open { display:block; }
.endpoint-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.endpoint-grid .field-frame { background:var(--panel); }
.endpoint-help { margin-bottom:10px; color:var(--muted); font-size:11px; line-height:1.55; font-weight:650; }
.endpoint-help code { padding:1px 6px; border-radius:6px; border:1px solid var(--line); background:var(--panel); color:var(--text); font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:10.5px; }
body.studio-theme-dark .endpoint-grid .field-frame { background:var(--panel); }
.key-btn { width:44px; height:44px; border-radius:11px; display:flex; align-items:center; justify-content:center; border:1px solid var(--line); background:var(--panel); color:var(--muted); transition:all .15s ease; }
.key-btn:hover { color:var(--text); border-color:var(--text); }
body.studio-theme-dark .key-btn { background:var(--soft); border-color:var(--line-strong); }
body.studio-theme-dark .key-btn:hover { background:#323540; border-color:#f5f6f8; }
.key-btn.key-clear:hover { color:#dc2626; border-color:#fca5a5; background:#fff5f5; }
body.studio-theme-dark .key-btn.key-clear:hover { background:rgba(127,29,29,.18); border-color:rgba(248,113,113,.3); color:#fca5a5; }
/* Models */
.block.models-toolbar { display:flex; flex-direction:row; align-items:center; justify-content:space-between; gap:12px; padding:8px 18px 12px; }
.models-toolbar > div:first-child { min-width:0; flex:1 1 320px; }
.models-toolbar-actions { display:flex; gap:8px; align-items:center; justify-content:flex-end; flex:0 0 auto; }
.model-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
@media (max-width:1000px) { .model-grid { grid-template-columns:1fr; } }
.model-list { display:flex; flex-direction:column; gap:6px; }
.model-row { display:grid; grid-template-columns:minmax(0,1fr) 36px; align-items:center; gap:6px; padding:4px; border:1px solid var(--line); border-radius:11px; background:var(--panel); }
.model-row.has-protocol { grid-template-columns:minmax(0,1fr) auto 36px; }
.model-row.has-alias { grid-template-columns:minmax(0,1.1fr) minmax(0,0.9fr) 36px; }
.model-row.has-alias.has-protocol { grid-template-columns:minmax(0,1fr) minmax(0,0.85fr) auto 36px; }
body.studio-theme-dark .model-row { background:var(--soft); border-color:var(--line-strong); }
.model-row input { height:34px; padding:0 10px; border:0; background:transparent; font-size:12.5px; }
.model-row .model-alias-input { color:var(--text); font-family:inherit; }
.model-row .model-alias-input::placeholder { color:var(--faint); }
.model-protocol-select { height:30px; padding:0 8px; border:1px solid var(--line); border-radius:8px; background:var(--soft); color:var(--text); font-size:11.5px; font-weight:700; outline:none; cursor:pointer; min-width:74px; }
body.studio-theme-dark .model-protocol-select { background:var(--panel); border-color:var(--line-strong); }
.ms-lora-block { display:none; }
body.show-ms .ms-lora-block { display:flex; }
.lora-list { display:flex; flex-direction:column; gap:8px; }
.lora-row { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1.1fr) 86px 36px; gap:8px; align-items:end; padding:10px; border:1px solid var(--line); border-radius:12px; background:var(--panel); }
body.studio-theme-dark .lora-row { background:var(--soft); border-color:var(--line-strong); }
.lora-field { display:flex; flex-direction:column; gap:5px; min-width:0; }
.lora-field span { color:var(--faint); font-size:10px; font-weight:900; letter-spacing:.06em; text-transform:uppercase; }
.lora-field input,.lora-field select { width:100%; height:34px; padding:0 9px; border:1px solid var(--line); border-radius:9px; background:var(--soft); color:var(--text); outline:none; font-size:12px; font-weight:700; min-width:0; }
body.studio-theme-dark .lora-field input, body.studio-theme-dark .lora-field select { background:var(--panel); border-color:var(--line-strong); }
.lora-empty { padding:18px; border:1px dashed var(--line); border-radius:11px; color:var(--faint); text-align:center; font-size:11.5px; font-weight:700; }
.icon-btn { width:36px; height:36px; border-radius:9px; display:flex; align-items:center; justify-content:center; color:var(--faint); transition:all .15s ease; }
.icon-btn:hover { color:#dc2626; background:#fff5f5; }
body.studio-theme-dark .icon-btn:hover { background:rgba(127,29,29,.18); color:#fca5a5; }
.ghost-btn { height:32px; padding:0 12px; border-radius:9px; border:1px solid var(--line); color:var(--muted); display:inline-flex; align-items:center; justify-content:center; gap:6px; font-size:11.5px; font-weight:750; transition:all .15s ease; }
.ghost-btn:hover { color:var(--text); border-color:var(--text); }
/* 顶部操作栏统一按钮 */
.action-btn { height:36px; padding:0 14px; border-radius:10px; display:inline-flex; align-items:center; justify-content:center; gap:6px; font-size:12px; font-weight:800; transition:all .15s ease; border:1px solid var(--line); background:var(--panel); color:var(--muted); }
.action-btn:hover { color:var(--text); border-color:var(--text); }
.action-btn.primary-btn { color:var(--text); border-color:var(--line-strong); background:var(--soft); }
.action-btn.primary-btn:hover { background:var(--text); color:var(--bg); border-color:var(--text); }
.action-btn.danger-btn { color:#dc2626; border-color:#fecaca; background:transparent; }
.action-btn.danger-btn:hover { background:#fff5f5; color:#dc2626; border-color:#fca5a5; }
body.studio-theme-dark .action-btn.danger-btn,
html.studio-theme-dark body .action-btn.danger-btn { color:#fecaca; border-color:rgba(248,113,113,.55); background:rgba(127,29,29,.28); }
body.studio-theme-dark .action-btn.danger-btn:hover,
html.studio-theme-dark body .action-btn.danger-btn:hover { background:#7f1d1d; color:#fff; border-color:#f87171; box-shadow:0 8px 18px rgba(127,29,29,.28); }
.action-btn.save-btn { background:var(--accent); color:var(--bg); border-color:var(--accent); }
.action-btn.save-btn:hover { transform:translateY(-1px); box-shadow:0 6px 16px rgba(15,23,42,.15); background:var(--accent); color:var(--bg); border-color:var(--accent); }
.action-btn.save-btn.is-saved { background:#16a34a; color:#fff; border-color:#16a34a; box-shadow:0 8px 18px rgba(22,163,74,.22); }
body.studio-theme-dark .action-btn.save-btn,
html.studio-theme-dark body .action-btn.save-btn { background:#f5f6f8; color:#0e1014; border-color:#f5f6f8; box-shadow:0 8px 18px rgba(0,0,0,.22); }
body.studio-theme-dark .action-btn.save-btn:hover,
html.studio-theme-dark body .action-btn.save-btn:hover { background:#ffffff; color:#05070b; border-color:#ffffff; box-shadow:0 10px 22px rgba(0,0,0,.3); }
body.studio-theme-dark .api-page-save-btn,
html.studio-theme-dark body .api-page-save-btn,
body.theme-dark .api-page-save-btn {
    background:#f8fafc !important;
    color:#020617 !important;
    border-color:#ffffff !important;
    box-shadow:0 8px 20px rgba(0,0,0,.32), inset 0 0 0 1px rgba(15,23,42,.08) !important;
}
body.studio-theme-dark .api-page-save-btn:hover,
html.studio-theme-dark body .api-page-save-btn:hover,
body.theme-dark .api-page-save-btn:hover {
    background:#ffffff !important;
    color:#020617 !important;
    border-color:#ffffff !important;
    transform:translateY(-1px);
    box-shadow:0 12px 26px rgba(0,0,0,.4), inset 0 0 0 1px rgba(15,23,42,.08) !important;
}
body.studio-theme-dark .api-page-delete-btn,
html.studio-theme-dark body .api-page-delete-btn,
body.theme-dark .api-page-delete-btn {
    background:transparent !important;
    color:#b91c1c !important;
    border-color:#b91c1c !important;
    box-shadow:none !important;
}
body.studio-theme-dark .api-page-delete-btn:hover,
html.studio-theme-dark body .api-page-delete-btn:hover,
body.theme-dark .api-page-delete-btn:hover {
    background:#7f1d1d !important;
    color:#ffffff !important;
    border-color:#b91c1c !important;
    transform:translateY(-1px);
    box-shadow:0 10px 22px rgba(127,29,29,.3) !important;
}
/* MS 使用提示（按 provider 显示） */
/* 模型选择器浮层 */
.picker-overlay { display:none; position:fixed; inset:0; background:rgba(15,23,42,.45); z-index:99; align-items:center; justify-content:center; padding:32px; }
body.studio-theme-dark .picker-overlay { background:rgba(0,0,0,.62); }
.picker-modal { width:100%; max-width:780px; max-height:90vh; background:var(--panel); border:1px solid var(--line-strong); border-radius:18px; display:flex; flex-direction:column; overflow:hidden; box-shadow:0 28px 64px rgba(15,23,42,.25); }
.picker-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 20px; border-bottom:1px solid var(--line); }
.picker-title { font-size:15px; font-weight:900; color:var(--text); }
.picker-count { font-size:11px; color:var(--muted); font-weight:700; margin-top:2px; }
.picker-close { width:30px; height:30px; border-radius:8px; display:flex; align-items:center; justify-content:center; color:var(--muted); cursor:pointer; transition:all .15s ease; }
.picker-close:hover { background:var(--soft); color:var(--text); }
.picker-toolbar { display:flex; align-items:center; gap:10px; padding:12px 20px; border-bottom:1px solid var(--line); flex-wrap:wrap; }
.picker-search { flex:1; min-width:160px; height:34px; padding:0 12px; border:1px solid var(--line); border-radius:9px; background:var(--soft); color:var(--text); outline:none; font-size:12.5px; }
.picker-search:focus { border-color:var(--text); background:var(--panel); }
.picker-cat-tabs { display:flex; gap:4px; background:var(--soft); padding:3px; border-radius:9px; border:1px solid var(--line); }
.picker-cat-tab { height:28px; padding:0 10px; border-radius:6px; display:inline-flex; align-items:center; gap:5px; color:var(--muted); font-size:11px; font-weight:800; cursor:pointer; }
.picker-cat-tab:hover { color:var(--text); }
.picker-cat-tab.active { background:var(--panel); color:var(--text); box-shadow:0 1px 2px rgba(15,23,42,.06); }
.picker-cat-tab .cat-count { font-size:10px; padding:1px 5px; border-radius:5px; background:var(--line); color:var(--muted); font-weight:800; }
.picker-cat-tab.active .cat-count { background:var(--soft); color:var(--text); }
.picker-body { flex:1; overflow:auto; -webkit-overflow-scrolling:touch; padding:8px 12px 12px; }
.picker-row { display:flex; align-items:center; gap:12px; padding:11px 12px; border-bottom:1px solid var(--line); cursor:pointer; transition:background .12s ease; }
.picker-row:hover { background:var(--soft); }
.picker-row.has-sel { background:rgba(15,23,42,.04); }
body.studio-theme-dark .picker-row.has-sel { background:rgba(255,255,255,.04); }
.picker-checkbox { width:18px; height:18px; border:1.5px solid var(--line-strong); border-radius:5px; display:flex; align-items:center; justify-content:center; background:var(--panel); flex:0 0 auto; color:var(--bg); transition:all .15s ease; }
.picker-row:hover .picker-checkbox { border-color:var(--text); }
.picker-checkbox.checked { background:var(--text); border-color:var(--text); }
body.studio-theme-dark .picker-checkbox.checked { background:#f5f6f8; border-color:#f5f6f8; color:#0e1014; }
.picker-checkbox svg { width:12px; height:12px; opacity:0; }
.picker-checkbox.checked svg { opacity:1; }
.picker-model-name { min-width:0; flex:1; font-size:13px; font-weight:650; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }
.picker-row.has-sel .picker-model-name { font-weight:850; }
/* 当前模型在其他类别中也被选中时，右侧显示提示标签 */
.picker-other-cats { display:flex; gap:4px; flex:0 0 auto; }
.picker-other-tag { font-size:9.5px; font-weight:800; padding:2px 6px; border-radius:5px; letter-spacing:.04em; }
.picker-other-tag.cat-image { background:rgba(16,185,129,.14); color:#047857; }
.picker-other-tag.cat-chat { background:rgba(59,130,246,.14); color:#1d4ed8; }
.picker-other-tag.cat-video { background:rgba(245,158,11,.14); color:#b45309; }
body.studio-theme-dark .picker-other-tag.cat-image { background:rgba(16,185,129,.2); color:#34d399; }
body.studio-theme-dark .picker-other-tag.cat-chat { background:rgba(96,165,250,.2); color:#60a5fa; }
body.studio-theme-dark .picker-other-tag.cat-video { background:rgba(251,191,36,.2); color:#fbbf24; }
/* 底部汇总条 */
.picker-summary { display:flex; align-items:center; gap:10px; padding:11px 20px; background:#eef2f7; border-top:1px solid #d7dee9; font-size:11.5px; font-weight:800; color:#334155; flex-wrap:wrap; }
.picker-summary-title { font-weight:900; color:#0f172a; }
.picker-sum-chip { display:inline-flex; align-items:center; gap:5px; padding:5px 12px; border-radius:8px; font-weight:900; font-size:11.5px; color:#fff; background:#1f2937; box-shadow:inset 0 0 0 1px rgba(255,255,255,.18), 0 1px 2px rgba(15,23,42,.14); }
body.studio-theme-dark .picker-summary,
html.studio-theme-dark body .picker-summary { background:#141a25; border-top-color:#2b3444; color:#cbd5e1; }
body.studio-theme-dark .picker-summary-title,
html.studio-theme-dark body .picker-summary-title { color:#f8fafc; }
body.studio-theme-dark .picker-sum-chip,
html.studio-theme-dark body .picker-sum-chip { background:#e2e8f0; color:#0f172a; box-shadow:inset 0 0 0 1px rgba(15,23,42,.12), 0 1px 2px rgba(0,0,0,.28); }
.picker-sum-chip-empty { background:#1f2937 !important; color:#fff !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.18), 0 1px 2px rgba(15,23,42,.14); }
body.studio-theme-dark .picker-sum-chip-empty,
html.studio-theme-dark body .picker-sum-chip-empty { background:#e2e8f0 !important; color:#0f172a !important; box-shadow:inset 0 0 0 1px rgba(15,23,42,.12), 0 1px 2px rgba(0,0,0,.28); }
.picker-foot { display:flex; align-items:center; justify-content:flex-end; gap:8px; padding:12px 20px; border-top:1px solid var(--line); }
.ms-hint { display:none; margin-top:8px; color:var(--muted); font-size:11.5px; line-height:1.65; font-weight:600; }
body.show-ms .ms-hint { display:block; }
.runninghub-hint { display:none; margin-top:8px; color:var(--muted); font-size:11.5px; line-height:1.65; font-weight:600; }
body.show-runninghub .runninghub-hint { display:block; }
.runninghub-hint a { color:var(--text); font-weight:800; text-decoration:underline; text-underline-offset:3px; }
.volcengine-hint { display:none; margin-top:8px; color:var(--muted); font-size:11.5px; line-height:1.65; font-weight:600; }
body.show-volcengine-standalone .volcengine-hint { display:block; }
.metaso-hint { display:none; margin-top:8px; color:var(--muted); font-size:11.5px; line-height:1.65; font-weight:600; }
body.show-metaso-standalone .metaso-hint { display:block; }
.rh-key-stack { display:none; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
body.show-runninghub .rh-key-stack { display:grid; }
.volcengine-key-stack { display:none; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
body.show-volcengine-standalone .volcengine-key-stack:not([hidden]) { display:grid; }
.volcengine-key-stack .rh-key-item:first-child,
.volcengine-key-stack .volcengine-project-card { grid-column:1/-1; }
.volcengine-project-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.rh-key-item { display:flex; flex-direction:column; gap:12px; padding:14px; border:1px solid var(--line); border-radius:14px; background:var(--soft); min-width:0; }
body.studio-theme-dark .rh-key-item { border-color:var(--line-strong); background:rgba(255,255,255,.035); }
.rh-key-head { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:14px; }
.rh-key-head > div:first-child { min-width:0; }
.rh-key-title { color:var(--text); font-size:13px; line-height:1.2; font-weight:950; }
.rh-key-desc { margin-top:4px; color:var(--muted); font-size:11px; line-height:1.45; font-weight:650; }
.rh-key-links { display:flex; align-items:center; justify-content:flex-end; gap:7px; flex-wrap:wrap; color:var(--faint); font-size:11px; line-height:1.5; font-weight:800; }
.rh-key-links a { height:30px; padding:0 11px; border:1px solid var(--line-strong); border-radius:9px; background:var(--panel); color:var(--text); display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:900; text-decoration:none; box-shadow:0 2px 6px rgba(15,23,42,.06); transition:all .15s ease; }
.rh-key-links a:hover { border-color:var(--text); transform:translateY(-1px); box-shadow:0 8px 18px rgba(15,23,42,.12); }
.rh-key-links a svg { flex:0 0 auto; }
body.show-runninghub .api-standard-key-row,
body.show-runninghub .api-key-label,
body.show-runninghub #keyHint { display:none !important; }
body.show-jimeng .api-base-url-field,
body.show-jimeng .api-key-field { display:none !important; }
.jimeng-cli-panel { grid-column:1/-1; display:none; flex-direction:column; gap:12px; margin-top:2px; padding:14px; border:1px solid var(--line); border-radius:14px; background:var(--soft); }
body.show-jimeng .jimeng-cli-panel:not([hidden]) { display:flex; }
.jimeng-cli-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.jimeng-status-pill { height:26px; padding:0 10px; border-radius:8px; border:1px solid var(--line-strong); display:inline-flex; align-items:center; color:var(--muted); background:var(--panel); font-size:11px; font-weight:900; white-space:nowrap; }
.jimeng-status-pill.ok { color:#15803d; border-color:#86efac; background:#f0fdf4; }
.jimeng-status-pill.bad { color:#b45309; border-color:#fcd34d; background:#fffbeb; }
.jimeng-actions { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.jimeng-credit { min-height:20px; color:var(--text); font-size:12px; line-height:1.55; font-weight:800; white-space:pre-wrap; word-break:break-word; }
.jimeng-output { display:grid; grid-template-columns:auto minmax(0,1fr); gap:12px; align-items:start; padding:10px; border:1px solid var(--line); border-radius:12px; background:var(--panel); }
.jimeng-output[hidden] { display:none !important; }
.jimeng-output pre { margin:0; max-height:260px; overflow:auto; color:var(--text); font:11px/1.45 ui-monospace,Menlo,Consolas,monospace; white-space:pre-wrap; word-break:break-word; }
.jimeng-qr-img { width:180px; height:180px; object-fit:contain; border-radius:10px; border:1px solid var(--line); background:#fff; }
.jimeng-help-modal { max-width:860px; }
.jimeng-help-toolbar { display:flex; gap:10px; align-items:center; padding:14px 20px; border-bottom:1px solid var(--line); }
.jimeng-help-toolbar select { height:38px; min-width:180px; border:1px solid var(--line); border-radius:10px; background:var(--panel); color:var(--text); padding:0 10px; font-weight:800; outline:none; }
.jimeng-help-output { margin:0; padding:18px 20px; min-height:420px; max-height:62vh; overflow:auto; background:var(--soft); color:var(--text); font:12px/1.55 ui-monospace,Menlo,Consolas,monospace; white-space:pre-wrap; word-break:break-word; }
body.show-volcengine .api-key-label { display:inline-flex !important; }
.runninghub-config-block[hidden] { display:none !important; }
.runninghub-config-block { display:none; gap:14px; }
body.show-runninghub .runninghub-config-block { display:flex; }
.rh-paste-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:center; }
.rh-paste-input { width:100%; height:40px; border:1px solid var(--line); border-radius:11px; background:var(--panel); color:var(--text); outline:none; padding:0 12px; font-size:13px; font-weight:700; }
.rh-paste-input:focus { border-color:var(--text); }
body.studio-theme-dark .rh-paste-input { background:var(--soft); border-color:var(--line-strong); }
.rh-card-columns { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.rh-card-group { display:flex; flex-direction:column; gap:10px; min-width:0; }
.rh-group-head { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.rh-group-title { font-size:12px; font-weight:950; letter-spacing:.06em; text-transform:uppercase; color:var(--text); }
.rh-group-count { min-width:28px; height:24px; padding:0 8px; border-radius:7px; background:var(--soft); color:var(--muted); display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:900; }
.rh-card-list { display:grid; grid-template-columns:1fr; gap:10px; }
.rh-config-card { border:1px solid var(--line); border-radius:14px; background:var(--panel); padding:10px; display:grid; grid-template-columns:60px minmax(0,1fr) auto; gap:10px; align-items:start; }
body.studio-theme-dark .rh-config-card { background:var(--soft); border-color:var(--line-strong); }
.rh-thumb { width:60px; height:80px; border-radius:10px; border:1px solid var(--line); background:var(--soft); display:flex; align-items:center; justify-content:center; overflow:hidden; color:var(--muted); cursor:pointer; }
.rh-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
.rh-card-main { min-width:0; display:flex; flex-direction:column; gap:7px; }
.rh-card-title-field { display:flex; flex-direction:column; gap:4px; }
.rh-card-title-field span { color:var(--faint); font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.rh-card-main input,.rh-card-main textarea { width:100%; border:1px solid var(--line); border-radius:9px; background:var(--soft); color:var(--text); outline:none; padding:0 9px; font-size:12px; font-weight:700; }
.rh-card-main input { height:30px; }
.rh-card-title-field input { background:var(--panel); border-color:var(--line-strong); font-size:13px; font-weight:900; }
.rh-card-title-field input:focus { border-color:var(--text); box-shadow:0 0 0 2px rgba(15,23,42,.08); }
.rh-card-main textarea { min-height:48px; padding:7px 9px; resize:vertical; line-height:1.35; font-family:inherit; }
body.studio-theme-dark .rh-card-main input, body.studio-theme-dark .rh-card-main textarea { background:var(--panel); border-color:var(--line-strong); }
.rh-id-line { display:flex; align-items:center; gap:6px; color:var(--faint); font-size:10.5px; font-weight:800; font-family:ui-monospace,Menlo,monospace; min-width:0; }
.rh-id-line span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rh-card-actions { display:flex; flex-direction:column; gap:6px; }
.rh-card-action { width:30px; height:30px; border-radius:8px; border:1px solid var(--line); color:var(--muted); background:var(--panel); display:flex; align-items:center; justify-content:center; }
.rh-card-action:hover { color:var(--text); border-color:var(--text); }
.rh-card-action.danger:hover { color:#dc2626; border-color:#fca5a5; background:#fff5f5; }
.rh-empty { padding:18px 12px; border:1px dashed var(--line); border-radius:12px; color:var(--faint); font-size:11.5px; font-weight:750; text-align:center; }
.rh-workflow-editor-overlay { position:fixed; inset:0; z-index:120; display:none; align-items:center; justify-content:center; padding:24px; background:rgba(15,23,42,.42); backdrop-filter:blur(14px); }
.rh-workflow-editor-overlay.open { display:flex; }
.rh-workflow-editor-modal { width:min(1520px, 98vw); height:min(980px, 96vh); background:var(--panel); border:1px solid var(--line-strong); border-radius:18px; box-shadow:0 28px 80px rgba(15,23,42,.28); display:flex; flex-direction:column; overflow:hidden; }
body.studio-theme-dark .rh-workflow-editor-modal,
html.studio-theme-dark body .rh-workflow-editor-modal { box-shadow:0 28px 80px rgba(0,0,0,.58); }
.rh-workflow-editor-head { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 18px; border-bottom:1px solid var(--line); background:var(--panel); }
.rh-workflow-editor-title-wrap { min-width:0; }
.rh-workflow-editor-title { color:var(--text); font-size:18px; line-height:1.15; font-weight:950; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rh-workflow-editor-sub { margin-top:4px; color:var(--muted); font-size:11.5px; font-weight:750; font-family:ui-monospace,Menlo,monospace; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rh-workflow-editor-actions { display:flex; align-items:center; gap:8px; flex:0 0 auto; }
.rh-workflow-editor-close { width:36px; height:36px; border-radius:10px; border:1px solid var(--line); color:var(--muted); display:flex; align-items:center; justify-content:center; }
.rh-workflow-editor-close:hover { color:var(--text); border-color:var(--text); background:var(--soft); }
.rh-workflow-editor-body { flex:1; min-height:0; display:grid; grid-template-columns:420px minmax(0,1fr); gap:0; }
.rh-workflow-editor-side { min-height:0; overflow:auto; border-right:1px solid var(--line); padding:16px; display:flex; flex-direction:column; gap:12px; background:var(--panel); }
.rh-workflow-editor-canvas { min-width:0; min-height:0; padding:16px; background:var(--soft); }
.rh-editor-field { display:flex; flex-direction:column; gap:6px; }
.rh-editor-field span { color:var(--muted); font-size:10.5px; font-weight:900; letter-spacing:.06em; text-transform:uppercase; }
.rh-editor-field input,
.rh-editor-field textarea { width:100%; border:1px solid var(--line); border-radius:10px; background:var(--soft); color:var(--text); outline:none; padding:0 10px; font-size:12.5px; font-weight:700; font-family:inherit; }
.rh-editor-field input { height:34px; }
.rh-editor-field textarea { min-height:64px; padding:8px 10px; resize:vertical; line-height:1.45; }
.rh-editor-field input:focus,
.rh-editor-field textarea:focus { border-color:var(--text); background:var(--panel); }
body.studio-theme-dark .rh-editor-field input,
body.studio-theme-dark .rh-editor-field textarea { background:var(--soft); border-color:var(--line-strong); }
.rh-editor-summary { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.rh-editor-summary div { padding:10px; border:1px solid var(--line); border-radius:12px; background:var(--soft); }
.rh-editor-summary span { display:block; color:var(--faint); font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.rh-editor-summary strong { display:block; margin-top:3px; color:var(--text); font-size:15px; font-weight:950; }
.rh-editor-node-list { display:flex; flex-direction:column; gap:10px; min-height:0; }
.rh-mapped-card { border:1px solid var(--line); border-radius:14px; background:var(--soft); padding:12px; display:flex; flex-direction:column; gap:12px; }
.rh-mapped-head { display:flex; align-items:center; gap:10px; min-width:0; }
.rh-mapped-icon { width:34px; height:34px; border-radius:10px; border:1px solid var(--line); background:var(--panel); color:var(--text); display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.rh-mapped-title { color:var(--text); font-size:13px; font-weight:950; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rh-mapped-sub { margin-top:2px; color:var(--faint); font-size:10.5px; font-weight:800; font-family:ui-monospace,Menlo,monospace; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rh-mapped-stats { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:6px; }
.rh-mapped-stats span { min-height:28px; border:1px solid var(--line); border-radius:8px; background:var(--panel); color:var(--muted); display:flex; align-items:center; justify-content:center; font-size:10.5px; font-weight:850; }
.rh-preview-fields { display:flex; flex-direction:column; gap:10px; padding-top:10px; border-top:1px solid var(--line); }
.rh-preview-field { display:flex; flex-direction:column; gap:6px; }
.rh-preview-label { color:var(--muted); font-size:11px; font-weight:850; }
.rh-preview-field input,
.rh-preview-field select { width:100%; height:34px; border:1px solid var(--line); border-radius:9px; background:var(--panel); color:var(--text); outline:none; padding:0 10px; font-size:12px; font-weight:750; }
.rh-preview-field input[type=range].rh-preview-slider { -webkit-appearance:none; height:3px !important; border:0 !important; border-radius:2px; background:#e2e8f0 !important; padding:0 !important; margin:7px 0 6px; cursor:pointer; }
.rh-preview-field input[type=range].rh-preview-slider::-webkit-slider-thumb { -webkit-appearance:none; width:14px; height:14px; border-radius:50%; background:var(--text); cursor:pointer; margin-top:-5.5px; box-shadow:0 1px 3px rgba(0,0,0,.2); }
.rh-preview-field input[type=range].rh-preview-slider::-webkit-slider-runnable-track { height:3px; border-radius:2px; background:#e2e8f0; }
.rh-preview-slider-val { color:var(--text); font-variant-numeric:tabular-nums; font-family:ui-monospace,Menlo,monospace; }
.rh-preview-label { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.rh-preview-slot { color:var(--faint); font-size:10px; font-weight:900; white-space:nowrap; }
.rh-preview-keep { min-height:34px; border:1px dashed var(--line); border-radius:9px; background:var(--soft); color:var(--muted); display:flex; align-items:center; justify-content:center; gap:7px; font-size:11px; font-weight:850; }
.rh-workflow-run-mode { display:flex; flex-direction:column; gap:6px; padding:10px; border:1px solid var(--line); border-radius:12px; background:var(--soft); }
.rh-workflow-run-mode label { display:flex; align-items:center; justify-content:space-between; gap:10px; color:var(--text); font-size:11px; font-weight:900; }
.rh-workflow-run-mode select { height:30px; border:1px solid var(--line); border-radius:8px; background:var(--panel); color:var(--text); padding:0 8px; font-size:11px; font-weight:800; }
.rh-workflow-run-mode small { color:var(--faint); font-size:10.5px; line-height:1.45; font-weight:650; }
.rh-preview-random-row { display:grid; grid-template-columns:minmax(0,1fr) 34px; gap:7px; align-items:center; }
.rh-preview-random-btn { width:34px; height:34px; border-radius:9px; border:1px solid var(--accent); background:var(--accent); color:var(--bg); display:flex; align-items:center; justify-content:center; box-shadow:0 6px 14px rgba(15,23,42,.18); }
.rh-preview-random-btn:not(.active) { border-color:var(--line); background:var(--panel); color:var(--muted); box-shadow:none; }
.rh-preview-random-btn:not(.active):hover { border-color:var(--text); color:var(--text); background:var(--soft); }
body.studio-theme-dark .rh-preview-random-btn { background:#f5f6f8; border-color:#f5f6f8; color:#0e1014; box-shadow:0 6px 16px rgba(0,0,0,.34); }
body.studio-theme-dark .rh-preview-random-btn:not(.active) { background:var(--soft); border-color:var(--line-strong); color:var(--muted); box-shadow:none; }
.rh-preview-random-row input:disabled { color:var(--muted); background:var(--soft); cursor:not-allowed; }
.rh-preview-media { width:100%; min-height:72px; border:1px dashed var(--line-strong); border-radius:10px; background:var(--panel); color:var(--muted); display:flex; align-items:center; justify-content:center; gap:8px; font-size:11.5px; font-weight:850; overflow:hidden; }
.rh-preview-media.has-media { padding:0; border-style:solid; }
.rh-preview-media img,
.rh-preview-media video { width:100%; max-height:160px; object-fit:contain; display:block; }
.rh-preview-media audio { width:100%; margin:8px; }
.rh-preview-audio { display:flex; align-items:center; gap:6px; padding:8px; }
.rh-preview-switch { width:38px; height:22px; border-radius:999px; border:1px solid var(--line-strong); background:var(--panel); padding:2px; }
.rh-preview-switch span { display:block; width:16px; height:16px; border-radius:999px; background:var(--faint); transition:transform .15s ease; }
.rh-preview-switch.on { background:var(--accent); }
.rh-preview-switch.on span { background:var(--bg); transform:translateX(16px); }
.rh-preview-empty { padding:16px 10px; border:1px dashed var(--line); border-radius:10px; color:var(--faint); text-align:center; font-size:11.5px; font-weight:750; }
.rh-preview-run { height:36px; border-radius:10px; background:var(--text); color:var(--bg); display:flex; align-items:center; justify-content:center; gap:8px; font-size:12px; font-weight:900; }
.rh-preview-run:disabled { opacity:.72; cursor:not-allowed; }
.rh-preview-status { padding:9px 10px; border:1px solid var(--line); border-radius:9px; background:var(--panel); color:var(--muted); font-size:11.5px; font-weight:800; line-height:1.4; }
.rh-preview-output-list { display:flex; flex-direction:column; gap:8px; }
.rh-preview-output-list img,
.rh-preview-output-list video { width:100%; max-height:240px; object-fit:contain; border:1px solid var(--line); border-radius:10px; background:var(--panel); }
.rh-preview-output-list audio { width:100%; }
.spin-icon { animation:rhSpin .8s linear infinite; }
@keyframes rhSpin { to { transform:rotate(360deg); } }
.rh-editor-node { border:1px solid var(--line); border-radius:13px; background:var(--soft); overflow:hidden; }
.rh-editor-node.is-focused { border-color:var(--text); box-shadow:0 0 0 1px var(--text); }
.rh-editor-node-head { width:100%; min-height:44px; padding:10px 12px; display:flex; align-items:center; justify-content:space-between; gap:10px; text-align:left; }
.rh-editor-node-head:hover { background:var(--panel); }
.rh-editor-node-head strong { display:block; color:var(--text); font-size:12.5px; font-weight:900; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rh-editor-node-head small { display:block; margin-top:2px; color:var(--faint); font-size:10.5px; font-weight:750; }
.rh-editor-node-head svg { transition:transform .15s ease; color:var(--faint); flex:0 0 auto; }
.rh-editor-node.expanded .rh-editor-node-head svg { transform:rotate(180deg); }
.rh-editor-node-body { display:none; padding:0 10px 10px; flex-direction:column; gap:8px; }
.rh-editor-node.expanded .rh-editor-node-body { display:flex; }
.rh-editor-field-row { display:grid; grid-template-columns:22px minmax(0,1fr); gap:8px; align-items:start; padding:9px; border:1px solid var(--line); border-radius:10px; background:var(--panel); }
.rh-editor-field-row.active { border-color:var(--text); }
.rh-editor-check { width:20px; height:20px; margin-top:1px; border:1.5px solid var(--line-strong); border-radius:6px; background:var(--panel); color:var(--bg); display:flex; align-items:center; justify-content:center; }
.rh-editor-check.checked { background:var(--accent); border-color:var(--accent); }
body.studio-theme-dark .rh-editor-check.checked { background:#f5f6f8; border-color:#f5f6f8; color:#0e1014; }
.rh-editor-field-main { min-width:0; }
.rh-editor-field-name { color:var(--text); font-size:12px; font-weight:900; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rh-editor-field-meta { margin-top:1px; color:var(--faint); font-size:10.5px; font-weight:750; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rh-editor-field-controls { display:grid; grid-template-columns:minmax(0,1fr) 96px; gap:6px; margin-top:8px; }
.rh-editor-field-controls input,
.rh-editor-field-controls select { width:100%; height:30px; border:1px solid var(--line); border-radius:8px; background:var(--soft); color:var(--text); outline:none; padding:0 8px; font-size:11.5px; font-weight:750; }
.rh-image-slot-row { display:grid; grid-template-columns:minmax(0,1fr) 82px; gap:6px; margin-top:8px; }
.rh-image-slot-row label { display:flex; align-items:center; gap:6px; min-width:0; border:1px solid var(--line); border-radius:8px; background:var(--soft); padding:0 8px; height:30px; }
.rh-image-slot-row label span { flex:0 0 auto; color:var(--faint); font-size:10px; font-weight:900; }
.rh-image-slot-row input { width:100%; min-width:0; border:0; background:transparent; color:var(--text); outline:none; font-size:11.5px; font-weight:850; }
.rh-editor-required { height:30px; border:1px solid var(--line); border-radius:8px; background:var(--soft); color:var(--muted); display:flex; align-items:center; justify-content:center; gap:6px; font-size:11px; font-weight:900; }
.rh-editor-required.active { background:#111827; color:#fff; border-color:#111827; }
.rh-editor-required .check-dot { width:7px; height:7px; border-radius:999px; background:currentColor; opacity:.45; }
.rh-editor-required.active .check-dot { opacity:1; }
.rh-editor-keep { width:100%; min-height:30px; margin-top:8px; border:1px solid var(--line); border-radius:8px; background:var(--soft); color:var(--muted); display:flex; align-items:center; justify-content:center; gap:7px; font-size:11px; font-weight:900; }
.rh-editor-keep.active { background:var(--panel); color:var(--text); border-style:dashed; }
.rh-editor-keep .check-dot { width:7px; height:7px; border-radius:999px; background:currentColor; opacity:.45; }
.rh-editor-keep.active .check-dot { opacity:1; }
.rh-editor-wide-controls { grid-template-columns:1fr; }
.rh-editor-wide-controls textarea { width:100%; min-height:58px; resize:vertical; border:1px solid var(--line); border-radius:8px; background:var(--soft); color:var(--text); outline:none; padding:7px 8px; font-size:11.5px; font-weight:750; line-height:1.35; }
.rh-editor-random-row { display:grid; grid-template-columns:auto repeat(3, minmax(0,1fr)); gap:6px; margin-top:8px; align-items:center; }
.rh-editor-random-row input { width:100%; height:30px; border:1px solid var(--line); border-radius:8px; background:var(--soft); color:var(--text); outline:none; padding:0 8px; font-size:11px; font-weight:750; }
.rh-editor-random { height:30px; border:1px solid var(--line); border-radius:8px; background:var(--soft); color:var(--muted); display:inline-flex; align-items:center; gap:6px; padding:0 9px; font-size:11px; font-weight:850; white-space:nowrap; transition:all .15s ease; }
.rh-editor-random:hover { border-color:var(--text); color:var(--text); }
.rh-editor-random.active { border-color:var(--accent); color:var(--bg); background:var(--accent); box-shadow:0 0 0 2px rgba(15,23,42,.12), 0 8px 18px rgba(15,23,42,.18); }
body.studio-theme-dark .rh-editor-random.active { background:#f5f6f8; border-color:#f5f6f8; color:#0e1014; box-shadow:0 0 0 2px rgba(245,246,248,.16), 0 8px 20px rgba(0,0,0,.36); }
.rh-node-popover { position:fixed; z-index:140; width:390px; max-height:min(620px, 76vh); overflow:hidden; border:1px solid var(--line-strong); border-radius:14px; background:var(--panel); box-shadow:0 24px 70px rgba(15,23,42,.24); display:flex; flex-direction:column; }
.rh-popover-head { min-height:48px; padding:10px 12px; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:10px; }
.rh-popover-head strong { display:block; color:var(--text); font-size:13px; font-weight:950; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rh-popover-head span { display:block; margin-top:2px; color:var(--faint); font-size:10.5px; font-weight:800; }
.rh-popover-head button { width:28px; height:28px; border:1px solid var(--line); border-radius:8px; color:var(--muted); display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.rh-popover-head button:hover { color:var(--text); border-color:var(--text); }
.rh-popover-body { padding:10px; overflow:auto; display:flex; flex-direction:column; gap:8px; }
.rh-app-field-wrap { cursor:default; padding:12px; overflow:auto; }
.rh-app-field-list { display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:10px; align-content:start; }
.rh-app-field-card { min-height:74px; border:1px solid var(--line); border-radius:12px; background:var(--panel); padding:10px; display:grid; grid-template-columns:22px minmax(0,1fr) 20px; align-items:start; gap:9px; cursor:pointer; }
.rh-app-field-card:hover,
.rh-app-field-card.active { border-color:var(--text); }
.rh-app-field-card strong { display:block; color:var(--text); font-size:12.5px; font-weight:950; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rh-app-field-card span { display:block; margin-top:3px; color:var(--faint); font-size:10.5px; font-weight:800; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rh-app-field-card > svg { color:var(--faint); margin-top:2px; }
.rh-editor-graph-wrap { width:100%; height:100%; min-height:520px; border:1px solid var(--line); border-radius:14px; background:var(--panel); overflow:hidden; position:relative; cursor:grab; }
.rh-editor-graph-wrap.is-panning { cursor:grabbing; }
.rh-editor-graph-svg { display:block; width:100%; height:100%; color:var(--muted); }
.rh-editor-graph-controls { position:absolute; top:12px; right:12px; display:flex; align-items:center; gap:6px; z-index:2; }
.rh-editor-graph-controls button,
.rh-editor-graph-controls span { height:30px; min-width:30px; padding:0 9px; border-radius:8px; border:1px solid var(--line); background:var(--panel); color:var(--muted); display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:850; box-shadow:0 2px 8px rgba(15,23,42,.08); }
.rh-editor-graph-controls button:hover { color:var(--text); border-color:var(--text); }
.rh-editor-edge { stroke:var(--line-strong); stroke-width:1.5; fill:none; opacity:.78; }
.rh-editor-gnode { cursor:pointer; }
.rh-editor-gnode rect { stroke:var(--line-strong); stroke-width:1; fill:var(--panel); }
.rh-editor-gnode.has-exposed rect { stroke-width:2.5; stroke:var(--text); }
.rh-editor-gnode.is-active rect { stroke-width:3; stroke:#0f172a; filter:drop-shadow(0 6px 10px rgba(15,23,42,.16)); }
body.studio-theme-dark .rh-editor-gnode.is-active rect { stroke:#f8fafc; }
.rh-editor-gtitle { fill:var(--text); font-size:11px; font-weight:900; pointer-events:none; }
.rh-editor-gsub { fill:var(--muted); font-size:9.5px; font-weight:750; pointer-events:none; }
.rh-editor-gbadge { fill:#b45309; font-size:9px; font-weight:950; pointer-events:none; }
.rh-editor-gnode.cat-prompt rect { fill:#fef9e7; stroke:#eab308; }
.rh-editor-gnode.cat-lora rect { fill:#fef3c7; stroke:#f59e0b; }
.rh-editor-gnode.cat-sampler rect { fill:#f5f3ff; stroke:#8b5cf6; }
.rh-editor-gnode.cat-image rect { fill:#ecfdf5; stroke:#10b981; }
.rh-editor-gnode.cat-video rect { fill:#fff7ed; stroke:#f97316; }
.rh-editor-gnode.cat-audio rect { fill:#eff6ff; stroke:#3b82f6; }
body.studio-theme-dark .rh-editor-gnode.cat-prompt rect { fill:#3a3315; stroke:#eab308; }
body.studio-theme-dark .rh-editor-gnode.cat-lora rect { fill:#3a2a10; stroke:#fbbf24; }
body.studio-theme-dark .rh-editor-gnode.cat-sampler rect { fill:#2a1e44; stroke:#a78bfa; }
body.studio-theme-dark .rh-editor-gnode.cat-image rect { fill:#0f3825; stroke:#34d399; }
body.studio-theme-dark .rh-editor-gnode.cat-video rect { fill:#3a2413; stroke:#fb923c; }
body.studio-theme-dark .rh-editor-gnode.cat-audio rect { fill:#1a2845; stroke:#60a5fa; }
.rh-editor-empty { padding:18px; border:1px dashed var(--line); border-radius:12px; color:var(--faint); text-align:center; font-size:12px; font-weight:750; }
.ms-hint a { color:var(--text); font-weight:800; text-decoration:underline; text-underline-offset:3px; }
/* MS 平台不需要协议选择 */
body.show-ms #probeAsyncBtn,
body.show-ms .advanced-endpoints,
body.show-ms .protocol-selector-wrap,
body.show-runninghub #testUrlBtn,
body.show-runninghub #verifyResult,
body.show-runninghub #modelsHead,
body.show-runninghub .model-grid,
body.show-runninghub #probeAsyncBtn,
body.show-runninghub .advanced-endpoints,
body.show-runninghub .protocol-selector-wrap,
body.show-volcengine-standalone #probeAsyncBtn,
body.show-volcengine-standalone .protocol-selector-wrap,
body.show-metaso-standalone #probeAsyncBtn,
body.show-metaso-standalone .protocol-selector-wrap,
body.show-jimeng #probeAsyncBtn,
body.show-jimeng .advanced-endpoints { display:none !important; }
.protocol-selector-wrap { height:36px; padding:0 4px; flex-shrink:0; background:var(--panel); }
body.studio-theme-dark .protocol-selector-wrap,
html.studio-theme-dark body .protocol-selector-wrap { background:var(--soft); border-color:var(--line-strong); }
.protocol-selector-wrap select { height:30px; min-width:116px; padding:0 26px 0 10px; border:0; border-radius:8px; background:transparent; color:var(--text); outline:none; font-size:12px; font-weight:800; white-space:nowrap; cursor:pointer; }
.protocol-selector-wrap select:hover { background:var(--soft); }
body.studio-theme-dark .protocol-selector-wrap select:hover,
html.studio-theme-dark body .protocol-selector-wrap select:hover { background:var(--panel); }
.ms-hint .ms-line { display:block; }
.ms-hint .inline-code { display:inline-flex; align-items:center; min-height:20px; padding:0 7px; border-radius:6px; background:var(--panel); color:var(--text); border:1px solid var(--line); font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:11px; font-weight:700; vertical-align:middle; }
.empty { padding:18px; border:1px dashed var(--line); border-radius:11px; color:var(--faint); text-align:center; font-size:11.5px; font-weight:700; }

/* API 设置页视觉精修：保留原有功能结构，降低工业感并增强层次 */
:root {
    --api-page-bg:#f6f8fb;
    --api-panel-bg:rgba(255,255,255,.86);
    --api-surface-bg:#ffffff;
    --api-soft-bg:#f4f7fb;
    --api-line:#e4eaf2;
    --api-line-strong:#d6deea;
    --api-shadow:0 18px 48px rgba(31,41,55,.08);
    --api-shadow-sm:0 8px 22px rgba(31,41,55,.06);
    --api-blue:#2563eb;
    --api-green:#0f9f6e;
}

body.studio-theme-dark,
html.studio-theme-dark body {
    --api-page-bg:#11151b;
    --api-panel-bg:rgba(24,29,38,.86);
    --api-surface-bg:#1c222c;
    --api-soft-bg:#151b24;
    --api-line:#2b3442;
    --api-line-strong:#3a4657;
    --api-shadow:0 22px 60px rgba(0,0,0,.36);
    --api-shadow-sm:0 10px 26px rgba(0,0,0,.26);
}

body {
    background:
        radial-gradient(circle at 12% -8%, rgba(37,99,235,.07), transparent 28%),
        radial-gradient(circle at 90% 8%, rgba(15,159,110,.06), transparent 24%),
        var(--api-page-bg);
}

.page {
    padding:clamp(20px,2vw,34px) clamp(18px,2.4vw,42px) 72px;
}

.wrap {
    max-width:1280px;
}

.page-head {
    align-items:flex-end;
    padding:0 2px clamp(18px,1.5vw,26px);
}

.page-head .title {
    font-size:17px;
    letter-spacing:-.02em;
}

.page-head .sub {
    max-width:760px;
    font-size:13px;
    line-height:1.65;
}

.page-head .status {
    min-height:28px;
    padding:7px 12px;
    border:1px solid transparent;
    border-radius:999px;
    background:rgba(255,255,255,.58);
    color:var(--muted);
    box-shadow:0 6px 18px rgba(31,41,55,.04);
}

body.studio-theme-dark .page-head .status,
html.studio-theme-dark body .page-head .status {
    background:rgba(255,255,255,.05);
}

.layout {
    grid-template-columns:minmax(250px,300px) minmax(0,1fr);
    gap:18px;
}

.sidebar,
.content-head,
.block,
.picker-modal,
.rh-workflow-editor-modal {
    border-color:var(--api-line);
    background:var(--api-panel-bg);
    box-shadow:var(--api-shadow-sm);
    backdrop-filter:blur(18px);
}

.sidebar {
    top:20px;
    max-height:calc(100vh - 40px);
    gap:14px;
    padding:14px;
    border-radius:8px;
}

.side-section-title {
    padding:3px 4px 1px;
    color:var(--muted);
    letter-spacing:.12em;
}

.provider-list {
    gap:7px;
    padding-bottom:12px;
    border-color:var(--api-line);
}

.provider-card {
    min-height:52px;
    padding:10px 11px;
    border-color:var(--api-line);
    background:rgba(255,255,255,.45);
    border-radius:8px;
    box-shadow:0 1px 0 rgba(255,255,255,.7) inset;
}

.provider-card:hover {
    border-color:var(--api-line-strong);
    background:var(--api-surface-bg);
    transform:translateY(-1px);
    box-shadow:var(--api-shadow-sm);
}

.provider-card.active {
    border-color:rgba(37,99,235,.38);
    background:linear-gradient(135deg, rgba(37,99,235,.11), rgba(15,159,110,.07)), var(--api-surface-bg);
    box-shadow:0 10px 24px rgba(37,99,235,.08);
}

body.studio-theme-dark .provider-card,
html.studio-theme-dark body .provider-card {
    background:rgba(255,255,255,.035);
    box-shadow:none;
}

body.studio-theme-dark .provider-card:hover,
html.studio-theme-dark body .provider-card:hover {
    background:rgba(255,255,255,.065);
}

.provider-mark {
    width:30px;
    height:30px;
    border-radius:8px;
    background:var(--api-soft-bg);
    color:var(--muted);
}

.provider-card.active .provider-mark {
    background:var(--api-surface-bg);
    color:var(--api-blue);
}

.provider-name {
    font-size:13px;
}

.provider-meta {
    margin-top:3px;
    font-size:10.5px;
}

.add-btn,
.api-link-btn {
    height:38px;
    border-radius:8px;
}

.api-link-btn {
    border-color:rgba(37,99,235,.22);
    background:rgba(37,99,235,.08);
    color:#1d4ed8;
    box-shadow:none;
}

.api-link-btn:hover {
    border-color:var(--api-blue);
    background:var(--api-blue);
    color:#fff;
    box-shadow:0 10px 22px rgba(37,99,235,.2);
}

.content {
    gap:14px;
}

.content-head {
    align-items:center;
    padding:18px 20px;
    border-radius:8px;
}

.content-head .editor-title {
    font-size:clamp(22px,1.7vw,28px);
}

.content-head .editor-sub {
    margin-top:6px;
    font-size:12.5px;
}

.block {
    gap:16px;
    padding:18px 20px;
    border-radius:8px;
}

.block-head {
    padding-bottom:12px;
    border-color:var(--api-line);
}

.block-title {
    font-size:13px;
    letter-spacing:.06em;
}

.block-desc {
    max-width:680px;
    font-size:12px;
}

.form {
    gap:14px;
}

.field {
    gap:8px;
}

.label {
    color:var(--muted);
    font-size:11.5px;
}

.field-frame,
.rh-paste-input,
.lora-field input,
.lora-field select,
.rh-card-main input,
.rh-card-main textarea,
.rh-editor-field input,
.rh-editor-field textarea,
.rh-preview-field input,
.rh-preview-field select {
    border-color:var(--api-line);
    border-radius:8px;
    background:var(--api-surface-bg);
}

.field-frame {
    min-height:44px;
    padding:5px;
    box-shadow:0 1px 0 rgba(255,255,255,.72) inset;
}

.field-frame:focus-within,
.rh-paste-input:focus,
.lora-field input:focus,
.lora-field select:focus {
    border-color:rgba(37,99,235,.65);
    box-shadow:0 0 0 3px rgba(37,99,235,.11);
}

.field-frame input,
.protocol-selector-wrap select,
.model-row input {
    font-size:13px;
}

body.studio-theme-dark .field-frame,
html.studio-theme-dark body .field-frame {
    background:var(--api-soft-bg);
    border-color:var(--api-line-strong);
    box-shadow:none;
}

.key-panel,
.advanced-endpoints,
.rh-key-item,
.rh-card-group,
.lora-row,
.recommend-note,
.picker-summary {
    border-color:var(--api-line);
    background:var(--api-soft-bg);
    border-radius:8px;
}

.rh-key-item,
.lora-row,
.rh-config-card {
    box-shadow:0 1px 0 rgba(255,255,255,.58) inset;
}

.key-btn,
.ghost-btn,
.action-btn,
.rh-card-action,
.rh-workflow-editor-close,
.picker-close {
    border-radius:8px;
}

.action-btn,
.ghost-btn {
    min-height:36px;
    border-color:var(--api-line);
    background:var(--api-surface-bg);
}

.action-btn:hover,
.ghost-btn:hover,
.key-btn:hover {
    border-color:var(--api-line-strong);
    background:var(--api-soft-bg);
    color:var(--text);
    transform:translateY(-1px);
}

.action-btn.primary-btn {
    color:#1d4ed8;
    border-color:rgba(37,99,235,.24);
    background:rgba(37,99,235,.08);
}

.action-btn.primary-btn:hover,
.action-btn.save-btn:hover {
    background:var(--api-blue);
    border-color:var(--api-blue);
    color:#fff;
    box-shadow:0 10px 22px rgba(37,99,235,.22);
}

.action-btn.save-btn {
    background:var(--text);
    color:var(--bg);
    border-color:var(--text);
}

.action-btn.save-btn.is-saved {
    background:var(--api-green);
    border-color:var(--api-green);
    box-shadow:0 10px 22px rgba(15,159,110,.2);
}

.models-toolbar {
    padding:16px 20px;
}

.model-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
}

.model-grid .block {
    min-width:0;
}

.model-grid .ms-lora-block {
    grid-column:1 / -1;
}

.model-row {
    min-height:44px;
    padding:5px;
    border-color:var(--api-line);
    border-radius:8px;
    background:var(--api-surface-bg);
}

.model-row:focus-within {
    border-color:rgba(37,99,235,.65);
    box-shadow:0 0 0 3px rgba(37,99,235,.1);
}

.icon-btn {
    border-radius:8px;
}

.recommend-card {
    border-color:var(--api-line);
    border-radius:8px;
    box-shadow:var(--api-shadow-sm);
}

.recommend-tag,
.recommend-badge,
.recommend-actions a,
.recommend-actions button,
.picker-tab,
.picker-cat-tab,
.picker-row,
.picker-checkbox,
.picker-type-btn {
    border-radius:8px;
}

.picker-overlay {
    background:rgba(15,23,42,.32);
    backdrop-filter:blur(14px);
}

.picker-modal {
    max-width:960px;
    border-radius:8px;
    box-shadow:var(--api-shadow);
}

.picker-head,
.picker-toolbar,
.picker-foot {
    border-color:var(--api-line);
}

.picker-row {
    border-color:var(--api-line);
    background:var(--api-surface-bg);
}

.picker-row:hover {
    border-color:var(--api-line-strong);
    box-shadow:var(--api-shadow-sm);
}

.picker-cat-tab.active,
.picker-type-btn.active,
.picker-checkbox.checked {
    border-color:var(--api-blue);
    background:rgba(37,99,235,.1);
    color:#1d4ed8;
}

.rh-card-columns {
    gap:12px;
}

.rh-config-card {
    border-color:var(--api-line);
    border-radius:8px;
    background:var(--api-surface-bg);
}

.rh-thumb,
.rh-card-main input,
.rh-card-main textarea,
.rh-card-action,
.rh-workflow-editor-modal,
.rh-workflow-editor-close,
.rh-editor-node,
.rh-app-field-card,
.rh-node-popover,
.rh-editor-graph-wrap {
    border-radius:8px;
}

body.studio-theme-dark .sidebar,
body.studio-theme-dark .content-head,
body.studio-theme-dark .block,
body.studio-theme-dark .picker-modal,
body.studio-theme-dark .rh-workflow-editor-modal,
html.studio-theme-dark body .sidebar,
html.studio-theme-dark body .content-head,
html.studio-theme-dark body .block,
html.studio-theme-dark body .picker-modal,
html.studio-theme-dark body .rh-workflow-editor-modal {
    border-color:var(--api-line);
    background:var(--api-panel-bg);
}

body.studio-theme-dark .api-link-btn,
html.studio-theme-dark body .api-link-btn {
    background:rgba(96,165,250,.14);
    border-color:rgba(96,165,250,.26);
    color:#bfdbfe;
    box-shadow:none;
}

body.studio-theme-dark .api-link-btn:hover,
html.studio-theme-dark body .api-link-btn:hover {
    background:#bfdbfe;
    border-color:#bfdbfe;
    color:#0f172a;
}

body.studio-theme-dark .action-btn.primary-btn,
html.studio-theme-dark body .action-btn.primary-btn {
    background:rgba(96,165,250,.13);
    border-color:rgba(96,165,250,.24);
    color:#bfdbfe;
}

body.studio-theme-dark .action-btn.primary-btn:hover,
html.studio-theme-dark body .action-btn.primary-btn:hover {
    background:#bfdbfe;
    border-color:#bfdbfe;
    color:#0f172a;
}

body.studio-theme-dark .model-row,
body.studio-theme-dark .rh-config-card,
html.studio-theme-dark body .model-row,
html.studio-theme-dark body .rh-config-card {
    background:var(--api-soft-bg);
    border-color:var(--api-line-strong);
}

/* 简约版：宽度对齐工作流设置，靠层级色区分内容，减少边框/颜色/阴影 */
:root {
    --api-page-bg:var(--bg);
    --api-panel-bg:var(--panel);
    --api-surface-bg:var(--panel);
    --api-soft-bg:var(--soft);
    --api-line:transparent;
    --api-line-strong:var(--line);
    --api-shadow:none;
    --api-shadow-sm:none;
    --api-blue:var(--text);
    --api-green:#16a34a;
}

body {
    background:var(--api-page-bg);
}

.page {
    padding:32px 24px 80px;
}

.wrap {
    max-width:1280px;
}

.page-head {
    padding:0 4px 28px;
}

.page-head .title {
    font-size:26px;
    letter-spacing:-.015em;
}

.page-head .sub {
    max-width:540px;
    font-size:12.5px;
}

.page-head .status {
    min-height:16px;
    padding:0;
    border:0;
    background:transparent;
    box-shadow:none;
}

.layout {
    grid-template-columns:300px minmax(0,1fr);
    gap:18px;
}

.sidebar,
.content-head,
.block,
.picker-modal {
    border-color:transparent;
    background:var(--api-panel-bg);
    box-shadow:none;
    backdrop-filter:none;
}

.sidebar {
    top:24px;
    max-height:calc(100vh - 80px);
    padding:14px;
    border-radius:14px;
}

.provider-list {
    gap:4px;
    border-color:var(--line);
}

.provider-card {
    min-height:48px;
    padding:8px 10px;
    border-color:transparent;
    background:transparent;
    border-radius:10px;
    box-shadow:none;
}

.provider-card:hover {
    border-color:transparent;
    background:var(--api-soft-bg);
    transform:none;
    box-shadow:none;
}

.provider-card.active {
    border-color:transparent;
    background:var(--api-soft-bg);
    box-shadow:none;
}

.provider-card.active .provider-mark,
.provider-mark {
    background:var(--api-panel-bg);
    color:var(--text);
}

.api-link-btn {
    border-color:transparent;
    background:var(--api-soft-bg);
    color:var(--text);
}

.api-link-btn:hover,
body.studio-theme-dark .api-link-btn:hover,
html.studio-theme-dark body .api-link-btn:hover {
    border-color:transparent;
    background:var(--text);
    color:var(--bg);
    transform:none;
    box-shadow:none;
}

.content {
    gap:18px;
}

.content-head,
.block {
    border-radius:16px;
}

.content-head {
    align-items:end;
    padding:20px 24px;
}

.content-head .editor-title {
    font-size:20px;
}

.content-head .editor-sub {
    margin-top:4px;
    font-size:11.5px;
}

.block {
    padding:22px 24px;
    background:var(--api-panel-bg);
}

.block-head {
    border-color:var(--line);
}

.block-title {
    font-size:12px;
    letter-spacing:.08em;
}

.block-desc {
    max-width:520px;
    font-size:11.5px;
}

.key-panel,
.advanced-endpoints,
.rh-key-item,
.rh-card-group,
.lora-row,
.recommend-note,
.picker-summary,
.model-row,
.rh-config-card {
    border-color:transparent;
    background:var(--api-soft-bg);
    box-shadow:none;
}

.field-frame,
.rh-paste-input,
.lora-field input,
.lora-field select,
.rh-card-main input,
.rh-card-main textarea,
.rh-editor-field input,
.rh-editor-field textarea,
.rh-preview-field input,
.rh-preview-field select {
    border-color:transparent;
    background:var(--api-soft-bg);
    box-shadow:none;
}

.field-frame:focus-within,
.rh-paste-input:focus,
.lora-field input:focus,
.lora-field select:focus,
.model-row:focus-within {
    border-color:var(--line-strong);
    box-shadow:none;
}

.action-btn,
.ghost-btn,
.key-btn,
.rh-card-action,
.rh-workflow-editor-close,
.picker-close,
.add-btn {
    border-color:transparent;
    background:var(--api-soft-bg);
}

.action-btn:hover,
.ghost-btn:hover,
.key-btn:hover,
.rh-card-action:hover,
.rh-workflow-editor-close:hover,
.add-btn:hover {
    border-color:transparent;
    background:var(--line);
    transform:none;
    box-shadow:none;
}

.action-btn.primary-btn,
body.studio-theme-dark .action-btn.primary-btn,
html.studio-theme-dark body .action-btn.primary-btn {
    border-color:transparent;
    background:var(--api-soft-bg);
    color:var(--text);
}

.action-btn.primary-btn:hover,
body.studio-theme-dark .action-btn.primary-btn:hover,
html.studio-theme-dark body .action-btn.primary-btn:hover {
    border-color:transparent;
    background:var(--text);
    color:var(--bg);
    box-shadow:none;
}

.action-btn.save-btn,
body.studio-theme-dark .api-page-save-btn,
html.studio-theme-dark body .api-page-save-btn,
body.theme-dark .api-page-save-btn {
    background:var(--accent) !important;
    color:var(--bg) !important;
    border-color:transparent !important;
    box-shadow:none !important;
}

.action-btn.save-btn:hover,
body.studio-theme-dark .api-page-save-btn:hover,
html.studio-theme-dark body .api-page-save-btn:hover,
body.theme-dark .api-page-save-btn:hover {
    background:var(--accent) !important;
    color:var(--bg) !important;
    border-color:transparent !important;
    transform:none;
    box-shadow:none !important;
}

.action-btn.danger-btn,
body.studio-theme-dark .api-page-delete-btn,
html.studio-theme-dark body .api-page-delete-btn,
body.theme-dark .api-page-delete-btn {
    background:transparent !important;
    border-color:transparent !important;
    color:#dc2626 !important;
}

.action-btn.danger-btn:hover,
body.studio-theme-dark .api-page-delete-btn:hover,
html.studio-theme-dark body .api-page-delete-btn:hover,
body.theme-dark .api-page-delete-btn:hover {
    background:rgba(220,38,38,.08) !important;
    border-color:transparent !important;
    color:#dc2626 !important;
    transform:none;
    box-shadow:none !important;
}

.model-grid {
    grid-template-columns:1fr;
    gap:18px;
}

.model-grid .ms-lora-block {
    grid-column:auto;
}

.picker-overlay {
    background:rgba(15,23,42,.28);
    backdrop-filter:blur(10px);
}

.picker-modal {
    max-width:780px;
    border-color:transparent;
    border-radius:16px;
    box-shadow:none;
}

.rh-workflow-editor-modal,
body.studio-theme-dark .rh-workflow-editor-modal,
html.studio-theme-dark body .rh-workflow-editor-modal {
    border-color:var(--line-strong);
    background:var(--panel);
    box-shadow:0 24px 60px rgba(15,23,42,.18);
}

body.studio-theme-dark .rh-workflow-editor-modal,
html.studio-theme-dark body .rh-workflow-editor-modal {
    box-shadow:0 24px 70px rgba(0,0,0,.42);
}

.picker-row,
.recommend-card {
    border-color:transparent;
    background:var(--api-soft-bg);
    box-shadow:none;
}

.picker-row:hover,
.recommend-card:hover {
    border-color:transparent;
    box-shadow:none;
}

.picker-cat-tab.active,
.picker-type-btn.active,
.picker-checkbox.checked {
    border-color:transparent;
    background:var(--text);
    color:var(--bg);
}

body.studio-theme-dark .provider-card,
html.studio-theme-dark body .provider-card,
body.studio-theme-dark .provider-card:hover,
html.studio-theme-dark body .provider-card:hover,
body.studio-theme-dark .model-row,
body.studio-theme-dark .rh-config-card,
html.studio-theme-dark body .model-row,
html.studio-theme-dark body .rh-config-card {
    background:var(--api-soft-bg);
    border-color:transparent;
}

body.studio-theme-dark .provider-card:not(.active),
html.studio-theme-dark body .provider-card:not(.active) {
    background:transparent;
}

/* 平台列表细节：统一品牌/普通平台布局，暗色下用层级而不是高饱和颜色 */
.side-section-title {
    color:var(--faint);
}

.provider-list {
    gap:5px;
}

.provider-card {
    position:relative;
    display:grid;
    grid-template-columns:30px minmax(0,1fr) auto;
    align-items:center;
    gap:10px;
    min-height:50px;
    padding:8px 10px;
}

.provider-card::before {
    content:"";
    position:absolute;
    left:0;
    top:10px;
    bottom:10px;
    width:2px;
    border-radius:999px;
    background:transparent;
}

.provider-card.active::before {
    background:var(--text);
}

.provider-info {
    min-width:0;
}

.provider-name {
    color:var(--text);
    font-size:12.5px;
    line-height:1.25;
    font-weight:850;
}

.provider-meta {
    max-width:100%;
    margin-top:3px;
    color:var(--faint);
    font-size:10.5px;
    line-height:1.35;
}

.provider-mark {
    width:30px;
    height:30px;
    border-radius:9px;
    background:var(--api-soft-bg);
    color:var(--muted);
}

.provider-card.active .provider-mark {
    background:var(--api-panel-bg);
    color:var(--text);
}

.provider-side-meta {
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    justify-content:center;
    gap:6px;
    min-width:44px;
}

.provider-status-dot {
    width:6px;
    height:6px;
    border-radius:999px;
    background:var(--faint);
    opacity:.72;
}

.provider-card.has-key .provider-status-dot {
    background:#16a34a;
}

.provider-card.missing-key .provider-status-dot {
    background:var(--faint);
}

.provider-card.is-disabled {
    opacity:.48;
}

.provider-protocol-pill {
    min-width:34px;
    max-width:66px;
    height:18px;
    padding:0 6px;
    border-radius:999px;
    background:var(--api-soft-bg);
    color:var(--muted);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:9px;
    line-height:1;
    font-weight:900;
    letter-spacing:.04em;
    text-transform:uppercase;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.provider-card.active .provider-protocol-pill {
    background:var(--api-panel-bg);
    color:var(--text);
}

.provider-card.provider-card-banner {
    grid-template-columns:1fr;
    min-height:50px;
    padding:8px 10px;
    justify-content:stretch;
}

.provider-banner-inner {
    min-width:0;
    width:100%;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:10px;
}

.provider-logo-wrap {
    min-width:0;
    display:flex;
    align-items:center;
    gap:8px;
}

.provider-card-banner img {
    max-width:142px;
}

.provider-card-banner .runninghub-icon {
    max-width:134px;
}

.provider-logo-fallback {
    display:none;
    min-width:0;
    color:var(--text);
    font-size:12.5px;
    font-weight:850;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.provider-logo-wrap:not(:has(img)) .provider-logo-fallback,
.provider-banner-label {
    display:block;
    min-width:0;
    color:var(--text);
    font-size:12px;
    font-weight:850;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    text-align:center;
    width:100%;
    line-height:1.25;
}

.provider-logo-wrap img[src=""],
.provider-logo-wrap img:not([src]) {
    display:none;
}

body.studio-theme-dark .sidebar,
html.studio-theme-dark body .sidebar {
    background:#171b23;
}

body.studio-theme-dark .provider-list,
html.studio-theme-dark body .provider-list {
    border-color:rgba(255,255,255,.06);
}

body.studio-theme-dark .provider-card,
html.studio-theme-dark body .provider-card {
    color:var(--muted);
}

body.studio-theme-dark .provider-card:not(.active),
html.studio-theme-dark body .provider-card:not(.active) {
    background:transparent;
}

body.studio-theme-dark .provider-card:not(.active):hover,
html.studio-theme-dark body .provider-card:not(.active):hover {
    background:rgba(255,255,255,.035);
}

body.studio-theme-dark .provider-card.active,
html.studio-theme-dark body .provider-card.active {
    background:rgba(255,255,255,.07);
}

body.studio-theme-dark .provider-card.active::before,
html.studio-theme-dark body .provider-card.active::before {
    background:#e8e8ea;
}

body.studio-theme-dark .provider-mark,
html.studio-theme-dark body .provider-mark,
body.studio-theme-dark .provider-protocol-pill,
html.studio-theme-dark body .provider-protocol-pill {
    background:rgba(255,255,255,.055);
    color:#8f9aab;
}

body.studio-theme-dark .provider-card.active .provider-mark,
html.studio-theme-dark body .provider-card.active .provider-mark,
body.studio-theme-dark .provider-card.active .provider-protocol-pill,
html.studio-theme-dark body .provider-card.active .provider-protocol-pill {
    background:rgba(255,255,255,.1);
    color:#e8e8ea;
}

body.studio-theme-dark .provider-card.has-key .provider-status-dot,
html.studio-theme-dark body .provider-card.has-key .provider-status-dot {
    background:#4ade80;
}

body.studio-theme-dark .add-btn,
body.studio-theme-dark .api-link-btn,
html.studio-theme-dark body .add-btn,
html.studio-theme-dark body .api-link-btn {
    background:rgba(255,255,255,.045);
    color:#a4adbf;
}

body.studio-theme-dark .add-btn:hover,
body.studio-theme-dark .api-link-btn:hover,
html.studio-theme-dark body .add-btn:hover,
html.studio-theme-dark body .api-link-btn:hover {
    background:rgba(255,255,255,.09);
    color:#e8e8ea;
}

/* 左侧操作区和推荐 API 弹窗再整理 */
.sidebar {
    gap:12px;
}

.side-section-title {
    padding:2px 6px 0;
}

.provider-list {
    margin-bottom:2px;
    padding-bottom:10px;
}

.provider-card.provider-card-banner {
    min-height:54px;
    padding:9px 12px;
}

.provider-banner-inner {
    grid-template-columns:1fr;
    justify-items:center;
    gap:6px;
}

.provider-logo-wrap {
    width:100%;
    justify-content:center;
}

.provider-card-banner img {
    max-width:150px;
}

.provider-card-banner .runninghub-icon {
    max-width:140px;
}

.provider-card-banner .provider-protocol-pill {
    height:17px;
    min-width:42px;
    opacity:.78;
}

.add-btn,
.api-link-btn {
    position:relative;
    height:42px;
    border-radius:10px;
    font-size:12px;
    font-weight:900;
}

.add-btn {
    margin-top:4px;
    border:1px dashed var(--line-strong);
    background:var(--panel);
    color:var(--text);
}

.api-link-btn {
    border:0;
    background:var(--text);
    color:var(--bg);
}

.add-btn:hover {
    background:var(--soft);
    border-color:var(--muted);
}

.api-link-btn:hover {
    background:var(--text);
    color:var(--bg);
    filter:brightness(.94);
}

.api-link-btn svg,
.add-btn svg {
    opacity:.9;
}

.recommend-api-body {
    grid-template-columns:1fr;
    gap:10px;
    padding:16px 18px 8px;
}

.recommend-card {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
        "name actions"
        "tags actions"
        "endpoint actions";
    align-items:center;
    gap:8px 14px;
    padding:14px;
    border-radius:12px;
    background:var(--soft);
}

.recommend-name {
    grid-area:name;
    justify-content:flex-start;
    gap:8px;
    font-size:15px;
    line-height:1.2;
}

.recommend-badge {
    height:20px;
    border:0;
    background:var(--panel);
    font-size:9.5px;
}

.recommend-tags {
    grid-area:tags;
    gap:5px;
}

.recommend-tag {
    height:22px;
    border:0;
    background:var(--panel);
    color:var(--muted);
}

.recommend-endpoint {
    grid-area:endpoint;
    min-width:0;
    color:var(--faint);
    font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
    font-size:11px;
    font-weight:750;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.recommend-actions {
    grid-area:actions;
    width:128px;
    grid-template-columns:1fr;
    gap:6px;
    padding-top:0;
}

.recommend-actions a,
.recommend-actions button {
    height:32px;
    border:0;
    border-radius:9px;
}

.recommend-register {
    background:var(--panel);
    color:var(--text);
}

.recommend-fill {
    background:var(--text);
    color:var(--bg);
}

.recommend-note {
    margin:6px 18px 16px;
    border:0;
    background:var(--soft);
    border-radius:10px;
}

body.studio-theme-dark .add-btn,
html.studio-theme-dark body .add-btn {
    border-color:rgba(255,255,255,.14);
    background:rgba(255,255,255,.045);
    color:#e8e8ea;
}

body.studio-theme-dark .api-link-btn,
html.studio-theme-dark body .api-link-btn {
    background:#e8e8ea;
    color:#11151b;
}

body.studio-theme-dark .api-link-btn:hover,
html.studio-theme-dark body .api-link-btn:hover {
    background:#ffffff;
    color:#0e1014;
}

body.studio-theme-dark .recommend-card,
html.studio-theme-dark body .recommend-card,
body.studio-theme-dark .recommend-note,
html.studio-theme-dark body .recommend-note {
    background:rgba(255,255,255,.055);
}

body.studio-theme-dark .recommend-badge,
body.studio-theme-dark .recommend-tag,
body.studio-theme-dark .recommend-register,
html.studio-theme-dark body .recommend-badge,
html.studio-theme-dark body .recommend-tag,
html.studio-theme-dark body .recommend-register {
    background:rgba(255,255,255,.07);
    color:#cbd5e1;
}

body.studio-theme-dark .recommend-fill,
html.studio-theme-dark body .recommend-fill {
    background:#e8e8ea;
    color:#11151b;
}

/* 平台列表最终间距与推荐 API 卡片化 */
.provider-list {
    gap:0;
    padding:2px 0 12px;
}

.provider-card {
    min-height:52px;
    padding:9px 10px;
    border-radius:10px;
    border-color:transparent !important;
}

.provider-card::before {
    display:none;
}

.provider-card + .provider-card {
    border-top:1px solid rgba(148,163,184,.16);
}

.provider-card:hover,
.provider-card.active {
    background:var(--soft);
}

.provider-card.provider-card-banner {
    min-height:52px;
    padding:9px 10px;
    border-color:transparent !important;
    box-shadow:none !important;
}

.provider-card.provider-card-banner + .provider-card.provider-card-banner,
.provider-card.provider-card-banner + .provider-card,
.provider-card + .provider-card.provider-card-banner {
    border-top:1px solid rgba(148,163,184,.16);
}

.provider-banner-inner {
    justify-items:center;
    text-align:center;
    gap:4px;
}

.provider-logo-wrap {
    justify-content:center;
}

.provider-card-banner img {
    max-width:138px;
    margin:0 auto;
}

.provider-card-banner .runninghub-icon {
    max-width:130px;
}

.provider-card-banner .provider-protocol-pill {
    margin:0 auto;
    height:16px;
}

.provider-name {
    font-size:13px;
}

.provider-meta {
    margin-top:4px;
}

body.studio-theme-dark .provider-card + .provider-card,
html.studio-theme-dark body .provider-card + .provider-card {
    border-top-color:rgba(255,255,255,.07);
}

body.studio-theme-dark .provider-card:hover,
html.studio-theme-dark body .provider-card:hover,
body.studio-theme-dark .provider-card.active,
html.studio-theme-dark body .provider-card.active {
    background:rgba(255,255,255,.065);
}

body.studio-theme-dark .provider-card.provider-card-banner,
html.studio-theme-dark body .provider-card.provider-card-banner,
body.studio-theme-dark .provider-card.provider-card-banner.active,
html.studio-theme-dark body .provider-card.provider-card-banner.active {
    border-color:transparent !important;
    box-shadow:none !important;
}

.picker-modal:has(.recommend-api-body) {
    max-width:820px;
}

.recommend-api-body {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
    padding:18px 20px 10px;
}

.recommend-card {
    display:flex;
    min-height:210px;
    padding:16px;
    border-radius:14px;
    background:var(--panel);
    border:1px solid var(--line);
    gap:12px;
}

.recommend-name {
    justify-content:space-between;
    font-size:17px;
}

.recommend-badge {
    background:var(--soft);
}

.recommend-tags {
    gap:6px;
}

.recommend-tag {
    background:var(--soft);
    color:var(--text);
}

.recommend-endpoint {
    min-height:32px;
    padding:8px 10px;
    border-radius:9px;
    background:var(--soft);
    color:var(--muted);
    display:flex;
    align-items:center;
}

.recommend-actions {
    width:100%;
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
    margin-top:auto;
}

.recommend-actions a,
.recommend-actions button {
    height:38px;
    justify-content:flex-start;
    padding:0 12px;
    font-size:12px;
}

.recommend-register {
    background:var(--soft);
    color:var(--text);
}

.recommend-fill {
    background:var(--text);
    color:var(--bg);
}

.recommend-step {
    width:18px;
    height:18px;
    border-radius:999px;
    background:var(--text);
    color:var(--bg);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:10px;
    font-weight:950;
}

.recommend-fill .recommend-step {
    background:var(--bg);
    color:var(--text);
}

body.studio-theme-dark .recommend-card,
html.studio-theme-dark body .recommend-card {
    background:#1c1e26;
    border-color:rgba(255,255,255,.08);
}

body.studio-theme-dark .recommend-endpoint,
body.studio-theme-dark .recommend-badge,
body.studio-theme-dark .recommend-tag,
body.studio-theme-dark .recommend-register,
html.studio-theme-dark body .recommend-endpoint,
html.studio-theme-dark body .recommend-badge,
html.studio-theme-dark body .recommend-tag,
html.studio-theme-dark body .recommend-register {
    background:rgba(255,255,255,.06);
}

body.studio-theme-dark .recommend-step,
html.studio-theme-dark body .recommend-step {
    background:#e8e8ea;
    color:#11151b;
}

body.studio-theme-dark .recommend-fill .recommend-step,
html.studio-theme-dark body .recommend-fill .recommend-step {
    background:#11151b;
    color:#e8e8ea;
}

/* 推荐 API 操作按钮：左右并排、同主色、hover 更明确 */
.recommend-endpoint,
.recommend-step {
    display:none !important;
}

.recommend-card {
    min-height:178px;
}

.recommend-actions {
    grid-template-columns:1fr 1fr;
    gap:8px;
}

.recommend-actions a,
.recommend-actions button,
.recommend-register,
.recommend-fill {
    height:38px;
    justify-content:center;
    border:0;
    border-radius:10px;
    background:var(--text);
    color:var(--bg);
    transition:background-color .16s ease, color .16s ease, transform .16s ease, filter .16s ease;
}

.recommend-actions a:hover,
.recommend-actions button:hover,
.recommend-register:hover,
.recommend-fill:hover {
    background:var(--muted);
    color:var(--bg);
    transform:translateY(-1px);
    filter:none;
}

.recommend-actions a:active,
.recommend-actions button:active {
    transform:translateY(0);
    filter:brightness(.9);
}

body.studio-theme-dark .recommend-register,
body.studio-theme-dark .recommend-fill,
html.studio-theme-dark body .recommend-register,
html.studio-theme-dark body .recommend-fill {
    background:#e8e8ea;
    color:#11151b;
}

body.studio-theme-dark .recommend-actions a:hover,
body.studio-theme-dark .recommend-actions button:hover,
html.studio-theme-dark body .recommend-actions a:hover,
html.studio-theme-dark body .recommend-actions button:hover {
    background:#ffffff;
    color:#05070b;
}

/* 推荐 API 卡片留白和层级 */
.recommend-badge {
    display:none !important;
}

.recommend-api-body {
    gap:16px;
    padding:22px 24px 12px;
}

.recommend-card {
    min-height:210px;
    padding:20px;
    gap:16px;
    background:var(--panel);
    border:1px solid var(--line);
}

.recommend-name {
    font-size:18px;
    padding-bottom:2px;
}

.recommend-tags {
    gap:8px;
    min-height:28px;
}

.recommend-tag {
    height:26px;
    padding:0 10px;
}

.recommend-actions {
    margin-top:auto;
    padding-top:14px;
    border-top:1px solid var(--line);
}

.recommend-note {
    margin:10px 24px 20px;
}

body.studio-theme-dark .picker-modal,
html.studio-theme-dark body .picker-modal {
    background:#171b23;
}

body.studio-theme-dark .recommend-card,
html.studio-theme-dark body .recommend-card {
    background:#202632;
    border-color:rgba(255,255,255,.075);
}

body.studio-theme-dark .recommend-tag,
html.studio-theme-dark body .recommend-tag {
    background:rgba(255,255,255,.07);
}

/* 推荐 API 精修：小卡片、层级色、非纯黑白按钮 */
.picker-modal:has(.recommend-api-body) {
    max-width:760px;
    background:var(--soft);
}

.recommend-api-body {
    gap:12px;
    padding:18px 18px 8px;
}

.recommend-card {
    min-height:168px;
    padding:16px;
    gap:12px;
    border:1px solid var(--line);
    background:var(--panel);
    border-radius:13px;
}

.recommend-card:hover {
    border-color:var(--line-strong);
}

.recommend-name {
    font-size:16px;
    line-height:1.2;
    padding:0;
}

.recommend-tags {
    gap:6px;
    min-height:24px;
}

.recommend-tag {
    height:23px;
    padding:0 8px;
    border:0;
    background:var(--soft);
    color:var(--muted);
    font-size:10.5px;
}

.recommend-actions {
    padding-top:10px;
    border-top:1px solid var(--line);
    gap:8px;
}

.recommend-actions a,
.recommend-actions button,
.recommend-register,
.recommend-fill {
    height:36px;
    border-radius:9px;
    background:#334155;
    color:#f8fafc;
}

.recommend-actions a:hover,
.recommend-actions button:hover,
.recommend-register:hover,
.recommend-fill:hover {
    background:#475569;
    color:#fff;
    transform:translateY(-1px);
}

.recommend-note {
    margin:8px 18px 16px;
    background:var(--panel);
}

body.studio-theme-dark .picker-modal:has(.recommend-api-body),
html.studio-theme-dark body .picker-modal:has(.recommend-api-body) {
    background:#171b23;
}

body.studio-theme-dark .recommend-card,
html.studio-theme-dark body .recommend-card {
    background:#1c222c;
    border-color:rgba(255,255,255,.065);
}

body.studio-theme-dark .recommend-card:hover,
html.studio-theme-dark body .recommend-card:hover {
    border-color:rgba(255,255,255,.13);
}

body.studio-theme-dark .recommend-tag,
html.studio-theme-dark body .recommend-tag {
    background:rgba(255,255,255,.055);
    color:#a4adbf;
}

body.studio-theme-dark .recommend-actions,
html.studio-theme-dark body .recommend-actions {
    border-top-color:rgba(255,255,255,.075);
}

body.studio-theme-dark .recommend-register,
body.studio-theme-dark .recommend-fill,
html.studio-theme-dark body .recommend-register,
html.studio-theme-dark body .recommend-fill {
    background:#cbd5e1;
    color:#111827;
}

body.studio-theme-dark .recommend-actions a:hover,
body.studio-theme-dark .recommend-actions button:hover,
html.studio-theme-dark body .recommend-actions a:hover,
html.studio-theme-dark body .recommend-actions button:hover {
    background:#e2e8f0;
    color:#0f172a;
}

body.studio-theme-dark .recommend-note,
html.studio-theme-dark body .recommend-note {
    background:#1c222c;
}

/* API 设置整体易读性统一：层级灰、少颜色、平台列表更克制 */
.provider-status-dot,
.provider-card-banner .provider-protocol-pill {
    display:none !important;
}

.provider-side-meta {
    min-width:38px;
}

:root {
    --api-readable-bg:#f5f7fa;
    --api-readable-panel:#ffffff;
    --api-readable-soft:#eef2f6;
    --api-readable-field:#f6f8fb;
    --api-readable-line:#e1e7ef;
    --api-readable-button:#334155;
    --api-readable-button-hover:#475569;
}

body.studio-theme-dark,
html.studio-theme-dark body {
    --api-readable-bg:#11151b;
    --api-readable-panel:#1c222c;
    --api-readable-soft:#171b23;
    --api-readable-field:#202632;
    --api-readable-line:rgba(255,255,255,.075);
    --api-readable-button:#cbd5e1;
    --api-readable-button-hover:#e2e8f0;
}

body {
    background:var(--api-readable-bg);
}

.sidebar,
.content-head,
.block,
.picker-modal {
    background:var(--api-readable-panel);
}

.key-panel,
.advanced-endpoints,
.rh-key-item,
.rh-card-group,
.lora-row,
.recommend-note,
.picker-summary,
.model-row,
.rh-config-card,
.provider-card:hover,
.provider-card.active {
    background:var(--api-readable-soft);
}

.field-frame,
.rh-paste-input,
.lora-field input,
.lora-field select,
.rh-card-main input,
.rh-card-main textarea,
.rh-editor-field input,
.rh-editor-field textarea,
.rh-preview-field input,
.rh-preview-field select {
    background:var(--api-readable-field);
}

.block-head,
.provider-card + .provider-card,
.recommend-actions,
.picker-head,
.picker-toolbar,
.picker-foot {
    border-color:var(--api-readable-line);
}

.action-btn.primary-btn,
.api-link-btn,
.action-btn.save-btn,
.recommend-register,
.recommend-fill {
    background:var(--api-readable-button) !important;
    color:#f8fafc !important;
}

.action-btn.primary-btn:hover,
.api-link-btn:hover,
.action-btn.save-btn:hover,
.recommend-register:hover,
.recommend-fill:hover {
    background:var(--api-readable-button-hover) !important;
    color:#fff !important;
}

body.studio-theme-dark .action-btn.primary-btn,
body.studio-theme-dark .api-link-btn,
body.studio-theme-dark .action-btn.save-btn,
body.studio-theme-dark .recommend-register,
body.studio-theme-dark .recommend-fill,
html.studio-theme-dark body .action-btn.primary-btn,
html.studio-theme-dark body .api-link-btn,
html.studio-theme-dark body .action-btn.save-btn,
html.studio-theme-dark body .recommend-register,
html.studio-theme-dark body .recommend-fill {
    color:#111827 !important;
}

body.studio-theme-dark .action-btn.primary-btn:hover,
body.studio-theme-dark .api-link-btn:hover,
body.studio-theme-dark .action-btn.save-btn:hover,
body.studio-theme-dark .recommend-register:hover,
body.studio-theme-dark .recommend-fill:hover,
html.studio-theme-dark body .action-btn.primary-btn:hover,
html.studio-theme-dark body .api-link-btn:hover,
html.studio-theme-dark body .action-btn.save-btn:hover,
html.studio-theme-dark body .recommend-register:hover,
html.studio-theme-dark body .recommend-fill:hover {
    color:#0f172a !important;
}

body.studio-theme-dark .sidebar,
body.studio-theme-dark .content-head,
body.studio-theme-dark .block,
body.studio-theme-dark .picker-modal,
html.studio-theme-dark body .sidebar,
html.studio-theme-dark body .content-head,
html.studio-theme-dark body .block,
html.studio-theme-dark body .picker-modal {
    background:var(--api-readable-panel);
}

body.studio-theme-dark .provider-card:hover,
body.studio-theme-dark .provider-card.active,
html.studio-theme-dark body .provider-card:hover,
html.studio-theme-dark body .provider-card.active {
    background:rgba(255,255,255,.055);
}

/* 黑夜模式统一收口：按钮、平台列表和右侧面板共用同一套深灰层级 */
body.studio-theme-dark,
html.studio-theme-dark body {
    --api-dark-page:#11151b;
    --api-dark-panel:#1c222c;
    --api-dark-soft:#171b23;
    --api-dark-raised:#202632;
    --api-dark-hover:#2a3342;
    --api-dark-line:rgba(255,255,255,.075);
    --api-dark-line-strong:rgba(255,255,255,.14);
    --api-dark-text:#e8edf5;
    --api-dark-muted:#a7b0c0;
    --api-dark-faint:#7f8a9b;
    --api-dark-primary:#cbd5e1;
    --api-dark-primary-hover:#e2e8f0;
    background:var(--api-dark-page);
    color:var(--api-dark-text);
}

body.studio-theme-dark .sidebar,
body.studio-theme-dark .content-head,
body.studio-theme-dark .block,
body.studio-theme-dark .picker-modal,
html.studio-theme-dark body .sidebar,
html.studio-theme-dark body .content-head,
html.studio-theme-dark body .block,
html.studio-theme-dark body .picker-modal {
    background:var(--api-dark-panel) !important;
    color:var(--api-dark-text);
}

body.studio-theme-dark .page-head .sub,
body.studio-theme-dark .page-head .status,
body.studio-theme-dark .editor-sub,
body.studio-theme-dark .block-desc,
body.studio-theme-dark .label,
body.studio-theme-dark .hint,
html.studio-theme-dark body .page-head .sub,
html.studio-theme-dark body .page-head .status,
html.studio-theme-dark body .editor-sub,
html.studio-theme-dark body .block-desc,
html.studio-theme-dark body .label,
html.studio-theme-dark body .hint {
    color:var(--api-dark-muted);
}

body.studio-theme-dark .side-section-title,
body.studio-theme-dark .provider-meta,
html.studio-theme-dark body .side-section-title,
html.studio-theme-dark body .provider-meta {
    color:var(--api-dark-faint);
}

body.studio-theme-dark .provider-card,
html.studio-theme-dark body .provider-card {
    color:var(--api-dark-muted);
    border-color:transparent !important;
}

body.studio-theme-dark .provider-card + .provider-card,
html.studio-theme-dark body .provider-card + .provider-card {
    border-top-color:var(--api-dark-line) !important;
}

body.studio-theme-dark .provider-card:not(.active),
html.studio-theme-dark body .provider-card:not(.active) {
    background:transparent !important;
}

body.studio-theme-dark .provider-card:hover,
html.studio-theme-dark body .provider-card:hover {
    background:var(--api-dark-raised) !important;
}

body.studio-theme-dark .provider-card.active,
html.studio-theme-dark body .provider-card.active {
    background:var(--api-dark-hover) !important;
}

body.studio-theme-dark .provider-name,
body.studio-theme-dark .provider-card.active .provider-name,
html.studio-theme-dark body .provider-name,
html.studio-theme-dark body .provider-card.active .provider-name {
    color:var(--api-dark-text);
}

body.studio-theme-dark .provider-mark,
body.studio-theme-dark .provider-protocol-pill,
html.studio-theme-dark body .provider-mark,
html.studio-theme-dark body .provider-protocol-pill {
    background:var(--api-dark-soft) !important;
    color:var(--api-dark-muted) !important;
}

body.studio-theme-dark .provider-card.active .provider-mark,
body.studio-theme-dark .provider-card.active .provider-protocol-pill,
html.studio-theme-dark body .provider-card.active .provider-mark,
html.studio-theme-dark body .provider-card.active .provider-protocol-pill {
    background:var(--api-dark-raised) !important;
    color:var(--api-dark-text) !important;
}

body.studio-theme-dark .field-frame,
body.studio-theme-dark .model-row,
body.studio-theme-dark .key-panel,
body.studio-theme-dark .advanced-endpoints,
body.studio-theme-dark .rh-key-item,
body.studio-theme-dark .rh-card-group,
body.studio-theme-dark .lora-row,
body.studio-theme-dark .rh-config-card,
body.studio-theme-dark .recommend-card,
body.studio-theme-dark .recommend-note,
html.studio-theme-dark body .field-frame,
html.studio-theme-dark body .model-row,
html.studio-theme-dark body .key-panel,
html.studio-theme-dark body .advanced-endpoints,
html.studio-theme-dark body .rh-key-item,
html.studio-theme-dark body .rh-card-group,
html.studio-theme-dark body .lora-row,
html.studio-theme-dark body .rh-config-card,
html.studio-theme-dark body .recommend-card,
html.studio-theme-dark body .recommend-note {
    background:var(--api-dark-raised) !important;
    border-color:var(--api-dark-line) !important;
    color:var(--api-dark-text);
}

body.studio-theme-dark input,
body.studio-theme-dark textarea,
body.studio-theme-dark select,
html.studio-theme-dark body input,
html.studio-theme-dark body textarea,
html.studio-theme-dark body select {
    color:var(--api-dark-text);
}

body.studio-theme-dark input::placeholder,
body.studio-theme-dark textarea::placeholder,
html.studio-theme-dark body input::placeholder,
html.studio-theme-dark body textarea::placeholder {
    color:var(--api-dark-faint);
}

body.studio-theme-dark .action-btn,
body.studio-theme-dark .ghost-btn,
body.studio-theme-dark .key-btn,
body.studio-theme-dark .add-btn,
body.studio-theme-dark .rh-card-action,
body.studio-theme-dark .rh-workflow-editor-close,
html.studio-theme-dark body .action-btn,
html.studio-theme-dark body .ghost-btn,
html.studio-theme-dark body .key-btn,
html.studio-theme-dark body .add-btn,
html.studio-theme-dark body .rh-card-action,
html.studio-theme-dark body .rh-workflow-editor-close {
    background:var(--api-dark-raised) !important;
    border-color:var(--api-dark-line) !important;
    color:var(--api-dark-muted) !important;
}

body.studio-theme-dark .action-btn:hover,
body.studio-theme-dark .ghost-btn:hover,
body.studio-theme-dark .key-btn:hover,
body.studio-theme-dark .add-btn:hover,
body.studio-theme-dark .rh-card-action:hover,
body.studio-theme-dark .rh-workflow-editor-close:hover,
html.studio-theme-dark body .action-btn:hover,
html.studio-theme-dark body .ghost-btn:hover,
html.studio-theme-dark body .key-btn:hover,
html.studio-theme-dark body .add-btn:hover,
html.studio-theme-dark body .rh-card-action:hover,
html.studio-theme-dark body .rh-workflow-editor-close:hover {
    background:var(--api-dark-hover) !important;
    border-color:var(--api-dark-line-strong) !important;
    color:var(--api-dark-text) !important;
}

body.studio-theme-dark .api-link-btn,
body.studio-theme-dark .action-btn.primary-btn,
body.studio-theme-dark .action-btn.save-btn,
body.studio-theme-dark .recommend-register,
body.studio-theme-dark .recommend-fill,
html.studio-theme-dark body .api-link-btn,
html.studio-theme-dark body .action-btn.primary-btn,
html.studio-theme-dark body .action-btn.save-btn,
html.studio-theme-dark body .recommend-register,
html.studio-theme-dark body .recommend-fill {
    background:var(--api-dark-primary) !important;
    border-color:transparent !important;
    color:#111827 !important;
}

body.studio-theme-dark .api-link-btn:hover,
body.studio-theme-dark .action-btn.primary-btn:hover,
body.studio-theme-dark .action-btn.save-btn:hover,
body.studio-theme-dark .recommend-register:hover,
body.studio-theme-dark .recommend-fill:hover,
html.studio-theme-dark body .api-link-btn:hover,
html.studio-theme-dark body .action-btn.primary-btn:hover,
html.studio-theme-dark body .action-btn.save-btn:hover,
html.studio-theme-dark body .recommend-register:hover,
html.studio-theme-dark body .recommend-fill:hover {
    background:var(--api-dark-primary-hover) !important;
    color:#0f172a !important;
}

body.studio-theme-dark .recommend-tag,
html.studio-theme-dark body .recommend-tag {
    background:var(--api-dark-soft) !important;
    color:var(--api-dark-muted) !important;
}

body.studio-theme-dark .action-btn.danger-btn,
body.studio-theme-dark .key-btn.key-clear,
html.studio-theme-dark body .action-btn.danger-btn,
html.studio-theme-dark body .key-btn.key-clear {
    color:#fca5a5 !important;
}

body.studio-theme-dark .action-btn.danger-btn:hover,
body.studio-theme-dark .key-btn.key-clear:hover,
html.studio-theme-dark body .action-btn.danger-btn:hover,
html.studio-theme-dark body .key-btn.key-clear:hover {
    background:rgba(248,113,113,.14) !important;
    color:#fecaca !important;
}

/* 白天模式统一收口：去掉混杂浅蓝，统一为中性灰阶 */
:root {
    --api-light-page:#f5f6f8;
    --api-light-panel:#ffffff;
    --api-light-soft:#eef1f5;
    --api-light-raised:#f7f8fa;
    --api-light-hover:#e6ebf1;
    --api-light-line:#e2e7ee;
    --api-light-line-strong:#d2dae5;
    --api-light-text:#111827;
    --api-light-muted:#64748b;
    --api-light-faint:#94a3b8;
    --api-light-primary:#334155;
    --api-light-primary-hover:#475569;
}

body:not(.studio-theme-dark),
html:not(.studio-theme-dark) body:not(.theme-dark) {
    background:var(--api-light-page);
    color:var(--api-light-text);
}

body:not(.studio-theme-dark) .sidebar,
body:not(.studio-theme-dark) .content-head,
body:not(.studio-theme-dark) .block,
body:not(.studio-theme-dark) .picker-modal,
html:not(.studio-theme-dark) body:not(.theme-dark) .sidebar,
html:not(.studio-theme-dark) body:not(.theme-dark) .content-head,
html:not(.studio-theme-dark) body:not(.theme-dark) .block,
html:not(.studio-theme-dark) body:not(.theme-dark) .picker-modal {
    background:var(--api-light-panel) !important;
    color:var(--api-light-text);
}

body:not(.studio-theme-dark) .page-head .sub,
body:not(.studio-theme-dark) .page-head .status,
body:not(.studio-theme-dark) .editor-sub,
body:not(.studio-theme-dark) .block-desc,
body:not(.studio-theme-dark) .label,
body:not(.studio-theme-dark) .hint,
html:not(.studio-theme-dark) body:not(.theme-dark) .page-head .sub,
html:not(.studio-theme-dark) body:not(.theme-dark) .page-head .status,
html:not(.studio-theme-dark) body:not(.theme-dark) .editor-sub,
html:not(.studio-theme-dark) body:not(.theme-dark) .block-desc,
html:not(.studio-theme-dark) body:not(.theme-dark) .label,
html:not(.studio-theme-dark) body:not(.theme-dark) .hint {
    color:var(--api-light-muted);
}

body:not(.studio-theme-dark) .side-section-title,
body:not(.studio-theme-dark) .provider-meta,
html:not(.studio-theme-dark) body:not(.theme-dark) .side-section-title,
html:not(.studio-theme-dark) body:not(.theme-dark) .provider-meta {
    color:var(--api-light-faint);
}

body:not(.studio-theme-dark) .provider-card,
html:not(.studio-theme-dark) body:not(.theme-dark) .provider-card {
    color:var(--api-light-muted);
    border-color:transparent !important;
}

body:not(.studio-theme-dark) .provider-card + .provider-card,
html:not(.studio-theme-dark) body:not(.theme-dark) .provider-card + .provider-card {
    border-top-color:var(--api-light-line) !important;
}

body:not(.studio-theme-dark) .provider-card:not(.active),
html:not(.studio-theme-dark) body:not(.theme-dark) .provider-card:not(.active) {
    background:transparent !important;
}

body:not(.studio-theme-dark) .provider-card:hover,
html:not(.studio-theme-dark) body:not(.theme-dark) .provider-card:hover {
    background:var(--api-light-raised) !important;
}

body:not(.studio-theme-dark) .provider-card.active,
html:not(.studio-theme-dark) body:not(.theme-dark) .provider-card.active {
    background:var(--api-light-soft) !important;
}

body:not(.studio-theme-dark) .provider-name,
body:not(.studio-theme-dark) .provider-card.active .provider-name,
html:not(.studio-theme-dark) body:not(.theme-dark) .provider-name,
html:not(.studio-theme-dark) body:not(.theme-dark) .provider-card.active .provider-name {
    color:var(--api-light-text);
}

body:not(.studio-theme-dark) .provider-mark,
body:not(.studio-theme-dark) .provider-protocol-pill,
html:not(.studio-theme-dark) body:not(.theme-dark) .provider-mark,
html:not(.studio-theme-dark) body:not(.theme-dark) .provider-protocol-pill {
    background:var(--api-light-raised) !important;
    color:var(--api-light-muted) !important;
}

body:not(.studio-theme-dark) .provider-card.active .provider-mark,
body:not(.studio-theme-dark) .provider-card.active .provider-protocol-pill,
html:not(.studio-theme-dark) body:not(.theme-dark) .provider-card.active .provider-mark,
html:not(.studio-theme-dark) body:not(.theme-dark) .provider-card.active .provider-protocol-pill {
    background:var(--api-light-panel) !important;
    color:var(--api-light-text) !important;
}

body:not(.studio-theme-dark) .field-frame,
body:not(.studio-theme-dark) .model-row,
body:not(.studio-theme-dark) .key-panel,
body:not(.studio-theme-dark) .advanced-endpoints,
body:not(.studio-theme-dark) .rh-key-item,
body:not(.studio-theme-dark) .rh-card-group,
body:not(.studio-theme-dark) .lora-row,
body:not(.studio-theme-dark) .rh-config-card,
body:not(.studio-theme-dark) .recommend-card,
body:not(.studio-theme-dark) .recommend-note,
html:not(.studio-theme-dark) body:not(.theme-dark) .field-frame,
html:not(.studio-theme-dark) body:not(.theme-dark) .model-row,
html:not(.studio-theme-dark) body:not(.theme-dark) .key-panel,
html:not(.studio-theme-dark) body:not(.theme-dark) .advanced-endpoints,
html:not(.studio-theme-dark) body:not(.theme-dark) .rh-key-item,
html:not(.studio-theme-dark) body:not(.theme-dark) .rh-card-group,
html:not(.studio-theme-dark) body:not(.theme-dark) .lora-row,
html:not(.studio-theme-dark) body:not(.theme-dark) .rh-config-card,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-card,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-note {
    background:var(--api-light-raised) !important;
    border-color:var(--api-light-line) !important;
    color:var(--api-light-text);
}

body:not(.studio-theme-dark) .block-head,
body:not(.studio-theme-dark) .recommend-actions,
body:not(.studio-theme-dark) .picker-head,
body:not(.studio-theme-dark) .picker-toolbar,
body:not(.studio-theme-dark) .picker-foot,
html:not(.studio-theme-dark) body:not(.theme-dark) .block-head,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-actions,
html:not(.studio-theme-dark) body:not(.theme-dark) .picker-head,
html:not(.studio-theme-dark) body:not(.theme-dark) .picker-toolbar,
html:not(.studio-theme-dark) body:not(.theme-dark) .picker-foot {
    border-color:var(--api-light-line) !important;
}

body:not(.studio-theme-dark) input,
body:not(.studio-theme-dark) textarea,
body:not(.studio-theme-dark) select,
html:not(.studio-theme-dark) body:not(.theme-dark) input,
html:not(.studio-theme-dark) body:not(.theme-dark) textarea,
html:not(.studio-theme-dark) body:not(.theme-dark) select {
    color:var(--api-light-text);
}

body:not(.studio-theme-dark) input::placeholder,
body:not(.studio-theme-dark) textarea::placeholder,
html:not(.studio-theme-dark) body:not(.theme-dark) input::placeholder,
html:not(.studio-theme-dark) body:not(.theme-dark) textarea::placeholder {
    color:var(--api-light-faint);
}

body:not(.studio-theme-dark) .action-btn,
body:not(.studio-theme-dark) .ghost-btn,
body:not(.studio-theme-dark) .key-btn,
body:not(.studio-theme-dark) .add-btn,
body:not(.studio-theme-dark) .rh-card-action,
body:not(.studio-theme-dark) .rh-workflow-editor-close,
html:not(.studio-theme-dark) body:not(.theme-dark) .action-btn,
html:not(.studio-theme-dark) body:not(.theme-dark) .ghost-btn,
html:not(.studio-theme-dark) body:not(.theme-dark) .key-btn,
html:not(.studio-theme-dark) body:not(.theme-dark) .add-btn,
html:not(.studio-theme-dark) body:not(.theme-dark) .rh-card-action,
html:not(.studio-theme-dark) body:not(.theme-dark) .rh-workflow-editor-close {
    background:var(--api-light-raised) !important;
    border-color:var(--api-light-line) !important;
    color:var(--api-light-muted) !important;
}

body:not(.studio-theme-dark) .action-btn:hover,
body:not(.studio-theme-dark) .ghost-btn:hover,
body:not(.studio-theme-dark) .key-btn:hover,
body:not(.studio-theme-dark) .add-btn:hover,
body:not(.studio-theme-dark) .rh-card-action:hover,
body:not(.studio-theme-dark) .rh-workflow-editor-close:hover,
html:not(.studio-theme-dark) body:not(.theme-dark) .action-btn:hover,
html:not(.studio-theme-dark) body:not(.theme-dark) .ghost-btn:hover,
html:not(.studio-theme-dark) body:not(.theme-dark) .key-btn:hover,
html:not(.studio-theme-dark) body:not(.theme-dark) .add-btn:hover,
html:not(.studio-theme-dark) body:not(.theme-dark) .rh-card-action:hover,
html:not(.studio-theme-dark) body:not(.theme-dark) .rh-workflow-editor-close:hover {
    background:var(--api-light-hover) !important;
    border-color:var(--api-light-line-strong) !important;
    color:var(--api-light-text) !important;
}

body:not(.studio-theme-dark) .api-link-btn,
body:not(.studio-theme-dark) .action-btn.primary-btn,
body:not(.studio-theme-dark) .action-btn.save-btn,
body:not(.studio-theme-dark) .recommend-register,
body:not(.studio-theme-dark) .recommend-fill,
html:not(.studio-theme-dark) body:not(.theme-dark) .api-link-btn,
html:not(.studio-theme-dark) body:not(.theme-dark) .action-btn.primary-btn,
html:not(.studio-theme-dark) body:not(.theme-dark) .action-btn.save-btn,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-register,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-fill {
    background:var(--api-light-primary) !important;
    border-color:transparent !important;
    color:#f8fafc !important;
}

body:not(.studio-theme-dark) .api-link-btn:hover,
body:not(.studio-theme-dark) .action-btn.primary-btn:hover,
body:not(.studio-theme-dark) .action-btn.save-btn:hover,
body:not(.studio-theme-dark) .recommend-register:hover,
body:not(.studio-theme-dark) .recommend-fill:hover,
html:not(.studio-theme-dark) body:not(.theme-dark) .api-link-btn:hover,
html:not(.studio-theme-dark) body:not(.theme-dark) .action-btn.primary-btn:hover,
html:not(.studio-theme-dark) body:not(.theme-dark) .action-btn.save-btn:hover,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-register:hover,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-fill:hover {
    background:var(--api-light-primary-hover) !important;
    color:#fff !important;
}

body:not(.studio-theme-dark) .recommend-tag,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-tag {
    background:var(--api-light-soft) !important;
    color:var(--api-light-muted) !important;
}

/* 去掉平台分割线，并强化 RunningHub 应用/工作流配置区层级 */
.provider-card + .provider-card,
body.studio-theme-dark .provider-card + .provider-card,
html.studio-theme-dark body .provider-card + .provider-card,
body:not(.studio-theme-dark) .provider-card + .provider-card,
html:not(.studio-theme-dark) body:not(.theme-dark) .provider-card + .provider-card {
    border-top-color:transparent !important;
}

.runninghub-config-block {
    background:var(--panel) !important;
}

.rh-paste-row {
    padding:10px;
    border-radius:12px;
    background:#eef1f5;
}

.rh-paste-input {
    background:#ffffff !important;
    border-color:#d7dee8 !important;
}

.rh-card-columns {
    gap:14px;
}

.rh-card-group {
    padding:12px;
    border-radius:14px;
    background:#eef1f5 !important;
    border:1px solid #dfe5ed !important;
}

.rh-group-head {
    padding:0 2px 2px;
}

.rh-group-title {
    color:#111827;
}

.rh-group-count {
    background:#ffffff !important;
    color:#64748b !important;
}

.rh-card-list {
    gap:9px;
}

.rh-config-card {
    background:#ffffff !important;
    border:1px solid #d7dee8 !important;
    box-shadow:none !important;
}

.rh-thumb {
    background:#eef1f5 !important;
    border-color:#d7dee8 !important;
}

.rh-card-main input,
.rh-card-main textarea {
    background:#f7f8fa !important;
    border-color:#dfe5ed !important;
}

.rh-card-title-field input {
    background:#ffffff !important;
    border-color:#d2dae5 !important;
}

.rh-card-action {
    background:#f7f8fa !important;
    border-color:#dfe5ed !important;
    color:#64748b !important;
}

.rh-card-action:hover {
    background:#e6ebf1 !important;
    color:#111827 !important;
}

.rh-empty {
    background:#ffffff;
    border-color:#d7dee8;
    color:#64748b;
}

body.studio-theme-dark .runninghub-config-block,
html.studio-theme-dark body .runninghub-config-block {
    background:var(--api-dark-panel) !important;
}

body.studio-theme-dark .rh-paste-row,
html.studio-theme-dark body .rh-paste-row {
    background:var(--api-dark-soft) !important;
}

body.studio-theme-dark .rh-paste-input,
html.studio-theme-dark body .rh-paste-input {
    background:var(--api-dark-raised) !important;
    border-color:var(--api-dark-line-strong) !important;
}

body.studio-theme-dark .rh-card-group,
html.studio-theme-dark body .rh-card-group {
    background:var(--api-dark-soft) !important;
    border-color:var(--api-dark-line) !important;
}

body.studio-theme-dark .rh-group-title,
html.studio-theme-dark body .rh-group-title {
    color:var(--api-dark-text) !important;
}

body.studio-theme-dark .rh-group-count,
html.studio-theme-dark body .rh-group-count {
    background:var(--api-dark-raised) !important;
    color:var(--api-dark-muted) !important;
}

body.studio-theme-dark .rh-config-card,
html.studio-theme-dark body .rh-config-card {
    background:var(--api-dark-raised) !important;
    border-color:var(--api-dark-line-strong) !important;
}

body.studio-theme-dark .rh-thumb,
html.studio-theme-dark body .rh-thumb {
    background:var(--api-dark-soft) !important;
    border-color:var(--api-dark-line-strong) !important;
}

body.studio-theme-dark .rh-card-main input,
body.studio-theme-dark .rh-card-main textarea,
html.studio-theme-dark body .rh-card-main input,
html.studio-theme-dark body .rh-card-main textarea {
    background:var(--api-dark-soft) !important;
    border-color:var(--api-dark-line) !important;
}

body.studio-theme-dark .rh-card-title-field input,
html.studio-theme-dark body .rh-card-title-field input {
    background:#273141 !important;
    border-color:var(--api-dark-line-strong) !important;
}

body.studio-theme-dark .rh-card-action,
html.studio-theme-dark body .rh-card-action {
    background:var(--api-dark-soft) !important;
    border-color:var(--api-dark-line) !important;
    color:var(--api-dark-muted) !important;
}

body.studio-theme-dark .rh-card-action:hover,
html.studio-theme-dark body .rh-card-action:hover {
    background:var(--api-dark-hover) !important;
    color:var(--api-dark-text) !important;
}

body.studio-theme-dark .rh-empty,
html.studio-theme-dark body .rh-empty {
    background:var(--api-dark-raised);
    border-color:var(--api-dark-line-strong);
    color:var(--api-dark-muted);
}

@media (max-width:720px) {
    .recommend-card {
        min-height:0;
    }
    .recommend-api-body {
        grid-template-columns:1fr;
    }
    .recommend-actions {
        grid-template-columns:1fr 1fr;
    }
}

/* 推荐 API 新手引导动效 */
.api-link-btn {
    position:relative;
    overflow:hidden;
    animation:none;
    transform:none !important;
}

.api-link-btn::after {
    content:"";
    position:absolute;
    inset:-1px auto -1px -45%;
    width:34%;
    background:linear-gradient(90deg, transparent, rgba(255,255,255,.28), transparent);
    transform:skewX(-18deg);
    animation:none;
    pointer-events:none;
}

.api-link-btn:hover {
    animation-play-state:paused;
}

.recommend-card {
    position:relative;
    animation:none;
    animation-delay:calc(var(--recommend-index, 0) * 70ms);
}

.recommend-actions {
    grid-template-columns:minmax(0, 1fr) 34px minmax(0, 1fr) !important;
    align-items:center;
}

.recommend-flow-arrow {
    height:34px;
    min-width:34px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--muted);
    position:relative;
    pointer-events:none;
}

.recommend-flow-arrow span {
    position:absolute;
    left:1px;
    right:3px;
    top:50%;
    height:2px;
    transform:translateY(-50%);
    background-image:repeating-linear-gradient(90deg, currentColor 0 5px, transparent 5px 9px);
    background-size:18px 2px;
    opacity:.7;
    animation:none;
}

.recommend-flow-arrow i {
    position:absolute;
    right:-2px;
    width:14px;
    height:14px;
    background:var(--panel);
    border-radius:999px;
    animation:none;
}

.recommend-register,
.recommend-fill {
    position:relative;
    overflow:hidden;
}

.recommend-register::after,
.recommend-fill::after {
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(circle at 50% 0%, rgba(255,255,255,.22), transparent 58%);
    opacity:0;
    transition:opacity .18s ease;
}

.recommend-register:hover::after,
.recommend-fill:hover::after {
    opacity:1;
}

body.studio-theme-dark .api-link-btn::after,
html.studio-theme-dark body .api-link-btn::after {
    background:linear-gradient(90deg, transparent, rgba(220,238,255,.28), transparent);
}

body.studio-theme-dark .recommend-flow-arrow i,
html.studio-theme-dark body .recommend-flow-arrow i {
    background:var(--api-dark-raised);
}

body.studio-theme-dark .api-link-btn,
html.studio-theme-dark body .api-link-btn {
    background:#202836 !important;
    border-color:rgba(148, 197, 255, .28) !important;
    color:#edf6ff !important;
    box-shadow:0 8px 18px rgba(0,0,0,.22), 0 0 0 1px rgba(125, 185, 255, .04) !important;
    animation:none;
}

body.studio-theme-dark .api-link-btn:hover,
html.studio-theme-dark body .api-link-btn:hover {
    background:#263143 !important;
    border-color:rgba(176, 215, 255, .5) !important;
    color:#ffffff !important;
    box-shadow:0 10px 22px rgba(0,0,0,.26), 0 0 0 1px rgba(158, 207, 255, .08) !important;
}

body.studio-theme-dark .api-link-btn::after,
html.studio-theme-dark body .api-link-btn::after {
    background:linear-gradient(90deg, transparent, rgba(168, 213, 255, .24), transparent);
}

body.studio-theme-dark .recommend-flow-arrow,
html.studio-theme-dark body .recommend-flow-arrow {
    color:#9ed0ff;
    filter:drop-shadow(0 0 6px rgba(89, 165, 255, .35));
}

body.studio-theme-dark .recommend-flow-arrow span,
html.studio-theme-dark body .recommend-flow-arrow span {
    opacity:.95;
}

body.studio-theme-dark .recommend-flow-arrow i,
html.studio-theme-dark body .recommend-flow-arrow i {
    background:#243044;
    color:#c7e4ff;
}

body.studio-theme-dark .recommend-register,
body.studio-theme-dark .recommend-fill,
html.studio-theme-dark body .recommend-register,
html.studio-theme-dark body .recommend-fill {
    background:#283446 !important;
    border-color:rgba(148, 197, 255, .26) !important;
    color:#f2f7ff !important;
    box-shadow:0 7px 16px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.04) !important;
}

body.studio-theme-dark .recommend-register:hover,
body.studio-theme-dark .recommend-fill:hover,
html.studio-theme-dark body .recommend-register:hover,
html.studio-theme-dark body .recommend-fill:hover {
    background:#314057 !important;
    border-color:rgba(176, 215, 255, .5) !important;
    box-shadow:0 9px 20px rgba(0,0,0,.22), 0 0 0 1px rgba(90, 165, 255, .06) !important;
}

@keyframes recommendEntryPulse {
    0%, 100% { border-color:var(--line); box-shadow:0 0 0 rgba(59,130,246,0); }
    50% { border-color:rgba(96,165,250,.42); box-shadow:0 0 0 3px rgba(96,165,250,.06); }
}

@keyframes recommendEntryPulseDark {
    0%, 100% { border-color:rgba(148, 197, 255, .28); box-shadow:0 8px 18px rgba(0,0,0,.22), 0 0 0 1px rgba(125, 185, 255, .04); }
    50% { border-color:rgba(176, 215, 255, .48); box-shadow:0 8px 18px rgba(0,0,0,.22), 0 0 0 3px rgba(125, 185, 255, .06); }
}

@keyframes recommendEntrySweep {
    0%, 48% { left:-42%; opacity:0; }
    56% { opacity:.75; }
    74%, 100% { left:110%; opacity:0; }
}

@keyframes recommendCardIn {
    from { opacity:0; transform:translateY(10px) scale(.985); }
    to { opacity:1; transform:translateY(0) scale(1); }
}

@keyframes recommendDashFlow {
    from { background-position:0 0; }
    to { background-position:10px 0; }
}

@keyframes recommendArrowNudge {
    0%, 100% { transform:translateX(0); opacity:.72; }
    50% { transform:translateX(3px); opacity:1; }
}

@keyframes recommendDashFlowY {
    from { background-position:0 0; }
    to { background-position:0 10px; }
}

@media (prefers-reduced-motion: reduce) {
    .api-link-btn,
    .api-link-btn::after,
    .recommend-card,
    .recommend-flow-arrow span,
    .recommend-flow-arrow i {
        animation:none !important;
    }
}

/* MS / RH 空 Key 新手引导 */
.provider-onboarding-card[hidden] {
    display:none !important;
}

.provider-onboarding-card {
    display:flex;
    flex-direction:column;
    gap:20px;
    padding:24px;
    min-height:360px;
    justify-content:center;
    border:1px solid rgba(96, 165, 250, .18);
    border-radius:18px;
    background:linear-gradient(180deg, #f6f9fd 0%, #eef3f8 100%);
    box-shadow:0 10px 24px rgba(15,23,42,.055);
}

body.show-provider-onboarding .content > .block,
body.show-provider-onboarding .content > .model-grid,
body.show-provider-onboarding .content > .models-toolbar,
body.show-provider-onboarding .content > .runninghub-config-block {
    display:none !important;
}

body.show-provider-onboarding .content-actions .save-btn,
body.show-provider-onboarding .content-actions .danger-btn {
    display:none !important;
}

.recommend-inline-card {
    min-height:360px;
    justify-content:flex-start;
}

.recommend-content[hidden] {
    display:none !important;
}

.recommend-content {
    min-width:0;
}

.recommend-inline-body {
    padding:0 !important;
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
}

.recommend-inline-card .recommend-card {
    min-height:184px;
    background:rgba(255,255,255,.46);
    border-color:rgba(96,165,250,.14);
}

.recommend-inline-card .recommend-actions {
    margin-top:auto;
}

.recommend-guide-key-btn {
    width:100%;
    height:38px;
    border-radius:10px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
}

.recommend-guide-save {
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    gap:10px;
    align-items:end;
}

.recommend-guide-save-btn {
    min-width:112px;
}

.recommend-inline-card .recommend-note {
    margin:0;
    color:var(--muted);
    font-size:11.5px;
    font-weight:750;
}

.recommend-platform-card {
    display:grid;
    grid-template-columns:minmax(0, 1.05fr) minmax(280px, .95fr);
    gap:18px;
    min-height:0 !important;
    padding:18px;
    align-items:stretch;
}

.recommend-platform-info {
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:12px;
}

.recommend-platform-head {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:10px;
}

.recommend-cap-icons {
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:6px;
    margin-top:8px;
}

.recommend-cap-icons span {
    min-width:34px;
    height:22px;
    padding:0 7px;
    border-radius:7px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:rgba(96,165,250,.12);
    border:1px solid rgba(96,165,250,.16);
    color:#2563eb;
    font-size:10px;
    line-height:1;
    font-weight:950;
}

.recommend-platform-summary {
    margin:0;
    color:var(--muted);
    font-size:12px;
    line-height:1.65;
    font-weight:750;
}

.recommend-advantages {
    display:grid;
    gap:7px;
    margin-top:auto;
}

.recommend-advantages span {
    position:relative;
    padding-left:12px;
    color:var(--text);
    font-size:11.5px;
    line-height:1.35;
    font-weight:850;
}

.recommend-advantages span::before {
    content:"";
    position:absolute;
    left:0;
    top:.52em;
    width:4px;
    height:4px;
    border-radius:999px;
    background:#60a5fa;
}

.recommend-platform-setup {
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:12px;
    padding:14px;
    border:1px solid rgba(96,165,250,.14);
    border-radius:14px;
    background:rgba(255,255,255,.42);
}

.recommend-setup-title {
    color:var(--text);
    font-size:13px;
    line-height:1.25;
    font-weight:950;
}

.recommend-quick-stack {
    display:flex;
    flex-direction:column;
    gap:10px;
    margin-top:auto;
}

.recommend-vertical-arrow {
    position:relative;
    width:100%;
    height:24px;
    color:var(--muted);
}

.recommend-vertical-arrow span {
    position:absolute;
    left:50%;
    top:1px;
    bottom:4px;
    width:2px;
    transform:translateX(-50%);
    background-image:repeating-linear-gradient(180deg, currentColor 0 5px, transparent 5px 9px);
    background-size:2px 18px;
    opacity:.7;
}

.recommend-vertical-arrow::after {
    content:"";
    position:absolute;
    left:50%;
    bottom:0;
    width:7px;
    height:7px;
    border-right:2px solid currentColor;
    border-bottom:2px solid currentColor;
    transform:translateX(-50%) rotate(45deg);
    border-radius:1px;
}

.recommend-inline-empty {
    grid-column:1 / -1;
    min-height:160px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    color:var(--muted);
    font-size:13px;
    font-weight:850;
}

.onboarding-head {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.onboarding-title {
    color:var(--text);
    font-size:15px;
    line-height:1.25;
    font-weight:950;
}

.onboarding-desc {
    margin-top:4px;
    color:var(--muted);
    font-size:11.5px;
    line-height:1.55;
    font-weight:700;
}

.onboarding-badge {
    height:22px;
    padding:0 8px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    color:#2563eb;
    background:rgba(96,165,250,.12);
    border:1px solid rgba(96,165,250,.18);
    font-size:10px;
    font-weight:950;
    letter-spacing:.04em;
}

.onboarding-actions {
    display:grid;
    grid-template-columns:minmax(0, 1fr) 34px minmax(120px, .56fr);
    align-items:center;
    gap:10px;
}

.onboarding-key-actions {
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:8px;
}

.onboarding-key-btn,
.onboarding-fill-btn {
    min-width:0;
    height:36px;
    padding:0 11px;
    border:1px solid rgba(96,165,250,.2);
    border-radius:10px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    text-decoration:none;
    color:#1f2937;
    background:#ffffff;
    font-size:11.5px;
    line-height:1;
    font-weight:900;
    white-space:nowrap;
    transition:background .16s ease, border-color .16s ease, box-shadow .16s ease, color .16s ease;
}

.onboarding-fill-btn {
    cursor:pointer;
    background:#e8eef6;
}

.onboarding-key-btn:hover,
.onboarding-fill-btn:hover {
    color:#0f172a;
    background:#f8fbff;
    border-color:rgba(37,99,235,.34);
    box-shadow:0 8px 18px rgba(15,23,42,.08), 0 0 0 3px rgba(96,165,250,.055);
}

.onboarding-flow-arrow {
    color:#64748b;
}

.onboarding-ms-flow {
    display:grid;
    grid-template-columns:minmax(0, 1fr) 34px minmax(0, 1.08fr);
    gap:14px;
    align-items:stretch;
}

.onboarding-step-panel {
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:12px;
    padding:14px;
    border:1px solid rgba(96,165,250,.14);
    border-radius:14px;
    background:rgba(255,255,255,.46);
}

.onboarding-step-label {
    width:max-content;
    height:22px;
    padding:0 8px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    background:rgba(96,165,250,.1);
    color:#2563eb;
    font-size:10.5px;
    font-weight:950;
}

.onboarding-step-title {
    color:var(--text);
    font-size:13px;
    line-height:1.2;
    font-weight:950;
}

.onboarding-ms-flow .onboarding-key-actions {
    grid-template-columns:1fr 1fr;
    gap:8px;
    margin-top:auto;
}

.onboarding-ms-arrow {
    align-self:center;
    justify-self:center;
}

.onboarding-ms-key-entry {
    margin-top:auto;
    padding:0;
    border:0;
    background:transparent;
    grid-template-columns:minmax(0, 1fr) auto;
}

.onboarding-key-entry {
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    gap:10px;
    align-items:end;
    padding:12px;
    border:1px solid rgba(96,165,250,.14);
    border-radius:14px;
    background:rgba(255,255,255,.48);
}

.onboarding-key-entry:has(.onboarding-key-field + .onboarding-key-field) {
    grid-template-columns:minmax(0, 1fr) minmax(0, 1fr) auto;
}

.onboarding-key-field {
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:6px;
}

.onboarding-key-field span {
    color:var(--muted);
    font-size:11px;
    font-weight:850;
}

.onboarding-key-field input {
    width:100%;
    height:38px;
    padding:0 11px;
    border:1px solid var(--line);
    border-radius:10px;
    background:var(--panel);
    color:var(--text);
    font-size:12px;
    font-weight:700;
    animation:none;
}

.onboarding-save-btn {
    height:38px;
    padding:0 14px;
    border:1px solid rgba(96,165,250,.24);
    border-radius:10px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    background:#dfe8f3;
    color:#172033;
    font-size:11.5px;
    font-weight:950;
    white-space:nowrap;
    transition:background .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.onboarding-save-btn:hover {
    background:#eef5ff;
    border-color:rgba(37,99,235,.34);
    box-shadow:0 8px 18px rgba(15,23,42,.08), 0 0 0 3px rgba(96,165,250,.055);
}

.onboarding-default-btn {
    height:32px;
    padding:0 10px;
    border:1px solid rgba(96,165,250,.18);
    border-radius:10px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    cursor:pointer;
    background:rgba(255,255,255,.46);
    color:#334155;
    font-size:11px;
    font-weight:900;
    white-space:nowrap;
    transition:background .16s ease, border-color .16s ease, box-shadow .16s ease, color .16s ease;
}

.onboarding-default-btn:hover {
    color:#0f172a;
    background:#f8fbff;
    border-color:rgba(37,99,235,.3);
    box-shadow:0 7px 16px rgba(15,23,42,.07), 0 0 0 3px rgba(96,165,250,.05);
}

.onboarding-rh-flow {
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;
    align-items:stretch;
}

.onboarding-rh-ms-flow {
    display:grid;
    grid-template-columns:minmax(0, 1fr) 34px minmax(0, 1.08fr);
    gap:14px;
    align-items:stretch;
}

.onboarding-rh-panel {
    gap:11px;
    padding:15px;
}

.onboarding-rh-panel-head {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:10px;
}

.onboarding-rh-icon {
    flex:0 0 auto;
    color:#64748b;
    margin-top:3px;
}

.onboarding-step-label-alt {
    background:rgba(34,197,94,.1);
    color:#15803d;
}

.onboarding-rh-key-actions {
    margin-top:2px;
}

.onboarding-rh-key-actions .onboarding-key-btn {
    height:34px;
    padding:0 9px;
    font-size:11px;
}

.onboarding-rh-source-panel,
.onboarding-rh-submit-panel {
    min-height:210px;
}

.onboarding-rh-source-groups {
    display:flex;
    flex-direction:column;
    gap:12px;
    margin-top:auto;
}

.onboarding-rh-source-group {
    display:flex;
    flex-direction:column;
    gap:7px;
}

.onboarding-rh-source-label {
    color:var(--muted);
    font-size:11px;
    font-weight:900;
}

.onboarding-rh-linear-panel {
    gap:16px;
    padding:16px;
}

.onboarding-rh-linear-rows {
    display:flex;
    flex-direction:column;
    gap:18px;
}

.onboarding-rh-linear-row {
    display:grid;
    grid-template-columns:minmax(190px, .9fr) 34px minmax(220px, 1.1fr);
    gap:12px;
    align-items:end;
}

.onboarding-ms-linear-row {
    grid-template-columns:minmax(220px, .95fr) 34px minmax(260px, 1.05fr);
}

.onboarding-ms-linear-panel {
    min-height:210px;
    justify-content:center;
}

.onboarding-rh-row-arrow {
    align-self:end;
    margin-bottom:2px;
}

.onboarding-rh-row-field {
    width:100%;
}

.onboarding-rh-save-line {
    display:flex;
    justify-content:flex-end;
    margin-top:2px;
}

.onboarding-rh-combined-entry {
    margin-top:auto;
    display:flex !important;
    flex-direction:column;
    grid-template-columns:1fr !important;
    gap:10px;
    padding:0;
    border:0;
    background:transparent;
}

.onboarding-rh-combined-entry .onboarding-key-field {
    width:100%;
}

.onboarding-rh-save-all {
    min-width:156px;
    margin-top:2px;
}

.onboarding-rh-arrow {
    width:22px;
    height:22px;
    justify-content:center;
    transform:none;
    align-self:center;
    justify-self:center;
}

.onboarding-rh-arrow span {
    left:50%;
    right:auto;
    top:0;
    bottom:2px;
    width:2px;
    height:auto;
    transform:translateX(-50%);
    background-image:repeating-linear-gradient(180deg, currentColor 0 5px, transparent 5px 9px);
    background-size:2px 18px;
    animation:none;
}

.onboarding-rh-arrow i {
    right:auto;
    bottom:-2px;
}

.onboarding-rh-key-entry {
    grid-template-columns:minmax(0, 1fr) auto;
    padding:0;
    border:0;
    background:transparent;
}

.onboarding-rh-key-entry .onboarding-save-btn {
    width:70px;
    padding:0 10px;
}

body.studio-theme-dark .provider-onboarding-card,
html.studio-theme-dark body .provider-onboarding-card {
    background:linear-gradient(180deg, #202836 0%, #1b222e 100%);
    border-color:rgba(148, 197, 255, .18);
    box-shadow:0 10px 24px rgba(0,0,0,.22);
}

body.studio-theme-dark .recommend-inline-card .recommend-card,
html.studio-theme-dark body .recommend-inline-card .recommend-card {
    background:rgba(15,23,42,.18);
    border-color:rgba(148,197,255,.12);
}

body.studio-theme-dark .recommend-platform-setup,
html.studio-theme-dark body .recommend-platform-setup {
    background:rgba(15,23,42,.2);
    border-color:rgba(148,197,255,.12);
}

body.studio-theme-dark .recommend-platform-summary,
html.studio-theme-dark body .recommend-platform-summary {
    color:var(--api-dark-muted);
}

body.studio-theme-dark .recommend-advantages span,
html.studio-theme-dark body .recommend-advantages span {
    color:var(--api-dark-text);
}

body.studio-theme-dark .recommend-cap-icons span,
html.studio-theme-dark body .recommend-cap-icons span {
    background:rgba(96,165,250,.12);
    border-color:rgba(148,197,255,.16);
    color:#bfdbfe;
}

body.studio-theme-dark .recommend-vertical-arrow,
html.studio-theme-dark body .recommend-vertical-arrow {
    color:#9ed0ff;
}

body.studio-theme-dark .recommend-inline-card .recommend-note,
html.studio-theme-dark body .recommend-inline-card .recommend-note,
body.studio-theme-dark .recommend-inline-empty,
html.studio-theme-dark body .recommend-inline-empty {
    color:var(--api-dark-muted);
}

body.studio-theme-dark .onboarding-key-entry,
html.studio-theme-dark body .onboarding-key-entry {
    background:rgba(15,23,42,.18);
    border-color:rgba(148,197,255,.12);
}

body.studio-theme-dark .onboarding-step-panel,
html.studio-theme-dark body .onboarding-step-panel {
    background:rgba(15,23,42,.18);
    border-color:rgba(148,197,255,.12);
}

body.studio-theme-dark .onboarding-step-label,
html.studio-theme-dark body .onboarding-step-label {
    background:rgba(96,165,250,.12);
    color:#bfdbfe;
}

body.studio-theme-dark .onboarding-step-title,
html.studio-theme-dark body .onboarding-step-title {
    color:var(--api-dark-text);
}

body.studio-theme-dark .onboarding-title,
html.studio-theme-dark body .onboarding-title {
    color:var(--api-dark-text);
}

body.studio-theme-dark .onboarding-desc,
html.studio-theme-dark body .onboarding-desc {
    color:var(--api-dark-muted);
}

body.studio-theme-dark .onboarding-badge,
html.studio-theme-dark body .onboarding-badge {
    color:#bfdbfe;
    background:rgba(96,165,250,.12);
    border-color:rgba(148,197,255,.18);
}

body.studio-theme-dark .onboarding-key-btn,
body.studio-theme-dark .onboarding-fill-btn,
body.studio-theme-dark .onboarding-save-btn,
html.studio-theme-dark body .onboarding-key-btn,
html.studio-theme-dark body .onboarding-fill-btn,
html.studio-theme-dark body .onboarding-save-btn {
    color:#edf6ff;
    background:#283446;
    border-color:rgba(148,197,255,.22);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}

body.studio-theme-dark .onboarding-key-btn:hover,
body.studio-theme-dark .onboarding-fill-btn:hover,
body.studio-theme-dark .onboarding-save-btn:hover,
body.studio-theme-dark .onboarding-default-btn:hover,
html.studio-theme-dark body .onboarding-key-btn:hover,
html.studio-theme-dark body .onboarding-fill-btn:hover,
html.studio-theme-dark body .onboarding-save-btn:hover,
html.studio-theme-dark body .onboarding-default-btn:hover {
    color:#ffffff;
    background:#314057;
    border-color:rgba(176,215,255,.44);
    box-shadow:0 8px 18px rgba(0,0,0,.22), 0 0 0 3px rgba(125,185,255,.05);
}

body.studio-theme-dark .onboarding-key-field input,
html.studio-theme-dark body .onboarding-key-field input {
    background:var(--api-dark-soft);
    border-color:var(--api-dark-line);
    color:var(--api-dark-text);
}

body.studio-theme-dark .onboarding-flow-arrow,
html.studio-theme-dark body .onboarding-flow-arrow {
    color:#9ed0ff;
}

body.studio-theme-dark .onboarding-default-btn,
html.studio-theme-dark body .onboarding-default-btn {
    color:#dcecff;
    background:rgba(40,52,70,.72);
    border-color:rgba(148,197,255,.18);
}

body.studio-theme-dark .onboarding-rh-icon,
html.studio-theme-dark body .onboarding-rh-icon {
    color:#9fb6cc;
}

body.studio-theme-dark .onboarding-rh-source-label,
html.studio-theme-dark body .onboarding-rh-source-label {
    color:var(--api-dark-muted);
}

body.studio-theme-dark .onboarding-step-label-alt,
html.studio-theme-dark body .onboarding-step-label-alt {
    background:rgba(74,222,128,.12);
    color:#bbf7d0;
}

@keyframes apiKeyFieldBreath {
    0%, 100% { border-color:var(--line); box-shadow:none; }
    50% { border-color:rgba(96,165,250,.34); box-shadow:0 0 0 3px rgba(96,165,250,.055); }
}

@media (max-width:720px) {
    .onboarding-actions {
        grid-template-columns:1fr;
    }
    .onboarding-ms-flow {
        grid-template-columns:1fr;
    }
    .onboarding-rh-flow {
        grid-template-columns:1fr;
    }
    .recommend-inline-body {
        grid-template-columns:1fr;
    }
    .recommend-platform-card {
        grid-template-columns:1fr;
    }
    .recommend-guide-save {
        grid-template-columns:1fr;
    }
    .recommend-guide-save-btn {
        width:100%;
    }
    .onboarding-rh-ms-flow {
        grid-template-columns:1fr;
    }
    .onboarding-ms-flow .onboarding-key-actions {
        grid-template-columns:1fr;
    }
    .onboarding-rh-key-actions {
        grid-template-columns:1fr;
    }
    .onboarding-rh-linear-row {
        grid-template-columns:1fr;
        gap:8px;
    }
    .onboarding-rh-row-arrow {
        align-self:center;
        margin-bottom:0;
        transform:rotate(90deg);
    }
    .onboarding-rh-save-line {
        justify-content:stretch;
    }
    .onboarding-rh-save-all {
        width:100%;
    }
    .onboarding-key-entry,
    .onboarding-key-entry:has(.onboarding-key-field + .onboarding-key-field) {
        grid-template-columns:1fr;
    }
    .onboarding-flow-arrow {
        height:18px;
        transform:rotate(90deg);
        justify-self:center;
    }
    .onboarding-rh-arrow {
        height:22px;
        transform:none;
    }
}

@media (max-width:860px) { .page{padding:24px 16px 60px}.layout{grid-template-columns:1fr;gap:28px}.sidebar{position:static}.form,.model-grid,.endpoint-grid,.rh-card-columns{grid-template-columns:1fr}.models-toolbar{align-items:flex-start;flex-direction:column}.models-toolbar-actions{width:100%;justify-content:flex-end}.lora-row{grid-template-columns:1fr}.lora-row .icon-btn{width:100%;} }
@media (max-width:680px) { .rh-key-stack{grid-template-columns:1fr}.rh-key-head{grid-template-columns:1fr}.rh-key-links{justify-content:flex-start}.key-input-line{grid-template-columns:1fr}.key-actions{justify-content:flex-end}.key-btn{width:40px;height:40px} }
@media (max-width:680px) { .volcengine-key-stack,.volcengine-project-grid{grid-template-columns:1fr} }
@media (max-width:900px) { .rh-workflow-editor-overlay{padding:12px}.rh-workflow-editor-modal{height:94vh}.rh-workflow-editor-head{align-items:flex-start;flex-direction:column}.rh-workflow-editor-actions{width:100%;justify-content:flex-end;flex-wrap:wrap}.rh-workflow-editor-body{grid-template-columns:1fr}.rh-workflow-editor-side{border-right:0;border-bottom:1px solid var(--line);max-height:44vh}.rh-workflow-editor-canvas{min-height:44vh}.rh-editor-graph-wrap{min-height:360px}.rh-editor-field-controls{grid-template-columns:1fr} }

/* API 设置性能降载：避免持续动画和全局重绘 */
.api-link-btn,
.api-link-btn::after,
.recommend-card,
.recommend-flow-arrow span,
.recommend-flow-arrow i,
.onboarding-key-field input,
.onboarding-rh-arrow span {
    animation:none !important;
}

.api-link-btn::after {
    display:none !important;
}

.recommend-flow-arrow i {
    transform:none !important;
}

/* 推荐平台重构后的统一颜色和左侧激活态 */
.provider-card.provider-card-banner,
.api-link-btn {
    border-color:transparent !important;
    background:transparent !important;
    color:var(--muted) !important;
    box-shadow:none !important;
    transform:none !important;
}

.provider-card.provider-card-banner:hover,
.provider-card.provider-card-banner.active,
.api-link-btn:hover,
body.show-recommend-mode .api-link-btn,
html.studio-theme-dark body.show-recommend-mode .api-link-btn {
    border-color:transparent !important;
    background:var(--soft) !important;
    color:var(--text) !important;
    box-shadow:none !important;
}

body.show-recommend-mode .provider-card.active {
    background:transparent !important;
    color:var(--muted) !important;
}

.provider-onboarding-card {
    background:var(--panel) !important;
    border-color:var(--line) !important;
    box-shadow:none !important;
}

.onboarding-step-panel,
.recommend-inline-card .recommend-card,
.recommend-platform-setup {
    background:var(--soft) !important;
    border-color:var(--line) !important;
    box-shadow:none !important;
}

.recommend-inline-body {
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:14px !important;
}

.recommend-platform-card {
    grid-template-columns:1fr !important;
    gap:12px !important;
    padding:14px !important;
}

.recommend-platform-setup {
    padding:12px !important;
}

.recommend-platform-summary {
    font-size:11.5px !important;
    line-height:1.55 !important;
}

.recommend-advantages {
    gap:5px !important;
}

.recommend-advantages span {
    font-size:11px !important;
}

@media (max-width:920px) {
    .recommend-inline-body {
        grid-template-columns:1fr !important;
    }
}

/* API 设置最终统一色板与推荐平台紧凑布局 */
:root {
    --bg:#f6f7f9;
    --panel:#ffffff;
    --soft:#f3f5f8;
    --line:#e3e8ef;
    --line-strong:#d5dde8;
    --text:#111827;
    --muted:#667085;
    --faint:#98a2b3;
}

body.studio-theme-dark,
html.studio-theme-dark body {
    --bg:#11161d;
    --panel:#1b222c;
    --soft:#242c38;
    --line:rgba(148,163,184,.15);
    --line-strong:rgba(148,163,184,.24);
    --text:#edf2f7;
    --muted:#a8b3c2;
    --faint:#7f8b9c;
}

.sidebar,
.content-head,
.block,
.provider-onboarding-card {
    background:var(--panel) !important;
    border-color:var(--line) !important;
    box-shadow:none !important;
}

.provider-card,
.provider-card.provider-card-banner,
.api-link-btn {
    background:transparent !important;
    border-color:transparent !important;
    color:var(--muted) !important;
    box-shadow:none !important;
}

.provider-card:hover,
.provider-card.active,
.provider-card.provider-card-banner:hover,
.provider-card.provider-card-banner.active,
.api-link-btn:hover,
body.show-recommend-mode .api-link-btn {
    background:var(--soft) !important;
    border-color:transparent !important;
    color:var(--text) !important;
    box-shadow:none !important;
}

body.show-recommend-mode .provider-card.active {
    background:transparent !important;
    color:var(--muted) !important;
}

.onboarding-step-panel,
.recommend-inline-card .recommend-card,
.recommend-platform-setup,
.key-panel,
.rh-key-item,
.recommend-tag,
.recommend-cap-icons span,
.onboarding-badge,
.onboarding-step-label {
    background:var(--soft) !important;
    border-color:var(--line) !important;
    color:var(--text) !important;
    box-shadow:none !important;
}

.recommend-badge {
    background:var(--panel) !important;
    border-color:var(--line) !important;
    color:var(--muted) !important;
}

.onboarding-key-btn,
.onboarding-save-btn,
.recommend-guide-key-btn {
    background:var(--panel) !important;
    border-color:var(--line-strong) !important;
    color:var(--text) !important;
    box-shadow:none !important;
}

.onboarding-key-btn:hover,
.onboarding-save-btn:hover,
.recommend-guide-key-btn:hover {
    background:var(--soft) !important;
    border-color:var(--line-strong) !important;
    color:var(--text) !important;
    box-shadow:none !important;
}

.recommend-inline-card {
    gap:16px !important;
    padding:20px !important;
}

.recommend-inline-body {
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:16px !important;
}

.recommend-platform-card {
    min-height:0 !important;
    padding:16px !important;
    gap:14px !important;
}

.recommend-platform-head {
    gap:8px !important;
}

.recommend-platform-summary {
    font-size:11.5px !important;
    line-height:1.5 !important;
    margin-top:-2px !important;
}

.recommend-tags,
.recommend-cap-icons {
    gap:5px !important;
}

.recommend-tag,
.recommend-cap-icons span {
    height:21px !important;
    padding:0 7px !important;
    border-radius:7px !important;
    font-size:10px !important;
}

.recommend-advantages {
    gap:4px !important;
}

.recommend-advantages span {
    font-size:10.5px !important;
    line-height:1.35 !important;
}

.recommend-platform-setup {
    padding:12px !important;
    gap:10px !important;
}

.recommend-setup-title {
    font-size:12px !important;
}

.recommend-quick-stack {
    gap:8px !important;
}

.recommend-vertical-arrow {
    height:18px !important;
}

.recommend-guide-save {
    grid-template-columns:1fr !important;
    gap:8px !important;
}

.recommend-guide-save-btn {
    width:100% !important;
}

@media (max-width:1180px) {
    .recommend-inline-body {
        grid-template-columns:1fr !important;
    }
}

/* 白天模式：增强新手引导和推荐平台的视觉路径 */
body:not(.studio-theme-dark) .provider-onboarding-card,
html:not(.studio-theme-dark) body:not(.theme-dark) .provider-onboarding-card {
    background:#ffffff !important;
    border-color:#dfe7f1 !important;
    box-shadow:0 12px 28px rgba(15,23,42,.055) !important;
}

body:not(.studio-theme-dark) .onboarding-title,
html:not(.studio-theme-dark) body:not(.theme-dark) .onboarding-title,
body:not(.studio-theme-dark) .onboarding-step-title,
html:not(.studio-theme-dark) body:not(.theme-dark) .onboarding-step-title,
body:not(.studio-theme-dark) .recommend-name,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-name {
    color:#111827 !important;
}

body:not(.studio-theme-dark) .onboarding-desc,
html:not(.studio-theme-dark) body:not(.theme-dark) .onboarding-desc,
body:not(.studio-theme-dark) .recommend-platform-summary,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-platform-summary,
body:not(.studio-theme-dark) .recommend-inline-card .recommend-note,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-inline-card .recommend-note {
    color:#667085 !important;
}

body:not(.studio-theme-dark) .onboarding-step-panel,
html:not(.studio-theme-dark) body:not(.theme-dark) .onboarding-step-panel,
body:not(.studio-theme-dark) .recommend-platform-card,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-platform-card {
    background:#f7f9fc !important;
    border-color:#dfe7f1 !important;
}

body:not(.studio-theme-dark) .onboarding-rh-source-group,
html:not(.studio-theme-dark) body:not(.theme-dark) .onboarding-rh-source-group,
body:not(.studio-theme-dark) .recommend-platform-info,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-platform-info {
    padding:11px 12px;
    border:1px solid #e3eaf3;
    border-radius:12px;
    background:#ffffff;
}

body:not(.studio-theme-dark) .recommend-platform-info,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-platform-info {
    min-height:100%;
}

body:not(.studio-theme-dark) .recommend-platform-setup,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-platform-setup {
    background:#eef5ff !important;
    border-color:#cfe0f5 !important;
}

body:not(.studio-theme-dark) .onboarding-key-field input,
html:not(.studio-theme-dark) body:not(.theme-dark) .onboarding-key-field input {
    background:#ffffff !important;
    border-color:#d8e2ee !important;
}

body:not(.studio-theme-dark) .onboarding-key-field input:focus,
html:not(.studio-theme-dark) body:not(.theme-dark) .onboarding-key-field input:focus {
    border-color:#7aa7e8 !important;
    box-shadow:0 0 0 3px rgba(59,130,246,.08) !important;
}

body:not(.studio-theme-dark) .onboarding-key-btn,
body:not(.studio-theme-dark) .onboarding-save-btn,
body:not(.studio-theme-dark) .recommend-guide-key-btn,
html:not(.studio-theme-dark) body:not(.theme-dark) .onboarding-key-btn,
html:not(.studio-theme-dark) body:not(.theme-dark) .onboarding-save-btn,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-guide-key-btn {
    background:#ffffff !important;
    border-color:#ccd9e8 !important;
    color:#1f2937 !important;
}

body:not(.studio-theme-dark) .onboarding-save-btn,
html:not(.studio-theme-dark) body:not(.theme-dark) .onboarding-save-btn {
    background:#e7f0ff !important;
    border-color:#bdd3f2 !important;
    color:#163b6f !important;
}

body:not(.studio-theme-dark) .recommend-flow-arrow,
body:not(.studio-theme-dark) .recommend-vertical-arrow,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-flow-arrow,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-vertical-arrow {
    color:#3b82f6 !important;
}

body:not(.studio-theme-dark) .onboarding-badge,
body:not(.studio-theme-dark) .recommend-cap-icons span,
body:not(.studio-theme-dark) .recommend-tag,
html:not(.studio-theme-dark) body:not(.theme-dark) .onboarding-badge,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-cap-icons span,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-tag {
    background:#eaf2ff !important;
    border-color:#cfe0f5 !important;
    color:#2563eb !important;
}

body:not(.studio-theme-dark) .recommend-badge,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-badge {
    background:#ffffff !important;
    border-color:#d8e2ee !important;
    color:#667085 !important;
}

body:not(.studio-theme-dark) .recommend-advantages span::before,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-advantages span::before {
    background:#3b82f6 !important;
}

/* API 设置引导最终态：卡片到卡片，推荐平台单列 */
.onboarding-rh-linear-row {
    align-items:stretch !important;
}

.onboarding-rh-source-group,
.onboarding-rh-row-field {
    min-height:86px !important;
    justify-content:center !important;
}

.onboarding-rh-source-group {
    padding:11px 12px !important;
    border:1px solid var(--line) !important;
    border-radius:12px !important;
    background:var(--panel) !important;
    box-shadow:none !important;
}

.onboarding-rh-row-arrow {
    align-self:center !important;
    margin-bottom:0 !important;
}

.onboarding-rh-row-field {
    padding:11px 12px !important;
    border:1px solid var(--line) !important;
    border-radius:12px !important;
    background:var(--panel) !important;
    box-shadow:none !important;
}

.recommend-inline-body {
    grid-template-columns:1fr !important;
    gap:12px !important;
}

.recommend-platform-card {
    display:grid !important;
    grid-template-columns:minmax(260px, .86fr) minmax(360px, 1.14fr) !important;
    align-items:stretch !important;
    gap:14px !important;
    padding:15px !important;
    background:var(--soft) !important;
    border-color:var(--line) !important;
}

.recommend-platform-info,
.recommend-platform-setup {
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
}

.recommend-platform-info {
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    gap:9px !important;
}

.recommend-platform-head {
    align-items:flex-start !important;
}

.recommend-name {
    font-size:15px !important;
    font-weight:850 !important;
    letter-spacing:0 !important;
}

.recommend-platform-summary {
    margin:0 !important;
    max-width:54ch !important;
    font-size:12px !important;
    line-height:1.58 !important;
    font-weight:600 !important;
}

.recommend-tags,
.recommend-cap-icons {
    gap:5px !important;
}

.recommend-tag,
.recommend-cap-icons span,
.recommend-badge {
    font-weight:750 !important;
}

.recommend-platform-setup {
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    gap:8px !important;
}

.recommend-setup-title {
    color:var(--muted) !important;
    font-size:11px !important;
    font-weight:750 !important;
}

.recommend-setup-flow {
    display:grid !important;
    grid-template-columns:minmax(112px, .34fr) 36px minmax(0, 1fr) !important;
    align-items:center !important;
    gap:10px !important;
}

.recommend-guide-key-btn {
    width:100% !important;
    min-height:58px !important;
    height:auto !important;
    border-radius:12px !important;
    justify-content:center !important;
}

.recommend-guide-arrow {
    width:36px !important;
    min-width:36px !important;
    height:34px !important;
    color:#5b8fd8 !important;
}

.recommend-guide-arrow b {
    position:absolute;
    right:-2px;
    top:50%;
    width:16px;
    height:16px;
    transform:translateY(-50%);
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    background:var(--soft);
    color:currentColor;
    font-size:18px;
    line-height:1;
    font-weight:800;
}

.recommend-guide-save {
    min-height:70px !important;
    display:grid !important;
    grid-template-columns:minmax(0, 1fr) auto !important;
    align-items:end !important;
    gap:10px !important;
    padding:10px !important;
    border:1px solid var(--line) !important;
    border-radius:12px !important;
    background:var(--panel) !important;
}

.recommend-guide-save .onboarding-rh-row-field {
    min-height:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
}

.recommend-guide-save-btn {
    width:auto !important;
    min-width:86px !important;
}

.recommend-inline-card .recommend-note {
    margin:0 !important;
    padding:9px 11px !important;
    background:transparent !important;
    border-color:transparent !important;
    color:var(--muted) !important;
}

body:not(.studio-theme-dark) .onboarding-rh-row-field,
body:not(.studio-theme-dark) .onboarding-rh-source-group,
html:not(.studio-theme-dark) body:not(.theme-dark) .onboarding-rh-row-field,
html:not(.studio-theme-dark) body:not(.theme-dark) .onboarding-rh-source-group,
body:not(.studio-theme-dark) .recommend-guide-save,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-guide-save {
    background:#ffffff !important;
    border-color:#e3eaf3 !important;
}

body:not(.studio-theme-dark) .recommend-platform-card,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-platform-card {
    background:#f7f9fc !important;
    border-color:#dfe7f1 !important;
}

body:not(.studio-theme-dark) .recommend-platform-info,
body:not(.studio-theme-dark) .recommend-platform-setup,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-platform-info,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-platform-setup {
    background:transparent !important;
    border-color:transparent !important;
}

body.studio-theme-dark .onboarding-rh-row-field,
body.studio-theme-dark .onboarding-rh-source-group,
html.studio-theme-dark body .onboarding-rh-row-field,
html.studio-theme-dark body .onboarding-rh-source-group,
body.studio-theme-dark .recommend-guide-save,
html.studio-theme-dark body .recommend-guide-save {
    background:var(--panel) !important;
    border-color:var(--line-strong) !important;
}

body.studio-theme-dark .recommend-platform-card,
html.studio-theme-dark body .recommend-platform-card {
    background:var(--soft) !important;
    border-color:var(--line) !important;
}

@media (max-width:1060px) {
    .recommend-platform-card,
    .recommend-setup-flow {
        grid-template-columns:1fr !important;
    }

    .recommend-guide-arrow {
        justify-self:center !important;
        transform:rotate(90deg) !important;
    }
}

@media (max-width:720px) {
    .recommend-guide-save {
        grid-template-columns:1fr !important;
    }

    .recommend-guide-save-btn {
        width:100% !important;
    }
}

/* API 设置按钮与标签收敛 */
.recommend-cap-icons {
    display:none !important;
}

.recommend-single-action {
    grid-template-columns:1fr !important;
}

.recommend-guide-source {
    min-height:70px !important;
}

.recommend-guide-key-btn {
    min-height:34px !important;
    height:34px !important;
    border-radius:10px !important;
}

.onboarding-key-btn,
.recommend-guide-key-btn,
.onboarding-save-btn,
.recommend-guide-save-btn {
    transition:background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease !important;
}

.onboarding-key-btn:hover,
.recommend-guide-key-btn:hover {
    background:var(--soft) !important;
    border-color:var(--line-strong) !important;
    color:var(--text) !important;
    transform:translateY(-1px) !important;
}

.onboarding-save-btn,
.recommend-guide-save-btn {
    background:var(--soft) !important;
    border-color:transparent !important;
    color:var(--text) !important;
    box-shadow:none !important;
}

.onboarding-save-btn:hover,
.recommend-guide-save-btn:hover {
    background:var(--panel) !important;
    border-color:var(--line-strong) !important;
    color:var(--text) !important;
    transform:translateY(-1px) !important;
    box-shadow:none !important;
}

.recommend-tag,
.recommend-badge {
    background:rgba(102,112,133,.08) !important;
    border-color:rgba(102,112,133,.16) !important;
    color:var(--muted) !important;
}

body:not(.studio-theme-dark) .recommend-tag,
body:not(.studio-theme-dark) .recommend-badge,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-tag,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-badge {
    background:#edf1f5 !important;
    border-color:#dce3eb !important;
    color:#5f6b7a !important;
}

body.studio-theme-dark .recommend-tag,
body.studio-theme-dark .recommend-badge,
html.studio-theme-dark body .recommend-tag,
html.studio-theme-dark body .recommend-badge {
    background:rgba(148,163,184,.1) !important;
    border-color:rgba(148,163,184,.16) !important;
    color:var(--muted) !important;
}

.provider-onboarding-card .onboarding-save-btn,
.recommend-inline-card .onboarding-save-btn,
.recommend-inline-card .recommend-guide-save-btn,
body:not(.studio-theme-dark) .provider-onboarding-card .onboarding-save-btn,
body:not(.studio-theme-dark) .recommend-inline-card .onboarding-save-btn,
body:not(.studio-theme-dark) .recommend-inline-card .recommend-guide-save-btn,
html:not(.studio-theme-dark) body:not(.theme-dark) .provider-onboarding-card .onboarding-save-btn,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-inline-card .onboarding-save-btn,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-inline-card .recommend-guide-save-btn,
body.studio-theme-dark .provider-onboarding-card .onboarding-save-btn,
body.studio-theme-dark .recommend-inline-card .onboarding-save-btn,
body.studio-theme-dark .recommend-inline-card .recommend-guide-save-btn,
html.studio-theme-dark body .provider-onboarding-card .onboarding-save-btn,
html.studio-theme-dark body .recommend-inline-card .onboarding-save-btn,
html.studio-theme-dark body .recommend-inline-card .recommend-guide-save-btn {
    background:var(--api-light-primary) !important;
    border-color:var(--api-light-primary) !important;
    color:#f8fafc !important;
    box-shadow:none !important;
}

.provider-onboarding-card .onboarding-save-btn:hover,
.recommend-inline-card .onboarding-save-btn:hover,
.recommend-inline-card .recommend-guide-save-btn:hover,
body:not(.studio-theme-dark) .provider-onboarding-card .onboarding-save-btn:hover,
body:not(.studio-theme-dark) .recommend-inline-card .onboarding-save-btn:hover,
body:not(.studio-theme-dark) .recommend-inline-card .recommend-guide-save-btn:hover,
html:not(.studio-theme-dark) body:not(.theme-dark) .provider-onboarding-card .onboarding-save-btn:hover,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-inline-card .onboarding-save-btn:hover,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-inline-card .recommend-guide-save-btn:hover,
body.studio-theme-dark .provider-onboarding-card .onboarding-save-btn:hover,
body.studio-theme-dark .recommend-inline-card .onboarding-save-btn:hover,
body.studio-theme-dark .recommend-inline-card .recommend-guide-save-btn:hover,
html.studio-theme-dark body .provider-onboarding-card .onboarding-save-btn:hover,
html.studio-theme-dark body .recommend-inline-card .onboarding-save-btn:hover,
html.studio-theme-dark body .recommend-inline-card .recommend-guide-save-btn:hover {
    background:var(--api-light-primary-hover) !important;
    border-color:var(--api-light-primary-hover) !important;
    color:#ffffff !important;
    transform:translateY(-1px) !important;
    box-shadow:none !important;
}

body.studio-theme-dark .provider-onboarding-card .onboarding-save-btn,
body.studio-theme-dark .recommend-inline-card .onboarding-save-btn,
body.studio-theme-dark .recommend-inline-card .recommend-guide-save-btn,
html.studio-theme-dark body .provider-onboarding-card .onboarding-save-btn,
html.studio-theme-dark body .recommend-inline-card .onboarding-save-btn,
html.studio-theme-dark body .recommend-inline-card .recommend-guide-save-btn {
    background:var(--api-dark-primary) !important;
    border-color:var(--api-dark-primary) !important;
    color:#0f172a !important;
}

body.studio-theme-dark .provider-onboarding-card .onboarding-save-btn:hover,
body.studio-theme-dark .recommend-inline-card .onboarding-save-btn:hover,
body.studio-theme-dark .recommend-inline-card .recommend-guide-save-btn:hover,
html.studio-theme-dark body .provider-onboarding-card .onboarding-save-btn:hover,
html.studio-theme-dark body .recommend-inline-card .onboarding-save-btn:hover,
html.studio-theme-dark body .recommend-inline-card .recommend-guide-save-btn:hover {
    background:var(--api-dark-primary-hover) !important;
    border-color:var(--api-dark-primary-hover) !important;
    color:#0f172a !important;
}

.recommend-setup-flow {
    grid-template-columns:minmax(148px, .44fr) 36px minmax(0, 1fr) !important;
}

.recommend-guide-source {
    min-width:148px !important;
}

.recommend-guide-key-btn {
    gap:6px !important;
    min-width:128px !important;
    padding:0 16px !important;
}

.recommend-setup-flow {
    grid-template-columns:minmax(180px, .5fr) 42px minmax(0, 1fr) !important;
}

.recommend-guide-source {
    min-width:180px !important;
}

.recommend-guide-key-btn {
    min-width:156px !important;
    padding:0 20px !important;
}

.recommend-guide-arrow {
    width:42px !important;
    min-width:42px !important;
}

.recommend-guide-arrow span {
    animation:recommendDashFlow 1.15s linear infinite !important;
}

.onboarding-rh-row-arrow span {
    animation:recommendDashFlow 1.15s linear infinite !important;
}

.onboarding-rh-linear-row,
.onboarding-ms-linear-row {
    grid-template-columns:minmax(190px, .9fr) 42px minmax(220px, 1.1fr) !important;
}

.onboarding-ms-linear-row {
    grid-template-columns:minmax(220px, .95fr) 42px minmax(260px, 1.05fr) !important;
}

.onboarding-rh-row-arrow {
    width:42px !important;
    min-width:42px !important;
    color:#5b8fd8 !important;
}

.onboarding-rh-row-arrow span {
    right:8px !important;
}

.onboarding-rh-row-arrow b {
    position:absolute;
    right:1px;
    top:50%;
    width:8px;
    height:8px;
    border-top:2px solid currentColor;
    border-right:2px solid currentColor;
    border-radius:1px;
    background:transparent;
    transform:translateY(-50%) rotate(45deg);
    font-size:0;
    line-height:0;
}

@media (prefers-reduced-motion: reduce) {
    .onboarding-rh-row-arrow span,
    .recommend-guide-arrow span {
        animation:none !important;
    }
}

@media (max-width:780px) {
    .onboarding-rh-linear-row,
    .onboarding-ms-linear-row {
        grid-template-columns:1fr !important;
    }

    .onboarding-rh-row-arrow {
        justify-self:center !important;
        transform:rotate(90deg) !important;
    }
}

.recommend-account-invite {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:12px 14px;
    border:1px solid var(--line);
    border-radius:12px;
    background:var(--soft);
}

.recommend-account-title {
    color:var(--text);
    font-size:12.5px;
    line-height:1.25;
    font-weight:850;
}

.recommend-account-desc {
    margin-top:3px;
    color:var(--muted);
    font-size:11px;
    line-height:1.35;
    font-weight:650;
}

.recommend-account-link {
    flex:0 0 auto;
    min-width:112px;
    height:34px !important;
    padding:0 12px !important;
}

body:not(.studio-theme-dark) .recommend-account-invite,
html:not(.studio-theme-dark) body:not(.theme-dark) .recommend-account-invite {
    background:#f7f9fc;
    border-color:#dfe7f1;
}

body.studio-theme-dark .recommend-account-invite,
html.studio-theme-dark body .recommend-account-invite {
    background:var(--soft);
    border-color:var(--line);
}

@media (max-width:640px) {
    .recommend-account-invite {
        align-items:stretch;
        flex-direction:column;
    }

    .recommend-account-link {
        width:100%;
    }
}

.recommend-guide-arrow span {
    right:8px !important;
}

.recommend-guide-arrow b {
    right:1px !important;
    width:8px !important;
    height:8px !important;
    border-top:2px solid currentColor !important;
    border-right:2px solid currentColor !important;
    border-radius:1px !important;
    background:transparent !important;
    transform:translateY(-50%) rotate(45deg) !important;
    font-size:0 !important;
}

/* 平台列表拖拽与 RunningHub 白天层级增强 */
.sidebar {
    overflow:hidden !important;
}

.provider-list {
    flex:1 1 auto !important;
    min-height:120px !important;
    max-height:calc(100vh - 250px) !important;
    overflow-y:auto !important;
    overscroll-behavior:contain !important;
    padding-right:2px !important;
}

.provider-card-sortable {
    grid-template-columns:14px 30px minmax(0,1fr) auto !important;
    cursor:grab !important;
}

.provider-card-sortable:active {
    cursor:grabbing !important;
}

.provider-drag-handle {
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--faint);
    opacity:.62;
}

.provider-card-sortable:hover .provider-drag-handle,
.provider-card-sortable.is-dragging .provider-drag-handle {
    color:var(--muted);
    opacity:1;
}

.provider-card-sortable.is-dragging {
    opacity:.55;
}

.provider-card-drop-target {
    background:var(--soft) !important;
    box-shadow:inset 0 0 0 1px var(--line-strong) !important;
}

body:not(.studio-theme-dark) .runninghub-config-block,
html:not(.studio-theme-dark) body:not(.theme-dark) .runninghub-config-block {
    background:#ffffff !important;
    border-color:#dfe7f1 !important;
}

body:not(.studio-theme-dark) .rh-paste-row,
html:not(.studio-theme-dark) body:not(.theme-dark) .rh-paste-row {
    background:#f1f4f8 !important;
    border:1px solid #e0e7f0 !important;
}

body:not(.studio-theme-dark) .rh-card-group,
html:not(.studio-theme-dark) body:not(.theme-dark) .rh-card-group {
    background:#f3f6fa !important;
    border-color:#d8e1ec !important;
}

body:not(.studio-theme-dark) .rh-group-head,
html:not(.studio-theme-dark) body:not(.theme-dark) .rh-group-head {
    padding:2px 4px 6px !important;
}

body:not(.studio-theme-dark) .rh-group-title,
html:not(.studio-theme-dark) body:not(.theme-dark) .rh-group-title {
    color:#243246 !important;
}

body:not(.studio-theme-dark) .rh-group-count,
html:not(.studio-theme-dark) body:not(.theme-dark) .rh-group-count {
    background:#ffffff !important;
    border:1px solid #d9e2ee !important;
    color:#5f6b7a !important;
}

body:not(.studio-theme-dark) .rh-config-card,
html:not(.studio-theme-dark) body:not(.theme-dark) .rh-config-card,
body:not(.studio-theme-dark) .rh-empty,
html:not(.studio-theme-dark) body:not(.theme-dark) .rh-empty {
    background:#ffffff !important;
    border-color:#cfd9e6 !important;
}

body:not(.studio-theme-dark) .rh-thumb,
html:not(.studio-theme-dark) body:not(.theme-dark) .rh-thumb,
body:not(.studio-theme-dark) .rh-card-main input,
body:not(.studio-theme-dark) .rh-card-main textarea,
html:not(.studio-theme-dark) body:not(.theme-dark) .rh-card-main input,
html:not(.studio-theme-dark) body:not(.theme-dark) .rh-card-main textarea {
    background:#f6f8fb !important;
    border-color:#dbe3ee !important;
}

body:not(.studio-theme-dark) .rh-card-title-field input,
html:not(.studio-theme-dark) body:not(.theme-dark) .rh-card-title-field input {
    background:#ffffff !important;
    border-color:#cfd9e6 !important;
}

@media (max-height:760px) {
    .provider-list {
        max-height:calc(100vh - 220px) !important;
    }
}

@media (max-width:860px) {
    .sidebar {
        overflow:visible !important;
    }

    .provider-list {
        max-height:360px !important;
    }
}

/* 黑夜模式下突出左侧推荐 API 入口 */
body.studio-theme-dark .api-link-btn,
body.studio-theme-dark .api-link-btn:hover,
body.studio-theme-dark.show-recommend-mode .api-link-btn,
html.studio-theme-dark body .api-link-btn,
html.studio-theme-dark body .api-link-btn:hover,
html.studio-theme-dark body.show-recommend-mode .api-link-btn {
    background:#f8fafc !important;
    border-color:#ffffff !important;
    color:#0f172a !important;
    box-shadow:0 10px 24px rgba(0,0,0,.3), 0 0 0 1px rgba(255,255,255,.08) !important;
}

body.studio-theme-dark .api-link-btn:hover,
body.studio-theme-dark.show-recommend-mode .api-link-btn:hover,
html.studio-theme-dark body .api-link-btn:hover,
html.studio-theme-dark body.show-recommend-mode .api-link-btn:hover {
    background:#ffffff !important;
    border-color:#ffffff !important;
    color:#020617 !important;
}

/* 恢复 API 引导里的虚线流动动画 */
.api-link-btn {
    position:relative !important;
    overflow:hidden !important;
    border:1px dashed var(--line-strong) !important;
}

.api-link-btn::after {
    content:"" !important;
    display:block !important;
    position:absolute !important;
    inset:-1px auto -1px -45% !important;
    width:34% !important;
    pointer-events:none !important;
    transform:skewX(-18deg) !important;
    background:linear-gradient(90deg, transparent, rgba(255,255,255,.34), transparent) !important;
    animation:recommendEntrySweep 2.4s ease-in-out infinite !important;
}

body.studio-theme-dark .api-link-btn::after,
html.studio-theme-dark body .api-link-btn::after {
    background:linear-gradient(90deg, transparent, rgba(15,23,42,.18), transparent) !important;
}

.recommend-flow-arrow span,
.onboarding-rh-row-arrow span,
.recommend-guide-arrow span {
    display:block !important;
    background-image:repeating-linear-gradient(90deg, currentColor 0 5px, transparent 5px 9px) !important;
    background-size:18px 2px !important;
    animation:recommendDashFlow 1.15s linear infinite !important;
    opacity:.86 !important;
}

.recommend-flow-arrow i {
    animation:recommendArrowNudge 1.15s ease-in-out infinite !important;
}

@media (prefers-reduced-motion: reduce) {
    .api-link-btn::after,
    .recommend-flow-arrow span,
    .recommend-flow-arrow i,
    .onboarding-rh-row-arrow span,
    .recommend-guide-arrow span {
        animation:none !important;
    }
}

/* ========== Patch Bay 布局（信号配线盘）· 保留现有色板 ========== */
.page.api-patch .wrap {
    max-width:1440px;
}

.page.api-patch .page-head {
    align-items:center;
    padding:14px 20px;
    margin-bottom:18px;
    background:var(--panel);
    border:1px solid var(--line);
    border-radius:10px;
    position:relative;
    gap:20px;
}

.page.api-patch .page-head::before {
    content:"";
    position:absolute;
    inset:0;
    border-radius:10px;
    pointer-events:none;
    background:repeating-linear-gradient(90deg, transparent 0 22px, color-mix(in srgb, var(--line) 55%, transparent) 22px 23px);
}

.page.api-patch .page-head-brand,
.page.api-patch .page-head-aside {
    position:relative;
    z-index:1;
}

.page.api-patch .page-head-aside {
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    gap:8px;
    margin-left:auto;
}

.page.api-patch .page-head .title {
    font-size:clamp(22px,2vw,28px);
    letter-spacing:-.015em;
}

.page.api-patch .page-head .sub {
    max-width:640px;
    margin-top:6px;
    font-size:12.5px;
}

.page.api-patch .api-hud {
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:8px;
    font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
    font-size:11px;
}

.page.api-patch .api-hud-chip {
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:5px 10px;
    border:1px solid var(--line);
    border-radius:6px;
    color:var(--muted);
    background:var(--soft);
}

.page.api-patch .api-hud-chip em {
    font-style:normal;
    color:var(--text);
    font-weight:600;
}

.page.api-patch .api-dot {
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--faint);
    flex:none;
}

.page.api-patch .api-dot.g {
    background:var(--signal-green);
    box-shadow:0 0 8px color-mix(in srgb, var(--signal-green) 55%, transparent);
}

.page.api-patch .api-dot.a {
    background:var(--signal-wait);
    box-shadow:0 0 8px color-mix(in srgb, var(--signal-wait) 45%, transparent);
}

.page.api-patch .api-dot.r {
    background:var(--signal-red);
    box-shadow:0 0 8px color-mix(in srgb, var(--signal-red) 50%, transparent);
}

.page.api-patch .page-head .status {
    min-height:0;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    font-size:11px;
    letter-spacing:.02em;
    text-transform:none;
}

.page.api-patch .layout {
    grid-template-columns:252px minmax(0,1fr);
    gap:18px;
}

@media (max-width:1000px) {
    .page.api-patch .layout {
        grid-template-columns:1fr;
    }

    .page.api-patch .sidebar {
        position:relative;
        top:auto;
        max-height:none;
    }
}

.page.api-patch .sidebar {
    top:18px;
    gap:0;
    padding:0;
    border-radius:10px;
    overflow:hidden;
    background:var(--panel);
    border-color:var(--line);
    box-shadow:none;
    backdrop-filter:none;
}

.page.api-patch .side-section-title {
    padding:13px 16px;
    margin:0;
    border-bottom:1px solid var(--line);
    letter-spacing:.12em;
}

.page.api-patch .provider-list {
    gap:0;
    max-height:520px;
    margin:0;
    padding:0;
    border-bottom:1px solid var(--line);
    overflow-y:auto;
}

.page.api-patch .provider-card {
    min-height:0;
    padding:11px 16px;
    border:0;
    border-bottom:1px solid var(--line);
    border-radius:0;
    background:transparent;
    box-shadow:none;
    transform:none;
    color:var(--muted);
}

.page.api-patch .provider-card:last-child {
    border-bottom:0;
}

.page.api-patch .provider-card:hover {
    background:var(--soft);
    border-color:var(--line);
    box-shadow:none;
    transform:none;
}

.page.api-patch .provider-card.active {
    background:var(--accent-soft);
    border-color:var(--line);
    box-shadow:inset 3px 0 0 var(--accent);
}

.page.api-patch .provider-card.active:hover {
    background:var(--accent-soft);
}

.page.api-patch .provider-card.provider-card-sortable {
    grid-template-columns:auto auto minmax(0,1fr) auto;
    align-items:flex-start;
    gap:9px;
}

.page.api-patch .provider-drag-handle {
    align-self:center;
    opacity:.45;
}

.page.api-patch .provider-mark {
    width:8px;
    height:8px;
    min-width:8px;
    border-radius:50%;
    background:var(--faint);
    padding:0;
    align-self:center;
}

.page.api-patch .provider-mark i,
.page.api-patch .provider-mark svg {
    display:none;
}

.page.api-patch .provider-card.has-key .provider-mark {
    background:var(--signal-green);
    box-shadow:0 0 8px color-mix(in srgb, var(--signal-green) 50%, transparent);
}

.page.api-patch .provider-card.missing-key .provider-mark {
    background:var(--signal-wait);
}

.page.api-patch .provider-card.is-disabled .provider-mark {
    background:var(--faint);
    opacity:.55;
}

.page.api-patch .provider-info {
    min-width:0;
}

.page.api-patch .provider-name {
    font-size:13.5px;
    font-weight:700;
    color:var(--text);
}

.page.api-patch .provider-meta {
    margin-top:3px;
    font-size:10px;
    font-weight:600;
    font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
}

.page.api-patch .provider-side-meta {
    flex-direction:row;
    align-items:center;
    gap:8px;
    min-width:0;
}

.page.api-patch .provider-status-dot {
    width:6px;
    height:6px;
}

.page.api-patch .provider-card.has-key .provider-status-dot {
    background:var(--signal-green);
    box-shadow:0 0 6px color-mix(in srgb, var(--signal-green) 45%, transparent);
}

.page.api-patch .provider-card.missing-key .provider-status-dot {
    background:var(--signal-wait);
}

.page.api-patch .provider-protocol-pill {
    min-width:0;
    max-width:none;
    height:auto;
    padding:1px 6px;
    border:1px solid var(--line-strong);
    border-radius:4px;
    background:transparent;
    color:var(--faint);
    font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
    font-size:9.5px;
    font-weight:600;
    letter-spacing:.5px;
    text-transform:none;
}

.page.api-patch .provider-card.active .provider-protocol-pill {
    background:transparent;
    color:var(--muted);
    border-color:var(--line-strong);
}

.page.api-patch .provider-card.provider-card-banner {
    padding:11px 16px;
    min-height:0;
}

.page.api-patch .provider-banner-inner {
    gap:8px;
}

.page.api-patch .sidebar > .add-btn,
.page.api-patch .sidebar > .api-link-btn {
    width:auto;
    margin-left:10px;
    margin-right:10px;
}

.page.api-patch .sidebar > .add-btn {
    margin-top:10px;
    margin-bottom:0;
    border-style:dashed;
    border-radius:8px;
    height:38px;
}

.page.api-patch .sidebar > .api-link-btn {
    margin-top:8px;
    margin-bottom:10px;
    border-radius:8px;
    height:38px;
}

.page.api-patch .content {
    gap:18px;
}

.page.api-patch .content-head,
.page.api-patch .block,
.page.api-patch .agent-llm-block {
    border-radius:10px;
    overflow:hidden;
    border-color:var(--line);
    background:var(--panel);
    box-shadow:none;
    backdrop-filter:none;
}

.page.api-patch .content-head {
    padding:13px 18px;
    align-items:center;
    justify-content:space-between;
    background:linear-gradient(180deg, color-mix(in srgb, var(--soft) 65%, transparent), transparent);
}

.page.api-patch .content-head > div:first-child {
    padding:0;
    border-bottom:0;
    background:transparent;
    min-width:0;
    flex:1 1 280px;
}

.page.api-patch .content-head .content-actions {
    padding:0;
    align-self:center;
    flex-shrink:0;
}

.page.api-patch .block,
.page.api-patch .agent-llm-block {
    padding:0;
    gap:0;
}

.page.api-patch .block-head {
    padding:13px 18px;
    margin-bottom:0;
    border-bottom:1px solid var(--line);
    background:linear-gradient(180deg, color-mix(in srgb, var(--soft) 65%, transparent), transparent);
}

.page.api-patch .block-title {
    font-size:15px;
    font-weight:700;
    letter-spacing:.02em;
    text-transform:none;
}

.page.api-patch .block-desc {
    font-size:11.5px;
    margin-top:2px;
}

.page.api-patch .block > .form,
.page.api-patch .agent-llm-form,
.page.api-patch .block > .model-list,
.page.api-patch .block > .lora-list,
.page.api-patch .block > .rh-paste-row,
.page.api-patch .block > .rh-card-columns,
.page.api-patch .block.models-toolbar {
    padding:18px;
}

.page.api-patch .block.models-toolbar {
    flex-direction:row;
    align-items:center;
    margin-bottom:0;
}

.page.api-patch .model-grid {
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px;
}

.page.api-patch .model-grid .block {
    min-width:0;
    height:100%;
}

.page.api-patch .model-grid .ms-lora-block {
    grid-column:1 / -1;
}

@media (max-width:1000px) {
    .page.api-patch .model-grid {
        grid-template-columns:1fr;
    }
}

.page.api-patch .field-frame:focus-within {
    border-color:var(--accent);
    box-shadow:0 0 0 2px var(--accent-soft);
}

body.studio-theme-dark .page.api-patch .field-frame:focus-within,
html.studio-theme-dark body .page.api-patch .field-frame:focus-within {
    border-color:var(--accent);
    box-shadow:0 0 0 2px var(--accent-soft);
}

.page.api-patch .key-panel {
    border-radius:8px;
    background:var(--soft);
    border-color:var(--line);
}

.page.api-patch .key-input-line .field-frame {
    border-radius:7px;
}

.page.api-patch .key-btn {
    width:36px;
    height:36px;
    border-radius:7px;
}

.page.api-patch .verify-action-row {
    margin-top:4px;
}

.page.api-patch .model-list {
    gap:2px;
}

.page.api-patch .model-row {
    border-color:transparent;
    background:transparent;
    border-radius:7px;
    padding:8px 10px;
}

.page.api-patch .model-row:hover {
    background:var(--soft);
}

.page.api-patch .ghost-btn {
    border-style:dashed;
    border-color:var(--line-strong);
    color:var(--faint);
    font-size:11.5px;
}

.page.api-patch .ghost-btn:hover {
    border-color:var(--accent);
    color:var(--text);
}

.page.api-patch .agent-llm-block {
    margin-bottom:18px;
}

.page.api-patch .agent-llm-form {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px 20px;
}

@media (max-width:860px) {
    .page.api-patch .agent-llm-form {
        grid-template-columns:1fr;
    }

    .page.api-patch .page-head-aside {
        align-items:flex-start;
        width:100%;
    }

    .page.api-patch .api-hud {
        justify-content:flex-start;
    }
}

body.studio-theme-dark .page.api-patch .sidebar,
html.studio-theme-dark body .page.api-patch .sidebar,
body.studio-theme-dark .page.api-patch .block,
html.studio-theme-dark body .page.api-patch .block,
body.studio-theme-dark .page.api-patch .content-head,
html.studio-theme-dark body .page.api-patch .content-head,
body.studio-theme-dark .page.api-patch .agent-llm-block,
html.studio-theme-dark body .page.api-patch .agent-llm-block {
    background:var(--panel);
    border-color:var(--line);
}

body.studio-theme-dark .page.api-patch .provider-card:hover,
html.studio-theme-dark body .page.api-patch .provider-card:hover {
    background:var(--soft);
}

body.studio-theme-dark .page.api-patch .provider-card.active,
html.studio-theme-dark body .page.api-patch .provider-card.active {
    background:var(--accent-soft);
    box-shadow:inset 3px 0 0 var(--accent);
}

body.studio-theme-dark .page.api-patch .model-row:hover,
html.studio-theme-dark body .page.api-patch .model-row:hover {
    background:var(--soft);
}

/* ========== Patch Bay v2 · 对齐设计稿布局（色板仍用现有变量） ========== */
.page.api-patch .title-dot { color: var(--accent); font-weight: 700; margin: 0 .06em; }
.page.api-patch .sub-kicker {
  margin-top: 4px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 10.5px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--faint);
}
.page.api-patch .page-head .sub { margin-top: 8px; }

.page.api-patch .patch {
  display: grid;
  gap: 18px;
  min-width: 0;
}
.page.api-patch .patch > .agent-llm-block { margin-bottom: 0; }
.page.api-patch .agent-llm-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 16px 18px 18px;
}

.page.api-patch .sidebar.ports {
  padding: 0;
  gap: 0;
  overflow: hidden;
}
.page.api-patch .ports-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 13px 16px;
  border-bottom: 1px solid var(--line);
}
.page.api-patch .ports-head-t {
  font-size: 11px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--faint);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}
.page.api-patch .ports-head-n {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11px;
  color: var(--accent);
  font-weight: 700;
}
.page.api-patch .port-list,
.page.api-patch .sidebar.ports .provider-list {
  max-height: min(520px, calc(100vh - 280px));
  overflow: auto;
  gap: 0;
  padding: 0;
  margin: 0;
  border: 0;
}
.page.api-patch .ports-foot {
  padding: 10px;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 8px;
}
.page.api-patch .ports-foot .add-btn,
.page.api-patch .ports-foot .api-link-btn {
  margin: 0;
  border-radius: 8px;
  height: auto;
  min-height: 38px;
  padding: 9px;
  animation: none;
}
.page.api-patch .ports-foot .api-link-btn i,
.page.api-patch .ports-foot .api-link-btn svg { animation: none; }

.page.api-patch .provider-card.provider-card-port {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 5px;
  border: none;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  padding: 11px 16px;
  min-height: 0;
  background: transparent;
}
.page.api-patch .provider-card.provider-card-port:hover {
  background: var(--accent-soft);
  border-color: var(--line);
  color: var(--text);
}
.page.api-patch .provider-card.provider-card-port.active {
  background: var(--accent-soft);
  box-shadow: inset 3px 0 0 var(--accent);
  border-color: var(--line);
}
.page.api-patch .port-row1,
.page.api-patch .port-row2 {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}
.page.api-patch .port-row2 { padding-left: 17px; }
.page.api-patch .provider-card-port .provider-status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex: none;
  background: var(--faint);
}
.page.api-patch .provider-card-port.has-key .provider-status-dot {
  background: var(--signal-green);
  box-shadow: 0 0 8px color-mix(in srgb, var(--signal-green) 55%, transparent);
}
.page.api-patch .provider-card-port.missing-key .provider-status-dot {
  background: var(--signal-wait);
}
.page.api-patch .provider-card-port.is-disabled .provider-status-dot {
  background: var(--signal-red);
}
.page.api-patch .provider-card-port .provider-name {
  flex: 1;
  min-width: 0;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--text);
}
.page.api-patch .port-lat,
.page.api-patch .port-models {
  margin-left: auto;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 10px;
  color: var(--faint);
  flex: none;
}
.page.api-patch .port-enable {
  width: 28px;
  height: 16px;
  border-radius: 999px;
  background: #cbd5e1;
  position: relative;
  flex: none;
  margin-left: 0;
}
.page.api-patch .port-enable.on { background: var(--signal-green); }
.page.api-patch .port-enable::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15,23,42,.2);
  transition: left .15s ease;
}
.page.api-patch .port-enable.on::after { left: 14px; }
.page.api-patch .provider-enable-toggle {
  height: 34px;
  padding: 0 10px 0 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--soft);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 800;
  color: var(--muted);
}
.page.api-patch .provider-enable-toggle.on {
  border-color: color-mix(in srgb, var(--signal-green) 55%, var(--line));
  color: var(--signal-green);
  background: var(--signal-green-soft);
}
.page.api-patch .provider-enable-knob {
  width: 28px;
  height: 16px;
  border-radius: 999px;
  background: #cbd5e1;
  position: relative;
  flex: none;
}
.page.api-patch .provider-enable-toggle.on .provider-enable-knob { background: var(--signal-green); }
.page.api-patch .provider-enable-knob::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15,23,42,.2);
  transition: left .15s ease;
}
.page.api-patch .provider-enable-toggle.on .provider-enable-knob::after { left: 14px; }
.page.api-patch .provider-card-port .provider-protocol-pill {
  margin-left: 0;
  height: auto;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 9.5px;
  letter-spacing: .5px;
}

.page.api-patch .content { gap: 18px; }
.page.api-patch .content-head.seg-head,
.page.api-patch .block .seg-head,
.page.api-patch .block-head.seg-head {
  background: linear-gradient(0deg, transparent, var(--accent-soft));
  padding: 13px 18px;
  margin: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  align-items: center;
}
.page.api-patch .block.seg {
  padding: 0;
  gap: 0;
  overflow: hidden;
}
.page.api-patch .seg-body,
.page.api-patch .block.seg > .form,
.page.api-patch .block.seg > .agent-llm-form {
  padding: 18px;
}
.page.api-patch .patch-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 20px;
}
.page.api-patch .patch-form .field.full,
.page.api-patch .patch-form .full,
.page.api-patch .patch-form .verify-action-row,
.page.api-patch .patch-form .jimeng-cli-panel {
  grid-column: 1 / -1;
}
.page.api-patch .patch-form .label {
  font-size: 11px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: var(--faint);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-weight: 600;
}
.page.api-patch .patch-form .label b {
  color: var(--accent);
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
}
.page.api-patch #idPreviewInput {
  color: var(--faint);
  cursor: default;
}
.page.api-patch .keyok {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 10.5px;
}
.page.api-patch .siglog-host {
  margin-top: 4px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11px;
  line-height: 1.7;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--soft);
  padding: 12px 14px;
}

.page.api-patch .model-grid.tracks {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.page.api-patch .track {
  padding: 0;
  gap: 0;
  overflow: hidden;
}
.page.api-patch .track-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 13px 16px;
  border-bottom: 1px solid var(--line);
}
.page.api-patch .track-ic {
  width: 26px;
  height: 26px;
  border-radius: 7px;
  display: grid;
  place-items: center;
  flex: none;
}
.page.api-patch .track-ic.img { background: var(--accent-soft); color: var(--accent); }
.page.api-patch .track-ic.chat { background: var(--signal-green-soft); color: var(--signal-green); }
.page.api-patch .track-ic.vid { background: color-mix(in srgb, var(--signal-red) 12%, transparent); color: var(--signal-red); }
.page.api-patch .track-t { font-size: 13.5px; font-weight: 700; }
.page.api-patch .track-n {
  margin-left: auto;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11px;
  color: var(--faint);
}
.page.api-patch .track .model-list {
  display: grid;
  gap: 2px;
  padding: 8px;
}
.page.api-patch .track .model-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 7px;
  border: 0;
  background: transparent;
}
.page.api-patch .track .model-row.has-video-caps {
  flex-wrap: wrap;
  align-items: flex-start;
}
.page.api-patch .track .model-row .video-caps-panel {
  flex: 1 1 100%;
  display: grid;
  gap: 6px;
  margin: 4px 0 2px 14px;
}
.video-caps-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--muted);
}
.video-caps-row > span {
  width: 48px;
  flex: none;
  color: var(--faint);
}
.video-cap {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid var(--line);
  cursor: pointer;
  user-select: none;
  line-height: 1.4;
}
.video-cap input {
  margin: 0;
  width: 12px;
  height: 12px;
}
.video-cap.on {
  border-color: var(--accent);
  color: var(--text);
  background: color-mix(in srgb, var(--accent) 14%, transparent);
}
.video-cap-custom {
  width: 68px;
  height: 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--text);
  font-size: 11px;
  padding: 0 6px;
}
.page.api-patch .track .model-row:hover { background: var(--soft); }
.page.api-patch .track .model-sig {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--line-strong);
  flex: none;
}
.page.api-patch .track .model-row:hover .model-sig { background: var(--accent); }
.page.api-patch .track .model-row input {
  flex: 1;
  min-width: 0;
  border: 0;
  background: transparent;
  padding: 0;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 12px;
  color: var(--muted);
}
.page.api-patch .track .model-row input.video-cap-custom {
  flex: none;
  font-family: inherit;
  font-weight: 400;
  border: 1px solid var(--line);
  background: var(--panel);
  padding: 0 6px;
}
.page.api-patch .track .model-row .model-alias-input {
  font-family: inherit;
  color: var(--text);
  font-weight: 600;
}
.page.api-patch .track .model-del { opacity: 0; }
.page.api-patch .track .model-row:hover .model-del { opacity: 1; }
.page.api-patch .madd {
  margin: 4px 10px 12px;
  padding: 8px;
  border: 1px dashed var(--line-strong);
  border-radius: 7px;
  background: transparent;
  color: var(--faint);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-size: 11.5px;
  font-weight: 700;
  width: calc(100% - 20px);
}
.page.api-patch .madd:hover {
  border-color: var(--accent);
  color: var(--accent);
}
.page.api-patch .models-toolbar.seg {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding: 13px 18px;
}
.page.api-patch .patch-foot {
  margin-top: 0;
  padding: 14px 18px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 10px;
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 11px;
  color: var(--faint);
}
.page.api-patch .patch-foot b { color: var(--accent); font-weight: 600; }
.page.api-patch .patch-foot-sp {
  margin-left: auto;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 10px;
  letter-spacing: 1px;
}

@media (max-width: 1000px) {
  .page.api-patch .model-grid.tracks { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .page.api-patch .patch-form { grid-template-columns: 1fr; }
  .page.api-patch .agent-llm-form { grid-template-columns: 1fr; }
}
