@charset "UTF-8";:root{--font-primary: "Rubik", sans-serif;--color-coral: #FF6B6B;--color-yellow: #FFE66D;--color-teal: #4ECDC4;--color-blue: #4F86ED;--color-purple: #A3A7D4;--color-coral-rgb: 255, 107, 107;--color-yellow-rgb: 255, 230, 109;--color-teal-rgb: 78, 205, 196;--color-blue-rgb: 79, 134, 237;--color-purple-rgb: 163, 167, 212;--bg-gradient-1: linear-gradient(135deg, #ffffff 0%, #f8f9ff 50%, #ffffff 100%);--bg-gradient-2: linear-gradient(135deg, #ffffff 0%, #f0f8ff 50%, #ffffff 100%);--bg-gradient-card: linear-gradient(135deg, rgba(255, 255, 255, .85) 0%, rgba(79, 134, 237, .06) 50%, rgba(255, 255, 255, .85) 100%);--primary-title: var(--color-blue);--secondary-title: var(--color-teal);--ink: #2C2F36;--ink-2: var(--color-blue);--ink-soft: #6B7280;--ink-label: var(--color-purple);--ink-answers: #374151;--primary-btn: var(--color-teal);--primary-btn-hover: #45B7B8;--primary-btn-text: #ffffff;--primary-btn-border: #3CBCC0;--secondary-btn: #F3F4F6;--secondary-btn-hover: var(--color-purple);--secondary-btn-text: var(--ink);--secondary-btn-border: var(--color-purple);--success-bg: rgba(78, 205, 196, .1);--success-text: #0F766E;--success-border: var(--color-teal);--error-bg: rgba(255, 107, 107, .1);--error-text: #DC2626;--error-border: var(--color-coral);--warning-bg: rgba(255, 230, 109, .1);--warning-text: #D97706;--warning-border: var(--color-yellow);--chip-bg: #F9FAFB;--cat-1: linear-gradient(135deg, rgba(255, 107, 107, .12) 0%, rgba(255, 255, 255, .85) 100%);--cat-2: linear-gradient(135deg, rgba(255, 230, 109, .12) 0%, rgba(255, 255, 255, .85) 100%);--cat-3: linear-gradient(135deg, rgba(78, 205, 196, .12) 0%, rgba(255, 255, 255, .85) 100%);--cat-4: linear-gradient(135deg, rgba(79, 134, 237, .12) 0%, rgba(255, 255, 255, .85) 100%);--cat-5: linear-gradient(135deg, rgba(163, 167, 212, .12) 0%, rgba(255, 255, 255, .85) 100%);--surface: rgba(255, 255, 255, .85);--surface-2: rgba(255, 255, 255, .92);--surface-3: var(--chip-bg);--outline: #E5E7EB;--outline-strong: #D1D5DB;--question: var(--color-blue);--timer-track: #F3F4F6;--timer-border: #D1D5DB;--timer-ok: var(--color-teal);--timer-warn: var(--color-yellow);--timer-danger: var(--color-coral);--page-max: 960px;--panel-max: 880px;--safe-bottom: env(safe-area-inset-bottom, 0px);--accent: var(--primary-title);--teal-title: var(--primary-title);--subtitle: var(--secondary-title);--mint: var(--primary-btn);--mint-2: var(--primary-btn-hover);--mint-text: var(--primary-btn-text);--mint-border: var(--primary-btn-border);--spacing-xs: 8px;--spacing-sm: 12px;--spacing-md: 16px;--spacing-lg: 20px;--spacing-xl: 24px;--spacing-2xl: 28px;--panel-padding: var(--spacing-xl);--field-gap: 10px;--block-margin: var(--spacing-lg);--actions-margin: var(--spacing-xl);--fz-base: 20px;--lh-base: 1.7}*{box-sizing:border-box;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}input,textarea,select{-webkit-user-select:text!important;user-select:text!important}html,body{height:100%;overflow-x:hidden;overflow-y:auto;touch-action:manipulation;overscroll-behavior:none;-webkit-overflow-scrolling:touch}html{overflow-y:auto}body{min-height:100svh;margin:0;font-family:var(--font-primary);font-size:var(--fz-base);line-height:var(--lh-base);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;color:var(--ink);overflow-x:hidden;overflow-y:auto;width:100%;height:100%;position:relative}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;background-image:url(subtle-prism.svg);background-attachment:fixed;background-size:cover;background-position:center center;background-repeat:no-repeat;opacity:0;transition:opacity .5s ease-in-out;animation:prismColorShift 60s ease-in-out infinite;animation-play-state:running}body.animation-ready:before{opacity:1}@keyframes prismColorShift{0%{filter:hue-rotate(0deg) brightness(1.02) saturate(1.05)}25%{filter:hue-rotate(90deg) brightness(1.03) saturate(1.08)}50%{filter:hue-rotate(180deg) brightness(1.02) saturate(1.05)}75%{filter:hue-rotate(270deg) brightness(1.03) saturate(1.08)}to{filter:hue-rotate(360deg) brightness(1.02) saturate(1.05)}}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active{-webkit-box-shadow:0 0 0 30px white inset!important;-webkit-text-fill-color:inherit!important;-webkit-transition:background-color 5000s ease-in-out 0s;transition:background-color 5000s ease-in-out 0s}@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}.page,.screen{min-height:100vh;overflow-y:auto;overflow-x:hidden;display:grid;grid-auto-rows:min-content;gap:18px;justify-items:center;align-content:start;padding:28px 16px calc(80px + var(--safe-bottom));-webkit-overflow-scrolling:touch;overscroll-behavior-x:none;overscroll-behavior-y:contain}.page>.title,.screen>.title,.page-title{font-family:var(--font-primary);font-size:clamp(44px,6vw,52px);font-weight:700;line-height:1.28;color:var(--primary-title);letter-spacing:.2px;margin:0 auto 10px;text-align:center;width:min(var(--page-max),100%);text-shadow:0 2px 4px rgba(79,134,237,.1)}.block-title,.section-title{font-family:var(--font-primary);font-size:20px;font-weight:700;line-height:1.3;color:var(--ink);margin:0 0 16px;padding-bottom:12px;border-bottom:2px solid var(--outline)}p,.text-base{font-family:var(--font-primary);font-size:20px;font-weight:400;line-height:1.7;color:var(--ink)}.tips,.footnote{font-family:var(--font-primary);font-size:18px;font-weight:400;line-height:1.6;color:var(--ink-soft)}.instruction-list{font-family:var(--font-primary);font-size:18px;line-height:1.7;color:var(--ink);margin:0;padding-left:20px}.instruction-list li{margin-bottom:14px}.spacer{height:12px}.page :where(.panel),.screen :where(.panel){width:min(var(--panel-max),92vw);margin:0 auto;background:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--outline);border-radius:18px;box-shadow:0 20px 60px #4f86ed1f,0 8px 32px #00000014,0 1px #ffffffe6 inset;padding:var(--panel-padding)}.block{margin-bottom:var(--block-margin)}.field{display:grid;gap:var(--field-gap);margin-bottom:var(--spacing-md)}.field label{font-family:var(--font-primary);font-size:22px;font-weight:600;color:var(--ink-2)}.field .input{font-family:var(--font-primary);min-height:56px;padding:18px 20px;border:1px solid var(--outline);border-radius:12px;font-size:20px;background:var(--surface);color:var(--ink)}.actions{display:flex;justify-content:flex-end;gap:var(--spacing-md);margin-top:var(--actions-margin);margin-bottom:var(--spacing-lg);flex-wrap:wrap}@media (max-width: 768px){.panel{padding:var(--spacing-lg) var(--spacing-md)}.field label{font-size:20px}.field .input{min-height:56px;padding:18px 20px}.actions{gap:var(--spacing-lg);margin-top:var(--spacing-2xl);margin-bottom:var(--spacing-xl)}}@media (max-width: 480px){.actions{flex-direction:column;gap:var(--spacing-md);margin-bottom:var(--spacing-2xl)}}a.btn,a.btn-primary,a.btn-secondary,button.btn,.btn,.btn-primary,.btn-secondary{text-decoration:none}.btn,.btn-primary,.btn-secondary,:where(.panel) :where(.actions,.buttons,.stack)>:where(button,a,[role=button]){font-family:var(--font-primary);width:100%;min-height:56px;padding:18px 24px;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;text-align:center;font-weight:700;font-size:clamp(22px,2.6vw,26px);line-height:1.2;letter-spacing:.2px;box-shadow:0 10px 22px #11111114;cursor:pointer;outline:none;transition:all .2s ease}.btn,.btn-secondary,:where(.panel) :where(.actions,.buttons,.stack)>:where(button,a,[role=button]){background:var(--secondary-btn);color:var(--secondary-btn-text);border:1.5px solid var(--secondary-btn-border)}.btn-primary,:where(.panel) :where(.actions,.buttons,.stack)>:where(button,a,[role=button]).primary{background:linear-gradient(135deg,var(--primary-btn),var(--primary-btn-hover));color:var(--primary-btn-text);border:1.5px solid var(--primary-btn-border);box-shadow:0 4px 16px #4ecdc440}.btn-primary:hover,:where(.panel) :where(.actions,.buttons,.stack)>:where(button,a,[role=button]).primary:hover{background:linear-gradient(135deg,var(--primary-btn-hover),#3CBCC0);box-shadow:0 6px 20px #4ecdc459;transform:translateY(-1px)}.btn-secondary:hover,:where(.panel) :where(.actions,.buttons,.stack)>:where(button,a,[role=button]):not(.primary):hover{background:var(--secondary-btn-hover);color:#fff;border-color:var(--secondary-btn-border);box-shadow:0 4px 16px #a3a7d440;transform:translateY(-1px)}@media (max-width: 768px){.btn,.btn-primary,.btn-secondary,:where(.panel) :where(.actions,.buttons,.stack)>:where(button,a,[role=button]){min-height:60px;padding:20px 26px;font-size:clamp(21px,2.6vw,24px)}}@media (max-width: 480px){.btn,.btn-primary,.btn-secondary,:where(.panel) :where(.actions,.buttons,.stack)>:where(button,a,[role=button]){min-height:64px;padding:22px 28px;font-size:clamp(22px,2.8vw,26px)}:where(.panel) :where(.actions,.buttons){flex-direction:column;gap:16px}}.home .panel :where(button,a,[role=button]){display:flex;width:100%}.home .panel :where(button,a,[role=button])+:where(button,a,[role=button]){margin-top:12px}.home .panel :where(button,a,[role=button]):first-of-type{border:1.5px solid var(--mint-border);font-size:15px;font-weight:600}.segmented,.mode,.mode-toggle,.chips-toggle{display:inline-flex;gap:6px;padding:4px;background:#fff;border:1.5px solid var(--outline-strong);border-radius:999px;box-shadow:0 2px 8px #4f86ed14}:where(.segmented,.mode,.mode-toggle,.chips-toggle)>:where(button,.btn,.seg-btn,label,.option){font-family:var(--font-primary);padding:10px 18px;border-radius:999px;background:transparent;color:var(--ink-soft);border:0;font-weight:700;cursor:pointer;-webkit-user-select:none;user-select:none;transition:all .2s ease}:where(.segmented,.mode,.mode-toggle,.chips-toggle)>:where(button,.btn,.seg-btn,label,.option):is(.active,.selected,.current,.is-active,.on,[aria-pressed=true],[aria-selected=true]){background:var(--primary-btn);color:var(--primary-btn-text);border:1px solid var(--primary-btn-border);box-shadow:0 2px 8px #4ecdc433}:where(.segmented,.mode,.mode-toggle,.chips-toggle) input[type=radio]{position:absolute;opacity:0;pointer-events:none}:where(.segmented,.mode,.mode-toggle,.chips-toggle) input[type=radio]+:where(label,.seg-btn,.option){font-family:var(--font-primary);padding:10px 18px;border-radius:999px;color:var(--ink-soft);font-weight:700;cursor:pointer;transition:all .2s ease}:where(.segmented,.mode,.mode-toggle,.chips-toggle) input[type=radio]:checked+:where(label,.seg-btn,.option){background:var(--primary-btn);color:var(--primary-btn-text);border:1px solid var(--primary-btn-border);box-shadow:0 2px 8px #4ecdc433}:where(.segmented,.mode,.mode-toggle)[data-active]>:first-child{background:var(--primary-btn);color:var(--primary-btn-text);border:1px solid var(--primary-btn-border)}:where(.segmented,.mode,.mode-toggle)[data-active=timed]>:first-child{background:transparent;color:var(--ink-soft);border:0}:where(.segmented,.mode,.mode-toggle)[data-active=timed]>:nth-child(2){background:var(--primary-btn);color:var(--primary-btn-text);border:1px solid var(--primary-btn-border)}.game-menu .panel{width:min(var(--panel-max),92vw)}.game-menu .grid{display:grid;gap:16px}.game-menu .card{border-radius:16px;border:1.5px solid var(--outline-strong)!important;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;box-shadow:0 4px 12px #4f86ed14}.game-menu .card:nth-child(5n+1){background:var(--cat-1)}.game-menu .card:nth-child(5n+2){background:var(--cat-2)}.game-menu .card:nth-child(5n+3){background:var(--cat-3)}.game-menu .card:nth-child(5n+4){background:var(--cat-4)}.game-menu .card:nth-child(5n){background:var(--cat-5)}.game-menu .card:hover{transform:translateY(-3px);border-color:var(--primary-btn-border);box-shadow:0 8px 24px #4ecdc426,0 4px 12px #4f86ed1a}.game-menu .card.selected{border-color:var(--primary-title)!important;box-shadow:0 8px 24px #4f86ed33,0 4px 12px #0000001a}.game-menu .card .card-title{margin:0;text-align:center;color:var(--secondary-title)!important;font-size:clamp(18px,2.2vw,20px);font-weight:900;line-height:1.4}.game-menu .actions{display:grid;grid-template-columns:1fr 1fr;gap:16px}.game-menu .actions :is(button,a,[role=button]):first-child{background:var(--secondary-btn);color:var(--secondary-btn-text);border:1.5px solid var(--secondary-btn-border)}.game-menu .actions :is(button,a,[role=button]):last-child{background:linear-gradient(135deg,var(--primary-btn),var(--primary-btn-hover));color:var(--primary-btn-text);border:1.5px solid var(--primary-btn-border);box-shadow:0 4px 16px #4ecdc440}.game-menu .actions :is(button,a,[role=button]):last-child:hover{background:linear-gradient(135deg,var(--primary-btn-hover),#3CBCC0);box-shadow:0 6px 20px #4ecdc459;transform:translateY(-1px)}.results .actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}.results .actions :is(button,a,[role=button]){min-width:180px;min-height:48px;padding:14px 18px;border-radius:14px;font-weight:700;font-size:clamp(18px,2.2vw,20px);text-align:center;text-decoration:none;transition:all .2s ease}.results .actions :is(button,a,[role=button]):first-child{background:linear-gradient(135deg,var(--primary-btn),var(--primary-btn-hover));color:var(--primary-btn-text);border:1.5px solid var(--primary-btn-border);box-shadow:0 4px 16px #4ecdc440}.results .actions :is(button,a,[role=button]):last-child{background:var(--secondary-btn);color:var(--secondary-btn-text);border:1.5px solid var(--secondary-btn-border);box-shadow:0 4px 16px #a3a7d426}.chip{background:var(--surface-3);border:1.5px solid var(--outline-strong);color:var(--ink-soft);padding:12px 18px;border-radius:999px;font-size:18px}input,select,button[type=button]{font-size:20px;min-height:52px;border-radius:10px;border:1.5px solid var(--outline-strong);background:var(--surface-2);color:var(--ink);padding:14px 16px;outline:none;transition:all .2s ease}input:focus,select:focus{border-color:var(--primary-btn-border);box-shadow:0 0 0 3px #4ecdc41a}label{font-size:19px;color:var(--ink-label)}:focus-visible{outline:3px solid var(--primary-btn-border);outline-offset:2px}.prompt .text{margin:0;color:var(--question);font-weight:700;font-size:clamp(28px,3.2vw,36px);line-height:1.35}.answers{gap:18px;padding:22px}.answer{display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:16px;min-height:60px;padding:18px 20px;background:var(--surface-2);border:1.5px solid var(--outline);border-radius:12px;color:var(--ink);transition:all .2s ease}.answer .label{font-weight:700;width:40px;height:40px;display:grid;place-items:center;background:#4ecdc41a;border:1.5px solid var(--outline);border-radius:8px;color:var(--primary-btn);font-size:20px}.answer .text{font-size:clamp(20px,2.4vw,24px);font-weight:500;line-height:1.5}.answer.correct{border-color:var(--success-border);background:var(--success-bg);box-shadow:0 4px 12px #4ecdc426}.answer.wrong{border-color:var(--error-border);background:var(--error-bg);box-shadow:0 4px 12px #ff6b6b26}app-timer-bar .timer{height:10px;border-radius:999px;background:var(--timer-track);border:1.5px solid var(--timer-border);overflow:hidden}app-timer-bar .timer .fill{height:100%;background:var(--timer-ok)}app-timer-bar .timer.warn .fill{background:var(--timer-warn)}app-timer-bar .timer.danger .fill{background:var(--timer-danger)}.home .panel{width:min(640px,92vw)}@media (max-width: 1024px){body{background-size:contain;background-position:center center}}@media (max-width: 768px){body{background:radial-gradient(120% 100% at 30% 0%,#a3a7d408,#fff9 40%,#ffffffb3),linear-gradient(135deg,#4f86ed05,#fff9 30%,#4ecdc405 70%,#fff9),url(fondo.jpg);background-attachment:scroll;background-size:contain;background-position:center center;background-repeat:no-repeat}}@media (max-width: 480px){body{background:radial-gradient(120% 100% at 30% 0%,#a3a7d405,#ffffff80 40%,#fff9),linear-gradient(135deg,#4f86ed03,#ffffff80 30%,#4ecdc403 70%,#ffffff80),url(fondo.jpg);background-size:contain;background-position:center center}}