/* Generated from tradecareers-practice-tests/practice-exam.css by extras.py — scoped under #pe. Do not edit here. */
#pe{--orange:#F26B1D; --orange-d:#C9520F; --yellow:#FFD60A; --hivis:#E4F221;
  --char:#25282B; --char-2:#33373B; --char-3:#4A4F55; --ink:#1B1D1F;
  --paper:#F6F5F2; --card:#FFFFFF; --line:#DEDBD4; --muted:#6B6F75;
  --ok:#1F8A4C; --ok-bg:#E6F4EC; --bad:#C62828; --bad-bg:#FDECEC; --flag:#F5A400;
  --radius:12px; --shadow:0 2px 10px rgba(0,0,0,.08);
  }
#pe *{box-sizing:border-box}
#pe{margin:0;padding:0}
#pe{background:var(--paper);color:var(--ink);line-height:1.5;font-size:16px;-webkit-text-size-adjust:100%}
#pe a{color:var(--orange-d)}
#pe button{font:inherit;cursor:pointer}
#pe .timer{font-variant-numeric:tabular-nums;background:var(--char-2);border:2px solid var(--yellow);color:var(--yellow);padding:6px 12px;border-radius:999px;font-weight:800;white-space:nowrap}
#pe .timer.warn{background:var(--bad);border-color:#fff;color:#fff}
#pe .timer[hidden]{display:none}
#pe{max-width:1180px;margin:0 auto;padding:20px 16px 60px}
#pe .card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px}
#pe h1{font-size:clamp(1.5rem,3.4vw,2.2rem);line-height:1.2;margin:.2em 0 .4em}
#pe h2{font-size:1.25rem;margin:.2em 0 .6em}
#pe .kicker{display:inline-block;background:var(--yellow);color:var(--char);font-weight:800;font-size:12px;letter-spacing:.6px;text-transform:uppercase;padding:3px 8px;border-radius:4px}
#pe .muted{color:var(--muted)}
#pe .small{font-size:.875rem}
#pe .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:2px solid transparent;border-radius:10px;padding:11px 18px;font-weight:700;text-decoration:none;min-height:44px;transition:transform .05s,background .15s}
#pe .btn:active{transform:translateY(1px)}
#pe .btn-primary{background:var(--orange);color:#fff}
#pe .btn-primary:hover{background:var(--orange-d)}
#pe .btn-dark{background:var(--char);color:#fff}
#pe .btn-dark:hover{background:var(--char-3)}
#pe .btn-ghost{background:transparent;border-color:var(--char-3);color:var(--char)}
#pe .btn-ghost:hover{background:#ECEAE5}
#pe .btn-flag[aria-pressed="true"]{background:var(--flag);border-color:var(--flag);color:var(--char)}
#pe .btn:disabled{opacity:.45;cursor:not-allowed}
#pe .modes{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin:18px 0}
#pe .mode{border:2px solid var(--line);border-radius:var(--radius);padding:18px;background:#fff;display:flex;flex-direction:column;gap:8px}
#pe .mode h3{margin:0;font-size:1.1rem;display:flex;align-items:center;gap:8px}
#pe .mode .tag{font-size:11px;font-weight:800;text-transform:uppercase;background:var(--char);color:var(--yellow);padding:2px 7px;border-radius:4px}
#pe .mode ul{margin:0 0 6px;padding-left:18px;color:var(--char-3)}
#pe .mode .btn{margin-top:auto}
#pe .facts{display:flex;flex-wrap:wrap;gap:10px;margin:10px 0 0;padding:0;list-style:none}
#pe .facts li{background:#fff;border:1px solid var(--line);border-radius:999px;padding:5px 12px;font-size:.875rem}
#pe .resume{border-left:6px solid var(--orange);background:#FFF4EC;padding:14px 16px;border-radius:8px;margin:14px 0;display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between}
#pe .disclaimer{font-size:.8rem;color:var(--muted);border-top:1px dashed var(--line);margin-top:22px;padding-top:12px}
#pe .exam{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px;align-items:start}
#pe .qhead{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between;margin-bottom:10px}
#pe .pill{display:inline-block;font-size:12px;font-weight:700;padding:3px 9px;border-radius:999px;background:#EEECE7;color:var(--char-3)}
#pe .pill.easy{background:#E6F4EC;color:#1F6B3F}
#pe .pill.medium{background:#FFF3D6;color:#8A5A00}
#pe .pill.hard{background:#FDE3D6;color:#A23A08}
#pe .progress{height:8px;background:#E7E4DE;border-radius:999px;overflow:hidden;margin:6px 0 16px}
#pe .progress>span{display:block;height:100%;background:linear-gradient(90deg,var(--orange),var(--yellow))}
#pe .qtext{font-size:1.12rem;font-weight:600;margin:6px 0 16px}
#pe .opts{display:flex;flex-direction:column;gap:10px;margin:0;padding:0;list-style:none}
#pe .opt{width:100%;text-align:left;display:flex;gap:12px;align-items:flex-start;background:#fff;border:2px solid var(--line);border-radius:10px;padding:12px 14px;min-height:52px;color:var(--ink)}
#pe .opt:hover:not(:disabled){border-color:var(--orange)}
#pe .opt .key{flex:0 0 30px;height:30px;border-radius:7px;background:#EEECE7;display:grid;place-items:center;font-weight:800;color:var(--char)}
#pe .opt.selected{border-color:var(--char);background:#F3F2EE}
#pe .opt.selected .key{background:var(--char);color:var(--yellow)}
#pe .opt.correct{border-color:var(--ok);background:var(--ok-bg)}
#pe .opt.correct .key{background:var(--ok);color:#fff}
#pe .opt.wrong{border-color:var(--bad);background:var(--bad-bg)}
#pe .opt.wrong .key{background:var(--bad);color:#fff}
#pe .opt:disabled{cursor:default}
#pe .feedback{margin-top:16px;border-radius:10px;padding:14px 16px;border-left:6px solid var(--ok);background:var(--ok-bg)}
#pe .feedback.bad{border-left-color:var(--bad);background:var(--bad-bg)}
#pe .feedback strong{display:block;margin-bottom:4px}
#pe .qnav{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;margin-top:18px}
#pe .qnav .grp{display:flex;gap:10px;flex-wrap:wrap}
#pe .side{position:sticky;top:12px}
#pe .side h2{font-size:1rem;margin:0 0 10px}
#pe .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(40px,1fr));gap:6px}
#pe .cell{position:relative;height:40px;border-radius:8px;border:2px solid var(--line);background:#fff;font-weight:700;font-size:.85rem;color:var(--char)}
#pe .cell.answered{background:var(--char);color:#fff;border-color:var(--char)}
#pe .cell.c-ok{background:var(--ok);border-color:var(--ok);color:#fff}
#pe .cell.c-bad{background:var(--bad);border-color:var(--bad);color:#fff}
#pe .cell.current{outline:3px solid var(--orange);outline-offset:1px}
#pe .cell.flagged::after{content:"";position:absolute;top:-4px;right:-4px;width:12px;height:12px;border-radius:50%;background:var(--flag);border:2px solid #fff}
#pe .legend{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0;font-size:.78rem;color:var(--muted)}
#pe .legend i{display:inline-block;width:12px;height:12px;border-radius:3px;vertical-align:-2px;margin-right:4px;border:1px solid var(--line)}
#pe .side .stats{font-size:.875rem;color:var(--char-3);margin:8px 0 12px}
#pe .navtoggle{display:none}
#pe .score-hero{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center}
#pe .ring{--p:0;width:150px;height:150px;border-radius:50%;background:conic-gradient(var(--ring,var(--orange)) calc(var(--p)*1%),#E7E4DE 0);display:grid;place-items:center}
#pe .ring>div{width:118px;height:118px;border-radius:50%;background:#fff;display:grid;place-items:center;text-align:center}
#pe .ring b{font-size:2rem;line-height:1}
#pe .badge{display:inline-block;font-weight:900;letter-spacing:.5px;padding:6px 12px;border-radius:6px;text-transform:uppercase}
#pe .badge.pass{background:var(--ok);color:#fff}
#pe .badge.fail{background:var(--bad);color:#fff}
#pe .bars{display:flex;flex-direction:column;gap:12px;margin-top:8px}
#pe .bar .lbl{display:flex;justify-content:space-between;gap:10px;font-size:.92rem;font-weight:600}
#pe .bar .track{height:12px;border-radius:999px;background:#E7E4DE;overflow:hidden;margin-top:4px;position:relative}
#pe .bar .track span{display:block;height:100%;background:var(--ok)}
#pe .bar .track span.low{background:var(--bad)}
#pe .bar .track span.mid{background:var(--flag)}
#pe .bar .track::after{content:"";position:absolute;left:70%;top:-2px;bottom:-2px;width:2px;background:var(--char)}
#pe .review-item{border:1px solid var(--line);border-radius:10px;padding:14px 16px;margin:12px 0;background:#fff}
#pe .review-item .yours{color:var(--bad);font-weight:600}
#pe .review-item .right{color:var(--ok);font-weight:600}
#pe .tabs{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}
#pe .tabs button{border:2px solid var(--char-3);background:#fff;border-radius:999px;padding:6px 14px;font-weight:700}
#pe .tabs button[aria-selected="true"]{background:var(--char);color:var(--yellow);border-color:var(--char)}
#pe .cta{background:var(--char);color:#fff;border-radius:var(--radius);padding:22px;margin-top:18px;display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;border-top:6px solid var(--orange)}
#pe .cta h3{margin:0 0 4px;color:var(--yellow)}
#pe .cta p{margin:0;color:#D5D8DB}
#pe .modal{position:fixed;inset:0;background:rgba(20,22,24,.6);display:grid;place-items:center;padding:16px;z-index:50}
#pe .modal[hidden]{display:none}
#pe .modal .card{max-width:460px;width:100%}
#pe .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media (max-width:900px){#pe .exam{grid-template-columns:1fr}#pe .side{position:static;order:2}#pe .navtoggle{display:inline-flex}#pe .side.collapsed .grid,#pe .side.collapsed .legend{display:none}}
@media (max-width:560px){#pe{padding:14px 10px 50px}#pe .card{padding:16px}#pe .score-hero{grid-template-columns:1fr;justify-items:center;text-align:center}#pe .qnav .btn{flex:1}#pe .qnav .grp{width:100%}}
@media print{#pe .side,#pe .qnav,#pe .cta{display:none}}
#pe .linkbtn{background:none;border:0;padding:0;font:inherit;color:var(--orange);text-decoration:underline;cursor:pointer}
#pe .linkbtn:hover{color:var(--char)}
#pe{max-width:1180px;margin:0 auto;padding:28px 16px 60px;background:transparent}#pe .timer{position:fixed;right:16px;bottom:16px;z-index:40;box-shadow:0 4px 14px rgba(0,0,0,.25)}#pe .cta .badge-soon{color:var(--yellow);background:#000;margin-left:.4rem}#pe .card{display:block;flex:none;transition:none;box-shadow:none}#pe .card:hover{transform:none}#pe .qtext,#pe .card p.qtext{color:var(--ink)}#pe .modal .card{box-shadow:0 10px 40px rgba(0,0,0,.35)}
