.hl-shell{max-width:46rem;margin:0 auto}.hl-loading,.hl-error{color:var(--color-text-muted);padding:var(--space-5) 0}.hl-scoreboard{display:flex;align-items:center;justify-content:center;gap:var(--space-5);margin-bottom:var(--space-4)}.hl-score{text-align:center;line-height:1.1}.hl-score-num{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:700;color:var(--color-text);display:block}.hl-score-num-accent{color:var(--color-accent)}.hl-score-label{font-size:var(--text-sm);font-weight:600;color:var(--color-text-muted)}.hl-score-divider{width:1px;align-self:stretch;background:var(--color-border)}.hl-prompt{text-align:center;margin:0 auto var(--space-4);max-width:34rem}.hl-prompt-lead{margin:0;font-family:var(--font-display);font-size:var(--text-xl);line-height:var(--leading-tight);color:var(--color-text)}.hl-prompt-cat{color:var(--color-accent)}.hl-prompt-sub{margin:var(--space-1) 0 0;font-size:var(--text-sm);color:var(--color-text-faint)}.hl-arena{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3);align-items:stretch}.hl-choice{position:relative;display:flex;flex-direction:column;align-items:center;gap:var(--space-3);padding:var(--space-4) var(--space-3) var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:var(--shadow-card);cursor:pointer;font:inherit;color:var(--color-text);text-align:center;width:100%;transition:border-color .12s ease,box-shadow .12s ease,transform .1s ease}.hl-choice:hover:not(:disabled){border-color:var(--color-accent-border);box-shadow:var(--shadow-card-hover, var(--shadow-card));transform:translateY(-2px)}.hl-choice:focus-visible{outline:none;box-shadow:var(--focus-ring)}.hl-choice:disabled{cursor:default}.hl-choice.is-picked{box-shadow:inset 0 0 0 2px var(--color-border-strong)}.hl-choice.is-correct{border-color:var(--color-accent);box-shadow:inset 0 0 0 2px var(--color-accent)}.hl-choice.is-wrong{border-color:var(--color-border-strong);opacity:.7}.hl-choice.is-picked.is-wrong{border-color:var(--color-danger);box-shadow:inset 0 0 0 2px var(--color-danger);opacity:1}.hl-portrait{display:block;width:100%;max-width:12rem;aspect-ratio:4 / 5;object-fit:cover;object-position:top;border-radius:var(--radius-md);background:var(--color-surface-raised);border:1px solid var(--color-border)}.hl-choice-name{font-family:var(--font-display);font-size:var(--text-lg);font-weight:700;line-height:var(--leading-tight)}.hl-winner-tag{margin-left:.4em}.hl-value{min-height:1.6em;display:flex;flex-direction:column;align-items:center;gap:.1rem}.hl-value-hint{font-size:var(--text-sm);font-weight:600;color:var(--color-text-faint)}.hl-value-num{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:700;color:var(--color-text);line-height:1;animation:hl-pop .28s ease both}.hl-value-num-hi{color:var(--color-accent)}.hl-value-unit{font-size:var(--text-xs);color:var(--color-text-faint)}@keyframes hl-pop{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@media(prefers-reduced-motion:reduce){.hl-value-num{animation:none}}.hl-vs{position:absolute;top:42%;left:50%;transform:translate(-50%,-50%);z-index:2;width:2.6rem;height:2.6rem;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-full);background:var(--color-accent);color:#fff;font-family:var(--font-display);font-size:var(--text-sm);font-weight:800;letter-spacing:.02em;box-shadow:var(--shadow-card);pointer-events:none}.hl-feedback{text-align:center;min-height:1.5em;margin:var(--space-4) 0 0;font-weight:600;font-size:var(--text-base)}.hl-feedback-correct{color:var(--color-accent-deep)}.hl-feedback-wrong{color:var(--color-danger)}.hl-intro-card,.hl-over-card{border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:var(--shadow-card);padding:var(--space-6) var(--space-5) var(--space-5);text-align:center;position:relative;overflow:hidden}.hl-intro-card:before,.hl-over-card:before{content:"";position:absolute;inset:0 0 auto;height:4px;background:var(--color-accent)}.hl-intro-faces{display:flex;justify-content:center;gap:0;margin:var(--space-2) 0 var(--space-5)}.hl-intro-face{width:4.5rem;height:5.625rem;object-fit:cover;object-position:top;border-radius:var(--radius-md);border:2px solid var(--color-surface);box-shadow:var(--shadow-card);background:var(--color-surface-raised);margin-left:-.75rem}.hl-intro-face:first-child{margin-left:0}.hl-intro-meta{margin:0 0 var(--space-2);font-size:var(--text-sm);font-weight:600;color:var(--color-text-muted)}.hl-intro-lead{margin:0 auto var(--space-5);max-width:32rem;font-size:var(--text-lg);color:var(--color-text);line-height:var(--leading-normal)}.hl-intro-note{margin:var(--space-4) 0 0;font-size:var(--text-sm);color:var(--color-text-faint)}.hl-over-label{margin:0 0 var(--space-1);font-size:var(--text-sm);font-weight:700;color:var(--color-text-muted)}.hl-over-streak{margin:0;font-family:var(--font-display);font-size:var(--text-4xl, var(--text-3xl));line-height:1;color:var(--color-text)}.hl-over-streak-num{color:var(--color-accent)}.hl-over-sub{margin:var(--space-2) auto var(--space-5);max-width:30rem;color:var(--color-text-muted)}.hl-over-best{display:inline-block;margin-bottom:var(--space-5);font-size:var(--text-sm);font-weight:600;color:var(--color-accent-deep);background:var(--color-surface);border:1px solid var(--color-accent-border);border-radius:var(--radius-full);padding:.2rem var(--space-4)}.hl-over-actions{display:flex;flex-wrap:wrap;gap:var(--space-2);justify-content:center}.btn.btn-quiet{border-color:transparent;background:none;color:var(--color-text-muted)}.btn.btn-quiet:hover{background:var(--color-surface-raised);border-color:var(--color-border);color:var(--color-text)}.btn.btn-lg{font-size:var(--text-lg);padding:var(--space-3) var(--space-6)}.hl-visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:30rem){.hl-prompt-lead{font-size:var(--text-lg)}.hl-arena{gap:var(--space-2)}.hl-choice{padding:var(--space-3) var(--space-2)}.hl-choice-name{font-size:var(--text-base)}.hl-value-num{font-size:var(--text-xl)}.hl-vs{width:2.1rem;height:2.1rem;font-size:var(--text-xs)}.hl-over-actions .btn.btn-lg{width:100%}}