@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600;700&family=Space+Mono:wght@400;700&display=swap";:root{--bg: #080c14;--surface: #0d1424;--surface2: #111b2e;--surface3: #172035;--border: rgba(99,143,255,.12);--border-glow: rgba(99,143,255,.35);--ink: #f0f4ff;--ink-dim: #b8ccec;--ink-muted: #7e9abf;--indigo: #4f6ef7;--indigo-glow: rgba(79,110,247,.25);--amber: #f5a623;--amber-glow: rgba(245,166,35,.2);--green: #22d07a;--green-glow: rgba(34,208,122,.18);--red: #f05252;--red-glow: rgba(240,82,82,.18);--cyan: #38d9f5;--cyan-glow: rgba(56,217,245,.18);--font-ui: "DM Sans", sans-serif;--font-mono: "Space Mono", monospace;--r: 12px;--r-lg: 18px;--shadow: 0 4px 24px rgba(0,0,0,.45);--grid-line: rgba(99,143,255,.03)}:root.light{--bg: #f0f4fa;--surface: #ffffff;--surface2: #f5f7fc;--surface3: #eaeff8;--border: rgba(79,110,247,.13);--border-glow: rgba(79,110,247,.32);--ink: #0f172a;--ink-dim: #334155;--ink-muted: #5a6e8a;--indigo: #4560e8;--indigo-glow: rgba(69,96,232,.18);--amber: #d97706;--amber-glow: rgba(217,119,6,.15);--green: #16a34a;--green-glow: rgba(22,163,74,.15);--red: #dc2626;--red-glow: rgba(220,38,38,.15);--cyan: #0891b2;--cyan-glow: rgba(8,145,178,.15);--shadow: 0 4px 24px rgba(15,23,42,.1);--grid-line: rgba(79,110,247,.04)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px}body{font-family:var(--font-ui);background:var(--bg);color:var(--ink);min-height:100vh;background-image:linear-gradient(var(--grid-line) 1px,transparent 1px),linear-gradient(90deg,var(--grid-line) 1px,transparent 1px);background-size:48px 48px;transition:background .25s ease,color .25s ease}:root.light *,:root.light *:before,:root.light *:after,:root:not(.light) *,:root:not(.light) *:before,:root:not(.light) *:after{transition-property:background-color,border-color,color,fill,stroke;transition-duration:.22s;transition-timing-function:ease}#root{min-height:100vh}.app-shell{display:grid;grid-template-columns:240px 1fr;min-height:100vh}.sidebar{background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:0;position:sticky;top:0;height:100vh;overflow:hidden}.brand{display:flex;align-items:center;gap:10px;padding:22px 20px 16px;border-bottom:1px solid var(--border)}.brand-icon{width:32px;height:32px;background:linear-gradient(135deg,var(--indigo),#7c3aed);border-radius:8px;display:grid;place-items:center;font-size:18px;flex-shrink:0;box-shadow:0 0 16px var(--indigo-glow)}.brand-text{display:flex;flex-direction:column;line-height:1.1}.brand-name{font-weight:700;font-size:.95rem;color:var(--ink);letter-spacing:.02em}.brand-sub{font-size:.72rem;color:var(--ink-muted);text-transform:uppercase;letter-spacing:.08em}.sidebar-nav{padding:12px 10px;flex:1;display:flex;flex-direction:column;gap:2px;overflow-y:auto}.nav-section-label{font-size:.7rem;color:var(--ink-muted);text-transform:uppercase;letter-spacing:.1em;padding:10px 10px 4px}.nav-item{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;color:var(--ink-dim);text-decoration:none;font-size:.9rem;font-weight:500;transition:background .15s,color .15s;position:relative}.nav-item:hover{background:var(--surface3);color:var(--ink)}.nav-item.active{background:linear-gradient(90deg,#4f6ef72e,#4f6ef70f);color:#809fff;border-left:3px solid var(--indigo);padding-left:7px}.nav-icon{font-size:1.05rem;width:22px;text-align:center;flex-shrink:0;line-height:1}.sidebar-footer{padding:12px 10px;border-top:1px solid var(--border)}.user-card{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px}.user-avatar{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--indigo),var(--cyan));display:grid;place-items:center;font-size:.7rem;font-weight:700;color:#fff;flex-shrink:0}.user-info{flex:1;min-width:0}.user-name{font-size:.85rem;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-role{font-size:.75rem;color:var(--ink-muted)}.main-content{display:flex;flex-direction:column;min-width:0}.topbar{background:var(--surface);border-bottom:1px solid var(--border);padding:12px 24px;display:flex;align-items:center;gap:12px;position:sticky;top:0;z-index:50}.topbar-left{flex:1}.page-breadcrumb{font-size:.78rem;color:var(--ink-muted);text-transform:uppercase;letter-spacing:.08em;font-family:var(--font-mono)}.topbar-right{display:flex;align-items:center;gap:8px}.search-wrap{position:relative}.search-wrap .search-icon{position:absolute;left:11px;top:50%;transform:translateY(-50%);font-size:.85rem;color:var(--ink-muted);pointer-events:none}.search{background:var(--surface2);border:1px solid var(--border);color:var(--ink);border-radius:10px;padding:7px 12px 7px 32px;font-size:.82rem;font-family:var(--font-ui);width:280px;transition:border-color .2s}.search:focus{outline:none;border-color:var(--indigo);box-shadow:0 0 0 3px var(--indigo-glow)}.search::placeholder{color:var(--ink-muted)}.icon-btn{width:34px;height:34px;border-radius:8px;border:1px solid var(--border);background:var(--surface2);color:var(--ink-dim);display:grid;place-items:center;cursor:pointer;font-size:1rem;position:relative;transition:background .15s,color .15s}.icon-btn:hover{background:var(--surface3);color:var(--ink)}.notif-dot{position:absolute;top:6px;right:7px;width:6px;height:6px;background:var(--red);border-radius:50%;box-shadow:0 0 6px var(--red)}.avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--indigo),var(--cyan));display:grid;place-items:center;font-size:.72rem;font-weight:700;cursor:pointer;box-shadow:0 0 10px var(--indigo-glow)}.page-content{padding:24px;flex:1}.page-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:24px;gap:16px}.page-title{font-size:1.6rem;font-weight:700;color:var(--ink);line-height:1.1}.page-subtitle{font-size:.9rem;color:var(--ink-muted);margin-top:4px}.btn{display:inline-flex;align-items:center;gap:7px;padding:9px 18px;border-radius:10px;border:none;font-family:var(--font-ui);font-size:.9rem;font-weight:600;cursor:pointer;transition:all .15s;white-space:nowrap}.btn-primary{background:var(--indigo);color:#fff;box-shadow:0 0 16px var(--indigo-glow)}.btn-primary:hover{background:#6278f8;transform:translateY(-1px);box-shadow:0 4px 20px var(--indigo-glow)}.btn-primary:active{transform:translateY(0)}.btn-ghost{background:var(--surface2);color:var(--ink-dim);border:1px solid var(--border)}.btn-ghost:hover{background:var(--surface3);color:var(--ink)}.btn-danger{background:#f052521f;color:var(--red);border:1px solid rgba(240,82,82,.25)}.btn-danger:hover{background:#f0525233}.btn-sm{padding:6px 12px;font-size:.82rem;border-radius:7px}.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}.kpi-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:20px;position:relative;overflow:hidden;transition:border-color .2s,transform .2s}.kpi-card:hover{border-color:var(--border-glow);transform:translateY(-2px)}.kpi-card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;border-radius:var(--r-lg) var(--r-lg) 0 0}.kpi-card.indigo:before{background:linear-gradient(90deg,var(--indigo),#7c3aed)}.kpi-card.amber:before{background:linear-gradient(90deg,var(--amber),#f97316)}.kpi-card.red:before{background:linear-gradient(90deg,var(--red),#f97316)}.kpi-card.green:before{background:linear-gradient(90deg,var(--green),var(--cyan))}.kpi-glyph{font-size:1.4rem;margin-bottom:10px}.kpi-label{font-size:.8rem;font-weight:700;color:var(--ink-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px}.kpi-value{font-size:2rem;font-weight:700;color:var(--ink);font-family:var(--font-mono);line-height:1}.kpi-sub{font-size:.78rem;color:var(--ink-muted);margin-top:4px}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden}.panel-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border);gap:12px}.panel-title{font-size:1rem;font-weight:600;color:var(--ink)}.panel-body{padding:20px}.table{width:100%;border-collapse:collapse}.table th{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-muted);font-family:var(--font-mono);padding:11px 16px;border-bottom:1px solid var(--border);text-align:left;white-space:nowrap}.table td{padding:13px 16px;border-bottom:1px solid var(--border);font-size:.9rem;color:var(--ink)}.table tr:last-child td{border-bottom:none}.table tbody tr{transition:background .12s}.table tbody tr:hover{background:var(--surface2)}.pill{display:inline-flex;align-items:center;gap:5px;padding:4px 11px;border-radius:999px;font-size:.78rem;font-weight:600;letter-spacing:.03em;white-space:nowrap}.pill:before{content:"";width:5px;height:5px;border-radius:50%;flex-shrink:0}.pill.success{background:#22d07a1f;color:var(--green);border:1px solid rgba(34,208,122,.25)}.pill.success:before{background:var(--green);box-shadow:0 0 4px var(--green)}.pill.warning{background:#f5a6231f;color:var(--amber);border:1px solid rgba(245,166,35,.25)}.pill.warning:before{background:var(--amber)}.pill.danger{background:#f052521f;color:var(--red);border:1px solid rgba(240,82,82,.25)}.pill.danger:before{background:var(--red);box-shadow:0 0 4px var(--red)}.pill.neutral{background:#7b91b51f;color:var(--ink-dim);border:1px solid rgba(123,145,181,.2)}.pill.neutral:before{background:var(--ink-dim)}.pill.indigo{background:#4f6ef71f;color:#809fff;border:1px solid rgba(79,110,247,.25)}.pill.indigo:before{background:var(--indigo);box-shadow:0 0 4px var(--indigo)}.pill.cyan{background:#38d9f51f;color:var(--cyan);border:1px solid rgba(56,217,245,.25)}.pill.cyan:before{background:var(--cyan)}.stage-badge{display:inline-block;padding:4px 10px;border-radius:6px;font-size:.7rem;font-weight:700;font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase}.form-grid{display:grid;gap:14px}.form-grid-2{grid-template-columns:1fr 1fr}.form-grid-3{grid-template-columns:1fr 1fr 1fr}.form-row{display:flex;gap:14px}.form-group{display:flex;flex-direction:column;gap:5px;flex:1}.form-label{font-size:.78rem;color:var(--ink-dim);text-transform:uppercase;letter-spacing:.06em;font-weight:600}.form-input,.form-select,.form-textarea{background:var(--surface2);border:1px solid var(--border);color:var(--ink);border-radius:10px;padding:10px 14px;font-size:.9rem;font-family:var(--font-ui);transition:border-color .2s,box-shadow .2s;width:100%}.form-input:focus,.form-select:focus,.form-textarea:focus{outline:none;border-color:var(--indigo);box-shadow:0 0 0 3px var(--indigo-glow)}.form-input::placeholder,.form-textarea::placeholder{color:var(--ink-muted)}.form-select{cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%237b91b5' d='M6 8L1 3h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:28px}.form-select option{background:var(--surface);color:var(--ink)}.form-textarea{resize:vertical;min-height:80px}.project-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}.project-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;transition:border-color .2s,transform .2s,box-shadow .2s;display:flex;flex-direction:column}.project-card:hover{border-color:var(--border-glow);transform:translateY(-3px);box-shadow:var(--shadow)}.project-card-header{padding:16px 16px 12px;display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.project-code{font-family:var(--font-mono);font-size:.78rem;color:var(--indigo);letter-spacing:.06em;background:#4f6ef71f;padding:4px 9px;border-radius:5px}.project-card-body{padding:0 16px 14px;flex:1}.project-name{font-size:1rem;font-weight:600;color:var(--ink);margin-bottom:3px}.project-client{font-size:.84rem;color:var(--ink-muted)}.project-card-footer{padding:10px 16px;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:6px}.project-date{font-size:.78rem;color:var(--ink-muted);font-family:var(--font-mono)}.inline-stage-select{background:var(--surface2);border:1px solid var(--border);color:var(--ink);border-radius:7px;padding:4px 8px;font-size:.73rem;font-family:var(--font-mono);font-weight:700;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;min-width:120px;text-align:center}.inline-stage-select:focus{outline:2px solid var(--indigo)}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000000a6;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:200;display:flex;align-items:center;justify-content:center;padding:24px 16px;box-sizing:border-box;animation:fadeIn .15s ease}.modal{background:var(--surface);border:1px solid var(--border-glow);border-radius:var(--r-lg);padding:28px;width:580px;max-width:calc(100vw - 32px);max-height:calc(100vh - 48px);overflow-y:auto;box-shadow:0 20px 60px #000000b3,0 0 60px var(--indigo-glow);animation:slideUp .2s ease}.modal-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:22px;gap:12px}.modal-title{font-size:1.25rem;font-weight:700;color:var(--ink)}.modal-subtitle{font-size:.85rem;color:var(--ink-muted);margin-top:3px}.modal-close{background:var(--surface2);border:1px solid var(--border);color:var(--ink-dim);border-radius:8px;width:28px;height:28px;cursor:pointer;display:grid;place-items:center;font-size:1rem;flex-shrink:0;transition:background .15s}.modal-close:hover{background:var(--surface3);color:var(--ink)}.modal-footer{display:flex;justify-content:flex-end;gap:10px;margin-top:24px;padding-top:16px;border-top:1px solid var(--border)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-in{animation:slideUp .25s ease both}.stack{display:flex;flex-direction:column;gap:20px}.divider{height:1px;background:var(--border)}.empty-state{padding:48px 24px;text-align:center;color:var(--ink-muted)}.empty-state-icon{font-size:2.5rem;margin-bottom:12px}.empty-state-text{font-size:.95rem}.tag{display:inline-flex;align-items:center;gap:4px;background:var(--surface3);border:1px solid var(--border);border-radius:6px;padding:3px 9px;font-size:.78rem;color:var(--ink-dim)}.mono{font-family:var(--font-mono)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--surface3);border-radius:99px}::-webkit-scrollbar-thumb:hover{background:var(--ink-muted)}@media (max-width: 900px){.app-shell{grid-template-columns:1fr}.sidebar{position:static;height:auto;flex-direction:row;overflow-x:auto;border-right:none;border-bottom:1px solid var(--border)}.brand{border-bottom:none;border-right:1px solid var(--border)}.sidebar-nav{flex-direction:row;overflow-x:auto;padding:8px;flex:1}.nav-section-label,.sidebar-footer{display:none}.kpi-grid,.form-grid-3{grid-template-columns:1fr 1fr}}@media (max-width: 560px){.kpi-grid,.form-grid-2,.form-grid-3,.project-cards{grid-template-columns:1fr}.search{width:180px}}