:root{
  --navy:#071f4f;
  --green:#157a43;
  --green-dark:#0d6436;
  --green-soft:#edf6f0;
  --paper:#fbfdfc;
  --white:#fff;
  --text:#13203b;
  --muted:#647089;
  --line:#dfe7e2;
  --shadow:0 24px 70px rgba(20,55,42,.08);
}
*{box-sizing:border-box}
html{min-height:100%;background:var(--paper)}
body{margin:0;min-height:100%;font-family:"DM Sans",Arial,sans-serif;color:var(--text);background:
  radial-gradient(circle at 12% 10%,rgba(43,138,83,.045),transparent 28%),
  radial-gradient(circle at 88% 78%,rgba(7,31,79,.025),transparent 30%),
  linear-gradient(180deg,#fff 0%,var(--paper) 100%);-webkit-font-smoothing:antialiased}
button,a{font:inherit}button{cursor:pointer}a{text-decoration:none;color:inherit}
.compat-page{min-height:100vh;min-height:100dvh;display:grid;grid-template-rows:auto auto 1fr auto}
.compat-header{height:82px;width:min(1180px,calc(100% - 48px));margin:0 auto;display:flex;align-items:center;justify-content:space-between}
.compat-brand{display:flex;align-items:center;gap:14px}.compat-brand img{width:48px;height:48px;object-fit:contain}.compat-brand span{display:flex;flex-direction:column;gap:4px}.compat-brand strong{font-family:Manrope,sans-serif;font-size:19px;letter-spacing:.25em;font-weight:500;color:var(--navy)}.compat-brand small{font-size:9px;letter-spacing:.27em;color:#91a0b0}
.compat-close{font-size:14px;color:#647089;padding:10px 0;transition:color .2s ease}.compat-close:hover{color:var(--green)}
.compat-progress-wrap{width:min(760px,calc(100% - 48px));margin:0 auto}.compat-progress{height:4px;border-radius:99px;background:#e6ece8;overflow:hidden}.compat-progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,#1a7342,#4f9c72);border-radius:inherit;transition:width 350ms ease}
.compat-main{display:grid;place-items:center;padding:40px 24px 58px}.compat-stage{width:min(760px,100%);min-height:520px;display:grid;place-items:center;position:relative}
.compat-intro,.compat-result{width:100%;text-align:center;animation:compatIn .45s ease both}.compat-kicker,.compat-question-kicker{display:block;font-size:12px;letter-spacing:.18em;font-weight:600;color:var(--green)}
.compat-intro h1{margin:18px 0 20px;font-family:Manrope,sans-serif;font-size:clamp(44px,7vw,72px);line-height:1.04;letter-spacing:-.052em;font-weight:400;color:var(--navy)}
.compat-intro p{max-width:650px;margin:0 auto 30px;font-size:18px;line-height:1.72;color:#46536a}.compat-intro small{display:block;margin-top:16px;color:#8a96a7;font-size:13px}
.compat-primary{display:inline-flex;align-items:center;justify-content:center;gap:25px;min-height:58px;padding:0 27px;border:1px solid #061c48;border-radius:8px;background:linear-gradient(135deg,#071f4f,#0d315f);color:#fff;font-weight:500;box-shadow:0 16px 34px rgba(7,31,79,.18);transition:transform .22s ease,box-shadow .22s ease}.compat-primary:hover{transform:translateY(-3px);box-shadow:0 20px 38px rgba(7,31,79,.24)}
.compat-question-screen{width:100%;position:relative}.compat-back{border:0;background:transparent;color:#69758a;padding:10px 0;margin-bottom:10px;font-size:14px;transition:color .2s}.compat-back:hover{color:var(--green)}
.compat-question-card{width:100%;transition:opacity 260ms ease,transform 260ms ease}.compat-question-card.is-exiting{opacity:0;transform:translateY(-8px)}.compat-question-card.is-entering{animation:questionIn 280ms ease both}.compat-question-card h1{margin:17px 0 30px;font-family:Manrope,sans-serif;font-size:clamp(34px,5vw,52px);line-height:1.13;letter-spacing:-.043em;font-weight:400;color:var(--navy)}
.compat-options{display:grid;gap:12px}.compat-option{position:relative;width:100%;min-height:64px;padding:17px 54px 17px 20px;border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.9);color:var(--text);text-align:left;font-size:16px;line-height:1.4;box-shadow:0 8px 22px rgba(20,55,42,.025);transition:border-color .2s ease,background .2s ease,transform .2s ease,box-shadow .2s ease}.compat-option:hover,.compat-option:focus-visible{outline:none;border-color:#8eb89e;background:#f7fbf8;transform:translateY(-1px);box-shadow:0 11px 26px rgba(20,55,42,.055)}.compat-option::after{content:"";position:absolute;right:20px;top:50%;width:19px;height:19px;border:1px solid #cbd7d0;border-radius:50%;transform:translateY(-50%);transition:.2s}.compat-option[aria-checked="true"]{border-color:var(--green);background:var(--green-soft);color:#0b5830}.compat-option[aria-checked="true"]::after{border-color:var(--green);background:var(--green);box-shadow:inset 0 0 0 5px var(--green-soft)}.compat-option:disabled{cursor:default}
.compat-loading{text-align:center;animation:compatIn .3s ease both}.compat-loader{width:58px;height:58px;margin:0 auto 18px;border-radius:50%;border:2px solid #dfeae3;border-top-color:var(--green);animation:spin .75s linear infinite}.compat-loading p{margin:0;color:#536078}
.compat-result{max-width:720px}.compat-score-line{display:flex;align-items:flex-end;justify-content:center;margin:20px 0 8px;color:var(--navy)}.compat-score-line strong{font-family:Manrope,sans-serif;font-size:clamp(76px,13vw,120px);line-height:.9;letter-spacing:-.07em;font-weight:400}.compat-score-line span{font-size:24px;margin:0 0 12px 10px;color:#7a879a}.compat-result h1{margin:20px 0 14px;font-family:Manrope,sans-serif;font-size:clamp(32px,5vw,48px);line-height:1.15;letter-spacing:-.04em;font-weight:400;color:var(--navy)}.compat-result-description{max-width:650px;margin:0 auto 25px;font-size:17px;line-height:1.7;color:#4d5a71}
.compat-insights{display:grid;gap:10px;text-align:left;margin:0 auto 30px}.compat-insight{position:relative;padding:16px 18px 16px 47px;border:1px solid #dce8e0;border-radius:10px;background:#f7fbf8;font-size:15px;line-height:1.5;color:#31443b}.compat-insight::before{content:"✓";position:absolute;left:17px;top:16px;width:21px;height:21px;display:grid;place-items:center;border-radius:50%;background:var(--green);color:#fff;font-size:13px;font-weight:600}
.compat-result-actions{display:flex;justify-content:center;align-items:center;gap:16px;flex-wrap:wrap}.compat-secondary{min-height:56px;padding:0 23px;border:1px solid #cfd9d3;border-radius:8px;background:#fff;color:var(--navy);transition:.2s}.compat-secondary:hover{border-color:#91b5a0;background:#f8fbf9}.compat-disclaimer{max-width:600px;margin:24px auto 0;font-size:12px;line-height:1.55;color:#929cab}
.compat-footer{text-align:center;padding:18px 24px 26px;color:#98a2b1;font-size:12px}
[hidden]{display:none!important}
@keyframes compatIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes questionIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:680px){.compat-header{height:72px;width:calc(100% - 32px)}.compat-brand img{width:40px;height:40px}.compat-brand strong{font-size:15px}.compat-brand small{font-size:8px}.compat-progress-wrap{width:calc(100% - 40px)}.compat-main{padding:30px 20px 42px;place-items:start center}.compat-stage{min-height:calc(100dvh - 170px);align-content:center}.compat-intro h1{font-size:44px}.compat-intro p{font-size:16px}.compat-question-card h1{font-size:34px;margin-bottom:24px}.compat-option{min-height:58px;padding:15px 50px 15px 17px;font-size:15px}.compat-score-line strong{font-size:88px}.compat-result h1{font-size:34px}.compat-result-actions{align-items:stretch;flex-direction:column}.compat-primary,.compat-secondary{width:100%}}
@media(max-height:680px) and (max-width:680px){.compat-stage{align-content:start}.compat-main{padding-top:24px}.compat-question-card h1{font-size:30px}.compat-options{gap:9px}.compat-option{min-height:54px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

.compat-intro-actions{display:flex;justify-content:center;gap:12px;align-items:center;flex-wrap:wrap}.compat-intro-actions .compat-secondary{display:inline-flex;align-items:center;justify-content:center;gap:18px}.compat-detailed-link{display:inline-flex;align-items:center;justify-content:center}
