@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,400;0,500;0,700;1,700&display=swap');
/* XBT Pad additions. Uses the site's own color tokens. */
[data-xpt-hide] { display: none !important; }
[data-xpt-onetier] { grid-template-columns: 1fr !important; }

.xpt-orange { color: var(--color-btc); }
.xpt-bg-orange { background: var(--color-btc); color: #000; }
.xpt-hero-line { margin-top: 1rem; font-size: 0.95rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--color-btc); }

.xpt-adv { display: block; width: 100%; margin-top: 0.6rem; text-align: left; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-faint); background: none; border: 0; cursor: pointer; padding: 0; }
.xpt-adv:hover { color: var(--color-ink); }

.xpt-ticker { display: flex; align-items: center; gap: 0.5rem; padding: 0 1rem; border-left: 1px solid var(--color-rule); white-space: nowrap; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; }
.xpt-ticker b { color: var(--color-btc); font-weight: 500; font-variant-numeric: tabular-nums; }

.xpt-count { font-variant-numeric: tabular-nums; }
.xpt-big { font-family: var(--font-geist-mono), ui-monospace, monospace; font-size: clamp(3rem, 9vw, 6.5rem); line-height: 0.9; color: var(--color-ink); font-variant-numeric: tabular-nums; }
.xpt-bar { position: relative; height: 18px; background-image: repeating-linear-gradient(90deg, var(--color-rule-2) 0 1px, transparent 1px 4px); }
.xpt-bar > i { position: absolute; inset: 0 auto 0 0; background-image: repeating-linear-gradient(90deg, var(--color-btc) 0 2px, transparent 2px 4px); transition: width 1s linear; }
.xpt-pill { display: inline-flex; align-items: center; gap: 0.4rem; border: 1px solid var(--color-rule-2); padding: 0.2rem 0.5rem; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-dim); }
.xpt-dot { width: 7px; height: 7px; background: var(--color-btc); display: inline-block; animation: xptblink 1.2s steps(2) infinite; }
@keyframes xptblink { 50% { opacity: 0.2; } }

.xpt-card { border: 1px solid var(--color-btc); background: #0b0b0b; padding: 1.25rem; max-width: 26rem; }
.xpt-card .xpt-card-top { display: flex; align-items: center; gap: 0.6rem; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-dim); }
.xpt-card .xpt-card-top img { width: 22px; height: 22px; border-radius: 50%; }
.xpt-card .xpt-card-main { margin-top: 1rem; font-family: var(--font-geist-mono), ui-monospace, monospace; font-size: 1.6rem; line-height: 1.1; color: var(--color-ink); text-transform: uppercase; }

.xpt-input { width: 100%; background: transparent; border: 0; outline: none; color: var(--color-ink); font-size: 1.1rem; margin-top: 0.35rem; font-variant-numeric: tabular-nums; }
.xpt-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.xpt-table th { text-align: left; font-weight: 400; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-faint); padding: 0.7rem 1rem; border-bottom: 1px solid var(--color-rule); }
.xpt-table td { padding: 0.8rem 1rem; border-bottom: 1px solid var(--color-rule); color: var(--color-dim); }
.xpt-empty { padding: 2.5rem 1rem; text-align: center; color: var(--color-faint); font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; }
.xpt-xpost { border: 1px solid var(--color-rule-2); padding: 1rem; font-size: 13px; line-height: 1.5; color: var(--color-ink); white-space: pre-line; }

.xpt-modal { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; background: rgba(0,0,0,0.78); padding: 1rem; }
.xpt-modal-box { width: 100%; max-width: 28rem; background: var(--color-night); border: 1px solid var(--color-rule-2); }
.xpt-modal-box header { display: flex; align-items: center; gap: 0.6rem; padding: 0.75rem 1rem; border-bottom: 1px solid var(--color-rule); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-ink); }
.xpt-modal-box header img { width: 22px; height: 22px; border-radius: 50%; }
.xpt-modal-box .xpt-modal-body { padding: 1.25rem 1rem; }
.xpt-modal-box h3 { font-family: var(--font-geist-mono), ui-monospace, monospace; font-size: 1.6rem; line-height: 1; text-transform: uppercase; color: var(--color-ink); }
.xpt-modal-box p { margin-top: 0.8rem; font-size: 13px; line-height: 1.6; color: var(--color-dim); }
.xpt-modal-actions { display: flex; gap: 0.5rem; padding: 0 1rem 1rem; }
.xpt-modal-actions a, .xpt-modal-actions button { flex: 1; text-align: center; padding: 0.7rem; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; border: 1px solid var(--color-rule-2); color: var(--color-ink); background: none; cursor: pointer; }
.xpt-modal-actions a.primary { background: var(--color-btc); border-color: var(--color-btc); color: #000; }

.xpt-paybar { display: flex; gap: 0; border: 1px solid var(--color-rule); margin-bottom: 0.75rem; }
.xpt-paybar button { flex: 1; padding: 0.55rem; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-dim); background: none; border: 0; cursor: pointer; }
.xpt-paybar button[aria-pressed="true"] { background: var(--color-ink); color: var(--color-night); }

html, body { overflow-x: clip; }
.xpt-ticker { flex-shrink: 0; }

/* brand wordmark replaces the pixel wordmark */
svg[viewBox="0 0 36 9"] { visibility: hidden; }
.xpt-wordmark { display: block; width: auto; }

/* ===== Header restyle (from the XBTPAD header design) ===== */
header.sticky { background: #0B0B0C !important; border-bottom: 1px solid rgba(255,255,255,.14) !important; }
header.sticky > div:first-child > div:first-child { padding-right: 0 !important; }
header.sticky a[aria-label$=" home"] > :not(.xpt-header-logo) { display: none !important; }
.xpt-header-logo { height: 34px; width: auto; display: block; }

/* no flash of the shell page on /mine and /proof, no flash of stale data on /burns */
html[data-xpt-path="/mine"] main > :not([data-xpt]), html[data-xpt-path="/proof"] main > :not([data-xpt]) { display: none !important; }
html[data-xpt-boot][data-xpt-path="/burns"] main, html[data-xpt-boot][data-xpt-path="/"] main > section:last-of-type { visibility: hidden; }
header.sticky > div:nth-child(2) > div { max-width: 90rem !important; padding: 0 24px !important; }
@media (max-width: 820px) { header.sticky > div:nth-child(2) > div { padding: 0 16px !important; } }

/* ===== Premium look: living orange atmosphere ===== */
html {
  background-color: #0a0503 !important;
  background-image:
    radial-gradient(1400px 900px at 50% -200px, rgba(255,106,0,.55), rgba(255,106,0,.12) 45%, transparent 70%),
    radial-gradient(800px 800px at 100% 40%, rgba(255,72,0,.20), transparent 65%),
    radial-gradient(900px 900px at 0% 75%, rgba(255,140,30,.16), transparent 65%),
    linear-gradient(180deg, #1c0b02 0%, #0f0705 35%, #0a0604 100%) !important;
}
body { background: transparent !important; }
/* drifting light blobs */
body::after {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background:
    radial-gradient(35% 30% at 20% 30%, rgba(255,106,0,.30), transparent 70%),
    radial-gradient(30% 28% at 80% 20%, rgba(255,160,60,.22), transparent 70%),
    radial-gradient(40% 35% at 70% 80%, rgba(255,80,0,.22), transparent 70%);

}
@keyframes xptDrift {
  0% { transform: translate3d(-4%, -2%, 0) scale(1); }
  50% { transform: translate3d(3%, 4%, 0) scale(1.08); }
  100% { transform: translate3d(5%, -3%, 0) scale(1.02); }
}
/* tech grid + film grain */
body::before {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .06 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"),
    linear-gradient(rgba(255,170,110,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,170,110,.07) 1px, transparent 1px);
  background-size: 160px 160px, 64px 64px, 64px 64px;
  -webkit-mask-image: radial-gradient(ellipse 90% 75% at 50% 10%, #000 35%, rgba(0,0,0,.35) 75%, transparent 100%);
          mask-image: radial-gradient(ellipse 90% 75% at 50% 10%, #000 35%, rgba(0,0,0,.35) 75%, transparent 100%);
}
@media (prefers-reduced-motion: reduce) { body::after { animation: none; } }
main, footer { position: relative; z-index: 1; }

/* headings: white to warm orange */
main h1, main h2.font-display {
  background: linear-gradient(180deg, #ffffff 30%, #ffc8a0 75%, #ff8a3d 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent !important;
}
main h1 { text-shadow: none; }
/* glass cards with a lit top edge */
.board, main dl > div { box-shadow: inset 0 1px 0 rgba(255,150,80,.28); }
.bg-night { background-color: rgba(11,11,12,.55) !important; }
header.sticky { background: rgba(14,9,6,.94) !important; }
header.sticky::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,106,0,.7), transparent); }

/* panels feel like glass cards with a warm edge on hover */
.board, main dl > div, main section dl, .xpt-card {
  background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.01)) !important;
  transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.board:hover, main dl > div:hover {
  border-color: rgba(255,106,0,.55) !important;
  box-shadow: 0 0 0 1px rgba(255,106,0,.18), 0 18px 60px -20px rgba(255,106,0,.35);
}

/* headline and key numbers glow */
.xpt-big { text-shadow: 0 0 36px rgba(255,106,0,.35); }
.xpt-hero-line { text-shadow: 0 0 24px rgba(255,106,0,.35); }

/* primary buttons: orange gradient with a soft glow */
.btn-primary, .xpt-modal-actions a.primary {
  background: linear-gradient(180deg, #ff8a2b, #ff6a00) !important; border-color: #ff6a00 !important;
  box-shadow: 0 8px 30px -8px rgba(255,106,0,.65), inset 0 1px 0 rgba(255,255,255,.25);
  transition: transform .15s ease, box-shadow .2s ease;
}
.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 12px 40px -8px rgba(255,106,0,.85), inset 0 1px 0 rgba(255,255,255,.3); }

/* halving curve line glows */
main svg path[stroke*="ff6b00"], main svg polyline { filter: drop-shadow(0 0 6px rgba(255,106,0,.6)); }

/* ===== Header: satpad layout (boxed mono cells), XBT Pad colors ===== */
header.sticky > div:first-child { height: 56px !important; max-width: 90rem !important; padding: 0 24px !important; align-items: stretch !important; }
header.sticky > div:first-child > div:first-child { display: flex; align-items: center; padding-right: 24px !important; }
header.sticky nav[aria-label="Main"] { border-left: 1px solid rgba(255,150,80,.18) !important; align-items: stretch !important; }
header.sticky nav[aria-label="Main"] a {
  position: relative; display: flex; align-items: center; padding: 0 20px !important;
  border-right: 1px solid rgba(255,150,80,.18) !important; border-radius: 0;
  font-family: var(--font-geist-mono), ui-monospace, monospace !important; font-size: 12px !important; font-weight: 400;
  text-transform: uppercase !important; letter-spacing: .12em !important; color: #b8aca4 !important; background: transparent !important;
  transition: color .15s ease, background .15s ease; white-space: nowrap;
}
header.sticky nav[aria-label="Main"] a:hover { color: #fff !important; background: rgba(255,106,0,.10) !important; }
header.sticky nav[aria-label="Main"] a.xpt-current {
  color: #0B0B0C !important; background: linear-gradient(180deg, #ff8a2b, #ff6a00) !important;
  box-shadow: 0 0 24px -4px rgba(255,106,0,.6);
}
header.sticky nav[aria-label="Main"] a.xpt-current::after { content: none !important; }
header.sticky > div:first-child > div.ml-auto { align-items: center; }
header.sticky > div:first-child > div.ml-auto button, header.sticky > div:first-child > div.ml-auto > span {
  height: 38px !important; padding: 0 16px !important; border-radius: 0 !important;
  border: 1px solid #ff6a00 !important; background: rgba(255,106,0,.08) !important; color: #ff8a3d !important;
  font: 500 12px var(--font-geist-mono), ui-monospace, monospace !important; text-transform: uppercase !important; letter-spacing: .1em !important;
  box-shadow: 0 0 18px -6px rgba(255,106,0,.55); transition: background .15s ease, color .15s ease;
}
header.sticky > div:first-child > div.ml-auto button:hover { background: #ff6a00 !important; color: #0B0B0C !important; }
header.sticky button[aria-label="Menu"] { width: 38px !important; height: 38px !important; border-radius: 0; border: 1px solid rgba(255,150,80,.3) !important; align-self: center; }
header.sticky button[aria-label="Menu"]:hover { background: rgba(255,106,0,.12) !important; color: #fff !important; }
@media (max-width: 1180px) { header.sticky nav[aria-label="Main"] a { padding: 0 12px !important; letter-spacing: .08em !important; } }
@media (max-width: 820px) { header.sticky > div:first-child { padding: 0 16px !important; } .xpt-header-logo { height: 26px; } }
@media (max-width: 440px) { .xpt-header-logo { height: 22px; } header.sticky > div:first-child > div.ml-auto button { padding: 0 10px !important; } }

/* Headlines in Ubuntu, the font of the Bitcoin wordmark */
main h1, main h2.font-display, main dt.font-display, .xpt-modal-box h3, .xpt-card-main {
  font-family: Ubuntu, system-ui, sans-serif !important; font-weight: 700 !important; letter-spacing: -0.02em !important;
}
main h1 { line-height: 0.95 !important; }

/* ===== Interactive layer ===== */
/* cursor spotlight */
.xpt-spot { position: fixed; left: 0; top: 0; width: 900px; height: 900px; margin: -450px 0 0 -450px; pointer-events: none; z-index: 2;
  background: radial-gradient(closest-side, rgba(255,120,30,.10), transparent 70%); will-change: transform; transform: translate3d(-2000px,-2000px,0); }
/* tilt cards */
.xpt-tilt { transform-style: preserve-3d; will-change: transform; transition: transform .35s cubic-bezier(.2,.8,.2,1), border-color .25s, box-shadow .25s; position: relative; }
.xpt-tilt.is-hover { transition: transform .08s linear, border-color .25s, box-shadow .25s; }
.xpt-glare { position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .3s ease; border-radius: inherit;
  background: radial-gradient(380px circle at var(--gx, 50%) var(--gy, 50%), rgba(255,170,100,.16), transparent 55%); }
.xpt-tilt.is-hover > .xpt-glare, .board.is-hover > .xpt-glare { opacity: 1; }
.board { position: relative; }
/* magnetic buttons */
.xpt-mag { transition: transform .25s cubic-bezier(.2,.8,.2,1); will-change: transform; }
/* scroll reveal */
.xpt-reveal { opacity: 0; transform: translateY(28px); transition: opacity .8s ease, transform .8s cubic-bezier(.2,.8,.2,1); }
.xpt-reveal.is-in { opacity: 1; transform: none; }
/* nav hover sweep */
header.sticky nav[aria-label="Main"] a::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: #ff6a00;
  transform: scaleX(0); transform-origin: left; transition: transform .25s ease; }
header.sticky nav[aria-label="Main"] a:hover::before { transform: scaleX(1); }
header.sticky nav[aria-label="Main"] a.xpt-current::before { display: none; }
/* coin cards lift */
main a[href^="/c/"] { transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
main a[href^="/c/"]:hover { transform: translateY(-4px); box-shadow: 0 20px 50px -18px rgba(255,106,0,.55); border-color: rgba(255,106,0,.6) !important; }
@media (hover: none), (prefers-reduced-motion: reduce) {
  .xpt-spot { display: none; } .xpt-reveal { opacity: 1; transform: none; }
}

/* smooth page switches: the header stays put, the page cross-fades */
@view-transition { navigation: auto; }
header.sticky { view-transition-name: xpt-header; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .22s; animation-timing-function: ease; }
::view-transition-group(xpt-header) { animation: none; }
