/* GHAssist console: shared presentation layer, after the legacy page styles. */
:root, html[data-theme="dark"] {
  color-scheme: dark;
  --ink: #eef2fb; --muted: #a7b4ca; --line: #2b3850;
  --surface: #141e30; --surface-2: #1b2840; --canvas: #0b1220;
  --brand: #a8b4ff; --brand-strong: #5865db; --brand-soft: #253256;
  --success: #8ee5bc; --danger: #ffadb4; --warning: #f5d38c;
  --ui-input: #101a2b; --ui-primary: #5360d5; --ui-hover: #202d45;
  --ui-shadow: 0 12px 32px rgb(0 0 0 / 12%); --sidebar-width: 232px;
}
html[data-theme="light"] {
  color-scheme: light;
  --ink: #1d2940; --muted: #56647b; --line: #d7dfed;
  --surface: #fff; --surface-2: #f0f3fa; --canvas: #f4f6fb;
  --brand: #4351c4; --brand-strong: #4351c4; --brand-soft: #edf0ff;
  --success: #11653e; --danger: #b32336; --warning: #80540b;
  --ui-input: #fff; --ui-primary: #4351c4; --ui-hover: #edf1f9;
  --ui-shadow: 0 8px 24px rgb(26 42 79 / 5%);
}
html { scroll-padding-top: 88px; }
html[data-theme] body, html[data-theme] button, html[data-theme] input, html[data-theme] select, html[data-theme] textarea {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif !important;
}
html[data-theme] body { font-size: 13px; line-height: 1.55; }
html[data-theme] [hidden] { display: none !important; }
html[data-theme] :is(button, a, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--brand); outline-offset: 3px;
}
html[data-theme] :is(input, select, textarea) { font-size: 14px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.skip-link { position: fixed; left: 16px; top: -100px; z-index: 1500; padding: 12px 18px; border-radius: 8px; background: var(--ui-primary); color: #fff; }
.skip-link:focus { top: 12px; }
.ui-icon { width: 19px; height: 19px; flex-shrink: 0; vertical-align: middle; }
html[data-theme] .admin-body { background: var(--canvas); color: var(--ink); }
html[data-theme] .admin-sidebar { width: var(--sidebar-width); height: 100dvh; padding: 20px 12px 12px; background: var(--surface); border-right: 1px solid var(--line); }
html[data-theme] .admin-brand { padding: 0 10px 20px; border-bottom: 1px solid var(--line); font-size: 16px; letter-spacing: -.04em; gap: 10px; color: var(--ink); }
html[data-theme] .admin-brand > span { width: 36px; height: 36px; border-radius: 10px; background: var(--ui-primary); color: #fff; box-shadow: none; font-size: 12px; letter-spacing: -.02em; }
html[data-theme] .admin-brand small { color: var(--muted); font-size: 10px; letter-spacing: .02em; }
html[data-theme] .admin-sidebar nav { padding: 12px 0; gap: 12px; flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; }
html[data-theme] .admin-brand, html[data-theme] .sidebar-user { flex-shrink: 0; }
html[data-theme] .nav-close { display: none; }
html[data-theme] .nav-section { display: grid; gap: 3px; }
html[data-theme] .nav-group { padding: 0; margin: 5px 12px 5px; color: var(--muted); font-size: 9px; font-weight: 750; letter-spacing: .12em; }
html[data-theme] .admin-sidebar nav a { display: flex; align-items: center; gap: 10px; margin: 0; padding: 9px 11px; min-height: 38px; border: 1px solid transparent; border-radius: 8px; font-size: 12px; font-weight: 550; color: var(--muted); background: transparent; box-shadow: none; transform: none; }
html[data-theme] .admin-sidebar nav a::before, html[data-theme] .admin-sidebar nav a::after { content: none !important; }
html[data-theme] .admin-sidebar nav a:hover { background: var(--ui-hover); color: var(--ink); border-color: transparent; }
html[data-theme] .admin-sidebar nav a.active { background: var(--brand-soft); border-color: var(--line); color: var(--brand); box-shadow: none; font-weight: 650; }
html[data-theme] .sidebar-user { margin-top: auto; padding: 12px 8px 4px; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; box-shadow: none; gap: 8px; grid-template-columns: 30px minmax(0,1fr) auto; }
html[data-theme] .sidebar-user > span, .user-avatar { width: 30px; height: 30px; display: inline-grid; place-items: center; border-radius: 9px; background: var(--brand-soft); color: var(--brand); font-size: 12px; font-weight: 700; }
html[data-theme] .sidebar-user > div { overflow: hidden; text-overflow: ellipsis; color: var(--ink); font-size: 12px; }
html[data-theme] .sidebar-user small, html[data-theme] .sidebar-user a { color: var(--muted); font-size: 10px; }
html[data-theme] .admin-main { margin-left: var(--sidebar-width); min-width: 0; }
html[data-theme] .admin-topbar { height: 68px; padding: 0 24px; gap: 14px; background: var(--canvas); border-bottom: 1px solid var(--line); backdrop-filter: none; }
html[data-theme] .menu-toggle { position: static; inset: auto; display: grid !important; place-items: center; width: 36px; height: 36px; padding: 0; flex-shrink: 0; border-radius: 8px; background: var(--surface); color: var(--muted) !important; border: 1px solid var(--line); box-shadow: none; }
html[data-theme] .menu-toggle::before { content: none !important; }
.topbar-context { min-width: 0; }
html[data-theme] .topbar-context small { margin-bottom: 2px; color: var(--muted); font-size: 9px; letter-spacing: .1em; }
html[data-theme] .topbar-context strong { font-size: 13px; color: var(--ink); }
.topbar-actions { display: flex; align-items: center; margin-left: auto; gap: 14px; flex-shrink: 0; }
html[data-theme] .theme-toggle { border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--muted); height: 34px; min-width: 34px; padding: 0 10px; font-size: 10px; box-shadow: none; }
html[data-theme] .top-user { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--muted); font-size: 11px; }
html[data-theme] .top-user > span:not(.user-avatar):not(.sr-only) { max-width: 120px; overflow: hidden; text-overflow: ellipsis; }
html[data-theme] .top-user .ui-icon { width: 15px; height: 15px; }
html[data-theme] .admin-content { max-width: 1600px; padding: 24px; margin: 0 auto; min-width: 0; }
html[data-theme] .admin-content > *, html[data-theme] :is(.grid,.quick-grid,.automation-grid,.form-grid,.supplier-rules-workspace) > * { min-width: 0; }
html[data-theme] .page-heading { margin-bottom: 22px; gap: 16px; align-items: center; }
html[data-theme] .page-heading > div { min-width: 0; }
html[data-theme] .page-heading > div > span { padding: 0; background: transparent; border-radius: 0; font-size: 9px; letter-spacing: .14em; color: var(--brand); }
html[data-theme] .page-heading h1 { margin: 6px 0; font-size: 27px; font-weight: 700; letter-spacing: -.045em; color: var(--ink); overflow-wrap: anywhere; }
html[data-theme] .page-heading p { max-width: 720px; font-size: 12px; line-height: 1.65; color: var(--muted); }
html[data-theme] .hero-action { flex-shrink: 0; gap: 8px; }
html[data-theme] .grid { gap: 14px; }
html[data-theme] .card, html[data-theme] .automation-card { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--ui-shadow); color: var(--ink); }
html[data-theme] .card:hover { border-color: var(--line); }
html[data-theme] .card-header { padding: 14px 18px; flex-wrap: wrap; gap: 10px; border-color: var(--line); }
html[data-theme] .card-header h2 { font-size: 13px; font-weight: 650; color: var(--ink); }
html[data-theme] .card-header small { display: block; margin-top: 3px; font-size: 11px; }
html[data-theme] .card-body { padding: 18px; }
html[data-theme] .card :is(p,small), html[data-theme] .notice, html[data-theme] .step { overflow-wrap: anywhere; }
html[data-theme] .card pre { max-width: 100%; overflow-wrap: anywhere; }
html[data-theme] .stat { min-height: 132px; padding: 18px 20px; display: grid; grid-template-columns: 1fr 36px; gap: 3px; }
html[data-theme] .stat::after { content: none; }
html[data-theme] .stat .metric-icon { grid-column: 2; grid-row: 1 / 3; margin: 0; }
html[data-theme] .stat small { grid-column: 1; grid-row: 1; align-self: center; color: var(--muted); font-size: 11px; }
html[data-theme] .stat strong { grid-column: 1; grid-row: 2; margin: 4px 0 0; font-size: 30px; letter-spacing: -.045em; color: var(--ink); line-height: 1.25; }
html[data-theme] .stat-note { grid-column: 1 / -1; margin-top: 8px; color: var(--muted); font-size: 10px; }
html[data-theme] .metric-icon, html[data-theme] .automation-icon { width: 34px; height: 34px; border-radius: 10px; background: var(--brand-soft); color: var(--brand); border: 1px solid var(--line); box-shadow: none; }
html[data-theme] .automation-control { margin-top: 24px; }
html[data-theme] .section-heading { margin-bottom: 14px; gap: 12px; }
html[data-theme] .section-heading h2 { color: var(--ink); font-size: 17px; letter-spacing: -.025em; }
html[data-theme] .section-heading p, html[data-theme] .automation-card > p { color: var(--muted); font-size: 11px; }
html[data-theme] .section-heading > div > span { color: var(--brand); font-size: 9px; }
html[data-theme] .live-indicator { background: var(--surface); border-color: var(--line); color: var(--muted); }
html[data-theme] .automation-grid { gap: 14px; }
html[data-theme] .automation-card { padding: 18px; }
html[data-theme] .automation-card::after { content: none; }
html[data-theme] .automation-card h3 { margin: 14px 0 5px; color: var(--ink); font-size: 13px; }
html[data-theme] .automation-card > p { margin-bottom: 14px; min-height: 34px; }
html[data-theme] .automation-card > p strong { color: var(--ink); font-weight: 550; }
html[data-theme] .interval-form > small { color: var(--muted); font-size: 10px; }
html[data-theme] .interval-form > label { color: var(--muted); font-size: 11px; }
html[data-theme] .interval-form > div { grid-template-columns: minmax(0,1fr) auto auto; }
html[data-theme] .interval-form input { background: var(--ui-input); color: var(--ink); border-color: var(--line); font-weight: 650; }
html[data-theme] .task-controls { border-color: var(--line); gap: 6px; }
html[data-theme] .task-controls button { font-size: 11px; border-radius: 7px; min-height: 34px; }
html[data-theme] .task-restart { background: var(--surface-2); border-color: var(--line); color: var(--ink); }
html[data-theme] .mode-toggle { font-size: 9px; height: 27px; transform: none; }
html[data-theme] .quick-grid { grid-template-columns: minmax(0,2fr) minmax(260px,1fr); gap: 14px; }
html[data-theme] .step strong, html[data-theme] .rule-hub-card h2 { color: var(--ink); }
html[data-theme] .step small { color: var(--muted); }
html[data-theme] .step > span { border-radius: 8px; background: var(--surface-2); color: var(--muted); }
html[data-theme] .step.active > span { background: var(--brand-soft); color: var(--brand); }
html[data-theme] .rule-hub-card { padding: 20px; min-height: 225px; }
html[data-theme] .rule-hub-card .metric-icon { margin-bottom: 18px; }
html[data-theme] .btn { min-height: 36px; padding: 8px 12px; border-radius: 8px; font-size: 12px; font-weight: 600; transition: background-color .15s, border-color .15s; white-space: normal; }
html[data-theme] .btn-primary, html[data-theme] .auth-card .btn.primary { background: var(--ui-primary); color: #fff; border-color: var(--ui-primary); }
html[data-theme] .btn-primary:hover, html[data-theme] .auth-card .btn.primary:hover { filter: brightness(1.1); }
html[data-theme] .btn-secondary { background: var(--surface-2); color: var(--ink); border-color: var(--line); }
html[data-theme] .btn-secondary:hover { background: var(--ui-hover); }
html[data-theme] .btn-danger { color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, var(--surface)); border-color: color-mix(in srgb, var(--danger) 45%, var(--line)); }
html[data-theme] .btn-sm { min-height: 30px; padding: 5px 9px; font-size: 11px; }
html[data-theme] button:disabled { cursor: not-allowed; opacity: .55; }
html[data-theme] .actions { flex-wrap: wrap; gap: 8px; }
html[data-theme] .form-grid { gap: 15px; }
html[data-theme] .field label, html[data-theme] .rule-choice-form legend { color: var(--ink); font-size: 11px; font-weight: 650; }
html[data-theme] .field-hint, html[data-theme] .rule-capabilities small { color: var(--muted); font-size: 11px; }
html[data-theme] :is(.field,.toolbar,.tenant-task-card) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea) { background: var(--ui-input); color: var(--ink); border: 1px solid var(--line); border-radius: 8px; min-width: 0; max-width: 100%; padding: 9px 12px; min-height: 40px; }
html[data-theme] .field textarea { width: 100%; min-height: 100px; }
html[data-theme] :is(input,textarea)::placeholder { color: var(--muted) !important; opacity: 1; }
html[data-theme] :is(input[type="checkbox"],input[type="radio"]) { accent-color: var(--ui-primary); flex-shrink: 0; }
html[data-theme] .toolbar { display: flex; align-items: center; gap: 8px; margin: 0; width: 100%; }
html[data-theme] .toolbar > input { flex: 2 1 220px; width: auto; }
html[data-theme] .toolbar > :is(select,.combo-select) { flex: 1 1 150px; width: auto; }
html[data-theme] .card-header > .toolbar { width: auto; flex: 1 1 280px; }
html[data-theme] .card-header > .toolbar > input { min-width: 0; }
html[data-theme] .table-wrap { max-width: 100%; overflow: auto; overscroll-behavior-inline: contain; border-radius: 0 0 12px 12px; scrollbar-width: thin; }
html[data-theme] .table-wrap:focus-visible { outline-offset: -3px; }
html[data-theme] .data-table { min-width: 640px; width: 100%; color: var(--ink); font-variant-numeric: tabular-nums; }
html[data-theme] .data-table th { padding: 10px 14px; background: var(--surface-2); color: var(--muted); font-size: 9px; font-weight: 650; letter-spacing: .07em; border-color: var(--line); white-space: nowrap; }
html[data-theme] .data-table td { padding: 10px 14px; font-size: 12px; line-height: 1.5; color: var(--ink); border-color: var(--line); }
html[data-theme] .data-table td small { display: block; margin-top: 3px; font-size: 10px; color: var(--muted); }
html[data-theme] .data-table tbody tr:hover td { background: var(--ui-hover); }
html[data-theme] .data-table td strong { font-weight: 600; }
html[data-theme] .data-table td.muted { color: var(--muted); font-size: 11px; }
html[data-theme] .data-table .activity-message { min-width: 240px; max-width: 520px; }
html[data-theme] .activity-detail-trigger { color: var(--ink); text-decoration: none; }
html[data-theme] .activity-detail-trigger:hover { color: var(--brand); text-decoration: underline; }
html[data-theme] .badge { padding: 4px 8px; gap: 5px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-2); color: var(--muted); font-size: 10px; font-weight: 650; white-space: nowrap; }
html[data-theme] .badge.success { color: var(--success); background: color-mix(in srgb, var(--success) 9%, var(--surface)); border-color: color-mix(in srgb, var(--success) 28%, var(--line)); }
html[data-theme] .badge.danger { color: var(--danger); background: color-mix(in srgb, var(--danger) 9%, var(--surface)); border-color: color-mix(in srgb, var(--danger) 28%, var(--line)); }
html[data-theme] .badge.warning { color: var(--warning); background: color-mix(in srgb, var(--warning) 9%, var(--surface)); border-color: color-mix(in srgb, var(--warning) 28%, var(--line)); }
html[data-theme] .notice { padding: 12px 14px; border: 1px solid var(--line); border-left: 3px solid var(--brand); border-radius: 8px; background: var(--brand-soft); color: var(--ink); font-size: 12px; }
html[data-theme] .notice.success, html[data-theme] .alert.success { border-color: var(--line); border-left-color: var(--success); background: color-mix(in srgb, var(--success) 8%, var(--surface)); color: var(--success); }
html[data-theme] .notice.error, html[data-theme] .alert.error { border-color: var(--line); border-left-color: var(--danger); background: color-mix(in srgb, var(--danger) 8%, var(--surface)); color: var(--danger); }
html[data-theme] .muted { color: var(--muted); }
html[data-theme] code { color: var(--brand); font-size: .94em; }
html[data-theme] .empty-state { display: grid; justify-items: center; gap: 6px; padding: 30px 18px; margin: 16px; background: var(--canvas); border: 1px dashed var(--line); border-radius: 10px; }
html[data-theme] .empty-state strong { color: var(--ink); font-size: 13px; font-weight: 600; }
html[data-theme] .empty-state p { max-width: 360px; color: var(--muted); font-size: 12px; margin: 0; }
.empty-state-icon { display: grid; place-items: center; width: 38px; height: 38px; margin-bottom: 5px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); color: var(--brand); }
html[data-theme] .supplier-rules-workspace { grid-template-columns: minmax(310px,.9fr) minmax(0,1.1fr); gap: 14px; }
html[data-theme] .supplier-rule-builder { top: 84px; }
html[data-theme] .rule-choice-form { gap: 18px; }
html[data-theme] .choice-row { gap: 8px; }
html[data-theme] .choice-row label { padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--ui-input); font-size: 11px; flex: 1 1 auto; }
html[data-theme] .choice-row label:has(input:checked) { background: var(--brand-soft); border-color: var(--brand); color: var(--brand); }
html[data-theme] .rule-capabilities > label { padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--ui-input); }
html[data-theme] .rule-capabilities strong { color: var(--ink); font-size: 12px; }
html[data-theme] .supplier-rule-tabs { padding: 10px 12px; border-color: var(--line); gap: 5px; }
html[data-theme] .supplier-rule-tab { padding: 8px 10px; border-radius: 7px; font-size: 11px; }
html[data-theme] .supplier-rule-tab:hover { background: var(--ui-hover); color: var(--ink); }
html[data-theme] .supplier-rule-tab.active { background: var(--brand-soft); color: var(--brand); }
html[data-theme] .supplier-rule-tab span, html[data-theme] .supplier-rule-tab.active span { background: var(--surface); color: var(--muted); }
html[data-theme] .supplier-rule-chip { max-width: 100%; flex-wrap: wrap; border-radius: 7px; padding: 7px 9px; font-size: 11px; transform: none; }
html[data-theme] .supplier-rule-chip:hover { transform: none; box-shadow: none; }
html[data-theme] .supplier-rule-chip .chip-remove { color: var(--danger); opacity: 1; padding-left: 5px; }
html[data-theme] .supplier-rule-chip > span:not(.chip-mark):not(.chip-remove) { overflow-wrap: anywhere; }
html[data-theme] .combo-select { position: relative; width: 100%; min-width: 0; }
html[data-theme] .combo-trigger { display: flex; align-items: center; gap: 8px; min-height: 44px; height: auto; padding: 9px 34px 9px 12px; background: var(--ui-input); color: var(--ink); border: 1px solid var(--line); border-radius: 8px; font-size: 13px; line-height: 1.5; transition: border-color .15s, background-color .15s, box-shadow .15s; }
html[data-theme] .combo-trigger:hover:not(:disabled) { background: var(--ui-hover); border-color: color-mix(in srgb, var(--brand) 55%, var(--line)); }
html[data-theme] .combo-trigger:disabled { opacity: .58; cursor: not-allowed; }
html[data-theme] .combo-select.has-error .combo-trigger, html[data-theme] .combo-trigger[aria-invalid="true"] { border-color: var(--danger); box-shadow: 0 0 0 1px color-mix(in srgb, var(--danger) 35%, transparent); }
html[data-theme] .combo-trigger > span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
html[data-theme] .combo-trigger::after { content: ''; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-75%) rotate(45deg); right: 14px; }
html[data-theme] .combo-select.open .combo-trigger { border-color: var(--brand); border-radius: 8px; }
html[data-theme] .combo-panel { position: fixed; display: block; z-index: 1400; right: auto; max-width: calc(100vw - 24px); padding: 8px; background: var(--surface); color: var(--ink); border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 16px 48px rgb(0 0 0 / 22%); }
html[data-theme] .combo-panel .combo-search { width: 100% !important; min-height: 44px; height: 44px !important; margin: 0 0 6px !important; padding: 8px 10px !important; background: var(--ui-input) !important; color: var(--ink) !important; border: 1px solid var(--line) !important; border-radius: 7px !important; font-size: 14px; }
html[data-theme] .combo-options { max-height: 210px; min-height: 0; overflow: auto; overscroll-behavior: contain; display: grid; gap: 2px; }
html[data-theme] .combo-option { display: flex; align-items: center; min-height: 44px; padding: 9px 11px; border-radius: 7px; font-size: 13px; color: var(--ink); background: transparent; overflow-wrap: anywhere; cursor: pointer; }
html[data-theme] .combo-option.active, html[data-theme] .combo-option:hover { background: var(--ui-hover); color: var(--ink); }
html[data-theme] .combo-option.selected { background: var(--brand-soft); color: var(--brand); font-weight: 600; }
html[data-theme] .combo-option.selected::after { content: '✓'; float: right; padding-left: 6px; }
html[data-theme] .combo-option[aria-disabled="true"] { opacity: .5; }
html[data-theme] .combo-empty { padding: 16px 10px; font-size: 12px; color: var(--muted); }
@media (max-width: 480px) {
  html[data-theme] .combo-panel { padding: 7px; border-radius: 9px; }
  html[data-theme] .combo-options { max-height: min(48dvh, 260px); }
}
@media (prefers-reduced-motion: reduce) {
  html[data-theme] .combo-trigger { transition: none; }
}
html[data-theme] .log-modal { padding: 16px; }
html[data-theme] .log-modal-backdrop { background: rgb(4 9 19 / 72%); backdrop-filter: blur(3px); }
html[data-theme] .log-modal-dialog { max-height: calc(100dvh - 32px); background: var(--surface); border-radius: 12px; border-color: var(--line); }
html[data-theme] .log-modal-header, html[data-theme] .log-modal-footer { padding: 14px 18px; border-color: var(--line); }
html[data-theme] .log-modal-header h2 { color: var(--ink); font-size: 14px; }
html[data-theme] .log-modal-header button { width: 36px; height: 36px; border-radius: 7px; background: var(--surface-2); color: var(--ink); }
html[data-theme] .log-modal-dialog pre { padding: 18px; color: var(--ink); background: var(--canvas); font-size: 12px; }
html[data-theme] .pagination { justify-content: space-between; align-items: center; border-top: 1px solid var(--line); }
html[data-theme] .pagination > span { color: var(--muted); background: transparent; }
html[data-theme] .auth-page { background: var(--canvas); color: var(--ink); }
.auth-masthead { position: absolute; top: 26px; left: 32px; display: flex; align-items: center; gap: 10px; color: var(--ink); font-size: 12px; font-weight: 650; letter-spacing: .025em; }
.auth-masthead > span { display: grid; place-items: center; width: 32px; height: 32px; background: var(--ui-primary); color: #fff; border-radius: 9px; font-size: 10px; }
html[data-theme] .auth-shell { grid-template-columns: minmax(0,1fr) minmax(340px,420px); gap: 70px; max-width: 1050px; margin: auto; padding: 110px 32px 60px; align-content: center; }
.auth-intro { max-width: 470px; }
.auth-intro > span { color: var(--brand); font-size: 10px; font-weight: 650; letter-spacing: .16em; }
.auth-intro h2 { margin: 22px 0 20px; color: var(--ink); font-size: clamp(32px,4vw,52px); line-height: 1.12; letter-spacing: -.055em; font-weight: 650; }
.auth-intro p { color: var(--muted); font-size: 14px; line-height: 1.8; }
.auth-intro ul { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; padding: 0; margin: 24px 0 0; }
.auth-intro li { padding: 6px 10px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); font-size: 11px; }
html[data-theme] .auth-card { width: 100%; padding: 30px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: var(--ui-shadow); }
html[data-theme] .auth-card .brand-mark { width: 40px; height: 40px; margin-bottom: 20px; background: var(--brand-soft); color: var(--brand); border-radius: 10px; font-size: 12px; }
html[data-theme] .auth-card h1 { color: var(--ink); font-size: 24px; letter-spacing: -.035em; }
html[data-theme] .auth-card .muted { color: var(--muted); font-size: 12px; line-height: 1.65; }
html[data-theme] .auth-card label { color: var(--ink); font-size: 11px; }
html[data-theme] .auth-card input { background: var(--ui-input) !important; color: var(--ink) !important; border: 1px solid var(--line) !important; border-radius: 8px !important; font-size: 16px; }
html[data-theme] .auth-card .btn.primary { height: 44px; border-radius: 8px; }
html[data-theme] .auth-card a { color: var(--brand); }
html[data-theme] .auth-theme-toggle { position: absolute; top: 26px; right: 32px; }
html[data-theme] .alert { border: 1px solid var(--line); border-left-width: 3px; border-radius: 8px; }
@media (max-width: 1200px) {
  html[data-theme] .quick-grid { grid-template-columns: 1fr; }
  html[data-theme] .supplier-rules-workspace { grid-template-columns: 1fr; }
  html[data-theme] .supplier-rule-builder { position: static; }
}
@media (min-width: 901px) {
  html[data-theme] body.sidebar-collapsed .admin-main { margin-left: 0; }
  html[data-theme] body.sidebar-collapsed .admin-sidebar { transform: translateX(-100%); }
}
@media (max-width: 900px) {
  html[data-theme] .nav-close { position: absolute; top: 22px; right: 16px; display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-2); color: var(--muted); }
  html[data-theme] .admin-main { margin-left: 0; }
  html[data-theme] .admin-sidebar { width: min(280px,calc(100vw - 48px)); }
  html[data-theme] .admin-sidebar.open, html[data-theme] body.sidebar-collapsed .admin-sidebar.open { transform: translateX(0); }
  html[data-theme] .admin-topbar { padding: 0 18px; }
  html[data-theme] .admin-content { padding: 22px 18px; }
  html[data-theme] .grid-3 { grid-template-columns: repeat(3,minmax(0,1fr)); }
  html[data-theme] .grid-2 { grid-template-columns: repeat(2,minmax(0,1fr)); }
  html[data-theme] .page-heading { align-items: flex-start; flex-direction: column; }
  html[data-theme] .auth-shell { gap: 32px; grid-template-columns: minmax(0,1fr) minmax(310px,380px); padding-inline: 24px; }
  .auth-intro h2 { font-size: 34px; }
  html[data-theme] body.menu-open { overflow: hidden; }
}
@media (max-width: 700px) {
  html[data-theme] .admin-topbar { padding: 0 14px; height: 62px; gap: 10px; }
  html[data-theme] .topbar-context small { font-size: 8px; }
  html[data-theme] .topbar-context strong { font-size: 12px; }
  .topbar-actions { gap: 8px; }
  html[data-theme] .top-user { display: none; }
  html[data-theme] .theme-toggle [data-theme-label] { display: none; }
  html[data-theme] .theme-toggle { padding: 0; width: 36px; height: 36px; }
  html[data-theme] .admin-content { padding: 20px 14px; }
  html[data-theme] .page-heading h1 { font-size: 25px; }
  html[data-theme] .page-heading p { font-size: 12px; }
  html[data-theme] :is(.grid-2,.grid-3,.automation-grid) { grid-template-columns: 1fr; }
  html[data-theme] .stat { min-height: 114px; }
  html[data-theme] .form-grid { grid-template-columns: 1fr; }
  html[data-theme] .card-header, html[data-theme] .card-body { padding: 14px; }
  html[data-theme] .btn { min-height: 40px; }
  html[data-theme] .task-controls { grid-template-columns: repeat(3,minmax(0,1fr)); }
  html[data-theme] .task-controls button { min-height: 40px; }
  html[data-theme] .toolbar > input, html[data-theme] .toolbar > :is(select,.combo-select) { flex-basis: 100%; width: 100%; }
  html[data-theme] .card-header > .toolbar { flex-basis: 100%; }
  html[data-theme] .toolbar > .btn { flex: 1; }
  html[data-theme] .hero-action { width: 100%; }
  html[data-theme] .hero-action .btn { flex: 1; }
  html[data-theme] .choice-row { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  html[data-theme] .choice-row label { min-width: 0; min-height: 40px; }
  html[data-theme] [data-ui-page="prices"] .card-body > div[style*="grid-template-columns"] { grid-template-columns: minmax(0,1fr) 90px !important; }
  html[data-theme] [data-ui-page="prices"] .card-body > div[style*="grid-template-columns"] > code { grid-column: 1 / -1; }
  html[data-theme] .auth-shell { display: grid; grid-template-columns: 1fr; max-width: 470px; padding: 90px 18px 32px; gap: 20px; }
  .auth-intro { text-align: center; }
  .auth-intro h2 { font-size: 28px; margin: 10px 0 0; }
  .auth-intro p, .auth-intro ul { display: none; }
  .auth-intro > span { font-size: 9px; }
  html[data-theme] .auth-card { padding: 24px; }
  .auth-masthead { left: 20px; top: 24px; }
  html[data-theme] .auth-theme-toggle { right: 20px; top: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-theme] *, html[data-theme] *::before, html[data-theme] *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}