/*
 * Coin page, mobile (Pen zfIgc "E · Mobile · Coin page · tGBP") and the
 * in-between widths. Desktop (≥1181px) is untouched: everything here sits in
 * a media query except the rule that hides mobile-only markup.
 */
.d2 .m-only { display: none; }

/* Narrow desktop / tablet: stack the header and the rail so nothing overflows. */
@media (min-width: 761px) and (max-width: 1180px) {
  .d2-coinhead { flex-direction: column; gap: 24px; padding: 20px 32px 28px; }
  .d2-identity { width: auto; }
  .d2-keystats { align-self: stretch; }
  .d2-coinmain { flex-direction: column; padding: 28px 32px 40px; }
  .d2-coinleft { align-self: stretch; }
  .d2-coinrail { width: auto; align-self: stretch; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
  .d2-mtable col:nth-child(3), .d2-mtable th:nth-child(3), .d2-mtable td:nth-child(3) { display: none; }
  .d2-about { flex-direction: column; padding: 40px 32px 48px; }
  .d2-about__main, .d2-risks { width: auto; align-self: stretch; }
  .d2-answers { flex-wrap: wrap; }
}

@media (max-width: 760px) {
  .d2-coinpage .d-only { display: none !important; }
  body.single-ocm_asset { padding-bottom: 76px; }

  /* Back (NASmC) */
  .d2-coinpage .d2-crumbs { display: none; }
  .d2-coinpage .m-back { display: flex; align-items: center; gap: 4px; height: 29px; padding: 12px 16px 0; font-size: 13px; line-height: 17px; color: var(--ink-muted); }

  /* Identity (uonWk) */
  .d2-coinhead { flex-direction: column; gap: 0; padding: 0; box-shadow: none; }
  .d2-identity { width: auto; align-self: stretch; gap: 14px; padding: 14px 16px 18px; }
  .d2-namerow { height: 52px; gap: 12px; align-self: flex-start; }
  .d2-namerow__icon { width: 44px; height: 44px; }
  .d2-namerow__line1 { height: 26px; gap: 8px; }
  .d2-coinname { font-size: 26px; line-height: 26px; }
  .d2-namerow__line1 .d2-chip { height: 18px; padding: 2px 6px; font-size: 11px; line-height: 14px; }
  .d2-namerow__line2 { gap: 8px; }
  .d2-issuer { font-size: 12px; line-height: 16px; }
  .d2-pricerow { height: 52px; gap: 10px; align-self: flex-start; }
  .d2-bigprice { font-size: 40px; line-height: 52px; letter-spacing: -1px; }
  .d2-deltas { padding-bottom: 6px; font-size: 12px; line-height: 16px; }
  .d2-range24 { width: auto; }
  .d2-range24__labels { font-size: 10px; line-height: 13px; }

  /* Key metrics (bzBwA): 2 × 3, full bleed */
  .d2-keystats { flex: none; align-self: stretch; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 82px; box-shadow: inset 0 1px 0 var(--line), inset 0 -1px 0 var(--line); }
  .d2-coinpage .d2-keystat { gap: 4px; padding: 12px 16px; }
  .d2-coinpage .d2-keystat:nth-child(odd) { box-shadow: inset -1px -1px 0 var(--line); }
  .d2-coinpage .d2-keystat:nth-child(even) { box-shadow: inset 0 -1px 0 var(--line); }
  .d2-coinpage .d2-keystat:nth-child(5) { box-shadow: inset -1px 0 0 var(--line); }
  .d2-coinpage .d2-keystat:nth-child(6) { box-shadow: none; }
  .d2-keystat__label { font-size: 9px; line-height: 12px; letter-spacing: 1.1px; }
  .d2-keystat__value { font-size: 19px; line-height: 25px; letter-spacing: 0; }
  .d2-keystat__detail { font-size: 10px; line-height: 13px; }

  /* Sections: flat, full width, a rule on top */
  .d2-coinmain { flex-direction: column; gap: 0; padding: 0; }
  .d2-coinleft, .d2-coinrail { width: auto; align-self: stretch; gap: 0; }
  .d2-coinpage .d2-panel { gap: 12px; padding: 20px 16px; border-radius: 0; background: transparent; box-shadow: inset 0 1px 0 var(--line); }
  .d2-coinpage .d2-panel__title { font-size: 22px; line-height: 22px; }
  .d2-coinpage .d2-panel__head, .d2-coinpage .d2-panel__head--short, .d2-coinpage .d2-panel__head--tall { height: 22px; }

  /* Chart (Y3hcp7) */
  .d2-coinpage .d2-pricepanel { padding: 18px 16px; box-shadow: none; }
  .d2-pricepanel .d2-panel__head { display: grid; grid-template-columns: minmax(0, 1fr) auto; row-gap: 12px; height: auto; align-items: center; }
  .d2-pricepanel .d2-charttabs { display: none; }
  .d2-coinpage .m-charttabs { grid-column: 1 / -1; display: flex; gap: 2px; padding: 3px; border-radius: 8px; background: var(--surface-alt); }
  .m-charttabs a { flex: 1 1 0; display: flex; justify-content: center; padding: 7px 0; border-radius: 6px; font-size: 13px; line-height: 17px; color: var(--ink-muted); }
  .m-charttabs a[aria-current] { background: #fff; color: var(--ink); font-weight: 600; }
  .d2 .m-charttabs a:hover { text-decoration: none; }
  .d2-coinpage .m-chartstat { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 400 10px/13px var(--font-mono); color: var(--ink-muted); }
  .d2-pricepanel .d2-seg { gap: 10px; padding: 0; background: none; }
  .d2-pricepanel .d2-seg a { padding: 0; background: none; font: 400 11px/14px var(--font-mono); color: var(--ink-muted); }
  .d2-pricepanel .d2-seg a[aria-current] { background: none; color: var(--ink); }
  .d2-pricepanel .d2-chart { height: 170px; gap: 0; }
  .d2-pricepanel .d2-chart__y, .d2-pricepanel .d2-chart__x, .d2-pricepanel .d2-chart__band, .d2-pricepanel .d2-chart__plot .is-minor { display: none; }
  .d2 .d2-pricepanel .d2-chart__plot { height: 170px; }
  .d2-pricepanel .d2-hover-plot { left: 0; }
  .d2-coinpage .m-ylabels { display: block; position: absolute; inset: 0; pointer-events: none; }
  .m-ylabels span { position: absolute; right: 12px; font: 400 9px/12px var(--font-mono); color: var(--ink-muted); }
  .m-ylabels .is-0 { margin-top: 2px; }
  .m-ylabels .is-2 { margin-top: -14px; }
  .m-ylabels .is-4 { margin-top: -13px; }
  .d2-pricepanel .d2-chart--bars .d2-bars { flex: 1; height: 170px; }
  .d2-pricepanel .d2-chart--empty { height: 170px; }
  .d2-coinpage .m-chartfoot { display: block; font: 400 10px/13px var(--font-mono); color: var(--ink-muted); }

  /* Markets (HKsxF): cards */
  .d2-marketspanel .d2-panel__titles { flex: 1; justify-content: space-between; align-items: center; }
  .d2-marketspanel .d2-panel__sub { font: 400 10px/13px var(--font-mono); letter-spacing: 1.1px; text-transform: uppercase; }
  .d2-marketspanel .d2-seg, .d2-marketspanel .d2-mtable, .d2-marketspanel .d2-panel__foot { display: none; }
  .d2-coinpage .m-markets { display: flex; flex-direction: column; gap: 12px; }
  .m-markets:not(.is-all) .m-market:nth-child(n+4) { display: none; }
  .m-market { display: flex; flex-direction: column; gap: 10px; padding: 14px; border-radius: 8px; background: #fff; box-shadow: inset 0 0 0 1px var(--line); }
  .m-market__head { display: flex; align-items: center; gap: 10px; height: 34px; }
  .m-market__logo { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; overflow: hidden; background: var(--surface-inverse); font: 600 12px/16px var(--font-body); color: #fff; }
  .m-market__logo.has-img { background: none; }
  .m-market__logo img { width: 100%; height: 100%; display: block; }
  .m-market__name { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; font: 600 15px/19px var(--font-body); color: var(--ink); }
  .m-market__kind { font: 400 11px/14px var(--font-body); color: var(--ink-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .m-market__stats { display: flex; justify-content: space-between; align-items: flex-end; height: 33px; }
  .m-market__stat { display: flex; flex-direction: column; gap: 2px; }
  .m-market__k { font: 400 9px/12px var(--font-mono); letter-spacing: 1.1px; color: var(--ink-muted); }
  .m-market__v { font: 400 15px/19px var(--font-mono); color: var(--ink); }
  .m-market__share { width: 80px; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; font: 400 10px/13px var(--font-mono); color: var(--ink-secondary); white-space: nowrap; }
  .m-market__track { width: 80px; height: 5px; border-radius: 9999px; background: var(--surface-alt); overflow: hidden; }
  .m-market__track i { display: block; height: 5px; border-radius: 9999px; background: var(--accent); }
  .m-market__bs { font: 400 11px/14px var(--font-mono); color: var(--ink-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .d2-marketspanel .d2-panel__footrow { height: auto; }
  .d2-marketspanel .d2-panel__footrow:not(:has(a)) { display: none; }
  .d2-marketspanel .d2-textlink { flex: 1; display: flex; justify-content: center; padding: 10px 0; border-radius: 6px; box-shadow: inset 0 0 0 1px var(--line); }

  /* Contracts (Wlw8X) */
  .d2-railsub { font-size: 10px; letter-spacing: 1.1px; }
  .m-contracts .d2-contract { height: 25px; padding: 4px 0; }
  .m-contracts:not(.is-expanded) .d2-contract:nth-child(n+5) { display: none; }
  .m-contracts .d2-contract__chain { display: flex; align-items: center; gap: 10px; }
  .m-contracts .d2-contract__chain img { width: 16px; height: 16px; }
  .m-contracts .d2-contract__ext { display: none; }
  .m-contracts .d2-copy { width: 14px; height: 14px; }
  .m-contracts .d2-copy svg { width: 14px; height: 14px; }
  .d2-coinpage .m-more { display: flex; align-self: flex-start; align-items: center; gap: 6px; padding: 0; border: 0; background: none; font: 500 13px/17px var(--font-body); color: var(--accent); cursor: pointer; }
  .m-contracts.is-expanded .m-more { display: none; }

  /* Compliance (d3uKl): label left, value right */
  .d2-coinpage .d2-fact { flex-direction: row; justify-content: space-between; align-items: center; gap: 12px; padding: 6px 0; }
  .d2-coinpage .d2-fact__k { font-size: 9px; line-height: 12px; letter-spacing: 1.1px; white-space: nowrap; }
  .d2-coinpage .d2-fact__v { text-align: right; }
  .d2-coinpage .d2-railpanel > .d2-textlink { align-self: flex-start; }

  /* Links (Erz65) */
  .d2-coinpage .d2-linkbtn { height: 34px; padding: 9px 10px; }

  /* About (k1eeP) */
  .d2-coinpage .m-about { display: flex; flex-direction: column; gap: 12px; padding: 20px 16px; background: var(--surface-alt); box-shadow: inset 0 1px 0 var(--line); }
  .m-about__title { font-family: var(--font-heading); font-variation-settings: "opsz" 18; font-size: 22px; line-height: 22px; font-weight: 400; color: var(--ink); }
  .m-about__item { padding: 12px 0; box-shadow: inset 0 -1px 0 var(--line); }
  .m-about__item summary { display: flex; justify-content: space-between; align-items: center; height: 19px; font: 600 15px/19px var(--font-body); color: var(--ink); cursor: pointer; list-style: none; }
  .m-about__item summary::-webkit-details-marker { display: none; }
  .m-about__item[open] summary svg { transform: rotate(180deg); }
  .m-about__item p { margin-top: 6px; font-size: 14px; line-height: 21px; color: var(--ink-secondary); }
  .m-about__item p strong { color: var(--ink); font-weight: 600; }

  /* Sticky bar (zRzv3) */
  .d2-msticky .m-sticky { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; height: 76px; align-items: center; gap: 12px; padding: 12px 16px 24px; background: #FFFFFFF2; -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: inset 0 1px 0 var(--line); }
  .m-sticky__text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
  .m-sticky__p { font: 400 12px/16px var(--font-mono); color: var(--ink); }
  .m-sticky__s { font-size: 11px; line-height: 14px; color: var(--ink-muted); }
  .m-sticky__btn { padding: 11px 18px; border-radius: 8px; background: var(--accent); font: 500 14px/18px var(--font-body); color: #fff; white-space: nowrap; }
  .d2 .m-sticky__btn:hover { text-decoration: none; }
}
