@import"https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700;800&display=swap";.app-shell{display:flex;min-height:100vh}.app-main{flex:1;margin-left:var(--sidebar-w);min-width:0}.app-content{padding:40px}.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar-w);background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:16px 14px;overflow-y:auto}.sidebar-logo{display:flex;align-items:center;gap:12px;padding:4px 8px 20px}.logo-box{width:46px;height:46px;border-radius:14px;background:var(--primary);color:#fff;display:grid;place-items:center}.logo-name{font-weight:800;font-size:20px;line-height:1.1}.logo-name span{color:var(--primary)}.logo-sub{font-size:11px;letter-spacing:2px;color:var(--muted);font-weight:600}.sidebar-nav{display:flex;flex-direction:column;gap:6px}.nav-section{font-size:12px;letter-spacing:1.5px;color:var(--muted);font-weight:700;padding:14px 10px 8px}.nav-item{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:14px;color:#475569;font-weight:500;font-size:16px}.nav-item:hover{background:var(--bg)}.nav-item.active{background:var(--primary-soft);color:var(--primary)}.nav-badge{margin-left:auto;font-style:normal;font-size:12px;font-weight:700;background:#dbeafe;color:var(--primary);padding:2px 9px;border-radius:99px}.role-box{margin-top:24px;padding:14px 16px;border:1px solid var(--border);border-radius:14px;background:#f8fafc;display:flex;flex-direction:column;gap:3px}.role-box small{font-size:11px;letter-spacing:1px;font-weight:700;color:var(--muted)}.role-box strong{font-size:16px}.role-box span{font-size:12px;color:var(--muted)}.support-card{background:var(--dark);color:#fff;border-radius:18px;padding:20px;margin-top:auto}.sidebar-nav+.role-box+.support-card{margin-top:24px}.support-icon{width:36px;height:36px;border-radius:10px;background:#1e293b;color:#60a5fa;display:grid;place-items:center;margin-bottom:14px}.support-card p{font-size:13px;color:#94a3b8;margin:4px 0 10px}.support-card a{color:#60a5fa;font-weight:600;font-size:18px}.header{height:var(--header-h);background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 40px;position:sticky;top:0;z-index:10}.search-box{display:flex;align-items:center;gap:10px;background:var(--bg);padding:0 14px;height:48px;width:360px;border-radius:14px;color:var(--muted)}.search-box input{flex:1;border:none;background:transparent;outline:none;color:var(--text)}.search-box kbd{background:#fff;border-radius:8px;padding:4px 8px;font-size:12px;font-family:inherit}.header-right{display:flex;align-items:center;gap:18px}.icon-btn{position:relative;border:none;background:none;color:#475569;display:grid;place-items:center}.icon-btn .dot{position:absolute;top:-2px;right:-1px;width:8px;height:8px;background:var(--primary);border-radius:50%}.divider{width:1px;height:34px;background:var(--border)}.user-chip{display:flex;align-items:center;gap:12px;color:var(--muted)}.avatar{width:44px;height:44px;border-radius:12px;background:var(--primary);color:#fff;font-weight:700;display:grid;place-items:center}.user-name{font-weight:700;color:var(--text);font-size:15px}.user-role{font-size:12px;color:var(--muted)}@media (max-width: 900px){.sidebar{display:none}.app-main{margin-left:0}.app-content{padding:20px}.header{padding:0 20px}.search-box{width:100%;max-width:260px}}.login-page{display:grid;grid-template-columns:1fr 1fr;min-height:100vh;background:#fff}.login-left{background:var(--primary);color:#fff;padding:44px;display:flex;flex-direction:column;justify-content:space-between}.login-brand{display:flex;align-items:center;gap:14px;font-weight:800;font-size:24px}.logo-box.white{background:#fff;color:var(--primary)}.login-left h1{font-size:48px;line-height:1.15;font-weight:800;margin-bottom:20px}.login-left p{max-width:520px;line-height:1.8;color:#dbeafe}.login-stats{display:flex;gap:14px;margin-top:40px}.login-stats div{background:#ffffff24;border-radius:16px;padding:18px 20px;min-width:130px}.login-stats b{display:block;font-size:24px;font-weight:800}.login-stats span{font-size:13px;color:#dbeafe}.login-left footer{font-size:14px;color:#dbeafe}.login-right{display:grid;place-items:center;padding:40px}.login-form{width:100%;max-width:560px}.login-form h2{font-size:38px;font-weight:800}.login-desc{color:var(--muted);margin:8px 0 28px;line-height:1.6}.label{display:block;font-weight:700;font-size:14px;margin:20px 0 10px}.role-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.role-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:16px 8px;display:flex;flex-direction:column;align-items:center;gap:10px;font-weight:600;font-size:14px;color:var(--text)}.role-card.selected{background:var(--primary-soft);border-color:#93c5fd;color:var(--primary-dark)}.role-badge{width:40px;height:40px;border-radius:10px;color:#fff;font-weight:700;font-size:14px;display:grid;place-items:center}.input{width:100%;height:56px;padding:0 18px;border:1px solid var(--border);background:#f8fafc;border-radius:14px;outline:none}.input:focus,.input.pw:focus-within{border-color:var(--primary)}.input.pw{display:flex;align-items:center;padding-right:8px}.input.pw input{flex:1;border:none;background:transparent;outline:none;height:100%}.input.pw button{border:none;background:none;color:var(--primary);font-weight:600;padding:8px 12px}.row-between{display:flex;justify-content:space-between;align-items:center;margin:16px 0 24px}.remember{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:14px}.link{color:var(--primary);font-size:14px}.submit{width:100%;justify-content:center;padding:16px;font-size:16px}@media (max-width: 900px){.login-page{grid-template-columns:1fr}.login-left{display:none}}.error-box{background:#fef2f2;color:#b91c1c;border:1px solid #fecaca;border-radius:12px;padding:12px 16px;font-size:14px;margin-bottom:16px}.submit:disabled{opacity:.7;cursor:not-allowed}.auth-switch{text-align:center;color:var(--muted);font-size:14px;margin-top:20px}.auth-switch a{color:var(--primary);font-weight:600}.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.page-head h1{font-size:34px;font-weight:800;letter-spacing:-.5px}.page-head p{color:var(--muted);margin-top:6px}.section{margin-top:28px}.stat-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:18px}.stat-icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center}.tone-blue{background:#eaf2ff;color:#2f7bff}.tone-sky{background:#e0f2fe;color:#0284c7}.tone-green{background:#dcfce7;color:#16a34a}.tone-purple{background:#ede9fe;color:#7c3aed}.trend{display:inline-flex;align-items:center;gap:4px;background:#dcfce7;color:#16a34a;font-size:12px;font-weight:700;padding:4px 10px;border-radius:99px}.stat-value{font-size:32px;font-weight:800;letter-spacing:-.5px}.stat-label{color:var(--muted);font-weight:500;margin-top:4px}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a73;display:grid;place-items:center;padding:20px;z-index:100;overflow-y:auto}.modal{background:#fff;border-radius:20px;width:100%;max-width:520px;padding:28px;box-shadow:0 24px 60px #0f172a40}.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.modal-head h3{font-size:22px;font-weight:800}.modal-x{border:none;background:var(--bg);width:36px;height:36px;border-radius:10px;display:grid;place-items:center;color:var(--muted)}.form-label{display:block;font-weight:700;font-size:14px;margin:18px 0 8px}.form-input{width:100%;height:48px;padding:0 14px;border:1px solid var(--border);background:#f8fafc;border-radius:12px;outline:none}.form-input:focus{border-color:var(--primary)}.form-input:disabled{opacity:.6;cursor:not-allowed}.form-error{background:#fef2f2;color:#b91c1c;border:1px solid #fecaca;border-radius:12px;padding:12px 16px;font-size:14px;margin-top:18px}.form-hint{font-size:12px;color:var(--muted);margin-top:6px}.form-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:24px}.form-actions .btn:disabled{opacity:.7;cursor:not-allowed}.acc-card{padding:24px}.acc-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}.acc-tools{display:flex;gap:12px;flex-wrap:wrap}.acc-search{display:flex;align-items:center;gap:8px;border:1px solid var(--border);border-radius:12px;padding:0 14px;height:46px;color:var(--muted)}.acc-search input{border:none;outline:none;width:220px;background:transparent;color:var(--text)}.acc-select{border:1px solid var(--border);border-radius:12px;padding:0 14px;height:46px;background:#fff;color:var(--text)}.acc-scroll{overflow-x:auto;margin:20px -24px 0}.data-table{width:100%;border-collapse:collapse;min-width:860px}.data-table th{text-align:left;font-size:12px;letter-spacing:1px;color:var(--muted);font-weight:700;padding:14px 24px;background:#f8fafc;white-space:nowrap}.data-table td{padding:14px 24px;border-top:1px solid var(--border);font-size:14px;vertical-align:middle}.data-table tr.row-locked td{opacity:.55}.user-cell{display:flex;align-items:center;gap:12px}.user-cell .u-avatar{width:40px;height:40px;border-radius:12px;color:#fff;font-weight:700;font-size:14px;display:grid;place-items:center;flex-shrink:0}.user-cell b{display:block}.user-cell small{display:block;color:var(--muted);margin-top:2px}.pill{display:inline-block;font-size:12px;font-weight:700;padding:5px 12px;border-radius:99px;white-space:nowrap}.pill-ok{background:#dcfce7;color:#15803d}.pill-off{background:#fee2e2;color:#b91c1c}.pill-wait{background:#fef3c7;color:#b45309;margin-left:6px}.row-actions{display:flex;gap:8px;flex-wrap:nowrap}.act-btn{border:1px solid var(--border);background:#fff;border-radius:10px;padding:7px 12px;font-size:13px;font-weight:600;color:var(--text);white-space:nowrap}.act-btn:hover:not(:disabled){background:var(--bg)}.act-btn:disabled{opacity:.4;cursor:not-allowed}.act-btn.danger{color:#b91c1c}.act-btn.success{color:#15803d}.acc-empty{text-align:center;color:var(--muted);padding:40px 0 20px}.acc-foot{display:flex;justify-content:space-between;align-items:center;margin-top:16px;font-size:14px;color:var(--muted);flex-wrap:wrap;gap:12px}.acc-pager{display:flex;gap:8px;align-items:center}.acc-pager button{min-width:40px;height:40px;border-radius:10px;border:1px solid var(--border);background:#fff;font-weight:600;padding:0 12px}.acc-pager button:disabled{opacity:.4;cursor:not-allowed}.acc-banner{background:#fef2f2;color:#b91c1c;border:1px solid #fecaca;border-radius:12px;padding:12px 16px;font-size:14px;margin-top:20px}.code-link{color:var(--primary);font-weight:800;white-space:nowrap}.code-link:hover{text-decoration:underline}.pill-regional{background:#ede9fe;color:#6d28d9}.pill-local{background:#e0f2fe;color:#0369a1}.wh-back{display:inline-flex;align-items:center;gap:6px;color:var(--primary);font-weight:600;margin-bottom:18px}.wh-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}.wh-title{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.wh-title h1{font-size:32px;font-weight:800;letter-spacing:-.5px}.wh-code{background:var(--primary-soft);color:var(--primary);padding:5px 14px;border-radius:10px;font-weight:800;font-size:16px}.wh-actions{display:flex;gap:10px;flex-wrap:wrap}.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:20px}.info-item small{display:block;color:var(--muted);font-size:12px;letter-spacing:.5px;font-weight:700;margin-bottom:6px;text-transform:uppercase}.info-item div{font-weight:600;line-height:1.5}.member-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}.child-list{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}.child-chip{border:1px solid var(--border);background:#f8fafc;border-radius:12px;padding:8px 14px;font-size:14px}.child-chip b{color:var(--primary);margin-right:6px}.panel-empty{text-align:center;color:var(--muted);padding:28px 8px 12px;font-size:14px;line-height:1.6}@media (max-width: 1100px){.info-grid,.member-grid{grid-template-columns:1fr}}.muted{color:var(--muted)}.st{display:inline-block;font-size:12px;font-weight:700;padding:5px 12px;border-radius:99px;white-space:nowrap}.st-amber{background:#fef3c7;color:#b45309}.st-blue{background:#dbeafe;color:#1d4ed8}.st-sky{background:#e0f2fe;color:#0369a1}.st-purple{background:#ede9fe;color:#6d28d9}.st-green{background:#dcfce7;color:#15803d}.st-red{background:#fee2e2;color:#b91c1c}.st-gray{background:#e2e8f0;color:#475569}.of-section{margin-top:24px}.of-section h3{font-size:17px;font-weight:800;margin-bottom:4px}.of-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0 20px}.of-grid .full{grid-column:1 / -1}.of-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:0 20px}.of-fee{display:flex;justify-content:space-between;align-items:center;background:var(--primary-soft);border-radius:14px;padding:16px 20px;margin-top:24px;flex-wrap:wrap;gap:8px}.of-fee b{font-size:22px;color:var(--primary)}.of-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:24px}.of-actions .btn:disabled{opacity:.7;cursor:not-allowed}textarea.form-input{height:90px;padding:12px 14px;resize:vertical;font-family:inherit}.od-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}.od-title{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.od-title h1{font-size:30px;font-weight:800;letter-spacing:-.5px}.od-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}.od-info{display:grid;grid-template-columns:repeat(2,1fr);gap:18px 20px;margin-top:18px}.od-info .full{grid-column:1 / -1}.od-info small{display:block;color:var(--muted);font-size:12px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;margin-bottom:5px}.od-info div>span,.od-info>div>div{font-weight:600;line-height:1.5}.timeline{list-style:none;margin-top:18px}.timeline li{position:relative;padding:0 0 22px 28px;border-left:2px solid var(--border);margin-left:7px}.timeline li:last-child{border-left-color:transparent;padding-bottom:0}.timeline li:before{content:"";position:absolute;left:-8px;top:2px;width:14px;height:14px;border-radius:50%;background:#cbd5e1;border:3px solid #fff;box-shadow:0 0 0 1px var(--border)}.timeline li.latest:before{background:var(--primary)}.timeline .tl-note{margin-top:6px;color:#334155;line-height:1.5;font-size:14px}.timeline .tl-meta{margin-top:4px;color:var(--muted);font-size:12px}.od-alert{background:#fef3c7;color:#92400e;border:1px solid #fde68a;border-radius:12px;padding:12px 16px;font-size:14px;margin-top:20px;line-height:1.5}.od-ok{background:#dcfce7;color:#166534;border:1px solid #bbf7d0;border-radius:12px;padding:12px 16px;font-size:14px;margin-top:20px}.track-box{display:flex;gap:12px;flex-wrap:wrap}.track-box .form-input{flex:1;min-width:240px;height:52px;font-size:16px;text-transform:uppercase}@media (max-width: 900px){.of-grid,.of-grid-3,.od-grid,.od-info{grid-template-columns:1fr}}.chart-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}.select-btn{font-weight:500;padding:10px 16px}.bars{display:flex;gap:12px;margin-top:28px}.bars-y{display:flex;flex-direction:column;justify-content:space-between;height:220px;font-size:12px;color:var(--muted);text-align:right;width:28px}.bars-plot{position:relative;flex:1;height:244px}.bars-grid{position:absolute;top:0;right:0;bottom:24px;left:0;display:flex;flex-direction:column;justify-content:space-between}.bars-grid i{display:block;border-top:1px solid #f1f5f9}.bars-cols{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;justify-content:space-around}.bars-col{display:flex;flex-direction:column;align-items:center;height:100%}.bars-col>span{height:24px;line-height:24px;font-size:12px;color:var(--muted);font-weight:600}.bars-pair{display:flex;align-items:flex-end;gap:6px;height:220px}.bars-pair i{display:block;width:14px;border-radius:8px 8px 0 0}.b-done{background:#2f7bff}.b-pending{background:#dbe7fb}.legend{display:flex;justify-content:center;gap:24px;margin-top:14px;font-size:13px;font-weight:600}.legend i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px}.donut-wrap{display:flex;align-items:center;gap:24px;margin-top:28px;flex-wrap:wrap}.donut-box{position:relative;width:180px;height:180px;flex-shrink:0}.donut{width:100%;height:100%}.donut-center{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.donut-center strong{font-size:28px;font-weight:800}.donut-center span{font-size:12px;color:var(--muted)}.donut-legend{list-style:none;flex:1;min-width:150px;display:flex;flex-direction:column;gap:14px}.donut-legend li{display:flex;align-items:center;gap:10px;font-size:14px;color:#475569}.donut-legend li i{width:8px;height:8px;border-radius:50%}.donut-legend li b{margin-left:auto;color:var(--text)}.notice{margin-top:26px;background:#ecfdf5;color:#047857;border-radius:12px;padding:16px 18px;font-size:14px}.count-pill{margin-left:8px;background:#dbeafe;color:var(--primary);font-size:12px;font-weight:700;padding:3px 10px;border-radius:99px;vertical-align:middle}.table-tools{display:flex;gap:12px;flex-wrap:wrap}.mini-search{display:flex;align-items:center;gap:8px;border:1px solid var(--border);border-radius:12px;padding:0 14px;height:46px;color:var(--muted)}.mini-search input{border:none;outline:none;width:190px}.mini-select{border:1px solid var(--border);border-radius:12px;padding:0 14px;height:46px;background:#fff}.table-scroll{overflow-x:auto;margin:20px -24px 0}.table{width:100%;border-collapse:collapse;min-width:900px}.table th{text-align:left;font-size:12px;letter-spacing:1px;color:var(--muted);font-weight:700;padding:14px 24px;background:#f8fafc}.table td{padding:16px 24px;border-top:1px solid var(--border);font-size:14px}.table td small{display:block;color:var(--muted);margin-top:3px}.table .code{color:var(--primary);font-weight:700}.badge-warn{background:#fef3c7;color:#b45309;font-size:12px;font-weight:700;padding:5px 12px;border-radius:99px;white-space:nowrap}.table-foot{display:flex;justify-content:space-between;align-items:center;margin-top:16px;font-size:14px;color:var(--muted)}.pager{display:flex;gap:8px}.pager button{width:40px;height:40px;border-radius:10px;border:1px solid var(--border);background:#fff;font-weight:600}.pager button.on{background:var(--primary);border-color:var(--primary);color:#fff}.chart-empty-note{position:absolute;top:0;right:0;bottom:24px;left:0;display:grid;place-items:center;color:var(--muted);font-size:14px;pointer-events:none}.notice-empty{background:#f8fafc;color:var(--muted)}.table-empty{text-align:center;color:var(--muted);padding:48px 24px!important}:root{--primary: #2f7bff;--primary-dark: #1d63e8;--primary-soft: #eaf2ff;--bg: #f5f7fb;--surface: #ffffff;--border: #e8ecf3;--text: #0f172a;--muted: #64748b;--dark: #0f172a;--success: #16a34a;--warning: #d97706;--danger: #ef4444;--radius: 16px;--shadow: 0 1px 3px rgba(15, 23, 42, .06), 0 4px 14px rgba(15, 23, 42, .04);--sidebar-w: 280px;--header-h: 84px}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:Be Vietnam Pro,system-ui,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,select{font-family:inherit;font-size:15px}button{cursor:pointer}.btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border);background:var(--surface);padding:12px 22px;border-radius:12px;font-weight:600;color:var(--text)}.btn-primary{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:0 6px 16px #2f7bff4d}.btn-primary:hover{background:var(--primary-dark)}.btn-sm{padding:8px 16px;font-size:14px;border-radius:10px;box-shadow:none}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px}.card-title{font-size:18px;font-weight:700}.card-sub{font-size:13px;color:var(--muted);margin-top:4px}.grid{display:grid;gap:24px}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}.grid-main{grid-template-columns:2fr 1fr}@media (max-width: 1100px){.grid-4{grid-template-columns:repeat(2,1fr)}.grid-main{grid-template-columns:1fr}}@media (max-width: 700px){.grid-3,.grid-4{grid-template-columns:1fr}}.placeholder{display:flex;align-items:center;justify-content:center;min-height:220px;border:2px dashed var(--border);border-radius:12px;color:var(--muted);font-size:14px;margin-top:20px}