/* Project Y — murmur.red dark theme: near-black, hot-pink accent, Bebas Neue display + Space Grotesk. */
:root {
  --bg:#050509; --panel:#0d0d14; --panel-2:#12121c; --line:#20202e;
  --ink:#f0f0ff; --muted:#8f8fb0; --accent:#ff2056; --accent-2:#d91545; --violet:#a78bfa;
  --ok:#2ee6a0; --warn:#f5a623; --bad:#ff2056;
}
* { box-sizing: border-box; }
body { margin:0; font-family:'Space Grotesk', system-ui, sans-serif; background:var(--bg); color:var(--ink);
  background-image:radial-gradient(60rem 40rem at 70% -10%, #ff205618, transparent 60%), radial-gradient(50rem 40rem at -10% 10%, #a78bfa14, transparent 55%); }

.hero { max-width:48rem; margin:3.5rem auto 1.5rem; padding:0 1rem; }
.eyebrow { font-size:.75rem; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); margin:0 0 1rem; }
.hero h1 { font-family:'Bebas Neue', sans-serif; font-weight:400; font-size:3.6rem; line-height:.98; margin:0 0 1rem;
  letter-spacing:1px; background:linear-gradient(92deg,#fff 30%,#ff2056); -webkit-background-clip:text; background-clip:text; color:transparent; }
.lede { color:var(--muted); font-size:1.12rem; line-height:1.6; margin:0 0 1.4rem; max-width:42rem; }
.lede em { color:var(--ink); font-style:normal; }
.lede strong { color:var(--ink); }
.proof { list-style:none; margin:0 0 1.6rem; padding:0; display:grid; gap:.55rem; max-width:42rem; }
.proof li { position:relative; padding-left:1.4rem; color:var(--muted); line-height:1.45; }
.proof li::before { content:"›"; position:absolute; left:0; color:var(--accent); font-weight:700; }
.proof b { color:var(--ink); }
.hero-cta { display:flex; gap:1rem; flex-wrap:wrap; margin-bottom:1.2rem; }
.cta-primary { display:inline-block; background:var(--accent); color:#fff; text-decoration:none; font-weight:700;
  padding:.85rem 1.6rem; border-radius:.6rem; letter-spacing:.02em; }
.cta-primary:hover { background:var(--accent-2); }
.scope { font-size:.85rem; color:var(--ink); margin:0; padding-top:1rem; border-top:1px solid var(--line); }

main { max-width:48rem; margin:1rem auto 4rem; padding:0 1rem; display:grid; gap:1.25rem; }
.card { background:var(--panel); border:1px solid var(--line); border-radius:1rem; padding:1.6rem; }
.step-tag { display:inline-block; font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; font-weight:600;
  color:var(--accent); background:#ff20561f; border:1px solid #ff205633; padding:.25rem .6rem; border-radius:1rem; margin-bottom:.7rem; }
h2 { font-family:'Bebas Neue', sans-serif; font-weight:400; font-size:2rem; letter-spacing:.5px; margin:.1rem 0 1rem; }

form { display:grid; gap:.9rem; }
.field { display:grid; gap:.3rem; }
label { font-size:.78rem; letter-spacing:.02em; color:var(--muted); }
input { padding:.7rem .8rem; border:1px solid var(--line); border-radius:.6rem; font-size:1rem; font-family:inherit;
  background:var(--panel-2); color:var(--ink); }
input::placeholder { color:#5a5a78; }
input:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px #ff205633; }
.hint { font-size:.8rem; text-align:center; margin:.4rem 0 0; }

.chips { display:flex; gap:.5rem; flex-wrap:wrap; margin:.25rem 0; }
.chip { background:#ffffff10; border:1px solid var(--line); color:var(--ink); border-radius:1rem; padding:.35rem .8rem; cursor:pointer; font-family:inherit; }
.chip:hover { border-color:var(--accent); }

button#launch, .signals button, #score-btn { margin-top:.5rem; background:var(--accent); color:#fff; border:0;
  padding:.85rem; border-radius:.6rem; font-size:1rem; font-family:inherit; font-weight:600; cursor:pointer; letter-spacing:.02em; }
button#launch:hover, .signals button:hover, #score-btn:hover { background:var(--accent-2); }

.redesign { border:1px dashed var(--line); border-radius:.6rem; padding:.6rem .85rem; display:grid; gap:.4rem; }
.redesign summary { cursor:pointer; color:var(--muted); }
.redesign input[type=file] { padding:.3rem 0; color:var(--muted); }
.disclaimer { font-size:.78rem; margin:.25rem 0 0; }
.muted { color:var(--muted); }

/* Results / brand studio */
#results { display:grid; gap:1.5rem; }
#results h3 { font-family:'Bebas Neue', sans-serif; font-weight:400; font-size:1.4rem; letter-spacing:.6px;
  margin:.1rem 0 .5rem; color:var(--muted); border-bottom:1px solid var(--line); padding-bottom:.35rem; }
.pick { font-family:'Bebas Neue', sans-serif; font-weight:400; font-size:2.6rem; letter-spacing:.5px; color:var(--ink); margin:.2rem 0; }
.logos { display:flex; gap:1rem; flex-wrap:wrap; }
.logo-mark { border:1px solid var(--line); border-radius:.7rem; padding:1.1rem 1.3rem; background:#fff; min-width:180px; display:flex; align-items:center; justify-content:center; }
.logo-mark svg { max-width:220px; max-height:90px; height:auto; }
.tagline { font-size:1.2rem; color:var(--violet); }
.chip.score b { color:var(--accent); }
.chip em { color:var(--muted); font-size:.75rem; margin-left:.2rem; }
.swatches { display:flex; gap:1rem; flex-wrap:wrap; margin:.5rem 0; }
.swatch { display:grid; justify-items:center; font-size:.72rem; gap:.25rem; color:var(--muted); }
.swatch span { width:52px; height:52px; border-radius:.5rem; border:1px solid #ffffff22; display:block; }
.swatch code { font-size:.7rem; }
.platform { margin:.5rem 0; }
.platform h4 { margin:.4rem 0 .2rem; text-transform:capitalize; color:var(--violet); }
.post { border-left:3px solid var(--accent); padding:.15rem .8rem; margin:.4rem 0; }
.post p { margin:.15rem 0 .4rem; color:var(--muted); }

/* Launch board */
.status { font-weight:600; }
.steps { list-style:none; padding:0; display:grid; gap:.45rem; }
.steps li { color:var(--muted); }
.steps li.done { color:var(--ok); } .steps li.done .dot::before { content:"✓"; }
.steps li.fail { color:var(--bad); } .steps li.fail .dot::before { content:"✗"; }
.dot { display:inline-block; width:1.2rem; }
.error { color:var(--bad); }

/* Site preview + publish */
iframe#preview { width:100%; height:520px; border:1px solid var(--line); border-radius:.7rem; background:#fff; }
.publish { margin-top:1rem; display:flex; flex-wrap:wrap; align-items:center; gap:.75rem; }
#publish-btn { background:var(--ink); color:#0d0d14; border:0; padding:.75rem 1.3rem; border-radius:.6rem; font-size:1rem; font-family:inherit; font-weight:700; cursor:pointer; }
#publish-btn:hover { background:#fff; }
#publish-btn:disabled { opacity:.5; cursor:default; }
#publish-link { width:100%; margin:.25rem 0 0; font-weight:600; }
#publish-link a { color:var(--accent); }

/* Validation gauge */
.signals { display:grid; grid-template-columns:repeat(2, 1fr); gap:.6rem 1rem; align-items:end; }
#validation-result { margin-top:1rem; }
.gauge { display:flex; align-items:center; gap:.75rem; font-weight:600; }
.badge { padding:.2rem .6rem; border-radius:1rem; color:#0d0d14; background:#555; text-transform:capitalize; font-weight:700; }
.meter { flex:1; height:12px; background:var(--panel-2); border:1px solid var(--line); border-radius:6px; overflow:hidden; }
.meter-fill { height:100%; width:0; transition:width .4s; background:#555; }
.decision { font-family:'Bebas Neue', sans-serif; font-weight:400; font-size:1.8rem; letter-spacing:.5px; margin:.5rem 0 .25rem; }
.badge.band-weak, .meter-fill.band-weak { background:var(--bad); }
.badge.band-promising, .meter-fill.band-promising { background:var(--warn); }
.badge.band-strong, .meter-fill.band-strong { background:var(--ok); }
.decision.band-weak { color:var(--bad); }
.decision.band-promising { color:var(--warn); }
.decision.band-strong { color:var(--ok); }
