/* StaffCare Console — shell */
body.console-body{background:var(--page);min-height:100vh}
.c-top{position:sticky;top:0;z-index:50;height:60px;display:flex;align-items:center;gap:16px;padding:0 20px;background:var(--surface);border-bottom:1px solid var(--border)}
.c-top .brand{display:flex;align-items:center;gap:10px;width:212px;flex:none}
.c-top .brand img{height:26px}
.c-top .brand span{font-size:12px;font-weight:600;color:var(--text-muted);border-inline-start:1px solid var(--border);padding-inline-start:10px}
.c-top .search-box{width:min(380px,30vw)}
.c-top .who{display:flex;align-items:center;gap:10px;border:0;background:none;padding:4px 6px;border-radius:var(--r-lg);text-align:start}
.c-top .who:hover{background:var(--surface-3)}
.c-top .who .t-xs{line-height:1.2}
.c-shell{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:calc(100vh - 60px)}
.c-side{position:sticky;top:60px;height:calc(100vh - 60px);overflow:auto;border-inline-end:1px solid var(--border);background:var(--surface);padding:14px 12px;display:flex;flex-direction:column;gap:2px}
.c-side .grp{font-size:11px;font-weight:600;color:var(--text-faint);letter-spacing:.06em;text-transform:uppercase;padding:16px 10px 6px}
html[dir="rtl"] .c-side .grp{letter-spacing:0}
.c-side a{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--r);color:var(--gray-600);font-size:14px;font-weight:500}
.c-side a:hover{background:var(--surface-3);color:var(--text-strong)}
.c-side a.on{background:var(--sc-50);color:var(--action);font-weight:600}
.c-side a .count,.c-side a .badge{margin-inline-start:auto}
.c-side .side-foot{margin-top:auto;padding:12px 10px 4px;font-size:12px;color:var(--text-muted)}
.c-main{min-width:0;padding:28px 36px 64px}
.c-page{max-width:1240px;margin:0 auto;display:flex;flex-direction:column;gap:20px}
.page-head{display:flex;align-items:flex-start;gap:16px;flex-wrap:wrap}
.page-head .t{flex:1;min-width:240px}
.page-head h1{margin:0;font-size:24px;font-weight:700;color:var(--heading)}
.page-head p{margin:4px 0 0;color:var(--text-muted)}
.crumbs{display:flex;gap:6px;align-items:center;font-size:13px;color:var(--text-muted);margin-bottom:6px}
.crumbs a{color:var(--text-muted)} .crumbs a:hover{color:var(--action)}
.toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl)}
.panel-head{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--border)}
.panel-head .h3{flex:1}
.panel-body{padding:18px}
.sticky-bar{position:sticky;bottom:0;z-index:30;display:flex;align-items:center;gap:10px;padding:12px 18px;background:var(--surface);border-top:1px solid var(--border);border-radius:0 0 var(--r-xl) var(--r-xl);box-shadow:0 -6px 20px rgba(17,24,39,.05)}
.wizard-steps{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--text-muted);flex-wrap:wrap}
.wizard-steps .st{display:flex;align-items:center;gap:8px;white-space:nowrap}
.wizard-steps .st b{width:26px;height:26px;border-radius:50%;border:1.5px solid var(--border-strong);display:grid;place-items:center;font-size:12px}
.wizard-steps .st.done b{background:var(--navy);border-color:var(--navy);color:#fff}
.wizard-steps .st.on{color:var(--text-strong);font-weight:600}
.wizard-steps .st.on b{border-color:var(--action);color:var(--action);box-shadow:var(--focus)}
.wizard-steps .ln{flex:1;min-width:20px;height:1px;background:var(--border-strong)}
.thumb{width:44px;height:44px;flex:none}
.thumb .art{height:44px;border-radius:10px}
.thumb .art .art-icon .i{width:30px;height:30px}
.thumb .art .brand-mark,.thumb .art .disc,.thumb .art::before{display:none}
.diff-old{background:var(--red-25);color:var(--red-600);text-decoration:line-through;padding:0 4px;border-radius:4px}
.diff-new{background:var(--green-25);color:var(--green-700);padding:0 4px;border-radius:4px}
.menu-btn{display:none}
@media (max-width:1100px){
  .c-shell{grid-template-columns:72px minmax(0,1fr)}
  .c-side a span.lbl,.c-side .grp,.c-side a .count,.c-side a .badge,.c-side .side-foot,.c-side .btn span{display:none}
  .c-side a{justify-content:center}
  .c-top .brand{width:auto}
  .c-main{padding:24px}
}
@media (max-width:760px){
  .c-shell{grid-template-columns:1fr}
  .c-side{display:none;position:fixed;top:60px;inset-inline-start:0;width:260px;z-index:60;box-shadow:var(--shadow-xl)}
  body.side-open .c-side{display:flex}
  body.side-open .c-side a span.lbl,body.side-open .c-side .grp,body.side-open .c-side a .count{display:initial}
  body.side-open .c-side a{justify-content:flex-start}
  .menu-btn{display:inline-grid}
  .c-top .search-box,.c-top .brand span,.c-top .who .meta{display:none}
  .c-main{padding:16px}
  .g4,.g3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
