@font-face{font-family:"Account Mono";src:url(/theme/fonts/body-1.woff2) format("woff2");font-weight:400;font-display:swap}
.qa,.qa-header{--qa-green:#00ee83;--qa-orange:#ff6500;--qa-ink:#f5eed5;--qa-display:var(--t-font-display,"QUIT Display",monospace);--qa-pixel:var(--t-font-pixel,"QUIT Pixel",monospace);color:var(--qa-ink);font:18px/1.4 "Account Mono",var(--t-font-body,monospace);box-sizing:border-box}
.qa *,.qa-header *{box-sizing:border-box}
.qa [hidden],.qa-header[hidden]{display:none!important}
.qa :where(h2,p,fieldset,legend){margin:0;padding:0}
.qa :focus-visible,.qa-header :focus-visible{outline:3px solid #fff0ad;outline-offset:3px}
.qa-key{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:12px 18px 15px;border:0 solid transparent;border-radius:0;border-image:url(/runtime/quit/deck-art/key-dark.webp) 40 46 50 fill/10px 12px 13px stretch;background:none;color:var(--qa-green);font:700 17px/1.2 var(--qa-display);text-decoration:none;text-align:center;cursor:pointer;touch-action:manipulation}
.qa-key:disabled{opacity:.6;cursor:wait}
.qa-key:active:not(:disabled){transform:translateY(2px)}
.qa-orange{border-image:url(/runtime/quit/deck-art/key-orange.webp) 22 24 34 fill/10px 12px 13px stretch;color:#100a00}
.qa-header{order:2;flex:none;display:inline-flex}
.qa-header>.qa-key{min-width:114px;height:44px;min-height:44px;padding:5px 16px 9px;font-size:13px}
.qa-face{display:inline-flex;flex:none;align-items:center;justify-content:center;overflow:hidden;width:34px;height:34px;border-radius:50%;background:#101b18}
.qa-face img{width:100%;height:100%;object-fit:cover;image-rendering:auto}
.qa::backdrop{background:#0009}
.qa{background:#001008;border:solid transparent;border-width:20px 22px;border-image:url(/runtime/quit/deck-art/bay.webp) 44 50 fill/20px 22px stretch;background-clip:padding-box;max-height:calc(100dvh - 24px);overscroll-behavior:contain;overflow:auto;color:var(--qa-ink)}
.qa-panel{width:min(760px,calc(100vw - 24px));padding:24px 24px 22px;margin:auto}
.qa h2{font:700 clamp(30px,3.6vw,52px)/1.12 var(--qa-pixel);color:var(--qa-orange);text-shadow:3px 4px #000;margin:0 110px 18px 0}
.qa-close{position:absolute;right:24px;top:20px;min-height:40px;font-size:13px}
.qa .qa-funnel{font-size:21px;margin-bottom:9px;color:#f7f5e8}
.qa .qa-intro{font-size:18px;margin-bottom:20px}
.qa-methods{display:flex;gap:7px;margin-bottom:12px}
.qa-methods button{flex:1;min-height:54px;border:solid transparent;border-width:5px;border-image:url(/runtime/quit/deck-art/key-dark.webp) 40 46 50 fill/5px stretch;background:#000d07;color:#9ca79e;font:700 23px/1.2 var(--qa-display);cursor:pointer}
.qa-methods [aria-selected="true"]{border-image:none;border-color:var(--qa-green);color:var(--qa-green);box-shadow:inset 0 0 20px #00ff8020}
.qa input{width:100%;min-width:0;border:solid transparent;border-width:6px;border-image:url(/runtime/quit/deck-art/key-dark.webp) 40 46 50 fill/6px stretch;background:#000d07;background-clip:padding-box;color:var(--qa-ink);border-radius:0;padding:10px 14px;font:20px/1.4 "Account Mono",var(--t-font-body,monospace)}
.qa-send,.qa-continue{width:100%;min-height:68px;font-size:28px;margin-top:14px}
.qa fieldset{min-width:0;border:0}
.qa legend{font:700 14px var(--qa-display);margin:16px 0 8px}
.qa-digits{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.qa-digits input{height:54px;text-align:center;padding:0;font:700 25px var(--qa-display)}
.qa .qa-wallet-note{margin-top:12px;font-size:16px}
.qa-status{color:#ffcf4b;font-size:16px;padding-top:10px}
.qa-status:empty{display:none}
.qa-or{display:flex;align-items:center;gap:16px;margin:20px 0 14px;font:700 14px var(--qa-display);color:#9ca79e}
.qa-or::before,.qa-or::after{content:"";flex:1;border-top:2px solid #394a3c}
.qa .qa-wallet-heading{text-align:center;font:700 13px var(--qa-display);margin-bottom:12px}
.qa-wallet-keys{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.qa-wallet-keys .qa-key{font-size:14px;padding-inline:12px}
.qa-wallet-mark{object-fit:contain;flex:none;width:26px;height:26px}
.qa .qa-footnote{font-size:16px;margin-top:16px}
.qa-vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.qa-menu{position:fixed;inset:78px 12px auto auto;width:352px;margin:0;padding:10px 8px 8px;max-height:calc(100dvh - 90px)}
.qa-menu::backdrop{background:#0003}
.qa-menu-close{display:none}
.qa-profile{display:flex;align-items:center;gap:14px;padding:6px 0 18px;overflow-wrap:anywhere}
.qa-profile .qa-face{width:72px;height:72px;border-radius:3px;border:2px solid #455d4c}
.qa-profile strong{font:700 16px var(--qa-display)}
.qa-profile p{margin-top:6px;color:var(--qa-green)}
.qa-profile small{display:block;color:#ffc332;font-size:13px;margin-top:4px}
.qa-menu nav{display:grid;gap:10px}
.qa-menu .qa-signout{width:100%;margin-top:22px}
.qa-menu .qa-status{font-size:16px}
@media(max-width:1000px) and (min-width:601px){.qa-header>.qa-key{min-width:90px;font-size:11px;padding-inline:9px}.qa-header .qa-face{width:24px;height:24px}}
/* 768 to 999 px: APPLY TO QUIT joins the row at 768 and the key no longer fits beside BUY $QUIT (it pushed BUY past the
   right edge, signed in up to about 920 px), so the key takes a second row under BUY, as on phones, and the header and what
   sits under it move down together. */
@media(min-width:768px) and (max-width:999px){
 html[data-skin] .c-header[data-quit-navigation]:has(.qa-header:not([hidden])){--c-header-height:120px;height:120px;align-items:flex-start;padding-top:10px}
 .c-header:has(.qa-header:not([hidden]))+.q-ca{margin-top:120px}
 .c-header:has(.qa-header:not([hidden]))~.frame-main{--c-header-height:120px;--t-header-desktop:120px}
 .c-header .qa-header{position:absolute;top:66px;right:20px}
 .c-header .qa-header>.qa-key{min-width:114px;font-size:12px}
 .c-header .qa-header .qa-face{width:28px;height:28px}
}
@media(max-width:600px){
 html[data-skin] .c-header[data-quit-navigation]:has(.qa-header:not([hidden])){height:108px;align-items:flex-start;padding-top:10px}
 .c-header:has(.qa-header:not([hidden]))+.q-ca{margin-top:108px}
 .c-header:has(.qa-header:not([hidden]))~.frame-main{--c-header-height:108px;--t-header-phone:108px}
 .qa-header{position:absolute;top:58px;right:8px}
 .qa-header>.qa-key{min-width:114px;font-size:12px}
 .qa-header .qa-face{width:28px;height:28px}
 .qa-panel{width:calc(100vw - 12px);max-height:calc(100dvh - 12px);border-width:13px;border-image-width:13px;padding:16px 12px}
 .qa h2{font-size:29px;margin-right:74px;margin-bottom:16px}
 .qa-close{right:12px;top:12px;min-height:38px;font-size:12px;padding-inline:12px}
 .qa .qa-funnel{font-size:17px}.qa .qa-intro{font-size:16px;margin-bottom:16px}
 .qa-methods button{min-height:47px;font-size:18px}.qa input{font-size:16px}
 .qa-send,.qa-continue{min-height:58px;font-size:23px;margin-top:12px}
 .qa-digits{gap:4px}.qa-digits input{height:44px;font-size:19px}
 .qa-wallet-note,.qa-footnote,.qa-status{font-size:16px}.qa-or{margin:16px 0 12px}
 .qa .qa-wallet-heading{font-size:12px}.qa-wallet-keys{gap:5px}.qa-wallet-keys .qa-key{flex-direction:column;gap:5px;font-size:11px;padding:10px 5px 13px;min-height:64px}.qa-wallet-mark{width:23px;height:23px}
 .qa-menu{inset:auto 6px 6px;width:calc(100vw - 12px);max-height:calc(100dvh - 12px);border-width:14px;border-image-width:14px;padding:12px}
 .qa-menu-close{display:flex;margin:0 0 12px auto;min-height:40px;font-size:12px}.qa-profile{padding-top:0}.qa-menu nav .qa-key,.qa-signout{min-height:54px}
}
/* Signed out, the key is the header's lit orange key (BUY's art) with the account mark left of the word (the owner, 25 Oct
   2026: SIGN IN was hard to see among the header's dark keys). The mark is a 12 by 12 pixel figure on the sound key's grid,
   painted in the label's colour; it is decoration only, so the key's name stays SIGN IN. */
.qa-header{--qa-mark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath d='M4 0h4v1H4zM3 1h6v3H3zM4 4h4v1H4zM3 6h6v1H3zM2 7h8v1H2zM1 8h10v4H1z'/%3E%3C/svg%3E")}
.qa-header>.qa-key[data-acct-state="out"]{min-width:132px;gap:8px;font-size:15px;color:#100a00;border-image:url(/runtime/quit/deck-art/key-orange.webp) 22 24 34 fill/10px 12px 13px stretch}
.qa-header>.qa-key[data-acct-state="out"]::before{content:"";flex:none;width:14px;height:14px;margin-top:-2px;background:currentColor;-webkit-mask:var(--qa-mark) center/contain no-repeat;mask:var(--qa-mark) center/contain no-repeat}
.qa-header>.qa-key[data-acct-state="out"]:active:not(:disabled){border-image-source:url(/runtime/quit/deck-art/key-orange-down.webp)}
@media(hover:hover){.qa-header>.qa-key[data-acct-state="out"]:hover:not(:disabled){filter:brightness(1.1)}}
@media(max-width:1000px) and (min-width:601px){.qa-header>.qa-key[data-acct-state="out"]{min-width:120px;font-size:13px}.qa-header>.qa-key[data-acct-state="out"]::before{width:12px;height:12px}}
@media(min-width:768px) and (max-width:999px){.c-header .qa-header>.qa-key[data-acct-state="out"]{min-width:156px;font-size:14px}.c-header .qa-header>.qa-key[data-acct-state="out"]::before{width:13px;height:13px}}
@media(max-width:600px){.qa-header>.qa-key[data-acct-state="out"]{min-width:150px;font-size:14px}.qa-header>.qa-key[data-acct-state="out"]::before{width:13px;height:13px}}
.qa-wallet-help{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:12px;font-size:16px;color:#ffcf4b}
.qa-wallet-help .qa-key{min-height:44px;font-size:13px}
/* Google and X (the owner, 26 Oct 2026). Google's key keeps Google's dark button as published: #131314, a 1 px #8E918F
   line, its own G on a white tile, the label in #E3E3E3. X's key is black with X's white mark. One height with the wallet keys. */
.qa-social-keys{display:grid;gap:9px;margin:0 0 16px}
.qa-google{position:relative;display:flex;align-items:center;justify-content:center;width:100%;min-height:48px;padding:0 12px 0 56px;border:1px solid #8e918f;border-radius:4px;background:#131314;color:#e3e3e3;font:500 16px/1.2 Roboto,"Google Sans",Arial,sans-serif;letter-spacing:.25px;cursor:pointer;touch-action:manipulation}
.qa-google-g{position:absolute;left:4px;top:4px;bottom:4px;width:40px;display:grid;place-items:center;border-radius:3px;background:#fff}
.qa-google-g img{width:20px;height:20px}
.qa-google:disabled{opacity:.6;cursor:wait}
.qa-google:hover:not(:disabled){background:#1f1f20}
.qa-x{width:100%;min-height:48px;border-image:none;border:2px solid #3b3b3b;background:#000;color:#fff}
.qa-x img{width:22px;height:20px;object-fit:contain}
@media(prefers-reduced-motion:reduce){.qa *,.qa-header *{transition:none!important;scroll-behavior:auto!important}}