/* JINVIS unified interface system. Layout-specific rules remain in styles.css. */
:root {
  --ui-canvas: #f3f5f7;
  --ui-surface: #ffffff;
  --ui-surface-subtle: #f7f8fa;
  --ui-surface-strong: #eef1f4;
  --ui-text: #20262e;
  --ui-text-secondary: #66707b;
  --ui-text-muted: #8a929d;
  --ui-line: #dfe3e8;
  --ui-line-strong: #cbd2da;
  --ui-primary: #3c6e9e;
  --ui-primary-hover: #315c85;
  --ui-primary-soft: #edf3f8;
  --tool-chat: #536b7a;
  --tool-chat-hover: #435a68;
  --tool-chat-soft: #eef2f4;
  --tool-chat-ring: rgba(83, 107, 122, 0.18);
  --tool-query-oi: #3f7396;
  --tool-query-oi-hover: #315f7e;
  --tool-query-oi-soft: #edf4f7;
  --tool-query-oi-ring: rgba(63, 115, 150, 0.18);
  --tool-warehouse-receipt: #56758a;
  --tool-warehouse-receipt-hover: #456277;
  --tool-warehouse-receipt-soft: #edf3f6;
  --tool-warehouse-receipt-ring: rgba(86, 117, 138, 0.18);
  --tool-fund-card: #607a68;
  --tool-fund-card-hover: #4e6656;
  --tool-fund-card-soft: #eff4f0;
  --tool-fund-card-ring: rgba(96, 122, 104, 0.18);
  --tool-backtest: #3f7c78;
  --tool-backtest-hover: #326762;
  --tool-backtest-soft: #ecf5f3;
  --tool-backtest-ring: rgba(63, 124, 120, 0.18);
  --tool-pattern-k: #666fa3;
  --tool-pattern-k-hover: #535c8d;
  --tool-pattern-k-soft: #f0f1f7;
  --tool-pattern-k-ring: rgba(102, 111, 163, 0.18);
  --tool-seasonality: #92713f;
  --tool-seasonality-hover: #795b30;
  --tool-seasonality-soft: #f6f1e8;
  --tool-seasonality-ring: rgba(146, 113, 63, 0.18);
  --tool-unit-converter: #a7654c;
  --tool-unit-converter-hover: #8d513b;
  --tool-unit-converter-soft: #f8eeea;
  --tool-unit-converter-ring: rgba(167, 101, 76, 0.18);
  --tool-arbitrage: #7c607e;
  --tool-arbitrage-hover: #664d69;
  --tool-arbitrage-soft: #f4eef4;
  --tool-arbitrage-ring: rgba(124, 96, 126, 0.18);
  --ui-success: #137a48;
  --ui-danger: #b42318;
  --ui-warning: #9a6700;
  --ui-radius: 8px;
  --ui-control-height: 40px;
  --ui-shadow-float: 0 12px 30px rgba(28, 35, 45, 0.10);
  --ui-shadow-focus: 0 0 0 3px rgba(60, 110, 158, 0.18);
  --ui-font: "SF Pro Text", "PingFang SC", -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif;
  --ui-mono: "SF Mono", "Cascadia Mono", Consolas, "Courier New", monospace;

  --bg: var(--ui-canvas);
  --sidebar: var(--ui-surface);
  --panel: var(--ui-surface);
  --ink: var(--ui-text);
  --muted: var(--ui-text-secondary);
  --soft: var(--ui-surface-strong);
  --line: var(--ui-line);
  --accent: var(--ui-primary);
  --accent-soft: var(--ui-primary-soft);
  --danger: var(--ui-danger);
  --success: var(--ui-success);
  --shadow: var(--ui-shadow-float);
}

/* Tool identity colors are limited to navigation and page identity markers. */
.chat-view {
  --tool-accent: var(--tool-chat);
  --tool-accent-soft: var(--tool-chat-soft);
  --tool-accent-ring: var(--tool-chat-ring);
}

.query-oi-view {
  --tool-accent: var(--tool-query-oi);
  --tool-accent-soft: var(--tool-query-oi-soft);
  --tool-accent-ring: var(--tool-query-oi-ring);
}

.fund-card-view {
  --tool-accent: var(--tool-fund-card);
  --tool-accent-soft: var(--tool-fund-card-soft);
  --tool-accent-ring: var(--tool-fund-card-ring);
}

.backtest-rule-view {
  --tool-accent: var(--tool-backtest);
  --tool-accent-soft: var(--tool-backtest-soft);
  --tool-accent-ring: var(--tool-backtest-ring);
}

.pattern-k-view {
  --tool-accent: var(--tool-pattern-k);
  --tool-accent-soft: var(--tool-pattern-k-soft);
  --tool-accent-ring: var(--tool-pattern-k-ring);
}

.seasonality-view {
  --tool-accent: var(--tool-seasonality);
  --tool-accent-soft: var(--tool-seasonality-soft);
  --tool-accent-ring: var(--tool-seasonality-ring);
}

.unit-converter-view {
  --tool-accent: var(--tool-unit-converter);
  --tool-accent-soft: var(--tool-unit-converter-soft);
  --tool-accent-ring: var(--tool-unit-converter-ring);
}

.arbitrage-monitor-view {
  --tool-accent: var(--tool-arbitrage);
  --tool-accent-soft: var(--tool-arbitrage-soft);
  --tool-accent-ring: var(--tool-arbitrage-ring);
}

.warehouse-receipt-view {
  --tool-accent: var(--tool-warehouse-receipt);
  --tool-accent-soft: var(--tool-warehouse-receipt-soft);
  --tool-accent-ring: var(--tool-warehouse-receipt-ring);
}

*,
*::before,
*::after {
  letter-spacing: 0;
}

html,
body {
  background: var(--ui-canvas);
  color: var(--ui-text);
  font-family: var(--ui-font);
}

button,
input,
select,
textarea {
  font-family: inherit;
}

button,
input,
select,
textarea,
summary {
  transition: border-color 150ms ease, background-color 150ms ease, color 150ms ease, box-shadow 150ms ease, opacity 150ms ease;
}

button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex="0"]:focus-visible {
  outline: none;
  box-shadow: var(--ui-shadow-focus);
}

::selection {
  background: rgba(60, 110, 158, 0.18);
}

/* Application shell */
.app-shell {
  grid-template-columns: 264px minmax(0, 1fr);
  background: var(--ui-canvas);
}

.sidebar {
  gap: 12px;
  padding: 18px 14px 14px;
  border-color: var(--ui-line);
  background: var(--ui-surface);
}

.brand {
  min-height: 42px;
  padding: 0 2px;
}

.brand-title {
  color: var(--ui-text);
  font-size: 17px;
  font-weight: 700;
}

.brand-subtitle {
  color: var(--ui-text-muted);
  font-size: 11px;
}

.sidebar-toggle-btn,
.sidebar-expand-btn,
.session-menu-btn,
.profile-close-btn {
  width: 32px;
  height: 32px;
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius);
  background: var(--ui-surface);
  color: var(--ui-text-secondary);
  box-shadow: none;
}

.sidebar-toggle-btn:hover,
.sidebar-expand-btn:hover,
.session-menu-btn:hover,
.session-menu-btn[aria-expanded="true"],
.profile-close-btn:hover {
  border-color: var(--ui-line-strong);
  background: var(--ui-surface-subtle);
  color: var(--ui-primary);
}

.daily-session-menu-btn {
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--ui-text-muted);
}

.daily-session-menu-btn:hover,
.daily-session-menu-btn[aria-expanded="true"] {
  border: 0;
  background: var(--ui-surface-strong);
  color: var(--ui-text-secondary);
}

.new-chat,
.user-create-btn,
.profile-save-btn,
.query-submit,
.backtest-rule-cta,
.pattern-k-search-btn,
.pattern-k-load-current {
  min-height: var(--ui-control-height);
  border: 1px solid var(--ui-primary);
  border-radius: var(--ui-radius);
  background: var(--ui-primary);
  color: #ffffff;
  font-size: 14px;
  font-weight: 600;
  box-shadow: none;
}

.new-chat:hover,
.user-create-btn:hover,
.profile-save-btn:hover,
.query-submit:hover,
.backtest-rule-cta:hover,
.pattern-k-search-btn:hover,
.pattern-k-load-current:hover {
  border-color: var(--ui-primary-hover);
  background: var(--ui-primary-hover);
  color: #ffffff;
  transform: none;
}

.session-title {
  margin: 12px 6px 2px;
  color: var(--ui-text-muted);
  font-size: 12px;
  font-weight: 600;
}

.session-list {
  gap: 4px;
}

.session-item {
  min-height: 44px;
  border-radius: var(--ui-radius);
  padding: 5px;
}

.session-item:hover,
.session-item.active,
.session-item.menu-open {
  background: var(--ui-surface-strong);
}

.session-select {
  min-height: 34px;
  border-radius: 6px;
  color: var(--ui-text);
}

.session-select:hover {
  background: rgba(255, 255, 255, 0.72);
}

.session-name {
  font-size: 13px;
  font-weight: 400;
}

.session-pin-mark {
  background: var(--ui-primary-soft);
  color: var(--ui-primary);
}

.session-menu,
.profile-broker-menu,
.suggestion-menu,
.query-filter-picker {
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-float);
}

.sidebar-compliance {
  padding: 10px 4px 0;
  border-top: 1px solid var(--ui-line);
  color: var(--ui-text-muted);
  font-size: 11px;
}

.main {
  background: var(--ui-canvas);
}

.topbar {
  min-height: 56px;
  padding: 10px 28px;
  border-bottom: 1px solid var(--ui-line);
  background: var(--ui-surface);
}

.topbar-controls,
.auth-controls,
.auth-login-fields {
  gap: 8px;
}

.auth-input,
.model-select,
.profile-field input,
.user-field input,
.user-field select,
.session-rename-input {
  height: 36px;
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius);
  background: var(--ui-surface);
  color: var(--ui-text);
}

.auth-input:hover,
.model-select:hover,
.profile-field input:hover,
.user-field input:hover,
.user-field select:hover {
  border-color: var(--ui-line-strong);
}

.auth-btn,
.query-save,
.query-fund-card,
.pattern-k-save-btn,
.backtest-rule-add-btn,
.pattern-k-canvas-action,
.pattern-k-task-toggle {
  min-height: 36px;
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius);
  background: var(--ui-surface);
  color: var(--ui-text-secondary);
  box-shadow: none;
  font-size: 13px;
  font-weight: 600;
}

.auth-btn:hover,
.query-save:hover:not(:disabled),
.query-fund-card:hover:not(:disabled),
.pattern-k-save-btn:hover:not(:disabled),
.backtest-rule-add-btn:hover:not(:disabled),
.pattern-k-canvas-action:hover:not(:disabled),
.pattern-k-task-toggle:hover:not(:disabled) {
  border-color: var(--ui-line-strong);
  background: var(--ui-surface-subtle);
  color: var(--ui-text);
}

.auth-name.signed-in {
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius);
  background: var(--ui-surface-subtle);
  color: var(--ui-text);
  font-weight: 600;
}

.auth-entry-actions {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex-wrap: nowrap;
}

.auth-entry-btn {
  min-width: 66px;
  min-height: 34px;
  border-radius: 5px;
  padding: 0 16px;
  font-size: 12px;
  font-weight: 680;
  letter-spacing: 0.02em;
}

.auth-login-open {
  border: 1px solid #aebbc5;
  background: var(--ui-surface);
  color: #29475c;
}

.auth-login-open:hover:not(:disabled) {
  border-color: #718b9e;
  background: #f5f8fa;
}

.auth-register-open {
  border: 1px solid #254c68;
  background: #2f617f;
  color: #ffffff;
}

.auth-register-open:hover:not(:disabled) {
  background: #284f69;
}

.auth-feedback:empty {
  display: none;
}

.auth-feedback,
.voice-status,
.query-status,
.pattern-k-status,
.backtest-rule-status {
  color: var(--ui-text-secondary);
  font-size: 12px;
}

.workspace-nav {
  position: relative;
  z-index: 20;
  display: flex;
  align-items: center;
  min-width: 0;
  min-height: 48px;
  padding: 5px 0;
  border-bottom: 1px solid var(--ui-line);
  background: var(--ui-surface);
}

.workspace-nav.tool-settings-open {
  z-index: 80;
}

.workspace-settings-btn {
  display: grid;
  flex: 0 0 38px;
  place-items: center;
  width: 38px;
  height: 38px;
  min-height: 38px;
  margin-left: 8px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--ui-text-muted);
}

.workspace-settings-btn::after {
  content: none;
}

.workspace-settings-btn svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 180ms ease;
}

.workspace-settings-btn:hover,
.workspace-settings-btn[aria-expanded="true"] {
  background: var(--ui-surface-subtle);
  color: var(--ui-primary);
}

.workspace-settings-btn[aria-expanded="true"] svg {
  transform: rotate(22deg);
}

.workspace-settings-btn:focus-visible {
  outline: 2px solid rgba(60, 110, 158, 0.42);
  outline-offset: -3px;
}

.workspace-tabs {
  align-items: center;
  flex: 1 1 auto;
  min-height: 38px;
  gap: 16px;
  overflow-x: auto;
  padding: 0 28px 0 12px;
  border-bottom: 0;
  background: transparent;
  scrollbar-width: none;
}

.workspace-tabs::-webkit-scrollbar {
  display: none;
}

.workspace-tab {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
  height: 38px;
  min-height: 38px;
  border: 0;
  border-radius: 0;
  padding: 0 3px;
  background: transparent;
  color: var(--ui-text-secondary);
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  transition: color 160ms ease;
}

.workspace-tab:hover {
  background: transparent;
  color: var(--ui-text);
}

.workspace-tab + .workspace-tab::before {
  content: "";
  position: absolute;
  top: 11px;
  left: -8px;
  width: 1px;
  height: 16px;
  background: var(--ui-line-strong);
}

.workspace-tab.active {
  background: transparent;
  color: var(--ui-primary);
  box-shadow: none;
}

.workspace-tab:focus-visible {
  outline: 2px solid rgba(60, 110, 158, 0.42);
  outline-offset: 2px;
}

.workspace-tab-icon {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 6px;
  background: var(--ui-surface-subtle);
  color: var(--ui-text-muted);
  transition: background-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.workspace-tab-icon svg,
.workspace-tool-option-icon svg,
.workspace-tool-settings-head button svg,
.workspace-tool-config-btn svg,
.workspace-tool-detail-head button svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.workspace-tab:hover .workspace-tab-icon {
  background: var(--ui-surface-strong);
  color: var(--ui-text);
  transform: translateY(-1px);
}

.workspace-tab.active .workspace-tab-icon {
  background: var(--ui-primary-soft);
  color: var(--ui-primary);
}

.workspace-tab.active::after {
  content: "";
  position: absolute;
  bottom: -1px;
  left: 50%;
  width: 20px;
  height: 2px;
  border-radius: 2px 2px 0 0;
  background: var(--ui-primary);
  transform: translateX(-50%);
}

.workspace-tab[data-view="chat"] {
  --tool-accent: var(--tool-chat);
  --tool-accent-soft: var(--tool-chat-soft);
  --tool-accent-ring: var(--tool-chat-ring);
}

.workspace-tab[data-view="query-oi"] {
  --tool-accent: var(--tool-query-oi);
  --tool-accent-soft: var(--tool-query-oi-soft);
  --tool-accent-ring: var(--tool-query-oi-ring);
}

.workspace-tab[data-view="warehouse-receipt"] {
  --tool-accent: var(--tool-warehouse-receipt);
  --tool-accent-soft: var(--tool-warehouse-receipt-soft);
  --tool-accent-ring: var(--tool-warehouse-receipt-ring);
}

.workspace-tab[data-view="fund-card"] {
  --tool-accent: var(--tool-fund-card);
  --tool-accent-soft: var(--tool-fund-card-soft);
  --tool-accent-ring: var(--tool-fund-card-ring);
}

.workspace-tab[data-view="backtest-rule"] {
  --tool-accent: var(--tool-backtest);
  --tool-accent-soft: var(--tool-backtest-soft);
  --tool-accent-ring: var(--tool-backtest-ring);
}

.workspace-tab[data-view="pattern-k"] {
  --tool-accent: var(--tool-pattern-k);
  --tool-accent-soft: var(--tool-pattern-k-soft);
  --tool-accent-ring: var(--tool-pattern-k-ring);
}

.workspace-tab[data-view="seasonality"] {
  --tool-accent: var(--tool-seasonality);
  --tool-accent-soft: var(--tool-seasonality-soft);
  --tool-accent-ring: var(--tool-seasonality-ring);
}

.workspace-tab[data-view="unit-converter"] {
  --tool-accent: var(--tool-unit-converter);
  --tool-accent-soft: var(--tool-unit-converter-soft);
  --tool-accent-ring: var(--tool-unit-converter-ring);
}

.workspace-tab[data-view="arbitrage-monitor"] {
  --tool-accent: var(--tool-arbitrage);
  --tool-accent-soft: var(--tool-arbitrage-soft);
  --tool-accent-ring: var(--tool-arbitrage-ring);
}

.workspace-tab[data-workspace-tool] .workspace-tab-icon {
  background: var(--tool-accent-soft);
  color: var(--tool-accent);
  color: color-mix(in srgb, var(--tool-accent) 76%, var(--ui-text-muted));
}

.workspace-tab[data-workspace-tool]:hover,
.workspace-tab[data-workspace-tool].active {
  color: var(--tool-accent);
}

.workspace-tab[data-workspace-tool]:hover .workspace-tab-icon,
.workspace-tab[data-workspace-tool].active .workspace-tab-icon {
  background: var(--tool-accent-soft);
  color: var(--tool-accent);
}

.workspace-tab[data-workspace-tool].active::after {
  background: var(--tool-accent);
}

.workspace-tab[data-workspace-tool]:focus-visible {
  outline-color: var(--tool-accent-ring);
}

.daily-session-item:has(.daily-session-select[data-daily-module="query_oi"]) {
  --tool-accent: var(--tool-query-oi);
  --tool-accent-soft: var(--tool-query-oi-soft);
  --tool-session-ring: var(--tool-query-oi-ring);
}

.daily-session-item:has(.daily-session-select[data-daily-module="fund_card"]) {
  --tool-accent: var(--tool-fund-card);
  --tool-accent-soft: var(--tool-fund-card-soft);
  --tool-session-ring: var(--tool-fund-card-ring);
}

.daily-session-item:has(.daily-session-select[data-daily-module="pattern_k"]) {
  --tool-accent: var(--tool-pattern-k);
  --tool-accent-soft: var(--tool-pattern-k-soft);
  --tool-session-ring: var(--tool-pattern-k-ring);
}

.daily-session-select[data-daily-module] .daily-session-icon {
  background: var(--tool-accent, var(--ui-primary));
  box-shadow: 0 0 0 4px var(--tool-session-ring);
}

.daily-session-select[data-daily-module] .daily-session-count strong {
  color: var(--tool-accent, var(--ui-primary));
}

.workspace-tool-settings {
  position: absolute;
  top: calc(100% + 8px);
  left: 12px;
  z-index: 50;
  width: min(320px, calc(100vw - 28px));
  max-height: calc(100vh - 112px);
  overflow-x: hidden;
  overflow-y: auto;
  border: 1px solid var(--ui-line-strong);
  border-radius: var(--ui-radius);
  background: var(--ui-surface);
  box-shadow: 0 14px 34px rgba(28, 35, 45, 0.15);
  animation: workspace-tool-settings-in 150ms ease-out;
}

.workspace-tool-settings.is-detail-open {
  width: min(700px, calc(100vw - 28px));
}

.workspace-tool-settings[hidden] {
  display: none;
}

.workspace-tool-settings-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 46px;
  padding: 0 10px 0 14px;
  border-bottom: 1px solid var(--ui-line);
}

.workspace-tool-settings-head strong {
  color: var(--ui-text);
  font-size: 13px;
  font-weight: 650;
}

.workspace-tool-settings-head button {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--ui-text-muted);
}

.workspace-tool-settings-head button:hover {
  background: var(--ui-surface-subtle);
  color: var(--ui-text);
}

.workspace-tool-settings-list {
  display: grid;
  padding: 6px;
}

#workspaceToolSettingsOverview[hidden],
.workspace-tool-detail[hidden],
.workspace-broker-groups[hidden] {
  display: none;
}

.workspace-tool-option {
  position: relative;
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) 24px 30px 36px;
  align-items: center;
  gap: 9px;
  min-height: 44px;
  padding: 4px 8px;
  border-radius: 6px;
}

.workspace-tool-option:hover {
  background: var(--ui-surface-subtle);
}

.workspace-tool-option-icon {
  width: 28px;
  height: 28px;
  color: var(--ui-text-secondary);
}

.workspace-tool-option-name {
  min-width: 0;
  color: var(--ui-text);
  font-size: 13px;
  font-weight: 550;
}

.workspace-tool-config-btn,
.workspace-tool-detail-head button {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--ui-text-muted);
}

.workspace-tool-info-btn {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 0;
  border-radius: 50%;
  padding: 0;
  background: transparent;
  color: var(--ui-text-muted);
}

.workspace-tool-info-btn svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
}

.workspace-tool-info-btn:hover,
.workspace-tool-info-btn:focus-visible {
  color: var(--ui-primary);
}

.workspace-tool-info-btn:focus-visible {
  outline: 2px solid rgba(60, 110, 158, 0.34);
  outline-offset: 1px;
}

.workspace-tool-info-tooltip {
  position: fixed;
  z-index: 240;
  display: grid;
  gap: 7px;
  width: min(300px, calc(100vw - 16px));
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 6px;
  padding: 9px 10px;
  background: #27313d;
  box-shadow: 0 8px 22px rgba(20, 27, 36, 0.2);
  color: #f6f8fa;
  font-size: 12px;
  line-height: 1.55;
  pointer-events: none;
}

.workspace-tool-info-tooltip p {
  margin: 0;
}

.workspace-tool-info-billing {
  padding-top: 7px;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
  color: #fff3c4;
}

.workspace-tool-info-tooltip[hidden] {
  display: none;
}

.workspace-tool-config-btn:hover,
.workspace-tool-detail-head button:hover {
  background: var(--ui-surface-strong);
  color: var(--ui-primary);
}

.workspace-tool-visibility {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.workspace-tool-visibility input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.workspace-tool-switch {
  position: relative;
  width: 34px;
  height: 20px;
  border: 1px solid var(--ui-line-strong);
  border-radius: 10px;
  background: var(--ui-surface-strong);
  transition: border-color 160ms ease, background-color 160ms ease;
}

.workspace-tool-switch::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--ui-surface);
  box-shadow: 0 1px 3px rgba(28, 35, 45, 0.24);
  transition: transform 160ms ease;
}

.workspace-tool-visibility input:checked + .workspace-tool-switch {
  border-color: var(--ui-primary);
  background: var(--ui-primary);
}

.workspace-tool-visibility input:checked + .workspace-tool-switch::after {
  transform: translateX(14px);
}

.workspace-tool-visibility input:focus-visible + .workspace-tool-switch {
  outline: 2px solid rgba(60, 110, 158, 0.42);
  outline-offset: 2px;
}

.workspace-tool-detail {
  display: grid;
  padding: 0 16px 18px;
}

.workspace-tool-detail-head {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 62px;
  border-bottom: 1px solid var(--ui-line);
}

.workspace-tool-detail-head > div {
  display: grid;
  gap: 2px;
}

.workspace-tool-detail-head span {
  color: var(--ui-text-muted);
  font-size: 11px;
}

.workspace-tool-detail-head strong {
  color: var(--ui-text);
  font-size: 15px;
  font-weight: 650;
}

.workspace-tool-detail-empty {
  display: grid;
  place-items: center;
  min-height: 116px;
  margin: 0;
  color: var(--ui-text-muted);
  font-size: 12px;
}

.workspace-tool-detail-empty[hidden] {
  display: none;
}

.workspace-tool-settings-status {
  min-height: 0;
  padding: 0 14px;
  color: var(--ui-danger);
  font-size: 11px;
}

.workspace-tool-settings-status:not(:empty) {
  min-height: 30px;
  padding-top: 6px;
  border-top: 1px solid var(--ui-line);
}

@keyframes workspace-tool-settings-in {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Shared typography and controls */
.query-oi-eyebrow,
.backtest-rule-eyebrow,
.pattern-k-eyebrow,
.user-management-eyebrow,
.news-eyebrow,
.profile-eyebrow,
.profile-section-eyebrow {
  color: var(--ui-primary);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
  text-transform: none;
}

.query-oi-header h1,
.backtest-rule-title,
.pattern-k-title,
.user-management-header h1,
.news-header h1 {
  margin: 0;
  color: var(--ui-text);
  font-family: var(--ui-font);
  font-size: 32px;
  font-weight: 650;
  line-height: 1.2;
}

.module-page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  min-height: 74px;
  padding: 8px 2px 12px;
  border: 0;
  background: transparent;
}

.module-page-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--tool-accent, var(--ui-primary));
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0;
  text-transform: none;
}

.module-page-eyebrow > span {
  flex: 0 0 7px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--tool-accent, var(--ui-primary));
  box-shadow: 0 0 0 4px rgba(60, 110, 158, 0.12);
  box-shadow: 0 0 0 4px var(--tool-accent-ring, rgba(60, 110, 158, 0.12));
}

.module-page-header .module-page-title {
  margin: 0;
  color: var(--ui-text);
  font-family: var(--ui-font);
  font-size: 32px;
  font-weight: 650;
  line-height: 1.2;
  letter-spacing: 0;
}

.module-page-heading {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.module-title-line {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.module-help {
  position: relative;
  display: inline-grid;
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  min-width: 16px;
  padding: 0;
  place-items: center;
  border: 1px solid var(--ui-line-strong);
  border-radius: 50%;
  background: transparent;
  color: var(--ui-text-muted);
  font-family: var(--ui-font);
  font-size: 10px;
  font-weight: 700;
  line-height: 14px;
  cursor: help;
}

.module-help:hover,
.module-help:focus-visible {
  border-color: var(--ui-primary);
  background: transparent;
  color: var(--ui-primary);
  outline: none;
}

.module-help-popover {
  position: fixed;
  z-index: 250;
  width: min(440px, calc(100vw - 24px));
  max-height: min(560px, calc(100vh - 24px));
  overflow: hidden;
  border: 1px solid var(--ui-line-strong);
  border-radius: 8px;
  background: var(--ui-surface);
  box-shadow: 0 14px 34px rgba(28, 35, 45, 0.16);
  color: var(--ui-text-secondary);
}

.module-help-popover[hidden] {
  display: none;
}

.module-help-popover-title {
  display: block;
  padding: 11px 14px;
  border-bottom: 1px solid var(--ui-line);
  color: var(--ui-text);
  font-size: 13px;
  font-weight: 650;
}

.module-help-popover-list {
  display: grid;
  max-height: min(510px, calc(100vh - 76px));
  overflow-y: auto;
  overscroll-behavior: contain;
}

.module-help-popover-item {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 12px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--ui-line);
}

.module-help-popover-item:last-child {
  border-bottom: 0;
}

.module-help-popover-item > span {
  color: var(--ui-primary);
  font-size: 12px;
  font-weight: 650;
  line-height: 1.6;
}

.module-help-popover-item > p {
  margin: 0;
  color: var(--ui-text-secondary);
  font-size: 12px;
  line-height: 1.6;
}

.backtest-rule-card-title,
.pattern-k-results-head h2,
.query-fund-card-header h2,
.backtest-rule-report-head h2,
.user-management-header h2 {
  color: var(--ui-text);
  font-family: var(--ui-font);
  font-size: 20px;
  font-weight: 650;
  line-height: 1.3;
}

.panel-title,
.sub-panel-title,
.backtest-rule-cond-head,
.backtest-rule-report-title,
.pattern-k-search-heading,
.pattern-k-task-head,
.pattern-k-match-title {
  color: var(--ui-text);
  font-size: 15px;
  font-weight: 650;
}

.query-controls label,
.query-control-label,
.mode-field,
.query-mode-field,
.query-oi-product-field,
.query-fund-card-label,
.pattern-k-field,
.pattern-k-mode-field,
.backtest-rule-view .backtest-rule-field,
.user-field,
.profile-field {
  color: var(--ui-text-secondary);
  font-size: 12px;
  font-weight: 600;
}

.segmented-control {
  min-height: var(--ui-control-height);
  border-color: var(--ui-line);
  border-radius: var(--ui-radius);
  background: var(--ui-surface-strong);
  box-shadow: inset 0 1px 2px rgba(28, 35, 45, 0.04);
}

.segmented-control::before {
  border-color: rgba(32, 38, 46, 0.08);
  border-radius: 6px;
  background: var(--ui-surface);
  box-shadow: 0 1px 3px rgba(28, 35, 45, 0.12);
}

.segment {
  color: var(--ui-text-secondary);
  font-size: 13px;
  font-weight: 600;
}

.segment.active {
  color: var(--ui-text);
}

/* Chat */
.chat-view {
  background: var(--ui-canvas);
}

.welcome {
  padding: 24px 28px;
}

.welcome-inner {
  gap: 20px;
  transform: translateY(-8vh);
}

.welcome h1 {
  color: var(--ui-text);
  font-size: 32px;
  font-weight: 650;
  line-height: 1.25;
}

.welcome-title-line {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.starter-prompts {
  gap: 8px;
  justify-self: center;
}

.starter-prompt {
  min-height: 36px;
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius);
  background: var(--ui-surface);
  color: var(--ui-text-secondary);
  padding: 0 13px;
  font-size: 13px;
  font-weight: 500;
  box-shadow: none;
  transform: none;
}

.starter-prompt:hover {
  border-color: rgba(60, 110, 158, 0.34);
  background: var(--ui-surface-subtle);
  color: var(--ui-primary);
  box-shadow: 0 6px 14px rgba(28, 35, 45, 0.08);
  transform: translateY(-1px);
}

.starter-prompt:focus-visible {
  outline: none;
  border-color: var(--ui-primary);
  box-shadow: var(--ui-shadow-focus);
}

.starter-prompt:active {
  box-shadow: none;
  transform: translateY(0);
}

body.has-session .starter-prompts {
  display: none;
}

.messages {
  padding: 24px 28px;
}

.message-stack {
  gap: 16px;
}

.bubble {
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius);
  padding: 12px 14px;
  color: var(--ui-text);
  font-size: 14px;
  line-height: 1.65;
}

.user .bubble {
  border-color: rgba(60, 110, 158, 0.14);
  background: var(--ui-primary-soft);
}

.assistant .bubble {
  background: var(--ui-surface);
  box-shadow: none;
}

.composer-wrap {
  padding: 12px 28px 22px;
}

.input-box {
  gap: 8px;
  border: 1px solid var(--ui-line-strong);
  border-radius: 10px;
  background: var(--ui-surface);
  box-shadow: 0 8px 24px rgba(28, 35, 45, 0.08);
  padding: 10px;
}

.input-box:focus-within {
  border-color: var(--ui-primary);
  box-shadow: var(--ui-shadow-focus), 0 8px 24px rgba(28, 35, 45, 0.08);
}

.input-box textarea {
  color: var(--ui-text);
  font-size: 14px;
  line-height: 1.55;
}

.icon-btn,
.send-btn {
  width: 40px;
  height: 40px;
  border-radius: var(--ui-radius);
  box-shadow: none;
}

.icon-btn {
  border: 1px solid var(--ui-line);
  background: var(--ui-surface);
  color: var(--ui-text-secondary);
}

.send-btn {
  border: 1px solid var(--ui-primary);
  background: var(--ui-primary);
  color: #ffffff;
}

@media (min-width: 821px) {
  body:not(.has-session) .chat-view.active {
    grid-template-rows: auto auto;
    align-content: center;
    gap: 18px;
    padding-bottom: 6vh;
  }

  body:not(.has-session) .welcome {
    min-height: 0;
    overflow: visible;
    padding: 0 28px;
  }

  body:not(.has-session) .welcome-inner {
    transform: none;
  }

  body:not(.has-session) .composer-wrap {
    position: static;
    inset: auto;
    transform: none;
    padding: 0 28px;
  }

  body:not(.has-session) .input-box {
    min-height: 84px;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(28, 35, 45, 0.08);
  }

  body:not(.has-session) #promptInput {
    min-height: 60px;
    font-size: 15px;
  }
}

.voice-status.error,
.query-status.error,
.pattern-k-status.error,
.backtest-rule-status.error {
  color: var(--ui-danger);
}

/* Module page shells */
.query-oi-view,
.fund-card-view,
.backtest-rule-view,
.pattern-k-view,
.seasonality-view,
.warehouse-receipt-view,
.unit-converter-view,
.arbitrage-monitor-view,
.news-view,
.user-management-view {
  padding: 24px 28px 40px;
  background: var(--ui-canvas);
  color: var(--ui-text);
  font-family: var(--ui-font);
}

.query-oi-panel,
.fund-card-panel,
.backtest-rule-panel,
.pattern-k-panel,
.seasonality-panel,
.warehouse-receipt-panel,
.unit-converter-panel,
.arbitrage-monitor-panel,
.news-panel,
.user-management-panel {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  align-self: start;
  align-content: start;
}

.query-oi-panel,
.fund-card-panel,
.backtest-rule-panel,
.pattern-k-panel,
.seasonality-panel,
.unit-converter-panel,
.arbitrage-monitor-panel {
  gap: 20px;
  padding-top: 0;
}

.query-oi-header,
.fund-card-page-header,
.backtest-rule-hero,
.pattern-k-header,
.news-header,
.user-management-header {
  min-height: 74px;
  padding: 8px 2px 12px;
  border: 0;
  background: transparent;
}

/* Fund cards */
.fund-card-view {
  align-content: start;
  overflow-y: auto;
}

.fund-card-panel {
  display: grid;
  align-self: start;
  align-content: start;
  gap: 18px;
}

.fund-card-update-status {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 34px;
  color: var(--ui-text-secondary);
  font-size: 12px;
}

.fund-card-update-status strong {
  color: var(--ui-text);
  font-variant-numeric: tabular-nums;
}

.fund-card-update-status em {
  padding: 3px 8px;
  border: 1px solid var(--ui-line);
  border-radius: 999px;
  background: var(--ui-surface);
  font-style: normal;
  font-variant-numeric: tabular-nums;
}

.fund-card-update-status em.completed {
  border-color: color-mix(in srgb, var(--ui-success) 34%, var(--ui-line));
  background: color-mix(in srgb, var(--ui-success) 8%, var(--ui-surface));
  color: var(--ui-success);
}

.fund-card-update-status em.pending,
.fund-card-update-status .error {
  color: var(--ui-danger);
}

.fund-card-controls {
  display: grid;
  grid-template-columns: 138px 180px 220px auto;
  align-items: end;
  justify-content: start;
  gap: 14px;
  padding: 18px 0;
  border-top: 1px solid var(--ui-line);
  border-bottom: 1px solid var(--ui-line);
}

.fund-card-field {
  position: relative;
  display: grid;
  gap: 8px;
  min-width: 0;
}

.fund-card-field > span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--ui-text-secondary);
  font-size: 12px;
  font-weight: 600;
}

.fund-card-date-field input,
.fund-card-variety-toggle,
.fund-card-variety-picker input,
.fund-card-fetch-btn,
.fund-card-save-btn {
  min-height: var(--ui-control-height);
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius);
  background: var(--ui-surface);
  color: var(--ui-text);
  padding: 0 12px;
  font-size: 13px;
}

.fund-card-date-field input:hover,
.fund-card-variety-toggle:hover,
.fund-card-variety-picker input:hover,
.fund-card-save-btn:hover:not(:disabled) {
  border-color: var(--ui-line-strong);
}

.fund-card-date-field input:focus,
.fund-card-variety-toggle:focus-visible,
.fund-card-variety-picker input:focus {
  border-color: var(--ui-primary);
  outline: none;
  box-shadow: var(--ui-shadow-focus);
}

.fund-card-variety-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  cursor: pointer;
  text-align: left;
}

.fund-card-variety-toggle > span:first-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.fund-card-variety-caret {
  flex: 0 0 auto;
  color: var(--ui-text-muted);
  font-size: 13px;
}

.fund-card-variety-field {
  width: 220px;
}

.fund-card-variety-picker {
  position: absolute;
  z-index: 110;
  top: calc(100% + 8px);
  left: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  width: min(360px, calc(100vw - 64px));
  padding: 12px;
  border: 1px solid var(--ui-line-strong);
  border-radius: var(--ui-radius);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-lg);
}

.fund-card-variety-picker.hidden {
  display: none;
}

.fund-card-variety-menu {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  max-height: 300px;
  overflow-y: auto;
}

.fund-card-variety-option {
  display: flex;
  align-items: baseline;
  gap: 7px;
  min-width: 0;
  min-height: 36px;
  border: 1px solid transparent;
  border-radius: var(--ui-radius-sm);
  background: transparent;
  color: var(--ui-text-secondary);
  padding: 7px 9px;
  cursor: pointer;
  text-align: left;
}

.fund-card-variety-option:hover {
  background: var(--ui-surface-subtle);
  color: var(--ui-text);
}

.fund-card-variety-option.selected {
  border-color: color-mix(in srgb, var(--ui-primary) 34%, var(--ui-line));
  background: var(--ui-primary-soft);
  color: var(--ui-primary);
}

.fund-card-variety-option strong {
  flex: 0 0 auto;
  font-size: 12px;
}

.fund-card-variety-option span {
  min-width: 0;
  overflow: hidden;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.fund-card-variety-empty {
  grid-column: 1 / -1;
  padding: 18px;
  color: var(--ui-text-muted);
  font-size: 12px;
  text-align: center;
}

.fund-card-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.fund-card-fetch-btn,
.fund-card-save-btn {
  min-width: 92px;
  cursor: pointer;
  font-weight: 600;
}

.fund-card-fetch-btn {
  border-color: var(--ui-primary);
  background: var(--ui-primary);
  color: #fff;
}

.fund-card-fetch-btn:hover:not(:disabled) {
  border-color: var(--ui-primary-hover);
  background: var(--ui-primary-hover);
}

.fund-card-fetch-btn:disabled,
.fund-card-save-btn:disabled {
  cursor: default;
  opacity: 0.5;
}

.fund-card-status {
  min-height: 20px;
  color: var(--ui-text-secondary);
  font-size: 12px;
  line-height: 1.5;
}

.fund-card-status:empty {
  display: none;
}

.fund-card-status.success {
  color: var(--ui-success);
}

.fund-card-status.error {
  color: var(--ui-danger);
}

.fund-card-result {
  display: grid;
  gap: 16px;
  padding-top: 4px;
}

.fund-card-result-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--ui-line);
}

.fund-card-result-header h2 {
  margin: 0;
  color: var(--ui-text);
  font-size: 20px;
  font-weight: 650;
}

.fund-card-result-header span {
  color: var(--ui-text-muted);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

.fund-card-gallery {
  display: grid;
  grid-template-columns: minmax(0, 820px);
  justify-content: center;
  gap: 28px;
}

.fund-card-item {
  display: grid;
  gap: 8px;
  min-width: 0;
  margin: 0;
}

.fund-card-item figcaption {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  padding: 0 2px;
}

.fund-card-item figcaption strong {
  color: var(--ui-text);
  font-size: 14px;
  font-weight: 650;
}

.fund-card-item figcaption span {
  color: var(--ui-text-muted);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

.fund-card-item img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid var(--ui-line-strong);
  border-radius: 4px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(28, 35, 45, 0.08);
}

/* Position query */
.query-oi-view {
  --oi-blue: var(--ui-primary);
  --oi-blue-focus: var(--ui-primary-hover);
  --oi-ink: var(--ui-text);
  --oi-muted: var(--ui-text-secondary);
  --oi-muted-soft: var(--ui-text-muted);
  --oi-line: var(--ui-line);
  --oi-divider: var(--ui-line);
  --oi-canvas: var(--ui-surface);
  --oi-parchment: var(--ui-canvas);
  --oi-dark: var(--ui-text);
  --oi-long: var(--ui-danger);
  --oi-short: var(--ui-success);
}

.query-oi-copy {
  gap: 4px;
}

.query-oi-exchange-status,
.query-controls,
.query-fund-card-result,
.series-panel,
.table-panel,
.ranking-card,
.detail-table-card,
.option-class-block {
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius);
  background: var(--ui-surface);
  box-shadow: none;
}

.query-oi-exchange-status {
  min-height: 36px;
  padding: 8px 12px;
  color: var(--ui-text-secondary);
  backdrop-filter: none;
}

.query-controls {
  gap: 14px;
  padding: 18px;
  backdrop-filter: none;
}

.query-control-row {
  gap: 14px;
}

.query-controls select,
.query-controls input,
.pattern-k-field input,
.pattern-k-field select,
.backtest-rule-view .backtest-rule-field input,
.backtest-rule-view .backtest-rule-field select,
.backtest-rule-condition-row input,
.backtest-rule-condition-row select {
  min-height: var(--ui-control-height);
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius);
  background: var(--ui-surface);
  color: var(--ui-text);
  padding: 0 12px;
  font-size: 14px;
  font-weight: 400;
  box-shadow: none;
}

.query-controls select:hover,
.query-controls input:hover,
.pattern-k-field input:hover,
.pattern-k-field select:hover,
.backtest-rule-view .backtest-rule-field input:hover,
.backtest-rule-view .backtest-rule-field select:hover,
.backtest-rule-condition-row input:hover,
.backtest-rule-condition-row select:hover {
  border-color: var(--ui-line-strong);
}

.query-controls select:focus,
.query-controls input:focus,
.pattern-k-field input:focus,
.pattern-k-field select:focus,
.backtest-rule-view .backtest-rule-field input:focus,
.backtest-rule-view .backtest-rule-field select:focus,
.backtest-rule-condition-row input:focus,
.backtest-rule-condition-row select:focus {
  border-color: var(--ui-primary);
  outline: none;
  box-shadow: var(--ui-shadow-focus);
}

.query-action-group {
  gap: 8px;
  align-items: flex-end;
}

.query-controls .query-submit,
.query-controls .query-fund-card,
.query-controls .query-save {
  min-height: var(--ui-control-height);
  border-radius: var(--ui-radius);
  box-shadow: none;
  font-size: 13px;
  font-weight: 600;
}

.query-controls .query-submit {
  border-color: var(--ui-primary);
  background: var(--ui-primary);
}

.query-controls .query-fund-card,
.query-controls .query-save {
  border-color: var(--ui-line);
  background: var(--ui-surface);
  color: var(--ui-text-secondary);
}

.query-filter-row {
  padding: 10px 0;
}

.query-filter-row + .query-filter-row {
  border-color: var(--ui-line);
}

.query-controls .query-filter-head {
  color: var(--ui-text);
  font-size: 14px;
  font-weight: 600;
}

.query-filter-title {
  font-size: 14px;
  font-weight: 600;
}

.query-controls .query-filter-toggle {
  min-height: 30px;
  border: 1px dashed var(--ui-line-strong);
  border-radius: var(--ui-radius);
  background: var(--ui-surface);
  color: var(--ui-text-secondary);
  font-size: 12px;
  box-shadow: none;
}

.query-controls .query-filter-toggle:hover,
.query-controls .query-filter-toggle.active,
.query-filter-row.expanded .query-filter-toggle {
  border-color: var(--ui-primary);
  background: var(--ui-primary-soft);
  color: var(--ui-primary);
}

.query-filter-picker {
  padding: 12px;
}

.query-status {
  min-height: 34px;
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius);
  background: var(--ui-surface);
  padding: 7px 12px;
  backdrop-filter: none;
}

.query-status:empty {
  display: none;
}

.query-fund-card-result {
  gap: 14px;
  padding: 18px;
}

.query-fund-card-header {
  padding-bottom: 12px;
  border-color: var(--ui-line);
}

.query-fund-card-item img {
  border: 1px solid var(--ui-line-strong);
  border-radius: 4px;
  box-shadow: 0 6px 18px rgba(28, 35, 45, 0.08);
}

.query-result {
  gap: 16px;
}

.metric-grid,
.metric-grid.option-summary {
  overflow: hidden;
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius);
  background: var(--ui-surface);
}

.metric-card,
.metric-grid.option-summary .metric-card {
  min-height: 92px;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 16px;
}

.metric-card + .metric-card,
.metric-grid.option-summary .metric-card + .metric-card {
  border-left: 1px solid var(--ui-line);
}

.metric-card span,
.metric-card small {
  color: var(--ui-text-secondary);
  font-size: 12px;
}

.metric-card strong {
  color: var(--ui-text);
  font-family: var(--ui-mono);
  font-size: 24px;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
}

.series-panel,
.table-panel {
  padding: 18px;
}

.chart-panel,
.table-panel .table-scroll,
.detail-table-card,
.ranking-card {
  box-shadow: none;
}

.data-table th,
.side-table th,
.broker-variety-table th {
  color: var(--ui-text-secondary);
  font-size: 11px;
  font-weight: 600;
}

.data-table td,
.side-table td,
.broker-variety-table td {
  color: var(--ui-text);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

/* Backtest */
.backtest-rule-view {
  --br-blue: var(--ui-primary);
  --br-blue-focus: var(--ui-primary-hover);
  --br-ink: var(--ui-text);
  --br-muted: var(--ui-text-secondary);
  --br-line: var(--ui-line);
  --br-divider: var(--ui-line);
  --br-canvas: var(--ui-surface);
  --br-parchment: var(--ui-canvas);
  --br-pearl: var(--ui-surface-subtle);
  --br-success: var(--ui-success);
  --br-danger: var(--ui-danger);
}

.backtest-rule-view .backtest-rule-controls {
  gap: 16px;
}

.backtest-rule-engine-row,
.backtest-rule-card,
.backtest-rule-report-card,
.backtest-rule-schema-drawer {
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius);
  background: var(--ui-surface);
  box-shadow: none;
}

.backtest-rule-engine-row {
  min-height: 64px;
  padding: 11px 14px;
}

.backtest-rule-card {
  gap: 16px;
  padding: 20px;
}

.backtest-rule-view .backtest-rule-field input,
.backtest-rule-view .backtest-rule-field select {
  height: var(--ui-control-height);
}

.backtest-rule-view .backtest-rule-toggle {
  color: var(--ui-text-secondary);
  font-size: 13px;
}

.backtest-rule-view .backtest-rule-toggle input {
  accent-color: var(--ui-primary);
}

.backtest-rule-help {
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius);
  background: var(--ui-surface-subtle);
  color: var(--ui-text-secondary);
}

.backtest-rule-help summary {
  color: var(--ui-primary);
}

.backtest-rule-add-btn {
  color: var(--ui-primary);
}

.backtest-rule-remove-btn {
  border-radius: 6px;
  background: transparent;
  color: var(--ui-text-muted);
}

.backtest-rule-remove-btn:hover {
  background: rgba(180, 35, 24, 0.08);
  color: var(--ui-danger);
}

.backtest-rule-cta-bar {
  gap: 12px;
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 6px 20px rgba(28, 35, 45, 0.06);
}

.backtest-rule-cta {
  border-radius: var(--ui-radius);
  box-shadow: none;
}

.backtest-rule-view .metric-grid {
  gap: 0;
}

.backtest-rule-view .metric-card {
  border-radius: 0;
  background: transparent;
}

.backtest-rule-view .metric-card strong {
  font-family: var(--ui-mono);
  font-size: 24px;
}

.backtest-rule-report-grid {
  gap: 16px;
}

.backtest-rule-report-card {
  padding: 18px;
}

.backtest-rule-report-stats strong,
.backtest-rule-output {
  font-family: var(--ui-mono);
}

/* Similar K-line */
.pattern-k-view {
  --pk-ink: var(--ui-text);
  --pk-muted: var(--ui-text-secondary);
  --pk-line: var(--ui-line);
  --pk-blue: var(--ui-primary);
  --pk-green: var(--ui-success);
}

.pattern-k-eyebrow > span {
  background: var(--ui-primary);
}

.pattern-k-input-tool,
.pattern-k-task-section,
.pattern-k-match,
.pattern-k-outlook,
.pattern-k-empty {
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius);
  background: var(--ui-surface);
  box-shadow: none;
}

.pattern-k-input-tool {
  overflow: hidden;
}

.pattern-k-section-head {
  min-height: 58px;
  padding: 10px 16px;
  border-color: var(--ui-line);
  background: var(--ui-surface);
}

.pattern-k-input-body {
  border-color: var(--ui-line);
}

.pattern-k-target-column,
.pattern-k-search-column {
  padding: 16px;
}

.pattern-k-search-column {
  border-color: var(--ui-line);
  background: var(--ui-surface-subtle);
}

.pattern-k-target-stage,
.pattern-k-current-target,
.pattern-k-current-preview-surface,
.pattern-k-chart {
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius);
  background: var(--ui-surface-subtle);
}

.pattern-k-target-stage {
  overflow: hidden;
}

.pattern-k-free-target canvas,
.pattern-k-current-preview canvas {
  border-radius: var(--ui-radius);
}

.pattern-k-field input,
.pattern-k-field select {
  background: var(--ui-surface);
}

.pattern-k-canvas-action {
  width: 34px;
  height: 34px;
  min-height: 34px;
  padding: 0;
}

.pattern-k-search-btn,
.pattern-k-load-current {
  min-height: var(--ui-control-height);
  border-radius: var(--ui-radius);
  background: var(--ui-primary);
}

.pattern-k-action-row {
  border-color: var(--ui-line);
}

.pattern-k-task-section {
  padding: 16px;
}

.pattern-k-task-row {
  border-radius: var(--ui-radius);
}

.pattern-k-task-row:hover,
.pattern-k-task-row.active {
  background: var(--ui-primary-soft);
}

.pattern-k-results-section {
  gap: 14px;
}

.pattern-k-results-head {
  min-height: 48px;
  border-color: var(--ui-line);
}

.pattern-k-match {
  gap: 14px;
  padding: 16px;
}

.pattern-k-rank {
  border-radius: var(--ui-radius);
  background: var(--ui-surface-strong);
  color: var(--ui-text-secondary);
}

.pattern-k-score {
  border-color: var(--ui-line);
}

.pattern-k-score strong {
  color: var(--ui-success);
  font-family: var(--ui-mono);
  font-size: 24px;
  font-weight: 650;
}

.pattern-k-metrics,
.pattern-k-future-metrics {
  border-color: var(--ui-line);
}

.pattern-k-metric,
.pattern-k-future-metrics > div {
  padding: 11px 12px;
}

.pattern-k-metric + .pattern-k-metric,
.pattern-k-future-metrics > div + div {
  border-color: var(--ui-line);
}

.pattern-k-metric strong,
.pattern-k-future-metrics strong,
.pattern-k-future-table td {
  color: var(--ui-text);
  font-family: var(--ui-mono);
  font-variant-numeric: tabular-nums;
}

.pattern-k-match-returns {
  display: grid;
  gap: 7px;
}

.pattern-k-match-returns > header {
  align-items: baseline;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  padding: 0 2px;
}

.pattern-k-match-returns > header strong {
  color: var(--ui-text);
  font-size: 12px;
  font-weight: 650;
}

.pattern-k-match-returns > header span {
  color: var(--ui-muted);
  font-size: 10px;
}

.pattern-k-match-return-grid {
  border-bottom: 1px solid var(--ui-line);
  border-top: 1px solid var(--ui-line);
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.pattern-k-match-return-grid > div {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 10px 12px;
}

.pattern-k-match-return-grid > div + div {
  border-left: 1px solid var(--ui-line);
}

.pattern-k-match-return-grid span {
  color: var(--ui-muted);
  font-size: 10px;
}

.pattern-k-match-return-grid strong {
  color: var(--ui-text);
  font-family: var(--ui-mono);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  font-weight: 650;
}

.pattern-k-match-return-grid strong.is-positive {
  color: var(--ui-danger);
}

.pattern-k-match-return-grid strong.is-negative {
  color: var(--ui-success);
}

.pattern-k-chart-grid {
  gap: 16px;
}

.pattern-k-chart {
  border-color: var(--ui-line);
}

.pattern-k-outlook {
  padding: 16px;
}

.pattern-k-outlook > .pattern-k-outlook-head {
  align-items: center;
}

.pattern-k-outlook-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.pattern-k-outlook-copy > span {
  color: var(--ui-muted);
  font-size: 10px;
}

.pattern-k-outlook-mode-switch {
  width: 136px;
  min-width: 136px;
  min-height: 34px;
  flex: 0 0 auto;
}

.pattern-k-outlook-mode-switch .segment {
  min-height: 26px;
  padding: 0 8px;
  font-size: 11px;
}

.pattern-k-outlook > header,
.pattern-k-outlook-chart,
.pattern-k-future-table th,
.pattern-k-future-table td {
  border-color: var(--ui-line);
}

/* User management, profile and hidden news surface */
.user-management-panel {
  border: 0;
  background: transparent;
  box-shadow: none;
}

.user-create-form,
.user-list,
.profile-card,
.profile-summary div,
.profile-broker-editor,
.profile-broker-group-row,
.news-summary-item,
.news-card {
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius);
  background: var(--ui-surface);
  box-shadow: none;
}

.profile-dialog {
  z-index: 200;
  background: rgba(20, 27, 36, 0.42);
  backdrop-filter: blur(4px);
}

.profile-card {
  padding: 20px;
  box-shadow: var(--ui-shadow-float);
}

.registration-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(280px, 0.82fr) minmax(420px, 1.18fr);
  width: min(900px, 100%);
  max-height: min(760px, calc(100vh - 48px));
  overflow: auto;
  border: 1px solid #c9d1d9;
  border-radius: 10px;
  background: var(--ui-surface);
  box-shadow: 0 24px 70px rgba(19, 29, 40, 0.22);
}

.login-card {
  position: relative;
  width: min(460px, 100%);
  overflow: hidden;
  border: 1px solid #c9d1d9;
  border-radius: 9px;
  background: var(--ui-surface);
  padding: 36px 40px 30px;
  box-shadow: 0 24px 70px rgba(19, 29, 40, 0.22);
}

.login-brand-line {
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: #2f617f;
}

.login-close-btn {
  position: absolute;
  top: 16px;
  right: 16px;
}

.login-header {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: start;
  gap: 16px;
  padding-right: 28px;
}

.login-brand-mark {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  background: #17232d;
  color: #ffffff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 22px;
  font-weight: 700;
}

.login-header h2 {
  margin: 7px 0 0;
  color: var(--ui-text);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.25;
}

.login-header p {
  margin: 8px 0 0;
  color: var(--ui-text-muted);
  font-size: 12px;
}

.login-form {
  display: grid;
  gap: 15px;
  margin-top: 30px;
}

.login-field {
  display: grid;
  gap: 8px;
  color: #3d4853;
  font-size: 12px;
  font-weight: 650;
}

.login-field input {
  width: 100%;
  min-height: 43px;
  border: 1px solid var(--ui-line-strong);
  border-radius: 6px;
  background: #fbfcfd;
  color: var(--ui-text);
  padding: 0 12px;
  font-size: 13px;
}

.login-field input:focus {
  border-color: var(--ui-primary);
  box-shadow: var(--ui-shadow-focus);
  outline: 0;
}

.login-submit {
  min-height: 44px;
  margin-top: 3px;
  border: 1px solid #254c68;
  border-radius: 6px;
  background: #2f617f;
  color: #ffffff;
  font-size: 13px;
  font-weight: 680;
}

.login-submit:hover:not(:disabled) {
  background: #284f69;
}

.login-submit:disabled {
  cursor: default;
  opacity: 0.62;
}

.login-status {
  min-height: 20px;
  margin: 10px 0 0;
}

.login-register-prompt {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border-top: 1px solid var(--ui-line);
  padding-top: 18px;
  color: var(--ui-text-muted);
  font-size: 11px;
}

.login-register-prompt button {
  border: 0;
  background: transparent;
  color: #2f617f;
  padding: 2px;
  font-size: 11px;
  font-weight: 680;
}

.login-security-note {
  margin: 17px 0 0;
  color: #8a949d;
  font-size: 9px;
  line-height: 1.5;
  text-align: center;
}

.registration-market-panel {
  position: relative;
  display: flex;
  min-height: 610px;
  flex-direction: column;
  overflow: hidden;
  background: #17232d;
  color: #f5f7f9;
  padding: 38px 34px 30px;
}

.registration-brand-mark {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.34);
  color: #ffffff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 23px;
  font-weight: 700;
}

.registration-brand-copy {
  position: relative;
  z-index: 1;
  margin-top: 58px;
}

.registration-eyebrow {
  color: #8098aa;
  font-family: var(--ui-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
}

.registration-brand-copy h2 {
  max-width: 250px;
  margin: 12px 0 0;
  color: #ffffff;
  font-size: 28px;
  font-weight: 680;
  line-height: 1.3;
}

.registration-brand-copy p {
  max-width: 270px;
  margin: 18px 0 0;
  color: #aebcc7;
  font-size: 13px;
  line-height: 1.75;
}

.registration-market-grid {
  display: flex;
  height: 88px;
  align-items: flex-end;
  gap: 10px;
  margin: 44px 0 28px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.16);
  padding: 0 8px;
}

.registration-market-grid span {
  width: 6px;
  border: 1px solid #5d849f;
  border-bottom: 0;
  background: rgba(91, 132, 160, 0.16);
}

.registration-market-grid span:nth-child(1) { height: 28%; }
.registration-market-grid span:nth-child(2) { height: 46%; }
.registration-market-grid span:nth-child(3) { height: 39%; }
.registration-market-grid span:nth-child(4) { height: 68%; }
.registration-market-grid span:nth-child(5) { height: 58%; }
.registration-market-grid span:nth-child(6) { height: 82%; }

.registration-capabilities {
  display: grid;
  gap: 0;
  margin: 0;
}

.registration-capabilities div {
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr);
  align-items: center;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  padding: 10px 0;
}

.registration-capabilities dt {
  color: #7892a5;
  font-family: var(--ui-mono);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.registration-capabilities dd {
  margin: 0;
  color: #d8e0e5;
  font-size: 12px;
}

.registration-security-note {
  margin: auto 0 0;
  color: #7e94a4;
  font-size: 10px;
}

.registration-entry-panel {
  padding: 42px 44px 34px;
}

.registration-header {
  margin-bottom: 28px;
}

.registration-header h2 {
  margin: 8px 0 0;
  color: var(--ui-text);
  font-size: 24px;
  font-weight: 700;
}

.registration-header p {
  margin: 8px 0 0;
  color: var(--ui-text-muted);
  font-size: 12px;
}

.registration-close-btn {
  position: absolute;
  z-index: 3;
  top: 18px;
  right: 18px;
}

.registration-form {
  display: grid;
  gap: 16px;
}

.registration-field {
  display: grid;
  gap: 8px;
  min-width: 0;
  color: #3d4853;
  font-size: 12px;
  font-weight: 650;
}

.registration-field > span:first-child {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}

.registration-field > span small {
  color: var(--ui-text-muted);
  font-size: 10px;
  font-weight: 500;
}

.registration-field input {
  width: 100%;
  min-width: 0;
  min-height: var(--ui-control-height);
  border: 1px solid var(--ui-line-strong);
  height: 42px;
  border-radius: 6px;
  background: #fbfcfd;
  color: var(--ui-text);
  padding: 0 12px;
  font-size: 13px;
}

.registration-field input:focus {
  border-color: var(--ui-primary);
  box-shadow: var(--ui-shadow-focus);
  outline: 0;
}

.registration-code-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.registration-send-code {
  min-width: 118px;
  min-height: 42px;
  border: 1px solid #b8c5cf;
  border-radius: 6px;
  background: #f4f7f9;
  color: #315f7e;
  padding: 0 14px;
  font-size: 12px;
  font-weight: 650;
  white-space: nowrap;
}

.registration-send-code:hover:not(:disabled) {
  border-color: #809bad;
  background: #edf3f6;
}

.registration-send-code:disabled {
  cursor: default;
  opacity: 0.62;
}

.registration-code-source {
  color: #7c8994;
  font-size: 10px;
  font-weight: 400;
  line-height: 1.5;
}

.registration-invitation-input {
  text-transform: uppercase;
  letter-spacing: .08em;
}

.registration-invitation-benefit {
  color: #5f7484;
  font-size: 10px;
  font-weight: 450;
  line-height: 1.5;
}

.registration-password-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.registration-hint {
  margin: -4px 0 0;
  color: var(--ui-text-muted);
  font-size: 10px;
  font-weight: 400;
  line-height: 1.55;
}

.registration-submit {
  width: 100%;
  min-height: 44px;
  border: 1px solid #254c68;
  border-radius: 6px;
  background: #2f617f;
  color: #ffffff;
  font-size: 13px;
  font-weight: 680;
}

.registration-submit:hover:not(:disabled) {
  background: #284f69;
}

.registration-submit:disabled {
  cursor: default;
  opacity: 0.62;
}

.registration-status {
  margin-bottom: 0;
}

.account-settings-card {
  width: min(620px, 100%);
  padding: 0;
  overflow: hidden;
}

.account-settings-card.membership-guide-expanded {
  width: min(1080px, 100%);
}

.account-settings-card.membership-guide-expanded .profile-header {
  padding: 14px 18px 12px;
}

.account-settings-card.membership-guide-expanded .account-settings-pane {
  padding: 14px 18px 16px;
}

.account-settings-card.membership-guide-expanded .profile-summary {
  margin-bottom: 14px;
}

.account-settings-card.membership-guide-expanded .profile-summary div {
  min-height: 58px;
  padding: 8px 12px;
}

.account-settings-card.membership-guide-expanded .profile-membership-guide {
  gap: 8px;
  margin: -4px 0 0;
  padding: 12px;
}

.account-settings-pane.membership-guide-open > .profile-invitation-card,
.account-settings-pane.membership-guide-open > .account-profile-form,
.account-settings-pane.membership-guide-open > .profile-status,
.account-settings-pane.membership-guide-open > .account-settings-nav,
.account-settings-pane.membership-guide-open > .profile-summary {
  display: none;
}

.account-settings-card .profile-header {
  margin: 0;
  border-bottom: 1px solid var(--ui-line);
  padding: 20px 22px 17px;
  background: #fbfcfd;
}

.account-settings-card .account-settings-pane {
  padding: 20px 22px 22px;
}

.account-settings-card .profile-summary {
  gap: 0;
  margin-bottom: 22px;
  border: 1px solid var(--ui-line);
  border-radius: 7px;
  background: #f8fafb;
  overflow: hidden;
}

.account-settings-card .profile-summary div {
  min-height: 72px;
  border: 0;
  border-right: 1px solid var(--ui-line);
  border-radius: 0;
  background: transparent;
  padding: 12px 14px;
}

.account-settings-card .profile-summary div:last-child {
  border-right: 0;
}

.account-settings-card .profile-summary span {
  color: var(--ui-text-muted);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: 0.04em;
}

.account-settings-card .profile-summary strong {
  color: var(--ui-text);
  font-size: 14px;
}

.profile-invitation-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: -8px 0 22px;
  border: 1px solid rgba(60, 110, 158, .2);
  border-radius: 7px;
  background: var(--ui-primary-soft);
  padding: 12px 14px;
}

.profile-invitation-card > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.profile-invitation-card span,
.profile-invitation-card small {
  color: var(--ui-text-muted);
  font-size: 10px;
}

.profile-invitation-card strong {
  color: var(--ui-text);
  font-size: 16px;
  letter-spacing: .08em;
}

.profile-invitation-card button {
  flex: 0 0 auto;
  min-height: 34px;
  border: 1px solid rgba(60, 110, 158, .28);
  border-radius: 6px;
  background: var(--ui-surface);
  color: var(--ui-primary);
  padding: 0 12px;
  font-size: 11px;
  font-weight: 680;
}

.profile-invitation-card button:hover:not(:disabled) {
  border-color: var(--ui-primary);
}

.profile-invitation-card button:disabled {
  opacity: .5;
}

.profile-membership-summary > span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
}

.profile-membership-guide-btn {
  border: 0;
  border-radius: 999px;
  background: var(--ui-primary-soft);
  color: var(--ui-primary);
  padding: 3px 7px;
  cursor: pointer;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0;
}

.profile-membership-guide-btn:hover,
.profile-membership-guide-btn[aria-expanded="true"] {
  background: color-mix(in srgb, var(--ui-primary) 16%, var(--ui-surface));
}

.profile-membership-guide-btn:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--ui-primary) 45%, transparent);
  outline-offset: 2px;
}

.profile-membership-guide {
  display: grid;
  gap: 12px;
  margin: -8px 0 22px;
  padding: 15px;
  border: 1px solid color-mix(in srgb, var(--ui-primary) 22%, var(--ui-line));
  border-radius: 8px;
  background: color-mix(in srgb, var(--ui-primary-soft) 38%, var(--ui-surface));
}

.profile-membership-guide.hidden {
  display: none;
}

.profile-membership-guide > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.profile-membership-guide > header div {
  display: grid;
  gap: 4px;
}

.profile-membership-guide > header strong {
  color: var(--ui-text);
  font-size: 12px;
}

.profile-membership-guide > header span {
  color: var(--ui-text-muted);
  font-size: 10px;
  line-height: 1.5;
}

.profile-membership-guide-close {
  flex: 0 0 auto;
  min-height: 30px;
  border: 1px solid var(--ui-line-strong);
  border-radius: 6px;
  background: var(--ui-surface);
  color: var(--ui-primary);
  padding: 0 10px;
  font-size: 9px;
  font-weight: 700;
}

.profile-membership-guide-close:hover {
  border-color: var(--ui-primary);
  background: var(--ui-primary-soft);
}

.profile-membership-guide-grid {
  display: block;
  overflow: visible;
  border: 1px solid var(--ui-line);
  border-radius: 7px;
  background: var(--ui-surface);
}

.profile-membership-matrix {
  width: 100%;
  min-width: 0;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}

.profile-membership-matrix th,
.profile-membership-matrix td {
  border-right: 1px solid var(--ui-line);
  border-bottom: 1px solid var(--ui-line);
  padding: 5px 7px;
  vertical-align: top;
}

.profile-membership-matrix tr > *:last-child {
  border-right: 0;
}

.profile-membership-matrix tbody tr:last-child > * {
  border-bottom: 0;
}

.profile-membership-matrix thead th {
  background: #f7f9fb;
  color: var(--ui-text);
  text-align: left;
}

.profile-membership-matrix .module-heading,
.profile-membership-matrix .profile-membership-module {
  width: 105px;
  background: #f7f9fb;
}

.profile-membership-matrix .feature-heading,
.profile-membership-matrix .profile-membership-features {
  width: 190px;
}

.profile-membership-matrix .profile-membership-level-heading {
  width: 125px;
}

.profile-membership-matrix .points-heading,
.profile-membership-matrix .profile-membership-points-cost {
  width: 125px;
}

.profile-membership-matrix thead th strong,
.profile-membership-matrix thead th span,
.profile-membership-matrix thead th small {
  display: block;
}

.profile-membership-matrix thead th strong {
  font-size: 11px;
}

.profile-membership-matrix thead th span {
  margin-top: 2px;
  color: var(--ui-text-secondary);
  font-size: 9px;
  font-weight: 650;
}

.profile-membership-matrix thead th small {
  margin-top: 3px;
  color: var(--ui-text-muted);
  font-size: 9px;
  font-weight: 500;
}

.profile-membership-matrix thead th b {
  display: inline-flex;
  margin-top: 4px;
  border-radius: 999px;
  background: var(--ui-primary-soft);
  color: var(--ui-primary);
  padding: 1px 6px;
  font-size: 8px;
}

.profile-membership-matrix .profile-membership-module {
  color: var(--ui-text-secondary);
  font-size: 10px;
  font-weight: 700;
  vertical-align: middle;
}

.profile-membership-matrix td {
  background: var(--ui-surface);
}

.profile-membership-matrix .current {
  background: color-mix(in srgb, var(--ui-primary-soft) 55%, var(--ui-surface));
}

.profile-membership-features > div,
.profile-membership-access > div,
.profile-membership-points-cost > div {
  display: grid;
  gap: 1px;
}

.profile-membership-features span,
.profile-membership-access-mark,
.profile-membership-points-cost span {
  display: flex;
  min-height: 16px;
  align-items: center;
}

.profile-membership-features span {
  color: var(--ui-text-secondary);
  font-size: 9px;
  line-height: 1.25;
}

.profile-membership-access {
  text-align: center;
  vertical-align: middle;
}

.profile-membership-access-mark {
  justify-content: center;
  color: var(--ui-text-muted);
  font-size: 12px;
  font-weight: 700;
}

.profile-membership-access-mark.allowed {
  color: var(--ui-primary);
}

.profile-membership-points-cost,
.profile-membership-points-cost span {
  color: var(--ui-text-secondary);
  font-size: 9px;
  white-space: nowrap;
}

.profile-membership-points-cost span {
  justify-content: flex-start;
}

.profile-membership-matrix .quota-row th,
.profile-membership-matrix .quota-row td {
  background: #f7f9fb;
}

.profile-membership-matrix .profile-membership-quota {
  color: var(--ui-text-secondary);
  font-size: 9px;
  line-height: 1.5;
}

.profile-membership-level-card {
  display: grid;
  align-content: start;
  gap: 10px;
  min-width: 0;
  border: 1px solid var(--ui-line);
  border-radius: 7px;
  background: var(--ui-surface);
  padding: 12px;
}

.profile-membership-level-card.current {
  border-color: color-mix(in srgb, var(--ui-primary) 42%, var(--ui-line));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ui-primary) 9%, transparent);
}

.profile-membership-level-card > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.profile-membership-level-card > header div {
  display: grid;
  gap: 3px;
}

.profile-membership-level-card > header strong {
  color: var(--ui-text);
  font-size: 13px;
}

.profile-membership-level-card > header span,
.profile-membership-level-card > header b {
  color: var(--ui-text-muted);
  font-size: 9px;
  font-weight: 600;
}

.profile-membership-level-card > header b {
  border-radius: 999px;
  background: var(--ui-primary-soft);
  color: var(--ui-primary);
  padding: 3px 7px;
  white-space: nowrap;
}

.profile-membership-level-card > p {
  margin: 0;
  color: var(--ui-text-secondary);
  font-size: 10px;
  line-height: 1.55;
}

.profile-membership-level-rights > span {
  display: block;
  margin-bottom: 6px;
  color: var(--ui-text-muted);
  font-size: 9px;
  font-weight: 700;
}

.profile-membership-level-rights ul {
  display: grid;
  gap: 5px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.profile-membership-level-rights li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 5px;
  min-width: 0;
  color: var(--ui-text-secondary);
  font-size: 9px;
}

.profile-membership-level-rights li > span {
  border-radius: 3px;
  background: var(--ui-surface-subtle);
  color: var(--ui-text-muted);
  padding: 2px 4px;
  white-space: nowrap;
}

.profile-membership-level-rights li > strong {
  overflow: hidden;
  color: var(--ui-text-secondary);
  font-size: 9px;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.profile-membership-level-rights li > em {
  color: var(--ui-text-muted);
  font-style: normal;
  white-space: nowrap;
}

.profile-membership-level-card > footer {
  margin-top: auto;
  border-top: 1px solid var(--ui-line);
  padding-top: 8px;
  color: var(--ui-text-muted);
  font-size: 9px;
  line-height: 1.45;
}

.profile-membership-guide-empty {
  grid-column: 1 / -1;
  padding: 22px;
  color: var(--ui-text-muted);
  text-align: center;
  font-size: 10px;
}

@media (max-width: 960px) {
  .profile-membership-guide {
    margin-top: -10px;
    padding: 12px;
  }

  .profile-membership-guide-grid {
    max-height: 62vh;
    overflow: auto;
  }

  .profile-membership-matrix {
    min-width: 880px;
  }

  .profile-membership-matrix thead th {
    position: sticky;
    z-index: 2;
    top: 0;
  }

  .profile-membership-matrix .module-heading,
  .profile-membership-matrix .profile-membership-module {
    position: sticky;
    z-index: 3;
    left: 0;
  }
}

.account-profile-form {
  gap: 14px;
  border-top: 1px solid var(--ui-line);
  padding-top: 18px;
}

.account-form-heading {
  display: grid;
  gap: 4px;
}

.account-form-heading strong {
  color: var(--ui-text);
  font-size: 12px;
  font-weight: 680;
}

.account-form-heading span {
  color: var(--ui-text-muted);
  font-size: 10px;
  line-height: 1.5;
}

.account-profile-form .profile-actions {
  justify-content: flex-end;
}

.account-profile-form .profile-save-btn {
  width: auto;
  min-width: 64px;
  min-height: 36px;
  border-radius: 6px;
  padding: 0 14px;
  font-size: 11px;
}

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

.account-profile-row .profile-field {
  min-width: 0;
}

.account-profile-row .profile-actions {
  align-self: end;
  margin: 0;
}

.profile-points-summary > span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
}

.profile-points-reset-at {
  display: block;
  overflow: hidden;
  color: var(--ui-text-muted);
  font-size: 9px;
  font-weight: 500;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.profile-points-detail-btn {
  border: 0;
  border-radius: 999px;
  background: var(--ui-surface);
  color: var(--ui-primary);
  padding: 3px 7px;
  cursor: pointer;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0;
}

.profile-points-detail-btn:hover {
  background: var(--ui-primary-soft);
}

.profile-points-detail-btn:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--ui-primary) 45%, transparent);
  outline-offset: 2px;
}

.profile-points-dialog {
  position: fixed;
  z-index: 260;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(20, 27, 36, 0.48);
  backdrop-filter: blur(5px);
}

.profile-points-dialog.hidden {
  display: none;
}

.profile-points-dialog-card {
  display: grid;
  align-content: start;
  width: min(590px, 100%);
  max-height: min(720px, calc(100vh - 40px));
  overflow: hidden;
  border: 1px solid var(--ui-line);
  border-radius: 10px;
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-float);
}

.profile-points-dialog-card > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  border-bottom: 1px solid var(--ui-line);
  padding: 20px 22px 17px;
  background: #fbfcfd;
}

.profile-points-dialog-card > header h2 {
  margin: 4px 0 5px;
  color: var(--ui-text);
  font-size: 18px;
}

.profile-points-dialog-card > header p {
  margin: 0;
  color: var(--ui-text-muted);
  font-size: 10px;
  line-height: 1.55;
}

.profile-points-dialog-balance {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin: 16px 22px 0;
  border: 1px solid color-mix(in srgb, var(--ui-primary) 22%, var(--ui-line));
  border-radius: 7px;
  background: var(--ui-primary-soft);
  padding: 12px 14px;
}

.profile-points-dialog-balance span {
  color: var(--ui-text-secondary);
  font-size: 10px;
  font-weight: 650;
}

.profile-points-dialog-balance strong {
  color: var(--ui-primary);
  font-size: 20px;
  font-variant-numeric: tabular-nums;
}

.profile-monthly-points-status {
  min-height: 0;
  margin: 10px 22px 0;
  color: var(--ui-danger);
  font-size: 10px;
}

.profile-monthly-points-status:empty {
  display: none;
}

.profile-monthly-points-list {
  display: grid;
  gap: 10px;
  min-height: 120px;
  overflow-y: auto;
  padding: 14px 22px 22px;
}

.profile-monthly-points-card {
  border: 1px solid var(--ui-line);
  border-radius: 7px;
  background: var(--ui-surface);
  overflow: hidden;
}

.profile-monthly-points-card > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--ui-line);
  background: var(--ui-surface-subtle);
  padding: 10px 12px;
}

.profile-monthly-points-card > header > strong {
  color: var(--ui-text);
  font-size: 12px;
}

.profile-monthly-points-card > header > span {
  color: var(--ui-text-muted);
  font-size: 9px;
}

.profile-monthly-points-card > header b {
  color: var(--ui-text);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}

.profile-monthly-points-modules {
  display: grid;
}

.profile-monthly-points-modules > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 42px;
  align-items: center;
  gap: 10px;
  min-height: 38px;
  border-bottom: 1px solid var(--ui-line);
  padding: 0 12px;
}

.profile-monthly-points-modules > div:last-child {
  border-bottom: 0;
}

.profile-monthly-points-modules span {
  color: var(--ui-text-secondary);
  font-size: 10px;
}

.profile-monthly-points-modules strong {
  color: var(--ui-text);
  font-size: 10px;
  font-variant-numeric: tabular-nums;
}

.profile-monthly-points-modules small {
  color: var(--ui-text-muted);
  font-size: 9px;
  text-align: right;
}

.profile-monthly-points-empty {
  display: grid;
  min-height: 150px;
  place-items: center;
  border: 1px dashed var(--ui-line-strong);
  border-radius: 7px;
  color: var(--ui-text-muted);
  font-size: 10px;
}

.account-settings-heading {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.account-settings-back {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 1px solid var(--ui-line);
  border-radius: 6px;
  background: var(--ui-surface);
  color: var(--ui-text-secondary);
  font-size: 22px;
}

.account-settings-pane {
  min-width: 0;
}

.account-settings-nav {
  display: grid;
  margin-top: 18px;
  border-top: 1px solid var(--ui-line);
}

.account-settings-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  width: 100%;
  min-height: 64px;
  border: 0;
  border-bottom: 1px solid var(--ui-line);
  border-radius: 0;
  background: transparent;
  padding: 11px 4px;
  color: var(--ui-text);
  text-align: left;
}

.account-settings-row:hover {
  background: var(--ui-surface-subtle);
}

.account-settings-row > span:first-child {
  display: grid;
  gap: 4px;
}

.account-settings-row strong {
  font-size: 13px;
  font-weight: 650;
}

.account-settings-row small {
  color: var(--ui-text-muted);
  font-size: 11px;
  font-weight: 400;
}

.account-settings-chevron {
  color: var(--ui-text-muted);
  font-size: 22px;
}

.account-settings-logout {
  color: var(--ui-text-secondary);
}

.system-settings-section {
  display: grid;
  gap: 8px;
}

.system-settings-label {
  color: var(--ui-text-muted);
  font-size: 11px;
  font-weight: 650;
}

.account-settings-danger-entry strong,
.account-settings-danger-entry .account-settings-chevron {
  color: var(--ui-danger);
}

.system-settings-footnote {
  margin: 16px 0 0;
  color: var(--ui-text-muted);
  font-size: 11px;
  line-height: 1.6;
}

.close-account-warning {
  border-left: 3px solid var(--ui-danger);
  background: #fff7f6;
  padding: 14px 16px;
}

.close-account-warning strong {
  color: var(--ui-danger);
  font-size: 13px;
}

.close-account-warning p {
  margin: 7px 0 0;
  color: #7a4b47;
  font-size: 11px;
  line-height: 1.65;
}

.close-account-form {
  display: grid;
  gap: 14px;
  margin-top: 20px;
}

.close-account-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 4px;
}

.account-secondary-btn,
.account-danger-btn {
  min-height: 38px;
  border-radius: 6px;
  padding: 0 14px;
  font-size: 12px;
  font-weight: 650;
}

.account-secondary-btn {
  border: 1px solid var(--ui-line-strong);
  background: var(--ui-surface);
  color: var(--ui-text-secondary);
}

.account-danger-btn {
  border: 1px solid #9f1f18;
  background: var(--ui-danger);
  color: #ffffff;
}

.account-danger-btn:disabled {
  cursor: default;
  opacity: 0.58;
}

.profile-summary div,
.profile-broker-editor {
  background: var(--ui-surface-subtle);
}

.profile-broker-group-row.selected {
  border-color: rgba(60, 110, 158, 0.32);
  background: var(--ui-primary-soft);
}

@media (max-width: 520px) {
  .profile-points-dialog {
    padding: 10px;
  }

  .profile-points-dialog-card {
    max-height: calc(100vh - 20px);
  }

  .profile-points-dialog-card > header,
  .profile-monthly-points-list {
    padding-right: 16px;
    padding-left: 16px;
  }

  .profile-points-dialog-balance,
  .profile-monthly-points-status {
    margin-right: 16px;
    margin-left: 16px;
  }

  .profile-monthly-points-modules > div {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .profile-monthly-points-modules small {
    grid-column: 1 / -1;
    margin-top: -8px;
    padding-bottom: 7px;
    text-align: left;
  }

  .login-dialog {
    padding: 12px;
  }

  .login-card {
    padding: 30px 22px 24px;
  }

  .login-header {
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 12px;
  }

  .login-brand-mark {
    width: 36px;
    height: 36px;
    font-size: 19px;
  }

  .login-header h2 {
    font-size: 19px;
  }

  .account-settings-card .profile-summary {
    grid-template-columns: minmax(0, 1fr);
  }

  .account-settings-card .profile-summary div {
    min-height: 58px;
    border-right: 0;
    border-bottom: 1px solid var(--ui-line);
  }

  .account-settings-card .profile-summary div:last-child {
    border-bottom: 0;
  }

  .profile-invitation-card {
    align-items: stretch;
    flex-direction: column;
  }

  .profile-invitation-card button {
    width: 100%;
  }

  .registration-dialog {
    padding: 12px;
  }

  .registration-card {
    grid-template-columns: minmax(0, 1fr);
    max-height: calc(100vh - 24px);
  }

  .registration-market-panel {
    min-height: 150px;
    padding: 24px 24px 20px;
  }

  .registration-brand-copy {
    margin-top: 26px;
  }

  .registration-brand-copy h2 {
    font-size: 22px;
  }

  .registration-brand-copy p,
  .registration-market-grid,
  .registration-capabilities,
  .registration-security-note {
    display: none;
  }

  .registration-entry-panel {
    padding: 28px 22px 24px;
  }

  .registration-password-grid,
  .registration-code-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .registration-send-code {
    width: 100%;
  }

  .close-account-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 1080px) {
  .app-shell {
    grid-template-columns: 240px minmax(0, 1fr);
  }

  .query-oi-view,
  .fund-card-view,
  .backtest-rule-view,
  .pattern-k-view,
  .seasonality-view,
  .warehouse-receipt-view,
  .unit-converter-view,
  .arbitrage-monitor-view,
  .news-view,
  .user-management-view {
    padding-right: 20px;
    padding-left: 20px;
  }
}

@media (max-width: 820px) {
  body {
    overflow: hidden;
  }

  .app-shell,
  body.sidebar-collapsed .app-shell {
    grid-template-columns: minmax(0, 1fr);
    height: 100vh;
    min-height: 0;
  }

  .sidebar {
    position: fixed;
    z-index: 100;
    inset: 0 auto 0 0;
    width: min(292px, 86vw);
    height: 100vh;
    min-height: 0;
    max-height: none;
    border-right: 1px solid var(--ui-line);
    border-bottom: 0;
    box-shadow: 16px 0 40px rgba(20, 27, 36, 0.14);
    transform: translateX(0);
    transition: transform 180ms ease, visibility 180ms ease;
  }

  body.sidebar-collapsed .sidebar {
    width: min(292px, 86vw);
    height: 100vh;
    min-height: 0;
    max-height: none;
    padding: 18px 14px 14px;
    border-right: 1px solid var(--ui-line);
    visibility: hidden;
    transform: translateX(-102%);
  }

  .sidebar-compliance {
    display: none;
  }

  .sidebar-expand-btn {
    top: 12px;
    left: 12px;
    width: 36px;
    height: 36px;
  }

  .main {
    height: 100vh;
    min-height: 0;
  }

  .topbar {
    min-height: 54px;
    padding: 9px 12px 9px 58px;
  }

  .topbar-controls,
  .auth-controls,
  .auth-login-fields {
    min-width: 0;
  }

  .auth-login-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
  }

  .workspace-tabs {
    min-height: 36px;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 10px;
    padding: 0 12px 0 10px;
  }

  .workspace-nav {
    min-height: 44px;
    padding: 4px 0;
  }

  .workspace-settings-btn {
    flex-basis: 36px;
    width: 36px;
    height: 36px;
    min-height: 36px;
    margin-left: 6px;
  }

  .workspace-tab {
    flex: 0 0 auto;
    height: 36px;
    min-height: 36px;
    padding: 0 2px;
    font-size: 13px;
  }

  .workspace-tab + .workspace-tab::before {
    top: 10px;
    left: -5px;
  }

  .query-oi-view,
  .fund-card-view,
  .backtest-rule-view,
  .pattern-k-view,
  .seasonality-view,
  .warehouse-receipt-view,
  .unit-converter-view,
  .arbitrage-monitor-view,
  .news-view,
  .user-management-view {
    padding: 18px 14px 28px;
  }

  .query-oi-header,
  .fund-card-page-header,
  .backtest-rule-hero,
  .pattern-k-header,
  .news-header,
  .user-management-header {
    min-height: 62px;
    padding: 4px 2px 10px;
  }

  .query-oi-header h1,
  .fund-card-page-header h1,
  .backtest-rule-title,
  .pattern-k-title,
  .user-management-header h1,
  .news-header h1 {
    font-size: 26px;
  }

  .module-page-header {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
    min-height: 62px;
    padding: 4px 2px 10px;
  }

  .module-page-header .module-page-title {
    font-size: 26px;
  }

  .module-title-line {
    gap: 8px;
  }

  .module-help-popover-item {
    grid-template-columns: 78px minmax(0, 1fr);
    gap: 10px;
    padding: 9px 12px;
  }

  .fund-card-page-header {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .fund-card-controls {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .fund-card-variety-field {
    width: 100%;
  }

  .fund-card-actions,
  .fund-card-fetch-btn,
  .fund-card-save-btn {
    width: 100%;
  }

  .fund-card-actions > button {
    flex: 1 1 0;
  }

  .fund-card-variety-picker {
    width: 100%;
  }

  .fund-card-variety-menu {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .fund-card-gallery {
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
  }

  .welcome {
    padding: 20px 14px 120px;
  }

  .welcome-inner {
    gap: 16px;
    transform: translateY(-4vh);
  }

  .welcome h1 {
    font-size: 26px;
  }

  .starter-prompts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }

  .starter-prompt {
    min-width: 0;
    height: auto;
    min-height: 40px;
    padding: 7px 10px;
    white-space: normal;
  }

  body:not(.has-session) .welcome {
    padding-bottom: 240px;
  }

  body:not(.has-session) .starter-prompts {
    gap: 6px;
  }

  body:not(.has-session) .starter-prompt {
    min-height: 36px;
    padding: 6px 8px;
    font-size: 12px;
  }

  .composer-wrap,
  body:not(.has-session) .composer-wrap {
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
  }

  .input-box {
    border-radius: var(--ui-radius);
  }

  .query-controls,
  .backtest-rule-card,
  .pattern-k-target-column,
  .pattern-k-search-column {
    padding: 14px;
  }

  .query-action-group {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    min-width: 0;
  }

  .query-controls .query-submit,
  .query-controls .query-save {
    width: 100%;
    min-width: 0;
    padding: 0 10px;
  }

  .metric-grid,
  .metric-grid.option-summary,
  .backtest-rule-view .metric-grid {
    overflow: visible;
    border: 0;
    background: transparent;
  }

  .metric-card,
  .metric-grid.option-summary .metric-card,
  .backtest-rule-view .metric-card {
    min-height: 84px;
    border: 1px solid var(--ui-line);
    border-radius: var(--ui-radius);
    background: var(--ui-surface);
  }

  .metric-card + .metric-card,
  .metric-grid.option-summary .metric-card + .metric-card {
    border: 1px solid var(--ui-line);
  }

  .series-panel,
  .table-panel,
  .backtest-rule-report-card,
  .pattern-k-match,
  .pattern-k-outlook {
    padding: 14px;
  }
}

@media (max-width: 520px) {
  .auth-login-fields {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  }

  .auth-input {
    padding: 0 8px;
    font-size: 13px;
  }

  .workspace-tab {
    gap: 5px;
    padding: 0 2px;
    font-size: 12px;
  }

  .workspace-tab-icon {
    width: 24px;
    height: 24px;
  }

  .query-action-group {
    grid-template-columns: 1fr;
  }

  .fund-card-variety-picker {
    grid-template-columns: 1fr;
  }

  .fund-card-variety-menu {
    grid-template-columns: 1fr;
  }

  .pattern-k-current-controls {
    grid-template-columns: 1fr;
  }

  .pattern-k-current-controls .pattern-k-field:last-child {
    grid-column: auto;
  }

  .pattern-k-outlook > .pattern-k-outlook-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .pattern-k-outlook-mode-switch {
    width: 100%;
    min-width: 0;
  }

  .pattern-k-match-returns > header {
    align-items: flex-start;
    flex-direction: column;
    gap: 2px;
  }

  .pattern-k-match-return-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pattern-k-match-return-grid > div + div {
    border-left: 0;
  }

  .pattern-k-match-return-grid > div:nth-child(even) {
    border-left: 1px solid var(--ui-line);
  }

  .pattern-k-match-return-grid > div:nth-child(n + 3) {
    border-top: 1px solid var(--ui-line);
  }

  .pattern-k-match-return-grid > div:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }

  .profile-dialog {
    padding: 12px;
  }
}

/* Unified choice fields ---------------------------------------------------- */
.ui-choice {
  position: relative;
  display: block;
  width: 100%;
  min-width: 0;
  color: var(--ui-text);
}

.ui-choice-native {
  display: none !important;
  position: absolute !important;
  inset: auto !important;
  width: 1px !important;
  height: 1px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.ui-select-trigger,
.ui-choice.ui-combobox > .ui-combobox-input {
  width: 100%;
  min-width: 0;
  height: var(--ui-choice-height, var(--ui-control-height)) !important;
  min-height: var(--ui-choice-height, var(--ui-control-height)) !important;
  border: 1px solid var(--ui-line) !important;
  border-radius: var(--ui-radius) !important;
  background: var(--ui-surface) !important;
  color: var(--ui-text) !important;
  font-family: inherit;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.3;
  box-shadow: none !important;
}

.ui-select-trigger {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 10px 0 12px !important;
  cursor: pointer;
  text-align: left;
}

.ui-choice.ui-combobox > .ui-combobox-input {
  display: block;
  padding: 0 40px 0 12px !important;
  outline: none !important;
}

.ui-select-trigger:hover:not(:disabled),
.ui-choice.ui-combobox:hover > .ui-combobox-input:not(:disabled):not([readonly]) {
  border-color: var(--ui-line-strong) !important;
  background: var(--ui-surface) !important;
}

.ui-select.is-open .ui-select-trigger,
.ui-select-trigger:focus-visible,
.ui-combobox.is-open > .ui-combobox-input,
.ui-choice.ui-combobox > .ui-combobox-input:focus {
  border-color: var(--tool-accent, var(--ui-primary)) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px var(--tool-accent-ring, rgba(60, 110, 158, 0.18)) !important;
}

.ui-select-value {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-select-value.is-placeholder {
  color: var(--ui-text-muted);
}

.ui-choice-chevron,
.ui-combobox-toggle {
  display: inline-grid;
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  place-items: center;
  color: var(--ui-text-muted);
}

.ui-choice-chevron svg,
.ui-combobox-toggle svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 150ms ease;
}

.ui-select.is-open .ui-choice-chevron svg,
.ui-combobox.is-open .ui-combobox-toggle svg {
  transform: rotate(180deg);
}

.ui-combobox-toggle {
  position: absolute;
  z-index: 1;
  top: 50%;
  right: 8px;
  margin: 0;
  border: 0;
  border-radius: 6px;
  padding: 0;
  transform: translateY(-50%);
  background: transparent;
  cursor: pointer;
}

.ui-combobox-toggle:hover:not(:disabled) {
  background: var(--ui-surface-subtle);
  color: var(--tool-accent, var(--ui-primary));
}

.ui-choice.is-disabled {
  opacity: 0.56;
}

.ui-choice.is-disabled .ui-select-trigger,
.ui-choice.is-disabled .ui-combobox-toggle {
  cursor: not-allowed;
}

.ui-choice-menu {
  position: fixed;
  z-index: 1300;
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  gap: 6px;
  min-width: 0;
  max-width: calc(100vw - 20px);
  padding: 6px;
  overflow: hidden;
  border: 1px solid var(--ui-line-strong);
  border-radius: 10px;
  background: var(--ui-surface);
  box-shadow: 0 16px 38px rgba(28, 35, 45, 0.14);
  color: var(--ui-text);
  transform-origin: center top;
  animation: ui-choice-menu-in 120ms ease-out;
}

.ui-choice-menu.has-search {
  grid-template-rows: auto minmax(0, 1fr);
}

.ui-choice-menu[data-placement="top"] {
  transform-origin: center bottom;
}

@keyframes ui-choice-menu-in {
  from { opacity: 0; transform: translateY(-3px) scale(0.99); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

.ui-choice-search {
  position: relative;
  display: flex;
  align-items: center;
  min-width: 0;
}

.ui-choice-search > svg {
  position: absolute;
  z-index: 1;
  left: 11px;
  width: 16px;
  height: 16px;
  fill: none;
  stroke: var(--ui-text-muted);
  stroke-width: 1.6;
  stroke-linecap: round;
  pointer-events: none;
}

.ui-choice-search > input {
  width: 100%;
  height: 36px;
  border: 1px solid var(--ui-line);
  border-radius: 7px;
  background: var(--ui-surface-subtle);
  color: var(--ui-text);
  padding: 0 10px 0 34px;
  font-size: 13px;
  outline: none;
}

.ui-choice-search > input:focus {
  border-color: var(--choice-accent, var(--ui-primary));
  background: var(--ui-surface);
  box-shadow: 0 0 0 3px var(--choice-accent-ring, rgba(60, 110, 158, 0.18));
}

.ui-choice-search > input::-webkit-search-cancel-button {
  opacity: 0.55;
}

.ui-choice-list {
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-color: var(--ui-line-strong) transparent;
  scrollbar-width: thin;
}

.ui-choice-group {
  position: sticky;
  z-index: 1;
  top: 0;
  padding: 8px 9px 4px;
  background: var(--ui-surface);
  color: var(--ui-text-muted);
  font-size: 11px;
  font-weight: 650;
}

.ui-choice-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 36px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--ui-text-secondary);
  padding: 7px 9px;
  cursor: pointer;
  text-align: left;
}

.ui-choice-option + .ui-choice-option {
  margin-top: 1px;
}

.ui-choice-option:hover:not(:disabled),
.ui-choice-option.is-active:not(:disabled) {
  background: var(--ui-surface-subtle);
  color: var(--ui-text);
}

.ui-choice-option.is-selected {
  background: var(--choice-accent-soft, var(--ui-primary-soft));
  color: var(--choice-accent, var(--ui-primary));
}

.ui-choice-option.is-selected:hover,
.ui-choice-option.is-selected.is-active {
  background: color-mix(in srgb, var(--choice-accent, var(--ui-primary)) 13%, white);
}

.ui-choice-option:focus-visible {
  outline: none;
  box-shadow: inset 0 0 0 1px var(--choice-accent, var(--ui-primary));
}

.ui-choice-option:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.ui-choice-option-copy {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.ui-choice-option-copy strong,
.ui-choice-option-copy small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-choice-option-copy strong {
  font-size: 13px;
  font-weight: 550;
  line-height: 1.35;
}

.ui-choice-option-copy small {
  color: var(--ui-text-muted);
  font-size: 11px;
  font-weight: 400;
  line-height: 1.3;
}

.ui-choice-option-check {
  display: inline-grid;
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  place-items: center;
  color: transparent;
}

.ui-choice-option-check svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ui-choice-option.is-selected .ui-choice-option-check {
  color: var(--choice-accent, var(--ui-primary));
}

.ui-choice-empty,
.ui-choice-limit {
  padding: 18px 12px;
  color: var(--ui-text-muted);
  font-size: 12px;
  line-height: 1.5;
  text-align: center;
}

.ui-choice-limit {
  padding: 9px 12px 6px;
  border-top: 1px solid var(--ui-line);
  font-size: 11px;
}

/* Existing specialist pickers use the same menu surface and control rhythm. */
.fund-card-variety-toggle {
  height: var(--ui-control-height);
  min-height: var(--ui-control-height);
  border-color: var(--ui-line);
  border-radius: var(--ui-radius);
  padding: 0 10px 0 12px;
  font-size: 13px;
}

.fund-card-variety-toggle[aria-expanded="true"] {
  border-color: var(--tool-accent, var(--ui-primary));
  box-shadow: 0 0 0 3px var(--tool-accent-ring, rgba(60, 110, 158, 0.18));
}

.fund-card-variety-caret {
  display: inline-grid;
  width: 22px;
  height: 22px;
  place-items: center;
}

.fund-card-variety-caret svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 150ms ease;
}

.fund-card-variety-toggle[aria-expanded="true"] .fund-card-variety-caret svg {
  transform: rotate(180deg);
}

.fund-card-variety-picker,
.suggestion-menu,
.indicator-kind-menu {
  border: 1px solid var(--ui-line-strong);
  border-radius: 10px;
  background: var(--ui-surface);
  box-shadow: 0 16px 38px rgba(28, 35, 45, 0.14);
  backdrop-filter: none;
}

.fund-card-variety-picker {
  top: calc(100% + 6px);
  gap: 6px;
  width: min(340px, calc(100vw - 32px));
  padding: 6px;
}

.fund-card-variety-picker input {
  height: 36px;
  min-height: 36px;
  border-radius: 7px;
  background: var(--ui-surface-subtle);
  padding: 0 10px;
}

.fund-card-variety-menu {
  grid-template-columns: minmax(0, 1fr);
  gap: 1px;
  max-height: 300px;
}

.fund-card-variety-option {
  min-height: 36px;
  border: 0;
  border-radius: 6px;
  padding: 7px 9px;
}

.fund-card-variety-option.selected::after {
  content: "";
  width: 5px;
  height: 9px;
  margin-left: auto;
  margin-right: 4px;
  border: solid var(--tool-accent, var(--ui-primary));
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.suggestion-menu,
.indicator-kind-menu {
  top: calc(100% + 6px);
  padding: 6px;
}

.suggestion-menu .picker-option-main,
.suggestion-menu .picker-option-check,
.indicator-kind-menu button {
  border-radius: 6px;
}

.query-controls input,
.query-controls select {
  height: var(--ui-control-height);
  border-radius: var(--ui-radius);
}

@media (max-width: 520px) {
  .ui-choice-menu {
    max-width: calc(100vw - 16px);
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* Administrator user console */
.user-management-header p {
  margin: 7px 0 0;
  color: var(--ui-text-muted);
  font-size: 12px;
}

.user-management-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--ui-line);
  border-radius: 8px;
  background: var(--ui-surface);
  overflow: hidden;
}

.user-management-summary article {
  display: grid;
  gap: 7px;
  min-height: 84px;
  border-right: 1px solid var(--ui-line);
  padding: 16px 18px;
}

.user-management-summary article:last-child { border-right: 0; }
.user-management-summary span { color: var(--ui-text-muted); font-size: 11px; }
.user-management-summary strong { color: var(--ui-text); font-size: 22px; font-weight: 680; }

.user-create-panel {
  border: 1px solid var(--ui-line);
  border-radius: 8px;
  background: var(--ui-surface);
}

.user-create-panel > summary {
  display: flex;
  min-height: 58px;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  list-style: none;
  padding: 10px 16px;
}

.user-create-panel > summary::-webkit-details-marker { display: none; }
.user-create-panel > summary > span:first-child { display: grid; gap: 3px; }
.user-create-panel > summary strong { color: var(--ui-text); font-size: 13px; }
.user-create-panel > summary small { color: var(--ui-text-muted); font-size: 10px; }
.user-create-panel > summary > span:last-child { color: var(--ui-primary); font-size: 20px; }
.user-create-panel[open] > summary { border-bottom: 1px solid var(--ui-line); }
.user-create-panel[open] > summary > span:last-child { transform: rotate(45deg); }

.user-create-panel .user-create-form {
  border: 0;
  border-radius: 0;
  padding: 16px;
}

.user-management-toolbar {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) repeat(3, minmax(115px, auto)) auto;
  align-items: center;
  gap: 8px;
}

.user-search-field input,
.user-management-toolbar select {
  width: 100%;
  height: 38px;
  border: 1px solid var(--ui-line);
  border-radius: 6px;
  background: var(--ui-surface);
  color: var(--ui-text);
  padding: 0 11px;
  font-size: 12px;
}

.user-search-field input:focus,
.user-management-toolbar select:focus {
  border-color: var(--ui-primary);
  box-shadow: var(--ui-shadow-focus);
  outline: 0;
}

.user-result-count {
  min-width: 72px;
  color: var(--ui-text-muted);
  font-size: 11px;
  text-align: right;
}

.user-management-status:empty { display: none; }

.user-list {
  border: 0;
  background: transparent;
}

.user-card {
  gap: 0;
  border-color: var(--ui-line);
  border-radius: 8px;
  padding: 0;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(20, 27, 36, .03);
}

.user-card-main {
  padding: 16px 18px 13px;
}

.user-card-identity,
.user-card-badges {
  display: flex;
  align-items: center;
  gap: 9px;
}

.user-avatar {
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  place-items: center;
  border: 1px solid #c7d2da;
  border-radius: 7px;
  background: #edf3f6;
  color: #315f7e;
  font-size: 14px;
  font-weight: 700;
}

.user-card-name { color: var(--ui-text); font-size: 14px; font-weight: 680; }
.user-card-meta { display: flex; gap: 10px; color: var(--ui-text-muted); font-size: 10px; }

.user-card-meta span + span {
  border-left: 1px solid var(--ui-line);
  padding-left: 10px;
}

.user-role-badge,
.user-level-badge,
.user-status {
  min-height: 24px;
  border: 1px solid var(--ui-line);
  border-radius: 999px;
  background: #f6f8f9;
  color: var(--ui-text-secondary);
  padding: 3px 8px;
  font-size: 10px;
  font-weight: 650;
}

.user-role-badge.admin { border-color: #bdcbd5; background: #eef3f6; color: #315f7e; }
.user-level-badge { border-color: #d7caa9; background: #faf7ef; color: #765d25; }
.user-status.success { border-color: #b9d8c7; background: #f0f8f3; color: #217a4b; }
.user-status.error { border-color: #e4c1bd; background: #fff4f3; color: #a63d35; }

.user-account-facts {
  display: grid;
  grid-template-columns: .65fr 1.15fr 1.15fr .65fr;
  margin: 0;
  border-top: 1px solid var(--ui-line);
  background: #fbfcfd;
}

.user-account-facts div {
  display: grid;
  gap: 4px;
  border-right: 1px solid var(--ui-line);
  padding: 11px 18px;
}

.user-account-facts div:last-child { border-right: 0; }
.user-account-facts dt { color: var(--ui-text-muted); font-size: 9px; }
.user-account-facts dd { margin: 0; color: var(--ui-text); font-size: 11px; font-weight: 620; }

.user-admin-panel { border-top: 1px solid var(--ui-line); }

.user-admin-panel > summary {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 9px;
  min-height: 43px;
  cursor: pointer;
  list-style: none;
  padding: 8px 18px;
  color: var(--ui-text-secondary);
  font-size: 11px;
}

.user-admin-panel > summary::-webkit-details-marker { display: none; }
.user-admin-panel > summary small { color: var(--ui-text-muted); font-size: 9px; }
.user-admin-chevron { font-size: 15px; transition: transform 150ms ease; }
.user-admin-panel[open] > summary { border-bottom: 1px solid var(--ui-line); background: #fbfcfd; }
.user-admin-panel[open] .user-admin-chevron { transform: rotate(180deg); }

.user-admin-panel-body {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
}

.user-admin-section {
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 16px 18px 18px;
}

.user-admin-section + .user-admin-section { border-left: 1px solid var(--ui-line); }
.user-admin-section > header { display: grid; gap: 3px; }
.user-admin-section > header strong { color: var(--ui-text); font-size: 11px; }
.user-admin-section > header span { color: var(--ui-text-muted); font-size: 9px; }

.user-admin-section .user-actions {
  justify-content: flex-start;
}

.user-admin-section .user-points-actions {
  grid-template-columns: minmax(130px, .7fr) minmax(190px, 1.3fr) auto;
  border-top: 0;
  padding-top: 0;
}

.user-security-section .user-reset-input { width: min(210px, 100%); }

@media (max-width: 820px) {
  .user-management-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .user-management-summary article:nth-child(2) { border-right: 0; }
  .user-management-summary article:nth-child(-n+2) { border-bottom: 1px solid var(--ui-line); }
  .user-management-toolbar { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .user-search-field { grid-column: 1 / -1; }
  .user-result-count { grid-column: 1 / -1; text-align: left; }
  .user-card-main { align-items: flex-start; }
  .user-card-badges { justify-content: flex-start; }
  .user-account-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .user-account-facts div:nth-child(2) { border-right: 0; }
  .user-account-facts div:nth-child(-n+2) { border-bottom: 1px solid var(--ui-line); }
  .user-admin-panel-body { grid-template-columns: minmax(0, 1fr); }
  .user-admin-section + .user-admin-section { border-top: 1px solid var(--ui-line); border-left: 0; }
}

@media (max-width: 520px) {
  .user-management-summary { grid-template-columns: minmax(0, 1fr); }
  .user-management-summary article { min-height: 68px; border-right: 0; border-bottom: 1px solid var(--ui-line); }
  .user-management-summary article:last-child { border-bottom: 0; }
  .user-management-toolbar { grid-template-columns: minmax(0, 1fr); }
  .user-search-field, .user-result-count { grid-column: auto; }
  .user-card-main, .user-card-badges { align-items: flex-start; }
  .user-card-main { display: grid; }
  .user-card-badges { flex-wrap: wrap; }
  .user-account-facts { grid-template-columns: minmax(0, 1fr); }
  .user-account-facts div { border-right: 0; border-bottom: 1px solid var(--ui-line); }
  .user-account-facts div:last-child { border-bottom: 0; }
  .user-admin-section .user-points-actions { grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  .user-admin-chevron,
  .user-create-panel > summary > span:last-child { transition: none; }
}