:root{--brand:#0068ff;--brand-d:#0050c8;--brand-pressed:#003e9e;--brand-container:#eaf2ff;--ink:#0f1722;--mut:#5b6b7f;--line:#e6ebf2;--line-strong:#d4deea;--bg:#f4f7fb;--surface-subtle:#f8fafd;--card:#fff;--ok:#16a34a;--warn:#b45309;--err:#dc2626;--sidebar:#0f1b2d;--sidebar-2:#16263e;--r-sm:8px;--r-md:12px;--r-lg:16px;--r-xl:22px;--sp-xs:4px;--sp-sm:8px;--sp-md:12px;--sp-lg:16px;--sp-xl:24px;--sh-raised:0 1px 2px #0f17220f;--sh-card:0 4px 14px #0f17220f;--sh-overlay:0 12px 30px #0f172224;--focus:0 0 0 3px color-mix(in srgb, var(--brand) 30%, transparent);--font:"Inter",system-ui,-apple-system,Segoe UI,Roboto,Arial;--on-brand:#fff;--grad-card:var(--grad-card);--grad-warn:linear-gradient(180deg,#fff7ed,#fff);--field-bg:#fff;--fill:#f1f5fb;--th-bg:#f5f8fc;--hover:#f5f8fc;--hint-bg:#fbfdff;--hint-border:#cfe0ff}*{box-sizing:border-box}html,body,#root{height:100%}body{font:14px/1.55 var(--font);color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;margin:0}a{color:var(--brand);text-decoration:none}button{font:inherit}.app{grid-template-columns:260px 1fr;min-height:100vh;display:grid}.side{background:var(--sidebar);color:#cdd8e8;flex-direction:column;height:100vh;display:flex;position:sticky;top:0;overflow:auto}.brand{border-bottom:1px solid #22344f;align-items:center;gap:10px;padding:16px 18px 12px;display:flex}.brand .logo{background:linear-gradient(135deg,#0a84ff,#0068ff);border-radius:9px;place-items:center;width:34px;height:34px;font-size:18px;display:grid}.brand b{color:#fff;font-size:14.5px}.brand small{color:#7e93b3;font-size:11px;display:block}.who{color:#9fb3d1;border-bottom:1px solid #22344f;padding:10px 16px;font-size:12px}.who b{color:#fff;font-size:13px;display:block}.rolebox{background:#0c1626;border-bottom:1px solid #22344f;padding:10px 16px}.rolebox label{letter-spacing:.4px;text-transform:uppercase;color:#6f86a8;margin-bottom:5px;font-size:10.5px;display:block}.rolebox select{width:100%;font:inherit;color:#e7eefb;background:#16263e;border:1px solid #2a3e5c;border-radius:8px;padding:7px 8px;font-size:12.5px}.impbar{color:#92400e;background:#fef3c7;border-bottom:1px solid #fcd34d;flex-wrap:wrap;align-items:center;gap:10px;padding:8px 22px;font-size:13px;display:flex}.impbar button{color:#fff;cursor:pointer;background:#92400e;border:none;border-radius:7px;margin-left:auto;padding:5px 10px;font-size:12px}.impbar button:hover{background:#7c3209}.nav{flex:1;padding:8px 0}.nav a{color:#cdd8e8;cursor:pointer;border-left:3px solid #0000;align-items:center;gap:10px;padding:9px 16px;font-size:13.5px;display:flex}.nav a .ic{text-align:center;width:20px}.nav a:hover{background:var(--sidebar-2);color:#fff}.nav a.on{background:var(--sidebar-2);color:#fff;border-left-color:var(--brand)}.side .foot{border-top:1px solid #22344f;padding:12px 16px}.logout{color:#cdd8e8;cursor:pointer;background:#1d2f49;border:1px solid #2a3e5c;border-radius:8px;width:100%;padding:8px}.logout:hover{background:#24395a}.main{flex-direction:column;min-width:0;display:flex}.top{background:var(--card);border-bottom:1px solid var(--line);z-index:5;align-items:center;gap:12px;height:56px;padding:0 22px;display:flex;position:sticky;top:0}.top .crumb{font-weight:600}.top .sp{flex:1}.wrap{width:100%;max-width:none;padding:22px 28px}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-card);margin-bottom:16px;padding:20px 22px}h1{letter-spacing:-.015em;margin:0 0 4px;font-size:22px;font-weight:700}h2{margin:16px 0 8px;font-size:15px;font-weight:600}.lead{color:var(--mut);margin:0 0 6px}.muted{color:var(--mut)}.kpigrid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-top:10px;display:grid}.kpi{border:1px solid var(--line);background:var(--grad-card);border-radius:12px;padding:14px}.kpi b{font-size:21px;line-height:1.1;display:block}.kpi span{color:var(--mut);font-size:12px}.kpi.warn{background:var(--grad-warn);border-color:#fed7aa}.partbar{flex-wrap:wrap;gap:8px;margin-top:8px;display:flex}.partbar .pb{border:1px solid var(--line);text-align:center;border-radius:10px;flex:1;min-width:120px;padding:10px 12px}.partbar .pb b{font-size:18px;display:block}.partbar .pb span{color:var(--mut);font-size:11.5px}.bc{flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:14px;font-size:13px;display:flex}.bc a{cursor:pointer}.bc .sep{color:#9fb0c4}.bc b{color:var(--ink)}.nodehead{border:1px solid var(--line);background:var(--grad-card);border-radius:12px;align-items:center;gap:14px;margin-bottom:14px;padding:14px 16px;display:flex}.nodehead .av{background:var(--brand-container);border-radius:11px;place-items:center;width:46px;height:46px;font-size:22px;display:grid}.nodehead .meta b{font-size:16px}.nodehead .meta small{color:var(--mut)}.nodehead .kpis{gap:18px;margin-left:auto;display:flex}.nodehead .kpis .k{text-align:right}.nodehead .kpis .k b{font-size:15px;display:block}.nodehead .kpis .k span{color:var(--mut);font-size:11px}.addbar{flex-wrap:wrap;gap:8px;margin:0 0 12px;display:flex}.listhdr{color:var(--mut);text-transform:uppercase;letter-spacing:.5px;margin:6px 2px 8px;font-size:12px}.rows{flex-direction:column;gap:8px;display:flex}.row{border:1px solid var(--line);background:var(--card);border-radius:11px;align-items:center;gap:12px;padding:11px 14px;transition:all .12s;display:flex}.row.click{cursor:pointer}.row.click:hover{border-color:var(--brand);box-shadow:0 5px 16px color-mix(in srgb,var(--brand) 13%,transparent)}.row .tav{background:var(--fill);border-radius:9px;place-items:center;width:36px;height:36px;font-size:17px;display:grid}.row .nm b{display:block}.row .nm span{color:var(--mut);font-size:12px}.row .rt{text-align:right;color:var(--mut);margin-left:auto;font-size:12px}.row .rt b{color:var(--ink);font-size:13px;display:block}.row .arrow{color:#9fb0c4;margin-left:6px;font-size:18px}.chip{border-radius:20px;padding:2px 8px;font-size:10.5px;font-weight:600;display:inline-block}.chip.nsx{color:#6d28d9;background:#ede9fe}.chip.npp{color:#1d4ed8;background:#dbeafe}.chip.dl{color:#15803d;background:#dcfce7}.chip.kh{color:#a16207;background:#fef3c7}.chip.ch{color:#be123c;background:#ffe4e6}.btn{border:1px solid var(--line);background:var(--card);border-radius:var(--r-sm);cursor:pointer;padding:8px 14px;font-weight:500;transition:background .12s,border-color .12s,box-shadow .12s}.btn:hover{background:var(--surface-subtle);border-color:var(--line-strong)}.btn:focus-visible{box-shadow:var(--focus);outline:none}.btn.pri{background:var(--brand);border-color:var(--brand);color:var(--on-brand);font-weight:600}.btn.pri:hover{background:var(--brand-d);border-color:var(--brand-d)}.btn.pri:active{background:var(--brand-pressed)}.btn.add{background:var(--brand-container);color:var(--brand-d);border-color:#bcd4ff;padding:7px 11px;font-size:12.5px;font-weight:600}.btn.add:hover{background:#dde9ff}.btn:disabled{opacity:.55;cursor:default}.fld{margin-bottom:12px}.fld label{color:var(--ink);margin-bottom:5px;font-size:12.5px;font-weight:600;display:block}.fld input,.fld select,.fld textarea{width:100%;font:inherit;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--field-bg);color:var(--ink);padding:10px 12px;transition:border-color .12s,box-shadow .12s}.fld input::placeholder,.fld textarea::placeholder{color:#9aa7b8}.fld input:hover,.fld select:hover,.fld textarea:hover{border-color:var(--line-strong)}.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--brand);box-shadow:var(--focus);outline:none}.fld small{color:var(--mut);margin-top:4px;font-size:11.5px;display:block}.fsheet{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-card);margin:4px 0 14px;padding:0;overflow:hidden}.fsheet .fshead{border-bottom:1px solid var(--line);background:var(--grad-card);align-items:center;gap:12px;padding:16px 20px;display:flex}.fsheet .fshead .ic{border-radius:var(--r-md);background:var(--brand-container);place-items:center;width:42px;height:42px;font-size:21px;display:grid}.fsheet .fshead b{letter-spacing:-.01em;font-size:17px;font-weight:700}.fsheet .fshead small{color:var(--mut);font-size:12px;font-weight:400;display:block}.fsheet .fsbody{padding:18px 20px}.fsec{border:1px solid var(--line);background:var(--surface-subtle);border-radius:var(--r-md);margin-bottom:14px;padding:14px 16px}.fsec>.fst{letter-spacing:.06em;text-transform:uppercase;color:var(--mut);align-items:center;gap:7px;margin:0 0 12px;font-size:11px;font-weight:700;display:flex}.fgrid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;display:grid}.fgrid .fld,.fsec .fld{margin-bottom:0}.fsheet .fsfoot{border-top:1px solid var(--line);background:var(--surface-subtle);align-items:center;gap:10px;padding:14px 20px;display:flex;position:sticky;bottom:0}.phonerow{gap:8px;margin-bottom:8px;display:flex}.phonerow input{flex:1}.icbtn{border:1px solid var(--line);background:var(--card);border-radius:var(--r-sm);cursor:pointer;width:40px;color:var(--mut);place-items:center;display:grid}.icbtn:hover{color:var(--err);background:#fff1f2;border-color:#fecdd3}.tagrow{flex-wrap:wrap;gap:6px;margin-top:8px;display:flex}.tagrow .chip{background:var(--brand-container);color:var(--brand-d)}.pdetail{background:var(--surface-subtle);border:1px solid var(--line);border-radius:var(--r-md);margin:2px 0 8px;padding:14px 16px}.pdetail .pgrid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px 18px;display:grid}.pdetail .pk{color:var(--mut);text-transform:uppercase;letter-spacing:.03em;font-size:11px}.pdetail .pv{margin-top:1px;font-size:13.5px;font-weight:500}.pdetail .pstat{border-top:1px solid var(--line);color:var(--mut);gap:16px;margin-top:12px;padding-top:10px;font-size:12px;display:flex}.row .act{align-items:center;gap:6px;margin-left:auto;display:flex}.row .act .mini{border-radius:var(--r-sm);padding:5px 10px;font-size:12px}.row .act .map{align-items:center;text-decoration:none;display:inline-flex}.err{color:var(--err);margin-top:8px;font-size:.85rem}.okmsg{color:var(--ok);margin-top:8px;font-size:.85rem}.hint{color:var(--mut);background:var(--hint-bg);border:1px dashed var(--hint-border);border-radius:10px;margin-top:12px;padding:10px 12px;font-size:12.5px}table.tbl{border-collapse:collapse;width:100%;margin-top:8px;font-size:13px}table.tbl th,table.tbl td{border:1px solid var(--line);text-align:left;padding:8px 10px}table.tbl th{background:var(--th-bg);font-size:12px}.tabs{border-bottom:1px solid var(--line);gap:6px;margin-bottom:14px;display:flex}.tab{cursor:pointer;color:var(--mut);border-bottom:2px solid #0000;padding:9px 14px;font-size:13.5px}.tab.on{color:var(--brand-d);border-bottom-color:var(--brand);font-weight:600}.inp{border:1px solid var(--line);font:inherit;background:var(--field-bg);color:var(--ink);border-radius:9px;padding:9px 11px}.login-wrap{background:linear-gradient(#eaf2ff,#f4f7fb);place-items:center;min-height:100vh;display:grid}.login{background:var(--card);border:1px solid var(--line);border-radius:16px;width:380px;max-width:92vw;padding:26px}.login h1{text-align:center;font-size:19px}.gbtn{border:1px solid var(--line);background:var(--card);cursor:pointer;border-radius:9px;justify-content:center;align-items:center;gap:10px;width:100%;margin-top:10px;padding:10px;display:flex}.gbtn:hover{background:var(--hover)}.divider{color:var(--mut);align-items:center;gap:10px;margin:14px 0;font-size:12px;display:flex}.divider:before,.divider:after{content:"";background:var(--line);flex:1;height:1px}.authtabs{background:var(--bg);border:1px solid var(--line);border-radius:10px;gap:4px;margin:6px 0 14px;padding:4px;display:flex}.authtab{cursor:pointer;color:var(--mut);background:0 0;border:none;border-radius:7px;flex:1;padding:8px;font-family:inherit;font-size:13.5px;font-weight:600}.authtab.on{background:var(--card);color:var(--ink);box-shadow:var(--sh-raised)}.authswitch{text-align:center;color:var(--mut);margin-top:14px;font-size:13px}.authswitch a{cursor:pointer;font-weight:600}.spin{border:2px solid #fff;border-top-color:#0000;border-radius:50%;width:16px;height:16px;animation:.7s linear infinite sp;display:inline-block}@keyframes sp{to{transform:rotate(360deg)}}.center{min-height:100vh;color:var(--mut);place-items:center;display:grid}@media (width<=820px){.app{grid-template-columns:1fr}.side{height:auto;position:static}}@media (width<=1100px){.themewrap{grid-template-columns:1fr!important}.themewrap .variantgrid{grid-template-columns:repeat(3,1fr)!important}}@media (width<=760px){.themewrap,.mafields{grid-template-columns:1fr!important}.variantgrid{grid-template-columns:1fr 1fr!important}}[data-theme=vibrant]{--brand:#f43f5e;--brand-d:#e11d48;--brand-pressed:#be123c;--brand-container:#ffe4e6;--on-brand:#fff;--ink:#27272a;--mut:#71717a;--line:#fbe0d8;--line-strong:#f8c9b8;--bg:#fff7f3;--surface-subtle:#fff5f1;--card:#fff;--grad-card:linear-gradient(180deg,#fff5f1,#fff);--grad-warn:linear-gradient(180deg,#fff7ed,#fff);--field-bg:#fff;--fill:#fff1ee;--th-bg:#fff5f1;--hover:#fff1ee;--hint-bg:#fff7f3;--hint-border:#fecdd3;--sidebar:#2a0a1f;--sidebar-2:#3d1230;--sh-card:0 6px 18px #f43f5e17;--font:"Plus Jakarta Sans","Inter",system-ui,sans-serif}[data-theme=vibrant] .btn.pri{background:linear-gradient(120deg,#ff6b6b,#f43f5e);border:none}[data-theme=vibrant] .btn.pri:hover{background:linear-gradient(120deg,#ff5b6b,#e11d48)}[data-theme=vibrant] .brand .logo,[data-theme=vibrant] .nodehead .av,[data-theme=vibrant] .fsheet .fshead .ic{background:linear-gradient(135deg,#ff6b6b,#ff9f43)}[data-theme=vibrant] .nodehead,[data-theme=vibrant] .fsheet .fshead{background:linear-gradient(120deg,#fff1ee,#ffe9f2)}[data-theme=vibrant] .nav a.on{border-left-color:#ff9f43}[data-theme=glass]{--brand:#7c3aed;--brand-d:#6d28d9;--brand-pressed:#5b21b6;--brand-container:#7c3aed24;--on-brand:#fff;--ink:#221b3a;--mut:#5b5f86;--line:#7c3aed2e;--line-strong:#7c3aed66;--bg:linear-gradient(135deg,#dfe7ff 0%,#ece0ff 50%,#dbf3ff 100%);--surface-subtle:#ffffff6b;--card:#fff9;--grad-card:linear-gradient(180deg,#ffffffb8,#ffffff80);--grad-warn:linear-gradient(180deg,#ffedd5b3,#ffffff80);--field-bg:#fff9;--fill:#ffffff80;--th-bg:#ffffff80;--hover:#ffffffd9;--hint-bg:#ffffff73;--hint-border:#7c3aed4d;--sidebar:#28185280;--sidebar-2:#ffffff24;--sh-card:0 8px 26px #3c287824}[data-theme=glass] body{background-attachment:fixed}[data-theme=glass] .card,[data-theme=glass] .row,[data-theme=glass] .top,[data-theme=glass] .nodehead,[data-theme=glass] .kpi,[data-theme=glass] .fsheet,[data-theme=glass] .fsec,[data-theme=glass] .pdetail,[data-theme=glass] .login,[data-theme=glass] .side,[data-theme=glass] .btn,[data-theme=glass] .fld input,[data-theme=glass] .fld select,[data-theme=glass] .fld textarea,[data-theme=glass] .inp{-webkit-backdrop-filter:blur(12px)}[data-theme=dark]{--brand:#2dd4bf;--brand-d:#14b8a6;--brand-pressed:#0d9488;--brand-container:#0d3b34;--on-brand:#04231e;--ink:#e6edf3;--mut:#8b949e;--line:#2b313a;--line-strong:#3a424d;--bg:#0d1117;--surface-subtle:#161b22;--card:#161b22;--grad-card:linear-gradient(180deg,#1b2230,#161b22);--grad-warn:linear-gradient(180deg,#2a2113,#161b22);--field-bg:#0d1117;--fill:#0d1117;--th-bg:#0d1117;--hover:#1c2430;--hint-bg:#11161f;--hint-border:#2b313a;--sidebar:#010409;--sidebar-2:#161b22;--sh-raised:0 1px 2px #00000080;--sh-card:0 4px 14px #00000073;--sh-overlay:0 12px 30px #0009;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}[data-theme=dark] .brand .logo{background:linear-gradient(135deg,#2dd4bf,#14b8a6)}[data-theme=dark] .chip.nsx{color:#c4b5fd;background:#2a1d52}[data-theme=dark] .chip.npp{color:#93c5fd;background:#0c2d6b}[data-theme=dark] .chip.dl{color:#86efac;background:#0d3320}[data-theme=dark] .chip.kh{color:#fde68a;background:#3a2e0a}[data-theme=dark] .chip.ch{color:#fda4af;background:#3a0d1c}[data-theme=dark] .btn.add{color:#5eead4;border-color:#14564c}[data-theme=dark] .login-wrap{background:linear-gradient(#0d1117,#161b22)}[data-theme=dark] .impbar{color:#fde68a;background:#3a2e0a;border-bottom-color:#5c4a14}.themepick{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-top:6px;display:grid}.themecard{border:2px solid var(--line);border-radius:var(--r-md);cursor:pointer;background:var(--card);text-align:left;transition:border-color .12s,box-shadow .12s;overflow:hidden}.themecard:hover{border-color:var(--line-strong)}.themecard.on{border-color:var(--brand);box-shadow:var(--focus)}.themecard .sw{align-items:flex-end;gap:5px;height:60px;padding:9px;display:flex}.themecard .dot{border:2px solid #ffffffb3;border-radius:50%;width:18px;height:18px}.themecard .lb{border-top:1px solid var(--line);padding:9px 11px}.themecard .lb b{font-size:13px;display:block}.themecard .lb span{color:var(--mut);font-size:11px}
