/* SANORA patient portal — the website's look (index.html): Montserrat + Cormorant Garamond, deep green surfaces with a
   mint accent, 24px rounded cards on a soft green-grey page, a dark floating bar, and iOS-like motion (spring sheets,
   sliding tab lens, press feedback, cards rising in). Loaded last on portal.html; everything is scoped to body.pz.
   Motion is switched off for people who ask their device for less motion. */
body.pz{
  --pz-bg:#edf2f0; --pz-card:#fff; --pz-ink:#0f201c; --pz-mut:#5b6d68; --pz-line:#dce6e2; --pz-soft:#f3f7f5;
  --pz-dark:#062621; --pz-dark2:#07211d; --pz-brand:#0a4a3f; --pz-mint:#12c29c; --pz-mint-ink:#032119;
  --pz-act:var(--pz-dark); --pz-act-ink:#fff;
  --pz-r:24px; --pz-sh:0 1px 2px rgba(4,40,34,.05),0 14px 34px -22px rgba(4,40,34,.32);
  --pz-spring:cubic-bezier(.32,.72,0,1); --pz-out:cubic-bezier(.22,1,.36,1);
  --pz-hero:radial-gradient(420px 300px at 88% 0%,color-mix(in srgb,var(--pz-mint) 36%,transparent),transparent 62%),
    radial-gradient(380px 280px at -6% 112%,color-mix(in srgb,var(--pz-mint) 20%,transparent),transparent 70%),
    linear-gradient(140deg,var(--pz-dark2) 0%,var(--pz-brand) 62%,color-mix(in srgb,var(--pz-brand) 72%,var(--pz-mint)) 100%);
  /* the shared tokens every portal component already uses */
  --bg:var(--pz-bg); --surface:var(--pz-card); --ink:var(--pz-ink); --muted:var(--pz-mut); --line:var(--pz-line); --soft:var(--pz-soft);
  --field:#eef3f1; --field-hover:#e5edea; --hair:rgba(4,40,34,.08); --accent:var(--pz-brand); --accent-ink:#fff; --mint:var(--pz-mint);
  --f-body:"Montserrat",system-ui,-apple-system,"Segoe UI",sans-serif; --f-display:var(--f-body); --f-serif:"Cormorant Garamond",Georgia,serif;
  background:var(--pz-bg); color:var(--pz-ink); font-family:var(--f-body); letter-spacing:0;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) body.pz{
  --pz-act:var(--pz-mint); --pz-act-ink:var(--pz-mint-ink);
  --pz-bg:#050d0b; --pz-card:#0f1b18; --pz-ink:#eaf3ef; --pz-mut:#93a69f; --pz-line:#1e2e29; --pz-soft:#15231f;
  --field:#16241f; --field-hover:#1c2d27; --hair:rgba(255,255,255,.08); --accent:#30d5b0; --accent-ink:#03231c;
  --pz-sh:0 0 0 1px rgba(255,255,255,.05),0 16px 34px -24px rgba(0,0,0,.8)}}
:root[data-theme="dark"] body.pz{
  --pz-act:var(--pz-mint); --pz-act-ink:var(--pz-mint-ink);
  --pz-bg:#050d0b; --pz-card:#0f1b18; --pz-ink:#eaf3ef; --pz-mut:#93a69f; --pz-line:#1e2e29; --pz-soft:#15231f;
  --field:#16241f; --field-hover:#1c2d27; --hair:rgba(255,255,255,.08); --accent:#30d5b0; --accent-ink:#03231c;
  --pz-sh:0 0 0 1px rgba(255,255,255,.05),0 16px 34px -24px rgba(0,0,0,.8)}
.pz :focus-visible{outline:2.5px solid var(--pz-mint);outline-offset:2px}
.pz .boot{background:var(--pz-bg)}.pz .boot .logo{font-family:var(--f-serif);color:var(--pz-brand);letter-spacing:.08em}

/* ---------- controls */
.pz .btn{border-radius:12px;font-weight:700;letter-spacing:0}
.pz .btn:not(.primary):not(.danger){background:var(--pz-card);box-shadow:inset 0 0 0 1.5px var(--pz-line);color:var(--pz-ink)}
.pz .btn:not(.primary):not(.danger):hover{box-shadow:inset 0 0 0 1.5px var(--pz-mut);background:var(--pz-card)}
.pz .btn.primary,.pz .bks-go{background:var(--pz-act);color:var(--pz-act-ink);box-shadow:0 10px 22px -14px rgba(3,30,25,.8)}
.pz .btn.primary:hover,.pz .bks-go:hover:not(:disabled){filter:brightness(1.12);background:var(--pz-act)}
.pz .linkbtn{color:var(--pz-brand)}
.pz input,.pz select,.pz textarea{border-radius:14px}
.pz input:focus,.pz select:focus,.pz textarea:focus{border-color:var(--pz-mint);box-shadow:0 0 0 4px color-mix(in srgb,var(--pz-mint) 18%,transparent)}
.pz .chips button{border-radius:999px;background:var(--pz-card);box-shadow:inset 0 0 0 1.5px var(--pz-line);font-weight:600}
.pz .chips button[aria-pressed="true"]{background:var(--pz-act);color:var(--pz-act-ink);box-shadow:0 6px 16px -10px rgba(3,30,25,.8)}
.pz .seg{background:color-mix(in srgb,var(--pz-line) 70%,transparent);border-radius:13px;padding:3px}
.pz .seg button{border-radius:10px;font-weight:600}.pz .seg button[aria-pressed="true"]{background:var(--pz-act);color:var(--pz-act-ink);box-shadow:none}
.pz .demo-bar{margin:8px 12px 0;border-radius:12px;font-size:12px}

/* ---------- the dark floating bar (phone) / page title (computer) */
.pz .pp-top{position:sticky;top:8px;z-index:30;margin:8px 10px 0;padding:9px 10px 9px 16px;border:0;border-radius:18px;
  background:var(--pz-dark);color:#fff;box-shadow:0 14px 34px -18px rgba(0,0,0,.6)}
@supports (padding:max(0px)){.pz .pp-top{top:max(8px,env(safe-area-inset-top));margin-top:max(8px,env(safe-area-inset-top))}}
.pz .pp-logo{height:24px;width:auto;align-self:flex-start;object-fit:contain}
.pz .pp-title{font-family:var(--f-serif);font-weight:600;font-size:21px;color:#fff;letter-spacing:0}
.pz .pp-top2 .fam,.pz .pp-top select.fam{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.16);border-radius:12px}
.pz .pp-av{width:36px;height:36px;background:var(--pz-mint);color:var(--pz-mint-ink);font-family:var(--f-serif);font-size:19px;font-weight:700;box-shadow:0 0 0 3px rgba(255,255,255,.12)}
.pz .pp-top .btn{background:rgba(255,255,255,.1)!important;color:#fff!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)!important}
.pz .pp-top .lang-sw{background:rgba(255,255,255,.1)}.pz .pp-top .lang-sw button{color:rgba(255,255,255,.7)}.pz .pp-top .lang-sw button[aria-pressed="true"]{background:#fff;color:var(--pz-ink)}
.pz .pp{gap:14px}

/* ---------- home hero: greeting, open now, next visit, quick actions */
.pz-hero{position:relative;isolation:isolate;overflow:hidden;border-radius:28px;padding:18px 16px 14px;color:#fff;background:var(--pz-hero);box-shadow:0 26px 50px -30px rgba(3,30,25,.75)}
.pz-deco i{position:absolute;z-index:-1;border-radius:50%;border:1px solid rgba(255,255,255,.12);pointer-events:none;right:-80px;top:-90px;width:250px;height:250px}
.pz-deco .r2{width:390px;height:390px;right:-150px;top:-160px;border-style:dashed;border-color:rgba(255,255,255,.1);animation:pzSpin 90s linear infinite}
.pz-deco .r3{width:540px;height:540px;right:-225px;top:-235px;border-color:rgba(255,255,255,.06)}
@keyframes pzSpin{to{transform:rotate(360deg)}}
.pz-kick{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);font-size:12.5px;font-weight:600;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.pz-dot{width:8px;height:8px;border-radius:50%;background:#9fb0ab;flex:none}.pz-dot.open{background:#46e08f;box-shadow:0 0 0 4px rgba(70,224,143,.22);animation:pzPulse 2.4s ease-in-out infinite}
@keyframes pzPulse{50%{box-shadow:0 0 0 7px rgba(70,224,143,.08)}}
.pz .pz-hero .pp-hi{margin:16px 2px 14px}
.pz .pz-hero .pp-hi small{color:rgba(255,255,255,.72);font-size:14px;font-weight:500}
.pz .pz-hero .pp-hi b{font-family:var(--f-serif);font-weight:600;font-size:42px;line-height:1;color:#fff;letter-spacing:0;margin-top:2px}
.pz-lead{margin:-2px 2px 4px;font-size:14px;line-height:1.5;color:rgba(255,255,255,.8);max-width:36ch}
/* the next visit, as a glass card inside the hero */
.pz .pz-hero .tk.big{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);box-shadow:none;color:#fff;border-radius:20px;padding:12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.pz .pz-hero .tk-cal{border:0;box-shadow:0 10px 22px -12px rgba(0,0,0,.5)}
.pz .pz-hero .tk-m{background:var(--pz-mint);color:var(--pz-mint-ink)}
.pz .pz-hero .tk-lbl{color:rgba(255,255,255,.7)}.pz .pz-hero .tk-t{color:#fff}.pz .pz-hero .tk-s{color:rgba(255,255,255,.85)}
.pz .pz-hero .tk-when{background:color-mix(in srgb,var(--pz-mint) 26%,transparent);color:#c9fbec}.pz .pz-hero .tk.soon .tk-when{background:rgba(250,178,25,.22);color:#ffe2a6}
.pz .pz-hero .tk-add{background:rgba(255,255,255,.12);color:#fff}
/* quick actions: a white panel of round icons, like the website's hero */
.pz .pz-quick{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;margin-top:14px;padding:8px 6px;border-radius:22px;background:rgba(255,255,255,.96);color:var(--pz-ink);box-shadow:0 26px 50px -30px rgba(0,0,0,.65)}
.pz .pz-quick .pp-tile{position:relative;flex-direction:column;align-items:center;justify-content:flex-start;gap:7px;padding:8px 2px 6px;border-radius:16px;background:none;box-shadow:none;text-align:center;color:var(--pz-ink);min-width:0}
.pz .pz-quick .pt-ic{width:48px;height:48px;border-radius:50%;background:color-mix(in srgb,var(--pz-mint) 14%,#fff);border:1.5px solid color-mix(in srgb,var(--pz-mint) 34%,#fff);color:var(--pz-brand);font-size:0}
.pz .pz-quick .pt-t{align-items:center;flex:none}.pz .pz-quick .pt-t b{font-size:12px;font-weight:600;white-space:normal;line-height:1.2;color:var(--pz-ink)}
.pz .pz-quick .pt-dot{position:absolute;top:4px;left:calc(50% + 12px);margin:0;box-shadow:0 0 0 2.5px #fff}
@media (hover:hover){.pz .pz-quick .pp-tile:hover{background:#f0f5f3}}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .pz .pz-quick{background:rgba(15,27,24,.92);color:var(--pz-ink)}
  :root:not([data-theme="light"]) .pz .pz-quick .pt-ic{background:color-mix(in srgb,var(--pz-mint) 16%,var(--pz-card));border-color:color-mix(in srgb,var(--pz-mint) 30%,var(--pz-card));color:var(--pz-mint)}
  :root:not([data-theme="light"]) .pz .pz-quick .pt-dot{box-shadow:0 0 0 2.5px var(--pz-card)}}

/* ---------- cards, section titles */
.pz .card{border:0;border-radius:var(--pz-r);background:var(--pz-card);box-shadow:var(--pz-sh)}
.pz .card h3{font-family:var(--f-serif);font-weight:700;font-size:23px;line-height:1.1;letter-spacing:0}
.pz .hx-h h2,.pz .pp-sec h2{font-family:var(--f-serif);font-weight:600;font-size:28px;line-height:1.05;letter-spacing:0;margin:6px 4px 0;color:var(--pz-ink)}
.pz .card-h{align-items:center}
/* reminders: a white card, the tone carried by a round icon (and a ring for the urgent ones) */
.pz .remc{position:relative;padding:14px 16px 14px 62px;border:0;border-radius:22px;background:var(--pz-card);box-shadow:var(--pz-sh);--tc:#12c29c;
  --ti:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230a8f73' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9a6 6 0 1 1 12 0c0 6 2.5 7.5 2.5 7.5h-17S6 15 6 9M10 20a2 2 0 0 0 4 0'/%3E%3C/svg%3E")}
.pz .remc::before{content:"";position:absolute;left:14px;top:14px;width:36px;height:36px;border-radius:50%;background:color-mix(in srgb,var(--tc) 15%,var(--pz-card)) var(--ti) center/19px no-repeat}
.pz .remc.tone-warn{--tc:#f59e0b;--ti:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b45309' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E")}
.pz .remc.tone-bad{--tc:#e5484d;box-shadow:var(--pz-sh),inset 0 0 0 1.5px color-mix(in srgb,#e5484d 30%,transparent);
  --ti:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d12d33' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 7.5v5.5M12 16.5h.01'/%3E%3C/svg%3E")}
.pz .remc>b{font-size:15px;line-height:1.3;color:var(--pz-ink)}.pz .remc.tone-bad>b{color:#c62828}.pz .remc.tone-warn>b{color:#9a5b00}
.pz .remc span{color:var(--pz-mut)}
.pz .remc-why{background:var(--pz-soft);border-radius:14px}
.pz .qs-l button{border:0;border-radius:12px;background:var(--pz-soft);box-shadow:inset 0 0 0 1.5px var(--pz-line);color:var(--pz-ink)}
.pz .qs-l button b{color:var(--pz-brand)}
.pz .bk-today{border-radius:14px}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .pz .remc.tone-bad>b{color:#ff8a8a}:root:not([data-theme="light"]) .pz .remc.tone-warn>b{color:#ffc46b}}
/* my appointments / requests */
.pz .preq{border-radius:14px;background:var(--pz-soft);padding:10px 12px}
.pz .tk{border-radius:20px;box-shadow:var(--pz-sh)}.pz .tk-list .tk{box-shadow:none;border:1.5px solid var(--pz-line)}
.pz .tk-m{background:var(--pz-brand)}.pz .tk-cal{border-color:var(--pz-line)}
.pz .tk.big{background:linear-gradient(135deg,color-mix(in srgb,var(--pz-mint) 10%,var(--pz-card)),var(--pz-card));border:1.5px solid color-mix(in srgb,var(--pz-mint) 30%,var(--pz-line))}
/* promotions: deep green cards with a soft mint glow, like the website's offers */
.pz .hx-promo{border-radius:24px;min-height:156px;padding:18px;box-shadow:0 22px 44px -28px rgba(4,40,34,.7);background-color:var(--pz-brand)}
.pz .hx-promo.g0,.pz .hx-promo.g2{background-image:radial-gradient(260px 200px at 90% 0%,color-mix(in srgb,var(--pz-mint) 40%,transparent),transparent 65%),linear-gradient(135deg,var(--pz-brand),var(--pz-dark2))}
.pz .hx-promo.g1,.pz .hx-promo.g3{background-image:radial-gradient(260px 200px at 10% 110%,color-mix(in srgb,var(--pz-mint) 36%,transparent),transparent 65%),linear-gradient(160deg,var(--pz-dark2),color-mix(in srgb,var(--pz-brand) 70%,var(--pz-mint)))}
.pz .hx-promo b{font-family:var(--f-serif);font-weight:600;font-size:25px;line-height:1.05}
.pz .hx-pf button{background:var(--pz-mint);color:var(--pz-mint-ink);font-weight:700}
.pz .hx-pf small{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.12);opacity:1}
/* doctors */
.pz .hx-dph{background:color-mix(in srgb,var(--pz-mint) 12%,var(--pz-card));color:var(--pz-brand);font-family:var(--f-serif);font-size:32px;font-weight:600;box-shadow:0 0 0 2.5px var(--pz-bg),0 0 0 4.5px var(--pz-mint)}
.pz .hx-docs b{font-weight:700}
.pz .hx-dbig{background-color:color-mix(in srgb,var(--pz-mint) 12%,var(--pz-card));color:var(--pz-brand);font-family:var(--f-serif);font-size:48px;font-weight:600;box-shadow:0 0 0 3px var(--pz-card),0 0 0 5px var(--pz-mint)}
.pz .hx-doc b{font-family:var(--f-serif);font-size:26px;font-weight:700}
/* posts */
.pz .hx-post{border-radius:var(--pz-r);box-shadow:var(--pz-sh)}
.pz .hx-pb h3{font-family:var(--f-serif);font-weight:700;font-size:23px;line-height:1.1}
.pz .hx-av{background-color:var(--pz-brand)}.pz .hx-post header .hx-av{display:grid;place-items:center;font-family:var(--f-serif);font-size:19px}
.pz :is(.hx-promos,.hx-docs){scroll-padding-inline:10px}
.pz .sc-more{color:var(--pz-brand)}
/* prices */
.pz .hx-prices{border-radius:20px;box-shadow:var(--pz-sh)}.pz .hx-pr>button b{color:var(--pz-brand)}
.pz .hx-cats button[aria-pressed="true"]{background:var(--pz-act);border-color:var(--pz-act);color:var(--pz-act-ink)}
.pz .pr-q{border-radius:16px;box-shadow:inset 0 0 0 1.5px var(--pz-line)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .pz :is(.hx-pr>button b,.linkbtn,.sc-more,.qs-l button b){color:var(--pz-mint)}}

/* ---------- care / payments / profile */
.pz .ps-hero,.pz .ps-hero.bad,.pz .ps-hero.ok{position:relative;overflow:hidden;border-radius:26px;padding:20px 18px;background:var(--pz-hero);box-shadow:0 22px 44px -28px rgba(3,30,25,.7)}
.pz .ps-hero>b{font-size:34px;font-weight:700;letter-spacing:-.01em}.pz .ps-hero.bad>b{color:#ffc2b4}.pz .ps-hero.ok>b{color:#9ff5dc}
.pz .ps-bar{background:var(--pz-soft)}.pz .ps-bar i{background:var(--pz-mint)}
.pz .bks-sec{border-radius:22px;box-shadow:var(--pz-sh)}
.pz .hs-d b{font-family:var(--f-serif);font-size:30px;color:var(--pz-brand)}
.pz .steps li.now span{font-weight:700}
.pz .pf-av{background:var(--pz-hero);font-family:var(--f-serif);font-size:26px;font-weight:600;box-shadow:0 12px 26px -14px rgba(3,30,25,.7)}
.pz .pf-head b{font-family:var(--f-serif);font-size:26px;font-weight:700;line-height:1.1}
.pz .pf-out{border-radius:18px;box-shadow:var(--pz-sh);background:var(--pz-card)}
.pz .pf-flags span{border-radius:999px}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .pz .hs-d b{color:var(--pz-mint)}}

/* ---------- bottom bar: a floating dark glass pill with a lens that slides to the open tab */
.pz .bnav-lens{display:none}
@media (max-width:899px){
  .pz .bnav{left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom,0px));height:66px;padding:0 6px;border:1px solid rgba(255,255,255,.08);border-radius:26px;
    align-items:center;background:rgba(6,38,33,.84);-webkit-backdrop-filter:saturate(1.7) blur(20px);backdrop-filter:saturate(1.7) blur(20px);box-shadow:0 20px 40px -18px rgba(0,0,0,.6)}
  .pz .bnav-lens{display:block;position:absolute;left:6px;top:7px;bottom:7px;width:calc((100% - 12px) / 5);border-radius:20px;background:rgba(255,255,255,.12);
    transform:translateX(calc(var(--i,0) * 100%));transition:transform .55s var(--pz-spring)}
  .pz .bnav button{z-index:1;height:52px;justify-content:center;gap:3px;color:rgba(255,255,255,.62);font-weight:600}
  .pz .bnav button.on{color:#fff}.pz .bnav button.on svg{stroke-width:2.2}
  .pz .bnav button.has-dot::after{border-color:var(--pz-dark);top:6px}
  .pz .bnav-add i{width:48px;height:48px;margin:0;border:0;border-radius:18px;background:var(--pz-mint);color:var(--pz-mint-ink);box-shadow:0 10px 22px -8px color-mix(in srgb,var(--pz-mint) 70%,transparent)}
  .pz .bnav-add span{display:none}
  .pz.has-nav .pp,.pz .has-nav .pp{padding-bottom:calc(100px + env(safe-area-inset-bottom,0px))!important}
}
/* computer: a dark menu on the left, the page title in serif */
@media (min-width:900px){
  .pz .bnav{background:linear-gradient(180deg,var(--pz-dark) 0%,var(--pz-dark2) 100%);border-right:0;padding:22px 14px;box-shadow:12px 0 40px -30px rgba(0,0,0,.5)}
  .pz .bnav-brand img{height:32px}
  .pz .bnav button{color:rgba(255,255,255,.72);border-radius:13px}
  .pz .bnav button:hover{background:rgba(255,255,255,.07)}
  .pz .bnav button.on{background:rgba(255,255,255,.12);color:#fff}
  .pz .bnav button.has-dot::after{border-color:var(--pz-dark)}
  .pz .bnav button.bnav-add{background:var(--pz-mint);color:var(--pz-mint-ink);box-shadow:0 12px 24px -12px color-mix(in srgb,var(--pz-mint) 70%,transparent)}
  .pz .bnav button.bnav-add span{color:var(--pz-mint-ink)}
  .pz .has-nav .pp-top2{position:static;margin:0;border-radius:0;background:none;box-shadow:none;color:var(--pz-ink);padding:22px 28px 0}
  .pz .has-nav .pp-top2 .pp-logo{display:none}
  .pz .has-nav .pp-title{font-size:34px;color:var(--pz-ink)}
  .pz .has-nav .pp-top2 .fam{background:var(--pz-card);color:var(--pz-ink);border-color:var(--pz-line)}
  .pz .has-nav .demo-bar{margin:12px 28px 0}
  .pz-hero{padding:26px 26px 18px}
  .pz .pz-hero .pp-hi b{font-size:54px}
  .pz .pz-quick{max-width:520px}
  .pz .hx-promo{min-height:140px}
}

/* ---------- sheets: rounded card from the bottom on a phone (grabber, swipe down to close), centred on a computer */
.pz .bks{background:rgba(2,18,15,.42);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);animation:pzFade .3s ease}
.pz .bks.out{animation:pzFadeOut .28s ease forwards}
.pz .bks-in{background:var(--pz-bg);animation:pzSheet .55s var(--pz-spring)}
.pz .bks-in.out{animation:pzSheetOut .28s cubic-bezier(.4,0,1,1) forwards}
@keyframes pzFade{from{opacity:0}}@keyframes pzFadeOut{to{opacity:0}}
@keyframes pzSheet{from{transform:translateY(100%)}}@keyframes pzSheetOut{to{transform:translateY(100%)}}
.pz .bks-h{position:relative;background:transparent;border:0;padding-top:18px;touch-action:none;cursor:grab}
.pz .bks-h b{font-family:var(--f-serif);font-weight:700;font-size:23px;letter-spacing:0}
.pz .bks-grab{position:absolute;left:50%;top:7px;width:38px;height:5px;border-radius:3px;background:color-mix(in srgb,var(--pz-ink) 22%,transparent);transform:translateX(-50%)}
.pz .bks-x,.pz .bks-b{background:var(--pz-card);box-shadow:var(--pz-sh);color:var(--pz-ink)}
.pz .bks-f{background:color-mix(in srgb,var(--pz-card) 88%,transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-top:1px solid var(--pz-line)}
.pz .bks-go{border-radius:15px}
@media (max-width:639px){
  .pz .bks{align-items:flex-end}
  .pz .bks-in{height:calc(100% - max(14px,env(safe-area-inset-top,0px)));border-radius:26px 26px 0 0;box-shadow:0 -20px 50px -20px rgba(0,0,0,.4)}
  .pz .bks-h{padding-top:18px}
}
@media (min-width:640px){
  .pz .bks-in{border-radius:28px;box-shadow:0 40px 90px -30px rgba(0,0,0,.55);animation:pzPop .45s var(--pz-spring)}
  .pz .bks-in.out{animation:pzPopOut .22s ease forwards}.pz .bks-grab{display:none}.pz .bks-h{cursor:default}
}
@keyframes pzPop{from{opacity:0;transform:translateY(24px) scale(.97)}}@keyframes pzPopOut{to{opacity:0;transform:translateY(16px) scale(.98)}}
/* booking: brand colours for the chosen day / doctor / hour */
.pz .bks-types button{border-radius:20px;box-shadow:var(--pz-sh)}
.pz .bk-strip button{border-radius:14px;background:var(--pz-card);box-shadow:inset 0 0 0 1.5px var(--pz-line)}
.pz .bk-strip button.on{background:var(--pz-act);color:var(--pz-act-ink);box-shadow:0 10px 20px -12px rgba(3,30,25,.8)}
.pz .bk-strip i.y{background:var(--pz-mint)}.pz .bk-strip button.on i.y{background:#7ff0cf}
.pz .bks-docs .ph{background-color:color-mix(in srgb,var(--pz-mint) 12%,var(--pz-card));color:var(--pz-brand);font-family:var(--f-serif);font-size:26px;font-weight:600}
.pz .bks-docs button.on .ph{border-color:var(--pz-mint);box-shadow:0 0 0 3px color-mix(in srgb,var(--pz-mint) 25%,transparent)}
.pz .bks-docs .ph.any{background-color:color-mix(in srgb,#f59e0b 16%,var(--pz-card));color:#b45309;font-family:var(--f-body);font-size:22px}
.pz .bks-docs small{color:color-mix(in srgb,var(--pz-mint) 70%,var(--pz-ink))}
.pz .bks-slots button{border:0;border-radius:13px;background:var(--pz-card);box-shadow:inset 0 0 0 1.5px var(--pz-line)}
.pz .bks-slots button[aria-pressed="true"]{background:var(--pz-act);color:var(--pz-act-ink);box-shadow:0 10px 20px -12px rgba(3,30,25,.8)}
.pz .bks-ok{background:var(--pz-mint);color:var(--pz-mint-ink);box-shadow:0 0 0 10px color-mix(in srgb,var(--pz-mint) 16%,transparent);animation:pzPopIn .6s var(--pz-spring)}
@keyframes pzPopIn{from{transform:scale(.4);opacity:0}}
.pz .bks-done h3{font-family:var(--f-serif);font-size:28px;font-weight:700}
.pz .bks-card{border-radius:20px;box-shadow:var(--pz-sh)}
.pz .fbp-kinds button{border-radius:18px}.pz .fbp-item{border-radius:22px;box-shadow:var(--pz-sh)}

/* ---------- sign in: the website's deep green with soft rings, a white card in front */
.pz .lg{position:relative;overflow:hidden;isolation:isolate;background:var(--pz-hero);color:#fff}
.pz .lg-deco i{position:absolute;z-index:-1;border-radius:50%;border:1px solid rgba(255,255,255,.1);left:50%;top:42%;width:420px;height:420px;transform:translate(-50%,-50%);pointer-events:none}
.pz .lg-deco i:nth-child(2){width:640px;height:640px;border-style:dashed;border-color:rgba(255,255,255,.09);animation:pzSpinC 120s linear infinite}
.pz .lg-deco i:nth-child(3){width:900px;height:900px;border-color:rgba(255,255,255,.05)}
@keyframes pzSpinC{to{transform:translate(-50%,-50%) rotate(360deg)}}
.pz .lg-box{background:var(--pz-card);color:var(--pz-ink);border:0;border-radius:30px;box-shadow:0 44px 90px -34px rgba(0,0,0,.7);animation:pzRise .7s var(--pz-out) both}
.pz .lg-step h2{font-family:var(--f-serif);font-weight:600;font-size:32px;line-height:1.05;letter-spacing:0}
.pz .lg-pick{border-radius:20px}.pz .lg-pick.main{background:var(--pz-act);color:var(--pz-act-ink);box-shadow:0 14px 30px -18px rgba(3,30,25,.9)}
.pz .lg-go{background:var(--pz-act)!important;color:var(--pz-act-ink)!important}
.pz .lg-home{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.22);color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.pz .lg-home:hover{border-color:var(--pz-mint)}
.pz .lg .corner-lang{background:rgba(255,255,255,.1)!important}.pz .lg .corner-lang button{color:rgba(255,255,255,.75)}.pz .lg .corner-lang button[aria-pressed="true"]{background:#fff;color:var(--pz-ink)}
.pz .lg-staff a{color:rgba(255,255,255,.6);border-bottom-color:rgba(255,255,255,.3)}.pz .lg-staff a:hover{color:#fff}
.pz .lg-who{border-color:var(--pz-line)}.pz .lg-who small{color:var(--pz-brand)}
.pz .lg-code{letter-spacing:.42em}
/* the first-time form (gate) shares the bar */
.pz .gate .pp{padding-top:14px}

/* ---------- motion: cards rise in when a tab opens; everything you press gives a little */
@keyframes pzRise{from{opacity:0;transform:translateY(16px)}}
/* fill backwards only: an animation still in effect turns the column into the containing block of position:fixed sheets (doctor card opened off-screen) */
.pz main.pp>*,.pz .home-l>*,.pz .home-r>*{animation:pzRise .6s var(--pz-out) backwards}
.pz main.pp>.bks,.pz .home-l>.bks,.pz .home-r>.bks{animation:none}
.pz main.pp>:nth-child(2),.pz .home-l>:nth-child(2),.pz .home-r>:nth-child(2){animation-delay:.05s}
.pz main.pp>:nth-child(3),.pz .home-l>:nth-child(3),.pz .home-r>:nth-child(3){animation-delay:.1s}
.pz main.pp>:nth-child(4),.pz .home-l>:nth-child(4),.pz .home-r>:nth-child(4){animation-delay:.15s}
.pz main.pp>:nth-child(5),.pz .home-l>:nth-child(5),.pz .home-r>:nth-child(5){animation-delay:.2s}
.pz main.pp>:nth-child(n+6),.pz .home-l>:nth-child(n+6),.pz .home-r>:nth-child(n+6){animation-delay:.25s}
.pz :is(.btn,.pp-tile,.bks-go,.bks-types button,.bk-strip button,.bks-slots button,.bks-docs button,.hx-docs button,.lg-pick,.hx-pf button,.tk-add,.bnav button,.chips button,.fbp-kinds button,.qs-l button,.bks-x,.bks-b,.pp-av,.pf-out){
  transition:transform .45s var(--pz-spring),background-color .2s,box-shadow .2s,color .2s,filter .2s;-webkit-tap-highlight-color:transparent}
.pz :is(.btn,.pp-tile,.bks-go,.bks-types button,.bk-strip button,.bks-slots button,.bks-docs button,.hx-docs button,.lg-pick,.hx-pf button,.tk-add,.bnav button,.chips button,.fbp-kinds button,.qs-l button,.bks-x,.bks-b,.pp-av,.pf-out):active:not(:disabled){transform:scale(.95);transition-duration:.12s}
.pz :is(.pf-li,.hx-pr>button):active{background:var(--pz-soft)}
@media (hover:hover){.pz :is(.hx-post,.hx-promo,.tk:not(.big)){transition:transform .45s var(--pz-spring),box-shadow .3s}.pz :is(.hx-promo):hover{transform:translateY(-3px)}}
@media (prefers-reduced-motion:reduce){
  .pz *,.pz *::before,.pz *::after{animation:none!important;transition:none!important}
}

@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .pz .lg-pick.main :is(span),:root:not([data-theme="light"]) .pz .lg-pick.main::after{color:color-mix(in srgb,var(--pz-mint-ink) 70%,transparent)}
  :root:not([data-theme="light"]) .pz .bk-strip button.on small{color:color-mix(in srgb,var(--pz-mint-ink) 70%,transparent)}:root:not([data-theme="light"]) .pz .bk-strip button.on i.y{background:var(--pz-mint-ink)}}

/* ---------- «Миний шүд»: own tooth chart, plan, treatments, prescriptions ---------- */
.pz .mt-card{padding:14px 12px 12px;display:flex;flex-direction:column;gap:10px}
.pz .mt-card .tchart.compact .tooth{pointer-events:auto;cursor:pointer}
.pz .mt-hint{margin:0;font-size:12.5px;text-align:center}
.pz .mt-tooth{border-top:1px solid var(--line);padding-top:10px;display:flex;flex-direction:column;gap:8px}
.pz .mt-th{display:flex;align-items:center;gap:10px}.pz .mt-th b{font-size:15px}.pz .mt-th .linkbtn{margin-left:auto}
.pz .mt-cond{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted)}.pz .mt-cond i{width:9px;height:9px;border-radius:50%}
.pz .mt-ev{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.pz .mt-ev li{display:grid;grid-template-columns:84px minmax(0,1fr);gap:8px;font-size:13px;align-items:baseline}
.pz .mt-ev li small{color:var(--muted);font-size:11.5px;margin-right:6px}
.pz .mt-ev li.plan b{color:var(--accent)}
.pz .mt-plan{padding:6px 14px 12px}
.pz .mt-plan ul{list-style:none;margin:0;padding:0}
.pz .mt-plan li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.pz .mt-plan li:last-child{border-bottom:0}
.pz .mt-plan li span{display:flex;flex-direction:column;min-width:0}.pz .mt-plan li small{font-size:12px;color:var(--muted)}
.pz .mt-plan li em{font-style:normal;font-weight:600;white-space:nowrap}.pz .mt-plan li em.ok{color:var(--ok)}
.pz .mt-tot{display:flex;justify-content:space-between;align-items:center;padding:10px 0 12px;font-size:13.5px}.pz .mt-tot b{font-size:17px}
.pz .mt-done{margin-top:8px}.pz .mt-done summary{cursor:pointer;font-size:13px;color:var(--muted);padding:6px 0}
.pz .mt-note{font-size:11.5px;margin:8px 0 0}
.pz .hs-list li em{font-style:normal;font-weight:600;margin-left:auto}
.pz .mt-rx{padding:12px 14px}.pz .mt-rx-h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}.pz .mt-rx-h small{color:var(--muted)}
.pz .mt-rx ol{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px;font-size:13.5px}
.pz .mt-rx ol small{color:var(--muted)}.pz .mt-rx-u{font-size:12.5px;color:var(--muted)}
.pz .mt-rx-a{margin:8px 0 0;font-size:12.5px;background:var(--soft);border-radius:10px;padding:8px 10px}