/* The desk modal (420 px: art, value, the book, burned / paid / minted, four links, Collect) and the Mint page
 * (you send / you receive card, your desks, how it works). Classes follow the original's layout. */
.modal .box.desk{border:1px solid var(--line); -webkit-backdrop-filter:none; backdrop-filter:none}
.dm .top{display:flex; gap:16px; padding:20px}
.dm .th{display:block; width:88px; flex:none; align-self:flex-start; overflow:hidden; border-radius:6px; border:1px solid var(--line)}
.dm .th img{display:block; width:100%; height:auto; aspect-ratio:1; image-rendering:pixelated}
.dm .t1{display:flex; align-items:center; gap:8px}
.dm .t1 b{font-size:15px; font-weight:500; line-height:1; font-variant-numeric:tabular-nums}
.dm .chipst{border-radius:3px; padding:3px 6px; font-size:9px; font-weight:500; text-transform:uppercase; letter-spacing:.08em; background:var(--well); color:var(--muted)}
.dm .chipst.on{background:color-mix(in srgb,var(--lime) 30%,transparent); color:var(--head)}
.dm .t1 .sp{margin-left:auto}
.dm .t1 .mx{margin:-4px -6px 0 0; display:grid; width:28px; height:28px; flex:none; place-items:center; border-radius:4px; font-size:16px; line-height:1; color:var(--muted)}
.dm .t1 .mx:hover{background:var(--well); color:var(--ink)}
.dm .claim{display:inline-flex; height:32px; flex:none; align-items:center; border-radius:4px; padding:0 12px; font-size:12px; font-weight:500; background:var(--fill); color:var(--on-fill); transition:background .15s}
.dm .claim:hover:not(:disabled){background:var(--fill-lit)}
.dm .claim:disabled{cursor:not-allowed; background:var(--track); color:color-mix(in srgb,var(--muted) 70%,transparent)}
.dm .big{margin-top:12px; font-size:28px; font-weight:500; line-height:1; letter-spacing:-.02em; font-variant-numeric:tabular-nums}
.dm .sub{margin-top:6px; font-size:11px; color:var(--muted)}
.dm .sec{border-top:1px solid var(--line)}
.dm .sh{display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding:12px 20px 6px; font-size:10px; text-transform:uppercase; letter-spacing:.1em; color:var(--muted)}
.dm .sh span:first-child{font-weight:500}
.dm .hold{padding:0 20px 12px}
.dm .hr{display:flex; align-items:center; gap:8px; margin:0 -6px; border-radius:3px; padding:5px 6px; font-size:12px}
.dm .hr .tk{width:74px; flex:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:500}
.dm .hr .am{min-width:0; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:right; color:var(--muted); font-variant-numeric:tabular-nums}
.dm .hr .us{width:58px; flex:none; text-align:right; font-variant-numeric:tabular-nums}
.dm .hr.zero .tick{opacity:.35} .dm .hr.zero .tk{color:color-mix(in srgb,var(--muted) 60%,transparent)} .dm .hr.zero .am,.dm .hr.zero .us{color:color-mix(in srgb,var(--muted) 50%,transparent)}
.dm .strip{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.dm .strip>div{min-width:0; padding:12px 16px} .dm .strip>div+div{border-left:1px solid var(--line)}
.dm .strip .l{font-size:10px; color:var(--muted)}
.dm .strip .v{margin-top:4px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; font-weight:500; line-height:1; font-variant-numeric:tabular-nums}
.dm .links{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; padding:12px 20px}
.dm .links a{display:inline-flex; height:32px; min-width:0; align-items:center; justify-content:center; gap:4px; border-radius:4px; border:1px solid var(--line); font-size:11.5px; font-weight:500; color:var(--muted); transition:border-color .15s,background .15s,color .15s}
.dm .links a:hover{border-color:var(--frame); background:var(--well); color:var(--ink)}
.dm .links a svg{opacity:.8}
.dm .links a[aria-disabled=true]{pointer-events:none; border-color:color-mix(in srgb,var(--line) 60%,transparent); color:color-mix(in srgb,var(--muted) 35%,transparent)}

/* mint */
.mt-grid{margin-top:16px; display:grid; gap:16px}
.mcard{overflow:hidden; border-radius:6px; border:1px solid var(--line); background:var(--card)}
.msend{background:var(--well); padding:16px 20px 20px}
.mlab{font-size:10px; font-weight:500; text-transform:uppercase; letter-spacing:.1em; color:var(--muted)}
.msend .rows2{margin-top:8px}
.msend .r{display:flex; align-items:center; gap:12px; border-bottom:1px solid var(--line); padding:12px 0}
.msend .r:last-child{border-bottom:0; padding-bottom:0}
.msend .r .k{min-width:0; flex:1}
.msend .r .k b{display:block; font-size:13px; font-weight:500; line-height:1}
.msend .r .k small{margin-top:6px; display:block; font-size:11px; line-height:1; color:var(--muted); font-variant-numeric:tabular-nums}
.msend .r .k small.bad{color:var(--alert)}
.msend .r .n{flex:none; font-size:18px; font-weight:500; line-height:1; letter-spacing:-.01em; font-variant-numeric:tabular-nums}
.mdiv{position:relative; z-index:1; height:0; border-top:1px solid var(--line)}
.mdiv span{position:absolute; left:50%; top:0; display:grid; width:32px; height:32px; place-items:center; transform:translate(-50%,-50%); border-radius:999px; border:1px solid var(--line); background:var(--card); color:var(--ink); box-shadow:var(--rest)}
.mrecv{padding:24px 20px 20px}
.mrecv .d{margin-top:12px; display:flex; align-items:center; gap:16px}
.mrecv .d .th{display:block; width:88px; flex:none; overflow:hidden; border-radius:6px; border:1px solid var(--line)}
.mrecv .d .th img{display:block; width:100%; height:auto; aspect-ratio:1; image-rendering:pixelated}
.mrecv .d b{display:block; font-size:16px; font-weight:500; line-height:1; font-variant-numeric:tabular-nums}
.mrecv .d p{margin-top:6px; font-size:12px; color:var(--muted)}
.mrecv .d .lg{margin-top:10px; display:flex; align-items:center}
.mrecv .d .lg .tick{box-shadow:0 0 0 1px var(--card),0 0 0 2px var(--line)} .mrecv .d .lg .tick+.tick{margin-left:-4px}
.mrecv .gas{margin-top:16px; font-size:11.5px; line-height:1.625; color:var(--muted)}
.mrecv .gas b{font-weight:400; color:var(--ink); font-variant-numeric:tabular-nums}
.mrecv .go{margin-top:16px}
.mrecv .go p.need{border-radius:4px; border:1px solid var(--line); padding:10px 0; text-align:center; font-size:12.5px; color:var(--muted)}
.mrecv .go button{height:40px; width:100%; border-radius:4px; background:var(--fill); font-size:13px; font-weight:500; color:var(--on-fill); transition:background .15s}
.mrecv .go button:hover:not(:disabled){background:var(--fill-lit)}
.mrecv .go button:disabled{cursor:not-allowed; opacity:.4}
.mrecv .msg{margin-top:12px; font-size:12px; line-height:1.625; color:var(--muted)}
.mrecv .msg.ok{border-radius:4px; border:1px solid #d9f99d; background:#f7fee7; padding:8px 12px; font-size:12.5px; color:#3f6212}
.yd .box{max-height:336px; overflow-y:auto; border-radius:6px; border:1px solid var(--line)}
.yd .box .none{padding:40px 16px; text-align:center; font-size:12.5px; color:var(--muted)}
.yd .drow{display:flex; align-items:center; gap:12px; border-bottom:1px solid var(--line); padding:10px 12px}
.yd .drow:last-child{border-bottom:0}
.yd .drow .th{display:block; width:36px; flex:none; overflow:hidden; border-radius:5px; border:1px solid var(--line)}
.yd .drow .th img{display:block; width:100%; height:auto; aspect-ratio:1; image-rendering:pixelated}
.yd .drow b{flex:none; font-size:13px; font-weight:500; font-variant-numeric:tabular-nums}
.yd .drow .chipst{flex:none; border-radius:3px; padding:3px 6px; font-size:9px; font-weight:500; text-transform:uppercase; letter-spacing:.08em; background:color-mix(in srgb,var(--lime) 30%,transparent); color:var(--head)}
.yd .drow a{margin-left:auto; display:inline-flex; height:32px; flex:none; align-items:center; border-radius:4px; border:1px solid var(--line); padding:0 12px; font-size:12px; font-weight:500; color:var(--muted); transition:border-color .15s,background .15s,color .15s}
.yd .drow a:hover{border-color:var(--frame); background:var(--well); color:var(--ink)}
.how{margin-top:16px}
.how .cols{display:grid; gap:20px 32px}
.how .n{display:flex; align-items:center; gap:8px}
.how .n i{display:flex; width:20px; height:20px; align-items:center; justify-content:center; border-radius:999px; background:var(--fill); color:var(--on-fill); font-size:10px; font-style:normal; font-weight:500; font-variant-numeric:tabular-nums}
.how .n span{font-size:13px; font-weight:500}
.how p{margin-top:8px; font-size:12.5px; line-height:1.625; color:var(--muted)}
.pg .frame-h{margin-bottom:12px; display:flex; align-items:center; justify-content:space-between; gap:12px}
.pg .frame-h h2{font-size:14px; font-weight:500; letter-spacing:-.005em}
.pg .frame-cap{margin-top:12px; font-size:11px; line-height:1.625; color:var(--muted)}
@media (min-width:640px){.how .cols{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1024px){.mt-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start}}