:root{--bg:#fbf1e3;--ink:#1d1712;--muted:#71645a;--line:#e5d4c1;--accent:#a04a20;--accent-dark:#733415;--green:#195c3b}
*{box-sizing:border-box}
body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:radial-gradient(circle at 12% 8%,#fff1bd 0,transparent 30%),radial-gradient(circle at 82% 0%,#ffd2b8 0,transparent 26%),linear-gradient(135deg,var(--bg),#ead8c5);color:var(--ink)}
.page{width:min(1040px,calc(100% - 32px));margin:0 auto;padding:48px 0 24px}.hero{display:grid;gap:18px;place-items:start}
.eyebrow{text-transform:uppercase;letter-spacing:.13em;font-weight:900;color:var(--accent);margin:0}
h1{font-size:clamp(2.45rem,6.8vw,6rem);line-height:.9;letter-spacing:-.07em;max-width:980px;margin:0}
.lede{font-size:clamp(1.05rem,2vw,1.38rem);line-height:1.5;color:var(--muted);max-width:790px;margin:0 0 10px}
.card,.result-card{background:rgba(255,250,242,.94);border:1px solid var(--line);border-radius:30px;padding:24px;width:min(760px,100%);box-shadow:0 28px 80px rgba(62,35,16,.14)}
.row{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}label{display:block;margin:0 0 8px;font-weight:900}
/* Consistent rounded form controls */
input,
select{
  width:100%;
  height:58px;
  padding:0 18px;
  border:1px solid var(--line);
  border-radius:17px;
  background:white;
  color:var(--ink);
  font-size:1.05rem;
  line-height:58px;
  outline:none;
  margin-bottom:16px;
  font-family:inherit;
  box-shadow:none;
}

select{
  -webkit-appearance:none;
  appearance:none;
  padding-right:46px;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--muted) 50%),
    linear-gradient(135deg, var(--muted) 50%, transparent 50%);
  background-position:
    calc(100% - 23px) 25px,
    calc(100% - 17px) 25px;
  background-size:6px 6px,6px 6px;
  background-repeat:no-repeat;
}

input[type="number"]{
  -moz-appearance:textfield;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button{
  margin:0;
}

input:focus,
select:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 4px rgba(160,74,32,.12);
}

button{border:0;border-radius:999px;background:var(--accent);color:white;padding:15px 22px;font-size:1rem;font-weight:950;cursor:pointer}
button:hover{background:var(--accent-dark)}button.secondary{background:transparent;color:var(--accent);border:1px solid var(--accent)}
.data-note{color:var(--muted);margin:12px 0 0;font-size:.92rem}.suggestions,.chips{display:flex;flex-wrap:wrap;gap:9px}
.suggestions{margin:-8px 0 16px}.suggestions button,.chips button{background:#f0e1d0;color:var(--ink);border:1px solid var(--line);padding:9px 12px;font-size:.9rem}
.result,.no-match{margin:28px 0 10px}.hidden{display:none}.matched{color:var(--accent);font-weight:950;margin:0 0 8px}
.result h2,.no-match h2{margin:0;font-size:clamp(1.7rem,4vw,3.3rem);letter-spacing:-.045em}
.big{font-size:clamp(3.6rem,11vw,7.5rem);font-weight:1000;letter-spacing:-.085em;line-height:.92;margin:18px 0 8px}
.shock{font-size:clamp(1.2rem,2.8vw,2rem);font-weight:950;line-height:1.15;margin:6px 0 12px;color:var(--green)}
.mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:20px 0}.mini-grid div{border:1px solid var(--line);border-radius:18px;padding:14px;background:white}
.mini-grid span{display:block;color:var(--muted);font-size:.86rem;margin-bottom:6px}.mini-grid strong{font-size:1.2rem}.viral-actions{display:flex;gap:10px;flex-wrap:wrap}
.examples,.notes{margin-top:36px}.examples h2,.notes h2{margin:0 0 14px}.notes{color:var(--muted);max-width:820px;line-height:1.55}
code{background:white;border:1px solid var(--line);padding:2px 6px;border-radius:6px}footer{width:min(1040px,calc(100% - 32px));margin:0 auto;padding:18px 0 38px;color:var(--muted)}
@media(max-width:700px){.page{padding-top:28px}.card,.result-card{padding:18px;border-radius:22px}.row,.mini-grid{grid-template-columns:1fr}}

.one-liner{background:white;border:1px solid var(--line);border-radius:18px;padding:14px 16px;font-weight:850;margin:14px 0;color:var(--ink)}

.share-panel{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
  padding:14px;
  border:1px solid var(--line);
  border-radius:20px;
  background:rgba(255,255,255,.62);
}
.share-panel.hidden{display:none}
.result-card.share-flash{outline:4px solid rgba(160,74,32,.22)}

.era-notice{
  background:#fff3d4;
  border:1px solid #e7c87b;
  color:#5f3b00;
  border-radius:18px;
  padding:14px 16px;
  font-weight:850;
  margin:12px 0;
}
.era-notice.hidden{display:none}

.toy-line{
  background:#fff;
  border:1px dashed var(--accent);
  border-radius:18px;
  padding:14px 16px;
  font-weight:850;
  margin:14px 0;
  color:var(--ink);
}
.toy-line.hidden{display:none}

.model-note{
  background:#eef7ff;
  border:1px solid #b8d8f0;
  border-radius:18px;
  padding:14px 16px;
  font-weight:750;
  margin:14px 0;
  color:#1d3345;
}
.model-note.hidden{display:none}

.notes p{
  margin:0 0 14px;
}
.notes h2:not(:first-child){
  margin-top:24px;
}