/* Beauty Staff 3.1 — premium operations visual system. Purely presentational. */
:root{--bg:#f7f5f0;--ink:#22201d;--muted:#79736b;--line:#e9e5dd;--champagne:#b59b6a;--champagne-soft:#f2eadb}
body{background:var(--bg);color:var(--ink);font-family:Inter,"Segoe UI",Arial,sans-serif;font-size:14px}
.sidebar{background:#181818;padding:25px 15px;border-right:1px solid #333}
.sidebrand{gap:5px;margin-bottom:25px}
.brand-logo-white{width:142px;height:114px;border-radius:3px;object-fit:contain;background:#fff;padding:6px}
.sidebrand strong{font-size:12px;letter-spacing:2.3px;margin-top:8px}
.sidebrand small{color:#b59b6a;letter-spacing:2px}
.sideitems{gap:4px}
.sideitems button{font-weight:500;letter-spacing:.1px;font-size:13px;padding:12px 14px;border-radius:7px}
.sideitems button.active{background:#3c352a;color:#f4dba9;border-left:2px solid #c5a874}
.sideitems button:hover{background:#292724}
.sidebottom{color:#bdb5a6;border-color:#353535}
.topbar{height:76px;border-bottom:1px solid #ece7df}
.maincontent{max-width:1640px;padding:26px 32px 65px}
.page-title{font-size:31px;letter-spacing:-1.1px;font-weight:700}
.page-subtitle{color:#898279}
.panel,.summary-card{background:#fff;border:1px solid #ebe6dd;border-radius:12px;box-shadow:0 5px 18px #3b2b1010}
.panel{padding:25px}
.panel h2{font-size:18px;letter-spacing:-.35px}
.panel h3{font-size:15px}
.summary{gap:14px}
.summary-card{min-height:120px;padding:19px 18px}
.summary-card>span{background:var(--champagne-soft);color:#806a45;border-radius:9px;width:46px;height:46px}
.summary-card b{font-size:27px;letter-spacing:-.9px;font-variant-numeric:tabular-nums}
.summary-card small{color:#837b70}
button{background:#232220;border-radius:7px;font-weight:600;transition:background .15s ease,transform .15s ease}
button:hover{background:#514733}
button.secondary{border:1px solid #ded8ce;background:#fff;color:#282521}
button.secondary:hover{background:#f7f3ec}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #b59b6a;outline-offset:2px}
input,select,textarea{border:1px solid #dedbd5;border-radius:7px;padding:12px}
label{font-size:12px;color:#544d45}
.period-toolbar{color:#736e65}
.progress{height:7px;background:#efeae0}
.progress>div{background:#b59b6a}
.minirow,.item{border-bottom:1px solid #f0ece5}
.minirow:last-child,.item:last-child{border-bottom:0}
.avatar{border:2px solid #e8e1d3}
.calday{background:#f5f2ec;border:1px solid #ece7df;color:#2b2925}
.calday.has{background:#e5eee6;border-color:#d2e2d5;color:#326242}
.qr-preview{border-color:#e7e0d5}
#msg{color:#605444}
.v31-hero{min-height:160px;margin:0 0 22px;padding:28px 34px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(105deg,#1c1b19 0%,#292722 70%,#665743 100%);border-radius:12px;color:#fff;overflow:hidden}
.v31-hero h2{font-size:27px;line-height:1.18;margin:9px 0 9px;letter-spacing:-.7px;font-weight:650}
.v31-hero p{font-size:13px;color:#d8d0c2;margin:0}
.v31-eyebrow{font-size:10px;letter-spacing:2.5px;color:#d3bb8e;font-weight:700}
.v31-hero-mark{font-size:100px;letter-spacing:-12px;font-weight:800;color:#e7d5b12b;line-height:1}
.login-mode{background:#f7f5f0}
.login-card{box-shadow:0 15px 50px #271d1012;border-radius:16px}
.login-logo img{width:210px;max-height:175px}
.login-card form button{background:#252320}
@media(max-width:1100px){.maincontent{padding:22px 20px 45px}}
@media(max-width:700px){
 body{padding-top:75px;padding-bottom:68px}
 .topbar{height:74px;background:#fff;padding:8px 12px}
 .mobile-brand{width:128px;height:62px;object-fit:contain}
 .menu-toggle{font-size:25px}
 .maincontent{padding:18px 14px 35px}
 .page-title{font-size:26px}
 .panel{padding:17px}
 .summary-card{padding:12px 10px;min-height:98px}
 .summary-card b{font-size:22px}
 .summary-card>span{width:33px;height:33px}
 .v31-hero{min-height:142px;padding:20px;margin-bottom:15px}
 .v31-hero h2{font-size:20px}
 .v31-hero p{font-size:11px}
 .v31-hero-mark{font-size:65px;letter-spacing:-8px}
 .sidebar{padding:22px 14px 30px}
 .sidebrand{margin-bottom:20px}
 .sideitems button{padding:13px 14px}
 .v31-bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:999;display:flex;background:#fff;border-top:1px solid #e8e3da;padding:7px 4px max(7px,env(safe-area-inset-bottom));justify-content:space-around}
 .v31-bottom-nav button{flex:1;min-width:0;background:transparent;color:#766f64;padding:6px 2px;font-size:10px;font-weight:600;display:flex;align-items:center;flex-direction:column;gap:4px;border-radius:6px}
 .v31-bottom-nav button.active{color:#967342;background:#f7f1e7}
 .v31-bottom-nav .nav-icon{font-size:20px;line-height:1}
 .login-mode .v31-bottom-nav{display:none}
}
@media(min-width:701px){.v31-bottom-nav{display:none}}

.v31-card-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:15px 0;border-bottom:1px solid #eee8df}
.v31-staff-id{display:flex;align-items:center;gap:12px;min-width:0}
.v31-staff-id strong{display:block;font-size:13px}
.v31-staff-id small{display:block;color:#81786b;font-size:11px;margin-top:4px}
.v31-staff-photo{width:50px;height:50px;object-fit:cover;border-radius:50%;border:1px solid #e9e1d5;flex-shrink:0}
.v31-card-actions{display:flex;gap:6px;flex-wrap:wrap}
.v31-card-actions button{padding:9px;font-size:11px}
.v31-staff-detail{display:flex;gap:20px;align-items:center;padding:20px;background:#f8f5ee;border-radius:10px;margin:12px 0}
.v31-staff-detail img{width:115px;height:115px;border-radius:12px;object-fit:cover}
@media(max-width:700px){.v31-card-row{align-items:flex-start;flex-direction:column}.v31-card-actions{width:100%}.v31-card-actions button{flex:1}}

.v32cols{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.v32cols form{display:flex;flex-direction:column;gap:12px}
.v32cols label{display:flex;flex-direction:column;gap:6px}
.v32entry{padding:12px 4px;border-bottom:1px solid #eee7dd;font-size:13px}
@media(max-width:700px){.v32cols{grid-template-columns:1fr}}
.v31-hero-mark{display:none!important}

.v321-detail{margin:18px 0 0;padding:18px;border:1px solid #e8dfd0;border-radius:12px;background:#fff}
.v321-person{display:flex;align-items:center;gap:14px}
.v321-person img{width:80px;height:80px;border-radius:12px;object-fit:cover}
.v321-person h3{margin:0 0 6px}
.v321-person small{color:#7b7368}
.v321-tabs{display:flex;flex-wrap:wrap;gap:5px;margin:16px 0}
.v321-tabs button{font-size:11px;padding:7px 10px}
.v321-tabs button.active{background:#b59b6a;color:#fff}
.v321-record{padding:8px 0;border-bottom:1px solid #eee9e1;font-size:12px}
.v321-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.v321-actions button:last-child{color:#8d342b;border-color:#e3b5ad}
@media(max-width:700px){.v321-detail{padding:12px}.v321-person img{width:64px;height:64px}}