/* V3 / Calm, content-led design system. A real operations interface, not marketing cards. */
:root{
  --pink-25:#fcf6f8;--pink-50:#f9edf2;--pink-75:#f6e4eb;--pink-100:#f2d7e2;
  --pink-150:#eac6d4;--pink-200:#deb5c4;--pink-400:#bc5b7d;--pink-500:#af416b;--pink-600:#913253;
  --ink:#302b2f;--wine:#43363e;--muted:#81757d;--border:#e8dce1;
  --paper:#fff;--surface:#fff;--good:#1f7958;--good-bg:#eaf5ee;
  --blue:#416787;--blue-bg:#ecf2f6;--warn:#94683b;--warn-bg:#fff4e7;
  --r:8px;--shadow:none;--nav:226px;--motion:cubic-bezier(.2,.7,.2,1);
}
html,body{background:#f7e7ed;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Helvetica,Arial,sans-serif;font-size:14px;font-weight:400;line-height:1.45;letter-spacing:0}
button,input,textarea,select{font-family:inherit}
.app-shell{background:transparent}
.sidebar{width:var(--nav);padding:18px 12px 14px;background:#f4dfe7;border-right:1px solid #e6cfd9}
.brand{padding:3px 8px 20px;gap:10px;border-bottom:1px solid #e6ccd6;margin-bottom:12px}
.brand-logo{width:48px;height:48px;background:#f4d5e0;border:1px solid #e6c7d3;border-radius:50%;object-fit:cover}
.brand-words strong{font-size:12.5px;line-height:1.22;color:#45313b;font-weight:675;letter-spacing:-.2px}
.brand-words small{font-size:10px;line-height:1.2;letter-spacing:0;text-transform:none;color:#806c79}
.nav-caption{font-size:10px;font-weight:650;letter-spacing:.35px;text-transform:none;color:#987b88;padding:7px 12px 10px}
.nav-items{gap:1px}
.nav-link{min-height:42px;padding:10px 11px;border-radius:6px;color:#5b4e55;font-size:13px;font-weight:480;gap:11px;transition:background .14s ease,color .14s ease}
.nav-link svg{width:17px;height:17px;stroke-width:1.7}
.nav-link:hover{background:rgba(255,255,255,.46);transform:none}
.nav-link.active{background:#fff9fb;color:#80304d;font-weight:650;box-shadow:inset 2px 0 0 #b44770}
.sidebar-foot{border-top:1px solid #e4cad5;padding-top:12px}
.workspace-tag{background:transparent;border:0;padding:5px 6px;margin:0 1px 10px;border-radius:0;font-size:11px;color:#82707b}
.workspace-tag b{color:#75616d;font-weight:600}
.sidebar-foot .btn{background:transparent;color:#81596c;border-color:#dcbfc9;font-size:11px}
.main-shell{margin-left:var(--nav);width:calc(100% - var(--nav));padding:15px 30px 28px;max-width:1900px}
.topbar{height:58px;margin-bottom:21px;gap:20px;border-bottom:1px solid #ead7df;padding-bottom:14px}
.crumb{color:#9b8891;font-weight:500;font-size:12px;letter-spacing:0}
.head-actions{gap:8px}
.search-box{height:38px;min-width:220px;background:rgba(255,255,255,.6);border:1px solid #eadbe0;border-radius:6px;color:#97828d}
.search-box input{font-size:12px}
.demo-select{background:rgba(255,255,255,.64);border-color:#eadbe0;border-radius:6px;padding:2px 7px;height:38px}
.demo-select label{font-weight:500;color:#88737f}
.demo-select select{font-size:12px;font-weight:650;color:#664352}
.icon-btn{background:rgba(255,255,255,.72);border-color:#eadbe0;border-radius:6px;width:38px;height:38px;transition:background .14s ease}
.icon-btn:hover{background:#fff;transform:none}
.avatar{background:#ead0da;color:#75425a;border-radius:50%;font-weight:650;font-size:11px}
.page-head{margin-bottom:20px;align-items:center;gap:12px}
.page-head h1{color:#302b2f;font-size:clamp(23px,2.05vw,30px);font-weight:670;letter-spacing:-.7px;line-height:1.15;margin-bottom:6px}
.page-head p{font-size:12px;color:#81747d;line-height:1.4}
.eyebrow{font-size:10px;letter-spacing:.4px;font-weight:650;text-transform:none;color:#9c7c8c}
.btn{min-height:39px;border-radius:6px;padding:9px 13px;font-size:12.5px;font-weight:590;gap:7px;transition:background .16s ease,border-color .16s ease,transform .16s ease}
.btn:hover:not(:disabled){transform:none;box-shadow:none}
.btn:active:not(:disabled){transform:scale(.985)}
.btn-primary{background:#aa3f68}
.btn-primary:hover{background:#8e3356}
.btn-light{background:#fff;color:#754253;border-color:#dfcbd4}
.btn-light:hover{background:#fcf8fa}
.btn-ghost{color:#9a4b69}
.btn-danger{border-color:#e7c9d3}
.btn-mini{min-height:30px;padding:6px 10px}
.card,.overview-panel{background:#fff;border:1px solid var(--border);border-radius:8px;box-shadow:none;padding:19px 20px}
.card-head{margin-bottom:11px;min-height:24px}
.card-head h2,.card-head h3{font-size:15px;font-weight:650;letter-spacing:-.25px;color:#343035}
.card-head a,.text-btn{color:#a03e64;font-size:12px;font-weight:570;min-height:28px;padding:4px 0}
.text-btn:hover{color:#81304f}
.text-btn:hover svg{transform:translateX(2px)}
.text-btn svg{width:14px;height:14px}
.panel-caption{color:#958892;font-size:11px;margin:3px 0 0}
.page-enter{animation:softenter .19s ease-out both}
@keyframes softenter{from{opacity:.65;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
.cards,.overview-stats{gap:12px;margin-bottom:16px}
.summary-band{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:#fff;border:1px solid #e8dce1;border-radius:8px;overflow:hidden;margin-bottom:16px}
.summary-band .metric-link{border:0;border-right:1px solid #ede5e9;border-radius:0;background:transparent;min-height:92px;padding:17px 20px;gap:8px}
.summary-band .metric-link:last-child{border-right:0}
.summary-band .metric-link:hover{background:#fcf8fa;transform:none}
.summary-band .metric-copy{gap:4px;flex-direction:column}
.summary-band .metric-label{font-size:12px;font-weight:500;color:#796e76}
.summary-band .metric-num{font-size:28px;letter-spacing:-.8px;font-weight:690;color:#29272a;line-height:1.05}
.metric-link{border-radius:8px;min-height:93px;padding:15px;background:#fff;border:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.metric-link:hover{border-color:#dec4ce;transform:none;background:#fffafc}
.metric-link .metric-icon{display:none}
.metric-copy{display:flex;flex-direction:column-reverse;gap:6px;min-width:0}
.metric-link .metric-num{font-weight:690;font-size:26px;margin:0;color:#332c31}
.metric-link .metric-label{font-weight:500;font-size:12px;color:#796d78}
.metric-arrow{align-self:center;color:#b4a3ac;opacity:0;transition:opacity .15s ease}
.metric-link:hover .metric-arrow,.metric-link:focus-visible .metric-arrow{opacity:1}
.overview-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(290px,.94fr);gap:16px;align-items:start}
.overview-layout>.stack{gap:16px}
.overview-layout .overview-panel{padding:20px 21px}
.schedule-panel{min-height:370px}
.schedule-panel .card-head{padding-bottom:10px;border-bottom:1px solid #ece5e9;margin-bottom:0}
.list-row{gap:11px;border-color:#efeaed;padding:13px 0;min-width:0}
.list-row:last-child{border:0}
.list-row.interactive:hover{background:#fbf8fa;transform:none}
.list-row.interactive{transition:background .15s ease;border-radius:4px}
.job-row{min-height:66px}
.job-row .row-time{min-width:68px;font-size:12px;color:#635a62;font-weight:570}
.row-main{min-width:0}
.row-title{font-size:12.5px;line-height:1.35;font-weight:610;color:#302a30}
.row-sub{font-size:11.5px;line-height:1.45;color:#847983;font-weight:400}
.job-row .row-sub{max-width:100%;font-size:11px}
.separator{color:#b19daa}
.job-assignee{min-width:90px;font-size:11px;color:#897e85}
.pill{border-radius:4px;font-size:10px;letter-spacing:0;font-weight:580;padding:5px 7px}
.pill.good{background:#eaf5ee;color:#256d51}
.pill.blue{background:#eff3f6;color:#49697c}
.pill.warn{background:#fbf2e7;color:#96683e}
.pill.pink{background:#f8e7ee;color:#994367}
.pill.neutral{background:#f4f2f3;color:#6f676e}
.chevron{color:#b7a6b0;width:14px;height:14px;flex-shrink:0}
.panel-bottom-actions{border-top:1px solid #f0eaed;margin-top:3px;padding-top:10px;display:flex;gap:18px;flex-wrap:wrap;align-items:center}
.inline-action{display:inline-flex;align-items:center;justify-content:flex-start;gap:7px;padding:9px 0;border:none;background:transparent;color:#9f4064;font-size:12px;font-weight:610;line-height:1.3;cursor:pointer;text-align:left;transition:color .16s ease}
.inline-action svg{width:14px;height:14px}
.inline-action:hover{color:#752744}
.activity-panel .card-head,.team-panel .card-head{padding-bottom:10px;margin-bottom:0;border-bottom:1px solid #f0e8ed}
.activity-row{min-height:65px!important;gap:10px;padding:12px 0!important}
.activity-row .row-title{font-size:12px;font-weight:540;line-height:1.45}
.activity-row .row-sub{font-size:11px}
.activity-mark{width:6px;height:6px;background:#b84971;border-radius:50%;flex:0 0 6px;align-self:flex-start;margin-top:6px}
.activity-mark.is-read{background:#dcd4da}
.team-row{padding:10px 0!important;min-height:64px!important;gap:10px}
.team-row .avatar{background:#f2e3e9;color:#866072;height:31px;width:31px;font-size:10px;border-radius:50%;font-weight:600}
.team-row .row-title{font-weight:600}
.team-row .row-sub{font-size:11px}
.status-indicator{font-size:10.5px;color:#766d74;white-space:nowrap}
.status-indicator:before{content:"";display:inline-block;width:6px;height:6px;background:#708e78;border-radius:50%;margin-right:6px;vertical-align:1px}
.status-indicator.free:before{background:#8a9b89}
.quick-grid{gap:8px}
.quick-action{border-radius:6px;min-height:50px;padding:10px;background:#fff;gap:8px;font-size:11.5px;font-weight:530;color:#554950}
.quick-action:hover{transform:none;background:#fcf9fa;border-color:#debecb}
.quick-action-icon{background:transparent;width:20px;height:20px;color:#9d5e77;border-radius:0}
.quick-action-icon svg{width:16px;height:16px}
.quick-action .quick-chevron{color:#b19eaa;width:12px;height:12px}
.notice,.topnotice{background:#fbf8f9;color:#6d5c68;border:1px solid #ebe0e5;padding:13px;border-radius:6px;line-height:1.5}
.notice.strong{background:#f9f0f4;border-color:#e9d1db}
.hero-card{background:#fff;border:1px solid var(--border);border-radius:8px;padding:21px}
.banner{border-radius:8px;background:#f8eef1;border:1px solid var(--border)}
.info-grid{gap:0;grid-template-columns:repeat(2,minmax(0,1fr))}
.info-box{border-radius:0;background:#fff;border:0;border-bottom:1px solid #f0e9ed;padding:13px 10px}
.info-label{font-size:11px;color:#867a82;margin-bottom:5px}
.info-val{font-size:13px;font-weight:610;color:#3c353b}
.tabs{background:transparent;border-bottom:1px solid #ecdee5;border-radius:0;gap:18px;width:100%;padding:0}
.tab{border-radius:0;padding:10px 2px;color:#85777f;font-size:12px;font-weight:530;border-bottom:2px solid transparent}
.tab.active{background:transparent;color:#a53e67;box-shadow:none;border-bottom-color:#b2476e}
.field{color:#51444d;font-size:12px;font-weight:590;gap:6px}
.field input,.field select,.field textarea{background:#fff;border-color:#e5d7de;border-radius:6px;font-size:15px;transition:border-color .14s ease,box-shadow .14s ease}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#b77b93;box-shadow:0 0 0 2px #f8e3eb}
.check-row{background:transparent;border:0;border-bottom:1px solid #efeaed;border-radius:0;padding:13px 2px;margin-bottom:0;transition:background .15s ease}
.check-row:hover{background:#faf7f9}
.check-row input{accent-color:#a8466a}
.progress-track{height:5px;background:#f1e8ec;border-radius:4px}
.progress-fill{background:#ab5072;border-radius:4px}
.chip{border-radius:5px;background:#fff;color:#725967;font-weight:550}
.chip.selected{background:#f7e7ed;color:#9b365e;border-color:#d9b3c4}
.service-choice{border-radius:6px;background:#fff;transition:border-color .14s ease,background .14s ease}
.service-choice:hover{transform:none;background:#faf7f8}
.service-choice.chosen{background:#fdf4f7;border-color:#cc96ad}
.messages-frame{border-radius:6px;background:#fff}
.bubble{border-radius:8px}
.bubble.self{background:#f6e9ef;border-color:#e9d4df}
.desktop-table th{background:#faf7f9;color:#80727e;text-transform:none;font-size:11px;letter-spacing:0;font-weight:590}
.desktop-table td,.desktop-table th{border-color:#efe8ec}
.desktop-table tbody tr:hover{background:#fbf8fa}
.floating-demo{border-radius:4px;font-weight:550;background:#fcf4e9}
.invoice-total{font-weight:650;color:#352e34}
.modal-backdrop{background:rgba(34,25,31,.34);backdrop-filter:none}
.modal-panel{border-radius:9px;box-shadow:0 16px 60px rgba(35,25,31,.17);padding:22px}
.modal-top h2{font-weight:660;font-size:17px}
.drawer-mode .modal-panel{border-radius:10px 0 0 10px}
.toast{background:#47353e;border-radius:6px;box-shadow:0 10px 30px rgba(34,25,31,.14)}
.footnote{font-size:10px;color:#95838d;margin-top:18px}
/* Cleaner experience */
.job-focus{position:relative;background:#fff;border:1px solid var(--border);border-radius:8px;padding:24px 24px 21px;overflow:hidden}
.job-focus:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#b34b70}
.job-focus-kicker{display:flex;align-items:center;gap:8px;color:#7f6c78;font-size:11px;font-weight:550;margin-bottom:15px}
.job-focus-kicker .pill{margin-left:auto}
.live-dot{height:7px;width:7px;border-radius:50%;background:#4d9277}
.job-focus h2{font-size:25px;letter-spacing:-.7px;line-height:1.15;font-weight:660;margin:0 0 4px}
.job-focus-address{font-size:13px;color:#817580;margin:0 0 18px}
.job-focus-meta{display:flex;flex-wrap:wrap;gap:9px 20px;padding:15px 0;border-top:1px solid #eee7eb;border-bottom:1px solid #eee7eb;color:#645a62;font-size:12px}
.job-focus-meta span{display:inline-flex;align-items:center;gap:6px}
.job-focus-meta svg{width:15px;height:15px;color:#a36a81}
.job-focus-actions{display:flex;align-items:center;gap:10px;margin-top:17px;flex-wrap:wrap}
.notes-list{display:flex;flex-direction:column}
.notes-list>div{padding:12px 0;border-bottom:1px solid #f0eaed}
.notes-list>div:last-child{border-bottom:0}
.notes-list strong{display:block;font-size:12px;font-weight:650;color:#42363e;margin-bottom:3px}
.notes-list p{margin:0;color:#766a72;font-size:12px;line-height:1.56}
.private-note{font-size:11px;color:#887680;display:flex;gap:8px;align-items:flex-start;padding-top:13px;border-top:1px solid #eee8eb;margin-top:10px}
.private-note svg{height:14px;width:14px;flex-shrink:0}
/* Customer experience */
.customer-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.9fr);gap:16px;align-items:start}
.customer-next{min-height:285px}
.appointment-feature{padding:12px 0 9px}
.appointment-date{font-size:22px;letter-spacing:-.4px;font-weight:640;color:#352d34}
.appointment-time{font-size:14px;font-weight:570;color:#624f5a;margin-top:4px}
.appointment-service{font-size:12px;color:#6c5d67;font-weight:590;margin-top:13px}
.customer-links{display:flex;flex-direction:column}
.customer-links button{display:flex;align-items:center;justify-content:space-between;gap:10px;background:transparent;border:0;border-bottom:1px solid #eee7eb;text-align:left;color:#534852;padding:15px 0;font-size:12.5px;font-weight:560}
.customer-links button:last-child{border-bottom:0}
.customer-links button:hover{color:#a34065}
.customer-links button svg{width:14px;height:14px}
/* mobile */
@media(max-width:1280px){.overview-layout{grid-template-columns:minmax(0,1.25fr) minmax(270px,1fr)}.job-assignee{display:none}}
@media(max-width:1050px){.main-shell{padding-left:20px;padding-right:20px}.overview-layout,.customer-layout{grid-template-columns:1fr}.overview-layout>.stack{display:flex!important;flex-direction:column}.summary-band .metric-link{padding:15px 12px}.summary-band .metric-num{font-size:25px}}
@media(max-width:850px){:root{--nav:0px}.sidebar{display:none}.main-shell{margin-left:0;width:100%;padding:0 16px calc(95px + env(safe-area-inset-bottom))}.topbar{height:62px;margin:0 -16px 22px;padding:0 16px;background:rgba(251,244,247,.96);border-bottom:1px solid #e7d5dd;position:sticky;top:0;z-index:30;backdrop-filter:blur(12px)}.mobile-brand{gap:8px}.mobile-brand img{width:38px;height:38px;border-radius:50%}.mobile-brand b{font-size:10px;color:#5e4452;letter-spacing:0}.page-head{margin-bottom:17px}.page-head h1{font-size:24px}.summary-band{grid-template-columns:repeat(2,minmax(0,1fr))}.summary-band .metric-link{min-height:75px;padding:13px 15px}.summary-band .metric-link:nth-child(2){border-right:0}.summary-band .metric-link:nth-child(-n+2){border-bottom:1px solid #ede5e9}.summary-band .metric-copy{flex-direction:column}.summary-band .metric-num{font-size:25px}.summary-band .metric-label{font-size:11px}.overview-layout{display:flex;flex-direction:column}.overview-layout>div{width:100%}.overview-layout>.stack{display:flex!important;flex-direction:column}.overview-layout .overview-panel{padding:16px}.mobile-bottom{box-shadow:none;background:rgba(255,255,255,.98);border-top:1px solid #e5d6df;gap:0;padding:6px 6px calc(6px + env(safe-area-inset-bottom))}.bottom-item{font-size:10px;font-weight:500;border-radius:4px;min-height:53px;color:#857784}.bottom-item.active{background:transparent;color:#9e3f67;font-weight:650}.bottom-item.active:before{content:"";position:absolute;top:0;width:27px;height:2px;background:#b64e73}.bottom-item{position:relative}.bottom-item svg{height:19px;width:19px}.mobile-drawer-pane{background:#f8edf2}.mobile-drawer .nav-link.active{background:#fff}.footnote{display:none}.modal-panel{padding:19px 16px 26px}}
@media(max-width:560px){.main-shell{padding-left:13px;padding-right:13px}.topbar{margin-left:-13px;margin-right:-13px;padding:0 13px}.page-head{align-items:flex-start;gap:7px}.page-head h1{font-size:24px}.page-head p{font-size:12px}.page-head>.btn{font-size:11px;padding:8px 10px;min-height:37px}.card{padding:16px;border-radius:7px}.card-head h2{font-size:14px}.summary-band .metric-link{min-height:78px}.metric-arrow{display:none}.job-row{min-height:66px;gap:7px}.job-row .row-time{min-width:60px;font-size:11px}.job-row .row-title{font-size:12px}.job-row .row-sub{font-size:10.5px}.job-row .pill{font-size:9px;padding:4px 5px}.job-row .chevron{width:11px}.panel-bottom-actions{gap:12px}.inline-action{font-size:11.5px}.job-focus{padding:21px 17px 18px}.job-focus h2{font-size:23px}.job-focus-meta{gap:8px 13px}.job-focus-actions{display:flex;flex-direction:column;align-items:stretch}.job-focus-actions>.btn{width:100%}.customer-next{min-height:0}.appointment-date{font-size:20px}.info-grid{grid-template-columns:1fr}.info-box{padding:12px 3px}.card .metric-icon{background:transparent;color:#a55775;border-radius:0;width:20px!important;height:20px!important}.quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.quick-action{min-height:48px;padding:10px}.field-grid{grid-template-columns:1fr}.modal-panel,.modal-panel.large{max-height:93dvh;border-radius:10px 10px 0 0}.drawer-mode .modal-panel{border-radius:10px 10px 0 0}}
@media(max-width:360px){.topbar .avatar{display:none}.demo-select select{max-width:76px}.job-row .row-sub{max-width:155px}.summary-band .metric-link{padding:11px 10px}.panel-bottom-actions{gap:10px}}
@media(prefers-reduced-motion:reduce){.page-enter{animation:none}}