/* Mrs. Marvelous Cleaning — the office ("The Week Board").
   The site's seam stands at the left: a lilac rail (the way around + what needs
   a person) and, right of it, the wiped white schedule. Colour is restrained:
   purple = action and selection, pink = needs a person, sky = open slots.
   Status is form and words, never colour alone. */

@font-face{font-family:"Imbue";src:url("/fonts/imbue-latin.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Figtree";src:url("/fonts/figtree-latin.woff2") format("woff2");font-weight:300 900;font-style:normal;font-display:swap}
@font-face{font-family:"Figtree";src:url("/fonts/figtree-italic-latin.woff2") format("woff2");font-weight:300 900;font-style:italic;font-display:swap}

:root{
  --purple:#653B98; --purple-deep:#4A2776; --ink:#2A1444;
  --pink:#EB9DEB; --pink-soft:#FBE6FB; --pink-ink:#7A1F7A;
  --sky:#6AAADE; --sky-soft:#E6F1FA; --sky-ink:#1F5E94;
  --lilac:#EADFF6; --lilac-2:#F6F1FB; --white:#FFFFFF;
  --muted:#5A4A70; --rule:#D9CDE8; --rule-2:#EBE3F3; --grid:#EFE9F5;
  --err:#A3123F; --err-soft:#FBE9EE; --ok:#1E6B45;
  --display:"Imbue","Bodoni 72",Georgia,serif;
  --text:"Figtree","Avenir Next","Segoe UI",system-ui,sans-serif;
  --rail:264px; --cell:12px; --gutter:58px;
  --shadow:0 8px 28px rgba(42,20,68,.18);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scrollbar-color:var(--purple) var(--lilac)}
body{margin:0;background:var(--white);color:var(--ink);font:400 .9375rem/1.45 var(--text);-webkit-font-smoothing:antialiased;caret-color:var(--purple);accent-color:var(--purple)}
::selection{background:var(--pink);color:var(--ink)}
h1,h2,h3,p{margin:0}
h1{font:650 2rem/1 var(--display);font-variation-settings:"opsz" 100;color:var(--purple);letter-spacing:-.005em}
h2{font:700 1.0625rem/1.25 var(--text)}
h3{font:700 .9375rem/1.3 var(--text)}
a{color:var(--purple);text-underline-offset:.16em}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--ink);outline-offset:2px;border-radius:2px}
[hidden]{display:none !important}
.caps{font:700 .6875rem/1.3 var(--text);letter-spacing:.14em;text-transform:uppercase}
.muted{color:var(--muted)}
.small{font-size:.8125rem}
.num{font-variant-numeric:tabular-nums}
.grow{flex:1}
.row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.stack{display:grid;gap:12px}
svg.i{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---------------------------------------------------------------- buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:8px 16px;border:2px solid var(--purple);border-radius:2px;background:var(--purple);color:var(--white);font-weight:600;line-height:1.3;cursor:pointer;text-decoration:none;transition:background-color .15s,border-color .15s,color .15s}
.btn:hover{background:var(--ink);border-color:var(--ink)}
.btn--line{background:var(--white);color:var(--purple)}
.btn--line:hover{background:var(--lilac);border-color:var(--purple);color:var(--purple)}
.btn--quiet{background:transparent;border-color:transparent;color:var(--purple)}
.btn--quiet:hover{background:var(--lilac);border-color:var(--lilac);color:var(--ink)}
.btn--danger{background:var(--white);border-color:var(--err);color:var(--err)}
.btn--danger:hover{background:var(--err);border-color:var(--err);color:var(--white)}
.btn--sm{min-height:34px;padding:5px 12px;font-size:.875rem}
.btn--big{min-height:56px;font-size:1.0625rem;padding:12px 22px}
.btn[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--white)}
.btn.is-busy{opacity:.6;pointer-events:none}
.btn[disabled]{opacity:.5;cursor:not-allowed}

/* ------------------------------------------------------------------ gate */
.gate{min-height:100svh;display:grid;grid-template-columns:min(42vw,560px) minmax(0,1fr);position:relative}
.gate::after{content:"";position:absolute;top:0;bottom:0;left:min(42vw,560px);width:3px;margin-left:-1.5px;background:var(--purple)}
.gate__band{background:var(--lilac);padding:clamp(28px,5vw,64px);display:flex;flex-direction:column;justify-content:center;gap:22px}
.gate__band img{width:132px;height:auto;background:var(--white);padding:10px;border-radius:2px}
.gate__band h1{font-size:clamp(2.5rem,4.6vw,4rem);line-height:.96}
.gate__band p{font-size:1.0625rem;max-width:24em}
.gate__form{padding:clamp(28px,6vw,88px);display:flex;flex-direction:column;justify-content:center;max-width:520px}
.gate__form h2{font-size:1.375rem;margin-bottom:18px}
.form__status{min-height:1.4em;margin-top:10px;font-weight:600}
.form__status[data-state="error"]{color:var(--err)}

/* ----------------------------------------------------------------- fields */
.field{display:flex;flex-direction:column;gap:5px;margin-bottom:14px;min-width:0}
.field > label,.field > .label{font-weight:600;font-size:.875rem}
.field small{color:var(--muted);font-size:.8125rem}
.field-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.field-row--3{grid-template-columns:repeat(3,minmax(0,1fr))}
input[type="text"],input[type="email"],input[type="password"],input[type="tel"],input[type="number"],input[type="date"],input[type="time"],input[type="search"],select,textarea{width:100%;min-height:40px;padding:8px 10px;border:1.5px solid #8C7AA6;border-radius:2px;background:var(--white);color:var(--ink);font:inherit}
textarea{min-height:76px;resize:vertical}
input:hover,select:hover,textarea:hover{border-color:var(--purple)}
input:focus,select:focus,textarea:focus{outline:3px solid var(--purple);outline-offset:1px;border-color:var(--purple)}
input::placeholder,textarea::placeholder{color:#6B5C80}
.check{display:flex;gap:10px;align-items:flex-start;margin-bottom:12px}
.check input{width:20px;height:20px;margin:1px 0 0;flex:none}
.choices{display:flex;flex-wrap:wrap;gap:8px}
.choice{position:relative;display:inline-flex}
.choice input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.choice > span{display:inline-flex;align-items:center;gap:7px;padding:6px 11px 6px 7px;border:1.5px solid var(--rule);border-radius:2px;background:var(--white);font-weight:600;color:var(--muted)}
.choice input:checked + span{border-color:var(--purple);background:var(--purple);color:var(--white)}
.choice input:not(:checked) + span .who{opacity:.45}
.choice input:focus-visible + span{outline:3px solid var(--ink);outline-offset:2px}

/* ----------------------------------------------------------------- shell */
.app{display:grid;grid-template-columns:var(--rail) minmax(0,1fr);min-height:100svh}
.rail{position:sticky;top:0;height:100svh;overflow-y:auto;background:var(--lilac);padding:18px 16px 16px 20px;display:flex;flex-direction:column;gap:18px;z-index:10}
/* the seam */
.app::before{content:"";position:fixed;top:0;bottom:0;left:var(--rail);width:3px;margin-left:-1.5px;background:var(--purple);z-index:11}
.rail__logo{display:block;background:var(--white);padding:8px;border-radius:2px;width:92px;line-height:0}
.rail__logo img{width:100%;height:auto;display:block}
.rail nav{display:grid;gap:2px}
.rail nav a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:2px;color:var(--ink);text-decoration:none;font-weight:600}
.rail nav a:hover{background:rgba(255,255,255,.6)}
.rail nav a[aria-current="page"]{background:var(--purple);color:var(--white)}
.rail h2{margin:0 0 6px 10px;color:var(--muted)}
.needs{display:grid;gap:2px}
.need{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border:0;border-radius:2px;background:transparent;text-align:left;cursor:pointer;font-weight:500}
.need:hover{background:rgba(255,255,255,.6)}
.need b{min-width:26px;height:24px;padding:0 6px;display:inline-grid;place-items:center;border-radius:2px;background:var(--pink);color:var(--ink);font-weight:800;font-variant-numeric:tabular-nums}
.need--none{color:var(--muted);cursor:default}
.need--none:hover{background:transparent}
.rail__me{margin-top:auto;padding-top:12px;border-top:1px solid rgba(101,59,152,.3);display:grid;gap:2px}
.rail__me b{font-weight:700}
.rail__me button{justify-self:start;margin-top:6px}
.work{min-width:0;padding:18px clamp(16px,2vw,28px) 40px clamp(18px,2.2vw,32px)}
.dock{display:none}

.view__head{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-bottom:14px}
.view__head h1{margin-right:auto}
.tools{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;margin-bottom:12px}
.formslot{display:contents}
.tools .chips{flex-basis:100%}
.seg{display:inline-flex;border:2px solid var(--purple);border-radius:2px;overflow:hidden}
.seg button{border:0;background:var(--white);padding:6px 13px;font-weight:600;color:var(--purple);cursor:pointer;min-height:34px}
.seg button + button{border-left:1px solid var(--purple)}
.seg button:hover{background:var(--lilac)}
.seg button[aria-pressed="true"]{background:var(--purple);color:var(--white)}
.datenav{display:inline-flex;align-items:center;gap:4px}
.datenav button:not(.btn){width:36px;height:36px;display:grid;place-items:center;border:1.5px solid var(--rule);background:var(--white);border-radius:2px;cursor:pointer}
.datenav button:not(.btn):hover{border-color:var(--purple);background:var(--lilac)}
.datenav input{width:auto;min-height:36px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 5px;border:1.5px solid var(--rule);border-radius:2px;background:var(--white);font-weight:600;font-size:.875rem;cursor:pointer;min-height:34px}
.chip[aria-pressed="false"]{color:var(--muted);background:var(--lilac-2)}
.chip[aria-pressed="false"] .who{opacity:.35}
.chip[aria-pressed="true"]{border-color:var(--ink)}
/* a cleaner: one fixed colour + her initials, wherever her name appears */
.who{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:2px;background:var(--c,#653B98);color:var(--on,#fff);font:800 .625rem/1 var(--text);letter-spacing:.02em;flex:none}
.who--lg{width:40px;height:40px;font-size:.9375rem}
.whos{display:inline-flex;gap:3px;vertical-align:middle}

.badge{display:inline-flex;align-items:center;gap:5px;padding:2px 7px;border-radius:2px;font:700 .6875rem/1.4 var(--text);letter-spacing:.08em;text-transform:uppercase;border:1.5px solid currentColor;white-space:nowrap}
.badge--need{background:var(--pink);border-color:var(--pink);color:var(--ink)}
.badge--warn{color:var(--err);background:var(--err-soft)}
.badge--open{color:var(--sky-ink);background:var(--sky-soft)}
.badge--ok{color:var(--ok)}
.badge--quiet{color:var(--muted)}
.badge svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}

/* ------------------------------------------------------------------- grid */
.board{border:1px solid var(--rule);border-radius:2px;overflow:auto;max-height:calc(100svh - 190px);position:relative;background:var(--white)}
.board__head{display:grid;grid-template-columns:var(--tracks);position:sticky;top:0;z-index:6;background:var(--white);border-bottom:2px solid var(--purple)}
.board__body{display:grid;grid-template-columns:var(--tracks);position:relative}
.colh{padding:8px 8px 7px;border-left:1px solid var(--rule-2);min-width:0;display:flex;flex-direction:column;gap:2px}
.colh a,.colh > span{font-weight:700;color:var(--ink);text-decoration:none;display:flex;align-items:center;gap:6px;min-width:0;line-height:1.2}
.colh a{white-space:nowrap}
.colh .whos{flex:none}
.colh a:hover{color:var(--purple);text-decoration:underline}
.colh small{color:var(--muted);font-size:.75rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.colh.is-today a{color:var(--purple)}
.colh.is-today{background:var(--lilac)}
.colh.is-closed{background:var(--lilac-2)}
.hours{position:relative}
.hours div{height:calc(var(--cell) * 4);position:relative}
.hours span{position:absolute;top:-8px;right:8px;font-size:.6875rem;font-weight:600;color:var(--muted);font-variant-numeric:tabular-nums;background:var(--white);padding:0 2px}
.col{position:relative;border-left:1px solid var(--rule-2);background-image:linear-gradient(to bottom,var(--rule) 1px,transparent 1px),linear-gradient(to bottom,var(--grid) 1px,transparent 1px);background-size:100% calc(var(--cell) * 4),100% var(--cell)}
.col.is-closed{background-color:var(--lilac-2)}
.cellbtn{position:absolute;left:0;right:0;height:var(--cell);border:0;background:transparent;padding:0;cursor:cell}
.cellbtn:hover{background:rgba(101,59,152,.12)}
.board.is-painting .cellbtn{cursor:copy}
.board.is-painting .cellbtn:hover{background:rgba(106,170,222,.45);height:calc(var(--cell) * 8);z-index:1}
/* unavailable time: hatched, so it prints and reads without colour */
.unavail{position:absolute;left:0;right:0;background:repeating-linear-gradient(135deg,rgba(90,74,112,.16) 0 2px,transparent 2px 7px);pointer-events:none}
.offday{position:absolute;inset:0;background:repeating-linear-gradient(135deg,rgba(90,74,112,.22) 0 2px,transparent 2px 7px);pointer-events:none;display:flex;justify-content:center;padding-top:10px}
.offday span{background:var(--white);padding:2px 8px;border:1.5px solid var(--muted);border-radius:2px;height:max-content;font-weight:700;font-size:.75rem}
.done-veil{position:absolute;left:0;right:0;top:0;background:rgba(101,59,152,.11);pointer-events:none;z-index:3}
/* the now-line is the squeegee blade moving down the day */
.nowline{position:absolute;left:0;right:0;height:3px;margin-top:-1.5px;background:var(--purple);z-index:5;pointer-events:none}
.nowhair{position:absolute;left:var(--gutter);right:0;height:1px;background:var(--purple);z-index:1;pointer-events:none}   /* under the job blocks: a line through a block would read as cancelled */
.hours .nowgrip{position:absolute;right:0;width:46px;height:20px;margin-top:-10px;background:var(--purple);color:#fff;border-radius:10px 0 0 10px;font:700 .625rem/20px var(--text);text-align:center;z-index:5;font-variant-numeric:tabular-nums}

.job{position:absolute;border:1.5px solid #A893C7;border-radius:2px;background:var(--lilac-2);padding:3px 6px 3px;overflow:hidden;text-align:left;cursor:pointer;font-size:.75rem;line-height:1.25;z-index:2;display:flex;flex-direction:column;gap:1px;touch-action:manipulation;user-select:none;transition:box-shadow .15s}
.job.is-compact .job__n{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.job.is-compact .job__t{text-overflow:clip}
.job.is-compact .job__c{white-space:normal;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.job__t .job__k{margin:0 0 0 4px}
.job__k{width:12px;height:12px;display:inline-block;vertical-align:-1px;margin-right:3px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.job:hover{box-shadow:0 3px 10px rgba(42,20,68,.22);z-index:3}
.job__t{font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.job__c{font-weight:700;font-size:.8125rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.job__w{display:flex;align-items:center;gap:4px;white-space:nowrap;overflow:hidden}
.job__w .who{width:18px;height:18px;font-size:.5625rem}
.job__n{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.job__f{position:absolute;top:3px;right:4px;width:14px;height:14px;stroke:var(--err);fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.job[data-status="requested"]{border:2px dashed var(--purple);background:var(--white)}
.job[data-status="in_progress"]{border:3px solid var(--ink);background:var(--white)}
.job[data-status="completed"]{background:#F1EDF5;border-color:var(--rule);color:var(--muted)}
.job[data-status="cancelled"]{background:var(--white);border-style:dotted;color:var(--muted);text-decoration:line-through;opacity:.75}
.job[data-status="missed"]{border-color:var(--err);background:var(--err-soft)}
.job.is-unassigned{background:repeating-linear-gradient(135deg,var(--pink-soft) 0 6px,var(--white) 6px 12px);border-color:var(--pink-ink)}
.job.is-dragging{opacity:.9;box-shadow:var(--shadow);z-index:9;cursor:grabbing;outline:3px solid var(--purple)}
.job.is-short .job__n{display:none}
.job.is-tiny{flex-direction:row;gap:6px;align-items:center;padding-top:1px;padding-bottom:1px}
.job.is-tiny .job__w,.job.is-tiny .job__n{display:none}
.slot{position:absolute;border:2px solid var(--sky-ink);border-radius:2px;background:var(--sky-soft);color:var(--sky-ink);padding:3px 6px;font:700 .6875rem/1.3 var(--text);letter-spacing:.06em;text-transform:uppercase;text-align:left;cursor:pointer;z-index:1;overflow:hidden}
.slot[data-status="booked"]{border-style:dashed;background:var(--white)}
.slot[data-status="closed"]{border-color:var(--muted);color:var(--muted);background:var(--white);text-decoration:line-through}

/* week by team: a row per pair, a column per day */
.tweek{border:1px solid var(--rule);border-radius:2px;overflow:auto}
.tweek__row{display:grid;grid-template-columns:var(--ttracks);border-bottom:1px solid var(--rule)}
.tweek__row:last-child{border-bottom:0}
.tweek__row--head{border-bottom:2px solid var(--purple);position:sticky;top:0;background:var(--white);z-index:2}
.tweek__team{padding:10px 10px 10px 12px;display:flex;flex-direction:column;gap:6px;align-items:flex-start;background:var(--lilac-2);font-size:.875rem;line-height:1.2}
.tweek__cell{padding:6px;border-left:1px solid var(--rule-2);display:flex;flex-direction:column;gap:4px;min-height:64px;min-width:0}
.tweek__cell.is-closed{background:var(--lilac-2)}
.tweek__cell.is-today{background:#FBF8FE}
.tjob{display:flex;flex-wrap:wrap;align-items:center;gap:2px 5px;width:100%;min-height:26px;padding:3px 6px;border:1.5px solid #A893C7;border-radius:2px;background:var(--lilac-2);text-align:left;cursor:pointer;font-size:.8125rem;line-height:1.2;min-width:0}
.tjob:hover{box-shadow:0 2px 8px rgba(42,20,68,.2)}
.tjob b{font-variant-numeric:tabular-nums;flex:none}
.tjob__len{flex:none;color:var(--muted);font-weight:600;font-size:.6875rem}
.tjob.is-dragging{position:relative;z-index:9;box-shadow:var(--shadow);outline:3px solid var(--purple);cursor:grabbing;pointer-events:none}
.tweek__cell.is-drop{outline:3px solid var(--purple);outline-offset:-3px;background:var(--lilac)}
/* the now-blade between what has started and what has not, and its grip at the head of today's column */
.tnow{height:3px;background:var(--purple);margin:1px -6px;flex:none}
.tnowgrip{align-self:flex-start;background:var(--purple);color:#fff;border-radius:10px;padding:1px 9px;font:700 .6875rem/1.5 var(--text);font-variant-numeric:tabular-nums}
.tjob > span{min-width:0;overflow-wrap:break-word}
.tjob .tjob__k{margin:0 0 0 auto;flex:none}
.tjob__f{width:13px;height:13px;flex:none;stroke:var(--err);fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.tjob[data-status="requested"]{border:2px dashed var(--purple);background:var(--white)}
.tjob[data-status="in_progress"]{border:3px solid var(--ink);background:var(--white)}
.tjob[data-status="completed"]{background:#F1EDF5;border-color:var(--rule);color:var(--muted)}
.tjob[data-status="missed"]{border-color:var(--err);background:var(--err-soft)}
.tjob.is-unassigned{background:repeating-linear-gradient(135deg,var(--pink-soft) 0 6px,var(--white) 6px 12px);border-color:var(--pink-ink)}
.tjob--off{border-style:dashed;border-color:var(--muted);background:var(--white);color:var(--muted);cursor:default;font-weight:600}
.tjob--slot{border:2px solid var(--sky-ink);background:var(--sky-soft);color:var(--sky-ink);font-weight:700}
.tjob--slot[data-status="booked"]{border-style:dashed;background:var(--white)}

/* month */
.month{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border:1px solid var(--rule);border-radius:2px}
.month__dow{padding:6px 8px;font-weight:700;font-size:.75rem;color:var(--muted);border-bottom:2px solid var(--purple);text-transform:uppercase;letter-spacing:.1em}
.month__day{min-height:112px;padding:6px 6px 8px;border-top:1px solid var(--rule-2);border-left:1px solid var(--rule-2);display:flex;flex-direction:column;gap:3px;text-decoration:none;color:var(--ink);min-width:0}
.month__day:nth-child(7n+1){border-left:0}
.month__day:hover{background:var(--lilac-2)}
.month__day.is-out{color:#9A8CB0;background:#FBF9FD}
.month__day.is-today .month__n{background:var(--purple);color:#fff}
.month__day.is-closed{background:var(--lilac-2)}
.month__n{align-self:flex-start;min-width:26px;height:24px;display:grid;place-items:center;border-radius:2px;font-weight:700;font-variant-numeric:tabular-nums}
.month__l{font-size:.75rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.month__l b{font-variant-numeric:tabular-nums}
.month__more{font-size:.75rem;color:var(--muted);font-weight:600}

/* run sheets */
.sheet{border:1px solid var(--rule);border-radius:2px;margin-bottom:22px}
.stopr{break-inside:avoid}
.sheet__h{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:2px solid var(--purple)}
.sheet__h h2{font:800 1.375rem/1.15 var(--text);color:var(--ink)}
.stopr{display:grid;grid-template-columns:96px minmax(0,1fr) 24px;gap:6px 16px;padding:12px 16px;border-bottom:1px solid var(--rule-2)}
.stopr:last-child{border-bottom:0}
.stopr__t{font-weight:800;font-variant-numeric:tabular-nums}
.stopr__t small{display:block;font-weight:500;color:var(--muted)}
.stopr h3{font-size:1rem}
.stopr__box{width:20px;height:20px;border:2px solid var(--ink);border-radius:2px;margin-top:2px}
.pinned{margin-top:6px;padding:8px 10px 8px 34px;background:var(--white);border:2px solid var(--ink);border-radius:2px;position:relative;white-space:pre-wrap}
.pinned::before{content:"";position:absolute;left:10px;top:9px;width:16px;height:16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232A1444' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 17v5M5 17h14l-2-5V5h1V3H6v2h1v7z'/%3E%3C/svg%3E") center/contain no-repeat}
.pinned b{display:block;font-size:.6875rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);margin-bottom:2px}
.entry{margin-top:6px;padding:8px 10px;border:1.5px dashed var(--muted);border-radius:2px;white-space:pre-wrap}
.entry b{display:block;font-size:.6875rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}

/* ---------------------------------------------------------------- lists */
.split{display:grid;grid-template-columns:minmax(260px,340px) minmax(0,1fr);gap:0;border:1px solid var(--rule);border-radius:2px;min-height:60svh}
.split__list{border-right:1px solid var(--rule);max-height:calc(100svh - 150px);overflow:auto}
.split__main{padding:20px clamp(16px,2vw,28px) 28px;min-width:0;max-height:calc(100svh - 150px);overflow:auto}
.lrow{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:0;border-bottom:1px solid var(--rule-2);background:var(--white);text-align:left;cursor:pointer;text-decoration:none;color:var(--ink)}
.lrow:hover{background:var(--lilac-2)}
.lrow[aria-current="true"]{background:var(--lilac)}
.lrow[aria-current="true"] b{color:var(--purple)}
.lrow__main{flex:1;min-width:0}
.lrow__main b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lrow__main small{display:block;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.listtools{position:sticky;top:0;background:var(--white);padding:10px;border-bottom:1px solid var(--rule);z-index:2;display:grid;gap:8px}
.file__name{font:800 1.625rem/1.15 var(--text);color:var(--ink)}
.section{margin-top:22px;padding-top:16px;border-top:1px solid var(--rule)}
.section > h2{margin-bottom:10px}
.kv{display:grid;grid-template-columns:120px minmax(0,1fr);gap:6px 14px;margin:0}
.kv dt{color:var(--muted);font-weight:600}
.kv dd{margin:0;min-width:0;overflow-wrap:anywhere}
.notes{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.notes li{padding:9px 12px;background:var(--lilac-2);border-radius:2px;white-space:pre-wrap}
.notes small{display:block;margin-top:4px;color:var(--muted)}
.jobline{display:flex;align-items:center;gap:10px;width:100%;min-width:0;padding:8px 10px;border:0;border-bottom:1px solid var(--rule-2);background:transparent;text-align:left;cursor:pointer}
.jobline > span{min-width:0;overflow:hidden}
.jobline small{max-width:100% !important}
.needrow{display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--rule-2)}
.needrow .jobline{border-bottom:0}
.back{display:inline-flex;align-items:center;gap:4px;font-weight:600}
.morelist{border:1px solid var(--rule);border-radius:2px}
.morelist .lrow{min-height:60px}
.jobline:hover{background:var(--lilac-2)}
.jobline b{font-variant-numeric:tabular-nums;min-width:150px;flex:none}
.table{width:100%;border-collapse:collapse}
.table th{text-align:left;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:8px 10px;border-bottom:2px solid var(--purple);white-space:nowrap}
.table td{padding:8px 10px;border-bottom:1px solid var(--rule-2);vertical-align:top}
.table td.num,.table th.num{text-align:right;font-variant-numeric:tabular-nums}
.table tr.is-total td{font-weight:800;border-top:2px solid var(--ink);border-bottom:0}
.avail{display:grid;gap:6px}
.avail__row{display:grid;grid-template-columns:94px minmax(0,1fr) auto;gap:10px;align-items:center;padding:6px 0;border-bottom:1px solid var(--rule-2)}
.avail__ranges{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.avail__ranges input{width:138px;min-height:36px}
.avail__off{color:var(--muted);font-weight:600}
.thread{display:grid;gap:10px;margin-bottom:14px}
.msg{max-width:min(78%,560px);padding:9px 12px;border-radius:2px;background:var(--lilac-2);white-space:pre-wrap;overflow-wrap:anywhere}
.msg small{display:block;margin-top:4px;color:var(--muted)}
.msg--office{justify-self:end;background:var(--purple);color:#fff}
.msg--office small{color:#E5D8F5}
.msg--system{justify-self:center;background:transparent;border:1.5px dashed var(--rule);color:var(--muted);max-width:100%}
.msg b.kind{display:block;font-size:.6875rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:3px}
.empty{padding:28px 20px;border:1.5px dashed var(--rule);border-radius:2px;text-align:center}
.empty b{display:block;font-size:1.0625rem;margin-bottom:4px}
.skeleton{display:grid;gap:10px;padding:8px 0}
.skeleton span{height:44px;border-radius:2px;background:var(--lilac-2)}
.skeleton span:nth-child(2){width:86%}.skeleton span:nth-child(3){width:70%}
.warnline{display:flex;gap:8px;align-items:flex-start;padding:8px 10px;background:var(--err-soft);border:1.5px solid var(--err);color:var(--err);border-radius:2px;font-weight:600;margin-bottom:8px}
.once{padding:12px 14px;background:var(--white);border:2px solid var(--ink);border-radius:2px}
.once code{font:700 1.125rem/1.4 ui-monospace,Menlo,Consolas,monospace;user-select:all}

/* ---------------------------------------------------------------- drawer */
.drawer{position:fixed;inset:0;z-index:50;background:rgba(42,20,68,.32);display:flex;justify-content:flex-end}
.drawer__in{width:min(480px,100vw);height:100%;overflow:auto;background:var(--white);box-shadow:var(--shadow);padding:18px 22px 28px;border-left:3px solid var(--purple);animation:drawer-in .18s cubic-bezier(.2,.8,.2,1)}
@keyframes drawer-in{from{transform:translateX(24px);opacity:.4}to{transform:none;opacity:1}}
.drawer__head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}
.drawer__head h2{font:800 1.375rem/1.2 var(--text);color:var(--ink)}
.drawer__close{width:40px;height:40px;display:grid;place-items:center;border:1.5px solid var(--rule);border-radius:2px;background:var(--white);cursor:pointer;flex:none}
.drawer__close:hover{background:var(--lilac);border-color:var(--purple)}
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:80;background:var(--ink);color:#fff;padding:11px 18px;border-radius:2px;font-weight:600;box-shadow:var(--shadow);max-width:min(92vw,560px)}
.toast.is-error{background:var(--err)}
.toast__act{margin-left:14px;padding:4px 12px;border:1.5px solid #fff;border-radius:2px;background:transparent;color:#fff;font-weight:700;cursor:pointer}
.toast__act:hover{background:#fff;color:var(--ink)}
details > summary{list-style:none}
details > summary::-webkit-details-marker{display:none}
details > summary::before{content:"";display:inline-block;width:14px;height:14px;margin-right:6px;vertical-align:-1px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23653B98' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .15s}
details[open] > summary::before{transform:rotate(90deg)}

/* ------------------------------------------------- cleaner on a phone */
.day{display:grid;gap:14px;max-width:640px}
.stopcard{border:1.5px solid #A893C7;border-radius:2px;padding:14px 16px 16px}
.stopcard[data-status="in_progress"]{border:3px solid var(--ink)}
.stopcard[data-status="completed"]{background:#F6F3F9;border-color:var(--rule)}
.stopcard__t{font-weight:800;font-size:1.0625rem;font-variant-numeric:tabular-nums}
.stopcard h2{font:800 1.375rem/1.2 var(--text);color:var(--ink);margin:4px 0 2px}
.stopcard__with{display:flex;align-items:center;gap:8px;margin-top:8px;font-weight:600}
.clockbar{position:sticky;bottom:12px;z-index:5;background:var(--white);border:3px solid var(--purple);border-radius:2px;padding:12px 14px;display:flex;align-items:center;gap:12px;box-shadow:var(--shadow)}
.clockbar b{display:block;font-size:1.0625rem}

/* ------------------------------------------------------------ narrow ≤ 900 */
@media (max-width:900px){
  :root{--gutter:44px}
  .app{grid-template-columns:minmax(0,1fr);padding-bottom:calc(64px + env(safe-area-inset-bottom))}
  .app::before{left:0;margin-left:0}
  .rail{display:none}
  .work{padding:14px 14px 28px 17px}
  .dock{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--white);border-top:3px solid var(--purple);padding-bottom:env(safe-area-inset-bottom)}
  .dock a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:62px;font-size:.6875rem;font-weight:700;color:var(--muted);text-decoration:none;position:relative}
  .dock a[aria-current="page"]{color:var(--purple);box-shadow:inset 0 3px 0 var(--purple)}
  .dock a b{position:absolute;top:6px;left:calc(50% + 8px);min-width:18px;height:18px;padding:0 4px;border-radius:2px;background:var(--pink);color:var(--ink);font-size:.6875rem;display:grid;place-items:center}
  .gate{grid-template-columns:minmax(0,1fr)}
  .gate::after{left:0;margin-left:0}
  .gate__band{padding:28px 24px}
  .gate__form{padding:28px 24px 48px}
  .board{max-height:none}
  .desk,.formslot{display:none !important}
  .tweek__row{min-width:820px}
  .needrow{flex-wrap:wrap;padding-bottom:10px}
  .needrow .jobline{flex:1 1 100%}
  .needrow .btn{margin-left:10px}
  .jobline b{min-width:112px}
  .chips{flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding-bottom:4px}
  .chip{flex:none}
  .split{grid-template-columns:minmax(0,1fr);border:0}
  .split__list{border-right:0;border:1px solid var(--rule);max-height:none}
  .split__main{padding:16px 0;max-height:none}
  .split.has-file .split__list{display:none}
  .field-row,.field-row--3{grid-template-columns:minmax(0,1fr)}
  .drawer__in{width:100vw;border-left:0;border-top:3px solid var(--purple)}
  .month__day{min-height:70px}
  .month__l{display:none}
  .stopr{grid-template-columns:76px minmax(0,1fr) 22px}
  .kv{grid-template-columns:96px minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none !important;animation:none !important}}

/* ------------------------------------------------------------------ print */
@page{size:letter landscape;margin:.4in}
@page sheet{size:letter portrait;margin:.5in}
@media print{
  body{font-size:10pt}
  .rail,.dock,.tools,.view__head .btn,.drawer,.toast,.cellbtn,.nowline,.nowgrip,.done-veil,.app::before,.noprint{display:none !important}
  .app{display:block;padding:0}
  .work{padding:0}
  .board{max-height:none;overflow:visible;border-color:#000;zoom:.8}
  .tweek{overflow:visible;border-color:#000}
  .tweek__row--head{position:static;border-bottom-color:#000}
  .tjob{background:#fff !important;border-color:#000;color:#000}
  .view__head{margin-bottom:6px}
  h1{font-size:1.375rem}
  .done-veil,.nowhair{display:none !important}
  .job[data-status="completed"]{color:#000}
  .month__day{min-height:88px}
  .board__head{position:static;border-bottom-color:#000}
  .job{background:#fff !important;border-color:#000;color:#000;box-shadow:none}
  .who{background:#fff !important;color:#000;border:1.2px solid #000;print-color-adjust:exact}
  .slot{border-color:#000;color:#000;background:#fff}
  .pinned{background:#fff;border-color:#000}
  .sheet{border-color:#000;break-after:page;page:sheet}
  .work:has(.sheet) .view__head{display:none}
  .sheet:last-child{break-after:auto}
  .sheet__h{border-bottom-color:#000}
  h1,.sheet__h h2{color:#000}
  .split__list{display:none}
  .split{display:block;border:0}
}