:root { color-scheme: dark; --blue: #039fd3; --ivory: #f2eee5; --brass: #b79258; }
* { box-sizing: border-box; }
body { margin: 0; background: #151719; color: var(--ivory); font: 16px/1.6 system-ui, sans-serif; }
.brand, main, footer { max-width: 1280px; margin: auto; padding: 28px 48px; }
.brand { border-bottom: 1px solid #ffffff12; }
.brand a { display: inline-block; line-height: 0; }
.brand-logo { display: block; width: 166px; height: auto; clip-path: inset(1.7% 2.3%); mix-blend-mode: screen; }
.welcome { display: grid; grid-template-columns: 1.3fr 1fr; align-items: center; gap: 72px; min-height: 65vh; padding: 24px 0; }
.eyebrow { font-size: 11px; font-weight: 700; letter-spacing: 2.4px; color: var(--brass); }
h1 { font-size: clamp(34px, 4.5vw, 62px); line-height: 1.12; letter-spacing: -2px; margin: 24px 0; }
.intro { color: #bab8b3; max-width: 420px; }
.panel { background: #202326; border: 1px solid #ffffff14; border-radius: 18px; padding: 36px; }
h2 { font-size: 28px; line-height: 1.25; letter-spacing: -.8px; }
.panel p { color: #bab8b3; }
.notice { margin: 28px 0; padding: 16px; background: #039fd310; border: 1px solid #039fd335; border-radius: 8px; font-size: 14px; }
.dot { display: inline-block; width: 7px; height: 7px; background: var(--blue); border-radius: 50%; margin-right: 6px; }
.panel .subtle, footer { font-size: 12px; color: #96948f; }
.box-art { margin-top: 36px; padding: 20px 28px; border: 1px solid #b7925845; border-radius: 4px; width: 220px; background: linear-gradient(135deg, #754d3125, #202326); }
.box-art span { color: var(--brass); font: 48px Georgia, serif; }
.box-art p { letter-spacing: 3px; font-size: 9px; }
a:focus-visible { outline: 2px solid var(--blue); outline-offset: 5px; }
label { display: block; margin: 18px 0 6px; font-size: 14px; font-weight: 600; }
input, select, button { font: inherit; min-height: 44px; border-radius: 8px; }
input:not([type="hidden"]), select { width: 100%; padding: 12px; border: 1px solid #ffffff35; background: #151719; color: var(--ivory); }
button { cursor: pointer; border: 1px solid transparent; background: var(--blue); color: #071c23; padding: 12px 22px; font-weight: 650; }
form button { margin-top: 24px; }
button.secondary { background: transparent; color: var(--ivory); border-color: #ffffff35; }
input:focus-visible, select:focus-visible, button:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; }
:disabled { opacity: .5; cursor: not-allowed; }
.error { border-color: #c56a3a; }
.operator { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 28px; }
.operator button { margin: 0; }
.retailer { max-width: 760px; margin: auto; }
.retailer h1 { font-size: clamp(28px, 4vw, 42px); }
.company-results { padding: 0; list-style: none; }
.company-results button { width: 100%; text-align: left; margin-bottom: 8px; }
[hidden] { display: none !important; }
@media (max-width: 760px) { .brand, main, footer { padding: 24px; } .welcome { grid-template-columns: 1fr; gap: 28px; } .panel { padding: 26px; } .box-art { display: none; } }