/* Legacy Agent Card — shared calculator styling (navy/gold, phone-first) */
:root{
  --navy:#0F2540; --gold:#CFA882; --gold-soft:rgba(207,168,130,.14);
  --bg:#0a1626; --bg2:#0e1e34; --card:#11253f; --card2:#0f2138;
  --line:rgba(207,168,130,.18); --line2:rgba(255,255,255,.07);
  --text:#f3f1ec; --muted:#9fb0c4; --muted2:#7d8da5;
  --good:#3fbf87; --warn:#e6b25a; --bad:#e07a6b;
  --shadow:0 18px 50px -22px rgba(0,0,0,.75); --radius:16px;
}
html[data-theme="light"]{
  --bg:#f7f5f2; --bg2:#efeae3; --card:#ffffff; --card2:#faf8f4;
  --line:rgba(15,37,64,.14); --line2:rgba(15,37,64,.08);
  --text:#152c48; --muted:#5a6b80; --muted2:#7a8aa0;
  --shadow:0 18px 46px -24px rgba(15,37,64,.35);
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  font-family:"DM Sans",system-ui,-apple-system,Segoe UI,Roboto,sans-serif; color:var(--text);
  background:radial-gradient(1200px 620px at 50% -10%, var(--bg2), transparent 60%), var(--bg);
  min-height:100vh; min-height:100dvh; display:flex; justify-content:center;
  padding:16px 15px calc(40px + env(safe-area-inset-bottom)); -webkit-font-smoothing:antialiased;
}
.wrap{width:100%; max-width:460px}

.tbar{display:flex; align-items:center; justify-content:space-between; margin-bottom:16px}
.back{display:inline-flex; align-items:center; gap:7px; text-decoration:none; color:var(--muted);
  font-size:.86rem; font-weight:500; padding:8px 12px 8px 9px; border:1px solid var(--line2);
  border-radius:10px; background:var(--card); transition:.16s}
.back:hover{color:var(--gold); border-color:var(--line)}
.back svg{width:16px;height:16px}
.toggle{background:var(--card); border:1px solid var(--line2); color:var(--muted); width:38px; height:38px;
  border-radius:50%; cursor:pointer; display:grid; place-items:center; transition:.2s}
.toggle:hover{color:var(--gold); border-color:var(--line)}
.toggle svg{width:18px;height:18px}
.moon{display:none} html[data-theme="dark"] .moon{display:block} html[data-theme="dark"] .sun{display:none}

.head{text-align:center; margin-bottom:18px}
.head .eyebrow{font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); font-weight:600}
.head h1{font-family:"Playfair Display",Georgia,serif; font-weight:600; font-size:1.55rem; line-height:1.15; margin:8px 0 6px}
.head p{margin:0; font-size:.9rem; color:var(--muted); line-height:1.5}

.panel{background:linear-gradient(180deg,var(--card),var(--card2)); border:1px solid var(--line);
  border-radius:var(--radius); padding:20px 18px; box-shadow:var(--shadow)}
.panel + .panel{margin-top:14px}

.field{margin-bottom:14px}
.field:last-child{margin-bottom:0}
.field label{display:block; font-size:.82rem; font-weight:600; color:var(--text); margin-bottom:6px}
.field .hint{font-weight:400; color:var(--muted2); font-size:.76rem}
.inp{position:relative; display:flex; align-items:center}
.inp .pre,.inp .suf{position:absolute; color:var(--muted2); font-size:.9rem; pointer-events:none}
.inp .pre{left:13px} .inp .suf{right:13px}
input[type="number"],input[type="text"],input[type="email"],select{
  width:100%; padding:12px 13px; font-size:1rem; font-family:inherit; color:var(--text);
  background:var(--bg2); border:1px solid var(--line2); border-radius:11px; -webkit-appearance:none; appearance:none;
  transition:.15s}
.inp.has-pre input{padding-left:26px} .inp.has-suf input{padding-right:34px}
input:focus,select:focus{outline:none; border-color:var(--gold); background:var(--card)}
select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%239fb0c4' d='M1 1l5 5 5-5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 13px center; padding-right:34px}
.row2{display:grid; grid-template-columns:1fr 1fr; gap:12px}

.btn-calc{width:100%; margin-top:4px; padding:14px; border:none; border-radius:12px; background:var(--gold);
  color:#20150a; font-size:.98rem; font-weight:700; cursor:pointer; transition:.15s; font-family:inherit}
.btn-calc:hover{filter:brightness(1.06)}

/* results */
.results{margin-top:14px; display:none}
.results.show{display:block; animation:fade .3s ease}
@keyframes fade{from{opacity:0; transform:translateY(6px)}to{opacity:1; transform:none}}
.verdict{border-radius:13px; padding:15px 16px; margin-bottom:14px; border:1px solid; text-align:center}
.verdict .vlbl{font-size:.74rem; letter-spacing:.12em; text-transform:uppercase; font-weight:700; margin-bottom:4px}
.verdict .vmain{font-family:"Playfair Display",Georgia,serif; font-size:1.5rem; font-weight:600}
.verdict .vsub{font-size:.85rem; margin-top:5px; opacity:.9}
.v-good{background:rgba(63,191,135,.12); border-color:rgba(63,191,135,.4); color:var(--good)}
.v-warn{background:rgba(230,178,90,.12); border-color:rgba(230,178,90,.4); color:var(--warn)}
.v-bad{background:rgba(224,122,107,.12); border-color:rgba(224,122,107,.4); color:var(--bad)}
.v-neutral{background:var(--gold-soft); border-color:var(--line); color:var(--gold)}

.stat-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px}
.rstat{background:var(--bg2); border:1px solid var(--line2); border-radius:12px; padding:13px 14px}
.rstat.full{grid-column:1 / -1}
.rstat .rn{font-family:"Playfair Display",Georgia,serif; font-size:1.35rem; font-weight:600; color:var(--text)}
.rstat .rn.pos{color:var(--good)} .rstat .rn.neg{color:var(--bad)}
.rstat .rl{font-size:.76rem; color:var(--muted); margin-top:2px}

.note{font-size:.78rem; color:var(--muted2); line-height:1.55; margin-top:14px}
.cta{display:flex; gap:10px; margin-top:14px}
.cta a{flex:1; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:13px 12px;
  border-radius:12px; font-size:.9rem; font-weight:600; text-decoration:none; transition:.15s}
.cta .primary{background:var(--gold); color:#20150a}
.cta .primary:hover{filter:brightness(1.06)}
.cta .ghost{background:transparent; color:var(--text); border:1px solid var(--line)}
.cta .ghost:hover{border-color:var(--gold); color:var(--gold)}
.cta svg{width:17px;height:17px}

/* soft capture (appears with results) */
.capture{margin-top:14px}
.capture .cap-h{font-family:"Playfair Display",Georgia,serif; font-weight:600; font-size:1.12rem; margin:0 0 5px}
.capture .cap-p{margin:0; font-size:.85rem; color:var(--muted); line-height:1.5}
.capture form{margin-top:13px; display:flex; flex-direction:column; gap:10px}
.capture input{width:100%; padding:12px 13px; font-size:.98rem; font-family:inherit; color:var(--text);
  background:var(--bg2); border:1px solid var(--line2); border-radius:11px; -webkit-appearance:none}
.capture input:focus{outline:none; border-color:var(--gold)}
.capture .cap-ok{display:none; margin-top:4px; font-size:.9rem; color:var(--gold); font-weight:600; line-height:1.5}
.capture.done form{display:none} .capture.done .cap-ok{display:block}

.disclaim{margin-top:18px; font-size:.73rem; color:var(--muted2); line-height:1.55; text-align:center}
