/* Clarté signed-in pages: booking, account, team, admin. Same palette as the site: ivory and soft pink, hairlines, serif headings. */
.app{padding:clamp(34px,5vw,70px) 0 120px;min-height:70vh}
.app .wrap{max-width:1240px}
.app-top{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:34px}
.app-top h1{font:300 clamp(2.2rem,4vw,3.6rem)/1.05 var(--display);margin:0}
.app-top h1 em{color:var(--rose-em)}
.app-top .sub{margin:10px 0 0;color:var(--rose-grey);font-size:1rem}
.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.row.sp{justify-content:space-between}
.stack>*+*{margin-top:14px}
.btn.sm{padding:10px 18px;font-size:.74rem}
.btn.danger{background:transparent;border-color:#C98B96;color:#A23B4E;box-shadow:none}
.btn.danger:hover{background:#FBE9EC;border-color:#A23B4E;color:#A23B4E}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.link-btn{background:none;border:0;padding:0;font:inherit;color:var(--deep);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.eyebrow.sm{font-size:.7rem;margin:0 0 8px}

/* tabs */
.tabs{display:flex;gap:6px;overflow-x:auto;padding:4px 0 14px;margin-bottom:10px;scrollbar-width:none;border-bottom:1px solid var(--line)}
.tabs::-webkit-scrollbar{display:none}
.tabs button{flex:none;font:400 .76rem/1 "Marcellus",var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--rose-grey);background:none;border:1px solid transparent;border-radius:999px;padding:12px 18px;cursor:pointer;min-height:44px;transition:all .3s var(--ease)}
.tabs button:hover{color:var(--deep)}
.tabs button[aria-selected=true]{background:var(--blush);border-color:var(--rg);color:var(--ink)}
.tab-pane{padding-top:22px}

/* cards, grids */
.card{background:var(--ivory);border:1px solid var(--line);border-radius:26px;padding:clamp(20px,2.6vw,32px)}
.card.petal{background:var(--petal)}
.card h2,.card h3{font:400 1.5rem/1.15 var(--display);margin:0 0 14px}
.card h3.sm{font-size:1.2rem}
.grid{display:grid;gap:18px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g12{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}
@media(max-width:980px){.g3,.g4{grid-template-columns:repeat(2,minmax(0,1fr))}.g12{grid-template-columns:1fr}}
@media(max-width:640px){.g2,.g3,.g4{grid-template-columns:1fr}}
.kpi{background:var(--ivory);border:1px solid var(--line);border-radius:24px;padding:20px 22px}
.kpi.warn{background:var(--petal);border-color:var(--rg)}
.kpi .k{font:400 .68rem/1.2 "Marcellus",var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--rose-grey)}
.kpi .v{font:300 clamp(2rem,3vw,2.7rem)/1.1 var(--display);margin:8px 0 4px}
.kpi .d{font-size:.82rem;color:var(--rose-grey)}
.kpi .d.up{color:#6E7F5C}.kpi .d.down{color:#A23B4E}
.muted-sm{color:var(--rose-grey);font-size:.86rem}
.empty{color:var(--rose-grey);padding:22px;text-align:center;border:1px dashed var(--line-strong);border-radius:20px}
.note-box{background:var(--petal);border-radius:16px;padding:14px 16px;font-size:.88rem;color:var(--rose-grey)}
.note-box.warn{background:#FBE9EC;color:#7A2E3C}
.note-box.red{background:#FBE3E7;border:1px solid #D9A1AB;color:#7A2E3C}

/* pills */
.pill{display:inline-block;font:400 .66rem/1 "Marcellus",var(--sans);letter-spacing:.12em;text-transform:uppercase;padding:7px 12px;border-radius:999px;border:1px solid var(--line-strong);background:var(--ivory);color:var(--ink);white-space:nowrap}
.pill.st-requested,.pill.st-reschedule_requested,.pill.warn{background:#FCEFE9;border-color:#E8B9AE}
.pill.st-confirmed,.pill.st-assigned{background:var(--blush);border-color:var(--rg)}
.pill.st-in_progress{background:var(--rg);border-color:var(--rg)}
.pill.st-completed,.pill.good{background:#EEF3E8;border-color:#BFD0AE;color:#46583A}
.pill.st-cancelled,.pill.bad{background:#F4ECEE;border-color:#D8C3C8;color:#7A6369}
.pill.bad{background:#FBE9EC;border-color:#D9A1AB;color:#7A2E3C}

/* tables */
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:22px;background:var(--ivory)}
.tbl{width:100%;border-collapse:collapse;font-size:.92rem}
.tbl th{font:400 .66rem/1.2 "Marcellus",var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--rose-grey);text-align:left;padding:14px 16px;border-bottom:1px solid var(--line);white-space:nowrap;position:sticky;top:0;background:var(--ivory)}
.tbl td{padding:13px 16px;border-bottom:1px solid var(--line);vertical-align:middle}
.tbl tr:last-child td{border-bottom:0}
.tbl tr.click{cursor:pointer}.tbl tr.click:hover td{background:var(--petal)}
.tbl td.r,.tbl th.r{text-align:right}
.tbl-scroll{max-height:520px;overflow:auto}
.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.filters select,.filters input{width:auto;min-width:150px;padding:11px 14px;border-radius:999px;font-size:.9rem}

/* forms in app pages */
.f{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}
.f>label,.f>.lab{font:400 .72rem/1.2 "Marcellus",var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--rose-grey)}
.f select,.f input,.f textarea{padding:13px 15px}
.f textarea{min-height:100px}
.inline-form{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.inline-form .f{margin:0;flex:1;min-width:150px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips label{position:relative}
.chips input{position:absolute;opacity:0;inset:0;cursor:pointer;width:100%;height:100%}
.chips span{display:inline-block;border:1px solid var(--line-strong);border-radius:999px;padding:10px 16px;font-size:.88rem;transition:all .3s var(--ease);min-height:42px}
.chips input:checked+span{background:var(--rg);border-color:var(--rg);color:var(--ink)}
.chips input:focus-visible+span{outline:2px solid var(--deep);outline-offset:2px}
.auth-card{max-width:520px;margin:0 auto}
.err-text{color:#A23B4E;font-size:.9rem;min-height:1.4em;margin:8px 0 0}

/* drawer */
.drawer-wrap{position:fixed;inset:0;background:rgba(74,52,56,.28);z-index:120;display:flex;justify-content:flex-end}
.drawer{width:min(560px,100%);height:100%;background:var(--ivory);overflow-y:auto;border-left:1px solid var(--line);box-shadow:-30px 0 80px -40px rgba(151,90,99,.5);animation:slidein .4s var(--ease)}
.drawer header{display:flex;justify-content:space-between;align-items:center;padding:22px 26px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--ivory);z-index:1}
.drawer h3{font:400 1.6rem/1.1 var(--display);margin:0}
.drawer .x{width:44px;height:44px;border-radius:50%;border:1px solid var(--line-strong);background:none;font-size:1.5rem;cursor:pointer;color:var(--ink)}
.drawer-body{padding:24px 26px 60px}
@keyframes slidein{from{transform:translateX(30px);opacity:0}to{transform:none;opacity:1}}
.dl{display:grid;grid-template-columns:130px 1fr;gap:8px 14px;font-size:.92rem;margin:0 0 18px}
.dl dt{color:var(--rose-grey);font:400 .68rem/1.6 "Marcellus",var(--sans);letter-spacing:.12em;text-transform:uppercase}
.dl dd{margin:0}

/* timeline (status steps) */
.steps-line{display:flex;gap:0;margin:16px 0;list-style:none;padding:0}
.steps-line li{flex:1;text-align:center;font:400 .62rem/1.3 "Marcellus",var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--rose-grey);position:relative;padding-top:22px}
.steps-line li::before{content:"";position:absolute;top:4px;left:50%;width:12px;height:12px;border-radius:50%;border:1px solid var(--line-strong);background:var(--ivory);transform:translateX(-50%);z-index:1}
.steps-line li::after{content:"";position:absolute;top:9px;left:-50%;width:100%;height:1px;background:var(--line-strong)}
.steps-line li:first-child::after{display:none}
.steps-line li.done{color:var(--ink)}
.steps-line li.done::before{background:var(--rg);border-color:var(--rg)}
.steps-line li.done::after{background:var(--rg)}
.steps-line li.now::before{box-shadow:0 0 0 5px rgba(235,184,190,.4)}
.log{list-style:none;margin:0;padding:0;font-size:.88rem}
.log li{padding:9px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:12px}
.log li span:last-child{color:var(--rose-grey);white-space:nowrap}

/* booking wizard */
.wiz{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start}
@media(max-width:980px){.wiz{grid-template-columns:1fr}}
.rail{position:sticky;top:104px;display:flex;flex-direction:column;gap:18px}
@media(max-width:980px){.rail{position:static}}
.ring-box{display:flex;align-items:center;gap:20px}
.ring{width:96px;height:96px;flex:none}
.ring circle{fill:none;stroke-width:7}
.ring .bg{stroke:var(--blush)}
.ring .fg{stroke:var(--deep);stroke-linecap:round;transition:stroke-dashoffset .7s var(--ease)}
.ring text{font:300 1.5rem var(--display);fill:var(--ink)}
.step-names{list-style:none;margin:0;padding:0;font-size:.9rem}
.step-names li{padding:6px 0;color:var(--rose-grey);display:flex;gap:10px;align-items:center}
.step-names li b{width:22px;height:22px;border-radius:50%;border:1px solid var(--line-strong);display:grid;place-items:center;font:400 .7rem var(--sans)}
.step-names li.now{color:var(--ink)}.step-names li.now b{background:var(--rg);border-color:var(--rg)}
.step-names li.done b{background:var(--deep);border-color:var(--deep);color:var(--ivory)}
.meter{height:8px;border-radius:99px;background:var(--blush);overflow:hidden}
.meter i{display:block;height:100%;background:var(--deep);border-radius:99px;transition:width .6s var(--ease)}
.pane-wiz[hidden]{display:none}
.wiz-nav{display:flex;justify-content:space-between;gap:12px;margin-top:26px;flex-wrap:wrap}
.date-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.dg-h{font:400 .62rem "Marcellus",var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--rose-grey);text-align:center;padding:4px 0}
.dg{border:1px solid var(--line);background:var(--ivory);border-radius:14px;padding:10px 0;min-height:48px;text-align:center;cursor:pointer;font:inherit;transition:all .25s var(--ease)}
.dg:disabled{opacity:.35;cursor:not-allowed;background:transparent}
.dg:not(:disabled):hover{border-color:var(--deep)}
.dg.on{background:var(--rg);border-color:var(--rg)}
.win-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:16px}
@media(max-width:560px){.win-grid{grid-template-columns:1fr}}
.win{border:1px solid var(--line-strong);border-radius:18px;padding:14px;background:var(--ivory);cursor:pointer;text-align:left;font:inherit}
.win b{display:block;font:400 1.15rem var(--display)}
.win small{color:var(--rose-grey)}
.win:disabled{opacity:.4;cursor:not-allowed}
.win.on{background:var(--rg);border-color:var(--rg)}
.team-row{display:flex;gap:14px;align-items:flex-start;border:1px solid var(--line-strong);border-radius:20px;padding:14px;background:var(--ivory);cursor:pointer;text-align:left;width:100%;font:inherit}
.team-row.on{background:var(--blush);border-color:var(--deep)}
.avatar{width:56px;height:56px;border-radius:50%;background:var(--blush);display:grid;place-items:center;font:400 1.3rem var(--display);color:var(--deep);overflow:hidden;flex:none}
.avatar img{width:100%;height:100%;object-fit:cover}
.stars{color:var(--deep);letter-spacing:.1em}
.star-in{display:flex;gap:4px}
.star-in button{background:none;border:0;font-size:1.8rem;color:var(--line-strong);cursor:pointer;padding:2px 4px;min-width:40px;min-height:44px}
.star-in button.on{color:var(--deep)}

/* month calendar */
.month{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.mh{font:400 .62rem "Marcellus",var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--rose-grey);text-align:center;padding:6px 0}
.md{min-height:92px;border:1px solid var(--line);border-radius:14px;padding:6px;background:var(--ivory);display:flex;flex-direction:column;gap:3px;overflow:hidden}
.md.empty{border:0;background:none}
.md.today{border-color:var(--deep)}
.md.shaded{background:repeating-linear-gradient(135deg,var(--petal),var(--petal) 6px,var(--ivory) 6px,var(--ivory) 12px)}
.md[tabindex]{cursor:pointer}.md[tabindex]:hover{background:var(--petal)}
.dn{font:400 .78rem var(--sans);color:var(--rose-grey)}
.ev{font-size:.7rem;line-height:1.25;border-radius:8px;padding:3px 6px;background:var(--blush);border-left:3px solid var(--rg);cursor:pointer;text-align:left;border-top:0;border-right:0;border-bottom:0;font-family:inherit;color:var(--ink);width:100%}
.ev.s-requested,.ev.s-reschedule_requested{background:#FCEFE9;border-left-color:#E0A090}
.ev.s-completed{background:#EEF3E8;border-left-color:#9DB586}
.ev.s-in_progress{background:#F7DEE2;border-left-color:var(--deep)}
.cal-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.cal-bar h3{margin:0;font:400 1.6rem var(--display)}
.week{display:grid;grid-template-columns:130px repeat(7,minmax(110px,1fr));gap:4px;overflow-x:auto;min-width:0}
.wk-h{font:400 .64rem "Marcellus",var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--rose-grey);padding:6px;text-align:center}
.wk-n{font-size:.88rem;padding:8px;border-radius:12px;background:var(--petal)}
.wk-c{min-height:70px;border:1px solid var(--line);border-radius:12px;padding:4px;display:flex;flex-direction:column;gap:3px;background:var(--ivory)}
.wk-c.off{background:repeating-linear-gradient(135deg,var(--petal),var(--petal) 6px,var(--ivory) 6px,var(--ivory) 12px)}
.wk-c.drop{outline:2px dashed var(--deep)}
.wk-c.nowork{background:#F6EFF0}

/* charts */
.chart{width:100%;height:auto;display:block;overflow:visible}
.chart .grid{stroke:var(--line);stroke-width:1}
.chart .ax{font:400 11px var(--sans);fill:var(--rose-grey)}
.chart .bar{fill:var(--rg);transition:fill .2s}
.chart .bar:hover,.chart .bar:focus{fill:var(--deep);outline:none}
.chart .line{fill:none;stroke:var(--deep);stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.chart .dot{fill:var(--ivory);stroke:var(--deep);stroke-width:2}
.chart .dot:hover,.chart .dot:focus{fill:var(--deep);outline:none}
.chart .cell{fill:var(--deep)}
.chart-tip{position:fixed;z-index:200;pointer-events:none;background:var(--ivory);border:1px solid var(--rg);border-radius:12px;padding:7px 12px;font-size:.8rem;box-shadow:0 14px 30px -14px rgba(151,90,99,.5);opacity:0;transition:opacity .15s}
.hbars{list-style:none;margin:0;padding:0}
.hbars li{display:grid;grid-template-columns:minmax(80px,1.1fr) 2fr auto;gap:12px;align-items:center;padding:7px 0;font-size:.9rem}
.hb-t{height:10px;background:var(--blush);border-radius:99px;overflow:hidden}
.hb-t i{display:block;height:100%;background:var(--rg);border-radius:99px}
.hb-v small{color:var(--rose-grey);font-weight:300}
.legend{display:flex;gap:16px;font-size:.8rem;color:var(--rose-grey);margin-bottom:8px}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;background:var(--rg);margin-right:6px}
.legend i.l{background:var(--deep);height:3px;vertical-align:middle}

/* team app */
.clock{display:flex;gap:10px;flex-wrap:wrap}
.clock .btn{min-height:52px}
.big-time{font:300 3rem/1 var(--display)}
.job{border:1px solid var(--line);border-radius:24px;padding:20px;background:var(--ivory)}
.job+.job{margin-top:14px}
.check-i{display:grid;grid-template-columns:28px 1fr;gap:10px;align-items:center;padding:8px 0;border-top:1px solid var(--line);min-height:44px}
.check-i input{width:20px;height:20px;accent-color:var(--deep)}
.access-box{background:var(--blush);border-radius:16px;padding:14px 16px;font-size:.95rem}

/* toasts */
.toasts{position:fixed;left:50%;transform:translateX(-50%);bottom:90px;display:flex;flex-direction:column;gap:8px;z-index:300;align-items:center;width:min(92vw,420px)}
.toast{background:var(--ivory);border:1px solid var(--rg);border-radius:16px;padding:12px 18px;font-size:.92rem;box-shadow:0 20px 40px -20px rgba(151,90,99,.55);transition:opacity .5s}
.toast.err{border-color:#C98B96;background:#FBE9EC;color:#7A2E3C}
.toast.gone{opacity:0}


/* receipt and notices: printable */
.paper{max-width:760px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:24px;padding:clamp(24px,5vw,56px)}
.paper h1{font:400 2.2rem var(--display);margin:0 0 6px}
.paper table{width:100%;border-collapse:collapse;margin:18px 0}
.paper td{padding:9px 0;border-bottom:1px solid var(--line)}
.paper td:last-child{text-align:right}
.fine-print{font-size:.74rem;color:var(--rose-grey);margin-top:28px}
.draft-mark{display:inline-block;font:400 .7rem "Marcellus",var(--sans);letter-spacing:.14em;text-transform:uppercase;border:1px solid #C98B96;color:#A23B4E;border-radius:99px;padding:6px 12px}
@media print{
  .preview-bar,.site-header,.site-footer,.to-top,.cc-launch,.cc-panel,.no-print,.privacy-bar,.skip,.toasts{display:none!important}
  body{background:#fff}
  .app{padding:0}
  .paper{border:0;padding:0;max-width:none}
}
@media(max-width:640px){
  .dl{grid-template-columns:1fr}
  .md{min-height:64px;padding:4px}.ev{font-size:.62rem;padding:2px 4px}
  .tbl{font-size:.85rem}.tbl th,.tbl td{padding:10px}
  .app-top{margin-bottom:22px}
}

/* social sign-in */
.sso{display:flex;flex-direction:column;gap:10px;margin-bottom:18px}
.sso[hidden]{display:none}
.sso-btn{display:flex;align-items:center;justify-content:center;gap:12px;min-height:50px;border:1px solid var(--line-strong);border-radius:999px;background:var(--ivory);color:var(--ink);text-decoration:none;font:400 .8rem "Marcellus",var(--sans);letter-spacing:.12em;text-transform:uppercase;padding:12px 22px;transition:border-color .3s var(--ease),background .3s var(--ease)}
.sso-btn:hover{border-color:var(--deep);background:var(--petal)}
.sso-logo{display:grid;place-items:center;width:20px;height:20px}
.sso-or{display:flex;align-items:center;gap:12px;margin:6px 0 0;color:var(--rose-grey);font-size:.8rem}
.sso-or::before,.sso-or::after{content:"";flex:1;height:1px;background:var(--line)}

/* Team app: a bottom tab bar on phones, like a native app */
@media(max-width:760px){
  body.team-page .app{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
  body.team-page #app>.tabs{position:fixed;left:0;right:0;bottom:0;z-index:70;margin:0;padding:6px 8px calc(6px + env(safe-area-inset-bottom));gap:2px;background:rgba(255,251,250,.97);border-top:1px solid var(--line);border-bottom:0;justify-content:flex-start;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
  body.team-page #app>.tabs button{flex:1 0 auto;min-width:64px;padding:10px 10px;font-size:.62rem;letter-spacing:.08em;border-radius:16px;min-height:52px}
  body.team-page .cc-launch{bottom:calc(84px + env(safe-area-inset-bottom))}
}