/* Gemeinsame Gestaltung für Warteliste und Ticket (keine externen Schriften – DSGVO) */
:root {
  --spruce: #3a6596; --moss: #3f72ab; --fog: #edf3fa; --paper: #ffffff; --ink: #1c2a3a;
  --muted: #56657a; --line: #cbd8e8; --warn-bg: #fff3d6; --warn-ink: #5c3d00; --alarm: #9b1c1c; --focus: #0b6bcb;
  color-scheme: light dark; box-sizing: border-box;
  padding-top: env(safe-area-inset-top, 0px); padding-bottom: env(safe-area-inset-bottom, 0px);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --fog: #1c2430; --paper: #12171f; --ink: #edf3fa; --muted: #b3bfcc; --line: #3a4656; --warn-bg: #3a2e12; --warn-ink: #ffe3a3; --alarm: #ffb4b4; --focus: #7cc0ff; }
}
*, *::before, *::after { box-sizing: inherit; }
html, body { margin: 0; }
body { background: var(--paper); color: var(--ink); font: 20px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; }
.bar { background: var(--spruce); color: #fff; padding: 18px 22px 16px; }
.bar b { display: block; font-size: 1.05rem; }
.bar span { font-size: .85rem; opacity: .85; }
main { max-width: 30rem; margin: 0 auto; padding: 26px 22px 40px; }
h1 { font-size: 1.7rem; line-height: 1.2; margin: 0 0 10px; letter-spacing: -.01em; }
p { margin: 0 0 16px; }
.lead { color: var(--muted); }
label, legend { display: block; font-weight: 650; margin: 0 0 6px; padding: 0; }
fieldset { border: 0; margin: 0 0 22px; padding: 0; }
.field { margin-bottom: 20px; }
.opt { font-weight: 400; color: var(--muted); }
input { width: 100%; font: inherit; font-size: 1.15rem; padding: 13px 14px; border: 2px solid var(--line); border-radius: 10px; background: var(--paper); color: var(--ink); }
input:focus-visible, button:focus-visible, a:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.dob { display: grid; grid-template-columns: 1fr 1fr 1.6fr; gap: 10px; }
.dob small, .hint { display: block; font-size: .8rem; color: var(--muted); margin-top: 4px; }
button.primary { width: 100%; font: inherit; font-weight: 700; font-size: 1.15rem; padding: 17px; border: 0; border-radius: 10px; background: var(--moss); color: #fff; cursor: pointer; }
button.primary[disabled] { opacity: .6; cursor: wait; }
button.quiet { width: 100%; font: inherit; font-size: 1rem; padding: 14px; border: 2px solid var(--line); border-radius: 10px; background: transparent; color: var(--ink); cursor: pointer; }
.notice { background: var(--warn-bg); color: var(--warn-ink); padding: 14px 16px; border-radius: 10px; margin: 0 0 20px; }
.notice:empty { display: none; }
.emergency { border-left: 4px solid var(--alarm); padding: 4px 0 4px 14px; font-size: .9rem; color: var(--muted); margin: 28px 0 0; }
.emergency b { color: var(--alarm); }
[hidden] { display: none !important; }
