:root { --ui-bg:#f4f7f6; --ui-panel:#fff; --ui-text:#20332d; --ui-muted:#566a61; --ui-border:#d9e3de; --ui-primary:#185a43; --ui-soft:#edf5f0; --ui-warning:#955d12; --ui-danger:#b42318; --ui-radius:12px; }
body { font-family:Inter,"Segoe UI",system-ui,sans-serif; color:var(--ui-text); background:var(--ui-bg); font-size:14px; line-height:1.55; }
#appSection,#paneCost { background:var(--ui-bg); color:var(--ui-text); --ink:var(--ui-text); --green:var(--ui-primary); --muted:var(--ui-muted); }
#appMain { padding:22px 26px 44px; }.tab-pane { min-width:0; }.tab-pane h1,.tab-pane h2,.tab-pane h3 { letter-spacing:-.3px; }.tab-pane h1 { font-size:26px; line-height:1.3; }.tab-pane p { line-height:1.6; }
#appHeader { border-bottom:1px solid var(--ui-border); box-shadow:none; }#appHeader>div { padding-left:26px; padding-right:26px; }.workspace-context { display:flex; flex-direction:column; min-width:0; }.workspace-context>small { font-size:10px; font-weight:600; color:var(--ui-muted); letter-spacing:.7px; }.workspace-context>strong { font-size:15px; font-weight:750; margin-top:3px; color:var(--ui-text); }
#appSidebar { background:#12372b; }#appSidebar nav button { font-size:12px; min-height:42px; color:#c5d7cd; }#appSidebar nav button[aria-current=page] { background:#e1efe6; color:#164931; box-shadow:inset 3px 0 #7cac8d; }#appSidebar .sidebar-subnav button.bg-amber-500 { color:#fff; background:#285c47; }.sidebar-label { color:#a4c0b0; }.sidebar-hours { color:#a4c0b0; }.sidebar-hours strong { color:#e5f0e8; }
#appSidebar nav button i { color:inherit; opacity:.9; }.tab-pane h2 i,.tab-pane h3 i { color:var(--ui-primary); }
#appMain .tab-pane>.bg-white,#appMain .tab-pane .schedule-panel,.drink-card,.cost-stat,.schedule-stats>div { border-color:var(--ui-border); box-shadow:0 1px 2px #173b2a03; border-radius:var(--ui-radius); }
.cost-workspace-header,.schedule-heading { background:var(--ui-soft); border:1px solid #d9e9de; border-radius:14px; padding:18px 22px; }.cost-workspace-header h1,.schedule-heading h1 { font-size:26px; font-weight:780; margin:5px 0; }.schedule-eyebrow,.cost-eyebrow { color:#4d7160; font-size:10px; letter-spacing:1px; }.schedule-heading p,.cost-workspace-header p,.schedule-help,.cost-help,.cost-muted { color:var(--ui-muted); font-size:12px; }
.cost-summary,.schedule-stats { gap:10px; }.cost-stat,.schedule-stats>div { padding:13px 16px; }.cost-stat span,.schedule-stats span { color:var(--ui-muted); font-size:11px; }.cost-stat strong,.schedule-stats strong { color:var(--ui-text); font-size:22px; font-weight:760; }.cost-stat:hover { border-color:#8cb89c; background:#fcfefc; }.schedule-stats small { font-size:11px; color:var(--ui-muted); }
#appMain button[class*="bg-amber-600"],#appMain button[class*="bg-amber-500"],.cost-primary,.schedule-primary { background:var(--ui-primary); border-color:var(--ui-primary); color:#fff; box-shadow:none; font-weight:700; border-radius:9px; min-height:40px; }.cost-primary:hover,.schedule-primary:hover,#appMain button[class*="bg-amber-600"]:hover { background:#124732; }
.schedule-secondary,.cost-card-actions button { border:1px solid var(--ui-border); background:#fff; color:var(--ui-primary); font-weight:650; border-radius:8px; }.cost-card-actions .cost-delete { color:var(--ui-danger); border-color:#efd4cf; }.cost-link,.filter-reset { color:#185a43; }.schedule-lock-badge { color:#265d3f; background:#eaf5ee; border-color:#c8dfd0; }.schedule-lock-badge.locked { color:var(--ui-warning); background:#fff6e8; border-color:#eddbb9; }
.view-filters { display:flex; flex-wrap:wrap; align-items:flex-end; gap:10px 12px; padding:13px 15px; margin:10px 0 14px; background:#f8faf9; border:1px solid var(--ui-border); border-radius:10px; }.view-filters>label { display:flex; flex-direction:column; gap:5px; color:#4f665a; font-size:11px; font-weight:650; min-width:140px; flex:1; }.view-filters>label.filter-search { flex:2; min-width:200px; }.view-filters input,.view-filters select { width:100%; min-height:39px; padding:8px 10px; border:1px solid #cfdbd4; border-radius:7px; color:var(--ui-text); background:white; font-size:12px; font-weight:450; }.filter-meta { display:flex; align-items:center; gap:12px; justify-content:space-between; flex:1 0 100%; border-top:1px solid #e4ebe7; padding-top:9px; margin-top:3px; font-size:11px; color:var(--ui-muted); }.filter-reset { background:none; border:0; padding:3px; font-size:11px; font-weight:700; text-decoration:underline; text-underline-offset:3px; min-height:27px !important; }.view-empty { text-align:center; padding:24px 16px; color:var(--ui-muted); font-size:13px; grid-column:1/-1; }.view-badge { display:inline-block; padding:4px 8px; border:1px solid #dbe4df; border-radius:6px; font-size:10px; font-weight:700; }.view-badge.success { color:#21633c; background:#edf7ef; border-color:#c9e1d0; }.view-badge.warning { color:var(--ui-warning); background:#fff6e8; border-color:#eddbb9; }.view-badge.danger { color:var(--ui-danger); background:#fff0ed; border-color:#efcec7; }
#appMain table { font-variant-numeric:tabular-nums; }#appMain table th { font-size:10px; color:#52675c; letter-spacing:.35px; background:#f2f6f3; }#appMain table td { font-size:12px; }#appMain table tbody tr:hover { background:#f7faf8; }#appMain table th,#appMain table td { border-color:#e2e9e5; }
#appMain .text-slate-400,#appMain .text-slate-500 { color:#62766a; }#appMain .text-slate-800,#appMain .text-slate-900 { color:var(--ui-text); }#appMain .text-amber-700,#appMain .text-amber-800 { color:#8a5a19; }#appMain .text-red-500,#appMain .text-red-600,.cost-loss,.schedule-error { color:var(--ui-danger); }
.cost-notice,.schedule-notice { border-radius:9px; font-size:12px; color:#42634d; background:#eff7f1; border-color:#d6e7d9; }.cost-notice-warning { color:var(--ui-warning); background:#fff7eb; border-color:#efdfc2; }.schedule-status { font-size:12px; }.schedule-status.error { color:var(--ui-danger); }
.personal-shift.selected { background:#1f6647; border-color:#1f6647; }.personal-shift.available { border-color:#cbded0; background:#f9fcfa; color:#254f37; }.personal-shift.unavailable { color:#69766e; background:#f0f3f1; border-color:#dfe6e1; }.personal-shift-top b,.personal-shift-time { font-size:12px; }.personal-shift small,.personal-shift-action { font-size:11px; }.shift-colleagues { color:#5f7067; font-size:10px; }.schedule-day-heading strong { font-size:13px; }.schedule-day-heading span { color:#5d7265; font-size:11px; }.schedule-day-total { font-size:11px; color:#4d6755; }
.roster-cell { background:#f6fbf7; border-color:#d2e2d5; border-top-color:#5f9b73; }.roster-cell.empty { background:#fdf7f3; border-color:#ead7cb; border-top-color:#ba7c56; }.roster-cell.shortage { background:#fffbf1; border-color:#ecdfbd; border-top-color:#bd913f; }.roster-cell.over { background:#fff3f0; border-color:#ebc9c0; border-top-color:#ba6251; }.roster-cell-heading strong,.roster-cell-heading span { font-size:13px; }.roster-state { color:#37724c; }.empty .roster-state,.shortage .roster-state { color:#94631f; }.over .roster-state { color:var(--ui-danger); }.roster-time,.roster-capacity { color:#5e7165; }.roster-staff li { color:#283f33; font-size:11px; border-color:#dce7df; }.roster-staff li small { color:#5d7263; font-size:9px; }.roster-edit { color:#21583a; font-size:11px; border-color:#bfd5c5; }.roster-staff li.roster-vacant { color:#88694c; }
.roster-week { grid-template-rows:auto repeat(var(--roster-rows,3),minmax(170px,auto)); }.personal-week { grid-template-columns:repeat(var(--visible-days,7),minmax(0,1fr)); }
.schedule-toolbar input,.schedule-toolbar select { border-color:#cfdbd4; font-size:12px; }.schedule-toolbar label { color:#526b5a; font-size:11px; }
body>[id$=Modal]>div,body>.schedule-modal>.schedule-dialog { border-radius:15px; }.schedule-dialog { border:1px solid var(--ui-border); }.schedule-dialog-heading h2 { font-size:22px; }.schedule-dialog .schedule-help,.roster-person small,.schedule-override { color:#556c5b; }.roster-person.is-selected { background:#edf7ef; border-color:#a7c9b3; }.roster-person strong { color:#203b2b; }
button,input,select,textarea { font-family:inherit; }button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid #73a68b; outline-offset:2px; }button:disabled { cursor:not-allowed; }#toast { z-index:90; }
.cold-whisk-example { background:#fff; border-color:var(--ui-border); border-left-color:#72a184; padding:18px 22px; }.example-copy h2 { font-size:23px; }.example-total { background:#eff6f0; border-color:#dae7dc; }.example-total strong { color:#245f3c; }.example-total>span,.example-total small { color:#55715c; }
.drink-metrics strong { font-size:21px; }.drink-metrics span,.cost-card-note { color:#5d7166; font-size:11px; }.drink-heading h3 { font-size:17px; }.drink-price { background:#edf5ef; color:#2d6441; }.cost-meter { background:#e9f0ea; }.cost-meter .meter-high { background:#b98a35; }
.drink-heading { min-height:88px; }.filter-meta { flex-wrap:wrap; }.filter-reset { min-height:34px !important; }
.filter-scope-note { flex-basis:100%; color:var(--ui-muted); font-size:10px; }
#paneUsers .view-filters { margin:14px; }#paneNorms .view-filters { margin-top:12px; }#paneUsers input,#paneUsers select { min-width:0; }
@media(min-width:1251px) { .roster-week { grid-template-columns:repeat(var(--roster-cols,7),minmax(0,1fr)); } }
@media(min-width:641px) { .roster-day { grid-row:span var(--roster-span,4); } }
@media(max-width:960px) { #appMain { padding:16px 14px 32px; }#appHeader>div { padding:0 14px; }.workspace-context { display:none; }.view-filters>label { min-width:140px; }.personal-week { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:640px) { .tab-pane h1,.schedule-heading h1,.cost-workspace-header h1 { font-size:24px; }.schedule-heading,.cost-workspace-header { padding:17px; }.view-filters { padding:11px; gap:10px; }.view-filters>label { min-width:calc(50% - 10px); }.view-filters>label.filter-search { min-width:100%; }.filter-meta { font-size:10px; }.filter-reset { font-size:11px; }.schedule-stats>div,.cost-stat { padding:12px; }.schedule-stats strong,.cost-stat strong { font-size:21px; }.personal-day { grid-template-columns:repeat(var(--visible-shifts,3),minmax(0,1fr)); }.personal-shift-top b,.personal-shift-time { font-size:11px; }.personal-shift small,.personal-shift-action { font-size:10px; }.roster-cell-heading strong,.roster-cell-heading span { font-size:11px; }.roster-time,.roster-capacity { font-size:9px; }.roster-state,.roster-edit { font-size:10px; }.roster-staff li { font-size:10px; }.schedule-table-scroll { border:1px solid #e1e8e3; border-radius:8px; }.roster-cell { grid-row:auto !important; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; transition-duration:0s !important; } }
@media(max-width:640px) { .roster-day { grid-template-columns:repeat(var(--roster-rows,3),minmax(0,1fr)); }.view-filters input,.view-filters select { min-height:42px; } }