/* Launch page (Paper "App · Launch" + "· Mobile 390"). Prefix l-. Shell, tokens, toasts, states come from site/app/motion.css. */
.l { padding-bottom: 80px; }

/* ---------- head + stepper ---------- */
.l-head { display: flex; justify-content: space-between; align-items: end; gap: 24px; padding: 48px 0 32px; }
.l-title { display: flex; flex-direction: column; gap: 10px; }
.l-title h1 { margin: 0; font: 600 44px/50px var(--ff-display); letter-spacing: var(--tracking-display); }
.l-title p { margin: 0; font: 400 16px/24px var(--ff-sans); color: var(--color-muted); }
.l-steps { display: flex; align-items: center; gap: 8px; margin: 0; padding: 0; list-style: none; }
.l-steps li { display: flex; align-items: center; gap: 8px; font: 500 14px/18px var(--ff-sans); color: var(--color-muted); transition: color .3s var(--ease-ui); }
.l-steps li i { width: 24px; height: 24px; border-radius: 12px; display: grid; place-items: center; flex-shrink: 0; font: 400 11px/12px var(--ff-mono); font-style: normal; border: 1px solid var(--color-line-strong);
  transition: background-color .35s var(--ease-out), border-color .35s, color .35s, scale .5s var(--spring); }
.l-steps li.cur { color: var(--color-fg); font-weight: 600; }
.l-steps li.cur i { background: var(--color-btn); border-color: var(--color-btn); color: var(--color-card); font-weight: 600; }
.l-steps li.done { color: var(--color-fg); }
.l-steps li.done i { background: var(--color-vault); border-color: var(--color-vault); }
.m .l-steps li.done i { animation: l-pop .5s var(--spring); }
@keyframes l-pop { 40% { scale: 1.18; } }
.l-steps b { width: 32px; height: 1px; flex-shrink: 0; background: var(--color-line-strong); position: relative; overflow: hidden; }
.l-steps b::after { content: ""; position: absolute; inset: 0; background: var(--color-vault); scale: 0 1; transform-origin: left; transition: scale .5s var(--ease-out); }
.l-steps b.done::after { scale: 1 1; }
.l-steps-m { display: none; }

/* ---------- layout ---------- */
.l-body { display: grid; grid-template-columns: minmax(0, 1fr) 440px; gap: 32px; align-items: start; padding-bottom: 48px; transition: opacity .4s var(--ease-ui); }
.l-flow, .l-sum { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.l-sum { position: sticky; top: 88px; }
.l.fin .l-body { opacity: .45; pointer-events: none; }
.l-card { padding: 24px; display: flex; flex-direction: column; gap: 20px; position: relative; }
.l-h { margin: 0; font: 600 15px/20px var(--ff-sans); color: var(--color-fg); }
.l-link.l-link { padding: 20px 24px; gap: 12px; z-index: 5; overflow: visible; }
.l-row { display: flex; gap: 10px; }
.l [hidden] { display: none !important; }

/* ---------- link / search ---------- */
.l-q { flex: 1 1 0; min-width: 0; display: flex; align-items: center; gap: 10px; height: 44px; padding: 0 14px; background: #000; border: 1px solid var(--color-line-strong); border-radius: var(--radius-btn);
  transition: border-color .2s var(--ease-ui), box-shadow .2s var(--ease-ui); }
.l-q:hover { border-color: #FFFFFF4D; }
.l-q:focus-within { border-color: #FFFFFF66; box-shadow: 0 0 0 3px #FFFFFF14; }
.l-q svg { flex-shrink: 0; }
.l-q input { flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: none; padding: 0; color: var(--color-fg); font: 400 14px/18px var(--ff-mono); }
.l-q input::placeholder { color: var(--color-faint); font-family: var(--ff-sans); }
.l-qs { display: flex; align-items: center; gap: 6px; flex-shrink: 0; font: 400 13px/16px var(--ff-sans); color: var(--color-muted); white-space: nowrap; }
.l-qs:empty { display: none; }
.l-qs i { width: 6px; height: 6px; border-radius: 3px; background: currentColor; }
.l-qs.ok { color: var(--color-vault); }
.l-qs.err { color: #FF8A80; }
.l-qs.busy i { width: 10px; height: 10px; border-radius: 50%; background: none; border: 1.5px solid #FFFFFF33; border-top-color: var(--color-fg); animation: spin .7s linear infinite; }
.m .l-qs:not(:empty) { animation: l-in .3s var(--ease-out); }
@keyframes l-in { from { opacity: 0; translate: 4px 0; } }
.l-paste { height: 44px; padding: 0 16px; border-color: var(--color-line-strong); color: var(--color-fg); font: 500 14px/18px var(--ff-sans); background: none; transition: background-color .2s, border-color .2s, scale .15s var(--ease-ui); }
.l-paste:hover { background: #FFFFFF0D; border-color: #FFFFFF4D; }
.l-paste:active, .l-chips button:active, .l-go:not(:disabled):active { scale: .97; }

.l-res { position: absolute; left: 24px; right: 24px; top: calc(100% - 14px); margin: 0; padding: 6px; list-style: none; max-height: 392px; overflow: auto; overscroll-behavior: contain;
  background: #0C0C0C; border: 1px solid var(--color-line-strong); border-radius: 12px; box-shadow: #000000CC 0 24px 60px; transform-origin: top; }
.m .l-res:not([hidden]) { animation: l-drop .25s var(--ease-out); }
@keyframes l-drop { from { opacity: 0; translate: 0 -6px; scale: .98; } }
.l-res li[role=option] { display: flex; align-items: center; gap: 12px; padding: 8px 10px; border-radius: 8px; cursor: pointer; transition: background-color .12s; }
.m .l-res:not([hidden]) li[role=option] { animation: rise .35s var(--ease-out) both; animation-delay: calc(var(--i) * 30ms); }
.l-res li[aria-selected=true] { background: #FFFFFF12; }
.l-r-logo { width: 36px; height: 36px; border-radius: 9px; flex-shrink: 0; border: 1px solid var(--color-line); }
.l-r-tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.l-r-tx b { font: 600 14px/18px var(--ff-sans); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.l-r-tx small { font: 400 12px/16px var(--ff-sans); color: var(--color-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.l-r-tag { margin-left: 8px; vertical-align: 1px; white-space: nowrap; padding: 1px 6px; border-radius: 5px; background: #FF61541F; color: #FF8A80; font: 400 10px/14px var(--ff-mono); text-transform: uppercase; }
.l-r-tag.on { background: #3DDC971F; color: var(--color-vault); }
.l-r-up { width: 52px; flex-shrink: 0; display: flex; align-items: center; justify-content: flex-end; gap: 6px; font: 500 12px/16px var(--ff-mono); color: var(--color-muted); }
.l-r-note { padding: 12px 10px; font: 400 13px/18px var(--ff-sans); color: var(--color-muted); }

/* ---------- product preview ---------- */
.m .l-pv:not([hidden]) { animation: l-up .5s var(--ease-out); }
@keyframes l-up { from { opacity: 0; translate: 0 12px; } }
.l-pv-top { display: flex; align-items: start; gap: 16px; }
.l-pv-logo { width: 64px; height: 64px; border-radius: 14px; flex-shrink: 0; border: 1px solid var(--color-line); }
.l-pv-tx { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.l-pv-name { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.l-pv-name h2 { margin: 0; font: 600 24px/30px var(--ff-display); }
.l-rank { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 6px; background: #FF61541F; color: #FF8A80; font: 400 11px/12px var(--ff-mono); }
.l-pv-url { display: none; font: 400 12px/16px var(--ff-mono); color: var(--color-muted); }
.l-pv-tx p { margin: 0; font: 400 15px/22px var(--ff-sans); color: var(--color-muted); }
.l-tags { display: flex; gap: 6px; padding-top: 4px; flex-wrap: wrap; }
.l-tags span { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border: 1px solid var(--color-line); border-radius: 6px; font: 400 11px/14px var(--ff-sans); color: var(--color-muted); }
.l-pv-up { width: 60px; height: 60px; gap: 3px; flex-shrink: 0; font: 600 14px/16px var(--ff-sans); }
.l-gal { display: flex; gap: 10px; height: 150px; }
.l-gal > * { flex: 1 1 0; border-radius: 10px; border: 1px solid var(--color-line); overflow: hidden; background: linear-gradient(in oklab 160deg, oklab(28.5% 0 0), oklab(16.4% 0 0)); }
.l-gal > :first-child { flex-grow: 2; }
.l-gal img { width: 100%; height: 100%; object-fit: cover; display: block; opacity: 0; scale: 1.04; transition: opacity .5s var(--ease-out), scale .8s var(--ease-out); }
.l-gal img.ok { opacity: 1; scale: 1; }
.l-gal a:hover img.ok { scale: 1.04; }
.l-gal.sk > i { border: 0; }
.l-pv-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 16px; border-top: 1px solid var(--color-line); }
.l-makers { display: flex; align-items: center; gap: 10px; min-width: 0; font: 400 13px/18px var(--ff-sans); color: var(--color-muted); }
.l-makers b { font-weight: 400; color: var(--color-fg); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.l-makers .avatars i { width: 26px; height: 26px; border: 2px solid var(--color-card); }
.l-makers .avatars i + i { margin-left: -8px; }
.l-site { margin-left: auto; font: 400 12px/16px var(--ff-mono); color: var(--color-muted); transition: color .15s; }
.l-site:hover { color: var(--color-fg); }
.l-change { display: none; }
.l-taken { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border-radius: 10px; background: #FF615414; border: 1px solid #FF615440; font: 400 13px/18px var(--ff-sans); color: #FFFFFFCC; }
.l-taken .btn { height: 32px; flex-shrink: 0; }

/* ---------- token setup ---------- */
.l-tok { border-color: var(--color-line-strong); transition: opacity .35s var(--ease-ui), border-color .3s; }
.l-tok.off { opacity: .45; border-color: var(--color-line); }
.l-fields { display: flex; gap: 12px; }
.l-f { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.l-f-name { flex: 2 1 0; }
.l-f-tick { flex: 1 1 0; }
.l-lbl { font: 400 13px/16px var(--ff-sans); color: var(--color-muted); }
.l-in { display: flex; align-items: center; gap: 2px; height: 44px; padding: 0 14px; background: #000; border: 1px solid var(--color-line-strong); border-radius: var(--radius-btn); font: 400 15px/20px var(--ff-sans);
  transition: border-color .2s var(--ease-ui), box-shadow .2s var(--ease-ui); }
.l-in:not(.l-ro):hover { border-color: #FFFFFF4D; }
.l-in:focus-within { border-color: #FFFFFF66; box-shadow: 0 0 0 3px #FFFFFF14; }
.l-in.bad, .l-custom.bad { border-color: #FF615499; }
.l-in.bad:focus-within, .l-custom.bad:focus-within { box-shadow: 0 0 0 3px #FF615426; }
.l-ro { gap: 10px; }
.l-ro #name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.l-ro small { font: 400 12px/16px var(--ff-sans); color: var(--color-faint); flex-shrink: 0; }
.l-img { width: 24px; height: 24px; border-radius: 6px; flex-shrink: 0; background: var(--color-raised); }
.l-dol { color: var(--color-muted); font: 400 15px/20px var(--ff-mono); }
.l-f-tick input { flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: none; padding: 0; color: var(--color-fg); font: 400 15px/20px var(--ff-mono); text-transform: uppercase; }
.l-err { min-height: 0; font: 400 12px/16px var(--ff-sans); color: #FF8A80; }
.l-err:empty { display: none; }
.m .l-err:not(:empty) { animation: l-shake .35s var(--ease-out); }
@keyframes l-shake { 25% { translate: -3px 0; } 60% { translate: 2px 0; } }
.l-buy { display: flex; flex-direction: column; gap: 10px; }
.l-buy-h { display: flex; justify-content: space-between; align-items: center; }
.l-pct { font: 400 12px/16px var(--ff-mono); color: var(--color-muted); }
.l-chips { display: flex; gap: 8px; }
.l-chips button { flex: 1 1 0; height: 40px; border: 1px solid var(--color-line-strong); border-radius: var(--radius-btn); background: none; color: var(--color-muted); font: 400 13px/16px var(--ff-mono); cursor: pointer;
  transition: background-color .2s var(--ease-ui), border-color .2s, color .2s, scale .15s var(--ease-ui); }
.l-chips button:hover { border-color: #FFFFFF4D; color: var(--color-fg); background: #FFFFFF08; }
.l-chips button.on { background: var(--color-btn); border-color: var(--color-btn); color: var(--color-card); font-weight: 600; }
.l-custom { flex: 1.4 1 0; min-width: 0; display: flex; align-items: center; gap: 6px; height: 40px; padding: 0 12px; background: #000; border: 1px solid var(--color-line-strong); border-radius: var(--radius-btn); cursor: text; transition: border-color .2s, box-shadow .2s; }
.l-custom:hover { border-color: #FFFFFF4D; }
.l-custom:focus-within, .l-custom.on { border-color: #FFFFFF66; }
.l-custom:focus-within { box-shadow: 0 0 0 3px #FFFFFF14; }
.l-custom input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; padding: 0; color: var(--color-fg); font: 400 13px/16px var(--ff-mono); }
.l-custom input::placeholder { color: var(--color-faint); }
.l-custom span { font: 400 12px/16px var(--ff-mono); color: var(--color-faint); }

/* ---------- fees ---------- */
.l-split { display: flex; flex-direction: column; gap: 8px; }
.l-bar { height: 36px; border-radius: 8px; overflow: clip; background: #FFFFFF0A; }
.l-bar i { height: 100%; display: flex; align-items: center; justify-content: space-between; padding: 0 12px; background: var(--color-vault); font-style: normal; }
.l-bar b { color: #04130C; font: 600 13px/16px var(--ff-sans); }
.l-bar b + b { font-family: var(--ff-mono); }
.l-split-k, .l-tl-k { display: flex; justify-content: space-between; gap: 16px; }
.l-split-k span, .l-tl-k span { font: 400 11px/14px var(--ff-mono); color: var(--color-muted); }
.l-tl { display: flex; flex-direction: column; gap: 10px; }
.l-tl-line { display: flex; align-items: center; height: 16px; }
.l-tl-line i { width: 12px; height: 12px; border-radius: 6px; flex-shrink: 0; background: var(--color-vault); }
.l-tl-line i:last-child { background: none; border: 2px solid var(--color-fg); }
.l-tl-line b { flex: 1; height: 2px; background: linear-gradient(in oklab 90deg, oklab(79.7% -0.153 0.057), oklab(79.7% -0.153 0.057 / 20%)); transform-origin: left; }
.m .l-tl-line b { scale: 0 1; animation: l-grow 1.4s var(--ease-out) .4s forwards; }
.m .l-tl-line i:last-child { scale: 0; animation: l-pop2 .6s var(--spring) 1.5s forwards; }
.m .l-tl-line i:first-child { animation: l-pulse 2.4s var(--ease-out) 1s infinite; }
@keyframes l-grow { to { scale: 1 1; } }
@keyframes l-pop2 { to { scale: 1; } }
@keyframes l-pulse { 0% { box-shadow: 0 0 0 0 #3DDC9780; } 70%, 100% { box-shadow: 0 0 0 8px #3DDC9700; } }
.l-tl-k > div { flex: 1 1 0; display: flex; flex-direction: column; gap: 2px; }
.l-tl-k > div:first-child span { color: var(--color-vault); }
.l-tl-k > div:last-child { align-items: end; text-align: right; }
.l-tl-k > div:last-child span { color: var(--color-fg); }
.l-tl-k p { margin: 0; font: 400 13px/18px var(--ff-sans); }
.l-notes { display: flex; flex-direction: column; border-radius: 10px; background: #FFFFFF0A; }
.l-notes > div { display: flex; align-items: center; gap: 12px; padding: 12px; }
.l-notes > div + div { border-top: 1px solid var(--color-line); }
.l-notes img { flex-shrink: 0; transition: rotate .4s var(--spring), scale .4s var(--spring); }
.l-notes > div:hover img { rotate: -8deg; scale: 1.08; }
.l-notes p { margin: 0; font: 400 13px/18px var(--ff-sans); color: var(--color-muted); }

/* ---------- review + sign ---------- */
.l-rev { gap: 14px; }
.l-kv { margin: 0; display: flex; flex-direction: column; gap: 14px; }
.l-kv > div { display: flex; justify-content: space-between; gap: 12px; }
.l-kv dt { font: 400 14px/18px var(--ff-sans); color: var(--color-muted); }
.l-kv dd { margin: 0; font: 400 14px/18px var(--ff-mono); color: var(--color-fg); text-align: right; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.l-route { color: var(--color-vault) !important; }
.l-vault { color: var(--color-faint) !important; font-family: var(--ff-sans) !important; }
.l-vault.set { color: var(--color-fg) !important; font-family: var(--ff-mono) !important; }
.m .l-vault.set { animation: l-in .4s var(--ease-out); }
.l-tot { padding-top: 14px; border-top: 1px solid var(--color-line); }
.l-tot dt, .l-tot dd { color: var(--color-fg); font-weight: 600; }
.l-go { height: 48px; gap: 10px; font: 600 15px/20px var(--ff-sans); color: var(--color-card); transition: opacity .2s, scale .15s var(--ease-ui), filter .2s, background-color .2s; }
.l-go:disabled { cursor: not-allowed; background: #FFFFFF1A; color: var(--color-muted); filter: none; }
.l-go.busy { background: var(--color-btn); color: var(--color-card); cursor: progress; }
.l-spin { display: none; width: 16px; height: 16px; border-radius: 50%; border: 2px solid #14141433; border-top-color: var(--color-card); animation: spin .7s linear infinite; }
.l-go.busy .l-spin { display: block; }
.l-st:empty { display: none; }
.l-mode { margin: 0; display: flex; align-items: center; justify-content: center; gap: 6px; font: 400 11px/14px var(--ff-mono); color: var(--color-faint); }
.l-mode:empty { display: none; }
.l-mode i { width: 6px; height: 6px; border-radius: 3px; background: #F5C04E; }
.l-mode i.on { background: var(--color-vault); }
.l-copy { padding: 0; border: 0; background: none; font: inherit; color: inherit; cursor: copy; border-bottom: 1px dashed #FFFFFF40; transition: color .15s, border-color .15s; }
.l-copy:hover { border-bottom-color: var(--color-fg); }
.l-copy.ok { color: var(--color-vault); border-bottom-color: transparent; }

/* ---------- success ---------- */
.l-done-in { display: flex; align-items: center; gap: 48px; padding: 40px; border-radius: var(--radius-tile); border: 1px solid #3DDC9740;
  background: radial-gradient(circle farthest-corner at 20% 0% in oklab, oklab(79.7% -0.153 0.057 / 12%) 0%, oklab(19.1% 0 0) 60%); }
.l-done:focus { outline: none; }
.l-done-copy { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.l-done h2 { margin: 0 0 8px; font: 600 32px/38px var(--ff-display); letter-spacing: var(--tracking-display); }
.l-done p { margin: 0; font: 400 16px/24px var(--ff-sans); color: var(--color-muted); max-width: 640px; }
.l-done-kv { margin: 0; display: flex; gap: 24px; flex-wrap: wrap; }
.l-done-kv > div { display: flex; flex-direction: column; gap: 4px; }
.l-done-kv dt { font: 400 11px/14px var(--ff-mono); color: var(--color-muted); }
.l-done-kv dd { margin: 0; font: 400 14px/18px var(--ff-mono); }
.l-done-acts { display: flex; gap: 10px; flex-wrap: wrap; }
.l-done-acts .btn { height: 44px; padding: 0 18px; gap: 8px; font: 500 14px/18px var(--ff-sans); border-color: var(--color-line-strong); color: var(--color-fg); transition: background-color .2s, border-color .2s, scale .15s var(--ease-ui); }
.l-done-acts .btn:hover { background: #FFFFFF0D; border-color: #FFFFFF4D; }
.l-done-acts .btn-primary { font-weight: 600; color: var(--color-card); border-color: transparent; }
.l-done-acts .btn-primary:hover { background: #FFFFFF; }
.l-done-acts .btn:active { scale: .97; }
.l-done-acts [hidden] { display: none; }
.l-tcard { position: static; flex-shrink: 0; }
.l-tcard .tcard-logo { background-color: #0C1A10; }
.m .l-done.on .l-done-copy > * { animation: l-up .6s var(--ease-out) both; }
.m .l-done.on .l-done-copy > :nth-child(2) { animation-delay: .08s; }
.m .l-done.on .l-done-copy > :nth-child(3) { animation-delay: .16s; }
.m .l-done.on .l-done-copy > :nth-child(4) { animation-delay: .24s; }
.m .l-done.on .l-rocket { animation: l-launch 1s var(--spring) both, float-sm 1.6s ease-in-out 1s infinite alternate; }
@keyframes l-launch { from { opacity: 0; translate: 0 40px; scale: .6; } }
@keyframes float-sm { to { translate: 0 -4px; } }

/* ---------- tablet ---------- */
@media (max-width: 1100px) {
  .l-head { flex-direction: column; align-items: start; }
  .l-body { grid-template-columns: minmax(0, 1fr) 360px; gap: 20px; }
}
@media (max-width: 900px) {
  .l-body { grid-template-columns: minmax(0, 1fr); }
  .l-sum { position: static; }
  .l-done-in { flex-direction: column; align-items: stretch; }
  .l-tcard { align-self: center; }
}

/* ---------- mobile (Paper "Mobile 390") ---------- */
@media (max-width: 720px) {
  .l { padding-bottom: 0; }
  .l-head { padding: 24px 0 16px; gap: 14px; align-items: stretch; }
  .l-title h1 { font-size: 30px; line-height: 34px; }
  .l-title h1 { font-size: 0; }
  .l-title h1::before { content: "Launch a token"; font-size: 30px; }
  .l-title p, .l-steps { display: none; }
  .l-steps-m { display: flex; flex-direction: column; gap: 8px; }
  .l-steps-m > div { display: flex; gap: 4px; height: 4px; }
  .l-steps-m i { flex: 1 1 0; border-radius: 2px; background: #FFFFFF1F; position: relative; overflow: hidden; }
  .l-steps-m i::after { content: ""; position: absolute; inset: 0; background: var(--color-fg); scale: 0 1; transform-origin: left; transition: scale .5s var(--ease-out), background-color .3s; }
  .l-steps-m i.cur::after { scale: 1 1; }
  .l-steps-m i.done::after { scale: 1 1; background: var(--color-vault); }
  .l-steps-m p { margin: 0; display: flex; justify-content: space-between; }
  .l-steps-m b { font: 600 13px/16px var(--ff-sans); }
  .l-steps-m span { font: 400 12px/16px var(--ff-mono); color: var(--color-muted); }

  .l-body { gap: 12px; padding-bottom: 0; }
  .l-flow, .l-sum { gap: 12px; }
  .l-card { padding: 14px; gap: 14px; }
  .l-link.l-link { padding: 14px; }
  .l-res { left: 14px; right: 14px; top: calc(100% - 6px); max-height: 60vh; }
  .l-q { padding: 0 12px; }
  .l-q input { font-size: 13px; }
  .l-qs { display: none; }
  .l-paste { padding: 0 12px; }
  .l.picked .l-link { display: none; }

  .l-pv { gap: 12px; }
  .l-pv-top { gap: 12px; align-items: center; }
  .l-pv-logo { width: 44px; height: 44px; border-radius: 10px; }
  .l-pv-tx { gap: 2px; }
  .l-pv-name h2 { font: 600 15px/20px var(--ff-sans); }
  .l-pv-name { gap: 8px; }
  .l-rank { height: auto; padding: 0; background: none; font-size: 10px; }
  .l-pv-url { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .l-pv-tx p, .l-tags { display: none; }
  .l-pv-up { width: 48px; height: 48px; font-size: 12px; }
  .l-gal { height: 72px; gap: 6px; }
  .l-pv-foot { padding-top: 0; border-top: 0; }
  .l-makers .avatars, .l-makers > span:last-child { display: none; }
  .l-makers { font-size: 12px; }
  .l-change { display: inline-flex; height: 28px; padding: 0 10px; border-color: var(--color-line-strong); color: var(--color-fg); background: none; font-size: 12px; }
  .l-site { display: none; }
  .l-taken { flex-direction: column; align-items: stretch; }

  .l-fields { gap: 10px; }
  .l-f-name { flex: 1.25 1 0; }
  .l-ro small { display: none; }
  .l-chips { gap: 6px; flex-wrap: wrap; }
  .l-chips button { flex-basis: calc(25% - 5px); }
  .l-custom { flex-basis: 100%; }
  .l-pct { font-size: 11px; }

  .l-fees .l-h, .l-split-k, .l-notes > div + div { display: none; }
  .l-tl-k span { display: none; }
  .l-tl-k p { font-size: 12px; }
  .l-notes p { font-size: 12px; line-height: 16px; }
  .l-notes img { width: 28px; height: 28px; }

  /* review card → sticky sign bar */
  .l-rev { position: sticky; bottom: 0; z-index: 20; margin: 4px -20px 0; padding: 16px 20px max(20px, env(safe-area-inset-bottom)); gap: 10px; border-radius: 0; border-width: 1px 0 0; background: #141414F2; backdrop-filter: blur(12px); }
  .l-kv > div:not(.l-tot) { display: none; }
  .l-tot { padding-top: 0; border-top: 0; }
  .l-tot dt { font: 400 14px/18px var(--ff-sans); color: var(--color-muted); }
  .l-mode { display: none; }

  .l-done { padding: 20px 0 32px; }
  .l-done-in { padding: 24px 20px; gap: 28px; }
  .l-done h2 { font-size: 26px; line-height: 32px; }
  .l-done p { font-size: 15px; line-height: 22px; }
  .l-done-acts .btn { flex: 1 1 auto; }
  .l-tcard { width: 100%; max-width: 350px; margin: 0; }
}