.ex{max-width:680px;margin-inline:auto}.ex-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:.8rem}.ex-top .q-count{font-family:var(--font-display);font-weight:700;color:var(--ink)}.ex-top .q-deck{font-size:.82rem;font-weight:600;color:var(--green-deep);background:var(--green-soft);padding:.3rem .7rem;border-radius:999px}.ex-track{height:8px;border-radius:999px;background:var(--green-soft);overflow:hidden;margin-bottom:1.6rem}.ex-track span{display:block;height:100%;background:linear-gradient(90deg,var(--green),var(--green-deep));border-radius:999px;transition:width .35s ease}.ex-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:1.8rem;box-shadow:var(--shadow-soft)}.ex-q{font-family:var(--font-display);font-weight:600;font-size:1.35rem;color:var(--ink);margin-bottom:1.3rem}.ex-options{display:flex;flex-direction:column;gap:.7rem}.ex-opt{display:flex;align-items:center;gap:.8rem;text-align:left;padding:.9rem 1.1rem;border-radius:var(--r-md);background:var(--bg-2);border:1.5px solid var(--line);font-size:1rem;color:var(--ink);transition:border-color .15s,background .15s}.ex-opt:hover{border-color:var(--green)}.ex-opt.sel{border-color:var(--green);background:var(--green-soft)}.ex-opt .dot{flex:none;width:22px;height:22px;border-radius:50%;border:2px solid var(--muted);display:grid;place-items:center}.ex-opt.sel .dot{border-color:var(--green-deep);background:var(--green)}.ex-opt.sel .dot:after{content:"";width:8px;height:8px;border-radius:50%;background:#fff}.ex-nav{display:flex;justify-content:space-between;margin-top:1.5rem}.ex-btn{font-weight:700;padding:.8rem 1.5rem;border-radius:999px;transition:transform .15s,box-shadow .15s,filter .15s}.ex-btn.ghost{color:var(--ink-dim);border:1px solid var(--line);background:var(--surface)}.ex-btn.ghost:disabled{opacity:.4;cursor:not-allowed}.ex-btn.primary{color:#fff;background:linear-gradient(135deg,var(--green),var(--green-deep));box-shadow:var(--shadow-green)}.ex-btn.primary:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.ex-btn.primary:not(:disabled):hover{transform:translateY(-2px)}.ex-result-head{text-align:center;padding:2rem;border-radius:var(--r-xl);margin-bottom:1.6rem;border:1px solid var(--line)}.ex-result-head.pass{background:var(--green-soft);border-color:#b9e8cd}.ex-result-head.fail{background:var(--coral-soft);border-color:#f6d3c6}.ex-result-head .big{font-family:var(--font-display);font-size:3.4rem;font-weight:700;line-height:1}.ex-result-head.pass .big{color:var(--green-deep)}.ex-result-head.fail .big{color:var(--coral-deep)}.ex-result-head h2{font-size:1.5rem;color:var(--ink);margin:.5rem 0 .2rem}.ex-result-head p{color:var(--ink-dim)}.ex-result-actions{display:flex;gap:.8rem;justify-content:center;margin-top:1.3rem;flex-wrap:wrap}.ex-review{display:flex;flex-direction:column;gap:.8rem;margin-bottom:1.5rem}.ex-rev{background:var(--surface);border:1px solid var(--line);border-left-width:4px;border-radius:var(--r-md);padding:1rem 1.2rem}.ex-rev.ok{border-left-color:var(--green)}.ex-rev.no{border-left-color:var(--bear)}.ex-rev .rq{font-weight:600;color:var(--ink);margin-bottom:.4rem}.ex-rev .ra{font-size:.9rem;color:var(--ink-dim)}.ex-rev .ra .yours{color:var(--bear);font-weight:600}.ex-rev .ra .right{color:var(--green-deep);font-weight:600}.ex-rev .rex{font-size:.88rem;color:var(--muted);margin-top:.4rem}.cert-overlay{position:fixed;inset:0;z-index:60;background:#14100c8c;display:grid;place-items:center;padding:1.5rem}.cert-modal{width:min(680px,100%);background:var(--surface);border-radius:var(--r-xl);box-shadow:var(--shadow-lift);padding:1.6rem}.cert-modal h3{font-size:1.4rem;color:var(--ink);margin-bottom:1rem}.cert-preview{width:100%;border-radius:var(--r-md);border:1px solid var(--line);display:block}.cert-name{display:flex;flex-direction:column;gap:.4rem;margin:1.1rem 0}.cert-name label{font-weight:700;font-size:.85rem;color:var(--ink)}.cert-name input{font:inherit;font-size:1rem;padding:.7rem .9rem;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--bg-2);color:var(--ink)}.cert-name input:focus{outline:none;border-color:var(--green)}.cert-actions{display:flex;gap:.8rem;justify-content:flex-end}
