
:root{--ink:#202723;--muted:#7a817d;--green:#1d5c45;--line:#e7e8e5;--cream:#f5f4ef;--coral:#e97359}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input{font:inherit}button{cursor:pointer}.app-shell{min-height:100vh;display:grid;grid-template-columns:236px 1fr}.sidebar{background:#174b39;color:#fff;padding:28px 18px 22px;display:flex;flex-direction:column;min-height:100vh;position:sticky;top:0;height:100vh}.brand{display:flex;align-items:center;gap:12px;padding:0 10px 30px;font-family:Georgia,serif;font-size:25px}.brand-mark{width:34px;height:34px;display:grid;place-items:center;border:1px solid #d8b57c;color:#d8b57c;border-radius:50% 50% 45% 45%;font-size:19px}nav{display:flex;flex-direction:column;gap:6px}nav button,.sidebar-bottom>button{border:0;color:#c8d7d1;background:transparent;border-radius:9px;padding:12px 13px;text-align:left;display:flex;align-items:center;gap:12px;font-size:14px}nav button span,.sidebar-bottom>button span{width:18px;text-align:center;font-size:18px}nav button b{margin-left:auto;background:#ef775f;color:#fff;border-radius:12px;min-width:22px;padding:2px 6px;text-align:center;font-size:11px}nav button:hover,nav button.active{background:#ffffff1f;color:#fff}nav button.sub{padding-left:35px}.sidebar-bottom{margin-top:auto;border-top:1px solid #ffffff29;padding-top:12px}.profile{display:grid;grid-template-columns:38px 1fr auto;gap:10px;align-items:center;padding:18px 8px 0}.profile strong,.profile small{display:block}.profile strong{font-size:13px}.profile small{color:#aebfb8;font-size:11px;margin-top:3px}.avatar{flex:0 0 auto;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:#31564a;background:#dbeee7;font-size:11px;font-weight:700}.avatar.blue{background:#dce9f3;color:#3c607a}.avatar.orange,.avatar.peach{background:#f4dfd1;color:#8e5940}.avatar.purple{background:#e8e1f3;color:#66527e}.avatar.rose{background:#f3dfe1;color:#85545a}.workspace{padding:28px 34px 48px;min-width:0}.topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:27px;gap:20px}.topbar h1{margin:0 0 5px;font-family:Georgia,serif;font-weight:500;font-size:29px;letter-spacing:-.4px}.topbar p{margin:0;color:var(--muted);font-size:13px}.top-actions{display:flex;align-items:center;gap:9px}.search{height:40px;width:242px;border:1px solid var(--line);background:#fff;border-radius:8px;display:flex;align-items:center;padding:0 12px;gap:8px;color:#999}.search input{width:100%;border:0;outline:0;font-size:12px}.icon-button,.date-button{height:40px;border:1px solid var(--line);background:#fff;border-radius:8px;color:#555}.icon-button{width:40px;position:relative}.icon-button i{position:absolute;width:6px;height:6px;background:#ee725b;border-radius:50%;top:9px;right:9px}.date-button{padding:0 13px;display:flex;gap:8px;align-items:center;font-size:12px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:15px}.metrics article{background:#fff;border:1px solid var(--line);border-radius:11px;padding:20px 17px;display:flex;gap:13px;min-width:0}.metric-icon{width:38px;height:38px;border-radius:9px;display:grid;place-items:center;flex:0 0 auto;font-size:18px}.metric-icon.green{background:#dfede7;color:#35715c}.metric-icon.coral{background:#fae3dd;color:#d96850}.metric-icon.amber{background:#f7edd3;color:#af7e25}.metric-icon.blue{background:#e0eaf2;color:#47728c}.metrics p{font-size:12px;color:#777;margin:1px 0 7px}.metrics strong{font-family:Georgia,serif;font-size:24px;font-weight:500}.metrics strong small{font:400 11px Inter,sans-serif;color:#888}.metrics div>span{display:block;font-size:10px;margin-top:8px}.positive{color:#3f866b}.negative{color:#d56651}.muted{color:#8a8e8b}.section-grid{display:grid;grid-template-columns:minmax(0,1.38fr) minmax(320px,.78fr);gap:15px}.card{background:#fff;border:1px solid var(--line);border-radius:11px}.card-heading{padding:19px 20px 16px;display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px solid var(--line);gap:12px}.card-heading h2{font-family:Georgia,serif;font-weight:500;font-size:18px;margin:0 0 4px}.card-heading p{margin:0;color:#8b8f8c;font-size:11px}.card-heading>button{border:0;background:transparent;color:#2d7057;font-size:11px;padding:4px}.card-heading .primary{background:#245f49;color:#fff;border-radius:7px;padding:9px 13px}.shift-row{display:grid;grid-template-columns:135px 1fr;border-bottom:1px solid var(--line);min-height:112px}.shift-time{padding:22px 20px;border-right:1px solid var(--line)}.shift-time strong,.shift-time span{display:block}.shift-time strong{font-size:13px;margin-bottom:7px}.shift-time span{font-size:10px;color:#888}.people{padding:17px 20px;display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:center}.person{display:flex;align-items:center;gap:10px;min-width:0}.person strong,.person small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.person strong{font-size:11px}.person small{color:#8a8d8b;font-size:9px;margin-top:4px}.status{border-radius:999px;padding:6px 9px;font-size:9px;white-space:nowrap;width:max-content}.status.live{background:#dcefe6;color:#34735b}.status.soon{background:#f5ead0;color:#8c6a25}.status.off{background:#ededeb;color:#777}.handoff{margin:14px;background:#f4f1e8;border-radius:8px;padding:13px;display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:8px}.handoff>span{color:#ae8132}.handoff strong{font-size:11px}.handoff p{font-size:10px;color:#777;margin:4px 0 0}.handoff button{border:0;background:transparent;color:#27624c;font-size:10px}.product-list{padding:2px 18px}.product-row{display:grid;grid-template-columns:24px 1fr 80px 38px;align-items:center;gap:8px;padding:16px 0;border-bottom:1px solid #efefec}.product-row:last-child{border-bottom:0}.rank{width:22px;height:22px;border-radius:6px;background:#f3f1ec;display:grid;place-items:center;font-size:10px;color:#777}.product-info strong,.product-info small{display:block}.product-info strong{font-size:11px}.product-info small{font-size:9px;color:#949693;margin-top:4px}.score{text-align:right}.score strong{font-family:Georgia,serif;font-size:18px}.stars{font-size:9px;letter-spacing:1px;color:#d9d9d5;display:block}.stars .on{color:#e4aa43}.change{font-size:10px;color:#d36550;text-align:right}.change.up{color:#3b8667}.full-card{overflow:hidden}.table-head,.staff-row{display:grid;grid-template-columns:1.5fr .7fr .7fr .8fr .65fr;gap:20px;align-items:center;padding:14px 22px}.table-head{background:#fafaf8;color:#8a8d8b;font-size:10px;text-transform:uppercase;letter-spacing:.05em}.staff-row{border-top:1px solid var(--line);font-size:12px}.staff-row>span:not(.status){color:#626763}.reviews-layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(275px,.55fr);gap:15px}.filters{display:flex;gap:5px}.filters button{border:1px solid var(--line);background:#fff;border-radius:6px;padding:6px 9px;font-size:10px;color:#747875}.filters button.selected{background:#245f49;color:#fff;border-color:#245f49}.review-list{padding:0 20px}.review{padding:18px 0;border-bottom:1px solid var(--line);transition:.2s}.review.resolved{opacity:.46}.review-top{display:flex;justify-content:space-between;align-items:center}.review-top strong{font-size:13px}.sku{font-size:9px;color:#999;margin-left:8px}.tag{background:#f2eee5;color:#856d3e;border-radius:999px;padding:5px 8px;font-size:9px}.tag.urgent{background:#fae3dd;color:#bd5945}.review>.stars{margin-top:7px}.review>p{font-family:Georgia,serif;font-size:13px;line-height:1.55;color:#515653;margin:9px 0}.review-foot{display:flex;justify-content:space-between;align-items:center;color:#929592;font-size:9px}.review-foot button{border:1px solid #a9c2b8;color:#27624c;background:#fff;border-radius:6px;padding:7px 10px;font-size:9px}.insight{padding:22px;height:max-content}.eyebrow{font-size:9px;letter-spacing:.12em;color:#9a7a41;margin:0 0 7px}.insight h2{font-family:Georgia,serif;font-size:18px;font-weight:500;margin:0}.donut{width:145px;height:145px;margin:24px auto;border-radius:50%;background:conic-gradient(#e8755b 0 38%,#e6ad48 38% 65%,#6f97ad 65% 86%,#d6d7d3 86%);display:grid;place-items:center;position:relative}.donut:after{content:"";position:absolute;background:#fff;border-radius:50%;inset:22px}.donut div{z-index:1;text-align:center}.donut strong,.donut span{display:block}.donut strong{font:500 23px Georgia,serif}.donut span{font-size:9px;color:#888;margin-top:4px}.insight ul{list-style:none;margin:0;padding:0}.insight li{display:grid;grid-template-columns:10px 1fr auto;gap:8px;align-items:center;padding:7px 0;font-size:10px}.dot{width:7px;height:7px;border-radius:50%}.coral-dot{background:#e8755b}.amber-dot{background:#e6ad48}.blue-dot{background:#6f97ad}.gray-dot{background:#d6d7d3}.tip{display:flex;gap:9px;background:#f4f1e8;border-radius:8px;padding:12px;margin-top:18px;color:#8a6e37}.tip p{margin:0;font-size:9px;line-height:1.5;color:#6d706d}.tip b{display:block;color:#6c5529;margin-bottom:2px}@media(max-width:1100px){.metrics{grid-template-columns:repeat(2,1fr)}.section-grid,.reviews-layout{grid-template-columns:1fr}.top-actions .search{display:none}}@media(max-width:760px){.app-shell{display:block}.sidebar{position:fixed;z-index:20;bottom:0;top:auto;width:100%;height:62px;min-height:0;padding:8px 12px;display:block}.brand,.sidebar-bottom,nav button.sub{display:none}nav{display:grid;grid-template-columns:repeat(3,1fr)}nav button{justify-content:center;padding:10px 5px}nav button span{display:none}.workspace{padding:20px 14px 84px}.topbar{align-items:flex-start}.top-actions .date-button{display:none}.metrics{grid-template-columns:1fr 1fr}.metrics article{padding:14px 12px}.metrics .metric-icon{display:none}.shift-row{grid-template-columns:95px 1fr}.people{grid-template-columns:1fr}.people .status{display:none}.table-head{display:none}.staff-row{grid-template-columns:1fr 1fr;padding:14px}.staff-row>span:nth-child(3),.staff-row>span:nth-child(4){display:none}.filters{flex-wrap:wrap}.card-heading{padding:16px}.topbar h1{font-size:24px}}
/* Blazor-specific star rendering */
.stars{color:#e4aa43}.stars i{color:#d9d9d5;font-style:normal}
.schedule-card{overflow:hidden}.schedule-actions{display:flex;gap:6px}.schedule-actions button{border:1px solid var(--line);background:#fff;color:#66706b;border-radius:6px;padding:7px 9px;font-size:10px}.schedule-actions button.primary{background:#245f49;color:#fff;border-color:#245f49}.week-grid{display:grid;grid-template-columns:minmax(170px,1.35fr) repeat(7,minmax(90px,1fr));overflow-x:auto}.week-head{padding:14px 8px;text-align:center;background:#fafaf8;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.week-head strong,.week-head span{display:block}.week-head strong{font-size:10px}.week-head span{font-size:9px;color:#929692;margin-top:4px}.week-head.employee-col{text-align:left;padding-left:20px;color:#777;font-size:10px;text-transform:uppercase}.week-person,.shift-cell{min-height:76px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:13px 10px}.week-person{display:flex;align-items:center;gap:9px}.week-person strong,.week-person small{display:block}.week-person strong{font-size:10px}.week-person small{font-size:9px;color:#929692;margin-top:3px}.shift-cell{text-align:center}.shift-cell small{display:block;color:#8c918d;font-size:8px;margin-top:7px}.shift-chip{display:inline-block;border-radius:5px;padding:5px 7px;font-size:9px}.shift-chip.morning{background:#dcefe6;color:#34735b}.shift-chip.afternoon{background:#f5ead0;color:#8c6a25}.shift-chip.off{background:#eeeeeb;color:#858986}.schedule-legend{display:flex;gap:20px;padding:14px 20px;font-size:9px;color:#727773}.schedule-legend span{display:flex;align-items:center;gap:6px}.legend-dot{width:7px;height:7px;border-radius:50%}.legend-dot.morning{background:#80b59f}.legend-dot.afternoon{background:#dcb55f}.legend-dot.off-day{background:#bfc1bd}
.planner-shell{display:grid;grid-template-columns:210px minmax(0,1fr);border-top:1px solid var(--line)}.staff-pool{padding:16px;background:#f8faf8;border-right:1px solid var(--line);min-height:465px}.pool-heading{display:flex;align-items:center;justify-content:space-between}.pool-heading strong{font-size:11px}.pool-heading span{font-size:9px;background:#e3eee8;color:#34735b;padding:4px 7px;border-radius:10px}.staff-pool>p{font-size:9px;color:#8b918d;margin:5px 0 13px}.draggable-person{display:flex;align-items:center;gap:8px;padding:9px;margin-bottom:7px;background:#fff;border:1px solid #e2e6e3;border-radius:8px;box-shadow:0 1px 2px #1d3a2e0a;cursor:grab}.draggable-person:active,.assigned-person:active{cursor:grabbing}.draggable-person>div:nth-child(2){min-width:0;flex:1}.draggable-person strong,.draggable-person small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.draggable-person strong{font-size:9px}.draggable-person small{font-size:8px;color:#959a96;margin-top:2px}.drag-handle{color:#aeb3af}.shift-board{overflow-x:auto}.shift-board-grid{display:grid;grid-template-columns:120px repeat(7,minmax(135px,1fr));min-width:1065px}.shift-title{text-align:left;padding-left:16px}.shift-label{min-height:135px;padding:18px 12px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;gap:8px}.shift-label i{width:8px;height:8px;border-radius:50%;margin-top:2px}.shift-label strong,.shift-label span{display:block}.shift-label strong{font-size:10px}.shift-label span{font-size:8px;color:#8b908c;margin-top:4px}.shift-label.morning i{background:#63a78b}.shift-label.midday i{background:#d8aa48}.shift-label.night i{background:#7776b5}.drop-zone{min-height:135px;padding:8px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:.15s}.drop-zone.morning{background:#f5fbf8}.drop-zone.midday{background:#fffaf0}.drop-zone.night{background:#f8f7fc}.drop-zone:hover{box-shadow:inset 0 0 0 2px #7fa996}.capacity{height:17px;text-align:right}.capacity span{font-size:8px;color:#969b97}.assigned-person{display:flex;align-items:center;gap:5px;background:#fff;border:1px solid #dfe5e1;border-radius:7px;padding:5px;margin-bottom:5px;cursor:grab;box-shadow:0 1px 2px #1837290a}.assigned-person .avatar{width:22px;height:22px;font-size:7px;flex:0 0 auto}.assigned-person>span{font-size:8px;line-height:1.15;flex:1;overflow:hidden;text-overflow:ellipsis}.assigned-person button{border:0;background:transparent;color:#a7aaa8;padding:0 2px;cursor:pointer}.assigned-person button:hover{color:#c95e4f}.drop-hint{display:block;border:1px dashed #ccd4cf;border-radius:7px;padding:13px 4px;text-align:center;color:#a2aaa5;font-size:8px}.save-message{font-size:9px;color:#758079;align-self:center}.schedule-legend small{margin-left:auto;color:#8f9490}.legend-dot.midday{background:#d8aa48}.legend-dot.night{background:#7776b5}@media(max-width:900px){.planner-shell{grid-template-columns:170px minmax(0,1fr)}.staff-pool{padding:10px}}

/* Jira-inspired blue theme and Vietnamese-safe typography */
:root{--ink:#172b4d;--muted:#626f86;--green:#0c66e4;--line:#dfe1e6;--cream:#f7f8f9;--coral:#e34935}html,body,button,input{font-family:"Segoe UI",Arial,"Noto Sans",sans-serif!important}body{background:#f7f8f9;color:#172b4d}.topbar h1,.card-heading h2,.brand,.metrics strong,.score strong,.review>p,.insight h2,.donut strong{font-family:"Segoe UI",Arial,"Noto Sans",sans-serif!important}.topbar h1{font-size:27px;font-weight:650;letter-spacing:-.5px}.card-heading h2{font-size:18px;font-weight:650;letter-spacing:-.15px}.brand{font-size:22px;font-weight:700}.sidebar{background:#0747a6}.brand-mark{border-color:#9fcbff;color:#deebff}.sidebar nav button,.sidebar-bottom>button{color:#deebff}.sidebar nav button:hover{background:#0c66e4}.sidebar nav button.active{background:#fff;color:#0c66e4;font-weight:600}.sidebar nav button b{background:#ff7452}.profile small{color:#bcd5f5}.workspace{background:#f7f8f9}.card,.metrics article,.search,.icon-button,.date-button{border-color:#dfe1e6;box-shadow:0 1px 2px #091e4226}.card{border-radius:8px}.card-heading{background:#fff}.card-heading .primary,.schedule-actions button.primary,.filters button.selected{background:#0c66e4;border-color:#0c66e4}.card-heading>button,.handoff button,.review-foot button{color:#0c66e4}.metric-icon.green,.metric-icon.blue{background:#e9f2ff;color:#0c66e4}.positive{color:#0c66e4}.status.live{background:#e9f2ff;color:#0052cc}.staff-pool{background:#f4f5f7}.pool-heading span{background:#e9f2ff;color:#0052cc}.draggable-person{border-color:#dfe1e6;border-radius:6px;box-shadow:0 1px 2px #091e4226}.draggable-person:hover{border-color:#579dff;background:#f7faff}.week-head{background:#f4f5f7;color:#44546f}.shift-label{background:#fff}.shift-label.morning i{background:#0c66e4}.shift-label.midday i{background:#579dff}.shift-label.night i{background:#6554c0}.drop-zone.morning{background:#f7faff}.drop-zone.midday{background:#f0f7ff}.drop-zone.night{background:#f7f5ff}.drop-zone:hover{box-shadow:inset 0 0 0 2px #0c66e4;background:#e9f2ff}.assigned-person{border-color:#dfe1e6;border-radius:5px;box-shadow:0 1px 1px #091e421f}.assigned-person:hover{border-color:#85b8ff}.drop-hint{border-color:#85b8ff;color:#0c66e4}.legend-dot.morning{background:#0c66e4}.legend-dot.midday{background:#579dff}.legend-dot.night{background:#6554c0}.avatar{background:#e9f2ff;color:#0052cc}.avatar.blue{background:#ddecff;color:#0747a6}.avatar.orange,.avatar.peach{background:#e9f2ff;color:#0c66e4}.avatar.purple{background:#eae6ff;color:#403294}.avatar.rose{background:#d6e8ff;color:#0052cc}.schedule-card{box-shadow:0 1px 3px #091e4226}.save-message{color:#0c66e4;font-weight:600}
.week-calendar-bar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 18px;background:#f7f8f9;border-bottom:1px solid var(--line)}.calendar-label{display:flex;align-items:center;gap:9px}.calendar-label>span{width:30px;height:30px;display:grid;place-items:center;border-radius:6px;background:#e9f2ff;color:#0c66e4}.calendar-label strong,.calendar-label small{display:block}.calendar-label strong{font-size:11px}.calendar-label small{font-size:9px;color:#626f86;margin-top:2px}.calendar-selectors{display:flex;align-items:end;gap:9px}.calendar-selectors label{font-size:8px;color:#626f86;text-transform:uppercase;font-weight:600}.calendar-selectors select{display:block;margin-top:3px;height:30px;min-width:92px;border:1px solid #b3b9c4;border-radius:5px;background:#fff;color:#172b4d;padding:0 25px 0 8px;font-size:10px;outline:none}.calendar-selectors select:focus{border-color:#0c66e4;box-shadow:0 0 0 2px #85b8ff66}.selected-range{height:30px;display:flex;align-items:center;padding:0 10px;border-radius:5px;background:#fff;border:1px solid var(--line);font-size:9px;color:#44546f}@media(max-width:760px){.week-calendar-bar{align-items:flex-start;flex-direction:column}.calendar-selectors{width:100%;flex-wrap:wrap}.selected-range{width:100%}}
.product-score-head,.product-score-row{display:grid;grid-template-columns:minmax(280px,1.8fr) 165px 105px 70px 105px 82px 100px;gap:14px;align-items:center;padding:13px 22px}.product-score-head{background:#f4f5f7;color:#626f86;font-size:9px;text-transform:uppercase;font-weight:600;letter-spacing:.04em}.product-score-row{border-top:1px solid var(--line);font-size:11px}.product-score-row strong{display:block;line-height:1.35}.product-score-row>span{color:#44546f}.product-rating{display:flex;align-items:center;gap:4px}.product-rating b{font-size:17px;color:#172b4d}.product-rating span{color:#f5a623}.product-score-empty{padding:32px 22px;text-align:center;color:#626f86;font-size:11px}.product-score-card .schedule-actions{align-items:center}.product-score-card .primary:disabled,.row-refresh:disabled{opacity:.65;cursor:wait}.add-product-bar{display:flex;gap:10px;padding:14px 22px;border-top:1px solid var(--line)}.add-product-bar input{flex:1;border:1px solid #dfe1e6;border-radius:6px;padding:10px 12px;color:#172b4d;outline:none}.add-product-bar input:focus{border-color:#0c66e4;box-shadow:0 0 0 2px #0c66e422}.row-refresh{border:1px solid #0c66e4;background:#fff;color:#0c66e4;border-radius:5px;padding:7px 9px;font-weight:600;cursor:pointer}.row-refresh:hover{background:#e9f2ff}.attention-toggle{border:1px solid #b3b9c4;background:#fff;color:#626f86;border-radius:999px;padding:6px 12px;font-weight:700}.attention-toggle.selected{border-color:#36b37e;background:#e3fcef;color:#006644}.attention-toggle:disabled{opacity:.6}@media(max-width:900px){.product-score-head{display:none}.product-score-row{grid-template-columns:1fr 100px}.product-score-row>span:nth-child(2),.product-score-row>span:nth-child(3),.product-score-row>span:nth-child(5){display:none}.add-product-bar{flex-direction:column}}
.permission-note{margin:0 22px 12px;padding:9px 12px;border-radius:6px;background:#fff7d6;color:#7f5f01;font-size:11px}.logout-button{width:30px!important;height:30px!important;padding:0!important;display:grid!important;place-items:center;color:#fff!important}.login-page{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(135deg,#0747a6,#0c66e4)}.login-card{width:min(420px,100%);padding:36px;background:#fff;border-radius:12px;box-shadow:0 18px 50px #091e4255}.login-brand{display:flex;align-items:center;gap:10px;color:#172b4d;font-size:22px}.login-brand span{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:#0c66e4;color:#fff}.login-card h1{margin:28px 0 8px;font-size:25px;color:#172b4d}.login-card>p{margin:0 0 24px;color:#626f86;line-height:1.5}.login-card form{display:grid;gap:16px}.login-card label{display:grid;gap:7px;color:#44546f;font-size:13px;font-weight:600}.login-card input{padding:12px;border:1px solid #dfe1e6;border-radius:6px;font:inherit;outline:none}.login-card input:focus{border-color:#0c66e4;box-shadow:0 0 0 2px #0c66e422}.login-card button{padding:12px;border:0;border-radius:6px;background:#0c66e4;color:#fff;font-weight:700;cursor:pointer}.login-error{margin-bottom:16px;padding:10px 12px;border-radius:6px;background:#ffebe6;color:#ae2a19;font-size:12px}
.product-score-no-actions{grid-template-columns:minmax(320px,1.8fr) 180px 120px 80px 110px 82px}
.empty-shift{color:#7a869a;font-style:italic;font-size:11px}
.product-list-tools{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:0 22px 14px}.product-list-tools label{width:min(470px,100%);display:flex;align-items:center;gap:8px;border:1px solid #dfe1e6;background:#fff;border-radius:6px;padding:0 11px;color:#626f86}.product-list-tools input{width:100%;border:0;outline:0;padding:9px 0;color:#172b4d}.product-list-tools>span{font-size:10px;color:#626f86;white-space:nowrap}.product-score-head button{border:0;background:transparent;color:inherit;text-transform:inherit;letter-spacing:inherit;font:inherit;font-weight:inherit;text-align:left;padding:0;cursor:pointer}.product-score-head button:hover{color:#0c66e4}.product-score-head button:nth-child(3),.product-score-head button:nth-child(4){text-align:left}@media(max-width:900px){.product-list-tools{align-items:stretch;flex-direction:column}.product-list-tools label{width:100%}}
.pending-product-head,.pending-product-row{display:grid;grid-template-columns:minmax(300px,1fr) 180px 70px 95px 90px 115px 105px;gap:14px;align-items:center;padding:14px 22px}.pending-product-head{background:#f4f5f7;color:#626f86;font-size:9px;text-transform:uppercase;font-weight:600;letter-spacing:.04em}.pending-product-row{border-top:1px solid var(--line);font-size:11px}.pending-product-row>span:not(.status){color:#44546f}.pending-product-row strong{line-height:1.4}.pending-product-rating{font-size:14px;font-weight:700;color:#172b4d!important}.pending-product-rating b{color:#f59e0b}.pending-product-reviews{font-variant-numeric:tabular-nums}.status.attention{background:#fff0e6;color:#c9372c}.daily-scan-check{display:flex;align-items:center;gap:7px;color:#44546f;font-weight:600;cursor:pointer}.daily-scan-check input{width:17px;height:17px;accent-color:#0c66e4;cursor:pointer}.daily-scan-check input:disabled{cursor:wait;opacity:.6}@media(max-width:760px){.pending-product-head{display:none}.pending-product-row{grid-template-columns:1fr auto}.pending-product-row>span{display:none}}
.pending-product-head button{border:0;background:transparent;padding:0;color:inherit;font:inherit;text-align:left;text-transform:inherit;letter-spacing:inherit;cursor:pointer}.pending-product-head button:hover{color:#0c66e4}
.attention-product-list{max-height:none;overflow:visible}
.employee-color-head,.employee-color-row{display:grid;grid-template-columns:minmax(260px,1fr) 180px 180px;gap:20px;align-items:center;padding:14px 22px}.employee-color-head{background:#f4f5f7;color:#626f86;font-size:9px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}.employee-color-row{border-top:1px solid #dfe1e6;font-size:11px}.employee-color-picker{display:flex;align-items:center;gap:10px;width:max-content}.employee-color-picker input{width:44px;height:32px;padding:2px;border:1px solid #dfe1e6;border-radius:6px;background:#fff;cursor:pointer}.employee-color-picker code{color:#44546f;font:600 11px "Segoe UI",Arial,sans-serif}.employee-color-picker input:disabled{opacity:.55;cursor:wait}@media(max-width:760px){.employee-color-head{display:none}.employee-color-row{grid-template-columns:1fr auto}.employee-color-row>span{display:none}}
.attendance-legend{display:flex;align-items:center;gap:16px;padding:9px 20px;background:#f7f8f9;border-bottom:1px solid #dfe1e6;color:#44546f;font-size:10px}.attendance-legend span{display:flex;align-items:center;gap:6px}.attendance-legend i{width:9px;height:9px;border-radius:3px}.attendance-legend i.matched{background:#7ee2b8}.attendance-legend i.absent{background:#ff8f73}.attendance-legend i.extra{background:#f5cd47}.people.attendance-people{display:flex;flex-wrap:wrap;align-content:center;gap:9px;padding:13px 16px}.attendance-person{min-width:180px;max-width:220px;padding:8px 10px;border:1px solid transparent;border-radius:7px}.attendance-person.matched{background:#dcfff1;border-color:#7ee2b8}.attendance-person.absent{background:#ffebe6;border-color:#ff8f73}.attendance-person.extra{background:#fff7d6;border-color:#f5cd47}.attendance-person.matched small{color:#216e4e}.attendance-person.absent small{color:#ae2e24}.attendance-person.extra small{color:#7f5f01}.attendance-people>.status{margin-left:auto}@media(max-width:760px){.attendance-legend{flex-wrap:wrap;gap:8px 14px}.attendance-person{min-width:100%;max-width:none}.attendance-people>.status{margin-left:0}}

/* Refined Jira-style sidebar */
@media(min-width:761px){
  .app-shell{grid-template-columns:252px minmax(0,1fr)}
  .sidebar{width:252px;padding:20px 14px 16px;background:linear-gradient(180deg,#0c4fb3 0%,#0747a6 58%,#063b8c 100%);box-shadow:2px 0 8px #091e4226}
  .brand{height:58px;padding:0 12px 18px;gap:11px;font-size:21px;letter-spacing:-.2px}
  .brand-mark{width:36px;height:36px;border-color:#85b8ff;background:#ffffff0d;color:#fff;font-family:"Segoe UI",Arial,sans-serif;font-size:17px}
  .sidebar nav{gap:5px}
  .sidebar nav button,.sidebar-bottom>button{width:100%;min-height:44px;padding:9px 11px;border-radius:8px;gap:10px;font-size:14px;line-height:1.25;transition:background .15s,color .15s,transform .15s}
  .sidebar nav button>span,.sidebar-bottom>button>span{width:28px;height:28px;flex:0 0 28px;display:grid;place-items:center;border-radius:7px;background:#ffffff0d;font-size:16px}
  .sidebar nav button:hover,.sidebar-bottom>button:hover{background:#ffffff18;color:#fff;transform:translateX(1px)}
  .sidebar nav button.active{background:#fff;color:#0c66e4;box-shadow:0 3px 10px #091e4238}
  .sidebar nav button.active>span{background:#e9f2ff;color:#0c66e4}
  .sidebar nav button.sub{width:calc(100% - 18px);margin-left:18px;padding:8px 8px;min-height:42px;font-size:12.5px;color:#cfe1fa}
  .sidebar nav button.sub>span{width:25px;height:25px;flex-basis:25px;font-size:14px}
  .sidebar nav button.sub.active{color:#0c66e4}
  .sidebar nav button b{min-width:25px;height:20px;margin-left:auto;padding:2px 7px;display:grid;place-items:center;background:#ff7452;box-shadow:0 1px 2px #091e4240;font-size:10px}
  .sidebar-bottom{padding-top:10px;border-color:#ffffff26}
  .sidebar-bottom>button.active{background:#ffffff1f;color:#fff}
  .profile{grid-template-columns:38px minmax(0,1fr) 34px;padding:14px 8px 0;gap:9px}
  .profile>div:nth-child(2){min-width:0}.profile strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.profile form,.profile form button{width:34px;height:34px}.logout-button{border-radius:7px!important;background:#ffffff14!important;color:#deebff!important}.logout-button:hover{background:#ffffff26!important;color:#fff!important}
}

/* Collapsible navigation */
@media(min-width:761px){
  .app-shell,.sidebar{transition:grid-template-columns .2s ease,width .2s ease}
  .app-shell.sidebar-is-collapsed{grid-template-columns:76px minmax(0,1fr)}
  .sidebar.collapsed{width:76px;padding-left:10px;padding-right:10px}
  .brand{position:relative}
  .brand-name{white-space:nowrap;overflow:hidden;transition:opacity .15s ease,width .2s ease}
  .sidebar-toggle{position:absolute;right:-27px;top:8px;z-index:3;width:25px;height:25px;padding:0;border:1px solid #dfe1e6;border-radius:50%;display:grid;place-items:center;background:#fff;color:#0c66e4;font-size:20px;line-height:1;box-shadow:0 2px 6px #091e4230}
  .sidebar-toggle:hover{background:#e9f2ff}
  .sidebar nav button,.sidebar-bottom>button{position:relative;overflow:visible}
  .sidebar .nav-label{width:auto!important;height:auto!important;flex:1 1 auto!important;display:block!important;background:transparent!important;text-align:left;white-space:normal;font-size:inherit!important}
  .sidebar nav button.active{background:#e9f2ff;color:#0747a6;box-shadow:none}
  .sidebar nav button.active:before{content:"";position:absolute;left:-7px;top:10px;bottom:10px;width:3px;border-radius:3px;background:#85b8ff}
  .sidebar nav button.sub{margin-left:10px;width:calc(100% - 10px);padding-left:9px}
  .sidebar nav button.sub:after{content:"";position:absolute;left:-7px;top:0;bottom:0;width:1px;background:#ffffff24}
  .sidebar nav button.sub.active:after{background:#85b8ff}
  .sidebar.collapsed .brand{justify-content:center;padding-left:0;padding-right:0}
  .sidebar.collapsed .brand-name,.sidebar.collapsed .nav-label,.sidebar.collapsed nav button b,.sidebar.collapsed .profile-info,.sidebar.collapsed .profile form{display:none!important}
  .sidebar.collapsed .sidebar-toggle{right:-23px}
  .sidebar.collapsed nav button,.sidebar.collapsed .sidebar-bottom>button{width:48px;min-width:48px;height:46px;margin:0 auto 5px;padding:8px;justify-content:center}
  .sidebar.collapsed nav button.sub{margin-left:auto}
  .sidebar.collapsed nav button.sub:after{display:none}
  .sidebar.collapsed nav button.active:before{left:-6px}
  .sidebar.collapsed .profile{display:flex;justify-content:center;padding-left:0;padding-right:0}
  .sidebar.collapsed .profile .avatar{width:38px;height:38px}
}
