:root{--imc-yellow:#FFCB05;--imc-yellow-soft:#FFE89A;--imc-blue:#2A5DB0;--imc-blue-dark:#1E3F7A;--imc-blue-deep:#15294D;--imc-coral:#E8552D;--imc-navy:#18213B;--bg:#F4F5F7;--surface:#FFFFFF;--surface-2:#FAFBFC;--surface-3:#F1F3F6;--border:#E4E7EC;--border-strong:#D3D8E0;--ink:#18213B;--ink-2:#515B72;--ink-3:#8A93A6;--ink-4:#AFB6C4;--ok:#1F9D57;--ok-bg:#E7F4EC;--ok-line:#BfE3CC;--warn:#E08A00;--warn-bg:#FCF2DC;--warn-line:#F3DCA8;--bad:#DC4A3D;--bad-bg:#FBE9E7;--bad-line:#F3C9C4;--plan:#8A93A6;--plan-bg:#EDEFF3;--plan-line:#DCE0E8;--ot:#2A5DB0;--ot-bg:#E7EEF8;--ot-line:#C4D6F0;--team-etl:#6B4FD6;--team-ai:#1F9D57;--team-bi:#E08A00;--team-web:#2A5DB0;--font:"IBM Plex Sans Thai","IBM Plex Sans",system-ui,sans-serif;--mono:"IBM Plex Mono",ui-monospace,monospace;--r-sm:6px;--r-md:10px;--r-lg:14px;--r-xl:20px;--sh-sm:0 1px 2px rgba(24,33,59,.06),0 1px 3px rgba(24,33,59,.05);--sh-md:0 2px 6px rgba(24,33,59,.07),0 6px 18px rgba(24,33,59,.07);--sh-lg:0 10px 30px rgba(24,33,59,.14),0 4px 10px rgba(24,33,59,.08);--sh-pop:0 18px 50px rgba(24,33,59,.22);--sidebar-w:244px;--topbar-h:60px}*{box-sizing:border-box}body,html{margin:0;padding:0}body{font-family:var(--font);background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-size:14px;line-height:1.45}#root{height:100vh;overflow:hidden}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}input,select,textarea{font-family:inherit;font-size:14px;color:var(--ink)}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#C8CDD8;border-radius:99px;border:2px solid transparent;background-clip:content-box}::-webkit-scrollbar-thumb:hover{background:#AEB5C4;background-clip:content-box}::-webkit-scrollbar-track{background:transparent}.mono{font-family:var(--mono)}.mono,.tnum{font-feature-settings:"tnum"}.tnum{font-variant-numeric:tabular-nums}.app{display:grid;grid-template-columns:var(--sidebar-w) 1fr;height:100vh}.app.collapsed{grid-template-columns:72px 1fr}.sidebar{background:var(--imc-navy);color:#C5CBDA;display:flex;flex-direction:column;height:100vh;overflow:hidden;border-right:1px solid rgba(255,255,255,.06)}.sb-brand{display:flex;align-items:center;gap:11px;padding:16px 18px 14px}.sb-logo{width:38px;height:38px;border-radius:8px;flex:none;box-shadow:0 2px 8px rgba(0,0,0,.3)}.sb-brand-txt{display:flex;flex-direction:column;line-height:1.1;overflow:hidden}.sb-brand-txt b{color:#fff;font-size:14.5px;font-weight:600;letter-spacing:.2px;white-space:nowrap}.sb-brand-txt span{color:#8E97AD;font-size:10.5px;letter-spacing:.3px;white-space:nowrap}.sb-section{padding:4px 12px}.sb-section-label{color:#5E6781;font-size:10px;font-weight:600;letter-spacing:.9px;text-transform:uppercase;padding:14px 12px 6px}.collapsed .sb-section-label{text-align:center;padding:14px 0 6px;font-size:8px}.nav-item{display:flex;align-items:center;gap:11px;padding:9px 12px;border-radius:9px;width:100%;color:#B7BECE;font-size:13.5px;font-weight:500;transition:background .12s,color .12s;position:relative}.nav-item .ni-icon{flex:none;width:18px;height:18px;opacity:.92}.nav-item:hover{background:rgba(255,255,255,.06);color:#fff}.nav-item.active{background:var(--imc-blue);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}.nav-item.active .ni-icon{opacity:1}.nav-item .ni-badge{margin-left:auto;background:var(--imc-coral);color:#fff;font-size:10.5px;font-weight:700;min-width:18px;height:18px;border-radius:99px;display:grid;place-items:center;padding:0 5px}.nav-item.active .ni-badge{background:rgba(255,255,255,.25)}.nav-item .ni-future-badge{background:#7c3aed;color:#fff;font-weight:700;place-items:center;padding:0 5px;letter-spacing:.4px;text-transform:uppercase}.nav-item .ni-future-badge,.nav-item .ni-soon-badge{margin-left:auto;font-size:9px;height:16px;border-radius:4px;display:grid}.nav-item .ni-soon-badge{background:rgba(255,255,255,.12);color:rgba(255,255,255,.5);font-weight:600;place-items:center;padding:0 5px}.nav-item.active .ni-future-badge{background:rgba(255,255,255,.3)}.collapsed .nav-item{justify-content:center;padding:11px 0}.collapsed .nav-item .ni-badge,.collapsed .nav-item .ni-future-badge,.collapsed .nav-item .ni-label,.collapsed .nav-item .ni-soon-badge,.collapsed .sb-brand-txt{display:none}.sb-foot{margin-top:auto;padding:12px;border-top:1px solid rgba(255,255,255,.07)}.sb-user{display:flex;align-items:center;gap:10px;padding:8px;border-radius:10px;cursor:pointer}.sb-user:hover{background:rgba(255,255,255,.06)}.sb-user-txt{line-height:1.2;overflow:hidden}.sb-user-txt b{color:#fff;font-size:13px;font-weight:600;display:block;white-space:nowrap}.sb-user-txt span{color:#8E97AD;font-size:11px;white-space:nowrap}.collapsed .sb-user-txt{display:none}.main{display:flex;flex-direction:column;height:100vh;overflow:hidden;background:var(--bg)}.topbar{height:var(--topbar-h);flex:none;background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:16px;padding:0 22px}.topbar h1{font-size:17px;font-weight:600;margin:0;letter-spacing:-.2px;white-space:nowrap}.topbar .sub{color:var(--ink-3);font-size:12.5px;margin-top:1px;white-space:nowrap}.top-spacer{flex:1 1}.iconbtn{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;color:var(--ink-2);transition:background .12s,color .12s;position:relative}.iconbtn:hover{background:var(--surface-3);color:var(--ink)}.iconbtn .dot{position:absolute;top:8px;right:8px;width:7px;height:7px;border-radius:99px;background:var(--imc-coral);border:1.5px solid var(--surface)}.weeknav{display:flex;align-items:center;gap:2px;background:var(--surface-3);border-radius:10px;padding:3px}.weeknav button{width:30px;height:30px;border-radius:7px;display:grid;place-items:center;color:var(--ink-2)}.weeknav button:hover{background:var(--surface);color:var(--ink);box-shadow:var(--sh-sm)}.weeknav .wk-label{padding:0 12px;font-size:13px;font-weight:600;min-width:168px;text-align:center}.weeknav .wk-label small{display:block;color:var(--ink-3);font-weight:500;font-size:11px}.page{flex:1 1;overflow:auto;padding:22px}.page-narrow{max-width:1180px;margin:0 auto}.btn{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 15px;border-radius:9px;font-size:13.5px;font-weight:600;transition:background .12s,box-shadow .12s,transform .04s,border-color .12s;white-space:nowrap}.btn:active{transform:translateY(.5px)}.btn-pri{background:var(--imc-blue);color:#fff;box-shadow:var(--sh-sm)}.btn-pri:hover{background:var(--imc-blue-dark)}.btn-yellow{background:var(--imc-yellow);color:var(--imc-navy);box-shadow:var(--sh-sm)}.btn-yellow:hover{background:#F0BE00}.btn-ghost{background:var(--surface);color:var(--ink);border:1px solid var(--border-strong)}.btn-ghost:hover{border-color:var(--ink-4)}.btn-ghost:hover,.btn-soft{background:var(--surface-3)}.btn-soft{color:var(--ink-2)}.btn-soft:hover{background:#E6E9EF;color:var(--ink)}.btn-danger{background:var(--bad);color:#fff}.btn-danger:hover{background:#C53C30}.btn-sm{height:32px;padding:0 11px;font-size:12.5px;border-radius:8px}.btn-xs{height:27px;padding:0 9px;font-size:12px;border-radius:7px;gap:5px}.btn:disabled{opacity:.5;cursor:not-allowed}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--sh-sm)}.card-pad{padding:18px}.card-h{display:flex;align-items:center;gap:10px;padding:15px 18px;border-bottom:1px solid var(--border)}.card-h h3{margin:0;font-size:14.5px;font-weight:600}.card-h .ch-sub{color:var(--ink-3);font-size:12px}.kpi-grid{display:grid;grid-gap:14px;gap:14px}.kpi{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:15px 16px;box-shadow:var(--sh-sm);position:relative;overflow:hidden}.kpi .k-label{color:var(--ink-3);font-size:12px;font-weight:500;display:flex;align-items:center;gap:7px}.kpi .k-val{font-size:27px;font-weight:700;letter-spacing:-.5px;margin-top:6px;line-height:1}.kpi .k-val small{font-size:14px;font-weight:600;color:var(--ink-3)}.kpi .k-foot{font-size:11.5px;color:var(--ink-3);margin-top:7px;display:flex;align-items:center;gap:5px}.kpi .k-accent{position:absolute;left:0;top:0;bottom:0;width:3px}.badge{display:inline-flex;align-items:center;gap:5px;height:21px;padding:0 8px;border-radius:6px;font-size:11.5px;font-weight:600;white-space:nowrap}.badge .bdot{width:7px;height:7px;border-radius:99px}.pill{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:99px;font-size:12px;font-weight:600}.st-ok{background:var(--ok-bg);color:#157a42}.st-warn{background:var(--warn-bg);color:#9a5e00}.st-bad{background:var(--bad-bg);color:#b6352a}.st-plan{background:var(--plan-bg);color:#5b6478}.st-ot{background:var(--ot-bg);color:#1f4a8f}.field{display:flex;flex-direction:column;gap:6px}.field label{font-size:12.5px;font-weight:600;color:var(--ink-2)}.field label .req{color:var(--imc-coral)}.input,.select,textarea.input{height:40px;border:1px solid var(--border-strong);border-radius:9px;padding:0 12px;background:var(--surface);color:var(--ink);width:100%;transition:border-color .12s,box-shadow .12s;outline:none}textarea.input{height:auto;padding:9px 12px;resize:vertical;line-height:1.5}.input:focus,.select:focus,textarea.input:focus{border-color:var(--imc-blue);box-shadow:0 0 0 3px rgba(42,93,176,.13)}.input::placeholder{color:var(--ink-4)}.select{-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 24 24' fill='none' stroke='%238A93A6' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px}.seg{background:var(--surface-3);border-radius:9px;padding:3px;gap:2px}.seg,.seg button{display:inline-flex}.seg button{height:30px;padding:0 13px;border-radius:7px;font-size:12.5px;font-weight:600;color:var(--ink-2);align-items:center;gap:6px}.seg button:hover{color:var(--ink)}.seg button.on{background:var(--surface);color:var(--imc-blue);box-shadow:var(--sh-sm)}.av{border-radius:99px;display:grid;place-items:center;color:#fff;font-weight:600;flex:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.overlay{position:fixed;inset:0;background:rgba(24,33,59,.42);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:grid;place-items:center;z-index:200;padding:24px;animation:fade .14s ease}.modal{background:var(--surface);border-radius:var(--r-xl);box-shadow:var(--sh-pop);width:100%;max-width:540px;max-height:90vh;display:flex;flex-direction:column;overflow:hidden;animation:pop .16s cubic-bezier(.2,.8,.3,1)}.modal-h{display:flex;align-items:center;gap:12px;padding:18px 20px;border-bottom:1px solid var(--border)}.modal-h h2{margin:0;font-size:16px;font-weight:600}.modal-b{padding:20px;overflow:auto}.modal-f{display:flex;align-items:center;gap:10px;padding:15px 20px;border-top:1px solid var(--border);background:var(--surface-2)}@keyframes fade{0%{opacity:0}}@keyframes pop{0%{opacity:0;transform:translateY(8px) scale(.98)}}@keyframes slidein{0%{opacity:0;transform:translateX(12px)}}.divider{height:1px;background:var(--border)}.empty,.muted{color:var(--ink-3)}.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:40px;text-align:center}.empty .e-ic{width:52px;height:52px;border-radius:14px;background:var(--surface-3);display:grid;place-items:center;color:var(--ink-4)}.placeholder{background-image:repeating-linear-gradient(45deg,#EEF0F4 0 10px,#F6F7F9 10px 20px);border:1px dashed var(--border-strong);border-radius:var(--r-md);display:grid;place-items:center;color:var(--ink-3);font-family:var(--mono);font-size:11px}.tag{display:inline-flex;align-items:center;gap:5px;height:20px;padding:0 7px;border-radius:5px;font-size:11px;font-weight:600;background:var(--surface-3);color:var(--ink-2)}.dot-team{width:8px;height:8px;border-radius:2px;flex:none}.scrollx{overflow-x:auto}.fade-in{animation:fade .2s ease}.slide-in{animation:slidein .2s ease}table.tbl{width:100%;border-collapse:collapse;font-size:13px}table.tbl th{text-align:left;font-weight:600;color:var(--ink-3);font-size:11.5px;text-transform:uppercase;letter-spacing:.4px;padding:10px 12px;white-space:nowrap;position:-webkit-sticky;position:sticky;top:0;background:var(--surface);z-index:1}table.tbl td,table.tbl th{border-bottom:1px solid var(--border)}table.tbl td{padding:9px 12px;vertical-align:middle}table.tbl tr:hover td{background:var(--surface-2)}table.tbl .cell-edit{cursor:pointer;border-radius:6px}table.tbl .cell-edit:hover{box-shadow:inset 0 0 0 1px var(--border-strong)}.sb-light .sidebar{background:var(--surface);color:var(--ink-2);border-right:1px solid var(--border)}.sb-light .sb-brand-txt b{color:var(--ink)}.sb-light .sb-brand-txt span{color:var(--ink-3)}.sb-light .nav-item{color:var(--ink-2)}.sb-light .nav-item:hover{background:var(--surface-3);color:var(--ink)}.sb-light .nav-item.active{background:var(--imc-blue);color:#fff}.sb-light .sb-section-label{color:var(--ink-4)}.sb-light .sb-foot{border-top-color:var(--border)}.sb-light .sb-user-txt b{color:var(--ink)}.sb-light .sb-user-txt span{color:var(--ink-3)}.sb-light .sb-user:hover{background:var(--surface-3)}.sb-blue .sidebar{background:var(--imc-blue-deep)}.density-compact .page{padding:15px}.density-compact .card-pad{padding:13px}.density-compact .kpi{padding:12px 14px}.density-compact .kpi .k-val{font-size:24px}.density-compact .topbar{height:54px}