
:root{--navy:#12334e;--green:#168261;--bg:#f3f6f9;--red:#bd3c47}*{box-sizing:border-box}body{margin:0;font:15px system-ui,sans-serif;color:#18364b;background:var(--bg)}button,input,select,textarea{font:inherit}button{cursor:pointer;border:1px solid #d8e2e8;border-radius:9px;background:white;color:var(--navy);padding:10px 14px;display:inline-flex;align-items:center;justify-content:center;gap:7px}button:hover{background:#eaf2f5}button.primary{background:var(--navy);color:white}button.green{background:var(--green);color:white}svg{width:19px;height:19px;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}header{background:white;border-bottom:1px solid #dde5eb;padding:16px 5%;display:flex;align-items:center;justify-content:space-between;gap:16px}header img{width:175px;height:65px;object-fit:contain}.badge{color:#627788;font-size:12px}main{max-width:1200px;margin:auto;padding:30px 24px 70px}h1{font-size:29px;margin:8px 0}h2{font-size:21px}h3{margin:0 0 12px}p{line-height:1.5}small{color:#637888}.top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:25px;flex-wrap:wrap}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:18px}.card{background:white;border:1px solid #e0e7ec;border-radius:15px;padding:22px;box-shadow:0 4px 20px #17394c06;min-width:0}.navcard{text-align:left;display:block;min-height:164px;width:100%}.navcard .symbol{display:inline-flex;padding:12px;background:#edf4f8;border-radius:12px;margin-bottom:16px}.navcard svg{width:25px;height:25px}.navcard b{display:block;font-size:18px}.navcard small{display:block;margin-top:8px}.pending{border-top:4px solid var(--red)}.done{border-top:4px solid var(--green)}.state{font-size:12px;color:var(--red);font-weight:650}.done .state{color:var(--green)}.actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.marked{color:var(--green);background:#e5f5ed;border-color:#86c5ad}.row{display:flex;align-items:center;gap:10px;justify-content:space-between;padding:12px 0;border-bottom:1px solid #edf0f3}.row span{overflow-wrap:anywhere}.breadcrumb{margin-bottom:20px}.empty{padding:25px;color:#718494}.text{white-space:pre-wrap;overflow-wrap:anywhere}.pill{background:#e9f1f6;padding:5px 10px;border-radius:20px;font-size:12px}dialog{border:0;border-radius:17px;padding:27px;max-width:600px;width:calc(100% - 28px);max-height:90vh;box-shadow:0 20px 100px #10283a55}dialog::backdrop{background:#10283a88}label{display:block;margin:15px 0 6px;font-size:13px;font-weight:650}input,select,textarea{width:100%;border:1px solid #cbd8df;border-radius:8px;padding:11px;background:white;color:#17394d}textarea{min-height:140px;resize:vertical}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);padding:12px 20px;background:#17394d;color:white;border-radius:10px;z-index:20;display:none}footer{text-align:center;font-size:12px;color:#81919d;padding:18px} .docpreview{font-family:Georgia,serif;line-height:1.8} @media(max-width:600px){header{padding:12px 18px;flex-wrap:wrap}header img{width:140px}main{padding:22px 16px}.top{align-items:flex-start}h1{font-size:24px}.card{padding:18px}.row{flex-wrap:wrap}button{padding:10px} }

body{background:radial-gradient(ellipse at top right,#dcece8 0,transparent 45%),#f1f5fa}header{box-shadow:0 3px 20px #14374d0c;border-top:5px solid #168261}h1{font-size:34px;letter-spacing:-1px}.navcard{min-height:220px;border:0;border-bottom:5px solid #168261;background:linear-gradient(135deg,#12334e,#245671);color:white;transition:transform .18s,box-shadow .18s}.navcard:hover{background:linear-gradient(135deg,#17425c,#2c6983);transform:translateY(-5px);box-shadow:0 14px 25px #17394c25}.navcard .symbol{background:#ffffff18;padding:17px;border-radius:18px}.navcard svg{width:34px;height:34px}.navcard b{font-size:23px}.navcard small{color:#d2e5ec}.grid{gap:22px}.card{border-radius:18px}.pending{background:#b73040!important;border-color:#b73040!important;color:#fff!important}.done{background:#14754f!important;border-color:#14754f!important;color:#fff!important}.pending .state,.done .state,.pending small,.done small{color:#fff}.pending button,.done button{border-color:#fff8}.state{display:inline-block;background:#0002;color:white!important;padding:5px 10px;border-radius:20px;letter-spacing:.2px}.employee-block{display:flex;width:100%;margin:12px 0;text-align:left;justify-content:space-between;border:0;border-radius:12px;padding:18px;box-shadow:0 3px 10px #0002;transition:transform .15s}.employee-block:hover{transform:translateY(-2px);filter:brightness(1.08)}.employee-block span small{display:block;margin-top:5px}.employee-block strong{font-size:12px;white-space:nowrap}.channel-choice{margin:0;position:relative}.channel-choice input{position:absolute;opacity:0;width:1px}.channel-choice span{display:flex;align-items:center;gap:7px;border:1px solid #d1dce4;border-radius:9px;padding:12px;cursor:pointer}.channel-choice input:checked+span{background:#12334e;color:white;border-color:#12334e}.channel-choice input:focus-visible+span{outline:3px solid #5c9cc1}.company-channel{font-weight:600;color:#446375}button:focus-visible{outline:3px solid #72b9d2;outline-offset:3px}@media(min-width:850px){.grid:has(.navcard){grid-template-columns:repeat(2,1fr)}}

.compact{padding:15px!important;border-radius:13px;cursor:pointer;transition:transform .15s,box-shadow .15s}.compact:hover{transform:translateY(-2px);box-shadow:0 7px 18px #12334e22}.compact h2{font-size:17px;line-height:1.3;margin:11px 0 7px;overflow-wrap:anywhere}.compact .actions{gap:6px;margin-top:13px}.compact .state{font-size:11px;padding:3px 8px}.icon-button{width:34px;height:34px;padding:7px;background:#ffffff;color:#17394d;border:1px solid #ffffff80}.icon-button.marked{background:#d0f7dd;color:#064d30;box-shadow:inset 0 0 0 2px #075c39}.icon-button:hover{background:#e4eff5;transform:translateY(-1px)}.finished{background:#596574!important;color:#fff!important;border-color:#596574!important}.finished small,.finished .state{color:#fff!important}.navcard{min-height:160px;padding:20px}.navcard .symbol{padding:10px;margin-bottom:12px}.navcard svg{width:28px;height:28px}.navcard b{font-size:20px}.employee-block{margin:0;padding:15px}.grid{grid-template-columns:repeat(auto-fit,minmax(235px,1fr));gap:15px}.company-channel,.breadcrumb{font-size:13px;margin:12px 0}.breadcrumb{color:#5d7282}.navcard small{font-size:12px}h1{font-size:28px}.top{margin-bottom:20px}main{padding-top:24px}
.period-bar{display:flex;align-items:center;gap:10px;margin:0 0 22px;flex-wrap:wrap}.period-bar select{width:155px}.period-bar input{width:100px}.period-bar strong{margin-right:8px;color:#456074}
.blue{background:#155daa!important;color:white!important;border-color:#155daa!important}.blue small{color:white}.employee-card{display:flex;gap:10px;align-items:center}.employee-body{display:flex;justify-content:space-between;gap:12px;flex:1;border:0;background:transparent!important;color:inherit;padding:0;text-align:left}.employee-body span{overflow-wrap:anywhere}.employee-body small{display:block;margin-top:6px}.employee-body strong{font-size:11px}.history-item{padding:14px 0;border-bottom:1px solid #d9e2e8}.model-preview{background:#edf3f7;border-radius:9px;padding:14px}
button.danger{background:#b73040;color:white;border-color:#b73040}.employee-card{flex-wrap:wrap}.employee-body{min-width:140px}.employee-card>.icon-button{flex-shrink:0}
footer{max-width:1200px;margin:auto;display:flex;gap:16px;justify-content:space-between;align-items:center;padding:18px 24px}.backup-button{font-size:12px;padding:7px 11px;background:transparent;color:#617486;border-color:#d9e2e8}.backup-actions{display:grid;gap:12px;margin:20px 0}.file-input{padding:12px}

[hidden]{display:none!important}#auth-view{max-width:420px;margin:60px auto;padding:24px}.overlay{position:fixed;inset:0;background:#fffffff2;z-index:1000;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:25px}.overlay button{margin:6px}.cloud-status{font-size:.8rem}#auth-view input{display:block;width:100%;margin:8px 0 18px}#auth-error{color:#9b2226}dialog{z-index:2000}