#how-to-buy.q-floor{background:#101b13;min-height:600px;overflow:visible}
#how-to-buy>.q-floor__strip{margin-top:0}
#how-to-buy.q-floor>[data-quit-frame-host],html[data-page="/how-to-buy"] main>[data-quit-frame-host]{visibility:hidden}
.htb{--htb-paper:#f4e7c6;--htb-ink:#17291f;color:var(--htb-paper);background:#101b13;font:400 26px/1.25 var(--t-font-body);isolation:isolate;padding-bottom:20px;overflow:clip}
.htb *{box-sizing:border-box}
.htb [hidden]{display:none!important}
.htb img[data-htb-image]:not([src]){visibility:hidden}
.htb source{display:none}
.htb p{margin:0 0 12px}
.htb h2,.htb h3,.htb h4{font-family:var(--t-font-display);font-weight:700;line-height:1.3;margin:0}
.htb h3,.htb h4{font-size:24px}
.htb-hero{position:relative;isolation:isolate;min-height:154px;padding:40px max(4vw,calc((100% - 1430px)/2));display:flex;align-items:center;overflow:hidden;border-bottom:8px solid #26321b}
.htb-sunset{position:absolute;inset:0;z-index:-1;background:#d59b54 var(--htb-sunset,none) top center/max(2150px,100vw) auto no-repeat}
.htb-hero :is(h1,h2){text-transform:uppercase}
.htb-hero h2{font-family:var(--t-font-pixel,"QUIT Pixel",monospace);font-size:clamp(28px,2.6vw,46px);color:#fff1cf;position:relative;z-index:1;max-width:80%;background:#10251a;border:3px solid #66805a;padding:14px 20px;box-shadow:6px 6px 0 #061109}
.htb-flyers{position:absolute;right:4%;top:-15px;width:240px;height:180px;object-fit:contain}
.htb-body{max-width:1500px;margin:auto;padding:30px 35px 10px}
/* The short guide (owner approval, 23 Oct 2026; comps short-desktop-v1, short-phone-v1): one paper panel under the
   console. From 1024 px three columns, the steps, the walkthrough phone and the QR phone, the two phones the same size
   (--htb-phone); 768 to 1023 px the steps and the video (the QR hand-off is for computers); phones stack them. */
.htb-start{--htb-phone:236px;display:grid;grid-template-columns:minmax(0,1fr) calc(var(--htb-phone) + 40px) calc(var(--htb-phone) + 40px);align-items:start;padding:6px 22px 14px;background:#eee2c3;border:solid transparent;border-width:14px 16px 20px 24px;border-image:var(--htb-paper-image,none) 115 105 170 155 fill/14px 16px 20px 24px stretch;color:var(--htb-ink)}
.htb-three{list-style:none;margin:0 28px 0 0;padding:0;min-width:0}
.htb-simple{display:grid;grid-template-columns:52px minmax(0,1fr);column-gap:18px;padding:12px 0;position:relative}
.htb-simple+.htb-simple{border-top:2px solid #b2a27a}
.htb-number{font:700 44px/1.15 var(--t-font-display);color:#934119;align-self:start}
.htb-simple-copy{min-width:0}
.htb-simple h3{font-size:24px;margin:0 0 4px}
.htb-sentence{font-size:24px;line-height:1.25}
.htb .htb-sentence{margin:0 0 8px}
.htb-simple-action>.htb-plate{min-height:50px;margin:0}
.htb-simple-action{grid-column:2;min-width:0}
.htb-plate{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;min-height:56px;width:100%;max-width:100%;padding:10px 12px;margin:4px 0;border:solid transparent;border-width:8px 7px;border-image:var(--htb-plate,none) 14 12 fill/8px 7px stretch;background:#e9a446;border-radius:0;box-shadow:none;color:#1c200f;font:400 25px/1.1 var(--t-font-body);text-decoration:none;text-align:center;cursor:pointer;transition:filter .15s}
.htb-primary{font-weight:700}
.htb-plate:disabled,.htb-plate[aria-disabled="true"]{border-image:var(--htb-strip,none) 26 46 fill/8px 7px stretch;background:#233c2b;color:#f4edda;cursor:default}
.htb-launch{padding:4px 6px;border:2px solid #081e10;background:#4bf18d;color:#081e10;font:400 18px/1 var(--t-font-body);white-space:nowrap}
.htb-plate:not(:disabled):not([aria-disabled="true"]):hover{filter:brightness(1.12)}
.htb :is(a,button,summary):focus-visible{outline:3px solid #d05216;outline-offset:4px}
.htb-safety-line{font-size:20px;margin:10px 0 0!important;color:#304429}
.htb-nowrap{white-space:nowrap}
.htb-sr{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.htb-handoff{min-width:0;padding:12px 0 0 20px;border-left:2px solid #b2a27a;align-self:stretch;text-align:center}
/* BOUGHT? JOIN THE WALKOUT. (BC02, launch audit 19 Oct 2026): after step 3, below the paper, the site's own X and TELEGRAM as
 Button components (c-btn, ghost) that owner-links.js binds. Row 2 of the start grid, under the steps.
 On phones each button is as wide as its label, which never wraps: FOLLOW ON X and TELEGRAM share a row from 393 px and
 stack, full width, on narrower phones (22 Oct 2026). */
.htb-after{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 56px;align-items:start;margin-top:30px}
.htb-join{display:flex;flex-wrap:wrap;align-items:center;gap:18px 22px;padding:10px 0 0}
.htb .htb-join-title{width:100%;margin:0;color:var(--t-accent,#ff610b);font:700 30px/1.3 var(--t-font-display)}
.htb-join-buttons{display:flex;flex-wrap:wrap;gap:12px}
.htb .htb-join-button{min-width:240px}
.htb-handoff h3{color:var(--htb-ink);font-size:18px;letter-spacing:.03em;text-transform:uppercase;margin-bottom:8px}
.htb .htb-handoff>p{font-size:18px;line-height:1.2;color:#304429;margin:0 0 14px}
/* The QR phone is the video phone's twin: same frame, same 9:16 screen, the code centred on it. */
.htb-qr-phone{width:var(--htb-phone);max-width:100%;margin:0 auto;padding:18px 8px 22px;background:#15321f;position:relative;border:6px solid #050b07;box-shadow:inset 3px 3px 0 #567958,inset -3px -3px 0 #29422a,4px 6px 0 #050b07;border-radius:14px}
.htb-qr-phone .htb-phone-speaker{top:6px;left:calc(50% - 18px);width:36px;height:4px}
.htb-qr-phone .htb-phone-home{bottom:4px;left:calc(50% - 9px);width:18px;height:11px;border-width:2px;border-radius:4px}
.htb-phone-speaker{position:absolute;left:calc(50% - 24px);top:9px;width:48px;height:5px;background:#070f08;box-shadow:0 2px 0 #688d63}
.htb-phone-home{position:absolute;left:calc(50% - 11px);bottom:7px;width:22px;height:13px;border:3px solid #739363;border-radius:5px}
.htb-qr{display:flex;align-items:center;justify-content:center;aspect-ratio:9 / 16;padding:12px;border-radius:4px;background:#030805}
.htb-qr svg{display:block;width:100%;height:auto;margin:0}
.htb-computer{display:inline-flex;align-items:center;min-height:48px;font-size:17px;color:#304429;text-underline-offset:5px;margin-top:10px}
.htb-help{min-width:0}
/* CA-FOLD sweep S02 (20 Oct 2026): with a live mint the floor opens with the address and the buy links for a holder
   who already has a wallet, then the three newcomer steps. Since 22 Oct 2026 the row is a copy of the approved console
   (quickbuy-desk-cx1.png at 1440, quickbuy-phone-cx1.png at 390): the CRT buy bay, the brass proof panel and the button
   tray are nine-slices cut from those images (how-to-buy-art/quick-sources.json); every word is live text. --q is one pixel
   of the approved image (the desktop console is 2080 px wide, the phone consoles 955), so the console keeps the design's
   proportions at any width. The pixel title is set taller than it is wide (scale) because the design's is; every other
   word is in the readable display face at its natural shape (owner order, 25 Oct 2026: the pixel face only for really big
   primary headings), sized to the height the stretched pixel lettering had.
   The row's height is the buy bay's, whose parts all have fixed sizes; the proof panel is size-contained, so no font
   swap or rewrap in it can change the row. The art
   arrives with the guide's other art (data-htb-art="loaded"); until then the same boxes show flat fills. */
/* The title takes the pixel face through its token (--t-font-pixel; its file is preloaded with the page), in a box of
   fixed height, so nothing outside it moves when the face swaps in. Its measure breaks it after the question, as the
   design does: in Jersey 20 HAVE A SOLANA WALLET? is 9.5 em and the line with BUY 11.25 em (measured 26 Oct 2026). The display faces have fitted stand-ins
   (display.css), and the body text has the site's fitted fallback (body.css). */
.htb-quick{--q:calc(100cqi / 2080);--qb-display:var(--t-font-display,"QUIT Display",monospace);--qb-pixel:var(--t-font-pixel,"QUIT Pixel",monospace);container-type:inline-size;position:relative;display:grid;grid-template-columns:minmax(0,1392fr) minmax(0,688fr);grid-template-areas:"buy proof" "links links";margin:0 0 30px}
.htb-quick-proof{display:contents}
/* Variant B's added terminal label and Phantom row are reserved before art or fonts load. The desktop buy bay
   grows from 597.4 to 652.4 image pixels; the proof and tray retain their existing styles and materials. */
.htb-quick-buy{grid-area:buy;display:flex;flex-direction:column;justify-content:space-between;min-width:0;min-height:calc(652.4*var(--q));border:solid #1b1e1a;border-width:calc(74*var(--q)) calc(43*var(--q)) calc(69*var(--q)) calc(63*var(--q));padding:0 calc(3*var(--q)) calc(3*var(--q)) calc(4*var(--q));background:#03160e}
.htb .htb-quick-title{margin:calc(-14*var(--q)) 0 calc(74*var(--q)) calc(4*var(--q));color:#fc5404;font:700 calc(84*var(--q))/calc(66.7*var(--q)) var(--qb-pixel);letter-spacing:0;text-transform:uppercase;max-width:10.3em;height:calc(133.4*var(--q));-webkit-text-stroke:calc(2*var(--q)) #fc5404;text-shadow:calc(8*var(--q)) calc(9*var(--q)) 0 #160100;scale:1 1.47;transform-origin:0 0}
.htb-quick-address{display:flex;align-items:center;gap:calc(19*var(--q));min-width:0;margin:0 0 calc(16*var(--q))}
.htb-quick-mint{flex:1 1 auto;min-width:0;display:flex;align-items:center;min-height:calc(58*var(--q));padding:calc(4*var(--q)) calc(16*var(--q)) 0 calc(27*var(--q));border:calc(3*var(--q)) solid #18eb7b;border-radius:0;background:#000806;color:#10f884;font:400 calc(45.6*var(--q))/1 var(--t-font-body);overflow-wrap:anywhere;word-break:break-all;-webkit-user-select:all;user-select:all;cursor:text}
.htb .htb-quick-copy{flex:none;width:calc(198*var(--q));min-height:0;height:calc(58*var(--q));margin:0;padding:0;border-width:calc(8*var(--q)) calc(7*var(--q));border-image-width:1;color:#050200;font:400 calc(44*var(--q))/1 var(--t-font-body)}
.htb-quick-terminals{min-width:0}
.htb-terminal-heading{display:flex;align-items:center;gap:calc(24*var(--q));height:calc(40*var(--q));margin-bottom:calc(8*var(--q))}
.htb .htb-terminal-title{margin:0;color:var(--t-green,#3dff7a);font:700 calc(25.5*var(--q))/1.2 var(--qb-display)}
.htb-quick-preferred{flex:none;display:inline-block;padding:0 calc(7*var(--q));border:calc(3*var(--q)) solid currentColor;outline:calc(1*var(--q)) dashed currentColor;outline-offset:calc(-6*var(--q));border-radius:calc(4*var(--q));color:#ff3535;font:700 calc(38*var(--q))/1 var(--t-font-body);transform:rotate(-10deg)}
.htb-quick-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(21*var(--q))}
.htb .htb-quick-links .htb-plate{width:100%;min-width:0;min-height:0;height:calc(115*var(--q));margin:0;padding:0 calc(10*var(--q));gap:calc(20*var(--q));flex-wrap:nowrap;justify-content:flex-start;border-width:calc(8*var(--q)) calc(7*var(--q));border-image:var(--htb-plate,none) 14 12 /1 stretch;background:var(--t-accent,#ff610b);color:#050200;font:400 calc(34*var(--q))/1 var(--t-font-body);white-space:nowrap}
.htb-terminal-mark{flex:none;display:grid;place-items:center;width:calc(96*var(--q));height:calc(96*var(--q));background:#080a0c;border-radius:calc(12*var(--q))}
.htb-terminal-mark img{display:block;width:100%;height:100%;object-fit:contain}
.htb .htb-quick-phantom{min-height:0;height:calc(64*var(--q));margin:calc(12*var(--q)) 0 0;padding:0 calc(12*var(--q));gap:calc(30*var(--q));flex-wrap:nowrap;border:calc(3*var(--q)) solid var(--t-accent,#ff610b);border-image:none;background:#00110c;color:var(--t-accent,#ff610b);font:700 calc(36*var(--q))/1 var(--t-font-body);white-space:nowrap}
.htb .htb-quick-phantom .htb-wallet-icon{width:calc(48*var(--q));height:calc(48*var(--q));border-radius:0}
.htb .htb-terminal:hover,.htb .htb-quick-phantom:hover{filter:none;box-shadow:inset 0 0 0 1px #f8f2d4}
.htb-quick-trust{grid-area:proof;position:relative;display:flex;flex-direction:column;min-width:0;contain:size;margin:0;border:solid #2b261b;border-width:calc(74*var(--q)) calc(74*var(--q)) calc(40*var(--q)) calc(80*var(--q));padding:0 0 calc(3*var(--q)) calc(8*var(--q));background:#040d0a}
.htb .htb-quick-trust-head{margin:calc(-6*var(--q)) 0 calc(3.4*var(--q));color:#12f383;font:700 calc(30*var(--q))/1 var(--qb-display);letter-spacing:.02em}
.htb .htb-quick-trust-sub{margin:calc(3.4*var(--q)) 0 calc(5.4*var(--q));color:#f8f2d4;font:700 calc(25*var(--q))/1 var(--qb-display);letter-spacing:.02em}
.htb-quick-facts{flex:1 0 auto;list-style:none;margin:calc(21.7*var(--q)) calc(-4*var(--q)) calc(-3*var(--q)) calc(-17*var(--q));padding:0 calc(4*var(--q)) 0 calc(17*var(--q));border-top:calc(5*var(--q)) solid #8c7752;background:#0d1410}
.htb-quick-facts li{display:flex;flex-direction:column;align-items:flex-start;margin:0;padding:0}
.htb-quick-facts li+li::before{content:"";display:block;width:calc(513*var(--q));max-width:100%;height:calc(3.5*var(--q));margin:calc(9*var(--q)) 0 0;background:#76654b}
.htb-quick-facts b{position:relative;display:block;margin:calc(1*var(--q)) 0 calc(6.4*var(--q));padding-right:.6em;color:#f84800;font:700 calc(44*var(--q))/1 var(--qb-display);text-shadow:calc(3*var(--q)) calc(3*var(--q)) 0 #020504}
/* The % sits in a box of its own after the figure's reserved width (how-to-buy.js figureEm), in the figure's face. */
.htb-quick-facts b[style]{width:calc(var(--fig) + .6em)}
.htb-quick-facts .htb-quick-pct{position:absolute;right:0;top:0;width:.6em;font:inherit;font-style:normal}
.htb-quick-facts span{display:block;margin:calc(4*var(--q)) 0 0;color:#f8f8ee;font:400 max(13px,calc(26*var(--q)))/1 var(--t-font-body)}
.htb-quick-stamp{display:none;position:absolute;right:calc(-35*var(--q));top:calc(-17*var(--q));width:calc(214*var(--q));height:calc(126*var(--q));pointer-events:none}
.htb-quick-trust-links{grid-area:links;display:flex;gap:calc(21*var(--q));min-width:0;border:solid #161a17;border-width:calc(24*var(--q)) calc(58*var(--q)) calc(44*var(--q)) calc(65*var(--q));padding:0 calc(3*var(--q)) calc(2*var(--q)) calc(2*var(--q));background:#00110c}
.htb .htb-quick-badge{flex:680 1 0;min-width:0;display:flex;align-items:center;justify-content:center;height:calc(61*var(--q));margin:0;padding:0 calc(10*var(--q));border:solid #20f480;border-width:calc(3*var(--q));background:#001209;color:#18f484;font:700 max(12px,calc(27*var(--q)))/1 var(--qb-display);letter-spacing:.02em;text-align:center;text-decoration:none;white-space:nowrap}
.htb .htb-quick-badge:nth-child(2){flex-grow:565}
.htb .htb-quick-badge:nth-child(3){flex-grow:665}
.htb .htb-quick-badge:hover{background:#06301b}
.htb[data-htb-art="loaded"] .htb-quick-buy{border-image:url(/runtime/quit/how-to-buy-art/quick-desk-bay.webp) 74 43 69 63 stretch;background:#03160e url(/runtime/quit/how-to-buy-art/quick-glass.webp) 0 0/calc(240*var(--q)) calc(120*var(--q))}
.htb[data-htb-art="loaded"] .htb-quick-trust{border-image:url(/runtime/quit/how-to-buy-art/quick-desk-proof.webp) 74 74 40 80 stretch}
.htb[data-htb-art="loaded"] .htb-quick-trust-links{border-image:url(/runtime/quit/how-to-buy-art/quick-desk-tray.webp) 24 58 44 65 stretch}
.htb[data-htb-art="loaded"] .htb-quick-stamp{display:block;background:url(/runtime/quit/how-to-buy-art/quick-stamp.webp) center/100% 100% no-repeat}
/* Under 1024 px the phone consoles: buy over proof, four facts two by two. The terminals stack below 768 px.
   --q is one pixel of the phone image, capped so a tablet gets the phone layout at a sensible size. */
@media(max-width:1023px){
 .htb-quick{--q:min(calc(100cqi / 955),.62px);display:block;margin:0 0 18px}
 .htb-quick-buy{min-height:calc(593*var(--q) + max(52px,80*var(--q)) + max(60px,150*var(--q)) + max(56px,128*var(--q)));border-width:calc(75*var(--q)) calc(37*var(--q)) calc(39*var(--q)) calc(38*var(--q));padding:0 calc(8*var(--q)) calc(7*var(--q)) calc(2*var(--q));background:#05120e}
 .htb .htb-quick-title{height:calc(118*var(--q));margin:calc(-7.4*var(--q)) 0 calc(33.4*var(--q)) calc(16*var(--q));font-size:calc(55*var(--q));line-height:calc(59*var(--q));-webkit-text-stroke-width:calc(1.5*var(--q));text-shadow:calc(5*var(--q)) calc(6*var(--q)) 0 #160100;scale:1 1.05}
 .htb-quick-address{align-items:stretch;gap:calc(22*var(--q));margin:0 0 calc(25*var(--q))}
 .htb-quick-mint{min-height:calc(169*var(--q));padding:0 calc(10*var(--q)) 0 calc(6*var(--q));border-style:solid;border-color:#151915;border-width:calc(31*var(--q)) calc(28*var(--q)) calc(28*var(--q)) calc(30*var(--q));background:#000b07;font-size:calc(55*var(--q));line-height:calc(55*var(--q))}
 .htb .htb-quick-copy{position:relative;align-self:center;width:calc(184*var(--q));height:calc(125*var(--q));margin:0 calc(5*var(--q)) 0 0;font-size:calc(56*var(--q))}
 .htb .htb-quick-copy::before{content:"";position:absolute;inset:calc(-8px - 14*var(--q)) calc(-7px - 13*var(--q)) calc(-8px - 11*var(--q)) calc(-7px - 12*var(--q));border:solid transparent;border-width:calc(13*var(--q));pointer-events:none}
 .htb-quick-terminals{padding:calc(20*var(--q));border:calc(26*var(--q)) solid #1b1e1a;background:#00110c}
 .htb-terminal-heading{height:max(52px,calc(80*var(--q)));margin-bottom:calc(18*var(--q))}
 .htb .htb-terminal-title{font-size:max(11px,calc(31*var(--q)));line-height:1.3}
 .htb-quick-preferred{font-size:max(24px,calc(50*var(--q)))}
 .htb-quick-links{gap:calc(18*var(--q))}
 .htb .htb-quick-links .htb-plate{height:max(60px,calc(150*var(--q)));font-size:calc(32*var(--q));gap:calc(14*var(--q))}
 .htb-terminal-mark{width:calc(70*var(--q));height:calc(70*var(--q))}
 .htb .htb-quick-phantom{height:max(56px,calc(128*var(--q)));margin-top:calc(24*var(--q));border-width:2px;font-size:max(20px,calc(50*var(--q)))}
 .htb .htb-quick-phantom .htb-wallet-icon{width:max(32px,calc(86*var(--q)));height:max(32px,calc(86*var(--q)))}
 .htb-quick-proof{display:block;margin:calc(9*var(--q)) 0 0;border:solid #1b1e1a;border-width:calc(64*var(--q)) calc(33*var(--q)) calc(60*var(--q)) calc(34*var(--q));padding:0 0 calc(5*var(--q));background:#05110d}
 .htb-quick-trust{contain:none;border:0;padding:0;background:none}
 .htb .htb-quick-trust-head{margin:calc(-4.4*var(--q)) 0 calc(2.9*var(--q)) calc(33*var(--q));font-size:calc(40*var(--q))}
 .htb .htb-quick-trust-sub{margin:calc(7.1*var(--q)) 0 calc(2.9*var(--q)) calc(33*var(--q));font-size:calc(40*var(--q))}
 .htb-quick-facts{display:grid;grid-template-columns:1fr 1fr;margin:calc(13.5*var(--q)) 0 0;padding:0;border:solid #151a16;border-width:calc(26*var(--q));background:#04110d}
 .htb-quick-facts li{min-width:0;padding:calc(6*var(--q)) calc(8*var(--q)) calc(18*var(--q)) calc(10*var(--q))}
 .htb-quick-facts li:nth-child(even){border-left:calc(2*var(--q)) solid #2a332d}
 .htb-quick-facts li:nth-child(n+3){border-top:calc(2*var(--q)) solid #2a332d}
 .htb-quick-facts li+li::before{content:none}
 .htb-quick-facts b{margin:calc(-12*var(--q)) 0 calc(16*var(--q));font-size:calc(80*var(--q));text-shadow:calc(5*var(--q)) calc(5*var(--q)) 0 #020504}
 .htb-quick-facts span{margin:calc(8*var(--q)) 0 0;font-size:max(14px,calc(37*var(--q)))}
 .htb-quick-stamp{right:calc(12*var(--q));top:calc(-23*var(--q));width:calc(293*var(--q));height:calc(131*var(--q))}
 .htb-quick-trust-links{flex-direction:column;gap:calc(20*var(--q));margin:calc(13*var(--q)) 0 0;padding:0 calc(7*var(--q));border:0;background:none}
 .htb .htb-quick-badge{flex:none;height:calc(84*var(--q));margin:0;border-width:calc(5*var(--q));font-size:max(13px,calc(36*var(--q)))}
 .htb[data-htb-art="loaded"] .htb-quick-buy{border-image:url(/runtime/quit/how-to-buy-art/quick-phone-buy.webp) 75 37 39 38 stretch;background:#05120e url(/runtime/quit/how-to-buy-art/quick-phone-glass.webp) 0 0/calc(210*var(--q)) calc(75*var(--q))}
 .htb[data-htb-art="loaded"] .htb-quick-mint{border-image:url(/runtime/quit/how-to-buy-art/quick-phone-well.webp) 31 28 28 30 stretch}
 .htb[data-htb-art="loaded"] .htb-quick-terminals{border-image:url(/runtime/quit/how-to-buy-art/quick-phone-facts.webp) 26 stretch}
 .htb[data-htb-art="loaded"] .htb-quick-copy::before{border-image:url(/runtime/quit/how-to-buy-art/quick-phone-well.webp) 31 28 28 30 stretch}
 .htb[data-htb-art="loaded"] .htb-quick-proof{border-image:url(/runtime/quit/how-to-buy-art/quick-phone-proof.webp) 64 33 60 34 stretch;background:#05110d url(/runtime/quit/how-to-buy-art/quick-phone-glass.webp) 0 0/calc(210*var(--q)) calc(75*var(--q))}
 .htb[data-htb-art="loaded"] .htb-quick-trust{border-image:none}
 .htb[data-htb-art="loaded"] .htb-quick-facts{border-image:url(/runtime/quit/how-to-buy-art/quick-phone-facts.webp) 26 stretch}
 .htb[data-htb-art="loaded"] .htb-quick-trust-links{border-image:none}
 .htb[data-htb-art="loaded"] .htb-quick-stamp{background-image:url(/runtime/quit/how-to-buy-art/quick-stamp-phone.webp)}
}
/* The trading bot adds a third button to the tray when its floor mounts (trading-bot.js addJump, about 5 s in on a
   phone), and under 1024 px, where the tray stacks, that row pushed every floor below down 37 to 65 px (24 Oct 2026).
   On the home floor the row is kept from the first paint, empty and the size of a badge, until the button is in; it goes
   when the community block answers without it, or 15 s after the first paint. Only when scripts run. */
@keyframes htb-jump-release{to{position:absolute}}
@media(max-width:1023px){html[data-boot]:not([data-quit-community]) #how-to-buy .htb-quick-trust-links:not(:has([data-bot-jump]))::after{content:"";flex:none;height:calc(84*var(--q));margin:0;animation:htb-jump-release 0s linear 15s forwards!important}}
@media(max-width:767px){
 /* Reserve all three terminal rows, the label and the Phantom key on first paint. */
 .htb-quick-buy{min-height:calc(629*var(--q) + max(52px,80*var(--q)) + 3*max(60px,150*var(--q)) + max(56px,128*var(--q)))}
 .htb-quick-links{grid-template-columns:minmax(0,1fr)}
 .htb .htb-quick-links .htb-plate{font-size:max(22px,calc(56*var(--q)))}
 .htb-terminal-mark{width:max(40px,calc(110*var(--q)));height:max(40px,calc(110*var(--q)))}
}
/* NEW TO CRYPTO? BUY WITH A CARD. (the owner's money design set, approved 26 Oct 2026; comps htb-desktop and
   htb-phone): the panel above the console, for a visitor with no wallet app (how-to-buy-card.js).
   Its frame is the console's own CRT bay (quick-desk-bay, quick-phone-buy), so the two panels read as one set; --q is
   the console's unit, --k one pixel of the approved comp (the desktop panel is 1543 px wide in htb-desktop.png, the phone
   panel 817 in htb-phone.png), so the panel keeps the design's proportions at any width. Every row has a fixed height:
   no font swap, key paint or sign-in changes the panel's height, so the floor's first paint holds and nothing below moves.
   The sign-in box is the header panel's own form (account.css), set to the comp's sizes here; the form's lines the comp
   does not show stay hidden. */
.htb-card{--q:calc(100cqi / 2080);--k:calc(100cqi / 1543);--kc-display:var(--t-font-display,"QUIT Display",monospace);--kc-pixel:var(--t-font-pixel,"QUIT Pixel",monospace);--kc-green:#18e07a;--kc-paper:#f4f0e0;container-type:inline-size;position:relative;margin:0 0 30px}
/* The two rows have fixed heights, the title's (its box and margins) and the three steps', so nothing in the sign-in side
   (a line that wraps on one platform's type and not another's) can make the panel taller. */
.htb-card-bay{display:grid;grid-template-columns:minmax(0,865fr) minmax(0,570fr);grid-template-rows:calc(100.7*var(--q)) calc(3*87*var(--k) + 2*11*var(--k));grid-template-areas:"title side" "steps side";column-gap:calc(25*var(--k));min-width:0;border:solid #1b1e1a;border-width:calc(74*var(--q)) calc(43*var(--q)) calc(69*var(--q)) calc(63*var(--q));padding:0 calc(3*var(--q)) calc(3*var(--q)) calc(4*var(--q));background:#03160e}
.htb[data-htb-art="loaded"] .htb-card-bay{border-image:url(/runtime/quit/how-to-buy-art/quick-desk-bay.webp) 74 43 69 63 stretch;background:#03160e url(/runtime/quit/how-to-buy-art/quick-glass.webp) 0 0/calc(240*var(--q)) calc(120*var(--q))}
/* The title in the console title's own face and finish (.htb-quick-title), one line over the steps. */
.htb .htb-card-title{grid-area:title;align-self:start;margin:calc(-14*var(--q)) 0 calc(48*var(--q)) calc(4*var(--q));height:calc(66.7*var(--q));color:#fc5404;font:700 calc(80*var(--q))/calc(66.7*var(--q)) var(--kc-pixel);letter-spacing:0;text-transform:uppercase;white-space:nowrap;-webkit-text-stroke:calc(2*var(--q)) #fc5404;text-shadow:calc(8*var(--q)) calc(9*var(--q)) 0 #160100;scale:1 1.47;transform-origin:0 0}
.htb-card-steps{grid-area:steps;display:grid;grid-template-rows:repeat(3,calc(87*var(--k)));row-gap:calc(11*var(--k));margin:0;padding:0;list-style:none;min-width:0}
.htb-card-step{display:grid;grid-template-columns:calc(106*var(--k)) minmax(0,1fr);column-gap:calc(2*var(--k));min-width:0;margin:0;padding:0}
/* Each step is two riveted plates, the site's bay plate (deck-art/bay.webp, as the contract bar and the sign-in panel). */
.htb-card-number,.htb-card-copy{min-width:0;border:solid #20261f;border-width:calc(14*var(--k)) calc(16*var(--k));border-image:url(/runtime/quit/deck-art/bay.webp) 44 50 fill/calc(14*var(--k)) calc(16*var(--k)) stretch;background:#020d08}
.htb-card-number{display:grid;place-items:center;padding:0 0 calc(4*var(--k));color:#ff610b;font:700 calc(84*var(--k))/1 var(--kc-pixel);-webkit-text-stroke:calc(3*var(--k)) currentColor;text-shadow:calc(5*var(--k)) calc(5*var(--k)) 0 #2a0b00}
.htb-card-copy{display:flex;flex-direction:column;justify-content:center;gap:calc(9*var(--k));padding:0 calc(24*var(--k)) calc(3*var(--k))}
.htb .htb-card-name{display:flex;align-items:center;gap:calc(14*var(--k));margin:0;color:var(--kc-green);font:700 calc(34*var(--k))/1 var(--kc-display);letter-spacing:.07em;-webkit-text-stroke:calc(.6*var(--k)) currentColor;white-space:nowrap;text-shadow:0 0 calc(8*var(--k)) #01f98244}
.htb .htb-card-line{margin:0;color:var(--kc-paper);font:400 calc(34*var(--k))/1.1 var(--t-font-body);white-space:nowrap;overflow:hidden}
/* Signed in, step 1 is finished the way the whitelist's steps are (exit-lab.js): green, with DONE beside its name. */
.htb-card-done{display:none;padding:calc(5*var(--k)) calc(8*var(--k)) calc(3*var(--k));border:max(2px,calc(2*var(--k))) solid currentColor;background:rgb(37 220 113/.12);font:inherit;font-size:.72em;letter-spacing:.06em}
.htb-card[data-htb-card-state="in"] [data-htb-card-step="1"] .htb-card-done{display:inline-block}
.htb-card[data-htb-card-state="in"] [data-htb-card-step="1"] .htb-card-number{color:var(--kc-green);text-shadow:calc(4*var(--k)) calc(4*var(--k)) 0 #012a14}
.htb-card[data-htb-card-state="in"] [data-htb-card-step="1"] :is(.htb-card-number,.htb-card-copy){box-shadow:inset 0 0 0 max(2px,calc(2*var(--k))) #18e07a88}
/* The sign-in side: a riveted box beside the steps, from the title's top to the last step's foot. */
.htb-card-side{grid-area:side;position:relative;display:flex;flex-direction:column;min-width:0;min-height:0;border:solid #1d231c;border-width:calc(22*var(--k)) calc(24*var(--k));border-image:url(/runtime/quit/deck-art/bay.webp) 44 50 fill/calc(22*var(--k)) calc(24*var(--k)) stretch;padding:calc(2*var(--k)) 0 0;background:#020c08}
.htb .htb-card-signin.qa{position:static;display:block;max-height:none;margin:0;padding:0;border:0;border-image:none;background:none;overflow:visible;font-size:calc(18*var(--k))}
.htb-card-signin :is(.qa-funnel,.qa-intro,.qa-wallet-note,.qa-wallet-heading,.qa-wallet-keys,.qa-wallet-help,.qa-footnote){display:none!important}
.htb-card-signin .qa-methods{gap:calc(6*var(--k));margin:0 0 calc(8*var(--k))}
.htb-card-signin .qa-methods button{min-height:0;height:calc(46*var(--k));padding:0;border-width:max(3px,calc(4*var(--k)));font-size:calc(27*var(--k));letter-spacing:.06em}
.htb-card-signin [data-login-form]{display:block}
.htb .htb-card-signin input{height:calc(48*var(--k));padding:0 calc(18*var(--k));border-width:max(4px,calc(5*var(--k)));font-size:calc(20*var(--k));line-height:1}
.htb-card-signin .qa-send,.htb-card-signin .qa-continue,.htb .htb-card-buy{position:relative;width:100%;min-height:0;height:calc(58*var(--k));margin:calc(12*var(--k)) 0 0;padding:0 calc(30*var(--k)) calc(5*var(--k));font-size:calc(35*var(--k));letter-spacing:.1em}
/* Four screws in the orange key's face, as the funnel's keys have them (go-door.css .qfd-button). */
.htb-card-signin .qa-orange::before,.htb .htb-card-buy::before{content:"";position:absolute;inset:calc(9*var(--k)) calc(12*var(--k)) calc(16*var(--k));pointer-events:none;
 --kc-rivet:radial-gradient(circle,#2a1204 0 1.6px,#ffc68f 2.2px 2.8px,#0000 3.4px);
 background:var(--kc-rivet) 0 0/8px 8px no-repeat,var(--kc-rivet) 100% 0/8px 8px no-repeat,var(--kc-rivet) 0 100%/8px 8px no-repeat,var(--kc-rivet) 100% 100%/8px 8px no-repeat}
.htb-card-signin .qa-or{gap:calc(18*var(--k));margin:calc(12*var(--k)) 0;font-size:calc(19*var(--k));line-height:1}
.htb-card-signin .qa-social-keys{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:calc(12*var(--k));margin:0}
.htb-card-signin :is(.qa-google,.qa-x){min-height:0;height:calc(56*var(--k))}
.htb-card-signin .qa-google{padding-left:calc(70*var(--k));font-size:max(13px,calc(19*var(--k)))}
.htb-card-signin .qa-google-g{width:calc(48*var(--k))}
.htb-card-signin .qa-x{font-size:calc(20*var(--k))}
/* No key on screen (an in-app browser hides Google, X is off): no OR either. */
.htb-card[data-htb-card-keys="0"] .htb-card-signin .qa-or{display:none}
/* The six-digit code and CONTINUE take the room of the tabs, the OR and the keys, so the box keeps its height; changing
   the address hides the code and brings them back (account-panel.js). */
.htb-card-signin:has([data-code-form]:not([hidden])) :is(.qa-methods,.qa-or,.qa-social-keys){display:none}
.htb-card-signin legend{margin:calc(8*var(--k)) 0 calc(6*var(--k));font-size:calc(17*var(--k))}
.htb-card-signin .qa-digits{gap:calc(8*var(--k))}
.htb .htb-card-signin .qa-digits input{height:calc(48*var(--k));padding:0;font-size:calc(27*var(--k))}
/* What the form says (SENDING CODE, CODE SENT, a refusal) sits where the line under the box is, so no message moves it. */
.htb-card-signin .qa-status{position:absolute;left:0;right:0;bottom:0;margin:0;padding:0;color:#ffcf4b;font:400 calc(15.4*var(--k))/1.25 var(--t-font-body);letter-spacing:0;text-align:center}
.htb-card[data-htb-card-state="out"] .htb-card-side:has(.qa-status:not(:empty)) .htb-card-note{visibility:hidden}
.htb .htb-card-note{margin:auto 0 0;padding:0;color:var(--kc-paper);font:400 calc(15.4*var(--k))/1.25 var(--t-font-body);letter-spacing:0;text-align:center}
/* Signed in: the box gives its place to BUY $QUIT, the funnel's key, at the same height. */
.htb-card-go{display:none}
.htb-card[data-htb-card-state="in"] .htb-card-signin{display:none}
.htb-card[data-htb-card-state="in"] .htb-card-go{display:flex;flex:1 1 auto;flex-direction:column;justify-content:center}
.htb .htb-card-buy{display:flex;align-items:center;justify-content:center;height:calc(76*var(--k));margin:0;border:0 solid transparent;border-image:url(/runtime/quit/deck-art/key-orange.webp) 22 24 34 fill/10px 12px 13px stretch;color:#100a00;font:700 calc(44*var(--k))/1 var(--kc-display);text-decoration:none;text-align:center;touch-action:manipulation}
.htb .htb-card-buy:active{border-image-source:url(/runtime/quit/deck-art/key-orange-down.webp);transform:translateY(2px)}
.htb .htb-card-buy:hover{filter:brightness(1.08)}
.htb .htb-card :focus-visible{outline:3px solid #fff0ad;outline-offset:3px}
/* Under 1024 px the phone panel (htb-phone.png): the console's phone bay, the title on two lines, the steps as numbered
   lines, and the sign-in under them, its keys one under the other. --k is one pixel of the phone comp, capped so a
   tablet gets the phone layout at a sensible size. */
@media(max-width:1023px){
 .htb-card{--q:min(calc(100cqi / 955),.62px);--k:min(calc(100cqi / 817),.7246px);margin:0 0 18px}
 .htb-card-bay{display:block;border-width:calc(75*var(--q)) calc(37*var(--q)) calc(39*var(--q)) calc(38*var(--q));padding:0 calc(32*var(--k)) calc(24*var(--k)) calc(30*var(--k));background:#05120e}
 .htb[data-htb-art="loaded"] .htb-card-bay{border-image:url(/runtime/quit/how-to-buy-art/quick-phone-buy.webp) 75 37 39 38 stretch;background:#05120e url(/runtime/quit/how-to-buy-art/quick-phone-glass.webp) 0 0/calc(210*var(--q)) calc(75*var(--q))}
 .htb .htb-card-title{max-width:7.5em;height:calc(140*var(--k));margin:calc(-6*var(--k)) 0 calc(40*var(--k)) 0;font-size:calc(94*var(--k));line-height:calc(70*var(--k));white-space:normal;-webkit-text-stroke-width:calc(2*var(--k));text-shadow:calc(6*var(--k)) calc(7*var(--k)) 0 #160100;scale:none}
 .htb-card-steps{grid-template-rows:repeat(3,calc(96*var(--k)));row-gap:calc(22*var(--k));margin:0 0 calc(40*var(--k))}
 .htb-card-step{grid-template-columns:calc(100*var(--k)) minmax(0,1fr);column-gap:calc(12*var(--k))}
 .htb-card-number,.htb-card-copy{border:0;border-image:none;background:none}
 .htb-card-number{place-items:start center;padding:0;font-size:calc(120*var(--k));line-height:.84;-webkit-text-stroke-width:calc(4*var(--k))}
 .htb-card-copy{justify-content:flex-start;gap:calc(12*var(--k));padding:calc(2*var(--k)) 0 0}
 .htb .htb-card-name{font-size:max(17px,calc(40*var(--k)))}
 .htb .htb-card-line{font-size:max(14px,calc(28*var(--k)));white-space:normal;overflow:visible}
 .htb-card[data-htb-card-state="in"] [data-htb-card-step="1"] :is(.htb-card-number,.htb-card-copy){box-shadow:none}
 .htb-card-side{border:0;border-image:none;padding:0;background:none}
 .htb-card-signin .qa-methods{gap:calc(10*var(--k));margin:0 0 calc(14*var(--k))}
 .htb-card-signin .qa-methods button{height:max(36px,calc(68*var(--k)));font-size:max(17px,calc(34*var(--k)))}
 .htb .htb-card-signin input{height:max(44px,calc(92*var(--k)));padding:0 calc(30*var(--k));font-size:max(16px,calc(34*var(--k)))}
 .htb-card-signin .qa-send,.htb-card-signin .qa-continue{height:max(48px,calc(105*var(--k)));margin-top:calc(18*var(--k));font-size:max(22px,calc(52*var(--k)))}
 .htb-card-signin .qa-or{margin:calc(24*var(--k)) 0;font-size:max(13px,calc(26*var(--k)))}
 .htb-card-signin .qa-social-keys{grid-template-columns:minmax(0,1fr);gap:calc(17*var(--k))}
 .htb-card-signin :is(.qa-google,.qa-x){height:max(44px,calc(95*var(--k)))}
 .htb-card-signin .qa-google{font-size:max(15px,calc(30*var(--k)))}
 .htb .htb-card-signin .qa-digits input{height:max(44px,calc(88*var(--k)));font-size:max(19px,calc(40*var(--k)))}
 /* The box keeps the height of its signed-out keys whatever it shows (the code, a message, BUY $QUIT once signed in). */
 .htb-card-side{--kc-box:calc(max(36px,calc(68*var(--k))) + 14*var(--k) + max(44px,calc(92*var(--k))) + 18*var(--k) + max(48px,calc(105*var(--k))))}
 .htb-card[data-htb-card-keys="1"] .htb-card-side{--kc-box:calc(max(36px,calc(68*var(--k))) + 14*var(--k) + max(44px,calc(92*var(--k))) + 18*var(--k) + max(48px,calc(105*var(--k))) + 48*var(--k) + max(13px,calc(26*var(--k))) + max(44px,calc(95*var(--k))))}
 .htb-card[data-htb-card-keys="2"] .htb-card-side{--kc-box:calc(max(36px,calc(68*var(--k))) + 14*var(--k) + max(44px,calc(92*var(--k))) + 18*var(--k) + max(48px,calc(105*var(--k))) + 48*var(--k) + max(13px,calc(26*var(--k))) + 2*max(44px,calc(95*var(--k))) + 17*var(--k))}
 .htb .htb-card-signin.qa{min-height:var(--kc-box)}
 .htb-card[data-htb-card-state="in"] .htb-card-go{min-height:var(--kc-box)}
 .htb-card-signin .qa-status{font-size:max(13px,calc(24*var(--k)));line-height:1.35}
 .htb-card-signin legend{margin:calc(14*var(--k)) 0 calc(10*var(--k));font-size:max(12px,calc(24*var(--k)))}
 .htb .htb-card-note{margin:0;padding:calc(30*var(--k)) calc(10*var(--k)) 0;font-size:max(13px,calc(24*var(--k)));line-height:1.35}
 .htb-card-note>span{display:block}
 .htb .htb-card-buy{height:max(56px,calc(120*var(--k)));font-size:max(24px,calc(56*var(--k)))}
}
.htb-help>h3{font-size:26px;color:var(--t-accent,#ff610b);margin-bottom:14px}
.htb-help-group{border:2px solid #456348;padding:0 0 0 14px}
.htb-help-group+.htb-help-group{margin-top:8px}
.htb .htb-help-group>summary{min-height:52px;padding:12px 44px 12px 0;font-size:22px}
.htb .htb-help-group>summary:after{top:9px;right:14px}
.htb summary{list-style:none;cursor:pointer;position:relative;min-height:64px;padding:18px 38px 18px 0;scroll-margin-top:100px;font-size:26px}
.htb summary::-webkit-details-marker{display:none}
.htb summary:after{content:'+';position:absolute;right:8px;top:16px;color:#84d798;font-size:30px}
.htb details[open]>summary:after{content:'-'}
.htb-help-body{padding:8px 24px 24px}
.htb-help-body>details{border-top:1px solid #456348}
.htb-help-body p{max-width:1000px}
.htb-graduation{color:#bdceb4;font-size:24px;margin-top:22px!important}
.htb-path{color:var(--htb-ink);background:#eee2c3;border:solid transparent;border-width:20px 20px 24px 35px;border-image:var(--htb-paper-image,none) 115 105 170 155 fill/20px 20px 24px 35px stretch;padding:10px 28px 20px;margin:8px 0 20px}
.htb-path-heading{display:flex;align-items:center;gap:24px;margin-bottom:16px}
.htb-path-heading h3{font-size:27px;flex:1}
.htb-path-scene{width:160px;height:160px;object-fit:contain;flex:none}
.htb-chapter{padding:18px 0;border-top:1px solid #a99771}
.htb-chapter-heading{display:flex;align-items:center;gap:20px}
.htb-chapter-heading h4{flex:1;min-width:0}
.htb-chapter-heading .htb-number{font-size:32px;align-self:center}
.htb-step-scene{width:96px;height:96px;object-fit:contain}
.htb-actions{margin:12px 0 20px;padding-left:28px}
.htb-actions li{padding:0 0 10px 4px;line-height:1.25}
.htb-note{color:#475238;font-size:24px;margin-top:10px!important}
.htb-chapter .htb-plate{max-width:420px}
.htb-downloads{display:flex;flex-wrap:wrap;gap:12px}
.htb-downloads .htb-plate{flex:1 1 200px}
.htb-funding h5{font:400 26px/1.2 var(--t-font-body);margin:20px 0 12px;color:#24492e}
.htb-funding>details{border-top:1px solid #a99771}
.htb-funding summary:after{color:#24492e}
.htb-reserve{border-left:4px solid #a4642d;padding-left:16px;color:#633a1a;margin-top:16px!important}
.htb-exchange{padding:8px 0}
@media(max-width:1279px){.htb-start{--htb-phone:206px;padding:4px 16px 12px}.htb-body{padding:24px}.htb-three{margin-right:20px}.htb-simple{grid-template-columns:44px minmax(0,1fr);column-gap:12px}.htb-simple h3{font-size:22px}.htb-sentence{font-size:22px}.htb-watch,.htb-handoff{padding-left:20px}.htb-after{gap:0 32px}}
@media(max-width:1023px){.htb-start{--htb-phone:230px;grid-template-columns:minmax(0,1fr) calc(var(--htb-phone) + 22px)}.htb-handoff{display:none}.htb-hero{min-height:132px;padding:28px 24px}.htb-hero h2{font-size:30px}.htb-flyers{width:170px;height:140px;right:12px}.htb-after{display:block;margin-top:24px}.htb-help{margin-top:24px}.htb-help-body{padding:0 8px 18px}}
@media(max-width:767px){
 .htb{font-size:22px;line-height:1.25}.htb-hero{min-height:108px;padding:14px 12px}.htb-hero h2{max-width:100%;font-size:28px;line-height:1.3;padding:10px 12px}.htb-flyers{display:none}.htb-body{padding:10px 10px 10px}
 .htb-start{display:block;border-width:10px 8px 14px 12px;border-image-width:10px 8px 14px 12px;padding:0 8px 10px}
 .htb-three{margin:0}
 .htb-simple{grid-template-columns:38px minmax(0,1fr);column-gap:8px;padding:12px 0}
 .htb-number{font-size:36px}.htb-simple-copy{display:contents}.htb-simple h3{grid-column:2;align-self:center;font-family:var(--t-font-body);font-weight:700;font-size:26px;line-height:1.05;margin:0 0 6px}
 .htb-simple .htb-sentence{grid-column:1 / -1;font-size:22px;line-height:1.16;margin:8px 0}
 .htb-simple-action{grid-column:1 / -1;width:100%}.htb-plate{font-size:22px;min-height:50px;padding:8px 10px;margin:2px 0}
 .htb-safety-line{font-size:18px;line-height:1.2;margin:8px 0 0!important}
 .htb-help>h3{font-size:22px;margin:0 4px 14px}.htb summary{font-size:22px;line-height:1.2;min-height:58px;padding:16px 28px 16px 4px}.htb summary:after{font-size:26px;top:13px;right:4px}
 .htb-help-group{padding-left:8px}.htb .htb-help-group>summary{min-height:52px;padding:12px 36px 12px 0;font-size:20px}.htb .htb-help-group>summary:after{top:9px;right:10px}
 .htb-help-body{padding:0 4px 18px}.htb-graduation{font-size:20px}.htb-path{border-width:12px 8px 18px 10px;border-image-width:12px 8px 18px 10px;padding:4px 6px 10px}.htb-path-heading{gap:10px}.htb-path-heading h3{font:700 26px/1.12 var(--t-font-body)}.htb-path-scene{width:80px;height:90px}
 .htb-chapter{padding:14px 0}.htb-chapter-heading{gap:10px}.htb-chapter-heading h4{font:700 24px/1.1 var(--t-font-body)}.htb-chapter-heading .htb-number{font-size:28px}.htb-step-scene{width:64px;height:64px}.htb-actions{padding-left:22px}.htb-actions li{padding-left:0}.htb-note{font-size:20px}.htb-funding h5{font-size:22px}.htb-downloads{display:block}.htb-chapter .htb-plate{max-width:none;width:100%;margin:8px 0}.htb-reserve{padding-left:10px}.htb-exchange{padding:0 4px}
}
@media(max-width:767px){.htb-join{gap:10px;padding:0 4px}.htb .htb-join-title{width:100%;font-size:22px}.htb-join-buttons{width:100%;gap:10px}.htb .htb-join-button{flex:1 1 auto}.htb .htb-join-button .c-btn__label{white-space:nowrap}:root .htb .q-join-cta.htb-join-button.c-btn[data-variant]{min-width:0;min-height:56px;padding:8px 10px;gap:8px;font-size:16px}.htb .htb-join-button .q-owner-mark{width:24px;height:24px}}
@media(max-width:480px){.htb-start,.htb-path{border-image-source:var(--htb-paper-phone,none)}.htb-sunset{background-image:var(--htb-sunset-phone,none);background-size:528px auto}}
/* HOWTOBUY4: step 3's wallet buttons. The icons are the official ones from the wallet adapter packages
   (@solana/wallet-adapter-phantom 0.9.30, -solflare 0.6.34, -backpack 0.1.14). */
.htb-wallets{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0}
.htb-wallets .htb-plate{flex:1 1 auto;width:auto;min-height:52px;margin:0;padding:6px 10px;font-size:18px;white-space:nowrap}
.htb-wallet{flex-wrap:nowrap}
.htb-wallet-icon{flex:none;width:30px;height:30px;border-radius:8px;background:center/contain no-repeat}
.htb-wallet-icon--phantom{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDgiIGhlaWdodD0iMTA4IiB2aWV3Qm94PSIwIDAgMTA4IDEwOCIgZmlsbD0ibm9uZSI+CjxyZWN0IHdpZHRoPSIxMDgiIGhlaWdodD0iMTA4IiByeD0iMjYiIGZpbGw9IiNBQjlGRjIiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik00Ni41MjY3IDY5LjkyMjlDNDIuMDA1NCA3Ni44NTA5IDM0LjQyOTIgODUuNjE4MiAyNC4zNDggODUuNjE4MkMxOS41ODI0IDg1LjYxODIgMTUgODMuNjU2MyAxNSA3NS4xMzQyQzE1IDUzLjQzMDUgNDQuNjMyNiAxOS44MzI3IDcyLjEyNjggMTkuODMyN0M4Ny43NjggMTkuODMyNyA5NCAzMC42ODQ2IDk0IDQzLjAwNzlDOTQgNTguODI1OCA4My43MzU1IDc2LjkxMjIgNzMuNTMyMSA3Ni45MTIyQzcwLjI5MzkgNzYuOTEyMiA2OC43MDUzIDc1LjEzNDIgNjguNzA1MyA3Mi4zMTRDNjguNzA1MyA3MS41NzgzIDY4LjgyNzUgNzAuNzgxMiA2OS4wNzE5IDY5LjkyMjlDNjUuNTg5MyA3NS44Njk5IDU4Ljg2ODUgODEuMzg3OCA1Mi41NzU0IDgxLjM4NzhDNDcuOTkzIDgxLjM4NzggNDUuNjcxMyA3OC41MDYzIDQ1LjY3MTMgNzQuNDU5OEM0NS42NzEzIDcyLjk4ODQgNDUuOTc2OCA3MS40NTU2IDQ2LjUyNjcgNjkuOTIyOVpNODMuNjc2MSA0Mi41Nzk0QzgzLjY3NjEgNDYuMTcwNCA4MS41NTc1IDQ3Ljk2NTggNzkuMTg3NSA0Ny45NjU4Qzc2Ljc4MTYgNDcuOTY1OCA3NC42OTg5IDQ2LjE3MDQgNzQuNjk4OSA0Mi41Nzk0Qzc0LjY5ODkgMzguOTg4NSA3Ni43ODE2IDM3LjE5MzEgNzkuMTg3NSAzNy4xOTMxQzgxLjU1NzUgMzcuMTkzMSA4My42NzYxIDM4Ljk4ODUgODMuNjc2MSA0Mi41Nzk0Wk03MC4yMTAzIDQyLjU3OTVDNzAuMjEwMyA0Ni4xNzA0IDY4LjA5MTYgNDcuOTY1OCA2NS43MjE2IDQ3Ljk2NThDNjMuMzE1NyA0Ny45NjU4IDYxLjIzMyA0Ni4xNzA0IDYxLjIzMyA0Mi41Nzk1QzYxLjIzMyAzOC45ODg1IDYzLjMxNTcgMzcuMTkzMSA2NS43MjE2IDM3LjE5MzFDNjguMDkxNiAzNy4xOTMxIDcwLjIxMDMgMzguOTg4NSA3MC4yMTAzIDQyLjU3OTVaIiBmaWxsPSIjRkZGREY4Ii8+Cjwvc3ZnPg==")}
.htb-wallet-icon--solflare{background-image:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIGlkPSJTIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MCA1MCI+PGRlZnM+PHN0eWxlPi5jbHMtMXtmaWxsOiMwMjA1MGE7c3Ryb2tlOiNmZmVmNDY7c3Ryb2tlLW1pdGVybGltaXQ6MTA7c3Ryb2tlLXdpZHRoOi41cHg7fS5jbHMtMntmaWxsOiNmZmVmNDY7fTwvc3R5bGU+PC9kZWZzPjxyZWN0IGNsYXNzPSJjbHMtMiIgeD0iMCIgd2lkdGg9IjUwIiBoZWlnaHQ9IjUwIiByeD0iMTIiIHJ5PSIxMiIvPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTI0LjIzLDI2LjQybDIuNDYtMi4zOCw0LjU5LDEuNWMzLjAxLDEsNC41MSwyLjg0LDQuNTEsNS40MywwLDEuOTYtLjc1LDMuMjYtMi4yNSw0LjkzbC0uNDYuNS4xNy0xLjE3Yy42Ny00LjI2LS41OC02LjA5LTQuNzItNy40M2wtNC4zLTEuMzhoMFpNMTguMDUsMTEuODVsMTIuNTIsNC4xNy0yLjcxLDIuNTktNi41MS0yLjE3Yy0yLjI1LS43NS0zLjAxLTEuOTYtMy4zLTQuNTF2LS4wOGgwWk0xNy4zLDMzLjA2bDIuODQtMi43MSw1LjM0LDEuNzVjMi44LjkyLDMuNzYsMi4xMywzLjQ2LDUuMThsLTExLjY1LTQuMjJoMFpNMTMuNzEsMjAuOTVjMC0uNzkuNDItMS41NCwxLjEzLTIuMTcuNzUsMS4wOSwyLjA1LDIuMDUsNC4wOSwyLjcxbDQuNDIsMS40Ni0yLjQ2LDIuMzgtNC4zNC0xLjQyYy0yLS42Ny0yLjg0LTEuNjctMi44NC0yLjk2TTI2LjgyLDQyLjg3YzkuMTgtNi4wOSwxNC4xMS0xMC4yMywxNC4xMS0xNS4zMiwwLTMuMzgtMi01LjI2LTYuNDMtNi43MmwtMy4zNC0xLjEzLDkuMTQtOC43Ny0xLjg0LTEuOTYtMi43MSwyLjM4LTEyLjgxLTQuMjJjLTMuOTcsMS4yOS04Ljk3LDUuMDktOC45Nyw4Ljg5LDAsLjQyLjA0LjgzLjE3LDEuMjktMy4zLDEuODgtNC42MywzLjYzLTQuNjMsNS44LDAsMi4wNSwxLjA5LDQuMDksNC41NSw1LjIybDIuNzUuOTItOS41Miw5LjE0LDEuODQsMS45NiwyLjk2LTIuNzEsMTQuNzMsNS4yMmgwWiIvPjwvc3ZnPg==")}
.htb-wallet-icon--backpack{background-image:url("data:image/png;base64,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")}
.htb-computer[aria-disabled="true"]{cursor:default;text-decoration:none}
.htb-computer .htb-launch{margin-left:10px}
@media(max-width:767px){.htb-wallets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.htb-wallets .htb-plate{min-height:54px;font-size:20px}.htb-wallet-icon{width:28px;height:28px}}
/* HOWTOBUY4: 70-second vertical Phantom walkthrough video in the guide's pixel phone frame; since 23 Oct 2026 the
   panel's middle column, the title over the phone. */
.htb-watch{min-width:0;padding:12px 0 0 20px;border-left:2px solid #b2a27a;align-self:stretch;text-align:center}
.htb .htb-watch-title{font:700 18px/1.25 var(--t-font-display);letter-spacing:.03em;text-transform:uppercase;color:#17291f;margin:0 0 14px!important}
.htb-watch-phone{position:relative;width:var(--htb-phone);max-width:100%;margin:0 auto;padding:18px 8px 22px;background:#15321f;border:6px solid #050b07;border-radius:14px;box-shadow:inset 3px 3px 0 #567958,inset -3px -3px 0 #29422a,4px 6px 0 #050b07}
.htb-watch-phone .htb-phone-speaker{top:6px;left:calc(50% - 18px);width:36px;height:4px}
.htb-watch-phone .htb-phone-home{bottom:4px;left:calc(50% - 9px);width:18px;height:11px;border-width:2px;border-radius:4px}
.htb-watch-video{display:block;width:100%;height:auto;aspect-ratio:9 / 16;border-radius:4px;background:#030805;object-fit:cover}
@media(max-width:767px){.htb-watch{padding:16px 0 4px;border-left:0;border-top:2px solid #b2a27a}.htb .htb-watch-title{font-size:18px}.htb-watch-phone{width:min(240px,66%)}}
@media(prefers-reduced-motion:reduce){.htb *,.htb *:before,.htb *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.htb-safe a{display:inline-flex;align-items:center;min-height:48px;text-underline-offset:4px}
