/* QLE application form.
   Palette from the site: forest green, fresh lime, sage and cream.
   Phones: a forest header band with the step name, and the form in a white card
   that sits on a soft sage page, so it reads as one finished object, not text on a page.
   Desktop: the same card, centred. */
:root{
  color-scheme: light;
  --forest:#173f35;
  --forest-2:#245448;
  --lime:#e0ef9a;
  --lime-soft:#f1f7d2;
  --sage:#e7eddf;
  --sage-2:#f3f6ee;
  --cream:#fffef9;
  --card:#ffffff;
  --ink:#193a32;
  --muted:#51635c;
  --line:#d5dcd0;
  --field:#c3cfc0;
  --amber-bg:#fff6df;
  --amber:#e5b93c;
  --red:#b3261e;
  /* names the form script and older rules still use */
  --brand:var(--forest); --brand-dark:var(--forest-2); --brand-deep:var(--forest); --brand-tint:var(--sage-2);
  --navy:var(--forest); --on-brand:#fff; --bg:var(--sage); --ok:#3e7d1e;
  --radius:16px; --tap:52px; --maxw:540px;
  --font:"Segoe UI",system-ui,-apple-system,Roboto,Arial,Helvetica,sans-serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
[hidden]{display:none!important}
html,body{margin:0;padding:0}
body{font-family:var(--font); color:var(--ink); background:var(--sage); font-size:17px; line-height:1.5; -webkit-font-smoothing:antialiased}
.site-header,.site-footer,#site-header,#site-footer{display:none!important}
svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}

.wrap{width:100%; max-width:var(--maxw); margin:0 auto; min-height:100dvh; display:flex; flex-direction:column}

/* ---------- header: one row of brand, one row of progress ---------- */
.top{position:relative; z-index:5; background:var(--forest); color:#fff;
  padding:calc(6px + env(safe-area-inset-top)) 12px 22px; background-image:radial-gradient(120% 140% at 100% 0%, #2c6555 0%, transparent 55%)}
.toprow{display:flex; align-items:center; gap:6px; min-height:44px}
.logo{display:flex; align-items:center; gap:9px; color:#fff; text-decoration:none; font-weight:750; font-size:16px; letter-spacing:-.03em; line-height:1.1; min-height:44px; margin-right:auto}
.logo i{display:grid; place-items:center; width:30px; height:30px; border-radius:9px 9px 3px 9px; background:var(--lime); color:var(--forest); font-style:normal; font-size:18px; font-weight:800}
.logo small{display:none}
.backbtn{display:none; place-items:center; width:40px; height:40px; margin-left:-4px; border:0; border-radius:50%; background:rgba(255,255,255,.12); color:#fff; cursor:pointer; padding:0}
.backbtn.show{display:grid}
.backbtn:active{background:rgba(255,255,255,.22)}
.help{display:flex; align-items:center; gap:6px; min-height:36px; padding:0 13px; border-radius:99px; background:rgba(255,255,255,.12); color:#fff; text-decoration:none; font-size:14px; font-weight:650}
.help svg{width:16px; height:16px}
.backbtn:focus-visible,.help:focus-visible,.logo:focus-visible{outline:3px solid var(--lime); outline-offset:2px}

.progress{margin-top:8px}
.progmeta{display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:7px}
.stepname{font-size:17px; font-weight:750; letter-spacing:-.01em}
.stepcount{font-size:13px; font-weight:650; color:var(--lime); white-space:nowrap}
.bar{height:6px; background:rgba(255,255,255,.16); border-radius:99px; overflow:hidden}
.bar>i{display:block; height:100%; width:0; background:var(--lime); border-radius:99px; transition:width .35s ease}
.is-welcome .progress{display:none}
.is-welcome .top{padding-bottom:20px}

/* ---------- the card ---------- */
main{flex:1; position:relative; margin:-14px 10px 0; padding:22px 18px 24px; background:var(--card); border-radius:22px;
  box-shadow:0 1px 0 rgba(23,63,53,.04), 0 10px 30px rgba(23,63,53,.08); z-index:6}
h1{font-size:25px; line-height:1.2; margin:0 0 6px; font-weight:750; letter-spacing:-.025em; color:var(--forest)}
h1:focus{outline:none}
.sub{color:var(--muted); font-size:15.5px; line-height:1.45; margin:0 0 20px}
.eyebrow{display:none}

.fld{display:block; margin:0 0 18px}
.fld>span{display:block; font-weight:650; margin-bottom:7px; font-size:15.5px}
.hint,.fld>span.hint{display:block; font-weight:400; color:var(--muted); font-size:13.5px; line-height:1.4; margin-top:6px}
.nudge,.fld>span.nudge{display:block; font-size:13px; font-weight:500; color:var(--red); margin:6px 0 0}
.nudge:empty{display:none}
input[type=text],input[type=email],input[type=tel],input[type=number],input[type=date],select{
  width:100%; max-width:100%; min-width:0; min-height:var(--tap); padding:12px 14px; font-size:17px; font-family:inherit;
  border:1.5px solid var(--field); border-radius:12px; background:#fff; color:var(--ink); outline:none; transition:border-color .15s, box-shadow .15s}
select{appearance:none; -webkit-appearance:none; padding-right:40px;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23173f35' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center/18px}
input[type=date]{accent-color:var(--forest)}
input:focus,select:focus{border-color:var(--forest); box-shadow:0 0 0 4px var(--lime)}
.money{position:relative}
.money::before{content:"£"; position:absolute; left:14px; top:50%; transform:translateY(-50%); font-size:17px; color:var(--muted); font-weight:750}
.money input{padding-left:31px}

.addrwait{display:flex; align-items:center; gap:12px; min-height:48px; margin:0 0 12px}
.addrwait p{margin:0; color:var(--forest); font-weight:650; font-size:15px}
.scrow{position:relative}
.scrow input{padding-right:48px}
.scrow .spin-sm{position:absolute; right:14px; top:50%; margin-top:-14px}
.addrlist{border:1.5px solid var(--field); border-radius:12px; margin:0 0 12px; max-height:220px; overflow-x:hidden; overflow-y:auto}
.addrlist button{display:block; width:100%; text-align:left; padding:12px 14px; min-height:48px; border:0; border-bottom:1px solid var(--line);
  background:#fff; font:inherit; font-size:15px; color:var(--ink); cursor:pointer}
.addrlist button:last-child{border-bottom:0}
.addrlist button:hover{background:var(--sage-2)}
.addrlist button:focus-visible{background:var(--lime-soft); outline:3px solid var(--forest); outline-offset:-3px}
.chosen{background:var(--lime-soft); border:1.5px solid var(--forest); border-radius:12px; padding:12px 14px; font-weight:650; margin-bottom:10px}
.chosen span{display:block; font-weight:400; font-size:14px; color:var(--muted); margin-top:2px}
.linkbtn{border:0; background:none; color:var(--forest); font:inherit; font-size:15px; font-weight:650; text-decoration:underline; text-underline-offset:3px; padding:8px 0; min-height:40px; cursor:pointer}

/* choice chips: lime when picked */
.choices{display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px}
.choices.two{grid-template-columns:1fr 1fr}
.choices.five{grid-template-columns:repeat(5,1fr)}
.choice{display:flex; align-items:center; justify-content:center; text-align:center; min-height:48px; width:100%;
  padding:8px 6px; border:1.5px solid var(--field); border-radius:12px; background:#fff; color:var(--ink);
  font-size:15px; font-weight:600; line-height:1.2; cursor:pointer; font-family:inherit; appearance:none; transition:background .15s, border-color .15s}
.choice:hover{border-color:var(--forest-2)}
.choice[aria-pressed="true"]{border:2px solid var(--forest); background:var(--lime); color:var(--forest); font-weight:700}
.choice:focus-visible{outline:3px solid var(--forest); outline-offset:2px}

.pair{display:grid; grid-template-columns:1fr 1fr; gap:0 10px; align-items:end}
.pair-13{grid-template-columns:1fr 2fr}
.fld .pair{margin:0}
.pairhint{margin:-6px 0 14px}
#coreNudge:empty{display:none}

/* loan amount */
.amount{font-size:46px; font-weight:750; text-align:center; margin:4px 0 0; letter-spacing:-.04em; color:var(--forest)}
input[type=range]{width:100%; height:44px; accent-color:var(--forest)}
.rangelabels{display:flex; justify-content:space-between; color:var(--muted); font-size:13px; font-weight:650; margin-top:-6px}

.quote{background:var(--sage-2); border:0; border-radius:var(--radius); padding:16px; margin:18px 0 14px}
.quote .mid{font-size:30px; font-weight:750; color:var(--forest); text-align:center; line-height:1.1; letter-spacing:-.03em}
.quote .midlab{text-align:center; color:var(--muted); font-size:14px; font-weight:500; margin:4px 0 12px}
.costnote{text-align:center; font-size:13.5px; font-weight:650; color:var(--forest); margin-top:12px; padding-top:10px; border-top:1px solid var(--line)}
.figrow{display:flex; justify-content:space-between; flex-wrap:wrap; gap:4px 12px; padding:9px 0; font-size:15px; border-top:1px solid var(--line)}
.figrow b{font-weight:750; white-space:nowrap}
.figrow.quiet{color:var(--muted)}
.figrow.quiet span:last-child{font-weight:600; white-space:nowrap}
.sublab{font-size:16px; font-weight:750; margin:20px 0 0}
.sched{background:#fff; border:1px solid var(--line); border-radius:12px; overflow:hidden; margin:12px 0 0}
.sched .sh{display:flex; justify-content:space-between; padding:9px 14px; background:var(--sage-2); font-size:12.5px; font-weight:750; color:var(--forest)}
.sched .sr{display:flex; justify-content:space-between; gap:12px; padding:10px 14px; font-size:15px; border-top:1px solid var(--line)}
.sched .sr b{font-weight:750; white-space:nowrap}
.sched .sr.tot{background:var(--sage-2); font-weight:750}
details.more{margin-top:12px}
details.more>summary{cursor:pointer; list-style:none; color:var(--forest); font-weight:650; font-size:15px; padding:10px 0; min-height:44px; display:flex; align-items:center}
details.more>summary::-webkit-details-marker{display:none}
details.more>summary::after{content:" ▾"; margin-left:4px}
details.more[open]>summary::after{content:" ▴"}

/* Representative example at body size, not reduced: CONC 3.3.4R */
.repex{font-size:14px; line-height:1.5; color:var(--ink); margin-top:14px; padding:12px 0 0; border-top:1px solid var(--line)}
/* Prescribed HCSTC risk warning: CONC 3.6.2R */
.riskbar{font-size:14px; line-height:1.45; color:#4e3f26; background:var(--amber-bg); border:1px solid var(--amber); border-radius:12px; padding:11px 13px; margin:14px 0 0}
.riskbar a{color:inherit; font-weight:650}

/* affordability */
.panel{border-radius:var(--radius); padding:16px; margin:6px 0 16px}
.panel.pass{background:var(--lime-soft); border:1.5px solid #c9dc7a}
.panel.tight{background:var(--amber-bg); border:1.5px solid var(--amber)}
.panel p{margin:10px 0 0; font-size:14.5px; line-height:1.5}
.panel p.per{margin:0 0 2px; font-size:13px; color:var(--muted)}
.panel.tight a{color:var(--forest)}
.grp{margin:12px 0 2px; font-size:12px; font-weight:750; letter-spacing:.07em; text-transform:uppercase; color:var(--forest-2)}
.line{display:flex; justify-content:space-between; gap:12px; padding:6px 0; font-size:15px}
.line b{font-weight:650; white-space:nowrap; font-variant-numeric:tabular-nums}
.line b.na{color:var(--muted)}
.line.subtotal{margin-top:4px; padding-top:9px; border-top:1.5px solid var(--forest); font-weight:750}
.line.subtotal b{font-weight:750}
.line.total{margin-top:6px; padding:10px 12px; background:#fff; border:1.5px solid var(--forest); border-radius:12px; font-weight:750; font-size:16px}
.line.total b{font-weight:800; font-size:18px}

/* ---------- footer button ---------- */
.foot{position:sticky; bottom:0; z-index:7; padding:12px 16px calc(12px + env(safe-area-inset-bottom));
  background:linear-gradient(to top, var(--sage) 70%, rgba(231,237,223,0))}
.cta{display:flex; align-items:center; justify-content:center; gap:10px; width:100%; min-height:56px; border:0; border-radius:16px;
  background:var(--forest); color:#fff; font-size:18px; font-weight:700; cursor:pointer; font-family:inherit;
  box-shadow:0 8px 20px rgba(23,63,53,.22); transition:background .15s, opacity .15s, transform .1s}
.cta::after{content:""; width:28px; height:28px; border-radius:50%; background:var(--lime) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23173f35' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat center/16px}
.cta:hover:not([disabled]){background:var(--forest-2)}
.cta:active:not([disabled]){transform:scale(.99)}
.cta:focus-visible{outline:3px solid var(--forest); outline-offset:3px}
.cta[disabled]{background:#9fb0a7; box-shadow:none; cursor:not-allowed}
.cta[disabled]::after{background-color:#d9e2d6}
/* On the last screen the button stays tappable while the ticks are missing: a tap
   scrolls to the unticked boxes and highlights them, instead of doing nothing. */
.cta.blocked{background:#7f9589; cursor:pointer}
.reassure{text-align:center; color:var(--muted); font-size:13px; margin-top:7px}

/* ---------- welcome ---------- */
.hello{text-align:left}
.hello-art{display:flex; justify-content:center; background:#fefcf6; border-radius:18px; margin:-6px -4px 14px; padding:6px 0}
.hello-art img{display:block; height:116px; width:auto}
.hello-kicker{display:inline-block; margin:0 0 8px; padding:4px 12px; border-radius:99px; background:var(--lime); color:var(--forest); font-size:12.5px; font-weight:750; letter-spacing:.06em; text-transform:uppercase}
.hello h1{font-size:28px}
.hello .sub{margin-bottom:16px}
.promises{list-style:none; margin:0; padding:0; display:grid; gap:6px}
.promises li{display:flex; gap:12px; align-items:flex-start; padding:10px 12px; border-radius:14px; background:var(--sage-2)}
.promises i{display:grid; place-items:center; width:36px; height:36px; border-radius:11px; background:var(--forest); color:var(--lime); flex:0 0 36px}
.promises i svg{width:19px; height:19px}
.promises b{display:block; font-size:15.5px; font-weight:750; color:var(--forest); line-height:1.3}
.promises span{display:block; font-size:14px; color:var(--muted); line-height:1.4; margin-top:1px}
.thanks{margin:16px 0 0; text-align:center; font-weight:750; font-size:17px; color:var(--forest)}
.thanks::before{content:"♥"; color:#7fa34a; margin-right:7px}

/* ---------- consent, results ---------- */
.trust{display:flex; gap:8px 18px; justify-content:center; color:var(--muted); font-size:13px; font-weight:650; margin:12px 0 4px; flex-wrap:wrap}
.trust span{white-space:nowrap}
.trust span::before{content:"\2713\00a0"; color:var(--ok)}
.legal{font-size:14px; color:var(--muted); line-height:1.5; margin-top:14px}
.warnnote{background:var(--amber-bg); border:1px solid var(--amber); border-radius:12px; padding:14px; font-size:14.5px; color:var(--forest); margin-top:16px}
.next{background:var(--sage-2); border-radius:14px; padding:16px; margin:16px 0}
.next h3{margin:0 0 8px; font-size:15px; font-weight:750}
.next ol{margin:0; padding-left:20px; font-size:14.5px; line-height:1.5}
.next li{margin-bottom:8px}
.next li:last-child{margin-bottom:0}
.check{display:flex; gap:12px; align-items:flex-start; margin-bottom:16px}
/* flex-basis stops a long label shrinking one box more than the other. */
.check input{flex:0 0 26px; width:26px; height:26px; min-height:0; margin:1px 0 0; padding:0; accent-color:var(--forest)}
.check span{font-size:14.5px; line-height:1.5}
.check a{color:var(--forest); font-weight:650}
.check.flag{background:var(--lime-soft); outline:2px solid var(--forest); outline-offset:6px; border-radius:10px; margin-bottom:24px}
.stopnote{margin-top:12px; padding:14px; border-radius:12px; background:var(--amber-bg); border:1px solid var(--amber); color:var(--forest); font-size:14.5px; line-height:1.5}
.stopnote b{display:block; margin-bottom:4px}
.stopnote a{color:inherit; font-weight:700}
.done{text-align:center; padding-top:26px}
.done .tick{width:84px; height:84px; border-radius:50%; background:var(--lime); display:flex; align-items:center; justify-content:center; margin:0 auto 18px; font-size:42px; color:var(--forest)}
.submission-status{margin:12px 10px 0; padding:18px; background:#fff; border:1.5px solid var(--forest); border-radius:16px; font-size:16px; line-height:1.55}
.submission-status:focus{outline:2px solid var(--forest); outline-offset:4px}
.preview-notice{padding:10px 16px; background:var(--lime-soft); color:var(--forest); font-size:13px}

/* ---------- loader ---------- */
.loader{position:fixed; inset:0; z-index:20; margin:0; background:rgba(231,237,223,.86); backdrop-filter:blur(2px)}
.loader-box{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; gap:16px; pointer-events:none}
.spin{width:52px; height:52px; border-radius:50%; border:4px solid var(--lime); border-top-color:var(--forest); animation:spin .7s linear infinite}
.spin-sm{width:28px; height:28px; border-width:3px; flex:0 0 28px}
.loader p{margin:0; max-width:280px; padding:0 8px; text-align:center; color:var(--forest); font-weight:700; font-size:16px}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion: reduce){ .spin{animation:none; border-top-color:var(--lime); border-right-color:var(--forest)} .bar>i{transition:none} }

/* ---------- small phones ---------- */
@media(max-width:359px){
  main{margin-inline:6px; padding:18px 14px 20px}
  .top{padding-inline:8px}
  .logo{font-size:14.5px}
  .help span{display:none}
  .hello-art img{height:96px}
  .hello h1{font-size:25px}
  .help{padding:0 10px}
  h1{font-size:23px}
  .pair{grid-template-columns:1fr}
  .choices.five{grid-template-columns:repeat(3,1fr)}
  .choice{font-size:14px}
  .line{font-size:14px; gap:8px}
  .line.total{font-size:14px}
  .line.total b{font-size:16px}
}

/* ---------- tablets and desktop: the same card, centred on the page ---------- */
@media(min-width:700px){
  body{padding:32px 20px; background:var(--sage) radial-gradient(60% 50% at 50% 0%, #f1f7d2 0%, transparent 70%) no-repeat}
  .wrap{min-height:calc(100dvh - 64px); background:var(--card); border-radius:26px; overflow:clip; box-shadow:0 2px 0 rgba(23,63,53,.04), 0 24px 60px rgba(23,63,53,.14)}
  .top{position:relative; padding:14px 28px 22px}
  .logo small{display:block; font-size:11px; font-weight:450; color:rgba(255,255,255,.7); margin-top:3px; letter-spacing:0}
  main{margin:0; border-radius:0; box-shadow:none; padding:30px 36px 28px}
  h1{font-size:30px}
  .hello h1{font-size:32px}
  .hello-art img{height:170px}
  .foot{position:sticky; padding:14px 36px 22px; background:linear-gradient(to top, #fff 75%, rgba(255,255,255,0))}
  .cta{max-width:100%}
  .submission-status{margin:0 36px 24px}
}

.okline{display:block; font-size:13px; font-weight:600; color:#3e7d1e; margin:6px 0 0}
.okline::before{content:"\2713\00a0"}

/* ---------- result screens (decline and broker) ----------
   Short on purpose: the broker button must be on the first screen of a phone. */
.is-result .progress .bar{display:none}
.result{text-align:left}
.result h1{font-size:24px; margin-bottom:4px}
.result .sub{margin:0 0 12px}
.safe{display:flex; align-items:center; gap:8px; margin:0 0 14px; padding:10px 12px; border-radius:12px; background:var(--sage-2); color:var(--forest); font-weight:700; font-size:15px}
.safe::before{content:""; flex:0 0 22px; height:22px; border-radius:50%; background:var(--forest) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e0ef9a' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12l4 4 8-8'/%3E%3C/svg%3E") no-repeat center/14px}
.result-text{font-size:15.5px; line-height:1.5; margin:0 0 16px}
.broker{background:var(--forest); color:#fff; border-radius:18px; padding:18px 16px 10px; margin:0 0 12px;
  background-image:radial-gradient(120% 90% at 100% 0%, #2c6555 0%, transparent 60%)}
.broker h2{margin:0 0 6px; font-size:20px; line-height:1.25; color:#fff}
.broker p{margin:0 0 14px; font-size:15px; line-height:1.45; color:#dce7dd}
.broker .fine{margin:10px 0 0; font-size:12.5px; line-height:1.4; color:#b9cbbf}
.broker .cta{background:var(--lime); color:var(--forest); box-shadow:none}
.broker .cta::after{background-color:var(--forest); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e0ef9a' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E")}
.broker .cta:hover:not([disabled]){background:#ecf6c4}
.broker .cta[disabled]{background:#b9c6bd; color:var(--forest)}
.broker .result-no{display:block; width:100%; text-align:center; color:#fff; margin-top:2px; font-size:14px}
.broker.done{background:var(--lime-soft); color:var(--ink); background-image:none; border:1.5px solid #c9dc7a; padding:16px}
.broker.done h2{color:var(--forest)}
.broker.done p{color:var(--ink); margin:0}
.result-help{font-size:14px; color:var(--muted); line-height:1.5; margin-top:14px}
.result-help a{color:var(--forest); font-weight:650}

/* Budget check when the loan doesn't fit: three ways to fix it, the first open. */
.fix{border:1.5px solid var(--line); border-radius:14px; margin:0 0 8px; background:#fff; overflow:hidden}
.fix[open]{border-color:var(--forest)}
.fix>summary{display:flex; align-items:center; gap:10px; min-height:52px; padding:10px 14px; cursor:pointer; list-style:none; font-weight:700; font-size:15.5px; color:var(--forest)}
.fix>summary::-webkit-details-marker{display:none}
.fix>summary::after{content:""; margin-left:auto; width:10px; height:10px; border-right:2.5px solid var(--forest); border-bottom:2.5px solid var(--forest); transform:rotate(45deg); transition:transform .2s}
.fix[open]>summary::after{transform:rotate(225deg)}
.fix>summary i{display:grid; place-items:center; flex:0 0 26px; height:26px; border-radius:50%; background:var(--lime); font-style:normal; font-size:13px}
.fix>*:not(summary){margin-left:14px; margin-right:14px}
.fix>*:last-child{margin-bottom:14px}
.fix .panel{margin-top:0}
.fitlist{display:grid; gap:8px}
.fitopt{display:flex; justify-content:space-between; align-items:center; gap:10px; width:100%; min-height:54px; padding:10px 14px; border:1.5px solid var(--field); border-radius:12px; background:var(--sage-2); font:inherit; font-size:15px; color:var(--ink); cursor:pointer; text-align:left}
.fitopt b{font-size:17px; color:var(--forest)}
.fitopt span:last-child{font-weight:700; color:var(--forest); white-space:nowrap}
.fitopt:hover,.fitopt:focus-visible{border-color:var(--forest); background:var(--lime-soft)}
.fixnote{font-size:14px; color:var(--muted); margin:0 0 10px; line-height:1.45}
.fixbtns{display:grid; grid-template-columns:1fr 1fr; gap:8px}
.fixfine{font-size:13px; color:var(--muted); line-height:1.45; margin:10px 0 0}
.fixfine a{color:var(--forest); font-weight:650}
.fixdone{margin:0 0 10px; padding:10px 12px; border-radius:12px; background:var(--lime); color:var(--forest); font-weight:700; font-size:14.5px}
.line.total small{display:block; font-size:12px; font-weight:500; color:var(--muted)}
.result-text a{color:var(--forest); font-weight:650}
.result .thanks{text-align:left; margin:4px 0 12px}