:root{--bg: #f4f6f8;--panel: #ffffff;--border: #e2e8f0;--text: #172033;--muted: #667085;--accent: #1677ff;--accent-dim: #0958d9;--accent-soft: #edf5ff;--sidebar: #111c2e;--danger: #d92d20;--ok: #12a594;font-family:Inter,Segoe UI,Microsoft YaHei,system-ui,sans-serif;color:var(--text);background:var(--bg);font-synthesis:none}*{box-sizing:border-box}html{min-width:320px;background:var(--bg)}body{margin:0;min-width:320px;min-height:100vh}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.table-wrap:focus-visible{outline:3px solid rgba(22,119,255,.2);outline-offset:2px}a{color:var(--accent)}.layout{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;z-index:30;display:flex;flex-direction:column;height:100vh;padding:24px 16px 16px;color:#e7edf7;background:var(--sidebar);overflow-y:auto}.brand{display:flex;align-items:center;gap:12px;padding:0 10px 26px}.brand-mark{display:grid;place-items:center;width:38px;height:38px;flex:0 0 auto;border-radius:11px;color:#fff;background:var(--accent);font-size:13px;font-weight:800;letter-spacing:.04em;box-shadow:0 7px 18px #1677ff47}.brand strong{display:block;color:#fff;font-size:17px;letter-spacing:.02em}.brand small{display:block;margin-top:3px;color:#8e9bb0;font-size:11px}.nav{flex:1}.nav-group{margin-bottom:20px}.nav-label{padding:0 12px 7px;color:#718096;font-size:11px;font-weight:600;letter-spacing:.1em}.nav a{position:relative;display:flex;align-items:center;min-height:42px;margin:2px 0;padding:9px 12px 9px 16px;border-radius:8px;color:#b7c2d2;text-decoration:none;font-size:14px;transition:color .16s ease,background .16s ease}.nav a:before{content:"";width:5px;height:5px;margin-right:12px;border:1px solid #718096;border-radius:50%}.nav a:hover{color:#fff;background:#ffffff0e}.nav a.active{color:#fff;background:#1677ff33}.nav a.active:before{border-color:#69a8ff;background:#69a8ff;box-shadow:0 0 0 4px #69a8ff1f}.sidebar-user{display:flex;align-items:center;gap:9px;padding:14px 8px 2px;border-top:1px solid #293449}.avatar{display:grid;place-items:center;width:32px;height:32px;flex:0 0 auto;border-radius:50%;color:#dce9fb;background:#293a53;font-size:13px}.user-copy{min-width:0;flex:1}.user-copy strong,.user-copy span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-copy strong{color:#eef3fa;font-size:12px}.user-copy span{margin-top:3px;color:#8491a6;font-size:10px}.logout-button{padding:5px;border:0;color:#9eacbf;background:transparent;cursor:pointer;font-size:12px}.logout-button:hover{color:#fff}.workspace{min-width:0}.mobile-bar,.nav-overlay{display:none}main{width:100%;max-width:1600px;min-width:0;margin:0 auto;padding:32px clamp(20px,3vw,44px) 48px}.page-header{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:24px}.page-header h1{margin:5px 0 8px;color:#14213a;font-size:clamp(24px,2.2vw,32px);line-height:1.2;letter-spacing:-.025em}.page-header p{max-width:760px;margin:0;color:var(--muted);font-size:14px;line-height:1.65}.eyebrow{color:var(--accent);font-size:10px;font-weight:800;letter-spacing:.16em}.page-actions{display:flex;gap:8px;flex:0 0 auto}.card{min-width:0;margin-bottom:18px;padding:22px;border:1px solid var(--border);border-radius:14px;background:var(--panel);box-shadow:0 2px 5px #10182806}.card h2,.card h3{margin:0 0 12px;color:#1c2942}.card h2{font-size:17px}.card h3{font-size:15px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.section-heading h2{margin:0 0 5px}.section-heading p{margin:0;color:var(--muted);font-size:12px;line-height:1.5}.filter-card{padding:18px 20px}.filter-grid{display:grid;align-items:end;gap:14px}.customer-filter{grid-template-columns:minmax(220px,2fr) minmax(160px,1fr) auto}.analysis-filter{grid-template-columns:minmax(150px,1fr) minmax(150px,1fr) 120px auto}.date-filter{grid-template-columns:minmax(160px,1fr) minmax(160px,1fr) auto;max-width:880px}.filter-field{display:flex;min-width:0;flex-direction:column;gap:7px;color:#475467;font-size:12px;font-weight:600}.filter-field input,.filter-field select{width:100%}.filter-actions{display:flex;gap:8px}.quick-ranges{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-top:14px;padding-top:13px;border-top:1px solid #edf0f4}.quick-ranges>span{margin-right:3px;color:var(--muted);font-size:11px}.quick-ranges button{padding:4px 10px;border:1px solid var(--border);border-radius:20px;color:#475467;background:#fff;cursor:pointer;font-size:11px}.quick-ranges button:hover{border-color:#a9c9f5;color:var(--accent);background:var(--accent-soft)}.quick-ranges small{margin-left:auto;color:var(--muted);font-size:11px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:8px 16px;border:1px solid var(--accent);border-radius:8px;color:#fff;background:var(--accent);cursor:pointer;font-size:13px;font-weight:600;white-space:nowrap;transition:background .15s ease,border-color .15s ease}.btn:hover{border-color:var(--accent-dim);background:var(--accent-dim)}.btn.secondary{border-color:#d5dce6;color:#344054;background:#fff}.btn.secondary:hover{border-color:#b5c2d3;background:#f8fafc}.btn.danger{border-color:var(--danger);background:var(--danger)}.btn:disabled{opacity:.55;cursor:not-allowed}.toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin-bottom:14px}input,select,textarea{min-width:0;min-height:38px;padding:8px 11px;border:1px solid #d5dce6;border-radius:8px;color:var(--text);background:#fff;font-size:13px}input::placeholder,textarea::placeholder{color:#98a2b3}input:hover,select:hover,textarea:hover{border-color:#b6c1d1}input:focus,select:focus,textarea:focus{border-color:var(--accent)}textarea{line-height:1.6}.field{margin-bottom:15px}.field label{display:block;margin-bottom:6px;color:#475467;font-size:12px;font-weight:600}.field input,.field select{width:100%}.form-grid{display:grid;gap:14px}.customer-form{grid-template-columns:repeat(2,minmax(0,1fr))}.form-grid .wide{grid-column:1 / -1}.form-actions{display:flex;gap:8px;margin-top:18px}.customer-list-heading{align-items:flex-start}.list-tools{display:flex;gap:8px}.list-tools input{width:min(280px,32vw)}.project-form{display:flex;flex-wrap:wrap;align-items:stretch;gap:10px}.project-form>input{flex:0 1 220px}.project-summary-input{width:100%;min-width:0;min-height:76px;flex:1 1 420px;resize:vertical}.project-detail-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px}.project-detail-toolbar>span{display:inline-flex;align-items:center;gap:6px;margin-right:0!important}.detail-summary-input{width:100%;min-width:0;min-height:56px;margin-bottom:10px;resize:vertical}.project-overview .section-heading{margin-bottom:14px}.filter-mode{display:flex;flex:0 0 auto;gap:3px;padding:3px;border:1px solid var(--border);border-radius:9px;background:#f5f7fa}.filter-mode button{min-width:52px;padding:5px 11px;border:0;border-radius:6px;color:var(--muted);background:transparent;cursor:pointer;font-size:12px}.filter-mode button.active{color:var(--accent);background:#fff;box-shadow:0 1px 4px #1018281a;font-weight:700}.status-filters{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:16px}.status-filter{display:inline-flex;align-items:center;gap:7px;min-height:34px;padding:6px 11px;border:1px solid var(--border);border-radius:18px;color:#475467;background:#fff;cursor:pointer;font-size:12px;transition:border-color .15s ease,background .15s ease}.status-filter>i{width:7px;height:7px;border:1px solid var(--status-color);border-radius:50%}.status-filter>span{min-width:19px;padding:1px 5px;border-radius:9px;color:var(--muted);background:#f1f5f9;font-size:10px;text-align:center}.status-filter:hover{border-color:var(--status-color)}.status-filter.selected{border-color:var(--status-color);color:var(--status-color);background:#f8fafc;font-weight:600}.status-filter.selected>i{background:var(--status-color);box-shadow:0 0 0 3px #e9eef5}.status-filter.selected>span{color:#fff;background:var(--status-color)}.status-filters>small{margin-left:3px;color:var(--muted);font-size:11px}.project-overview-grid{display:grid;grid-template-columns:minmax(220px,.65fr) minmax(0,1.6fr);gap:16px;align-items:stretch}.project-metrics{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}.project-metrics .metric-card{display:flex;justify-content:center;flex-direction:column}.project-status-chart{min-width:0}.project-chart-legend{display:flex;justify-content:center;flex-wrap:wrap;gap:18px;margin-top:2px;color:var(--muted);font-size:11px}.project-chart-legend span{display:inline-flex;align-items:center;gap:6px}.project-chart-legend i{width:9px;height:9px;border-radius:2px;background:var(--accent)}.project-chart-legend i.revenue{background:#94a3b8}.project-chart-tooltip{display:flex;flex-direction:column;gap:5px;padding:9px 11px;border:1px solid var(--border);border-radius:8px;color:var(--text);background:var(--panel);box-shadow:0 5px 18px #10182814;font-size:12px}.project-chart-tooltip strong{margin-bottom:2px}th.sorted{color:var(--accent);background:#eef5ff}.sort-button{display:inline-flex;align-items:center;gap:6px;padding:0;border:0;color:inherit;background:transparent;cursor:pointer;font:inherit;font-weight:700}.sort-indicator{display:inline-grid;width:17px;height:17px;place-items:center;border-radius:4px;color:#98a2b3;font-size:14px;line-height:1}.sort-indicator.active{color:var(--accent);background:#dbeafe}.alert.success{border:1px solid #abefc6;color:#067647;background:#ecfdf3}.inventory-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.metric-card{position:relative;min-width:0;padding:20px;overflow:hidden;border:1px solid var(--border);border-radius:14px;background:var(--panel)}.metric-card:after{content:"";position:absolute;top:18px;right:18px;width:7px;height:7px;border-radius:50%;background:#b7c5d8;box-shadow:0 0 0 5px #f2f5f9}.metric-card.accent:after{background:var(--ok);box-shadow:0 0 0 5px #eaf9f6}.metric-card>span,.metric-card small{display:block;color:var(--muted);font-size:12px}.metric-card strong{display:block;margin:13px 0 8px;overflow:hidden;color:#14213a;font-size:clamp(21px,2vw,28px);line-height:1.2;letter-spacing:-.03em;text-overflow:ellipsis;white-space:nowrap}.metric-card small{color:#98a2b3;font-size:11px}.metric-grid.compact .metric-card{padding:17px 20px}.metric-grid.compact .metric-card strong{margin-bottom:0;font-size:23px}.quick-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.quick-link{display:flex;align-items:flex-start;gap:13px;min-width:0;padding:18px;border:1px solid var(--border);border-radius:11px;color:inherit;background:#fbfcfe;text-decoration:none;transition:border-color .15s ease,transform .15s ease}.quick-link:hover{border-color:#a9c9f5;transform:translateY(-2px)}.quick-index{color:#9bb7da;font-size:11px;font-weight:700}.quick-link strong{color:#253552;font-size:14px}.quick-link p{margin:6px 0 0;color:var(--muted);font-size:12px;line-height:1.55}.quick-arrow{margin-left:auto;color:var(--accent)}.workflow-steps{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#475467;font-size:12px}.workflow-steps span{padding:10px 14px;border-radius:8px;background:#f5f7fa}.workflow-steps i{color:#b0b9c7;font-style:normal}.table-wrap{width:100%;max-width:100%;max-height:calc(100vh - 260px);overflow:auto;border:1px solid var(--border);border-radius:10px;background:#fff}table{width:100%;border-collapse:separate;border-spacing:0;font-size:12px}th,td{padding:11px 13px;border-bottom:1px solid #edf0f4;text-align:left;white-space:nowrap}th{position:sticky;top:0;z-index:2;color:#475467;background:#f8fafc;font-size:11px;font-weight:700}tbody tr:hover td{background:#fafcff}tbody tr:last-child td{border-bottom:0}td.numeric{text-align:right;font-variant-numeric:tabular-nums}tfoot td{position:sticky;bottom:0;border-top:1px solid #dfe5ed;border-bottom:0;color:#253552;background:#f8fafc;font-weight:700}.table-wrap input,.table-wrap select{min-height:32px;padding:5px 8px}.empty-state{display:flex;min-height:150px;align-items:center;justify-content:center;flex-direction:column;gap:7px;border:1px dashed #d7dee8;border-radius:10px;color:var(--muted);background:#fbfcfd}.empty-state strong{color:#475467;font-size:14px}.empty-state span{font-size:12px}.alert{margin-bottom:18px;padding:12px 15px;border-radius:9px;font-size:13px}.alert.error,.error{color:var(--danger)}.alert.error{border:1px solid #fecdca;background:#fffbfa}.error{margin:8px 0;font-size:12px}.muted{color:var(--muted);font-size:12px;line-height:1.6}.loading-line{display:flex;align-items:center;gap:9px;margin-bottom:14px;color:var(--muted);font-size:12px}.spinner{display:inline-block;width:16px;height:16px;flex:0 0 auto;border:2px solid #d7e5f7;border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite}.app-loading{display:flex;min-height:100vh;align-items:center;justify-content:center;gap:10px;color:var(--muted);background:var(--bg);font-size:14px}@keyframes spin{to{transform:rotate(360deg)}}.charts-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}.chart-box{min-width:0;padding:14px;border:1px solid var(--border);border-radius:10px;background:#fbfcfe}.chart-title{margin:0 0 8px;color:#475467;font-size:13px;font-weight:600}.login-page{display:flex;min-height:100vh;align-items:center;justify-content:center;padding:24px;overflow-x:hidden;background:radial-gradient(circle at 20% 20%,#e8f2ff,transparent 38%),var(--bg)}.login-card{width:100%;min-width:0;max-width:410px;padding:32px;border:1px solid var(--border);border-radius:18px;background:var(--panel);box-shadow:0 20px 55px #1e325017}.login-brand{display:flex;align-items:center;gap:11px;margin-bottom:24px}.login-brand strong,.login-brand small{display:block}.login-brand strong{color:#172033;font-size:15px}.login-brand small{margin-top:2px;color:var(--muted);font-size:10px}.login-card h1{margin:0 0 7px;color:#14213a;font-size:24px}.login-intro{margin:0 0 24px;color:var(--muted);font-size:12px;line-height:1.6}@media (max-width: 1200px){.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.analysis-filter{grid-template-columns:repeat(3,minmax(0,1fr))}.analysis-filter .filter-actions{grid-column:1 / -1}.quick-grid{grid-template-columns:1fr}.charts-grid,.project-overview-grid{grid-template-columns:minmax(0,1fr)}.project-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 860px){.layout{grid-template-columns:minmax(0,1fr)}.sidebar{position:fixed;left:0;width:min(290px,86vw);transform:translate(-102%);transition:transform .2s ease;box-shadow:20px 0 45px #0a142333}.sidebar.open{transform:translate(0)}.nav-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;display:block;width:100%;height:100%;padding:0;border:0;background:#0f172a7a;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.mobile-bar{position:sticky;top:0;z-index:15;display:flex;height:58px;align-items:center;justify-content:space-between;padding:0 18px;border-bottom:1px solid var(--border);background:#fffffff0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.mobile-bar strong{color:#1b2a44;font-size:15px}.mobile-user{max-width:100px;overflow:hidden;color:var(--muted);font-size:12px;text-overflow:ellipsis;white-space:nowrap}.menu-button{display:flex;width:34px;height:34px;align-items:center;justify-content:center;flex-direction:column;gap:4px;padding:0;border:0;border-radius:7px;background:#f2f5f9}.menu-button span{width:16px;height:1.5px;background:#344054}main{padding:24px 20px 36px}.customer-filter,.date-filter{grid-template-columns:repeat(2,minmax(0,1fr))}.customer-filter .filter-actions,.date-filter .filter-actions{grid-column:1 / -1}.workflow-steps{flex-wrap:wrap;justify-content:flex-start}}@media (max-width: 600px){main{padding:20px 14px 30px}.page-header{align-items:flex-start;flex-direction:column;gap:14px;margin-bottom:20px}.page-header h1{font-size:25px}.card{padding:16px;border-radius:12px}.filter-card{padding:15px}.customer-filter,.analysis-filter,.date-filter,.customer-form,.inventory-metrics{grid-template-columns:minmax(0,1fr)}.analysis-filter .filter-actions,.customer-filter .filter-actions,.date-filter .filter-actions{grid-column:auto}.customer-list-heading,.list-tools{align-items:stretch;flex-direction:column}.list-tools,.list-tools input{width:100%}.project-detail-toolbar{align-items:stretch}.project-detail-toolbar>span{justify-content:space-between;width:100%}.project-detail-toolbar .btn{width:100%}.filter-actions .btn{flex:1}.quick-ranges small{width:100%;margin:4px 0 0}.metric-grid,.project-metrics{grid-template-columns:minmax(0,1fr);gap:10px}.project-overview .section-heading{flex-wrap:wrap}.status-filters>small{width:100%;margin:2px 0 0}.metric-card,.metric-grid.compact .metric-card{padding:16px 18px}.metric-card strong{margin:9px 0 6px;font-size:24px}.section-heading{align-items:flex-start}.section-heading .btn{min-height:34px;padding:6px 11px}.table-wrap{max-height:62vh}th,td{padding:10px 11px}.login-page{padding:14px}.login-card{padding:24px 20px}.workflow-steps{align-items:stretch;flex-direction:column}.workflow-steps i{display:none}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}