:root{--ink: #333333;--muted: #777777;--line: #ead8c4;--paper: #f6e6d4;--card: #ffffff;--orange: #f5a000;--orange-deep: #e08a1e;--danger: #d9534f;--ok: #1f7a4d;--shadow: 0 1px 2px rgba(0, 0, 0, .06)}*{box-sizing:border-box}html,body{height:100%}body{margin:0;color:var(--ink);background:var(--paper);font-family:"Source Sans 3",Segoe UI,sans-serif}h1,h2,h3{font-family:"Source Sans 3",Segoe UI,sans-serif;font-weight:600}button,input,select,textarea{font:inherit}a{color:var(--orange-deep)}.login-screen{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;background:#f6e6d4;padding:32px 16px}.login-logo{width:min(280px,80vw);height:auto}.signin-box{width:min(360px,100%);background:#fff;border:1px solid #ddd;box-shadow:0 1px 2px #0000000f}.signin-head{background:#f5f5f5;border-bottom:1px solid #ddd;color:#777;font-size:14px;padding:10px 15px}.signin-body{padding:15px;display:flex;flex-direction:column;gap:12px}.signin-box input{width:100%;border:1px solid #ccc;border-radius:4px;padding:8px 12px;font-size:14px}.signin-box input:focus{outline:none;border-color:#66afe9;box-shadow:inset 0 1px 1px #00000013,0 0 8px #66afe999}.signin-submit{width:100%;border:0;border-radius:4px;background:#ff7a00;color:#fff;font-weight:700;padding:10px 16px;cursor:pointer}.signin-submit:disabled{opacity:.7;cursor:default}.signin-error{margin:0;color:#d9534f;font-weight:700;text-align:center}.card{background:var(--card);border:1px solid var(--line);border-radius:4px;box-shadow:var(--shadow);padding:16px}.login-card{width:min(420px,100%)}label{display:block;font-size:13px;color:var(--muted);margin:14px 0 6px}input,select,textarea{width:100%;border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:#fff}textarea{min-height:90px}.btn{border:0;border-radius:4px;padding:8px 14px;background:var(--orange);color:#fff;cursor:pointer;font-weight:600}.btn.secondary{background:#fff;color:var(--ink);border:1px solid #e0c8a8}.btn.danger{background:var(--danger)}.btn.ghost{background:transparent;color:var(--orange-deep)}.btn:disabled{opacity:.6;cursor:default}.row-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.error{color:var(--danger)}.ok{color:var(--ok)}.app-frame{height:100vh;overflow:hidden;display:grid;grid-template-columns:250px 1fr;grid-template-rows:70px 1fr;grid-template-areas:"top top" "side main"}.top{grid-area:top;display:flex;align-items:center;background:#fff;border-bottom:3px solid #e7c89a;position:sticky;top:0;z-index:25}.menu-toggle{display:none;width:48px;height:70px;border:0;background:transparent;font-size:22px;color:#e08a1e;cursor:pointer}.top-logo{height:52px;margin-left:16px;display:block}.top-user{margin-left:auto;align-self:stretch;background:#f6a000;color:#fff;display:flex;align-items:center;gap:12px;padding:0 22px;cursor:pointer;position:relative;font-weight:600;min-width:160px;justify-content:flex-end}.top-user-menu{position:absolute;right:8px;top:calc(100% + 6px);background:#fff;color:#333;min-width:180px;border:1px solid #ead8c4;box-shadow:0 8px 20px #0000001f;z-index:30}.top-user-menu a,.top-user-menu button{display:block;width:100%;text-align:left;background:#fff;border:0;color:#333;text-decoration:none;padding:10px 14px;cursor:pointer}.top-user-menu a:hover,.top-user-menu button:hover{background:#f6e6d4}.side{grid-area:side;background:#fff;overflow:auto;min-height:0}.profile{display:flex;gap:12px;align-items:center;padding:18px 14px 14px;background:#fff}.avatar{width:54px;height:54px;border-radius:50%;background:#f3f3f3;color:#c5c5c5;display:grid;place-items:center;font-size:26px;flex:0 0 auto}.profile strong{display:block;color:#222}.online{color:#f6a000;font-size:13px;margin-top:2px}.dot{width:8px;height:8px;border-radius:50%;background:#f6a000;display:inline-block;margin-right:4px}.menu-parent,.menu-child{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;border:0;color:#fff;text-decoration:none;cursor:pointer;padding:12px 14px;font-weight:600;text-align:left}.menu-parent{background:#e0902a;border-bottom:1px solid rgba(255,255,255,.28)}.menu-parent i,.menu-child i{margin-right:8px}.menu-child{display:block;background:#f5a000;border-bottom:1px solid rgba(255,255,255,.35)}.menu-child.active,.menu-child:hover,.menu-parent:hover{filter:brightness(1.05)}.main{grid-area:main;background:#f6e6d4;padding:18px 22px 40px;min-width:0;min-height:0;overflow:auto}.main h1{font-size:28px;font-weight:500;color:#333;margin:6px 0 16px}.menu-scrim{display:none}.topbar{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:18px}.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}.stat strong{display:block;font-size:28px}table{width:100%;border-collapse:collapse;background:#fff}th,td{border:1px solid #ddd;padding:8px;text-align:left;vertical-align:middle;font-size:14px;background:#fff}th{font-weight:700;color:#333;white-space:nowrap}.data-table th{cursor:pointer}.data-table tbody tr:hover td{background:#f5f5f5}.data-table .fa{color:#bbb;margin-left:6px;font-size:12px}.btn-blue{background:#337ab7;color:#fff;border:1px solid #2e6da4;border-radius:4px;padding:6px 12px;cursor:pointer;font-weight:600}.btn-blue:hover{background:#286090}.btn-blue:disabled{background:#9bb8d3;border-color:#9bb8d3;cursor:default}.btn-link{background:transparent;border:0;color:#d9534f;cursor:pointer;margin-left:8px}.edit-link,.status-link{background:none;border:0;padding:0;color:#337ab7;font-weight:700;cursor:pointer}.employee-form{background:#fff;border:1px solid #ddd;padding:16px 22px 28px}.employee-form h1{font-size:24px;margin-bottom:8px}.employee-form h4{color:#00f;margin:18px 0 10px;font-size:18px;font-weight:700}.emp-columns{display:grid;grid-template-columns:1fr 1fr;gap:8px 36px}.employee-form label{margin:12px 0 6px;color:#333;font-size:14px}.employee-form input,.employee-form select{border:1px solid #ccc;border-radius:4px;height:34px;padding:6px 12px}.employee-form .check{display:flex;align-items:center;gap:8px;margin-top:8px}.employee-form .check input{width:auto;height:auto}.req{color:red}.emp-actions{display:flex;justify-content:center;gap:8px;margin-top:28px}.employee-form input[readonly]{background:#eee}.status-link.off{color:#d9534f}.grid-panel{background:#fff;border:1px solid #ddd;margin-top:12px}.budget-filter{max-width:720px;margin:18px auto 8px}.budget-field{display:grid;grid-template-columns:280px 1fr;gap:12px;align-items:center;margin-bottom:12px}.budget-field label{margin:0;text-align:right;color:#333}.budget-field select,.budget-field input{max-width:280px}.budget-submit{text-align:center;margin:8px 0 16px}.btn-orange{background:#ff4800;color:#fff;border:0;height:35px;padding:0 14px;cursor:pointer;font-weight:600}.budget-table thead tr:first-child th{background:#3c8dbc;color:#fff;cursor:pointer}.budget-table .filter-row th{background:#f3f3f3;cursor:default}.budget-list .data-table tbody tr:nth-child(odd) td{background:#ccc}.budget-list .data-table tbody tr:hover td{background:#bdbdbd}.detail-link{background:none;border:0;color:#3c8dbc;cursor:pointer;margin-right:6px;padding:0}.budget-dialog-backdrop{position:fixed;inset:70px 0 0;background:#00000059;z-index:30;display:grid;place-items:center;padding:24px}.budget-dialog{background:#fff;width:min(980px,100%);max-height:86vh;overflow:auto;padding:18px;border:1px solid #ddd}.budget-dialog h3{margin:0 0 12px}.budget-dialog .btn-orange,.budget-dialog .btn.secondary{margin-right:8px}.dt-buttons{display:flex;flex-wrap:wrap;gap:4px}.dt-buttons button{background:#fff;border:1px solid #999;border-radius:2px;padding:4px 10px;color:#333;cursor:pointer;font-size:13px}.dt-buttons button:hover{background:#e6e6e6}.grid-toolbar,.grid-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;flex-wrap:wrap}.page-size,.grid-search{display:flex;align-items:center;gap:8px;margin:0;color:#333;font-size:14px}.grid-toolbar select,.grid-toolbar input,.grid-search input{width:auto;border-radius:0;padding:4px 8px}.grid-search input{width:180px}.pager{display:flex;gap:6px}.pager button{background:#fff;border:1px solid #ddd;padding:6px 12px;cursor:pointer}.pager button:disabled{color:#aaa;cursor:default}.table-wrap{position:relative;overflow:auto;background:#fff;min-height:80px;max-height:520px}.data-table thead th{position:sticky;z-index:2;background:#fff}.data-table thead tr:first-child th{top:0}.filter-row th{top:38px;background:#f3f3f3;padding:4px}.filter-row input{width:100%;min-width:70px;height:28px;border-radius:2px;padding:2px 6px}.center-title{text-align:center;margin:18px 0 8px}.grid-loading{position:fixed;inset:70px 0 0 250px;z-index:40;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:#ffffffd1;color:#ff7a00;font-weight:700}.spinner{width:36px;height:36px;border:4px solid #f6e6d4;border-top-color:#ff7a00;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.notice-backdrop{position:fixed;inset:0;z-index:30;background:#00000059;display:grid;place-items:center;padding:16px}.notice-box{width:min(420px,100%);background:#fff;border-radius:8px;padding:22px 22px 18px;box-shadow:0 16px 40px #0003;text-align:center}.notice-box h3{margin:0 0 8px;color:#1f7a4d}.notice-box.bad h3{color:#d9534f}.notice-box p{margin:0 0 16px}.notice-box button{min-width:96px;border:0;border-radius:4px;background:#ff7a00;color:#fff;font-weight:700;padding:8px 18px;cursor:pointer}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.form-grid.single{grid-template-columns:1fr}.form-grid .wide{grid-column:1/-1}.search-select{position:relative;width:100%}.search-select-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:#fff;cursor:pointer;color:inherit}.search-select-btn .placeholder{color:#888}.search-select-panel{position:absolute;z-index:40;left:0;right:0;top:calc(100% + 4px);background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 24px #0000001f;padding:8px}.search-select-panel ul{list-style:none;margin:8px 0 0;padding:0;max-height:260px;overflow:auto}.search-select-panel li{padding:8px 10px;cursor:pointer;border-radius:6px}.search-select-panel li:hover,.search-select-panel li.active{background:#f6e6d4}.search-select-panel li.empty,.search-select-panel li.search-head{color:#666;cursor:default}.search-select-panel li.search-head,.search-select-panel li.search-head:hover{font-size:12px;font-weight:700;background:#f3f3f3}.search-select-panel.columns{width:max(100%,520px);right:auto}.search-select-panel.columns li{display:grid;grid-template-columns:repeat(var(--search-cols, 1),minmax(90px,1fr));gap:8px;align-items:center}.search-select-panel.columns li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.employee-form .search-select-btn{height:34px;border-radius:4px;border-color:#ccc;padding:6px 12px}.budget-field .search-select{max-width:280px}.drawer{position:fixed;top:70px;right:0;bottom:0;width:min(760px,100%);background:#fff;box-shadow:-20px 0 40px #0000001f;padding:22px;overflow:auto;z-index:20}.backdrop{position:fixed;inset:70px 0 0;background:#0b3f4559;z-index:19}.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}.gallery img{width:100%;height:140px;object-fit:cover;border-radius:10px;background:#e7eef0}.line{display:grid;grid-template-columns:1.2fr 1fr 100px 1fr;gap:8px;margin-bottom:8px}.check{display:flex;align-items:center;gap:8px;margin-top:22px}.check input{width:auto}@media(max-width:900px){.app-frame{grid-template-columns:1fr;grid-template-areas:"top" "main"}.menu-toggle{display:grid;place-items:center}.top-logo{height:42px;margin-left:4px}.top-user{min-width:0;padding:0 14px}.top-user span{display:none}.side{position:fixed;top:70px;left:0;bottom:0;width:min(280px,88vw);z-index:22;transform:translate(-105%);transition:transform .2s ease;box-shadow:8px 0 24px #00000026}.menu-open .side{transform:none}.menu-scrim{display:block;position:fixed;inset:70px 0 0;background:#00000059;z-index:21}.main{padding:14px}.grid-loading{left:0}.stats,.form-grid,.line,.emp-columns,.budget-field{grid-template-columns:1fr}.budget-field label{text-align:left}.topbar{flex-direction:column;align-items:stretch}.drawer{width:100%}}
