:root{font-family:"Segoe UI Variable","Segoe UI",Inter,Arial,sans-serif;color:#263b4b;background:#f4f6f8}
button{transition:background-color .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease,transform .15s ease}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #3c9d65;outline-offset:2px}
.side{background:#223343}
.side-brand{border-bottom-color:#354d5c}
.nav button.active{background:#304f59;box-shadow:inset 3px 0 #67c68a}
.nav button:hover{background:#304657}
.top{background:#fff}
.page{padding-top:33px}
.page-head{margin-bottom:27px}
.page h1{font-size:30px;font-weight:760;line-height:1.15}
.page-head p{font-size:13px}
.eyebrow{font-size:10px;letter-spacing:.15em}
.badge{padding:8px 11px;font-weight:700}
.card,.dashboard-stat{box-shadow:0 2px 8px #1a33470a}
.card-head{padding:21px 23px}
.card-head h2{font-size:17px;font-weight:730}
.card-head p{font-size:12px;margin-top:6px}
.primary{font-size:12px;min-height:36px}
.subtle{font-size:12px}
.search{min-height:36px}
.gateway-banner{display:flex;align-items:center;justify-content:space-between;gap:25px;min-height:143px;padding:24px 28px;margin-bottom:25px;background:#273e4b;color:#fff;border-radius:5px;border-left:5px solid #68c88b;box-shadow:0 6px 16px #142c3d18}
.banner-kicker{color:#9fcab2;font-size:10px;letter-spacing:.15em;font-weight:800}
.gateway-banner h2{font-size:26px;letter-spacing:-.035em;margin:8px 0 8px}
.gateway-banner p{display:flex;align-items:center;gap:4px;color:#cad8dc;font-size:12px;margin:0}
.banner-separator{color:#8198a1;margin:0 7px}
.banner-actions{display:flex;align-items:center;gap:22px}
.banner-database{display:grid;gap:5px;color:#91acb7;font-size:9px;font-weight:800;letter-spacing:.12em;white-space:nowrap}
.banner-database strong{font-size:13px;letter-spacing:0;color:#eaf7ee;text-transform:capitalize}
.banner-actions button{background:transparent;border:1px solid #75919a;color:#fff;border-radius:3px;padding:10px 13px;font-size:12px;white-space:nowrap}
.banner-actions button:hover{background:#365363;border-color:#a8c9b1}
.section-caption{display:flex;align-items:center;justify-content:space-between;margin:0 0 11px;color:#8497a2;font-size:10px;letter-spacing:.12em;font-weight:800}
.section-caption span:last-child{letter-spacing:0;font-weight:500;font-size:11px}
.dashboard-stats{gap:16px;margin-bottom:21px}
.dashboard-stat{min-height:112px;gap:14px;padding:19px;border:1px solid #dce4e8;border-top:3px solid #69be86}
.dashboard-stat:hover{box-shadow:0 5px 18px #183f2a18;transform:translateY(-2px)}
.metric-icon{width:44px;height:44px;background:#eaf5ee;color:#3c9860;border-radius:4px}
.metric-data strong{font-size:29px;font-weight:740}
.metric-data small{font-size:12px;color:#718997}
.metric-arrow{align-self:flex-start;font-size:15px;color:#9ab2ba}
.dashboard-grid{grid-template-columns:minmax(0,1.35fr) minmax(310px,1fr);gap:20px;margin-bottom:20px}
.live-label{display:inline-flex;align-items:center;color:#5a9d70;font-weight:800;letter-spacing:.12em;font-size:10px}
.live-label .status-dot{width:7px;height:7px;margin-right:8px}
.traffic-feature{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:25px 26px 23px;border-bottom:1px solid #ecf0f2}
.traffic-feature>div:first-child{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.traffic-feature small{flex-basis:100%;color:#8197a1;font-size:10px;letter-spacing:.11em;font-weight:800}
.traffic-feature strong{font-size:38px;line-height:1;font-weight:730;letter-spacing:-.06em;color:#263d4d}
.traffic-feature span{font-size:12px;color:#8194a0}
.traffic-activity{display:grid;gap:5px;text-align:right;border-left:1px solid #e7edef;padding-left:23px}
.traffic-activity span{font-size:10px;color:#8295a1;letter-spacing:.11em;font-weight:800;white-space:nowrap}
.traffic-activity strong{font-size:25px;color:#4c9b65}
.traffic-breakdown{display:grid;gap:16px;padding:22px 26px 26px}
.traffic-line{display:grid;grid-template-columns:61px minmax(0,1fr) 32px;gap:12px;align-items:center;color:#657f8e;font-size:12px}
.traffic-line strong{text-align:right;color:#2e4a58}
.traffic-track,.composition-track{display:block;min-width:0;width:100%;height:7px;appearance:none;border:0;background:#e9eff1;border-radius:20px;overflow:hidden}
.traffic-track::-webkit-progress-bar,.composition-track::-webkit-progress-bar{background:#e9eff1;border-radius:20px}
.traffic-track::-webkit-progress-value,.composition-track::-webkit-progress-value{background:#65b784;border-radius:20px}
.traffic-writing::-webkit-progress-value{background:#5c98b8}
.traffic-waiting::-webkit-progress-value{background:#e5af5f}
.traffic-track::-moz-progress-bar,.composition-track::-moz-progress-bar{background:#65b784;border-radius:20px}
.traffic-writing::-moz-progress-bar{background:#5c98b8}
.traffic-waiting::-moz-progress-bar{background:#e5af5f}
.node-card-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 22px;padding:16px 0;border-top:1px solid #e9eef1;color:#8096a0;font-size:11px}
.node-card-footer button{background:none;border:0;color:#3e9a61;font-size:11px;font-weight:750}
.dashboard-bottom{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.composition-list{display:grid;gap:12px;padding:21px 23px 25px}
.composition-list button{display:grid;grid-template-columns:82px minmax(0,1fr) 28px;gap:12px;align-items:center;border:0;background:transparent;text-align:left;color:#526e7d;font-size:12px;padding:3px}
.composition-list button:hover{color:#318457}
.composition-list strong{text-align:right;color:#2b4857}
.quick-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:22px}
.quick-grid button{min-height:51px;padding:13px 15px;font-size:12px;font-weight:650}
.quick-grid button:hover{box-shadow:0 2px 7px #2a7b4615}
.card-head .count-pill{font-weight:700}
table{font-size:13px}
th{padding-top:13px;padding-bottom:13px;color:#718794}
td{padding-top:16px;padding-bottom:16px}
td strong{font-size:13px;color:#263e4d}
td code{color:#617f90}
.row-actions button{font-size:12px}
.detail-fields dt{font-size:11px}
.detail-fields dd code{font-size:12px}
.editor{border-radius:5px}
.editor-heading h2{font-size:24px}
.editor-actions{box-shadow:0 -3px 8px #152e3b08}
.login-brand{background:#243b49}
.login-brand .brand-mark{clip-path:none;border-radius:5px;transform:rotate(45deg);background:#65bd83}
.login-brand h1{letter-spacing:-.05em}
.login-form button{min-height:44px}
@media(max-width:1100px){.dashboard-grid{grid-template-columns:1fr}.dashboard-bottom{grid-template-columns:1fr}}
@media(max-width:640px){.page{padding-top:22px}.page h1{font-size:27px}.gateway-banner{align-items:flex-start;flex-direction:column;padding:20px;gap:17px}.gateway-banner h2{font-size:22px}.banner-actions{justify-content:space-between;width:100%}.dashboard-stat{min-height:98px;padding:13px}.metric-icon{width:34px;height:34px}.metric-data strong{font-size:23px}.traffic-feature{padding:20px 17px}.traffic-feature strong{font-size:33px}.traffic-breakdown{padding:20px 17px}.dashboard-bottom{gap:15px}.composition-list{padding:18px}.quick-grid{padding:17px}.node-card-footer{margin:0 17px}.dashboard-status{align-items:flex-start}}