:root{color-scheme:light;--gold:#f5b301;--gold-soft:#ffd94d;--ink:#1c2430;--bg:#fffdf5;--card:#fff;--line:#e8e2cf}
*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--ink);line-height:1.55}
header{background:linear-gradient(180deg,var(--gold-soft),var(--gold));padding:30px 20px 24px;text-align:center;box-shadow:0 2px 10px rgba(28,36,48,.12)}
header a{color:var(--ink);text-decoration:none;font-weight:900;font-size:2.6rem;letter-spacing:-.5px;line-height:1.1;display:inline-block}
header::after{content:"Free paycheck, overtime & salary calculators";display:block;margin-top:6px;font-size:.98rem;font-weight:600;color:rgba(28,36,48,.75)}
main{max-width:820px;margin:0 auto;padding:28px 20px 48px}h1{font-size:2rem;margin:.2em 0 .35em;text-align:center}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px;margin:18px 0;box-shadow:0 1px 4px rgba(28,36,48,.05)}
.card h2{margin-top:0}
label{display:block;font-weight:600;margin:12px 0 4px}input{width:100%;padding:10px;border:1px solid #ccc;border-radius:8px;font-size:1rem}
input:focus{border-color:var(--gold);outline:2px solid rgba(245,179,1,.35)}
button{background:var(--ink);color:#fff;border:0;border-radius:8px;padding:12px 20px;font-size:1rem;cursor:pointer;margin-top:16px;transition:opacity .15s}
button:hover{opacity:.88}
#out{margin-top:16px;background:#fff8dd;border-radius:8px;padding:12px 16px}
.pills{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:18px auto 22px}
.pill{background:#fff;border:1px solid var(--line);border-radius:999px;padding:5px 13px;font-size:.88rem;font-weight:600;color:var(--ink)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.grid a{display:block;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;color:var(--ink);text-decoration:none;font-weight:700;transition:border-color .15s,box-shadow .15s,transform .15s}
.grid a:hover{border-color:var(--gold);box-shadow:0 4px 14px rgba(28,36,48,.10);transform:translateY(-2px)}
.grid .soon{display:block;background:transparent;border:1px dashed #d8d0b4;border-radius:12px;padding:16px;font-weight:700;color:#8a825f}
.grid .soon em{display:block;font-style:normal;font-weight:600;font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:#b3a86f;margin-top:3px}
footer{border-top:1px solid var(--line);padding:18px 20px;text-align:center;color:#666;font-size:.9rem}
footer a{color:var(--ink);font-weight:600;text-decoration:none}
footer a:hover{text-decoration:underline}

/* By-state pill section (Wave 2) */
.spills{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.spill{border:1px solid var(--line);border-radius:999px;padding:3px 10px;font-size:.82rem;font-weight:600;color:var(--ink);text-decoration:none;background:#fff}
.spill:hover{border-color:var(--gold);color:var(--navy)}
.spills.collapsed .extra{display:none}
.sbtn{width:auto;padding:8px 16px;margin-top:12px;font-size:.9rem}