:root { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; color:#24332b; background:#f5f4f1; line-height:1.5; }
* { box-sizing:border-box; } [hidden] { display:none!important; }
body { margin:0; } main { max-width:820px; padding:24px; margin:auto; }
nav,.actions { display:flex; gap:12px; justify-content:space-between; flex-wrap:wrap; }
a { color:#305e47; } nav a { padding:10px 0; font-weight:650; }
header { margin:28px 0; } .eyebrow { font-size:12px; letter-spacing:2px; font-weight:750; color:#746548; }
h1 { font-size:38px; letter-spacing:-1px; margin:8px 0; } h2 { font-size:23px; line-height:1.25; margin:0 0 14px; } h3 { margin:8px 0; }
p { margin:12px 0; } .card { background:#fff; padding:28px; border:1px solid #dfe5df; border-radius:18px; margin:18px 0; }
label { display:block; font-weight:650; margin-bottom:6px; }
input,select,textarea,button { font:inherit; border:1px solid #bcc9bf; border-radius:9px; padding:12px; min-height:48px; }
input:not([type=checkbox]),select,textarea { width:100%; background:white; color:#24332b; margin-bottom:12px; }
textarea { resize:vertical; } button { cursor:pointer; background:#305e47; color:white; font-weight:700; }
button:disabled { opacity:.55; cursor:wait; } .secondary { color:#305e47; background:white; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid #8cbd9d; outline-offset:3px; }
.small { font-size:13px; color:#5e6c63; } .date-time { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:12px; }
.check { display:flex; align-items:flex-start; gap:12px; font-weight:400; margin:20px 0; }.check input { width:22px; height:22px; min-height:22px; margin-top:3px; }
#error { color:#a32c21; font-weight:600; } .notice { background:#f8f1df; padding:15px; border-radius:10px; }
.service { border-bottom:1px solid #e4e9e5; padding:12px 0; display:flex; justify-content:space-between; gap:16px; }.service small { display:block; }
.total { font-size:20px; font-weight:750; display:flex; justify-content:space-between; }.suggestions { display:flex; gap:8px; flex-wrap:wrap; }
#confirm { width:100%; margin-top:12px; } #review:focus { outline:none; }
.client-buttons { display:grid; gap:14px; }
.client-choice { text-align:left; min-height:100px; display:grid; gap:4px; padding:18px; }
.client-choice strong, .selected-client { font-size:26px; line-height:1.2; }
.client-choice small { font-weight:400; }
.month-presets,.adjust-buttons { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:18px 0; }
.month-presets { grid-template-columns:minmax(0,1fr); }
#workspace button { min-height:64px; touch-action:manipulation; }
#workspace .month-presets button { font-size:24px; min-height:80px; width:100%; }
.date-time input { min-height:68px; font-size:22px; }
summary { padding:16px 0; font-size:18px; font-weight:700; cursor:pointer; min-height:64px; }
.calendar-heading { display:grid; grid-template-columns:64px 1fr 64px; align-items:center; gap:8px; text-align:center; }
.calendar-heading h3 { font-size:20px; }
.date-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:5px; padding:12px 0; text-align:center; }
#workspace .date-grid button { min-height:56px; padding:4px; font-size:20px; }
.date-grid button[aria-pressed=true] { background:#305e47; color:white; box-shadow:0 0 0 2px #305e47; }
@media(max-width:400px) { .date-grid { margin-left:-10px; margin-right:-10px; gap:3px; } }
.service-edit-row { padding:18px 0; border-bottom:1px solid #dfe5df; }
.service-edit-row select { min-height:64px; font-size:18px; }
#workload { margin:22px 0; padding:18px; background:#f5f6f2; border-radius:12px; }
#day-calendar-preview { margin:0 0 22px; border:1px solid #d7ded5; border-radius:12px; padding:12px; }
#day-calendar-preview { scroll-margin-top:12px; }
.mini-day-selection { font-size:18px; line-height:1.4; }.mini-day-selection span { display:block; color:#125ad7; font-weight:700; }
.mini-day-loading { min-height:430px; display:grid; place-items:center; background:#f5f6f2; border-radius:8px; }
.prebook-action-bar { position:sticky; bottom:0; z-index:10; background:#fff; border-top:1px solid #d7ded5; padding:10px 0 max(10px,env(safe-area-inset-bottom)); box-shadow:0 -8px 16px #ffffffee; }
.prebook-action-bar .check { margin:0 0 8px; align-items:center; font-weight:650; }
.prebook-action-bar button { width:100%; }
.prebook-action-bar small { display:block; font-size:11px; margin-top:5px; }
#booking-action-status:empty { display:none; }
#booking-action-status { font-size:13px; color:#a32c21; margin:5px 0 0; }
.mini-day-selected h4 { color:#125ad7; box-shadow:inset 0 -3px #125ad7; }
.mini-arrival span { display:inline-block; background:#125ad7; color:white; font-size:11px; padding:2px 4px; border-radius:3px; }
.mini-day-scroll { max-height:340px; overflow:auto; border:1px solid #d7ded5; border-radius:8px; background:white; }
.mini-day-grid { display:grid; width:max-content; font-size:13px; }
.mini-day-column { border-left:1px solid #d7ded5; min-width:0; --mini-color:#a0b72b; }
.mini-color-1 { --mini-color:#39854e; }.mini-color-2,.mini-color-6 { --mini-color:#bb600b; }.mini-color-3 { --mini-color:#0872ed; }.mini-color-4 { --mini-color:#159da5; }.mini-color-5 { --mini-color:#932cb0; }
.mini-day-grid h4 { margin:0; height:38px; padding:10px 5px; background:#f5f6f2; position:sticky; top:0; z-index:4; white-space:nowrap; }
.mini-day-times { position:sticky; left:0; background:white; z-index:5; }.mini-day-times>div { position:relative; }.mini-day-times span { position:absolute; left:3px; color:#66716a; }
.mini-day-track { position:relative; background:repeating-linear-gradient(to bottom,transparent 0,transparent 29px,#e8eae8 29px,#e8eae8 30px); }
.mini-day-event { position:absolute; overflow:hidden; padding:3px; background:var(--mini-color); color:white; border:1px solid white; border-radius:4px; z-index:1; line-height:1.25; }
.mini-day-event strong,.mini-day-event span,.mini-day-event small { display:block; overflow:hidden; text-overflow:ellipsis; }
.mini-status-block { background:#e1e3e1; color:#47584d; }.mini-status-awaiting_protection,.mini-status-pending,.mini-status-requested { background:#fff0b9; color:#705823; border:1px dashed #c3a861; }
.mini-status-canceled { background:#fafafa; color:#aeb3b0; text-decoration:line-through; }.mini-status-protection_expired { background:#fffdf5; color:#c9c4b0; }
.mini-arrival { position:absolute; left:0; right:0; border-top:2px dashed #125ad7; z-index:3; pointer-events:none; }
.mini-day-track .calendar-nonworking-band { position:absolute; left:0; right:0; background:#eff0f1; }
.workload-stylist + .workload-stylist { border-top:1px solid #d7ded5; margin-top:18px; padding-top:12px; }
.load-strip { display:flex; gap:6px; overflow-x:auto; padding:6px 2px 12px; }
.load-slot { min-width:90px; padding:10px 7px; border:2px solid #81948a; border-radius:8px; text-align:center; background:#edf3ec; }
.load-slot b { display:block; font-size:26px; }
.load-slot small { display:block; font-size:11px; }
.load-slot.level-1 { background:#f5efd8; border-color:#c5b372; }
.load-slot.level-2 { background:#f3dfbf; border-color:#bf9963; }
.load-slot.level-3 { background:#f1d4cc; border-color:#b57c69; }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
#status:empty, #calendar-availability:empty { display:none; }
#change-services { width:100%; margin:12px 0; }
#service-editor { width:min(520px,calc(100% - 32px)); max-height:85dvh; overflow:auto; border:0; border-radius:18px; padding:24px; box-sizing:border-box; }
#service-editor::backdrop { background:rgb(0 0 0 / 45%); }
#service-editor button { width:100%; margin-top:10px; }
@media(max-width:540px) { main { padding:16px; }.card { padding:20px; }h1 { font-size:32px; }.date-time { grid-template-columns:1fr; gap:0; }.actions button { flex:1; }#review-button { width:100%; } }