@font-face { font-family:'Jost Custom'; src:url('assets/fonts/Jost-VariableFont_wght.ttf') format('truetype'); font-weight:100 900; font-style:normal; font-display:swap; }

:root { color-scheme:dark; --ink:#090909; --surface:#171717; --line:rgba(212,175,79,.18); --gold:#d4af4f; --gold-bright:#f1d27c; --muted:#a79f8c; --cream:#f6f1e4; font-family:'Jost Custom',ui-sans-serif,system-ui,sans-serif; background:var(--ink); color:var(--cream); }
* { box-sizing:border-box; } body { min-width:320px; min-height:100vh; margin:0; background:var(--ink); } button,input,select { font:inherit; } button { cursor:pointer; }
.icon-sprite { position:absolute; width:0; height:0; overflow:hidden; }.ui-icon { width:1em; height:1em; display:block; }
.shell { width:min(100% - 2.5rem,76rem); min-height:100vh; margin:0 auto; padding:1.1rem 0 4rem; }.unified-site-header { display:flex; align-items:center; justify-content:space-between; gap:24px; margin:0 auto 1.1rem; padding:18px 26px 14px; border-bottom:1px solid rgba(255,255,255,.04); }.unified-site-header .brand-home,.unified-site-header .brand-lockup-inline { display:inline-flex; align-items:center; text-decoration:none; }.unified-site-header .brand-lockup-inline { gap:14px; }.unified-site-header .brand-crown { display:block; width:28px; height:auto; object-fit:contain; }.unified-site-header .brand-wordmark { color:var(--gold-bright); font-family:'Iowan Old Style','Palatino Linotype','Book Antiqua',Georgia,serif; font-size:1.72rem; letter-spacing:.08em; line-height:1; white-space:nowrap; }.unified-site-nav { display:flex; align-items:center; gap:24px; flex-wrap:wrap; }.unified-site-nav .site-nav-link { position:relative; display:inline-flex; align-items:center; min-height:34px; border:0; border-radius:0; background:transparent; color:var(--muted); padding:0; font-size:.95rem; font-weight:700; text-decoration:none; transition:color .16s ease; }.unified-site-nav .site-nav-link::after { position:absolute; right:0; bottom:-9px; left:0; height:2px; border-radius:999px; background:transparent; content:''; transition:background .16s ease; }.unified-site-nav .site-nav-link:hover { color:var(--cream); }.unified-site-nav .site-nav-link.active { background:transparent; color:var(--gold-bright); }.unified-site-nav .site-nav-link.active::after { background:var(--gold); }
.auth-view { position:relative; display:grid; align-items:end; width:min(100%,72rem); min-height:min(47rem,calc(100vh - 4.4rem)); margin:0 auto; overflow:hidden; border:1px solid var(--line); border-radius:1.75rem; background:linear-gradient(90deg,rgba(11,12,10,.98) 0%,rgba(11,12,10,.88) 35%,rgba(11,12,10,.14) 72%),linear-gradient(0deg,rgba(9,10,8,.9) 0%,transparent 56%),url('assets/studio-hero.jpeg') center/cover; box-shadow:0 2rem 7rem rgba(0,0,0,.42); padding:clamp(1.6rem,6vw,4.5rem); }
.auth-view::after { position:absolute; inset:1.15rem; border:1px solid rgba(255,234,168,.13); border-radius:1.1rem; content:''; pointer-events:none; }.auth-view > * { position:relative; z-index:1; }
.auth-view .brand-mark { display:grid; width:3.35rem; height:3.35rem; place-items:center; margin-bottom:2.5rem; border:1px solid rgba(255,238,185,.8); border-radius:50%; background:linear-gradient(135deg,#f8dda0,#b78932); box-shadow:0 .7rem 2rem rgba(0,0,0,.36); color:#191408; font-size:.83rem; font-weight:700; letter-spacing:.09em; }
.eyebrow { margin:0 0 .6rem; color:var(--gold); font-size:.68rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; } h1,h2,p { margin-top:0; } h1 { max-width:31rem; margin-bottom:.9rem; font-family:'Iowan Old Style','Palatino Linotype','Book Antiqua',Georgia,serif; font-size:clamp(2.7rem,6vw,5rem); font-weight:600; letter-spacing:-.045em; line-height:.97; } h2 { margin-bottom:0; font-size:1.28rem; letter-spacing:-.03em; }.intro { max-width:28rem; margin-bottom:0; color:#d0d0c4; font-size:.95rem; line-height:1.65; }
.auth-view .panel { width:min(100%,27rem); margin-top:2.1rem; }.panel { border:1px solid var(--line); border-radius:1.1rem; background:rgba(28,30,25,.86); box-shadow:0 1rem 2.5rem rgba(0,0,0,.16); backdrop-filter:blur(14px); }.form-stack { display:grid; gap:.95rem; padding:1.25rem; } label { display:grid; gap:.5rem; color:#e9e6dc; font-size:.78rem; font-weight:700; letter-spacing:.02em; } input,select { width:100%; border:1px solid rgba(236,226,190,.18); border-radius:.62rem; background:rgba(6,7,6,.56); color:var(--cream); padding:.82rem .88rem; transition:border-color .18s,background .18s; } input::placeholder { color:#77796f; } input:focus,select:focus { border-color:var(--gold); outline:0; background:rgba(6,7,6,.84); box-shadow:0 0 0 3px rgba(237,200,103,.12); }
.password-field { position:relative; display:block; }.password-field input { padding-right:3.4rem; }.password-field button { position:absolute; top:50%; right:.35rem; display:grid; width:2.15rem; min-height:2.15rem; place-items:center; border:0; border-radius:.45rem; background:rgba(212,175,79,.12); color:var(--gold-bright); padding:.25rem; transform:translateY(-50%); }.password-field button:hover { background:rgba(212,175,79,.2); }.password-field button svg { width:1.05rem; height:1.05rem; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.8; }.remember-account { display:flex; align-items:center; gap:.55rem; color:var(--muted); font-size:.7rem; font-weight:650; letter-spacing:0; }.remember-account input { width:1rem; height:1rem; accent-color:var(--gold); }.remember-account span { line-height:1.25; }
.primary,.outline { min-height:3rem; border-radius:.65rem; padding:.7rem 1rem; font-size:.86rem; font-weight:800; transition:transform .18s,box-shadow .18s; }.primary { border:1px solid #ffe4a2; background:linear-gradient(135deg,#ffe4a2,#d4a53e); box-shadow:0 .55rem 1.2rem rgba(154,109,22,.23); color:#1d1608; }.primary:hover { transform:translateY(-1px); box-shadow:0 .8rem 1.5rem rgba(154,109,22,.32); }.outline { border:1px solid rgba(244,219,150,.35); background:rgba(13,14,12,.45); color:var(--cream); }.outline:hover { border-color:var(--gold); }.text-button,.back-button { border:0; background:transparent; color:var(--gold-bright); padding:1rem 0 0; font-size:.82rem; font-weight:800; }.back-button { padding:0 0 1.25rem; color:#d1cec2; }.message { min-height:1.15rem; margin:0; color:var(--gold-bright); font-size:.78rem; line-height:1.45; }.message.error { color:#ffae9d; }.hidden { display:none !important; }
.dashboard { display:grid; gap:1.35rem; }.topbar { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.6rem 0 1.15rem; border-bottom:1px solid var(--line); }.topbar h1 { margin:0; font-size:clamp(1.65rem,4vw,2.45rem); letter-spacing:-.06em; line-height:1; }.topbar-actions { display:flex; align-items:center; gap:.75rem; }.today-label { color:var(--gold); font-size:.68rem; font-weight:800; letter-spacing:.15em; }.business-switcher { display:grid; width:min(100%,23rem); gap:.42rem; }.business-switcher label { color:var(--muted); font-size:.65rem; letter-spacing:.13em; text-transform:uppercase; }.metrics { display:grid; grid-template-columns:1.38fr 1fr 1fr; gap:.9rem; }.metric { position:relative; min-height:8rem; overflow:hidden; border:1px solid var(--line); border-radius:1rem; background:linear-gradient(145deg,#242424,#151515); padding:1.15rem; }.metric:first-child { background:linear-gradient(135deg,#3a2d15,#1a1914); }.metric::after { position:absolute; right:-1.4rem; bottom:-1.8rem; width:6rem; height:6rem; border:1px solid rgba(244,219,150,.16); border-radius:50%; content:''; }.metric span { display:block; color:var(--muted); font-size:.77rem; font-weight:600; }.metric strong { display:block; margin-top:1.2rem; color:var(--gold-bright); font-family:'Iowan Old Style','Palatino Linotype',Georgia,serif; font-size:2.35rem; font-weight:600; line-height:1; }
.topbar { display:grid; grid-template-columns:minmax(11rem,1fr) auto auto; align-items:center; border:1px solid rgba(212,175,79,.16); border-radius:1rem; background:linear-gradient(125deg,rgba(41,37,27,.82),rgba(22,22,21,.94) 48%,rgba(14,14,14,.98)); box-shadow:0 1rem 2rem rgba(0,0,0,.16); padding:.85rem 1rem; }.workspace-identity { display:flex; min-width:0; align-items:center; gap:.7rem; }.business-monogram { display:grid; width:2.55rem; height:2.55rem; flex:0 0 auto; place-items:center; border:1px solid rgba(255,228,162,.6); border-radius:.72rem; background:linear-gradient(135deg,#f8dda0,#b78932); box-shadow:0 .35rem .8rem rgba(0,0,0,.2); color:#1a150b; font-family:'Iowan Old Style',Georgia,serif; font-size:.8rem; font-weight:800; letter-spacing:.07em; }.role-chip { width:fit-content; margin:0 0 .28rem; border:1px solid rgba(212,175,79,.26); border-radius:999px; background:rgba(212,175,79,.08); color:var(--gold-bright); padding:.16rem .42rem; font-size:.56rem; font-weight:800; letter-spacing:.07em; text-transform:uppercase; }.topbar h1 { overflow:hidden; max-width:19rem; color:var(--cream); font-size:clamp(1.3rem,2.2vw,1.8rem); text-overflow:ellipsis; white-space:nowrap; }.header-nav { display:flex; align-items:center; gap:.12rem; border:1px solid rgba(212,175,79,.16); border-radius:.75rem; background:rgba(0,0,0,.18); padding:.2rem; }.header-nav-item { display:flex; align-items:center; gap:.32rem; min-height:2.25rem; border:0; border-radius:.55rem; background:transparent; color:var(--muted); padding:.45rem .55rem; font-size:.7rem; font-weight:800; }.header-nav-item:hover,.header-nav-item.active { background:rgba(212,175,79,.15); color:var(--gold-bright); }.header-nav-icon { color:var(--gold); font-size:.72rem; }.topbar-actions { justify-content:flex-end; gap:.4rem; }.sign-out-button { min-height:2.3rem; border:1px solid rgba(244,219,150,.24); border-radius:.58rem; background:transparent; color:#d1cec2; padding:.4rem .65rem; font-size:.7rem; font-weight:800; }.sign-out-button:hover { border-color:rgba(255,174,157,.48); color:#ffb3a9; }
.agenda-panel { padding:clamp(1rem,3vw,1.6rem); }.section-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; margin-bottom:1.25rem; }.section-heading h2,.onboarding h2 { font-family:'Iowan Old Style','Palatino Linotype',Georgia,serif; font-size:1.75rem; }.fee-pill { border:1px solid rgba(212,175,79,.25); border-radius:999px; background:rgba(212,175,79,.08); color:var(--gold-bright); padding:.42rem .65rem; font-size:.68rem; font-weight:700; text-align:right; }.appointment-list { display:grid; gap:1rem; }.timeline-day { overflow:hidden; border:1px solid rgba(212,175,79,.12); border-radius:.9rem; background:rgba(8,8,8,.26); }.timeline-date { display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid rgba(212,175,79,.12); background:rgba(255,255,255,.025); padding:.72rem .9rem; color:var(--gold-bright); font-size:.78rem; font-weight:800; }.timeline-date small { color:var(--muted); font-size:.7rem; font-weight:600; }.timeline-track { position:relative; padding:.55rem .85rem; }.timeline-track::before { position:absolute; top:.9rem; bottom:.9rem; left:4.3rem; width:1px; background:linear-gradient(var(--gold),rgba(212,175,79,.12)); content:''; }.timeline-appointment { position:relative; display:grid; grid-template-columns:3rem .65rem 1fr; align-items:stretch; min-height:4.7rem; }.timeline-appointment time { padding-top:.9rem; color:var(--gold); font-size:.72rem; font-weight:800; }.timeline-line { position:relative; }.timeline-line::after { position:absolute; top:1.02rem; left:50%; width:.62rem; height:.62rem; border:2px solid #161616; border-radius:50%; background:var(--gold); box-shadow:0 0 0 3px rgba(212,175,79,.13); content:''; transform:translateX(-50%); }.timeline-card { margin:.42rem 0 .42rem .15rem; border:1px solid rgba(212,175,79,.14); border-left:2px solid var(--gold); border-radius:.7rem; background:linear-gradient(90deg,rgba(212,175,79,.1),rgba(255,255,255,.025)); padding:.66rem .75rem; }.timeline-appointment.is-special .timeline-card { border-left-color:#ffcc76; background:linear-gradient(90deg,rgba(255,173,65,.14),rgba(255,255,255,.025)); }.timeline-card-top { display:flex; justify-content:space-between; gap:.75rem; align-items:center; }.timeline-card strong { color:var(--cream); font-size:.87rem; }.timeline-card small { display:block; margin-top:.25rem; color:var(--muted); font-size:.72rem; }.status { border:1px solid rgba(131,210,145,.24); border-radius:999px; background:rgba(71,137,82,.14); color:#bbe5ba; padding:.26rem .45rem; font-size:.59rem; font-weight:800; letter-spacing:.04em; }.onboarding { padding:1.35rem; }.onboarding .form-stack { grid-template-columns:1fr 1fr auto; align-items:end; margin-top:1.2rem; padding:0; }.onboarding .form-stack .message { grid-column:1/-1; }.onboarding .primary { min-width:10.2rem; }
.agenda-toolbar,.calendar-controls,.agenda-filters,.date-nav,.view-tabs,.detail-actions,.dialog-heading,.charge-lines>div,.receipt-lines>div,.receipt-total { display:flex; align-items:center; }.agenda-toolbar,.calendar-controls { justify-content:space-between; gap:1rem; }.agenda-toolbar { margin-bottom:1.2rem; }.agenda-toolbar h2 { margin:0; font-family:'Iowan Old Style','Palatino Linotype',Georgia,serif; font-size:1.75rem; }.toolbar-action { min-width:8.7rem; }.calendar-controls { border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:.75rem 0; }.date-nav { gap:.45rem; }.date-nav strong { margin-left:.55rem; color:var(--cream); font-family:'Iowan Old Style','Palatino Linotype',Georgia,serif; font-size:1.05rem; text-transform:capitalize; }.icon-button,.compact { min-height:2.2rem; border:1px solid rgba(244,219,150,.24); border-radius:.55rem; background:transparent; color:var(--cream); padding:.35rem .65rem; }.icon-button { font-size:1rem; }.view-tabs { gap:.2rem; border:1px solid var(--line); border-radius:.65rem; padding:.2rem; }.view-tab { border:0; border-radius:.45rem; background:transparent; color:var(--muted); padding:.45rem .65rem; font-size:.73rem; font-weight:800; }.view-tab.active { background:rgba(212,175,79,.17); color:var(--gold-bright); }.agenda-filters { justify-content:space-between; gap:1rem; padding:.85rem 0; }.agenda-filters label { display:flex; width:min(100%,17rem); align-items:center; gap:.6rem; color:var(--muted); font-size:.67rem; text-transform:uppercase; }.agenda-filters select { padding:.45rem .55rem; }.calendar { min-height:25rem; }.day-agenda { overflow:hidden; border:1px solid rgba(212,175,79,.14); border-radius:.9rem; }.day-title { display:flex; justify-content:space-between; padding:.8rem 1rem; border-bottom:1px solid var(--line); color:var(--gold-bright); font-weight:800; text-transform:capitalize; }.day-title small,.empty-day { color:var(--muted); font-size:.7rem; }.day-track { position:relative; padding:.6rem 1rem; }.day-track::before { position:absolute; top:1.1rem; bottom:1.1rem; left:4rem; width:1px; background:linear-gradient(var(--gold),rgba(212,175,79,.08)); content:''; }.appointment-card { position:relative; z-index:1; display:grid; width:100%; grid-template-columns:3rem .8rem 1fr auto; align-items:center; gap:.35rem; border:0; border-radius:.65rem; background:transparent; color:var(--cream); padding:.45rem 0; text-align:left; }.appointment-card:hover .appointment-info { border-color:rgba(241,210,124,.48); transform:translateX(2px); }.appointment-card time { color:var(--gold); font-size:.73rem; font-weight:800; }.appointment-dot { width:.65rem; height:.65rem; border:2px solid #161616; border-radius:50%; background:var(--gold); box-shadow:0 0 0 3px rgba(212,175,79,.12); }.appointment-info { min-width:0; border:1px solid rgba(212,175,79,.15); border-left:2px solid var(--gold); border-radius:.65rem; background:linear-gradient(90deg,rgba(212,175,79,.1),rgba(255,255,255,.02)); padding:.6rem .7rem; transition:.18s; }.appointment-info strong,.appointment-info small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.appointment-info strong { font-size:.84rem; }.appointment-info small { margin-top:.2rem; color:var(--muted); font-size:.68rem; }.appointment-card.is-special .appointment-info { border-left-color:#ffbd52; background:linear-gradient(90deg,rgba(255,173,65,.14),rgba(255,255,255,.02)); }.appointment-card.is-completed { opacity:.55; }.empty-agenda { padding:3rem 0 3rem 4.8rem; color:var(--muted); }.week-agenda { display:grid; grid-template-columns:repeat(7,minmax(8rem,1fr)); gap:.45rem; overflow-x:auto; }.week-day { min-height:20rem; border:1px solid rgba(212,175,79,.12); border-radius:.7rem; background:rgba(255,255,255,.018); padding:.55rem; }.week-day header { display:flex; justify-content:space-between; color:var(--muted); font-size:.68rem; text-transform:capitalize; }.week-day header strong { color:var(--cream); font-size:.9rem; }.week-day.is-today { border-color:rgba(212,175,79,.5); }.week-day .appointment-card { display:block; margin-top:.6rem; border-left:2px solid var(--gold); background:rgba(212,175,79,.1); padding:.45rem; }.week-day .appointment-dot,.week-day .status { display:none; }.week-day .appointment-info { border:0; background:transparent; padding:0; }.week-day .appointment-card time { display:block; margin-bottom:.2rem; }.month-weekdays,.month-agenda { display:grid; grid-template-columns:repeat(7,1fr); }.month-weekdays { margin-top:.2rem; color:var(--muted); font-size:.65rem; font-weight:800; text-align:center; text-transform:uppercase; }.month-weekdays span { padding:.65rem .15rem; }.month-agenda { overflow:hidden; border-top:1px solid var(--line); border-left:1px solid var(--line); }.month-day { min-height:7.4rem; overflow:hidden; border:0; border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(255,255,255,.015); color:var(--cream); padding:.4rem; text-align:left; }.month-day:hover { background:rgba(212,175,79,.08); }.month-day>span { display:block; margin-bottom:.25rem; font-size:.73rem; font-weight:800; }.month-day.other-month { opacity:.22; }.month-day.is-today>span { display:grid; width:1.5rem; height:1.5rem; place-items:center; border-radius:50%; background:var(--gold); color:#161208; }.month-event { display:block; overflow:hidden; margin:.15rem 0; border-left:2px solid var(--gold); background:rgba(212,175,79,.1); padding:.14rem .25rem; color:#e9e3d4; font-size:.59rem; text-overflow:ellipsis; white-space:nowrap; }.month-event.is-special { border-left-color:#ffbd52; }.dialog { width:min(94vw,42rem); max-height:90vh; border:1px solid rgba(212,175,79,.28); border-radius:1rem; background:#171717; color:var(--cream); box-shadow:0 2rem 6rem rgba(0,0,0,.65); }.dialog::backdrop { background:rgba(0,0,0,.7); backdrop-filter:blur(4px); }.dialog-card { padding:1.25rem; }.dialog-heading { justify-content:space-between; gap:1rem; }.dialog-heading h2 { margin:0; font-family:'Iowan Old Style','Palatino Linotype',Georgia,serif; font-size:1.55rem; }.close-dialog { width:2.2rem; height:2.2rem; border:1px solid var(--line); border-radius:50%; background:transparent; color:var(--cream); font-size:1.3rem; }.form-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:.85rem; }.form-stack textarea { resize:vertical; border:1px solid rgba(236,226,190,.18); border-radius:.62rem; background:rgba(6,7,6,.56); color:var(--cream); padding:.7rem; }.special-note { border-left:2px solid #ffbd52; background:rgba(255,173,65,.1); color:#ffd896; padding:.65rem; font-size:.75rem; }.appointment-detail { display:grid; gap:.8rem; margin:1.3rem 0; }.appointment-detail div { display:grid; gap:.18rem; }.appointment-detail dt { color:var(--gold); font-size:.66rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }.appointment-detail dd { margin:0; color:#ddd8ca; }.detail-actions { flex-wrap:wrap; gap:.55rem; }.danger { min-height:2.75rem; border:1px solid rgba(255,125,110,.4); border-radius:.65rem; background:rgba(158,44,31,.12); color:#ffb3a9; padding:.55rem .8rem; font-weight:800; }.charge-lines,.receipt-lines { display:grid; gap:.55rem; padding:.8rem 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.charge-lines>div,.receipt-lines>div,.receipt-total { justify-content:space-between; gap:1rem; color:#d8d3c5; font-size:.82rem; }.charge-total,.receipt-total { margin-top:.2rem; color:var(--gold-bright); font-family:'Iowan Old Style','Palatino Linotype',Georgia,serif; font-size:1.4rem; }.charge-total { display:flex; justify-content:space-between; }.receipt { position:relative; padding:1.5rem; }.receipt h2 { margin-bottom:.35rem; font-family:'Iowan Old Style','Palatino Linotype',Georgia,serif; }.receipt p { color:var(--muted); font-size:.75rem; }.receipt small { color:var(--muted); }.receipt-close { position:absolute; top:.8rem; right:.8rem; }.print-receipt { display:block; width:100%; margin-top:1.2rem; }
@media (max-width:45rem) { .agenda-toolbar,.calendar-controls,.agenda-filters { align-items:flex-start; flex-direction:column; }.calendar-controls { gap:.7rem; }.date-nav { flex-wrap:wrap; }.date-nav strong { width:100%; margin-left:0; }.view-tabs { width:100%; }.view-tab { flex:1; }.agenda-filters label { width:100%; }.fee-pill { text-align:left; }.appointment-card { grid-template-columns:2.55rem .65rem 1fr; }.appointment-card .status { display:none; }.day-track::before { left:3.4rem; }.week-agenda { grid-template-columns:repeat(7,minmax(7.3rem,1fr)); }.month-day { min-height:5.5rem; padding:.25rem; }.month-event { font-size:.52rem; }.form-grid { grid-template-columns:1fr; }.dialog { padding:0; }.toolbar-action { width:100%; }.agenda-toolbar h2 { font-size:1.45rem; } }
.app-layout { display:grid; grid-template-columns:13.4rem minmax(0,1fr); gap:1.4rem; }.workspace { display:grid; min-width:0; gap:1.35rem; }.app-nav { position:sticky; top:1rem; display:flex; flex-direction:column; align-self:start; min-height:calc(100vh - 3rem); border:1px solid var(--line); border-radius:1rem; background:linear-gradient(160deg,#1d1d1d,#0e0e0e); padding:.75rem; }.nav-brand { display:grid; width:2.5rem; height:2.5rem; place-items:center; margin:.2rem .35rem 1.2rem; border:1px solid rgba(255,231,163,.55); border-radius:50%; background:linear-gradient(135deg,#f8dda0,#b78932); color:#191408; font-size:.7rem; font-weight:900; letter-spacing:.08em; }.app-nav nav { display:grid; gap:.18rem; }.nav-item { position:relative; display:flex; align-items:center; gap:.65rem; width:100%; border:0; border-radius:.65rem; background:transparent; color:var(--muted); padding:.7rem .65rem; text-align:left; font-size:.78rem; font-weight:750; }.nav-item:hover,.nav-item.active { background:rgba(212,175,79,.11); color:var(--gold-bright); }.nav-item>span { display:grid; width:1.1rem; place-items:center; color:var(--gold); }.profile-nav { margin-top:auto; border-top:1px solid var(--line); border-radius:0; padding-top:1rem; }.nav-badge { display:grid; min-width:1.15rem; height:1.15rem; place-items:center; margin-left:auto; border-radius:50%; background:#e4495e; color:#fff; font-size:.58rem; }.alerts-panel { padding:clamp(1rem,3vw,1.6rem); }.alert-tabs { display:flex; gap:.4rem; overflow-x:auto; border-bottom:1px solid var(--line); padding-bottom:.7rem; }.alert-tab { border:1px solid transparent; border-radius:999px; background:transparent; color:var(--muted); padding:.4rem .65rem; font-size:.7rem; font-weight:800; white-space:nowrap; }.alert-tab.active { border-color:rgba(212,175,79,.32); background:rgba(212,175,79,.11); color:var(--gold-bright); }.alerts-feed { display:grid; gap:.45rem; margin-top:1rem; }.alert-card { display:grid; grid-template-columns:2.2rem minmax(0,1fr) auto; width:100%; align-items:center; gap:.65rem; border:1px solid rgba(212,175,79,.12); border-radius:.75rem; background:rgba(255,255,255,.018); color:var(--cream); padding:.75rem; text-align:left; }.alert-card:hover { border-color:rgba(212,175,79,.4); background:rgba(212,175,79,.06); }.alert-card.is-new { border-left:2px solid var(--gold); background:linear-gradient(90deg,rgba(212,175,79,.12),rgba(255,255,255,.018)); }.alert-icon { display:grid; width:2rem; height:2rem; place-items:center; border-radius:.6rem; background:rgba(212,175,79,.13); color:var(--gold-bright); font-size:.85rem; font-weight:900; }.alert-copy { min-width:0; }.alert-copy strong,.alert-copy small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.alert-copy strong { font-size:.83rem; }.alert-copy small { margin-top:.2rem; color:var(--muted); font-size:.7rem; }.alert-meta { display:grid; justify-items:end; gap:.35rem; color:var(--muted); font-size:.62rem; white-space:nowrap; }.alert-meta em { border:1px solid rgba(212,175,79,.28); border-radius:999px; color:var(--gold-bright); padding:.16rem .36rem; font-size:.56rem; font-style:normal; font-weight:800; }.coming-soon { padding:2rem; }.coming-soon h2 { font-family:'Iowan Old Style','Palatino Linotype',Georgia,serif; font-size:1.8rem; }
.nav-group { display:grid; gap:.12rem; margin-top:1rem; padding-top:.85rem; border-top:1px solid rgba(212,175,79,.11); }.nav-group p { margin:0 .65rem .25rem; color:#777267; font-size:.58rem; font-weight:900; letter-spacing:.13em; text-transform:uppercase; }.nav-child { padding:.42rem .65rem .42rem 1.45rem; font-size:.71rem; font-weight:650; }
@media (max-width:52rem) { .app-nav .nav-group { display:flex; flex:0 0 auto; gap:.15rem; margin:0; border:0; padding:0; }.app-nav .nav-group p { display:none; }.app-nav .nav-child { width:auto; padding:.55rem .6rem; } }
@media (max-width:52rem) { .app-layout { display:block; }.app-nav { position:sticky; z-index:3; top:0; min-height:auto; margin:-.6rem -.6rem 1rem; border-width:0 0 1px; border-radius:0; flex-direction:row; overflow-x:auto; padding:.35rem .55rem; }.nav-brand { display:none; }.app-nav nav { display:flex; gap:.15rem; }.nav-item { width:auto; flex:0 0 auto; padding:.55rem .6rem; }.profile-nav { margin:0; border:0; padding:.55rem .6rem; }.nav-badge { position:absolute; top:.22rem; right:.1rem; }.app-nav .nav-item>span { display:none; } }
@media (max-width:32rem) { .alert-card { grid-template-columns:2rem minmax(0,1fr); }.alert-meta { display:none; }.alert-copy small { white-space:normal; } }
.app-layout { display:block; }.side-menu { position:fixed; z-index:20; top:0; bottom:0; left:0; display:grid; align-content:start; width:min(20rem,88vw); gap:.2rem; overflow-y:auto; border-right:1px solid var(--line); background:linear-gradient(155deg,#1d1d1d,#0b0b0b); box-shadow:1.5rem 0 4rem rgba(0,0,0,.45); padding:1rem .75rem; transform:translateX(-105%); transition:transform .24s ease; }.side-menu.open { transform:translateX(0); }.side-menu-heading { display:flex; align-items:center; gap:.75rem; margin-bottom:.7rem; padding:.15rem .3rem .8rem; border-bottom:1px solid var(--line); }.side-menu-heading .nav-brand { margin:0; flex:0 0 auto; }.side-menu-heading strong { flex:1; font-family:'Iowan Old Style','Palatino Linotype',Georgia,serif; font-size:1.25rem; }.side-menu .nav-group { margin-top:.7rem; }.menu-backdrop { position:fixed; z-index:19; inset:0; border:0; background:rgba(0,0,0,.58); opacity:0; pointer-events:none; transition:opacity .2s; }.menu-backdrop.open { opacity:1; pointer-events:auto; }.header-nav { display:flex; align-items:center; gap:.15rem; }.header-nav-item { position:relative; border:0; border-radius:.55rem; background:transparent; color:var(--muted); padding:.5rem .6rem; font-size:.72rem; font-weight:800; }.header-nav-item:hover,.header-nav-item.active { background:rgba(212,175,79,.12); color:var(--gold-bright); }.header-nav-item .nav-badge { position:absolute; top:-.22rem; right:-.15rem; margin:0; }.menu-toggle { display:grid; width:2.35rem; height:2.35rem; place-items:center; border:1px solid rgba(244,219,150,.28); border-radius:.6rem; background:transparent; color:var(--gold-bright); font-size:1.05rem; }.topbar-actions { flex-wrap:wrap; justify-content:flex-end; }.workspace { width:100%; }
.metrics { grid-template-columns:repeat(3,minmax(0,1fr)); gap:.55rem; }.metric { display:flex; min-height:0; align-items:baseline; justify-content:space-between; border-radius:.75rem; padding:.65rem .8rem; }.metric:first-child { background:linear-gradient(90deg,#2a2113,#191816); }.metric::after { display:none; }.metric span { font-size:.68rem; }.metric strong { margin:0; font-size:1.45rem; }
@media (max-width:45rem) { .header-nav { order:3; width:100%; justify-content:space-between; border-top:1px solid var(--line); padding-top:.55rem; }.header-nav-item { flex:1; padding:.45rem .3rem; font-size:.66rem; }.topbar-actions { justify-content:flex-end; }.topbar { flex-wrap:wrap; }.today-label { display:none; }.side-menu { width:min(19rem,90vw); } }
@media (max-width:45rem) { .shell { width:min(100% - 1.25rem,76rem); padding-top:.45rem; }.unified-site-header { align-items:flex-start; flex-direction:column; gap:14px; margin-bottom:.6rem; padding:14px 16px 12px; }.unified-site-header .brand-crown { width:24px; }.unified-site-header .brand-wordmark { font-size:1.34rem; letter-spacing:.06em; }.unified-site-nav { width:100%; justify-content:space-between; gap:14px; }.unified-site-nav .site-nav-link { flex:0 1 auto; font-size:.84rem; text-align:left; } }
.reports-panel { padding:clamp(1rem,3vw,1.6rem); }.report-controls { display:flex; justify-content:space-between; gap:.75rem; border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin-bottom:1rem; padding:.7rem 0; }.report-metrics { display:grid; grid-template-columns:1.35fr 1fr 1fr; gap:.65rem; margin-bottom:.7rem; }.profit-card,.report-metric { display:grid; gap:.38rem; min-height:7.5rem; border:1px solid rgba(212,175,79,.18); border-radius:.85rem; padding:1rem; }.profit-card { background:linear-gradient(145deg,#ffe89a,#ffd05c 55%,#b98928); color:#211a07; }.profit-card span,.report-metric span { font-size:.7rem; font-weight:800; }.profit-card strong,.report-metric strong { font-family:'Iowan Old Style','Palatino Linotype',Georgia,serif; font-size:1.9rem; line-height:1; }.profit-card small { color:#4b3607; font-weight:750; }.report-metric { background:linear-gradient(145deg,#242424,#161616); }.report-metric strong { color:var(--gold-bright); }.report-metric small { color:var(--muted); font-size:.66rem; }.report-card { margin-top:.7rem; border:1px solid rgba(212,175,79,.14); border-radius:.85rem; background:rgba(255,255,255,.018); padding:1rem; }.report-card h3 { margin:0; font-family:'Iowan Old Style','Palatino Linotype',Georgia,serif; font-size:1.25rem; }.report-card-heading { display:flex; justify-content:space-between; gap:1rem; }.report-card-heading p { margin:.25rem 0 0; color:var(--muted); font-size:.7rem; }.report-card-heading>strong { color:var(--gold-bright); font-family:'Iowan Old Style','Palatino Linotype',Georgia,serif; font-size:1.35rem; }.bar-chart { display:flex; height:11rem; align-items:end; justify-content:space-around; gap:.65rem; margin-top:1.1rem; border-bottom:1px solid rgba(212,175,79,.18); }.bar-chart div { display:grid; flex:1; height:100%; align-items:end; justify-items:center; gap:.4rem; }.bar-chart i { display:block; width:min(100%,1.9rem); border-radius:.35rem .35rem 0 0; background:linear-gradient(#f5d57d,#b98928); box-shadow:0 0 .8rem rgba(212,175,79,.2); }.bar-chart span { padding-bottom:.35rem; color:var(--muted); font-size:.62rem; font-style:normal; }.payment-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:.55rem; margin-top:.9rem; }.payment-grid article { display:grid; gap:.35rem; border-left:2px solid var(--gold); background:rgba(212,175,79,.07); padding:.65rem; }.payment-grid span,.payment-grid small { color:var(--muted); font-size:.64rem; }.payment-grid strong { color:var(--cream); font-size:.96rem; }.report-details { display:grid; grid-template-columns:repeat(2,1fr); gap:0; }.report-details h3 { grid-column:1/-1; margin-bottom:.6rem; }.report-details div { display:flex; justify-content:space-between; gap:.5rem; border-top:1px solid rgba(212,175,79,.1); padding:.6rem .3rem; color:var(--muted); font-size:.75rem; }.report-details strong { color:var(--cream); }.trend-hero { border:1px solid rgba(212,175,79,.19); border-radius:.85rem; background:linear-gradient(120deg,rgba(212,175,79,.16),rgba(255,255,255,.02)); padding:1rem; }.trend-hero h3 { max-width:24rem; margin:.2rem 0 .9rem; font-family:'Iowan Old Style','Palatino Linotype',Georgia,serif; font-size:1.55rem; }.trend-filters { display:flex; gap:.4rem; }.trend-filters button { border:1px solid rgba(212,175,79,.2); border-radius:999px; background:transparent; color:var(--muted); padding:.35rem .58rem; font-size:.65rem; font-weight:800; }.trend-filters button.active { background:rgba(212,175,79,.17); color:var(--gold-bright); }.trend-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:.65rem; margin-top:.7rem; }.trend-grid article { display:grid; gap:.3rem; border:1px solid rgba(212,175,79,.13); border-radius:.75rem; background:rgba(255,255,255,.018); padding:.8rem; }.trend-grid span,.trend-grid small { color:var(--muted); font-size:.66rem; }.trend-grid strong { color:var(--cream); font-size:.9rem; }.trend-grid em { color:#b8ff4a; font-size:.78rem; font-style:normal; font-weight:900; }.rank-row { display:grid; grid-template-columns:minmax(7rem,1fr) minmax(3rem,2fr) auto; align-items:center; gap:.6rem; border-top:1px solid rgba(212,175,79,.1); padding:.7rem 0; color:#ddd8ca; font-size:.75rem; }.rank-row i { height:.42rem; overflow:hidden; border-radius:999px; background:rgba(212,175,79,.12); }.rank-row b { display:block; height:100%; border-radius:inherit; background:var(--gold); }.rank-row strong { color:var(--gold-bright); font-size:.75rem; }.report-action { margin:.55rem 0 0; border-left:2px solid var(--gold); background:rgba(212,175,79,.08); color:#d8d3c5; padding:.65rem; font-size:.77rem; line-height:1.45; }
.monthly-pie-layout { display:grid; grid-template-columns:minmax(11rem,15rem) minmax(0,1fr); align-items:center; gap:1.2rem; margin-top:1rem; }.monthly-pie { display:grid; width:min(100%,15rem); aspect-ratio:1; place-items:center; border-radius:50%; box-shadow:inset 0 0 0 1.5rem rgba(18,18,18,.92),0 1rem 2rem rgba(0,0,0,.24); }.monthly-pie span { max-width:7rem; color:var(--cream); font-family:'Iowan Old Style','Palatino Linotype',Georgia,serif; font-size:1.15rem; font-weight:700; text-align:center; }.monthly-pie-legend { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.4rem .8rem; }.monthly-pie-legend div { display:grid; grid-template-columns:.55rem 1fr auto; align-items:center; gap:.4rem; border-bottom:1px solid rgba(212,175,79,.1); padding:.35rem 0; }.monthly-pie-legend i { width:.48rem; height:.48rem; border-radius:50%; }.monthly-pie-legend span { color:var(--muted); font-size:.7rem; }.monthly-pie-legend strong { color:var(--cream); font-size:.7rem; }
.monthly-pie-card { overflow:hidden; background:linear-gradient(160deg,#2a261c,#151515 62%,#221d13); }.monthly-pie-card .report-card-heading { align-items:center; }.pie-header-total { display:grid; justify-items:end; gap:.12rem; }.pie-header-total small { color:var(--muted); font-size:.64rem; font-weight:700; }.monthly-pie-stage { position:relative; display:grid; min-height:17rem; place-items:center; margin-top:1rem; overflow:hidden; border:1px solid rgba(212,175,79,.14); border-radius:.65rem; background:rgba(0,0,0,.14); }.monthly-pie { position:relative; z-index:1; width:13.6rem; box-shadow:0 1rem 2rem rgba(0,0,0,.28); }.monthly-pie::before { position:absolute; z-index:1; width:58%; height:58%; border:1px solid rgba(255,241,184,.16); border-radius:50%; background:#151515; box-shadow:0 0 0 .45rem rgba(21,21,21,.82); content:''; }.monthly-pie::after { position:absolute; inset:-.55rem; border:1px solid rgba(255,232,154,.28); border-radius:50%; content:''; pointer-events:none; }.monthly-pie span { position:relative; z-index:2; display:grid; gap:.15rem; place-items:center; max-width:6.2rem; color:var(--gold-bright); font-size:1.08rem; line-height:1.05; }.monthly-pie span small { color:var(--muted); font-family:'Jost Custom',sans-serif; font-size:.62rem; font-weight:800; text-transform:uppercase; }.pie-highlight { position:absolute; z-index:2; display:grid; grid-template-columns:.45rem auto; align-items:center; column-gap:.35rem; min-width:5.2rem; border:1px solid rgba(212,175,79,.22); border-radius:.48rem; background:rgba(18,18,16,.88); box-shadow:0 .45rem 1rem rgba(0,0,0,.25); padding:.38rem .48rem; }.pie-highlight i { grid-row:1 / span 2; width:.42rem; height:.42rem; border-radius:50%; }.pie-highlight span { color:var(--cream); font-size:.66rem; font-weight:800; }.pie-highlight strong { color:var(--gold-bright); font-size:.68rem; }.pie-highlight small { position:absolute; top:.38rem; right:.45rem; color:var(--muted); font-size:.56rem; }.pie-highlight-0 { top:1rem; right:1rem; }.pie-highlight-1 { bottom:1rem; left:1rem; }.pie-highlight-2 { top:1.55rem; left:1rem; }.monthly-pie-legend { display:grid; grid-template-columns:1fr; gap:0; margin-top:.8rem; border:1px solid rgba(212,175,79,.16); border-radius:.65rem; background:rgba(0,0,0,.12); padding:.25rem .7rem; }.monthly-pie-legend div { grid-template-columns:.55rem 2.4rem 1fr auto; gap:.45rem; padding:.48rem 0; }.monthly-pie-legend small { color:var(--muted); font-size:.63rem; }.monthly-pie-legend strong { color:var(--cream); font-size:.72rem; }
@media (max-width:45rem) { .monthly-pie-stage { min-height:15.7rem; }.monthly-pie { width:11.75rem; }.pie-highlight { transform:scale(.88); }.pie-highlight-0 { top:.25rem; right:.05rem; transform-origin:top right; }.pie-highlight-1 { bottom:.15rem; left:.05rem; transform-origin:bottom left; }.pie-highlight-2 { top:.55rem; left:.05rem; transform-origin:top left; }.monthly-pie-legend div { grid-template-columns:.48rem 2.1rem 1fr auto; gap:.3rem; }.monthly-pie-legend strong { font-size:.66rem; } }
@media (max-width:45rem) { .report-controls { align-items:flex-start; flex-direction:column; }.report-controls .view-tabs { width:100%; }.report-controls .view-tab { flex:1; }.report-metrics { grid-template-columns:1fr; }.profit-card,.report-metric { min-height:0; grid-template-columns:1fr auto; align-items:center; }.profit-card small,.report-metric small { grid-column:1/-1; }.payment-grid { grid-template-columns:1fr; }.report-details { grid-template-columns:1fr; }.trend-grid { grid-template-columns:1fr; } }
.services-panel { padding:clamp(1rem,3vw,1.6rem); }.special-service-setting { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:.8rem; border:1px solid rgba(212,175,79,.2); border-radius:.75rem; background:rgba(212,175,79,.07); padding:.75rem .85rem; }.special-service-setting strong,.special-service-setting small { display:block; }.special-service-setting strong { color:var(--gold-bright); font-size:.83rem; }.special-service-setting small { max-width:32rem; margin-top:.18rem; color:var(--muted); font-size:.69rem; }.special-service-setting b { color:var(--gold-bright); margin-left:.35rem; }.services-list { display:grid; gap:.5rem; }.service-card { display:grid; grid-template-columns:2.4rem minmax(0,1fr) auto auto auto; align-items:center; gap:.75rem; border:1px solid rgba(212,175,79,.13); border-radius:.75rem; background:rgba(255,255,255,.018); padding:.75rem; }.service-mark { display:grid; width:2.1rem; height:2.1rem; place-items:center; border-radius:.6rem; background:rgba(212,175,79,.13); color:var(--gold-bright); }.service-info { min-width:0; }.service-info strong,.service-info small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.service-info strong { color:var(--cream); font-size:.84rem; }.service-info strong em { display:inline-block; border:1px solid rgba(212,175,79,.28); border-radius:999px; color:var(--gold-bright); margin-left:.35rem; padding:.1rem .3rem; font-size:.55rem; font-style:normal; vertical-align:middle; }.service-info small { margin-top:.22rem; color:var(--muted); font-size:.67rem; }.service-price { display:grid; justify-items:end; }.service-price strong { color:var(--gold-bright); font-family:'Iowan Old Style','Palatino Linotype',Georgia,serif; font-size:1.1rem; }.service-price small { color:var(--muted); font-size:.6rem; }.service-delete { width:2rem; height:2rem; border:1px solid rgba(255,125,110,.28); border-radius:.5rem; background:transparent; color:#ffb3a9; font-size:1.05rem; }.duration-options { display:grid; gap:.5rem; color:var(--gold); font-size:.72rem; font-weight:800; }.duration-options>div { display:flex; flex-wrap:wrap; gap:.35rem; }.duration-options button { border:1px solid rgba(212,175,79,.2); border-radius:999px; background:rgba(255,255,255,.03); color:var(--cream); padding:.3rem .55rem; font-size:.68rem; }.boost-row { display:flex; align-items:center; justify-content:space-between; gap:1rem; border:1px solid rgba(212,175,79,.15); border-radius:.7rem; background:rgba(255,255,255,.025); padding:.75rem; }.boost-row span { display:grid; gap:.2rem; }.boost-row small { color:var(--muted); font-size:.68rem; }.boost-row input { width:1.1rem; height:1.1rem; accent-color:var(--gold); }
@media (max-width:45rem) { .special-service-setting { align-items:flex-start; flex-direction:column; }.special-service-setting .outline { width:100%; }.service-card { grid-template-columns:2.25rem minmax(0,1fr) auto; gap:.55rem; }.service-price { grid-column:2; justify-items:start; }.service-card .outline { grid-column:3; grid-row:1 / span 2; }.service-delete { grid-column:3; }.service-info small { white-space:normal; } }
.service-card.low-stock { border-left:2px solid #ffbd52; background:linear-gradient(90deg,rgba(255,173,65,.1),rgba(255,255,255,.018)); }.service-card.low-stock .service-info strong em { border-color:rgba(255,189,82,.42); color:#ffd896; }
.operations-panel { padding:clamp(1rem,3vw,1.6rem); }.reactivation-metrics { display:grid; grid-template-columns:repeat(2,1fr); gap:.55rem; margin-bottom:.8rem; }.reactivation-metrics article { display:flex; align-items:baseline; justify-content:space-between; border:1px solid rgba(212,175,79,.15); border-radius:.7rem; background:rgba(212,175,79,.06); padding:.7rem; }.reactivation-metrics span { color:var(--muted); font-size:.67rem; }.reactivation-metrics strong { color:var(--gold-bright); font-family:'Iowan Old Style','Palatino Linotype',Georgia,serif; font-size:1.45rem; }.operation-list { display:grid; gap:.55rem; margin-top:.8rem; }.operation-card { display:flex; align-items:center; justify-content:space-between; gap:1rem; border:1px solid rgba(212,175,79,.13); border-radius:.75rem; background:rgba(255,255,255,.018); padding:.8rem; }.operation-card strong,.operation-card small { display:block; }.operation-card strong { color:var(--cream); font-size:.85rem; }.operation-card small { margin-top:.2rem; color:var(--muted); font-size:.68rem; }.operation-card>div:last-child { display:flex; gap:.4rem; }.compact { min-height:2.2rem; }.sync-preview { display:grid; gap:.8rem; }.sync-flow { display:grid; grid-template-columns:1fr auto 1fr auto 1fr; align-items:center; gap:.55rem; padding:.9rem; border:1px solid rgba(212,175,79,.22); border-radius:.85rem; background:rgba(212,175,79,.07); }.sync-node { min-width:0; padding:.7rem; border-radius:.65rem; background:rgba(12,11,8,.45); border:1px solid rgba(255,255,255,.08); }.sync-node strong,.sync-node small { display:block; }.sync-node strong { color:var(--cream); }.sync-node small { color:var(--muted); margin-top:.2rem; font-size:.65rem; }.sync-arrow { color:var(--gold-bright); font-size:1.15rem; }.sync-status-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.55rem; }.sync-status-grid article { padding:.75rem; border:1px solid rgba(212,175,79,.13); border-radius:.7rem; background:rgba(255,255,255,.018); }.sync-status-grid span,.sync-status-grid small { display:block; color:var(--muted); font-size:.65rem; }.sync-status-grid strong { display:block; margin:.3rem 0 .12rem; color:var(--gold-bright); font-family:'Iowan Old Style','Palatino Linotype',Georgia,serif; font-size:1.35rem; } @media (max-width:700px){.sync-flow{grid-template-columns:1fr;}.sync-arrow{transform:rotate(90deg);justify-self:center}.sync-status-grid{grid-template-columns:1fr}}
@media (max-width:45rem) { .reactivation-metrics { grid-template-columns:1fr; }.operation-card { align-items:flex-start; flex-direction:column; }.operation-card>div:last-child { width:100%; }.operation-card>div:last-child button { flex:1; } }
@media (max-width:45rem) { .shell { width:min(100% - 1.2rem,76rem); padding:.6rem 0 2rem; }.auth-view { min-height:42rem; border-radius:1.2rem; padding:2rem 1.45rem; background-position:63% center; }.auth-view::after { inset:.65rem; border-radius:.8rem; }.auth-view .brand-mark { margin-bottom:1.7rem; } h1 { font-size:clamp(2.55rem,13vw,4rem); }.auth-view .panel { width:100%; margin-top:1.5rem; }.metrics { grid-template-columns:1fr; }.metric { min-height:5.8rem; }.metric strong { margin-top:.55rem; font-size:1.9rem; }.onboarding .form-stack { grid-template-columns:1fr; }.onboarding .primary { width:100%; }.topbar { align-items:flex-start; }.topbar .outline { min-height:2.55rem; padding:.5rem .7rem; }.today-label { display:none; }.timeline-track { padding:.45rem .55rem; }.timeline-track::before { left:3.7rem; }.timeline-appointment { grid-template-columns:2.55rem .65rem 1fr; }.timeline-card { padding:.6rem; }.timeline-card-top { align-items:flex-start; }.status { white-space:nowrap; } }

.role-picker { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.55rem; margin:0; padding:0; border:0; }.role-picker legend { grid-column:1 / -1; margin-bottom:.1rem; color:var(--gold); font-size:.75rem; font-weight:800; }.role-option { display:grid; gap:.45rem; min-height:5.8rem; padding:.7rem; border:1px solid rgba(212,175,79,.16); border-radius:.8rem; background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012)); cursor:pointer; }.role-option.active { border-color:rgba(212,175,79,.56); background:linear-gradient(145deg,rgba(212,175,79,.16),rgba(212,175,79,.055)); box-shadow:0 .45rem 1.2rem rgba(0,0,0,.14); }.role-option input { appearance:none; width:.55rem; height:.55rem; margin:0; border:1px solid rgba(212,175,79,.55); border-radius:50%; background:transparent; }.role-option.active input { border:3px solid var(--gold-bright); }.role-option span { display:grid; gap:.2rem; }.role-option strong { color:var(--cream); font-size:.77rem; }.role-option small,.role-note { color:var(--muted); font-size:.65rem; line-height:1.32; }.owner-sign-up-fields { display:grid; gap:.7rem; } @media (max-width:45rem) { .role-picker { grid-template-columns:1fr; }.role-option { min-height:0; grid-template-columns:auto minmax(0,1fr); align-items:start; }.role-option span { gap:.12rem; } }

.dashboard.panel-enter .topbar { animation:adminPanelReveal 460ms cubic-bezier(.18,.88,.22,1) both; }.dashboard.panel-enter .metrics { animation:adminPanelReveal 520ms 70ms cubic-bezier(.18,.88,.22,1) both; }.dashboard.panel-enter .panel:not(.hidden) { animation:adminPanelReveal 620ms 130ms cubic-bezier(.18,.88,.22,1) both; } @keyframes adminPanelReveal { from { opacity:0; transform:translateY(16px) scale(.985); filter:blur(3px); } to { opacity:1; transform:translateY(0) scale(1); filter:blur(0); } } @media (prefers-reduced-motion:reduce) { .dashboard.panel-enter .topbar,.dashboard.panel-enter .metrics,.dashboard.panel-enter .panel:not(.hidden) { animation:none; } }

/* En teléfono la semana se lee como agenda compacta, no como tabla de escritorio. */
@media (max-width:45rem) {
  .week-agenda { grid-template-columns:repeat(2,minmax(0,1fr)); overflow:visible; gap:.5rem; }
  .week-day { min-width:0; min-height:8rem; padding:.55rem; }
  .week-day .appointment-card { overflow:hidden; }
  .week-day .appointment-info strong,.week-day .appointment-info small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .empty-report { margin:.8rem 0 0; color:var(--muted); font-size:.75rem; line-height:1.45; }
}
@media (max-width:23rem) { .week-agenda { grid-template-columns:1fr; } }
@media (max-width:45rem) { .auth-view input,.auth-view select,.auth-view textarea { font-size:16px; } }

/* A notification opens its appointment in context, without obscuring it in a dialog. */
.appointment-card.is-highlighted .appointment-info { border-color:#ffe5a0; background:linear-gradient(90deg,rgba(255,213,111,.3),rgba(255,255,255,.07)); box-shadow:0 0 0 3px rgba(255,211,103,.2),0 .55rem 1.4rem rgba(0,0,0,.24); animation:appointment-focus 1.15s ease-in-out 3; }
.appointment-card.is-highlighted .appointment-dot { background:#ffe5a0; box-shadow:0 0 0 4px rgba(255,211,103,.25); }
@keyframes appointment-focus { 50% { transform:translateX(3px); filter:brightness(1.16); } }

/* Navegación inspirada en la claridad de una red social: iconos primero, módulos agrupados. */
.topbar { position:sticky; z-index:12; top:.65rem; grid-template-columns:minmax(12rem,1fr) auto auto; backdrop-filter:blur(18px); }
.header-nav { gap:.28rem; padding:.28rem; }
.header-nav-item { position:relative; min-width:4.45rem; justify-content:center; gap:.42rem; padding:.48rem .62rem; }
.header-nav-icon { display:grid; width:1.35rem; height:1.35rem; place-items:center; border-radius:.42rem; background:rgba(212,175,79,.1); color:var(--gold-bright); font-size:.78rem; transition:background .18s,transform .18s; }
.header-nav-item:hover .header-nav-icon,.header-nav-item.active .header-nav-icon { background:rgba(212,175,79,.24); transform:translateY(-1px); }
.side-menu { padding:.9rem .7rem; }
.side-menu .nav-group { gap:.18rem; margin-top:.85rem; padding:.7rem 0 0; }
.side-menu .nav-group p { margin-left:.72rem; }
.side-menu .nav-child { min-height:2.45rem; padding:.52rem .68rem; }
.side-menu .nav-child>span { width:1.5rem; height:1.5rem; border-radius:.42rem; background:rgba(212,175,79,.09); font-size:.73rem; }
.side-menu .nav-child:hover>span,.side-menu .nav-child.active>span { background:rgba(212,175,79,.22); }
.metrics { position:relative; }
@media (max-width:45rem) { .topbar { top:.35rem; }.header-nav { gap:.12rem; }.header-nav-item { min-width:0; min-height:3.1rem; flex-direction:column; gap:.13rem; padding:.35rem .2rem; }.header-nav-icon { display:grid !important; width:1.2rem; height:1.2rem; font-size:.68rem; }.header-nav-item>span:last-child { font-size:.6rem; }.header-nav-item .nav-badge { top:.12rem; right:calc(50% - 1.05rem); }.side-menu .nav-child>span { display:grid; } }

@media (max-width:45rem) { .topbar .header-nav-item { min-height:3.1rem; flex-direction:column; gap:.13rem; padding:.35rem .2rem; }.topbar .header-nav-icon { display:grid !important; width:1.2rem; height:1.2rem; font-size:.68rem; }.topbar .header-nav-item>span:last-child { font-size:.6rem; } }

.business-monogram { overflow:hidden; }
.business-monogram img { width:100%; height:100%; object-fit:cover; }
.team-avatar { overflow:hidden; border-radius:50%; font-family:'Iowan Old Style',Georgia,serif; font-size:.67rem; font-weight:900; }
.team-avatar img { width:100%; height:100%; object-fit:cover; }

/* Referencia de organización: entrada dividida y escritorio de tres zonas, sin perder la identidad Blum. */
@media (min-width:64rem) {
  .auth-view { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(22rem,.78fr); grid-template-rows:auto auto auto auto auto; align-items:start; min-height:42rem; padding:clamp(2rem,5vw,4.6rem); background:linear-gradient(90deg,rgba(10,10,9,.98) 0%,rgba(10,10,9,.9) 48%,rgba(13,13,12,.38) 100%),url('assets/studio-hero.jpeg') center/cover; }
  .auth-view>.eyebrow,.auth-view>h1,.auth-view>.intro { grid-column:1; max-width:25rem; }
  .auth-view>.eyebrow { align-self:end; margin-top:8rem; }.auth-view>h1 { font-size:clamp(3rem,5vw,4.8rem); }.auth-view>.intro { font-size:1rem; }
  .auth-view>.panel { grid-column:2; grid-row:1 / span 3; align-self:center; width:100%; margin:0; border-color:rgba(255,229,165,.26); background:rgba(20,20,18,.88); box-shadow:0 1.5rem 4rem rgba(0,0,0,.38); }
  .auth-view>.text-button { grid-column:2; justify-self:center; padding:.85rem 0 0; }.auth-view>.panel + .text-button { grid-row:4; }.auth-view>.panel + .text-button + .text-button { grid-row:5; }
  .app-layout { display:grid; grid-template-columns:13.75rem minmax(0,1fr) 15.5rem; align-items:start; gap:1rem; }
  .side-menu { position:sticky; z-index:1; top:5.65rem; width:auto; min-height:0; max-height:calc(100vh - 6.5rem); border:1px solid rgba(212,175,79,.14); border-radius:1rem; background:linear-gradient(160deg,rgba(31,30,26,.93),rgba(13,13,13,.96)); box-shadow:0 .8rem 2rem rgba(0,0,0,.14); padding:.72rem; transform:none; }
  .side-menu-heading { display:none; }.menu-backdrop { display:none; }.menu-toggle { display:none; }
  .side-menu .nav-group:first-child { margin-top:0; padding-top:0; border-top:0; }
  .dashboard-rail { position:sticky; top:5.65rem; display:grid; gap:.8rem; }
}
.dashboard-rail { display:none; }.rail-card { border:1px solid rgba(212,175,79,.14); border-radius:.9rem; background:linear-gradient(150deg,rgba(38,35,26,.76),rgba(19,19,18,.94)); box-shadow:0 .7rem 1.8rem rgba(0,0,0,.14); padding:.85rem; }.rail-heading { display:flex; align-items:center; gap:.55rem; padding-bottom:.7rem; border-bottom:1px solid rgba(212,175,79,.12); }.rail-heading p { margin:0 0 .08rem; color:var(--muted); font-size:.55rem; font-weight:800; letter-spacing:.12em; }.rail-heading h2 { margin:0; font-size:.92rem; }.rail-icon { display:grid; width:2rem; height:2rem; place-items:center; border-radius:.62rem; background:rgba(212,175,79,.14); color:var(--gold-bright); font-size:.82rem; }.rail-icon-alert { color:#ffc9c1; }.rail-list { display:grid; }.rail-row { display:grid; grid-template-columns:2.75rem minmax(0,1fr); width:100%; align-items:center; gap:.3rem; border:0; border-bottom:1px solid rgba(212,175,79,.09); background:transparent; color:var(--cream); padding:.65rem .1rem; text-align:left; }.rail-row:hover { color:var(--gold-bright); }.rail-row time { color:var(--gold); font-size:.66rem; font-weight:800; }.rail-row strong,.rail-row small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.rail-row strong { font-size:.7rem; }.rail-row small { margin-top:.12rem; color:var(--muted); font-size:.6rem; }.rail-alert-row { grid-template-columns:1.5rem minmax(0,1fr); }.rail-dot { display:grid; width:1.15rem; height:1.15rem; place-items:center; border-radius:50%; background:rgba(212,175,79,.15); color:var(--gold-bright); font-size:.56rem; }.rail-alert-row.is-new .rail-dot { background:rgba(255,201,154,.22); color:#ffd2a0; }.rail-empty { margin:.8rem 0; color:var(--muted); font-size:.67rem; }.rail-link { display:flex; width:100%; align-items:center; justify-content:space-between; border:0; background:transparent; color:var(--gold-bright); padding:.75rem .1rem .05rem; font-size:.66rem; font-weight:800; text-align:left; }
@media (min-width:64rem) { .dashboard-rail { display:grid; } }
.module-search,.sales-toolbar { display:flex; align-items:end; gap:.8rem; margin:-.25rem 0 1rem; }.module-search { width:min(100%,24rem); }.module-search input { min-height:2.55rem; }.sales-toolbar { justify-content:space-between; border-bottom:1px solid rgba(212,175,79,.12); padding-bottom:.8rem; }.sales-toolbar label { width:min(100%,13rem); font-size:.68rem; }.sales-toolbar select { min-height:2.45rem; padding:.5rem .6rem; }.sales-toolbar .intro { margin:0; font-size:.72rem; }.record-history { display:grid; gap:.45rem; margin-top:1.25rem; }.record-history h3 { margin:0 0 .15rem; font-family:'Iowan Old Style','Palatino Linotype',Georgia,serif; font-size:1.05rem; }.record-history-row { display:grid; gap:.16rem; border-left:2px solid var(--gold); background:rgba(212,175,79,.07); padding:.55rem .65rem; }.record-history-row span { color:var(--cream); font-size:.74rem; font-weight:750; }.record-history-row small { color:var(--muted); font-size:.66rem; } @media (max-width:45rem) { .module-search,.sales-toolbar { align-items:stretch; flex-direction:column; }.module-search,.sales-toolbar label { width:100%; }.sales-toolbar .intro { align-self:flex-start; } }
.profile-panel { padding:clamp(1rem,3vw,1.6rem); }.profile-layout { display:grid; grid-template-columns:minmax(14rem,.7fr) minmax(18rem,1fr) minmax(12rem,.65fr); align-items:start; gap:1rem; }.profile-summary,.profile-membership { border:1px solid rgba(212,175,79,.15); border-radius:.9rem; background:linear-gradient(145deg,rgba(212,175,79,.1),rgba(255,255,255,.018)); padding:1rem; }.profile-summary { display:flex; align-items:center; gap:.8rem; }.profile-avatar { display:grid; width:4.4rem; height:4.4rem; flex:0 0 auto; place-items:center; overflow:hidden; border:2px solid var(--gold-bright); border-radius:50%; background:linear-gradient(135deg,#f2d27b,#84601c); color:#211908; font-family:'Iowan Old Style',Georgia,serif; font-size:1.25rem; font-weight:900; }.profile-avatar img { width:100%; height:100%; object-fit:cover; }.profile-summary strong,.profile-summary small { display:block; }.profile-summary strong { color:var(--cream); font-size:1rem; }.profile-summary small { margin-top:.18rem; color:var(--muted); font-size:.68rem; }.profile-form { border:1px solid rgba(212,175,79,.15); border-radius:.9rem; background:rgba(0,0,0,.13); padding:1rem; }.profile-form label small { color:var(--muted); font-size:.62rem; font-weight:500; line-height:1.35; }.profile-form input[type=file] { padding:.55rem; font-size:.68rem; }.profile-membership { display:grid; gap:.5rem; }.profile-membership article { display:grid; gap:.12rem; border-bottom:1px solid rgba(212,175,79,.1); padding:.45rem 0; }.profile-membership article:last-child { border:0; }.profile-membership strong { color:var(--cream); font-size:.76rem; }.profile-membership small { color:var(--gold-bright); font-size:.63rem; } @media (max-width:58rem) { .profile-layout { grid-template-columns:1fr; }.profile-summary { max-width:26rem; } }

/* Keep the workspace controls visually distinct from the public-site navigation. */
.topbar .header-nav { order:0; width:auto; border:1px solid rgba(212,175,79,.16); border-radius:.75rem; background:rgba(0,0,0,.18); padding:.2rem; }.topbar .header-nav-item { flex:0 0 auto; min-height:2.25rem; border:0; border-radius:.55rem; background:transparent; padding:.45rem .55rem; font-size:.7rem; }.topbar .header-nav-item:hover,.topbar .header-nav-item.active { background:rgba(212,175,79,.15); color:var(--gold-bright); }
@media (max-width:45rem) { .topbar { grid-template-columns:1fr auto; gap:.65rem; padding:.75rem; }.topbar .header-nav { grid-column:1/-1; order:3; width:100%; justify-content:space-between; border-top:0; padding:.2rem; }.topbar .header-nav-item { flex:1; justify-content:center; padding:.48rem .24rem; font-size:.65rem; }.topbar .header-nav-icon { display:none; }.topbar h1 { max-width:13rem; font-size:1.32rem; }.sign-out-button { padding:.4rem .5rem; } }

@media (max-width:45rem) { .topbar .header-nav-item { min-height:3.1rem; flex-direction:column; gap:.13rem; padding:.35rem .2rem; }.topbar .header-nav-icon { display:grid !important; width:1.2rem; height:1.2rem; font-size:.68rem; }.topbar .header-nav-item>span:last-child { font-size:.6rem; } }