/* profile.css: one account or one dev wallet, in full. Sits on top of site.css (its tokens, nav, buttons, footer). */
body{padding-top:var(--nav)}
.pro-head{position:relative;overflow:hidden;color:#fff;background:linear-gradient(180deg,var(--studio-top) 0%,var(--studio-mid) 60%,#8d9ceb 100%)}
.pro-head::before{content:"";position:absolute;inset:0;background:radial-gradient(58% 60% at 60% -10%,rgba(255,255,255,.26),transparent 72%);pointer-events:none}
.pro-head .wrap{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:end;padding-top:40px;padding-bottom:104px}
.pro-who{display:grid;grid-template-columns:112px minmax(0,1fr);gap:22px;align-items:center}
.pro-who .big-av{width:112px;height:112px;border-radius:50%;background:rgba(255,255,255,.18);box-shadow:0 0 0 3px rgba(255,255,255,.8),0 20px 40px -16px rgba(20,25,90,.6);overflow:hidden;position:relative}
.pro-who .big-av img{width:100%;height:100%;object-fit:cover}
.pro-who .big-av span{position:absolute;inset:0;display:grid;place-items:center;font:600 44px var(--sans);color:#fff}
.pro-who .eyebrow{color:rgba(255,255,255,.8);font-size:12px}
.pro-who h1{margin-top:8px;font-family:var(--display);font-size:clamp(38px,4.2vw,64px);line-height:.98;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pro-who h1 em{font-style:italic;color:rgba(255,255,255,.86)}
.pro-who .facts{margin-top:12px;display:flex;gap:18px;flex-wrap:wrap;font:500 13px/1 var(--mono);color:rgba(255,255,255,.82);min-height:13px}
.pro-who .facts span{display:inline-flex;align-items:center;gap:8px}
.pro-who .facts span::before{content:"";width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.7)}
.pro-who .facts span.is-fresh{color:#ffd27a}
.pro-cta{display:grid;gap:10px;justify-items:end}
.pro-cta .verdict{height:40px;font-size:13px;background:#fff}
.pro-cta .row{display:flex;gap:8px}
.pro-main{margin-top:-72px;position:relative;z-index:2}
.grid6{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:var(--shadow-2)}
.grid6 .tile{padding:18px 18px 16px;min-height:104px}
.grid6 .tile .v{font-size:30px}
.grid6 .tile .s{font-size:12.5px}
.block{margin-top:28px;background:var(--card);border:1px solid var(--line);border-radius:20px;padding:22px 24px 24px;box-shadow:var(--shadow)}
.block .bar{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:16px}
.block h2{font-family:var(--display);font-size:30px;line-height:1;letter-spacing:-.01em}
.block h2 em{font-style:italic;color:var(--blue-ink)}
.block .bar .n{font:500 12.5px var(--mono);color:var(--ink-3);white-space:nowrap}
.legend{display:flex;gap:16px;font:500 11.5px var(--mono);color:var(--ink-3);flex-wrap:wrap}
.legend span{display:inline-flex;align-items:center;gap:6px}
.legend i{width:9px;height:9px;border-radius:2.5px;display:inline-block}
.cv{position:relative;width:100%}
.cv canvas{display:block;width:100%;height:100%}
.cv.strip{height:150px}
.cv.rhythm{height:150px}
.tip{position:absolute;z-index:5;pointer-events:none;background:var(--ink);color:#fff;font:500 12px/1.4 var(--mono);padding:8px 10px;border-radius:10px;white-space:nowrap;box-shadow:var(--shadow-2);opacity:0;transform:translateY(4px);transition:opacity .12s,transform .12s}
.tip.is-on{opacity:1;transform:none}
.tip b{color:#fff;font-weight:700}
.tip .d{color:rgba(255,255,255,.65)}
.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px}
.two .block{margin-top:0}
.row-blocks{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:28px;margin-top:28px}
.row-blocks .block{margin-top:0}
/* coin cells with a chart, as on the card */
.cells{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.cell{border:1px solid var(--line);border-radius:var(--r);background:var(--card-2);padding:12px 12px 10px;display:grid;grid-template-rows:26px 150px 18px;gap:8px;min-width:0;transition:border-color .2s,transform .2s var(--ease),box-shadow .2s}
.cell:hover{border-color:var(--line-2);transform:translateY(-2px);box-shadow:var(--shadow)}
.cell .ch{display:grid;grid-template-columns:26px minmax(0,1fr) auto;gap:8px;align-items:center}
.cell .ch .lg{width:26px;height:26px;border-radius:50%;background:var(--tint);overflow:hidden;display:grid;place-items:center;font:700 12px var(--sans);color:var(--blue-ink)}
.cell .ch .lg img{width:100%;height:100%;object-fit:cover}
.cell .ch b{font-weight:700;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:6px;min-width:0}
.cell .ch b span{flex:0 0 auto;font:700 9.5px/1 var(--mono);letter-spacing:.08em;padding:4px 6px;border-radius:6px}
.cell .ch b span.is-rug{background:rgba(217,66,111,.12);color:var(--bad)}
.cell .ch b span.is-bonded{background:rgba(196,138,18,.14);color:var(--gold)}
.cell .ch .ath{font:800 15px var(--sans);letter-spacing:-.01em;white-space:nowrap}
.cell .ch .ath small{font:700 9.5px var(--mono);letter-spacing:.08em;color:var(--ink-3);margin-right:5px}
.cell .cv{height:150px}
.cell .ft{display:flex;justify-content:space-between;gap:10px;font:500 12px/18px var(--mono);white-space:nowrap;overflow:hidden}
.cell .ft .l{overflow:hidden;text-overflow:ellipsis}
.cell .ft .l.is-out{color:var(--warn);font-weight:600}.cell .ft .l.is-hold{color:var(--good);font-weight:600}.cell .ft .l.is-sold{color:var(--warn)}
.cell .ft .r{color:var(--ink-3)}
/* wallets behind it */
.wl{display:grid;gap:0}
.wl .w{display:grid;grid-template-columns:28px 130px minmax(0,1fr) 70px 70px 80px 90px;gap:12px;align-items:center;height:44px;border-top:1px solid var(--line);font-size:13.5px}
.wl .w.is-head{height:32px;border-top:0;font:600 10px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.wl .w i{font:600 11px var(--mono);color:var(--ink-3);font-style:normal}
.wl .w a{font:500 13px var(--mono);color:var(--blue-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wl .w a:hover{text-decoration:underline;text-underline-offset:3px}
.wl .w .meter{position:relative;height:10px;border-radius:5px;background:var(--tint);overflow:hidden;margin:0}
.wl .w .meter b{position:absolute;left:0;top:0;bottom:0;background:var(--blue);border-radius:5px}
.wl .w .meter b.is-rugs{background:var(--bad)}
.wl .w .num{font:600 13.5px var(--sans);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.wl .w .num.is-bad{color:var(--bad)}.wl .w .num.is-good{color:var(--good)}.wl .w .num.is-gold{color:var(--gold)}.wl .w .num.is-dim{color:var(--ink-3)}
.wl .w .when{font:500 12px var(--mono);color:var(--ink-3);text-align:right;white-space:nowrap}
.more-btn{margin-top:12px}
/* exits */
.ex{display:grid;gap:0}
.ex .e{display:grid;grid-template-columns:minmax(0,1.2fr) 90px minmax(0,1fr) 90px;gap:12px;align-items:center;height:40px;border-top:1px solid var(--line);font-size:13.5px}
.ex .e.is-head{height:30px;border-top:0;font:600 10px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.ex .e b{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ex .e .t{font:600 13px var(--mono);white-space:nowrap}
.ex .e .t.is-out{color:var(--warn)}.ex .e .t.is-hold{color:var(--good)}.ex .e .t.is-sold{color:var(--gold)}
.ex .e .meter{height:8px;border-radius:4px;background:var(--tint);overflow:hidden;position:relative}
.ex .e .meter b{position:absolute;left:0;top:0;bottom:0;border-radius:4px;background:var(--warn)}
.ex .e .sol{font:600 13px var(--mono);text-align:right;white-space:nowrap}
.ex .e .sol.is-plus{color:var(--warn)}.ex .e .sol.is-dim{color:var(--ink-3)}
/* every coin, the table */
.tbl-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sort{display:flex;gap:4px;padding:3px;border-radius:var(--pill);background:var(--card-2);border:1px solid var(--line)}
.sort button{height:30px;padding:0 12px;border:0;border-radius:var(--pill);background:transparent;font:500 13px var(--sans);color:var(--ink-2);cursor:pointer}
.sort button.is-on{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(28,26,51,.08)}
.tbl{display:grid;gap:0;margin-top:8px}
.tr{display:grid;grid-template-columns:30px 30px minmax(0,1.6fr) minmax(0,1fr) 110px 100px 90px 100px;gap:12px;align-items:center;height:46px;border-top:1px solid var(--line);font-size:13.5px;text-decoration:none;color:inherit;min-width:0}
.tr.is-head{height:32px;border-top:0;font:600 10px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.tr:not(.is-head):hover{background:var(--card-2)}
.tr .i{font:600 11px var(--mono);color:var(--ink-3)}
.tr .lg{width:30px;height:30px;border-radius:50%;background:var(--tint);overflow:hidden;display:grid;place-items:center;font:700 12px var(--sans);color:var(--blue-ink)}
.tr .lg img{width:100%;height:100%;object-fit:cover}
.tr .sy{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:7px;min-width:0}
.tr .sy span{flex:0 0 auto;font:700 9.5px/1 var(--mono);letter-spacing:.08em;padding:4px 6px;border-radius:6px}
.tr .sy span.is-rug{background:rgba(217,66,111,.12);color:var(--bad)}
.tr .sy span.is-bonded{background:rgba(196,138,18,.14);color:var(--gold)}
.tr .nm{color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tr .ath{font:700 14px var(--sans);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.tr .mono{font:500 12.5px var(--mono);color:var(--ink-3);text-align:right;white-space:nowrap}
.tr .wal{font:500 12.5px var(--mono);color:var(--blue-ink);text-align:right;white-space:nowrap}
.pager{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;font:500 12.5px var(--mono);color:var(--ink-3)}
.pager .pg{display:flex;gap:6px}
.pro-foot-cta{margin-top:40px;border-radius:24px;background:linear-gradient(180deg,var(--studio-top),var(--studio-mid));color:#fff;padding:36px 40px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:24px;box-shadow:var(--shadow-2);position:relative;overflow:hidden}
.pro-foot-cta::before{content:"";position:absolute;inset:0;background:radial-gradient(50% 60% at 20% -10%,rgba(255,255,255,.25),transparent 70%);pointer-events:none}
.pro-foot-cta h3{font-family:var(--display);font-size:34px;line-height:1;position:relative}
.pro-foot-cta p{margin-top:8px;color:rgba(255,255,255,.88);position:relative}
.pro-foot-cta img{width:120px;height:auto;position:relative;filter:drop-shadow(0 16px 20px rgba(20,25,90,.4))}
.empty-pro{padding:80px 0;text-align:center}
.empty-pro h1{font-family:var(--display);font-size:48px}
.empty-pro p{margin-top:14px;color:var(--ink-2)}
@media (max-width:1100px){
  .grid6{grid-template-columns:repeat(3,minmax(0,1fr))}
  .cells{grid-template-columns:repeat(2,minmax(0,1fr))}
  .two,.row-blocks{grid-template-columns:minmax(0,1fr)}
  .row-blocks .block + .block,.two .block + .block{margin-top:0}
  .wl .w{grid-template-columns:28px 120px minmax(0,1fr) 60px 60px 80px}
  .wl .w .when{display:none}
  .tr{grid-template-columns:30px 30px minmax(0,1.4fr) 100px 90px 90px}
  .tr .nm,.tr .wal{display:none}
}
@media (max-width:720px){
  .pro-head .wrap{grid-template-columns:minmax(0,1fr);padding-bottom:84px}
  .pro-cta{justify-items:start}
  .pro-who{grid-template-columns:72px minmax(0,1fr);gap:14px}
  .pro-who .big-av{width:72px;height:72px}
  .pro-who h1{font-size:34px;white-space:normal}
  .grid6{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cells{grid-template-columns:minmax(0,1fr)}
  .block{padding:16px 16px 18px;border-radius:16px}
  .wl .w{grid-template-columns:24px 100px minmax(0,1fr) 50px 50px}
  .wl .w .best{display:none}
  .tr{grid-template-columns:24px 26px minmax(0,1fr) 90px 70px}
  .tr .i,.tr .when-col{display:none}
  .pro-foot-cta{grid-template-columns:minmax(0,1fr);padding:28px 22px}
  .pro-foot-cta img{display:none}
}

/* ---- building: the link was clicked before the build landed ---- */
.building{display:grid;grid-template-columns:72px minmax(0,1fr);gap:16px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px 22px;margin-bottom:18px;box-shadow:var(--shadow)}
.building .sniff-lines{width:72px;height:60px;display:block}
.building .sniff-lines path{fill:none;stroke:var(--blue);stroke-width:2.4;stroke-linecap:round;stroke-dasharray:70;stroke-dashoffset:70;animation:scent 2.2s var(--ease) infinite}
.building .sniff-lines path:nth-child(2){animation-delay:.3s}.building .sniff-lines path:nth-child(3){animation-delay:.6s}
.building b{display:block;font-weight:600;font-size:16px}
.building span{display:block;color:var(--ink-2);font-size:14px;margin-top:2px}
.pro-main.is-pending .block,.pro-main.is-pending .row-blocks,.pro-main.is-pending .two,.pro-main.is-pending .pro-foot-cta{display:none}
.pro-main.is-pending .tile .v,.pro-main.is-pending .tile .s{color:transparent;background:linear-gradient(110deg,var(--tint) 30%,var(--card-2) 50%,var(--tint) 70%) 0 0/200% 100%;border-radius:6px;animation:sweep 1.2s linear infinite}
/* ---- the web: wallets on the left, X accounts on the right ---- */
.web-sub{color:var(--ink-2);font-size:14.5px;margin:-6px 0 14px;max-width:80ch}
.web-sub b{font-weight:600}
.cv.web{height:420px}
.cv.web canvas{cursor:pointer}
.web-tables{margin-top:18px}
.h3{font:600 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin:0 0 10px}
.wl .w .also{display:flex;gap:4px;flex-wrap:nowrap;overflow:hidden;min-width:0}
.wl .w .also a{font:600 11px var(--mono);padding:4px 7px;border-radius:6px;background:var(--tint);color:var(--blue-ink);white-space:nowrap;flex:0 0 auto}
.wl .w .also a.is-more{background:transparent;color:var(--ink-3)}
.wl.is-acc .w{grid-template-columns:28px minmax(120px,1.1fr) minmax(0,1.4fr) 60px 60px 80px}
.ends{display:grid;gap:6px}
.ends .b{display:grid;grid-template-columns:118px minmax(0,1fr) 54px;gap:10px;align-items:center;height:26px;font:500 12.5px var(--mono);color:var(--ink-2)}
.ends .b .meter{height:12px;border-radius:6px;background:var(--tint);overflow:hidden;position:relative}
.ends .b .meter b{position:absolute;left:0;top:0;bottom:0;border-radius:6px}
.ends .b .n{text-align:right;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.venues{display:flex;gap:6px;flex-wrap:wrap;margin-top:14px}
.venues span{font:600 11px var(--mono);padding:6px 9px;border-radius:var(--pill);background:var(--card-2);border:1px solid var(--line);color:var(--ink-2)}
.venues span b{color:var(--ink);font-weight:700;margin-left:4px}
@media (max-width:1100px){.wl.is-acc .w{grid-template-columns:28px minmax(100px,1fr) minmax(0,1fr) 50px 60px}.wl.is-acc .w .best{display:none}.cv.web{height:360px}}
@media (max-width:720px){.cv.web{height:300px}.wl .w .also{display:none}}

/* the nav spans wider than the content; the chip, then the second button, then the status give way as the screen narrows */
.nav .wrap{max-width:1400px;grid-template-columns:auto minmax(0,1fr) auto}
.nav .links{justify-self:center}
@media (max-width:1400px){.brand span{display:none}}
@media (max-width:1300px){.btn.nav-try{display:none}}
@media (max-width:1180px){.status{display:none}}

/* the floor switch sits in the strip's bar next to the legend */
#strip-block .bar{flex-wrap:wrap;gap:10px 18px}
#strip-block .tbl-bar{margin-left:auto}
@media (max-width:720px){#strip-block .tbl-bar{margin-left:0}}
