/* Ainer landing = ONE screen, no scroll (Telegram welcome style, like the SEED GO ref).
   Rows: top bar · 3D stage (takes what is left) · title · 4 features · CTA.
   Two designs: phone (default, stacked) and wide (container ≥ 760px: stage left, copy right). */
html, body { height: 100%; }
body { overflow: hidden; }
.lp {
  container-type: size;
  height: 100vh; height: 100dvh;
  max-width: 76rem; margin: 0 auto;
  padding: env(safe-area-inset-top) 1rem calc(0.75rem + env(safe-area-inset-bottom));
  display: grid; grid-template-rows: auto 1fr;
}

.lp-top { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.6rem 0; }
.lp-logo { display: flex; align-items: center; gap: 0.45rem; color: var(--text); text-decoration: none; font: 900 1.05rem/1 var(--font-display); letter-spacing: 0.04em; }
.lp-logo svg { width: 1.9rem; height: 1.9rem; }
.lp-logo b { color: var(--cyan); }
.lp-top-cta { min-height: 2.3rem; padding: 0 0.95rem; font-size: 0.8rem; }

.lp-one {
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: clamp(0.5rem, 1.8cqh, 1rem);
}

/* stage */
.lp-stagewrap { position: relative; min-height: 0; display: grid; }
.lp-stagewrap > .lp-stage { grid-area: 1 / 1; }
.lp-stage { position: relative; min-height: 0; width: 100%; padding: 0; border: 2px solid var(--cyan); border-radius: 1rem; cursor: pointer;
  background: radial-gradient(80% 70% at 50% 40%, #16306a, #070b18 75%); box-shadow: inset 0 0 1.4rem #2ee6ff33, 0 0 1.2rem #2ee6ff22; overflow: hidden;
  touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.lp-rig { width: 100%; height: 100%; object-fit: contain; }
.lp-stage.is-3d .lp-rig { display: none; }
.lp-3d { position: absolute; inset: 0; width: 100% !important; height: 100% !important; display: block; transition: transform .1s; }
.lp-stage:active .lp-3d, .lp-stage:active .lp-rig { transform: scale(0.98); }
.lp-hud { position: absolute; top: 0.5rem; left: 0.5rem; right: 0.5rem; display: flex; flex-wrap: wrap; gap: 0.3rem; pointer-events: none; }
.lp-hud .rm-chip { font-size: clamp(0.66rem, 3.4cqw, 0.78rem); padding: 0.22rem 0.5rem; gap: 0.3rem; background: #070b18d9; }
.lp-tap-hint { position: absolute; left: 50%; bottom: 0.55rem; transform: translateX(-50%); font: 800 0.68rem/1 var(--font-display); letter-spacing: 0.16em; color: var(--cyan);
  padding: 0.35rem 0.7rem; border-radius: 2rem; background: #070b18cc; border: 1.5px solid #2ee6ff80; white-space: nowrap; }
.lp-pop { position: absolute; pointer-events: none; font: 900 1.1rem/1 var(--font-display); color: var(--amber); text-shadow: 0 0.12rem 0 var(--ink);
  animation: lp-pop .9s ease-out forwards; }
@keyframes lp-pop { from { transform: translate(-50%, 0) scale(.8); opacity: 1; } to { transform: translate(-50%, -3.5rem) scale(1.1); opacity: 0; } }

/* panel under the stage: one view at a time (welcome → steps → demo → signup) */
.lp-panel { display: grid; }
.lp-view { grid-area: 1 / 1; display: grid; gap: clamp(0.4rem, 1.4cqh, 0.8rem); justify-items: center; align-content: center; text-align: center;
  visibility: hidden; opacity: 0; transform: translateY(0.6rem); transition: opacity .25s, transform .25s, visibility 0s .25s; }
.lp-view.is-on { visibility: visible; opacity: 1; transform: none; transition: opacity .25s, transform .25s; }
.lp-view .rm-h1 { font-size: clamp(1.35rem, min(7.4cqw, 4.6cqh), 3rem); }
.lp-view .rm-h2 { font-size: clamp(1.3rem, min(7cqw, 4.2cqh), 2.4rem); }
.lp-lead { margin: 0; font-size: clamp(0.82rem, 2cqh, 1.05rem); color: #c3d0ea; max-width: 30rem; }
.lp-legal { margin: 0; font-size: 0.72rem; }
.lp-legal a { color: var(--muted); }

.lp-feats { list-style: none; margin: 0; padding: 0; width: 100%; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.45rem; }
.lp-feats li { display: grid; justify-items: center; gap: 0.2rem; min-width: 0; }
.lp-feats .rm-slot { width: clamp(2.3rem, 6.5cqh, 3.4rem); padding: 0.4rem; }
.lp-feats b { font: 800 clamp(0.6rem, 1.6cqh, 0.8rem)/1.1 var(--font-display); }

.lp-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; width: 100%; max-width: 30rem; }
.lp-btns .rm-btn { min-height: clamp(2.7rem, 6.5cqh, 3.3rem); padding: 0.3rem 0.5rem; font-size: clamp(0.68rem, 3.4cqw, 0.9rem); line-height: 1.1; text-align: center; gap: 0.35rem; }
.lp-btns svg { flex: none; }

.lp-dots { display: flex; gap: 0.4rem; }
.lp-dots i { width: 0.5rem; height: 0.5rem; border-radius: 1rem; background: var(--steel-1); transition: width .25s; }
.lp-dots i.is-on { width: 1.4rem; background: var(--cyan); box-shadow: 0 0 0.5rem var(--cyan); }

/* demo */
.lp-demo { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.45rem; width: 100%; max-width: 30rem; }
.lp-card { display: grid; justify-items: center; gap: 0.2rem; padding: 0.5rem 0.3rem; min-width: 0; cursor: pointer; color: var(--text);
  border-radius: 0.8rem; border: 2px solid var(--ink); background: linear-gradient(160deg, var(--steel-2), var(--steel-3));
  box-shadow: inset 0 1px 0 #ffffff30, 0 0.25rem 0 var(--ink); font-family: var(--font-body); transition: transform .1s; -webkit-tap-highlight-color: transparent; }
.lp-card:active { transform: translateY(0.2rem); box-shadow: inset 0 1px 0 #ffffff30, 0 0.05rem 0 var(--ink); }
.lp-card[disabled] { opacity: .45; }
.lp-card .rm-slot { width: clamp(2rem, 5.5cqh, 2.8rem); padding: 0.3rem; }
.lp-card b { font: 800 clamp(0.6rem, 1.6cqh, 0.78rem)/1.1 var(--font-display); }
.lp-card small { font-size: 0.7rem; color: var(--muted); }
.lp-price { font: 800 0.78rem/1 var(--font-display); color: #2a1400; background: var(--amber); border: 1.5px solid var(--ink); border-radius: 0.4rem; padding: 0.2rem 0.45rem; }
.lp-hint { margin: 0; font-size: 0.8rem; min-height: 1.2em; }
.lp-cash b { color: var(--amber); }
.lp-view [data-save] { max-width: 30rem; min-height: 2.8rem; }

@container (max-height: 600px) { .lp-lead { display: none; } }

/* wide: stage left, panel right */
@container (min-width: 760px) {
  .lp-one { grid-template-columns: 1.15fr 1fr; grid-template-rows: 1fr; column-gap: 2.5rem; padding-bottom: 1rem; }
  .lp-panel { align-self: center; }
  .lp-view { justify-items: start; text-align: left; }
  .lp-view .rm-h1 { font-size: clamp(2rem, 4.2cqw, 3.4rem); }
  .lp-view .rm-h2 { font-size: clamp(1.8rem, 3.4cqw, 2.8rem); }
}

.lp-tiers { list-style: none; margin: 0; padding: 0; width: 100%; max-width: 30rem; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.4rem; }
.lp-tiers li { display: grid; gap: 0.15rem; justify-items: center; padding: 0.45rem 0.2rem; border-radius: 0.7rem; border: 2px solid var(--ink);
  background: linear-gradient(160deg, var(--steel-2), var(--steel-3)); box-shadow: inset 0 0 0 1px #2ee6ff40; }
.lp-tiers li:last-child { box-shadow: inset 0 0 0 2px var(--amber), 0 0 0.8rem #ffb22e55; }
.lp-tiers b { font: 900 clamp(0.85rem, 2.4cqh, 1.15rem)/1 var(--font-display); }
.lp-tiers span { font-size: 0.68rem; color: var(--muted); }
.lp-tiers em { font-style: normal; font-weight: 700; color: var(--green); }

.lp-feats small { font-size: clamp(0.6rem, 1.5cqh, 0.72rem); color: var(--muted); line-height: 1.15; }

/* tutorial hand: points at the next thing to tap */
.lp-hand { position: fixed; left: 0; top: 0; width: 2.6rem; height: 2.6rem; z-index: 50; pointer-events: none; opacity: 0;
  transition: transform .45s cubic-bezier(.3,1.3,.5,1), opacity .25s; filter: drop-shadow(0 0.3rem 0.4rem #000a); }
.lp-hand.is-on { opacity: 1; }
.lp-hand svg { width: 100%; height: 100%; transform-origin: 40% 10%; animation: lp-press 1.1s ease-in-out infinite; }
@keyframes lp-press { 0%, 100% { transform: translate(0, 0) scale(1); } 45% { transform: translate(-0.15rem, -0.35rem) scale(1.04); } 60% { transform: translate(0, 0.1rem) scale(.92); } }

/* promo banner over the stage (AIBIO-style hook) */
.lp-promo { position: absolute; top: 0.5rem; left: 0.5rem; right: 0.5rem; z-index: 2; display: flex; align-items: center; gap: 0.55rem;
  padding: 0.4rem 0.45rem 0.4rem 0.5rem; border-radius: 0.9rem; cursor: pointer; text-align: left; color: var(--text);
  border: 2px solid var(--ink); background: linear-gradient(100deg, #2a1a52f2, #14204af2 55%, #3a2608f2);
  box-shadow: inset 0 0 0 1.5px #ffb22e99, 0 0.25rem 0 var(--ink), 0 0 1.2rem #ffb22e44; overflow: hidden; -webkit-tap-highlight-color: transparent; }
.lp-promo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 35%, #ffffff30 50%, transparent 65%); transform: translateX(-100%); animation: lp-shine 3.2s ease-in-out infinite; pointer-events: none; }
@keyframes lp-shine { 60%, 100% { transform: translateX(100%); } }
.lp-promo:active { transform: translateY(0.15rem); }
.lp-promo-ico { flex: none; width: clamp(2.1rem, 5.5cqh, 2.8rem); animation: lp-wobble 2.4s ease-in-out infinite; }
@keyframes lp-wobble { 0%, 70%, 100% { transform: rotate(0); } 78% { transform: rotate(-9deg) scale(1.08); } 86% { transform: rotate(8deg) scale(1.08); } }
.lp-promo-txt { flex: 1; min-width: 0; display: grid; gap: 0.1rem; }
.lp-promo-txt small { font: 800 clamp(0.56rem, 2.6cqw, 0.7rem)/1.1 var(--font-display); letter-spacing: 0.08em; text-transform: uppercase; color: var(--cyan); }
.lp-promo-txt b { font: 900 clamp(1rem, 5.4cqw, 1.35rem)/1 var(--font-display); text-shadow: 0 0.12rem 0 var(--ink); }
.lp-promo-txt em { font-style: normal; color: var(--amber); text-shadow: 0 0.12rem 0 var(--ink), 0 0 0.8rem #ffb22e88; }
.lp-promo-go { flex: none; width: 2.1rem; height: 2.1rem; border-radius: 50%; display: grid; place-items: center; font: 900 1.5rem/1 var(--font-display); color: #2a1400;
  background: linear-gradient(180deg, #ffe7a8, var(--amber) 50%, var(--amber-deep)); border: 2px solid var(--ink); }
@container (min-width: 760px) { .lp-stagewrap { grid-column: 1; grid-row: 1 / -1; } }

/* AIBIO-style explainer on the stage: robot value → works 24/7 → est. daily */
.lp-flow { position: absolute; left: 0.5rem; right: 0.5rem; bottom: 2.4rem; z-index: 2; display: grid; grid-template-columns: auto minmax(0,1fr) auto minmax(0,1fr) auto; align-items: center; gap: 0.1rem; pointer-events: none; }
.lp-flow-in, .lp-flow-out { pointer-events: auto; display: grid; justify-items: center; gap: 0.1rem; padding: 0.3rem 0.4rem; border-radius: 0.7rem; border: 2px solid var(--ink); background: #070b18e0; }
.lp-flow-in { cursor: pointer; color: var(--text); box-shadow: inset 0 0 0 1.5px #2ee6ff99; font-family: var(--font-body); }
.lp-flow-out { box-shadow: inset 0 0 0 1.5px #45e07a99, 0 0 0.9rem #45e07a33; }
.lp-flow small { font: 800 0.56rem/1 var(--font-display); letter-spacing: 0.08em; text-transform: uppercase; color: var(--cyan); }
.lp-flow-out small { color: var(--green); }
.lp-flow-in span { display: flex; align-items: center; gap: 0.25rem; }
.lp-flow-in b { font: 900 clamp(0.9rem, 4.6cqw, 1.2rem)/1 var(--font-display); }
.lp-flow-out b { font: 900 clamp(0.75rem, 4cqw, 1.1rem)/1 var(--font-display); color: var(--green); text-shadow: 0 0 0.7rem #45e07a77; white-space: nowrap; }
.lp-flow-out em { font-style: normal; font-size: 0.6rem; color: var(--amber); white-space: nowrap; }
.lp-flow-mid { justify-self: center; position: relative; display: grid; justify-items: center; }
.lp-flow-mid small { color: #06101e; background: var(--cyan); font-size: clamp(0.5rem, 2.4cqw, 0.62rem); padding: 0.25rem 0.45rem; border-radius: 1rem; border: 2px solid var(--ink); white-space: nowrap; box-shadow: 0 0 0.8rem #2ee6ffaa; }
.lp-flow-up { position: absolute; bottom: 100%; left: 50%; width: 0; height: clamp(1.6rem, 9cqw, 2.6rem); border-left: 2px dashed var(--cyan); transform: translateX(-50%) rotate(28deg); transform-origin: bottom; }
.lp-flow-up::after { content: ""; position: absolute; top: -0.2rem; left: -0.4rem; width: 0.55rem; height: 0.55rem; border-top: 2.5px solid var(--cyan); border-left: 2.5px solid var(--cyan); transform: rotate(45deg); animation: lp-poke 1s ease-in-out infinite; }
@keyframes lp-poke { 50% { translate: 0 -0.25rem; } }
.lp-flow-arrow { display: flex; justify-content: center; gap: 0.05rem; overflow: hidden; }
.lp-flow-arrow i:nth-child(3) { display: none; }
.lp-flow-arrow i { width: 0.42rem; height: 0.42rem; border-top: 3px solid var(--cyan); border-right: 3px solid var(--cyan); transform: rotate(45deg); opacity: .3; filter: drop-shadow(0 0 3px var(--cyan)); animation: lp-flow 1.2s infinite; }
.lp-flow-arrow i:nth-child(2) { animation-delay: .2s; } .lp-flow-arrow i:nth-child(3) { animation-delay: .4s; }
@keyframes lp-flow { 40% { opacity: 1; } }
.lp-flow .is-bump { animation: lp-bump .35s ease-out; }
@keyframes lp-bump { 40% { transform: scale(1.15); } }

/* wallet strip: every coin the robot earns lands here as an incoming tx */
.lp-flow { bottom: 3.6rem; }
.lp-wallet { position: absolute; left: 0.5rem; right: 0.5rem; bottom: 0.45rem; z-index: 2; display: flex; align-items: center; gap: 0.4rem; padding: 0.3rem 0.4rem;
  border-radius: 0.8rem; border: 2px solid var(--ink); background: #070b18e6; box-shadow: inset 0 0 0 1.5px #ffb22e66; pointer-events: none; }
.lp-tx { flex: 1; min-width: 0; height: 1.7rem; display: flex; gap: 0.25rem; overflow: hidden; flex-direction: row; justify-content: flex-start;
  mask-image: linear-gradient(90deg, #000 70%, transparent); -webkit-mask-image: linear-gradient(90deg, #000 70%, transparent); }
.lp-tx span { flex: none; display: inline-flex; align-items: center; gap: 0.2rem; padding: 0 0.4rem; border-radius: 1rem; font: 800 0.6rem/1 var(--font-display); color: #fff;
  background: var(--tc); border: 1.5px solid var(--ink); animation: lp-txin .45s cubic-bezier(.3,1.4,.5,1); }
@keyframes lp-txin { from { transform: translateX(-1.2rem) scale(.6); opacity: 0; } }
.lp-wal { flex: none; display: flex; align-items: center; gap: 0.3rem; }
.lp-wal small { display: block; font: 800 0.5rem/1 var(--font-display); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.lp-wal b { display: block; font: 800 clamp(0.62rem, 3cqw, 0.75rem)/1.2 var(--font-display); color: var(--green); white-space: nowrap; }
.lp-wal.is-hit svg { animation: lp-bump .35s ease-out; }

/* PNL: every winning trade floats a +x.xx% pill up from the flow row */
.lp-pnl { position: absolute; left: 0; right: 0; bottom: 6.6rem; height: 0; z-index: 3; pointer-events: none; }
.lp-pnl span { position: absolute; bottom: 0; transform: translateX(-50%); font: 900 clamp(0.72rem, 3.6cqw, 0.95rem)/1 var(--font-display); color: #04140a;
  padding: 0.25rem 0.5rem; border-radius: 1rem; background: linear-gradient(180deg, #8bffb0, var(--green)); border: 2px solid var(--ink);
  box-shadow: 0 0 0.9rem #45e07a99; white-space: nowrap; animation: lp-pnl 1.9s cubic-bezier(.2,.8,.3,1) forwards; }
.lp-pnl span::before { content: "▲ "; font-size: .75em; }
@keyframes lp-pnl { 0% { transform: translate(-50%, 0.6rem) scale(.5); opacity: 0; } 15% { transform: translate(-50%, 0) scale(1.1); opacity: 1; } 30% { transform: translate(-50%, -0.3rem) scale(1); } 80% { opacity: 1; } 100% { transform: translate(-50%, -3.2rem) scale(.95); opacity: 0; } }
.lp-flow-mid small b { color: #04501f; }

.lp-flow-in b { color: var(--cyan); }
.lp-wal b { color: var(--amber); font-size: clamp(0.75rem, 3.6cqw, 0.95rem); }
.lp-tx span.is-wd { --tc: linear-gradient(180deg, #ffe7a8, var(--amber)); color: #2a1400; box-shadow: 0 0 0.8rem #ffb22eaa; }

.lp-in { flex: none; font: 900 0.5rem/1.1 var(--font-display); letter-spacing: .08em; text-transform: uppercase; color: var(--green); text-align: center;
  padding: 0.2rem 0.3rem; border-radius: 0.4rem; border: 1.5px solid #45e07a88; background: #45e07a1a; }
.lp-wal { padding: 0.2rem 0.45rem 0.2rem 0.25rem; border-radius: 0.6rem; border: 2px solid var(--ink);
  background: linear-gradient(180deg, #3a2608, #1a1204); box-shadow: inset 0 0 0 1.5px var(--amber), 0 0 0.8rem #ffb22e55; }
.lp-wal-ok { width: 1.5rem; height: 1.5rem; border-radius: 50%; display: grid; place-items: center; font: 900 0.9rem/1 var(--font-body); color: #04140a;
  background: radial-gradient(circle at 35% 30%, #c8ffd8, var(--green)); border: 2px solid var(--ink); box-shadow: 0 0 0.6rem #45e07aaa; }
.lp-wal small { color: var(--amber); font-size: 0.46rem; }
.lp-wal b { color: #fff; text-shadow: 0 0 0.6rem #ffb22eaa; }
.lp-wal.is-hit .lp-wal-ok { animation: lp-bump .35s ease-out; }

.lp-tx span i { flex: none; width: 1.05rem; height: 1.05rem; border-radius: 50%; display: grid; place-items: center; font: 900 0.62rem/1 var(--font-body); font-style: normal;
  color: var(--tc); background: #fff; border: 1.5px solid var(--ink); }

/* welcome = Olymp/Pocket pattern: conditions strip, ONE primary CTA, doubt-remover microcopy (research: docs/REPORT-2026-10-23-ROBOMINER-LANDING.md) */
.lp-terms { list-style: none; margin: 0; padding: 0; width: 100%; max-width: 30rem; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.4rem; }
.lp-terms li { display: grid; justify-items: center; gap: 0.1rem; padding: 0.45rem 0.2rem; border-radius: 0.7rem; border: 2px solid var(--ink);
  background: linear-gradient(160deg, var(--steel-2), var(--steel-3)); box-shadow: inset 0 0 0 1px #2ee6ff40; }
.lp-terms li:first-child { box-shadow: inset 0 0 0 2px var(--amber), 0 0 0.8rem #ffb22e44; }
.lp-terms b { font: 900 clamp(0.95rem, 2.6cqh, 1.25rem)/1 var(--font-display); }
.lp-terms li:first-child b { color: var(--amber); }
.lp-terms small { font-size: 0.66rem; color: var(--muted); }
.lp-main { max-width: 30rem; min-height: clamp(3rem, 7.5cqh, 3.6rem); font-size: clamp(0.9rem, 4.4cqw, 1.1rem); }
.lp-micro { margin: -0.2rem 0 0; font-size: 0.72rem; color: var(--green); }
.lp-tglink { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.78rem; color: #6cc4ff; text-decoration: none; }
.lp-main-t { display: grid; gap: 0.2rem; justify-items: center; }
.lp-main-t small { font: 800 0.66rem/1 var(--font-display); letter-spacing: 0.1em; color: #5a2a00; }

/* headline = exactly 2 lines, each shrinks to fit its width (never wraps) */
.lp-h1 { width: 100%; display: grid; gap: 0.1em; }
.lp-h1 span { display: block; white-space: nowrap; }
.lp-one > *, .lp-panel, .lp-view { min-width: 0; }
.lp-h1 { overflow: hidden; }

/* smoother motion pass */
.lp-flow-out b, .lp-flow-out .lp-mo { font: 900 clamp(0.75rem, 4cqw, 1.05rem)/1.05 var(--font-display); color: var(--green); text-shadow: 0 0 0.7rem #45e07a77; white-space: nowrap; font-variant-numeric: tabular-nums; }
.lp-flow-out .lp-mo { color: var(--amber); text-shadow: 0 0 0.7rem #ffb22e77; }
.lp-flow-out.is-shake { animation: lp-shake .5s cubic-bezier(.36,.07,.19,.97); }
@keyframes lp-shake { 15% { transform: translateX(-3px) rotate(-1.5deg) scale(1.06); } 35% { transform: translateX(3px) rotate(1.5deg) scale(1.06); } 55% { transform: translateX(-2px) rotate(-.8deg) scale(1.03); } 75% { transform: translateX(1px); } 100% { transform: none; } }
.lp-flow-in b.is-in { animation: lp-slidein .55s cubic-bezier(.22,1.2,.36,1); }
@keyframes lp-slidein { from { transform: translateY(0.5rem); opacity: 0; filter: blur(2px); } }
.lp-flow .is-bump { animation: none; }
.lp-pnl span { animation: lp-pnl2 2.4s cubic-bezier(.16,1,.3,1) forwards; }
@keyframes lp-pnl2 { 0% { transform: translate(-50%, 0.8rem) scale(.6); opacity: 0; } 18% { transform: translate(-50%, 0) scale(1.04); opacity: 1; } 28% { transform: translate(-50%, -0.1rem) scale(1); } 75% { opacity: 1; } 100% { transform: translate(-50%, -2.6rem) scale(.96); opacity: 0; } }
.lp-tx span { animation: lp-txin2 .7s cubic-bezier(.16,1,.3,1); }
@keyframes lp-txin2 { from { transform: translateX(-1.4rem) scale(.8); opacity: 0; } }
.lp-tx { transition: none; }
.lp-flow-arrow i { animation-duration: 1.6s; animation-timing-function: ease-in-out; }
.lp-wal.is-hit .lp-wal-ok { animation: lp-pop2 .6s cubic-bezier(.34,1.56,.64,1); }
@keyframes lp-pop2 { 40% { transform: scale(1.25); } }
@media (prefers-reduced-motion: reduce) { .lp-flow-out.is-shake { animation: none; } }
.lp-lead-hl b { color: var(--cyan); font-weight: 800; }
.lp-lead-hl b.is-g { color: var(--green); text-shadow: 0 0 0.6rem #45e07a66; }
.lp-lead-hl b.is-a { color: var(--amber); text-shadow: 0 0 0.6rem #ffb22e66; }

/* owner ainer-mining #48: the landing in the game's own art — the lab as generator sprites (scene-pixel.js); headlines,
   buttons, big numbers in Jersey 15 (a little pixel, #50), small labels in Chakra Petch */
/* owner #50: Jersey 15 (OFL, self-hosted latin) sized up to read as big as Chakra Petch */
@font-face { font-family: "Ainer Display"; src: url(fonts/jersey15-latin.woff2) format("woff2"); font-display: swap; size-adjust: 128%; }
:root { --font-display: "Ainer Display", "Chakra Petch", sans-serif; } /* owner #50: a little pixel, still readable */
.rm-h1, .rm-h2, .ob-t, .rm-btn, .lp-logo, .lp-terms b, .lp-flow b, .lp-promo b { font-family: var(--font-display); font-weight: 400; letter-spacing: 0.03em; }
.rm-kicker, .rm-tag, .rm-tab, .lp-in, .lp-wal small, .lp-flow-mid small, .lp-micro, .lp-terms small, .lp-flow small, .lp-promo small, .gm-prog, .gm-acts button { font-family: var(--font-body); font-weight: 700; }
.lp-logo-av { width: 36px; height: 36px; border-radius: 0.5rem; border: 2px solid var(--line, #39405a); image-rendering: pixelated;
  background: url(art/avatar-commander.png) 0 0 / 400% 100% no-repeat, radial-gradient(circle at 50% 40%, #4aa8ff66, #1a1e2b 70%);
  animation: px-run 0.4s steps(4) infinite; }
@media (prefers-reduced-motion: reduce) { .px-spr, .lp-logo-av { animation: none; } }
/* step 2i (owner #52): rowed sheets (3 rows: work / boost / win); fast-forward = boost, a coin = win */
/* owner #60: the headline says Bitcoin — "BITCOIN" in the BTC orange with the ₿ mark, the game line, "With real economy" */
.lp-h1 .lp-btc { font-size: 1.45em; line-height: 1; color: #f7931a; text-shadow: 0 0.15rem 0 #0b0d1a, 0 0 1rem #f7931a66; display: flex; align-items: center; justify-content: center; gap: 0.25em; }
.lp-btcmark { width: 0.85em; height: 0.85em; flex: none; background: url(btc.svg) center / contain no-repeat; }
.lp-h1 .lp-real { font-size: 0.55em; color: var(--amber); letter-spacing: 0.08em; text-transform: uppercase; }
/* owner #61: tight chips show the ₿ mark instead of the word BTC so the number stays whole */
.btcv { display: inline-flex; align-items: center; gap: 0.2em; white-space: nowrap; }
.btcv::before { content: ""; width: 0.9em; height: 0.9em; flex: none; background: url(btc.svg) center / contain no-repeat; }
.lp-flow-in b { font-size: clamp(0.78rem, 3.7cqw, 1.05rem); }
.lp-wal b { font-size: clamp(0.68rem, 3.1cqw, 0.88rem); }

/* owner #63: the hero = our robot at the PC; holo panels (neon frame + crisp chart, slow float), the screen glow, +BTC / +AIN */
/* owner #64: total mined (the real claim sum) + the live strip of the latest claims */
.lp-total { margin: 0; display: inline-flex; align-items: center; gap: 0.35rem; justify-content: center; padding: 0.3rem 0.7rem; border-radius: 0.6rem;
  background: #0a1226; border: 1.5px solid #f7931a66; font-size: 0.8rem; }
.lp-total[hidden] { display: none; }
.lp-total small { color: var(--muted); font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.68rem; }
.lp-total b { font: 400 1.05rem var(--font-display); color: #ffc94a; }
.lp-total .lp-btcmark { width: 1rem; height: 1rem; }
/* #65: the strip lives in the Profit in bar (.lp-tx.is-real) */
.lp-tx.is-real { align-items: center; -webkit-mask: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.lp-tx.is-real .lp-strip-in { display: flex; gap: 0.35rem; }
.lp-tx.is-real .lp-chip { animation: none; background: #11131c; padding: 0.1rem 0.45rem; }
.lp-strip-in { display: flex; gap: 0.5rem; width: max-content; animation: lp-marquee 28s linear infinite; }
@keyframes lp-marquee { to { transform: translateX(-50%); } }
.lp-chip { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.15rem 0.55rem; border-radius: 2rem; background: #11131c; border: 1px solid #39405a; white-space: nowrap; font-size: 0.72rem; }
.lp-chip .lp-btcmark { width: 0.85rem; height: 0.85rem; }
.lp-chip b { font: 400 0.85rem var(--font-display); color: #ffc94a; }
.lp-chip small { color: var(--muted); }
@media (prefers-reduced-motion: reduce) { .lp-strip-in { animation: none; } }
.lp-terms li.is-total b { color: #ffc94a; font-size: 0.86em; }
.lp-tx.is-real > .lp-strip-in { background: none; border: 0; padding: 0; border-radius: 0; animation: lp-marquee 24s linear infinite; }
.lp-tx.is-real .lp-chip { border: 1px solid #f7931a66; font: 700 0.62rem/1 var(--font-body); color: var(--muted); }
.lp-tx.is-real .lp-chip b { font-size: 0.78rem; }