:root{
  --green:#2E6B5B;
  --green-dark:#204F43;
  --green-soft:#EAF3EF;
  --ink:#18352F;
  --muted:#5D6D68;
  --paper:#FFFFFF;
  --bg:#F4F7F5;
  --line:#D6E1DC;
  --warn:#FFF5D6;
  --warn-line:#DFC15D;
  --danger:#FDEAEA;
  --danger-line:#D89A9A;
  --shadow:0 18px 45px rgba(31,55,47,.12);
  --radius:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.5;
}
.site-header{
  background:var(--paper);
  border-bottom:1px solid var(--line);
  padding:18px 24px;
}
.brand-wrap{
  max-width:1000px;
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:14px;
}
.brand-logo{
  width:58px;
  height:58px;
  border-radius:50%;
  display:block;
  object-fit:cover;
}
.brand{font-size:1.5rem;font-weight:700;letter-spacing:.2px}
.tagline{font-size:.95rem;color:var(--muted);margin-top:2px}
.shell{max-width:1000px;margin:34px auto;padding:0 18px}
.app-card{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:30px;
  min-height:590px;
}
.reading{max-width:840px;margin:0 auto}
.progress-wrap{margin-bottom:28px}
.progress-label{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  color:var(--muted);font-size:.9rem;
}
.progress-track{
  height:8px;background:#E8EFEC;border-radius:999px;overflow:hidden;margin-top:8px;
}
.progress-bar{
  width:0;height:100%;background:var(--green);transition:width .2s ease;
}
h1{font-size:clamp(1.8rem,3vw,2.5rem);line-height:1.15;margin:0 0 12px}
h2{font-size:1.35rem;margin:28px 0 10px}
h3{margin-top:0}
.lead{font-size:1.08rem;color:var(--muted);max-width:760px}
.small{font-size:.9rem;color:var(--muted)}
.required{color:#8E2E2E;font-weight:700}
.form-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:26px;
}
.field{display:flex;flex-direction:column;gap:7px}
.field.full{grid-column:1/-1}
label{font-weight:700}
input[type="text"],input[type="tel"]{
  width:100%;padding:13px 14px;border:1px solid #B8C8C1;border-radius:10px;
  font:inherit;background:#fff;color:var(--ink);
}
input:focus{outline:3px solid rgba(46,107,91,.15);border-color:var(--green)}
.checkbox-row{display:flex;gap:10px;align-items:flex-start;margin-top:6px}
.checkbox-row input{margin-top:4px}
.inline-link{color:var(--green-dark);font-weight:700}
.location-row{display:flex;gap:10px;align-items:center}
.location-row input{flex:1}
.choice-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:24px;
}
.choice{
  border:2px solid var(--line);border-radius:14px;padding:18px;text-align:left;
  background:#fff;cursor:pointer;font:inherit;color:var(--ink);min-height:74px;
  transition:.15s ease;
}
.choice:hover{border-color:#8BB6AA;background:#FBFDFC}
.choice.selected{
  border-color:var(--green);background:var(--green-soft);
  box-shadow:0 0 0 2px rgba(46,107,91,.08);
}
.choice-title{display:block;font-weight:700;font-size:1.03rem}
.choice-note{display:block;font-size:.86rem;color:var(--muted);margin-top:4px}
.alert{
  border:1px solid var(--warn-line);background:var(--warn);border-radius:14px;
  padding:18px;margin:18px 0;
}
.alert.danger{border-color:var(--danger-line);background:var(--danger)}
.alert.tip{border-color:#A8C8BD;background:#F0F8F5}
.guidance{
  border:1px solid var(--line);border-radius:14px;padding:20px;margin:18px 0;background:#FBFDFC;
}
.guidance ul{margin-bottom:0}
.result-card{
  border:1px solid var(--line);background:#FBFDFC;border-radius:14px;padding:20px;margin:18px 0;
}
.summary{width:100%;border-collapse:collapse;margin-top:18px}
.summary th,.summary td{padding:10px 8px;border-bottom:1px solid var(--line);vertical-align:top;text-align:left}
.summary th{width:34%;font-size:.9rem;color:var(--muted)}
.button{
  border:none;border-radius:10px;padding:12px 18px;font-weight:700;font-size:1rem;cursor:pointer;
}
.button.primary{background:var(--green);color:#fff}
.button.primary:hover{background:var(--green-dark)}
.button.secondary{background:#fff;color:var(--ink);border:1px solid #B8C8C1}
.button.tertiary{background:var(--green-soft);color:var(--green-dark)}
.button:disabled{opacity:.45;cursor:not-allowed}
.nav-row{
  display:flex;justify-content:space-between;gap:12px;margin-top:28px;
}
.text-button{
  border:none;background:transparent;color:var(--green-dark);font:inherit;text-decoration:underline;
  cursor:pointer;padding:0;
}
.hidden{display:none!important}
.site-footer{
  max-width:1000px;padding:0 18px 34px;margin:0 auto;color:var(--muted);font-size:.88rem;
}
.responder-list{display:grid;gap:12px;margin-top:16px}
.responder{
  border:1px solid var(--line);border-radius:12px;padding:16px;background:white;
}
.responder .name{font-weight:700;font-size:1.05rem}
.pill{
  display:inline-block;padding:4px 8px;border-radius:999px;background:var(--green-soft);
  color:var(--green-dark);font-size:.78rem;font-weight:700;margin:4px 5px 0 0;
}
@media(max-width:700px){
  .site-header{padding:14px 18px}
  .brand-logo{width:50px;height:50px}
  .tagline{font-size:.85rem}
  .app-card{padding:20px;min-height:0}
  .form-grid,.choice-grid{grid-template-columns:1fr}
  .location-row{align-items:stretch;flex-direction:column}
  .nav-row{position:sticky;bottom:0;background:#fff;padding-top:14px}
}
