@font-face { font-family: 'GT America'; src: url('/fonts/gt-america-regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: 'GT America'; src: url('/fonts/gt-america-medium.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'GT America Mono'; src: url('/fonts/gt-america-mono.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; } :root { --bg: #0e0f13; --panel: #171922; --panel-2: #1f2230; --ink: #e8eaf2; --ink-dim: #9aa0b3; --accent: #ffd23f; --accent-2: #4cc2ff; --ok: #5fd47b; --warn: #ff7a59; --border: #2a2e3c; --radius: 10px; --max: 760px; font-size: 16px; } * { box-sizing: border-box; } [hidden] { display: none !important; } /* OS-gated visibility — driven by data-os on , set by inline script in so the right sections are hidden before paint. */ [data-os="macos"] header, [data-os="macos"] ol.steps, [data-os="macos"] footer { display: none !important; } [data-os="windows"] #not-supported, [data-os="linux"] #not-supported, [data-os="unknown"] #not-supported { display: none !important; } #cmd-windows, #cmd-linux { display: none; } [data-os="windows"] #cmd-windows, [data-os="linux"] #cmd-linux { display: block; } html, body { margin: 0; padding: 0; background: var(--bg); color: var(--ink); font-family: 'GT America', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; line-height: 1.55; } main { max-width: var(--max); margin: 0 auto; padding: 32px 20px 96px; } .brand { display: inline-block; margin-bottom: 28px; opacity: 0.85; text-decoration: none; } .brand img { height: 18px; width: auto; display: block; } header { margin-bottom: 32px; padding-bottom: 24px; border-bottom: 1px solid var(--border); } h1 { font-size: 1.9rem; font-weight: 700; margin: 0 0 12px; line-height: 1.2; } .payout { color: var(--accent); white-space: nowrap; } h2 { font-size: 1.1rem; font-weight: 600; margin: 0 0 12px; } .lede { color: var(--ink-dim); margin: 0; } .muted { color: var(--ink-dim); font-weight: 400; } ol.steps { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 20px; counter-reset: step; } ol.steps > li { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); padding: 20px; } .cmd-block { margin-top: 8px; } .cmd-row { display: flex; gap: 8px; align-items: stretch; margin: 8px 0; } code { background: var(--panel-2); border: 1px solid var(--border); border-radius: 6px; padding: 12px 14px; font-family: 'GT America Mono', ui-monospace, "SF Mono", Consolas, monospace; font-size: 0.82rem; display: block; overflow-x: auto; white-space: pre; flex: 1; color: var(--ink); } kbd { background: var(--panel-2); border: 1px solid var(--border); border-radius: 4px; padding: 1px 6px; font-family: 'GT America Mono', ui-monospace, monospace; font-size: 0.85em; } .copy-btn, button#submit-btn, .os-switcher button { background: var(--accent); color: #1a1a1a; border: none; border-radius: 6px; padding: 10px 16px; font-weight: 600; cursor: pointer; font-size: 0.95rem; transition: filter .15s; } .copy-btn:hover, button#submit-btn:not(:disabled):hover, .os-switcher button:hover { filter: brightness(1.08); } .os-switcher { display: flex; gap: 8px; margin-top: 8px; } .os-switcher button { background: var(--panel-2); color: var(--ink); border: 1px solid var(--border); } button#submit-btn { font-size: 1.05rem; padding: 14px 22px; width: 100%; } button#submit-btn:disabled { background: var(--panel-2); color: var(--ink-dim); cursor: not-allowed; } textarea, input[type="email"] { width: 100%; background: var(--panel-2); color: var(--ink); border: 1px solid var(--border); border-radius: 6px; padding: 12px; font-family: 'GT America Mono', ui-monospace, monospace; font-size: 0.85rem; resize: vertical; } input[type="email"] { font-family: inherit; font-size: 1rem; } textarea:focus, input[type="email"]:focus { outline: 2px solid var(--accent-2); outline-offset: 1px; } .hint { color: var(--ink-dim); font-size: 0.88rem; margin: 8px 0 0; } .hint.ok { color: var(--ok); } .hint.warn { color: var(--warn); } #step-consent label { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; color: var(--ink-dim); font-size: 0.92rem; } #step-consent input { margin-top: 4px; flex-shrink: 0; } #success { background: var(--panel); border: 1px solid var(--ok); border-radius: var(--radius); padding: 24px; margin-top: 24px; } #success strong { color: var(--accent); font-family: 'GT America Mono', ui-monospace, monospace; } footer { margin-top: 48px; padding-top: 24px; border-top: 1px solid var(--border); color: var(--ink-dim); font-size: 0.9rem; } footer details { margin-bottom: 16px; } footer summary { cursor: pointer; color: var(--ink); margin-bottom: 8px; } footer ul { padding-left: 20px; margin: 8px 0; } footer a { color: var(--accent-2); } .footer-note { margin-top: 24px; font-size: 0.82rem; } details { margin-top: 12px; } details summary { cursor: pointer; color: var(--ink-dim); font-size: 0.88rem; } @media (max-width: 600px) { h1 { font-size: 1.5rem; } main { padding: 20px 14px 80px; } .cmd-row { flex-direction: column; } }