/* Local visual refinement. Original HTML, navigation, ordering and application scripts remain unchanged. */
html[data-ui-refined]{--refine-radius:12px;--refine-control:40px;--refine-body:14px;--refine-small:13px;--refine-shadow:0 5px 18px rgba(58,65,91,.055)}
html[data-ui-refined].theme-light{--wl-radius:14px;--wl-shadow:var(--refine-shadow);--wl-shadow-sm:0 2px 10px rgba(58,65,91,.04);--shadow:var(--refine-shadow);--wl-line:rgba(89,104,133,.15);--line:rgba(89,104,133,.16);--muted:#626d7e;--wl-muted:#626d7e}
html[data-ui-refined].theme-light body:not(.admin-page){background:radial-gradient(ellipse at 8% 0%,rgba(128,103,255,.065),transparent 48%),#f8f9fc}
html[data-ui-refined] body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}
html[data-ui-refined] body .home-nav{border-radius:16px;gap:8px;padding:8px 14px;box-shadow:var(--refine-shadow)}
html[data-ui-refined] body .main-nav-links{gap:8px;align-items:center}
html[data-ui-refined] body .main-nav-links a,html[data-ui-refined] body .console-main-nav a{font-size:var(--refine-small);line-height:1.4;min-height:36px;padding:7px 12px;border-radius:8px}
html[data-ui-refined] body .platform-home-nav nav a{font-size:var(--refine-small);min-height:36px;line-height:1.4;padding:7px 10px;border-radius:8px}
html[data-ui-refined] body .platform-home-nav{border-bottom:1px solid var(--line);box-shadow:none}
html[data-ui-refined] body .nav-actions{gap:8px;min-width:0;align-items:center}
html[data-ui-refined] body .nav-actions a{font-size:var(--refine-small);min-height:36px;padding:7px 12px}
html[data-ui-refined] body .panel{border-radius:var(--refine-radius);box-shadow:var(--refine-shadow)}
html[data-ui-refined] body .section-title{margin-bottom:16px}
html[data-ui-refined] body .field>label{font-size:var(--refine-small);font-weight:500;line-height:1.5}
html[data-ui-refined] body input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),html[data-ui-refined] body select{min-height:var(--refine-control);height:var(--refine-control);font-size:var(--refine-body);border-radius:8px}
html[data-ui-refined] body textarea{font-size:var(--refine-body);line-height:1.7;border-radius:8px}
html[data-ui-refined] body button.primary,html[data-ui-refined] body button.secondary{min-height:var(--refine-control);font-size:var(--refine-body);border-radius:8px}
html[data-ui-refined] body .prompt-library{padding:14px;border-radius:10px;gap:12px}
html[data-ui-refined] body .prompt-library-head strong,html[data-ui-refined] body .prompt-library-actions button{font-size:var(--refine-small)}
html[data-ui-refined] body .prompt-library-editor textarea{min-height:88px}
html[data-ui-refined] body .platform-home-copy>span{font-size:16px;line-height:1.85;color:var(--muted)}
html[data-ui-refined] body .platform-home-actions a{min-height:44px;font-size:var(--refine-body);border-radius:8px}
html[data-ui-refined] body .platform-home-preview{border-radius:var(--refine-radius);box-shadow:var(--refine-shadow)}
html[data-ui-refined] body .platform-feature-grid{gap:16px}
html[data-ui-refined] body .platform-feature-grid>a{border-radius:var(--refine-radius);padding:20px;box-shadow:none}
html[data-ui-refined] body .platform-feature-grid>a strong{font-size:16px;line-height:1.5}
html[data-ui-refined] body .platform-feature-grid>a span{font-size:var(--refine-body);line-height:1.75}
html[data-ui-refined] body .api-main{min-width:0}
html[data-ui-refined] body .api-sidebar,html[data-ui-refined] body .api-main *{box-sizing:border-box}
html[data-ui-refined] body .api-sidebar .api-nav a{font-size:var(--refine-body);min-height:40px;border-radius:8px}
html[data-ui-refined] body .api-model-card{border-radius:var(--refine-radius);box-shadow:none}
html[data-ui-refined] body .api-model-price{min-height:0;padding:16px}
html[data-ui-refined] body .api-model-desc{line-height:1.7}
html[data-ui-refined] body .admin-table select{height:32px;min-height:32px;font-size:var(--refine-small);border-radius:6px}
html[data-ui-refined] body .admin-table input{height:32px;min-height:32px;font-size:var(--refine-small)}
html[data-ui-refined] body .admin-table th,html[data-ui-refined] body .admin-table td{font-size:var(--refine-small);line-height:1.5}
html[data-ui-refined] body #elseCopyright{position:static;display:block;grid-column:1/-1;margin:20px auto 12px;max-width:calc(100% - 32px);width:fit-content;border:0;box-shadow:none;background:transparent;color:var(--muted);font-size:11px;line-height:1.6;padding:0;pointer-events:none}
/* Chat stays the existing Doubao layout. Increase readability and hit areas in place. */
html[data-refine-page="chat"] body{background:#fff}
html[data-refine-page="chat"] .menu-item{height:40px;font-size:14px}
html[data-refine-page="chat"] .menu-item svg{width:20px;height:20px}
html[data-refine-page="chat"] .recent-item{min-height:38px;font-size:14px}
html[data-refine-page="chat"] .assistant-body{font-size:16px;line-height:1.8}
html[data-refine-page="chat"] .user-bubble{font-size:15px;line-height:1.75}
html[data-refine-page="chat"] .composer textarea{font-size:15px;line-height:1.7}
html[data-refine-page="chat"] .icon-btn,html[data-refine-page="chat"] .plus,html[data-refine-page="chat"] .send-btn,html[data-refine-page="chat"] .mic-btn{width:36px;height:36px}
html[data-refine-page="chat"] .icon-btn svg,html[data-refine-page="chat"] .plus svg,html[data-refine-page="chat"] .mic-btn svg,html[data-refine-page="chat"] .send-btn svg{width:20px;height:20px}
html[data-refine-page="chat"] .tool-chip,html[data-refine-page="chat"] .mode-btn{font-size:13px;height:36px}
html[data-refine-page="chat"] .tool-chip svg{width:16px;height:16px}
html[data-refine-page="chat"] .composer-note,html[data-refine-page="chat"] .composer-copyright{font-size:12px;color:#707783;line-height:1.6}
html[data-refine-page="chat"] .menu-pop{min-width:250px}
html[data-refine-page="chat"] .menu-pop button{font-size:14px;min-height:40px;padding:10px 12px}
html[data-refine-page="chat"] .menu-pop .title{font-size:12px;color:#707783}
html[data-refine-page="chat"] .image-options,html[data-refine-page="chat"] .image-options-title{font-size:13px;color:#626b78}
html[data-refine-page="chat"] body .image-options select{height:32px;min-height:32px;font-size:13px}
html[data-refine-page="chat"] .image-options .hint{font-size:12px;color:#707783}
html[data-refine-page="chat"] .assistant-actions{opacity:1}
html[data-refine-page="chat"] .assistant-actions button{width:32px;height:32px;color:#626b78}
html[data-refine-page="chat"] .modal-field{font-size:13px;color:#626b78}
html[data-refine-page="chat"] .modal-note{font-size:12px;color:#707783}
html[data-ui-refined] button:focus-visible,html[data-ui-refined] a:focus-visible{outline:2px solid #8067ff;outline-offset:3px}
@media(max-width:760px){
html[data-ui-refined] body .home-nav{display:flex;flex-wrap:wrap;gap:12px;padding:14px;border-radius:14px;align-items:center}
html[data-ui-refined] body .home-nav>.brand-link{flex:0 0 auto}
html[data-ui-refined] body .home-nav>.nav-actions{flex:1 1 220px;flex-wrap:wrap;justify-content:flex-end}
html[data-ui-refined] body .home-nav>.main-nav-links{display:flex;flex-direction:row;flex-wrap:wrap;flex:1 0 100%;width:100%;gap:8px;justify-content:flex-start}
html[data-ui-refined] body .main-nav-links a{width:auto;flex:0 0 auto;font-size:12px;min-height:34px;padding:7px 10px}
html[data-ui-refined] body .platform-home-nav{display:flex;flex-wrap:wrap;gap:12px;padding:14px}
html[data-ui-refined] body .platform-home-nav nav{display:flex;flex-direction:row;flex-wrap:wrap;gap:6px;justify-content:flex-start}
html[data-ui-refined] body .platform-home-nav nav a{font-size:12px;min-height:34px;padding:7px 9px}
html[data-ui-refined] body .platform-home-main{width:calc(100% - 28px)}
html[data-ui-refined] body.api-console-page{grid-template-columns:minmax(0,1fr)}
html[data-ui-refined] body .api-sidebar{position:static;height:auto;min-width:0;max-width:100%;padding:12px;gap:12px}
html[data-ui-refined] body .api-sidebar .api-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:0}
html[data-ui-refined] body .api-sidebar .api-nav a{margin:0;min-width:0;padding:8px 6px;font-size:12px;gap:6px;min-height:40px}
html[data-ui-refined] body .api-sidebar .api-nav a span{width:24px;height:24px;flex-shrink:0}
html[data-ui-refined] body .api-main{width:100%;max-width:100%;min-width:0;padding:16px}
html[data-ui-refined] body .api-topbar{min-width:0;max-width:100%;flex-wrap:wrap}
html[data-ui-refined] body .api-hero-stats{min-width:0;width:100%;grid-template-columns:repeat(2,minmax(0,1fr))}
html[data-ui-refined] body .api-hero-stats>article{min-width:0}
html[data-ui-refined] body .api-sidebar-foot{margin:0}
html[data-ui-refined] body .api-user-chip{min-width:0}
html[data-refine-page="chat"] .composer-bar{flex-wrap:wrap;gap:6px}
html[data-refine-page="chat"] .tool-chips{flex:1;min-width:0}
html[data-refine-page="chat"] .bar-right{margin-left:auto}
html[data-refine-page="chat"] .composer-note{font-size:11px}
html[data-refine-page="chat"] .composer-copyright{font-size:10px}
html[data-refine-page="chat"] .mode-btn{max-width:170px}
}

/* === Full 22-Page Design System Unification === */
html[data-ui-refined] body.login-v2-page {
  background: radial-gradient(ellipse at 15% 0%, rgba(128, 87, 231, 0.08), transparent 45%), #f7f6fa !important;
  color: #242033 !important;
}
html[data-ui-refined] .login-v2-nav {
  background: rgba(255, 255, 255, 0.96) !important;
  border-bottom: 1px solid #eae6f1 !important;
}
html[data-ui-refined] .login-v2-brand strong { color: #242033 !important; }
html[data-ui-refined] .login-v2-logo {
  background: linear-gradient(115deg, #8555e9, #d66bc7) !important;
  color: #fff !important;
  border-radius: 10px !important;
}
html[data-ui-refined] .login-v2-link {
  color: #625d73 !important;
  border: 1px solid #eae6f1 !important;
  background: #fff !important;
  border-radius: 8px !important;
  padding: 6px 14px !important;
}
html[data-ui-refined] .login-v2-copy h1 {
  color: #242033 !important;
  background: none !important;
  -webkit-text-fill-color: #242033 !important;
}
html[data-ui-refined] .login-v2-copy p { color: #6d647a !important; }
html[data-ui-refined] .login-v2-badge {
  background: #f1ebff !important;
  color: #7354d9 !important;
  border-color: #e2d6ff !important;
}
html[data-ui-refined] .login-v2-stats div {
  background: #fff !important;
  border: 1px solid #eae6f1 !important;
  border-radius: 12px !important;
}
html[data-ui-refined] .login-v2-stats strong { color: #242033 !important; }
html[data-ui-refined] .login-v2-stats span { color: #736d85 !important; }
html[data-ui-refined] .login-v2-card {
  background: #fff !important;
  border: 1px solid #eae6f1 !important;
  border-radius: 20px !important;
  box-shadow: 0 16px 48px rgba(50, 32, 92, 0.08) !important;
}
html[data-ui-refined] .login-v2-tabs {
  background: #f4f2f8 !important;
  border-radius: 10px !important;
  padding: 4px !important;
}
html[data-ui-refined] .login-v2-tabs button {
  color: #6d647a !important;
  border-radius: 8px !important;
}
html[data-ui-refined] .login-v2-tabs button.active {
  background: #fff !important;
  color: #7354d9 !important;
  box-shadow: 0 2px 8px rgba(36, 32, 51, 0.06) !important;
}
html[data-ui-refined] .login-v2-form label { color: #242033 !important; }
html[data-ui-refined] .login-v2-form input {
  background: #fff !important;
  border: 1px solid #dcd6e8 !important;
  color: #242033 !important;
  border-radius: 8px !important;
}
html[data-ui-refined] .login-v2-submit {
  background: linear-gradient(115deg, #8555e9, #d66bc7) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 10px !important;
  height: 44px !important;
  font-weight: 600 !important;
}

/* Admin & Monitor unify */
html[data-ui-refined] body.admin-page {
  --admin-bg: #f7f6fb;
  --admin-surface: #ffffff;
  --admin-surface-2: #f4f2f9;
  --admin-border: #e8e4f1;
  --admin-border-strong: #d5cee6;
  --admin-text: #242033;
  --admin-muted: #6d647a;
  --admin-dim: #8c8499;
  --admin-brand: #7354d9;
  background: #f7f6fb !important;
  color: #242033 !important;
}
html[data-ui-refined] body.admin-page .admin-sidebar {
  background: #ffffff !important;
  border-right: 1px solid #e8e4f1 !important;
}
html[data-ui-refined] body.admin-page .admin-card,
html[data-ui-refined] body.admin-page .admin-stat,
html[data-ui-refined] body.admin-page .admin-table-wrap {
  background: #ffffff !important;
  border: 1px solid #e8e4f1 !important;
  box-shadow: 0 4px 16px rgba(50, 32, 92, 0.04) !important;
}
html[data-ui-refined] body.monitor-page {
  background: #f7f6fb !important;
  color: #242033 !important;
}
html[data-ui-refined] body.monitor-page .monitor-header {
  background: #ffffff !important;
  border-bottom: 1px solid #e8e4f1 !important;
}
html[data-ui-refined] body.monitor-page .stats {
  border-top: 3px solid #7354d9 !important;
  border-radius: 12px !important;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(50, 32, 92, 0.04) !important;
}

/* Automation page unify */
html[data-ui-refined] body:has(.auto-nav) {
  background: #f7f6fb !important;
  color: #242033 !important;
}
html[data-ui-refined] body:has(.auto-nav)::before { display: none !important; }
html[data-ui-refined] .auto-nav {
  background: rgba(255, 255, 255, 0.97) !important;
  border-bottom: 1px solid #eae6f1 !important;
}
@media(max-width:760px){
  html[data-ui-refined][data-refine-page="automation"] .logic-grid{grid-template-columns:minmax(0,1fr)}
  html[data-ui-refined][data-refine-page="automation"] .logic-grid>article{min-width:0}
  html[data-ui-refined][data-refine-page="automation"] .mini-flow{flex-wrap:wrap}
}
html[data-ui-refined] body:has(.auto-nav) h1 {
  color: #242033 !important;
  text-shadow: none !important;
}
html[data-ui-refined] body:has(.auto-nav) .hero-pill {
  background: #f1ebff !important;
  color: #7354d9 !important;
  border: 1px solid #e0d4fc !important;
  box-shadow: none !important;
  font-size: 16px !important;
}
html[data-ui-refined] body:has(.auto-nav) .panel,
html[data-ui-refined] body:has(.auto-nav) .detail-section {
  border: 1px solid #eae6f1 !important;
  background: #ffffff !important;
  box-shadow: 0 8px 28px rgba(50, 32, 92, 0.06) !important;
}

/* Batch, Workflow, GPT-Lab, Prompts, Video pages unify */
html[data-ui-refined] .gpt-lab-page,
html[data-ui-refined] .batch-page,
html[data-ui-refined] .prompts-page,
html[data-ui-refined] .video-direct-page {
  background: #f7f6fa !important;
  color: #242033 !important;
}
html[data-ui-refined] .gpt-lab-panel,
html[data-ui-refined] .batch-control,
html[data-ui-refined] .batch-queue-panel,
html[data-ui-refined] .workflow-control,
html[data-ui-refined] .workflow-output,
html[data-ui-refined] .prompt-card,
html[data-ui-refined] .video-direct-wrap {
  background: #ffffff !important;
  border: 1px solid #eae6f1 !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 28px rgba(50, 32, 92, 0.05) !important;
}
html[data-ui-refined] .gpt-lab-hero h1,
html[data-ui-refined] .batch-page h1,
html[data-ui-refined] .prompts-hero h1,
html[data-ui-refined] .video-embed-title h1 {
  color: #242033 !important;
  background: none !important;
  -webkit-text-fill-color: #242033 !important;
}

/* Empty placeholders describe the whole gallery, not one thumbnail slot. */
html[data-ui-refined] .preview-strip > .empty,
html[data-ui-refined] .workflow-gallery > .empty,
html[data-ui-refined] .carousel-result-grid > .empty,
html[data-ui-refined] .queue-list > .empty {
  grid-column: 1 / -1;
  min-width: 0;
  width: 100%;
  box-sizing: border-box;
  justify-items: center;
  align-content: center;
  line-height: 1.65;
}
html[data-ui-refined] .preview-strip > .empty {
  min-height: 104px;
  padding: 18px 24px;
  gap: 4px;
}
html[data-ui-refined] .preview-strip > .empty strong { font-size: 15px; }
html[data-ui-refined] .preview-strip > .empty span { font-size: 13px; }
html[data-ui-refined] .workflow-gallery > .empty,
html[data-ui-refined] .carousel-result-grid > .empty,
html[data-ui-refined] .queue-list > .empty {
  min-height: clamp(240px, 32vh, 360px);
  padding: 28px;
  gap: 8px;
}
html[data-ui-refined] .workflow-gallery > .empty strong,
html[data-ui-refined] .carousel-result-grid > .empty strong,
html[data-ui-refined] .queue-list > .empty strong { font-size: 20px; }
html[data-ui-refined] .workflow-gallery > .empty span,
html[data-ui-refined] .carousel-result-grid > .empty span,
html[data-ui-refined] .queue-list > .empty span { max-width: 48ch; font-size: 14px; }
@media (max-width: 640px) {
  html[data-ui-refined] .preview-strip > .empty { padding: 16px; }
  html[data-ui-refined] .workflow-gallery > .empty,
html[data-ui-refined] .carousel-result-grid > .empty,
  html[data-ui-refined] .queue-list > .empty { min-height: 220px; padding: 24px 18px; }
}
