:root{--byt-green:#60c20a;--byt-green-dark:#469305;--byt-green-deep:#326903;--byt-green-light:#7be622;--byt-green-soft:#f2fcf0;--byt-green-border:#c3f59e;--byt-neon:#9f0;--byt-neon-dark:#7ed600;--byt-gray:#b3b3b3;--byt-black:#000;--bg:#f8fafc;--surface:#fff;--surface-soft:#f1f5f9;--surface-elevated:#fff;--text:#0f172a;--text-muted:#64748b;--text-subtle:#94a3b8;--border:#e2e8f0;--border-strong:#cbd5e1;--border-focus:#60c20a;--primary:#60c20a;--primary-dark:#469305;--primary-light:#7be622;--primary-soft:#f2fcf0;--primary-soft-hover:#e1f9db;--nav-bg:#0f172a;--nav-soft:#1e293b;--success:#16a34a;--success-bg:#f0fdf4;--success-border:#bbf7d0;--success-text:#15803d;--warning:#d97706;--warning-bg:#fffbeb;--warning-border:#fde68a;--warning-text:#b45309;--danger:#dc2626;--danger-bg:#fef2f2;--danger-border:#fecaca;--danger-text:#b91c1c;--info:#2563eb;--info-bg:#eff6ff;--info-border:#bfdbfe;--info-text:#1d4ed8;--ready-bg:#f7fee7;--ready-border:#d9f99d;--ready-text:#4d7c0f;--shadow-sm:0 1px 2px 0 #0f172a0d;--shadow:0 4px 6px -1px #0f172a0f, 0 2px 4px -2px #0f172a0a;--shadow-md:0 10px 15px -3px #0f172a14, 0 4px 6px -4px #0f172a0a;--shadow-lg:0 20px 25px -5px #0f172a1a, 0 8px 10px -6px #0f172a0a;--radius-sm:6px;--radius:12px;--radius-lg:18px;--font-sans:"Century Gothic", "Outfit", "Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"JetBrains Mono", "Fira Code", monospace}*{box-sizing:border-box}html,body{background:var(--bg);min-height:100%;color:var(--text);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0}body{min-height:100vh}a{color:inherit;text-decoration:none}button,input,select,textarea{font-family:inherit;font-size:inherit}button{cursor:pointer}.app-shell{min-height:100vh;display:flex}.sidebar{color:#f8fafc;z-index:30;background:linear-gradient(#0b1329 0%,#070d1b 100%);border-right:1px solid #ffffff0f;flex-direction:column;width:280px;padding:20px 16px;display:flex;position:fixed;inset:0 auto 0 0;box-shadow:4px 0 24px #00000040}.brand-header{border-bottom:1px solid #ffffff14;flex-direction:column;gap:12px;margin-bottom:20px;padding-bottom:16px;display:flex;position:relative}.brand-card{border-radius:var(--radius-sm);background:#fff;border:1px solid #fff3;justify-content:center;align-items:center;padding:8px 12px;display:flex;box-shadow:0 4px 12px #00000026}.brand-logo-img{object-fit:contain;width:100%;max-height:38px}.brand-titles{padding:0 4px}.brand-titles strong{letter-spacing:-.01em;color:#fff;font-size:16px;font-weight:800;display:block}.brand-titles span{color:var(--byt-green);font-size:11.5px;font-weight:600;display:block}.mobile-close{color:#fff;cursor:pointer;background:0 0;border:0;display:none;position:absolute;top:0;right:0}.user-role-badge{color:var(--byt-green);font-size:11px;font-weight:700;display:block}.user-key-button{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px;transition:color .15s}.user-key-button:hover{color:#fff}.topbar-brand{align-items:center;gap:12px;display:flex}.topbar-icon-card{border-radius:var(--radius-sm);border:1px solid var(--border);width:34px;height:34px;box-shadow:var(--shadow-sm);background:#fff;place-items:center;padding:4px;display:grid}.topbar-icon-card img{object-fit:contain;width:100%;height:100%}.nav-list{gap:4px;display:grid}.nav-item{border-radius:var(--radius-sm);color:#94a3b8;border:1px solid #0000;align-items:center;gap:12px;min-height:44px;padding:0 14px;font-size:13.5px;font-weight:600;transition:all .2s;display:flex}.nav-item:hover{color:#fff;background:#ffffff12}.nav-item.active{color:#fff;box-shadow:inset 3.5px 0 0 var(--byt-green);background:linear-gradient(90deg,#60c20a38,#60c20a0d);border-color:#60c20a59}.nav-item.active svg{color:var(--byt-green)}.sidebar-footer{border-top:1px solid #ffffff14;gap:10px;margin-top:auto;padding-top:16px;display:grid}.user-box{border-radius:var(--radius-sm);background:#ffffff0a;border:1px solid #ffffff0f;align-items:center;gap:10px;padding:10px 12px;display:flex}.avatar{background:linear-gradient(135deg, var(--byt-green) 0%, var(--byt-green-dark) 100%);color:#fff;border-radius:50%;place-items:center;width:36px;height:36px;font-size:13px;font-weight:700;display:grid;box-shadow:0 2px 8px #60c20a4d}.user-box strong{color:#fff;font-size:13px;font-weight:600}.user-box span{color:#94a3b8;font-size:11px;font-weight:500;display:block}.logout-button{color:#f87171;background:0 0;justify-content:flex-start;width:100%}.logout-button:hover{color:#fca5a5;background:#ef44441f}.sidebar-overlay{display:none}.main-area{flex-direction:column;flex:1;min-width:0;margin-left:280px;display:flex}.topbar{background:var(--surface);border-bottom:1px solid var(--border);z-index:20;min-height:64px;box-shadow:var(--shadow-sm);justify-content:space-between;align-items:center;gap:16px;padding:0 28px;display:flex;position:sticky;top:0}.menu-button{color:var(--text);background:0 0;border:0;padding:6px;display:none}.topbar-label{text-transform:uppercase;letter-spacing:.05em;color:var(--byt-green-dark);font-size:11px;font-weight:700;display:block}.topbar strong{color:var(--text);font-size:13.5px;font-weight:600}.environment-pill{border:1px solid var(--byt-green-border);color:var(--byt-green-dark);background:#f0fdf0;border-radius:9999px;align-items:center;gap:8px;padding:6px 14px;font-size:12px;font-weight:600;display:inline-flex}.environment-pill span{background:var(--byt-green);border-radius:50%;width:8px;height:8px;box-shadow:0 0 0 2px #60c20a40}.page-content{flex:1;width:100%;max-width:1440px;margin:0 auto;padding:28px}.page-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:24px;display:flex}.eyebrow{text-transform:uppercase;letter-spacing:.08em;color:var(--byt-green-dark);margin-bottom:4px;font-size:11.5px;font-weight:700;display:inline-block}.page-header h1{letter-spacing:-.02em;color:var(--text);margin:0;font-size:26px;font-weight:800}.page-header p{color:var(--text-muted);margin:4px 0 0;font-size:14px}.page-actions{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.grid{gap:20px;display:grid}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}.span-2{grid-column:span 2}.span-3{grid-column:span 3}.span-4{grid-column:span 4}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:22px;transition:border-color .2s,box-shadow .2s}.card-header{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px;display:flex}.card-header h2{color:var(--text);letter-spacing:-.01em;margin:0;font-size:18px;font-weight:700}.card-header p{color:var(--text-muted);margin:4px 0 0;font-size:13px}.form-section{border-bottom:1px solid var(--border);margin-bottom:20px;padding-bottom:20px}.form-section:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}.section-title{align-items:center;gap:10px;margin-bottom:16px;display:flex}.section-number{background:var(--primary-soft);width:24px;height:24px;color:var(--byt-green-dark);border:1px solid var(--byt-green-border);border-radius:50%;place-items:center;font-size:12px;font-weight:800;display:grid}.section-title h3{color:var(--text);margin:0;font-size:15px;font-weight:700}.form-grid{grid-template-columns:repeat(12,1fr);gap:14px;display:grid}.col-1{grid-column:span 1}.col-2{grid-column:span 2}.col-3{grid-column:span 3}.col-4{grid-column:span 4}.col-5{grid-column:span 5}.col-6{grid-column:span 6}.col-7{grid-column:span 7}.col-8{grid-column:span 8}.col-9{grid-column:span 9}.col-10{grid-column:span 10}.col-11{grid-column:span 11}.col-12{grid-column:span 12}.field{flex-direction:column;gap:6px;display:flex}.field-label{color:var(--text);font-size:13px;font-weight:600}.field-label b{color:var(--danger);margin-left:2px}.field-hint{color:var(--text-muted);font-size:11.5px}.field-message{color:var(--danger);font-size:11.5px;font-weight:500}.input{background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--radius-sm);width:100%;height:42px;color:var(--text);outline:none;padding:0 14px;font-size:13.5px;transition:all .15s}.input:hover{border-color:#94a3b8}.input:focus{border-color:var(--byt-green);box-shadow:0 0 0 3px #60c20a33}.input:disabled,.input[readonly]{color:#64748b;cursor:not-allowed;border-color:var(--border);background:#f8fafc}.select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%3C64748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;padding-right:36px}.textarea{resize:vertical;height:auto;min-height:84px;padding:10px 14px}.check-card{border-radius:var(--radius-sm);background:var(--surface-soft);border:1px solid var(--border);cursor:pointer;align-items:flex-start;gap:12px;padding:14px;display:flex}.check-card input[type=checkbox]{width:18px;height:18px;accent-color:var(--byt-green-dark);margin-top:2px}.quick-chip{background:var(--surface-soft);color:var(--text-muted);border:1px solid var(--border-strong);cursor:pointer;border-radius:4px;padding:3px 8px;font-size:11px;font-weight:600;transition:all .15s}.quick-chip:hover{border-color:var(--byt-green);color:var(--byt-green-dark);background:var(--byt-green-soft)}.quick-chip.active{background:var(--byt-green);color:#fff;border-color:var(--byt-green-dark);box-shadow:0 2px 6px #60c20a4d}.button{border-radius:var(--radius-sm);white-space:nowrap;-webkit-user-select:none;user-select:none;border:1px solid #0000;justify-content:center;align-items:center;gap:8px;height:42px;padding:0 18px;font-size:13.5px;font-weight:700;transition:all .15s;display:inline-flex}.button-primary{background:linear-gradient(135deg, var(--byt-green) 0%, var(--byt-green-dark) 100%);color:#fff;box-shadow:0 2px 8px #60c20a4d}.button-primary:hover:not(:disabled){background:linear-gradient(135deg, var(--byt-green-light) 0%, var(--byt-green) 100%);transform:translateY(-1px);box-shadow:0 4px 12px #60c20a66}.button-secondary{background:var(--surface);border-color:var(--border-strong);color:var(--text)}.button-secondary:hover:not(:disabled){background:var(--surface-soft);border-color:#94a3b8}.button-ghost{color:var(--text-muted);background:0 0}.button-ghost:hover:not(:disabled){background:var(--surface-soft);color:var(--text)}.button-danger{background:var(--danger);color:#fff;box-shadow:0 2px 8px #dc262640}.button-danger:hover:not(:disabled){background:#b91c1c}.button:disabled{opacity:.6;cursor:not-allowed;transform:none!important}.spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:16px;height:16px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.notice{border-radius:var(--radius-sm);border:1px solid #0000;flex-direction:column;gap:4px;margin-bottom:16px;padding:14px 16px;font-size:13px;display:flex}.notice-success{background:var(--success-bg);border-color:var(--success-border);color:var(--success-text)}.notice-warning{background:var(--warning-bg);border-color:var(--warning-border);color:var(--warning-text)}.notice-error{background:var(--danger-bg);border-color:var(--danger-border);color:var(--danger-text)}.notice-info{background:var(--info-bg);border-color:var(--info-border);color:var(--info-text)}.table-wrapper{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);overflow-x:auto}.data-table{border-collapse:collapse;text-align:left;width:100%;font-size:13px}.data-table th{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border);background:#f8fafc;padding:12px 16px;font-size:11.5px;font-weight:700}.data-table td{border-bottom:1px solid var(--border);color:var(--text);vertical-align:middle;padding:14px 16px}.data-table tbody tr:last-child td{border-bottom:0}.data-table tbody tr:hover{background:#f8fafc}.status{white-space:nowrap;border:1px solid #0000;border-radius:9999px;align-items:center;gap:6px;padding:4px 10px;font-size:11.5px;font-weight:700;display:inline-flex}.status-dispatched{background:var(--success-bg);color:var(--success-text);border-color:var(--success-border)}.status-ready{background:var(--ready-bg);color:var(--ready-text);border-color:var(--ready-border)}.status-validating,.status-sending{background:var(--info-bg);color:var(--info-text);border-color:var(--info-border)}.status-blocked{background:var(--warning-bg);color:var(--warning-text);border-color:var(--warning-border)}.status-pending_reconciliation{color:#a16207;background:#fefce8;border-color:#fef08a}.status-retryable_error{background:var(--danger-bg);color:var(--danger-text);border-color:var(--danger-border)}.status-rejected{color:#991b1b;background:#fef2f2;border-color:#fca5a5}.status-draft{color:#475569;background:#f8fafc;border-color:#e2e8f0}.json-viewer{color:#38bdf8;border-radius:var(--radius-sm);font-family:var(--font-mono);background:#0f172a;max-height:360px;padding:16px;font-size:12px;overflow-x:auto}.process-list{color:var(--text-muted);gap:8px;margin:0;padding-left:20px;font-size:13px;display:grid}.login-page{background:#0b1329;min-height:100vh;display:flex}.login-panel{background:var(--bg);flex:1;justify-content:center;align-items:center;padding:40px 24px;display:flex}.login-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);width:100%;max-width:440px;box-shadow:var(--shadow-lg);padding:36px}.login-logo{align-items:center;gap:14px;margin-bottom:24px;display:flex}.login-logo img{object-fit:contain;width:auto;height:52px}.login-card h1{color:var(--text);margin:8px 0 6px;font-size:24px;font-weight:800}.login-card p{color:var(--text-muted);margin:0 0 24px;font-size:13.5px}.login-side{color:#fff;background:linear-gradient(135deg,#0b1329 0%,#162a05 100%);flex:1;justify-content:center;align-items:center;padding:60px;display:flex;position:relative;overflow:hidden}.login-side-content{z-index:10;max-width:480px;position:relative}.login-side-content h2{letter-spacing:-.02em;margin:12px 0 16px;font-size:32px;font-weight:800;line-height:1.25}.login-side-content p{color:#cbd5e1;margin-bottom:32px;font-size:15px;line-height:1.6}.feature-row{flex-wrap:wrap;gap:10px;display:flex}.feature-chip{color:#f1f5f9;background:#ffffff14;border:1px solid #ffffff1f;border-radius:9999px;padding:8px 14px;font-size:12.5px;font-weight:600}.detail-mini{background:var(--surface-soft);border-radius:var(--radius-sm);grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px;padding:12px;font-size:12px;display:grid}.detail-mini span{color:var(--text-muted);margin-bottom:2px;display:block}.detail-mini strong{color:var(--text);font-weight:700;font-family:var(--font-mono)}.stat-card{flex-direction:column;gap:8px;display:flex;position:relative;overflow:hidden}.stat-icon{border-radius:var(--radius-sm);background:var(--primary-soft);width:40px;height:40px;color:var(--byt-green-dark);border:1px solid var(--byt-green-border);place-items:center;display:grid}.stat-value{color:var(--text);letter-spacing:-.02em;margin-top:4px;font-size:28px;font-weight:800}.stat-label{color:var(--text-muted);font-size:13px;font-weight:500}.quick-action{border-radius:var(--radius);background:var(--surface);border:1px solid var(--border);align-items:center;gap:14px;padding:16px;transition:all .2s;display:flex}.quick-action:hover{border-color:var(--byt-green);background:var(--primary-soft);box-shadow:var(--shadow);transform:translateY(-2px)}.quick-action-icon{border-radius:var(--radius-sm);width:44px;height:44px;color:var(--byt-green);background:#0b1329;flex-shrink:0;place-items:center;display:grid}.quick-action strong{color:var(--text);font-size:14px;display:block}.quick-action span{color:var(--text-muted);font-size:12px}.integration-row{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:12px 0;display:flex}.integration-row:last-child{border-bottom:0}.integration-info{align-items:center;gap:12px;display:flex}.integration-dot{border-radius:50%;width:10px;height:10px}.integration-dot.ok{background:var(--success);box-shadow:0 0 0 3px #16a34a33}.integration-dot.error{background:var(--danger);box-shadow:0 0 0 3px #dc262633}.filter-bar{flex-wrap:wrap;align-items:flex-end;gap:12px;margin-bottom:20px;display:flex}.table-wrap{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);overflow-x:auto}.table-footer{border-top:1px solid var(--border);color:var(--text-muted);justify-content:space-between;align-items:center;padding:12px 16px;font-size:12px;display:flex}.empty-state{text-align:center;color:var(--text-muted);padding:40px 20px}.empty-state h3{color:var(--text);margin:12px 0 4px;font-size:16px;font-weight:700}.empty-state p{margin:0;font-size:13px}.detail-grid{grid-template-columns:repeat(4,1fr);gap:16px;font-size:13px;display:grid}.detail-grid span{color:var(--text-muted);margin-bottom:2px;font-size:12px;display:block}.detail-grid strong{color:var(--text);font-weight:700}.validation-list{gap:10px;display:grid}.validation-item{border-radius:var(--radius-sm);border:1px solid var(--border);flex-direction:column;gap:4px;padding:12px 14px;font-size:13px;display:flex}.validation-item.error{color:#991b1b;background:#fef2f2;border-color:#fecaca}.validation-item.warning{color:#b45309;background:#fffbeb;border-color:#fde68a}.icon-link{width:32px;height:32px;color:var(--text-muted);border-radius:6px;justify-content:center;align-items:center;transition:all .15s;display:inline-flex}.icon-link:hover{background:var(--surface-soft);color:var(--byt-green-dark)}.break-word{word-break:break-all}@media (max-width:1024px){.login-side{display:none}.sidebar{transition:transform .25s;transform:translate(-100%)}.sidebar.sidebar-open{transform:translate(0)}.sidebar-overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:25;background:#0f172a99;display:block;position:fixed;inset:0}.main-area{margin-left:0}.menu-button,.mobile-close{display:flex}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.span-2,.span-3,.span-4{grid-column:span 1}.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12{grid-column:span 12}}