/* ============================================================
   ARKADIA — 03-app.css
   My Arkadia app (shell, forms, health, lost pet, flyer, emergency, services, sheets, print)
   Load order matters: this file continues the cascade of the previous one.
   ============================================================ */
/* ================= My Arkadia + public additions ================= */
.eyebrow{margin:0 0 10px;font-size:.74rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--mid)}
.eyebrow--red{color:var(--red)}
body.in-app .site-header,body.in-app .mnav,body.in-app .site-footer,body.in-missing .site-header,body.in-missing .mnav,body.in-missing .site-footer{display:none!important}
body.in-app{background:#F5F9FC}
.int{display:inline-block;margin:0 0 0 8px;padding:2px 6px;border:1px dashed var(--mid);background:#fff;color:var(--mid);font-size:.62rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;line-height:1.4;vertical-align:middle;font-style:normal}
.em .int,.pn .int{background:transparent}
.pvbar{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;justify-content:space-between;background:#0E1E2E;color:#CFE0EF;font-size:.78rem;padding:8px var(--gutter);line-height:1.4}
.pvbar b{color:#fff;letter-spacing:.14em;margin-right:6px}
.pvbar__a{display:flex;gap:16px;flex-wrap:wrap}
.pvbar a,.pvbar button{color:#fff;background:none;border:0;padding:6px 0;font:inherit;font-weight:700;text-decoration:underline;text-underline-offset:3px;cursor:pointer}

/* ---- header: My Arkadia entry ---- */

/* ---- public: home teaser, My Arkadia page, updates ---- */
.myband{display:grid;gap:22px;align-items:center}
.myband h2{font-size:clamp(1.7rem,3.2vw,2.5rem);margin:0 0 12px}
.myband p{margin:0;color:var(--ink-2);max-width:36rem}
.myband__a{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
@media (min-width:900px){.myband{grid-template-columns:1.4fr 1fr}.myband__a{align-items:flex-start}}
.mini{margin:20px 0 0;color:var(--ink-2);font-size:.95rem}
.state-h{margin:0 0 6px;font-size:clamp(1.05rem,1.6vw,1.3rem);font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--navy)}
.state-h--q{color:var(--mid)}
.now{list-style:none;display:grid;gap:0;margin:28px 0 0}
.now li{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;padding:18px 0;border-top:1px solid var(--blue-200);align-items:start}
.now li:last-child{border-bottom:1px solid var(--blue-200)}
.now .ico{width:26px;height:26px;color:var(--navy);margin-top:2px}
.now strong{color:var(--navy);font-size:1.05rem}.now span{grid-column:2;color:var(--ink-2)}
@media (min-width:860px){.now{grid-template-columns:1fr 1fr;column-gap:56px}.now li:nth-last-child(2){border-bottom:1px solid var(--blue-200)}}
.themes{margin:28px 0 0;display:grid}
.themes div{display:grid;gap:6px 40px;padding:20px 0;border-top:1px solid var(--blue-300)}
.themes div:last-child{border-bottom:1px solid var(--blue-300)}
.themes dt{font-weight:800;color:var(--navy);font-size:1.08rem}.themes dd{margin:0;color:var(--ink-2)}
@media (min-width:860px){.themes div{grid-template-columns:20rem 1fr}}
.updates{display:grid;gap:26px;align-items:center}
.updates h2{margin:0 0 12px;font-size:clamp(1.8rem,3.4vw,2.6rem)}.updates p{margin:0;color:var(--ink-2);max-width:34rem}
.updates__f{display:flex;gap:10px;flex-wrap:wrap}
.updates__f input{flex:1 1 240px;min-height:54px;padding:12px 14px;border:1px solid var(--blue-300);background:#fff;font:inherit;color:var(--ink)}
.updates__n{margin:10px 0 0!important;font-size:.88rem;color:var(--muted)!important}
.updates .form-status[data-k=err]{border-left-color:var(--red)}
@media (min-width:900px){.updates{grid-template-columns:1.1fr 1fr}}

/* the hidden attribute always wins inside the app */
.ap [hidden],.sheet [hidden],.auth [hidden],.mp [hidden],.app [hidden]{display:none!important}

/* the app inherits nothing decorative from the public site */
.app *,.sheet *,.mp *,.auth *{box-sizing:border-box}
.ap a.item,.ap a.meter,.ap a.qa__b,.ap a.sos,.ap a.back,.ap a.phead__a,.tabs a,.appbar a,.tabbar a,.em a,.sheet a.btn,.sheet a.item,.ap a.btn,.item a{text-decoration:none}
.ap .link::after,.sheet .link::after,.app .link::after{display:none!important}
.ap .btn::after,.sheet .btn::after{display:none}
.item__x{display:block;margin-top:6px}
.item__x .int{margin:0}

.ap .field label.chk,.sheet .field label.chk,.auth label.chk{display:flex;margin:0;font-weight:500;color:var(--ink)}
.ap .field .seg__o,.sheet .field .seg__o{display:block;margin:0}

.ap .link,.sheet .link,.app .link{display:inline-flex;align-items:center;min-height:44px}
.tick{width:44px!important;height:44px!important}
.em__sw{min-height:44px;display:inline-flex;align-items:center}

/* ---- app shell ---- */
.app{min-height:100vh;background:#F5F9FC;color:var(--ink)}
.appbar{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--blue-200)}
.appbar__in{display:flex;align-items:center;gap:12px;max-width:1120px;margin:0 auto;padding:8px var(--gutter);min-height:64px}
.appbar__logo img{display:block;height:46px;width:auto}
.appbar__nav{display:none;gap:2px;margin-left:10px;flex:1}
.appbar__nav a{padding:12px 14px;font-weight:700;font-size:.88rem;letter-spacing:.05em;color:var(--ink-2);border-bottom:3px solid transparent}
.appbar__nav a[aria-current=page]{color:var(--navy);border-bottom-color:var(--navy)}
.petsw{margin-left:auto;display:flex;align-items:center;gap:10px;min-height:46px;padding:4px 12px 4px 6px;border:1px solid var(--blue-300);background:#fff;font:inherit;font-weight:700;color:var(--navy);cursor:pointer}
.petsw .ico{width:16px;height:16px}
.appbar__out{display:none;font-size:.82rem;color:var(--mid);font-weight:700;margin-left:8px}
.tabbar{position:fixed;bottom:0;left:0;right:0;z-index:60;display:grid;grid-template-columns:repeat(5,1fr);background:#fff;border-top:1px solid var(--blue-200);padding-bottom:env(safe-area-inset-bottom)}
.tabbar a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:62px;font-size:.72rem;font-weight:700;color:var(--muted);border-top:3px solid transparent}
.tabbar a[aria-current=page]{color:var(--navy);border-top-color:var(--navy)}
.tabbar .ico{width:24px;height:24px}
@media (min-width:900px){.appbar__nav{display:flex}.tabbar{display:none}.appbar__out{display:inline}.ap{padding-bottom:90px}}
body.app-auth .appbar__nav,body.app-auth .tabbar,body.app-auth .petsw{display:none!important}
.ap{max-width:720px;margin:0 auto;padding:22px var(--gutter) 120px}
.ap--emerg{max-width:none;padding:0 0 100px;background:var(--deep)}
.back{display:inline-flex;align-items:center;gap:6px;min-height:44px;margin:0 0 4px -4px;padding:0 8px 0 0;color:var(--mid);font-weight:700}
.back .ico{width:18px;height:18px}
.ptitle{margin:4px 0 10px;font-size:clamp(1.9rem,6vw,2.6rem);font-weight:800;color:var(--navy);letter-spacing:-.015em;line-height:1.1}
.lead{color:var(--ink-2);font-size:1.06rem;line-height:1.55;margin:0 0 20px}
.lead--s{font-size:.98rem;margin-bottom:16px}
.blk{margin:26px 0}
.blk__h{margin:0 0 12px;font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mid);font-weight:800}
.empty{color:var(--muted);padding:18px 0}
.calm{display:flex;gap:12px;align-items:center;margin:0;padding:18px;background:#fff;border:1px solid var(--blue-200);color:var(--navy);font-weight:600}
.calm .ico{width:24px;height:24px;flex:none}
.note-s{display:flex;gap:10px;align-items:flex-start;margin:12px 0;color:var(--ink-2);font-size:.92rem}
.note-s .ico{width:20px;height:20px;flex:none;color:var(--mid);margin-top:1px}
.note-b{margin:18px 0;padding:18px;background:var(--blue-100);color:var(--navy)}
.note-b p{margin:6px 0 14px}
.reassure{display:flex;gap:10px;align-items:flex-start;margin:12px 0 0;padding:12px 14px;background:var(--blue-50);color:var(--ink-2);font-size:.92rem}
.reassure .ico{width:20px;height:20px;flex:none;color:var(--red);margin-top:1px}

/* avatars */
.av{display:inline-grid;place-items:center;flex:none;width:52px;height:52px;border-radius:50%;overflow:hidden;background:var(--blue-100)}
.av img{width:100%;height:100%;object-fit:cover;display:block}
.av--i{background:var(--navy);color:#fff;font-weight:800;font-size:1.3rem}
.av--s{width:34px;height:34px;font-size:.95rem}.av--m{width:56px;height:56px}.av--l{width:76px;height:76px;font-size:1.7rem}.av--xl{width:104px;height:104px;font-size:2.2rem}

/* lists */
.list{display:grid;background:#fff;border:1px solid var(--blue-200);margin:0 0 18px}
.list--plain{border:0;background:transparent}
.item{display:flex;align-items:center;gap:14px;width:100%;min-height:64px;padding:14px 16px;border:0;border-bottom:1px solid var(--blue-100);background:#fff;color:var(--navy);text-align:left;font:inherit}
.item:last-child{border-bottom:0}
a.item:hover,button.item:hover{background:var(--blue-50)}
.item--btn{cursor:pointer}.item--static{cursor:default}
.item--flag{box-shadow:inset 4px 0 0 var(--red)}
.item--pet .av{flex:none}
.item__i{display:grid;place-items:center;flex:none;width:42px;height:42px;border-radius:50%;background:var(--blue-100);color:var(--navy)}
.item__i .ico{width:22px;height:22px}
.item__t{flex:1;min-width:0;display:flex;flex-direction:column}
.item__t strong{font-size:1.02rem;line-height:1.25}
.item__t small{display:block;margin-top:3px;color:var(--muted);font-size:.86rem;line-height:1.35;font-weight:500}
.item__r{color:var(--mid)!important;font-weight:700!important}
.item__c{width:18px;height:18px;flex:none;color:var(--blue-300)}
.list--sheet{margin:0 0 16px}
.more-d{margin:20px 0}.more-d summary{cursor:pointer;min-height:48px;display:flex;align-items:center;font-weight:700;color:var(--mid)}
.more-d__b{padding:6px 0 10px}
.btnrow{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin:14px 0}
.btnrow--col{flex-direction:column;align-items:stretch}.btnrow--top{justify-content:space-between}
.link{background:none;border:0;padding:6px 0;font:inherit;font-weight:700;color:var(--mid);text-decoration:underline;text-underline-offset:3px;cursor:pointer}

/* buttons (extends the site button) */
.btn--block{display:flex;width:100%;justify-content:center;align-items:center;gap:8px;min-height:56px;margin:0 0 10px}
.btn--sm{min-height:44px;padding:0 16px;font-size:.78rem}
.btn--danger{background:#fff;color:var(--red-deep);border:2px solid var(--red)}
.btn--danger:hover:not([disabled]){background:var(--red);color:#fff}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.btn .ico{width:20px;height:20px}
.actionbar{position:sticky;bottom:calc(64px + env(safe-area-inset-bottom));padding:12px 0 6px;background:linear-gradient(180deg,rgba(245,249,252,0),#F5F9FC 30%);margin-top:18px}
@media (min-width:900px){.actionbar{bottom:0}}

/* forms */
.ap .field,.sheet .field,.auth .field{margin:0 0 18px}
.ap .field label,.sheet .field label,.auth .field label,.sublabel{display:block;margin:0 0 6px;font-weight:700;color:var(--navy);font-size:.95rem}
.field small{font-weight:500;color:var(--muted)}
.ap input:not([type=radio]):not([type=checkbox]):not([type=file]),.ap select,.ap textarea,.sheet input:not([type=radio]):not([type=checkbox]):not([type=file]),.sheet select,.sheet textarea,.auth input:not([type=radio]):not([type=checkbox]){width:100%;min-height:54px;padding:12px 14px;border:1px solid var(--blue-300);border-radius:2px;background:#fff;font:inherit;color:var(--ink)}
.ap textarea,.sheet textarea{min-height:88px;resize:vertical}
.ap input:focus-visible,.ap select:focus-visible,.ap textarea:focus-visible,.sheet input:focus-visible,.sheet select:focus-visible,.sheet textarea:focus-visible,.auth input:focus-visible,.btn:focus-visible,.item:focus-visible,.seg__o input:focus-visible+span,.ftabs button:focus-visible,.link:focus-visible,.chk input:focus-visible{outline:3px solid var(--mid);outline-offset:2px}
.field.is-err input:not([type=radio]):not([type=checkbox]),.field.is-err select,.field.is-err textarea{border:2px solid var(--red);background:#FFF8F8}
.field.is-err>label,.field.is-err>.sublabel{color:var(--red-deep)}
.fld-err{display:flex;gap:8px;align-items:flex-start;margin:8px 0 0;color:var(--red-deep);font-weight:700;font-size:.92rem;line-height:1.35}
.fld-err[hidden]{display:none}
.fld-err::before{content:"!";flex:none;display:inline-grid;place-items:center;width:20px;height:20px;border:2px solid currentColor;border-radius:50%;font-size:.74rem;font-weight:900;line-height:1}
.req{color:var(--red);font-weight:800}
.hint{margin:8px 0 0;color:var(--muted);font-size:.88rem;line-height:1.4}
.legend{display:block;margin-top:6px;color:var(--muted);font-size:.86rem}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.seg{display:flex;border:1px solid var(--blue-300);background:#fff}
.seg__o{position:relative;flex:1}
.seg__o input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.seg__o span{display:grid;place-items:center;min-height:54px;padding:0 10px;text-align:center;font-weight:700;color:var(--ink-2)}
.seg__o+.seg__o{border-left:1px solid var(--blue-300)}
.seg__o input:checked+span{background:var(--navy);color:#fff}
.seg--big span{min-height:64px;font-size:1.08rem}.seg--sm span{min-height:42px;padding:0 16px}
.chk{display:flex;gap:12px;align-items:flex-start;min-height:48px;padding:10px 0;cursor:pointer;color:var(--ink)}
.chk input{flex:none;width:24px;height:24px;margin:1px 0 0;accent-color:var(--navy)}
.chk--lg{margin:6px 0 18px;line-height:1.45}
.chkgrp{border:0;padding:0;margin:0 0 14px}
.radios .chk{padding:8px 0}
.tags{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px;padding:0}
.tags li{display:flex;align-items:center;gap:4px;padding:6px 4px 6px 12px;background:var(--blue-100);color:var(--navy);font-weight:600}
.tags button{display:grid;place-items:center;width:34px;height:34px;border:0;background:none;color:var(--navy);cursor:pointer}
.tags .ico{width:14px;height:14px}
.addrow{display:flex;gap:10px;margin:0 0 8px}.addrow input{flex:1}
.mlist{list-style:none;margin:0 0 10px;padding:0}
.mlist li{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--blue-100)}
.mlist small{display:block;color:var(--muted)}.mlist__b{display:flex;gap:12px}
.labrow{display:grid;grid-template-columns:1.4fr 1fr .8fr;gap:8px;margin-bottom:8px}
.tgl{display:flex;align-items:center;gap:16px;justify-content:space-between;min-height:64px;padding:14px 16px;background:#fff;border-bottom:1px solid var(--blue-100);cursor:pointer}
.tgl__t{display:flex;flex-direction:column}.tgl__t small{color:var(--muted);font-weight:500;margin-top:3px}
.tgl input{position:absolute;opacity:0}
.tgl__s{flex:none;position:relative;width:52px;height:30px;background:var(--blue-300);transition:background .2s}
.tgl__s::after{content:"";position:absolute;left:3px;top:3px;width:24px;height:24px;background:#fff;transition:transform .2s}
.tgl input:checked+.tgl__s{background:var(--navy)}.tgl input:checked+.tgl__s::after{transform:translateX(22px)}
.tgl input:focus-visible+.tgl__s{outline:3px solid var(--mid);outline-offset:2px}

/* profile editor */
.edhead{display:flex;justify-content:space-between;align-items:center;gap:12px}
.savestate{flex:none;display:inline-flex;align-items:center;gap:6px;font-size:.84rem;font-weight:700;color:var(--muted)}
.savestate[data-s=saved]::before{content:"";width:8px;height:8px;background:var(--navy);display:inline-block}
.savestate[data-s=saving]::before{content:"";width:8px;height:8px;background:var(--blue-300);display:inline-block}
.meters{display:grid;gap:10px;margin:16px 0}
.meter{display:grid;grid-template-columns:1fr auto;gap:8px 12px;padding:14px 16px;background:#fff;border:1px solid var(--blue-200);color:var(--navy)}
.meter__l{font-weight:700}.meter__n{color:var(--muted);font-weight:600;font-size:.9rem}
.meter__t{grid-column:1/-1;height:6px;background:var(--blue-100)}.meter__t i{display:block;height:100%;background:var(--navy)}
.sec{background:#fff;border:1px solid var(--blue-200);margin:0 0 10px}
.sec>summary{display:flex;align-items:center;gap:12px;min-height:64px;padding:12px 16px;cursor:pointer;list-style:none;font-weight:800;color:var(--navy)}
.sec>summary::-webkit-details-marker{display:none}
.sec__t{flex:1;font-size:1.05rem}.sec__s{font-size:.84rem;font-weight:700;color:var(--muted)}.sec__s[data-done="1"]{color:var(--navy)}
.sec>summary .ico{width:18px;height:18px;color:var(--mid);transition:transform .2s}.sec[open]>summary .ico{transform:rotate(180deg)}
.sec__b{padding:6px 16px 8px}
.sec .sublabel{margin-top:10px}
.wsum{display:flex;flex-direction:column;margin:6px 0 10px}.wsum strong{font-size:1.5rem;color:var(--navy)}.wsum span{color:var(--muted)}
.photo{display:flex;gap:16px;align-items:center;margin:8px 0 18px}
.photo__b{cursor:pointer}

/* pet header + facts */
.phead{display:flex;gap:16px;align-items:center;margin:6px 0 16px}
.phead h1{margin:0;font-size:clamp(1.9rem,6vw,2.6rem);font-weight:800;color:var(--navy);line-height:1.05}
.phead__s{margin:4px 0 0;color:var(--ink-2)}
.phead--big{align-items:center}
.facts{display:grid;margin:0 0 18px;background:#fff;border:1px solid var(--blue-200)}
.facts>div{display:flex;justify-content:space-between;gap:16px;padding:13px 16px;border-bottom:1px solid var(--blue-100)}
.facts>div:last-child{border-bottom:0}
.facts dt{color:var(--muted);font-weight:600}.facts dd{margin:0;text-align:right;color:var(--navy);font-weight:700}
.sos{display:flex;align-items:center;gap:14px;margin:0 0 20px;padding:14px 16px;background:var(--navy);color:#fff;min-height:68px;border-left:6px solid var(--red)}
.sos .ico{width:26px;height:26px;flex:none}.sos span{flex:1;display:flex;flex-direction:column}.sos small{opacity:.8;font-weight:500}
.sos--b{margin-bottom:18px}
.qa{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.qa__b{display:flex;flex-direction:column;align-items:flex-start;gap:10px;min-height:88px;padding:14px;background:#fff;border:1px solid var(--blue-200);color:var(--navy);font:inherit;font-weight:700;text-align:left;cursor:pointer}
.qa__b .ico{width:24px;height:24px;color:var(--mid)}.qa__b:hover{background:var(--blue-50)}

/* auth */
.auth{max-width:440px;margin:6vh auto 0}
.auth h1{margin:0 0 10px;font-size:clamp(2rem,7vw,2.8rem);font-weight:800;color:var(--navy);line-height:1.08}
.auth__alt{margin:22px 0 0;color:var(--ink-2)}.auth__alt a{font-weight:700;color:var(--navy);text-decoration:underline}
.hero-empty{margin-top:8vh}.hero-empty h1{margin:0 0 10px;font-size:clamp(2rem,7vw,2.8rem);font-weight:800;color:var(--navy)}

/* health */
.tabs{display:flex;gap:2px;margin:4px 0 18px;border-bottom:1px solid var(--blue-200);overflow-x:auto}
.tabs a{padding:12px 16px;font-weight:700;color:var(--ink-2);border-bottom:3px solid transparent;white-space:nowrap}
.tabs a[aria-current=page]{color:var(--navy);border-bottom-color:var(--navy)}
.ftabs{display:flex;gap:6px;overflow-x:auto;margin:0 0 16px;padding-bottom:2px;scrollbar-width:none}
.ftabs button{flex:none;min-height:44px;padding:0 14px;border:1px solid var(--blue-300);background:#fff;font:inherit;font-weight:700;color:var(--ink-2);cursor:pointer}
.ftabs button[aria-selected=true]{background:var(--navy);color:#fff;border-color:var(--navy)}
.tl{list-style:none;margin:18px 0 0;padding:0;border-left:2px solid var(--blue-200)}
.tl__i{position:relative;display:grid;grid-template-columns:1fr auto;gap:4px 10px;padding:0 0 22px 20px}
.tl__i::before{content:"";position:absolute;left:-7px;top:4px;width:12px;height:12px;background:#fff;border:3px solid var(--navy);border-radius:50%}
.tl__d{grid-column:1/-1;font-size:.8rem;font-weight:800;letter-spacing:.06em;color:var(--mid);text-transform:uppercase}
.tl__b{display:flex;flex-direction:column;gap:2px}.tl__b strong{color:var(--navy)}.tl__b small{color:var(--muted)}
.tl__k{display:flex;align-items:center;gap:6px;font-size:.8rem;font-weight:700;color:var(--ink-2)}.tl__k .ico{width:16px;height:16px}
.tl__doc{display:flex;gap:6px;align-items:center}.tl__doc .ico{width:14px;height:14px}
.tl__x{align-self:start}
.hist{list-style:none;margin:0 0 16px;padding:0;background:#fff;border:1px solid var(--blue-200)}
.hist li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 16px;border-bottom:1px solid var(--blue-100)}
.hist li:last-child{border-bottom:0}.hist small{display:block;color:var(--muted);margin-top:2px}.hist strong{color:var(--navy)}
.wchart{margin:8px 0 16px;background:#fff;border:1px solid var(--blue-200);padding:12px 12px 8px}
.wchart svg{width:100%;height:auto;display:block}.wchart figcaption{color:var(--muted);font-size:.84rem;margin-top:4px}
.idcard{display:flex;gap:16px;align-items:center;padding:16px;background:#fff;border:1px solid var(--blue-200)}
.idcard div{display:flex;flex-direction:column;gap:3px;color:var(--ink-2)}.idcard strong{color:var(--navy);font-size:1.15rem}

/* lost pet */
.missing-h{margin:6px 0 18px}.missing-h__k{display:inline-flex;align-items:center;gap:8px;font-size:.78rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--red-deep)}
.missing-h__k .ico{width:18px;height:18px}
.missing-h h1{margin:6px 0;font-size:clamp(2.2rem,8vw,3.2rem);font-weight:800;color:var(--navy);line-height:1}.missing-h p{margin:0;color:var(--ink-2)}
.reun{display:flex;gap:16px;align-items:flex-start;padding:20px;background:var(--blue-100);color:var(--navy);margin-bottom:18px}.reun .ico{width:32px;height:32px;flex:none}.reun h1{margin:0 0 6px;font-size:1.9rem}.reun p{margin:0}
.mp{max-width:560px;margin:0 auto;padding:22px var(--gutter) 60px}
.mphead{padding:10px var(--gutter);border-bottom:1px solid var(--blue-200);background:#fff}.mphead img{height:44px;width:auto;display:block}
.mp h1{margin:6px 0 10px;font-size:clamp(2.4rem,9vw,3.4rem);font-weight:800;color:var(--navy);line-height:1}
.mp__ph{display:block;width:100%;max-height:420px;object-fit:cover;margin:0 0 18px}
.mp__a{margin:22px 0 12px}
.note-s strong{color:var(--navy)}

/* flyer */
.flyer{display:flex;flex-direction:column;align-items:center;text-align:center;width:100%;max-width:520px;margin:22px auto;padding:6%;aspect-ratio:210/297;background:#fff;color:#111;border:1px solid var(--blue-200);font-family:var(--sans)}
.flyer[data-size=Letter]{aspect-ratio:8.5/11}
.flyer__top span{display:block;font-size:clamp(2.6rem,13vw,4.6rem);font-weight:900;letter-spacing:.08em;line-height:1;padding-bottom:8px;border-bottom:8px solid var(--red)}
.flyer__ph{width:100%;max-height:36%;object-fit:cover;margin:4% 0 2%}
.flyer__n{margin:2% 0 0;font-size:clamp(2rem,9vw,3rem);font-weight:900;text-transform:uppercase}
.flyer__d,.flyer__m,.flyer__s{margin:1.6% 0 0;font-size:clamp(.8rem,2.6vw,1.05rem);line-height:1.4}
.flyer__c{display:flex;gap:14px;align-items:center;margin-top:auto;padding-top:3%;text-align:left}
.flyer__qr{width:clamp(80px,22vw,128px);height:auto;flex:none}.flyer__c div{display:flex;flex-direction:column;gap:4px;font-size:clamp(.8rem,2.6vw,1rem)}
.flyer__f{margin:2% 0 0;font-size:clamp(.7rem,2vw,.85rem);color:#444}
.flopts{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;margin:10px 0 14px}
.idsheet{background:#fff;border:1px solid var(--blue-200);padding:20px;margin-bottom:18px}.idsheet header{display:flex;gap:16px;align-items:center;margin-bottom:14px}.idsheet h2{margin:0;font-size:1.6rem;color:var(--navy)}.idsheet p{margin:2px 0;color:var(--ink-2)}.idsheet .facts{border:0;margin:0}

/* emergency */
.em{max-width:560px;margin:0 auto;padding:22px var(--gutter) 40px;color:#fff}
.em__h{margin-bottom:20px}.em__k{display:inline-block;font-size:.78rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:#fff;padding-left:12px;border-left:4px solid var(--red)}
.em__h h1{margin:10px 0 4px;font-size:clamp(2.2rem,9vw,3.2rem);font-weight:800;color:#fff;line-height:1}.em__h p{margin:0;color:#C4D4E3}
.em__sw{background:none;border:0;color:#fff;font:inherit;font-weight:700;text-decoration:underline;cursor:pointer;padding:6px 0}
.em__b{display:flex;align-items:center;gap:16px;width:100%;min-height:92px;margin:0 0 12px;padding:18px;background:#fff;color:var(--navy);border:0;border-left:6px solid var(--mid);text-align:left;font:inherit;cursor:pointer}
.em__b--p{border-left-color:var(--red)}
.em__b .ico{width:30px;height:30px;flex:none;color:var(--navy)}
.em__b span{flex:1;display:flex;flex-direction:column}.em__b strong{font-size:1.12rem;line-height:1.2;text-transform:uppercase;letter-spacing:.02em}.em__b small{color:var(--ink-2);font-weight:500;margin-top:3px}
.em__d{margin:18px 0;border:1px solid rgba(255,255,255,.25)}.em__d summary{display:flex;justify-content:space-between;align-items:center;min-height:56px;padding:0 16px;font-weight:700;cursor:pointer;list-style:none}
.em__d summary::-webkit-details-marker{display:none}.em__d summary .ico{width:18px;height:18px}
.facts--dark{background:transparent;border:0;margin:0}.facts--dark>div{border-bottom-color:rgba(255,255,255,.14)}.facts--dark dt{color:#9FB6CA}.facts--dark dd{color:#fff}
.em__n{margin:0;padding:12px 16px;color:#9FB6CA;font-size:.88rem}
.em__more{display:flex;gap:10px;align-items:center;width:100%;min-height:56px;padding:0 16px;border:1px dashed rgba(255,255,255,.45);background:transparent;color:#fff;font:inherit;font-weight:700;cursor:pointer;margin-bottom:18px}.em__more .ico{width:18px;height:18px}
.em__log{list-style:none;margin:0 0 18px;padding:0;color:#C4D4E3;font-size:.9rem}.em__log li{padding:6px 0;border-bottom:1px solid rgba(255,255,255,.1)}.em__log time{font-weight:800;color:#fff;margin-right:8px}
.em__x{margin:0 0 14px;color:#9FB6CA;font-size:.86rem;line-height:1.45}.em__x--l{color:var(--muted)}
.em__end{background:none;border:1px solid rgba(255,255,255,.4);color:#fff;min-height:48px;padding:0 18px;font:inherit;font-weight:700;cursor:pointer}
.share-b{margin:16px 0;padding:14px 16px;background:var(--blue-50);color:var(--navy)}.share-b ul{margin:8px 0 0;padding-left:18px;color:var(--ink-2)}
.clinic{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:14px 16px;border-bottom:1px solid var(--blue-100)}.clinic small{display:block;color:var(--muted)}.clinic__a{display:flex;gap:8px;flex:none}

/* services */
.smart{display:flex;gap:16px;align-items:center;justify-content:space-between;margin:16px 0;padding:16px;background:var(--blue-100);color:var(--navy)}
.smart p{margin:6px 0 0;color:var(--ink-2);font-size:.92rem}.smart strong .ico{width:18px;height:18px;vertical-align:-3px;margin-right:6px}.smart--s{margin-top:22px}
.tick{display:grid;place-items:center;flex:none;width:36px;height:36px;border:2px solid var(--navy);background:#fff;color:transparent;cursor:pointer}.tick[aria-checked=true]{background:var(--navy);color:#fff}.tick .ico{width:18px;height:18px}
.is-done .item__t{opacity:.5;text-decoration:line-through}
.mem{list-style:none;margin:20px 0 0;padding:0}.mem__i{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--blue-200)}
.mem__i img{width:84px;height:84px;object-fit:cover;flex:none}.mem__ic{display:grid;place-items:center;width:84px;height:84px;background:var(--blue-100);color:var(--navy);flex:none}.mem__ic .ico{width:28px;height:28px}
.mem time{display:block;font-size:.8rem;font-weight:800;color:var(--mid);text-transform:uppercase;letter-spacing:.06em}.mem strong{display:block;color:var(--navy)}.mem p{margin:4px 0 0;color:var(--ink-2)}
.mship{display:flex;flex-direction:column;gap:4px;padding:18px;background:var(--navy);color:#fff;margin:6px 0 16px}.mship strong{font-size:1.25rem}.mship span{color:#C4D4E3}
.tier{background:#fff;border:1px solid var(--blue-200);margin:0 0 10px}.tier.is-cur{border-color:var(--navy);border-width:2px}
.tier>summary{display:flex;align-items:center;gap:12px;min-height:64px;padding:12px 16px;list-style:none;cursor:pointer}.tier>summary::-webkit-details-marker{display:none}
.tier>summary>span{flex:1;display:flex;flex-direction:column}.tier strong{color:var(--navy);font-size:1.1rem}.tier small{color:var(--muted)}.tier em{font-style:normal;font-size:.76rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--mid)}
.tier>summary .ico{width:18px;height:18px;color:var(--mid)}.tier[open]>summary .ico{transform:rotate(180deg)}.tier ul{margin:0;padding:0 16px 16px 34px;color:var(--ink-2)}.tier li{margin:6px 0}
.ai{display:flex;flex-direction:column;gap:10px;min-height:120px;margin:0 0 14px}
.ai__m{max-width:88%;padding:12px 14px;background:#fff;border:1px solid var(--blue-200);color:var(--ink)}.ai__m p{margin:0}.ai__m small{display:block;margin-top:8px;color:var(--muted)}
.ai__m--u{align-self:flex-end;background:var(--navy);color:#fff;border-color:var(--navy)}
.ai__p{display:flex;gap:8px;overflow-x:auto;margin:0 0 12px;padding-bottom:4px}
.ai__c{flex:none;min-height:44px;padding:0 14px;border:1px solid var(--blue-300);background:#fff;font:inherit;font-weight:600;color:var(--navy);cursor:pointer;text-align:left}
.ai__f{display:flex;gap:10px}.ai__f input{flex:1}.ai__x{margin-top:14px}
.map{margin:0 0 16px;background:#fff;border:1px solid var(--blue-200)}.map svg{display:block;width:100%;height:auto}.map figcaption{padding:8px 12px;color:var(--muted);font-size:.84rem}
.steps{margin:0 0 20px;padding:0;list-style:none;counter-reset:s}.steps li{counter-increment:s;display:grid;grid-template-columns:auto 1fr;gap:2px 14px;padding:14px 0;border-bottom:1px solid var(--blue-200)}
.steps li::before{content:counter(s);grid-row:span 2;display:grid;place-items:center;width:32px;height:32px;background:var(--navy);color:#fff;font-weight:800;border-radius:50%}.steps strong{color:var(--navy)}.steps span{color:var(--ink-2)}
.checks{list-style:none;margin:0 0 16px;padding:0;background:#fff;border:1px solid var(--blue-200)}.checks li{display:flex;gap:12px;align-items:center;padding:13px 16px;border-bottom:1px solid var(--blue-100);color:var(--ink-2)}.checks li:last-child{border-bottom:0}.checks .ico{width:20px;height:20px;flex:none;color:var(--muted)}.checks li.ok{color:var(--navy);font-weight:600}.checks li.ok .ico{color:var(--navy)}.checks--plain .ico{color:var(--mid)}
.refcode{display:flex;flex-direction:column;gap:4px;padding:16px;background:#fff;border:1px dashed var(--mid);margin:0 0 14px;word-break:break-all}.refcode span{font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--mid)}.refcode strong{color:var(--navy)}
.shopimg{margin:0 0 16px;background:#0f1115}.shopimg img{display:block;width:100%;height:auto}
.split{display:grid;gap:0;margin:0 0 16px;background:#fff;border:1px solid var(--blue-200)}.split section{padding:18px}.split h2{margin:0 0 10px;font-size:1.05rem;color:var(--navy)}.split ul{margin:0;padding-left:18px;color:var(--ink-2)}.split li{margin:6px 0}.split__b{background:var(--navy)}.split__b h2,.split__b ul{color:#fff}
@media (min-width:640px){.split{grid-template-columns:1fr 1fr}}
.acct-h{display:flex;gap:16px;align-items:center;margin:8px 0 18px}.acct-h div{display:flex;flex-direction:column}.acct-h span:not(.av){color:var(--muted)}

/* sheet + toast */
.sheet{position:fixed;inset:0;z-index:200;display:flex;align-items:flex-end;justify-content:center;opacity:0;transition:opacity .2s}
.sheet.on{opacity:1}.sheet__bg{position:absolute;inset:0;background:rgba(19,43,66,.55)}
.sheet__box{position:relative;width:100%;max-width:560px;max-height:92vh;max-height:92dvh;overflow:auto;padding:0 var(--gutter) calc(24px + env(safe-area-inset-bottom));background:#fff;transform:translateY(24px);transition:transform .22s;outline:none}
.sheet.on .sheet__box{transform:none}
.sheet__head{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 0 10px;background:#fff}
.sheet__head h2{margin:0;font-size:1.3rem;color:var(--navy);line-height:1.2}
.sheet__x{display:grid;place-items:center;flex:none;width:46px;height:46px;border:0;background:var(--blue-50);color:var(--navy);cursor:pointer}.sheet__x .ico{width:20px;height:20px}
body.sheet-open{overflow:hidden}
@media (min-width:700px){.sheet{align-items:center}.sheet__box{padding:0 28px 28px}}
.toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom));z-index:300;max-width:calc(100% - 32px);padding:12px 18px;background:var(--deep);color:#fff;font-weight:600;transform:translate(-50%,16px);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}
.toast.on{opacity:1;transform:translate(-50%,0)}
@media (min-width:900px){.toast{bottom:32px}}

/* print: only the flyer / Pet ID */
@media print{
  body.print-flyer .pvbar,body.print-flyer .site-header,body.print-flyer .site-footer,body.print-flyer .appbar,body.print-flyer .tabbar,body.print-flyer .noprint,body.print-flyer .toast,body.print-flyer .sheet,body.print-flyer .mnav,body.print-flyer .skip{display:none!important}
  body.print-flyer,body.print-flyer .app{background:#fff!important}
  body.print-flyer .ap{padding:0!important;max-width:none!important}
  body.print-flyer .flyer{width:100%;max-width:none;margin:0;border:0;min-height:100vh;padding:10mm;aspect-ratio:auto;page-break-inside:avoid}
  body.print-flyer .idsheet{border:0}
}
@media (prefers-reduced-motion:reduce){.sheet,.sheet__box,.toast,.tgl__s,.tgl__s::after{transition:none}}