/* P0 experience layer: responsive navigation, readable data, solid-color theme. */
:root {
  --experience-orange: #ef661d;
  --experience-orange-dark: #bf4810;
  --experience-orange-soft: #fff0e4;
  --experience-ink: #2a1b15;
  --experience-muted: #746158;
  --experience-paper: #fffaf7;
  --experience-line: #eadcd3;
  --experience-success: #2d886d;
  --experience-danger: #c64b45;
}

body { background: var(--experience-paper); color: var(--experience-ink); }
/* The product rule is deliberate: every illustrated surface is now a solid color. */
body *, body *::before, body *::after { background-image: none !important; }
.login-view { background: #3a251b; }
.sidebar { background: #2a1b15; }
.sidebar::after { background: #3d281d; }
.nav-item.active, .nav-item:hover { background: #57301e; }
.nav-item.active { box-shadow: inset 3px 0 0 #ff9a4c; }
.nav-item.active::before { background: #ff9a4c; }
.sidebar-flow, .sidebar-note { background: #3a251b; }
.workspace-hero, .workspace-tab.active, .nav-group-platform.active, .report-hero { background: #5a341f; }
.workspace-hero::after, .workspace-hero::before { background: none !important; }
.bar, .progress-track > div { background: var(--experience-orange) !important; }
.metrics article.accent { background: #4a2e20 !important; border-color: #4a2e20 !important; border-top-color: #ff9a4c !important; }
.upload-zone, .visual-frame, .xmf-bridge-card { background: #fff8f2 !important; }
.xmf-bridge-card { border-color: #efcfbb !important; }
.nav-item.active { background-image: none !important; }

.status-badge.neutral { background: #f0ece9; color: #665c56; }
.trend-empty, .priority-empty { display: grid; place-items: center; min-height: 100%; color: var(--experience-muted); font-size: 13px; line-height: 1.6; }
.priority-empty { min-height: 76px; background: #fff8f4; border-left: 4px solid #e3b89d; padding: 12px; }

.mobile-nav-trigger, .mobile-nav-drawer, .mobile-nav-scrim { display: none; }
.mobile-nav-drawer[hidden], .mobile-nav-scrim[hidden] { display: none !important; }

/* Calm single-color visual system: white surfaces, one orange action color, dark text. */
html, body, main { background: #fff !important; }
body { color: #2f2925; }
.eyebrow { display: none !important; }

.sidebar {
  background: #fff !important;
  border-right: 1px solid #ece7e3 !important;
  box-shadow: none !important;
}
.sidebar::after, .platform-workspace-card::after, .metrics article::after, .workspace-hero::before, .workspace-hero::after { display: none !important; }
.sidebar .brand { min-height: 54px; margin: 0 6px 16px; }
.sidebar .brand-logo { width: 168px; height: 54px; }
.sidebar .brand > div, .sidebar-note { display: none !important; }
.sidebar-collapse { border-color: #ef6c22 !important; background: #fff !important; box-shadow: none !important; }
.sidebar-collapse span { background: #ef6c22 !important; }
.nav-group-label, .nav-platform-label { color: #837970 !important; }
.nav-group-platform { padding: 4px 0 !important; border: 0 !important; background: transparent !important; }
.nav-group-ozon, .nav-group-wb, .nav-group-yandex { border-left: 0 !important; }
.nav-item { color: #4b4540 !important; }
.nav-item::before { display: none !important; }
.nav-item:hover { background: #fff4ed !important; color: #b84a12 !important; }
.nav-item.active { background: #ef6c22 !important; color: #fff !important; box-shadow: none !important; }
.nav-item.active::before { display: none !important; }
.sidebar-more { border-top-color: #ece7e3 !important; }
.sidebar-more summary, .sidebar-more[open] summary { color: #746b64 !important; }

header, .workspace-context-bar { background: #fff !important; box-shadow: none !important; }
header { border-bottom-color: #ece7e3 !important; }
header h1, .panel-head h2, .workspace-hero h2, .platform-workspace-card h2 { color: #2f2925 !important; }
.workspace-context-bar { border-color: #ece7e3 !important; border-radius: 10px !important; }
.workspace-tabs { border-color: #ece7e3 !important; background: #fff !important; box-shadow: none !important; }
.workspace-tab { color: #5d554f !important; }
.workspace-tab:hover { background: #fff4ed !important; color: #b84a12 !important; }
.workspace-tab.active { border-color: #ef6c22 !important; background: #ef6c22 !important; color: #fff !important; }
.workspace-parallel-note { color: #837970 !important; border-left-color: #ece7e3 !important; }

.workspace-hero {
  background: #fff !important;
  color: #2f2925 !important;
  border: 1px solid #ece7e3 !important;
  border-left: 4px solid #ef6c22 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}
.workspace-hero p, .workspace-hero p:not(.eyebrow) { color: #746b64 !important; }
.workspace-hero .btn { border-color: #ef6c22 !important; background: #ef6c22 !important; color: #fff !important; box-shadow: none !important; }

.platform-workspace-card, .panel, .metrics article, .table-wrap, .sync-strip, .sync-strip > div {
  background: #fff !important;
  border-color: #ece7e3 !important;
  box-shadow: none !important;
}
.platform-workspace-card, .metrics article, .product-form-panel, .output-panel, .publish-box { border-top: 3px solid #ef6c22 !important; }
.platform-workspace-card:hover, .panel:hover { border-color: #ef6c22 !important; box-shadow: none !important; transform: none !important; }
.wb-workspace-card, .yandex-workspace-card { border-top-color: #ef6c22 !important; }
.platform-workspace-card p, .platform-card-brand, .metrics span, .metrics small { color: #746b64 !important; }
.wb-workspace-card .btn.primary, .yandex-workspace-card .btn.primary, .btn.primary { background: #ef6c22 !important; color: #fff !important; box-shadow: none !important; }
.btn.primary:hover { background: #c94f10 !important; box-shadow: none !important; transform: none !important; }
.btn.secondary { border-color: #ded7d1 !important; background: #fff !important; color: #4b4540 !important; box-shadow: none !important; }
.btn.secondary:hover { border-color: #ef6c22 !important; background: #fff4ed !important; color: #b84a12 !important; }
.text-btn { color: #c94f10 !important; }

.notice, .source-card, .upload-zone, .visual-frame, .openai-config, .generation-progress, .review-list, .publish-box, .xmf-bridge-card {
  background: #fff !important;
  border-color: #ece7e3 !important;
}
.notice { border-left: 3px solid #ef6c22 !important; color: #665d57 !important; }
.notice strong { color: #2f2925 !important; }
input, select, textarea { border-color: #ded7d1 !important; background: #fff !important; color: #2f2925 !important; }
input:focus, select:focus, textarea:focus { border-color: #ef6c22 !important; box-shadow: 0 0 0 2px rgba(239,108,34,.14) !important; }
.bar, .progress-track > div, .upload-icon { background: #ef6c22 !important; }
.metrics article.accent { background: #fff !important; color: #2f2925 !important; border-color: #ece7e3 !important; border-top-color: #ef6c22 !important; }
.metrics .accent span, .metrics .accent small { color: #746b64 !important; }
.chip, .status-badge, .status-badge.deliver { background: #fff4ed !important; color: #b84a12 !important; }
.status-badge.neutral { background: #f3f1ef !important; color: #665d57 !important; }
thead th, th { background: #faf9f8 !important; color: #665d57 !important; }
tbody tr:hover td, tr:hover td { background: #fffaf6 !important; }

@media (max-width: 900px) {
  .sidebar { background: #fff !important; }
  .mobile-nav-trigger { border-color: #ef6c22 !important; background: #fff !important; color: #b84a12 !important; }
  .mobile-nav-trigger span { background: #ef6c22 !important; }
  .mobile-nav-drawer { background: #fff !important; border-color: #ece7e3 !important; box-shadow: 12px 0 26px rgba(47,41,37,.12) !important; }
  .mobile-nav-scrim { background: rgba(47,41,37,.28) !important; }
  .mobile-nav-item.active { background: #fff4ed !important; border-color: #ef6c22 !important; color: #b84a12 !important; }
}

@media (max-width: 900px) {
  main, .page, .panel, .wb-store-shell, .wb-store-shell > * { min-width: 0; max-width: 100%; }
  .sidebar { min-height: 62px; padding: 10px 14px 10px 68px; }
  .brand-logo { width: 146px; height: 38px; }
  .mobile-nav-trigger {
    display: inline-flex; position: fixed; z-index: 75; top: 10px; left: 12px; width: 44px; height: 44px;
    border: 1px solid rgba(255,255,255,.2); border-radius: 10px; background: #3a251b; color: #fff;
    align-items: center; justify-content: center; flex-direction: column; gap: 3px; font: 700 10px/1 "Microsoft YaHei", sans-serif; cursor: pointer;
  }
  .mobile-nav-trigger span { display: block; width: 16px; height: 2px; border-radius: 2px; background: #fff4ed; }
  .mobile-nav-trigger b { font-size: 10px; font-weight: 700; }
  .mobile-nav-scrim { position: fixed; z-index: 79; inset: 0; background: rgba(42,27,21,.54); }
  .mobile-nav-drawer {
    display: block; position: fixed; z-index: 80; inset: 0 auto 0 0; width: min(318px, calc(100vw - 42px));
    padding: 20px 16px 24px; overflow-y: auto; background: #fffaf7; border-right: 1px solid var(--experience-line); box-shadow: 18px 0 38px rgba(55,31,18,.18);
  }
  .mobile-nav-drawer-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding: 6px 4px 18px; border-bottom: 1px solid var(--experience-line); }
  .mobile-nav-drawer-head strong, .mobile-nav-drawer-head small { display:block; }
  .mobile-nav-drawer-head strong { color: var(--experience-ink); font-size: 18px; }
  .mobile-nav-drawer-head small { color: var(--experience-muted); font-size: 12px; margin-top: 3px; }
  .mobile-nav-close { min-width: 52px; min-height: 44px; border: 1px solid var(--experience-line); border-radius: 8px; background: #fff; color: var(--experience-ink); font: inherit; cursor: pointer; }
  .mobile-nav-list { display: grid; gap: 8px; padding-top: 16px; }
  .mobile-nav-item { width: 100%; min-height: 48px; padding: 11px 13px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: var(--experience-ink); text-align:left; font: 700 14px/1.4 "Microsoft YaHei", sans-serif; cursor:pointer; }
  .mobile-nav-item.active { background: var(--experience-orange-soft); border-color: #f3c7aa; color: var(--experience-orange-dark); }
  .mobile-nav-open { overflow: hidden; }
  .filters, #statusFilters, .workspace-tabs, .tabs, .platform-tabs { max-width: 100%; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; scrollbar-width: thin; }
  .filters .filter, #statusFilters .filter, .workspace-tab, .tabs button, .platform-tabs button { flex: 0 0 auto; min-height: 44px; }
  .table-wrap, .wb-store-table-wrap, .yandex-product-table-wrap, .overseas-task-table { position: relative; width: 100%; max-width: 100%; min-width: 0; overflow-x: auto; overscroll-behavior-x: contain; touch-action: pan-x; box-shadow: inset -12px 0 12px -14px rgba(55,31,18,.8); }
  .table-wrap table, .wb-store-table-wrap table, .overseas-task-table table { min-width: 720px; }
  .header-tools-menu { width: min(320px, calc(100vw - 28px)); max-width: calc(100vw - 28px); left: auto; right: 14px; }
  .btn, button:not(.nav-item):not(.mobile-nav-item) { min-height: 44px; }
  input:not([type="checkbox"]):not([type="radio"]), select, textarea { min-height: 44px; font-size: 14px; }
  table { font-size: 12.5px; }
  .notice, .field-note, .sync-error, .history-sub { font-size: 12px; line-height: 1.6; }
}

/* 邮箱注册 */
.login-card .login-form { display: grid; gap: 14px; }
.login-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; background: #f3ece7; border-radius: 10px; padding: 4px; }
.login-tab { border: 0; background: transparent; padding: 9px 12px; font: inherit; font-size: 13px; font-weight: 700; color: #7a6a5f; cursor: pointer; border-radius: 8px; }
.login-tab.active { background: #fff; color: #2b1d16; box-shadow: 0 2px 8px rgba(58, 37, 27, .12); }
.code-row { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.code-row .btn { white-space: nowrap; min-width: 108px; }
.code-row .btn[disabled] { opacity: .55; cursor: not-allowed; }