:root{
  --sed-blue:#087fe5;
  --sed-blue-dark:#0759b8;
  --sed-cyan:#08c9d9;
  --sed-teal:#16b89b;
  --sed-green:#16b67a;
  --sed-navy:#0d2b63;
  --sed-ink:#102b5f;
  --sed-muted:#60708f;
  --sed-bg:#f5f9ff;
  --sed-card:#ffffff;
  --sed-border:#dce8f7;
  --sed-shadow:0 14px 45px rgba(13,43,99,.09);
  --sed-gradient:linear-gradient(135deg,#087fe5 0%,#08c9d9 48%,#16b89b 100%);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:var(--sed-bg);color:var(--sed-ink);line-height:1.6}
a{text-decoration:none}
.navbar{background:rgba(255,255,255,.96);backdrop-filter:blur(14px);border-bottom:1px solid var(--sed-border)}
.brand-logo{width:205px;height:62px;object-fit:contain;object-position:left center}
.footer-logo{width:190px;height:auto;object-fit:contain}
.auth-logo{width:min(330px,90%);height:110px;object-fit:contain}
.sidebar-logo{width:205px;max-width:100%;height:72px;object-fit:contain;object-position:left center}
.hero{position:relative;overflow:hidden;background:radial-gradient(circle at 88% 12%,rgba(8,201,217,.15),transparent 28%),radial-gradient(circle at 10% 30%,rgba(8,127,229,.12),transparent 30%),linear-gradient(135deg,#fff 0%,#f4f9ff 60%,#eefcf9 100%)}
.hero:after{content:"";position:absolute;width:420px;height:420px;border-radius:50%;right:-170px;bottom:-190px;background:rgba(22,184,155,.08)}
.hero-inner{position:relative;z-index:1}
.gradient-text{background:var(--sed-gradient);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-art,.feature-card,.info-card,.auth-card,.dashboard-card,.flow-card{border:1px solid var(--sed-border);border-radius:22px;background:var(--sed-card);box-shadow:var(--sed-shadow)}
.hero-art{overflow:hidden;background:linear-gradient(145deg,#fff,#f4fbff)}
.hero-logo-mark{width:92px;height:92px;object-fit:contain}
.feature-card,.info-card,.flow-card{height:100%;transition:transform .2s ease,box-shadow .2s ease}
.feature-card:hover,.info-card:hover,.flow-card:hover{transform:translateY(-4px);box-shadow:0 20px 50px rgba(13,43,99,.13)}
.icon-box{width:50px;height:50px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,#e8f4ff,#e5fffa);color:var(--sed-blue);font-size:22px;flex:0 0 auto}
.icon-box.teal{color:var(--sed-teal);background:#e9fbf6}.icon-box.navy{color:var(--sed-navy);background:#edf4ff}
.small-label{letter-spacing:.1em;text-transform:uppercase;font-weight:800;font-size:.72rem;color:var(--sed-blue)}
.section-pad{padding:88px 0}
.btn-sed{background:var(--sed-gradient);border:0;color:#fff;box-shadow:0 10px 24px rgba(8,127,229,.2);font-weight:700}
.btn-sed:hover,.btn-sed:focus{color:#fff;filter:brightness(1.03);transform:translateY(-1px)}
.btn-outline-sed{border:1px solid #9bc9f2;color:var(--sed-blue-dark);font-weight:700;background:#fff}.btn-outline-sed:hover{background:#edf7ff;color:var(--sed-blue-dark);border-color:#6eb2eb}
.badge-sed{background:#e8f5ff;color:var(--sed-blue-dark);border:1px solid #cde7fb}
.code-box{background:#0b234b;color:#dff7ff;border-radius:20px;padding:22px;overflow:auto;font-size:.88rem;box-shadow:0 18px 45px rgba(11,35,75,.18)}
.code-box .code-title{color:#fff}.code-box pre{margin:0;white-space:pre-wrap;word-break:break-word}
.flow-number{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;background:var(--sed-gradient);box-shadow:0 10px 22px rgba(8,127,229,.18)}
.flow-arrow{color:#7fa8cc;font-size:28px}
.footer{border-top:1px solid var(--sed-border);background:#fff}
.auth-page{min-height:100vh;background:radial-gradient(circle at 10% 10%,rgba(8,127,229,.13),transparent 28%),radial-gradient(circle at 90% 90%,rgba(22,184,155,.12),transparent 28%),linear-gradient(135deg,#f8fbff,#eff8ff);display:grid;place-items:center;padding:28px 0}
.auth-card{max-width:500px;width:100%;padding:34px}
.auth-brand{display:flex;justify-content:center;margin-bottom:8px}
.auth-side{min-height:100vh;background:linear-gradient(160deg,#072d68,#087fe5 65%,#08c9d9);color:#fff;display:flex;align-items:center;justify-content:center;padding:40px}
.auth-side img{width:270px;filter:brightness(0) invert(1);opacity:.96}
.form-control,.form-select,.input-group-text{border-color:#cfe0f2}.form-control:focus,.form-select:focus{border-color:#58a9e9;box-shadow:0 0 0 .25rem rgba(8,127,229,.12)}
.dashboard-shell{min-height:100vh}.sidebar{width:255px;min-height:100vh;background:#fff;border-right:1px solid var(--sed-border);position:sticky;top:0;flex-shrink:0}.sidebar .nav-link{color:#4b6284;border-radius:13px;padding:11px 13px;font-weight:600}.sidebar .nav-link i{font-size:1.05rem}.sidebar .nav-link.active,.sidebar .nav-link:hover{background:linear-gradient(90deg,#eaf6ff,#effcf9);color:var(--sed-blue-dark)}
.dashboard-main{min-width:0;background:var(--sed-bg)}.sticky-topbar{position:sticky;top:0;z-index:20;background:rgba(245,249,255,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--sed-border)}
.metric-icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:#eaf6ff;color:var(--sed-blue);font-size:22px}.metric-icon.green{background:#e8fbf4;color:var(--sed-green)}.metric-icon.red{background:#fff0f0;color:#dc4b4b}.metric-icon.teal{background:#e8fbf7;color:var(--sed-teal)}
.metric-value{font-size:1.8rem;font-weight:850;color:var(--sed-navy)}.status-ok{color:#087d57;background:#dcf8ed}.status-bad{color:#b83232;background:#ffe3e3}.status-pill{display:inline-flex;padding:5px 10px;border-radius:999px;font-size:.72rem;font-weight:800}
.table>:not(caption)>*>*{padding:13px 12px;border-bottom-color:#e8eef7}.table thead th{font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;color:#7183a0;background:#f8fbff}.table-responsive{border-radius:16px}
.alert{border-radius:14px}.test-code{min-height:230px;font-size:.82rem}.top-actions{display:flex;gap:8px;align-items:center}
@media(max-width:991px){.brand-logo{width:185px;height:58px}.section-pad{padding:65px 0}.sidebar{width:82px}.sidebar-logo{width:62px;height:58px;object-fit:cover;object-position:left}.sidebar .label,.sidebar .small-label{display:none}.sidebar .nav-link{display:flex;justify-content:center}.sidebar .nav-link i{margin:0!important}.sidebar .logout-label{display:none}}
@media(max-width:767px){.sidebar{display:none}.auth-card{margin:18px;padding:26px}.hero{padding-top:20px}.section-pad{padding:55px 0}.brand-logo{width:175px}.hero-logo-mark{width:75px;height:75px}.flow-arrow{display:none}.top-actions .hide-mobile{display:none}}
