:root{--ok: #1b7f4b;--ok-bg: #e7f4ec;--warn: #9a4a06;--warn-bg: #fff3df;--bad: #b42318;--bad-bg: #fdecea;--info-bg: #eaf0fd}@layer components{.tool-form{display:grid;gap:12px;max-width:46rem;padding:10px;border-radius:calc(var(--r-input) + 10px);background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-card)}.tool-form .field{background:var(--bg)}.tool-form-row{display:grid;gap:10px;align-items:end}@media(min-width:640px){.tool-form-row{grid-template-columns:minmax(0,1fr) auto}}.tool-form .btn[disabled]{opacity:.7;cursor:progress}.tool-meta{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:14px;font-size:var(--fs-small);color:var(--muted)}.tool-meta span:before{content:"✓";margin-right:6px;color:var(--accent-ink);font-weight:700}.tool-progress{display:none;align-items:center;gap:14px;padding:14px 16px;border-radius:var(--r-input);background:var(--dark);color:var(--on-dark);font-size:15px}.tool-progress.is-on{display:flex}.tool-progress:before{content:"";flex:none;width:18px;height:18px;border-radius:999px;border:2.5px solid rgb(255 255 255 / .25);border-top-color:var(--accent);animation:tool-spin .8s linear infinite}@keyframes tool-spin{to{transform:rotate(360deg)}}.tool-progress-bar{flex:1;min-width:0}.tool-progress-track{margin-top:8px;height:4px;border-radius:999px;background:#ffffff26;overflow:hidden}.tool-progress-track i{display:block;height:100%;width:4%;background:var(--accent);transition:width 1s linear}.report-head{display:grid;gap:28px;padding:clamp(24px,4vw,44px);border-radius:var(--r-card-lg);background:var(--dark);color:var(--on-dark)}@media(min-width:900px){.report-head{grid-template-columns:minmax(0,1fr) auto;align-items:center}}.report-head .eyebrow{color:var(--on-dark-muted)}.report-head-title{font-size:clamp(26px,3.2vw,40px);line-height:1.08;letter-spacing:-.03em;font-weight:600;text-wrap:balance}.report-head-url{font-family:var(--ff-mono);font-size:13px;color:var(--on-dark-muted);word-break:break-all}.report-head-scores{display:flex;flex-wrap:wrap;gap:20px 28px;justify-content:space-around}.report-facts{display:flex;flex-wrap:wrap;gap:8px}.report-fact{display:inline-flex;gap:6px;align-items:baseline;padding:7px 12px;border-radius:var(--r-pill);background:#ffffff14;border:1px solid var(--on-dark-line);font-size:13px;color:var(--on-dark-muted)}.report-fact b{color:var(--on-dark);font-weight:600}.score{display:grid;justify-items:center;gap:10px;text-align:center}.score-ring{position:relative;width:var(--size, 132px);aspect-ratio:1}.score-ring svg{width:100%;height:100%;transform:rotate(-90deg)}.score-ring .track{stroke:#ffffff1f}.score-light .score-ring .track{stroke:var(--surface-2)}.score-ring .bar{stroke:var(--tone, var(--accent));stroke-linecap:round;transition:stroke-dashoffset 1.2s var(--ease-out)}.score-value{position:absolute;inset:0;display:grid;place-content:center;font-family:var(--ff-mono);font-size:calc(var(--size, 132px) * .27);font-weight:500;letter-spacing:-.04em;line-height:1}.score-value small{display:block;margin-top:4px;font-size:11px;letter-spacing:.04em;opacity:.65}.score-max{font-size:.5em;opacity:.6}.report-head .score{--size: 104px}.report-head .score-label{font-size:13px;max-width:9em}.report-head .report-head-scores{gap:16px}@media(min-width:640px){.report-head .score{--size: 132px}.report-head .score-label{font-size:14px;max-width:11em}.report-head .report-head-scores{gap:20px 28px}}.score-label{font-size:14px;font-weight:600;max-width:11em}.pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 8px;border-radius:var(--r-pill);font-size:13px;font-weight:600;line-height:1.3;white-space:nowrap}.pill:before,.status-dot{display:inline-grid;place-content:center;width:16px;height:16px;border-radius:999px;font-size:10px;font-weight:800;color:#fff;flex:none}.pill:before{content:var(--icon)}.is-goed{--c: var(--ok);--bgc: var(--ok-bg);--icon: "✓"}.is-let-op{--c: var(--warn);--bgc: var(--warn-bg);--icon: "!"}.is-slecht{--c: var(--bad);--bgc: var(--bad-bg);--icon: "✕"}.is-info{--c: var(--secondary);--bgc: var(--info-bg);--icon: "i"}.is-neutraal{--c: var(--muted);--bgc: var(--surface-2);--icon: "·"}.pill{color:var(--c);background:var(--bgc)}.pill:before,.status-dot{background:var(--c)}.rsec{margin-top:clamp(40px,6vw,72px)}.rsec-head{display:grid;gap:14px;padding-bottom:18px;margin-bottom:20px;border-bottom:1px solid var(--line)}@media(min-width:900px){.rsec-head{grid-template-columns:minmax(0,1fr) minmax(0,20rem);align-items:end;gap:32px}}.rsec-num{font-family:var(--ff-mono);font-size:13px;color:var(--muted)}.rsec-title{margin-top:6px;font-size:var(--fs-h3);font-weight:600;letter-spacing:-.02em;line-height:1.15}.rsec-intro{margin-top:8px;color:var(--muted);max-width:44em}.meter{display:grid;gap:8px}.meter-bar{display:flex;gap:3px;height:10px}.meter-bar i{border-radius:999px;min-width:6px}.meter-legend{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:13px;color:var(--muted)}.meter-legend span{display:inline-flex;align-items:center;gap:6px}.meter-legend span:before{content:"";width:8px;height:8px;border-radius:999px;background:var(--c)}.checks{display:grid;gap:10px}.check{display:grid;align-content:start;grid-template-columns:auto minmax(0,1fr);gap:4px 12px;padding:16px;border-radius:20px;background:var(--surface);border:1px solid var(--line)}@media(min-width:640px){.check{gap:4px 14px;padding:18px 20px}}.check>.status-dot{width:26px;height:26px;font-size:13px;margin-top:1px}.check>.status-dot:before{content:var(--icon)}.check-title{font-weight:600;line-height:1.35}.check-detail{grid-column:2;color:var(--muted);font-size:15px;overflow-wrap:anywhere}.check-fix{grid-column:2;margin-top:8px;padding:10px 14px;border-radius:12px;background:var(--bgc);font-size:15px}.check-fix b{color:var(--c)}.check-aside{grid-column:2;display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}@media(min-width:900px){.check{grid-template-columns:auto minmax(0,1fr) auto;align-items:start}.check-aside{grid-column:3;grid-row:1 / span 3;margin-top:0;justify-content:flex-end}}.rtiles{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}@media(min-width:900px){.rtiles{grid-template-columns:repeat(var(--cols, 4),minmax(0,1fr))}}.rtile{display:grid;align-content:space-between;gap:14px;min-height:130px;padding:18px;border-radius:22px;background:var(--surface);border:1px solid var(--line)}.rtile-value{font-family:var(--ff-mono);font-size:clamp(28px,3vw,40px);font-weight:500;letter-spacing:-.04em;line-height:1}.rtile-label{font-size:14px;color:var(--muted);line-height:1.35}.rlist{display:grid;gap:8px}.ritem{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 16px;align-items:center;padding:14px 16px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}@media(max-width:639px){.ritem-stack{grid-template-columns:minmax(0,1fr)}}.ritem-main{min-width:0;overflow-wrap:anywhere}.ritem-sub{display:block;margin-top:2px;font-size:14px;color:var(--muted)}.tag{display:inline-flex;align-items:center;padding:3px 9px;border-radius:var(--r-pill);background:var(--surface-2);font-family:var(--ff-mono);font-size:12px;color:var(--ink);white-space:nowrap}.tag-dark{background:var(--dark);color:var(--on-dark)}.bar-inline{position:relative;height:8px;border-radius:999px;background:var(--surface-2);overflow:hidden}.bar-inline i{position:absolute;inset:0 auto 0 0;border-radius:999px;background:var(--c, var(--ink))}.gate{position:relative;display:grid;gap:22px;padding:clamp(24px,4vw,40px);border-radius:var(--r-card-lg);background:var(--dark);color:var(--on-dark);overflow:hidden}@media(min-width:900px){.gate{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center}}.gate ul{display:grid;gap:10px}.gate li{display:flex;gap:10px;color:var(--on-dark-muted)}.gate li:before{content:"✓";color:var(--accent);font-weight:700}.locked{position:relative;max-height:420px;overflow:hidden}.locked:after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,transparent,var(--bg) 85%)}.locked>*{filter:blur(3px);user-select:none;pointer-events:none}.codebox{display:grid;border-radius:22px;overflow:hidden;border:1px solid var(--dark);background:var(--dark)}.codebox-bar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px 10px 18px;color:var(--on-dark-muted);font-family:var(--ff-mono);font-size:13px}.codebox textarea{width:100%;min-height:420px;padding:18px;border:0;resize:vertical;background:#0d2038;color:var(--on-dark);font-family:var(--ff-mono);font-size:13px;line-height:1.6}.codebox textarea:focus{outline:2px solid var(--accent);outline-offset:-2px}.answer{border-radius:16px;background:var(--surface);border:1px solid var(--line)}.answer>summary{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:14px 18px;cursor:pointer;list-style:none}.answer>summary::-webkit-details-marker{display:none}.answer>summary:after{content:"+";margin-left:auto;font-size:20px;line-height:1}.answer[open]>summary:after{content:"−"}.answer-body{padding:0 18px 18px;font-size:15px;color:var(--muted);white-space:pre-line;overflow-wrap:anywhere}}
