/* home-preview.css -- session 395 (briefs/session-395-brief.md; mh-home-assign-mockups-v1 home-parallel-run, home-after-resort,
   settings-end-parallel-run): the new Home page (a preview) and its two Settings pages. The mockups' own <style> blocks and inline styles, ported
   rule for rule as named tokens and classes under .mhh (classes hh-). Every value is the mockup's. */
.mhh{--hh-ink:#16181a;--hh-text:#4d545a;--hh-muted:#6b747b;--hh-line:#dfe3e6;--hh-line2:#c9d0d4;--hh-s2:#e9ecee;--hh-bg:#f2f4f5;--hh-out:#f7f8f9;
  --hh-b900:#0e363b;--hh-b700:#144d54;--hh-b500:#1d6e77;--hh-b300:#6fd5d4;--hh-b100:#dceff0;
  --hh-y500:#ffd13a;--hh-y600:#f5c21c;--hh-y100:#fff5cc;--hh-y-ink:#5c4a00;--hh-today:#fffbea;
  --hh-o500:#ff8a33;--hh-o700:#d96a18;--hh-o100:#ffe8d6;--hh-on-o:#9a4a0e;
  --hh-a100:#fdf0d8;--hh-on-a:#7a5312;--hh-a-line:#b7791f;
  --hh-g500:#2e9c7c;--hh-g100:#e2f4ee;--hh-on-g:#08513f;
  --hh-r500:#c43d2b;--hh-r100:#ffe1dc;--hh-on-r:#8a2617;--hh-p500:#7a5cc7;--hh-grey:#b8c2c8;
  --hh-shadow:0 4px 14px rgba(14,54,59,.08);--hh-shadow2:0 10px 30px rgba(14,54,59,.22);
  background:var(--hh-bg);color:var(--hh-text);font-family:var(--ui-font,'Inter','Segoe UI',system-ui,-apple-system,Arial,sans-serif);
  -webkit-font-smoothing:antialiased;font-feature-settings:"tnum";min-height:100%}
.mhh *{box-sizing:border-box}
.mhh a{color:var(--hh-b500);text-decoration:none}
.mhh a:hover{text-decoration:underline}
.mhh a:focus-visible,.mhh button:focus-visible,.mhh input:focus-visible{outline:2px solid var(--hh-b700);outline-offset:2px}

/* the page's frame: full width under the Hub's top bar, its own padding (as calendar.css #page.cl-page) */
#page.hh-page{padding:calc(var(--hdrH) + var(--bandH)) 0 0;max-width:none;margin:0;box-sizing:border-box;background:#f2f4f5;min-height:100vh}

/* the preview strip (brief A3) */
.mhh .hh-strip{background:var(--hh-y100);color:var(--hh-y-ink);font-size:12.5px;font-weight:600;padding:6px 32px;text-align:center}

/* the page (session 399, Daniel: "the sizing/font is way too big"): max width 1440, centred, 20px top and bottom, 32px sides, 16px between sections.
   The type is set at its own size: no zoom, no scale, and no tight negative letter spacing on the big numbers (it smeared the heavy weights). */
.mhh .hh-main{max-width:var(--mh-frame-max, 1760px);margin:0 auto;padding:20px var(--mh-frame-side, 32px);display:flex;flex-direction:column;gap:16px}   /* session 407 Part A: the one frame (was 1440) */
.mhh .hh-top{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap}
.mhh .hh-h1{margin:0;font-size:28px;font-weight:800;letter-spacing:-.01em;line-height:1.1;color:var(--hh-ink)}
.mhh .hh-line{margin:4px 0 0;font-size:13.5px;color:var(--hh-text)}
.mhh .hh-pills{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
.mhh .hh-pill{font-size:12px;font-weight:600;padding:4px 10px;border-radius:999px}
.mhh .hh-pill-a{background:var(--hh-a100);color:var(--hh-on-a)}
.mhh .hh-pill-g{background:var(--hh-g100);color:var(--hh-on-g)}

/* icons */
.mhh .hh-ico{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex:none}
.mhh .hh-ico svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

/* At risk, act now (session 399, brief A3: "I see no reason why the red At Risk box is so big"): one header line, slim rows in two columns at 1440,
   one on a phone; padding 12px 16px, radius 12px; more than 6: six and "+N more". */
.mhh .hh-risk{background:var(--hh-r500);border-radius:12px;box-shadow:var(--hh-shadow);padding:12px 16px;display:flex;flex-direction:column;gap:10px;color:#ffffff}
.mhh .hh-riskhead{display:flex;gap:8px;align-items:center;flex-wrap:wrap;min-width:0}
.mhh .hh-riskhead .hh-ico{width:24px;height:24px;border-radius:6px;background:rgba(255,255,255,.16);color:#ffffff}
.mhh .hh-riskhead .hh-ico svg{width:14px;height:14px}
.mhh .hh-risklabel{font-size:15px;font-weight:700;line-height:1.2}
.mhh .hh-riskcap{font-size:12.5px;color:var(--hh-r100)}
.mhh .hh-risklist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 12px;min-width:0}
.mhh .hh-riskrow{background:rgba(255,255,255,.12);border-radius:8px;padding:5px 6px 5px 10px;display:flex;align-items:center;gap:8px;color:#ffffff;font-size:13px;line-height:1.3;min-width:0}
.mhh a.hh-riskrow:hover{text-decoration:none;background:rgba(255,255,255,.22)}
.mhh .hh-rr-txt{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mhh .hh-rr-t{font-weight:700;color:#ffffff}
.mhh .hh-rr-s{color:var(--hh-r100)}
.mhh .hh-rr-a{margin-left:auto;background:#ffffff;color:var(--hh-on-r);font-weight:700;font-size:12px;padding:4px 10px;border-radius:6px;white-space:nowrap;flex:none}
.mhh a.hh-riskrow:focus-visible{outline:2px solid #ffffff;outline-offset:2px}
.mhh .hh-riskmore{justify-self:start;font:inherit;font-size:12.5px;font-weight:700;color:#ffffff;background:none;border:1.5px solid rgba(255,255,255,.6);border-radius:6px;padding:3px 10px;cursor:pointer}
.mhh .hh-riskmore:hover{background:rgba(255,255,255,.16)}
.mhh .hh-riskmore:focus-visible{outline:2px solid #ffffff;outline-offset:2px}

/* the four cards (session 399): one row of four at 1440, auto-fit below; white, radius 12, padding 14px 16px */
.mhh .hh-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
@media (max-width:1180px){ .mhh .hh-cards{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))} }
.mhh .hh-tile{background:#ffffff;border-radius:12px;box-shadow:var(--hh-shadow);padding:14px 16px;display:flex;flex-direction:column;gap:8px;min-width:0}
.mhh .hh-thead{display:flex;align-items:center;gap:10px;min-width:0}
.mhh .hh-ttitle{font-size:15px;font-weight:700;color:var(--hh-ink);line-height:1.2}
.mhh a.hh-ttitle{color:var(--hh-ink);text-decoration:underline;text-decoration-color:var(--hh-line2);text-underline-offset:3px}
.mhh a.hh-ttitle:hover{text-decoration-color:var(--hh-ink)}
.mhh .hh-tcap{font-size:11.5px;color:var(--hh-muted);line-height:1.35}
.mhh .hh-target{margin-left:auto;font-size:11.5px;font-weight:600;padding:3px 8px;border-radius:999px;white-space:nowrap}
.mhh .hh-target-a{background:var(--hh-a100);color:var(--hh-on-a)}
.mhh .hh-target-g{background:var(--hh-s2);color:var(--hh-text)}
.mhh .hh-target-late{background:var(--hh-o500);color:var(--hh-ink)}
.mhh .hh-big{display:flex;align-items:baseline;gap:8px}
/* Session 396: the Tomorrow card's number opens the Assign page on tomorrow. */
.mhh a.hh-biglink{color:inherit;text-decoration:none;border-radius:8px}
.mhh a.hh-biglink:hover .hh-slabel{text-decoration:underline}
.mhh a.hh-biglink:focus-visible{outline:2px solid var(--hh-b500);outline-offset:3px}
.mhh .hh-stat{font-size:26px;font-weight:800;color:var(--hh-ink);line-height:1}
.mhh .hh-slabel{font-size:13px;font-weight:600;color:var(--hh-text)}
.mhh .hh-done{display:flex;align-items:center;gap:6px;font-size:15px;font-weight:700;color:var(--hh-on-g);min-height:26px}
.mhh .hh-done svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.mhh .hh-sub{font-size:12.5px;color:var(--hh-muted);margin-top:-4px}
.mhh .hh-prog{height:6px;border-radius:999px;background:var(--hh-s2);overflow:hidden;display:flex}
.mhh .hh-rows{display:flex;flex-direction:column}
.mhh .hh-row{display:flex;align-items:center;gap:8px;padding:6px 0;border-top:1px solid var(--hh-line);font-size:13px;line-height:1.35;color:var(--hh-text);min-width:0}
.mhh a.hh-row{color:var(--hh-text)}
.mhh a.hh-row:hover{text-decoration:none;background:var(--hh-out)}
.mhh a.hh-row .hh-txt{text-decoration:underline;text-decoration-color:var(--hh-line2);text-underline-offset:3px}
.mhh .hh-row .hh-txt{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mhh .hh-row b{margin-left:auto;font-weight:700;color:var(--hh-ink);white-space:nowrap}
.mhh .hh-row b.hh-ok{color:var(--hh-on-g)}
.mhh .hh-row b.hh-soft{color:var(--hh-muted);font-weight:600}
.mhh .hh-row b.hh-warn{color:var(--hh-on-o)}
.mhh .hh-dot{width:8px;height:8px;border-radius:3px;flex:none}
.mhh .hh-tlink{margin-top:auto;font-size:13px;font-weight:600;text-decoration:underline;text-decoration-color:rgba(29,110,119,.35);text-underline-offset:3px}
/* Not built yet (brief "Not built yet"): a dashed line with the design system's need chip */
.mhh .hh-row.hh-nb{border:1.5px dashed var(--hh-line2);border-radius:8px;padding:5px 8px;margin-top:4px;color:var(--hh-muted);flex-wrap:wrap;row-gap:6px}
.mhh .hh-row.hh-nb .hh-txt{white-space:normal}
.mhh .hh-need{font-size:11px;font-weight:700;background:var(--hh-s2);color:var(--hh-text);border-radius:999px;padding:2px 8px;white-space:nowrap;margin-left:auto}
/* the Confirm card: #ffe8d6 and the page's one yellow button */
.mhh .hh-tile.hh-conf{background:var(--hh-o100)}
.mhh .hh-conf .hh-row{border-top-color:rgba(154,74,14,.18)}
.mhh .hh-btnY{display:block;text-align:center;background:linear-gradient(var(--hh-y500),var(--hh-y600));color:var(--hh-ink);font-weight:700;font-size:13.5px;border-radius:8px;padding:8px 14px;box-shadow:0 4px 10px rgba(217,106,24,.24);margin-top:auto}
.mhh a.hh-btnY:hover{text-decoration:none;filter:brightness(1.03)}
.mhh .hh-mv{font-size:12px;color:var(--hh-on-o);margin:-2px 0 0 30px}

/* number boxes (session 399): 22px tall, min 26 wide, radius 6, 12/700; on the calendar each one is a link to that day's list, filtered */
.mhh .hh-bx{min-width:26px;height:22px;padding:0 6px;border-radius:6px;font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.mhh .hh-bx-sm{min-width:20px;height:17px;font-size:10.5px;padding:0 4px}
.mhh a.hh-bx{text-decoration:none;cursor:pointer;position:relative;z-index:2}
.mhh a.hh-bx:hover{text-decoration:none;box-shadow:0 0 0 2px var(--hh-ink)}
.mhh a.hh-bx.hh-k-need:hover{box-shadow:inset 0 0 0 1.5px var(--hh-a-line),0 0 0 2px var(--hh-ink)}
.mhh a.hh-bx:focus-visible{outline:2px solid var(--hh-b700);outline-offset:2px}
.mhh .hh-k-sched{background:var(--hh-b500);color:#ffffff}
.mhh .hh-k-new{background:var(--hh-o500);color:var(--hh-ink)}
.mhh .hh-k-moved{background:var(--hh-on-o);color:#ffffff}
.mhh .hh-row-wrap .hh-txt{white-space:normal;overflow:visible;text-overflow:clip}   /* session 398: the whole label, wrapped */
.mhh .hh-k-cont{background:#6fd5d4;color:var(--hh-ink)}   /* session 398: Continuing the next day */
.mhh .hh-k-other{background:#ffffff;color:var(--hh-ink);box-shadow:inset 0 0 0 1px var(--hh-on-o)}   /* session 398: Other changes */
.mhh a.hh-row-link{color:inherit;text-decoration:none;cursor:pointer}
.mhh a.hh-row-link .hh-txt{text-decoration:underline}
.mhh a.hh-row-link:hover .hh-txt{color:var(--hh-on-o)}
.mhh a.hh-row-link:focus-visible{outline:2px solid var(--hh-on-o);outline-offset:2px;border-radius:4px}
.mhh .hh-k-need{background:var(--hh-a100);color:var(--hh-on-a);box-shadow:inset 0 0 0 1.5px var(--hh-a-line)}
.mhh .hh-k-wait{background:var(--hh-y500);color:var(--hh-ink)}
.mhh .hh-k-never{background:var(--hh-r500);color:#ffffff}
.mhh .hh-k-closed{background:var(--hh-line);color:var(--hh-text)}

/* the calendar (session 399): one card, 30px icon square, 18px title, seven equal columns, cells min 72px */
.mhh .hh-cal{background:#ffffff;border-radius:12px;box-shadow:var(--hh-shadow);overflow:hidden}
.mhh .hh-calhead{display:flex;align-items:center;gap:10px;padding:12px 16px;flex-wrap:wrap}
.mhh .hh-calhead h2{margin:0;font-size:18px;font-weight:700;color:var(--hh-ink);line-height:1.15}
.mhh .hh-calbtns{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
.mhh .hh-btnS{display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--hh-line2);background:#ffffff;color:var(--hh-ink);font:inherit;font-weight:600;font-size:13px;border-radius:8px;padding:5px 10px;white-space:nowrap;cursor:pointer}
.mhh .hh-btnS svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.mhh .hh-btnS:hover{text-decoration:none;background:var(--hh-s2)}
.mhh .hh-calscroll{overflow-x:auto}
.mhh .hh-calin{min-width:880px}
.mhh .hh-wkrow{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.mhh .hh-wkname{background:var(--hh-s2);font-size:12px;font-weight:600;color:var(--hh-text);padding:6px 10px}
.mhh .hh-day{min-height:72px;padding:8px 10px;border-right:1px solid var(--hh-line);border-bottom:1px solid var(--hh-line);display:flex;flex-direction:column;gap:4px;color:inherit;position:relative}
.mhh .hh-day:hover{background:var(--hh-out)}
/* the whole day opens it (a link under the boxes); each box above it opens the day filtered to its own cleans */
.mhh a.hh-dayln{position:absolute;inset:0;z-index:1;border-radius:0}
.mhh a.hh-dayln:focus-visible{outline:2px solid var(--hh-b700);outline-offset:-3px}
.mhh .hh-dtop,.mhh .hh-match{position:relative;pointer-events:none}
.mhh .hh-day.hh-out{background:var(--hh-out)}
.mhh .hh-day.hh-tod{background:var(--hh-today);box-shadow:inset 0 0 0 2px var(--hh-b500)}
.mhh .hh-dtop{display:flex;align-items:center;gap:6px;min-height:18px}
.mhh .hh-dnum{font-size:13px;font-weight:700;color:var(--hh-ink)}
.mhh .hh-out .hh-dnum{color:var(--hh-muted)}
.mhh .hh-dtag{margin-left:auto;font-size:11px;font-weight:700;padding:1px 7px;border-radius:999px}
.mhh .hh-dtag-today{background:var(--hh-b500);color:#ffffff}
.mhh .hh-dtag-not{background:var(--hh-a100);color:var(--hh-on-a)}
.mhh .hh-dtag-ready{background:var(--hh-g100);color:var(--hh-on-g)}
.mhh .hh-boxes{display:flex;flex-wrap:wrap;gap:4px;margin-top:auto;position:relative;z-index:2;align-self:flex-start}
.mhh .hh-match{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:600;color:var(--hh-on-g)}
.mhh .hh-match.hh-off{color:var(--hh-on-o)}
.mhh .hh-legend{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;padding:10px 16px;font-size:12px;color:var(--hh-text)}
.mhh .hh-legend > span{display:inline-flex;align-items:center;gap:6px}
.mhh .hh-legend .hh-asof{margin-left:auto;font-size:11.5px;color:var(--hh-muted)}
.mhh .hh-legend .hh-offnote{font-size:11.5px;font-weight:600;color:var(--hh-on-o)}
.mhh .hh-err{background:#ffffff;border-radius:14px;padding:20px;color:var(--hh-on-r)}
.mhh .hh-wait{color:var(--hh-muted);font-size:14px;padding:20px 0}

/* Settings pages (settings-end-parallel-run): a card, its rows and the confirm step */
.mhh.hh-set{background:transparent;min-height:0}
.mhh .hh-scard{background:#ffffff;border-radius:14px;box-shadow:var(--hh-shadow);padding:22px 24px;display:flex;flex-direction:column;gap:14px;max-width:760px}
.mhh .hh-shead{display:flex;align-items:center;gap:12px}
.mhh .hh-sic{width:40px;height:40px;border-radius:10px;background:var(--hh-b700);color:#ffffff;display:flex;align-items:center;justify-content:center;flex:none}
.mhh .hh-sic svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.mhh .hh-st{font-size:17px;font-weight:700;color:var(--hh-ink);letter-spacing:-.015em}
.mhh .hh-ss{font-size:13px;color:var(--hh-muted)}
.mhh .hh-sp{margin:0;font-size:14px;line-height:1.5}
.mhh .hh-kv{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-top:1px solid var(--hh-line);font-size:14px}
.mhh .hh-kv b{color:var(--hh-ink);font-weight:600;text-align:right}
.mhh .hh-kv b.hh-warn{color:var(--hh-on-o)}
.mhh .hh-btnR{font:inherit;font-size:14px;font-weight:700;color:#ffffff;background:var(--hh-r500);border:0;border-radius:10px;padding:11px 16px;cursor:pointer}
.mhh .hh-btnR:hover{background:#ad3424}
.mhh .hh-btnR:disabled{opacity:.45;cursor:not-allowed}
.mhh .hh-btn2{font:inherit;font-size:14px;font-weight:600;color:var(--hh-ink);background:#ffffff;border:1.5px solid var(--hh-line2);border-radius:10px;padding:10px 16px;cursor:pointer}
.mhh .hh-btn2:hover{background:var(--hh-s2)}
.mhh .hh-btnP{font:inherit;font-size:14px;font-weight:700;color:#ffffff;background:var(--hh-b500);border:0;border-radius:10px;padding:10px 16px;cursor:pointer}
.mhh .hh-btnP:hover{background:var(--hh-b700)}
.mhh .hh-btnP:disabled{opacity:.45;cursor:not-allowed}
.mhh .hh-dlg{background:#ffffff;border-radius:14px;box-shadow:var(--hh-shadow2);padding:22px 24px;display:flex;flex-direction:column;gap:12px;border-top:4px solid var(--hh-r500);max-width:760px}
.mhh .hh-dlgt{font-size:17px;font-weight:700;color:var(--hh-ink)}
.mhh .hh-lbl{display:flex;flex-direction:column;gap:6px;font-size:12.5px;font-weight:600;color:var(--hh-text)}
.mhh .hh-in{font:inherit;font-size:14px;border:1px solid var(--hh-line2);border-radius:6px;padding:9px 12px;width:180px;color:var(--hh-ink)}
.mhh .hh-acts{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.mhh .hh-tick{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--hh-line);font-size:14px;color:var(--hh-ink)}
.mhh .hh-tick input{width:18px;height:18px;accent-color:var(--hh-b500)}
.mhh .hh-tick small{color:var(--hh-muted);font-size:12.5px}
.mhh .hh-sw{display:inline-flex;align-items:center;gap:10px;font:inherit;font-size:14px;font-weight:600;color:var(--hh-ink);background:none;border:0;padding:0;cursor:pointer}
.mhh .hh-sw i{width:40px;height:22px;border-radius:999px;background:var(--hh-line2);position:relative;flex:none}
.mhh .hh-sw i::after{content:'';position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:999px;background:#ffffff;transition:left .15s}
.mhh .hh-sw[aria-pressed="true"] i{background:var(--hh-b500)}
.mhh .hh-sw[aria-pressed="true"] i::after{left:21px}
.mhh .hh-time{font:inherit;font-size:14px;border:1px solid var(--hh-line2);border-radius:6px;padding:7px 10px;width:110px}
.mhh .hh-msg{font-size:13px;color:var(--hh-on-g);min-height:18px}
.mhh .hh-msg.hh-bad{color:var(--hh-on-r)}
.mhh .hh-hist{font-size:12.5px;color:var(--hh-muted);line-height:1.6}

/* a phone: everything stacks, the calendar scrolls sideways inside its card */
@media (max-width:720px){
  .mhh .hh-main{padding:16px 16px 24px;gap:14px}
  .mhh .hh-strip{padding:6px 16px}
  .mhh .hh-h1{font-size:24px}
  .mhh .hh-pills{margin-left:0}
  .mhh .hh-risk{padding:12px}
  .mhh .hh-risklist{grid-template-columns:1fr}
  .mhh .hh-calhead{padding:12px}
  .mhh .hh-calbtns{margin-left:0}
  .mhh .hh-legend{padding:10px 12px}
  .mhh .hh-legend .hh-asof{margin-left:0}
}

/* Session 404: the Hub's "Settings for this page" strip under every page pulls itself 48px up (settings-hub.css .mh-page-settings, 40px on a phone),
   and its full-width box took the clicks on the page's last row (found when "Show all" under the list could not be pressed). The page ends with room for it. */
.mhh .hh-main{padding-bottom:68px}
@media (max-width:640px){.mhh .hh-main{padding-bottom:60px}}
/* Session 404 (brief B): where Resort doesn't match, directly under the calendar, at the page's sizes (rows 13px, captions 12px). One row per difference:
   the day, the Property Name with what differs, the likely cause with its fix line, the three answers. */
.mhh .hh-mx{background:#ffffff;border-radius:12px;box-shadow:var(--hh-shadow);overflow:hidden}
.mhh .hh-mxq{padding:10px 16px;font-size:13px;color:var(--hh-text)}
.mhh .hh-mxbad{color:var(--hh-on-r)}
.mhh .hh-mxh{display:flex;align-items:baseline;gap:6px 12px;flex-wrap:wrap;padding:10px 16px;border-bottom:1px solid var(--hh-line);background:var(--hh-a100)}
.mhh .hh-mxh b{font-size:15px;font-weight:700;color:var(--hh-ink)}
.mhh .hh-mxcap{font-size:12px;color:var(--hh-on-a)}
.mhh .hh-mxall{margin-left:auto;font-size:13px;font-weight:600;color:var(--hh-b500);text-decoration:underline}
.mhh .hh-mxq .hh-mxall{margin-left:4px}
.mhh .hh-mxlist{display:flex;flex-direction:column}
.mhh .hh-mxr{display:grid;grid-template-columns:96px minmax(0,1.35fr) minmax(0,1.15fr) auto;align-items:center;gap:12px;padding:6px 16px;border-top:1px solid var(--hh-s2);font-size:13px;line-height:1.3}
.mhh .hh-mxr:first-child{border-top:0}
.mhh .hh-mxd{font-weight:650;color:var(--hh-ink);white-space:nowrap}
.mhh .hh-mxhome,.mhh .hh-mxwhy{display:flex;flex-direction:column;min-width:0}
.mhh .hh-mxhome a{font-weight:650;color:var(--hh-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:underline;text-decoration-color:var(--hh-line2)}
.mhh .hh-mxhome a:hover{color:var(--hh-b700);text-decoration-color:currentColor}
.mhh .hh-mxwhy b{font-weight:600;color:var(--hh-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mhh .hh-mxhome small,.mhh .hh-mxwhy small{font-size:12px;color:var(--hh-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mhh .hh-mxans{display:inline-flex;gap:4px;flex:none}
.mhh .hh-mxb{font:inherit;font-size:12px;font-weight:600;border:1px solid var(--hh-line2);background:#ffffff;color:var(--hh-ink);border-radius:6px;padding:3px 8px;white-space:nowrap;cursor:pointer}
.mhh .hh-mxb:hover{background:var(--hh-b100);border-color:var(--hh-b500)}
.mhh .hh-mxb:disabled{opacity:.55;cursor:wait}
/* session 405: Client cancelled's note line, full width under the row (appointments-cal.js acCcOpen) */
.mhh .ac-cc{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:6px 8px;border:1px solid var(--hh-line2);border-radius:8px;background:var(--hh-b100)}
.mhh .ac-cc label{font-size:12.5px;font-weight:700;color:var(--hh-ink)}
.mhh .ac-cc input{flex:1 1 160px;min-width:0;height:32px;border:1px solid var(--hh-line2);border-radius:6px;padding:0 8px;font:inherit;font-size:13px}
.mhh .ac-cc button{font:inherit;font-size:12px;font-weight:700;height:32px;padding:0 10px;border-radius:6px;border:1px solid var(--hh-line2);background:#ffffff;color:var(--hh-ink);cursor:pointer}
.mhh .ac-cc .ac-ccgo{background:var(--hh-b500);border-color:var(--hh-b500);color:#ffffff}
.mhh .ac-cc button:hover{filter:brightness(.95)} .mhh .ac-cc button:focus-visible,.mhh .hh-mxb:focus-visible{outline:2px solid var(--hh-b500);outline-offset:2px}
.mhh .ac-ccerr{flex-basis:100%;font-size:12px;font-weight:600;color:#b42318} .mhh .ac-ccerr:empty{display:none}
.mhh .hh-mxmore{display:block;width:100%;font:inherit;font-size:13px;font-weight:600;color:var(--hh-b500);text-decoration:underline;background:#ffffff;border:0;border-top:1px solid var(--hh-line);padding:8px 16px;text-align:left;cursor:pointer}
.mhh .hh-mxmore:hover{background:var(--hh-out)}
@media (max-width:900px){
  .mhh .hh-mxr{grid-template-columns:minmax(0,1fr);gap:3px;padding:8px 12px}
  .mhh .hh-mxh{padding:10px 12px}
  .mhh .hh-mxall{margin-left:0}
  .mhh .hh-mxhome small,.mhh .hh-mxwhy small{white-space:normal}
  .mhh .hh-mxans{flex-wrap:wrap;margin-top:3px}
}

/* The menu's small Preview tag beside "Home" (session 395). Hidden on the icon rail (shell.css, beside the rail's other rules). */
.sitem .hh-navtag{margin-left:auto;font-size:10.5px;font-weight:700;letter-spacing:.02em;background:#fff5cc;color:#5c4a00;border-radius:999px;padding:1px 7px;line-height:1.5}