:root {
  --ink:#231F20; --mute:#767676; --line:#e2e2e2; --bg:#f6f6f4; --card:#fff;
  --accent:#2f6f4f; --brand:#FBB859; --warn:#b4560d; --bad:#b3261e; --ok:#2f7d32;
}
* { box-sizing:border-box; margin:0; padding:0; }
body { font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
       color:var(--ink); background:var(--bg); line-height:1.4; -webkit-text-size-adjust:100%; }
button, input, select { font:inherit; color:inherit; }

.top { display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap;
       padding:12px 16px; background:var(--card); border-bottom:2px solid var(--ink); }
.brand { display:flex; align-items:center; gap:10px; }
.logo { height:56px; width:auto; display:block; }
.top h1 { font-size:1.1rem; font-weight:800; }
.top p { font-size:.8rem; color:var(--mute); }
.top-right { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.top-right select, .staff input { border:1px solid var(--line); border-radius:8px; padding:6px 8px; background:#fff; }
.staff { font-size:.8rem; color:var(--mute); display:flex; gap:6px; align-items:center; }
.staff input { width:5.5em; text-transform:uppercase; }

.tabs { display:flex; gap:4px; padding:8px 16px 0; background:var(--card); border-bottom:1px solid var(--line);
        position:sticky; top:0; z-index:10; overflow-x:auto; }
.tabs button { border:0; background:none; padding:10px 14px; font-weight:650; color:var(--mute);
               border-bottom:3px solid transparent; cursor:pointer; white-space:nowrap; }
.tabs button.on { color:var(--ink); border-bottom-color:var(--brand); }

main { max-width:1100px; margin:0 auto; padding:16px; }
.tab { display:none; } .tab.on { display:block; }

.card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:16px; margin-bottom:14px; }
.card h2 { font-size:1rem; margin-bottom:6px; }
.mute { color:var(--mute); } .small { font-size:.8rem; }
.row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-top:10px; }
ul.small { margin:6px 0 0 18px; }

.tools { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.tools input[type=search] { flex:1; min-width:180px; border:1px solid var(--line); border-radius:99px; padding:8px 14px; background:#fff; }
.pill { font-size:.8rem; font-weight:650; padding:8px 14px; border:1px solid var(--line); border-radius:99px;
        background:#fff; cursor:pointer; display:inline-block; }
.pill.on { background:var(--ink); color:#fff; border-color:var(--ink); }
.pill.danger { color:var(--bad); }

.drop { display:block; border:2px dashed #c9c9c9; border-radius:12px; padding:28px; text-align:center;
        margin-top:12px; cursor:pointer; color:var(--mute); background:#fafafa; }
.drop.over { border-color:var(--accent); background:#eef6f1; }
.drop input { display:none; }
#importLog div { padding:4px 0; }
.okc { color:var(--ok); } .warnc { color:var(--warn); } .badc { color:var(--bad); }

/* Today */
.stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:10px; margin-bottom:14px; }
.stat { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:12px 14px; }
.stat b { display:block; font-size:1.6rem; }
.stat span { font-size:.75rem; color:var(--mute); text-transform:uppercase; letter-spacing:.06em; }
.bar { height:6px; background:#eee; border-radius:3px; margin-top:6px; overflow:hidden; }
.bar i { display:block; height:100%; background:var(--accent); }
.alerts li { list-style:none; padding:8px 0; border-bottom:1px solid var(--line); font-size:.9rem; }
.alerts li:last-child { border-bottom:0; }
.cols { display:grid; grid-template-columns:1fr; gap:14px; }
@media (min-width:760px) { .cols { grid-template-columns:1fr 1fr; } }
.mini li { list-style:none; padding:6px 0; border-bottom:1px solid var(--line); font-size:.9rem; display:flex; justify-content:space-between; gap:8px; }

/* Guest board */
h3.sec { font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--mute);
         margin:18px 0 6px; border-bottom:1px solid var(--ink); padding-bottom:5px; }
.rooms { display:grid; grid-template-columns:1fr; column-gap:26px; background:var(--card);
         border:1px solid var(--line); border-radius:12px; padding:4px 12px; }
@media (min-width:760px) { .rooms { grid-template-columns:1fr 1fr; } }
.room { display:flex; align-items:center; gap:12px; padding:9px 2px; border-bottom:1px solid var(--line); min-height:46px; }
.room .no { flex:0 0 3rem; font-weight:800; font-size:.85rem; color:var(--mute); text-align:center;
            background:#f1f1f1; border-radius:6px; padding:5px 0; }
.room .who { flex:1; display:flex; flex-wrap:wrap; gap:6px 14px; }
.room.free { color:#bbb; } .room.free .who::before { content:"—"; }
.room.free .no { background:#fafafa; color:#ccc; }
.hide-free .room.free { display:none; }
.pet { display:inline-flex; align-items:center; flex-wrap:wrap; gap:4px; cursor:pointer; }
.pet .name { font-weight:650; }
.pet .tag { font-size:.7rem; color:var(--mute); }
.chip { font-size:.62rem; font-weight:800; letter-spacing:.04em; padding:.25em .6em; border-radius:.9em; white-space:nowrap; text-transform:uppercase; }
/* ProPet pet-code colours, solid. Text is dark or white, whichever reads better on that colour (WCAG contrast). */
.c-a { background:#E70AF2; color:#1a1a1a; } .c-c { background:#0781FA; color:#1a1a1a; }
.c-dnm { background:#F71F07; color:#1a1a1a; } .c-dnm-m { background:#ED3024; color:#1a1a1a; }
.c-intact { background:#B54A3E; color:#fff; } .c-meds { background:#46819E; color:#1a1a1a; }
.room .no.c-a { background:#E70AF2; color:#1a1a1a; } .room .no.c-c { background:#0781FA; color:#1a1a1a; }
.room .no.c-dnm { background:#F71F07; color:#1a1a1a; } .room .no.c-dnm-m { background:#ED3024; color:#1a1a1a; }
/* printed guest list: Group cell gets an inner coloured border instead of a solid fill */
#printArea .pg-grp.c-a, #printArea .pg-grp.c-c, #printArea .pg-grp.c-dnm, #printArea .pg-grp.c-dnm-m { background:#fff; color:#1a1a1a; }
#printArea .pg-grp.c-a { box-shadow:inset 0 0 0 2.5px #E70AF2; } #printArea .pg-grp.c-c { box-shadow:inset 0 0 0 2.5px #0781FA; }
#printArea .pg-grp.c-dnm { box-shadow:inset 0 0 0 2.5px #F71F07; } #printArea .pg-grp.c-dnm-m { box-shadow:inset 0 0 0 2.5px #ED3024; }
.c-a, .c-c, .c-dnm, .c-dnm-m, .c-intact, .c-meds { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
.c-new { background:#FFD400; color:#1a1a1a; } .c-day { background:#e8eef3; color:#33536b; }
.codes { display:flex; flex-wrap:wrap; gap:4px; }
.c-misc { background:#eee; color:#555; } .c-in { background:#dff3ea; color:#1f6b45; } .c-out { background:#f6e3e3; color:#8b1a1a; }

/* Med board */
.slot { background:var(--card); border:1px solid var(--line); border-radius:12px; margin-bottom:14px; overflow:hidden; }
.slot-h { display:flex; justify-content:space-between; align-items:center; padding:10px 14px; background:#fafafa; border-bottom:1px solid var(--line); }
.slot-h h3 { font-size:1rem; }
.dose { display:grid; grid-template-columns:1fr auto; gap:6px 12px; padding:10px 14px; border-bottom:1px solid var(--line); align-items:center; }
.dose:last-child { border-bottom:0; }
.dose .what { font-size:.95rem; }
.dose .what b { font-weight:700; }
.dose .det { font-size:.78rem; color:var(--mute); }
.dose .flag { font-size:.7rem; font-weight:800; color:var(--warn); }
.dose.done { background:#f3faf5; } .dose.done .what { color:var(--mute); }
.dose.refused { background:#fdf3f2; }
.acts { display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end; }
.acts button { border:1px solid var(--line); background:#fff; border-radius:8px; padding:8px 12px; font-weight:700; font-size:.8rem; cursor:pointer; }
.acts button.give { background:var(--accent); color:#fff; border-color:var(--accent); }
.acts .stamp { font-size:.78rem; color:var(--mute); text-align:right; }
.hide-done .dose.done { display:none; }

/* Potty */
.potty { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:10px; }
.dog { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:12px; }
.dog .hd { display:flex; justify-content:space-between; gap:8px; align-items:baseline; }
.dog .hd b { font-size:1rem; }
.dog .hd span { font-size:.75rem; color:var(--mute); font-weight:700; }
.dog .last { font-size:.75rem; color:var(--mute); margin:4px 0 8px; min-height:1.1em; }
.dog .last.stale { color:var(--warn); font-weight:700; }
.pbtns { display:grid; grid-template-columns:repeat(5,1fr); gap:5px; }
.pbtns button { border:1px solid var(--line); border-radius:8px; background:#fff; padding:9px 0; cursor:pointer; font-size:.78rem; font-weight:700; }
.pbtns button:active { transform:scale(.97); }
.pbtns .pee { background:#fff8d6; } .pbtns .poo { background:#efe3d6; } .pbtns .soft { background:#f5e6c8; } .pbtns .dia { background:#fbdada; }
.lock { background:#f1f1f1; border:1px solid var(--line); border-radius:10px; padding:10px 14px; margin-bottom:12px; font-size:.85rem; color:#444; }
.dog .hist { margin-top:8px; font-size:.72rem; color:var(--mute); display:flex; flex-wrap:wrap; gap:4px; }
.dog .hist span { background:#f3f3f3; border-radius:6px; padding:2px 6px; cursor:pointer; }
.dog .hist span.dia { background:#fbdada; color:#8b1a1a; } .dog .hist span.soft { background:#f5e6c8; color:#6b4a12; }
.dog .hist span:not([data-rm]) { cursor:default; }

dialog { border:0; border-radius:14px; padding:20px; max-width:560px; width:92vw; margin:auto; }
dialog::backdrop { background:rgba(0,0,0,.35); }
#petDlgBody h2 { font-size:1.2rem; } #petDlgBody dl { display:grid; grid-template-columns:auto 1fr; gap:4px 12px; margin:12px 0; font-size:.88rem; }
#petDlgBody dt { color:var(--mute); } #petDlgBody .notes { white-space:pre-wrap; font-size:.82rem; background:#f7f7f7; border-radius:8px; padding:10px; margin:8px 0; max-height:220px; overflow:auto; }
#petDlg form { text-align:right; margin-top:10px; }
.staff-notes { margin:4px 0 12px; } #petDlg .staff-notes form { text-align:left; margin-top:6px; }
.sn-head { display:flex; justify-content:space-between; align-items:center; gap:8px; }
#snForm { display:grid; gap:6px; background:#f7f7f7; border-radius:8px; padding:10px; }
#snForm[hidden] { display:none; }
#snForm select, #snForm textarea { border:1px solid var(--line); border-radius:8px; padding:7px 8px; font:inherit; font-size:.88rem; background:#fff; color:var(--ink); width:100%; }
.sn-foot { display:flex; align-items:center; gap:6px; } .sn-foot span { margin-right:auto; }
.sn-group { margin-top:8px; }
.sn-cat { display:inline-block; font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; padding:2px 8px; border-radius:6px; background:#eef1f4; color:#4a5560; }
.sn-health { background:#fde8e6; color:var(--bad); } .sn-behaviour { background:#fff3d6; color:#8a5a00; } .sn-friend { background:#e8f0fb; color:#1f5fa8; } .sn-food { background:#e6f4ea; color:var(--ok); }
.sn-item { font-size:.86rem; padding:5px 0 5px 10px; border-left:3px solid var(--line); margin:4px 0 0 2px; } .sn-text { white-space:pre-wrap; }


#toast { position:fixed; bottom:20px; left:50%; transform:translateX(-50%); background:var(--ink); color:#fff;
         padding:10px 16px; border-radius:99px; font-size:.85rem; opacity:0; transition:opacity .2s; pointer-events:none; }
#toast.show { opacity:1; }
.empty { text-align:center; padding:40px 16px; color:var(--mute); }

/* ---------- printouts (print.js) ---------- */
#printArea { display:none; }
@page { size:letter portrait; margin:0.4in; }
@media print {
  body.printing > *:not(#printArea) { display:none !important; }
  body.printing #printArea { display:block; }
  body { background:#fff; }
  /* plain Cmd+P without the Print buttons: just tidy the screen */
  body:not(.printing) .top-right, body:not(.printing) .tabs, body:not(.printing) .tools, body:not(.printing) .acts button { display:none !important; }
}
#printArea, #printArea * { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
.pg, .pm { font-family:-apple-system,"Helvetica Neue",Arial,sans-serif; color:#222; }
.pg-h h1, .pm-h h1 { font-size:22pt; font-weight:800; margin:0; letter-spacing:-.01em; }
.pg-h p, .pm-h p { font-size:9.5pt; color:#555; margin:2px 0 0; }
.pg-h, .pm-h { border-bottom:2px solid #222; padding-bottom:6px; margin-bottom:8px; }
.pm-h { display:flex; justify-content:space-between; align-items:flex-end; }
.pg-f { display:flex; justify-content:space-between; font-size:7pt; color:#888; border-top:1px solid #ccc; padding-top:4px; margin-top:10px; }

.pg-cols { display:grid; grid-template-columns:1fr 1fr; gap:0.22in; }
.pg-t { width:100%; border-collapse:collapse; table-layout:fixed; }
.pg-t th { font-size:6.5pt; letter-spacing:.12em; text-transform:uppercase; color:#777; font-weight:700; padding:2px 3px 4px; }
.pg-t td { border:1px solid #c8c8c8; height:0.315in; padding:1px 4px; font-size:9pt; vertical-align:middle; }
.pg-t tr.pg-tall td { height:0.63in; }
.pg-t col, .pg-t th:nth-child(1), .pg-t th:nth-child(4) { }
.pg-grp { width:0.5in; text-align:center; font-size:10pt !important; font-weight:800; line-height:1.1; }
.pg-mv { width:0.95in; font-size:9pt; }
.pg-no { width:0.42in; text-align:center; font-size:15pt !important; }
.pg-dog b { font-weight:700; } .pg-sep { color:#888; }
.pg-aisle td { height:0.07in !important; background:#d9d9d9; border-left:0; border-right:0; padding:0; }
.pg-cats { margin-top:0.18in; }
.pg-cat { color:#666; font-size:8.5pt; }
/* left table columns: Group | A/D | Dog | Room ; right: Room | Dog | Group | A/D */
.pg-cols > table:first-child th:nth-child(1) { width:0.5in; } .pg-cols > table:first-child th:nth-child(2) { width:0.95in; } .pg-cols > table:first-child th:nth-child(4) { width:0.42in; }
.pg-cols > table:last-child th:nth-child(1) { width:0.42in; } .pg-cols > table:last-child th:nth-child(3) { width:0.5in; } .pg-cols > table:last-child th:nth-child(4) { width:0.95in; }

.pm + .pm { break-before:page; page-break-before:always; }
.pm-h h1 { font-size:20pt; }
.pm-slot { margin-top:10px; }
.pm-sh, .pm-empty { display:flex; justify-content:space-between; align-items:baseline; border-bottom:1px solid #b33; padding-bottom:2px; }
.pm-slot h2 { font-size:11pt; letter-spacing:.18em; text-transform:uppercase; margin:0; }
.pm-sh span, .pm-empty span { font-size:7.5pt; letter-spacing:.08em; text-transform:uppercase; color:#666; }
.pm-empty { border-bottom-color:#ccc; } .pm-empty h2 { color:#999; }
.pm-t { width:100%; border-collapse:collapse; table-layout:fixed; margin-top:3px; }
.pm-t th { font-size:6.5pt; letter-spacing:.12em; text-transform:uppercase; color:#777; text-align:left; padding:3px 4px; }
.pm-t th:nth-child(1) { width:0.62in; } .pm-t th:nth-child(2) { width:1.05in; } .pm-t th:nth-child(3) { width:1.4in; }
.pm-t th:nth-child(4) { width:0.75in; } .pm-t th:nth-child(5) { width:0.95in; } .pm-t th:nth-child(7) { width:0.6in; } .pm-t th:nth-child(8) { width:0.6in; }
.pm-t td { border:1px solid #c8c8c8; padding:3px 5px; font-size:9pt; height:0.4in; vertical-align:middle; }
.pm-t td b { font-size:10pt; display:block; } .pm-t td small { display:block; font-size:7.5pt; color:#666; }
.pm-room { text-align:center; font-size:14pt !important; font-weight:800; }
.pm-dose { font-weight:700; }
.pm-give { display:inline-block; background:#eee; border-radius:3px; padding:1px 5px; font-size:6.5pt; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.pm-notes { font-size:7.5pt !important; color:#8a4300; font-weight:600; }
.pm-fill { font-size:8.5pt !important; color:#333; }
.pm-note { font-size:8pt; color:#555; margin-top:8px; }

/* sync status + sign-in */
.sync { font-size:.7rem; font-weight:700; padding:1px 8px; border-radius:99px; background:#eee; color:var(--mute); }
.sync.live { background:#dff3ea; color:var(--ok); } .sync.live::before { content:"● "; }
.sync.local { background:#fff3d6; color:#7a5a00; }
.sync.err { background:#fbdada; color:var(--bad); }
.login { max-width:380px; margin:48px auto; padding:0 16px; }
.login-card { display:flex; flex-direction:column; gap:12px; }
.login form { display:flex; flex-direction:column; gap:12px; }
.linkbtn { background:none; border:0; color:var(--mute); text-decoration:underline; cursor:pointer; font-size:.85rem; align-self:center; padding:4px; }
.login label { display:flex; flex-direction:column; gap:4px; font-size:.85rem; color:var(--mute); }
.login input { border:1px solid var(--line); border-radius:8px; padding:10px; font-size:1rem; color:var(--ink); }
[hidden] { display:none !important; }

/* in-page confirm / prompt */
.ask { max-width:380px; }
.ask p { font-size:1rem; margin-bottom:12px; white-space:pre-wrap; }
.ask input { width:100%; border:1px solid var(--line); border-radius:8px; padding:10px; font-size:1rem; }
.ask .row { justify-content:flex-end; margin-top:14px; }
.account { max-width:400px; }
.account h2 { font-size:1.1rem; } .account h3 { font-size:.95rem; margin-top:8px; }
.account form { display:flex; flex-direction:column; gap:10px; margin-top:10px; padding-top:12px; border-top:1px solid var(--line); }
.account label { display:flex; flex-direction:column; gap:4px; font-size:.85rem; color:var(--mute); }
.account input { border:1px solid var(--line); border-radius:8px; padding:10px; font-size:1rem; color:var(--ink); }
.account-foot { justify-content:space-between; border-top:1px solid var(--line); padding-top:12px; margin-top:14px; }
#account { max-width:46vw; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pill.on.danger { background:var(--bad); border-color:var(--bad); color:#fff; }
.login-logo { height:112px; width:auto; align-self:center; margin-bottom:4px; }
.login h2 { text-align:center; } .login form > p.mute { text-align:center; }

/* roles */
.lock.admin { background:#fff6dd; border-color:#f0d58a; color:#6b5200; }
.staff-t { width:100%; border-collapse:collapse; margin-top:10px; font-size:.85rem; }
.staff-t th { text-align:left; font-size:.7rem; color:var(--mute); text-transform:uppercase; letter-spacing:.06em; padding:4px; }
.staff-t td { padding:6px 4px; border-top:1px solid var(--line); vertical-align:middle; }
.staff-t input:not([type=checkbox]), .staff-t select { border:1px solid var(--line); border-radius:6px; padding:5px 6px; width:100%; background:#fff; }
.staff-t .ini { width:4.5em; text-transform:uppercase; }
.staff-t tr.inactive td { color:var(--mute); background:#fafafa; }
#staffInit[readonly] { background:#f4f4f4; color:var(--ink); font-weight:700; }
.staff-t .em { display:none; margin-top:2px; word-break:break-all; }
@media (max-width:640px) { .staff-t th:nth-child(1), .staff-t td:nth-child(1) { display:none; } .staff-t .em { display:block; } }

/* new pets, cats, upcoming days, updates */
.card.newpets { background:#fffbe6; border-color:#f3dc7a; }
.potty-sec { grid-column:1 / -1; margin-top:8px; }
.dog.cat { background:#f3eefc; border-color:#d9cdf3; }
.dog.cat .hd span { color:#6a4fa3; }
.pg-new { font-size:6pt; font-weight:800; background:#FFD400; padding:0 3px; border-radius:2px; vertical-align:middle; }
.update-bar { background:#1a1a1a; color:#fff; padding:10px 16px; display:flex; gap:12px; align-items:center; justify-content:center; flex-wrap:wrap; font-size:.9rem; }
.update-bar .pill.on { background:#FBB859; color:#1a1a1a; border-color:#FBB859; }

/* daily photos */
.c-photo { background:#fff0f3; color:#a01845; border:1px solid #f3b6c6; }
.c-photo.done { background:#e6f5ea; color:#1f6b33; border-color:#b8e0c2; }
.card.photos { border-color:#f3b6c6; background:#fff8fa; }
.card.photos.all-done { border-color:#b8e0c2; background:#f5fbf6; }
.card.photos li.done b { color:var(--mute); }
.card.photos .stamp { font-size:.8rem; color:var(--ok); white-space:nowrap; }
.card.photos .pill { padding:6px 12px; }
.pg-photo { font-size:10pt; vertical-align:middle; }

/* ---------- print only: coloured borders instead of solid fills (the screen stays solid) ---------- */
@media print {
  /* tags beside names on the printed guest list */
  #printArea .pg-new { background:#fff; color:#1a1a1a; border:1px solid #C9A400; }
  /* if someone prints the screen itself (Cmd+P): chips and room numbers as outlines */
  .chip.c-a, .chip.c-c, .chip.c-dnm, .chip.c-dnm-m, .chip.c-intact, .chip.c-meds, .chip.c-new, .chip.c-misc, .chip.c-day, .chip.c-in, .chip.c-out, .chip.c-photo { background:#fff !important; color:#1a1a1a !important; border:1.5px solid; }
  .chip.c-a { border-color:#E70AF2; } .chip.c-c { border-color:#0781FA; } .chip.c-dnm { border-color:#F71F07; } .chip.c-dnm-m { border-color:#ED3024; }
  .chip.c-intact { border-color:#B54A3E; } .chip.c-meds { border-color:#46819E; } .chip.c-new { border-color:#C9A400; }
  .chip.c-misc, .chip.c-day, .chip.c-in, .chip.c-out { border-color:#999; } .chip.c-photo { border-color:#d46a8a; }
  .room .no.c-a, .room .no.c-c, .room .no.c-dnm, .room .no.c-dnm-m { background:#fff !important; border:3px solid; }
  .room .no.c-a { border-color:#E70AF2; } .room .no.c-c { border-color:#0781FA; } .room .no.c-dnm { border-color:#F71F07; } .room .no.c-dnm-m { border-color:#ED3024; }
}

/* guest list: tiny camera beside the name for daily-photo pets */
.pet .pic { font-size:.8rem; line-height:1; margin-left:-1px; opacity:.85; }
.pet .pic.done { opacity:1; } .pet .pic i { font-style:normal; font-size:.65rem; font-weight:800; color:var(--ok); margin-left:1px; }

/* housekeeping: yellow = needs cleaning, green = clean */
.room.hk-need { box-shadow:inset 4px 0 0 #F2C200; background:#fffbe6; }
.room.hk-clean { box-shadow:inset 4px 0 0 #2f9e5b; background:#effaf3; }
.hk { flex-basis:100%; display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:.78rem; margin-top:2px; }
.hk-btn { font:inherit; font-size:.8rem; font-weight:800; border-radius:99px; padding:6px 14px; border:0; display:inline-block; }
.hk-btn.need { background:#FFD84D; color:#1a1a1a; cursor:pointer; }
.hk-btn.clean { background:#2f9e5b; color:#fff; }
span.hk-btn.need { cursor:default; }
.card.hkcard { border-color:#f0dc8a; background:#fffdf3; }
.card.hkcard.all-done { border-color:#b8e0c2; background:#f5fbf6; }
.card.hkcard li > span:last-child .hk { margin:0; flex-basis:auto; justify-content:flex-end; }
@media print { .hk .linkbtn { display:none !important; } }

/* tasks */
.tasksec summary { list-style:none; cursor:pointer; }
.tasksec summary::-webkit-details-marker { display:none; }
.tasksec summary h2 { display:flex; justify-content:space-between; align-items:center; }
.tasksec summary h2::after { content:'▾'; color:var(--mute); font-size:.9rem; margin-left:8px; }
.tasksec:not([open]) summary h2::after { content:'▸'; }
.tasksec .count { margin-left:auto; font-size:.8rem; color:var(--mute); font-weight:700; }
.tasklist li { align-items:center; padding:9px 0; }
.tasklist li.done b { color:var(--mute); text-decoration:line-through; text-decoration-color:#bbb; }
.tasklist .stamp { font-size:.8rem; color:var(--ok); white-space:nowrap; }
.tasklist .pill { padding:6px 14px; }
.card.taskcard { border-color:#c9d6f0; background:#f5f8fe; } .card.taskcard.all-done { border-color:#b8e0c2; background:#f5fbf6; }
.task-t { width:100%; border-collapse:collapse; font-size:.85rem; margin-top:8px; }
.task-t th { text-align:left; font-size:.7rem; color:var(--mute); text-transform:uppercase; letter-spacing:.06em; padding:4px; }
.task-t td { border-top:1px solid var(--line); padding:6px 4px; vertical-align:top; }
.task-t input:not([type=checkbox]), .task-t select { border:1px solid var(--line); border-radius:6px; padding:6px; width:100%; background:#fff; }
.task-t input.area { margin-top:4px; font-size:.78rem; }
.task-t tr.inactive td { color:var(--mute); background:#fafafa; }
.task-t tr.newrow td { background:#f7fbff; }
.task-t .days { display:flex; flex-wrap:wrap; gap:4px; margin-top:4px; }
.task-t .dbox { font-size:.72rem; display:flex; align-items:center; gap:2px; border:1px solid var(--line); border-radius:6px; padding:2px 5px; background:#fff; }

.tasklist .ttime { display:inline-block; min-width:4.6em; font-size:.75rem; font-weight:700; color:#4a5f86; }
.task-t .sub { display:flex; gap:4px; } .task-t .sub input { flex:1; }

.pbtns .vomit { background:#e6f0d8; }
.dog .hist span.vomit { background:#e6f0d8; color:#40591e; }
.tasklist .ticks { display:flex; flex-wrap:wrap; gap:4px 10px; justify-content:flex-end; align-items:center; }
.task-t .dbox.cats { margin-top:4px; width:fit-content; }

/* pet notes */
.latest-note { display:none; flex-basis:100%; font-size:.75rem; font-weight:400; color:#555; line-height:1.35; margin-top:2px; }
.show-notes .latest-note { display:block; }
.note-entry + .note-entry { border-top:1px solid #e4e4e4; margin-top:8px; padding-top:8px; }
.note-when { font-size:.72rem; font-weight:700; color:var(--mute); margin-bottom:2px; }
.older-notes summary { cursor:pointer; font-size:.82rem; font-weight:700; color:#4a5f86; margin:4px 0; }
@media print { .latest-note { display:none !important; } }

.setrow label { display:flex; align-items:center; gap:6px; font-size:.88rem; }
.setrow input[type=number] { width:4.2em; border:1px solid var(--line); border-radius:6px; padding:5px; font-size:.9rem; }

/* reports */
.rep-controls .row { margin-top:0; } .rep-controls .row + .row { margin-top:10px; }
.rep-controls label { display:flex; align-items:center; gap:6px; font-size:.85rem; color:var(--mute); }
.rep-controls select, .rep-controls input[type=date] { border:1px solid var(--line); border-radius:8px; padding:6px 8px; background:#fff; color:var(--ink); }
.rep-title { font-size:1.15rem; margin:4px 0 12px; } .rep h3 { font-size:.95rem; margin-bottom:8px; }
.rep-t { width:100%; border-collapse:collapse; font-size:.82rem; }
.rep-t th { text-align:left; font-size:.68rem; color:var(--mute); text-transform:uppercase; letter-spacing:.05em; padding:4px 6px; border-bottom:1px solid var(--line); }
.rep-t td { padding:6px; border-bottom:1px solid #f0f0f0; vertical-align:top; }
.rep-t.num td:nth-child(n+3), .rep-t.num th:nth-child(n+3) { text-align:right; }
.rep-t tr.flag td { background:#fff6f5; }
.rep b.okc { color:var(--ok); } .rep b.warnc { color:var(--warn); } .rep b.badc { color:var(--bad); }
.hw-group { margin:18px 0 8px; font-size:1rem; }
.hw-pet { border-left:5px solid var(--line); }
.hw-pet.hw-high { border-left-color:var(--bad); } .hw-pet.hw-watch { border-left-color:var(--warn); } .hw-pet.hw-low { border-left-color:#9aa5b1; }
.hw-head { display:flex; justify-content:space-between; align-items:flex-start; gap:10px; }
.hw-lvl { font-size:.72rem; font-weight:700; padding:3px 9px; border-radius:999px; white-space:nowrap; background:#eef1f4; color:#4a5560; }
.hw-high .hw-lvl { background:#fde8e6; color:var(--bad); } .hw-watch .hw-lvl { background:#fff3d6; color:#8a5a00; }
.hw-counts { margin:6px 0 8px; }
.hw-ev { font-size:.72rem; font-weight:600; padding:1px 7px; border-radius:6px; background:#eef1f4; white-space:nowrap; }
.hw-ev.hw-diarrhea, .hw-ev.hw-vomit { background:#fde8e6; color:var(--bad); } .hw-ev.hw-soft { background:#fff3d6; color:#8a5a00; } .hw-ev.hw-refused { background:#e8f0fb; color:#1f5fa8; }
.rep .card { overflow-x:auto; }
.stay-head > div + div { margin-top:3px; }
.stay-days td:nth-child(n+4):not(:nth-child(6)), .stay-days th:nth-child(n+4):not(:nth-child(6)) { text-align:center; }
.own-check textarea { display:block; width:100%; margin-top:6px; border:1px solid var(--line); border-radius:8px; padding:8px; font:inherit; color:var(--ink); }
.own { background:#fff; border:1px solid var(--line); border-radius:14px; padding:22px; color:#1a1a1a; }
.own-head { display:flex; gap:16px; align-items:center; border-bottom:3px solid var(--brand); padding-bottom:14px; margin-bottom:6px; }
.own-head img { width:72px; height:72px; object-fit:contain; }
.own-kicker { font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; color:var(--mute); }
.own-head h2 { font-size:1.3rem; margin:2px 0; }
.own-dates { font-size:.9rem; }
.own-sec { margin-top:16px; } .own-sec h3 { font-size:1rem; margin-bottom:6px; color:var(--accent); }
.own-t { width:100%; border-collapse:collapse; font-size:.86rem; }
.own-t th { text-align:left; font-size:.7rem; text-transform:uppercase; letter-spacing:.05em; color:var(--mute); border-bottom:1px solid var(--line); padding:4px 6px; }
.own-t td { padding:6px; border-bottom:1px solid #f0f0f0; vertical-align:top; }
.own-mute { color:var(--mute); font-size:.8rem; }
.own-note-text { white-space:pre-wrap; }
.own-foot { margin-top:20px; padding-top:10px; border-top:1px solid var(--line); text-align:center; font-size:.85rem; color:var(--mute); }
@media print { .rep-print .own { border:none; padding:0; } }
.ops-week { margin:10px 0 4px; font-weight:600; } .ops-week:first-of-type { margin-top:0; }
.act-chip { display:inline-block; margin:2px 4px 2px 0; padding:2px 8px; border-radius:999px; background:#eef1f4; font-size:.78rem; white-space:nowrap; }
.act-t td:first-child { white-space:nowrap; }
.clearable { position:relative; display:flex; flex:1; min-width:180px; }
.clearable input { flex:1; width:100%; min-width:0 !important; padding-right:34px !important; }
.clear-x { position:absolute; right:7px; top:50%; transform:translateY(-50%); width:22px; height:22px; padding:0; border:0; border-radius:50%; background:#e3e7eb; color:#444; font-size:11px; line-height:22px; cursor:pointer; }
.clear-x:hover { background:#d3d8dd; } .clear-x[hidden] { display:none; }
input[type=search]::-webkit-search-cancel-button { -webkit-appearance:none; appearance:none; }
.rep-pet { display:flex; flex-wrap:wrap; align-items:center; gap:6px; flex:1 1 100%; }
.rep-pet label .clearable { min-width:200px; }
.rep-pet input[type=search] { border:1px solid var(--line); border-radius:8px; padding:6px 8px; background:#fff; color:var(--ink); font:inherit; font-size:.9rem; }
.rep-pet select { max-width:100%; }
@media print { .rep-print .card { break-inside:avoid; border:1px solid #ddd; } .rep-print .stats { grid-template-columns:repeat(5,1fr); } }