:root{color-scheme:light;--page:#F7F7F5;--paper:#FFFFFF;--ink:#203247;--muted:#748294;--line:#E5E9ED;--blue:#dfedf1;--blue-ink:#345b68;--orange:#f2b67d;--orange-ink:#203247;--brown:#244B70;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--page)}
*{box-sizing:border-box}body{margin:0}button,input,textarea{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,.file-label:focus-within{outline:3px solid #3979A8;outline-offset:3px}button{color:inherit}button:disabled{opacity:.5;cursor:wait}.app{max-width:850px;margin:auto;padding:14px 22px max(12px,env(safe-area-inset-bottom));padding-top:max(14px,env(safe-area-inset-top))}.brand{display:flex;align-items:center;gap:12px;margin-bottom:18px}.brand img{border-radius:50%;object-fit:cover;border:1px solid #E5E9ED}.brand h1{font-family:Georgia,"Times New Roman",serif;font-size:24px;font-weight:normal;letter-spacing:-.6px;margin:5px 0}.eyebrow{font-size:9px;letter-spacing:1.8px;font-weight:650;margin:0;color:var(--muted)}.icon-button{border:1px solid var(--line);border-radius:50%;background:transparent;width:36px;height:36px;font-size:26px;line-height:1;flex-shrink:0}.brand>.icon-button{margin-left:auto}.staff-tabs{display:flex;background:#E5E9ED;border-radius:13px;padding:4px;gap:4px}.staff-tabs button{flex:1;border:0;border-radius:9px;padding:12px 4px;background:transparent;font-size:14px;font-weight:600;min-height:44px}.staff-tabs button[aria-pressed=true]{background:var(--paper);box-shadow:0 2px 5px #20324712}.staff-tabs span{font-size:10px;margin-left:4px;background:#E5E9ED;border-radius:12px;padding:2px 6px}.view-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:14px 0}.date-range{font-size:12px;font-weight:600;letter-spacing:.4px}.view-toggle{display:flex;border:1px solid var(--line);border-radius:8px;padding:3px;gap:2px}.view-toggle button{border:0;background:transparent;border-radius:5px;padding:8px 10px;font-size:11px;min-height:32px}.view-toggle button[aria-pressed=true]{background:var(--brown);color:#fff}.schedule{background:var(--paper);border:1px solid var(--line);border-radius:17px;padding:18px;box-shadow:0 8px 32px #20324706}.schedule-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.schedule-heading h2{font:normal 27px Georgia,"Times New Roman",serif;letter-spacing:-.7px;margin:6px 0 0}.availability{text-align:right;display:flex;flex-direction:column;font-size:10px;color:var(--muted)}.availability strong{color:var(--brown);font-size:26px;font-weight:500}.availability strong span{font-size:13px;color:var(--muted)}table{border-collapse:separate;border-spacing:4px;width:100%;table-layout:fixed}th{font-size:13px;font-weight:700;height:30px;text-align:center}th:first-child{width:50px}tbody th{color:var(--brown)}td{padding:0}td button{border:0;border-radius:7px;width:100%;height:clamp(44px,calc((100svh - 335px)/9),66px);min-width:0;padding:5px 2px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;background:var(--blue);color:var(--blue-ink);font-size:10px;font-weight:500;overflow:hidden}td button.booked{background:var(--orange);color:var(--orange-ink)}td button:hover{filter:brightness(.96)}td button .customer{font-size:11px;font-weight:700;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}td button .note{font-size:9px;font-weight:400;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.legend{display:flex;gap:14px;align-items:center;font-size:10px;margin:14px 4px 0;color:var(--muted)}.legend>span{display:flex;align-items:center;gap:5px}.legend>span:last-child{margin-left:auto}.dot{width:8px;height:8px;border-radius:50%;display:inline-block}.empty{background:#a3c9d5}.booked{background:#d88c49}footer{display:flex;justify-content:space-between;gap:8px;font-size:10px;color:var(--muted);padding-top:13px}#save-state{color:#617053}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}dialog{width:min(440px,calc(100% - 28px));padding:24px;background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:20px;max-height:90svh;overflow:auto;box-shadow:0 20px 90px #20324740}dialog::backdrop{background:#2032475E;backdrop-filter:blur(4px)}.modal-top{display:flex;align-items:center;justify-content:space-between}dialog h2{font:normal 28px Georgia,serif;margin:10px 0}dialog h3{font-size:15px}.muted{font-size:13px;color:var(--muted);line-height:1.7}.small{font-size:11px}label{display:block;font-size:13px;font-weight:600;margin:20px 0 8px}.optional{font-size:11px;font-weight:400;color:var(--muted)}input:not([type=file]),textarea{display:block;width:100%;border:1px solid #E5E9ED;border-radius:9px;background:#fff;padding:12px;color:var(--ink);font-size:16px}textarea{resize:vertical}input[type=file]{width:100%;font-size:12px}.form-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:18px}.primary,.secondary,.danger,.file-label{min-height:44px;border-radius:9px;border:1px solid var(--line);padding:12px 15px;font-size:13px;font-weight:600}.primary{background:var(--brown);color:#fff;border-color:var(--brown)}.secondary{background:transparent}.danger{background:#fae7dd;color:#923c28;border-color:#ecd0c3}#cancel-booking{margin-right:auto}.wide{width:100%;margin-top:10px}.file-label{display:block;text-align:center;cursor:pointer;background:#F7F7F5}.error{color:#9c3326;font-size:12px;line-height:1.5}hr{border:0;border-top:1px solid var(--line);margin:24px 0}[hidden]{display:none!important}body.modal-open{overflow:hidden}
@media(max-width:600px){.app{padding-left:10px;padding-right:10px;padding-top:max(9px,env(safe-area-inset-top))}.brand{gap:10px;margin:0 3px 11px}.brand img{width:44px;height:44px}.brand h1{font-size:20px;margin:4px 0}.eyebrow{font-size:8px;letter-spacing:1.4px}.staff-tabs button{font-size:12px;padding:8px 2px;min-height:38px}.view-bar{margin:9px 2px}.view-toggle button{padding:6px 8px;min-height:30px}.schedule{padding:11px 6px 12px;border-radius:13px}.schedule-heading{padding:0 6px;margin-bottom:9px}.schedule-heading h2{font-size:23px}.availability strong{font-size:23px}th:first-child{width:39px}th{font-size:12px;height:27px}table{border-spacing:3px}td button{height:clamp(38px,calc((100svh - 263px)/9),62px);font-size:9px;border-radius:5px}td button .customer{font-size:10px}td button .note{font-size:8px}.legend{font-size:9px;gap:10px;margin:10px 6px 0}footer{font-size:9px;padding:10px 3px 0}.date-range{font-size:11px}}
@media(min-width:601px){.app{padding-top:28px}.brand{margin-bottom:24px}.schedule-heading{margin-bottom:18px}td button{font-size:13px}td button .customer{font-size:14px}td button .note{font-size:11px}.eyebrow{font-size:10px}.view-toggle button{font-size:13px}}
@media(max-width:600px){td button{height:clamp(36px,calc((100svh - 365px)/9),56px)}}
@media(max-width:600px) and (max-height:720px){.brand{margin-bottom:6px}.brand img{width:36px;height:36px}.brand h1{font-size:18px}.staff-tabs button{min-height:34px;padding:6px 2px}.view-bar{margin:5px 2px}.schedule-heading{margin-bottom:4px}.schedule-heading h2{font-size:21px}.schedule{padding-top:8px;padding-bottom:8px}.legend{margin-top:6px}footer{padding-top:6px}}
@font-face{font-family:Nunito;src:url(/fonts/nunito.woff2) format("woff2");font-weight:200 1000;font-style:normal;font-display:swap}
:root{font-family:Nunito,sans-serif}.brand h1,.schedule-heading h2,dialog h2{font-family:Nunito,sans-serif;font-weight:750;letter-spacing:-.6px}.brand h1{font-size:22px}th:first-child{width:86px}.lunar{display:block;font-size:10px;font-weight:500;color:var(--muted);white-space:nowrap;line-height:1.4}footer{align-items:center}.export-image{border:1px solid var(--line);border-radius:8px;background:var(--paper);padding:7px 10px;font-size:11px;min-height:34px;font-weight:750}#image-preview{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:10px}.download-image{display:block;text-align:center;text-decoration:none}
@media(max-width:600px){.brand h1{font-size:18px}.schedule-heading h2{font-size:21px}th:first-child{width:57px}tbody th{font-size:11px}.lunar{font-size:8px;letter-spacing:-.25px}td button{height:clamp(36px,calc((100svh - 390px)/9),56px)}.date-range{font-size:10px}.view-toggle button{padding-left:6px;padding-right:6px}}
@media(max-width:600px) and (max-height:720px){.brand h1{font-size:17px}td button{height:36px}.export-image{min-height:30px;padding:5px 8px}}
td button{white-space:nowrap}
@media(max-width:600px){th:first-child{width:53px}th{font-size:10px}.lunar{font-size:7px}tbody th{font-size:10px}table{border-spacing:2px}td button{height:clamp(33px,calc((100svh - 390px)/10),52px);font-size:8px;padding:3px 0}td button .customer{font-size:8px}td button .note{font-size:7px}.schedule-heading h2{font-size:20px}.view-toggle button{font-size:10px}.brand h1{font-size:17px}}
@media(max-width:600px) and (max-height:720px){td button{height:33px}}
#connection-message{padding:28px 12px;text-align:center;font-size:13px;line-height:1.6;min-height:250px}.sync-error{color:#9c3326!important}footer #save-state{max-width:65%;line-height:1.4}

:root{--page:#F7F7F5;--paper:#FFFFFF;--ink:#203247;--muted:#748294;--line:#E5E9ED;--brown:#244B70;--spring-red:#244B70;--holiday:#E5E9ED;--holiday-ink:#748294}body{background:radial-gradient(ellipse at 92% 0,#E5E9ED66,transparent 36%),var(--page)}.app{position:relative;z-index:1}.brand h1,.schedule-heading h2{color:#244B70}.brand img{border-color:#E5E9ED;box-shadow:0 0 0 3px #FFFFFF}.brand .eyebrow{color:#748294}.staff-tabs{background:#E5E9ED;border:1px solid #E5E9ED}.staff-tabs button[aria-pressed=true]{color:#244B70;border:1px solid #E5E9ED;box-shadow:0 2px 6px #244B7010}.staff-tabs button{border:1px solid transparent}.staff-tabs span{background:#E5E9ED}.staff-tabs button[aria-pressed=true] span{background:#EAF4FA;color:#244B70}.view-toggle button[aria-pressed=true]{background:#244B70}.schedule{border-color:#E5E9ED;box-shadow:0 7px 30px #244B7007;position:relative;overflow:hidden}.schedule:before{content:"";position:absolute;top:0;left:25%;width:50%;height:2px;background:linear-gradient(90deg,transparent,#244B7080,transparent)}.schedule-heading .eyebrow{color:#748294}.availability strong,tbody th,thead th{color:#244B70}.primary{background:#244B70;border-color:#244B70}.export-image{color:#244B70;border-color:#E5E9ED;background:#FFFFFF}.icon-button{color:#244B70;border-color:#E5E9ED}.file-label{background:#F7F7F5}.tet-decor{position:fixed;top:-25px;right:-15px;width:180px;height:180px;pointer-events:none;opacity:.4;z-index:0}.tet-decor svg{width:100%;height:100%}.slot-state-picker{display:flex;gap:6px;margin:20px 0 12px}.slot-state-picker button{flex:1;min-height:44px;padding:9px 4px;border:1px solid var(--line);border-radius:9px;font-size:12px;font-weight:700;background:var(--paper)}.slot-state-picker [data-slot-state=empty]{background:var(--blue);color:var(--blue-ink)}.slot-state-picker [data-slot-state=booked]{background:var(--orange);color:var(--orange-ink)}.slot-state-picker [data-slot-state=holiday],td button.holiday{background:var(--holiday);color:var(--holiday-ink)}.slot-state-picker button[aria-pressed=true]{outline:2px solid #244B70;outline-offset:2px}.dot.holiday{background:#748294}td button.holiday{font-weight:650}.legend{gap:10px}
@media(max-width:600px){.tet-decor{width:120px;height:120px;right:-18px;opacity:.25}.legend{gap:7px;font-size:8px}.legend .dot{width:6px;height:6px}.brand .eyebrow{letter-spacing:1.2px}}

.view-bar{justify-content:flex-end}footer{justify-content:flex-end}thead th{font-size:15px}tbody th{font-size:16px}.lunar{font-size:11px}
@media(max-width:600px){thead th{font-size:11.5px}tbody th{font-size:12px}.lunar{font-size:8px;letter-spacing:-.3px}th:first-child{width:55px}}

.booking-navigation{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:2px 0 18px;font-size:12px;color:var(--muted)}.booking-navigation a{color:var(--ink);font-weight:700;text-decoration:none;padding:8px 12px;border:1px solid var(--line);border-radius:20px}.booking-navigation span{text-align:right}
.staff-tabs{display:flex;flex-wrap:wrap;gap:7px}.staff-tabs>button{flex:1 1 140px}.calendar-title{display:flex;align-items:center;gap:8px}.calendar-title h1{flex:1}.calendar-title #calendarStaff{font-size:11px;min-height:34px;padding:6px 9px;white-space:nowrap}
.staff-tabs{display:flex!important;flex-wrap:nowrap!important;gap:5px;min-width:0;overflow:hidden}.staff-tabs>button{flex:1 1 0!important;min-width:0;padding:9px 5px!important;font-size:clamp(8px,2.6vw,13px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;justify-content:center;gap:4px}.staff-tabs>button span{flex-shrink:0;font-size:.8em;padding:2px 4px}.view-bar{display:flex;align-items:center;justify-content:space-between!important;gap:8px;flex-wrap:nowrap}.view-bar .export-image{margin:0;min-height:34px;font-size:11px;padding:7px 10px;white-space:nowrap}.view-bar .view-toggle{margin-left:auto}.view-bar .view-toggle button{font-size:11px;padding:7px 8px;min-height:34px}.schedule-heading{display:flex;align-items:center;flex-wrap:nowrap;gap:8px}.schedule-heading>div:first-child{min-width:0;flex:1}.schedule-heading h2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.schedule-heading .availability{flex-shrink:0}@media(max-width:380px){.view-bar{gap:4px}.view-bar .export-image{font-size:10px;padding:6px}.view-bar .view-toggle button{font-size:10px;padding:6px}.staff-tabs>button{gap:2px}}

/* Colourful icons (UI round 2026-11-11). */
#calendarStaff,#export-image,#retry-sync,.view-toggle button,.staff-tabs button{display:inline-flex;align-items:center;justify-content:center;gap:6px}
#calendarStaff svg,#export-image svg,#retry-sync svg,.view-toggle button svg,.staff-tabs button svg{width:15px;height:15px;flex-shrink:0}
