/* v1.2.1 — "Audio Space classic" skin: the same look as the old Audio Space Form A / Form B / portal pages
   (light blue-grey canvas, navy #2C4564, royal #4B69A5, white 16px cards with soft navy shadow, 46px inputs,
   numbered stepper, navy solid / outline toggles). Activated by <body class="skin-audiospace">; everything else untouched. */
body.skin-audiospace{--brand-bg:#E8EEF5;--brand-card:#fff;--brand-text:#2C4564;--brand-primary:#2C4564;--brand-accent:#4B69A5;--brand-radius:16px;
  --brand-font:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;font-family:var(--brand-font);background:#E8EEF5;color:#2C4564;line-height:1.4}
body.skin-audiospace :root,body.skin-audiospace{--as-sub:#7B9AC7;--as-label:#5A7494;--as-line:#c8d4e4;--as-shadow:0 2px 12px rgba(44,69,100,.08)}
/* brand row instead of a flat top bar */
body.skin-audiospace .topbar{background:transparent;border:0;padding:14px 16px 6px}
body.skin-audiospace .topbar strong{color:#2C4564;font-size:16px;font-weight:700}
body.skin-audiospace .topbar .muted{color:#7B9AC7;font-size:11px}
body.skin-audiospace .brandLogo{height:44px;max-width:44px;margin-right:10px}
body.skin-audiospace .pill{background:#fff;color:#2C4564;font-weight:600;box-shadow:var(--as-shadow)}
/* the seal strip becomes the navy header bar of the old Form B */
body.skin-audiospace .persistentSeal{background:#2C4564;color:#fff;border:0;border-radius:16px;margin:0 16px 4px;padding:10px 14px;box-shadow:0 4px 12px rgba(44,69,100,.08);top:0;position:static}
body.skin-audiospace .persistentSeal strong,body.skin-audiospace .persistentSeal b{color:#fff}
/* headings */
body.skin-audiospace .hero h1,body.skin-audiospace .screenHead h1{color:#2C4564;font-size:20px;font-weight:700}
body.skin-audiospace .hero .muted,body.skin-audiospace p.muted{color:#7B9AC7;font-size:13px}
body.skin-audiospace h2{color:#2C4564;font-size:14px;font-weight:700}
body.skin-audiospace h3{color:#2C4564;font-size:13px;font-weight:700;margin:14px 0 6px}
/* cards */
body.skin-audiospace .card,body.skin-audiospace .stat,body.skin-audiospace .alert,body.skin-audiospace .day,body.skin-audiospace .miniGrid div{border:0;border-radius:16px;box-shadow:var(--as-shadow);background:#fff}
body.skin-audiospace .stat b{color:#2C4564;font-size:24px;font-weight:900}
body.skin-audiospace .stat span{color:#7B9AC7;font-size:11px;font-weight:600}
/* labels + inputs — exactly Form A */
body.skin-audiospace .form label,body.skin-audiospace .card label,body.skin-audiospace label{font-size:12px;font-weight:600;color:#5A7494}
body.skin-audiospace .form input,body.skin-audiospace .form select,body.skin-audiospace .form textarea,body.skin-audiospace .card input,body.skin-audiospace .card select{padding:11px 14px;border:1px solid #c8d4e4;border-radius:10px;font-size:16px;background:#fff;color:#2C4564;height:46px;line-height:1.4;-webkit-appearance:none;appearance:none}
body.skin-audiospace .form select,body.skin-audiospace .card select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%235A7494' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:36px}
body.skin-audiospace .form textarea{height:auto;min-height:60px}
body.skin-audiospace .form input:focus,body.skin-audiospace .form select:focus,body.skin-audiospace .form textarea:focus{outline:none;border-color:#2C4564}
body.skin-audiospace .form input[type=checkbox],body.skin-audiospace .form input[type=radio],body.skin-audiospace .checks input{height:auto;width:auto}
/* buttons: navy solid / white outline, 46–50px, radius 12 */
body.skin-audiospace button{border:1px solid #c8d4e4;background:#fff;color:#2C4564;border-radius:12px;font-weight:700;min-height:46px}
body.skin-audiospace .primary,body.skin-audiospace a.primary{background:linear-gradient(135deg,#2C4564 0%,#4B69A5 100%);color:#fff;border:0;border-radius:14px;min-height:50px;font-weight:700}
body.skin-audiospace .seg button.selected,body.skin-audiospace .tab.on{background:#2C4564;color:#fff;border-color:#2C4564}
body.skin-audiospace .back{min-height:42px;width:42px}
body.skin-audiospace .linkBtn{color:#4B69A5;min-height:auto;border:0;background:transparent}
body.skin-audiospace .bigBtn{font-size:16px}
/* numbered stepper with connecting line, as on Form A */
body.skin-audiospace .stepper{counter-reset:st;gap:0;align-items:center;margin:8px 0 4px}
body.skin-audiospace .stepper span{background:transparent;color:#7B9AC7;font-size:12px;font-weight:600;padding:0;display:flex;align-items:center;gap:7px;flex:1}
body.skin-audiospace .stepper span::before{counter-increment:st;content:counter(st);width:22px;height:22px;border-radius:50%;border:1.5px solid #c8d4e4;background:#fff;color:#7B9AC7;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex:0 0 22px}
body.skin-audiospace .stepper span:not(:last-child)::after{content:'';flex:1;height:1px;background:#c8d4e4;margin:0 8px}
body.skin-audiospace .stepper span.active{color:#2C4564;background:transparent}
body.skin-audiospace .stepper span.active::before{background:#2C4564;border-color:#2C4564;color:#fff}
/* status colours as the old pages */
body.skin-audiospace .syncWords.good,body.skin-audiospace .ok{background:#D1FAE5;color:#065F46}
body.skin-audiospace .syncWords.warn,body.skin-audiospace .syncWords.wait,body.skin-audiospace .warn{background:#fff3cd;color:#856404}
body.skin-audiospace .syncWords.busy{background:#E2F3FC;color:#144B66}
body.skin-audiospace .tl.done{background:#D1FAE5;color:#065F46}body.skin-audiospace .tl.bad{background:#FEE2E2;color:#991B1B}
body.skin-audiospace .patientBanner{background:#F0F4FA;color:#2C4564;font-weight:600}
body.skin-audiospace .toast{background:#2C4564;border-radius:12px;font-weight:600}
body.skin-audiospace .signinBrand{justify-content:center;flex-direction:column;gap:6px;padding:18px 0 6px}
body.skin-audiospace .signinBrand img{height:110px;max-width:110px}
body.skin-audiospace .signinBrand strong{font-size:20px;color:#2C4564}
body.skin-audiospace #signin .hero{text-align:center}
body.skin-audiospace .firstSteps{color:#2C4564}
body.skin-audiospace .inlineLinks{justify-content:center}
body.skin-audiospace .hint,body.skin-audiospace .small{color:#7B9AC7}
body.skin-audiospace input[type=checkbox],body.skin-audiospace input[type=radio],body.skin-audiospace .checks input,body.skin-audiospace .checkline input,body.skin-audiospace .toggleRow input{height:auto!important;width:auto!important;padding:0;min-height:0;appearance:auto;-webkit-appearance:auto;accent-color:#2C4564}
body.skin-audiospace .checks label{border:1px solid #c8d4e4;border-radius:10px;padding:11px 12px;font-weight:600;color:#2C4564;font-size:14px}