/* R47 — classic museum + crypto. Paper, ink, hairlines. No bright accents. */
:root{
  --paper:#f5f1ea;
  --paper-2:#ede7dc;
  --ink:#161513;
  --muted:#7d7466;
  --faint:#a79c8a;
  --line:#ddd4c2;
  --mat:#fffef9;
  --verified:#5f7355;
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Inter',-apple-system,'Segoe UI',Helvetica,Arial,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:var(--ink);text-decoration:none}
a:hover{text-decoration:underline}
::selection{background:var(--paper-2)}

/* ---------- demo banner ---------- */
.demo-banner{background:var(--ink);color:var(--paper);text-align:center;font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:8px 16px}
.demo-banner strong{font-weight:600}

/* ---------- header ---------- */
.site-header{border-bottom:1px solid var(--line);background:var(--paper);position:sticky;top:0;z-index:40}
.header-in{max-width:1240px;margin:0 auto;padding:0 24px;height:68px;display:flex;align-items:center;gap:28px}
.wordmark{font-family:var(--serif);font-size:30px;font-weight:600;letter-spacing:.06em;line-height:1}
.wordmark:hover{text-decoration:none}
.main-nav{display:flex;gap:26px;margin-left:12px}
.main-nav a{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}
.main-nav a[aria-current="page"]{border-bottom:1px solid var(--ink);padding-bottom:2px}
.header-actions{margin-left:auto;display:flex;align-items:center;gap:14px}
.x-link{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.x-link:hover{color:var(--ink)}
.btn{display:inline-block;font-family:var(--sans);font-size:12px;letter-spacing:.14em;text-transform:uppercase;padding:12px 22px;border:1px solid var(--ink);cursor:pointer;background:transparent;color:var(--ink);text-align:center}
.btn:hover{text-decoration:none;background:var(--paper-2)}
.btn-solid{background:var(--ink);color:var(--paper)}
.btn-solid:hover{background:#2b2925;color:var(--paper)}
.btn-quiet{border-color:var(--line)}
.btn[disabled]{opacity:.38;cursor:not-allowed;pointer-events:none}
.menu-btn{display:none;background:none;border:1px solid var(--line);width:42px;height:42px;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.menu-btn span{display:block;width:18px;height:1px;background:var(--ink)}

/* ---------- layout ---------- */
.wrap{max-width:1240px;margin:0 auto;padding:0 24px}
.section{padding:72px 0}
.section-alt{background:var(--paper-2)}
.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:24px;border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:40px}
.label{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.12}
h1{font-size:clamp(38px,6vw,64px)}
h2{font-size:clamp(28px,3.6vw,40px)}
h3{font-size:24px}
.lede{font-size:18px;color:#3d382f;max-width:62ch}
.muted{color:var(--muted)}
.small{font-size:13px}
.mono{font-family:var(--mono);font-size:12.5px;letter-spacing:.01em}
.rule{border:0;border-top:1px solid var(--line);margin:0}

/* ---------- ticker ---------- */
.ticker{border-bottom:1px solid var(--line);overflow:hidden;padding:10px 0;background:var(--paper)}
.ticker-track{display:flex;gap:56px;white-space:nowrap;width:max-content;animation:ticker 60s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker-track span{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.ticker-track b{color:var(--ink);font-weight:500}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion: reduce){.ticker-track{animation:none}}

/* ---------- frames & cards ---------- */
/* A frame is a block-level flex column: image area first, caption beneath.
   In cards, the image AREA carries a fixed 4/5 ratio (never the source
   image, never the whole frame): every card frame in a row is the same
   height whether the artwork itself is portrait, square or wide, because
   object-fit crops the picture into an identical box. */
.frame{display:flex;flex-direction:column;background:var(--mat);border:1px solid var(--line);padding:clamp(12px,2.4vw,30px);box-shadow:0 1px 2px rgba(22,21,19,.04),0 16px 36px rgba(22,21,19,.05)}
a.frame:hover{text-decoration:none}
.frame-img{display:block;flex:1 1 auto;min-height:0}
.frame-img img{width:100%;height:100%;object-fit:cover}
.frame-fixed .frame-img{flex:none;aspect-ratio:4/5}
.frame-natural .frame-img{flex:0 1 auto}
.frame-natural .frame-img img{height:auto;object-fit:initial}
.frame-hero .frame-img img{width:auto;height:auto;max-width:100%;max-height:72vh;margin:0 auto}
.sample-tag{display:block;margin-top:14px;padding-top:11px;border-top:1px solid var(--line);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);text-align:center}
.example-note{display:inline-flex;align-items:center;gap:8px;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.example-note::before{content:"";width:7px;height:7px;flex:none;background:var(--paper-2);border:1px solid var(--faint);transform:rotate(45deg)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(248px,1fr));gap:44px 32px}
.card{position:relative;display:flex;flex-direction:column;min-width:0}
.card .frame{transition:box-shadow .25s ease}
.card:hover .frame{box-shadow:0 1px 2px rgba(22,21,19,.05),0 22px 44px rgba(22,21,19,.1)}
.card-meta{padding-top:16px;display:flex;justify-content:space-between;gap:12px;flex:1}
.card-meta>div{min-width:0}
.card-main{display:flex;flex-direction:column;flex:1;min-width:0}
/* Reserved head room: two title lines (2 x 25.2px) + byline margin (5px)
   + two byline lines (2 x 19.2px) = 93.8px, so one-line and two-line
   titles end on the same baseline and prices align across a row. */
.card-head{min-height:94px}
.card h3{font-size:21px;line-height:1.2}
.card h3 a:hover{text-decoration:underline}
.byline{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:5px}
.card-price{padding-top:10px}
.price-eth{font-family:var(--serif);font-size:22px;font-weight:600;line-height:1.1}
.price-usd{font-size:12.5px;color:var(--muted)}
.sold-tag{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);border:1px solid var(--line);padding:4px 9px;display:inline-block;margin-top:8px}
.heart{flex:none;width:36px;height:36px;border:1px solid var(--line);background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center}
.heart svg{width:16px;height:16px;fill:none;stroke:var(--ink);stroke-width:1.5}
.heart.is-on svg{fill:var(--ink)}
.heart:hover{border-color:var(--ink)}

/* ---------- home ---------- */
.hero{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;padding:64px 0 72px}
.hero-copy .label{margin-bottom:18px;display:block}
.hero-copy h1{margin-bottom:20px}
.hero-copy p{color:#3d382f;max-width:46ch;margin-bottom:14px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.hero-price{margin-top:30px;border-top:1px solid var(--line);padding-top:18px;display:flex;gap:40px}
.hero-price .price-eth{font-size:30px}
.artist-strip{display:flex;gap:28px;align-items:center}
.avatar{flex:none;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--paper);font-family:var(--serif);letter-spacing:.05em}
.avatar-lg{width:104px;height:104px;font-size:34px}
.avatar-md{width:72px;height:72px;font-size:24px}
.avatar-sm{width:44px;height:44px;font-size:16px}
.drop-band{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.stat-row{display:flex;gap:0;border:1px solid var(--line);background:var(--mat)}
.stat{flex:1;padding:18px 20px;border-right:1px solid var(--line)}
.stat:last-child{border-right:0}
.stat .num{font-family:var(--serif);font-size:26px;font-weight:600;line-height:1.15}
.stat .cap{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.stats-note{display:flex;justify-content:space-between;align-items:baseline;gap:18px;flex-wrap:wrap;margin-bottom:14px}

/* ---------- explore ---------- */
.controls{display:flex;flex-wrap:wrap;gap:14px;align-items:end;margin-bottom:44px}
.field{display:flex;flex-direction:column;gap:7px}
.field label{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.field input,.field select,.field textarea{font-family:var(--sans);font-size:15px;color:var(--ink);background:var(--mat);border:1px solid var(--line);padding:11px 13px;border-radius:0;min-width:200px}
.field textarea{min-width:min(520px,100%);resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:1px solid var(--ink);outline-offset:0}
.no-results{border:1px solid var(--line);padding:44px;text-align:center;color:var(--muted);display:none}

/* ---------- artwork page ---------- */
.art-layout{display:grid;grid-template-columns:1.15fr 1fr;gap:64px;padding:56px 0 8px}
.art-side h1{font-size:clamp(34px,4.4vw,50px);margin:10px 0 8px}
.artist-line{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.artist-line a{color:var(--ink);border-bottom:1px solid var(--line)}
.spec-list{margin:26px 0;border-top:1px solid var(--line)}
.spec-list div{display:flex;justify-content:space-between;gap:20px;padding:11px 0;border-bottom:1px solid var(--line);font-size:14px}
.spec-list dt{color:var(--muted);font-size:11px;letter-spacing:.18em;text-transform:uppercase;padding-top:3px}
.spec-list dd{text-align:right}
.price-block{margin:28px 0 6px}
.price-block .price-eth{font-size:44px}
.price-block .price-usd{font-size:15px}
.pay-note{font-size:13px;color:var(--muted);margin-top:8px}
.action-row{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0 8px}
.text-link{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:2px;cursor:pointer;background:none;border-top:0;border-left:0;border-right:0;font-family:var(--sans)}
.text-link:hover{color:var(--ink)}
.verified{display:inline-flex;align-items:center;gap:8px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--verified);display:inline-block}
.token-block{border:1px solid var(--line);background:var(--mat);padding:24px 26px;margin-top:28px}
.token-block .label{display:block;margin-bottom:14px}
.token-block dl{display:grid;grid-template-columns:auto 1fr;gap:8px 26px;font-size:13.5px}
.token-block dt{color:var(--muted);font-size:11px;letter-spacing:.16em;text-transform:uppercase;padding-top:2px}
.token-block dd{text-align:right;font-family:var(--mono);font-size:12.5px;word-break:break-all}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:64px}
.chart-box{border:1px solid var(--line);background:var(--mat);padding:22px 22px 12px}
.chart-box svg{width:100%;height:auto}
.chart-axis{display:flex;justify-content:space-between;font-size:11.5px;color:var(--muted);padding:8px 2px 10px}
/* v5: a wide table scrolls inside its own container, never the page */
.table-scroll{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
table.ledger{width:100%;border-collapse:collapse;font-size:14px}
table.ledger th{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-weight:500;text-align:left;padding:10px 8px;border-bottom:1px solid var(--ink)}
table.ledger td{padding:11px 8px;border-bottom:1px solid var(--line);vertical-align:top}
table.ledger td.r,table.ledger th.r{text-align:right}
table.ledger .eth{font-family:var(--serif);font-size:17px;font-weight:600;white-space:nowrap}

/* ---------- artist page ---------- */
.artist-head{display:flex;gap:32px;align-items:flex-start;padding:56px 0 40px}
.artist-head h1{font-size:clamp(34px,5vw,52px)}
.social-row{display:flex;gap:20px;margin-top:14px;flex-wrap:wrap}
.social-row a{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:2px}
.social-row a:hover{color:var(--ink)}
.about-text{max-width:66ch;color:#3d382f}

/* ---------- steps / sell ---------- */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:32px}
.step{border-top:1px solid var(--ink);padding-top:18px}
.step .no{font-family:var(--serif);font-size:30px;color:var(--faint)}
.step h3{font-size:21px;margin:8px 0 8px}
.step p{font-size:14.5px;color:#3d382f}
.panel{border:1px solid var(--line);background:var(--mat);padding:32px;min-width:0}
.form-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}
.form-grid .field{min-width:0}
.form-grid .wide{grid-column:1/-1}
.checkline{display:flex;gap:10px;align-items:flex-start;font-size:14px}
.checkline input{margin-top:4px}
.form-error{display:none;border:1px solid #b08d7a;background:#f7efe7;color:#6d4a38;padding:12px 16px;font-size:14px;margin-bottom:18px}
.form-success{display:none;border:1px solid var(--line);background:var(--paper-2);padding:22px 24px}
.form-success h3{margin-bottom:6px}

/* ---------- account ---------- */
.acct-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;padding:48px 0 8px}
.mini-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:28px}
.empty-note{border:1px dashed var(--line);padding:28px;color:var(--muted);font-size:14.5px;text-align:center}
/* v4: artist studio uploads (the visitor's own files, framed without the sample label) */
.uframe{display:block;background:#fff;border:1px solid var(--line);padding:12px}
.uframe img{display:block;width:100%;height:auto}
.uworks{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:26px}
.ledger img.thumb{width:46px;height:46px;object-fit:cover;display:block;border:1px solid var(--line);background:#fff}
.up-preview{max-width:280px;background:#fff;border:1px solid var(--line);padding:8px;margin-top:12px}
.up-preview img{display:block;width:100%;height:auto}
.field input[type="file"]{padding:10px 0}

/* ---------- prose pages ---------- */
.prose{max-width:72ch}
.prose h2{margin:44px 0 12px;font-size:30px}
.prose h2:first-child{margin-top:0}
.prose p{margin-bottom:14px;color:#2e2a24}
.prose ul{margin:0 0 14px 20px;color:#2e2a24}
.prose li{margin-bottom:6px}
.fees-table{width:100%;border-collapse:collapse;margin:18px 0 8px;font-size:14.5px;background:var(--mat)}
.fees-table th{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-weight:500;text-align:left;padding:12px 14px;border:1px solid var(--line)}
.fees-table td{padding:12px 14px;border:1px solid var(--line);vertical-align:top}
.big-quote{font-family:var(--serif);font-size:clamp(26px,4vw,38px);line-height:1.3;font-weight:500}

/* ---------- modals ---------- */
.modal-back{position:fixed;inset:0;background:rgba(22,21,19,.45);display:none;align-items:flex-start;justify-content:center;overflow-y:auto;padding:28px 16px;z-index:80}
.modal-back.open{display:flex}
.modal{background:var(--paper);border:1px solid var(--line);max-width:520px;width:100%;padding:34px 34px 30px;position:relative}
.modal h3{font-size:27px;margin-bottom:6px}
.modal .sub{font-size:14px;color:var(--muted);margin-bottom:20px}
.modal-close{position:absolute;top:14px;right:16px;background:none;border:0;font-size:22px;line-height:1;cursor:pointer;color:var(--muted);font-family:var(--sans)}
.modal .field input,.modal .field select{width:100%;min-width:0}
.radio-row{display:flex;flex-direction:column;gap:9px;margin:6px 0 4px}
.radio-row label{display:flex;gap:11px;align-items:center;border:1px solid var(--line);background:var(--mat);padding:12px 14px;font-size:14.5px;cursor:pointer}
.radio-row label:has(input:checked){border-color:var(--ink)}
.breakdown{border-top:1px solid var(--line);margin-top:20px}
.breakdown div{display:flex;justify-content:space-between;gap:18px;padding:9px 0;border-bottom:1px solid var(--line);font-size:14.5px}
.breakdown .total{font-weight:600}
.breakdown .cap{color:var(--muted);font-size:12.5px;border-bottom:0;padding-top:2px}
.modal-actions{display:flex;gap:12px;margin-top:24px;flex-wrap:wrap}
.step-dots{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:14px}
.receipt-no{font-family:var(--mono);font-size:13px}

/* ---------- footer ---------- */
.site-footer{border-top:1px solid var(--line);margin-top:0;background:var(--paper)}
.footer-in{max-width:1240px;margin:0 auto;padding:56px 24px 40px;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}
.footer-in h4{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);font-weight:500;margin-bottom:16px}
.footer-in ul{list-style:none}
.footer-in li{margin-bottom:9px}
.footer-in li a{font-size:14px}
.footer-base{border-top:1px solid var(--line);padding:20px 24px;max-width:1240px;margin:0 auto;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:12.5px;color:var(--muted)}

/* v8: visitor-typed text (profile name, bio, about and country, work
   titles, process lines, the signed-in email) can be one long
   unbroken string — a 50-letter name or a pasted link with no
   spaces. Elements carrying .u-wrap may break anywhere, so the page
   never scrolls sideways, at EVERY width. Normal spaced text
   renders exactly as before; the class only ever adds break
   opportunities inside otherwise-unbreakable strings. */
.u-wrap{overflow-wrap:anywhere;max-width:100%}

/* v9: upload-standard field messages, calculator, viewing room, certificate */
.field-msg{display:none;font-size:12.5px;color:#8a5a3b;margin-top:2px}
.field-msg.on{display:block}
.field-note{font-size:12.5px;color:var(--muted)}
.fees-table td.r{text-align:right;white-space:nowrap}
.promise-box{border:1px solid var(--ink);background:var(--mat);padding:22px 24px}
.social-row span{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:2px}
.viewing-room{position:fixed;inset:0;background:#f2ecdf;z-index:95;display:none;flex-direction:column}
.viewing-room.open{display:flex}
.vr-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:16px 20px;border-bottom:1px solid var(--line)}
.vr-stage{flex:1;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:20px}
.vr-art{display:inline-block;line-height:0;transition:transform .2s ease}
.vr-art img{max-width:86vw;max-height:68vh;width:auto;height:auto;box-shadow:0 18px 48px rgba(22,21,19,.18)}
.viewing-room[data-frame="black"] .vr-art{border:5px solid #161513}
.viewing-room[data-frame="mat"] .vr-art{background:#fffef9;padding:4.5vmin;border:1px solid var(--line)}
.vr-controls{display:flex;gap:26px;flex-wrap:wrap;justify-content:center;align-items:center;padding:14px 16px;border-top:1px solid var(--line)}
.vr-group{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:center}
.vr-group .label{margin-right:4px}
.vr-controls .btn[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.cert{background:#fff;border:1px solid var(--ink);padding:clamp(24px,5vw,52px);max-width:820px;margin:0 auto;box-shadow:0 1px 2px rgba(22,21,19,.04),0 16px 36px rgba(22,21,19,.05)}
.cert-art{max-width:300px;margin:30px auto 6px}
@media print{
  @page{margin:11mm}
  .demo-banner,.site-header,.site-footer,.modal-back,.no-print,.viewing-room{display:none!important}
  body{background:#fff}
  .section{padding:0!important}
  .cert{border:1px solid #000;box-shadow:none;max-width:none;padding:18px 22px}
  .cert h1{font-size:27px!important;margin:8px 0 4px!important}
  .cert-art{max-width:160px;margin:10px auto 2px}
  .cert .spec-list{margin:12px 0}
  .cert .spec-list div{padding:5px 0;font-size:13px}
  .cert p{margin-top:8px!important}
}

/* ---------- responsive ---------- */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px}
.split-uneven{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:56px}
@media (max-width:960px){
  .split,.split-uneven{grid-template-columns:minmax(0,1fr)}
  .hero,.drop-band,.art-layout,.two-col{grid-template-columns:1fr;gap:40px}
  .art-layout{padding-top:40px}
  .footer-in{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  /* The ticker stays in normal flow and carries its own bottom margin,
     so it can never sit on the hero's Featured work label; with the
     hero's reduced top padding the total gap matches the desktop 64px. */
  .ticker{margin-bottom:26px}
  .hero{padding-top:38px}
  .main-nav{display:none;position:absolute;top:68px;left:0;right:0;background:var(--paper);border-bottom:1px solid var(--line);flex-direction:column;padding:18px 24px 24px;gap:16px;margin-left:0}
  .main-nav.open{display:flex}
  .menu-btn{display:flex}
  .x-link{display:none}
  .section{padding:52px 0}
  .form-grid{grid-template-columns:minmax(0,1fr)}
  .field input,.field select,.field textarea{min-width:0;max-width:100%}
  .artist-head{flex-direction:column;gap:20px}
  /* v6: the My listings "Works you listed" heading row stacks on phones —
     the heading takes its own line and the demo note wraps below it, so
     the row cannot squeeze the heading or push the page sideways. The
     note itself may wrap too: it is ~305px wide unbroken and a 320px
     phone leaves only 288px. Only elements carrying this class are
     affected; desktop is unchanged. */
  .section-head-stack{flex-direction:column;align-items:flex-start;gap:8px}
  .section-head-stack .example-note{white-space:normal}
  /* v7: a full wallet address is one unbroken 42-character string
     (~316px in the mono face) — wider than the 288px content box of a
     320px phone, so the account page still scrolled sideways. On phones
     an address may wrap anywhere; the address itself and the desktop
     rendering are unchanged. */
  .addr{overflow-wrap:anywhere}
  .stat-row{flex-wrap:wrap}
  .stat{flex:1 1 40%;border-bottom:1px solid var(--line)}
  .header-in{gap:14px;padding:0 16px}
  .wrap{padding:0 16px}
  .btn{padding:11px 16px}
}
