*,*:before,*:after{box-sizing:border-box}html{overflow-x:clip}body{margin:0;background:var(--color-paper);color:var(--color-ink);font-family:var(--font-body);font-feature-settings:"ss01" on,"cv11" on;font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased;overflow-x:clip}#root{min-height:100dvh;display:flex;flex-direction:column}img,svg{display:block;max-width:100%}a{color:var(--color-accent-2-deep)}:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}.eyebrow,.mono-label{font-family:var(--font-label);font-size:var(--text-xs);letter-spacing:.1em;text-transform:uppercase;color:var(--color-ink-2)}.section{max-width:var(--shell);margin-inline:auto;padding:var(--section-gap) var(--page-gutter);width:100%}.btn{--btn-face: var(--color-accent);--btn-ink: var(--color-ink);--btn-edge: var(--color-accent-deep);--btn-cast: oklch(76% .2 95 / .45);display:inline-flex;align-items:center;justify-content:center;gap:.5em;padding:.8rem 1.4rem;font-family:var(--font-display);font-weight:600;font-size:var(--text-base);line-height:1.2;border:0;border-radius:var(--radius-pill);color:var(--btn-ink);background:var(--btn-face);cursor:pointer;position:relative;isolation:isolate;text-decoration:none;box-shadow:0 4px 0 0 var(--btn-edge),0 6px 12px -3px var(--btn-cast);transform:translateY(0);transition:transform .14s cubic-bezier(.2,.7,.3,1),box-shadow .14s cubic-bezier(.2,.7,.3,1),background-color .16s}.btn:hover{transform:translateY(-2px);box-shadow:0 6px 0 0 var(--btn-edge),0 12px 22px -4px var(--btn-cast)}.btn:active{transform:translateY(3px);box-shadow:0 1px 0 0 var(--btn-edge),0 2px 6px -2px var(--btn-cast);transition-duration:70ms}.btn:focus-visible{outline:3px solid color-mix(in oklch,var(--btn-edge) 70%,var(--color-focus));outline-offset:3px}.btn[disabled]{opacity:.5;cursor:not-allowed;pointer-events:none;transform:none;box-shadow:0 4px 0 0 var(--btn-edge)}.btn--coral{--btn-face: var(--color-accent-3);--btn-ink: oklch(98% .02 25);--btn-edge: var(--color-accent-3-deep);--btn-cast: oklch(54% .22 20 / .4)}.btn--mint{--btn-face: var(--color-mint);--btn-edge: var(--color-mint-deep);--btn-cast: oklch(62% .16 150 / .4)}.btn--lg{padding:1rem 2rem;font-size:var(--text-lg)}.card{background:var(--color-paper);border-radius:var(--radius-card);box-shadow:var(--shadow-card);transition:transform .22s var(--ease-spring),box-shadow .22s}.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-card-hover)}.card__tint{background:color-mix(in oklch,var(--card-accent, var(--color-accent)) 6%,var(--color-paper));transition:background-color .22s}.card__tint:hover{background:color-mix(in oklch,var(--card-accent, var(--color-accent)) 12%,var(--color-paper))}em{color:inherit;background-image:linear-gradient(var(--hl, oklch(86% .18 95 / .55)) 0 0);background-repeat:no-repeat;background-size:100% .32em;background-position:0 82%;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-bottom:.02em;font-style:normal}@media (prefers-reduced-motion: reduce){.btn,.btn:hover,.btn:active,.card,.card:hover{transition-duration:.15s;transform:none}}@media (max-width: 640px){:root{--section-gap: var(--space-12);--page-gutter: 1rem}h1,.hero-title{overflow-wrap:anywhere;min-width:0}}@media (max-width: 480px){.btn{width:100%}}:root{--color-paper: oklch(97% .012 95);--color-paper-2: oklch(94% .016 95);--color-paper-3: oklch(91% .02 95);--color-ink: oklch(20% .012 250);--color-ink-2: oklch(45% .015 250);--color-accent: oklch(86% .18 95);--color-accent-deep: oklch(74% .16 95);--color-accent-2: oklch(66% .18 235);--color-accent-2-deep: oklch(52% .17 240);--color-accent-3: oklch(68% .24 18);--color-accent-3-deep: oklch(54% .22 20);--color-mint: oklch(80% .16 150);--color-mint-deep: oklch(62% .16 150);--color-lavender: oklch(74% .16 305);--color-lavender-deep: oklch(56% .18 305);--color-focus: oklch(66% .18 235);--color-error: oklch(62% .22 25);--font-display: "Plus Jakarta Sans", ui-rounded, system-ui, sans-serif;--font-body: "Plus Jakarta Sans", ui-rounded, system-ui, sans-serif;--font-label: "JetBrains Mono", ui-monospace, monospace;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-6: 1.5rem;--space-8: 2rem;--space-12: 3rem;--space-16: 4rem;--space-20: 5rem;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-display: clamp(2.5rem, 5vw + 1rem, 3.5rem);--radius-card: 20px;--radius-pill: 999px;--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--ease-out: cubic-bezier(.2, .7, .3, 1);--page-max: 74rem;--page-gutter: 1.5rem;--shell: var(--page-max);--section-gap: var(--space-20);--shadow-card: 0 12px 32px -16px oklch(20% .012 250 / .14);--shadow-card-hover: 0 20px 40px -18px oklch(20% .012 250 / .2)}.nav{border-bottom:2px solid var(--color-ink)}.nav__inner{max-width:var(--shell);margin-inline:auto;padding:var(--space-4) var(--page-gutter);display:flex;align-items:center;gap:var(--space-6)}.nav__brand{font-weight:700;letter-spacing:-.025em;text-decoration:none;color:var(--color-ink);font-size:var(--text-xl)}.nav__dot{color:var(--color-accent-3)}.nav__links{display:flex;gap:var(--space-4);margin-left:auto}.nav__link{text-decoration:none;font-weight:600;color:var(--color-ink-2);padding:var(--space-1) var(--space-2);border-radius:var(--radius-pill)}.nav__link:hover{color:var(--color-ink)}.nav__link.is-active{background:var(--color-paper-2);color:var(--color-ink)}.nav__menu-info{display:none;border:0;background:none;font-family:var(--font-body);font-size:var(--text-base);text-align:left;cursor:pointer}.nav__aside{display:flex;align-items:center;gap:var(--space-4)}.nav__info{width:44px;height:44px;border:2px solid var(--color-ink);border-radius:var(--radius-pill);background:var(--color-paper);color:var(--color-ink);font-family:var(--font-label);font-size:var(--text-lg);font-weight:500;line-height:1;cursor:pointer;transition:background-color .16s,color .16s}.nav__info:hover{background:var(--color-ink);color:var(--color-paper)}.nav__toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;padding:10px;margin-left:auto;border:2px solid var(--color-ink);border-radius:var(--radius-pill);background:var(--color-paper);cursor:pointer}.nav__bar{display:block;height:3px;border-radius:2px;background:var(--color-ink);transition:transform .2s ease,opacity .2s ease}.nav__toggle[aria-expanded=true] .nav__bar:nth-child(1){transform:translateY(8px) rotate(45deg)}.nav__toggle[aria-expanded=true] .nav__bar:nth-child(2){opacity:0}.nav__toggle[aria-expanded=true] .nav__bar:nth-child(3){transform:translateY(-8px) rotate(-45deg)}.footer{border-top:2px solid var(--color-ink);padding:var(--space-12) var(--page-gutter);text-align:center;margin-top:auto}.footer__tagline{margin:0 0 var(--space-2);color:var(--color-accent-3)}.footer__copy{margin:0;color:var(--color-ink-2);font-size:var(--text-sm)}.code-card{background:var(--color-ink);color:var(--color-paper);border-radius:var(--radius-card);padding:var(--space-4);overflow-x:auto;margin-top:var(--space-4)}.code-card__lang{display:block;color:var(--color-accent);margin-bottom:var(--space-2)}.code-card__pre{margin:0;font-family:var(--font-label);font-size:var(--text-sm);line-height:1.6;white-space:pre}.home__hero{padding-top:var(--space-16);padding-bottom:var(--space-8)}.hero-title{font-size:var(--text-display);font-weight:600;letter-spacing:-.025em;line-height:1.05;margin:var(--space-2) 0 var(--space-4);max-width:22ch;overflow-wrap:anywhere}.home__lead{font-size:var(--text-lg);color:var(--color-ink-2);max-width:55ch;line-height:1.6}.home__error{color:var(--color-error);font-weight:500}.home__config{padding-top:var(--space-8);display:flex;flex-direction:column;gap:var(--space-8)}.filtro{border:0;padding:0;margin:0}.filtro legend{margin-bottom:var(--space-3)}.filtro__chips{display:flex;flex-wrap:wrap;gap:var(--space-2)}.chip{border:2px solid var(--color-paper-3);background:var(--color-paper);color:var(--color-ink);font-weight:600;font-size:var(--text-sm);padding:var(--space-2) var(--space-4);border-radius:var(--radius-pill);cursor:pointer;transition:background-color .16s,border-color .16s,transform .14s var(--ease-out)}.chip:hover{border-color:var(--color-ink-2);transform:translateY(-2px)}.chip.is-active{background:var(--color-ink);border-color:var(--color-ink);color:var(--color-paper)}.chip--accent.is-active,.chip--accent:hover{border-color:var(--color-accent-deep)}.chip--accent-2.is-active,.chip--accent-2:hover{border-color:var(--color-accent-2-deep)}.chip--accent-3.is-active,.chip--accent-3:hover{border-color:var(--color-accent-3-deep)}.chip--mint.is-active,.chip--mint:hover{border-color:var(--color-mint-deep)}.chip--lavender.is-active,.chip--lavender:hover{border-color:var(--color-lavender-deep)}.quiz__header{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);padding-top:var(--space-8);padding-bottom:var(--space-4)}.quiz__progreso{display:flex;align-items:center;gap:var(--space-4)}.quiz__tiempo{font-family:var(--font-label);font-size:var(--text-sm);background:var(--color-ink);color:var(--color-paper);padding:var(--space-1) var(--space-3);border-radius:var(--radius-pill)}.quiz__tiempo.is-urgente{background:var(--color-error)}.quiz__detener{margin-top:var(--space-4);align-self:flex-start;padding:.5rem 1rem;font-size:var(--text-sm)}.quiz__score{font-family:var(--font-label);font-size:var(--text-lg);font-weight:500;color:var(--color-accent-3)}.quiz__body{padding-top:var(--space-4);padding-bottom:var(--space-16)}.quiz__pregunta{padding:var(--space-8);margin-bottom:var(--space-6);border:2px solid var(--color-paper-3)}.quiz__tag{color:var(--color-accent-2-deep)}.quiz__texto{font-size:var(--text-2xl);font-weight:600;letter-spacing:-.02em;margin:var(--space-3) 0 0;line-height:1.3}.quiz__opciones{display:grid;gap:var(--space-3)}.opcion{display:flex;align-items:center;gap:var(--space-4);text-align:left;border:2px solid var(--color-paper-3);background:var(--color-paper);color:var(--color-ink);border-radius:var(--radius-card);padding:var(--space-4) var(--space-6);cursor:pointer;font-family:var(--font-body);font-size:var(--text-lg);transition:border-color .16s,background-color .16s,transform .14s var(--ease-out)}.opcion:hover:not(:disabled){border-color:var(--color-accent-2-deep);transform:translateY(-2px)}.opcion:disabled{cursor:default}.opcion.is-selected{border-color:var(--color-ink)}.opcion.is-correct{border-color:var(--color-mint-deep);background:color-mix(in oklch,var(--color-mint) 16%,var(--color-paper))}.opcion.is-wrong{border-color:var(--color-error);background:color-mix(in oklch,var(--color-error) 10%,var(--color-paper))}.opcion__letra{background:var(--color-paper-2);border:2px solid var(--color-paper-3);border-radius:12px;width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.quiz__feedback{margin-top:var(--space-6);display:flex;flex-direction:column;gap:var(--space-4)}.feedback{border-radius:var(--radius-card);padding:var(--space-4) var(--space-6);line-height:1.5}.feedback--ok{background:color-mix(in oklch,var(--color-mint) 20%,var(--color-paper));border:2px solid var(--color-mint-deep)}.feedback--ko{background:color-mix(in oklch,var(--color-error) 12%,var(--color-paper));border:2px solid var(--color-error)}.resultados__hero{padding-top:var(--space-16);padding-bottom:var(--space-8)}.resultados__stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--space-6);padding-top:var(--space-4)}.stat{padding:var(--space-8)}.stat--pear{--card-accent: var(--color-accent)}.stat--cyan{--card-accent: var(--color-accent-2)}.stat__num{display:block;font-size:clamp(3rem,5vw + 1rem,5rem);font-weight:700;letter-spacing:-.04em;line-height:1;margin-top:var(--space-2);font-variant-numeric:tabular-nums}.seccion-titulo{font-size:var(--text-2xl);font-weight:600;letter-spacing:-.02em;margin:0 0 var(--space-6)}.resultados__ultima{padding:var(--space-6) var(--space-8);margin-bottom:var(--space-6)}.resultados__resumen{font-size:var(--text-lg);font-weight:600;margin:var(--space-2) 0 0}.resultados__vacio{color:var(--color-ink-2)}.historial{list-style:none;padding:0;margin:0 0 var(--space-8);display:grid;gap:var(--space-2)}.historial__item{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-4) var(--space-6);border:2px solid var(--color-paper-3);border-radius:var(--radius-card)}.historial__fecha{color:var(--color-ink-2)}.historial__puntos{font-weight:700;color:var(--color-accent-3)}.modal__overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:var(--page-gutter);background:#12171b8c}.modal__dialog{background:var(--color-paper);color:var(--color-ink);border:2px solid var(--color-ink);border-radius:var(--radius-card);box-shadow:var(--shadow-card-hover);max-width:34rem;width:100%;padding:var(--space-8)}.modal__titulo{font-size:var(--text-2xl);font-weight:600;letter-spacing:-.02em;margin:0 0 var(--space-4);line-height:1.2}.modal__texto{color:var(--color-ink-2);line-height:1.6}.modal__texto p{margin:0 0 var(--space-4)}.modal__texto p:last-child{margin-bottom:0}.modal__acciones{margin-top:var(--space-8);display:flex;justify-content:flex-end}@media (max-width: 640px){.nav__inner{flex-wrap:wrap;row-gap:var(--space-2)}.nav__brand{order:1}.nav__aside{order:2}.nav__toggle{display:flex;order:3}.nav__links{display:none;order:4;flex-basis:100%;flex-direction:column;gap:var(--space-2);margin-left:0;padding:var(--space-2) 0;border-top:2px solid var(--color-paper-3)}.nav__links.is-open{display:flex}.nav__link{padding:var(--space-2) var(--space-3)}.nav__info{display:none}.nav__menu-info{display:block}.hero-title{font-size:clamp(2rem,8vw,2.75rem)}.opcion{font-size:var(--text-base);padding:var(--space-3) var(--space-4)}.modal__dialog{padding:var(--space-6)}.modal__acciones{flex-direction:column;gap:var(--space-3)}.modal__acciones .btn{width:100%}.quiz__header{flex-wrap:wrap}}