@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@400;500;600;700&family=Newsreader:opsz,wght@6..72,400;6..72,500;6..72,600&family=IBM+Plex+Mono:wght@400;500;600&display=swap');
/* Ember · shared styles for the SEO free-tool calculators (Sprint 16, idea I-01).
   Type upgraded to the design-system faces in Sprint 17 (Newsreader/Work Sans/IBM Plex Mono). */
:root{
  --bg:#0f1115;--panel:#171a21;--panel2:#1e222b;--line:#2a2f3a;--txt:#eef2f7;--muted:#9aa4b2;--dim:#69727f;
  --ember:#ff7a3c;--ember2:#ffb057;--flame:#ffd166;--good:#48d597;--r:12px;
  --serif:"Newsreader","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --sans:"Work Sans","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;
}
@media (prefers-color-scheme: light){:root{
  --bg:#fbf7f2;--panel:#fff;--panel2:#f2f0ec;--line:#e6e1d9;--txt:#221d28;--muted:#6b6270;--dim:#9a8f9c;--ember:#e8601f;
}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--txt);font-family:var(--sans);line-height:1.6}
a{color:var(--ember2)}@media(prefers-color-scheme:light){a{color:var(--ember)}}
.wrap{max-width:760px;margin:0 auto;padding:24px 20px 64px}
.brand{display:flex;align-items:center;gap:9px;margin-bottom:8px}
.brand .logo{font-size:24px;filter:drop-shadow(0 0 8px var(--ember))}
.brand b{font-family:var(--serif);font-size:20px;color:var(--ember)}
h1{font-family:var(--serif);font-size:clamp(27px,5vw,36px);line-height:1.12;margin:14px 0 8px;text-wrap:balance}
.lede{color:var(--muted);font-size:16px;margin-bottom:22px;max-width:60ch}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:20px;margin-bottom:18px}
label{display:block;font-size:13px;color:var(--muted);margin:12px 0 5px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media(max-width:520px){.row{grid-template-columns:1fr}}
.fieldwrap{display:flex;align-items:center;gap:6px;background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:2px 10px}
.fieldwrap:focus-within{border-color:var(--ember)}
.fieldwrap .pre{color:var(--dim)}
input{width:100%;background:transparent;border:none;color:var(--txt);font-size:16px;font-family:var(--mono);font-variant-numeric:tabular-nums;padding:9px 0}
input:focus{outline:none}
.result{background:linear-gradient(135deg,rgba(255,122,60,.14),rgba(255,209,102,.04));border:1px solid var(--ember);border-radius:var(--r);padding:22px;text-align:center;margin-top:18px}
.result.yes .big{color:var(--good)}.result.no .big,.result.info .big{color:var(--ember2)}
.result .big{font-size:30px;font-weight:800;font-family:var(--serif);margin:4px 0}
.result .sub{color:var(--muted);font-size:14.5px}
.cta{display:inline-block;margin-top:14px;background:linear-gradient(95deg,var(--ember),var(--flame));color:#231400;font-weight:700;text-decoration:none;padding:12px 20px;border-radius:26px;font-size:15px}
h2{font-family:var(--serif);font-size:22px;margin:28px 0 8px}
.faq b{color:var(--txt)}.faq p{color:var(--muted);font-size:14.5px;margin:4px 0 14px}
.tools{margin:20px 0;font-size:14px}.tools a{margin-right:14px;white-space:nowrap}
.foot{color:var(--dim);font-size:12px;margin-top:30px;border-top:1px solid var(--line);padding-top:14px}
:focus-visible{outline:2px solid var(--ember);outline-offset:2px;border-radius:4px}