:root{--color-bg: #fdf6e3;--color-ink: #0d0d0d;--color-yellow: #ffd93d;--color-pink: #ff6ec7;--color-cyan: #4dd8e6;--color-lime: #b8f135;--color-purple: #a06cd5;--color-white: #ffffff;--border-width: 3px;--border-width-thick: 5px;--shadow-offset: 6px;--shadow-offset-large: 10px;--font-stack: "Arial Black", "Helvetica Neue", Impact, system-ui, sans-serif;--font-size-base: 1.0625rem;--font-size-heading: 1.75rem;--font-size-hero: 2.5rem;--space-1: 0.25rem;--space-2: 0.5rem;--space-3: 1rem;--space-4: 1.5rem;--space-5: 2.5rem;--container-max: 720px;--radius: 0}*,*::before,*::after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;font-family:var(--font-stack);font-size:var(--font-size-base);line-height:1.4;color:var(--color-ink);background-color:var(--color-bg);background-image:repeating-linear-gradient(-45deg, transparent 0 24px, rgba(13,13,13,0.04) 24px 48px)}img{max-width:100%}a{color:var(--color-ink)}.container{width:100%;max-width:var(--container-max);margin-inline:auto;padding-inline:var(--space-3)}.app-header{border-bottom:var(--border-width-thick) solid var(--color-ink);background:var(--color-yellow);box-shadow:0 var(--shadow-offset) 0 var(--color-ink);margin-bottom:var(--space-4)}.app-header__top{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);padding-block:var(--space-3)}.app-header__title{margin:0;font-size:clamp(1.25rem, 6vw, var(--font-size-heading));text-transform:uppercase;letter-spacing:0.05em;word-break:break-word}.app-header__nav{display:flex;flex-direction:column;gap:var(--space-2);padding-bottom:var(--space-3)}.app-header__nav .btn{width:100%;min-height:48px;display:flex;align-items:center;justify-content:center}.app-footer{border-top:var(--border-width-thick) solid var(--color-ink);background:var(--color-cyan);box-shadow:0 calc(-1 * var(--shadow-offset)) 0 var(--color-ink);margin-top:var(--space-4);padding-block:var(--space-2);padding-bottom:max(var(--space-2), env(safe-area-inset-bottom));font-size:0.8rem;text-transform:uppercase}.heading{font-family:var(--font-stack);text-transform:uppercase;letter-spacing:0.05em;line-height:1.1;margin:0 0 var(--space-3)}.heading--hero{font-size:clamp(var(--font-size-heading), 10vw, var(--font-size-hero));text-shadow:3px 3px 0 var(--color-pink)}.heading--section{font-size:var(--font-size-heading)}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:var(--space-2) var(--space-3);font-family:var(--font-stack);font-size:1rem;text-transform:uppercase;text-decoration:none;text-align:center;color:var(--color-ink);background:var(--color-lime);border:var(--border-width) solid var(--color-ink);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--color-ink);cursor:pointer;transition:transform 60ms ease-out, box-shadow 60ms ease-out}@media (hover: hover){.btn:hover{transform:translate(2px, 2px);box-shadow:4px 4px 0 var(--color-ink)}}.btn:active{transform:translate(var(--shadow-offset), var(--shadow-offset));box-shadow:none}.btn--pink{background:var(--color-pink)}.btn--cyan{background:var(--color-cyan)}.btn--yellow{background:var(--color-yellow)}.btn--block{display:block;width:100%}.card{background:var(--color-white);border:var(--border-width-thick) solid var(--color-ink);box-shadow:var(--shadow-offset-large) var(--shadow-offset-large) 0 var(--color-ink);padding:var(--space-3)}.card--pink{background:var(--color-pink)}.card--cyan{background:var(--color-cyan)}.card--lime{background:var(--color-lime)}.card--yellow{background:var(--color-yellow)}.badge{display:inline-block;padding:var(--space-1) var(--space-2);font-size:0.75rem;font-weight:bold;text-transform:uppercase;background:var(--color-yellow);border:var(--border-width) solid var(--color-ink);box-shadow:3px 3px 0 var(--color-ink)}.field{margin-bottom:var(--space-3)}.field__label{display:block;font-size:0.85rem;font-weight:bold;text-transform:uppercase;margin-bottom:var(--space-1)}.input{width:100%;padding:var(--space-2);font-size:16px;font-family:var(--font-stack);color:var(--color-ink);background:var(--color-white);border:var(--border-width) solid var(--color-ink);box-shadow:inset 3px 3px 0 rgba(13,13,13,0.1)}.input:focus{outline:var(--border-width) solid var(--color-purple);outline-offset:2px}.flash{padding:var(--space-2) var(--space-3);margin-bottom:var(--space-3);font-weight:bold;border:var(--border-width) solid var(--color-ink);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--color-ink)}.flash--notice{background:var(--color-lime)}.flash--alert{background:var(--color-pink)}.quiz__question{margin:0;font-size:1.1rem;font-weight:bold;text-transform:uppercase}.quiz__option{display:block;padding:var(--space-3);margin-bottom:var(--space-2);border:var(--border-width) solid var(--color-ink);background:var(--color-white);cursor:pointer}@media (hover: hover){.quiz__option:hover{background:var(--color-yellow)}}.quiz__option input:checked+span{font-weight:bold}.quiz__option:has(input:checked){background:var(--color-lime);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--color-ink)}.quiz__option input{margin-right:var(--space-2)}.question-form__option{display:flex;flex-direction:column;gap:var(--space-1);margin-bottom:var(--space-2)}.question-form__correct{display:inline-flex;align-items:center;gap:var(--space-1);font-size:0.85rem;font-weight:bold;text-transform:uppercase}.podium{display:grid;gap:var(--space-3);margin-bottom:var(--space-4)}.podium__rank{display:inline-block;font-size:2.25rem;font-weight:bold;line-height:1;text-shadow:2px 2px 0 var(--color-ink)}.podium__name{margin:var(--space-2) 0;font-size:1.25rem;font-weight:bold;text-transform:uppercase;word-break:break-word}.ranking{width:100%;border-collapse:collapse}.ranking td{padding:var(--space-2)}.ranking-row+.ranking-row td{border-top:var(--border-width) solid var(--color-ink)}.ranking__pos{width:3rem;font-weight:bold}.ranking__points{width:4rem;text-align:right;font-weight:bold}.result__answer{margin:var(--space-2) 0;font-size:1.1rem}.badge--correct{background:var(--color-lime)}.badge--wrong{background:var(--color-pink)}.stack>*+*{margin-top:var(--space-3)}.text-center{text-align:center}.text-muted{font-size:0.9rem;opacity:0.75}.mt-3{margin-top:var(--space-3)}