/* Existing BaoDanFu components, page-scoped. Invite, shell and authorisation logic are protected. */
.app-shell .page-main :is(.official-overview,.message-page,.market-page,.creator-detail-page,.creator-resources-page,.inbox-page,.tk-auth-page),
.app-shell .page-main:has(>.task-card,>.dr-card>.meta,>.dr-card>.cards,>.dr-card .scope-inline,>.panel>.scope-box) {
  --brand:#4a4efc; --brand2:#9cb5ed; --boom-brand:#4a4efc;
  --el-color-primary:#4a4efc; --el-color-primary-light-3:#7073fc;
  --el-color-primary-light-9:#2c3050; --el-text-color-regular:#d5d9e2;
  --el-text-color-placeholder:#9299a7; --el-fill-color-blank:#2b2d33;
  --el-border-color:#40434c; --text-3:#9ba2af; --boom-muted:#9ba2af;
  --bdf-chart-primary:#7099ee; --bdf-chart-mint:#62b6a4; --bdf-chart-amber:#d7b574;
  color:#e6e9f0;
}
.app-shell .page-main :is(.official-overview,.message-page,.market-page,.creator-detail-page,.creator-resources-page,.inbox-page,.tk-auth-page) :is(input,textarea,select),
.app-shell .page-main:has(>.task-card,>.dr-card>.meta,>.dr-card>.cards,>.dr-card .scope-inline,>.panel>.scope-box) :is(input,textarea,select) { font-family:inherit; font-size:14px; color:#e7eaf1; }
.app-shell .page-main :is(.message-page,.market-page,.creator-resources-page) :is(.boom-control,.el-select__wrapper,.el-input__wrapper),
.app-shell .page-main:has(>.task-card,>.dr-card>.cards) .input { background:#2e3037; border-color:#3d4049; }
.app-shell .page-main :is(.message-page,.market-page,.creator-resources-page) :is(input,textarea)::placeholder,
.app-shell .page-main:has(>.task-card,>.dr-card>.cards) .input::placeholder { color:#939ba9; opacity:1; }
.app-shell .page-main :is(.official-overview,.message-page,.market-page,.creator-detail-page,.creator-resources-page,.inbox-page,.tk-auth-page) :is(button,a,input,textarea,select):focus-visible,
.app-shell .page-main:has(>.task-card,>.dr-card>.meta,>.dr-card>.cards,>.dr-card .scope-inline,>.panel>.scope-box) :is(button,a,input,textarea,select):focus-visible { outline:2px solid #8fa8ff; outline-offset:3px; }
.app-shell .page-main :is(.message-page,.market-page,.creator-resources-page) :is(.boom-button-primary,.el-button--primary) { background:#4a4efc; border-color:#4a4efc; color:#fff; }
.app-shell .page-main :is(.market-page,.creator-resources-page,.message-page) .boom-button { min-height:34px; font-size:14px; }
.app-shell .page-main :is(.market-page,.creator-resources-page,.inbox-page) .boom-table,
.app-shell .page-main:has(>.task-card,>.dr-card>.meta,>.dr-card .scope-inline) .boom-table { font-size:14px; color:#dce0e9; }
.app-shell .page-main :is(.market-page,.creator-resources-page) .boom-table th,
.app-shell .page-main:has(>.task-card,>.dr-card>.meta,>.dr-card .scope-inline) .boom-table th { height:44px; padding:12px 14px; background:#2d2f36; color:#b8c0ce; font-size:13px; font-weight:500; }
.app-shell .page-main :is(.market-page,.creator-resources-page) .boom-table td,
.app-shell .page-main:has(>.task-card,>.dr-card>.meta,>.dr-card .scope-inline) .boom-table td { padding:16px 14px; border-bottom:1px solid #34363e; }
.app-shell .page-main :is(.market-page,.creator-resources-page) .boom-table tbody tr:hover,
.app-shell .page-main:has(>.task-card,>.dr-card .scope-inline) .boom-table tbody tr:hover { background:#292c33; }

/* Automatic messages: readable editor space rather than squeezing everything above it. */
.app-shell .page-main .boom-root.dr-page.message-page .message-studio { gap:36px; grid-template-columns: minmax(280px,.36fr) minmax(0,1fr); padding:24px; background:#222429; border:1px solid #303239; }
.app-shell .page-main .boom-root.dr-page.message-page .message-settings::after { right:-18px; background:#34363e; }
.app-shell .page-main .boom-root.dr-page.message-page .boom-field { margin-bottom:20px; }
.app-shell .page-main .boom-root.dr-page.message-page .boom-field>label { color:#c9cfdb; font-size:14px; }
.app-shell .page-main .boom-root.dr-page.message-page :is(.message-settings>h2,.message-composer-head h2,.bdf-heading-plain h2) { border-left:3px solid #fe5075; padding-left:10px; color:#edf0f6; font-size:16px; }
.app-shell .page-main .boom-root.dr-page.message-page .message-mode { gap:10px; }
.app-shell .page-main .boom-root.dr-page.message-page .message-mode button { padding:12px 14px; background:#2b2e35; border-color:#3b3e47; font-size:14px; }
.app-shell .page-main .boom-root.dr-page.message-page .message-mode button::before { display:none; }
.app-shell .page-main .boom-root.dr-page.message-page .message-mode button[aria-pressed=true] { background:#30364c; border-color:#727dbe; color:#f1f4ff; }
.app-shell .page-main .boom-root.dr-page.message-page .message-mode small { color:#a5aebb; line-height:1.6; }
.app-shell .page-main .boom-root.dr-page.message-page .message-tabs { margin:18px 0; }
.app-shell .page-main .boom-root.dr-page.message-page .message-tabs button { min-height:38px; font-size:14px; }
.app-shell .page-main .boom-root.dr-page.message-page .message-tabs button { background:transparent; border:0; border-radius:0; padding:9px 16px; position:relative; box-shadow:none; }
.app-shell .page-main .boom-root.dr-page.message-page .message-tabs button[aria-selected=true] { color:#c5d4ff; }
.app-shell .page-main .boom-root.dr-page.message-page .message-tabs button[aria-selected=true]::after { content:''; position:absolute; left:16px; right:16px; bottom:0; background:#7099ee; height:2px; }
.app-shell .page-main .boom-root.dr-page.message-page .message-edit-layout { grid-template-columns:minmax(0,1fr) clamp(200px,17vw,280px); gap:24px; }
.app-shell .page-main .boom-root.dr-page.message-page .message-type-options { background:transparent; border:0; padding:0; gap:8px; height:auto; }
.app-shell .page-main .boom-root.dr-page.message-page .message-type-options button { min-height:32px; height:32px; border-radius:999px; padding:0 16px; background:#2b2e35; color:#c4ccda; }
.app-shell .page-main .boom-root.dr-page.message-page .message-type-options button[aria-pressed=true] { background:#4a4efc; color:#fff; }
.app-shell .page-main .boom-root.dr-page.message-page .message-type-options button[aria-pressed=true] .el-icon { color:inherit; }
.app-shell .page-main .boom-root.dr-page.message-page .message-edit-fields textarea { height:clamp(180px,calc(100dvh - 650px),340px); min-height:180px; line-height:1.7; padding:12px; }
.app-shell .page-main .boom-root.dr-page.message-page .message-device-preview { padding:14px 0 14px 20px; border-left:1px solid #34363e; }
.app-shell .page-main .boom-root.dr-page.message-page .message-preview-label { color:#bac3d2; font-size:13px; }
.app-shell .page-main .boom-root.dr-page.message-page .message-bubble { background:#303744; border-color:#424b5a; }
.app-shell .page-main .boom-root.dr-page.message-page .message-upload { background:#282b31; border-color:#515765; border-radius:8px; }
.app-shell .page-main .boom-root.dr-page.message-page .message-upload:hover { background:#2d3038; border-color:#8197cc; }
.app-shell .page-main .boom-root.dr-page.message-page .message-upload :is(.upload-placeholder svg,.upload-main-text) { color:#b4c7f1; }

/* Resource tables and search: retain every column and keep wide scrolling inside tables. */
.app-shell .page-main .boom-root.creator-resources-page :is(.resource-filters,.resource-results) { background:#222429; border-color:#34363e; border-radius:8px; }
.app-shell .page-main .boom-root.creator-resources-page .resource-search-row { gap:12px; padding-block:4px; }
.app-shell .page-main .boom-root.creator-resources-page .resource-results-toolbar { padding-block:20px; gap:20px; }
.app-shell .page-main .boom-root.creator-resources-page .resource-results-toolbar h2 { font-size:16px; padding-left:10px; border-left:3px solid #fe5075; }
.app-shell .page-main .boom-root.creator-resources-page .resource-results-toolbar p { color:#a0a9b8; margin-top:8px; }
.app-shell .page-main .boom-root.creator-resources-page .resource-person-detail { font-size:14px; color:#e9edf5; }
.app-shell .page-main .boom-root.creator-resources-page .resource-person small { color:#a2aabb; line-height:1.7; }
.app-shell .page-main .boom-root.creator-resources-page .resource-tag { background:#30384a; border-color:#475571; color:#b8cef6; }
.app-shell .page-main .boom-root.creator-resources-page .resource-text-button:not(.resource-danger) { color:#a8c1f6; }
.app-shell .page-main .boom-root.creator-resources-page .resource-table tr.is-selected { background:#2d3446; }
.app-shell .page-main .boom-root.creator-resources-page .resource-empty { padding:52px 20px; }
.app-shell .page-main .boom-root.creator-resources-page .resource-empty h3 { font-size:16px; color:#dfe5ee; }
.app-shell .page-main .boom-root.creator-resources-page .resource-empty p { color:#a1aab9; }
.app-shell .page-main .boom-root.market-page :is(.filter-tabs,.market-filter-tabs) { gap:20px; border-bottom:1px solid #373a43; }
.app-shell .page-main .boom-root.market-page .filter-tab { background:transparent; border:0; border-radius:0; color:#a7b0bf; min-height:38px; }
.app-shell .page-main .boom-root.market-page .filter-tab:is(.active,.is-on) { color:#b9ceff; box-shadow:inset 0 -2px #7099ee; background:transparent; }
.app-shell .page-main .boom-root.market-page .market-toolbar { gap:16px; margin-block:18px; }
.app-shell .page-main .boom-root.market-page .creator-name { color:#eef1f7; font-size:14px; }
.app-shell .page-main .boom-root.market-page .filter-nav { gap:20px; margin:18px 0; }
.app-shell .page-main .boom-root.market-page .filter-nav [role=tablist] { gap:18px; border-bottom:1px solid #3a3e48; }
.app-shell .page-main .boom-root.market-page .filter-nav [role=tab] { padding:10px 4px; background:transparent; border:0; border-radius:0; font-size:14px; color:#adb8ca; }
.app-shell .page-main .boom-root.market-page .filter-nav [role=tab][aria-selected=true] { color:#c4d5ff; box-shadow:inset 0 -2px #7099ee; }
.app-shell .page-main .boom-root.market-page .creator-text strong { font-size:14px; color:#eef2f9; }
.app-shell .page-main .boom-root.market-page .detail-link { color:#aec6fa; }
.app-shell .page-main .boom-root.creator-resources-page .filter-nav [role=tablist] { gap:18px; border-bottom:1px solid #3a3e48; }
.app-shell .page-main .boom-root.creator-resources-page .filter-nav [role=tab] { padding:10px 4px; background:transparent; border:0; border-radius:0; font-size:14px; color:#adb8ca; }
.app-shell .page-main .boom-root.creator-resources-page .filter-nav [role=tab][aria-selected=true] { color:#c4d5ff; box-shadow:inset 0 -2px #7099ee; }

/* Continuous creator detail and overview panels: real titles, stable surfaces and restrained chart hues. */
.app-shell .page-main :is(.creator-detail-page,.official-overview) .panel { background:#23252b; border-color:#353840; border-radius:8px; box-shadow:none; }
.app-shell .page-main :is(.creator-detail-page,.official-overview) .panelhead h2 { color:#ebeff6; font-size:16px; border-left:3px solid #fe5075; padding-left:10px; }
.app-shell .page-main :is(.creator-detail-page,.official-overview) .panelhead h2::before { display:none; }
.app-shell .page-main :is(.creator-detail-page,.official-overview) :is(.ov-title-sub,.subheading,.creator-data-scope) { color:#a1aaba; line-height:1.7; }
.app-shell .page-main .shop-data-page.creator-detail-page .creator-detail-nav { gap:22px; background:#23252b; border-bottom:1px solid #41454f; padding:0 20px; }
.app-shell .page-main .shop-data-page.creator-detail-page .creator-detail-nav button { padding:14px 4px; font-size:14px; background:transparent; border:0; border-radius:0; color:#b0b9c9; }
.app-shell .page-main .shop-data-page.creator-detail-page .creator-detail-nav button[aria-current=location] { color:#c3d4ff; box-shadow:inset 0 -2px #7099ee; }
.app-shell .page-main .shop-data-page.creator-detail-page .primary-btn { background:#4a4efc; border:1px solid #4a4efc; box-shadow:none; color:#fff; }
.app-shell .page-main .shop-data-page.creator-detail-page .creator-detail-nav button::after { display:none; }
.app-shell .page-main .shop-data-page.creator-detail-page .creator-metrics { gap:12px; }
.app-shell .page-main .shop-data-page.creator-detail-page .stat-card { background:#282b32; border-color:#363a43; padding:20px; }
.app-shell .page-main .shop-data-page.creator-detail-page .creator-distribution { background:#24272d; }
.app-shell .page-main .shop-data-page.creator-detail-page .creator-distribution-track { background:#363a42; }
.app-shell .page-main .shop-data-page.official-overview .stat-card { background:#25282e; border-color:#373b44; }
.app-shell .page-main .shop-data-page.official-overview .bdf-tone-blue { --bdf-accent:#8eb3f3; --bdf-rgb:142,179,243; }
.app-shell .page-main .shop-data-page.official-overview .panel-switch button { font-size:13px; padding:8px 12px; }
.app-shell .page-main .shop-data-page.official-overview .panel-switch button.active { background:#333b4e; color:#c7d7fc; }
.app-shell .page-main .shop-data-page.official-overview :is(.unit span,.execution-metric span) { color:#aab4c5; }
.app-shell .page-main .shop-data-page.official-overview .channel-ring { filter:none; }
.app-shell .page-main .shop-data-page.official-overview .official-overview-chart svg path[stroke] { stroke:#7099ee; }
.app-shell .page-main .shop-data-page.official-overview .official-overview-chart svg stop { stop-color:#7099ee; }

/* Lists and secondary pages use the same typography, with existing status colours intact. */
.app-shell .page-main:has(>.task-card) .filters { gap:12px; padding-bottom:18px; border-bottom:1px solid #363943; flex-wrap:wrap; }
.app-shell .page-main:has(>.task-card) .filters .input { min-height:36px; }
.app-shell .page-main:has(>.task-card) .toolbar { padding-block:16px; }
.app-shell .page-main:has(>.task-card) .detail-link { color:#aac4fa; }
.app-shell .page-main:has(>.task-card) .tag.run { color:#b0c7fc; border-color:#54648f; background:#30394e; }
.app-shell .page-main:has(>.dr-card>.meta,>.dr-card .scope-inline)>.dr-card { margin-bottom:16px; background:#23252b; border-color:#353840; }
.app-shell .page-main:has(>.dr-card>.meta) :is(.meta-item em,.stat em,.timeline em) { color:#a3adbd; font-size:13px; }
.app-shell .page-main:has(>.dr-card>.meta) .meta { gap:22px 36px; }
.app-shell .page-main:has(>.dr-card>.meta) .stat-row { gap:clamp(30px,5vw,90px); }
.app-shell .page-main:has(>.dr-card>.meta) .stat b { font-size:26px; }
.app-shell .page-main:has(>.dr-card>.meta) h2 { font-size:16px; padding-left:10px; border-left:3px solid #fe5075; margin-bottom:16px; }
.app-shell .page-main:has(>.dr-card>.cards) .tabs { gap:22px; border-bottom:1px solid #3c4049; margin-bottom:20px; align-items:center; }
.app-shell .page-main:has(>.dr-card>.cards) .tab { border:0; border-radius:0; padding:12px 2px; background:transparent; color:#aeb7c7; font-size:14px; }
.app-shell .page-main:has(>.dr-card>.cards) .tab.is-on { color:#bed0ff; box-shadow:inset 0 -2px #7099ee; }
.app-shell .page-main:has(>.dr-card>.cards) .tpl-card { background:#272a31; border-color:#393d47; border-radius:8px; padding:20px; box-shadow:none; }
.app-shell .page-main:has(>.dr-card>.cards) .tpl-card .body { color:#bcc5d4; font-size:14px; line-height:1.8; }
.app-shell .page-main:has(>.dr-card>.cards) .tpl-card footer { border-top:1px solid #3a3e48; padding-top:14px; }
.app-shell .page-main:has(>.dr-card>.cards) .tpl-card .link:not(.danger) { color:#aac3f8; }
.app-shell .page-main:has(>.dr-card .scope-inline) .scope-inline { color:#a1abbd; overflow-wrap:anywhere; }
.app-shell .page-main:has(>.dr-card .scope-inline) .link { color:#aec6fc; }
.app-shell .page-main:has(>.panel>.scope-box) .panel { padding:24px; background:#23252b; border-color:#353840; }
.app-shell .page-main:has(>.panel>.scope-box) .scope-box { line-height:1.8; background:#292c33; border-color:#3c424d; }

/* Conversation panes remain independent scroll regions. */
.app-shell .page-main .boom-root.inbox-page .inbox-workspace { border-color:#3a3e47; border-radius:8px; }
.app-shell .page-main .boom-root.inbox-page :is(.inbox-shops,.inbox-conversations,.inbox-profile) { background:#22252b; }
.app-shell .page-main .boom-root.inbox-page .inbox-thread { background:#26292f; }
.app-shell .page-main .boom-root.inbox-page :is(.inbox-pane-head h2,.inbox-thread-head h2) { color:#e3e9f4; font-size:15px; }
.app-shell .page-main .boom-root.inbox-page .inbox-shop.is-active { background:#30394b; border-color:#576685; }
.app-shell .page-main .boom-root.inbox-page .inbox-conversation.is-active { background:#30394b; box-shadow:inset 3px 0 #7c9cdc; }
.app-shell .page-main .boom-root.inbox-page .inbox-bubble { background:#343842; color:#e7ecf5; line-height:1.75; }
.app-shell .page-main .boom-root.inbox-page .inbox-message.is-out .inbox-bubble { background:#344360; border-color:#52678b; }
.app-shell .page-main .boom-root.inbox-page .inbox-composer { border-top:1px solid #40454f; }
.app-shell .page-main .boom-root.inbox-page .inbox-composer .el-textarea__inner { background:#2e323b; color:#e7edf7; }
.app-shell .page-main .boom-root.inbox-page .inbox-list-tabs button { color:#a9b4c6; }
.app-shell .page-main .boom-root.inbox-page .inbox-list-tabs button[aria-selected=true] { color:#cad9fd; border-color:#7499ed; }
.app-shell .page-main .tk-auth-page { min-height:0; padding-top:12px; }
.app-shell .page-main .tk-auth-page .auth-shop-table { --el-table-header-text-color:#bdc7d6; --el-table-row-hover-bg-color:#2d323b; color:#dce3ee; }
.app-shell .page-main .tk-auth-page .auth-copy p { color:#a6b0c0; line-height:1.7; }
.app-shell .page-main .tk-auth-page .auth-shop-table .el-table__header th { color:#b9c4d5; font-size:13px; }
.app-shell .page-main .tk-auth-page .auth-shop-table .el-table__row { height:66px; }
.login-page .login-card { background:#23252b; border-color:#3a3d46; }
.login-page .login-card .el-input__wrapper { background:#2e3037; }
.login-page .login-card .login-hint { color:#a1a9b7; }
@media(min-width:1600px) and (min-height:1000px) {
  .app-shell .page-main .boom-root.dr-page.message-page .message-studio { padding:28px; gap:44px; }
  .app-shell .page-main .boom-root.dr-page.message-page .message-tabs { margin-block:24px; }
  .app-shell .page-main .boom-root.dr-page.message-page .boom-field { margin-bottom:24px; }
}
@media(max-width:1100px) {
  .app-shell .page-main .boom-root.dr-page.message-page .message-studio { grid-template-columns:1fr; gap:24px; padding:20px; }
  .app-shell .page-main .boom-root.dr-page.message-page .message-settings::after { display:none; }
  .app-shell .page-main .boom-root.dr-page.message-page .message-edit-layout { grid-template-columns:minmax(0,1fr) 200px; }
}
@media(max-width:750px) {
  .app-shell .page-main .boom-root.dr-page.message-page .message-edit-layout { grid-template-columns:1fr; }
  .app-shell .page-main .boom-root.dr-page.message-page .message-device-preview { padding:16px 0; border-left:0; border-top:1px solid #34363e; }
}