:root{--ink:#e7e2d6;--dim:#7c8890;--accent:#d98a34;--accent-2:#4fb8c4;--font-mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace;--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-serif:"Iowan Old Style", Georgia, serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box;margin:0;padding:0}html,body,#app{overscroll-behavior:none;background:#05070a;width:100%;height:100%;overflow:hidden}body{font-family:var(--font-sans)}#app{position:fixed;inset:0}#stage{grid-template:"cube"1fr/1fr;height:100%;display:grid;position:absolute;inset:0}#cube-pane{grid-area:cube;min-width:0;position:relative;overflow:hidden}#side-pane,#console-pane{display:none}#side-pane{padding-top:max(clamp(100px, 15vw, 128px), calc(env(safe-area-inset-top) + 90px));padding-inline:16px;gap:14px;min-width:0;padding-bottom:16px;overflow-x:hidden}@media (width>=1024px){#stage[data-mode=intermedio]{grid-template-columns:1fr 360px;grid-template-areas:"cube side"}#stage[data-mode=intermedio] #side-pane{background:#080a0deb;border-left:1px solid #e7e2d61f;flex-direction:column;grid-area:side;display:flex;overflow-y:auto}}@media (width>=1100px){#stage[data-mode=avanzado]{grid-template:"cube"1fr"console"/1fr}#stage[data-mode=avanzado] #console-pane{background:#080a0deb;border-top:1px solid #e7e2d61f;grid-area:console;max-height:28vh;display:flex;overflow-y:auto}}@media (width<=1023px){#stage[data-mode=intermedio][data-intermedio-surface]:not([data-intermedio-surface=cube]) #side-pane{z-index:60;background:#080a0df7;flex-direction:column;padding-bottom:64px;display:flex;position:fixed;inset:0;overflow-y:auto}}#chamber-peek-btn{z-index:65;right:16px;bottom:max(16px, calc(env(safe-area-inset-bottom) + 8px));background:var(--accent);color:#1a0f04;min-height:44px;font-family:var(--font-mono);letter-spacing:.02em;cursor:pointer;border:none;border-radius:20px;padding:9px 16px;font-size:11px;font-weight:600;display:none;position:fixed;box-shadow:0 4px 16px #0006}@media (width<=1023px){#stage[data-mode=intermedio][data-intermedio-surface]:not([data-intermedio-surface=cube]) #chamber-peek-btn{display:block}#stage[data-mode=intermedio][data-intermedio-surface]:not([data-intermedio-surface=cube])[data-chamber-peek] #side-pane{display:none}}#transformer-stage-overlay{z-index:11;box-sizing:border-box;background:#05070a;padding:48px;position:absolute;inset:0}#transformer-stage-overlay>*{width:100%;height:100%}#scene{touch-action:none;display:block;position:absolute;inset:0}#scene:focus{outline:none}#scene:focus-visible{outline:none;box-shadow:inset 0 0 0 2px #d98a34e6}#scene-controls{z-index:14;left:50%;bottom:max(18px, env(safe-area-inset-bottom));gap:8px;display:flex;position:absolute;transform:translate(-50%)}.scene-ctl{color:#e9e2d6b8;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0a0e149e;border:1px solid #e9e2d629;border-radius:12px;place-items:center;width:48px;height:48px;font-size:20px;line-height:1;transition:background .18s,color .18s;display:grid}.scene-ctl:hover{color:#e9e2d6f2;background:#10161ed1}.scene-ctl:focus-visible{outline-offset:2px;outline:2px solid #d98a34e6}@media (prefers-reduced-motion:reduce){.scene-ctl{transition:none}}#scene-fallback{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}#hud{pointer-events:none;padding:clamp(16px,3vw,36px);padding-top:max(clamp(16px, 3vw, 36px), env(safe-area-inset-top));padding-bottom:max(clamp(16px, 3vw, 36px), env(safe-area-inset-bottom));padding-left:max(clamp(16px, 3vw, 36px), env(safe-area-inset-left));font-family:var(--font-mono);letter-spacing:.04em;color:var(--ink);text-shadow:0 1px 8px #0009;flex-direction:column;justify-content:space-between;font-size:12px;display:flex;position:absolute;inset:0}#hud-top,#hud-bottom{align-items:center;gap:10px;display:flex}#hud-bottom{color:var(--dim);font-variant-numeric:tabular-nums}.brand{letter-spacing:.14em;color:var(--accent);font-weight:600}.dot{color:var(--dim);opacity:.6}.tag{color:var(--dim)}#hud-top .dot,#backend-tag{opacity:.45;font-size:9px}#stage[data-mode=principiante] #fps,#stage[data-mode=principiante] #hud-bottom .dot{display:none}@media (width<=640px){#backend-tag,#fps,#hud-top .dot,#hud-bottom .dot{display:none}#hud{flex-direction:row;justify-content:flex-start;align-items:center;gap:8px;padding-bottom:0}#hud-bottom{position:static}}.dock-note{font-family:var(--font-mono);color:var(--dim);flex-direction:column;gap:6px;padding:12px 16px;font-size:10.5px;line-height:1.5;display:flex}.dock-note b{color:var(--ink)}.controls-row{flex-wrap:wrap;gap:8px;display:flex}.dock-note button{color:var(--dim);cursor:pointer;background:0 0;border:1px solid #e7e2d633;border-radius:6px;padding:5px 10px;font-family:inherit;font-size:10px}.dock-note button:hover{color:var(--ink);border-color:#e7e2d666}.dock-note button.active{background:var(--accent);color:#1a0f04;border-color:var(--accent);font-weight:600}@media (pointer:coarse){.dock-note button{min-height:44px}}#corpus-drawer{--vx-drawer-trigger-top:calc(50% + 34px)}.corpus-panel{flex-direction:column;gap:12px;padding:0 18px 22px;display:flex}.corpus-intro{color:var(--ink);margin:0;font-size:12.5px;line-height:1.5}.corpus-row{align-items:center;gap:12px;display:flex}.corpus-row input[type=range]{min-height:44px;accent-color:var(--accent,#d98a34);cursor:pointer;flex:1}.corpus-value{min-width:5.5ch;font-family:var(--font-mono);font-variant-numeric:tabular-nums;text-align:right;color:var(--ink);font-size:13px}.corpus-help{color:var(--dim);margin:0;font-size:11.5px;line-height:1.55}@media (width<=640px){#zoom-drawer{display:none}}.surface-panel{flex-direction:column;gap:14px;display:flex}.surface-panel[hidden],#key-nav-hint{display:none}@media (hover:hover) and (pointer:fine) and (width>=1024px){#key-nav-hint{z-index:12;right:max(20px, env(safe-area-inset-right));bottom:max(24px, env(safe-area-inset-bottom));opacity:.18;pointer-events:none;flex-direction:column;align-items:center;gap:3px;transition:opacity .25s;display:flex;position:absolute}#cube-pane.scene-focused #key-nav-hint{opacity:.55}#key-nav-hint:hover{opacity:.85}}.knh-row{gap:3px;display:flex}.knh-key{width:22px;height:22px;color:var(--dim);font-family:var(--font-mono);background:#e7e2d614;border:1px solid #e7e2d638;border-radius:5px;justify-content:center;align-items:center;font-size:10px;font-weight:600;display:flex}.knh-key.active{background:var(--accent);border-color:var(--accent);color:#1a0f04}.continuity-toast{z-index:240;left:50%;bottom:max(96px, calc(env(safe-area-inset-bottom) + 96px));max-width:min(420px,100vw - 32px);font-family:var(--font-mono);color:var(--ink);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0e131af5;border:1px solid #d98a348c;border-radius:10px;flex-direction:column;gap:5px;padding:13px 16px;font-size:12px;line-height:1.55;animation:.32s both continuity-in;display:flex;position:fixed;transform:translate(-50%)}.continuity-toast b{color:var(--accent);font-size:13px}.continuity-toast.out{animation:.38s both continuity-out}@keyframes continuity-in{0%{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%)}}@keyframes continuity-out{0%{opacity:1}to{opacity:0}}@media (prefers-reduced-motion:reduce){.continuity-toast,.continuity-toast.out{animation:none}.continuity-toast.out{opacity:0;transition:opacity .2s linear}}#inv-drawer{--vx-drawer-trigger-top:calc(50% + 34px)}.inv-panel{padding:0 18px 22px}.inv-intro{color:var(--ink);margin:0 0 14px;font-size:12.5px;line-height:1.55}.inv-row{flex-direction:column;gap:8px;display:flex}.inv-start{min-height:44px;color:var(--ink);font-family:var(--font-mono);cursor:pointer;background:#ffffff08;border:1px solid #e7e2d629;border-radius:8px;padding:10px 14px;font-size:12px}.inv-start:hover{border-color:#d98a3499}.inv-start.done{color:var(--dim)}.vx-eccentric{pointer-events:none;z-index:24;position:absolute;inset:0}.vx-eccentric-lines{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.vx-eccentric-line{stroke:#e7e2d657;stroke-width:1px;opacity:0;transition:opacity .14s}.vx-eccentric-label{color:var(--ink);font-family:var(--font-mono);white-space:nowrap;text-overflow:ellipsis;opacity:0;background:#0a0d11eb;border:1px solid #e7e2d629;border-radius:5px;max-width:17ch;padding:3px 7px;font-size:11px;line-height:1.2;transition:opacity .14s;position:absolute;top:0;left:0;overflow:hidden}.vx-anchored{z-index:16;pointer-events:none;font-family:var(--font-mono);letter-spacing:.04em;white-space:nowrap;opacity:0;border-radius:5px;margin:-10px 0 0 -50%;padding:3px 7px;font-size:10px;transition:opacity .25s;position:fixed;top:0;left:0}.vx-anchored.recall-worst{color:#ffd9c2;background:#d55e00d1}.vx-anchored.recall-best{color:#0a0e14;background:#f0e442e0}@media (prefers-reduced-motion:reduce){.vx-anchored{transition:none}}.card-guide{z-index:15;pointer-events:none;opacity:0;width:100%;height:100%;transition:opacity .2s;position:absolute;inset:0;overflow:visible}.card-guide line{stroke:#d98a3480;stroke-width:1px;stroke-dasharray:3 4}@media (prefers-reduced-motion:reduce){.card-guide{transition:none}}
