/* Einstufungstest */
.quiz-layout { display: grid; gap: clamp(2rem, 5vw, 4rem); grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); align-items: start; }
@media (max-width: 900px) { .quiz-layout { grid-template-columns: 1fr; } }
.quiz-aside h2 { font-size: var(--s2); }
.quiz-card { background: var(--white); border: 1px solid var(--line); border-radius: var(--r-lg); padding: clamp(1.4rem, 3.5vw, 2.2rem); box-shadow: 0 20px 40px -30px rgba(22, 26, 58, .35); }
.quiz-start h2 { font-size: var(--s2); }
.quiz-facts { list-style: none; padding: 0; margin: 0 0 1.5rem; display: flex; flex-wrap: wrap; gap: .5rem; }
.quiz-facts li { background: var(--wash); border-radius: 999px; padding: .3rem .85rem; font-size: .92rem; }
.quiz-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; flex-wrap: wrap; margin-block-end: .6rem; }
.quiz-part { font-weight: 500; color: var(--blue); margin: 0; font-size: .95rem; }
.quiz-count { margin: 0; font-size: .9rem; color: var(--slate); }
.quiz-fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.quiz-q { font-size: clamp(1.2rem, 2.4vw, 1.45rem); font-weight: 500; line-height: 1.4; margin-block-end: 1.1rem; padding: 0; text-align: left; width: 100%; }
.quiz-q:focus { outline: none; }
.quiz-q:focus-visible { outline: 3px solid var(--saffron); outline-offset: 4px; }
.quiz-ctx { display: block; font-size: 1rem; font-weight: 400; line-height: 1.6; background: var(--wash); border-inline-start: 4px solid var(--blue); padding: .9rem 1.1rem; border-radius: 0 var(--r-sm) var(--r-sm) 0; margin-block-end: 1rem; color: var(--ink-2); }
.quiz-qtext { display: block; }
.quiz-options { display: grid; gap: .6rem; text-align: left; }
.quiz-option { display: flex; align-items: center; gap: .8rem; padding: .85rem 1rem; border: 1.5px solid var(--line); border-radius: var(--r-sm); cursor: pointer; background: var(--white); font-size: 1.05rem; transition: border-color .12s, background .12s; }
.quiz-option:hover { border-color: var(--blue); }
.quiz-option input { width: 1.15rem; height: 1.15rem; accent-color: var(--blue); flex: none; margin: 0; }
.quiz-option:has(input:checked) { border-color: var(--blue); background: var(--wash); }
.quiz-option:has(input:focus-visible) { outline: 3px solid var(--saffron); outline-offset: 2px; }
.quiz-msg { color: var(--err); font-size: .92rem; min-height: 1.4em; margin: .6rem 0 0; }
.quiz-nav { justify-content: space-between; margin-block-start: .6rem; }
.quiz-nav .btn-primary { margin-inline-start: auto; }
.quiz-nav .btn[disabled] { opacity: .45; cursor: not-allowed; }
.quiz-result .quiz-level { font-size: clamp(var(--s2), 3.2vw, var(--s3)); margin-block: .3rem .5rem; }
.quiz-result .quiz-level:focus { outline: none; }
.quiz-score { color: var(--slate); }
.quiz-rec { font-weight: 500; background: var(--saffron-soft); border-radius: var(--r-sm); padding: .8rem 1rem; }
.quiz-note { font-size: .9rem; color: var(--slate); margin-block: 1.2rem 0; border-block-start: 1px solid var(--line); padding-block-start: 1rem; }
.quiz-tools { display: flex; gap: 1.2rem; flex-wrap: wrap; margin-block-start: .8rem; }
.quiz-linkbtn { background: none; border: 0; padding: .2rem 0; font: inherit; font-size: .95rem; color: var(--blue); text-decoration: underline; text-underline-offset: .18em; cursor: pointer; }
.quiz-linkbtn:hover { color: var(--blue-dark); }
.quiz-review { list-style: none; padding: 0; margin: 1.2rem 0 0; display: grid; gap: .7rem; counter-reset: rq; }
.quiz-review li { border: 1px solid var(--line); border-radius: var(--r-sm); padding: .8rem 1rem; border-inline-start: 4px solid var(--ok); }
.quiz-review li.is-wrong { border-inline-start-color: var(--err); }
.quiz-review p { margin: 0 0 .3rem; }
.quiz-review .rq { font-weight: 500; text-align: left; }
.quiz-review .rq .quiz-ctx { font-size: .9rem; padding: .6rem .8rem; margin-block-end: .5rem; }
.quiz-review .ra { font-size: .95rem; }
.quiz-review .rl { color: var(--slate); }
.quiz-review .rbadge { font-size: .78rem; margin-inline-start: .6rem; padding: .05rem .5rem; border-radius: 999px; background: #E3F2EC; color: var(--ok); }
.quiz-review .is-wrong .rbadge { background: #F9E5E3; color: var(--err); }
#quiz-root, .quiz-q, .quiz-level { scroll-margin-top: 6rem; }
@media (max-width: 900px) { .quiz-layout #quiz-root { order: -1; } }

/* v2 result screen */
.quiz-result > p:first-child { margin-block-end: .4rem; }
.quiz-ladder { list-style: none; display: flex; gap: .5rem; padding: 0; margin: .2rem 0 .9rem; }
.quiz-ladder li { flex: 1; text-align: center; font-size: .85rem; font-weight: 600; padding: .45rem 0; border-radius: 10px; background: var(--wash); color: var(--slate); box-shadow: inset 0 1px 2px rgba(22,26,58,.08); }
.quiz-ladder li.is-done { color: #fff; background: linear-gradient(160deg, #5A68E4 0%, var(--blue) 50%, var(--blue-dark) 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 6px 12px -6px rgba(52,67,200,.7); }
.quiz-ladder li.is-next { color: var(--ink); background: linear-gradient(160deg, #F9D27A 0%, var(--saffron) 55%, #DE9418 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 6px 12px -6px rgba(222,148,24,.7); }
.quiz-sub { font-size: 1.05rem; margin: 1.4rem 0 .7rem; }
.quiz-skill-list { list-style: none; padding: 0; margin: 0; display: grid; gap: .65rem; }
.quiz-skill { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr) auto; gap: .8rem; align-items: center; font-size: .95rem; }
.quiz-skill-name { font-weight: 500; }
.quiz-skill-val { color: var(--slate); font-size: .88rem; white-space: nowrap; }
.quiz-skill-track { height: .8rem; border-radius: 999px; background: var(--wash); box-shadow: inset 0 1px 3px rgba(22,26,58,.14); overflow: hidden; }
.quiz-skill-fill { display: block; height: 100%; border-radius: inherit; background: linear-gradient(180deg, #6B78E6, var(--blue-dark)); box-shadow: inset 0 1px 0 rgba(255,255,255,.35); transition: width .6s var(--ease, ease); }
.sk-w .quiz-skill-fill { background: linear-gradient(180deg, #F9D27A, #DE9418); }
.sk-l .quiz-skill-fill { background: linear-gradient(180deg, #4A5090, var(--ink)); }
@media (max-width: 420px) { .quiz-skill { grid-template-columns: 1fr auto; } .quiz-skill-track { grid-column: 1 / -1; grid-row: 2; } }
.quiz-next .quiz-rec { margin-block-end: 1rem; }
.quiz-read-list { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; }
.quiz-read-list a { display: block; padding: .7rem 1rem; padding-inline-start: 2.4rem; position: relative; border-radius: 12px; background: var(--white); border: 1px solid rgba(214,218,238,.8); box-shadow: 0 1px 2px rgba(22,26,58,.05), 0 4px 10px -2px rgba(22,26,58,.06); text-decoration: none; color: var(--ink); font-weight: 500; font-size: .97rem; }
.quiz-read-list a::before { content: ""; position: absolute; inset-inline-start: 1rem; top: 50%; width: .55rem; height: .55rem; margin-top: -.28rem; border-radius: 3px; transform: rotate(45deg); background: linear-gradient(160deg, #5A68E4, var(--blue-dark)); }
.quiz-read-list a:hover { border-color: var(--blue); color: var(--blue); }
.quiz-review .rx { font-size: .92rem; color: var(--ink-2); margin-block-start: .35rem; }
.quiz-review li { background: var(--white); }
@media (prefers-reduced-motion: reduce) { .quiz-skill-fill { transition: none; } }
