:root {
  --ink: #182321;
  --muted: #6e7c78;
  --line: #e6ebe8;
  --paper: #ffffff;
  --canvas: #f4f7f5;
  --green: #166a52;
  --green-2: #237c62;
  --mint: #dcefe8;
  --mint-light: #eff8f4;
  --orange: #e98941;
  --orange-light: #fff0e4;
  --blue: #4e76c2;
  --blue-light: #eaf0fb;
  --purple: #7258a5;
  --purple-light: #f0ebf9;
  --red: #bd514c;
  --red-light: #fbeceb;
  --shadow: 0 18px 45px rgba(25, 53, 44, .09);
  --radius: 18px;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
  background: var(--canvas);
  color: var(--ink);
  font-family: "DM Sans", "Noto Sans TC", sans-serif;
  -webkit-font-smoothing: antialiased;
}
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }

.app-shell { display: flex; min-height: 100vh; }
.sidebar {
  width: 246px;
  min-width: 246px;
  min-height: 100vh;
  position: fixed;
  inset: 0 auto 0 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 28px 18px 20px;
  color: #eaf5f1;
  background: #123b31;
  overflow-y: auto;
  z-index: 5;
}
.brand { display: flex; align-items: center; gap: 11px; padding: 0 8px 18px; color: white; text-decoration: none; font-size: 21px; font-weight: 700; letter-spacing: -.5px; }
.brand-mark { width: 27px; height: 27px; display: flex; align-items: end; gap: 3px; padding: 5px; border-radius: 8px; background: #f1a263; }
.brand-mark i { display: block; width: 4px; border-radius: 4px; background: #123b31; }
.brand-mark i:nth-child(1) { height: 8px; }.brand-mark i:nth-child(2) { height: 15px; }.brand-mark i:nth-child(3) { height: 11px; }
.store-switcher { display: grid; grid-template-columns: 36px 1fr 26px; align-items: center; gap: 9px; margin-bottom: 5px; padding: 11px; border: 1px solid rgba(255,255,255,.11); border-radius: 13px; background: rgba(255,255,255,.055); }
.store-avatar { width: 35px; height: 35px; display: grid; place-items: center; border-radius: 10px; color: #123b31; background: #b7ded0; font-weight: 700; }
.store-switcher small, .user-card small { display: block; color: #9bbab0; font-size: 10px; margin-bottom: 2px; }
.store-switcher strong { font-size: 13px; font-weight: 600; }
.icon-button { border: 0; background: transparent; color: inherit; }
.main-nav { display: flex; flex-direction: column; gap: 4px; }
.nav-item { position: relative; display: flex; align-items: center; gap: 12px; padding: 11px 12px; border: 0; border-radius: 10px; color: #a9c2ba; background: transparent; font-size: 13px; font-weight: 500; text-align: left; transition: .2s; }
.nav-item:hover { color: white; background: rgba(255,255,255,.06); }
.nav-item.active { color: #fff; background: #205c4c; box-shadow: inset 3px 0 #f2a065; }
.nav-icon { width: 20px; font-size: 17px; text-align: center; }
.nav-badge { margin-left: auto; min-width: 19px; height: 19px; display: grid; place-items: center; border-radius: 10px; color: white; background: var(--orange); font-size: 10px; }
.sidebar-spacer { flex: 1; min-height: 12px; }
.help-card { position: relative; padding: 15px; overflow: hidden; border: 1px solid rgba(255,255,255,.1); border-radius: 14px; background: linear-gradient(145deg,#205b4d,#18483d); }
.help-card .sparkle { position: absolute; right: 12px; top: 8px; color: #efad75; font-size: 20px; }
.help-card strong { font-size: 12px; }
.help-card p { margin: 7px 0 12px; color: #aac4bb; font-size: 10px; line-height: 1.55; }
.help-card button { width: 100%; padding: 8px; border: 0; border-radius: 8px; color: #173d33; background: #bfe2d6; font-size: 11px; font-weight: 700; }
.user-card { display: grid; grid-template-columns: 34px 1fr 24px; align-items: center; gap: 9px; padding: 11px 6px 0; border-top: 1px solid rgba(255,255,255,.09); }
.user-avatar { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; color: #245346; background: #e3b88f; font-size: 11px; font-weight: 700; }
.user-card strong { font-size: 12px; }

.main-content { width: calc(100% - 246px); min-height: 100vh; margin-left: 246px; padding: 32px 38px 48px; }
.topbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 27px; }
.eyebrow { margin: 0 0 6px; color: var(--green-2); font-size: 11px; font-weight: 700; letter-spacing: 1.8px; text-transform: uppercase; }
h1 { margin: 0; font-size: 27px; letter-spacing: -.8px; }
h1 span { font-size: 22px; }
.topbar-actions { display: flex; align-items: center; gap: 10px; }
.role-control { display: flex; align-items: center; gap: 8px; padding: 7px 9px 7px 12px; border: 1px solid var(--line); border-radius: 10px; color: var(--muted); background: white; font-size: 11px; }
.role-control select { border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 12px; font-weight: 600; }
.notification-button { position: relative; width: 39px; height: 39px; border: 1px solid var(--line); border-radius: 10px; color: #53615d; background: white; font-size: 19px; }
.notification-button i { position: absolute; top: 9px; right: 10px; width: 6px; height: 6px; border: 1px solid white; border-radius: 50%; background: var(--orange); }
.primary-button, .secondary-button, .ghost-button, .danger-button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; border-radius: 10px; font-weight: 600; }
.primary-button { padding: 10px 16px; border: 0; color: white; background: var(--green); box-shadow: 0 5px 14px rgba(22,106,82,.18); font-size: 12px; }
.primary-button:hover { background: #0f5843; }
.secondary-button { padding: 9px 14px; border: 1px solid #b8d7cc; color: var(--green); background: var(--mint-light); font-size: 12px; }
.ghost-button { padding: 8px 12px; border: 1px solid var(--line); color: #4d5b57; background: white; font-size: 11px; }
.danger-button { padding: 8px 12px; border: 1px solid #efcbc8; color: var(--red); background: var(--red-light); font-size: 11px; }
.button-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.view { display: none; animation: fade .22s ease; }.view.active { display: block; }
@keyframes fade { from { opacity: .5; transform: translateY(3px); } }

.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 16px; }
.stat-card, .panel { border: 1px solid rgba(223,230,226,.9); background: var(--paper); box-shadow: 0 8px 25px rgba(38,62,54,.035); }
.stat-card { min-height: 126px; position: relative; padding: 18px; border-radius: 15px; overflow: hidden; }
.stat-card::after { content: ""; position: absolute; width: 74px; height: 74px; right: -18px; bottom: -22px; border-radius: 50%; background: var(--accent-bg, var(--mint-light)); }
.stat-top { display: flex; justify-content: space-between; align-items: center; color: var(--muted); font-size: 11px; font-weight: 600; }
.stat-icon { width: 29px; height: 29px; display: grid; place-items: center; border-radius: 9px; color: var(--accent, var(--green)); background: var(--accent-bg, var(--mint-light)); font-size: 14px; }
.stat-value { margin: 13px 0 5px; font-size: 25px; font-weight: 700; letter-spacing: -.6px; }
.stat-meta { position: relative; z-index: 1; color: #8b9793; font-size: 10px; }.stat-meta b { margin-right: 4px; color: var(--green-2); }
.layout-two { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(300px, .75fr); gap: 16px; margin-bottom: 16px; }
.panel { border-radius: var(--radius); padding: 20px; }
.panel-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 18px; }
.panel-title h2, .panel-title h3 { margin: 0; font-size: 16px; letter-spacing: -.25px; }.panel-title h3 { font-size: 14px; }
.panel-title p { margin: 5px 0 0; color: var(--muted); font-size: 10px; }
.month-nav { display: flex; align-items: center; gap: 4px; }
.month-nav button { width: 28px; height: 28px; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); background: white; }
.month-nav strong { min-width: 94px; text-align: center; font-size: 12px; }

.calendar-week, .calendar-grid { display: grid; grid-template-columns: repeat(7,1fr); }
.calendar-week span { padding: 0 0 9px; color: #94a09c; font-size: 9px; font-weight: 700; text-align: center; }
.calendar-day { min-height: 65px; position: relative; padding: 7px 5px; border: 0; border-top: 1px solid #eef1ef; color: var(--ink); background: transparent; text-align: left; }
.calendar-day:hover { background: #f8fbfa; }.calendar-day.muted { color: #b9c1be; }.calendar-day.today .day-number { color: white; background: var(--green); }
.calendar-day.selected { border-radius: 8px; background: var(--mint-light); }.calendar-day.selected::before { content:""; position:absolute; inset:0; border:1px solid #b9ddcf; border-radius:8px; }
.day-number { width: 23px; height: 23px; display: grid; place-items: center; border-radius: 50%; font-size: 10px; font-weight: 600; }
.day-load { display: flex; gap: 3px; margin-top: 8px; }.day-load i { height: 4px; flex: 1; border-radius: 3px; background: #d9e4df; }.day-load i.on { background: #6ab197; }.day-load.over i.on { background: var(--orange); }
.day-hours { display: block; margin-top: 4px; color: #8a9692; font-size: 8px; text-align: center; }

.progress-ring { --pct: 72; width: 112px; height: 112px; display: grid; place-items: center; margin: 5px auto 16px; border-radius: 50%; background: conic-gradient(var(--green) calc(var(--pct) * 1%), #e8eeeb 0); position: relative; }
.progress-ring::after { content:""; position:absolute; inset:10px; border-radius:50%; background:white; }
.progress-ring span { position: relative; z-index:1; text-align:center; font-size:22px; font-weight:700; }.progress-ring small { display:block; color:var(--muted); font-size:9px; font-weight:500; }
.metric-list { display: flex; flex-direction: column; gap: 11px; }.metric-row { display:flex; justify-content:space-between; color:var(--muted); font-size:11px; }.metric-row strong { color:var(--ink); }
.capacity-bar { height:8px; margin:15px 0 7px; overflow:hidden; border-radius:6px; background:#edf1ef; }.capacity-bar i { display:block; height:100%; border-radius:6px; background:linear-gradient(90deg,var(--green),#68af95); }
.capacity-caption { display:flex; justify-content:space-between; color:#89948f; font-size:9px; }
.alert-box { display:flex; gap:10px; margin-top:15px; padding:11px; border-radius:10px; color:#7e552f; background:var(--orange-light); font-size:10px; line-height:1.45; }.alert-box b {display:block; color:#5f3a19;}

.schedule-strip { display:grid; grid-template-columns:repeat(7,1fr); gap:9px; }
.schedule-day-card { min-height:114px; padding:12px; border:1px solid var(--line); border-radius:12px; background:#fbfcfb; }
.schedule-day-card.active { border-color:#a8d1c2; background:var(--mint-light); }.schedule-day-card header { display:flex; justify-content:space-between; align-items:center; margin-bottom:9px; }.schedule-day-card header span { color:var(--muted); font-size:9px; }.schedule-day-card header b { font-size:14px; }
.mini-avatar-row { display:flex; }.mini-avatar { width:24px;height:24px;display:grid;place-items:center;margin-right:-5px;border:2px solid white;border-radius:50%;color:white;background:var(--green);font-size:7px;font-weight:700; }.mini-avatar:nth-child(2n){background:var(--blue)}.mini-avatar:nth-child(3n){background:var(--orange)}
.schedule-day-card footer { display:flex; justify-content:space-between; margin-top:11px; color:var(--muted); font-size:8px; }.schedule-day-card footer b {color:var(--ink)}

.section-toolbar { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:16px; }.segmented { display:flex; padding:3px; border:1px solid var(--line); border-radius:10px; background:white; }.segmented button {padding:7px 13px;border:0;border-radius:7px;color:var(--muted);background:transparent;font-size:10px;font-weight:600}.segmented button.active{color:var(--green);background:var(--mint)}
.schedule-layout { display:grid; grid-template-columns:minmax(0,1fr) 315px; gap:16px; align-items:start; }
.roster-panel { padding:0; overflow:hidden; }.roster-toolbar{display:flex;justify-content:space-between;align-items:center;padding:17px 18px;border-bottom:1px solid var(--line)}
.roster-scroll { overflow:auto; max-height:620px; }.roster-table { width:100%; min-width:1120px; border-collapse:collapse; table-layout:fixed; }.roster-table th,.roster-table td{border-right:1px solid #edf1ef;border-bottom:1px solid #edf1ef}.roster-table th{position:sticky;top:0;z-index:2;padding:9px 3px;color:#82908b;background:#f8faf9;font-size:8px;font-weight:600;text-align:center}.roster-table th.weekend{color:var(--orange)}.roster-table th span{display:block;margin-top:3px;color:var(--ink);font-size:11px}.roster-table .person-cell{position:sticky;left:0;z-index:1;width:155px;padding:9px 10px;background:white;text-align:left}.person{display:flex;align-items:center;gap:8px}.person-avatar{width:28px;height:28px;display:grid;place-items:center;border-radius:8px;color:white;font-size:8px;font-weight:700}.person strong{display:block;font-size:10px}.person small{display:block;margin-top:2px;color:var(--muted);font-size:8px}.roster-table td.shift-cell{height:48px;padding:4px;text-align:center;background:white}.shift-pill{width:100%;min-height:36px;padding:5px 2px;border:0;border-radius:7px;background:var(--mint-light);color:var(--green);font-size:8px;line-height:1.2}.shift-pill b{display:block;font-size:9px}.shift-pill.closing{color:var(--blue);background:var(--blue-light)}.shift-pill.mid{color:var(--purple);background:var(--purple-light)}.shift-pill.off{color:#9ca7a3;background:#f4f6f5}.shift-pill.leave{color:var(--orange);background:var(--orange-light)}.shift-pill.overtime::after{content:'OT';display:inline-block;margin-left:2px;padding:1px 3px;border-radius:3px;color:white;background:var(--orange);font-size:6px}.roster-table tfoot td{position:sticky;bottom:0;padding:9px 4px;background:#f8faf9;font-size:8px;text-align:center;font-weight:600}.roster-table tfoot .person-cell{z-index:2;color:var(--green);font-size:9px}
.legend { display:flex;align-items:center;gap:13px;flex-wrap:wrap;color:var(--muted);font-size:9px }.legend i{width:8px;height:8px;display:inline-block;margin-right:4px;border-radius:3px}.legend .morning{background:var(--mint)}.legend .closing{background:var(--blue-light)}.legend .mid{background:var(--purple-light)}.legend .leave{background:var(--orange-light)}
.daily-panel { position:sticky;top:20px; }.date-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border-radius:8px;color:var(--green);background:var(--mint-light);font-size:9px;font-weight:600}.daily-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-bottom:15px}.daily-summary div{padding:9px 5px;border-radius:9px;background:#f7f9f8;text-align:center}.daily-summary strong{display:block;font-size:14px}.daily-summary span{color:var(--muted);font-size:8px}.daily-shifts{display:flex;flex-direction:column;gap:8px}.daily-shift{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:9px;padding:10px;border:1px solid var(--line);border-radius:10px}.daily-shift .person-avatar{border-radius:50%}.daily-shift strong{display:block;font-size:10px}.daily-shift small{color:var(--muted);font-size:8px}.shift-code{padding:4px 6px;border-radius:6px;color:var(--green);background:var(--mint-light);font-size:8px;font-weight:700}.staffing-timeline{margin-top:16px}.timeline-labels{display:flex;justify-content:space-between;color:#8e9995;font-size:7px}.timeline-bars{height:60px;display:flex;align-items:end;gap:3px;margin-top:7px;padding-bottom:5px;border-bottom:1px solid var(--line)}.timeline-bars i{flex:1;min-height:10px;border-radius:3px 3px 0 0;background:#75b49d}.timeline-bars i.low{background:var(--orange)}

.approval-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-bottom:18px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--line)}.approval-step{padding:14px;background:white}.approval-step b{display:block;font-size:11px}.approval-step span{color:var(--muted);font-size:9px}.approval-step.active{background:var(--mint-light)}.approval-step .step-num{width:22px;height:22px;display:grid;place-items:center;float:left;margin-right:8px;border-radius:50%;color:white;background:var(--green);font-size:8px}.approval-table{width:100%;border-collapse:collapse}.approval-table th{padding:10px;color:var(--muted);background:#f7f9f8;font-size:9px;text-align:left}.approval-table td{padding:13px 10px;border-bottom:1px solid var(--line);font-size:10px}.status{display:inline-flex;padding:4px 7px;border-radius:12px;font-size:8px;font-weight:700}.status.pending{color:#8a5a26;background:var(--orange-light)}.status.manager-approved{color:#405d91;background:var(--blue-light)}.status.approved{color:var(--green);background:var(--mint-light)}.status.rejected{color:var(--red);background:var(--red-light)}

.forecast-grid{display:grid;grid-template-columns:1.4fr .8fr;gap:16px}.chart{height:240px;position:relative;display:flex;align-items:end;gap:10px;padding:25px 8px 28px;border-bottom:1px solid var(--line);background:repeating-linear-gradient(to top, transparent 0,transparent 47px,#eef1ef 48px)}.chart-col{height:100%;flex:1;display:flex;align-items:end;justify-content:center;gap:3px;position:relative}.chart-bar{width:36%;min-width:8px;border-radius:4px 4px 0 0;background:#a6d1c2}.chart-bar.actual{background:var(--green)}.chart-col label{position:absolute;bottom:-19px;color:var(--muted);font-size:8px}.chart-col .chart-tip{position:absolute;top:-19px;color:var(--ink);font-size:7px;font-weight:700}.settings-list{display:flex;flex-direction:column;gap:11px}.setting-row{display:flex;justify-content:space-between;align-items:center;padding:12px;border:1px solid var(--line);border-radius:10px}.setting-row span{color:var(--muted);font-size:9px}.setting-row strong{display:block;color:var(--ink);font-size:11px}.setting-row input{width:105px;padding:7px;border:1px solid var(--line);border-radius:7px;text-align:right;font-size:10px}
.permission-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.permission-card{padding:18px;border:1px solid var(--line);border-radius:14px;background:white}.permission-card.active{border-color:#94c8b5;box-shadow:0 0 0 3px var(--mint-light)}.permission-icon{width:38px;height:38px;display:grid;place-items:center;margin-bottom:13px;border-radius:11px;background:var(--mint-light);font-size:18px}.permission-card h3{margin:0 0 4px;font-size:13px}.permission-card p{min-height:33px;margin:0 0 13px;color:var(--muted);font-size:9px;line-height:1.5}.permission-card ul{padding:0;margin:0;list-style:none}.permission-card li{padding:6px 0;border-top:1px solid #eef1ef;color:#53615d;font-size:9px}.permission-card li::before{content:'✓';margin-right:6px;color:var(--green);font-weight:700}.locked-note{display:flex;gap:10px;margin-bottom:15px;padding:11px 13px;border:1px solid #efd8ba;border-radius:10px;color:#795532;background:#fff7eb;font-size:10px}
.shift-definition-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.shift-definition{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:10px;padding:12px;border:1px solid var(--line);border-radius:11px;background:#fbfcfb}.shift-definition-code{width:36px;height:36px;display:grid;place-items:center;border-radius:9px;color:var(--green);background:var(--mint-light);font-size:11px;font-weight:800}.shift-definition-code.closing{color:var(--blue);background:var(--blue-light)}.shift-definition-code.mid{color:var(--purple);background:var(--purple-light)}.shift-definition-code.off{color:#7f8a86;background:#eef1ef}.shift-definition-code.leave{color:var(--orange);background:var(--orange-light)}.shift-definition strong{display:block;font-size:10px}.shift-definition small{display:block;margin-top:3px;color:var(--muted);font-size:8px}.shift-definition button{width:28px;height:28px;border:1px solid var(--line);border-radius:7px;color:var(--green);background:white}.form-hint{margin-top:2px;color:var(--muted);font-size:8px;line-height:1.4}
.store-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}.store-card{display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:11px;padding:14px;border:1px solid var(--line);border-radius:12px;background:#fbfcfb}.store-card.current{border-color:#8bc0ad;background:var(--mint-light);box-shadow:0 0 0 2px #e2f1ec}.store-card-avatar{width:42px;height:42px;display:grid;place-items:center;border-radius:11px;color:#174d3e;background:#bde0d3;font-size:15px;font-weight:800}.store-card strong{display:block;font-size:11px}.store-card small{display:block;margin-top:3px;color:var(--muted);font-size:8px}.store-card-actions{display:flex;gap:5px}.store-card-actions button{padding:6px 8px;border:1px solid var(--line);border-radius:7px;color:var(--green);background:white;font-size:8px}.store-status{display:inline-flex;margin-left:5px;padding:2px 5px;border-radius:8px;color:var(--green);background:var(--mint);font-size:7px}.store-switch-list{display:flex;flex-direction:column;gap:8px}.store-switch-option{width:100%;display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:10px;padding:11px;border:1px solid var(--line);border-radius:10px;background:white;text-align:left}.store-switch-option.active{border-color:#80b9a5;background:var(--mint-light)}.store-switch-option .store-card-avatar{width:34px;height:34px;border-radius:9px;font-size:11px}.store-switch-option strong{display:block;font-size:10px}.store-switch-option small{color:var(--muted);font-size:8px}.store-switch-option i{color:var(--green);font-size:14px}

.modal-backdrop{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:20px;background:rgba(10,30,24,.52);backdrop-filter:blur(4px)}.modal-backdrop[hidden]{display:none}.modal{width:min(520px,100%);max-height:90vh;overflow:auto;border-radius:18px;background:white;box-shadow:var(--shadow)}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:19px 21px;border-bottom:1px solid var(--line)}.modal-header h2{margin:0;font-size:16px}.modal-close{width:30px;height:30px;border:0;border-radius:8px;color:var(--muted);background:#f3f5f4}.modal-body{padding:20px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.form-field{display:flex;flex-direction:column;gap:6px}.form-field.full{grid-column:1/-1}.form-field label{color:#52605c;font-size:9px;font-weight:700}.form-field input,.form-field select,.form-field textarea{width:100%;padding:10px;border:1px solid #dfe5e2;border-radius:9px;outline:0;background:white;font-size:11px}.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:#7eb9a4;box-shadow:0 0 0 3px var(--mint-light)}.modal-footer{display:flex;justify-content:flex-end;gap:8px;padding:14px 20px;border-top:1px solid var(--line);background:#fafbfa}.toast{position:fixed;right:25px;bottom:25px;z-index:50;padding:12px 16px;border-radius:10px;color:white;background:#173f34;box-shadow:var(--shadow);font-size:11px;opacity:0;transform:translateY(12px);pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:none}
.empty-state{padding:35px;text-align:center;color:var(--muted);font-size:11px}.empty-state b{display:block;margin-bottom:5px;color:var(--ink);font-size:13px}
.hidden,.admin-only.hidden,.manager-only.hidden,.staff-write.hidden{display:none!important}.is-disabled{opacity:.45;pointer-events:none}

.print-choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px}.print-choice{position:relative;display:block;padding:15px;border:1px solid var(--line);border-radius:12px;background:#fbfcfb;cursor:pointer}.print-choice input{position:absolute;top:13px;right:13px;accent-color:var(--green)}.print-choice:has(input:checked){border-color:#78b39e;background:var(--mint-light);box-shadow:0 0 0 2px #e1f2ec}.print-choice-icon{width:35px;height:35px;display:grid;place-items:center;margin-bottom:10px;border-radius:9px;color:var(--green);background:var(--mint);font-size:17px}.print-choice strong{display:block;font-size:11px}.print-choice small{display:block;margin-top:4px;color:var(--muted);font-size:8px;line-height:1.45}.print-sheet{display:none;color:#111;background:white;font-family:"Noto Sans TC",Arial,sans-serif}.print-head{display:flex;justify-content:space-between;align-items:flex-end;padding-bottom:10px;border-bottom:2px solid #173f34}.print-head h1{margin:0 0 4px;font-size:20px}.print-head p,.print-meta{margin:0;color:#555;font-size:9px}.print-summary{display:flex;gap:24px;padding:10px 0}.print-summary span{font-size:9px}.print-summary b{display:block;margin-top:2px;font-size:13px}.print-table{width:100%;border-collapse:collapse;table-layout:fixed}.print-table th,.print-table td{height:24px;padding:3px 2px;border:1px solid #9ca7a3;font-size:6.5px;text-align:center}.print-table th{background:#e7efeb;font-weight:700}.print-table .print-person{width:82px;text-align:left;font-size:7px;font-weight:700}.print-table .print-weekend{background:#fff1e7}.print-table .print-off{color:#888;background:#f2f2f2}.print-table .print-total{font-weight:700;background:#edf7f3}.personal-print-table th,.personal-print-table td{height:31px;font-size:8px}.personal-print-table th:first-child{width:55px}.print-legend{display:flex;gap:12px;margin-top:9px;color:#444;font-size:7px}.print-note{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:28px}.print-sign{padding-top:20px;border-bottom:1px solid #777;color:#555;font-size:8px}.print-footer{display:flex;justify-content:space-between;margin-top:10px;color:#777;font-size:7px}

@media print{
  @page{size:A4 landscape;margin:10mm}
  body{background:white!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .app-shell,.modal-backdrop,.toast{display:none!important}
  .print-sheet{display:block!important}
}

@media(max-width:1100px){.sidebar{width:210px;min-width:210px}.main-content{width:calc(100% - 210px);margin-left:210px;padding:26px 24px}.stats-grid{grid-template-columns:repeat(2,1fr)}.schedule-strip{grid-template-columns:repeat(4,1fr)}.permission-cards{grid-template-columns:1fr}.schedule-layout{grid-template-columns:1fr}.daily-panel{position:static}.forecast-grid{grid-template-columns:1fr}.shift-definition-grid,.store-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.sidebar{position:fixed;top:auto;width:100%;min-width:0;min-height:0;height:64px;display:block;padding:8px;z-index:10}.brand,.store-switcher,.sidebar-spacer,.help-card,.user-card{display:none}.main-nav{display:grid;grid-template-columns:repeat(5,1fr);gap:2px}.nav-item{justify-content:center;flex-direction:column;gap:2px;padding:6px 2px;font-size:8px}.nav-item.active{box-shadow:inset 0 2px #f2a065}.nav-icon{font-size:15px}.nav-badge{position:absolute;top:2px;right:12px}.main-content{width:100%;margin:0;padding:20px 14px 86px}.topbar{align-items:flex-start}.topbar-actions{flex-wrap:wrap;justify-content:flex-end}.role-control span{display:none}.notification-button{display:none}.primary-button{padding:10px}.stats-grid{grid-template-columns:1fr 1fr}.layout-two,.forecast-grid{grid-template-columns:1fr}.schedule-strip{grid-template-columns:repeat(2,1fr)}.section-toolbar{align-items:flex-start;flex-direction:column}.form-grid{grid-template-columns:1fr}.form-field.full{grid-column:auto}}
@media(max-width:440px){.stats-grid{grid-template-columns:1fr}.topbar h1{font-size:21px}.role-control{max-width:135px}.role-control select{width:112px}.schedule-strip{grid-template-columns:1fr 1fr}.panel{padding:15px}.print-choice-grid,.shift-definition-grid,.store-grid{grid-template-columns:1fr}}