.GwApp {
  --gw-navy: #04131d;
  --gw-ink: #eaf6f8;
  --gw-muted: rgba(234, 246, 248, 0.58);
  --gw-ice: #28fbff;
  --gw-gold: #ffd128;
  --gw-coral: #ffb4a2;
  --gw-line: rgba(255, 255, 255, 0.1);
  --gw-ease: cubic-bezier(0.32, 0.72, 0, 1);
  color: var(--gw-ink);
  display: grid;
  gap: 22px;
}

.GwIsland {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  width: max-content;
  max-width: 100%;
  padding: 6px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--gw-line);
}

.GwIsland button {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--gw-muted);
  font: inherit;
  min-height: 40px;
  padding: 0 16px;
  border-radius: 999px;
  transition: transform 420ms var(--gw-ease), background 420ms var(--gw-ease), color 420ms var(--gw-ease);
}

.GwIsland button:hover,
.GwIsland button.is-active {
  color: #031622;
  background: linear-gradient(90deg, var(--gw-gold), var(--gw-ice));
}

.GwIsland button:active {
  transform: scale(0.98);
}

.GwIsland button:focus-visible,
.GwBtn:focus-visible,
.GwGhost:focus-visible,
.GwCopy:focus-visible {
  outline: 2px solid var(--gw-ice);
  outline-offset: 3px;
}

.GwBezel {
  padding: 7px;
  border-radius: 0;
  background: rgba(255, 255, 255, 0.035);
  border: 1px solid var(--gw-line);
}

.GwCard {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.05), transparent 28%),
    rgba(4, 19, 29, 0.88);
  border-radius: 0;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
  padding: 22px;
  min-width: 0;
}

.GwBento {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(12, minmax(0, 1fr));
}

.GwSpan4 {
  grid-column: span 4;
}

.GwSpan5 {
  grid-column: span 5;
}

.GwSpan6 {
  grid-column: span 6;
}

.GwSpan7 {
  grid-column: span 7;
}

.GwSpan8 {
  grid-column: span 8;
}

.GwSpan12 {
  grid-column: span 12;
}

.GwKicker {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid rgba(40, 251, 255, 0.28);
  color: var(--gw-ice);
  font-size: 11px;
  letter-spacing: 0.04em;
}

.GwTitle {
  margin-top: 10px;
  font-size: clamp(26px, 3vw, 40px);
  font-weight: 200;
  line-height: 1.2;
  background-image: linear-gradient(to left, var(--gw-gold), var(--gw-ice));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.GwLead,
.GwMeta,
.GwEmpty p {
  color: var(--gw-muted);
  line-height: 1.8;
  font-weight: 200;
}

.GwStatLabel {
  display: block;
  color: var(--gw-muted);
  font-size: 13px;
  margin-bottom: 8px;
}

.GwStatValue {
  display: block;
  font-size: clamp(26px, 3vw, 36px);
  font-weight: 200;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.03em;
}

.GwPill {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 0;
  font-size: 12px;
  border: 1px solid transparent;
}

.GwPill.is-live {
  color: #06343a;
  background: rgba(40, 251, 255, 0.82);
}

.GwPill.is-wait {
  color: #3a2d05;
  background: rgba(255, 209, 40, 0.86);
}

.GwPill.is-down {
  color: #4a1d14;
  background: rgba(255, 180, 162, 0.88);
}

.GwList {
  display: grid;
  gap: 10px;
}

.GwRow {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 14px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.GwRow:first-child {
  border-top: 0;
  padding-top: 0;
}

.GwMark {
  display: inline-flex;
  align-items: center;
  margin-inline-start: 8px;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  color: #031622;
  background: linear-gradient(90deg, var(--gw-gold), var(--gw-ice));
}

.GwRow strong {
  font-weight: 300;
}

.GwRow span,
.GwRow em {
  display: block;
  color: var(--gw-muted);
  font-style: normal;
  font-size: 13px;
}

.GwForm {
  display: grid;
  gap: 14px;
}

.GwForm.GwTwo {
  grid-template-columns: 1fr 1fr;
}

.GwField {
  display: grid;
  gap: 8px;
  font-size: 13px;
  color: rgba(234, 246, 248, 0.78);
}

.GwField input,
.GwField textarea,
.GwField select,
.GwSearch {
  width: 100%;
  min-height: 48px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(3, 22, 34, 0.72);
  color: white;
  border-radius: 0;
  padding: 12px 16px;
  font: inherit;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
  transition: border-color 420ms var(--gw-ease), box-shadow 420ms var(--gw-ease);
}

.GwField textarea {
  min-height: 110px;
  resize: vertical;
}

.GwField input:focus,
.GwField textarea:focus,
.GwField select:focus,
.GwSearch:focus {
  outline: none;
  border-color: rgba(40, 251, 255, 0.55);
  box-shadow: 0 0 0 4px rgba(40, 251, 255, 0.12);
}

.GwActions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.GwBtn,
.GwGhost,
.GwCopy {
  min-height: 46px;
  border: 0;
  border-radius: 999px;
  font: inherit;
  padding: 0 18px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  transition: transform 420ms var(--gw-ease), opacity 420ms var(--gw-ease);
}

.GwBtn {
  background: linear-gradient(90deg, var(--gw-gold), var(--gw-ice));
  color: #031622;
}

.GwBtn span.GwIco,
.GwCopy span.GwIco {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(3, 22, 34, 0.12);
  font-size: 14px;
}

.GwGhost,
.GwCopy {
  background: transparent;
  color: white;
  border: 1px solid rgba(255, 255, 255, 0.16);
}

.GwBtn:hover,
.GwGhost:hover,
.GwCopy:hover {
  transform: translateY(-1px);
}

.GwBtn:active,
.GwGhost:active,
.GwCopy:active {
  transform: scale(0.98);
}

.GwErr {
  color: var(--gw-coral);
}

.GwOk {
  color: #8ef0e4;
}

.GwEmpty {
  text-align: center;
  padding: 36px 16px;
}

.GwEmpty h3 {
  font-size: 22px;
  font-weight: 200;
  margin-bottom: 8px;
}

.GwCode {
  position: relative;
  background: #031018;
  color: #d7fbff;
  border-radius: 0;
  padding: 18px 18px 18px 16px;
  overflow: auto;
  direction: ltr;
  text-align: left;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12.5px;
  line-height: 1.7;
  border: 1px solid rgba(40, 251, 255, 0.12);
}

.GwCode .GwCopy {
  position: absolute;
  top: 10px;
  right: 10px;
  min-height: 34px;
  padding: 0 12px;
  font-family: "YekanBakh", Tahoma, sans-serif;
}

.GwParam {
  display: grid;
  gap: 12px;
  padding: 16px;
  border-radius: 0;
  background: rgba(255, 255, 255, 0.03);
  border: 1px dashed rgba(255, 255, 255, 0.12);
}

.GwHelp {
  display: grid;
  gap: 10px;
  padding: 16px 18px;
  border-radius: 0;
  background: rgba(40, 251, 255, 0.06);
  border: 1px solid rgba(40, 251, 255, 0.18);
  color: var(--gw-muted);
  line-height: 1.85;
  font-weight: 200;
}

.GwHelp strong {
  color: var(--gw-ink);
  font-weight: 500;
}

.GwHelp ul {
  margin: 0;
  padding-inline-start: 18px;
  display: grid;
  gap: 8px;
}

.GwHelp code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  color: var(--gw-ice);
  unicode-bidi: isolate;
  display: inline-block;
  white-space: nowrap;
}

.GwHelp .GwCode {
  margin: 0;
}

.GwSecret {
  background:
    linear-gradient(135deg, rgba(255, 209, 40, 0.16), rgba(40, 251, 255, 0.1));
  border: 1px solid rgba(255, 209, 40, 0.28);
}

.GwFilters {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.CustomerTabBar {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
  margin: 0 auto 22px;
  max-width: 100%;
}

.CustomerTabBar .CustomerTabs {
  margin: 0;
}

.CustomerTabLogout {
  min-height: 42px;
}

.CustomerTabs {
  display: flex;
  width: max-content;
  max-width: 100%;
  gap: 6px;
  padding: 6px;
  margin: 0 auto 22px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.CustomerTabs button {
  min-height: 42px;
  padding: 0 18px;
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.62);
  transition: background 420ms var(--gw-ease), color 420ms var(--gw-ease), transform 420ms var(--gw-ease);
}

.CustomerTabs button.is-active,
.CustomerTabs button:hover {
  color: #031622;
  background: linear-gradient(90deg, #ffd128, #28fbff);
}

.CustomerDash.is-full {
  grid-template-columns: 1fr;
}

@media (max-width: 980px) {

  .GwSpan4,
  .GwSpan5,
  .GwSpan6,
  .GwSpan7,
  .GwSpan8,
  .GwSpan12,
  .GwForm.GwTwo,
  .GwFilters {
    grid-column: 1 / -1;
    grid-template-columns: 1fr;
  }

  .GwIsland,
  .CustomerTabs {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {

  .GwIsland button,
  .GwBtn,
  .GwGhost,
  .GwCopy,
  .CustomerTabs button {
    transition: none;
  }
}

/* Admin gateway — light operations console, scoped so the customer panel stays dark. */
.GwAdmin {
  --gw-ink: #0f172a;
  --gw-muted: #64748b;
  --gw-ice: #4f46e5;
  --gw-gold: #4338ca;
  --gw-coral: #be123c;
  --gw-line: #e2e8f0;
  color: #0f172a;
  gap: 0;
}

.GwAdmin.GwShell {
  display: grid;
  grid-template-columns: 232px minmax(0, 1fr);
  gap: 20px;
  align-items: start;
}

.GwAdmin .GwNav {
  position: sticky;
  top: 12px;
  display: grid;
  gap: 4px;
  padding: 8px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 0;
  box-shadow: 0 1px 2px rgb(15 23 42 / 0.04);
}

.GwAdmin .GwNav button {
  appearance: none;
  display: grid;
  gap: 2px;
  width: 100%;
  text-align: right;
  border: 0;
  background: transparent;
  border-radius: 0;
  padding: 10px 12px;
  color: #334155;
  font: inherit;
  cursor: pointer;
}

.GwAdmin .GwNav button strong {
  font-weight: 700;
  font-size: 13px;
}

.GwAdmin .GwNav button small {
  color: #94a3b8;
  font-size: 11px;
  line-height: 1.5;
}

.GwAdmin .GwNav button:hover,
.GwAdmin .GwNav button.is-active {
  background: #eef2ff;
  color: #4338ca;
}

.GwAdmin .GwNav button.is-active small {
  color: #6366f1;
}

.GwAdmin .GwStage {
  min-width: 0;
  display: grid;
  gap: 16px;
}

.GwAdmin .GwPageHead h3 {
  margin: 8px 0 0;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #0f172a;
}

.GwAdmin .GwPageHead p,
.GwAdmin .GwLead,
.GwAdmin .GwMeta,
.GwAdmin .GwEmpty p,
.GwAdmin .GwField {
  color: #64748b;
}

.GwAdmin .GwKicker {
  border-color: #c7d2fe;
  color: #4338ca;
  background: #eef2ff;
}

.GwAdmin .GwCard,
.GwAdmin .GwStat {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 0;
  box-shadow: 0 1px 2px rgb(15 23 42 / 0.04);
  color: #0f172a;
}

.GwAdmin .GwBezel {
  padding: 0;
  background: transparent;
  border: 0;
}

.GwAdmin .GwTitle {
  background: none;
  color: #0f172a;
  -webkit-text-fill-color: #0f172a;
  font-weight: 800;
}

.GwAdmin .GwStatGrid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}

.GwAdmin .GwStat {
  padding: 14px 14px 12px;
}

.GwAdmin .GwStat span,
.GwAdmin .GwStat em {
  display: block;
  color: #64748b;
  font-size: 12px;
  font-style: normal;
}

.GwAdmin .GwStat strong {
  display: block;
  margin: 6px 0 4px;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
  color: #0f172a;
}

.GwAdmin .GwBtn {
  background: #4f46e5;
  color: #fff;
  border-radius: 0;
  min-height: 40px;
}

.GwAdmin .GwBtn span.GwIco {
  background: rgb(255 255 255 / 0.16);
  color: #fff;
}

.GwAdmin .GwGhost,
.GwAdmin .GwCopy {
  background: #fff;
  color: #334155;
  border: 1px solid #e2e8f0;
  border-radius: 0px;
  min-height: 40px;
}

.GwAdmin .GwField input,
.GwAdmin .GwField textarea,
.GwAdmin .GwField select,
.GwAdmin .GwSearch {
  background: #fff;
  color: #0f172a;
  border: 1px solid #e2e8f0;
  border-radius: 0;
  min-height: 42px;
  box-shadow: none;
}

.GwAdmin .GwField input:focus,
.GwAdmin .GwField textarea:focus,
.GwAdmin .GwField select:focus,
.GwAdmin .GwSearch:focus {
  border-color: #6366f1;
  box-shadow: 0 0 0 3px #e0e7ff;
}

.GwAdmin .GwPill.is-live {
  color: #065f46;
  background: #ecfdf5;
  border-color: #a7f3d0;
}

.GwAdmin .GwPill.is-wait {
  color: #92400e;
  background: #fffbeb;
  border-color: #fde68a;
}

.GwAdmin .GwPill.is-down {
  color: #be123c;
  background: #fff1f2;
  border-color: #fecdd3;
}

.GwAdmin .GwRow {
  border-top-color: #f1f5f9;
  color: inherit;
}

.GwAdmin button.GwRow,
.GwAdmin .GwReq {
  width: 100%;
  border: 0;
  border-bottom: 1px solid #f1f5f9;
  background: transparent;
  font: inherit;
  color: inherit;
  text-align: right;
  cursor: pointer;
  border-radius: 0;
}

.GwAdmin button.GwRow:hover,
.GwAdmin .GwReq:hover,
.GwAdmin .GwReq.is-selected {
  background: #eef2ff;
}

.GwAdmin .GwMark {
  background: #eef2ff;
  color: #4338ca;
}

.GwAdmin .GwHelp {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  color: #475569;
}

.GwAdmin .GwHelp code {
  color: #4338ca;
}

.GwAdmin .GwSecret {
  background: #fffbeb;
  border: 1px solid #fde68a;
  color: #0f172a;
}

.GwAdmin .GwParam {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}

.GwAdmin .GwCode {
  background: #0f172a;
  color: #e2e8f0;
  border-radius: 0px;
  border-color: #1e293b;
}

.GwAdmin .GwErr {
  color: #be123c;
}

.GwAdmin .GwOk {
  color: #047857;
}

.GwAdmin .GwMonitorBar {
  display: grid;
  grid-template-columns: 1.5fr repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding: 12px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 0px;
}

.GwAdmin .GwMonitorBar .GwActions {
  grid-column: 1 / -1;
}

.GwAdmin .GwSplit {
  display: grid;
  grid-template-columns: minmax(280px, 0.92fr) minmax(0, 1.25fr);
  gap: 12px;
  align-items: start;
}

.GwAdmin .GwListScroll {
  max-height: min(74vh, 860px);
  overflow: auto;
  padding: 8px 8px 12px;
}

.GwAdmin .GwReq {
  display: grid;
  gap: 6px;
  padding: 12px 10px;
  border-radius: 0px;
  border-bottom: 0;
  margin-bottom: 4px;
}

.GwAdmin .GwReqTop {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
}

.GwAdmin .GwReqId {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  font-weight: 600;
  direction: ltr;
  color: #0f172a;
}

.GwAdmin .GwReqMeta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  color: #64748b;
  font-size: 12px;
}

.GwAdmin .GwReqErr {
  color: #be123c;
  font-size: 12px;
  direction: ltr;
  text-align: left;
}

.GwAdmin .GwInspector {
  display: grid;
  gap: 14px;
  align-content: start;
  position: sticky;
  top: 12px;
}

.GwAdmin .GwInspector h3 {
  margin: 4px 0 0;
  font-size: 13px;
  font-weight: 700;
  color: #334155;
}

.GwAdmin .GwFacts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 0;
}

.GwAdmin .GwFacts div {
  background: #f8fafc;
  border-radius: 0px;
  padding: 8px 10px;
  min-width: 0;
}

.GwAdmin .GwFacts dt {
  color: #94a3b8;
  font-size: 11px;
}

.GwAdmin .GwFacts dd {
  margin: 3px 0 0;
  font-size: 13px;
  color: #0f172a;
  word-break: break-word;
}

.GwAdmin .GwTabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.GwAdmin .GwTabs button {
  border: 1px solid #e2e8f0;
  background: #fff;
  color: #475569;
  border-radius: 999px;
  min-height: 32px;
  padding: 0 12px;
  font: inherit;
  cursor: pointer;
}

.GwAdmin .GwTabs button.is-active {
  background: #4f46e5;
  border-color: #4f46e5;
  color: #fff;
}

.GwAdmin .GwBanner {
  background: #fff1f2;
  border: 1px solid #fecdd3;
  color: #9f1239;
  border-radius: 0px;
  padding: 10px 12px;
}

.GwAdmin .GwBanner p {
  margin: 4px 0 0;
}

.GwAdmin .GwPager {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding-top: 8px;
  color: #64748b;
  font-size: 13px;
}

.GwAdmin .GwAudit {
  border-top: 1px solid #f1f5f9;
}

.GwAdmin .GwAudit summary {
  cursor: pointer;
  list-style: none;
}

.GwAdmin .GwAudit summary::-webkit-details-marker {
  display: none;
}

.GwAdmin .GwAudit .GwCode {
  margin: 0 0 12px;
}

@media (max-width: 1180px) {

  .GwAdmin.GwShell,
  .GwAdmin .GwSplit,
  .GwAdmin .GwStatGrid,
  .GwAdmin .GwFacts,
  .GwAdmin .GwMonitorBar {
    grid-template-columns: 1fr 1fr;
  }

  .GwAdmin .GwNav {
    position: static;
    display: flex;
    overflow: auto;
  }

  .GwAdmin .GwNav button {
    min-width: max-content;
  }

  .GwAdmin .GwInspector {
    position: static;
  }
}

@media (max-width: 720px) {

  .GwAdmin.GwShell,
  .GwAdmin .GwSplit,
  .GwAdmin .GwStatGrid,
  .GwAdmin .GwFacts,
  .GwAdmin .GwMonitorBar,
  .GwAdmin .GwForm.GwTwo {
    grid-template-columns: 1fr;
  }
}