/* ===== 0) Vars / Base ===== */
:root{
  --bg:#090d1a;
  --card:#0c1327;
  --muted:#9aa7c7;
  --text:#eaf0ff;
  --line:#22305c;

  --accent:#6aa8ff;
  --accent2:#7cf7d4;
  --bad:#ff6a6a;

  --shadow: 0 18px 70px rgba(0,0,0,.55);
  --r24: 24px;

  --mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --sans: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial;
}

*{ box-sizing:border-box; }
html, body{ height:100%; }

body{
  margin:0;
  font-family:var(--sans);
  color:#1c1c1e;
  background:#fff;
  overflow-x:hidden;
}

/* loading = белый экран поверх всего (без анимаций и миганий) */
html.i18n-loading::before{
  content:"";
  position:fixed;
  inset:0;
  background:#fff;
  z-index:999999;
  pointer-events:all;
}


/* canvas bg */
#net{ display:none; }

.wrap{
  position:relative;
  z-index:1;
  max-width:1200px;
  margin:0 auto;
  padding:22px 18px 44px;
}

/* simple appear */
.fade{
  opacity:0;
  transform: translateY(8px);
  animation: in .6s ease forwards;
}
.fade.d2{ animation-delay:.08s; }
.fade.d3{ animation-delay:.16s; }
.fade.d4{ animation-delay:.24s; }

@keyframes in{
  to { opacity:1; transform: translateY(0); }
}

/* ===== 1) HEADER / TOPBAR ===== */
/* TOPBAR full width */
.topbar{
  position:relative;
  width:100vw;
  background:#fff;
  border:none;
  box-shadow:none;
  padding:18px 0px 100px;
}

/* внутренний контейнер как .wrap */
.topbarInner{
  width:100;
  margin:0 auto;

  /* если у .wrap есть max-width — поставь такой же */
  max-width: 100vw;     /* <-- РїРѕРґРіРѕРЅРё РїРѕРґ СЃРІРѕР№ .wrap */
  padding:0 24px;        /* <-- как у .wrap боковые отступы */

  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  column-gap:32px;       /* лого ближе к меню как на примере */
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:auto;        /* убираем огромный отступ */
}

.brandLogo{
  width:25px;
  height:25px;
  border-radius:8px;
  display:block;
}

/* NAV */
.nav{
  display:grid;
  grid-template-columns:1fr auto; /* links | lang */
  align-items:center;
  width:100%;
}

.navCenter{
  justify-self:start;     /* ВАЖНО: больше не центр */
  display:flex;
  align-items:center;
  gap:22px;               /* чуть плотнее */
}

.navRight{
  justify-self:end;
  display:flex;
  align-items:center;
}

/* LINKS (общий вид) */
.pill{
  border:none;
  background:transparent;
  text-decoration:none;

  font-family:var(--sans);
  font-size:14px;
  letter-spacing:.6px;
  text-transform:uppercase;

  color:#8e8e93;
  padding:8px 12px;            /* было 6px 0 — нужно чтобы фон был виден */
  border-radius:999px;         /* чтобы подсветка была “пилл” */
  white-space:nowrap;

  transition: background .15s ease, color .15s ease;
}

/* hover */
.pill:hover{ color:#7a4cff; }

/* active (текущая страница) */
.pill.is-active{
  color:#7a4cff;
  font-weight:700;
}

/* если primary больше не нужен как отдельный стиль — можешь оставить */
.pill.primary{
  color:#7a4cff;
  font-weight:700;
}

/* ===== Language switch button same hover/active ===== */
.langBtn{
  background:transparent;
  font-weight:500;
  cursor:pointer;
}

.langBtn:hover{ color:#7a4cff; }

/* когда меню закреплено кликом */
.langSwitch.pinned .langBtn{
  color:#7a4cff;
  font-weight:700;
}

/* ===== Language menu ===== */
.langSwitch{ position:relative; display:inline-flex; align-items:center; }

.langMenu{
  position:absolute;
  top:calc(100% + 6px);
  right:0;
  left:auto;

  min-width:110px;
  padding:8px;
  border-radius:12px;

  background:#fff;
  box-shadow:0 14px 40px rgba(0,0,0,.12);

  display:flex;
  flex-direction:column;
  gap:6px;

  opacity:0;
  transform: translateY(-6px);
  pointer-events:none;
  transition: opacity .14s ease, transform .14s ease;
  z-index:9999;
}

/* открыто */
.langSwitch.open .langMenu{
  opacity:1;
  transform: translateY(0);
  pointer-events:auto;
}

/* hover open на десктопе */
@media (hover:hover) and (pointer:fine){
  .langSwitch:hover .langMenu{
    opacity:1;
    transform: translateY(0);
    pointer-events:auto;
  }
}

/* мостик между кнопкой и меню */
.langSwitch::after{
  content:"";
  position:absolute;
  top:100%;
  right:0;
  width:100%;
  height:10px;
}

/* меню не закрывается, если курсор на нём */
.langMenu:hover{
  opacity:1;
  transform: translateY(0);
  pointer-events:auto;
}

/* пункты меню */
.langOpt{
  width:100%;
  height:36px;
  padding:0 10px;

  border:none;
  background:transparent;
  color:#8e8e93;
  font-size:14px;

  border-radius:10px;
  text-align:left;

  font: inherit;
  letter-spacing:.6px;
  cursor:pointer;
  user-select:none;

  transition: background .15s ease, color .15s ease;
}

/* hover на пунктах */
.langOpt:hover{ color:#7a4cff; }

/* активный язык */
.langOpt.active{
  font-weight:700;
  color:#7a4cff;
}

/* Открытие: pinned (клик) */
.langSwitch.pinned .langMenu{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}

/* hover open on desktop */
@media (hover:hover) and (pointer:fine){
  .langSwitch:hover .langMenu,
  .langMenu:hover{
    opacity:1;
    transform: translateY(0);
    pointer-events:auto;
  }
}

#navCenter{ position:relative; }
.topbarInner{ position:relative; }

#navGlow{
  position:absolute;
  left:0; top:0;

  height:16px;
  width:40px;
  border-radius:999px;

  background: rgba(122,76,255,0.14);
  filter: blur(10px);
  opacity:0;

  pointer-events:none;
  z-index:0;

  transition: transform .18s ease, width .18s ease, opacity .12s ease;
}

/* чтобы текст был поверх подсветки */
.topbarInner .pill,
.topbarInner .langOpt{
  position:relative;
  z-index:1;
}

#navCenter .pill{
  position:relative;
  z-index:1;
}

/* ===== BUTTONS HOVER FILL ===== */
.animFx{
  position:relative;
  overflow:hidden;
}

.animFx .animeFx{
  display:none;
}

.fullDash{
  position:relative;
  left:50%;
  transform:translateX(-50%);
  width:100vw;
  height:0;
  border-top:1.5px dashed rgba(0,0,0,0.25);
  margin:28px 0;

  -webkit-mask-image: linear-gradient(
    to right,
    transparent 0%,
    black 8%,
    black 92%,
    transparent 100%
  );
  mask-image: linear-gradient(
    to right,
    transparent 0%,
    black 8%,
    black 92%,
    transparent 100%
  );
}


/* =========================================================
   BLOCKS — CLEAN (оставил только нужное)
   ========================================================= */

/* ===== BLOCKS MODULE ===== */
.blkSection{
  width:100%;
  background:#fff;
  padding:100px 0;
}

.blkModule{
  width:100%;
  background:#fff;
  border-radius:26px;
  box-shadow:0 16px 40px rgba(0,0,0,0.10);
  padding:40px;
}

/* tag */
.blkTag{
  display:inline-flex;
  align-self:flex-start;
  padding:6px 14px;
  background:#f1eaff;
  color:#7a4cff;
  border-radius:999px;
  font-size:13px;
  letter-spacing:.6px;
  margin-bottom:14px;
  width:fit-content;
}

/* title */
.blkTitle{
  margin:0;
  font-size:66px;
  font-weight:950;
  line-height:1;
  color:#1c1c1e;
}

/* responsive */
@media (max-width:900px){
  .blkModule{ padding:20px; }
  .blkTitle{ font-size:44px; }
}

/* ===== HEADER ===== */
.blkHead{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
}

.blkHeadLeft{
  display:flex;
  flex-direction:column;
}

.blkHeadRight{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
}

/* ===== BUTTONS ===== */
.blkBtn{
  display:inline-block;
  padding:16px 28px;
  border:1px solid #794cff4b;
  background:#f1eaff;
  color:#7a4cff;
  border-radius:10px;
  text-decoration:none;
  font-weight:600;
  font-family:var(--sans);
  font-size:16px;
  letter-spacing:.2px;
  --btn-fill:#7a4cff;
  position:relative;
  overflow:hidden;
  isolation:isolate;
  transition:
    border-color .14s ease,
    color .18s ease .18s,
    background-color .18s ease;
}

.blkBtn::before{
  content:"";
  position:absolute;
  inset:0;
  background:var(--btn-fill);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .38s cubic-bezier(.22,1,.36,1) .08s;
  z-index:0;
}

.blkBtn > span{
  position:relative;
  z-index:1;
}

@media (hover:hover) and (pointer:fine){
  .blkBtn:hover{
    border-color:var(--btn-fill);
    color:#fff;
    outline:none;
  }

  .blkBtn:hover::before{
    transform:scaleX(1);
  }
}

.blkBtn:focus-visible{
  border-color:var(--btn-fill);
  color:#fff;
  outline:none;
}

.blkBtn:focus-visible::before{
  transform:scaleX(1);
}

@media (hover:none), (pointer:coarse){
  .blkBtn:active{
    border-color:var(--btn-fill);
    color:#fff;
    outline:none;
  }

  .blkBtn:active::before{
    transform:scaleX(1);
  }

  .blkBtn:focus-visible{
    border-color:#794cff4b;
    color:#7a4cff;
  }

  .blkBtn:focus-visible::before{
    transform:scaleX(0);
  }
}

.blkBtnGhost{
  background:#fff;
  color:#7a4cff;
}

/* если это <button>, убираем дефолт */
button.blkBtn{
  appearance:none;
  -webkit-appearance:none;
  cursor:pointer;
}

/* responsive */
@media (max-width:900px){
  .blkHead{ flex-direction:column; align-items:flex-start; }
  .blkHeadRight{ width:100%; }
}

/* ===== SEARCH ===== */
.blkSearch{
  width:420px;
  min-width:260px;
  height:44px;
  padding:0 14px;
  border-radius:10px;
  border:1px solid #794cff4b;
  background:#fff;
  font-family:var(--sans);
  font-size:14px;
  color:#1c1c1e;
  outline:none;
  flex:1 1 420px;
  max-width:560px;
}
.blkSearch::placeholder{ color:#9a9a9a; }
.blkSearch:focus{ border-color:#7a4cff; }

@media (max-width:900px){
  .blkSearch{ width:100%; min-width:0; }
}

/* ===== LIST ===== */
.blkList{ width:100%; margin-top:18px; }

.blkListHead{
  position:relative;
  padding:16px 18px 10px;
}

/* верхняя штриховка над заголовками */
.blkListHead::before{
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  border-top:1.5px dashed rgba(0,0,0,0.25);
}

.blkRows{ display:flex; flex-direction:column; }

/* ОДНА сетка для заголовка и строк */
.blkListHead,
.blkRow{
  display:grid;
  grid-template-columns:
    90px
    1.4fr
    170px
    70px
    80px
    80px
    1fr
    90px;
  align-items:center;
  column-gap:18px;
}

/* headers */
.blkH{
  font-size:14px;
  letter-spacing:.6px;
  text-transform:uppercase;
  color:#8e8e93;
  font-weight:600;
  white-space:nowrap;
}
.blkH.r{ text-align:right; }

/* row */
.blkRow{
  padding:14px 18px;
}
.blkRow:hover{ background:#fbf7f6; }

/* cells */
.blkCell{
  font-size:14px;
  color:#1c1c1e;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.blkCell.mono{
  font-family:var(--mono);
  font-size:13px;
}
.blkCell.r{ text-align:right; }

/* ===== ROW SEPARATORS (работает даже если между строками есть details) ===== */
#tbody .blkRow{
  border-top:1.5px dashed rgba(0,0,0,0.18);
}

/* первая строка без линии */
#tbody .blkRow:first-of-type{
  border-top:none;
}

/* ===== DETAILS ===== */
.blkDetails{ padding:10px 18px 18px; width:100%; box-sizing:border-box; }

.blkPanel{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
}
@media (max-width:900px){
  .blkDetails{ padding:10px 4px 18px; width:100%; box-sizing:border-box; }
  .blkPanel{
    grid-template-columns:1fr;
    gap:10px;
    width:100%;
    max-width:100%;
  }
}

.blkBox{
  border:1.5px dashed rgba(0,0,0,0.18);
  border-radius:16px;
  padding:14px;
  background:#fff;
  min-width:0;
}
.blkBox h3{ margin:0 0 10px; font-size:14px; }
.blkBox pre{
  margin:0;
  font-family:var(--mono);
  font-size:13px;
  line-height:1.4;
  white-space:pre-wrap;
  word-break:break-word;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

/* status pill скрыт */
.statusPill{ display:none; }

/* accordion container */
.blkDetRow{
  overflow:hidden;
  max-height:0;
  transition:max-height .35s ease;
}

/* === HORIZONTAL SCROLL (KEEPS GRID INTACT) === */
.blkScrollX{
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scrollbar-gutter: stable;
  touch-action:auto;
}

/* important: keep a shared minimum width for the full grid */
.blkScrollX .blkListHead,
.blkScrollX .blkRow{
  min-width: 980px;
}

.blkScrollX #tbody{
  min-width:100%;
}

.blkScrollX .blkDetRow{
  min-width:100%;
}

/* text stays selectable whenever the table is not in horizontal-scroll mode */
.blkScrollX .blkCell,
.blkScrollX .blkH,
.blkScrollX pre{
  user-select:text;
  -webkit-user-select:text;
}

.blkScrollX.is-overflowing{
  touch-action:auto;
}

.blkScrollX.is-overflowing .blkCell,
.blkScrollX.is-overflowing .blkH,
.blkScrollX.is-overflowing pre,
.blkScrollX.is-dragging .blkCell,
.blkScrollX.is-dragging .blkH,
.blkScrollX.is-dragging pre{
  user-select:none;
  -webkit-user-select:none;
}

.blkScrollX.is-dragging .blkCell,
.blkScrollX.is-dragging .blkH,
.blkScrollX.is-dragging pre{
  cursor:grabbing;
}




/* ===== FIX: TX / MSGS / PRIV всегда слева ===== */

/* заголовки */
/* FIX: только TX / MSGS / PRIV заголовки слева (4,5,6) */
.blkListHead > :nth-child(4),
.blkListHead > :nth-child(5),
.blkListHead > :nth-child(6){
  text-align:left;
  justify-self:start;
}

/* а SIZE обратно вправо (8) */
.blkListHead > :nth-child(8){
  text-align:right;
  justify-self:end;
}

/* значения (4,5,6 колонки) */
.blkRow > :nth-child(4),
.blkRow > :nth-child(5),
.blkRow > :nth-child(6){
  text-align:left;
  justify-self:start;
}

/* ===== LOAD MORE: animation for newly appended rows ===== */
@keyframes blkIn{
  from{
    opacity:0;
    transform: translateY(-10px);
  }
  to{
    opacity:1;
    transform: translateY(0);
  }
}

.blkNew{
  animation: blkIn .42s ease both;
}
.blkEmpty{
  padding:18px 18px;
  border-top:1.5px dashed rgba(0,0,0,0.18);
  color:#8e8e93;
  font-size:14px;
}
.blkEmpty b{ 
  color:#1c1c1e;
}

.footerRow{
  margin-top:18px;
  display:flex;
  justify-content:center;   /* центр */
  align-items:center;
  gap:14px;
}

/* warn пусть будет под кнопкой/рядом — как тебе удобнее */
.warn{
  display: none;
}







/* =========================================================
   3) MOBILE BURGER + DRAWER
   ========================================================= */
html.nav-open-lock,
body.nav-open-lock{
  overflow:hidden;
}

.topbar{
  z-index:40;
}

.burger{
  display:none;
  width:40px;
  height:40px;
  margin-left:10px;
  border:none;
  background:transparent;
  border-radius:12px;
  cursor:pointer;
  position:relative;
}

.burger span{
  position:absolute;
  left:11px;
  width:18px;
  height:2px;
  background:#6f6f6f;
  border-radius:999px;
  transform-origin:50% 50%;
  transition: transform .34s cubic-bezier(.22,1,.36,1), top .34s cubic-bezier(.22,1,.36,1), background .2s ease;
}

.burger span:nth-child(1){ top:14px; }
.burger span:nth-child(2){ top:22px; }
.burger span:nth-child(3){ display:none; }

@media (hover:hover){
  .burger:hover span{ background:#7a4cff; }
}
.burger:active span{ background:#7a4cff; }

.topbar.nav-open .burger span:nth-child(1){
  top:18px;
  transform: rotate(45deg);
}

.topbar.nav-open .burger span:nth-child(2){
  top:18px;
  transform: rotate(-45deg);
}

.navDrawer{
  display:none;
  position:fixed;
  inset:0;
  width:100vw;
  height:100dvh;
  padding:88px 0 24px;
  background:#fff;
  overflow-y:auto;
  overflow-x:hidden;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform: translateY(-100%);
  will-change: transform, opacity;
  transition: transform .58s cubic-bezier(.22,1,.36,1), opacity .34s ease, visibility 0s linear .58s;
  z-index:1;
}

.navDrawer .pill{
  display:block;
  width:100%;
  padding:12px 24px;
  border-radius:0;
  text-transform:uppercase;
}

.topbar.nav-open .navDrawer{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform: translateY(0);
  transition: transform .58s cubic-bezier(.22,1,.36,1), opacity .34s ease;
}

#navGlow,
.navGlowM{
  display:none !important;
  opacity:0 !important;
  pointer-events:none !important;
}

.navDrawer .pill,
.navDrawer .navRight{
  position:relative;
  z-index:1;
}

@media (max-width:1024px){
  #navGlow{ display:none; }

  .topbarInner{
    grid-template-columns:1fr;
  }

  .brand{
    width:100%;
    justify-content:space-between;
  }

  .nav{ display:none; }

  .topbarInner{ z-index:2; }

  .burger{
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  .navCenter{ display:none; }
  .navRight{ display:none; }

  .navDrawer{
    display:flex;
    flex-direction:column;
  }

  .navDrawer a.pill,
  .navDrawer .navRight{
    opacity:0;
    transform: translateY(14px);
    transition: opacity .36s ease, transform .48s cubic-bezier(.22,1,.36,1);
    transition-delay:0ms;
  }

  .topbar.nav-open .navDrawer a.pill,
  .topbar.nav-open .navDrawer .navRight{
    opacity:1;
    transform: translateY(0);
  }

  .navDrawer .navRight{
    display:flex;
    width:100%;
    margin-top:auto;
    padding:18px 24px 24px;
    justify-content:flex-start;
    align-items:flex-end;
  }

  .navDrawer .langSwitch{
    position:relative;
    display:inline-flex;
    align-items:center;
  }

  .navDrawer .langBtn{
    padding-left:0;
  }

  .navDrawer .langMenu{
    top:auto;
    right:auto;
    left:0;
    bottom:calc(100% + 10px);
  }

  .navDrawer .langSwitch::after{
    top:auto;
    right:auto;
    left:0;
    bottom:100%;
    width:100%;
    height:10px;
  }
}
/* =========================================================
   NAV DROPDOWN (desktop only)
   ========================================================= */
.navDropdown{
  position:absolute;
  top:0;
  left:0;
  right:0;
  z-index:60;
  pointer-events:none;
}

.navDropdownPanel{
  display:grid;
  grid-template-rows:0fr;
  background:#fff;
  opacity:0;
  transform:translateY(-14px);
  transition:
    grid-template-rows .52s cubic-bezier(.22,1,.36,1),
    opacity .2s ease,
    transform .52s cubic-bezier(.22,1,.36,1);
}

.topbar.navDropdownOpen .navDropdown{
  pointer-events:auto;
}

.topbar.navDropdownOpen .navDropdownPanel{
  grid-template-rows:1fr;
  opacity:1;
  transform:translateY(0);
}

.navDropdownViewport{
  min-height:0;
  overflow:hidden;
  padding:14px 24px 20px;
}

.navDropdownList{
  --nav-dropdown-x:0px;
  width:max-content;
  max-width:320px;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:10px;
  transform:translate3d(var(--nav-dropdown-x),0,0);
}

.navDropdownLink{
  display:block;
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.6px;
  font-size:13px;
  line-height:1.2;
  color:#8e8e93;
  opacity:0;
  transform:translateY(-10px);
  --nav-link-delay:0ms;
  transition:
    color 0s linear,
    opacity .32s ease var(--nav-link-delay),
    transform .46s cubic-bezier(.22,1,.36,1) var(--nav-link-delay);
}

.navDropdownList.is-visible .navDropdownLink{
  opacity:1;
  transform:translateY(0);
}

.navDropdownLink:hover,
.navDropdownLink:focus-visible{
  color:#7a4cff;
  outline:none;
}

@media (max-width:1024px){
  .navDropdown{ display:none !important; }
}
/* =========================================================
   MOBILE NAV TAGS
   ========================================================= */
.navDrawerTags{
  display:grid;
  grid-template-rows:0fr;
  overflow:hidden;
  padding:0 24px 0 38px;
  transition:grid-template-rows .52s cubic-bezier(.22,1,.36,1), padding-bottom .52s ease;
}

.navDrawerTagsInner{
  min-height:0;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:8px;
  opacity:0;
  transform:translateY(-10px);
  transition:opacity .2s ease, transform .52s cubic-bezier(.22,1,.36,1);
}

.navDrawerTags.open{
  grid-template-rows:1fr;
  padding-bottom:8px;
}

.navDrawerTags.open .navDrawerTagsInner{
  opacity:1;
  transform:translateY(0);
}

.navDrawerTag{
  width:100%;
  display:block;
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.6px;
  font-size:13px;
  line-height:1.2;
  color:#8e8e93;
  padding:4px 0;
  opacity:0;
  transform:translateY(-10px);
  --nav-tag-delay:0ms;
  transition:
    color 0s linear,
    opacity .32s ease var(--nav-tag-delay),
    transform .46s cubic-bezier(.22,1,.36,1) var(--nav-tag-delay);
}

.navDrawerTags.open .navDrawerTag{
  width:100%;
  opacity:1;
  transform:translateY(0);
}

.navDrawerTag:hover,
.navDrawerTag:focus-visible{
  color:#7a4cff;
  outline:none;
}

.navDrawer .pill.is-submenu-open{
  color:#7a4cff;
}
@media (hover:none), (pointer:coarse){
  body,
  body *:not(input):not(textarea){
    -webkit-user-select:none;
    user-select:none;
    -webkit-touch-callout:none;
  }

  input,
  textarea{
    -webkit-user-select:text;
    user-select:text;
  }
}

/* =========================================================
   OPS INSIDE EXPLORER
   ========================================================= */
.opsSection{
  width:100%;
  background:#fff;
  padding:100px 0;
}

.opsModule{
  width:100%;
  background:#fff;
  border-radius:26px;
  box-shadow:0 16px 40px rgba(0,0,0,0.10);
  padding:40px;
}

.opsTag{
  display:inline-flex;
  align-self:flex-start;
  padding:6px 14px;
  background:#f1eaff;
  color:#7a4cff;
  border-radius:999px;
  font-size:13px;
  letter-spacing:.6px;
  margin-bottom:14px;
  width:fit-content;
}

.opsTitle{
  margin:0;
  font-size:66px;
  font-weight:950;
  line-height:1;
  color:#1c1c1e;
}

.opsHead{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
}

.opsHeadLeft{
  display:flex;
  flex-direction:column;
}

.opsHeadRight{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:nowrap;
}

.opsBtn{
  display:inline-block;
  padding:16px 28px;
  border:1px solid #794cff4b;
  background:#f1eaff;
  color:#7a4cff;
  border-radius:10px;
  text-decoration:none;
  font-weight:600;
  font-family:var(--sans);
  font-size:16px;
  letter-spacing:.2px;
  --btn-fill:#7a4cff;
  position:relative;
  overflow:hidden;
  isolation:isolate;
  transition:
    border-color .14s ease,
    color .18s ease .18s,
    background-color .18s ease;
}

.opsBtn::before{
  content:"";
  position:absolute;
  inset:0;
  background:var(--btn-fill);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .38s cubic-bezier(.22,1,.36,1) .08s;
  z-index:0;
}

.opsBtn > span{
  position:relative;
  z-index:1;
}

@media (hover:hover) and (pointer:fine){
  .opsBtn:hover{
    border-color:var(--btn-fill);
    color:#fff;
    outline:none;
  }

  .opsBtn:hover::before{
    transform:scaleX(1);
  }
}

.opsBtn:focus-visible{
  border-color:var(--btn-fill);
  color:#fff;
  outline:none;
}

.opsBtn:focus-visible::before{
  transform:scaleX(1);
}

@media (hover:none), (pointer:coarse){
  .opsBtn:active{
    border-color:var(--btn-fill);
    color:#fff;
    outline:none;
  }

  .opsBtn:active::before{
    transform:scaleX(1);
  }

  .opsBtn:focus-visible{
    border-color:#794cff4b;
    color:#7a4cff;
  }

  .opsBtn:focus-visible::before{
    transform:scaleX(0);
  }
}

.opsBtnGhost{
  background:#fff;
  color:#7a4cff;
}

button.opsBtn{
  appearance:none;
  -webkit-appearance:none;
  cursor:pointer;
}

.opsSearch{
  width:420px;
  min-width:260px;
  height:44px;
  padding:0 14px;
  border-radius:10px;
  border:1px solid #794cff4b;
  background:#fff;
  font-family:var(--sans);
  font-size:14px;
  color:#1c1c1e;
  outline:none;
  flex:1 1 420px;
  max-width:560px;
}

.opsSearch::placeholder{ color:#9a9a9a; }
.opsSearch:focus{ border-color:#7a4cff; }

.opsSection .statusPill{ display:none; }
.opsList{ width:100%; margin-top:18px; }

.opsListHead{
  position:relative;
  padding:16px 18px 10px;
}

.opsListHead::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  border-top:1.5px dashed rgba(0,0,0,0.25);
}

.opsRows{ display:flex; flex-direction:column; }

.opsListHead,
.opsRow{
  display:grid;
  grid-template-columns:
    80px
    160px
    100px
    80px
    80px
    80px
    120px
    80px;
  align-items:center;
  column-gap:28px;
}

.opsListHead > *,
.opsRow > *{
  min-width:0;
}

.opsH{
  font-size:14px;
  letter-spacing:.6px;
  text-transform:uppercase;
  color:#8e8e93;
  font-weight:600;
  white-space:nowrap;
}

.opsH.r{ text-align:right; }

.opsRow{
  padding:14px 18px;
}

.opsRow:hover{ background:#fbf7f6; }

.opsCell{
  font-size:14px;
  color:#1c1c1e;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.opsCell.mono{
  font-family:var(--mono);
  font-size:13px;
}

.opsCell.r{ text-align:right; }

.opsRows .opsRow{
  border-top:1.5px dashed rgba(0,0,0,0.18);
}

.opsRows .opsRow:first-of-type{ border-top:none; }

.opsBadge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 11px 5px 9px;
  border-radius:999px;
  background:#eef4ff;
  border:1px solid #2563eb33;
  color:#2563eb;
  font-size:12px;
  font-weight:700;
  letter-spacing:.2px;
}
.opsBadge::before{
  content:"";
  width:6px;
  height:6px;
  border-radius:999px;
  background:currentColor;
  flex:0 0 auto;
}
.opsBadge--coinbase{ background:#f6efdb; border-color:#b8821f33; color:#a9761a; }
.opsBadge--msg{ background:#ebeef6; border-color:#5b6b9a33; color:#5b6b9a; }
.opsBadge--priv_msg{ background:#e7f3ef; border-color:#3f8f7a33; color:#39836f; }

.opsDetRow{
  overflow:hidden;
  max-height:0;
  transition:max-height .35s ease;
}

.opsDetails{
  padding:10px 18px 18px;
  width:100%;
  box-sizing:border-box;
}

.opsPanel{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
}

.opsBox{
  border:1.5px dashed rgba(0,0,0,0.18);
  border-radius:16px;
  padding:14px;
  background:#fff;
  min-width:0;
}

.opsBox h3{
  margin:0 0 10px;
  font-size:14px;
}

.opsBox pre{
  margin:0;
  font-family:var(--mono);
  font-size:13px;
  line-height:1.4;
  white-space:pre-wrap;
  word-break:break-word;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

.opsEmpty{
  padding:18px;
  border-top:1.5px dashed rgba(0,0,0,0.18);
  color:#8e8e93;
  font-size:14px;
}

.opsEmpty b{ color:#1c1c1e; }

@keyframes opsIn{
  from{ opacity:0; transform: translateY(-10px); }
  to{ opacity:1; transform: translateY(0); }
}

.opsNew{ animation: opsIn .28s ease both; }

.opsScrollX{
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scrollbar-gutter:stable;
  touch-action:auto;
}

.opsScrollX .opsListHead,
.opsScrollX .opsRow{
  min-width:1066px;
}

.opsScrollX .opsCell,
.opsScrollX .opsH,
.opsScrollX pre{
  user-select:text;
  -webkit-user-select:text;
}

.opsScrollX.is-overflowing{
  touch-action:auto;
}

.opsScrollX.is-overflowing .opsCell,
.opsScrollX.is-overflowing .opsH,
.opsScrollX.is-overflowing pre,
.opsScrollX.is-dragging .opsCell,
.opsScrollX.is-dragging .opsH,
.opsScrollX.is-dragging pre{
  user-select:none;
  -webkit-user-select:none;
}

@media (max-width:900px){
  .opsModule{ padding:20px; }
  .opsTitle{ font-size:44px; }
  .opsHead{ flex-direction:column; align-items:flex-start; }
  .opsHeadRight{ width:100%; flex-wrap:wrap; }
  .opsSearch{ width:100%; min-width:0; max-width:none; flex:1 1 100%; }
  .opsDetails{ padding:10px 4px 18px; }
  .opsPanel{ grid-template-columns:1fr; gap:10px; }
}

/* ===== uniform row height across all explorer tables (match Blocks) ===== */
.blkRow,
.opsRow{
  height:46px;
  padding-top:0;
  padding-bottom:0;
}


/* Opstan dark navy color match from provided reference */
:root{
  --opstan-dark:#090d1a;
  --opstan-dark-2:#0a0f1e;
  --opstan-panel:#0c1327;
  --opstan-panel-hover:#111a33;
}