:root{--color-green:#53682b;--color-green-dark:#3f4f20;--color-green-light:#7a8f4d;--color-orange:#f78e1e;--color-orange-dark:#ff5a00;--color-orange-light:#ffb35c;--color-yellow:#f4aa00;--color-yellow-light:#ffd166;--color-primary:var(--color-orange);--color-primary-dark:var(--color-orange-dark);--color-accent:var(--color-green);--color-success:#17b26a;--color-success-bg:#e7f7ef;--color-warning:#f4aa00;--color-warning-bg:#fff3d6;--color-danger:#f04438;--color-danger-bg:#fde7e5;--color-info:#1570ef;--color-info-bg:#e7f0fe;--color-white:#fff;--color-gray-50:#f9fafb;--color-gray-100:#f3f4f6;--color-gray-200:#e5e7eb;--color-gray-300:#d2d6db;--color-gray-400:#9da4ae;--color-gray-500:#6c737f;--color-gray-600:#4d5562;--color-gray-700:#384250;--color-gray-900:#1f2a37;--color-bg:var(--color-gray-100);--color-bg-secondary:var(--color-white);--color-surface:var(--color-white);--color-text:var(--color-gray-900);--color-text-secondary:var(--color-gray-500);--color-text-muted:var(--color-gray-400);--color-text-on-primary:var(--color-white);--color-border:var(--color-gray-200);--color-border-strong:var(--color-gray-300);--space-2xs:.25rem;--space-xs:.5rem;--space-sm:.75rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2rem;--space-2xl:3rem;--space-3xl:4.5rem;--font-family-display:"Jost", "Futura PT", ui-rounded, "Segoe UI", system-ui, sans-serif;--font-family-body:"Open Sans", ui-sans-serif, system-ui, -apple-system, sans-serif;--font-size-xs:.75rem;--font-size-sm:.875rem;--font-size-md:1.125rem;--font-size-lg:1.25rem;--font-size-xl:1.5rem;--font-size-2xl:clamp(1.625rem, 1.1rem + 2.6vw, 2.25rem);--font-size-3xl:clamp(2rem, 1.3rem + 3.5vw, 3rem);--font-size-4xl:clamp(2.25rem, 1.4rem + 4.2vw, 3.75rem);--line-height-tight:1.2;--line-height-base:1.6;--radius-sm:.375rem;--radius-md:.625rem;--radius-lg:1rem;--radius-xl:1.5rem;--radius-full:9999px;--shadow-sm:0 1px 2px #1f2a3714;--shadow-md:0 4px 12px #1f2a371a;--shadow-lg:0 12px 32px #1f2a3724;--duration-fast:.12s;--duration-base:.22s;--ease:cubic-bezier(.4, 0, .2, 1);--container-max:72rem;--container-narrow:44rem}*,:before,:after{box-sizing:border-box}*{margin:0}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}body{min-height:100vh;line-height:var(--line-height-base);-webkit-font-smoothing:antialiased}img,picture,svg,video{max-width:100%;display:block}input,button,textarea,select{font:inherit;color:inherit}button{cursor:pointer;background:0 0;border:none}a{color:inherit;text-decoration:none}ul,ol{padding:0;list-style:none}h1,h2,h3,h4{text-wrap:balance}p{text-wrap:pretty}:focus-visible{outline:3px solid var(--color-orange);outline-offset:2px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}body{font-family:var(--font-family-body);font-size:var(--font-size-md);color:var(--color-text);background-color:var(--color-bg)}h1,h2,h3,h4{font-family:var(--font-family-display);font-weight:700;line-height:var(--line-height-tight);color:var(--color-text)}h1{font-size:var(--font-size-4xl)}h2{font-size:var(--font-size-3xl)}h3{font-size:var(--font-size-2xl)}h4{font-size:var(--font-size-xl)}a{color:var(--color-orange-dark);transition:color var(--duration-fast) var(--ease)}a:hover{color:var(--color-orange)}strong{font-weight:700}.btn{justify-content:center;align-items:center;gap:var(--space-xs);padding:var(--space-sm) var(--space-lg);font-family:var(--font-family-body);font-weight:700;font-size:var(--font-size-sm);border-radius:var(--radius-full);transition:transform var(--duration-fast) var(--ease), background-color var(--duration-fast) var(--ease), box-shadow var(--duration-fast) var(--ease);border:2px solid #0000;line-height:1;display:inline-flex}.btn:hover:not(:disabled){transform:translateY(-2px)}.btn:active:not(:disabled){transform:translateY(0)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--primary{background-color:var(--color-orange);color:var(--color-text-on-primary);box-shadow:var(--shadow-md)}.btn--primary:hover:not(:disabled){background-color:var(--color-orange-dark);color:var(--color-text-on-primary)}.btn--secondary{background-color:var(--color-green);color:var(--color-text-on-primary);box-shadow:var(--shadow-sm)}.btn--secondary:hover:not(:disabled){background-color:var(--color-green-dark);color:var(--color-text-on-primary)}.btn--ghost{color:var(--color-text);border-color:var(--color-border-strong);background-color:#0000}.btn--ghost:hover:not(:disabled){border-color:var(--color-orange);color:var(--color-orange-dark)}.btn--lg{padding:var(--space-md) var(--space-xl);font-size:var(--font-size-lg)}.btn--block{width:100%}.heading{font-family:var(--font-family-display);font-weight:700;line-height:var(--line-height-tight);color:var(--color-text)}.heading--display{font-size:var(--font-size-4xl);font-weight:800}.heading--1{font-size:var(--font-size-3xl)}.heading--2{font-size:var(--font-size-2xl)}.heading--3{font-size:var(--font-size-xl)}.heading--center{text-align:center}.avatar{border-radius:var(--radius-full);background-color:var(--color-surface);box-shadow:var(--shadow-sm);place-items:center;display:grid;overflow:hidden}.avatar__img{object-fit:contain;width:78%;height:78%}.avatar--sm{width:3rem;height:3rem}.avatar--md{width:5.5rem;height:5.5rem}.avatar--lg{width:9rem;height:9rem}.badge{padding:var(--space-2xs) var(--space-sm);font-family:var(--font-family-display);font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.04em;border-radius:var(--radius-full);background-color:var(--color-gray-100);color:var(--color-text-secondary);align-items:center;font-weight:600;display:inline-flex}.badge--easy{background-color:var(--color-success-bg);color:var(--color-success)}.badge--medium{background-color:var(--color-warning-bg);color:var(--color-orange-dark)}.badge--hard{background-color:var(--color-danger-bg);color:var(--color-danger)}.progress{gap:var(--space-2xs);flex-direction:column;display:flex}.progress__track{background-color:var(--color-gray-200);border-radius:var(--radius-full);width:100%;height:.625rem;overflow:hidden}.progress__fill{background-color:var(--color-green);border-radius:var(--radius-full);height:100%;transition:width var(--duration-base) var(--ease)}.progress__label{font-family:var(--font-family-display);font-size:var(--font-size-sm);color:var(--color-text-secondary);font-weight:600}.nugget-blink{width:10rem;display:inline-block;position:relative}.nugget-blink__layer{width:100%;height:auto;display:block}.nugget-blink__layer--blink{opacity:0;animation:nugget-blink 3.5s var(--ease) infinite;position:absolute;inset:0}@keyframes nugget-blink{0%,90%,to{opacity:0}93%,97%{opacity:1}}.monster-card{text-align:center;align-items:center;gap:var(--space-sm);padding:var(--space-xl) var(--space-lg) var(--space-lg);background-color:var(--color-surface);border:1px solid var(--color-border);border-top:6px solid var(--card-accent,var(--color-orange));border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:transform var(--duration-base) var(--ease), box-shadow var(--duration-base) var(--ease);flex-direction:column;display:flex;position:relative}.monster-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-4px)}.monster-card__crown{top:var(--space-sm);right:var(--space-sm);position:absolute}.monster-card__name{font-family:var(--font-family-display);font-size:var(--font-size-xl);color:var(--color-text);font-weight:700}.monster-card__pronouns{font-size:var(--font-size-xs);color:var(--color-text-muted);text-transform:lowercase;font-weight:600}.monster-card__tagline{color:var(--card-accent,var(--color-orange-dark));font-weight:700}.monster-card__description{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.answer-option{align-items:center;gap:var(--space-sm);width:100%;padding:var(--space-md) var(--space-lg);text-align:left;background-color:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-md);transition:border-color var(--duration-fast) var(--ease), background-color var(--duration-fast) var(--ease), transform var(--duration-fast) var(--ease);font-weight:600;display:flex}.answer-option:hover:not(:disabled){border-color:var(--color-orange);transform:translate(2px)}.answer-option--selected{border-color:var(--color-orange);background-color:#fff6ea}.answer-option__marker{width:1.75rem;height:1.75rem;font-family:var(--font-family-display);border-radius:var(--radius-full);background-color:var(--color-gray-100);color:var(--color-text-secondary);flex-shrink:0;place-items:center;font-weight:700;display:grid}.answer-option--selected .answer-option__marker{background-color:var(--color-orange);color:var(--color-text-on-primary)}.question-card{gap:var(--space-md);padding:var(--space-lg);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);flex-direction:column;display:flex}@media (width>=48em){.question-card{gap:var(--space-lg);padding:var(--space-xl);border-radius:var(--radius-xl)}}.question-card__header{align-items:center;gap:var(--space-md);display:flex}.question-card__prompt{font-family:var(--font-family-display);font-size:var(--font-size-2xl);font-weight:700;line-height:var(--line-height-tight);color:var(--color-text)}.question-card__options{gap:var(--space-sm);flex-direction:column;display:flex}.score-summary{padding:var(--space-xl) var(--space-lg);text-align:center;border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);position:relative;overflow:hidden}@media (width>=48em){.score-summary{padding:var(--space-2xl) var(--space-xl)}}.score-summary--passed{background:linear-gradient(160deg, var(--color-success-bg), var(--color-surface));--summary-accent:var(--color-success)}.score-summary--failed{background:linear-gradient(160deg, var(--color-warning-bg), var(--color-surface));--summary-accent:var(--color-orange-dark)}.score-summary__content{z-index:1;align-items:center;gap:var(--space-xs);flex-direction:column;display:flex;position:relative}.score-summary__trophy{font-size:3rem;line-height:1}.score-summary--perfect .score-summary__trophy{animation:trophy-pop .6s var(--ease) both}.score-summary__badge{font-family:var(--font-family-display);font-size:var(--font-size-sm);text-transform:uppercase;letter-spacing:.06em;padding:var(--space-2xs) var(--space-md);border-radius:var(--radius-full);color:var(--color-white);background-color:var(--summary-accent);font-weight:700}.score-summary__percent{font-family:var(--font-family-display);font-size:var(--font-size-4xl);color:var(--summary-accent);font-weight:700;line-height:1}.score-summary__headline{font-family:var(--font-family-display);font-size:var(--font-size-2xl);font-weight:700}.score-summary__detail{color:var(--color-text-secondary);font-weight:600}.score-summary__threshold{font-size:var(--font-size-sm);color:var(--color-text-muted)}.score-summary__fireworks{z-index:0;pointer-events:none;position:absolute;inset:0}.firework{opacity:0;width:.3rem;height:.3rem;animation:firework-pop 1.1s ease-out var(--fw-delay,0s) forwards;background:0 0;border-radius:50%;position:absolute;transform:translate(-50%,-50%)scale(0);box-shadow:2.5rem 0 .15rem #f78e1e,2.17rem 1.25rem .15rem #f4aa00,1.25rem 2.17rem .15rem #1aa0b5,0 2.5rem .15rem #f49ab6,-1.25rem 2.17rem .15rem #6fbe4a,-2.17rem 1.25rem .15rem #e8384f,-2.5rem 0 .15rem #f78e1e,-2.17rem -1.25rem .15rem #f4aa00,-1.25rem -2.17rem .15rem #1aa0b5,0 -2.5rem .15rem #f49ab6,1.25rem -2.17rem .15rem #6fbe4a,2.17rem -1.25rem .15rem #e8384f}@keyframes firework-pop{0%{opacity:0;transform:translate(-50%,-50%)scale(0)}25%{opacity:1}to{transform:translate(-50%, -50%) scale(var(--fw-scale,1));opacity:.85}}@keyframes trophy-pop{0%{transform:scale(0)rotate(-12deg)}60%{transform:scale(1.2)rotate(6deg)}to{transform:scale(1)rotate(0)}}.site-header{z-index:10;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--color-border);background-color:#ffffffe6;position:sticky;top:0}.site-header__inner{justify-content:space-between;align-items:center;gap:var(--space-sm);max-width:var(--container-max);padding:var(--space-sm) var(--space-md);margin:0 auto;display:flex}.site-header__brand{align-items:center;gap:var(--space-xs);flex-shrink:0;display:flex}.site-header__logo{width:auto;height:2rem}.site-header__product{font-family:var(--font-family-display);font-size:var(--font-size-md);color:var(--color-orange-dark);padding-left:var(--space-xs);border-left:2px solid var(--color-border);white-space:nowrap;font-weight:700}.site-header__nav{align-items:center;gap:var(--space-md);flex-shrink:0;display:flex}.site-header__link{font-family:var(--font-family-display);font-weight:500;font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-secondary);white-space:nowrap}.site-header__label-full{display:none}.site-header__label-short{display:inline}.site-header__link:hover,.site-header__link--active{color:var(--color-orange-dark)}@media (width<=26em){.site-header__product{display:none}}@media (width>=48em){.site-header__inner{gap:var(--space-md);padding:var(--space-md) var(--space-lg)}.site-header__brand{gap:var(--space-sm)}.site-header__logo{height:2.5rem}.site-header__product{font-size:var(--font-size-lg);padding-left:var(--space-sm)}.site-header__nav{gap:var(--space-lg)}.site-header__link{font-size:var(--font-size-sm)}.site-header__label-full{display:inline}.site-header__label-short{display:none}}.monster-grid{gap:var(--space-md);grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr));display:grid}@media (width>=48em){.monster-grid{gap:var(--space-lg)}}.quiz-player{gap:var(--space-lg);max-width:var(--container-narrow);flex-direction:column;margin:0 auto;display:flex}.quiz-player__progress{gap:var(--space-2xs);flex-direction:column;display:flex}.quiz-player__count{font-family:var(--font-family-display);color:var(--color-text-secondary);font-weight:600}.quiz-player__actions{justify-content:space-between;gap:var(--space-md);display:flex}.app-layout{flex-direction:column;min-height:100vh;display:flex}.app-layout__main{width:100%;max-width:var(--container-max);padding:var(--space-xl) var(--space-md);flex:1;margin:0 auto}@media (width>=48em){.app-layout__main{padding:var(--space-2xl) var(--space-lg)}}.app-layout__footer{padding:var(--space-xl) var(--space-md);text-align:center;font-size:var(--font-size-sm);color:var(--color-text-muted);border-top:1px solid var(--color-border)}.welcome{align-items:center;gap:var(--space-lg);text-align:center;padding-block:var(--space-lg);flex-direction:column;display:flex}@media (width>=48em){.welcome{gap:var(--space-xl);padding-block:var(--space-2xl)}}.welcome__hero-mark{animation:welcome-bob 3s var(--ease) infinite}.welcome__lede{max-width:38rem;font-size:var(--font-size-lg);color:var(--color-text-secondary)}.welcome__cta{gap:var(--space-md);flex-wrap:wrap;justify-content:center;display:flex}.welcome__features{gap:var(--space-lg);width:100%;margin-top:var(--space-md);grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr));display:grid}@media (width>=48em){.welcome__features{margin-top:var(--space-xl)}}.welcome__feature{padding:var(--space-lg);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}.welcome__feature-title{font-family:var(--font-family-display);margin-bottom:var(--space-2xs);font-weight:700}.welcome__feature-text{font-size:var(--font-size-sm);color:var(--color-text-secondary)}@keyframes welcome-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.monsters-page{gap:var(--space-xl);flex-direction:column;display:flex}.monsters-page__intro{text-align:center;max-width:40rem;color:var(--color-text-secondary);margin:0 auto}.quiz-page{gap:var(--space-xl);flex-direction:column;display:flex}.quiz-page__title{text-align:center}.quiz-results{gap:var(--space-xl);max-width:var(--container-narrow);flex-direction:column;margin:0 auto;display:flex}.quiz-results__list{gap:var(--space-md);flex-direction:column;display:flex}.quiz-results__actions{justify-content:center;gap:var(--space-md);display:flex}.result-row{gap:var(--space-2xs);padding:var(--space-lg);background-color:var(--color-surface);border:1px solid var(--color-border);border-left:5px solid var(--color-gray-300);border-radius:var(--radius-md);flex-direction:column;display:flex}.result-row--correct{border-left-color:var(--color-success)}.result-row--incorrect{border-left-color:var(--color-danger)}.result-row__head{align-items:baseline;gap:var(--space-xs);display:flex}.result-row__icon{font-size:var(--font-size-lg)}.result-row__question{font-family:var(--font-family-display);font-weight:700}.result-row__answer{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.result-row__answer--correct{color:var(--color-success);font-weight:700}.result-row__explanation{margin-top:var(--space-2xs);font-size:var(--font-size-sm);color:var(--color-text-secondary);font-style:italic}