body { margin: 0; font-family: system-ui, sans-serif; color: #18323b; background: #f6f8fa; }
main { max-width: 70rem; margin: 3rem auto; padding: 1.5rem; }

.account-card { max-width: 38rem; margin: 0 auto; }
.account-card form label { display: block; margin: 1rem 0; font-weight: 600; }
.account-card form input:not([type=hidden]) { display: block; width: 100%; padding: .85rem; border: 1px solid #84959b; border-radius: .3rem; font: inherit; box-sizing: border-box; margin-top: .4rem; }
.account-card form input:focus { outline: 3px solid #1a758f; outline-offset: 2px; }
a { color: #12546a; }
@media(max-width:600px) { main { margin: 1rem auto; padding: .5rem; } }

.schedule-nav, .schedule-actions, .schedule-times { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0; }
.schedule-days, .schedule-slots { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); gap: 1rem; }
.schedule-day, .schedule-slot { min-width: 0; }
.schedule-day small { font-size: .8rem; font-weight: normal; }
.schedule-preview-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.schedule-exception { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; overflow-wrap: anywhere; }
.duration-field { max-width: 24rem; }
.opening-hours-status { position: sticky; top: .5rem; z-index: 4; }
.schedule-nav a, .schedule-actions button, .schedule-times button, .schedule-day button, .schedule-slot button { min-height: 44px; }
@media(max-width:600px) { .schedule-preview-controls > * { width: 100%; } .schedule-actions > button { flex-grow: 1; } .schedule-nav { gap: .2rem; } }
.public-booking { max-width: 48rem; margin: 1.5rem auto; padding: 1rem; font-family: system-ui,sans-serif; line-height: 1.6; }
.public-booking h1 { line-height: 1.2; }
.public-booking form { display: grid; gap: .6rem; max-width: 32rem; }
.public-booking input, .public-booking button { font: inherit; padding: .75rem; max-width: 100%; box-sizing: border-box; }
.public-booking button { background: #173c50; color: white; border-radius: .4rem; cursor: pointer; }
.public-booking .appointment-list { display: grid; grid-template-columns: repeat(auto-fit,minmax(15rem,1fr)); gap: .75rem; padding: 0; list-style: none; }
.public-booking .appointment-list a { display: block; border: 1px solid #aaa; padding: .75rem; border-radius: .4rem; }
.booking-honeypot { position: absolute; left: -10000px; }
.booking-toolbar { display:flex; flex-wrap:wrap; gap:.75rem; align-items:center; margin:1rem 0; }
.booking-agenda { display:grid; gap:1rem; }
.booking-week { grid-template-columns:repeat(auto-fit,minmax(min(100%,19rem),1fr)); }
.booking-day, .booking-card { min-width:0; overflow-wrap:anywhere; }
.schedule-save-feedback:focus-visible { outline:3px solid #005bc5; outline-offset:3px; border-radius:8px; }
.booking-status { display:inline-block; font-weight:700; border-radius:.25rem; padding:.2rem .5rem; margin:.5rem 0; background:#e4eaf0; }
.status-PendingConfirmation { background:#fff0c2; color:#664b00; }
.status-Confirmed { background:#d9f2e4; color:#155737; }
.status-Completed { background:#dfe9ff; color:#243d76; }
.status-Cancelled,.status-Expired { background:#e7e7e7; color:#505050; }
.booking-toolbar button,.booking-card button,.booking-dialog button { min-height:44px; }
.booking-dialog .mud-dialog-content { overflow-wrap:anywhere; }
.booking-toolbar .mud-input-adornment-icon-button { margin-right:0; }
@media(max-width:600px){.booking-toolbar > * { flex-grow:1; }.mud-dialog.booking-dialog { margin:.5rem; width:calc(100% - 1rem); max-height:calc(100dvh - 1rem); }.booking-toolbar .mud-picker { width:100%; }}

/* Public booking and garage sign-in: local assets only, independent of admin layout. */
.mot-public { background:#f0f5fb; color:#243b57; }
.mot-public *, .garage-login * { box-sizing:border-box; }
.mot-topbar { min-height:78px; background:#fff; border-bottom:1px solid #dce6f2; padding:1rem max(1rem,calc((100% - 1160px)/2)); display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.mot-wordmark { display:inline-flex; gap:.7rem; align-items:center; color:#102c50; text-decoration:none; font-size:1.4rem; font-weight:750; white-space:nowrap; }
.mot-wordmark strong { color:#005bc5; }
.mot-wordmark .mot-icon { width:32px; height:32px; color:#005bc5; }
.mot-topline { font-size:.9rem; color:#526781; }
.mot-public .public-booking { max-width:1200px; padding:1.5rem 1rem; margin:1rem auto; }
.public-surface { border:1px solid #dce6f2; background:#fff; padding:clamp(1.2rem,4vw,3rem); border-radius:18px; box-shadow:0 10px 35px #133e7010; overflow-wrap:anywhere; }
.public-surface:not(.public-landing) { max-width:720px; margin:0 auto; }
.public-surface.public-landing { border:0; background:transparent; box-shadow:none; padding:0; }
.public-booking h1,.public-booking h2,.public-booking h3,.garage-login h1,.garage-login h2 { color:#0b2548; letter-spacing:-.035em; }
.public-booking h1 { font-size:clamp(2rem,4.5vw,3.4rem); line-height:1.12; margin:.35rem 0 1rem; font-weight:800; }
.public-booking h2 { font-size:1.4rem; line-height:1.3; margin:.5rem 0; }
.mot-eyebrow { color:#0058bc; font-size:.75rem; letter-spacing:.12em; text-transform:uppercase; font-weight:800; margin:0 0 .7rem; }
.mot-lead { font-size:1.1rem; line-height:1.65; color:#4c627e; margin:0 0 1.5rem; }
.booking-layout { display:grid; grid-template-columns:minmax(240px,310px) minmax(0,1fr); gap:2rem; align-items:start; }
.garage-panel { background:linear-gradient(145deg,#fff,#eaf3ff); border:1px solid #d5e3f3; border-top:5px solid #0064d8; border-radius:16px; padding:1.5rem; box-shadow:0 8px 25px #1239640b; min-width:0; }
.garage-panel h2 { font-size:1.7rem; }
.garage-brand-logo { display:block; max-width:100%; width:auto; max-height:140px; object-fit:contain; margin:1.2rem 0; }
.garage-contact { display:flex; align-items:flex-start; gap:.65rem; font-size:.92rem; overflow-wrap:anywhere; }
.mot-icon { width:22px; height:22px; flex:0 0 22px; vertical-align:middle; color:#0061c9; }
.contact-label { display:block; color:#536982; font-size:.75rem; font-weight:700; margin-bottom:.12rem; }
.garage-contact a { color:#0055b5; font-weight:650; }
.garage-hours { border-top:1px solid #ceddee; margin-top:1.5rem; padding-top:1rem; font-size:.86rem; }
.garage-hours summary { cursor:pointer; min-height:44px; align-content:center; font-weight:750; color:#153455; }
.garage-hours .mot-icon { margin-right:.5rem; }
.garage-hours dl { margin:.5rem 0; }
.garage-hours dl div { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.25rem .6rem; margin:.45rem 0; }
.garage-hours dd { margin:0; }.garage-hours dt { font-weight:650; }
.mot-price { display:flex; align-items:center; justify-content:space-between; gap:1rem; border-top:1px solid #ceddee; padding-top:1rem; margin-top:1rem; }
.mot-price strong { font-size:1.75rem; color:#0b2548; }.price-note { font-size:.85rem; color:#4c627e; }
.booking-choices { min-width:0; padding:.75rem 0; }
.booking-steps { list-style:none; display:flex; flex-wrap:wrap; gap:.8rem 1.25rem; padding:0 0 1.5rem; border-bottom:1px solid #d5e0ed; font-size:.82rem; font-weight:650; }
.booking-steps li { display:flex; align-items:center; gap:.45rem; }.booking-steps li span { display:inline-grid; place-items:center; color:#fff; background:#005bc5; border-radius:8px; height:28px; width:28px; }
.availability-heading { margin:1.5rem 0 1rem; }.availability-heading p { color:#536982; margin:.3rem 0; }
.appointment-date { background:#fff; border:1px solid #cddded; border-radius:12px; margin:.75rem 0; overflow:hidden; box-shadow:0 3px 12px #16385606; }
.appointment-date>summary { display:flex; align-items:center; gap:1rem; padding:1rem; cursor:pointer; min-height:72px; list-style:none; color:#153455; }
.appointment-date>summary::-webkit-details-marker { display:none; }
.appointment-date>summary::after { content:'+'; font-size:1.6rem; margin-left:auto; }
.appointment-date[open]>summary { background:#005bc5; color:#fff; }.appointment-date[open]>summary::after { content:'−'; }
.date-badge { display:grid; text-align:center; border-radius:8px; background:#eaf3ff; color:#064d9f; padding:.35rem .7rem; min-width:50px; font-size:.72rem; line-height:1.3; text-transform:uppercase; }.date-badge strong { font-size:1.35rem; }
.date-caption { display:flex; flex-direction:column; font-size:.8rem; }.date-caption strong { font-size:1rem; }
.availability-count { font-size:.75rem; margin-left:auto; }
.public-booking .appointment-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,175px),1fr)); gap:.7rem; padding:1rem; margin:0; list-style:none; }
.appointment-list li { background:#f6f9fd; border:1px solid #dce6f2; border-radius:9px; padding:.9rem; min-width:0; }
.slot-time { display:flex; align-items:center; gap:.5rem; color:#13375c; font-size:1.15rem; font-weight:750; margin-bottom:.8rem; }
.public-booking .mot-button,.mot-button,.public-booking button { display:inline-flex; justify-content:center; align-items:center; gap:.5rem; min-height:46px; padding:.75rem 1rem; border:1px solid #005bc5; border-radius:8px; color:#fff; background:#005bc5; font:inherit; font-weight:750; text-decoration:none; cursor:pointer; line-height:1.3; }
.public-booking .appointment-list a.mot-button { padding:.7rem .5rem; width:100%; font-size:.85rem; border-color:#005bc5; }
.mot-button:hover,.public-booking button:hover { background:#00479b; color:#fff; }
.mot-public a:focus-visible,.mot-public summary:focus-visible,.mot-public input:focus-visible,.mot-public button:focus-visible,.garage-login a:focus-visible,.garage-login button:focus-visible,.garage-login input:focus-visible { outline:3px solid #d38500; outline-offset:3px; }
.public-booking form { max-width:none; margin:1.5rem 0 0; gap:.5rem; }.public-booking label { font-weight:700; margin-top:.6rem; color:#153455; }
.public-booking input:not([type=hidden]) { width:100%; border:1px solid #8fa7c1; border-radius:8px; background:#fff; min-height:48px; color:#102c50; }
.public-booking label.renewal-consent { display:flex; align-items:flex-start; gap:.8rem; padding:1rem; border:1px solid #d4e1ef; border-radius:12px; background:#f5f8fc; font-weight:400; cursor:pointer; }
.public-booking .renewal-consent input[type=checkbox] { flex:0 0 22px; width:22px; height:22px; min-height:22px; padding:0; margin:.15rem 0 0; accent-color:#005bc5; cursor:pointer; }
.renewal-consent-copy { min-width:0; overflow-wrap:anywhere; }
.renewal-consent-copy strong,.renewal-consent-copy > span,.renewal-consent-copy small { display:block; }
.renewal-consent-copy strong { color:#0b2548; line-height:1.4; }
.renewal-consent-copy > span { margin-top:.3rem; font-size:.95rem; }
.renewal-consent-copy small { margin-top:.45rem; font-size:.82rem; color:#526781; }
.public-booking .renewal-consent:focus-within { outline:3px solid #005bc5; outline-offset:3px; }
.public-booking form button { margin-top:.75rem; }
.booking-empty { padding:1rem 1.5rem; border:1px dashed #a9bfd8; background:#fff; border-radius:12px; }.clock-note { font-size:.85rem; color:#536982; }
.mot-footer { text-align:center; font-size:.8rem; color:#536982; padding:1.5rem; }
.visually-hidden,.skip-link:not(:focus) { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link:focus { position:fixed; left:1rem; top:1rem; background:white; color:#0055b5; padding:1rem; z-index:100; }
.garage-login { max-width:1000px; margin:1rem auto; display:grid; grid-template-columns:1fr 1fr; background:white; border:1px solid #dce6f2; border-radius:20px; overflow:hidden; box-shadow:0 15px 45px #0e305b13; }
.login-intro { padding:clamp(1.5rem,4vw,3rem); background:linear-gradient(145deg,#0a2548 5%,#004eab 95%); color:#e0edff; position:relative; overflow:hidden; }
.login-intro::after { content:''; display:block; height:130px; border-top:30px solid #0078eb; border-bottom:14px solid #2293f5; transform:rotate(-35deg); margin:4rem -6rem -4rem; opacity:.6; pointer-events:none; }
.login-intro .mot-wordmark,.login-intro .mot-wordmark strong { color:white; }.login-intro .mot-eyebrow { color:#b6d8ff; margin-top:3rem; }.login-intro h2 { color:#fff; font-size:2.2rem; line-height:1.2; }.login-intro p { line-height:1.7; }
.garage-login .account-card { width:100%; margin:0; border-radius:0; box-shadow:none; padding:clamp(1.5rem,4vw,3rem)!important; min-width:0; }
.garage-login h1 { font-size:2rem; font-weight:800; }.garage-login .mot-lead { font-size:.95rem; margin:1rem 0 1.5rem; }
.garage-login .account-card input { border-color:#a2b5cb; border-radius:8px; color:#102c50; min-height:48px; }.garage-login .account-card label { color:#243b57; font-size:.9rem; }
.garage-login .login-submit { width:100%; margin:.7rem 0; }.garage-login .account-card>p:not(.mot-lead) { font-size:.87rem; line-height:1.6; }.garage-login a:not(.mot-wordmark) { color:#0055b5; text-underline-offset:3px; }
@media(max-width:760px) { .booking-layout { grid-template-columns:minmax(0,1fr); gap:1.5rem; }.garage-panel { padding:1.2rem; }.garage-brand-logo { max-height:90px; }.mot-public .public-booking { margin:.5rem auto; }.garage-login { grid-template-columns:minmax(0,1fr); }.login-intro { padding:1.4rem; }.login-intro .mot-eyebrow { margin-top:1.2rem; }.login-intro h2,.login-intro>p:not(.mot-eyebrow),.login-intro::after { display:none; }.garage-login .account-card { padding:1.5rem!important; } }
@media(max-width:400px) { .mot-topline { display:none; }.mot-topbar { min-height:64px; }.availability-count { display:none; }.appointment-date>summary { gap:.65rem; padding:.8rem; }.public-booking .appointment-list { grid-template-columns:minmax(0,1fr); padding:.75rem; }.booking-steps { gap:.75rem; font-size:.75rem; }.booking-steps li span { width:24px; height:24px; }.public-booking h1 { font-size:2rem; } }
@media(prefers-reduced-motion:reduce) { .mot-public *, .garage-login * { scroll-behavior:auto!important; transition:none!important; } }
.public-booking .appointment-list a.mot-button { display:flex; }

/* Garage administration: shared MVP palette without changing MudBlazor behaviour. */
.garage-admin { color:#243b57; margin:-1rem 0 1rem; overflow-wrap:anywhere; }
.garage-admin-header { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:1rem; padding:1.25rem 1.5rem; background:#fff; border:1px solid #dce6f2; border-radius:16px 16px 0 0; }
.admin-header-label { color:#526781; font-size:.8rem; letter-spacing:.06em; text-transform:uppercase; font-weight:750; }
.garage-admin-nav { display:flex; flex-wrap:wrap; gap:.5rem; padding:.8rem 1rem; background:#eaf2fc; border:1px solid #d5e2f2; border-top:0; border-radius:0 0 16px 16px; margin-bottom:2rem; }
.garage-admin-nav a,.admin-schedule-nav a { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; min-height:46px; padding:.65rem 1rem; border-radius:8px; color:#254767; font-size:.9rem; font-weight:700; text-decoration:none; border:1px solid transparent; }
.garage-admin-nav a.active { color:#fff; background:#005bc5; box-shadow:0 3px 8px #005bc525; }.garage-admin-nav a:not(.active):hover { background:white; border-color:#bdcee2; }
.garage-admin-nav .mud-icon-root { width:21px; height:21px; }
.garage-admin-content { min-width:0; }.garage-admin h1 { font-size:clamp(1.8rem,3vw,2.5rem); color:#0b2548; font-weight:800; letter-spacing:-.035em; margin-bottom:1rem; }
.garage-admin h2,.garage-admin h3,.garage-admin .mud-typography-h5,.garage-admin .mud-typography-h6 { color:#0b2548; font-weight:750; }
.garage-admin .mud-paper { border:1px solid #dce6f2; border-radius:14px; box-shadow:0 5px 22px #133e7009; }
.garage-admin .mud-input-label { color:#435f7d; }.garage-admin .mud-input { color:#183654; }.garage-admin .mud-input-control { margin-top:.65rem; margin-bottom:.55rem; }
.garage-admin .mud-input-underline:before { border-bottom-color:#9dafc4; }
.garage-admin .mud-button-filled-primary,.booking-dialog .mud-button-filled-primary { background:#005bc5; color:white; }
.garage-admin .mud-button-filled-primary:hover,.booking-dialog .mud-button-filled-primary:hover { background:#00479b; }
.garage-admin .mud-button-outlined-primary,.garage-admin .mud-button-text-primary,.booking-dialog .mud-button-text-primary { color:#0055b5; border-color:#8fb4df; }
.garage-admin .mud-primary-text { color:#0055b5!important; }
.garage-admin .mud-button-root { min-height:44px; border-radius:8px; text-transform:none; font-weight:700; }
.garage-admin a:focus-visible,.garage-admin button:focus-visible,.garage-admin input:focus-visible,.garage-admin select:focus-visible { outline:3px solid #d38500; outline-offset:3px; }
.garage-welcome { background:linear-gradient(120deg,#fff 60%,#edf5ff); border-top:4px solid #005bc5!important; }
.garage-summary-header { display:flex; align-items:center; justify-content:space-between; gap:1.25rem; }
.garage-summary-header .garage-welcome-brand { flex:1 1 auto; min-width:0; }
.garage-summary-header .garage-welcome-brand>div { min-width:0; overflow-wrap:anywhere; }
.garage-subscription-action { flex:0 1 18rem; text-align:center; box-sizing:border-box; }
@media(max-width:767px) { .garage-summary-header { flex-direction:column; align-items:stretch; }.garage-subscription-action { flex:0 0 auto; width:100%; } }
.garage-welcome-brand { display:flex; flex-wrap:wrap; align-items:center; gap:1.25rem; }.admin-garage-logo { max-width:200px; max-height:100px; object-fit:contain; }
.garage-brand-symbol { display:grid; place-items:center; width:70px; height:70px; color:#005bc5; background:#e7f1ff; border-radius:16px; }
.garage-admin .admin-eyebrow { color:#0055b5; text-transform:uppercase; letter-spacing:.12em; font-size:.72rem; font-weight:800; margin-bottom:.35rem; }
.garage-shortcuts { display:flex; flex-wrap:wrap; gap:.75rem; margin:1.5rem 0; }.garage-admin .admin-booking-address { font-size:.85rem; color:#526781; }
.garage-details-section { scroll-margin-top:1rem; }.garage-details-section .mud-paper { padding:clamp(1rem,3vw,2rem)!important; }
.admin-schedule-nav { background:#fff; border:1px solid #dce6f2; border-radius:12px; padding:.5rem; gap:.25rem; }
.admin-schedule-nav a { font-size:.85rem; padding:.6rem .85rem; }.admin-schedule-nav a.active { color:#0055b5; background:#e5f0ff; border-color:#9abce5; box-shadow:inset 0 -3px #005bc5; }
.garage-admin .booking-toolbar { background:#fff; padding:1rem; border:1px solid #dce6f2; border-radius:12px; }
.garage-admin .booking-toolbar h1 { margin:0 auto 0 0; }.garage-admin .booking-day { padding:1rem; background:#edf3fa; border:1px solid #dce6f2; border-radius:14px; }
.garage-admin .booking-day>h2 { border-bottom:1px solid #ccdaea; padding-bottom:.75rem; }
.garage-admin .booking-card { border-left:4px solid #005bc5; }.garage-admin .booking-card .mud-typography-h6 { font-size:1.2rem; letter-spacing:.04em; }
.garage-admin .booking-status { border:1px solid #b9cadb; font-size:.8rem; padding:.3rem .6rem; border-radius:6px; }
.garage-admin .status-Confirmed { color:#155737; background:#e3f5eb; border-color:#a8d7bd; }.garage-admin .status-PendingConfirmation { color:#664b00; background:#fff3cb; border-color:#dfc67c; }
.garage-admin .status-Completed { color:#243d76; background:#e3edff; border-color:#b6c8ed; }.garage-admin .status-Cancelled,.garage-admin .status-Expired { color:#505050; background:#eee; border-color:#c8c8c8; }
.garage-admin .schedule-day { border-top:3px solid #b8d6f8; }.garage-admin .schedule-times { align-items:center; }.garage-admin .schedule-times .mud-chip { margin:0; }
.garage-admin .schedule-slot { background:#fff; }.garage-admin .schedule-preview-controls { background:#fff; border:1px solid #dce6f2; padding:1rem; border-radius:12px; margin:1rem 0; }
.garage-admin .schedule-exception { padding:1rem; border:1px solid #dce6f2; border-radius:10px; background:#fff; }
.booking-dialog.mud-dialog { border-radius:16px; }.booking-dialog .mud-dialog-title { color:#0b2548; background:#edf4fd; }.booking-dialog .mud-dialog-content { padding-top:1rem; }.booking-dialog .mud-button-root { min-height:44px; text-transform:none; border-radius:8px; }
@media(max-width:760px) { .garage-admin-nav { gap:.35rem; padding:.6rem; margin-bottom:1.5rem; }.garage-admin-nav a { flex:1 1 auto; padding:.6rem .65rem; font-size:.8rem; }.admin-schedule-nav a { flex:1 1 auto; }.garage-shortcuts .mud-button-root { flex:1 1 45%; }.garage-admin .booking-week { grid-template-columns:minmax(0,1fr); } }
@media(max-width:400px) { .garage-admin-header { padding:1rem; }.admin-header-label { font-size:.68rem; }.garage-admin-nav a { flex-basis:100%; justify-content:flex-start; }.garage-shortcuts .mud-button-root { flex-basis:100%; }.garage-welcome { padding:1rem!important; }.garage-admin .booking-toolbar { padding:.75rem; }.garage-admin .booking-card,.garage-admin .booking-day { padding:.8rem!important; }.garage-admin .schedule-actions>* { flex:1 1 100%; }.garage-admin .mud-input-control { max-width:100%; }.admin-garage-logo { max-width:100%; } }
.garage-admin,.booking-dialog { --mud-palette-primary:#005bc5; --mud-palette-primary-rgb:0,91,197; --mud-palette-primary-darken:#00479b; }
.garage-admin .mud-input-root:focus-visible,.booking-dialog .mud-input-root:focus-visible { outline:3px solid #d38500!important; outline-offset:3px; border-radius:4px; }
.garage-login .account-card .keep-signed-in { display:flex; align-items:center; gap:.65rem; min-height:44px; }
.garage-login .account-card .keep-signed-in input { width:20px; height:20px; min-height:20px; margin:0; accent-color:#005bc5; }
.garage-login .login-device-note { font-size:.8rem; color:#526781; margin:.25rem 0 .75rem; }

/* Keep the selected administrator context visible while editing long garage forms. */
.garage-management-banner { position: sticky; top: 0; z-index: 1100; }

/* Shared static account journeys: verification, recovery, password setup and sign out. */
.mot-account { border:1px solid #dce6f2; border-top:5px solid #0064d8; border-radius:18px!important; box-shadow:0 10px 35px #133e7010!important; background:#fff; color:#243b57; min-width:0; overflow-wrap:anywhere; }
.mot-account .account-brand { margin-bottom:1.6rem; }
.mot-account .account-brand svg { color:#005bc5; }
.mot-account h1 { color:#0b2548; font-size:clamp(1.7rem,5vw,2.3rem); line-height:1.18; letter-spacing:-.03em; margin-bottom:1.2rem; }
.mot-account p { line-height:1.65; margin-bottom:1.1rem; }
.mot-account a:not(.mot-button):not(.mot-wordmark) { color:#0055b5; text-underline-offset:3px; }
.mot-account form input:not([type=hidden]) { border-color:#a2b5cb; border-radius:8px; min-height:48px; color:#102c50; background:#fff; }
.mot-account .account-primary { width:100%; box-sizing:border-box; margin:.6rem 0; min-height:48px; text-align:center; }
.account-actions { display:flex; flex-direction:column; gap:.6rem; margin:1.4rem 0; }
.account-secondary { display:inline-flex; justify-content:center; align-items:center; min-height:44px; padding:.4rem; font-weight:650; }
.account-help { font-size:.92rem; margin-top:1.2rem; }
.mot-account a:focus-visible,.mot-account button:focus-visible,.mot-account input:focus-visible { outline:3px solid #005bc5; outline-offset:3px; }
@media(max-width:390px) { .mot-account { padding:1.2rem!important; }.mot-account .mot-wordmark { font-size:1.3rem; }.mot-account .account-primary { white-space:normal; } }
h1[tabindex="-1"]:focus {
    outline: none;
}.garage-logo-preview { display:block; max-width:100%; max-height:180px; object-fit:contain; border:1px solid #a2b5cb; border-radius:8px; padding:.5rem; box-sizing:border-box; background-color:#fff; background-image:linear-gradient(45deg,#e5ebf2 25%,transparent 25%),linear-gradient(-45deg,#e5ebf2 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e5ebf2 75%),linear-gradient(-45deg,transparent 75%,#e5ebf2 75%); background-size:16px 16px; background-position:0 0,0 8px,8px -8px,-8px 0; }

/* Override full-width account text-input styling for native billing consent. */
.account-card form .billing-consent { display:flex; align-items:flex-start; gap:.75rem; text-align:left; font-weight:400; line-height:1.6; cursor:pointer; }
.account-card form .billing-consent input[type=checkbox] { flex:0 0 22px; width:22px; height:22px; min-height:22px; padding:0; margin:.15rem 0 0; accent-color:#005bc5; }
.billing-subscription { padding:1.25rem; background:#f0f6ff; border:1px solid #d7e5f7; border-radius:12px; }
.billing-subscribe { min-height:48px; white-space:normal; width:100%; }
.billing-subscribe:disabled { opacity:.6; cursor:not-allowed; }
@media(max-width:400px) { .billing-subscription { padding:1rem; } }
.mot-account .billing-secondary { background:#fff; color:#005bc5; }.mot-account .billing-secondary:hover { background:#e9f2ff; }.billing-consent span { min-width:0; }

/* Homepage only: retain the existing administration/account main layout elsewhere. */
main:has(> .mot-home) { max-width:none; margin:0; padding:0; }
.mot-home { --home-navy:#0b2548; --home-blue:#005bc5; background:#fff; color:#344d6a; line-height:1.65; }
.mot-home *, .mot-home *::before, .mot-home *::after { box-sizing:border-box; }
.mot-home h1,.mot-home h2,.mot-home h3 { color:var(--home-navy); font-weight:800; letter-spacing:-.04em; line-height:1.15; }
.mot-home h2 { font-size:clamp(1.8rem,3.3vw,2.8rem); margin:0 0 1rem; }
.mot-home h3 { font-size:1.15rem; letter-spacing:-.02em; margin:.9rem 0 .6rem; }
.mot-home p { margin:0 0 1rem; }
.mot-home .mot-eyebrow { font-size:.72rem; letter-spacing:.13em; margin:0 0 1rem; }
.mot-home a { text-underline-offset:4px; }
.mot-home a:focus-visible { outline:3px solid #b66b00; outline-offset:5px; }
.home-skip { position:absolute; left:1rem; top:-8rem; padding:.7rem 1rem; background:white; z-index:10; }
.home-skip:focus { top:1rem; }
.home-header,.home-section,.home-footer { width:min(100%,1200px); margin:0 auto; padding:1.25rem; }
.home-header { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; min-height:84px; }
.home-header nav { display:flex; align-items:center; gap:1.5rem; }
.home-header nav a { min-height:44px; display:inline-flex; align-items:center; font-size:.86rem; font-weight:650; text-decoration:none; color:var(--home-navy); }
.home-header .home-signin { color:var(--home-blue); gap:.6rem; }
.home-section-link { display:none!important; }
.home-hero { background:#edf4fc; overflow:hidden; border-top:1px solid #e0e9f5; }
.home-hero-inner { width:min(100%,1200px); margin:auto; padding:3rem 1.25rem 2.5rem; display:grid; gap:2.5rem; align-items:center; }
.home-hero h1 { font-size:clamp(2.4rem,5.3vw,4.15rem); line-height:1.07; margin:0 0 1.4rem; }
.home-hero h1 span { color:var(--home-blue); }
.home-hero .home-lead { font-size:1.08rem; max-width:36rem; margin-bottom:1.8rem; }
.home-actions { display:flex; flex-direction:column; align-items:stretch; gap:1rem; }
.home-trial-action { min-width:0; max-width:100%; }
.home-trial-action .mot-button { width:100%; }
.mot-home .home-trial-assurance { margin:.65rem 0 0; font-size:.8rem; line-height:1.5; color:#526781; }
.mot-home .mot-button { display:inline-flex; align-items:center; justify-content:center; gap:.75rem; min-height:50px; padding:.9rem 1.15rem; border-radius:8px; background:var(--home-blue); color:white; font-weight:750; font-size:.9rem; line-height:1.5; text-align:center; text-decoration:none; border:1px solid transparent; box-shadow:0 4px 12px #005bc51a; }
.mot-home .mot-button:hover { background:#004a9f; }
.home-secondary { display:inline-flex; align-items:center; justify-content:center; min-height:44px; color:var(--home-navy); font-weight:700; font-size:.9rem; }
.mot-home .home-hero-note { font-size:.8rem; color:#526781; margin:1.1rem 0 0; }
.home-preview { margin:0; min-width:0; padding:1.15rem; border-radius:18px; background:linear-gradient(145deg,#0a2548,#004eab); position:relative; overflow:hidden; box-shadow:0 18px 40px #0b254824; }
.home-preview::after { content:''; position:absolute; width:170%; height:70px; border-top:22px solid #0078eb; border-bottom:12px solid #2293f5; transform:rotate(-35deg); bottom:1.5rem; left:-35%; opacity:.45; pointer-events:none; }
.home-preview-top,.home-preview-page,.home-preview figcaption { position:relative; z-index:1; }
.home-preview-top { display:flex; align-items:center; gap:.5rem; font-size:.7rem; color:#e0edff; margin-bottom:1rem; }
.home-preview-dot { width:6px; height:6px; border-radius:50%; background:#82c7ff; }
.home-preview-page { background:white; border-radius:10px; padding:1rem; box-shadow:0 10px 25px #001a3d30; }
.home-preview-garage { display:flex; gap:.65rem; align-items:center; border-bottom:1px solid #dce6f2; padding-bottom:.9rem; margin-bottom:1.1rem; }
.home-preview-icon { width:36px; height:36px; display:grid; place-items:center; border-radius:8px; background:#eaf3ff; color:var(--home-blue); }
.home-preview-label { display:block; font-size:.6rem; color:#526781; }
.home-preview-garage strong { display:block; color:var(--home-navy); font-size:.9rem; line-height:1.4; }
.home-preview-page h2 { font-size:1.35rem; margin:0 0 .4rem; }
.home-preview-page > p { font-size:.7rem; line-height:1.6; }
.home-preview-steps { display:flex; flex-wrap:wrap; gap:.35rem .65rem; color:#375477; font-size:.58rem; margin:1rem 0; font-weight:650; }
.home-preview-day { padding:.7rem; display:flex; flex-wrap:wrap; align-items:center; gap:.45rem; background:#005bc5; color:white; border-radius:7px 7px 0 0; font-size:.8rem; }
.home-preview-day .mud-icon-root { width:18px; height:18px; }
.home-preview-day > span { font-size:.6rem; margin-left:auto; }
.home-preview-slots { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.5rem; border:1px solid #dce6f2; padding:.65rem; border-radius:0 0 7px 7px; }
.home-preview-slot { display:grid; gap:.7rem; min-width:0; padding:.6rem .35rem; background:#f1f6fc; border:1px solid #dce6f2; border-radius:6px; text-align:center; color:var(--home-navy); font-size:.74rem; font-weight:750; }
.home-preview-book { background:var(--home-blue); color:white; border-radius:4px; padding:.45rem .15rem; font-size:.53rem; font-weight:600; }
.home-preview-book > span { display:none; }
.home-preview figcaption { text-align:center; color:#fff; font-size:.77rem; padding-top:1.1rem; }
.home-preview figcaption small { display:block; font-size:.65rem; color:#cee4ff; margin-top:.3rem; }
.home-section { padding-top:3.5rem; padding-bottom:3.5rem; }
.home-section-heading { max-width:40rem; margin-bottom:2rem; }
.home-section-heading > p:last-child { color:#526781; }
.home-intro-video .home-section-heading { margin-inline:auto; text-align:center; }
.home-video-player { display:block; width:100%; max-width:800px; height:auto; margin-inline:auto; background:var(--home-navy); border:1px solid #dce6f2; border-radius:12px; box-shadow:0 10px 30px #0b254812; }
.home-video-player:focus-visible { outline:3px solid #b66b00; outline-offset:5px; }
.home-benefits { display:grid; gap:1rem; }
.home-benefit { border:1px solid #dce6f2; border-radius:12px; background:#fff; padding:1.5rem; box-shadow:0 5px 20px #0b254805; }
.home-benefit > .mud-icon-root { width:40px; height:40px; padding:8px; color:var(--home-blue); border-radius:10px; background:#eaf3ff; }
.home-benefit p { font-size:.92rem; margin:0; }
.home-how { background:#f3f7fc; border-block:1px solid #e2ebf5; }
.home-steps { display:grid; gap:2rem; list-style:none; padding:0; margin:0; counter-reset:none; }
.home-step-number { display:block; color:var(--home-blue); font-size:2.5rem; line-height:1; letter-spacing:-.06em; font-weight:800; margin-bottom:1.1rem; }
.home-steps li { border-top:2px solid #c8d9ef; padding-top:1.3rem; }
.home-steps p { font-size:.95rem; margin:0; max-width:24rem; }
.home-pricing { display:grid; gap:2rem; align-items:center; }
.home-pricing-copy { max-width:34rem; }
.home-pricing-copy ul { list-style:none; padding:0; margin:1.6rem 0 0; display:grid; gap:.7rem; font-size:.92rem; }
.home-pricing-copy li { position:relative; padding-left:1.6rem; }
.home-pricing-copy li::before { content:'✓'; position:absolute; left:0; font-weight:800; color:var(--home-blue); }
.home-price-card { border:1px solid #cbdcf0; border-top:4px solid var(--home-blue); padding:clamp(1.5rem,4vw,2.5rem); border-radius:14px; box-shadow:0 12px 35px #0b254810; }
.home-price-label { font-size:.82rem; color:#526781; font-weight:650; }
.mot-home .home-price { display:flex; flex-wrap:wrap; align-items:baseline; gap:.7rem; color:var(--home-navy); margin:.6rem 0 .3rem; }
.home-price strong { font-size:4rem; font-weight:800; line-height:1.1; letter-spacing:-.055em; }
.home-price > span { font-size:1rem; }
.mot-home .home-price-equivalent { color:var(--home-navy); font-weight:650; margin:.8rem 0 .4rem; }
.home-pricing .home-value-heading { margin-top:1.5rem; }
.mot-home .home-price-total { font-size:.92rem; margin-bottom:1.6rem; }
.mot-home .home-price-trial { color:var(--home-blue); font-weight:750; border-top:1px solid #dce6f2; padding-top:1.3rem; }
.home-price-card .mot-button { width:100%; }
.home-final { position:relative; overflow:hidden; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1.3rem; background:#0b2548; padding:clamp(2rem,5vw,4rem) max(1.25rem,calc((100% - 1160px)/2)); color:#d4e5fc; }
.home-final::after { content:''; position:absolute; width:30rem; height:8rem; border-top:30px solid #0064d8; border-bottom:15px solid #2293f5; transform:rotate(-35deg); right:-12rem; bottom:-7rem; opacity:.4; pointer-events:none; }
.home-final > * { position:relative; z-index:1; }
.home-final > div { max-width:37rem; }
.home-final h2 { color:white; font-size:clamp(1.9rem,3.2vw,2.5rem); }
.home-final .mot-eyebrow { color:#b6d8ff; }
.home-final p:last-child { margin:0; }
.home-final > .mot-button { width:100%; }
.home-final .home-trial-action { width:100%; }
.mot-home .home-final .home-trial-assurance { color:#d4e5fc; margin:.65rem 0 0; }
@media(min-width:960px) { .home-final .home-trial-action { width:auto; } }
.home-footer { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; padding-block:2rem; }
.home-footer > span { color:#526781; font-size:.8rem; }
.home-footer > a:last-child { color:var(--home-blue); display:inline-flex; align-items:center; min-height:44px; font-size:.85rem; font-weight:650; }
@media(min-width:600px) { .home-actions { flex-direction:row; align-items:center; gap:1.5rem; }.home-benefits { grid-template-columns:repeat(2,minmax(0,1fr)); }.home-steps { grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.5rem; }.home-preview { padding:1.6rem; }.home-preview-page { padding:1.5rem; }.home-preview-page h2 { font-size:1.7rem; }.home-preview-slot { padding:.8rem .4rem; font-size:.9rem; }.home-preview-book { font-size:.64rem; }.home-section-link { display:inline-flex!important; } }
@media(min-width:960px) { .home-hero-inner { grid-template-columns:1.1fr 1fr; gap:3rem; padding-top:4.5rem; padding-bottom:4.5rem; }.home-hero h1 { font-size:clamp(3rem,4.5vw,3.65rem); }.home-section { padding-top:4.5rem; padding-bottom:4.5rem; }.home-benefits { grid-template-columns:repeat(6,minmax(0,1fr)); }.home-benefit { grid-column:span 2; }.home-benefit:nth-last-child(-n+2) { grid-column:span 3; }.home-pricing { grid-template-columns:1.15fr 1fr; gap:6rem; }.home-final > .mot-button { width:auto; }.home-preview-book > span { display:inline; } }
@media(max-width:359px) { .home-header { gap:.3rem; }.home-header .mot-wordmark { font-size:1.15rem; gap:.35rem; }.home-header .home-signin { font-size:.75rem; gap:.25rem; }.home-preview { padding:.85rem; }.home-preview-slots { gap:.3rem; padding:.45rem; }.home-preview-slot { font-size:.65rem; }.home-preview-book { font-size:.48rem; }.home-preview-day > span { flex-basis:100%; margin-left:0; } }

.home-header > .mot-wordmark,.home-footer > .mot-wordmark { min-height:44px; }
@media(max-width:599px) {
    .home-preview-slots { grid-template-columns:minmax(0,1fr); }
    .home-preview-slot { display:flex; align-items:center; justify-content:space-between; gap:.5rem; padding:.6rem; font-size:.85rem; }
    .home-preview-book { font-size:.7rem; padding:.4rem .6rem; }
    .home-preview-page > p { font-size:.8rem; }
    .home-preview-steps { font-size:.65rem; }
    .home-preview-day > span { font-size:.68rem; }
}

/* Two-field registration; isolated from password reset and existing sign-in forms. */
.registration-password { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; }
.garage-login .registration-password input { flex:1 1 12rem; min-width:0; margin-top:0!important; }
.password-toggle { min-height:44px; background:#eaf3ff; color:#0055b5; border:1px solid #a2b5cb; border-radius:8px; padding:.65rem; font:inherit; cursor:pointer; }
.password-toggle[hidden] { display:none; }
#account-register > label { margin-bottom:.4rem; }
#account-register .account-help { margin-top:.65rem; }
#garage-setup .mot-button,#garage-setup-retry .mot-button { width:100%; }
.registration-field-error { display:block; color:#a51d2d; font-size:.9rem; margin:.25rem 0 .75rem; }
.garage-login.registration-retry { grid-template-columns:minmax(0,1fr); max-width:600px; }
.onboarding-progress { min-width:0; }
.booking-share-card { min-width:0; max-width:100%; box-sizing:border-box; margin:1.5rem 0; padding:clamp(1rem,3vw,1.75rem); border:1px solid #c4d7f0; border-top:4px solid #005bc5; border-radius:14px; background:#f4f8fe; box-shadow:0 6px 24px #0b254809; }
.booking-share-card h2 { color:#0b2548; font-size:clamp(1.25rem,3vw,1.6rem); line-height:1.3; margin:0 0 1rem; }
.booking-share-url { display:block; max-width:100%; overflow-wrap:anywhere; color:#005bc5; font-size:clamp(1rem,2.5vw,1.3rem); line-height:1.5; font-weight:750; margin-bottom:1rem; }
.booking-share-actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1rem; }
.booking-share-actions .booking-share-open { background:#fff; color:#005bc5; }
.booking-share-actions .booking-share-open:hover { background:#e5effc; }
.booking-share-readiness { color:#70500a; font-weight:600; }
.booking-share-ready { color:#175870; }
.booking-share-card .booking-share-status { min-height:1.5em; margin:.6rem 0 0; font-size:.9rem; overflow-wrap:anywhere; }
.booking-share-card a:focus-visible,.booking-share-card button:focus-visible { outline:3px solid #b66b00; outline-offset:3px; }
@media(max-width:400px) { .booking-share-actions > * { width:100%; box-sizing:border-box; } }
.onboarding-actions { display:flex; flex-wrap:wrap; gap:.75rem; margin:1rem 0; }
.onboarding-actions a { white-space:normal; text-align:center; }
@media(max-width:480px) { .onboarding-actions { flex-direction:column; } .onboarding-actions a { width:100%; box-sizing:border-box; } }
.ad-consent-footer { text-align:center; padding:1rem; font-size:.9rem; }
.mot-platform-contact a { display:inline-flex; align-items:center; min-height:44px; color:#0058bc; text-decoration:underline; }
.mot-platform-contact a:focus-visible { outline:3px solid #102c50; outline-offset:3px; }
.ad-consent-footer button { background:none; border:0; color:#0058bc; text-decoration:underline; cursor:pointer; font:inherit; min-height:44px; }
.ad-consent { position:fixed; bottom:1rem; left:1rem; right:1rem; margin:auto; max-width:620px; z-index:1600; padding:1.25rem; background:#fff; color:#102c50; border:1px solid #b7cde5; border-radius:12px; box-shadow:0 6px 30px #102c5033; max-height:calc(100dvh - 2rem); overflow:auto; }
.ad-consent[hidden] { display:none; }
.ad-consent h2 { font-size:1.2rem; margin:0 0 .5rem; }
.ad-consent p { font-size:.95rem; line-height:1.5; }
.ad-consent-actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1rem; }
.ad-consent-actions button { flex:1 1 120px; min-height:48px; background:#0058bc; color:#fff; border:1px solid #0058bc; border-radius:8px; padding:.7rem 1rem; font:inherit; font-weight:700; cursor:pointer; }
.ad-consent-actions button:focus-visible,.ad-consent-footer button:focus-visible { outline:3px solid #102c50; outline-offset:3px; }
