:root{--navy:#0b1f3a;--navy2:#173b6c;--gold:#b8892e;--gold2:#d8b35d;--bg:#f4f6f8;--pink:#ffd9e3;--line:#d7dee8;--muted:#667085}*{box-sizing:border-box}body{background:var(--bg);color:#172033;margin:0;font-family:Inter,Segoe UI,Arial,sans-serif}button,input,select{font:inherit}button{cursor:pointer}.login{background:linear-gradient(135deg,#091a31,#183d70);place-items:center;min-height:100vh;padding:20px;display:grid}.login-card{text-align:center;background:#fff;border-radius:24px;width:min(440px,100%);padding:38px;box-shadow:0 30px 80px #0006}.login-card img{object-fit:contain;width:140px;height:140px}.login h1{color:var(--navy);margin:5px 0}.login p{color:var(--muted)}.login form{text-align:left;margin-top:25px}.login label,.modal label{color:var(--navy);gap:7px;margin:12px 0;font-weight:700;display:grid}.login input,.modal input,.modal select,.head-actions select,.month-input{border:1px solid var(--line);background:#fff;border-radius:10px;width:100%;padding:12px}.gold-btn{background:linear-gradient(135deg,var(--gold2),var(--gold));color:#fff;border:0;border-radius:10px;justify-content:center;align-items:center;gap:7px;padding:12px 18px;font-weight:800;display:inline-flex}.login .gold-btn{width:100%;margin-top:8px}.error,.notice{color:#a11;background:#ffe6e6;border-radius:10px;justify-content:space-between;align-items:center;margin:0 0 15px;padding:12px 14px;display:flex}.notice{color:#173b6c;background:#eef6ff}.app-shell{min-height:100vh;display:flex}.sidebar{background:linear-gradient(180deg,var(--navy),#102a4d);color:#fff;z-index:20;flex-direction:column;width:260px;height:100vh;padding:18px 14px;display:flex;position:sticky;top:0}.brand{align-items:center;gap:10px;padding:8px 6px 28px;display:flex}.brand img{object-fit:contain;background:#fff;border-radius:12px;width:52px;height:52px}.brand b{white-space:nowrap;font-family:Georgia,serif;font-size:20px;display:block}.brand span{color:#cbd5e1;white-space:nowrap;text-transform:uppercase;letter-spacing:1px;font-size:11px}.sidebar nav{gap:6px;display:grid}.sidebar button{color:#dbeafe;text-align:left;background:0 0;border:0;border-radius:10px;align-items:center;gap:12px;padding:13px;display:flex}.sidebar button:hover,.sidebar button.active{color:#fff;background:#ffffff18}.sidebar-bottom{margin-top:auto}.backdrop{display:none}main{flex:1;min-width:0}header{z-index:10;background:#fff;border-bottom:3px solid #d8b35d;align-items:center;gap:15px;height:78px;padding:0 25px;display:flex;position:sticky;top:0}.icon-btn{background:#eef2f7;border:0;border-radius:9px;padding:9px}.title{display:grid}.title b{color:var(--navy)}.title small,.head-actions small{color:var(--muted)}.head-actions{align-items:center;gap:10px;min-width:0;margin-left:auto;display:flex}.head-actions select{width:min(270px,32vw);font-weight:700}.head-actions>div:last-child{display:grid}.avatar{background:linear-gradient(135deg,var(--gold2),var(--gold));color:#fff;border-radius:50%;place-items:center;width:40px;height:40px;font-weight:800;display:grid}.page{max-width:1800px;margin:auto;padding:28px}.toolbar{justify-content:space-between;align-items:center;gap:15px;margin-bottom:20px;display:flex}.toolbar h2{color:var(--navy);margin:0}.toolbar p{color:var(--muted);text-transform:capitalize;margin:5px 0 0}.month-nav,.export-actions{gap:8px;display:flex}.month-nav button,.export-actions button{border:1px solid var(--line);background:#fff;border-radius:9px;align-items:center;gap:7px;padding:10px 13px;font-weight:700;display:flex}.calendar-scroll{border-radius:14px;overflow:auto;box-shadow:0 8px 25px #0b1f3a12}.calendar-head,.calendar-grid{grid-template-columns:repeat(7,minmax(155px,1fr));min-width:1085px;display:grid}.calendar-head{background:var(--navy);color:#fff}.calendar-head b{text-align:center;padding:12px}.calendar-grid{background:#fff}.day{border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff;min-height:300px;padding:7px}.day.blank{background:#f8fafc}.holiday{background:linear-gradient(#ffd9e355,#fff)}.day-top{justify-content:space-between;align-items:center;min-height:26px;display:flex}.day-top span{color:#a13b59;text-align:right;font-size:9px;font-weight:800}.shift-slot{background:#fff;border:1px solid #e5eaf1;border-radius:7px;margin-top:5px;padding:4px}.slot-title{align-items:center;gap:4px;font-size:11px;font-weight:800;display:flex}.slot-title i,.legend i{border-radius:50%;width:9px;height:9px;display:inline-block}.slot-title small{color:var(--muted);margin-left:auto}.person{white-space:nowrap;text-overflow:ellipsis;padding:2px 4px;font-size:10px;overflow:hidden}.person-action{border-radius:4px;justify-content:space-between;align-items:center;display:flex}.person-action:hover{background:#eef4fb}.shift-slot button{width:100%;color:var(--navy);background:#f1f5f9;border:0;border-radius:5px;padding:5px;font-size:10px;font-weight:700}.full{color:#b91c1c;text-align:center;background:#fee2e2;border-radius:4px;padding:4px;font-size:10px;font-weight:900}.modal-back{z-index:50;background:#0008;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal{background:#fff;border-radius:18px;width:min(560px,100%);max-height:92vh;padding:24px;overflow:auto;box-shadow:0 25px 70px #0005}.modal h3{color:var(--navy);margin-top:0}.type-grid{grid-template-columns:1fr 1fr;gap:8px;margin:18px 0;display:grid}.type-grid button{border:1px solid var(--line);text-align:left;background:#fff;border-radius:10px;grid-template-columns:12px auto 1fr;align-items:center;gap:7px;padding:12px;display:grid}.type-grid button.selected{outline:2px solid var(--gold)}.type-grid i{border-radius:5px;width:10px;height:30px}.type-grid span{color:var(--muted);font-size:11px}.modal-actions{flex-wrap:wrap;justify-content:flex-end;gap:10px;display:flex}.modal-actions>button:not(.gold-btn):not(.danger){border:1px solid var(--line);background:#fff;border-radius:9px;padding:10px 14px}.danger{color:#b91c1c;background:#fee2e2;border:0;border-radius:9px;align-items:center;gap:5px;padding:10px 14px;display:inline-flex}.summary-cards{grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:22px;display:grid}.summary-cards article{border:1px solid var(--line);background:#fff;border-radius:16px;grid-template-columns:auto 1fr;align-items:center;gap:8px;padding:18px;display:grid;box-shadow:0 8px 25px #0b1f3a0a}.summary-cards svg{color:var(--gold)}.summary-cards span{color:var(--muted);font-size:13px}.summary-cards b{color:var(--navy);grid-column:2;font-size:28px}.data-card{border:1px solid var(--line);background:#fff;border-radius:16px;padding:18px;box-shadow:0 8px 25px #0b1f3a0a}.section-title h3{color:var(--navy);margin:0}.section-title small{color:var(--muted)}.table-scroll{overflow:auto}.simple-table{border-collapse:collapse;width:100%;min-width:720px;margin-top:15px}.simple-table th{background:var(--navy);color:#fff;text-align:left;padding:11px}.simple-table td{border-bottom:1px solid var(--line);vertical-align:middle;padding:11px}.simple-table tr:hover td{background:#fafcff}.actions{white-space:nowrap}.actions button{border:1px solid var(--line);background:#fff;border-radius:7px;margin-right:5px;padding:7px}.actions .danger-icon{color:#b91c1c;background:#fff7f7}.status{border-radius:999px;padding:4px 9px;font-size:12px}.status.active{color:#166534;background:#dcfce7}.super-tag{color:#8a6200;background:#fff1c7;border-radius:999px;margin-left:7px;padding:3px 6px;font-size:9px;font-weight:800;display:inline-block}.form-grid{grid-template-columns:1fr 1fr;gap:0 12px;display:grid}.full-width{grid-column:1/-1}.modal-large{width:min(700px,100%)}.consolidated{border:1px solid var(--line);background:#fff;padding:16px;box-shadow:0 8px 25px #0b1f3a0d}.sheet-title{text-align:center;color:var(--navy);font-size:22px;font-weight:900}.sheet-subtitle{text-align:center;background:linear-gradient(90deg,var(--navy2),#467d84);color:#fff;margin:10px 0;padding:8px}.sheet-wrap{overflow:auto}.consolidated table{border-collapse:collapse;width:max-content;min-width:100%;font-size:12px}.consolidated th{color:#142238;background:linear-gradient(#d7e0de,#5b817b);border:1px solid #60716e;min-width:35px;padding:4px}.consolidated th span,.consolidated th b{display:block}.consolidated th span{font-size:10px}.consolidated td{text-align:center;border:1px solid #aab3b2;min-width:35px;height:34px}.sticky-name{z-index:2;position:sticky;left:0;text-align:left!important;background:#e8e8d9!important;min-width:210px!important;padding:6px 10px!important}.consolidated td.sticky-name{background:#eef0e3!important}.sticky-name small{color:var(--muted);font-size:9px;display:block}.code{color:#111;font-weight:900}.hours{text-align:center!important;background:#f4ecd5!important;min-width:75px!important}.legend{flex-wrap:wrap;gap:16px;margin-top:15px;display:flex}.legend span{align-items:center;gap:5px;font-size:12px;display:flex}.cards{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;display:grid}.user-card{border:1px solid var(--line);background:#fff;border-radius:14px;align-items:center;gap:12px;padding:16px;display:flex}.user-card p{color:var(--muted);margin:4px 0}@media (width<=900px){.sidebar{width:275px;transition:all .25s;position:fixed;left:0;transform:translate(-100%)}.sidebar.open{transform:translate(0)}.backdrop{z-index:15;background:#0006;display:block;position:fixed;inset:0}header{padding:0 14px}.title small,.who{display:none}.head-actions select{width:190px}.page{padding:16px}.calendar-head,.calendar-grid{grid-template-columns:repeat(7,minmax(125px,1fr));min-width:875px}.day{min-height:245px}.calendar-page .toolbar{align-items:flex-start}.summary-cards{grid-template-columns:1fr}.summary-cards article{grid-template-columns:auto 1fr auto}.summary-cards b{grid-column:auto;font-size:22px}.form-grid{grid-template-columns:1fr}.full-width{grid-column:auto}}@media (width<=600px){body{font-size:14px}.login-card{border-radius:18px;padding:25px 20px}.login-card img{width:105px;height:105px}.login h1{font-size:24px}.page{padding:12px}.page .toolbar{margin-bottom:12px}.toolbar{flex-direction:column;align-items:stretch}.toolbar h2{font-size:20px}.month-nav{justify-content:space-between;width:100%}.month-nav button{padding:9px 11px}.head-actions{gap:7px}.head-actions select{width:170px;padding:9px;font-size:11px}.avatar{width:34px;height:34px}.icon-btn{padding:7px}.calendar-scroll{border-radius:10px}.calendar-head,.calendar-grid{grid-template-columns:repeat(7,minmax(102px,1fr));min-width:714px}.calendar-head b{padding:9px 3px;font-size:12px}.day{min-height:225px;padding:5px}.day-top{font-size:13px}.day-top span{max-width:70px;font-size:7px}.shift-slot{margin-top:4px;padding:3px}.slot-title{font-size:10px}.person{font-size:9px}.shift-slot button{padding:5px;font-size:9px}.modal{border-radius:14px;padding:18px}.modal h3{font-size:17px}.type-grid{grid-template-columns:1fr}.modal-actions{flex-direction:column-reverse}.modal-actions button,.gold-btn{width:100%}.summary-cards{gap:10px}.data-card{border-radius:12px;padding:12px}.simple-table{min-width:650px}.export-actions{width:100%;overflow:auto}.export-actions button{white-space:nowrap}.sheet-title{font-size:17px}.consolidated{padding:8px}.month-input{width:100%}}.register-link{border:1px solid var(--gold);width:100%;color:var(--navy);background:#fff;border-radius:10px;justify-content:center;align-items:center;gap:7px;margin-top:12px;padding:11px 14px;font-weight:800;display:flex}.register-link:hover{background:#fff8e9}.register-grid{grid-template-columns:1fr 1fr;gap:12px;display:grid}.register-note{text-align:center;color:var(--muted);margin-top:12px;line-height:1.4;display:block}@media (width<=600px){.register-grid{grid-template-columns:1fr}}
