.topbar{
  min-height:72px;
  background:#06101cee;
  border-bottom:1px solid #6bbbd420;
  box-shadow:0 10px 40px #0004;
}

.brand-mark{
  width:42px;
  height:42px;
  border-radius:12px;
  background:linear-gradient(145deg,#39cdf4,#177cb7);
  box-shadow:0 10px 34px #1cb6e344;
}

.brand strong{font-size:1.08rem;letter-spacing:.1em}
.brand small{color:#6f91ae;letter-spacing:.19em}
.nav a{font-weight:650;letter-spacing:.015em}
.nav a.active{box-shadow:inset 0 0 0 1px #5fd7fa26}

.button{
  min-height:43px;
  border-radius:10px;
  letter-spacing:.015em;
  transition:transform .2s,border-color .2s,background .2s,box-shadow .2s;
}
.button.primary{
  color:#03151f;
  background:linear-gradient(135deg,#55d7f5,#27a9d8);
  box-shadow:0 10px 28px #23b8e23d,inset 0 1px #ffffff66;
}
.button.primary:hover{background:linear-gradient(135deg,#82e7ff,#43bee6);box-shadow:0 14px 36px #23b8e255}
.button.secondary{border-color:#355775;background:#10233a;color:#eaf6ff}
.button.ghost{color:#a9bed3}
.button:active{transform:translateY(1px)}

.panel{
  border-color:#233e5b;
  background:linear-gradient(150deg,#102035f5,#0b1727f5);
  box-shadow:var(--shadow-card),inset 0 1px #ffffff07;
}
.panel-head h2{letter-spacing:-.015em}

.toolbar{
  padding:12px;
  border-color:#284762;
  background:#091727e6;
  box-shadow:0 14px 35px #0002;
}
.toolbar input,.toolbar select,.form-grid input,.form-grid select,.form-grid textarea,label input,label select,label textarea{
  min-height:44px;
  border-color:#2a4764;
  background:#071421;
  color:#eaf3fc;
}
.toolbar input[type="search"]{width:auto;flex:1 1 320px}
.toolbar select{width:auto;flex:0 1 190px}
.toolbar>.button{flex:0 0 auto}
.form-grid textarea,label textarea{min-height:92px}
.toolbar input::placeholder,.form-grid input::placeholder,.form-grid textarea::placeholder{color:#607892}
.toolbar input:hover,.toolbar select:hover,.form-grid input:hover,.form-grid select:hover,.form-grid textarea:hover{border-color:#3b6383}

.list-item{
  padding:17px 18px;
  border-color:#213d59;
  background:linear-gradient(145deg,#0f1e31,#0b1828);
  box-shadow:0 8px 28px #0002;
  transition:transform .18s,border-color .18s,background .18s;
}
.list-item:hover{transform:translateY(-2px);border-color:#4baccb;background:#13283d}
.list-item.selected{border-color:#50c7e9;box-shadow:0 0 0 1px #50c7e933,0 12px 34px #0003}

.tag{padding:3px 8px;border-color:#ffffff10;background:#ffffff0a}
.tag.good{border-color:#70e0cc25}
.tag.warn{border-color:#f4bd6a25}
.tag.danger{border-color:#ff978b25}

.detail{overflow:hidden}
.detail:before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  right:0;
  height:3px;
  background:linear-gradient(90deg,var(--cyan),var(--teal),transparent);
}
.detail dl{padding-top:16px;border-top:1px solid #ffffff0d}
.detail dt{color:#7891aa}.detail dd{color:#d8e5f1}

.dashboard-stat{
  padding:16px;
  border-color:#ffffff0c;
  background:linear-gradient(145deg,#ffffff09,#ffffff04);
}
.dashboard-stat strong{font-size:1.75rem;color:#89e9d5}
.dashboard-stat:hover{border-color:#4385a2;background:#ffffff0d}

.progress{height:6px;background:#ffffff12}
.progress i{background:linear-gradient(90deg,#38bde8,#79e6cd);box-shadow:0 0 12px #5ee2d455}
.pagination{padding:9px 12px;border:1px solid #1e3852;border-radius:10px;background:#091624}

.toast{background:#142a42;border-color:#4ec5e8;box-shadow:0 22px 65px #0008}
.import-dialog{background:linear-gradient(150deg,#112238,#0b1727)}

.empty-action{
  border:1px dashed #345675;
  border-radius:14px;
  background:linear-gradient(135deg,#0b192a,#0e2235);
}
