/* ==========================================================================
   SQUEEZE — terminal
   Dark surface, same design language as the marketing site. Only the pieces
   that do not exist there are defined here; everything else is inherited.
   ========================================================================== */

body.dark { background: var(--ink-pure); color: var(--d-1); }

/* ---------- nav on a dark page ---------------------------------------- */

.nav--dark.is-stuck {
  background: rgba(20,20,20,.72);
  border-bottom-color: var(--line-d);
}
.nav--dark .brand,
.nav--dark .nav__links a { color: var(--d-2); }
.nav--dark .brand { color: var(--d-1); }
.nav--dark .nav__links a:hover,
.nav--dark .nav__links a[aria-current="page"] { color: var(--d-1); }
.nav--dark .nav__links a[aria-current="page"] { border-bottom: 1px solid var(--tint); padding-bottom: 2px; }
.nav--dark .addr { border-color: var(--line-d); color: var(--d-2); }
.nav--dark .addr:hover { border-color: rgba(255,255,255,.3); background: rgba(255,255,255,.04); }
.nav--dark .btn { background: #fff; color: var(--ink); border: 1px solid #fff; }
.nav--dark .btn:hover { background: var(--tint); border-color: var(--tint); }

/* ---------- header ----------------------------------------------------- */

.apphead { padding: 132px 0 34px; }
.apphead .tag { background: rgba(255,255,255,.09); color: var(--d-2); }
.apphead .h-1 { margin: 22px 0 20px; letter-spacing: -.036em; }
.apphead .lede { color: var(--d-2); max-width: 66ch; }
.apphead .lede .mono { color: var(--d-1); }

.lede--sm { font-size: 15.5px; max-width: 62ch; margin-top: 12px; color: var(--d-2); }

/* ---------- wallet banner ---------------------------------------------- */

.wbanner {
  margin-top: 32px;
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
  flex-wrap: wrap;
  padding: 18px 20px;
  border: 1px solid var(--line-d);
  border-radius: var(--r-card);
  background: rgba(255,255,255,.028);
}
.wbanner__l { display: flex; align-items: center; gap: 14px; min-width: 0; }
.wbanner__t { font-size: 16px; }
.wbanner__s { color: var(--d-3); word-break: break-all; }
.wbanner__s .mono { color: var(--d-2); font-size: 12px; }
.wbanner__r { display: flex; gap: 10px; flex-wrap: wrap; }
.wbanner .btn { padding: 9px 15px; font-size: 13.5px; }
.wbanner .btn--ghost { background: transparent; color: var(--d-1); border: 1px solid var(--line-d); }
.wbanner .btn--ghost:hover { border-color: rgba(255,255,255,.32); background: rgba(255,255,255,.05); }
.wbanner .btn:not(.btn--ghost) { background: #fff; color: var(--ink); }

.pulse { width: 9px; height: 9px; border-radius: 50%; background: var(--d-4); flex: none; }
.pulse--up  { background: var(--up);  animation: pulse 2.2s ease-in-out infinite; }
.pulse--hot { background: var(--hot); animation: pulse 1.4s ease-in-out infinite; }

/* ---------- wallet picker ---------------------------------------------- */

.pickers { margin-top: 12px; display: flex; gap: 10px; flex-wrap: wrap; }
.pickers[hidden] { display: none; }
.picker {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 11px 16px;
  border: 1px solid var(--line-d);
  border-radius: var(--pill);
  background: rgba(255,255,255,.03);
  color: var(--d-1);
  font-family: inherit; font-size: 14px; font-weight: 500;
  cursor: pointer;
  transition: border-color .2s ease, background .2s ease;
}
.picker:hover { border-color: var(--tint); background: rgba(255,220,211,.07); }
.picker img { border-radius: 6px; display: block; }
.picker__ph { width: 22px; height: 22px; border-radius: 6px; background: rgba(255,255,255,.14); display: block; }
.picker--none {
  cursor: default; border-radius: var(--r-in); color: var(--d-3);
  font-size: 13px; font-weight: 400; max-width: 60ch; line-height: 1.5;
}
.picker--none:hover { border-color: var(--line-d); background: rgba(255,255,255,.03); }

/* ---------- chain strip ------------------------------------------------- */

.strip {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));
  border: 1px solid var(--line-d); border-radius: var(--r-card);
  overflow: hidden;
}
.strip__i {
  padding: 18px 20px;
  display: flex; flex-direction: column; gap: 6px;
  border-right: 1px solid var(--line-d);
}
.strip__i:last-child { border-right: 0; }
.strip__i .micro { color: var(--d-3); letter-spacing: .08em; text-transform: uppercase; font-size: 10px; }
.strip__i .mono { font-size: 15px; color: var(--d-1); }

/* ---------- section heads ----------------------------------------------- */

.secthead {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 24px;
  margin-bottom: 26px;
}
.secthead .tag { background: rgba(255,255,255,.09); color: var(--d-3); font-family: var(--mono); font-size: 11px; padding: 5px 10px; }
.secthead .h-2 { margin-top: 14px; letter-spacing: -.03em; }
.secthead .badge { flex: none; margin-top: 6px; }
.dark .badge--live { background: rgba(34,160,74,.14); color: #6ee79a; }
.dark .badge--mock { background: rgba(255,255,255,.07); color: var(--d-3); }

/* ---------- dark window -------------------------------------------------- */

.win--d {
  background: #151515;
  border-color: var(--line-d);
  box-shadow: 0 30px 80px -40px rgba(0,0,0,.9);
}
.win--d .win__bar { background: #1b1b1b; border-bottom-color: var(--line-d); }
.win--d .win__title { color: var(--d-3); }
.win--d .kv { color: var(--d-2); }
.win--d .kv + .kv { border-top-color: var(--line-d); }
.win--d .kv span:last-child { color: var(--d-1); }
.win--d .up { color: #6ee79a; }
.win--d .hot { color: #ff7a7f; }
.win--d .ticket__row { border-bottom: 1px solid var(--line-d); padding: 13px 0; display: flex; justify-content: space-between; gap: 16px; }
.win--d .ticket__k { color: var(--d-3); font-size: 13.5px; }
.win--d .ticket__v { color: var(--d-1); font-size: 13.5px; }
.win--d .ticket__v.hot { color: #ff7a7f; }

/* ---------- positions table ---------------------------------------------- */

.ptable { font-family: var(--mono); font-size: 13px; }
.prow {
  display: grid;
  grid-template-columns: 1.2fr .9fr 1fr .8fr 1fr 1fr .8fr;
  gap: 14px; align-items: center;
  padding: 14px 22px;
  border-bottom: 1px solid var(--line-d);
  color: var(--d-2);
}
.prow:last-child { border-bottom: 0; }
.prow--h { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--d-4); padding: 14px 22px 11px; }
.prow .r { text-align: right; }
.prow .dim { color: var(--d-3); }
.psym { color: var(--d-1); display: flex; align-items: center; gap: 8px; }
.pflag {
  font-style: normal; font-size: 9px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--amber); border: 1px solid rgba(254,188,46,.36); border-radius: 4px; padding: 2px 5px;
}
.ptag {
  font-weight: 400; font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase;
  border-radius: 5px; padding: 4px 8px; border: 1px solid var(--line-d); color: var(--d-3);
}
.ptag.is-up    { color: #6ee79a; border-color: rgba(34,160,74,.4);  background: rgba(34,160,74,.10); }
.ptag.is-amber { color: var(--amber); border-color: rgba(254,188,46,.4); background: rgba(254,188,46,.09); }
.ptag.is-hot   { color: #ff7a7f; border-color: rgba(229,72,77,.42); background: rgba(229,72,77,.10); }
.pempty { padding: 46px 22px; color: var(--d-3); font-family: var(--sans); font-size: 15px; }
.pempty .micro { display: block; margin-top: 6px; color: var(--d-4); }
.srcnote { color: var(--d-3); }
.srcnote b { color: var(--d-1); font-weight: 500; }

/* ---------- oracle form --------------------------------------------------- */

.oform { display: flex; gap: 12px; flex-wrap: wrap; }
.oinput {
  flex: 1 1 420px;
  padding: 14px 18px;
  border-radius: var(--pill);
  border: 1px solid var(--line-d);
  background: rgba(255,255,255,.03);
  color: var(--d-1);
  font-size: 14px;
  outline: none;
  transition: border-color .2s ease;
}
.oinput:focus { border-color: var(--tint); }
.oform .btn { background: #fff; color: var(--ink); padding: 14px 24px; }
.oform .btn:hover { background: var(--tint); }
.oform .btn:disabled { opacity: .5; cursor: default; }

.quick { margin-top: 14px; display: flex; gap: 8px; flex-wrap: wrap; }
.qk {
  font-family: var(--mono); font-size: 11.5px;
  padding: 6px 11px; border-radius: var(--pill);
  border: 1px solid var(--line-d); background: transparent; color: var(--d-3);
  cursor: pointer; transition: color .18s ease, border-color .18s ease;
}
.qk:hover { color: var(--d-1); border-color: rgba(255,255,255,.34); }

.win--d .term { min-height: 420px; max-height: 560px; overflow-y: auto; color: var(--d-2); }

/* ---------- desk ---------------------------------------------------------- */

.deskgrid { display: grid; grid-template-columns: 1.35fr 1fr; gap: 20px; align-items: start; }
.deskbtn {
  width: 100%; margin-top: 22px; justify-content: center;
  background: rgba(255,255,255,.06); color: var(--d-3);
  border: 1px dashed var(--line-d); cursor: not-allowed;
}
.deskbtn:hover { background: rgba(255,255,255,.06); }
.deskfoot { margin-top: 14px; color: var(--d-4); line-height: 1.5; }

/* ---------- footer -------------------------------------------------------- */

.dark .foot { border-top: 1px solid var(--line-d); }
.dark .foot__note { color: var(--d-3); }
.dark .foot__links a { color: var(--d-2); }
.dark .foot__links a:hover { color: var(--d-1); }

/* ---------- responsive ---------------------------------------------------- */

@media (max-width: 1080px) {
  .strip { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .strip__i:nth-child(2n) { border-right: 0; }
  .strip__i { border-bottom: 1px solid var(--line-d); }
  .deskgrid { grid-template-columns: 1fr; }
}
@media (max-width: 860px) {
  .apphead { padding-top: 110px; }
  .prow { grid-template-columns: 1fr 1fr 1fr; row-gap: 6px; }
  .prow--h { display: none; }
  .prow .r:nth-child(n+4) { display: none; }
  .secthead { flex-direction: column; gap: 12px; }
}