:root {
  --neo-bg: #080d14;
  --neo-bg2: #0b111b;
  --neo-sidebar: #070c13;
  --neo-card: #111a26;
  --neo-card2: #0e1621;
  --neo-border: #263342;
  --neo-border2: #314255;
  --neo-text: #e8f0fb;
  --neo-muted: #8c9aac;
  --neo-muted2: #667489;
  --neo-green: #14f0a0;
  --neo-green2: #0bbd80;
  --neo-cyan: #25d9ff;
  --neo-blue: #4a7cff;
  --neo-red: #ff5b73;
  --neo-red2: #4a121d;
  --neo-yellow: #f8b62d;
  --neo-orange: #f4a340;
  --neo-shadow: 0 18px 70px rgba(0,0,0,.38);
}

html {
  background: var(--neo-bg);
}

body {
  background:
    radial-gradient(circle at 20% -10%, rgba(37,217,255,.08), transparent 32%),
    radial-gradient(circle at 100% 0%, rgba(20,240,160,.06), transparent 28%),
    linear-gradient(180deg, #080d14 0%, #0a1018 100%) !important;
  color: var(--neo-text) !important;
  min-height: 100vh;
}

.wrap {
  max-width: none !important;
  margin-left: 250px !important;
  padding: 22px 26px 42px !important;
}

.neo-sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  width: 230px;
  background:
    linear-gradient(180deg, rgba(9,16,25,.98), rgba(6,10,16,.98)),
    radial-gradient(circle at top, rgba(37,217,255,.08), transparent 38%);
  border-right: 1px solid rgba(49,66,85,.75);
  z-index: 1000;
  padding: 18px 14px;
  box-shadow: 18px 0 60px rgba(0,0,0,.25);
}

.neo-brand {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 6px 8px 22px;
  border-bottom: 1px dashed rgba(37,217,255,.18);
  margin-bottom: 18px;
}

.neo-brand-mark {
  width: 34px;
  height: 34px;
  border-radius: 11px;
  display: grid;
  place-items: center;
  background: rgba(20,240,160,.1);
  color: var(--neo-green);
  border: 1px solid rgba(20,240,160,.35);
  font-weight: 900;
  box-shadow: 0 0 22px rgba(20,240,160,.12);
}

.neo-brand-title {
  font-size: 20px;
  font-weight: 900;
  letter-spacing: .04em;
}

.neo-brand-sub {
  font-size: 11px;
  color: var(--neo-muted);
  margin-top: 1px;
}

.neo-section {
  margin: 18px 8px 8px;
  color: var(--neo-muted2);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .16em;
  font-weight: 900;
}

.neo-nav a {
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 39px;
  padding: 0 12px;
  border-radius: 11px;
  color: #b9c5d6;
  text-decoration: none;
  font-weight: 700;
  font-size: 14px;
  margin-bottom: 4px;
  border: 1px solid transparent;
}

.neo-nav a:hover,
.neo-nav a.active {
  background: rgba(20,240,160,.08);
  border-color: rgba(20,240,160,.22);
  color: #eafff6;
}

.neo-nav .ico {
  width: 20px;
  color: var(--neo-cyan);
  text-align: center;
}

.neo-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

.neo-title {
  display: flex;
  align-items: center;
  gap: 13px;
}

.neo-title-badge {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: rgba(37,217,255,.08);
  border: 1px solid rgba(37,217,255,.25);
  color: var(--neo-cyan);
  font-weight: 900;
}

.neo-top-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.neo-round {
  width: 39px;
  height: 39px;
  border-radius: 13px;
  display: grid;
  place-items: center;
  background: rgba(17,26,38,.86);
  border: 1px solid rgba(49,66,85,.9);
  color: var(--neo-text);
  box-shadow: 0 10px 30px rgba(0,0,0,.18);
}

h1 {
  font-size: 25px !important;
  margin: 0 0 2px !important;
  letter-spacing: .04em;
}

h2 {
  font-size: 20px !important;
  letter-spacing: .02em;
}

.card,
.stat,
.qrbox,
.st-card {
  background:
    linear-gradient(180deg, rgba(18,27,40,.94), rgba(12,19,29,.94)) !important;
  border: 1px solid rgba(49,66,85,.75) !important;
  box-shadow: var(--neo-shadow) !important;
}

.card {
  border-radius: 18px !important;
  padding: 18px !important;
}

.grid {
  gap: 12px !important;
  margin-bottom: 16px !important;
}

.stat {
  min-height: 78px;
  border-radius: 15px !important;
  position: relative;
  overflow: hidden;
}

.stat::after {
  content: "";
  position: absolute;
  inset: auto 14px 10px auto;
  width: 40px;
  height: 40px;
  border-radius: 14px;
  background: rgba(20,240,160,.08);
  border: 1px solid rgba(20,240,160,.18);
}

.stat .n {
  color: var(--neo-green) !important;
  font-size: 24px !important;
  text-shadow: 0 0 18px rgba(20,240,160,.22);
}

.stat .l {
  color: var(--neo-muted) !important;
  font-size: 12px !important;
}

input[type=text],
input[type=password],
input {
  background: #09111c !important;
  border: 1px solid rgba(70,88,110,.8) !important;
  color: var(--neo-text) !important;
  border-radius: 12px !important;
  transition: .18s ease;
}

input:focus {
  border-color: rgba(37,217,255,.65) !important;
  box-shadow: 0 0 0 4px rgba(37,217,255,.08) !important;
}

button,
.btn {
  border-radius: 12px !important;
  font-weight: 900 !important;
  transition: .16s ease;
}

button:hover,
.btn:hover {
  transform: translateY(-1px);
  filter: brightness(1.06);
}

table {
  border-collapse: separate !important;
  border-spacing: 0 8px !important;
}

thead th {
  border-bottom: 0 !important;
  color: #94a6bb !important;
  font-size: 12px !important;
  text-transform: uppercase;
  letter-spacing: .04em;
}

tbody tr {
  background: rgba(9,16,25,.66);
  border: 1px solid rgba(49,66,85,.55);
}

tbody tr:hover {
  background: rgba(14,26,39,.96) !important;
}

tbody td {
  border-bottom: 1px solid rgba(49,66,85,.45) !important;
  padding: 13px 10px !important;
}

tbody td:first-child {
  border-left: 1px solid rgba(49,66,85,.45);
  border-radius: 12px 0 0 12px;
}

tbody td:last-child {
  border-right: 1px solid rgba(49,66,85,.45);
  border-radius: 0 12px 12px 0;
}

code {
  background: #070d15 !important;
  border: 1px solid rgba(49,66,85,.72) !important;
  color: #e8f3ff !important;
  border-radius: 9px !important;
}

.proto {
  border-radius: 999px !important;
  font-size: 12px;
  letter-spacing: .03em;
}

.proto-awg {
  background: rgba(37,217,255,.11) !important;
  color: #42e4ff !important;
  border: 1px solid rgba(37,217,255,.22);
}

.proto-wg {
  background: rgba(20,240,160,.11) !important;
  color: #55ffb5 !important;
  border: 1px solid rgba(20,240,160,.22);
}

.ok {
  color: var(--neo-green) !important;
}

.dot {
  width: 10px !important;
  height: 10px !important;
  vertical-align: middle;
}

.dot-green {
  background: var(--neo-green) !important;
  box-shadow: 0 0 18px rgba(20,240,160,.62) !important;
}

.btn.icon-btn,
button.icon-btn {
  width: 38px !important;
  height: 38px !important;
  padding: 0 !important;
  margin: 0 4px !important;
  display: inline-grid !important;
  place-items: center !important;
  border-radius: 13px !important;
  font-size: 17px !important;
  line-height: 1 !important;
  color: var(--neo-text) !important;
  background: rgba(26,38,54,.95) !important;
  border: 1px solid rgba(70,88,110,.82) !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.22);
}

.btn.icon-open {
  color: #121820 !important;
  background: var(--neo-orange) !important;
  border-color: rgba(244,163,64,.75) !important;
}

.btn.icon-delete,
button.icon-delete {
  background: rgba(74,18,29,.95) !important;
  color: #ffd2d8 !important;
  border-color: rgba(255,91,115,.42) !important;
}

.btn.icon-status {
  background: rgba(37,217,255,.10) !important;
  color: #54e8ff !important;
  border-color: rgba(37,217,255,.28) !important;
}

form[method="post"] {
  margin: 0;
}

.card:has(table) {
  overflow-x: auto;
}

.qrgrid {
  gap: 16px !important;
}

.qrbox img {
  border-radius: 16px !important;
  box-shadow: 0 18px 60px rgba(0,0,0,.25);
}

.modal-window {
  border-radius: 20px !important;
  border: 1px solid rgba(49,66,85,.9) !important;
  background: #0a111b !important;
}

.modal-head {
  background: #111b29 !important;
}

.raw-box {
  background: rgba(7,13,21,.86) !important;
}

::-webkit-scrollbar {
  width: 9px;
  height: 9px;
}

::-webkit-scrollbar-thumb {
  background: #26364a;
  border-radius: 999px;
}

::-webkit-scrollbar-track {
  background: #08101a;
}

.neo-pulse {
  animation: neoPulse 2.2s infinite;
}

@keyframes neoPulse {
  0% { box-shadow: 0 0 0 0 rgba(20,240,160,.26); }
  70% { box-shadow: 0 0 0 9px rgba(20,240,160,0); }
  100% { box-shadow: 0 0 0 0 rgba(20,240,160,0); }
}

@media (max-width: 1000px) {
  .neo-sidebar {
    display: none;
  }

  .wrap {
    margin-left: 0 !important;
    padding: 16px !important;
  }

  .neo-topbar {
    align-items: flex-start;
    flex-direction: column;
  }

  table {
    font-size: 12px !important;
  }
}