/* Visual language from the test site, applied to the new simulator UI only. */
:root {
  --site-paper: #ece5d6;
  --site-card: #f8f3e7;
  --site-ink: #20251f;
  --site-muted: #596057;
  --site-pine: #31594d;
  --site-cinnabar: #a63f31;
  --site-line: rgba(40, 50, 43, .18);
}

html {
  --neo-bg: var(--site-paper);
  --neo-surface: rgba(248, 243, 231, .88);
  --neo-solid: var(--site-card);
  --neo-text: var(--site-ink);
  --neo-muted: var(--site-muted);
  --neo-line: var(--site-line);
  --neo-blue: var(--site-pine);
  --neo-blue-soft: rgba(49, 89, 77, .11);
  --neo-shadow: 0 14px 42px rgba(57, 48, 36, .10);
  background: var(--site-paper) !important;
}

html[data-theme="care"] {
  --site-paper: #211d27;
  --site-card: #302938;
  --site-ink: #eee9e7;
  --site-muted: #bfb3c7;
  --site-pine: #bba4cb;
  --site-cinnabar: #d5a7aa;
  --site-line: rgba(219, 200, 225, .17);
  --neo-bg: var(--site-paper);
  --neo-surface: rgba(48, 41, 56, .92);
  --neo-solid: var(--site-card);
  --neo-text: var(--site-ink);
  --neo-muted: var(--site-muted);
  --neo-line: var(--site-line);
  --neo-blue: var(--site-pine);
  --neo-blue-soft: rgba(187, 164, 203, .14);
  color-scheme: dark;
}

body.neo-ui-page {
  background: var(--site-paper) !important;
  color: var(--site-ink) !important;
  font-family: "Noto Sans SC", "Microsoft YaHei", "PingFang SC", system-ui, sans-serif !important;
}

body.neo-ui-page::before {
  background:
    radial-gradient(circle at 8% 6%, rgba(49, 89, 77, .08), transparent 32rem),
    radial-gradient(circle at 92% 84%, rgba(166, 63, 49, .05), transparent 28rem);
}

html[data-theme="care"] body.neo-ui-page::before {
  background:
    radial-gradient(circle at 8% 6%, rgba(129, 93, 157, .13), transparent 32rem),
    radial-gradient(circle at 92% 84%, rgba(67, 48, 78, .22), transparent 28rem);
}

body.neo-ui-page .neo-sidebar {
  background: color-mix(in srgb, var(--site-card) 91%, transparent) !important;
  border-right-color: var(--site-line) !important;
}

body.neo-ui-page .neo-topbar,
html[data-theme="care"] body.neo-ui-page .neo-topbar {
  background: color-mix(in srgb, var(--site-paper) 93%, transparent) !important;
  border-bottom: 1px solid var(--site-line);
}

body.neo-ui-page .neo-brand-logo {
  background: linear-gradient(145deg, var(--site-pine), #203d34);
}

html[data-theme="care"] body.neo-ui-page .neo-brand-logo {
  background: linear-gradient(145deg, #685174, #33273d);
}

body.neo-ui-page .neo-nav a,
body.neo-ui-page .neo-subnav-item,
body.neo-ui-page .neo-toolbar button,
body.neo-ui-page .neo-toolbar a {
  color: var(--site-ink) !important;
}

body.neo-ui-page .neo-hero {
  background: linear-gradient(145deg, #28483e, #1f352e);
}

html[data-theme="care"] body.neo-ui-page .neo-hero {
  background: linear-gradient(145deg, #473650, #292230);
}

body.neo-ui-page .neo-hero::before {
  background: radial-gradient(circle, rgba(207, 179, 128, .20), transparent 69%);
}

body.neo-ui-page .neo-import-card,
body.neo-ui-page .neo-feature-card,
body.neo-ui-page .neo-category-card,
body.neo-ui-page .feature-card,
body.neo-ui-page .panel,
body.neo-ui-page .config-panel,
body.neo-ui-page .action-panel {
  border-color: var(--site-line) !important;
  background: var(--neo-surface) !important;
}

body.neo-ui-page .btn-primary,
body.neo-ui-page .btn-wash,
body.neo-ui-page .btn-wash-gold,
body.neo-ui-page .action.primary {
  background: var(--site-pine) !important;
  border-color: var(--site-pine) !important;
  color: var(--site-card) !important;
}

body.neo-ui-page .native-save-tools { display: none !important; }

html.feature-focus-mode body.neo-ui-page .save-sidebar {
  display: grid !important;
  position: static !important;
  width: 100% !important;
  max-width: 980px;
  max-height: none !important;
  margin: 0 auto 14px !important;
  padding: 12px 14px;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 5px 10px;
  align-items: center;
  background: var(--neo-surface) !important;
  border-color: var(--site-line) !important;
  box-shadow: 0 6px 22px rgba(30, 35, 45, .06);
}

html.feature-focus-mode body.neo-ui-page .save-sidebar-head,
html.feature-focus-mode body.neo-ui-page .save-sidebar-status {
  grid-column: 1;
  min-height: 0;
  margin: 0;
}

html.feature-focus-mode body.neo-ui-page .save-sidebar-import {
  grid-column: 2;
  grid-row: 1 / 3;
  min-width: 110px;
}

html.feature-focus-mode body.neo-ui-page .save-sidebar-download {
  grid-column: 3;
  grid-row: 1 / 3;
  width: auto;
  min-width: 110px;
  margin: 0;
}

html.feature-focus-mode body.neo-ui-page .save-version-label,
html.feature-focus-mode body.neo-ui-page .save-sidebar-hint { display: none !important; }

body.neo-ui-page button:focus-visible,
body.neo-ui-page a:focus-visible,
body.neo-ui-page input:focus-visible,
body.neo-ui-page select:focus-visible {
  outline: 2px solid var(--site-cinnabar) !important;
  outline-offset: 2px;
}

html[data-theme="care"] body.neo-ui-page .neo-sidebar,
html[data-theme="care"] body.neo-ui-page .neo-profile,
html[data-theme="care"] body.neo-ui-page .neo-toolbar button,
html[data-theme="care"] body.neo-ui-page .neo-toolbar a,
html[data-theme="care"] body.neo-ui-page .neo-mobile-tabs {
  background: var(--site-card) !important;
  color: var(--site-ink) !important;
  border-color: var(--site-line) !important;
}

@media (max-width: 640px) {
  html, body.neo-ui-page { overflow-x: hidden; }
  body.neo-ui-page .app-container,
  body.neo-ui-page .home-shell,
  body.neo-ui-page .neo-category-workspace { min-width: 0; max-width: 100%; }
  body.neo-ui-page .neo-category-tabs,
  body.neo-ui-page .neo-local-nav { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }
  body.neo-ui-page .feature-grid,
  body.neo-ui-page .neo-category-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body.neo-ui-page .table-wrap,
  body.neo-ui-page .table-container,
  body.neo-ui-page .result-table-wrap { max-width: 100%; overflow-x: auto; }
}

@media (max-width: 480px) {
  body.neo-ui-page .feature-grid,
  body.neo-ui-page .neo-category-feature-grid { grid-template-columns: minmax(0, 1fr) !important; }
  body.neo-ui-page .neo-category-function-head { flex-wrap: wrap; gap: 12px; }
  html.feature-focus-mode body.neo-ui-page .save-sidebar { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  html.feature-focus-mode body.neo-ui-page .save-sidebar-head,
  html.feature-focus-mode body.neo-ui-page .save-sidebar-status { grid-column: 1 / -1; }
  html.feature-focus-mode body.neo-ui-page .save-sidebar-import { grid-column: 1; grid-row: 3; min-width: 0; }
  html.feature-focus-mode body.neo-ui-page .save-sidebar-download { grid-column: 2; grid-row: 3; min-width: 0; }
}
