/* Audien Hearing brand reference: audienhearing.com, reviewed October 27, 2026.
   Fonts and logo are served locally; the app makes no external asset requests. */
@font-face{font-family:ElzaText;src:url('/assets/elza-text-regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:ElzaText;src:url('/assets/elza-text-medium.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:ElzaText;src:url('/assets/elza-text-semibold.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:ElzaText;src:url('/assets/elza-text-bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
:root{--brand-ink:#2e3f56;--brand-steel:#536277;--brand-yellow:#fad000;--brand-yellow-hover:#e6bf00;--brand-blue-tint:#e7eefa;--brand-cream:#fffadd;--brand-surface:#fff;--brand-page:#f7f7f7;--brand-border:#dee1e6;--brand-muted:#626b77;--brand-success:#2f8534;--brand-error:#a3311d;--brand-focus:#2e3f56;--viz-muted:var(--brand-muted);font-family:ElzaText,Arial,sans-serif;font-size:14px;color:var(--brand-ink);background:var(--brand-page)}
body{color:var(--brand-ink);background:var(--brand-page);-webkit-font-smoothing:antialiased}
button,input,select,textarea{font-family:ElzaText,Arial,sans-serif}
h1,h2,h3,h4{color:var(--brand-ink);font-weight:500;letter-spacing:-.025em}
strong,b{font-weight:600}
header{background:var(--brand-surface);color:var(--brand-ink);border-bottom:1px solid var(--brand-border)}
.brand{gap:14px}.brand-logo{display:block;width:122px;height:37px;object-fit:contain}.brandlight{font-size:13px;opacity:1;color:var(--brand-steel);border-left:1px solid var(--brand-border);padding-left:14px}
.who,.who a{color:var(--brand-steel)}.who .ghost{font-size:12px;min-height:32px;padding:5px 12px}
.pill{background:var(--brand-cream);color:var(--brand-ink);border:1px solid #e7da96;font-weight:500}
a,.catalog-info a{color:var(--brand-ink);text-underline-offset:3px}
a:hover{color:var(--brand-steel)}
.workspace-nav{border-color:var(--brand-border)}
.nav-button{color:var(--brand-steel);font-weight:500;border-radius:100px}
.nav-button:hover{background:#eeeff1;color:var(--brand-ink)}
.nav-button.active{background:var(--brand-ink);color:white}
.panel,.summary,.single-appointment .calendar-panel{background:var(--brand-surface);border-color:var(--brand-border);border-radius:16px;box-shadow:0 2px 6px #2e3f5604}
.single-appointment .summary{border-radius:0;box-shadow:none;border-color:var(--brand-border)}
label,legend{color:var(--brand-ink);font-weight:500}
input,select,textarea{background:var(--brand-surface);color:var(--brand-ink);border-color:#c9cfd7;border-radius:8px;font-weight:400}
input,select{font-size:14px}
input::placeholder,textarea::placeholder{color:#717986;opacity:1}
input:focus,select:focus,textarea:focus{border-color:var(--brand-ink);box-shadow:0 0 0 3px #fad00040;outline:none}
button:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid var(--brand-focus);outline-offset:3px;box-shadow:0 0 0 5px #fad00080}
.primary{background:var(--brand-yellow);color:var(--brand-ink);border:1px solid var(--brand-yellow);border-radius:100px;font-weight:500;letter-spacing:.01em}
.primary:hover{background:var(--brand-yellow-hover);border-color:var(--brand-yellow-hover);color:var(--brand-ink)}
.primary:disabled{background:#e6e6e6;border-color:#e6e6e6;color:#6b7280}
.ghost,.monthbar button{background:white;color:var(--brand-ink);border-color:#b9c1cc;border-radius:100px;font-weight:400}
.ghost:hover,.monthbar button:hover{background:var(--brand-blue-tint);border-color:var(--brand-steel)}
.round{background:var(--brand-blue-tint);color:var(--brand-steel);border-color:#d9e1ed}.round strong{color:var(--brand-ink)}
.notice,.customer-timezone{background:var(--brand-blue-tint);color:var(--brand-ink);border-left-color:var(--brand-ink);border-radius:8px}
.customer-timezone span,.heading p,.toolbar p,.footer p,.muted,.calendar-help,.catalog-info,.shared-customer-note,.availability-status,.slot-meta,.selection span{color:var(--brand-muted)}
.calendar{border-color:var(--brand-border);border-radius:12px;background:white}
.calTop{background:#f5f6f8;border-color:var(--brand-border)}.calTop span{color:var(--brand-muted)}
.dow{color:var(--brand-steel);font-weight:500}.day{color:var(--brand-ink);border-radius:7px}
.day.available{background:var(--brand-blue-tint);color:var(--brand-ink)}
.day:not(:disabled):hover{background:var(--brand-cream);color:var(--brand-ink)}
.day.selected{background:var(--brand-ink)!important;color:white!important}
.day.available:hover{border-color:var(--brand-steel)}
.slots{border-color:var(--brand-border)}
.slot{background:white;color:var(--brand-ink);border-color:#c9cfd7;border-radius:100px;font-weight:400}
.slot:hover{background:var(--brand-cream);border-color:var(--brand-ink)}
.slot.selected{background:var(--brand-ink);color:white;border-color:var(--brand-ink);font-weight:500}
.refresh{background:var(--brand-blue-tint);color:var(--brand-ink);border-radius:100px}
.empty{color:var(--brand-muted)}
.selection{border-color:var(--brand-border);border-radius:10px}.summaryHead strong{color:var(--brand-ink)}
progress{background:var(--brand-blue-tint);accent-color:var(--brand-yellow)}
progress::-webkit-progress-bar{background:var(--brand-blue-tint)}progress::-webkit-progress-value{background:var(--brand-yellow)}progress::-moz-progress-bar{background:var(--brand-yellow)}
.existing{background:#f5f6f8}.existing p{color:var(--brand-muted)}
fieldset{border-color:var(--brand-border);border-radius:10px}
.tracking-preview{border-color:var(--brand-border)}
.tracking-values dt{color:var(--brand-muted)}.tracking-values dd{color:var(--brand-ink)}
.profile-card{border-color:var(--brand-border);border-radius:12px}
.users-table th{background:#f5f6f8;color:var(--brand-steel);border-color:var(--brand-border)}
.users-table td{border-color:#e9ebee}.users-table td small,.small-badge,.users-table ul{color:var(--brand-muted)}
.users-table summary{color:var(--brand-ink)}
.users-table input[type=checkbox],.event-choice input[type=checkbox],.choice-check input{accent-color:var(--brand-ink)}
.role-badge{background:#eeeff1;color:var(--brand-steel)}.role-badge.admin{background:var(--brand-blue-tint);color:var(--brand-ink)}
.user-status{color:var(--brand-success)}.disabled-status{color:var(--brand-error)}
.event-choice{border-color:#e9ebee}.event-choice strong{color:var(--brand-ink)}.event-choice small{color:var(--brand-muted)}
.event-choices h3{background:var(--brand-blue-tint);color:var(--brand-ink)}
.settings-activity{color:var(--brand-steel)}
.utm-reference h3,.utm-rules-table tbody th{color:var(--brand-ink)}
.utm-rules-table th,.utm-rules-table td{border-color:var(--brand-border)}.utm-rules-table thead th{background:var(--brand-blue-tint);color:var(--brand-ink)}
.rule-note{color:#725200}
pre,#reviewList{background:#f5f6f8;color:var(--brand-ink);border-radius:10px}
dialog{background:white;color:var(--brand-ink);border-color:var(--brand-border);border-radius:20px;box-shadow:0 18px 70px #2e3f5630}
dialog::backdrop{background:#2e3f5675}.dialogbody>p{color:var(--brand-steel)}
.warning{background:var(--brand-cream);color:#725200!important;border-radius:8px}
.message{background:#edf6ed;color:#245c29;border-color:#bbd8bd}
.message.error{background:#fff0eb;color:var(--brand-error);border-color:#ecc5b9}
.slot-error,#reviewError{color:var(--brand-error)}
.result-card{background:#f3f8f2;border-color:#c9ddc7;border-radius:12px}.result-card.failed{background:#fff3ed;border-color:#e8c6bb}
@media(max-width:640px){.brand-logo{width:112px;height:34px}.brand{gap:10px}.who{gap:8px}.who .pill{font-size:10px}}

/* Stronger Audien expression: midnight-blue frames and unmistakable yellow accents. */
:root{--brand-page:#edf1f7}
header{background:linear-gradient(100deg,#2e3f56 0%,#3c587a 100%);color:white;border-bottom:3px solid var(--brand-yellow)}
header .brand-logo{filter:brightness(0) invert(1)}
header .brandlight{color:#e7eefa;border-left-color:#ffffff40}
header .who,header .who a{color:#e7eefa}
header .pill{background:var(--brand-yellow);color:var(--brand-ink);border-color:var(--brand-yellow)}
header .ghost{background:transparent;color:white;border-color:#ffffff70}
header .ghost:hover{background:#ffffff18;color:white;border-color:white}
.workspace-nav{background:var(--brand-ink);border:0;border-radius:12px;padding:4px 6px}
.workspace-nav .nav-button{color:#e7eefa}
.workspace-nav .nav-button:hover{background:#ffffff15;color:white}
.workspace-nav .nav-button.active{background:var(--brand-yellow);color:var(--brand-ink)}
.panel,.summary,.single-appointment .calendar-panel{border-color:#cdd7e5;box-shadow:0 4px 18px #2e3f5609}
#customerForm{border-top:3px solid var(--brand-ink)}
.single-appointment .calendar-panel{border-top:3px solid var(--brand-yellow)}
#disclaimer{background:var(--brand-cream);border-left-color:var(--brand-yellow);color:var(--brand-ink)}
#eventFields{background:#f7f9fd;border-color:#cdd7e5}
#eventFields>legend{background:var(--brand-ink);color:white;border-radius:6px;padding:4px 9px;font-size:11px;letter-spacing:.015em}
.appointment-info>summary{color:var(--brand-ink)}
.customer-timezone{background:var(--brand-ink);border-left-color:var(--brand-yellow);color:white}
.customer-timezone strong{color:var(--brand-yellow)}
.customer-timezone span{color:#e7eefa}
.calTop{background:var(--brand-ink);color:white;border-bottom:3px solid var(--brand-yellow)}
.calTop strong{color:white}.calTop span{color:#e7eefa}
.calTop .ghost{background:transparent;border-color:#ffffff60;color:white}
.calTop .ghost:hover{background:#ffffff18}
.day.selected{background:var(--brand-yellow)!important;color:var(--brand-ink)!important;font-weight:600}
.slot.selected{background:var(--brand-yellow);color:var(--brand-ink);border-color:#d0af00;font-weight:500}
.slot:not(:disabled):hover{border-color:var(--brand-ink);background:var(--brand-cream)}
.slot.selected:not(:disabled):hover{background:var(--brand-yellow-hover)}
.refresh{background:var(--brand-blue-tint);color:var(--brand-ink);border:1px solid #cad6e9}
.refresh:hover{background:#dbe5f5}
.summary{border-top:3px solid var(--brand-ink)}
.single-appointment .summary{border-top:2px solid var(--brand-ink);box-shadow:none}
.summaryHead>strong{background:var(--brand-ink);color:var(--brand-yellow);padding:4px 10px;border-radius:100px;font-weight:500;white-space:nowrap}
.primary{box-shadow:0 2px 0 #c3a400}
.primary:hover{box-shadow:0 2px 0 #a78c00}
.primary:disabled{box-shadow:none}
.settings-tabs .nav-button.active{background:var(--brand-yellow);color:var(--brand-ink)}
.users-table th,.utm-rules-table thead th{background:var(--brand-ink);color:white;border-color:#536277}
.users-table th:first-child,.utm-rules-table thead th:first-child{border-radius:8px 0 0 0}
.users-table th:last-child,.utm-rules-table thead th:last-child{border-radius:0 8px 0 0}
.role-badge.admin{background:var(--brand-yellow);color:var(--brand-ink)}
.event-choices h3{background:var(--brand-ink);color:white;border-left:4px solid var(--brand-yellow)}
.profile-card{border-left:4px solid var(--brand-yellow);background:linear-gradient(135deg,#fff 65%,#fffadd 100%)}
.utm-reference h3{border-bottom:2px solid var(--brand-yellow);padding-bottom:8px}
.dialogbody>h2:first-child{background:var(--brand-ink);color:white;border-bottom:3px solid var(--brand-yellow);margin:-25px -25px 18px;padding:18px 25px;border-radius:19px 19px 0 0}
#resultsTitle{color:var(--brand-ink);border-left:5px solid var(--brand-yellow);padding-left:12px}
#signin{border-top:4px solid var(--brand-yellow)}
/* Keep calendar headers aligned when an appointment has a selected time. */
#calendarPanel .calTop{position:relative;padding-right:48px}
#calendarPanel .calTop .ghost{position:absolute;top:12px;right:12px;width:32px;height:32px;min-height:32px;padding:0;font-size:0;border-radius:50%}
#calendarPanel .calTop .ghost::before{content:'×';font-size:20px;line-height:1}
#calendarPanel .calTop .ghost:focus-visible,header .ghost:focus-visible{outline-color:var(--brand-yellow);box-shadow:none}