@font-face { font-family: Inter; font-style: normal; font-weight: 100 900; font-display: swap; src: url('./assets/inter-latin-wght-normal.woff2') format('woff2'); }
:root {
  color-scheme: light;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --forest: #245c52; --forest-deep: #173f38; --forest-soft: #dceae6;
  --ivory: #faf9f6; --white: #fff; --graphite: #1e2c29; --muted: #61706c;
  --line: #d9e0dd; --danger: #a33d36; --warning: #9d6412;
  font-synthesis: none; -webkit-text-size-adjust: 100%; text-size-adjust: 100%;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--ivory); color: var(--graphite); font-size: 1rem; line-height: 1.5; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
a { color: var(--forest-deep); text-underline-offset: 3px; }
button:focus-visible, input:focus-visible, a:focus-visible, [tabindex='-1']:focus { outline: 3px solid var(--forest-deep); outline-offset: 4px; }
.access-shell { width: min(100%, 536px); margin-inline: auto; padding: max(24px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left)); }
.access-header { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 40px; }
.access-logo { display: block; width: 68px; height: 72px; }
.access-language { display: inline-flex; align-items: center; justify-content: center; min-width: 48px; min-height: 48px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--white); font-size: .875rem; font-weight: 750; text-decoration: none; }
.access-kicker { margin: 0 0 8px; color: var(--forest); font-weight: 700; font-size: .875rem; }
h1 { margin: 0 0 16px; font-size: clamp(1.5rem, 5vw, 2rem); line-height: 1.15; letter-spacing: -.035em; color: var(--forest-deep); overflow-wrap: anywhere; hyphens: auto; }
p { margin: 0 0 16px; }
.access-intro { max-width: 40ch; }
.access-form { margin-top: 28px; }
.access-label { display: block; font-weight: 700; margin-bottom: 8px; }
.password-row { display: flex; flex-wrap: wrap; align-items: stretch; gap: 8px; }
.password-input { flex: 1 1 190px; min-width: 0; width: 100%; min-height: 52px; border: 1.5px solid var(--muted); border-radius: 12px; padding: 12px; background: var(--white); color: var(--graphite); font-size: 1rem; scroll-margin-block: 20px; }
.password-input[aria-invalid='true'] { border-color: var(--danger); }
.password-input[readonly] { background: #f1f4f2; }
.password-visibility { flex: 0 0 auto; min-height: 48px; min-width: 88px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; color: var(--forest-deep); background: var(--white); font-size: .875rem; font-weight: 700; }
.password-hint { color: var(--muted); font-size: .875rem; margin: 10px 0 20px; }
.access-submit { display: flex; align-items: center; justify-content: center; gap: 12px; width: 100%; min-height: 52px; padding: 10px 18px; border: 1px solid var(--forest); border-radius: 15px; background: var(--forest); color: var(--ivory); font-weight: 800; box-shadow: 0 8px 20px rgb(36 92 82 / 18%); }
.access-submit:hover:not(:disabled) { background: var(--forest-deep); }
.access-submit:disabled { cursor: default; background: var(--forest-deep); box-shadow: none; }
.forward-triangle { flex: 0 0 auto; width: 0; height: 0; border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-left: 13px solid var(--white); }
.access-message { padding: 12px 14px; border-inline-start: 3px solid var(--forest); border-radius: 8px; background: var(--forest-soft); margin-bottom: 20px; overflow-wrap: anywhere; hyphens: auto; scroll-margin-block: 8px; }
.access-message p { margin: 0; }
.access-message[data-tone='error'] { border-color: var(--danger); color: var(--danger); background: #fbefed; }
.access-message[data-tone='waiting'] { color: var(--graphite); border-color: var(--warning); background: #fff4d8; }
.access-message strong { display: block; margin-bottom: 4px; font-weight: 700; }
.access-footer { margin-top: 36px; padding-top: 16px; border-top: 1px solid var(--line); }
.access-links { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.access-links a { display: inline-flex; min-height: 44px; align-items: center; font-size: .875rem; padding-block: 8px; }
.access-information-note { margin-top: 8px; color: var(--muted); font-size: .875rem; }
.access-reload { margin-top: 12px; }
.access-reload a { display: inline-flex; align-items: center; min-height: 44px; }
.preview-label { padding: 8px 16px; margin: 0; background: #e9eeeb; color: var(--graphite); font-size: .75rem; text-align: center; }
.preview-controls { margin: 24px auto; padding: 16px; max-width: 536px; border-top: 1px dashed var(--muted); }
.preview-controls a { display: inline-block; min-height: 44px; padding: 8px; }
[hidden] { display: none !important; }
@media (min-width: 640px) and (min-height: 700px) { .access-shell { padding-top: 64px; } }
@media (max-width: 360px) { .access-shell { padding-inline: 20px; } .password-input { flex-basis: 160px; } .password-visibility { min-width: 80px; padding-inline: 8px; } }
@media (max-height: 520px) { .access-header { margin-bottom: 24px; } .access-shell { padding-top: 16px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; } }
