:root{--bg:#0f0f13;--bg-card:#16181f;--border:#2a2d3a;--text:#e8e9f0;--text-muted:#7a7d8e;--accent:#f0c040;--green:#5ce0a8;--red:#e05c5c;--blue:#5ca8e0;--radius-sm:8px;--radius-md:10px;--radius-lg:14px;--radius-xl:16px;--nav-h:60px;--topbar-h:52px}.light{--bg:#f0f2f5;--bg-card:#fff;--border:#dde1ea;--text:#1c1e2a;--text-muted:#6b7280}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100dvh;font-family:Segoe UI,system-ui,-apple-system,sans-serif;transition:background-color .2s,color .2s;overflow-x:hidden}h1{letter-spacing:-.02em;color:var(--text);font-size:1.75rem;font-weight:700}h2{color:var(--text);font-size:1.2rem;font-weight:700}p{color:var(--text-muted);font-size:.9rem;line-height:1.5}input,textarea{color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-md);font-family:inherit;font-size:.95rem;transition:border-color .15s,background-color .2s}input:focus,textarea:focus{outline:none;border-color:var(--accent)!important}input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none}input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}input[type=number]{appearance:textfield}select{background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;outline:none;padding:8px 12px;font-family:inherit;font-size:.88rem;transition:border-color .15s,background-color .2s}select:focus{border-color:var(--accent)}button{cursor:pointer;font-family:inherit;transition:opacity .15s,transform .1s,background-color .15s,border-color .15s,color .15s}button:disabled{cursor:default}.card{transition:box-shadow .2s,transform .15s,background-color .2s,border-color .2s!important}.card:hover{transform:translateY(-2px);box-shadow:0 4px 24px #0000002e}.card:active{transform:translateY(0)}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:99px}:not(button):not(.card){transition:background-color .2s,border-color .2s,color .2s}.topbar{height:var(--topbar-h);background:var(--bg-card);border-bottom:1px solid var(--border);z-index:1000;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);justify-content:space-between;align-items:center;padding:0 16px;display:flex;position:fixed;top:0;left:0;right:0}.topbar-brand{letter-spacing:-.02em;color:var(--text);font-size:1rem;font-weight:700}.topbar-actions{gap:6px;display:flex}.topbar-btn{background:var(--bg);border:1px solid var(--border);width:34px;height:34px;color:var(--text-muted);cursor:pointer;border-radius:99px;justify-content:center;align-items:center;font-size:1rem;display:flex}.topbar-btn:hover{border-color:var(--accent);color:var(--text)}.navbar{height:var(--nav-h);background:var(--bg-card);border-top:1px solid var(--border);padding-bottom:env(safe-area-inset-bottom);z-index:999;justify-content:space-around;align-items:center;display:flex;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -2px 16px #0000001a}.nav-btn{min-height:48px;color:var(--text-muted);background:0 0;border:none;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:3px;padding:6px 0;font-size:.65rem;font-weight:500;display:flex;transition:color .15s!important}.nav-btn.activo{color:var(--accent)}.nav-btn-icon{font-size:1.35rem;line-height:1}.content{padding:calc(var(--topbar-h) + 20px) 20px calc(var(--nav-h) + 20px);flex-direction:column;flex:1;align-items:center;width:100%;min-height:100dvh;display:flex}.page{width:100%;max-width:500px}@keyframes correctPulse{0%{transform:scale(1);box-shadow:0 0 #5ce0a800}40%{transform:scale(1.012);box-shadow:0 0 0 8px #5ce0a838}to{transform:scale(1);box-shadow:0 0 #5ce0a800}}@keyframes wrongShake{0%,to{transform:translate(0)}20%{transform:translate(-6px)}50%{transform:translate(6px)}75%{transform:translate(-4px)}}.feedback-correcto{animation:.45s correctPulse}.feedback-incorrecto{animation:.38s wrongShake}