/* Access forms and account states. Scoped so working screens keep their density. */
html.access-document {
  --bg: #0a0908; --surface: #141210; --text: #f0ebe0;
  --amber: #d4901a; --border-strong: #766b5b;
  background: var(--bg); color-scheme: dark;
}
html.access-document[data-theme="light"] {
  --bg: #fbf8f1; --surface: #ffffff; --text: #29241d;
  --amber: #925d0c; --border-strong: #948575; color-scheme: light;
}
.access-document body { margin: 0; background: var(--bg); }
.access-shell {
  --access-muted: #b3aa9c;
  --access-line: #766b5b;
  box-sizing: border-box; min-height: 100svh; padding: 48px 24px;
  background: var(--bg); color: var(--text);
  font: 400 16px/1.7 var(--font-ui);
  -webkit-font-smoothing: antialiased;
}
[data-theme="light"] .access-shell, [data-theme="litellm"] .access-shell {
  --access-muted: #655c50; --access-line: #948575;
}
[data-contrast="on"] .access-shell { --access-muted: var(--text); }
.access-shell *, .access-shell *::before, .access-shell *::after { box-sizing: border-box; }
.access-shell h1, .access-shell h2, .access-shell p { margin: 0; }
.access-inner { width: 100%; max-width: 1040px; margin: 0 auto; }
.access-brand { display: inline-flex; align-items: center; gap: 10px; color: var(--text); text-decoration: none; font: 600 20px/1.2 var(--font-display); }
.access-brand img { flex-shrink: 0; }
.access-brand span span { color: var(--brand-amber, #d4901a); }
.access-shell .access-eyebrow { color: var(--access-muted); font-size: 14px; margin-bottom: 20px; }
.access-shell h1 { font: 400 clamp(32px, 4vw, 48px)/1.15 var(--font-display); letter-spacing: -.025em; text-wrap: balance; }
/* Two-sentence headlines wrap between sentences first, as in marketing.css. */
@media (min-width: 600px) { .access-shell h1 .headline-sentence { display: inline-block; } }
.access-shell h2 { font: 400 28px/1.25 var(--font-display); }
.access-shell .access-lead { color: var(--access-muted); margin-top: 24px; max-width: 560px; }
.access-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 96px; align-items: start; margin: 96px 0 64px; }
.access-form-section { padding-top: 4px; }
.access-shell .access-form-intro { color: var(--access-muted); margin: 12px 0 28px; }
.access-form { display: flex; flex-direction: column; gap: 18px; }
.access-form label { display: block; font-size: 14px; color: var(--text); }
.access-form input { display: block; width: 100%; margin-top: 8px; padding: 12px 14px; min-height: 48px; background: var(--surface); color: var(--text); border: 1px solid var(--access-line); border-radius: 6px; font: inherit; }
.access-form input::placeholder { color: var(--access-muted); opacity: 1; }
.access-shell a:not(.access-button):not(.access-brand) { color: var(--text); text-decoration: underline; text-underline-offset: 4px; }
.access-shell :is(a, button, input):focus-visible, .access-shell [tabindex="-1"]:focus { outline: 2px solid var(--amber); outline-offset: 5px; }
.access-shell .access-button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 20px; border-radius: 6px; border: 1px solid var(--access-line); color: var(--text); background: transparent; font: 500 16px/1.4 var(--font-ui); cursor: pointer; text-decoration: none; text-align: center; }
.access-shell .access-button-primary { background: var(--text); color: var(--bg); border-color: var(--text); }
.access-shell .access-button:hover { filter: brightness(.92); }
.access-shell .access-button:active { transform: translateY(1px); }
.access-shell .access-button:disabled { opacity: .65; cursor: wait; }
.access-shell .access-feedback { margin-top: 20px; padding: 16px 0 16px 18px; border-left: 3px solid var(--amber); color: var(--text); }
.access-feedback strong { display: block; font-weight: 500; }
.access-shell .access-links { display: flex; flex-wrap: wrap; gap: 16px 28px; margin-top: 32px; font-size: 14px; }
.access-shell .access-detail { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--access-line); color: var(--access-muted); font-size: 14px; }
.access-shell .access-identity { margin-top: 24px; color: var(--access-muted); font-size: 14px; overflow-wrap: anywhere; }
.access-identity strong { display: block; font-weight: 500; color: var(--text); font-size: 16px; }
.access-compact .access-inner { max-width: 480px; }
.access-compact .access-content { margin: 64px 0 32px; }
.access-compact h1 { font-size: clamp(32px, 4vw, 40px); }
.access-compact .access-form { margin-top: 32px; }
.access-compact .access-provider { margin-top: 32px; width: 100%; }
.access-shell .access-separator { display: flex; align-items: center; gap: 16px; color: var(--access-muted); font-size: 14px; margin: 24px 0 -8px; }
.access-separator::before, .access-separator::after { content: ''; height: 1px; background: var(--access-line); flex: 1; }
.access-shell pre { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13px; }
@media (max-width: 800px) {
  .access-shell { padding: 32px 24px; }
  .access-grid { grid-template-columns: minmax(0, 1fr); gap: 40px; margin: 48px 0; }
  .access-inner { max-width: 560px; }
  .access-form-section { padding-top: 28px; border-top: 1px solid var(--access-line); }
  .access-compact .access-content { margin-top: 48px; }
}
