/* K53 quiz runner, results and home sample question ("K53 Road Sign" design). */
.k53-run-wrap{max-width:780px;margin:0 auto;}
.k53-run-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 12px;}
.k53-run-meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.k53-run-of{font-size:15px;color:var(--muted);}
.k53-run-of b{color:var(--ink);font-family:var(--font-display);font-weight:800;}
.k53-run-score{font-size:14px;font-weight:600;color:var(--muted);}
.k53-run-score b{color:var(--accent-strong);}
.k53-run-prog{height:6px;background:var(--line);border-radius:var(--r-pill);overflow:hidden;margin:0 0 20px;}
.k53-run-prog>span{display:block;height:100%;background:var(--accent);border-radius:var(--r-pill);transition:width .3s;}

.k53-run{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:30px;}
.k53-run-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:0 0 18px;}
.k53-run-img{display:grid;place-items:center;background:var(--bg);border-radius:var(--r-md);padding:22px;margin:0 0 22px;}
.k53-run-img img{max-height:210px;width:auto;max-width:100%;object-fit:contain;display:block;}
.k53-run .k53-run-q{font:700 clamp(20px,2.3vw,26px)/1.28 var(--font-display);letter-spacing:-.01em;color:var(--ink);margin:0 0 6px;}
.k53-run .k53-run-sub{color:var(--muted);font-size:16px;margin:4px 0 0;}
.k53-opts{display:grid;gap:10px;margin:22px 0 0;}
.k53-run .k53-opt{-webkit-appearance:none;appearance:none;display:grid;grid-template-columns:36px minmax(0,1fr);gap:14px;align-items:center;width:100%;margin:0;padding:12px 16px 12px 12px;text-align:left;background:var(--surface);border:1.5px solid var(--line-strong);border-radius:var(--r-md);color:var(--ink);font:500 16px/1.4 var(--font-body);cursor:pointer;box-shadow:none;text-transform:none;letter-spacing:0;white-space:normal;transition:border-color .12s,background-color .12s;}
.k53-run .k53-opt:hover:not(:disabled){border-color:var(--ink);background:var(--surface);color:var(--ink);}
.k53-run .k53-opt:focus-visible{outline:3px solid var(--accent);outline-offset:2px;}
.k53-run .k53-opt .n{display:grid;place-items:center;width:36px;height:36px;border-radius:var(--r-sm);background:var(--bg);border:1px solid var(--line);font:800 15px/1 var(--font-display);color:var(--ink);}
.k53-run .k53-opt .t{display:block;}
.k53-run .k53-opt:disabled{cursor:default;opacity:1;}
.k53-run .k53-opt.correct{border-color:var(--accent);background:var(--accent-soft);}
.k53-run .k53-opt.correct .n{background:var(--accent);border-color:var(--accent);color:#fff;}
.k53-run .k53-opt.wrong{border-color:var(--red);background:var(--red-soft);}
.k53-run .k53-opt.wrong .n{background:var(--red);border-color:var(--red);color:#fff;}
.k53-run .k53-opt.dim{opacity:.55;}
.k53-run-fb{display:none;margin:16px 0 0;padding:14px 16px;border-radius:var(--r-md);font-size:15.5px;line-height:1.45;}
.k53-run-fb.show{display:block;}
.k53-run-fb.ok{background:var(--accent-soft);color:var(--accent-strong);}
.k53-run-fb.no{background:var(--red-soft);color:#8E1D15;}
.k53-run-fb b{font-weight:800;}
.k53-run-cont{margin-top:18px;}

.k53-pager{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:20px 0 0;}
.k53-prev{color:var(--muted);text-decoration:none;font-weight:600;font-size:15px;padding:12px 14px;border-radius:var(--r-md);}
.k53-prev:hover{background:rgba(22,29,25,.06);color:var(--ink);}
.k53-prev.disabled{visibility:hidden;}
.k53-next.ready{box-shadow:inset 0 -2px 0 rgba(0,0,0,.2),0 0 0 4px var(--accent-soft);}
.k53-run-foot{margin-top:28px;padding-top:20px;border-top:1px solid var(--line);}
.k53-run-hint{color:var(--muted);font-size:14px;margin:0 0 12px;}
.k53-run-hint kbd{display:inline-block;min-width:22px;padding:2px 6px;border:1px solid var(--line-strong);border-bottom-width:2px;border-radius:5px;background:var(--surface);font:700 12px/1.3 var(--font-body);color:var(--ink);text-align:center;}
.k53-run-tools{display:flex;flex-wrap:wrap;gap:6px 18px;}
.k53-run-tools a{font-size:14.5px;font-weight:600;color:var(--accent);text-decoration:none;}
.k53-run-tools a:hover{text-decoration:underline;}
.k53-run-rel{margin-top:44px;}
.k53-run-rel h2{font-size:22px;margin:0 0 4px;}

/* home sample card */
.k53-run--sample{padding:24px;box-shadow:0 30px 60px -30px rgba(0,0,0,.55);}
.k53-run--sample .k53-run-img{padding:16px;margin-bottom:16px;}
.k53-run--sample .k53-run-img img{max-height:120px;}
.k53-run--sample .k53-run-q{font-size:20px;}
.k53-run--sample .k53-opts{margin-top:16px;gap:8px;}
.k53-run--sample .k53-opt{padding:9px 14px 9px 10px;font-size:15px;grid-template-columns:32px minmax(0,1fr);gap:12px;}
.k53-run--sample .k53-opt .n{width:32px;height:32px;font-size:14px;}
.k53-run--sample .k53-run-cont{display:none;}
.k53-run--sample.is-answered .k53-run-cont{display:inline-flex;}

/* results breakdown rows reuse the scoreboard look */
.k53-res-break .k53-brow{grid-template-columns:minmax(0,1fr) 130px;}
.k53-res-break .k53-brow .q{font-size:26px;}
.k53-res-break .k53-bar>i.fail{background:var(--red);}
.k53-res-break .tag{display:inline-block;margin-left:8px;font:800 11.5px/1 var(--font-display);letter-spacing:.06em;text-transform:uppercase;padding:5px 8px;border-radius:var(--r-pill);vertical-align:middle;}
.k53-res-break .tag.pass{background:var(--accent-soft);color:var(--accent-strong);}
.k53-res-break .tag.fail{background:var(--red-soft);color:#8E1D15;}

@media(max-width:600px){
  .k53-run{padding:18px;}
  .k53-run-img{padding:14px;}
  .k53-run-img img{max-height:160px;}
  .k53-run--sample .k53-run-img img{max-height:96px;}
  .k53-run .k53-opt{font-size:15px;padding:10px 12px 10px 10px;gap:12px;grid-template-columns:32px minmax(0,1fr);}
  .k53-run .k53-opt .n{width:32px;height:32px;}
  .k53-pager{position:sticky;bottom:0;z-index:10;background:var(--bg);margin:0 calc(var(--gutter) * -1);padding:12px var(--gutter);border-top:1px solid var(--line);}
  .k53-res-card{padding:22px;}
}
@media(hover:none){.k53-run-hint .kb{display:none;}}

/* article embeds */
.k53-run--inline{margin:28px 0;padding:22px 24px;}
.k53-run--inline .k53-run-head{margin-bottom:14px;}
.k53-run--inline .k53-run-img{padding:16px;margin-bottom:16px;}
.k53-run--inline .k53-run-img img{max-height:140px;}
.k53-run--inline .k53-run-q{font-size:19px;}
.k53-run--inline .k53-opts{margin-top:14px;gap:8px;}
.k53-run--inline .k53-opt{font-size:15.5px;padding:10px 14px 10px 10px;}
.k53-run--inline .k53-run-cont{display:none;}
.k53-run--inline.is-answered .k53-run-cont{display:inline-flex;}
.k53-prose .k53-run p{margin:0 0 6px;}
.k53-prose .k53-run a.k53-more{text-decoration:none;}
.k53-run-sub{line-height:1.6;}