/* Blindport stylesheet (minimal). */
:root { --fg:#1a1a1a; --bg:#fafafa; --muted:#666; --accent:#0a6; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, -apple-system, sans-serif; background:var(--bg); color:var(--fg); }
main { max-width: 920px; margin: 0 auto; padding: 1.5rem; }
.site-header { display:flex; align-items:center; gap:1rem; padding:1rem 1.5rem; background:#fff; border-bottom:1px solid #eee; }
.brand { font-weight:700; text-decoration:none; color:var(--fg); }
nav a { margin-left:1rem; color:var(--accent); text-decoration:none; }
.hero { padding: 2rem 0; }
.tagline { font-size:1.2rem; color:var(--muted); }
.products { display:grid; grid-template-columns: 1fr 1fr; gap:1rem; margin:2rem 0; }
.product { background:#fff; padding:1rem; border:1px solid #eee; border-radius:8px; }
.availability { font-weight:600; }
.availability.unavailable { color:#a22; }
button { background:var(--accent); color:#fff; border:0; padding:.5rem 1rem; border-radius:4px; cursor:pointer; font-size:1rem; }
button:hover { filter:brightness(1.1); }
button:disabled { background:#777; cursor:not-allowed; filter:none; }
input, select { padding:.4rem; border:1px solid #ccc; border-radius:4px; font-size:1rem; }
.token-box { padding:1rem; background:#f4f4f4; border:1px solid #ddd; word-break:break-all; white-space:pre-wrap; }
table { border-collapse: collapse; width: 100%; margin: 1rem 0; }
th, td { padding: .4rem .6rem; border-bottom: 1px solid #eee; text-align:left; font-size:.9rem; }
footer { padding: 2rem 1.5rem; color:var(--muted); text-align:center; }
#qrBox svg { display:block; width:min(100%, 24rem); height:auto; margin:1rem 0; }
.sub-action { min-width: 15rem; }
.dns-instructions { display:grid; gap:.45rem; max-width:28rem; }
.dns-instructions code { display:block; padding:.35rem; background:#f4f4f4; overflow-wrap:anywhere; }
.dns-instructions button { justify-self:start; }