/* Arconetspeed — aanvullingen op de Arcoscan/Arcobench-stijl: GO-knop, meetwijzer met gele voortgangsring, blauwe Telenet-achtige pictogrammen, resultaat en historiek. */
.btn.big { font-size:18px; padding:15px 30px; margin:8px 0 6px; }
.btn.primary { background:linear-gradient(180deg,#6b9bff,var(--accent3)); color:#fff; border-color:transparent; box-shadow:0 3px 0 var(--edge), 0 10px 20px var(--glow); }
.sec { margin:30px 0 12px; font-size:19px; }
.mission { margin:24px 0 10px; border-left:4px solid var(--gold); } .mission p { color:var(--muted); }
.support { text-align:center; margin:22px 0 6px; }
.bmc-btn { display:inline-flex; align-items:center; gap:8px; min-width:210px; height:60px; padding:0 24px; box-sizing:border-box; border-radius:12px; background:#5F7FFF; color:#fff; font:bold 24px/27px Arial,sans-serif; white-space:nowrap; text-decoration:none !important; }
.bmc-btn:hover { filter:brightness(1.08); }
.bmc-btn img { flex:none; width:auto; height:29px; }
.meas { list-style:none; padding:0; margin:0; display:grid; gap:12px; } .meas li { display:flex; gap:12px; align-items:flex-start; } .meas .ic { color:var(--accent2); flex:none; margin-top:2px; } .meas b { display:block; } .meas span { color:var(--muted); font-size:14px; }
.limit-note { display:inline-block; margin:2px auto 8px; padding:5px 14px; border-radius:99px; font-size:13.5px; font-weight:700; color:var(--gold2); background:rgba(240,180,41,.12); border:1px solid rgba(240,180,41,.35); }
.narrow .limit-note { display:table; margin:0 0 10px; }

/* Startpagina: meetwijzer als achtergrond-watermerk (zelfde belichting als Arcoscan/Arcobench) */
.hero > .hero-gauge { position:absolute !important; left:50%; top:70px; width:min(760px,125%); aspect-ratio:300/172; transform:translateX(-50%); opacity:.38; pointer-events:none; z-index:0; filter:drop-shadow(0 0 30px rgba(42,98,224,.35)); }
.hg-ring { fill:none; stroke:rgba(143,180,255,.16); stroke-width:1; }
.hg-ticks line { stroke:rgba(255,212,121,.36); stroke-width:1.6; stroke-linecap:round; } .hg-ticks line.maj { stroke:rgba(255,212,121,.6); stroke-width:3; }
.hg-arc { fill:none; stroke:#f0b429; stroke-width:3.5; stroke-linecap:round; opacity:.5; } .hg-band { fill:none; stroke:#f0b429; stroke-width:9; stroke-linecap:round; opacity:.48; }
.hg-needle { transform-box:view-box; transform-origin:150px 150px; animation:hgSwing 9s ease-in-out infinite; } .hg-wob { transform-box:view-box; transform-origin:150px 150px; animation:hgWob 1.7s ease-in-out infinite; }
.hg-needle path { opacity:.6; fill:#f0b429; stroke:#7a5a10; stroke-width:1; filter:drop-shadow(0 0 5px rgba(240,180,41,.8)); }
.hg-hub { fill:#06112b; stroke:#f0b429; stroke-width:3.5; } .hg-hub2 { fill:#f0b429; }
@keyframes hgSwing { 0% { transform:rotate(-72deg); } 35% { transform:rotate(34deg); } 55% { transform:rotate(10deg); } 80% { transform:rotate(58deg); } 100% { transform:rotate(-72deg); } }
@keyframes hgWob { 50% { transform:rotate(4deg); } }
@media (prefers-reduced-motion: reduce) { .hg-needle, .hg-wob { animation:none; transform:rotate(30deg); } }

/* GO-knop: blauwe schijf met gele ring */
.go { position:relative; z-index:2; width:176px; height:176px; border-radius:50%; border:0; cursor:pointer; margin:14px auto 2px; display:grid; place-items:center; color:#fff; font:800 42px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif; letter-spacing:.05em; background:radial-gradient(circle at 50% 30%, #3b73ea, #12399a 62%, #061a52); box-shadow:inset 0 2px 0 rgba(255,255,255,.28), 0 0 0 4px var(--gold), 0 14px 36px rgba(31,86,207,.55); transition:transform .18s, box-shadow .18s; }
.go::after { content:""; position:absolute; inset:-14px; border-radius:50%; border:2px solid rgba(240,180,41,.55); animation:goPulse 2.4s ease-out infinite; pointer-events:none; }
@keyframes goPulse { 0% { transform:scale(.94); opacity:.9; } 100% { transform:scale(1.18); opacity:0; } }
.go:hover:not(:disabled) { transform:scale(1.04); box-shadow:inset 0 2px 0 rgba(255,255,255,.35), 0 0 0 4px var(--gold2), 0 18px 44px rgba(91,141,255,.65); }
.go:active:not(:disabled) { transform:scale(.98); }
.go:disabled { filter:grayscale(.7); opacity:.5; cursor:not-allowed; } .go:disabled::after { display:none; }
@media (prefers-reduced-motion: reduce) { .go::after { animation:none; opacity:.4; } }
.go-hint { margin:10px 0 6px; font-weight:700; color:var(--ink); }
.dev-chip { display:inline-flex; align-items:center; gap:8px; margin:0 auto 8px; padding:6px 14px; border-radius:99px; font-size:14px; font-weight:600; color:var(--ink); background:rgba(91,141,255,.12); border:1px solid rgba(91,141,255,.35); } .dev-chip { flex-wrap:wrap; justify-content:center; text-align:center; max-width:100%; } .dev-chip .ic { color:var(--accent2); } .dev-chip:empty { display:none; } .dev-chip small { color:var(--muted); font-weight:500; }
.hero { padding-bottom:30px; }
.opts { max-width:560px; margin:10px auto 0; text-align:left; } .opts summary { cursor:pointer; text-align:center; color:var(--accent2); font-weight:700; font-size:14px; }
.opts-grid { display:grid; grid-template-columns:auto 1fr; gap:10px 14px; align-items:center; margin-top:12px; padding:14px 16px; border-radius:14px; background:linear-gradient(145deg, var(--glass2), var(--glass)); border:1px solid var(--glassline); } .opts-grid label { font-size:14px; font-weight:600; } .opts-grid .span2 { grid-column:1 / -1; display:flex; gap:10px; align-items:center; }
.opts-grid select, .opts-grid input[type=number] { border:1px solid var(--line); background:var(--bg); color:var(--ink); font:500 15px -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif; padding:9px 10px; border-radius:10px; width:100%; min-width:0; }
@media (max-width:560px) { .opts-grid { grid-template-columns:1fr; } }

/* Uitleg-tegels */
.notes { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:22px 0; } @media (max-width:760px) { .notes { grid-template-columns:1fr; } }
.note h2 { display:flex; align-items:center; gap:10px; font-size:18px; margin:0 0 8px; } .note p { margin:0; color:var(--muted); font-size:15px; }
.nico { display:grid; place-items:center; width:30px; height:30px; flex:none; color:var(--accent2); } .nico svg { width:100%; height:100%; }
.warn-note { border-left:4px solid var(--gold) !important; } .warn-note.strong { border-left-color:var(--gE) !important; } .warn-note.strong p { color:var(--ink); font-weight:600; }

/* Meetscherm: blauwe schijf, gele voortgangsring met % en actie rond de cirkel, toestel in het midden */
.run { text-align:center; padding-top:18px; }
.speedscan { position:relative; width:min(390px,90vw); aspect-ratio:1; margin:4px auto 6px; filter:drop-shadow(0 22px 34px rgba(0,0,0,.5)); }
.ss-prog, .ss-label { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.ss-prog { transform:rotate(-90deg); z-index:3; } .ss-prog .ring { fill:none; stroke:rgba(255,255,255,.1); stroke-width:3; }
.ss-prog .arc { fill:none; stroke:var(--gold); stroke-width:3.4; stroke-linecap:round; stroke-dasharray:100 200; stroke-dashoffset:100; transition:stroke-dashoffset .5s ease; filter:drop-shadow(0 0 4px rgba(240,180,41,.85)); }
.ss-label { z-index:3; } .ss-label text { fill:var(--gold2); font:800 6.4px -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif; letter-spacing:.14em; text-transform:uppercase; }
.ss-disc { position:absolute; inset:13.4%; border-radius:50%; overflow:hidden; background:#030a1e; box-shadow:0 0 0 2px #aebbd6, 0 0 0 5px #4d5b78, 0 0 0 6px #cfd8ea, inset 0 0 40px rgba(0,0,0,.8), 0 0 44px rgba(31,86,207,.5); }
.speedscan > b { position:absolute; z-index:4; left:50%; top:10%; transform:translate(-50%,-50%); background:var(--gold); color:#2a1b00; font:800 12.5px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif; padding:5px 8px; border-radius:99px; box-shadow:0 0 12px rgba(240,180,41,.75); min-width:40px; transition:left .5s ease, top .5s ease; }
.speedscan.done .ss-prog .arc { stroke:var(--accent2); filter:drop-shadow(0 0 6px rgba(91,141,255,.9)); } .speedscan.done > b { display:none; }
.rs-gauge { position:absolute; inset:0; width:100%; height:100%; }
.rg-ring { fill:none; stroke:rgba(143,180,255,.16); stroke-width:1; }
.rg-ticks line { stroke:rgba(255,212,121,.5); stroke-width:1.4; stroke-linecap:round; } .rg-ticks line.maj { stroke:#ffd479; stroke-width:2.4; }
.rg-lab { fill:rgba(255,255,255,.72); font:600 9px -apple-system,Arial,sans-serif; text-anchor:middle; dominant-baseline:middle; }
.rg-base { fill:none; stroke:rgba(255,255,255,.1); stroke-width:6; stroke-linecap:round; } .rg-band { fill:none; stroke:#f0b429; stroke-width:6; stroke-linecap:round; filter:drop-shadow(0 0 5px rgba(240,180,41,.8)); }
.lp-screen { fill:rgba(240,180,41,.07); stroke:#f0b429; stroke-width:5; } .lp-glow { fill:rgba(255,212,121,.12); animation:lpGlow 2.6s ease-in-out infinite; } .lp-base { fill:#f0b429; } .lp-notch { stroke:#7a5a10; stroke-width:2.2; stroke-linecap:round; }
.lp-notch-y { stroke:#f0b429; stroke-width:2.4; stroke-linecap:round; fill:none; } .lp-dot { fill:#f0b429; }
.laptop { filter:drop-shadow(0 0 12px rgba(240,180,41,.45)); } @keyframes lpGlow { 50% { fill:rgba(255,212,121,.28); } }
.nd { fill:#f0b429; stroke:#7a5a10; stroke-width:1; filter:drop-shadow(0 0 4px rgba(240,180,41,.7)); } .hub { fill:#06112b; stroke:#f0b429; stroke-width:3; } .hub2 { fill:#f0b429; }
.rg-num { fill:#fff; font:700 30px -apple-system,Arial,sans-serif; text-anchor:middle; font-variant-numeric:tabular-nums; } .rg-unit { fill:rgba(255,255,255,.65); font:600 11px -apple-system,Arial,sans-serif; text-anchor:middle; letter-spacing:.06em; }
.tico { stroke:#5b8dff; opacity:.5; transition:stroke .25s, opacity .25s; } .tico.ok { opacity:1; } .tico.act { stroke:#8fb4ff; opacity:1; filter:drop-shadow(0 0 6px rgba(240,180,41,.95)); animation:tPulse .9s ease-in-out infinite; }
@keyframes tPulse { 50% { opacity:.6; } }
@media (prefers-reduced-motion: reduce) { .tico.act, .lp-glow { animation:none; } .speedscan > b, .ss-prog .arc { transition:none; } }
.live4 { list-style:none; padding:0; margin:14px 0 10px; display:grid; grid-template-columns:repeat(4,1fr); gap:10px; } @media (max-width:560px) { .live4 { grid-template-columns:repeat(2,1fr); } }
.live4 li { display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto; gap:0 8px; align-items:center; text-align:left; padding:10px 12px; border-radius:14px; background:linear-gradient(145deg, var(--glass2), var(--glass)); border:1px solid var(--glassline); transition:.2s; }
.live4 .ic { grid-row:1 / 3; color:var(--accent2); } .live4 small { color:var(--muted); font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; } .live4 b { font-size:20px; font-variant-numeric:tabular-nums; } .live4 b i { font-style:normal; font-size:12px; color:var(--muted); font-weight:600; margin-left:3px; }
.live4 li.on { border-color:var(--gold); box-shadow:0 0 0 1px var(--gold), 0 8px 20px rgba(240,180,41,.18); } .live4 li.on .ic { color:var(--gold2); }
#b-stop { margin-top:6px; }

/* Resultaat */
.res-top { display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:12px; margin:18px 0 6px; } .res-top h2 { margin:0; }
.res-id { color:var(--muted); font-size:13px; margin:2px 0 0; } .res-id b { font-family:ui-monospace,Menlo,monospace; color:var(--ink); }
.seg-sw { display:flex; background:var(--card); border:1px solid var(--line); border-radius:999px; padding:3px; } .seg-sw button { border:0; background:none; color:var(--muted); font:700 14px -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif; padding:8px 18px; border-radius:999px; cursor:pointer; }
.seg-sw button[aria-selected=true] { background:linear-gradient(180deg,#6b9bff,var(--accent3)); color:#fff; box-shadow:0 2px 0 var(--edge); }
.res-actions { display:flex; flex-wrap:wrap; gap:8px; margin:14px 0; } .res-actions .btn { padding:10px 16px; font-size:14px; }
.grid2 { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin-bottom:14px; } .grid4 { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:14px; }
@media (max-width:860px) { .grid4 { grid-template-columns:repeat(2,1fr); } } @media (max-width:560px) { .grid2 { grid-template-columns:1fr; } }
.rbig { padding:20px 22px; } .rbig .rh { display:flex; align-items:center; gap:10px; color:var(--muted); font-weight:700; letter-spacing:.04em; text-transform:uppercase; font-size:13px; } .rbig .rh .ic { color:var(--accent2); }
.rbig .rv2 { display:flex; align-items:baseline; gap:8px; margin:6px 0 2px; } .rbig .rv2 b { font-size:clamp(44px,7vw,64px); line-height:1; letter-spacing:-.03em; font-variant-numeric:tabular-nums; } .rbig .rv2 span { color:var(--muted); font-weight:700; }
.rbig .sub2 { color:var(--muted); font-size:13.5px; margin:0 0 6px; } .spark { display:block; width:100%; height:64px; } .spark path.f { fill:color-mix(in srgb,var(--accent2) 22%,transparent); } .spark path.l { fill:none; stroke:var(--accent2); stroke-width:2; stroke-linejoin:round; }
.rsm { padding:16px; } .rsm .rh { display:flex; align-items:center; gap:8px; color:var(--muted); font-weight:700; font-size:12.5px; letter-spacing:.04em; text-transform:uppercase; } .rsm .rh .ic { color:var(--accent2); } .rsm b { display:block; font-size:28px; margin:4px 0 0; font-variant-numeric:tabular-nums; } .rsm b i { font-style:normal; font-size:13px; color:var(--muted); font-weight:600; margin-left:3px; } .rsm p { margin:2px 0 0; color:var(--muted); font-size:13px; }
.qcard { padding:16px; } .qcard .rh { display:flex; align-items:center; gap:8px; font-weight:700; } .qcard .rh .ic { color:var(--accent2); } .qcard .pips { display:flex; gap:5px; margin:10px 0 6px; } .qcard .pips i { width:14px; height:14px; border-radius:50%; background:rgba(255,255,255,.14); } .qcard .pips i.on { background:var(--c, var(--gC)); box-shadow:0 0 8px var(--c, var(--gC)); } .qcard p { margin:0; color:var(--muted); font-size:13.5px; }
.q1 { --c:var(--gE); } .q2 { --c:var(--gD); } .q3 { --c:var(--gC); } .q4 { --c:var(--gB); } .q5 { --c:var(--gA); } .q0 { --c:var(--gE); }
.verdict2 { padding:22px 24px; display:grid; grid-template-columns:auto 1fr; gap:22px; align-items:center; margin-bottom:14px; border-left:5px solid var(--c, var(--gC)); } @media (max-width:560px) { .verdict2 { grid-template-columns:1fr; } }
.verdict2 .big { font-size:54px; font-weight:800; line-height:1; color:var(--c, var(--gC)); text-shadow:0 0 18px color-mix(in srgb,var(--c, var(--gC)) 50%, transparent); } .verdict2 h3 { margin:0 0 6px; font-size:22px; } .verdict2 p { margin:0 0 6px; color:var(--muted); } .verdict2 ul { margin:6px 0 0; padding-left:20px; color:var(--muted); font-size:14.5px; }
.cando { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,1fr); gap:6px 18px; } @media (max-width:640px) { .cando { grid-template-columns:1fr; } } .cando li { display:flex; gap:10px; align-items:baseline; padding:6px 0; border-bottom:1px solid var(--line); } .cando li:last-child { border-bottom:0; } .cando .y { color:var(--gA); font-weight:800; } .cando .n { color:var(--gE); font-weight:800; } .cando small { color:var(--muted); margin-left:auto; white-space:nowrap; }
.accnote { margin:16px 0; border-left:4px solid var(--gold); } .accnote p { margin:0 0 6px; color:var(--muted); font-size:14px; } .accnote h3 { margin:0 0 6px; font-size:15px; color:var(--ink); }
.pctbar { height:10px; border-radius:99px; background:rgba(255,255,255,.12); overflow:hidden; margin:6px 0; } .pctbar i { display:block; height:100%; border-radius:99px; background:var(--c, var(--gC)); }
.adv-chart { width:100%; height:auto; display:block; } .adv-chart .ax { stroke:var(--line); } .adv-chart .lab { fill:var(--muted); font-size:10px; } .adv-chart path { fill:none; stroke-width:2; } .adv-chart .d { stroke:var(--accent2); } .adv-chart .u { stroke:var(--gold); }
pre.json { background:var(--term); color:var(--termfg); padding:12px; border-radius:10px; overflow:auto; max-height:280px; font:12px/1.5 ui-monospace,Menlo,monospace; white-space:pre-wrap; word-break:break-all; }

/* Historiek */
.hist { margin:34px 0 10px; } .hist-head { display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; margin-bottom:10px; } .hist-head h2 { margin:0; } .hist-card { padding:16px; }
.hist-chart svg { width:100%; height:auto; display:block; } .hist-chart:empty { display:none; } .hist-chart { margin-bottom:10px; }
.hist-t td, .hist-t th { white-space:nowrap; } .hist-t td.num { font-variant-numeric:tabular-nums; text-align:right; } .hist-t th.num { text-align:right; } .hist-t tr.me td { background:color-mix(in srgb,var(--accent2) 12%,transparent); }
.legend i.d { background:var(--accent2); } .legend i.u { background:var(--gold); }
.err.ok { color:var(--gA); }
@media print { .go, .opts, .hist .tools, .res-actions, .seg-sw, #b-stop { display:none !important; } }

/* Lichte modus: gele tekst op een lichte achtergrond heeft meer contrast nodig */
@media (prefers-color-scheme: light) { .limit-note { color:#6b4600; background:rgba(240,180,41,.2); border-color:rgba(160,110,0,.45); } .warn-note.strong p { color:var(--ink); } .ss-label text { fill:var(--gold2); } }