/* ============================================================
   chromo.network — dashboard (strict black & white, teresa mechanics)
   DM Sans (UI) + IBM Plex Mono (numbers/data)
   ============================================================ */

@font-face { font-family:'DM Sans'; src:url('../fonts/dm-sans-400.woff2') format('woff2'); font-weight:400; font-display:swap; }
@font-face { font-family:'DM Sans'; src:url('../fonts/dm-sans-500.woff2') format('woff2'); font-weight:500; font-display:swap; }
@font-face { font-family:'DM Sans'; src:url('../fonts/dm-sans-600.woff2') format('woff2'); font-weight:600; font-display:swap; }
@font-face { font-family:'DM Sans'; src:url('../fonts/dm-sans-700.woff2') format('woff2'); font-weight:700; font-display:swap; }
@font-face { font-family:'IBM Plex Mono'; src:url('../fonts/ibm-plex-mono-400.woff2') format('woff2'); font-weight:400; font-display:swap; }
@font-face { font-family:'IBM Plex Mono'; src:url('../fonts/ibm-plex-mono-500.woff2') format('woff2'); font-weight:500; font-display:swap; }

:root{
  --bg:#f4f4f6;
  --bg2:#ececee;
  --surface:#ffffff;
  --surface-hi:#f6f6f8;
  --hair:#e5e5e9;
  --hair-strong:#d3d3d9;
  --t1:#0a0b0d;
  --t2:#5c5d63;
  --t3:#8c8d93;
  --white:#0a0b0d;
  --ink:#ffffff;
  --r-card:16px;
  --r-ctl:9px;
  --r-chip:7px;
  --r-pill:999px;
  --sans:'DM Sans',system-ui,-apple-system,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --ease:cubic-bezier(.22,.61,.36,1);
  --spring:cubic-bezier(.34,1.56,.64,1);
  --rail:250px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);color:var(--t1);
  background:var(--bg2);font-size:14.5px;line-height:1.5;
  -webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:hidden;
}
body::before{
  content:"";position:fixed;inset:0;z-index:-2;
  background:
    radial-gradient(120% 75% at 50% -18%, rgba(255,255,255,.9) 0%, transparent 55%),
    linear-gradient(180deg,#f7f7f9 0%, var(--bg2) 58%);
}
body::after{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;background:none;border:0;color:inherit}
input{font:inherit}
.mono,.num{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
:focus-visible{outline:2px solid var(--white);outline-offset:2px;border-radius:6px}
::selection{background:rgba(10,11,13,.14)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:rgba(10,11,13,.16);border-radius:99px;border:2px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:rgba(10,11,13,.28);background-clip:padding-box}

kbd{font-family:var(--mono);font-size:11px;padding:2px 6px;border-radius:5px;background:var(--surface-hi);border:1px solid var(--hair);color:var(--t2);line-height:1}

/* ---------------- shell ---------------- */
.app{display:grid;grid-template-columns:var(--rail) 1fr;min-height:100vh}

/* rail */
.rail{
  position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:6px;
  padding:22px 16px;border-right:1px solid var(--hair);
  background:rgba(244,244,246,.72);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);
}
.rail-brand{display:flex;align-items:center;gap:13px;padding:6px 8px 20px}
.rail-brand .mark{position:relative;width:42px;height:42px;flex-shrink:0;display:grid;place-items:center}
.rail-brand .mark img{width:30px;height:30px;border-radius:50%;object-fit:contain;padding:5px;background:#fff;box-shadow:0 0 0 1px var(--hair),0 4px 14px rgba(10,11,13,.1);animation:markPulse 3.4s ease-in-out infinite}
.rail-brand .mark .orbit{position:absolute;border-radius:50%;border:1px dashed rgba(10,11,13,.24);pointer-events:none}
.rail-brand .mark .o1{inset:0;animation:spin 9s linear infinite}
.rail-brand .mark .o2{inset:5px;border-color:rgba(10,11,13,.12);animation:spin 14s linear infinite reverse}
@keyframes markPulse{0%,100%{filter:drop-shadow(0 0 8px rgba(255,255,255,.28))}50%{filter:drop-shadow(0 0 16px rgba(255,255,255,.55))}}
.rail-brand b{font-weight:700;letter-spacing:-.02em;font-size:16px}
.rail-brand b span{color:var(--t3);font-weight:400}
.rail-nav{display:flex;flex-direction:column;gap:2px}
.rail-nav a{
  display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:var(--r-ctl);
  color:var(--t2);font-weight:500;font-size:14px;position:relative;
  transition:background .2s var(--ease),color .2s;
}
.rail-nav a svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.8;flex-shrink:0}
.rail-nav a:hover{background:var(--surface);color:var(--t1)}
.rail-nav a.active{background:var(--surface-hi);color:var(--white)}
.rail-nav a.active::before{content:"";position:absolute;left:-16px;top:50%;transform:translateY(-50%);width:3px;height:18px;border-radius:0 3px 3px 0;background:var(--white)}
.rail-foot{margin-top:auto;padding:12px 10px 0;border-top:1px solid var(--hair);display:flex;flex-direction:column;gap:12px}
.rail-foot .epoch-mini{font-size:11px;color:var(--t3);letter-spacing:.04em;text-transform:uppercase}
.rail-foot .epoch-mini b{display:block;color:var(--t1);font-size:15px;margin-top:4px;font-family:var(--mono)}
.rail-k{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;border-radius:var(--r-ctl);border:1px solid var(--hair);background:var(--surface);font-size:12.5px;color:var(--t2);cursor:pointer;transition:border-color .2s,background .2s}
.rail-k:hover{border-color:var(--hair-strong);background:var(--surface-hi)}

/* main */
.main{min-width:0;display:flex;flex-direction:column}
.topbar{
  position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px clamp(18px,3vw,32px);border-bottom:1px solid var(--hair);
  background:rgba(236,236,238,.72);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);
}
.topbar h1{font-size:17px;font-weight:600;letter-spacing:-.02em}
.topbar h1 span{color:var(--t3);font-weight:400;margin-left:8px;font-size:13px;font-family:var(--mono)}
.topbar-right{display:flex;align-items:center;gap:10px}
.topbar-x{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;color:var(--t2);border:1px solid var(--hair);background:var(--surface);transition:transform .18s var(--spring),color .2s,background .2s,border-color .2s}
.topbar-x svg{width:14px;height:14px}
.topbar-x:hover{color:var(--ink);background:var(--white);border-color:var(--white);transform:translateY(-1px)}

.kbtn{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:var(--r-ctl);border:1px solid var(--hair);background:var(--surface);color:var(--t2);font-size:13px;transition:border-color .2s,color .2s,background .2s,transform .18s var(--spring)}
.kbtn:hover{border-color:var(--hair-strong);color:var(--t1);transform:translateY(-1px)}
.demochip{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:var(--r-pill);border:1px dashed var(--hair-strong);color:var(--t3);font-size:11.5px;font-weight:600;letter-spacing:.04em}
.demochip .dot{width:6px;height:6px;border-radius:50%;background:var(--t2);animation:pulse 1.6s ease-in-out infinite}

.wallet{display:inline-flex;align-items:center;gap:9px;padding:8px 13px;border-radius:var(--r-pill);border:1px solid var(--hair-strong);background:var(--surface);font-size:13.5px;font-weight:500;transition:border-color .2s,background .2s,transform .15s var(--ease)}
.wallet:hover{background:var(--surface-hi)}
.wallet:active{transform:scale(.97)}
.wallet .dot{width:8px;height:8px;border-radius:50%;background:var(--white)}
.wallet.ghost{color:var(--ink);background:var(--white);border-color:var(--white)}
.wallet.ghost .dot{background:var(--ink)}
.wallet .addr{font-family:var(--mono);color:var(--t2)}
.verify-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:var(--r-pill);font-size:12px;font-weight:600;letter-spacing:.02em}
.verify-badge svg{width:13px;height:13px}
.verify-badge.ok{background:var(--white);color:var(--ink)}
.verify-badge.no{background:transparent;color:var(--t2);border:1px solid var(--hair-strong)}

/* ---------- live ticker tape ---------- */
.ticker{
  position:sticky;top:57px;z-index:15;overflow:hidden;
  border-bottom:1px solid var(--hair);
  background:rgba(236,236,238,.8);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  height:38px;display:flex;align-items:center;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);
}
.ticker-track{display:inline-flex;align-items:center;white-space:nowrap;will-change:transform;animation:tick 42s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
@keyframes tick{to{transform:translateX(-50%)}}
.tk{display:inline-flex;align-items:center;gap:9px;padding:0 20px;font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:var(--t2);text-transform:uppercase}
.tk b{color:var(--t1);font-weight:500}
.tk .up{color:var(--t1)}
.tk::after{content:"";width:3px;height:3px;border-radius:50%;background:var(--t3);margin-left:20px}
.tk img{width:14px;height:14px;filter:grayscale(1);opacity:.7}
.tk .blip{width:6px;height:6px;border-radius:50%;background:#0a0b0d;box-shadow:0 0 7px rgba(10,11,13,.5);animation:pulse 1.5s ease-in-out infinite}

.content{padding:clamp(16px,2.6vw,28px);max-width:1280px;width:100%}
.section{scroll-margin-top:80px;margin-bottom:30px}
.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:14px}
.section-head h2{font-size:14.5px;font-weight:600;letter-spacing:.01em}
.section-head .hint{font-size:12.5px;color:var(--t3)}

[data-rise]{opacity:0;transform:translateY(12px);transition:opacity .55s var(--ease),transform .55s var(--ease);transition-delay:var(--d,0s)}
[data-rise].in{opacity:1;transform:none}

/* ---------------- glass card ---------------- */
.card{
  background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-card);padding:18px;position:relative;
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  transition:border-color .25s,background .25s,transform .25s var(--ease),box-shadow .25s;
}
.card:hover{border-color:var(--hair-strong)}
.card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
/* cursor-follow white glow */
.card::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(320px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.08),transparent 60%)}
.card:hover::before{opacity:1}

/* ---------------- draggable board ---------------- */
.board{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;grid-auto-flow:dense}
.tile{position:relative;cursor:default}
.tile .grip{
  position:absolute;top:12px;right:12px;width:22px;height:22px;border-radius:6px;
  display:grid;place-items:center;color:var(--t3);opacity:0;cursor:grab;
  transition:opacity .2s,background .2s,color .2s;
}
.tile:hover .grip{opacity:1}
.tile .grip:hover{background:var(--surface-hi);color:var(--t1)}
.tile .grip svg{width:14px;height:14px}
.tile.dragging{opacity:.35}
.tile.drag-ghost{position:fixed;z-index:90;pointer-events:none;box-shadow:0 24px 60px rgba(0,0,0,.6);transform:scale(1.02);cursor:grabbing;border-color:var(--hair-strong)}
.tile.drop-target{outline:2px dashed var(--hair-strong);outline-offset:2px}
.tile.w1{grid-column:span 1}
.tile.w2{grid-column:span 2}
.tile.w4{grid-column:span 4}

/* KPI */
.kpi{display:flex;flex-direction:column;gap:8px;min-height:116px}
.kpi .lbl{font-size:11px;color:var(--t3);letter-spacing:.06em;text-transform:uppercase;display:flex;align-items:center;gap:7px}
.kpi .lbl svg{width:14px;height:14px;stroke:var(--t3);fill:none;stroke-width:1.8}
.kpi .val{font-family:var(--mono);font-size:29px;font-weight:500;letter-spacing:-.03em;line-height:1;margin-top:2px}
.kpi .val small{font-size:14px;color:var(--t2);margin-left:4px}
.kpi .sub{font-size:12.5px;color:var(--t2);margin-top:auto;display:flex;align-items:center;gap:6px}
.delta{font-family:var(--mono);font-size:12px;display:inline-flex;align-items:center;gap:3px}
.delta.up::before{content:"▲";font-size:8px}
.delta.down{color:var(--t3)}
.delta.down::before{content:"▼";font-size:8px}
.spark{margin-top:auto;height:32px}
.spark canvas{width:100%;height:100%;display:block}

/* pills */
.pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:var(--r-pill);font-size:11.5px;font-weight:600;letter-spacing:.02em;white-space:nowrap}
.pill.solid{background:var(--white);color:var(--ink)}
.pill.ghost{border:1px solid var(--hair-strong);color:var(--t2)}
.pill.dim{background:var(--surface-hi);color:var(--t3)}
.pill .dot{width:6px;height:6px;border-radius:50%;background:currentColor}
.pill.live .dot{animation:pulse 1.5s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}

/* chart widget */
.chart-wrap{display:flex;flex-direction:column;gap:12px}
.chart-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.chart-head .big{font-family:var(--mono);font-size:26px;font-weight:500;letter-spacing:-.03em}
.chart-head .rng{display:flex;gap:2px}
.chart-head .rng button{padding:5px 10px;border-radius:var(--r-chip);font-size:11.5px;color:var(--t3);font-family:var(--mono);transition:background .2s,color .2s}
.chart-head .rng button.on{background:var(--surface-hi);color:var(--white)}
.chart-box{position:relative;height:190px}
.chart-box canvas{width:100%;height:100%;display:block}
.chart-tip{position:absolute;pointer-events:none;padding:6px 9px;border-radius:7px;background:var(--white);color:var(--ink);font-family:var(--mono);font-size:12px;font-weight:500;transform:translate(-50%,-130%);opacity:0;transition:opacity .12s;white-space:nowrap;box-shadow:0 6px 20px rgba(0,0,0,.4)}
.chart-tip.show{opacity:1}

/* ladder */
/* Horizontal padding stays small on purpose: node `left:%` resolves against this
   element's padding box while the track lives in its content box, so widening the
   padding would slide every tick off the rail it marks. The end labels are pulled
   inward with edge-l/edge-r below instead. */
.ladder{position:relative;padding:34px 6px 40px}
/* The first and last ticks sit on the track's ends, so their centred labels used
   to hang half a word outside the card. Anchor those two inward instead. */
.ladder-node.edge-l .mx,.ladder-node.edge-l .bal{left:0;transform:none;text-align:left}
.ladder-node.edge-r .mx,.ladder-node.edge-r .bal{left:auto;right:0;transform:none;text-align:right}
.ladder-you.edge-l .tag{left:0;transform:none}
.ladder-you.edge-r .tag{left:auto;right:0;transform:none}
.ladder-track{position:relative;height:6px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}
.ladder-fill{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:99px;background:var(--white);transition:width 1.1s var(--ease)}
.ladder-node{position:absolute;top:50%;transform:translate(-50%,-50%);text-align:center}
.ladder-node .tick{width:11px;height:11px;border-radius:50%;background:var(--bg);border:2px solid rgba(255,255,255,.22);margin:0 auto;transition:border-color .4s var(--ease),background .4s var(--ease),box-shadow .4s;transition-delay:var(--ld,0s)}
.ladder-node.lit .tick{background:var(--white);border-color:var(--white);box-shadow:0 0 12px rgba(255,255,255,.6)}
.ladder-you .halo{animation:youPulse 2.2s ease-in-out infinite}
@keyframes youPulse{0%,100%{box-shadow:0 0 0 4px rgba(255,255,255,.14)}50%{box-shadow:0 0 0 7px rgba(255,255,255,.08),0 0 18px rgba(255,255,255,.4)}}
.ladder-node .mx{position:absolute;top:-30px;left:50%;transform:translateX(-50%);font-family:var(--mono);font-size:13px;color:var(--t2);white-space:nowrap}
.ladder-node.lit .mx{color:var(--white)}
.ladder-node .bal{position:absolute;top:20px;left:50%;transform:translateX(-50%);font-size:11px;color:var(--t3);white-space:nowrap}
.ladder-you{position:absolute;top:50%;transform:translate(-50%,-50%);z-index:3;transition:left 1.1s var(--ease)}
.ladder-you .halo{width:18px;height:18px;border-radius:50%;background:var(--white);box-shadow:0 0 0 4px rgba(255,255,255,.14)}
.ladder-you .tag{position:absolute;bottom:-32px;left:50%;transform:translateX(-50%);font-size:11px;font-weight:600;color:var(--ink);white-space:nowrap;background:var(--white);padding:3px 8px;border-radius:var(--r-chip)}
.ladder-cta{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 15px;border-radius:var(--r-ctl);background:var(--surface-hi);border:1px solid var(--hair)}
.ladder-cta .txt{font-size:13px;color:var(--t2)}
.ladder-cta .txt b{color:var(--t1);font-family:var(--mono)}

/* venues */
.venues{display:flex;flex-direction:column;gap:13px}
.venue{display:grid;grid-template-columns:128px 1fr 96px;align-items:center;gap:14px}
.venue .name{display:flex;align-items:center;gap:9px;font-size:13.5px;font-weight:500}
.venue .name img{width:18px;height:18px;object-fit:contain;filter:grayscale(1) brightness(1.6)}
.venue .bar{height:8px;border-radius:99px;background:rgba(255,255,255,.06);overflow:hidden}
.venue .bar i{display:block;height:100%;width:0;border-radius:99px;background:var(--white);transition:width 1s var(--ease)}
.venue .amt{font-family:var(--mono);font-size:13px;text-align:right;color:var(--t2)}
.venue .amt b{color:var(--t1)}

/* epoch */
.epoch-now{display:flex;flex-direction:column;gap:15px}
.count{display:flex;gap:9px}
.count .u{flex:1;text-align:center;padding:13px 6px;border-radius:var(--r-ctl);background:var(--surface-hi);border:1px solid var(--hair)}
.count .u b{display:block;font-family:var(--mono);font-size:25px;font-weight:500;letter-spacing:-.03em}
.count .u span{font-size:10px;color:var(--t3);letter-spacing:.08em;text-transform:uppercase}
.epoch-meta{display:flex;flex-direction:column;gap:9px}
.mrow{display:flex;align-items:center;justify-content:space-between;font-size:13.5px}
.mrow .k{color:var(--t2)}
.mrow .v{font-family:var(--mono)}

/* activity feed */
.feed{display:flex;flex-direction:column;gap:0;max-height:250px;overflow:hidden}
.fitem{display:flex;align-items:center;gap:11px;padding:11px 2px;border-top:1px solid var(--hair);font-size:13px}
.fitem:first-child{border-top:0}
.fitem.new{animation:slideIn .5s var(--ease)}
@keyframes slideIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.fitem .ic{width:26px;height:26px;border-radius:7px;flex-shrink:0;display:grid;place-items:center;background:var(--surface-hi);border:1px solid var(--hair)}
.fitem .ic svg{width:14px;height:14px;stroke:var(--t1);fill:none;stroke-width:1.8}
.fitem .tx{flex:1;min-width:0}
.fitem .tx b{font-weight:600}
.fitem .tx span{color:var(--t3);font-size:11.5px}
.fitem .amt{font-family:var(--mono);color:var(--t1);font-size:12.5px}

/* buttons */
.btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:9px 15px;border-radius:var(--r-ctl);font-weight:600;font-size:13px;border:1px solid transparent;white-space:nowrap;transition:transform .18s var(--spring),background .2s,border-color .2s,opacity .2s,color .2s,box-shadow .25s;isolation:isolate}
.btn:hover{transform:translateY(-1.5px)}
.btn:active{transform:translateY(0) scale(.97)}
.btn-white{background:var(--white);color:var(--ink)}
.btn-white:hover{box-shadow:0 8px 26px rgba(255,255,255,.22)}
.btn-ghost{border-color:var(--hair-strong);color:var(--t1);background:var(--surface)}
.btn-ghost:hover{border-color:var(--white);box-shadow:0 6px 22px rgba(0,0,0,.4)}
/* animated fill wipe from the left on ghost/dark buttons */
.btn-ghost::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--surface-hi);transform:translateX(-101%);transition:transform .35s var(--ease)}
.btn-ghost:hover::before{transform:translateX(0)}
/* diagonal shine sweep on white buttons */
.btn-white::after{content:"";position:absolute;top:-60%;bottom:-60%;left:-30%;width:36px;background:linear-gradient(100deg,transparent,rgba(255,255,255,.75),transparent);transform:skewX(-18deg);opacity:0;transition:none}
.btn-white:hover::after{animation:shine .7s var(--ease)}
@keyframes shine{0%{left:-30%;opacity:0}12%{opacity:.9}100%{left:130%;opacity:0}}
.btn:disabled{opacity:.45;cursor:default;transform:none;box-shadow:none}
.btn:disabled::before,.btn:disabled::after{display:none}
.btn-sm{padding:7px 12px;font-size:12.5px}

/* ------------- universal click ripple (monochrome) ------------- */
.ripple{position:absolute;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(255,255,255,.5),rgba(255,255,255,0) 70%);transform:translate(-50%,-50%) scale(0);animation:ripple .55s var(--ease) forwards;z-index:2;mix-blend-mode:overlay}
.btn-white .ripple{background:radial-gradient(circle,rgba(0,0,0,.28),rgba(0,0,0,0) 70%);mix-blend-mode:normal}
@keyframes ripple{to{transform:translate(-50%,-50%) scale(1);opacity:0}}

/* ------------- richer hover states everywhere ------------- */
.rail-nav a,.pill,.copy,.kbtn,.wallet,.rail-k,.chart-head .rng button,.tag,.venue,.mrow,.stat-strip .s,.rebate-row,.fitem{transition:all .22s var(--ease)}
.copy:hover{border-color:var(--white);background:var(--surface-hi);transform:translateY(-1px)}
.pill.solid:hover{box-shadow:0 4px 16px rgba(255,255,255,.25)}
.pill.ghost:hover{border-color:var(--white);color:var(--t1)}
.chart-head .rng button:hover{background:var(--surface);color:var(--t1)}
.venue:hover .bar i{filter:drop-shadow(0 0 6px rgba(255,255,255,.4))}
.venue:hover .name img{filter:grayscale(1) brightness(2.2)}
.stat-strip .s:hover{transform:translateY(-2px)}
.fitem:hover{background:var(--surface);border-radius:8px}

/* section header animated underline on hover */
.section-head h2{position:relative;cursor:default}
.section-head h2::after{content:"";position:absolute;left:0;bottom:-4px;width:100%;height:1px;background:var(--white);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.section-head:hover h2::after{transform:scaleX(1)}

/* KPI value pop when it changes */
.val.flash{animation:valFlash .4s var(--spring)}
@keyframes valFlash{0%{transform:scale(1)}45%{transform:scale(1.08);text-shadow:0 0 20px rgba(255,255,255,.5)}100%{transform:scale(1)}}

/* claim success pulse ring (spawned by JS) */
.pulse-ring{position:fixed;border-radius:50%;border:2px solid rgba(255,255,255,.8);pointer-events:none;z-index:95;transform:translate(-50%,-50%);animation:pulseRing .7s var(--ease) forwards}
@keyframes pulseRing{0%{width:8px;height:8px;opacity:.9}100%{width:200px;height:200px;opacity:0}}

/* card lift + 3D tilt (JS sets --rx/--ry) */
.card{transform-style:preserve-3d;will-change:transform}
.tile > .card,.card{transition:border-color .25s,background .25s,box-shadow .3s,transform .18s var(--ease)}
.card.tilt{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(-3px);box-shadow:0 20px 50px rgba(0,0,0,.4)}

/* ambient moving light behind everything */
body::before{animation:auroraDrift 26s ease-in-out infinite alternate}
@keyframes auroraDrift{0%{transform:translate(-2%,-1%) scale(1)}100%{transform:translate(3%,2%) scale(1.06)}}

/* two col */
.grid2{display:grid;grid-template-columns:1.3fr 1fr;gap:12px;align-items:start}
.grid2b{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}

/* rebates */
.rebates{display:flex;flex-direction:column}
.rebate-row{display:grid;grid-template-columns:88px 1fr 120px 82px 116px 112px;align-items:center;gap:12px;padding:14px 8px;border-top:1px solid var(--hair);transition:background .2s}
.rebate-row:first-child{border-top:0}
.rebate-row:hover{background:var(--surface)}
.rebate-row.head{border-top:0;padding-top:0;padding-bottom:11px;font-size:11px;color:var(--t3);letter-spacing:.06em;text-transform:uppercase}
.rebate-row .ep b{font-family:var(--mono)}
.rebate-row .ep small{display:block;color:var(--t3);font-size:11.5px;margin-top:2px}
.rebate-row .dates{color:var(--t2);font-size:12.5px}
.rebate-row .vol,.rebate-row .mx,.rebate-row .amt{font-family:var(--mono);text-align:right}
.rebate-row .amt b{color:var(--t1)}
.rebate-row .act{display:flex;justify-content:flex-end}

/* verify */
.verify{display:flex;flex-direction:column;gap:15px}
.verify .steps{display:flex;flex-direction:column;gap:12px}
.vstep{display:flex;gap:12px;align-items:flex-start}
.vstep .n{width:22px;height:22px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;font-size:11px;font-weight:700;background:var(--surface-hi);color:var(--t2);border:1px solid var(--hair)}
.vstep.done .n{background:var(--white);color:var(--ink);border-color:var(--white)}
.vstep .t{font-size:13.5px}
.vstep .t b{display:block;margin-bottom:2px}
.vstep .t span{color:var(--t2)}
.amount-box{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 15px;border-radius:var(--r-ctl);background:var(--surface-hi);border:1px dashed var(--hair-strong)}
.amount-box .a{font-family:var(--mono);font-size:20px}
.amount-box .c{font-size:12px;color:var(--t3)}
.copy{padding:8px 11px;border-radius:var(--r-ctl);border:1px solid var(--hair-strong);background:var(--surface);font-size:12.5px;display:inline-flex;gap:6px;align-items:center}
.copy svg{width:13px;height:13px}
.waiting{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--t2)}
.waiting .spin{width:15px;height:15px;border-radius:50%;border:2px solid rgba(255,255,255,.16);border-top-color:var(--white);animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* stat strip */
.stat-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.stat-strip .s{padding:15px 16px}
.stat-strip .s .l{font-size:11px;color:var(--t3);letter-spacing:.05em;text-transform:uppercase}
.stat-strip .s .v{font-family:var(--mono);font-size:22px;font-weight:500;margin-top:6px;letter-spacing:-.03em}

/* referral */
.ref{display:flex;flex-direction:column;gap:13px}
.ref .field{display:flex;gap:10px}
.ref input{flex:1;padding:11px 14px;border-radius:var(--r-ctl);background:var(--surface-hi);border:1px solid var(--hair-strong);color:var(--t1);font-family:var(--mono);font-size:13.5px}
.ref input:focus{outline:none;border-color:var(--white)}
.ref .hint{font-size:12.5px;color:var(--t3)}

/* ---------------- ⌘K command palette ---------------- */
.cmdk{position:fixed;inset:0;z-index:100;display:none;align-items:flex-start;justify-content:center;padding-top:14vh;background:rgba(0,0,0,.55);backdrop-filter:blur(4px)}
.cmdk.open{display:flex}
.cmdk-box{width:min(560px,92vw);background:#0e0f12;border:1px solid var(--hair-strong);border-radius:14px;overflow:hidden;box-shadow:0 30px 90px rgba(0,0,0,.7);animation:pop .18s var(--spring)}
@keyframes pop{from{opacity:0;transform:scale(.97) translateY(-6px)}to{opacity:1;transform:none}}
.cmdk-in{display:flex;align-items:center;gap:11px;padding:15px 18px;border-bottom:1px solid var(--hair)}
.cmdk-in svg{width:17px;height:17px;stroke:var(--t3);fill:none;stroke-width:2}
.cmdk-in input{flex:1;background:none;border:0;color:var(--t1);font-size:15.5px;outline:none}
.cmdk-in input::placeholder{color:var(--t3)}
.cmdk-list{max-height:340px;overflow-y:auto;padding:8px}
.cmdk-group{font-size:10.5px;color:var(--t3);letter-spacing:.08em;text-transform:uppercase;padding:10px 12px 6px}
.cmdk-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:9px;font-size:14px;cursor:pointer}
.cmdk-item .ic{width:22px;height:22px;display:grid;place-items:center;color:var(--t2)}
.cmdk-item .ic svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8}
.cmdk-item .lbl{flex:1}
.cmdk-item .sk{font-size:11px;color:var(--t3);font-family:var(--mono)}
.cmdk-item.sel{background:var(--surface-hi)}
.cmdk-item.sel .ic{color:var(--t1)}
.cmdk-empty{padding:24px;text-align:center;color:var(--t3);font-size:13.5px}

/* toast */
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);padding:12px 18px;border-radius:var(--r-pill);background:#111318;border:1px solid var(--hair-strong);font-size:13.5px;font-weight:500;display:flex;align-items:center;gap:9px;box-shadow:0 12px 40px rgba(0,0,0,.55);opacity:0;pointer-events:none;transition:opacity .3s,transform .3s var(--spring);z-index:110}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast svg{width:16px;height:16px;color:var(--white)}

/* mobile */
.menu-btn{display:none}
.scrim{display:none}
@media(max-width:1120px){ .board{grid-template-columns:repeat(2,1fr)} .tile.w2,.tile.w4{grid-column:span 2} .grid2,.grid2b{grid-template-columns:1fr} }
@media(max-width:860px){
  :root{--rail:0px}
  .app{grid-template-columns:1fr}
  .rail{position:fixed;left:0;top:0;bottom:0;width:260px;z-index:60;transform:translateX(-102%);transition:transform .35s var(--ease)}
  .rail.open{transform:none;box-shadow:0 0 60px rgba(0,0,0,.6)}
  .menu-btn{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:var(--r-ctl);border:1px solid var(--hair-strong);background:var(--surface)}
  .menu-btn svg{width:18px;height:18px;stroke:var(--t1);fill:none;stroke-width:1.8}
  .scrim{display:block;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:55;opacity:0;pointer-events:none;transition:opacity .3s}
  .scrim.show{opacity:1;pointer-events:auto}
  .kbtn{display:none}
  .tile .grip{display:none}
  .rebate-row{grid-template-columns:70px 1fr 100px;gap:10px}
  .rebate-row .dates,.rebate-row .mx{display:none}
  .rebate-row.head .dates,.rebate-row.head .mx{display:none}
  .stat-strip{grid-template-columns:1fr}
  .venue{grid-template-columns:104px 1fr 76px}
}
@media(max-width:560px){ .board{grid-template-columns:1fr} .tile.w2,.tile.w4{grid-column:span 1} .count .u b{font-size:21px} }

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001s!important;transition-duration:.001s!important}
  [data-rise]{opacity:1;transform:none}
  .ticker-track{animation:none}
  .rail-brand .mark .orbit,.rail-brand .mark img{animation:none}
  .card.tilt{transform:none}
  body::before{animation:none}
  .ripple,.pulse-ring{display:none}
  .btn:hover,.stat-strip .s:hover,.copy:hover,.kbtn:hover{transform:none}
}
@media(max-width:860px){ .ticker{top:53px} }

/* ============================================================
   STATUS BANNER · tour · tooltips · confetti · gating
   ============================================================ */

.status-banner{
  display:grid;grid-template-columns:1fr auto;gap:clamp(20px,3vw,44px);align-items:center;
  padding:clamp(22px,3vw,34px);border-radius:var(--r-card);
  background:linear-gradient(120deg,rgba(255,255,255,.07),rgba(255,255,255,.03));
  border:1px solid var(--hair-strong);position:relative;overflow:hidden;
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
}
.status-banner::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(600px circle at 12% -20%,rgba(255,255,255,.10),transparent 60%)}
.sb-left{position:relative;z-index:1;min-width:0}
.sb-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.14em;color:var(--t3);text-transform:uppercase;margin-bottom:12px}
.sb-dot{width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 8px #fff;animation:pulse 1.6s ease-in-out infinite}
.sb-title{font-size:clamp(22px,3vw,34px);font-weight:600;letter-spacing:-.03em;line-height:1.05}
.sb-sub{color:var(--t2);font-size:15px;margin-top:8px}
.sb-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.sb-chips .c{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:var(--r-pill);border:1px solid var(--hair);background:var(--surface);font-size:12px;color:var(--t2)}
.sb-chips .c b{color:var(--t1);font-weight:500}
.sb-chips .c svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2}
.sb-right{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-end;gap:6px;min-width:210px}
.sb-claim-lbl{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--t3)}
.sb-claim-amt{font-size:clamp(34px,4.6vw,52px);font-weight:600;letter-spacing:-.03em;line-height:1}
.sb-claim-amt span{font-size:.32em;color:var(--t3);margin-left:5px;letter-spacing:0}
.btn-lg{padding:13px 26px;font-size:15px;margin-top:6px}
.sb-pool{width:100%;margin-top:10px;text-align:right}
.sb-pool span{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--t3)}
.sb-pool-bar{height:6px;border-radius:99px;background:var(--surface-hi);overflow:hidden;margin-top:6px}
.sb-pool-bar i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,#8a8a90,#fff);transition:width 1.1s var(--ease)}
.status-banner.warn{border-color:rgba(255,255,255,.2)}

/* multiplier mini bar */
.mult-mini{height:5px;border-radius:99px;background:var(--surface-hi);overflow:hidden;margin:8px 0}
.mult-mini i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,#8a8a90,#fff);transition:width 1s var(--ease)}

/* tooltips */
.tip-btn{display:inline-grid;place-items:center;width:15px;height:15px;border-radius:50%;border:1px solid var(--hair-strong);background:var(--surface);color:var(--t3);font-size:9px;font-weight:700;margin-left:6px;line-height:1;cursor:help;transition:border-color .2s,color .2s,background .2s}
.tip-btn:hover{border-color:var(--white);color:var(--t1)}
.tip{position:fixed;z-index:120;max-width:260px;padding:10px 13px;border-radius:10px;background:#111318;border:1px solid var(--hair-strong);color:var(--t1);font-size:12.5px;line-height:1.5;box-shadow:0 14px 40px rgba(0,0,0,.55);opacity:0;transform:translateY(4px);pointer-events:none;transition:opacity .18s,transform .18s}
.tip.show{opacity:1;transform:none}

/* connect-gated widgets */
.tile.locked{position:relative}
.tile.locked .kpi > *:not(.lbl),.tile.locked .chart-wrap,.tile.locked .feed{filter:blur(5px);opacity:.5;pointer-events:none}
.tile.locked::after{content:"Connect wallet →";position:absolute;inset:0;display:grid;place-items:center;font-size:12.5px;font-weight:600;color:var(--t2);z-index:3;letter-spacing:.02em}

/* confetti */
#confetti{position:fixed;inset:0;z-index:105;pointer-events:none;display:none}
#confetti.on{display:block}

/* onboarding tour */
.tour{position:fixed;inset:0;z-index:130;display:none}
.tour.on{display:block}
.tour-spot{position:fixed;border-radius:16px;box-shadow:0 0 0 9999px rgba(0,0,0,.62);transition:all .4s var(--ease);pointer-events:none;border:1.5px solid rgba(255,255,255,.5)}
.tour-card{position:fixed;width:min(340px,90vw);background:#0e0f12;border:1px solid var(--hair-strong);border-radius:14px;padding:20px;box-shadow:0 24px 70px rgba(0,0,0,.6);transition:all .4s var(--ease)}
.tour-step{font-size:11px;color:var(--t3);letter-spacing:.1em;margin-bottom:8px}
.tour-title{font-size:17px;font-weight:600;letter-spacing:-.01em;margin-bottom:6px}
.tour-body{font-size:13.5px;color:var(--t2);line-height:1.55;margin-bottom:16px}
.tour-actions{display:flex;justify-content:space-between;gap:10px}

@media(max-width:820px){
  .status-banner{grid-template-columns:1fr}
  .sb-right{align-items:flex-start;min-width:0}
  .sb-pool{text-align:left}
}
@media (prefers-reduced-motion:reduce){
  .sb-dot{animation:none}
  .tour-spot,.tour-card{transition:none}
}

/* ============================================================
   LIGHT THEME PATCH — flip remaining dark literals to ink-on-paper
   (loaded last so it wins by source order; keyframes re-declared)
   ============================================================ */
.card{background:var(--surface);box-shadow:0 1px 2px rgba(10,11,13,.03),0 6px 20px rgba(10,11,13,.05)}
.card::after{box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
.card::before{background:radial-gradient(320px circle at var(--mx,50%) var(--my,50%),rgba(10,11,13,.05),transparent 60%)}
.tile.drag-ghost{box-shadow:0 24px 60px rgba(10,11,13,.22)}
.card.tilt{box-shadow:0 20px 50px rgba(10,11,13,.16)}

/* venue + ladder + bars */
.venue .name img{filter:grayscale(1) opacity(.72)}
.venue:hover .name img{filter:grayscale(1) opacity(1)}
.venue .bar{background:rgba(10,11,13,.07)}
.venue:hover .bar i{filter:drop-shadow(0 0 5px rgba(10,11,13,.3))}
.ladder-track{background:rgba(10,11,13,.09)}
.ladder-node .tick{border-color:rgba(10,11,13,.22)}
.ladder-node.lit .tick{box-shadow:0 0 10px rgba(10,11,13,.28)}
.ladder-you .halo{box-shadow:0 0 0 4px rgba(10,11,13,.12)}
@keyframes youPulse{0%,100%{box-shadow:0 0 0 4px rgba(10,11,13,.12)}50%{box-shadow:0 0 0 7px rgba(10,11,13,.07),0 0 16px rgba(10,11,13,.28)}}
@keyframes markPulse{0%,100%{box-shadow:0 0 0 1px var(--hair),0 4px 12px rgba(10,11,13,.08)}50%{box-shadow:0 0 0 1px var(--hair-strong),0 6px 18px rgba(10,11,13,.16)}}
@keyframes valFlash{0%{transform:scale(1)}45%{transform:scale(1.08);text-shadow:0 0 18px rgba(10,11,13,.28)}100%{transform:scale(1)}}

/* buttons + ripple (accent buttons are now black; light buttons ripple dark) */
.btn-white:hover{box-shadow:0 8px 26px rgba(10,11,13,.28)}
.btn-ghost:hover{box-shadow:0 6px 20px rgba(10,11,13,.12)}
.pill.solid:hover{box-shadow:0 4px 16px rgba(10,11,13,.22)}
.ripple{background:radial-gradient(circle,rgba(10,11,13,.35),rgba(10,11,13,0) 70%);mix-blend-mode:normal}
.btn-white .ripple,.pill.solid .ripple,.wallet:not(.ghost) .ripple{background:radial-gradient(circle,rgba(255,255,255,.55),rgba(255,255,255,0) 70%)}
.pulse-ring{border-color:rgba(10,11,13,.55)}
.waiting .spin{border-color:rgba(10,11,13,.14);border-top-color:var(--white)}

/* overlays: cmdk / toast / tip / tour — light cards, tooltips stay dark */
.cmdk-box{background:#fff;box-shadow:0 30px 90px rgba(10,11,13,.22)}
.toast{background:#fff;color:var(--t1);box-shadow:0 12px 40px rgba(10,11,13,.2)}
.tip{background:#0a0b0d;color:#f3f4f5;border-color:rgba(10,11,13,.2);box-shadow:0 14px 40px rgba(10,11,13,.25)}
.tour-spot{box-shadow:0 0 0 9999px rgba(10,11,13,.5);border-color:rgba(255,255,255,.9)}
.tour-card{background:#fff;box-shadow:0 24px 70px rgba(10,11,13,.28)}

/* status banner + mini bars */
.status-banner{background:linear-gradient(120deg,rgba(10,11,13,.05),rgba(10,11,13,.015))}
.status-banner::before{background:radial-gradient(600px circle at 12% -20%,rgba(10,11,13,.06),transparent 60%)}
.status-banner.warn{border-color:rgba(10,11,13,.18)}
.sb-dot{background:#0a0b0d;box-shadow:0 0 8px rgba(10,11,13,.5)}
.sb-pool-bar i{background:linear-gradient(90deg,#c9c9ce,#0a0b0d)}
.mult-mini i{background:linear-gradient(90deg,#c9c9ce,#0a0b0d)}

/* verify (0.001 USDC challenge) removed — FOMO attributes referrals, claim signature proves ownership */
#verify, #railNav a[href="#verify"], #verifyBadge { display: none !important; }

/* ===== leaderboard + flex card (real data only) ===== */
.lb{display:flex;flex-direction:column}
.lb-row{
  display:grid;grid-template-columns:34px 1fr auto auto;gap:14px;align-items:center;
  padding:11px 2px;border-bottom:1px solid var(--line);font-size:13px;
}
.lb-row:last-child{border-bottom:0}
.lb-row .rk{font-family:var(--mono);font-size:11px;color:var(--t3)}
.lb-row.me{background:var(--surface-hi);border-radius:8px;padding-left:8px;padding-right:8px}
.lb-row.me .who{font-weight:600}
.lb-row .who{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb-row .who small{color:var(--t3);font-family:var(--mono);font-size:11px;margin-left:7px}
.lb-row .vol{font-family:var(--mono);font-size:12px;color:var(--t2)}
.lb-row .earn{font-family:var(--mono);font-size:12px;font-weight:500}
.lb-empty{padding:18px 2px;color:var(--t3);font-size:13px}

.flexcard{display:flex;flex-direction:column;gap:16px}
.fc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.fc-cell{border:1px solid var(--line);border-radius:12px;padding:14px 15px;display:flex;flex-direction:column;gap:7px}
.fc-k{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--t3)}
.fc-v{font-size:22px;font-weight:600;letter-spacing:-.02em}
.fc-actions{display:flex;gap:10px}
@media(max-width:760px){ .fc-grid{grid-template-columns:repeat(2,1fr)} }

/* ===== wallet picker ===== */
.wpick{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:20px;
  background:rgba(10,11,13,.42);backdrop-filter:blur(6px)}
.wpick[hidden]{display:none}
.wpick-box{width:100%;max-width:380px;background:var(--surface);border:1px solid var(--line);
  border-radius:18px;padding:20px 20px 16px;box-shadow:0 24px 70px rgba(10,11,13,.22)}
.wpick-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.wpick-head h3{font-size:16px;font-weight:600;letter-spacing:-.01em}
.wpick-x{background:none;border:0;font-size:22px;line-height:1;color:var(--t3);cursor:pointer;padding:0 4px}
.wpick-x:hover{color:var(--t1)}
.wpick-list{display:flex;flex-direction:column;gap:8px}
.wpick-item{display:flex;align-items:center;gap:12px;width:100%;text-align:left;cursor:pointer;
  background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:13px 14px;
  font-size:14px;font-weight:500;color:var(--t1);transition:border-color .18s,background .18s}
.wpick-item:hover{border-color:var(--t1)}
.wpick-item img{width:22px;height:22px;border-radius:6px;flex:none}
.wpick-item .ph{width:22px;height:22px;border-radius:6px;flex:none;background:var(--surface-hi);
  display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:11px;color:var(--t3)}
.wpick-note{margin-top:14px;font-size:12px;color:var(--t3);line-height:1.55}
.wpick-empty{font-size:13px;color:var(--t3);padding:6px 2px 2px}

/* ---- mining (holder rewards) ---- */
.mine{display:grid;grid-template-columns:1.15fr .95fr auto;gap:28px;align-items:center}
.mine .kpi{min-height:0}
.mine-meta{display:flex;flex-direction:column;gap:9px;border-left:1px solid var(--hair);padding-left:28px}
.mine-meta .mrow{gap:14px}
.mine-meta .v{white-space:nowrap}
.mine-cta{display:flex;flex-direction:column;align-items:flex-end;gap:9px;text-align:right}
.mine-hint{font-size:12px;color:var(--t3);max-width:220px;line-height:1.45}
@media (max-width:980px){
  .mine{grid-template-columns:1fr;gap:18px}
  .mine-meta{border-left:0;padding-left:0}
  .mine-cta{align-items:flex-start;text-align:left}
}