/* The map canvas stays dark for topology contrast; its sign-in and controls follow Admin's warm/copper system. */
:root {
  --amber: #d4a574;
  --muted: #d4c4b6;
  --subtle: #a99383;
}
.auth-screen { background: #241912; }
.auth-card { width: min(100%, 520px); padding: clamp(28px, 4vw, 48px); border: 1px solid #d7c6b2; background: #f7f0e6; color: #241c14; box-shadow: 0 24px 70px rgba(0,0,0,.26); }
.auth-card h1 { color: #241c14; font-size: clamp(34px, 3vw, 44px); }
.auth-card > p:not(.eyebrow), .mfa-copy { color: #665b51; font-size: 15px; }
.auth-form { gap: 18px; }
.auth-form label { gap: 8px; color: #241c14; font-size: 14px; }
.auth-form input { min-height: 48px; border-color: #d7c6b2; color: #241c14; background: #fffdf9; font-size: 15px; }
.auth-form input:focus-visible { border-color: #8b4513; box-shadow: 0 0 0 3px rgba(139,69,19,.14); }
.auth-card .button { min-height: 44px; font-size: 15px; }
.auth-card .primary-button { color: #fff8f1; background: #8b4513; }
.auth-card .apple-button { border: 1px solid #d7c6b2; color: #241c14; background: #fffdf9; }
.auth-card .divider { color: #665b51; font-size: 12px; }
.auth-card .divider span { background: #d7c6b2; }
.auth-card .text-button { min-height: 40px; color: #8b4513; font-size: 14px; }
.auth-card .form-message { font-size: 14px; }
.auth-card .eyebrow { color: #8b4513; font-size: 12px; }

.topbar { background: #241912; }
.left-panel, .inspector { background: #211c18; }
.panel-label { font-size: 12px; letter-spacing: .08em; }
.search input { min-height: 44px; font-size: 14px; }
.filter-button, .trace-button { min-height: 40px; font-size: 13px; }
.filter-button span, .panel-heading span, .legend, .trace-detail { font-size: 12px; }
.focus-item { padding: 13px; }
.focus-item strong { font-size: 13px; }
.focus-item span { font-size: 12px; }
.inspector-section h3 { font-size: 11px; }
.inspector-section p, .relationship-list li { font-size: 13px; line-height: 1.5; }
.connection-list b, .relationship-list em { font-size: 10px; }
.clear-trace, .copy-source { min-height: 36px; padding: 7px 10px; font-size: 12px; }
button:focus-visible, input:focus-visible { outline: 3px solid #d4a574; outline-offset: 2px; }

@media (max-width: 720px) {
  .left-panel { grid-template-columns: 1fr; }
  .focus-section, .trace-section { grid-column: 1; }
  .trace-list { grid-template-columns: 1fr; }
}
