@layer components{.quiz-page{display:grid;align-content:start;gap:1.5rem}.quiz-book{display:grid;grid-template-columns:minmax(16rem,21rem) minmax(0,1fr);min-height:min(46rem,calc(100dvh - 10rem));overflow:hidden;border-radius:var(--radius-surface);border:1px solid var(--color-line);background:var(--color-paper-50);box-shadow:var(--shadow-surface)}.quiz-setup-aside{display:flex;flex-direction:column;gap:1.5rem;padding:2.25rem;border-right:1px solid var(--color-line);background:var(--color-paper-100)}.quiz-steps{display:grid;gap:.5rem}.quiz-step{display:flex;width:100%;min-height:4rem;align-items:center;gap:.875rem;border:1px solid transparent;border-radius:var(--radius-control);padding:.75rem 1rem;cursor:pointer;transition:background-color var(--motion-press) ease,border-color var(--motion-press) ease}.quiz-step[aria-current=step]{border-color:var(--color-forest-800);background:var(--color-surface)}.quiz-step-dot{display:grid;flex:none;width:2rem;height:2rem;place-items:center;border:1px solid var(--color-line);border-radius:calc(infinity * 1px);background:var(--color-surface);color:var(--color-ink-muted);font-size:.875rem;font-weight:800}.quiz-step[data-done] .quiz-step-dot{border-color:var(--color-sage-200);background:var(--color-sage-200);color:var(--color-forest-800)}.quiz-step[aria-current=step] .quiz-step-dot{border-color:var(--color-forest-800);background:var(--color-forest-800);color:var(--color-white)}.quiz-match{display:grid;gap:.25rem;margin-top:auto;border-top:1px solid var(--color-line);padding-top:1.25rem;color:var(--color-ink-muted);font-size:.875rem;font-variant-numeric:tabular-nums}.quiz-match strong{color:var(--color-forest-900);font-size:1rem}.quiz-match strong[data-tone=short]{color:var(--color-difficulty-medium-ink)}.quiz-match strong[data-tone=none]{color:var(--color-danger)}.quiz-setup-main{position:relative;display:flex;min-width:0;flex-direction:column;gap:1.5rem;padding:2.25rem}.quiz-step-heading{padding-right:7rem}.quiz-leaves .quiz-leaf-stem{stroke:var(--color-forest-800)}.quiz-leaves .quiz-leaf-light{fill:var(--color-sage-500)}.quiz-leaves .quiz-leaf-pale{fill:var(--color-sage-200)}.quiz-leaves .quiz-leaf-dark{fill:var(--color-sage-700)}.quiz-setup-leaves{position:absolute;top:.5rem;right:.75rem;width:7.5rem;height:6.25rem;pointer-events:none}.quiz-tile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.875rem}.quiz-tile{display:flex;min-height:7.5rem;flex-direction:column;align-items:flex-start;gap:.375rem;border:1px solid var(--color-line);border-radius:var(--radius-surface);padding:1.25rem;background:var(--color-surface);box-shadow:var(--shadow-surface);color:var(--color-forest-900);text-align:left;cursor:pointer;transition:transform var(--motion-reveal) var(--ease-feedback),background-color var(--motion-press) ease}.quiz-tile[aria-pressed=true]{border-color:var(--color-forest-800);background:var(--color-forest-800);color:var(--color-white)}.quiz-tile-number{font-size:2.5rem;font-weight:800;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}.quiz-tile-note{color:var(--color-ink-secondary);font-size:.875rem}.quiz-area[data-state=whole] .quiz-tile-note,.quiz-tile[aria-pressed=true] .quiz-tile-note{color:var(--color-sage-100)}.quiz-tile-tag{display:inline-flex;border:1px solid var(--color-line);border-radius:calc(infinity * 1px);padding:.25rem .625rem;background:var(--color-surface);color:var(--color-forest-900);font-size:.875rem;font-weight:700;line-height:1.25rem}.quiz-count-input{width:6rem;min-height:2.75rem;border:1px solid var(--color-line);border-radius:var(--radius-control);padding-inline:.75rem;background:var(--color-surface);font-size:1rem}.quiz-count-input[aria-invalid=true]{border-color:var(--color-danger)}.quiz-area-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(14rem,1fr));align-items:start;gap:.75rem}.quiz-area{display:flex;flex-direction:column;gap:.625rem;border:1px solid var(--color-line);border-radius:var(--radius-surface);padding:1rem;background:var(--color-surface);color:var(--color-forest-900)}.quiz-area[data-state=some]{border-color:var(--color-forest-800);background:var(--color-sage-100)}.quiz-area[data-state=whole]{border-color:var(--color-forest-800);background:var(--color-forest-800);color:var(--color-white)}.quiz-area-toggle{display:grid;min-height:2.75rem;gap:.25rem;color:inherit;text-align:left;cursor:pointer}.quiz-area .quiz-area-disclosure{min-height:2.25rem;padding:.375rem .75rem;font-size:.8125rem}.quiz-area[data-state=whole] .quiz-area-disclosure{border-color:color-mix(in srgb,var(--color-sage-200) 50%,transparent);background:transparent;color:var(--color-sage-100)}.quiz-area-concepts{display:grid;min-width:0;gap:.25rem;margin:0;border:0;border-top:1px solid var(--color-line-soft);padding:.5rem 0 0}.quiz-concept{display:flex;min-height:2.25rem;align-items:flex-start;gap:.5rem;padding-block:.25rem;font-size:.875rem;cursor:pointer}.quiz-concept input{width:1.125rem;height:1.125rem;flex:none;margin-top:.125rem;accent-color:var(--color-forest-800)}.quiz-area[data-state=whole] .quiz-concept input{accent-color:var(--color-sage-200)}.quiz-setup-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem;margin-top:auto;border-top:1px solid var(--color-line-soft);padding-top:1.25rem}@media (hover:hover) and (pointer:fine){.quiz-step:not([aria-current=step]):hover{background:var(--color-surface)}.quiz-tile:hover{transform:translateY(-2px)}.quiz-area[data-state=none]:hover,.quiz-tile:not([aria-pressed=true]):hover{border-color:var(--color-sage-500)}}@media (prefers-reduced-motion:reduce){.quiz-tile{transition:none}.quiz-tile:hover{transform:none}}@media (width < 646px){.quiz-book{grid-template-columns:minmax(0,1fr);min-height:0}.quiz-setup-aside{gap:1rem;padding:1.25rem;border-right:0;border-bottom:1px solid var(--color-line)}.quiz-step{min-height:3rem;padding:.5rem .75rem}.quiz-setup-main{padding:1.25rem}.quiz-setup-leaves{display:none}.quiz-step-heading{padding-right:0}.quiz-tile{min-height:6rem;padding:1rem}.quiz-tile-number{font-size:2rem}}@media (forced-colors:active){.quiz-area[data-state=whole],.quiz-tile[aria-pressed=true]{outline:3px solid Highlight}}}