:root{--navy:#173a59;--navy2:#23577f;--cyan:#2d8aa3;--ink:#18232d;--muted:#667684;--line:#d8e1e7;--bg:#eef3f6;--paper:#fff;--ok:#247a54;--warn:#a86812;--bad:#b43b42;--shadow:0 12px 34px rgba(20,49,70,.09)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:"Microsoft JhengHei","Noto Sans TC",sans-serif;font-size:16px}.shell{min-height:100vh;display:grid;grid-template-columns:250px 1fr}aside{background:var(--navy);color:white;padding:28px 18px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.brand{display:flex;gap:12px;align-items:center;padding:0 8px 28px}.brand .mark{width:42px;height:42px;border:1px solid #7db0cb;display:grid;place-items:center;font:700 24px Georgia;border-radius:10px}.brand b,.brand small{display:block}.brand small{opacity:.65;margin-top:2px}.nav{width:100%;text-align:left;border:0;color:#dbe9f1;background:transparent;padding:13px 16px;border-radius:9px;font:inherit;cursor:pointer;margin:3px 0}.nav:hover,.nav.active{background:#2b5877;color:white}.aside-note{margin-top:auto;padding:16px 10px;color:#a9c2d1;font-size:13px;line-height:1.7}main{padding:30px 38px 50px;max-width:1500px;width:100%;margin:auto}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}h1,h2,p{margin-top:0}h1{font-size:30px;margin-bottom:6px}header p,.panel-head span{color:var(--muted)}.actor{display:grid;gap:5px;font-size:13px;color:var(--muted)}input,select,textarea{border:1px solid #cbd7de;border-radius:8px;padding:10px 11px;background:white;color:var(--ink);font:inherit}.actor input{width:145px}.toolbar{display:flex;align-items:center;gap:10px;margin-bottom:18px}.toolbar strong{font-size:20px;min-width:130px;text-align:center}button{border:0;border-radius:8px;background:var(--navy2);color:white;padding:10px 15px;font:600 14px inherit;cursor:pointer}button:hover{filter:brightness(1.08)}button.ghost{background:white;color:var(--navy);border:1px solid var(--line)}button.icon{font-size:25px;background:transparent;color:var(--muted);padding:4px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}.metric{background:white;border:1px solid var(--line);padding:18px 20px;border-radius:12px;box-shadow:var(--shadow)}.metric small{color:var(--muted)}.metric strong{display:block;font-size:28px;margin-top:5px}.metric.ok strong{color:var(--ok)}.metric.warn strong{color:var(--warn)}.panel{background:var(--paper);border:1px solid var(--line);border-radius:13px;box-shadow:var(--shadow);overflow:hidden}.panel-head{padding:20px 22px 12px;display:flex;align-items:baseline;gap:12px}.panel-head h2{margin:0}.task-list,.record-table{width:100%}.task{display:grid;grid-template-columns:110px 1.4fr 1fr 120px 110px;gap:16px;padding:16px 22px;border-top:1px solid #e4eaee;align-items:center;cursor:pointer}.task:hover{background:#f6fafc}.task .date{font-weight:700}.task .name{font-weight:700}.task .summary{color:var(--muted);font-size:14px}.code{font-size:13px;color:var(--navy2)}.badge{justify-self:start;padding:5px 9px;border-radius:99px;font-size:12px;background:#e7edf1;color:#536572}.badge.draft{background:#fff0cc;color:#805d0a}.badge.submitted{background:#dfeefa;color:#235b80}.badge.approved{background:#dff2e8;color:#246846}.badge.rejected{background:#fae1e2;color:#983239}.empty{padding:42px;text-align:center;color:var(--muted);border-top:1px solid var(--line)}.record-row{display:grid;grid-template-columns:1fr 170px 120px 150px;gap:16px;padding:15px 22px;border-top:1px solid #e4eaee;align-items:center}.record-row b,.record-row small{display:block}.record-row small{color:var(--muted);margin-top:4px}.view{display:none}.view.active{display:block}dialog{width:min(760px,calc(100vw - 28px));max-height:90vh;border:0;border-radius:14px;padding:0;box-shadow:0 24px 80px rgba(0,0,0,.25)}dialog::backdrop{background:rgba(10,25,36,.58)}#record-form{padding:24px}.dialog-head{display:flex;justify-content:space-between}.dialog-head small{color:var(--cyan);font-weight:700}.dialog-head h2{margin:5px 0}.dialog-head p{color:var(--muted)}.fields{display:grid;grid-template-columns:1fr 1fr;gap:15px}.fields label{display:grid;gap:6px;font-weight:600;font-size:14px}.fields label.wide{grid-column:1/-1}.fields textarea{min-height:90px;resize:vertical}.evidence{margin-top:18px;padding:14px;background:#f2f6f8;border-radius:9px}.evidence label{display:flex;gap:12px;align-items:center}.evidence small{display:block;color:var(--muted);margin-top:6px}.dialog-actions{display:flex;justify-content:flex-end;gap:9px;align-items:center;margin-top:20px}.dialog-actions span{margin-right:auto;color:var(--muted);font-size:13px}#toast{position:fixed;right:24px;bottom:24px;background:var(--ink);color:white;padding:12px 16px;border-radius:9px;opacity:0;transform:translateY(8px);transition:.2s;pointer-events:none}#toast.show{opacity:1;transform:none}.review-actions{display:flex;gap:7px}.reject{background:var(--bad)}
@media(max-width:900px){.shell{grid-template-columns:1fr}aside{position:static;height:auto;flex-direction:row;align-items:center;padding:14px}.brand{padding:0;margin-right:auto}.brand small,.aside-note{display:none}nav{display:flex}.nav{width:auto}.task{grid-template-columns:90px 1fr 110px}.task .summary,.task .code{display:none}.metrics{grid-template-columns:1fr 1fr}main{padding:22px 16px}.record-row{grid-template-columns:1fr 110px}.record-row>*:nth-child(2),.record-row>*:nth-child(4){display:none}}
@media(max-width:560px){aside{display:block}.brand{margin-bottom:8px}header{display:block}.actor{margin-top:15px}.metrics{grid-template-columns:1fr 1fr}.task{grid-template-columns:75px 1fr 90px;padding:14px}.fields{grid-template-columns:1fr}.dialog-actions{flex-wrap:wrap}.dialog-actions span{width:100%}}