:root{--bg: #f4f3ee;--surface: #ffffff;--surface-2: #fafaf7;--surface-3: #f0eee7;--surface-sunken: #ebe9e1;--ink-1: #14181f;--ink-2: #2c333d;--ink-3: #525a66;--ink-4: #8a8f99;--ink-5: #b8bac0;--rule-1: #1a2230;--rule-2: #d6d3c7;--rule-3: #e6e3d8;--navy: #0e2547;--navy-2: #142e54;--navy-soft: #1a3460;--navy-tint: #e8edf4;--saffron: #c8651b;--saffron-tint: #f5e6d4;--gold: #a37810;--emerald: #2f6b3a;--emerald-tint: #dcead8;--crimson: #a8331f;--crimson-tint: #f3dcd6;--status-pending: #6b5510;--status-pending-bg: #f3ecd0;--status-ongoing: #1a4b80;--status-ongoing-bg: #dde6f1;--status-completed: #2f6b3a;--status-completed-bg: #dcead8;--status-rejected: #6e6e72;--status-rejected-bg: #e3e1d9;--urgency-very: #9a1d12;--urgency-very-bg: #f3dcd6;--urgency-urgent: #b3590f;--urgency-urgent-bg: #f5e6d4;--urgency-normal: #3a4555;--urgency-normal-bg: #e1e5ec;--row-h: 40px;--pad-1: 6px;--pad-2: 10px;--pad-3: 14px;--pad-4: 18px;--pad-5: 24px;--radius-1: 3px;--radius-2: 5px;--radius-3: 8px;--font-sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;--font-serif: "Source Serif 4", "Source Serif Pro", "Georgia", serif;--font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;--shadow-1: 0 1px 0 rgba(20, 24, 31, .04), 0 1px 2px rgba(20, 24, 31, .04);--shadow-2: 0 2px 8px rgba(20, 24, 31, .06), 0 1px 2px rgba(20, 24, 31, .04);--shadow-pop: 0 12px 32px rgba(20, 24, 31, .18), 0 2px 6px rgba(20, 24, 31, .08)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--font-sans);font-size:13px;line-height:1.45;color:var(--ink-2);background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}#root{min-height:100vh}button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}a{color:var(--navy-2);text-decoration:none}a:hover{text-decoration:underline}.font-serif{font-family:var(--font-serif)}.font-mono{font-family:var(--font-mono)}.h-display{font-family:var(--font-serif);font-weight:600;font-size:22px;letter-spacing:-.01em;color:var(--ink-1)}.h-1{font-size:18px;font-weight:600;color:var(--ink-1);letter-spacing:-.005em}.h-2{font-size:14px;font-weight:600;color:var(--ink-1);letter-spacing:.005em}.eyebrow{font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-4)}.label{font-size:11.5px;font-weight:500;color:var(--ink-3);letter-spacing:.02em}.muted{color:var(--ink-4)}.tabular{font-variant-numeric:tabular-nums}.btn{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 14px;border:1px solid var(--rule-2);background:var(--surface);color:var(--ink-1);font-size:12.5px;font-weight:500;border-radius:var(--radius-2);cursor:pointer;transition:background 80ms ease,border-color 80ms ease,color 80ms ease;white-space:nowrap}.btn:hover{background:var(--surface-3);border-color:#b9b6a8}.btn:active{background:var(--surface-sunken)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--navy);border-color:var(--navy);color:#fff}.btn-primary:hover{background:var(--navy-2);border-color:var(--navy-2)}.btn-primary:active{background:#0a1d39}.btn-danger{background:var(--crimson);border-color:var(--crimson);color:#fff}.btn-danger:hover{background:#8d2916}.btn-ghost{background:transparent;border-color:transparent;color:var(--ink-2)}.btn-ghost:hover{background:var(--surface-3)}.btn-sm{height:26px;padding:0 10px;font-size:11.5px}.btn-lg{height:38px;padding:0 18px;font-size:13.5px}.btn-icon{width:32px;height:32px;padding:0;justify-content:center}.field{display:flex;flex-direction:column;gap:5px;min-width:0}.field-label{font-size:11.5px;font-weight:500;color:var(--ink-3);letter-spacing:.01em;display:flex;align-items:center;gap:4px}.field-label .req{color:var(--crimson);font-weight:600}.field-hint{font-size:11px;color:var(--ink-4)}.field-error{font-size:11px;color:var(--crimson)}.input,.select,.textarea{width:100%;height:34px;padding:0 10px;background:var(--surface);border:1px solid var(--rule-2);border-radius:var(--radius-1);color:var(--ink-1);font-size:12.5px;outline:none;transition:border-color 80ms ease,box-shadow 80ms ease}.input::placeholder,.textarea::placeholder{color:var(--ink-5)}.input:hover,.select:hover,.textarea:hover{border-color:#b9b6a8}.input:focus,.select:focus,.textarea:focus{border-color:var(--navy);box-shadow:0 0 0 3px #0e25471f}.textarea{height:auto;padding:8px 10px;resize:vertical;min-height:80px;line-height:1.5}.select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path fill='%23525a66' d='M0 0l5 6 5-6z'/></svg>");background-repeat:no-repeat;background-position:right 10px center;padding-right:28px}.input.compact,.select.compact{height:28px;font-size:12px}.input.error,.select.error,.textarea.error{border-color:var(--crimson)}.checkbox,.radio{width:14px;height:14px;accent-color:var(--navy);margin:0}.field-row{display:flex;align-items:center;gap:8px}.panel{background:var(--surface);border:1px solid var(--rule-3);border-radius:var(--radius-2)}.panel-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid var(--rule-3)}.panel-body{padding:16px}.section-divider{display:flex;align-items:center;gap:12px;margin:18px 0 10px}.section-divider .num{width:22px;height:22px;border-radius:999px;background:var(--navy);color:#fff;font-family:var(--font-serif);font-size:12px;display:flex;align-items:center;justify-content:center;font-weight:600}.section-divider .title{font-family:var(--font-serif);font-weight:600;font-size:15px;color:var(--ink-1)}.section-divider .line{flex:1;height:1px;background:var(--rule-3)}.pill{display:inline-flex;align-items:center;gap:5px;padding:2px 8px;height:20px;border-radius:999px;font-size:10.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;border:1px solid transparent}.pill .dot{width:6px;height:6px;border-radius:999px;background:currentColor}.pill.status-Completed{color:var(--status-completed);background:var(--status-completed-bg)}.pill.status-Ongoing{color:var(--status-ongoing);background:var(--status-ongoing-bg)}.pill.status-Pending{color:var(--status-pending);background:var(--status-pending-bg)}.pill.status-Rejected,.pill.status-Cannot{color:var(--status-rejected);background:var(--status-rejected-bg)}.pill.status-Filed{color:var(--status-ongoing);background:var(--status-ongoing-bg)}.pill.status-Awaiting{color:var(--status-pending);background:var(--status-pending-bg)}.pill.urg-Urgent{color:var(--urgency-urgent);background:var(--urgency-urgent-bg)}.pill.urg-Very{color:var(--urgency-very);background:var(--urgency-very-bg)}.pill.urg-Normal{color:var(--urgency-normal);background:var(--urgency-normal-bg)}.tbl-wrap{background:var(--surface);border:1px solid var(--rule-3);border-radius:var(--radius-2);overflow:hidden}.tbl{width:100%;border-collapse:collapse;font-size:12.5px}.tbl th{text-align:left;font-size:10.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-4);padding:9px 14px;background:var(--surface-2);border-bottom:1px solid var(--rule-2);white-space:nowrap;position:sticky;top:0;z-index:1}.tbl td{padding:10px 14px;border-bottom:1px solid var(--rule-3);vertical-align:middle;color:var(--ink-2)}.tbl tr:last-child td{border-bottom:none}.tbl tbody tr{transition:background 60ms ease}.tbl tbody tr:hover{background:var(--surface-2)}.tbl tbody tr.clickable{cursor:pointer}.tbl tbody tr.clickable:hover{background:var(--navy-tint)}.tbl td.id{font-family:var(--font-mono);font-size:11.5px;color:var(--ink-1);font-weight:500}.tbl td.num{font-variant-numeric:tabular-nums;text-align:right}.app-shell{display:grid;grid-template-columns:232px 1fr;grid-template-rows:56px 1fr;height:100vh;overflow:hidden}.app-header{grid-column:1 / -1;background:var(--navy);color:#fff;display:flex;align-items:center;padding:0 16px 0 0;border-bottom:1px solid #000;position:relative;z-index:5}.app-sidebar{background:#0a1a31;color:#cfd5e0;border-right:1px solid rgba(255,255,255,.06);display:flex;flex-direction:column;padding:8px 0;overflow-y:auto}.app-main{background:var(--bg);overflow:auto;position:relative}.brand-mark{width:232px;height:100%;display:flex;align-items:center;gap:10px;padding:0 14px;border-right:1px solid rgba(255,255,255,.08);background:#081428;flex-shrink:0}.brand-emblem{width:32px;height:32px;border-radius:999px;background:radial-gradient(circle at 35% 30%,#f3c66a,#c8651b 60%,#8a3f0c);position:relative;flex-shrink:0;border:1px solid rgba(0,0,0,.3);box-shadow:inset 0 -2px 4px #0000004d,0 0 0 2px #ffffff0d}.brand-emblem:before{content:"";position:absolute;top:6px;right:6px;bottom:6px;left:6px;border-radius:999px;border:1px solid rgba(255,255,255,.4)}.brand-emblem:after{content:"";position:absolute;top:11px;right:11px;bottom:11px;left:11px;border-radius:999px;background:#081428e6}.brand-text{display:flex;flex-direction:column;line-height:1.1;min-width:0}.brand-text .l1{font-family:var(--font-serif);font-size:14px;font-weight:600;color:#fff;letter-spacing:.005em;white-space:nowrap}.brand-text .l2{font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:#c8651b;font-weight:600;margin-top:2px}.header-search{flex:1;display:flex;align-items:center;padding:0 18px;max-width:540px}.header-search-inner{width:100%;display:flex;align-items:center;gap:8px;height:32px;padding:0 12px;background:#ffffff14;border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-1);color:#cfd5e0;cursor:text}.header-search-inner:hover{background:#ffffff1f}.header-search-inner input{flex:1;background:transparent;border:none;outline:none;color:#fff;font-size:12.5px}.header-search-inner input::placeholder{color:#8a96aa}.header-search-inner kbd{font-family:var(--font-mono);font-size:10px;padding:1px 5px;border:1px solid rgba(255,255,255,.18);border-radius:3px;color:#b3bccc}.header-actions{margin-left:auto;display:flex;align-items:center;gap:4px;height:100%;flex-shrink:0}.header-actions .header-btn{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 10px;background:transparent;border:1px solid transparent;border-radius:var(--radius-1);color:#cfd5e0;cursor:pointer;font-size:12px;position:relative}.header-actions .header-btn:hover{background:#ffffff14;color:#fff}.header-actions .badge-dot{position:absolute;top:6px;right:6px;width:7px;height:7px;background:var(--saffron);border-radius:999px;border:1.5px solid var(--navy)}.role-switcher{display:flex;align-items:center;gap:8px;height:36px;padding:0 10px 0 12px;margin-left:8px;background:#ffffff14;border:1px solid rgba(255,255,255,.12);border-radius:var(--radius-1);cursor:pointer;color:#fff;position:relative}.role-switcher:hover{background:#ffffff24}.role-switcher .avatar{width:22px;height:22px;border-radius:999px;background:var(--saffron);color:#fff;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700}.role-switcher .role-text{display:flex;flex-direction:column;line-height:1.15;align-items:flex-start;min-width:0}.role-switcher .role-text .name{font-size:11.5px;font-weight:600;white-space:nowrap}.role-switcher .role-text .role{font-size:10px;color:#b3bccc;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}.nav-section-title{font-size:9.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#6a7689;padding:14px 18px 6px}.nav-item{display:flex;align-items:center;gap:10px;padding:7px 18px;font-size:12.5px;color:#b3bccc;cursor:pointer;border-left:2px solid transparent;transition:background 60ms ease,color 60ms ease;-webkit-user-select:none;user-select:none}.nav-item:hover{background:#ffffff0a;color:#fff}.nav-item.active{background:#c8651b1a;color:#fff;border-left-color:var(--saffron)}.nav-item .ico{width:16px;height:16px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.nav-item .count{margin-left:auto;font-family:var(--font-mono);font-size:10.5px;background:#ffffff14;padding:1px 6px;border-radius:3px;color:#cfd5e0}.nav-item.active .count{background:#c8651b4d;color:#fff}.sidebar-foot{margin-top:auto;padding:14px 18px;border-top:1px solid rgba(255,255,255,.05);font-size:10.5px;color:#6a7689;letter-spacing:.04em}.page{padding:22px 28px 60px;max-width:1480px;margin:0 auto}.page-header{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid var(--rule-2);min-width:0}.page-header .title-block{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}.page-header .crumbs{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--ink-4);letter-spacing:.04em;text-transform:uppercase;font-weight:500}.page-header .crumbs .sep{color:var(--rule-2)}.toolbar{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--surface);border:1px solid var(--rule-3);border-radius:var(--radius-2);margin-bottom:14px}.toolbar .sp{width:1px;height:18px;background:var(--rule-2)}.toolbar .grow{flex:1}.search-input{display:flex;align-items:center;gap:8px;height:30px;padding:0 10px;background:var(--surface-2);border:1px solid var(--rule-3);border-radius:var(--radius-1);min-width:240px}.search-input input{flex:1;border:none;background:transparent;outline:none;font-size:12.5px}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}.stat-tile{background:var(--surface);border:1px solid var(--rule-3);border-left:3px solid var(--navy);border-radius:var(--radius-2);padding:14px 16px;display:flex;flex-direction:column;gap:4px}.stat-tile.acc-saffron{border-left-color:var(--saffron)}.stat-tile.acc-emerald{border-left-color:var(--emerald)}.stat-tile.acc-crimson{border-left-color:var(--crimson)}.stat-tile.acc-gold{border-left-color:var(--gold)}.stat-tile .lbl{font-size:10.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-4)}.stat-tile .val{font-family:var(--font-serif);font-size:26px;font-weight:600;color:var(--ink-1);letter-spacing:-.01em;font-variant-numeric:tabular-nums}.stat-tile .delta{font-size:11px;color:var(--ink-3)}.stat-tile .delta.up{color:var(--emerald)}.stat-tile .delta.down{color:var(--crimson)}.login-shell{min-height:100vh;background:radial-gradient(900px 600px at 80% -10%,rgba(200,101,27,.1),transparent 60%),radial-gradient(800px 500px at -10% 110%,rgba(14,37,71,.12),transparent 60%),var(--bg);display:grid;grid-template-columns:1fr 460px}.login-left{padding:60px 60px 40px;display:flex;flex-direction:column;justify-content:space-between;position:relative}.login-right{background:var(--surface);border-left:1px solid var(--rule-2);padding:60px 48px 40px;display:flex;flex-direction:column;justify-content:center}.tabs{display:flex;align-items:center;border-bottom:1px solid var(--rule-2);gap:0}.tab{padding:10px 16px;font-size:12.5px;font-weight:500;color:var(--ink-3);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;display:flex;align-items:center;gap:6px}.tab:hover{color:var(--ink-1)}.tab.active{color:var(--ink-1);border-bottom-color:var(--navy);font-weight:600}.tab .count{font-family:var(--font-mono);font-size:10.5px;background:var(--surface-3);color:var(--ink-3);padding:1px 6px;border-radius:3px}.tab.active .count{background:var(--navy-tint);color:var(--navy-2)}.file-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 8px 4px 6px;background:var(--surface-2);border:1px solid var(--rule-3);border-radius:var(--radius-1);font-size:11.5px;color:var(--ink-2)}.file-chip .ext{font-family:var(--font-mono);font-size:9.5px;font-weight:700;letter-spacing:.04em;padding:1px 4px;border-radius:2px;background:var(--navy);color:#fff;text-transform:uppercase}.file-chip .ext.pdf{background:var(--crimson)}.file-chip .ext.jpg,.file-chip .ext.jpeg,.file-chip .ext.png{background:var(--emerald)}.file-chip .ext.doc,.file-chip .ext.docx{background:#2a4a8a}.file-chip .ext.xls,.file-chip .ext.xlsx{background:var(--emerald)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 24px;color:var(--ink-4);text-align:center;gap:10px}.divider{height:1px;background:var(--rule-3);margin:14px 0}@keyframes fade-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-in-right{0%{transform:translate(100%)}to{transform:translate(0)}}.fade-in{animation:fade-in .18s ease}.slide-in-right{animation:slide-in-right .22s ease}.app-main::-webkit-scrollbar,.scroll-y::-webkit-scrollbar{width:10px;height:10px}.app-main::-webkit-scrollbar-thumb,.scroll-y::-webkit-scrollbar-thumb{background:#cdcabd;border-radius:999px;border:2px solid var(--bg)}.app-main::-webkit-scrollbar-track{background:transparent}.scroll-y{overflow-y:auto}.row{display:flex;align-items:center;gap:8px}.col{display:flex;flex-direction:column;gap:8px}.gap-2{gap:4px}.gap-3{gap:6px}.gap-4{gap:8px}.gap-5{gap:10px}.gap-6{gap:14px}.gap-8{gap:18px}.flex-1{flex:1}.mt-2{margin-top:4px}.mt-4{margin-top:8px}.mt-6{margin-top:14px}.mt-8{margin-top:18px}.mt-12{margin-top:24px}.mb-2{margin-bottom:4px}.mb-4{margin-bottom:8px}.mb-6{margin-bottom:14px}.mb-8{margin-bottom:18px}.text-xs{font-size:11px}.text-sm{font-size:12px}.text-md{font-size:13px}.text-lg{font-size:14px}.fw-500{font-weight:500}.fw-600{font-weight:600}.text-ink1{color:var(--ink-1)}.text-ink3{color:var(--ink-3)}.text-ink4{color:var(--ink-4)}.text-right{text-align:right}.text-center{text-align:center}.no-wrap{white-space:nowrap}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.w-full{width:100%}
