:root{color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}html{scroll-padding-top:env(safe-area-inset-top,0px)}body{margin:0;padding:0;font:14px -apple-system,BlinkMacSystemFont,sans-serif;background:#fff;color:#000}img{max-width:100%}[hidden]:not([hidden=until-found i]){display:none!important}
/* Layout: one working column under a black logo band; dark section bars like the paper report sheets, Avalon blue for actions, traffic-light colours only for machine state. */
:root{
  /* Light theme matched to avaloncnc.co.uk: pale grey page, white cards, navy ink and header, Avalon blue for actions. */
  --bg:#f3f5f9; --surface:#ffffff; --ink:#0f1a2e; --muted:#556175; --line:#d8dee8;
  --bar:#e4eaf3; --bar-ink:#13203a; --blue:#2f78ea; --blue-ink:#ffffff; --field:#f7f9fc;
  --brand:#3b82f6; --chip:#e6ebf3; --plate:#13203a; --head:#0f1a33; --head-ink:#ffffff; --head-muted:#a9b8d3;
  --green:#1d8a55; --amber:#b7780a; --red:#d4372c; --focus:#2f78ea;
  --paper:#ffffff; --paper-ink:#111827; --paper-line:#9aa3b5; --paper-bar:#171b24;
  --wide:'Barlow Condensed','Arial Narrow',system-ui,sans-serif;
  --display:'Barlow Condensed','Arial Narrow',system-ui,sans-serif;
  --text:'Barlow',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.45 var(--text)}
h1,h2,h3,h4{font-family:var(--display);margin:0;text-wrap:balance}
.wrap{max-width:980px;margin:0 auto;padding:0 16px 32px}
.wrap.brandin{padding:14px 16px 12px}

.brandbar{background:var(--head);color:var(--head-ink);border-bottom:3px solid var(--brand)}
.brandin{display:flex;align-items:center;justify-content:space-between;gap:10px 18px;flex-wrap:wrap;padding-block:14px 12px}
.logo{display:block;height:46px;width:auto;max-width:100%}
@media(min-width:640px){.logo{height:54px}}
.tag{font-family:var(--display);font-weight:600;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--head-muted)}
.foot{margin-top:28px;padding-block:14px;border-top:3px solid var(--bar);font-family:var(--display);font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);display:flex;flex-wrap:wrap;gap:4px 14px}

.tabs{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--line);margin-bottom:18px}
.tabs::-webkit-scrollbar{display:none}
.tabs button{font:600 15px var(--display);letter-spacing:.04em;padding:13px 12px 10px;border:0;border-bottom:3px solid transparent;background:none;color:var(--muted);cursor:pointer;white-space:nowrap;flex:none}
.tabs button:hover{color:var(--ink)}
.tabs button.on{color:var(--ink);border-bottom-color:var(--brand)}
@media(max-width:480px){.tabs button{font-size:14px;padding:12px 8px 9px}}
.brandbar{position:relative;z-index:30}
.hdr-r{display:flex;align-items:center;gap:16px}
@media(max-width:640px){.tag{display:none}}
.newwrap{position:relative}
.newbtn{font:600 15px var(--display);letter-spacing:.04em;background:var(--brand);color:#fff;border:0;border-radius:6px;padding:10px 16px;min-height:42px;cursor:pointer;white-space:nowrap}
.newbtn:hover{filter:brightness(1.08)}
.newmenu{position:absolute;right:0;top:calc(100% + 6px);background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:8px;box-shadow:0 10px 28px rgba(0,0,0,.25);padding:6px;display:grid;gap:2px;width:min(280px,calc(100vw - 32px))}
.newmenu button{text-align:left;padding:10px 12px;border:0;background:none;color:var(--ink);font:600 16px var(--text);border-radius:6px;cursor:pointer}
.newmenu button:hover,.newmenu button:focus-visible{background:var(--field)}
.newmenu small{display:block;font-weight:400;color:var(--muted);font-size:13px}
.newmenu hr{border:0;border-top:1px solid var(--line);margin:4px 6px}
.footlink{margin-left:auto;background:none;border:0;padding:0;font:inherit;letter-spacing:inherit;text-transform:inherit;color:var(--blue);cursor:pointer}
.tabs i{font-style:normal;margin-left:6px;background:var(--amber);color:#fff;border-radius:999px;padding:0 7px;font-size:13px}
.tabs i:empty{display:none}
.rm{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:14px;margin-bottom:12px;display:grid;gap:10px}
.rm .hd{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:baseline}
.rm .hd b{font-family:var(--display);font-size:20px}
.rm textarea{min-height:220px}
.rm .to{color:var(--muted);font-size:14px;overflow-wrap:anywhere}
.chase{display:grid;gap:10px;border-top:1px solid var(--line);padding-top:10px}
.chase textarea{min-height:220px}
.rmbody{white-space:pre-wrap;font:15px/1.45 var(--text);color:var(--ink);background:var(--field);border:1px solid var(--line);border-radius:6px;padding:10px 12px;margin:0;overflow-wrap:anywhere}
.switch{display:flex;align-items:center;gap:10px;font-weight:600;cursor:pointer}
.switch input{width:22px;height:22px;accent-color:var(--blue)}

button{font:inherit}
.btn{padding:10px 16px;border-radius:6px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-weight:600;cursor:pointer;min-height:44px}
.btn.pri{background:var(--blue);border-color:var(--blue);color:var(--blue-ink)}
.btn.ghost{background:transparent}
.btn.danger{color:var(--red);border-color:var(--red);background:transparent}
.btn.danger.arm{background:var(--red);color:#fff}
.btn.sm{min-height:36px;padding:6px 12px;font-size:14px}
.btn:disabled{opacity:.55;cursor:default}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,canvas:focus-visible{outline:3px solid var(--focus);outline-offset:1px}
.acts{display:flex;gap:8px;flex-wrap:wrap;margin-block:4px 16px}

.ptitle{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;margin:2px 0 6px}
.ptitle h2{font-size:30px;font-weight:700;letter-spacing:.01em}
.crumb{color:var(--muted);font-size:14px;margin-bottom:4px}
.crumb button{background:none;border:0;padding:0;color:var(--blue);cursor:pointer;font-weight:600}
.rno{font-family:var(--display);font-size:22px;font-weight:700;color:var(--blue);border:2px solid var(--blue);border-radius:6px;padding:2px 10px}
.rnoctl{display:inline-flex;align-items:center;gap:6px}
.rnoctl .rno{display:inline-flex;align-items:baseline;gap:1px}
.rnoctl .rno input{font:inherit;color:inherit;background:transparent;border:0;min-height:0;box-shadow:none;border-radius:0;width:5.2ch;padding:0;text-align:left}
.rnoctl input:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.rnoctl .step{min-width:44px;font-size:16px;line-height:1}
.rnoctl.dup .rno{color:var(--red);border-color:var(--red)}
.nomsg{margin:0 0 8px;min-height:0}
.impchk{margin:0 0 10px;font-weight:600}
.trnote{border:1px dashed var(--muted);border-radius:6px;padding:12px;color:var(--ink);background:var(--field);font-size:15px;line-height:1.4}
h2.sec{font-size:15px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:24px 0 10px}

.blk{background:var(--surface);border:1px solid var(--line);border-radius:6px;margin-bottom:12px;overflow:hidden}
.blk>h3{background:var(--bar);color:var(--bar-ink);font-size:15px;font-weight:600;padding:8px 12px;letter-spacing:.08em;text-transform:uppercase}
.bd{padding:12px}
.grid{display:grid;grid-template-columns:1fr;gap:10px 14px}
@media(min-width:640px){.grid{grid-template-columns:1fr 1fr}.grid .wide{grid-column:1/-1}}
.fld{display:flex;flex-direction:column;gap:3px;min-width:0}
.fld>span,.lbl{font-size:13px;font-weight:600;color:var(--muted)}
input[type=text],input[type=date],input[type=tel],input[type=email],input[type=password],input:not([type]),select,textarea{
  width:100%;font:inherit;color:var(--ink);background:var(--field);border:1px solid var(--line);border-radius:6px;padding:9px 10px;min-height:44px}
textarea{resize:vertical;min-height:84px;line-height:1.4}
.chks{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:2px 14px}
.chk{display:flex;align-items:center;gap:10px;min-height:40px;cursor:pointer}
.chk input{width:22px;height:22px;accent-color:var(--blue);flex:none}
.chks+.fld{margin-top:10px}
.pmgrid{display:grid;grid-template-columns:1fr;gap:0 12px}
@media(min-width:760px){.pmgrid{grid-template-columns:1fr 1fr}}
.pick{background:var(--field)}

.status{display:grid;gap:8px}
.st{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:8px;padding:10px 12px;cursor:pointer;background:var(--field)}
.st input{position:absolute;opacity:0;pointer-events:none}
.st .dot{width:22px;height:22px;border-radius:50%;flex:none;background:var(--c);opacity:.35;border:2px solid var(--c)}
.st b{display:block;font-weight:600}
.st small{display:block;color:var(--muted);font-size:13px}
.st-g{--c:var(--green)}.st-a{--c:var(--amber)}.st-r{--c:var(--red)}
.st:has(input:checked){border-color:var(--c);box-shadow:inset 0 0 0 2px var(--c)}
.st:has(input:checked) .dot{opacity:1}
.two{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:760px){.two{grid-template-columns:1fr 1fr}}
.yn{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:40px}
.yn .opts{display:flex;gap:14px}
.yn label{display:flex;align-items:center;gap:6px;cursor:pointer}
.yn input{width:20px;height:20px;accent-color:var(--blue)}
.prow{display:grid;grid-template-columns:1fr 64px 92px;gap:8px;margin-bottom:8px}
.prow input{min-width:0}
.tot{margin:10px 0 0;text-align:right;color:var(--muted)}
.tot b{color:var(--ink);font-size:18px}
.sigwrap{display:flex;flex-direction:column;gap:6px}
canvas.sig{width:100%;height:150px;background:#fff;border:1px dashed var(--muted);border-radius:6px;touch-action:none;cursor:crosshair}
.hint{color:var(--green);font-size:14px;min-height:20px;margin:0 0 8px}
.bar{position:sticky;bottom:0;display:flex;gap:8px;flex-wrap:wrap;align-items:center;background:color-mix(in srgb,var(--bg) 88%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:1px solid var(--line);box-shadow:0 -8px 18px rgba(0,0,0,.12);padding:10px 0 calc(10px + env(safe-area-inset-bottom,0px));margin-top:8px;z-index:5}
.msg{color:var(--green);font-weight:600;margin-left:4px}
.msg.err{color:var(--red)}

.search{margin-bottom:12px}
.item{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:12px 14px;margin-bottom:8px;color:var(--ink);cursor:pointer}
.item:hover{border-color:var(--blue)}
.item b{font-family:var(--display);font-size:19px;color:var(--blue)}
.item .l{display:flex;flex-direction:column;gap:2px;min-width:0}
.item .l span{color:var(--muted);font-size:14px;overflow-wrap:anywhere}
.item .r{text-align:right;color:var(--muted);font-size:14px;flex:none}
.empty{background:var(--surface);border:1px dashed var(--line);border-radius:8px;padding:22px;text-align:center;color:var(--muted)}
.empty .row{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:12px}
.note{color:var(--muted);font-size:15px;max-width:68ch;margin:0 0 10px}
textarea.bk{min-height:180px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px}

.pill{display:inline-block;font-size:13px;font-weight:600;padding:2px 9px;border-radius:999px;border:1px solid var(--c);color:var(--c);white-space:nowrap}
.p-r{--c:var(--red)}.p-a{--c:var(--amber)}.p-g{--c:var(--green)}.p-n{--c:var(--muted)}
.item.due{border-left:5px solid var(--c)}
.kv{display:grid;grid-template-columns:1fr;gap:0;margin:0}
@media(min-width:640px){.kv{grid-template-columns:1fr 1fr;column-gap:24px}}
.kv div{display:grid;grid-template-columns:130px 1fr;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);min-width:0}
.kv dt{color:var(--muted);font-size:14px;font-weight:600}
.kv dd{margin:0;overflow-wrap:anywhere;white-space:pre-wrap}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-bottom:6px}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:12px 14px}
.stat b{display:block;font-family:var(--display);font-size:30px;line-height:1.1;font-variant-numeric:tabular-nums}
.stat span{color:var(--muted);font-size:14px}
.stat.r b{color:var(--red)}.stat.a b{color:var(--amber)}
.notice{background:var(--surface);border:1px solid var(--line);border-left:5px solid var(--amber);border-radius:6px;padding:14px 16px;margin-bottom:14px}

/* off-screen paper copy used to build the PDF */
#pdfroot{position:fixed;left:-12000px;top:0;width:760px;background:var(--paper);color:var(--paper-ink);font:13px/1.4 var(--text);padding:0}
#pdfroot .pb{background:var(--paper);padding:0 0 2px}
#pdfroot .ptr{border:1px dashed #6b7280;padding:8px;margin:4px 0;font-style:italic}
#pdfroot .phead{display:flex;justify-content:space-between;align-items:flex-end;border-bottom:3px solid var(--paper-bar);padding-bottom:8px}
#pdfroot .phead img{display:block;height:48px;width:auto;margin-bottom:4px}
#pdfroot .phead .tg{font:600 11px var(--display);letter-spacing:.14em;text-transform:uppercase;color:#4b5468}
#pdfroot .pfoot{background:var(--paper-bar);color:#fff;font:600 10px var(--display);letter-spacing:.14em;text-transform:uppercase;padding:6px 8px;margin-top:4px}
#pdfroot .phead .r{text-align:right;font-size:12px}
#pdfroot .ptl{display:flex;justify-content:space-between;align-items:center;padding:10px 0 2px}
#pdfroot .ptl h4{font-size:22px}
#pdfroot .ptl span{font-family:var(--display);font-weight:700;font-size:18px;border:2px solid var(--paper-bar);padding:1px 8px;border-radius:4px}
#pdfroot h5{margin:0;background:var(--paper-bar);color:#fff;font:600 12px var(--display);letter-spacing:.08em;text-transform:uppercase;padding:4px 8px}
#pdfroot .pbd{border:1px solid var(--paper-line);border-top:0;padding:6px 8px}
#pdfroot table{width:100%;border-collapse:collapse}
#pdfroot .pkv{display:grid;grid-template-columns:1fr 1fr;column-gap:18px}
#pdfroot .pkv div{display:grid;grid-template-columns:120px 1fr;gap:6px;padding:2px 0;border-bottom:1px solid #e3e6ee}
#pdfroot .pkv dt{color:#4b5468;font-weight:600}
#pdfroot .pkv dd{margin:0}
#pdfroot .ticks{display:grid;grid-template-columns:1fr 1fr;column-gap:18px}
#pdfroot .ticks div{padding:1px 0}
#pdfroot .ticks .y::before{content:"\2713  ";font-weight:700;color:#1d7a46}
#pdfroot .ticks .n{color:#7a8296}
#pdfroot .ticks .n::before{content:"\2013  "}
#pdfroot .txt{white-space:pre-wrap}
#pdfroot td,#pdfroot th{border-bottom:1px solid #e3e6ee;padding:3px 4px;text-align:left}
#pdfroot .sigs{display:grid;grid-template-columns:1fr 1fr;gap:18px}
#pdfroot .sigs img{display:block;height:70px;max-width:100%;border-bottom:1px solid var(--paper-line)}
#pdfroot .stline{font-weight:700}
/* home */
.hello h2{font-size:30px;font-weight:700}
.hello p{color:var(--muted);margin:2px 0 14px}
.todayc{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:14px 16px;margin-bottom:16px;display:grid;gap:6px}
.todayc .al{font:600 13px var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.tnone{margin:0;font-size:17px}
.quick{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media(min-width:640px){.quick{grid-template-columns:repeat(4,1fr)}}
.quick button{min-height:54px;font:600 16px var(--display);letter-spacing:.03em;background:var(--surface);border:1px solid var(--line);border-radius:8px;color:var(--ink);cursor:pointer;padding:8px}
.quick button:hover{border-color:var(--brand);color:var(--brand)}
.attn{display:flex;flex-wrap:wrap;gap:8px}
.ch{background:var(--surface);border:1px solid var(--c);color:var(--c);border-radius:999px;padding:8px 14px;font:600 15px var(--text);cursor:pointer;min-height:40px}
/* schedule */
.avail{background:var(--surface);border:1px solid var(--line);border-left:6px solid var(--brand);border-radius:8px;padding:14px 16px;margin-bottom:16px}
.avail .al{font:600 13px var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.avail .ad{font:700 32px/1.1 var(--display);color:var(--ink);margin:4px 0 6px;text-wrap:balance}
.avail .as{color:var(--muted);font-size:15px}
@media(max-width:480px){.avail .ad{font-size:27px}}
.week{display:grid;gap:6px}
.wday{display:grid;grid-template-columns:56px minmax(0,1fr);gap:12px;align-items:start;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:10px 12px}
.wday.wkend{background:transparent;border-style:dashed;padding:6px 12px}
.wday.wkend .wdate span{font-size:18px}
.wday.past{opacity:.6}
.wday.today{border-color:var(--brand);box-shadow:inset 4px 0 0 var(--brand)}
.wdate{display:flex;flex-direction:column;align-items:center;line-height:1.05;font-family:var(--display)}
.wdate b{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.wdate span{font-size:26px;font-weight:700;font-variant-numeric:tabular-nums}
.wday.today .wdate b,.wday.today .wdate span{color:var(--brand)}
.wjobs{display:grid;gap:6px;min-width:0;align-self:center}
.wjob{text-align:left;width:100%;background:var(--field);border:1px solid var(--line);border-left:4px solid var(--c);border-radius:6px;padding:8px 10px;color:var(--ink);font:inherit;cursor:pointer;display:grid;gap:1px}
.wjob:hover{border-color:var(--blue);border-left-color:var(--c)}
.wjob b{font-family:var(--display);font-size:18px;line-height:1.2}
.wjob span{color:var(--muted);font-size:14px;overflow-wrap:anywhere}
.wadd{justify-self:start;background:none;border:1px dashed var(--line);border-radius:6px;padding:8px 12px;color:var(--muted);font:inherit;font-size:14px;cursor:pointer;min-height:40px}
.wadd:hover{border-color:var(--blue);color:var(--blue)}
.wfree{color:var(--muted);font-size:14px}
.wksub{color:var(--muted);font-size:14px;margin:-2px 0 12px;text-align:center}
[data-dragjob]{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
.wjob{cursor:grab}
.lifted{opacity:.35}
.wjob.off{background:repeating-linear-gradient(135deg,var(--field) 0 8px,var(--surface) 8px 16px)}
.cal .chip.off{background:var(--amber);color:#fff}
body.dragging,body.dragging *{cursor:grabbing!important}
.dragghost{position:fixed;z-index:100;pointer-events:none;background:var(--brand);color:#fff;font:600 15px var(--display);letter-spacing:.03em;padding:8px 12px;border-radius:6px;box-shadow:0 8px 20px rgba(0,0,0,.3);white-space:nowrap;transform:translate(-50%,-140%)}
.droptarget{outline:2px dashed var(--brand)!important;outline-offset:-2px;background:var(--field)!important}
.draghint{color:var(--muted);font-size:13px;text-align:center;margin:-6px 0 10px}
.toast{position:fixed;left:50%;bottom:calc(16px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:90;background:var(--ink);color:var(--bg);padding:12px 14px;border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.3);display:flex;gap:14px;align-items:center;width:max-content;max-width:calc(100vw - 32px);font-size:15px;line-height:1.35}
.toast button{background:none;border:0;color:var(--brand);font:700 15px var(--text);cursor:pointer;padding:6px;flex:none}
.linkbtn{background:none;border:0;padding:0;color:var(--blue);font:inherit;font-weight:600;cursor:pointer}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.seg button{font:inherit;font-weight:600;padding:8px 14px;border:0;background:var(--surface);color:var(--ink);cursor:pointer;min-height:40px}
.seg button.on{background:var(--blue);color:var(--blue-ink)}
.schedtop{display:flex;gap:8px;flex-wrap:wrap;align-items:center;justify-content:space-between;margin-bottom:12px}
.wkh{font-size:15px;font-weight:700;color:var(--muted);margin:18px 0 6px}
.calnav{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.calnav h3{font-family:var(--display);font-size:22px;margin:0}
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}
.cal .dow{font-size:12px;font-weight:600;color:var(--muted);text-align:center;padding:4px 0}
.cal .day{min-height:62px;background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:3px;text-align:left;display:flex;flex-direction:column;gap:2px;cursor:pointer;color:var(--ink);font:inherit;overflow:hidden;min-width:0}
.cal .day .dn{font-size:13px;font-weight:700}
.cal .day.out{opacity:.4}
.cal .day.wkend{background:var(--bg)}
.cal .day.today .dn{color:var(--blue)}
.cal .day.today{border-color:var(--blue)}
.cal .day.sel{outline:2px solid var(--blue);outline-offset:-2px}
.cal .chip{font-size:11px;line-height:1.25;background:var(--blue);color:var(--blue-ink);border-radius:3px;padding:1px 3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal .chip.done{background:var(--green);color:#fff}
.mlist{display:grid;gap:4px}
.warn{color:var(--amber);font-weight:600;margin:6px 0 0}
.attrow{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;border:1px solid var(--line);border-radius:6px;padding:8px 10px;margin-bottom:6px;background:var(--field)}
.attrow .an{font-weight:600;overflow-wrap:anywhere;min-width:0}
.attrow .an small{display:block;font-weight:400;color:var(--muted)}
.attrow .aa{display:flex;gap:6px;flex:none}
.attrow a.btn{text-decoration:none;display:inline-flex;align-items:center}
.fileup{position:relative;display:inline-flex}
.fileup input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.fileup:focus-within{outline:2px solid var(--focus);outline-offset:2px;border-radius:8px}
@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}

/* Avalon skin. The one distinctive move: panels and buttons take the cut corner of the logo's angular letterforms, and report numbers sit on graphite plates like a machine's ID plate. Everything else stays quiet: no outlines, blue only for actions and the brand triangle. */
:root{--cut:12px;--cut-s:7px}
.ptitle h2,.hello h2{font-family:var(--wide);font-weight:700;letter-spacing:-.005em}
.ptitle h2{font-size:28px;line-height:1.15}
.hello h2{font-size:30px;line-height:1.1}
h2.sec{font:600 19px/1.2 var(--wide);letter-spacing:0;text-transform:none;color:var(--ink);display:flex;align-items:center;gap:10px;margin:28px 0 12px}
h2.sec::before{content:"";width:12px;height:10px;background:var(--brand);clip-path:polygon(50% 0,100% 100%,0 100%);flex:none}
.wkh,.calnav h3{font-family:var(--wide)}
.item,.blk,.rm,.stat,.empty,.notice,.todayc,.avail,.wday,.quick button,.attrow,.chase{border:0!important;border-radius:0!important}
.item,.blk,.rm,.stat,.empty,.notice,.todayc,.avail,.wday,.quick button{clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%)}
.item{background:var(--surface);transition:background .12s}
.item:hover{background:var(--field)}
.item.due{box-shadow:inset 5px 0 0 var(--c)}
.item b{color:var(--ink);font-family:var(--wide);font-size:18px;font-weight:600}
.empty{background:var(--surface);color:var(--muted)}
.notice{box-shadow:inset 5px 0 0 var(--amber)}
.attrow{background:var(--field)}
.chase{border-top:1px solid var(--line)!important}
.wday.wkend{background:transparent;padding-block:4px}
.wday.today{box-shadow:inset 5px 0 0 var(--brand)}
.wjob{border:0;border-radius:0;background:var(--field);box-shadow:inset 4px 0 0 var(--c);clip-path:polygon(0 0,calc(100% - var(--cut-s)) 0,100% var(--cut-s),100% 100%,0 100%)}
.wjob:hover{background:var(--chip)}
.wjob b{font-family:var(--wide);font-size:17px;font-weight:600}
.cal .day{border-radius:0}
.cal .chip{border-radius:0}
.stat b{font-family:var(--wide)}
/* the hero panel: next available day on graphite, like the header */
.avail{background:var(--plate);color:#fff;box-shadow:inset 6px 0 0 var(--brand)}
.avail .al{font:600 14px var(--wide);letter-spacing:.01em;text-transform:none;color:#a9b2c2}
.avail .ad{font:700 34px/1.08 var(--wide);color:#fff;letter-spacing:-.01em}
.avail .as{color:#c5ccd8}
.avail .btn:not(.pri){background:rgba(255,255,255,.12);color:#fff}
.avail .msg{color:#8fe0b0}
@media(max-width:480px){.avail .ad{font-size:28px}}
.todayc .al{font:600 14px var(--wide);letter-spacing:.01em;text-transform:none}
.quick button{background:var(--surface);font-family:var(--wide);font-weight:600;letter-spacing:0}
.quick button:hover{background:var(--field);color:var(--brand)}
/* controls */
.btn,.newbtn,.seg{border-radius:0}
.btn{border:0;background:var(--chip);font-family:var(--display);letter-spacing:.03em;clip-path:polygon(0 0,100% 0,100% calc(100% - var(--cut-s)),calc(100% - var(--cut-s)) 100%,0 100%)}
.btn:hover{filter:brightness(.95)}
.btn.pri{background:var(--blue);color:var(--blue-ink)}
.btn.ghost{background:transparent;box-shadow:inset 0 0 0 1px var(--line)}
.btn.danger{background:transparent;box-shadow:inset 0 0 0 1.5px var(--red)}
.btn.danger.arm{background:var(--red);color:#fff}
.newbtn{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--cut-s)),calc(100% - var(--cut-s)) 100%,0 100%)}
.seg{border:0;background:var(--chip);padding:3px;gap:3px;clip-path:polygon(0 0,100% 0,100% calc(100% - var(--cut-s)),calc(100% - var(--cut-s)) 100%,0 100%)}
.seg button{background:transparent;font-family:var(--display);letter-spacing:.03em}
.seg button.on{background:var(--surface);color:var(--ink);box-shadow:inset 0 -3px 0 var(--brand)}
input[type=text],input[type=date],input[type=tel],input[type=email],input[type=password],input:not([type]),select,textarea{border-radius:2px}
.pill{border-radius:2px;font-family:var(--display);letter-spacing:.04em}
.ch{border-radius:2px;font-family:var(--display);letter-spacing:.03em}
.newmenu{border-radius:0}
.newmenu[hidden],.toast[hidden]{display:none!important}

/* status shows as a coloured cut corner instead of a coloured left edge */
.item.due,.wjob,.notice,.wday.today{box-shadow:none!important;position:relative}
.notice{--c:var(--amber)}
.wday.today{--c:var(--brand)}
.item.due::after,.wjob::after,.notice::after,.wday.today::after{content:"";position:absolute;top:0;right:0;width:30px;height:30px;background:var(--c);clip-path:polygon(0 0,100% 0,100% 100%);pointer-events:none}
.wjob::after{width:20px;height:20px}
.item.due .r{padding-right:10px}
/* report numbers on graphite ID plates */
.plate,.rno{display:inline-block;background:var(--plate);box-shadow:inset 3px 0 0 var(--brand);color:#fff!important;border:0!important;border-radius:0!important;font:600 15px/1 var(--wide)!important;letter-spacing:.08em;padding:7px 14px 6px 11px;clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,0 100%);align-self:flex-start;font-variant-numeric:tabular-nums}
.rno{font-size:20px!important;padding:8px 16px 7px 12px}
.rnoctl .rno input{color:#fff}
.rnoctl.dup .rno{background:var(--red)}
.foot{border-top:3px solid var(--plate)}
@media(max-width:480px){.tabs{justify-content:space-between}.tabs button{padding:12px 4px 9px;font-size:14px;letter-spacing:.02em}}
@media(max-width:640px){.foot{flex-direction:column;gap:6px}.footlink{margin-left:0;text-align:left}}

/* Website look: navy header and banners with the machine photos showing through, condensed uppercase type for headings and buttons. */
.brandbar{background:linear-gradient(90deg,rgba(15,26,51,.9) 0%,rgba(15,26,51,.72) 45%,rgba(15,26,51,.55) 100%),url(../assets/bg-machine.jpg) 50% 40%/cover}
.tabs button,.btn,.newbtn,.quick button{text-transform:uppercase;letter-spacing:.06em}
.tabs button{font-size:16px}
.ptitle h2,.hello h2{text-transform:uppercase;letter-spacing:.01em}
h2.sec{font-size:21px;text-transform:uppercase;letter-spacing:.04em}
.hello{position:relative;color:#fff;padding:26px 22px 22px;margin-bottom:16px;background:linear-gradient(90deg,rgba(15,26,51,.92) 0%,rgba(15,26,51,.6) 50%,rgba(15,26,51,.25) 100%),url(../assets/bg-spindle.jpg) 50% 58%/cover;clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%)}
.hello::before{content:"Keeping your machines running at their best";display:block;font:700 13px var(--display);letter-spacing:.22em;text-transform:uppercase;color:var(--brand);margin-bottom:8px}
.hello h2{color:#fff;font-size:40px;line-height:1}
.hello p{color:#c9d3e6;margin:8px 0 0}
@media(max-width:480px){.hello h2{font-size:32px}.hello::before{content:"Keeping machines running";letter-spacing:.18em}}
.avail{background:linear-gradient(90deg,rgba(19,32,58,.95) 0%,rgba(19,32,58,.82) 45%,rgba(19,32,58,.35) 100%),url(../assets/bg-machine.jpg) 50% 45%/cover}
.item,.blk,.rm,.stat,.empty,.notice,.todayc,.avail,.wday,.quick button{filter:drop-shadow(0 1px 1px rgba(15,26,46,.06))}
.blk>h3{box-shadow:inset 4px 0 0 var(--brand)}
.foot{border-top:1px solid var(--line)}
.fname{color:var(--ink)}
