/* Base: extracted verbatim from source/staffing_demo.html <style>. M1 additions are appended at the end. */
:root{--ink:#18263b;--sub:#67758a;--line:#e4eaf1;--bg:#f4f7fb;--primary:#116d77;--primary-soft:#e8f5f3;--amber:#9a5b09;--amber-soft:#fff3df;--red:#b24444;--red-soft:#fff0ef;--nav:#142638;--radius:16px;--shadow:0 5px 22px #26375207}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;font-size:14px;line-height:1.65}button,input,select{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #669cef;outline-offset:3px}button:disabled{opacity:.45;cursor:not-allowed}h1,h2,h3,h4,p{margin:0}button{border:0}a{color:var(--primary)}.app-shell{display:grid;grid-template-columns:222px minmax(0,1fr);min-height:100vh}.sidebar{background:var(--nav);color:#fff;padding:29px 17px;position:fixed;width:222px;height:100vh;display:flex;flex-direction:column;z-index:10}.brand{display:flex;gap:11px;align-items:center;padding:0 11px 29px}.brand-mark{display:grid;place-items:center;width:36px;height:36px;background:#b4dfd7;border-radius:12px;color:#163b3a}.brand-name{font-size:18px;font-weight:760;letter-spacing:-.5px}.brand-sub{font-size:10px;letter-spacing:1.8px;color:#8da8b8}.sidebar-caption{font-size:10px;letter-spacing:1.5px;color:#93a8b7;padding:7px 13px 13px}.nav-button{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;text-align:left;color:#b9c7d3;background:transparent;border-radius:9px;margin:3px 0;font-weight:550;font-size:13px}.nav-button:hover{background:#ffffff0b}.nav-button.active{background:#ffffff13;color:#fff}.nav-button.active .nav-dot{width:5px;height:5px;border-radius:50%;background:#a4d6cd;margin-left:auto}.sidebar-note{margin-top:auto;background:#ffffff08;border:1px solid #ffffff0d;border-radius:12px;padding:15px;color:#a9bbc8;font-size:11px;line-height:1.9}.sidebar-note b{display:block;color:#e1eaf1;font-size:12px;margin-bottom:4px}.version{font-size:10px;padding:16px 7px 0;color:#7892a4;letter-spacing:.5px}.work{grid-column:2;min-width:0}.topbar{height:77px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 36px;gap:14px}.breadcrumb{font-size:12px;color:var(--sub)}.top-right{display:flex;gap:13px;align-items:center}.top-date{font-size:12px;color:var(--sub)}.avatar{height:32px;width:32px;border-radius:50%;background:#eaf0f6;color:#516078;display:grid;place-items:center;font-size:11px;font-weight:700}.demo-banner{background:#eef5f6;border-bottom:1px solid #dce8eb;font-size:11px;color:#4d6871;padding:8px 36px;display:flex;gap:9px;align-items:center}.container{padding:29px 36px 36px;max-width:1510px;margin:auto}.page-head{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:24px}.eyebrow{font-size:10px;font-weight:650;letter-spacing:1.9px;color:#6e8194;margin-bottom:6px}h1{font-size:27px;font-weight:720;letter-spacing:-.7px}h2{font-size:16px;font-weight:700}h3{font-size:14px;font-weight:650}.subtitle{font-size:12px;color:var(--sub);margin-top:5px}.btn{display:inline-flex;justify-content:center;align-items:center;gap:8px;padding:10px 15px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);font-size:12px;font-weight:600;min-height:40px;line-height:1.5}.btn:hover{background:#f5f8fa}.btn-primary{background:var(--primary);color:#fff;border-color:var(--primary)}.btn-primary:hover{background:#095b64}.btn-dark{background:#233b50;color:#fff;border-color:#233b50}.btn-dark:hover{background:#1c3042}.btn-danger{color:var(--red);border-color:#efd5d2}.btn-small{padding:7px 11px;min-height:34px;font-size:11px}.btn-link{background:transparent;color:var(--primary);padding:0;min-height:28px}.actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-bottom:21px}.metric{background:#fff;border:1px solid var(--line);border-radius:13px;padding:17px 18px;box-shadow:var(--shadow)}.metric-label{font-size:11px;color:var(--sub);display:flex;justify-content:space-between;align-items:center;gap:5px}.metric-value{font-size:33px;line-height:1.25;margin:10px 0 5px;font-weight:720;letter-spacing:-1px}.metric-value span{font-size:12px;color:var(--sub);font-weight:500;margin-left:5px;letter-spacing:0}.metric-note{font-size:10px;color:var(--sub)}.metric.alert .metric-value{color:var(--red)}.metric-icon{width:27px;height:27px;display:grid;place-items:center;border-radius:8px;background:#f2f5f9;color:#8291a5}.metric.alert .metric-icon{background:var(--red-soft);color:var(--red)}.hero{display:flex;gap:16px;justify-content:space-between;align-items:center;padding:20px 22px;border-radius:13px;background:#fff7eb;border:1px solid #f1e2c8;margin-bottom:25px}.hero.success{background:#edf8f4;border-color:#d4e9df}.hero-leading{display:flex;align-items:center;gap:15px}.hero-icon{color:#a17326;background:#ffedce;border-radius:11px;width:44px;height:44px;display:grid;place-items:center;flex-shrink:0}.hero h2{font-size:15px;margin-bottom:4px}.hero p{font-size:11px;color:#8a734e}.hero.success p{color:#497866}.hero.success .hero-icon{background:#d9eee5;color:#34785f}.content-grid{display:grid;grid-template-columns:minmax(0,1fr) 306px;gap:21px;align-items:start}.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.card-head{padding:19px 21px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line)}.card-body{padding:19px 21px}.mini-label{font-size:10px;color:var(--sub)}.pill{font-size:10px;display:inline-flex;align-items:center;gap:5px;padding:3px 8px;border-radius:5px;line-height:1.6;white-space:nowrap;background:#f1f4f8;color:#61738a;font-weight:550}.pill.green{background:var(--primary-soft);color:var(--primary)}.pill.amber{background:var(--amber-soft);color:var(--amber)}.pill.red{background:var(--red-soft);color:var(--red)}.pill.blue{background:#ecf2ff;color:#4d69a0}.pill.border{border:1px solid #dce8e8;background:#fff}.legend{display:flex;gap:12px;font-size:10px;color:var(--sub);align-items:center}.legend span:before{content:'';display:inline-block;width:7px;height:7px;border-radius:2px;margin-right:5px;background:#edf4f7}.legend .short:before{background:#f2b8af}.legend .extra:before{background:#aad7c8}.table-scroll{overflow-x:auto}table{border-collapse:collapse;width:100%;white-space:nowrap;text-align:left}th{font-size:10px;font-weight:600;color:#728199;background:#fafbfd;padding:12px 17px;border-bottom:1px solid var(--line)}td{padding:14px 17px;border-bottom:1px solid #eef2f6;font-size:12px}tr:last-child td{border-bottom:0}.facility-cell{min-width:168px}.facility-name{font-size:12px;font-weight:650}.facility-sub{font-size:10px;color:var(--sub);margin-top:3px}.role-row{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:11px;margin:5px 0;min-width:112px}.role-name{color:#758196}.count{padding:2px 7px;border-radius:5px;color:#5e7183;background:#f1f5f8;font-size:11px;min-width:46px;text-align:center}.count.short{background:#fff0ec;color:#a4473b}.count.extra{background:#e7f5ef;color:#327a66}.cell-hint{font-size:9px;color:#a24e42;margin-top:5px}.table-foot{font-size:10px;color:var(--sub);padding:12px 20px;border-top:1px solid var(--line);background:#fdfefe}.section-space{margin-top:21px}.facility-chips{display:flex;gap:10px;flex-wrap:wrap}.chip{background:#f3f6f9;border-radius:6px;padding:4px 8px;font-size:10px;color:#5d7186}.demand-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.demand-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.demand-col{border-right:1px solid var(--line);padding-right:17px}.demand-col:last-child{border:0;padding:0}.demand-bars{display:flex;gap:12px;align-items:flex-end;height:79px;margin-top:11px}.bar-wrap{flex:1;text-align:center;font-size:9px;color:var(--sub)}.bar{height:var(--bar-h);min-height:12px;background:#bfd6da;border-radius:4px 4px 0 0;position:relative;margin:16px 0 5px}.bar.emphasis{background:#609aa3}.bar span{position:absolute;left:0;right:0;top:-17px;font-size:9px;color:#5f7b89}.info-note{font-size:10px;color:#7b8898;line-height:1.8;margin-top:17px}.step-list{padding:18px 19px}.step{display:flex;gap:11px;margin-bottom:17px}.step:last-child{margin:0}.step-num{height:23px;width:23px;display:grid;place-items:center;flex:0 0 auto;border:1px solid #dce5eb;border-radius:50%;color:#8494a4;font-size:10px;background:#fff}.step.current .step-num{background:var(--primary);color:#fff;border-color:var(--primary)}.step-text{font-size:12px;font-weight:600}.step-sub{font-size:10px;color:var(--sub);line-height:1.7;margin-top:2px}.soft-card{background:#edf3f9;border:1px solid #e0e9f2;border-radius:13px;padding:18px;margin-top:19px}.soft-card h3{font-size:12px}.soft-card p{font-size:11px;color:#62758b;line-height:1.9;margin:8px 0 13px}.progress-row{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--sub);padding:12px 18px;background:#fbfcfe;border-top:1px solid var(--line)}.dot{height:6px;width:6px;display:inline-block;border-radius:50%;background:#53998a}.proposal-group{margin-bottom:26px}.group-header{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:12px}.proposal-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.proposal{border:1px solid var(--line);border-radius:13px;background:#fff;overflow:hidden;display:flex;flex-direction:column}.proposal.applied{border-color:#a1cbbd}.proposal-top{padding:18px 19px 13px}.proposal-title{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}.staff-name{font-size:18px;font-weight:700;letter-spacing:-.3px;margin-top:9px}.transfer{font-size:11px;color:var(--sub);margin-top:6px}.proposal-details{padding:0 19px 17px;flex:1}.checks{font-size:11px;color:#547c70;padding:10px 0;line-height:1.95}.cost-line{display:flex;justify-content:space-between;align-items:center;font-size:11px;border-top:1px solid #edf0f4;padding-top:11px;margin-top:5px;color:var(--sub)}.cost-value{font-size:19px;color:var(--ink);font-weight:700}.score-note{font-size:9px;color:#8391a2;margin-top:4px}.proposal-actions{padding:14px 18px;background:#fbfcfd;border-top:1px solid var(--line);display:flex;gap:7px;flex-wrap:wrap}.proposal-actions .btn-primary{flex:1}.status-info{font-size:11px;color:var(--sub);width:100%;margin-bottom:6px}.workflow{display:flex;gap:5px;margin-top:11px;font-size:9px;color:#8995a3;align-items:center;flex-wrap:wrap}.workflow .done{color:var(--primary);font-weight:700}.workflow .active{color:#a56f22;font-weight:700}.workflow i{font-style:normal;color:#c5cdd5}.empty{padding:52px 24px;text-align:center;background:#fff;border:1px dashed #d8e2ec;border-radius:14px}.empty h2{margin-bottom:8px}.empty p{color:var(--sub);font-size:12px;margin-bottom:18px}.section-description{font-size:12px;color:var(--sub);margin-bottom:20px;line-height:1.9}.exclusion{margin-top:20px}.exclusion summary{cursor:pointer;padding:15px 19px;font-size:12px;color:#5e7287;font-weight:600}.exclusion-list{padding:0 19px 15px}.exclusion-item{display:flex;gap:13px;padding:8px 0;border-top:1px solid #edf1f5;font-size:11px}.exclusion-item span:first-child{flex:0 0 80px;font-weight:600}.exclusion-item span:last-child{color:#7f8b9b}.filterbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:17px}.filterbar select,.input{border:1px solid #d8e0e9;border-radius:7px;padding:9px 12px;background:#fff;font-size:12px;color:var(--ink);min-height:40px}.roster-note{font-size:10px;color:var(--sub)}.shift-block{display:inline-flex;padding:4px 8px;border-radius:6px;background:#edf3f7;color:#617b92;font-size:10px;margin-right:4px}.shift-block.new{background:#e3f3ed;color:#277659}.shift-block.absent{background:#fff1ee;color:#b4766b;text-decoration:line-through}.audit-row{display:grid;grid-template-columns:150px 180px minmax(0,1fr);gap:16px;border-bottom:1px solid var(--line);padding:15px 20px;align-items:start}.audit-row:last-child{border-bottom:0}.audit-time{color:var(--sub);font-size:10px}.audit-id{color:#8393a5;font-size:10px;margin-top:3px}.audit-text{font-size:12px}.audit-type{font-size:10px;font-weight:600;color:#55758d;overflow-wrap:anywhere}.settings-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:21px;align-items:start}.form-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 16px}.form-label{font-size:12px;font-weight:600}.form-help{font-size:10px;color:var(--sub);margin-top:3px}.form-row input{width:100px}.form-unit{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--sub)}.notice{padding:12px 14px;background:#fff7e9;border:1px solid #f2e6cf;border-radius:9px;font-size:11px;color:#8b7049;margin-bottom:18px;line-height:1.8}.switch-row{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:13px 0;border-bottom:1px solid var(--line)}.switch-row:last-child{border-bottom:0}.switch-row input{width:18px;height:18px;accent-color:var(--primary)}.mock-label{display:inline-block;font-size:9px;color:#87672b;background:#fff4dc;padding:2px 6px;border-radius:4px;margin-top:8px}.toast{position:fixed;bottom:26px;left:calc(50% + 100px);transform:translateX(-50%);background:#22384c;color:#fff;border-radius:10px;padding:13px 20px;box-shadow:0 6px 30px #15223333;max-width:min(680px,90vw);font-size:12px;z-index:100}.toast.error{background:#823c3c}.footer{display:flex;justify-content:space-between;gap:12px;margin-top:25px;font-size:10px;color:#8b98a8}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.storage-note{font-size:10px;color:#936442;margin-bottom:10px}svg{flex-shrink:0}.kpi-strip{padding:14px 20px;font-size:11px;display:flex;gap:22px;border-top:1px solid var(--line);color:var(--sub);flex-wrap:wrap}.kpi-strip strong{font-weight:700;color:var(--ink);font-size:13px;margin-left:7px}.annotation{font-size:10px;color:#758698;margin:10px 0}.secondary-section{margin-top:26px}.history-proposals{display:flex;flex-direction:column;gap:9px}.history-item{padding:13px 17px;background:#fff;border:1px solid var(--line);border-radius:10px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:11px}.history-item small{color:var(--sub)}@media(min-width:1600px){.container{padding-top:36px}.metric{padding:21px}.hero{padding:25px}}@media(max-width:1250px){.content-grid{grid-template-columns:minmax(0,1fr)}.right-rail{display:grid;grid-template-columns:1fr 1fr;gap:18px}.soft-card{margin:0}.proposal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.container{padding:24px}.topbar{padding:0 24px}.demo-banner{padding:8px 24px}.metric{padding:14px}.facility-cell{min-width:150px}}@media(max-width:970px){.app-shell{grid-template-columns:180px minmax(0,1fr)}.sidebar{width:180px;padding:24px 10px}.brand{gap:8px;padding:0 7px 22px}.brand-name{font-size:16px}.brand-mark{width:31px;height:31px}.brand-sub{font-size:8px}.nav-button{font-size:12px;padding:12px 10px}.sidebar-note{padding:12px;font-size:10px}.top-date{display:none}.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{align-items:flex-start;flex-direction:column}.hero>.btn{margin-left:59px}.settings-grid{grid-template-columns:1fr}.audit-row{grid-template-columns:120px minmax(0,1fr)}.audit-type{grid-column:2;grid-row:1}.audit-text{grid-column:1/-1}.toast{left:calc(50% + 80px)}}@media(max-width:700px){.app-shell{display:block}.sidebar{position:sticky;top:0;display:block;width:100%;height:auto;padding:9px 14px;background:#142638;box-shadow:0 3px 14px #0d1e3322}.brand{padding:0;display:inline-flex}.brand-name{font-size:16px}.brand-sub{display:none}.brand-mark{width:26px;height:26px;border-radius:8px}.brand-mark svg{width:17px}.sidebar-caption,.sidebar-note,.version{display:none}.sidebar nav{display:flex;gap:6px;overflow:auto;margin-top:8px;padding-bottom:1px}.nav-button{padding:7px 10px;white-space:nowrap;width:auto;font-size:11px;gap:6px;min-height:33px}.nav-button svg{width:14px;height:14px}.nav-dot{display:none}.topbar{height:45px;padding:0 18px}.breadcrumb{font-size:10px}.avatar{width:26px;height:26px;font-size:9px}.demo-banner{padding:8px 18px;font-size:10px;line-height:1.65;align-items:flex-start}.container{padding:21px 17px}.page-head{align-items:flex-start;gap:12px;margin-bottom:19px}h1{font-size:22px}.eyebrow{font-size:9px}.subtitle{font-size:11px}.page-head>.actions{justify-content:flex-end;max-width:135px}.page-head .btn{padding:8px 10px;font-size:10px}.metrics{gap:10px;margin-bottom:16px}.metric{padding:13px}.metric-value{font-size:29px}.metric-label{font-size:10px}.metric-icon{height:23px;width:23px}.metric-note{font-size:9px}.hero{padding:16px;gap:13px;margin-bottom:20px}.hero-leading{gap:11px;align-items:flex-start}.hero-icon{height:35px;width:35px;border-radius:8px}.hero h2{font-size:13px;line-height:1.7}.hero p{font-size:10px}.hero>.btn{margin-left:46px}.card-head{padding:16px}.card-head h2{font-size:14px}.legend{gap:7px;font-size:9px}.card-body{padding:16px}.content-grid{gap:18px}.right-rail{grid-template-columns:1fr}.demand-grid{gap:10px}.demand-col{padding-right:10px}.demand-col h3{font-size:11px}.demand-bars{gap:8px}.demand-head{flex-direction:column;align-items:flex-start;gap:6px}.proposal-grid{grid-template-columns:1fr}.proposal-top{padding:16px}.proposal-details{padding:0 16px 15px}.group-header h2{font-size:14px}.section-description{font-size:11px}.group-header{align-items:flex-start}.footer{font-size:9px;flex-direction:column;gap:4px}.toast{left:50%;bottom:17px;min-width:85vw;padding:12px 16px;font-size:11px}.audit-row{padding:13px 16px;gap:6px 12px}.form-label{font-size:11px}.history-item{align-items:flex-start;flex-direction:column}.facility-name{font-size:11px}.top-right{gap:8px}.metrics .pill{font-size:9px}.exclusion-item{font-size:10px}.kpi-strip{gap:10px}.card-head.wrap-mobile{flex-wrap:wrap}.filterbar select{flex:1;min-width:110px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.btn{white-space:nowrap}.page-head>.actions{flex-shrink:0}

/* ---- M1 additions (login, signed-in principal, employee pages). Everything above is the source prototype. ---- */
.crumb-sep{padding:0 8px;color:#bcc7d1}
.who{display:flex;flex-direction:column;align-items:flex-end;font-size:12px;font-weight:650;line-height:1.35;max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.who small{font-size:10px;font-weight:500;color:var(--sub)}
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px 16px}
.login-card{width:min(420px,100%);padding:28px 26px;display:flex;flex-direction:column;gap:10px;overflow:visible}
.login-card h1{font-size:22px;margin-top:6px}
.login-card .subtitle{margin:0 0 8px}
.login-card .input{width:100%;margin-bottom:6px}
.login-card .btn{margin-top:8px}
.login-card .notice{margin-bottom:6px}
.login-brand{display:flex;gap:11px;align-items:center}
.login-brand .brand-mark{display:grid;place-items:center;width:36px;height:36px;background:#b4dfd7;border-radius:12px;color:#163b3a}
.login-name{font-size:17px;font-weight:760;letter-spacing:-.4px}
@media(max-width:700px){.who small{display:none}.who{max-width:110px;font-size:10px}.topbar .btn-small{padding:5px 8px;min-height:30px;font-size:10px}}

/* ---- M2 additions (month grid, forms for absence / labels / requirement). ---- */
.grid-month th{position:sticky;top:0;font-size:9px;padding:8px 6px;text-align:center;line-height:1.5}.grid-month tbody th{text-align:left;background:#fafbfd;font-size:11px;color:var(--ink);padding:6px 10px;white-space:nowrap}.grid-month td{padding:6px 6px;text-align:center;font-size:12px;border-bottom:1px solid #eef2f6}.grid-month .cell-min{font-size:10px;color:var(--sub)}.grid-month .cell-ok{background:#f3faf7;color:#2d6b57}.grid-month .cell-short{background:#fff0ec;color:#a4473b;font-weight:700}.grid-month .cell-none{color:#c0c8d2}
.plain-list{margin:8px 0 0;padding-left:18px;font-size:11px;line-height:1.9}.form-block{display:flex;flex-direction:column;gap:8px}.form-block .input{width:100%}.input.wide{width:min(360px,100%)}.form-row label{flex:1}
@media(max-width:700px){.page-head .actions .input{min-width:140px}}