{"id":7420,"date":"2026-05-15T10:56:37","date_gmt":"2026-05-15T13:56:37","guid":{"rendered":"https:\/\/fisica2.fica.unsl.edu.ar\/?page_id=7420"},"modified":"2026-05-16T22:21:57","modified_gmt":"2026-05-17T01:21:57","slug":"f1_mrua_simulacion","status":"publish","type":"page","link":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/f1_mrua_simulacion\/","title":{"rendered":"F1_MRUA_simulacion"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"7420\" class=\"elementor elementor-7420\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-83dd554 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"83dd554\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-3aa8101 mi-columna-visible\" data-id=\"3aa8101\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-c203553 elementor-widget elementor-widget-html\" data-id=\"c203553\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ============================================ -->\r\n<!-- LABORATORIO REMOTO MRUA - SPA PARA ELEMENTOR -->\r\n<!-- ============================================ -->\r\n<div id=\"mrua-lab-app\" class=\"mrua-theme-dark\">\r\n  \r\n  <!-- CDN para generaci\u00f3n de PDF -->\r\n  <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jspdf\/2.5.1\/jspdf.umd.min.js\"><\/script>\r\n\r\n  <style>\r\n    \/* ===== VARIABLES & RESET (Scoped) ===== *\/\r\n    #mrua-lab-app {\r\n      --bg-body: #02050a; --bg-card: #080e1e; --bg-surface: #0d1527; --border: #1a2744;\r\n      --text-main: #f8fafc; --text-dim: #e2e8f0; --text-muted: #94a3b8;\r\n      --cyan: #22d3ee; --violet: #8b5cf6; --blue: #3b82f6; --emerald: #10b981; --amber: #f59e0b; --rose: #f43f5e;\r\n      --cyan-g: rgba(34,211,238,0.1); --violet-g: rgba(139,92,246,0.1);\r\n      font-family: 'Inter', system-ui, sans-serif; color: var(--text-main); line-height: 1.5;\r\n      position: relative; overflow: hidden;\r\n    }\r\n    #mrua-lab-app *, #mrua-lab-app *::before, #mrua-lab-app *::after { box-sizing: border-box; margin: 0; padding: 0; }\r\n    #mrua-lab-app input, #mrua-lab-app button, #mrua-lab-app textarea { font-family: inherit; }\r\n\r\n    \/* ===== LOADER ===== *\/\r\n    #mrua-lab-app .mrua-loader { position: fixed; inset: 0; background: var(--bg-body); z-index: 9999; display: flex; flex-direction: column; align-items: center; justify-content: center; transition: opacity 0.6s, visibility 0.6s; }\r\n    #mrua-lab-app .mrua-loader.hide { opacity: 0; visibility: hidden; pointer-events: none; }\r\n    #mrua-lab-app .mrua-spinner { width: 50px; height: 50px; border: 3px solid var(--border); border-top-color: var(--cyan); border-radius: 50%; animation: mrua-spin 0.8s linear infinite; margin-bottom: 16px; }\r\n    @keyframes mrua-spin { to { transform: rotate(360deg); } }\r\n\r\n    \/* ===== LAYOUT & NAVIGATION ===== *\/\r\n    #mrua-lab-app .mrua-nav { position: sticky; top: 0; z-index: 100; background: rgba(2,5,10,0.95); backdrop-filter: blur(12px); border-bottom: 1px solid var(--border); padding: 8px 16px; display: flex; align-items: center; gap: 8px; overflow-x: auto; }\r\n    #mrua-lab-app .mrua-nav-logo { margin-left: auto; flex-shrink: 0; display: flex; align-items: center; }\r\n    #mrua-lab-app .mrua-nav-logo img { height: 36px; width: auto; opacity: 1; transition: opacity 0.2s, transform 0.2s; display: block; border-radius: 6px; }\r\n    #mrua-lab-app .mrua-nav-logo:hover img { opacity: 1; transform: scale(1.05); }\r\n    #mrua-lab-app .mrua-nav-btn { background: transparent; border: none; color: var(--text-muted); padding: 8px 12px; font-size: 0.8rem; font-weight: 600; border-radius: 8px; cursor: pointer; white-space: nowrap; transition: all 0.2s; }\r\n    #mrua-lab-app .mrua-nav-btn:hover { color: var(--text-main); background: var(--cyan-g); }\r\n    #mrua-lab-app .mrua-nav-btn.active { color: #000 !important; background: #22d3ee !important; box-shadow: 0 0 16px rgba(34,211,238,0.5) !important; font-weight: 700 !important; }\r\n    #mrua-lab-app .mrua-progress { height: 3px; background: var(--border); position: relative; width: 100%; }\r\n    #mrua-lab-app .mrua-progress-bar { height: 100%; background: linear-gradient(90deg, var(--cyan), var(--violet)); width: 0%; transition: width 0.4s; }\r\n\r\n    #mrua-lab-app .mrua-view { display: none; padding: 24px 16px; max-width: 1200px; margin: 0 auto; animation: mrua-fadeIn 0.4s ease; }\r\n    #mrua-lab-app .mrua-view.active { display: block; }\r\n    @keyframes mrua-fadeIn { from { opacity: 0; transform: translateY(15px); } to { opacity: 1; transform: translateY(0); } }\r\n\r\n    \/* ===== COMPONENTS & TEXT CONTRAST ===== *\/\r\n    #mrua-lab-app .mrua-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 16px; padding: 24px; margin-bottom: 20px; }\r\n    #mrua-lab-app .mrua-title { font-size: clamp(1.5rem, 4vw, 2.2rem); font-weight: 700; margin-bottom: 8px; color: #FFFFFF !important; text-shadow: 0 2px 10px rgba(0,0,0,0.9); }\r\n    #mrua-lab-app .mrua-subtitle { color: #1e3a5f !important; font-weight: 500; margin-bottom: 24px; font-size: 1.05rem; }\r\n    \r\n    #mrua-lab-app .mrua-badge { display: inline-block; padding: 4px 12px; font-size: 0.7rem; font-weight: 700; border-radius: 20px; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 12px; }\r\n    #mrua-lab-app .mrua-badge.cyan { background: var(--cyan-g); color: var(--cyan); border: 1px solid rgba(34,211,238,0.2); }\r\n    #mrua-lab-app .mrua-badge.violet { background: var(--violet-g); color: var(--violet); border: 1px solid rgba(139,92,246,0.2); }\r\n\r\n    #mrua-lab-app .mrua-btn { padding: 10px 20px; border-radius: 10px; border: none; font-weight: 600; font-size: 0.85rem; cursor: pointer; transition: all 0.2s; display: inline-flex; align-items: center; gap: 6px; text-decoration: none; }\r\n    #mrua-lab-app .mrua-btn:hover { transform: translateY(-2px); filter: brightness(1.1); }\r\n    #mrua-lab-app .mrua-btn.primary { background: linear-gradient(135deg, var(--cyan), var(--blue)); color: #000; box-shadow: 0 4px 14px rgba(34,211,238,0.2); }\r\n    #mrua-lab-app .mrua-btn.secondary { background: var(--bg-surface); color: var(--text-main); border: 1px solid var(--border); }\r\n    #mrua-lab-app .mrua-btn.danger { background: rgba(244,63,94,0.1); color: var(--rose); border: 1px solid rgba(244,63,94,0.2); }\r\n    #mrua-lab-app .mrua-btn.large { width: 100%; justify-content: center; padding: 14px; font-size: 1rem; }\r\n\r\n    \/* ===== FORM & GRID ===== *\/\r\n    #mrua-lab-app .mrua-grid-2 { display: grid; grid-template-columns: 1fr; gap: 16px; }\r\n    @media(min-width: 768px) { .mrua-grid-2 { grid-template-columns: 1fr 1fr; } }\r\n    #mrua-lab-app .mrua-grid-3 { display: grid; grid-template-columns: 1fr; gap: 16px; }\r\n    @media(min-width: 900px) { .mrua-grid-3 { grid-template-columns: 1fr 1fr 1fr; } }\r\n    \r\n    #mrua-lab-app .mrua-input, #mrua-lab-app .mrua-textarea {\r\n      width: 100%; border: 1px solid var(--border); padding: 10px 14px; border-radius: 8px; font-size: 0.9rem; outline: none; transition: all 0.2s; \r\n      background-color: #151f32 !important; color: #e2e8f0 !important; -webkit-text-fill-color: #e2e8f0 !important; \r\n    }\r\n    #mrua-lab-app .mrua-input:focus, #mrua-lab-app .mrua-textarea:focus {\r\n      border-color: var(--cyan) !important; \r\n      background-color: #ffffff !important; color: #000000 !important; -webkit-text-fill-color: #000000 !important; \r\n    }\r\n    #mrua-lab-app .mrua-textarea { min-height: 100px; resize: vertical; }\r\n    #mrua-lab-app .mrua-label { font-size: 0.9rem; font-weight: 600; color: #ffffff; margin-bottom: 6px; display: block; text-shadow: 0 1px 2px rgba(0,0,0,0.8); }\r\n    #mrua-lab-app .mrua-input::placeholder, #mrua-lab-app .mrua-textarea::placeholder { color: #94a3b8 !important; opacity: 1 !important; -webkit-text-fill-color: #94a3b8 !important; }\r\n\r\n    \/* ===== CANVAS ===== *\/\r\n    #mrua-lab-app .mrua-canvas-wrap { position: relative; background: #020510; border-radius: 10px; border: 1px solid var(--border); overflow: hidden; }\r\n    #mrua-lab-app .mrua-canvas-label { position: absolute; top: 8px; left: 12px; font-size: 0.75rem; font-weight: 700; color: #fff; pointer-events: none; z-index: 2; text-transform: uppercase; letter-spacing: 1px; background: rgba(0,0,0,0.7); padding: 3px 8px; border-radius: 4px; }\r\n    #mrua-lab-app .mrua-canvas { width: 100%; height: 220px; display: block; cursor: crosshair; touch-action: none; }\r\n    #mrua-lab-app .mrua-canvas-controls { display: flex; gap: 8px; margin-top: 8px; }\r\n    #mrua-lab-app .mrua-sim-canvas { width: 100%; height: 280px; background: #020408; border-radius: 12px; display: block; margin-bottom: 16px; border: 1px solid var(--border); }\r\n\r\n    \/* ===== DATA ===== *\/\r\n    #mrua-lab-app .mrua-data-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 16px; }\r\n    #mrua-lab-app .mrua-data-item { background: var(--bg-surface); padding: 8px; border-radius: 8px; text-align: center; border: 1px solid var(--border); }\r\n    #mrua-lab-app .mrua-data-item span { display: block; font-size: 0.65rem; text-transform: uppercase; letter-spacing: 1px; color: var(--text-muted); }\r\n    #mrua-lab-app .mrua-data-item strong { font-size: 1.1rem; font-variant-numeric: tabular-nums; }\r\n\r\n    \/* ===== ANALYSIS LABELS ===== *\/\r\n    #mrua-lab-app .mrua-compare-header { display: flex; justify-content: space-between; margin-bottom: 12px; }\r\n    #mrua-lab-app .mrua-compare-label { font-size: 0.8rem; font-weight: 700; padding: 4px 10px; border-radius: 6px; }\r\n    #mrua-lab-app .mrua-compare-label.pred { background: var(--violet-g); color: var(--violet); border: 1px solid rgba(139,92,246,0.3); }\r\n\r\n    \/* ===== MODAL ===== *\/\r\n    #mrua-lab-app .mrua-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.9); z-index: 900; display: none; align-items: center; justify-content: center; padding: 20px; }\r\n    #mrua-lab-app .mrua-modal-overlay.show { display: flex; }\r\n    #mrua-lab-app .mrua-modal { background: var(--bg-card); border: 1px solid var(--border); border-radius: 16px; width: 100%; max-width: 800px; height: 80vh; display: flex; flex-direction: column; }\r\n    #mrua-lab-app .mrua-modal-head { padding: 16px; border-bottom: 1px solid var(--border); display: flex; justify-content: space-between; align-items: center; }\r\n    #mrua-lab-app .mrua-modal-body { flex: 1; padding: 16px; overflow: auto; }\r\n    #mrua-lab-app .mrua-modal-body iframe { width: 100%; height: 100%; border: none; }\r\n\r\n    \/* ===== BACK TO TOP ===== *\/\r\n    #mrua-lab-app .mrua-back-top { position: fixed; bottom: 24px; right: 24px; width: 40px; height: 40px; border-radius: 50%; background: var(--cyan); color: #000; display: none; align-items: center; justify-content: center; cursor: pointer; z-index: 800; box-shadow: 0 4px 12px rgba(34,211,238,0.3); border: none; font-size: 1.2rem; }\r\n    #mrua-lab-app .mrua-back-top.show { display: flex; }\r\n\r\n    \/* ===== ALERTS ===== *\/\r\n    #mrua-lab-app .mrua-alert { padding: 12px; border-radius: 10px; font-size: 0.85rem; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }\r\n    #mrua-lab-app .mrua-alert.warn { background: rgba(245,158,11,0.15); border: 1px solid rgba(245,158,11,0.3); color: #fbbf24; }\r\n\r\n    \/* ===== LAZY YOUTUBE EMBED ===== *\/\r\n    #mrua-lab-app .yt-lazy { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; border-radius: 10px; border: 1px solid var(--border); background: #000; cursor: pointer; }\r\n    #mrua-lab-app .yt-lazy img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; display: block; transition: opacity 0.3s; }\r\n    #mrua-lab-app .yt-lazy:hover img { opacity: 0.85; }\r\n    #mrua-lab-app .yt-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 68px; height: 48px; background: #ff0000; border-radius: 12px; display: flex; align-items: center; justify-content: center; transition: transform 0.2s, background 0.2s; pointer-events: none; box-shadow: 0 4px 20px rgba(0,0,0,0.5); }\r\n    #mrua-lab-app .yt-lazy:hover .yt-play { transform: translate(-50%, -50%) scale(1.1); background: #cc0000; }\r\n    #mrua-lab-app .yt-play svg { width: 24px; height: 24px; fill: white; margin-left: 4px; }\r\n    #mrua-lab-app .yt-lazy iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }\r\n  <\/style>\r\n\r\n  <!-- LOADER -->\r\n  <div class=\"mrua-loader\" id=\"mrua-loader\">\r\n    <div class=\"mrua-spinner\"><\/div>\r\n    <div style=\"color: var(--text-dim); font-size: 0.9rem;\">Iniciando Laboratorio...<\/div>\r\n  <\/div>\r\n\r\n  <!-- NAVIGATION -->\r\n  <nav class=\"mrua-nav\" id=\"mrua-nav\">\r\n    <button class=\"mrua-nav-btn active\" data-view=\"welcome\">Inicio<\/button>\r\n    <button class=\"mrua-nav-btn\" data-view=\"guide\">Gu\u00eda<\/button>\r\n    <button class=\"mrua-nav-btn\" data-view=\"prediction\">Predicci\u00f3n<\/button>\r\n    <button class=\"mrua-nav-btn\" data-view=\"simulation\">Simulaci\u00f3n<\/button>\r\n    <button class=\"mrua-nav-btn\" data-view=\"analysis\">An\u00e1lisis<\/button>\r\n    <button class=\"mrua-nav-btn\" data-view=\"quiz\">Cuestionario<\/button>\r\n    <a href=\"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/FISAR_SIM\/\" target=\"_blank\" class=\"mrua-nav-logo\" title=\"FISAR Sim - Simulaciones Interactivas\">\r\n      <img decoding=\"async\" src=\"data:image\/png;base64,\/9j\/4AAQSkZJRgABAQAAAQABAAD\/4gHYSUNDX1BST0ZJTEUAAQEAAAHIAAAAAAQwAABtbnRyUkdCIFhZWiAH4AABAAEAAAAAAABhY3NwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAA9tYAAQAAAADTLQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlkZXNjAAAA8AAAACRyWFlaAAABFAAAABRnWFlaAAABKAAAABRiWFlaAAABPAAAABR3dHB0AAABUAAAABRyVFJDAAABZAAAAChnVFJDAAABZAAAAChiVFJDAAABZAAAAChjcHJ0AAABjAAAADxtbHVjAAAAAAAAAAEAAAAMZW5VUwAAAAgAAAAcAHMAUgBHAEJYWVogAAAAAAAAb6IAADj1AAADkFhZWiAAAAAAAABimQAAt4UAABjaWFlaIAAAAAAAACSgAAAPhAAAts9YWVogAAAAAAAA9tYAAQAAAADTLXBhcmEAAAAAAAQAAAACZmYAAPKnAAANWQAAE9AAAApbAAAAAAAAAABtbHVjAAAAAAAAAAEAAAAMZW5VUwAAACAAAAAcAEcAbwBvAGcAbABlACAASQBuAGMALgAgADIAMAAxADb\/2wBDAAUDBAQEAwUEBAQFBQUGBwwIBwcHBw8LCwkMEQ8SEhEPERETFhwXExQaFRERGCEYGh0dHx8fExciJCIeJBweHx7\/2wBDAQUFBQcGBw4ICA4eFBEUHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh7\/wAARCACOASwDASIAAhEBAxEB\/8QAHQABAAEEAwEAAAAAAAAAAAAAAAQFBgcIAQIDCf\/EAFAQAAEDAwEEBgYDCgsGBwAAAAECAwQABREGBxIhMQgTFEFRYSJVcYGT0TKRsxUjNTZScnShsbIWM0Jic3WCkpTS4RgkN1aDwSUnNENU0\/H\/xAAbAQEAAgMBAQAAAAAAAAAAAAAAAgQBAwUGB\/\/EADMRAAIBAwIEAwYGAgMAAAAAAAABAgMEEQUxEhMhQVFhcSKBkaGx0QYUI8Hh8BUyJEJS\/9oADAMBAAIRAxEAPwDcqlKUApSlAKUpQClKUApSlAKUpQClKUApSlAKUpQClKUApSlAKUpQClKUApSujrrbKCt1xDaRzKjgVhyUVlhLOx3pVEnantUbIQ6qQrwaGR9Z4VQ5ur5jmREYbYHir0lfKuBe\/ijTLTpKpxPwj1\/j5l6jptzV2jhefQvauasbTyZ17ugXNkuusMELWkn0Se4Y5f8A5V81Z0fVXqlJ1403GGcLO78Xjt4bvua7u2\/LSUHLL7+QpSldcqilKUApSlAKUpQClKUApSlAKUpQClKUApSlAKUpQClKUApSlAKUpQClKUApSlAKUpQHChlJGSMjuNWhqXTyw27OTcFrSgbxEhRJA8Af+1XepQSkqUQABkk91WBqq9m5P9njkiK2eB\/LPj7PCvJ\/i+rYws\/+Ssyf+qy08+Pou+TqaVGtKt+m8LuUPFdkIK1BKQSonAA7zVTtVklzoj0pKShtCCUZHFwjuHzqfoe2F+YZzqfvTPBGe9f+nyr5jZaNdXValT4WlU2fkt37vmejrXlOnCcs54fqXPp63i22xtggdafSdI71H5cqqNKV9ztrenbUY0aaxGKwjxdSpKpJzluxSlK3kBSlKAUpSgFKUoBSlKAUpSgFKUoBSujrjbLanXXEtoSMqUo4AHmaoq9ZaQQ71KtVWNLnLdNwaz9W9UlGUtkRlOMd2V2leEOXFmsB+HJZktHktpYWk+8V71HYluKUpQClKUApSlAKUpQClKUApSlAK4UQlJUogADJJ7q6vONstKddWlCEjKlKOABVjakv7lxWYkPeTGzjgPScPy8q42s63b6VR46nWT2j3f8AHmW7SzncyxHbuzvqq\/mYVQ4aiI4PprH\/ALn+lcaZ06uYUy5qSiPzSnkXPkKnab0yE7su5Iyrmhk93mr5VddeY0zQLjU6\/wDkNV77Q8u2V2Xl37+fRuL6nbw5Ft73\/fr8DhCEoQlCEhKUjAAHACukWO1GZDTCAhAJOB5nNetK97y45Tx1XRf33I4nE9hSlKmYFKUoBSlKAUpSgFKUoD5xT5s37oSQJcjAdVw6w+J86r8fR+0Z+O2\/H03qVxp1IWhaIrxSpJGQQccRiranfhCT\/Sq\/aa+hWh\/xLsf9XR\/s0162\/u3axi0s5PG6fZK7lJSk1g0cVonaX\/ytqj\/BvfKtrtjcO6W3YBFi3eNLiTmokwuNSUKQ4nLjpGQeI4EH2Vk6qfqT8Xrl+iO\/uGuJc6hK5iouKXXJ3rXTY2snNSb6YPnUmdMA\/wDVv\/ENfQfVGoImltEy9QzwVMwoocKQcFasAJSD4lRA99fPEDhW8HSHt0q5bC7uzDQtbjTDL5QnmUNuIUr6kgn3V0tVhGdSlGWzf2OVpE5QpVpR3S+5qdr3XeqtfXguXSY+8hxzEaAznqm8n0UpQOZ7snJNVmJsO2oy4aZTelnEJUMpQ7LYbWfalSwR7Dg1amgr6NM6xtV\/VFTKTBkpeUyTjfA5gHuPgfHFblaW21bOr+2jdv7VufVzYnjqSk+G8fQPuUasXlatapKhDp6fYr2VChduTuKmJev3NTm9KbTNH3uMGbXfbPMdeQ008zvJQpaiAlPWI9E5J5Zrey0syY1qiR5klUqS0whDz6gAXVhIClEDhxOTXpEkxpkdEiI+1IZWMpcaWFJUPIjga9q4N5eyuccUUmj0VjYRtM8Mm0yh691AxpXRt11BI3SmFHU4hJP018kJ96iB760Cm368y5bsl66TFOvLUtauuUMqJyTzrY\/pn6o6m1WrSEdzC5K+2ygD\/ITlKAfIq3j\/AGBWLtgmzca9\/hGt9OG4luUiMo8AJS\/4s+wbpz7RXV02ELe3dap3+mxx9UnO5uVQp9vruZE6HOtXnJly0fcpbjqnR2yEXVlRyAA4gE+W6oDyVWy9fPDR97m6P1pb7y0haJFulBTjR4EgHC0H2jeT76+g1qnRrnbItyhOB2NKZQ8ysfykKAIP1Gqer2\/LqqotpfUvaLc8yi6ct4\/Qwd0zpcqLpKxKiyHWSqcsKLaykkdWfCtZ7U7qe6yuy2pd3nSAkr6qMXHF7o5nCcnHEVsj02PxRsH6ev7M1jnodn\/zdd\/qp799ur9lU5VjzMZxn6nNv6fN1Dl5xnH0LIVA2j20GQuHquGE8S4WpDYHvwKr+idt+vtMy2+vurt5hgjrI09RcJHk4fSSfeR5Gt361G6YlitNr1vbZ9ujtR37hFU5LQ2kAKUlWA4R4kHBPfu1C2vad5PlVKa6my6sKljT5tOo+hszs+1ZbNa6Wi3+1KIaeG640o+ky4PpIV5j9YIPfVwVrZ0IZchUfVMEkmMhcZ1I7gtQcB+sJT9VbJ1xbyiqFaUFsju2Vd16Eaj3YqPcJsaBGVIkuBCB9ZPgB3moF+vsW1pKP42QRwbB5eZ8Kt2NbbpqB8TLg4WY\/MEjHD+aP+\/7a8pqWu8up+Uso8yt4LaPnJ\/t8cHZt7Lijzaz4YfN+h4XC4XHUcwRYrSgyDlLY5fnKNXJYrFFtLXaZCkLfSnKnFcEoHfjP7aqVugxYEcMxWghPee9XmT31gnpP6pni5xtKxXlsxAwJEoJOOtUokJSfIAZx4nyFQ0j8N8Ff83ey5lZ9+0fRf3ySM3eo5hy6K4YfN+pky67U9A219TEjUcdbiTgiO2t4fWhJH669bRtL0LdHUtRNSRA4rgEvhTOT4emBWKNnuw9i9adh3i93d9jtjSXmmIyE5ShQyklSs8SMHGOFT750e2epUuyahcDgHotzGgQr+0nGP7pr1jjTXTJy05+BnXfR1fWb6dzG9vZ4Y8c1ZentqOj77qIWK3znVSVkpZWtopbeI7kn3d4Ge6qvo3Tzdj0RA068Q6GYvVPnJwpSgSvHlknHlVh6M2OWOwaxYvSL+5NTGcLkaKUJSUq7t5QPpY8gK1pR65JNy6YMt0ro6620AXHEIB5bysUW60hovKcQlsDJWVADHjmoEjvSvCJMiTElUSUxISngS04FAfVXeQ8zHaLr7rbTaea1qCQPeaA9KV4RJcWW2XIklmQgHBU0sKH1ivegFKUoBSlKA+blw\/CMn+mV+01ckex7R3IzS41n1WthSAW1NxpBSU44EYGMYq2p5zcJP8ASq\/aa+heh\/xKsf8AV0f7NNetv7x20YtRzk8Zp1krqUk5YwabaDsm0ZvXFiXLtGqkR03KOXVOxnwgIDiclRIxjHPNbpak\/F25fojv7hqoVT9Sfi7cv0R39w15+6u3cyi2sYPSWlkrWEkpZyfONPKvpLESlcBlKgFJLSQQRkEYr5tpHCvord7tFsOlJN5mqxHhQy+5x5hKc4HmeXvrqa2m+Wl5\/scnQWlzG\/L9zDO0Xo3We7TXrjpO4izvOEqVEdQVx8n8kjigeXpDwArD2p9hW0iyNrdFmRc2Uc3IDodPuQcLPuTWwukNv2z6+MoE6c5ZJRHpNTEHcz34cTlOPbj2Vdz+0bQLMUyV6ysXVgZ9Gc2on2JByfqqvC8vrf2JRz6r9yzUsbC4XHGSXo\/2NGtLap1Roy7F+y3KZbZDa8Os5ISojmlbZ4H2EVu5sd1u1rzQca\/qaRHkJUpiY2k+ih1GM48iCFDwBrT\/AG76ls2rNplyvNibxCcCEJcKNwvFKQC5g8RnHfxwBmsjaGusrQ3RVvFwWpTMm\/XBxm354EhaEtqWPYG3CD5CruoUFXpQlw4k2vmUNOuHb1pxUswSfy7+8xhtj1SdX7RrvekOFcZTxai+AZR6KMe0De9pNbPdGeJZ9M7K4Ik3OA3NuKjNfSqQgKG9gIB48MICeHiTWommLFdtS3pizWOEqZPf3uraSpKc7oKjxUQBwB5mr4Gw3ar\/AMqL\/wAdH\/8Asrfd0aUqcaLmopGiyr1oVZV1Tcm\/X7HfpL2WFatqM2XbH470O6JExJZcCglashwHHfvAq\/tCs3dEDVn3X0K\/pyU7vSrM5hvJ4lhZJT9St4eQ3awBftkO0ayWiTdrnppxiFFbLj7glMr3EjmcJWSfcK7bAdXfwO2mW6a65uQpauxzOOAG1kDeP5qt1XuNRuKMa9pwQlxOPf0\/glb15W95zJx4VLs\/P+TNvTX\/ABRsH6ev7M1gLZRraRs\/1Qq\/RIDM5xUZcfq3VlIwopOcj82s+dNj8UbB+nr+zNYg6N+lrHrHaG5aNQxFS4YgOvBCXVt+mFIAOUkHvNa7JwjYZqLK65+Jtv4zlqGKbxLpj4F7P9KO\/lpQZ0vbEOEeipby1AHzHDP11h7V+ptQ681ObldXFzJ7+6yy0y3wSM+i2hI7snlzJPeTWwu2TYFp5jRki46Htz0e5QsvLZMhx3tDYHpJAWThQ5jHPBHeKsbo96J1tbNXxNSswkRm2gUqZkNby3UKGCN3mj84kEeBFVKmqaZYUXXbUXsk\/wDZvwS6t+42zsdRuq0aE8teK2Xm30XxM19HbQ7mz7QTjt63I9yuLgkSkqI+8pAwhsnxAyT5qI7qumffZtyeMKxMrPcp8jGPZnl7TVK1RcbPZGBcte6hjQ0Y3m4oX6SvJKBlSv7IPtqLbbxq\/VbaY+lLMrSliI\/ClxZBkujxZjnln8pfDjyNeKrU9U1qTnL9Ck93\/wB36f8An5yPV0pWenRVKH6k12Wy9fH34RUnm7Lpx5g3h9U+7Sj\/ALtCZSXHXlfzUcyPFSsJHMkc6uS3M3CViVdkoY724bat5LfgVq\/lq9nojuzgKqNpXStq06HXYqXpM+RjtU+U4XZMg\/zlnu8EjCR3AVXa6Flp9pp9PlWscLu+79f78NiFWtWuJcdZ+7wFYS6Rmg7pdpbGp7NHXLU0wGZTDYysJBJStI5nmQQOPAedZtrrvJ3gjeG8RkDPHFW4ScXlEJR4lg1Y0Ntb1LpOE3anWWbhCY9FDMgFK2x+SFDkPIg4rKeltuWlrm83HurEizvLON9z74zn88cR7SAPOr7v+k9NX7Ju9khSlngXFNgOf3xhX66wFt32cWjSMaJdrK+6iPJeLKorq97cO6SCknjjgeee7jW9OnUeMYZqalBbmyiXG3oweZcS42tG8haTkKBHAg94rU\/YQAdrlmP8577FdZc6MtylzdASoklanEQpammCo5wgpSrd9xJ+usSbCP8Ai3Z\/z3vsV0hHhUkZk8uLMjdK9IVZrFn\/AOQ7+6mrE0ppjXW0qyx4qLghmzWtAjsmQtSW8jjgJSDvKAI4nkMDNX50r\/wPYv0h391NXD0bDnZex+lPfvVhS4aaaMNZngwNf7NqfZlqpgGUI0xKQ6xIjLJQ4nOO8DIyMFJH6quuLpfX215Tmopk2NGhFZTGS+tQaGOBDaADwHIk8z41V+lcP\/GLF+ju\/vJrJ2w\/hsqsX9Cv7RdSlN8Cl3MKK4nE1tkM6n2X60DYf7POj7q8tLJafbPjy3kniMEfURW3Vlnt3SzwrmyN1uXHQ+kHuCkg4\/XWufSl\/wCIMP8Aqxv7Rys8bN+Gz3T39WR\/s01Cr1ipEodG0XBSlK0G0UpSgNLpvR\/2muTH3G7RFKFuKUn\/AH5rkTw762\/0vEegaZtcGSkJfjw2WnADnCkoAPH2iqlSrl1e1LlJTx0KVpYUrVtwb6+IqJeWHJNomxmgC47HcQgE4ySkgVLpVRPDyXGsrBpT\/s+7TwPwRE\/xzXzrbXWelomrdGv6auT8mOxIbQlxcdYSsFJChzBBGQOHfVw0q5cX9Wu4uXRx2wUbbTqNupRjlqW+TVDU3Rj1NGeUvT97t1xY7kyAphz2cApJ9uRVsjo+bT+s3PuRECfy+3NY\/bn9Vbq0qxHWLmKw8P3FeeiWsnlZXv8AuaybP+jNJE1qZrW6MdnQQowoSlKLnkpwgbo8d0H2iq90idnWs9XSrLadKWqKiw2qNutI7QhodYeGAknklKUge01n2laXqNd1FUfVrbwN60ygqTpR6J7+LMC9GnZLfNF325XzVEVhmSWEx4aW3kuYCjlauHI+ike81nqlKrXFedefHPcs21vC3p8uGx4T4sedBfhSm0ux5DamnUK5KSoYIPuNadXXo77Q2rnKbt8GJIiIeWlh0y0JLjYJ3VEE8CRjhW5lK22t7Uts8Hc1XdjSu8cfbwMC7UtBa+1psp0naHYUf7uQHN2cXJSN3CUFAXvZ4lQAJx3k02EbFtR6F1KvUFyuttU8uKuOGGkrcA3ik5JO7y3eXnWeqVCpdVp0nSUsRfh5+e\/wEbCiqqqtZksb+RTHLSiSQq4SXpQHHq87jf8AdHP3k1jzbPb9rDhjQtmq4MW2uNESC11bT6F57lLOMEYwUgEEHjyrK1Kp2lCja1ObCCcvF9W\/Vvq\/iW7jjrw4JSaXl0Nc9hezzaBpvaE5eNZaei3JqWjC58iW0+\/GcHELSSoq48jjjxHhg7GUpVu4uJV5cUl8DRbW0beHBF59RSlK0FgVhTbtpnXk\/U8XUGnUuux4kcNsiG8UvtEnKjjgTk4+jngBwrNdKlCXC8mJLKwauI2i7VrQ32aY9OSU8AJdvTvj3lGT76prsDaVtIujJmR7hMCThDrzXUx2QeZ5BI93E47621pW3nJbRNfLzuy2NnGlGdHaSZs7bgeeyXZDoGA44rmQPAAADyFYF2LWG+Q9qdolS7Lco7CFvbzjsVaUpy0sDJIwK2hpUFUaz5knDOPIw90nbZcblabKm3W+XMUh90rDDKnCkFKeeAcVXuj3BmW\/ZuxHnRH4rwkvKLbzZQoAq4HB41kOlY4\/Z4TPD7WTBPSetN1uN2sq7dbJsxKGHQssMKcCTvJ54BxWRtjMeTE2ZWWPLjux30NLC23UFKk\/fFcweIq8KUc8xUQo4lk136SdlvFx13Eet9pny2hbkIK2I61pB6xzhkDnxFZs0Ay7H0LYmH21tOt25hK0LSQpJDYBBB5Gq5Skp5il4BRw8ilKVAkKUpQEMypfdbXj\/wBRHzrjtUv1Y98Rv\/NU2lAQ+1S\/Vj3xEfOuO1S\/Vj3xEfOptKAh9ql+rHviI+dcdql+rHviI+dTaUBDMqX6se+Ij51wZUv1Y98RHzqbSgIQlS\/Vjw\/6iPnTtUv1Y98RHzqbSgIfapfq174iPnXHapfqx74iPnU2lAQu1TPVj3xW\/wDNXPapfqx74iPnUylAQu1TPVj3xW\/81O1S\/Vj3xEfOptKAhdql+rHviI+dO1S\/Vj3xEfOptKAhdql+rHvio+dO1S\/Vj3xEfOptKAhdqmeq3vit\/OglS\/Vj3xEfOptKAhdql+rHviI+dO1S\/Vj3xEfOptKAhdqmerHvio+dO1TPVj3xW\/8ANU2lAQu1S\/Vj3xEfOnapfqx74qPnU2lAQu1TPVj3xUfOue1S\/Vj3xEfOplKAh9ql+rHviI+dcdql+rHviI+dTaUBD7VL9WPfER86lIJUhKlJKCRkpJ5eVdqUApSlAKUpQClKUAq3NpLl+b0XcF6aS4bkEp3OqALgTvDfKAeat3OP1cauOoV6Rc129Ys78VmZkFCpLZW2QDxBAIPEcM91ZW5h7Fi6AlaYk3hlFv1bqF24oSS7b7nKWFrO6c7zaxxI5+j4V1tmr7fYNMSrg1CusxtWonYBbck9c6VleCUZ\/k8OCfPnVRXprUd61RaLvqJ6zx27S4p1lEBK1OOqIxhS143U9+BnNRF6DuBsrcETIoWnUwvBV6WC31m\/u8vpY91bHw9yPUkfw6u6L2qwP6LmouzjHaIrCZjSkON5IKluA4Rgjz7scxXdO0JtGmZN1lWd+PKh3JNtlQy8lRbdKkjIWOCh6QOaq71ikL2hx9SB1oR2rYuGW+O+VKcCgeWMYHjVv3HQM2ZZdSQxPjtP3K7i5RF7pUlBSUFKVj2o448awuFjqXNdNQNQdWWfT6oy1uXRt9aXQrAb6pIJBHfnNWxsgky2dmapDMV24SUzZe4yHEpUv7+oY3lHA9\/hUyPp3U83Wtm1HfJtqAtzT7fZoiF4++JA3gpXEknmOGABz41SDoTUw0dcNLM3S3tRVSlSIryesC3Ap3rC26BySQSDumnTGB1zkuG0avecvrtmvtoNokpiKmNq7Uh9tbSThWVJxukeBFeentXXe+PR5UHSMv7iSHN1ue5LaSoozjrOqJ3t335x3VSLNoCYzqZu6SI2n4MRyA9CkxLbHU2N1YHpBWPSV5kDA8aqWkbNrLT8eDZBNssuzxCEJfWhxMksg8E7o9Hexwzn3Uaj2CyQrXqu22W0XqYmPcpDp1C9AZjrkdc4\/IJACW84CUnuHdg86q9n1ZLcv7Vjv1gfss2Syt6JvSEPtvhH0khSeSgDnBFUhzQExy1z0C4MMz\/4RuXy3uhBUhtRI3UrHDPDIOPHvqoQdPaguGq4F\/1NKtqTbWnURI0BKykrcG6palL48hgAD3+J8IWSmN7TJDmnEamTpOaLIk4kylSWwWxv7pKUc1gHv4d\/hVZvesVx74uy2a1G6S2WEvyCqUiO20lX0RvK5qI44A5d9U5OiJw2POaKMqN2tTSkB70ur4ulfhnl5V56j0I+\/qRd9gRLBcXJEdtmRHu8YuICkDAW2oAlJxwIxxxT2R7R7u7RojlstL0C2uvzbm87HRFefQyGnGv4xK3DkDB5YznPCrsskqdMgh642025\/eILPXpdGO4hSeBB9xq15+mbkvTMS1sWXRzgClrkxXIi0Rt4n0VNgZKSBzJHHyqfs405K0zZX4cuSy4p6Ut9DLG91MZKsYbb3iTujGePieFYfDjoZWclvRtUSLNN2hXOauRNjWqSyWo5dOEpLScpTngnic1U42uJX3VtLNw0zMgQLuvq4Utx9ClFZTvJC2xxRkeftxUW86GnzbfraM3LjJVqFbao5VvYb3UBJ3uHl3Zqsag05JuJ0z1T7KPuRNbkO72fTSlBSQnhzye+svhHUo2idU6nuGor1FulmKYUWaWy72lrENIbCt0gcV+ORnn5Ub2lJVEReTYnkaeW8GxPVKb6zdK9wOFn6W5nzzjjiqhb9PXu36nu7rDltfs13f66Ql0rS+3lG6UpwN08hzqgWTZ3OtCGrcm1aNuUNpz0ZkyAe1FvezhQAwpQHDeyO7hWfZZjqXCdYyHtYT9NW3T8qa9AcYEh8PIQ0htxIVvknvGeCRknB5V46k1nctPrcl3PSzzVnaeDbkwTWlLCSsJC+qHEpyR35x3VUdP6fk27Wepb268ypi7GN1KE53kdU2Une4Y4k8MVYl02W3ibap9vcc0+8+88p1F1kMLXNX6e8EqUfoeGQTw4Y45rC4c9Q8l6XjVkpvUDtisFievM2M0l2XiQhhtgK+iCpXNRHHAFUbU2q9Vw9U6Yhw9PupRPbeU9EVJZCnVJbyUb3Hd3OeQcKzip0rTuo7fqmZqHTsu2KcuTLSJ0WalYRvtp3UrQpPHkcYI\/09dR2HUM+Rp68xZNs+7FpLhcQ4laY7vWI3VYIyoY7udFgz1IdxvPYtayHjbLg5c2dOdtVFTNy1gOcWwkDBXkH0u+qm5rOEu3adlQo65bl+cQmMylYBSkp3lqV5IHOu0Ow3I68Z1NNdifgVMF5poq\/jet3yU5H0fbxql6P0I7ZNVv3F6Y29b46XUWiMkHMVLy99zOeHgBjup7I6km\/ayuNiWuVdNMvMWlD4aXLExpSwkr3Qvqxx3SSO\/ODyrvctYyxqeZYLLYvunJgpbVI35rcf6ad4BAVxXw7+A86s+ZstvUmxy7W67p919b6nk3V6Otcx775vAKUfoeGQTwGMcc1cOu9JXbUjjqF23S7wW2ENS32nBJjnd4lKk88KyRxHdWcRMZZfbClrYbW42WlqSCpBIJSccRkcOFd6h2WI5b7PDgvSnJbkdhDSn1\/ScKUgFR8zjNTK1ExSlKAUpSgFKUoBSlKAUpSgFKUoBSlKAUpSgFKUoBSlKAUpSgFKUoBSlKAUpSgFKUoBSlKAUpSgFKUoBSlKAUpSgFKUoD\/9k=\" alt=\"FISAR Sim\">\r\n    <\/a>\r\n  <\/nav>\r\n  <div class=\"mrua-progress\"><div class=\"mrua-progress-bar\" id=\"mrua-prog-bar\"><\/div><\/div>\r\n\r\n  <!-- WELCOME -->\r\n  <div class=\"mrua-view active\" id=\"view-welcome\">\r\n    <div style=\"text-align: center; margin-bottom: 20px;\">\r\n      <div class=\"mrua-badge cyan\">Laboratorio Remoto de F\u00edsica<\/div>\r\n      <h1 class=\"mrua-title\">Movimiento Rectil\u00edneo<br>Uniformemente Acelerado<\/h1>\r\n      <p class=\"mrua-subtitle\">Comprensi\u00f3n de gr\u00e1ficas en cinem\u00e1tica mediante la simulaci\u00f3n de un cuerpo descendiendo un plano inclinado.<\/p>\r\n    <\/div>\r\n    <div style=\"max-width: 800px; margin: 0 auto 20px;\"><div class=\"yt-lazy\" data-id=\"PiASU3kB_sE\"><img decoding=\"async\" src=\"https:\/\/img.youtube.com\/vi\/PiASU3kB_sE\/maxresdefault.jpg\" alt=\"Ver video\" loading=\"lazy\" onerror=\"this.src='https:\/\/img.youtube.com\/vi\/PiASU3kB_sE\/hqdefault.jpg'\"><div class=\"yt-play\"><svg viewBox=\"0 0 24 24\"><polygon points=\"5,3 19,12 5,21\"\/><\/svg><\/div><\/div><\/div>\r\n    <button class=\"mrua-btn primary large\" onclick=\"mrua.navTo('guide')\">Comenzar Experiencia \u2192<\/button>\r\n  <\/div>\r\n\r\n  <!-- GUIDE -->\r\n  <div class=\"mrua-view\" id=\"view-guide\">\r\n    <div class=\"mrua-badge violet\">Gu\u00eda de Laboratorio<\/div>\r\n    <h2 class=\"mrua-title\">Fundamentos del MRUA<\/h2>\r\n    <p class=\"mrua-subtitle\">Le\u00e9 atentamente los objetivos y el procedimiento antes de comenzar.<\/p>\r\n    <div class=\"mrua-grid-2\">\r\n      <div class=\"mrua-card\" style=\"border-left: 3px solid var(--cyan);\">\r\n        <h3 style=\"font-size: 1.1rem; margin-bottom: 8px; color: var(--cyan);\">\ud83c\udfaf Objetivo<\/h3>\r\n        <p style=\"font-size: 0.95rem; color: var(--text-dim);\">Facilitar la comprensi\u00f3n y an\u00e1lisis de fen\u00f3menos f\u00edsicos relacionados con el movimiento de un cuerpo descendiendo un plano mediante el uso de gr\u00e1ficas y datos experimentales.<\/p>\r\n      <\/div>\r\n      <div class=\"mrua-card\" style=\"border-left: 3px solid var(--violet);\">\r\n        <h3 style=\"font-size: 1.1rem; margin-bottom: 8px; color: var(--violet);\">\ud83c\udf93 Resultados de Aprendizaje<\/h3>\r\n        <ul style=\"font-size: 0.95rem; color: var(--text-dim); padding-left: 20px; line-height: 1.6;\">\r\n          <li>Interpretar fen\u00f3menos f\u00edsicos<\/li><li>Analizar gr\u00e1ficas cinem\u00e1ticas<\/li><li>Relacionar teor\u00eda y experiencia<\/li><li>Comparar predicciones y resultados<\/li>\r\n        <\/ul>\r\n      <\/div>\r\n    <\/div>\r\n    <div class=\"mrua-card\">\r\n      <h3 style=\"font-size: 1.1rem; margin-bottom: 16px; color: white;\">\ud83d\udccb Pasos de la experiencia<\/h3>\r\n      <div style=\"display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px;\">\r\n        <div style=\"text-align: center; padding: 10px 4px; background: var(--bg-surface); border-radius: 10px;\"><div style=\"font-size: 1.3rem; margin-bottom: 4px;\">1\ufe0f\u20e3<\/div><div style=\"font-size: 0.72rem; font-weight: 600; color: var(--text-dim);\">Visualizar<\/div><\/div>\r\n        <div style=\"text-align: center; padding: 10px 4px; background: var(--bg-surface); border-radius: 10px;\"><div style=\"font-size: 1.3rem; margin-bottom: 4px;\">2\ufe0f\u20e3<\/div><div style=\"font-size: 0.72rem; font-weight: 600; color: var(--text-dim);\">Predecir<\/div><\/div>\r\n        <div style=\"text-align: center; padding: 10px 4px; background: var(--bg-surface); border-radius: 10px;\"><div style=\"font-size: 1.3rem; margin-bottom: 4px;\">3\ufe0f\u20e3<\/div><div style=\"font-size: 0.72rem; font-weight: 600; color: var(--text-dim);\">Simular<\/div><\/div>\r\n        <div style=\"text-align: center; padding: 10px 4px; background: var(--bg-surface); border-radius: 10px;\"><div style=\"font-size: 1.3rem; margin-bottom: 4px;\">4\ufe0f\u20e3<\/div><div style=\"font-size: 0.72rem; font-weight: 600; color: var(--text-dim);\">Comparar<\/div><\/div>\r\n        <div style=\"text-align: center; padding: 10px 4px; background: var(--bg-surface); border-radius: 10px;\"><div style=\"font-size: 1.3rem; margin-bottom: 4px;\">5\ufe0f\u20e3<\/div><div style=\"font-size: 0.72rem; font-weight: 600; color: var(--text-dim);\">Analizar<\/div><\/div>\r\n        <div style=\"text-align: center; padding: 10px 4px; background: var(--bg-surface); border-radius: 10px;\"><div style=\"font-size: 1.3rem; margin-bottom: 4px;\">6\ufe0f\u20e3<\/div><div style=\"font-size: 0.72rem; font-weight: 600; color: var(--text-dim);\">Cuestionario<\/div><\/div>\r\n      <\/div>\r\n    <\/div>\r\n    <button class=\"mrua-btn primary large\" onclick=\"mrua.navTo('prediction')\">Ir a Predicci\u00f3n \u2192<\/button>\r\n  <\/div>\r\n\r\n  <!-- PREDICTION -->\r\n  <div class=\"mrua-view\" id=\"view-prediction\">\r\n    <div class=\"mrua-badge cyan\">Paso 2 - Predicci\u00f3n<\/div>\r\n    <h2 class=\"mrua-title\">\u00bfC\u00f3mo ser\u00e1n las gr\u00e1ficas?<\/h2>\r\n    <p class=\"mrua-subtitle\">Observ\u00e1 el video del cuerpo descendiendo y dibuj\u00e1 tu predicci\u00f3n. Hac\u00e9 clic en los gr\u00e1ficos para agregar puntos.<\/p>\r\n    <div class=\"mrua-card\">\r\n      <div class=\"mrua-grid-2\">\r\n        <div>\r\n          <h3 style=\"font-size: 1rem; margin-bottom: 12px; color: white;\">\ud83c\udfa5 Observaci\u00f3n del fen\u00f3meno<\/h3>\r\n          <div class=\"yt-lazy\" data-id=\"PiASU3kB_sE\"><img decoding=\"async\" src=\"https:\/\/img.youtube.com\/vi\/PiASU3kB_sE\/maxresdefault.jpg\" alt=\"Ver video\" loading=\"lazy\" onerror=\"this.src='https:\/\/img.youtube.com\/vi\/PiASU3kB_sE\/hqdefault.jpg'\"><div class=\"yt-play\"><svg viewBox=\"0 0 24 24\"><polygon points=\"5,3 19,12 5,21\"\/><\/svg><\/div><\/div>\r\n        <\/div>\r\n        <div>\r\n          <h3 style=\"font-size: 1rem; margin-bottom: 12px; color: white;\">\ud83d\ude83 Esquema del movimiento<\/h3>\r\n          <canvas id=\"pred-ramp-canvas\" class=\"mrua-sim-canvas\" style=\"height: 100%; cursor: default;\"><\/canvas>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n    <div class=\"mrua-card\" style=\"margin-bottom: 12px; border-left: 3px solid var(--violet);\">\r\n      <h3 style=\"font-size: 1rem; margin-bottom: 8px; color: white;\">\ud83e\udde0 Tu Predicci\u00f3n<\/h3>\r\n      <p style=\"font-size: 0.85rem; color: var(--text-dim);\">Hac\u00e9 clic en los gr\u00e1ficos para agregar puntos. Los puntos se unir\u00e1n autom\u00e1ticamente formando la curva que predec\u00eds.<\/p>\r\n    <\/div>\r\n    <div class=\"mrua-grid-3\" id=\"draw-container\">\r\n      <div class=\"mrua-card\"><div class=\"mrua-canvas-wrap\"><div class=\"mrua-canvas-label\" style=\"color: var(--amber);\">Posici\u00f3n vs Tiempo<\/div><canvas id=\"c-pred-pos\" class=\"mrua-canvas\" data-type=\"pos\"><\/canvas><\/div><div class=\"mrua-canvas-controls\"><button class=\"mrua-btn danger\" onclick=\"mrua.clearCanvas('pos')\">Borrar<\/button><\/div><\/div>\r\n      <div class=\"mrua-card\"><div class=\"mrua-canvas-wrap\"><div class=\"mrua-canvas-label\" style=\"color: var(--emerald);\">Velocidad vs Tiempo<\/div><canvas id=\"c-pred-vel\" class=\"mrua-canvas\" data-type=\"vel\"><\/canvas><\/div><div class=\"mrua-canvas-controls\"><button class=\"mrua-btn danger\" onclick=\"mrua.clearCanvas('vel')\">Borrar<\/button><\/div><\/div>\r\n      <div class=\"mrua-card\"><div class=\"mrua-canvas-wrap\"><div class=\"mrua-canvas-label\" style=\"color: var(--blue);\">Aceleraci\u00f3n vs Tiempo<\/div><canvas id=\"c-pred-acc\" class=\"mrua-canvas\" data-type=\"acc\"><\/canvas><\/div><div class=\"mrua-canvas-controls\"><button class=\"mrua-btn danger\" onclick=\"mrua.clearCanvas('acc')\">Borrar<\/button><\/div><\/div>\r\n    <\/div>\r\n    <button class=\"mrua-btn primary large\" onclick=\"mrua.savePredictions()\" style=\"margin-top: 8px;\">\ud83d\udcbe Guardar Predicci\u00f3n y Continuar<\/button>\r\n  <\/div>\r\n\r\n  <!-- SIMULATION -->\r\n  <div class=\"mrua-view\" id=\"view-simulation\">\r\n    <div class=\"mrua-badge violet\">Paso 3 - Simulaci\u00f3n<\/div>\r\n    <h2 class=\"mrua-title\">Experimentaci\u00f3n<\/h2>\r\n    <p class=\"mrua-subtitle\">Ejecut\u00e1 la simulaci\u00f3n del cuerpo descendiendo el plano y observ\u00e1 c\u00f3mo se generan las gr\u00e1ficas reales.<\/p>\r\n    <div class=\"mrua-card\">\r\n      <div class=\"mrua-grid-2\">\r\n        <div>\r\n          <h3 style=\"font-size: 1rem; margin-bottom: 12px; color: white;\">\ud83d\ude83 Simulaci\u00f3n del Plano<\/h3>\r\n          <canvas id=\"sim-ramp\" class=\"mrua-sim-canvas\"><\/canvas>\r\n          <div style=\"margin-bottom: 16px; background: var(--bg-surface); padding: 12px; border-radius: 10px;\">\r\n            <label class=\"mrua-label\">\u00c1ngulo del plano (\u03b8): <span id=\"sim-angle-val\" style=\"color: var(--cyan);\">30\u00b0<\/span><\/label>\r\n            <input type=\"range\" id=\"sim-angle\" min=\"10\" max=\"60\" value=\"30\" style=\"width: 100%; accent-color: var(--cyan);\">\r\n          <\/div>\r\n          <button class=\"mrua-btn primary\" id=\"sim-play-btn\" onclick=\"mrua.startSim()\">\u25b6 Iniciar Simulaci\u00f3n<\/button>\r\n          <button class=\"mrua-btn secondary\" onclick=\"mrua.openModal('https:\/\/www.youtube.com\/embed\/PiASU3kB_sE')\" style=\"margin-top: 8px; width: 100%; text-align: center;\">\ud83c\udfa5 Ver Video del Experimento<\/button>\r\n        <\/div>\r\n        <div>\r\n          <h3 style=\"font-size: 1rem; margin-bottom: 12px; color: white;\">\ud83d\udcca Datos en Tiempo Real<\/h3>\r\n          <div class=\"mrua-data-grid\">\r\n            <div class=\"mrua-data-item\"><span>Tiempo<\/span><strong id=\"sd-t\" style=\"color: var(--text-main);\">0.0s<\/strong><\/div>\r\n            <div class=\"mrua-data-item\"><span>Distancia<\/span><strong id=\"sd-s\" style=\"color: var(--amber);\">0.0m<\/strong><\/div>\r\n            <div class=\"mrua-data-item\"><span>Velocidad<\/span><strong id=\"sd-v\" style=\"color: var(--emerald);\">0.0m\/s<\/strong><\/div>\r\n          <\/div>\r\n          <p style=\"font-size: 0.85rem; color: var(--text-dim); margin-bottom: 12px;\">A medida que el cuerpo desciende se generan las gr\u00e1ficas reales del movimiento.<\/p>\r\n          <div style=\"display: flex; flex-direction: column; gap: 12px;\">\r\n            <div class=\"mrua-canvas-wrap\"><div class=\"mrua-canvas-label\" style=\"color: var(--amber);\">Posici\u00f3n<\/div><canvas id=\"c-real-pos\" class=\"mrua-canvas\" style=\"height: 130px; pointer-events: none;\"><\/canvas><\/div>\r\n            <div class=\"mrua-canvas-wrap\"><div class=\"mrua-canvas-label\" style=\"color: var(--emerald);\">Velocidad<\/div><canvas id=\"c-real-vel\" class=\"mrua-canvas\" style=\"height: 130px; pointer-events: none;\"><\/canvas><\/div>\r\n            <div class=\"mrua-canvas-wrap\"><div class=\"mrua-canvas-label\" style=\"color: var(--blue);\">Aceleraci\u00f3n<\/div><canvas id=\"c-real-acc\" class=\"mrua-canvas\" style=\"height: 130px; pointer-events: none;\"><\/canvas><\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n    <button class=\"mrua-btn primary large\" onclick=\"mrua.navTo('analysis')\">Ir a An\u00e1lisis y Reflexi\u00f3n \u2192<\/button>\r\n  <\/div>\r\n\r\n  <!-- ANALYSIS -->\r\n  <div class=\"mrua-view\" id=\"view-analysis\">\r\n    <div class=\"mrua-badge cyan\">Paso 4 - An\u00e1lisis<\/div>\r\n    <h2 class=\"mrua-title\">Comparaci\u00f3n y Reflexi\u00f3n<\/h2>\r\n    <p class=\"mrua-subtitle\">Compar\u00e1 tus predicciones con los resultados reales y respond\u00e9 las preguntas.<\/p>\r\n    <div class=\"mrua-card\" style=\"margin-bottom: 20px; background: var(--bg-surface); border-radius: 12px; padding: 16px;\">\r\n      <div class=\"mrua-grid-2\" style=\"gap: 12px; margin-bottom: 0;\">\r\n        <div><label class=\"mrua-label\">\ud83d\udc64 Nombre y Apellido<\/label><input type=\"text\" id=\"stu-name\" class=\"mrua-input\" placeholder=\"Ej: Juan P\u00e9rez\"><\/div>\r\n        <div><label class=\"mrua-label\">\ud83c\udf93 Carrera<\/label><input type=\"text\" id=\"stu-career\" class=\"mrua-input\" placeholder=\"Ej: Ingenier\u00eda Qu\u00edmica\"><\/div>\r\n      <\/div>\r\n    <\/div>\r\n    <div class=\"mrua-grid-3\" id=\"compare-container\">\r\n      <div class=\"mrua-card\"><div class=\"mrua-compare-header\"><span class=\"mrua-compare-label pred\">Predicci\u00f3n<\/span><span class=\"mrua-compare-label\" style=\"background: rgba(245,158,11,0.1); color: #f59e0b; border: 1px solid rgba(245,158,11,0.3);\">Real<\/span><\/div><div class=\"mrua-canvas-wrap\"><div class=\"mrua-canvas-label\" style=\"color: var(--amber);\">Posici\u00f3n vs Tiempo<\/div><canvas id=\"c-comp-pos\" class=\"mrua-canvas\" style=\"height: 180px; pointer-events: none;\"><\/canvas><\/div><\/div>\r\n      <div class=\"mrua-card\"><div class=\"mrua-compare-header\"><span class=\"mrua-compare-label pred\">Predicci\u00f3n<\/span><span class=\"mrua-compare-label\" style=\"background: rgba(16,185,129,0.1); color: #10b981; border: 1px solid rgba(16,185,129,0.3);\">Real<\/span><\/div><div class=\"mrua-canvas-wrap\"><div class=\"mrua-canvas-label\" style=\"color: var(--emerald);\">Velocidad vs Tiempo<\/div><canvas id=\"c-comp-vel\" class=\"mrua-canvas\" style=\"height: 180px; pointer-events: none;\"><\/canvas><\/div><\/div>\r\n      <div class=\"mrua-card\"><div class=\"mrua-compare-header\"><span class=\"mrua-compare-label pred\">Predicci\u00f3n<\/span><span class=\"mrua-compare-label\" style=\"background: rgba(59,130,246,0.1); color: #3b82f6; border: 1px solid rgba(59,130,246,0.3);\">Real<\/span><\/div><div class=\"mrua-canvas-wrap\"><div class=\"mrua-canvas-label\" style=\"color: var(--blue);\">Aceleraci\u00f3n vs Tiempo<\/div><canvas id=\"c-comp-acc\" class=\"mrua-canvas\" style=\"height: 180px; pointer-events: none;\"><\/canvas><\/div><\/div>\r\n    <\/div>\r\n    <div class=\"mrua-card\" style=\"margin-top: 20px;\">\r\n      <h3 style=\"font-size: 1.1rem; margin-bottom: 16px; color: var(--violet);\">\ud83d\udcdd Reflexi\u00f3n y An\u00e1lisis<\/h3>\r\n      <div style=\"display: flex; flex-direction: column; gap: 16px;\">\r\n        <div><label class=\"mrua-label\">1. Comparaci\u00f3n entre tu predicci\u00f3n y la experiencia<\/label><textarea class=\"mrua-textarea\" id=\"q1\" onkeyup=\"mrua.autoSaveText()\" placeholder=\"Escrib\u00ed aqu\u00ed tu respuesta...\"><\/textarea><\/div>\r\n        <div><label class=\"mrua-label\">2. Influencia del \u00e1ngulo del plano en la aceleraci\u00f3n<\/label><textarea class=\"mrua-textarea\" id=\"q2\" onkeyup=\"mrua.autoSaveText()\" placeholder=\"Escrib\u00ed aqu\u00ed tu respuesta...\"><\/textarea><\/div>\r\n        <div><label class=\"mrua-label\">3. Precisi\u00f3n y validez de la experiencia<\/label><textarea class=\"mrua-textarea\" id=\"q3\" onkeyup=\"mrua.autoSaveText()\" placeholder=\"Escrib\u00ed aqu\u00ed tu respuesta...\"><\/textarea><\/div>\r\n      <\/div>\r\n    <\/div>\r\n    <button class=\"mrua-btn primary large\" onclick=\"mrua.generatePDF()\" style=\"margin-top: 8px;\">\ud83d\udcc4 Descargar Informe en PDF<\/button>\r\n  <\/div>\r\n\r\n  <!-- QUIZ -->\r\n  <div class=\"mrua-view\" id=\"view-quiz\">\r\n    <div class=\"mrua-badge violet\">Paso Final - Cuestionario<\/div>\r\n    <h2 class=\"mrua-title\">Evaluaci\u00f3n Final<\/h2>\r\n    <p class=\"mrua-subtitle\">Para finalizar la experiencia deber\u00e1 responder el cuestionario autom\u00e1tico.<\/p>\r\n    <div class=\"mrua-card\" style=\"text-align: center;\">\r\n      <p style=\"font-size: 1.1rem; margin-bottom: 16px; color: var(--text-dim);\">Hac\u00e9 clic en el bot\u00f3n para acceder al formulario de evaluaci\u00f3n.<\/p>\r\n      <a href=\"https:\/\/script.google.com\/macros\/s\/AKfycbwEDzWt1OxCsG4SrswTJs5ki5ucr8SkNdwlwGyf7J9O\/dev\" target=\"_blank\" class=\"mrua-btn primary large\" style=\"text-decoration: none;\">\ud83d\udccb Responder Cuestionario<\/a>\r\n      <div class=\"mrua-alert warn\" style=\"margin-top: 20px; justify-content: center;\"><span>\u26a0\ufe0f Debe iniciar sesi\u00f3n con una cuenta de Gmail para responder.<\/span><\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- MODAL -->\r\n  <div class=\"mrua-modal-overlay\" id=\"mrua-modal\"><div class=\"mrua-modal\"><div class=\"mrua-modal-head\"><h3 style=\"font-size: 1rem; color: var(--text-main);\">Recurso Externo<\/h3><button class=\"mrua-btn danger\" onclick=\"mrua.closeModal()\">\u2715 Cerrar<\/button><\/div><div class=\"mrua-modal-body\"><iframe id=\"mrua-iframe\" src=\"about:blank\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe><\/div><\/div><\/div>\r\n  <button class=\"mrua-back-top\" id=\"mrua-back-top\" onclick=\"document.getElementById('mrua-lab-app').scrollIntoView({behavior:'smooth'})\">\u2191<\/button>\r\n<\/div>\r\n\r\n<script>\r\nconst mrua = (() => {\r\n    const G = 9.8;\r\n    \/\/ BUG FIX: simAccel y simTEnd se inicializan correctamente\r\n    let simAngle = 30, simAccel = G * Math.sin(30 * Math.PI \/ 180), simTEnd = 0;\r\n    let isSimPlaying = false, simAnimId = null, simLastTs = null, simTime = 0;\r\n    let predPoints = { pos: [], vel: [], acc: [] }, predRampAnimId = null;\r\n\r\n    const $ = id => document.getElementById(id);\r\n    const app = $('mrua-lab-app');\r\n    const views = ['welcome', 'guide', 'prediction', 'simulation', 'analysis', 'quiz'];\r\n\r\n    function navTo(viewName) {\r\n        views.forEach(v => $(`view-${v}`).classList.remove('active'));\r\n        $(`view-${viewName}`).classList.add('active');\r\n        document.querySelectorAll('.mrua-nav-btn').forEach(btn => btn.classList.toggle('active', btn.dataset.view === viewName));\r\n        $('mrua-prog-bar').style.width = `${(views.indexOf(viewName) \/ (views.length - 1)) * 100}%`;\r\n        if(viewName === 'prediction') { initPredictionCanvases(); initPredRampAnim(); }\r\n        else { if(predRampAnimId) { cancelAnimationFrame(predRampAnimId); predRampAnimId = null; } }\r\n        if(viewName === 'simulation') {\r\n            \/\/ BUG FIX: Resetear estado de la simulaci\u00f3n al entrar\r\n            isSimPlaying = false;\r\n            simTime = 0;\r\n            if(simAnimId) { cancelAnimationFrame(simAnimId); simAnimId = null; }\r\n            \/\/ Inicializar canvases DESPU\u00c9S de que la vista sea visible\r\n            requestAnimationFrame(() => {\r\n                initSimCanvases();\r\n                updateSimPhysics();\r\n                drawSimRamp(0);\r\n                drawSimGraphs(0);\r\n            });\r\n        }\r\n        if(viewName === 'analysis') requestAnimationFrame(() => drawAnalysis());\r\n        requestAnimationFrame(() => initLazyYT());\r\n        window.scrollTo({ top: app.offsetTop, behavior: 'smooth' });\r\n    }\r\n\r\n    \/\/ ===== FUNCI\u00d3N DEL CARRITO =====\r\n    function drawCartBody(ctx) {\r\n        \/\/ Ruedas (tocan la superficie del plano en Y=0 del sistema local)\r\n        ctx.fillStyle = '#1e293b';\r\n        ctx.beginPath(); ctx.arc(-8, -4, 4, 0, Math.PI * 2); ctx.fill();\r\n        ctx.beginPath(); ctx.arc(8, -4, 4, 0, Math.PI * 2); ctx.fill();\r\n        ctx.fillStyle = '#94a3b8';\r\n        ctx.beginPath(); ctx.arc(-8, -4, 1.5, 0, Math.PI * 2); ctx.fill();\r\n        ctx.beginPath(); ctx.arc(8, -4, 1.5, 0, Math.PI * 2); ctx.fill();\r\n        \/\/ Cuerpo del carrito\r\n        ctx.fillStyle = '#22d3ee'; ctx.shadowColor = '#22d3ee'; ctx.shadowBlur = 15;\r\n        ctx.fillRect(-15, -16, 30, 12);\r\n        ctx.shadowBlur = 0;\r\n    }\r\n\r\n    let predCartX = 0;\r\n    function initPredRampAnim() {\r\n        const c = $('pred-ramp-canvas'); if(!c) return;\r\n        if(predRampAnimId) { cancelAnimationFrame(predRampAnimId); predRampAnimId = null; }\r\n        const dpr = window.devicePixelRatio || 1;\r\n        c.width = c.offsetWidth * dpr; c.height = c.offsetHeight * dpr;\r\n        const ctx = c.getContext('2d'); ctx.scale(dpr, dpr);\r\n        const W = c.offsetWidth, H = c.offsetHeight;\r\n        \r\n        const p_high = {x: W*0.1, y: H*0.15}; \r\n        const p_low = {x: W*0.85, y: H*0.85}; \r\n        const p_base = {x: W*0.1, y: H*0.85};\r\n        const angle = Math.atan2(p_low.y - p_high.y, p_low.x - p_high.x);\r\n        const len = Math.sqrt(Math.pow(p_low.x-p_high.x, 2) + Math.pow(p_low.y-p_high.y, 2));\r\n        predCartX = 0;\r\n\r\n        function loop() {\r\n            ctx.clearRect(0, 0, W, H);\r\n            \/\/ Tri\u00e1ngulo del plano\r\n            ctx.fillStyle = 'rgba(30,58,110,0.2)';\r\n            ctx.beginPath(); ctx.moveTo(p_high.x, p_high.y); ctx.lineTo(p_low.x, p_low.y); ctx.lineTo(p_base.x, p_base.y); ctx.closePath(); ctx.fill();\r\n            \/\/ L\u00ednea del plano inclinado\r\n            ctx.strokeStyle = 'rgba(34,211,238,0.5)'; ctx.lineWidth = 3;\r\n            ctx.beginPath(); ctx.moveTo(p_high.x, p_high.y); ctx.lineTo(p_low.x, p_low.y); ctx.stroke();\r\n            \r\n            predCartX += 1.5; if(predCartX > len) predCartX = 0;\r\n            const cx = p_high.x + predCartX * Math.cos(angle);\r\n            const cy = p_high.y + predCartX * Math.sin(angle);\r\n            \r\n            ctx.save(); ctx.translate(cx, cy); ctx.rotate(angle);\r\n            drawCartBody(ctx);\r\n            ctx.restore();\r\n            \r\n            predRampAnimId = requestAnimationFrame(loop);\r\n        }\r\n        loop();\r\n    }\r\n\r\n    const predColors = { pos: '#f59e0b', vel: '#10b981', acc: '#3b82f6' };\r\n\r\n    function initPredictionCanvases() {\r\n        ['pos', 'vel', 'acc'].forEach(type => {\r\n            const c = $(`c-pred-${type}`); const dpr = window.devicePixelRatio || 1;\r\n            const rect = c.getBoundingClientRect(); c.width = rect.width * dpr; c.height = rect.height * dpr;\r\n            const ctx = c.getContext('2d'); ctx.scale(dpr, dpr);\r\n            drawGraphGrid(ctx, rect.width, rect.height, type);\r\n            if(predPoints[type].length > 0) drawPredictionCurve(ctx, rect.width, rect.height, type);\r\n        });\r\n    }\r\n\r\n    function drawGraphGrid(ctx, W, H, type) {\r\n        ctx.clearRect(0,0,W,H); ctx.strokeStyle = 'rgba(255,255,255,0.05)'; ctx.lineWidth = 1;\r\n        const m = 30;\r\n        for(let x=m; x<W; x+=20) { ctx.beginPath(); ctx.moveTo(x,10); ctx.lineTo(x,H-10); ctx.stroke(); }\r\n        for(let y=10; y<H; y+=20) { ctx.beginPath(); ctx.moveTo(m,y); ctx.lineTo(W-10,y); ctx.stroke(); }\r\n        ctx.strokeStyle = 'rgba(255,255,255,0.2)'; ctx.lineWidth = 1.5;\r\n        ctx.beginPath(); ctx.moveTo(m,10); ctx.lineTo(m,H-10); ctx.lineTo(W-10,H-10); ctx.stroke();\r\n        ctx.fillStyle = 'rgba(255,255,255,0.3)'; ctx.font = '10px Inter';\r\n        ctx.fillText('t', W-10, H-15); ctx.fillText(type==='pos'?'x':type==='vel'?'v':'a', 10, 20);\r\n    }\r\n\r\n    function drawPredictionCurve(ctx, W, H, type) {\r\n        const m = 30;\r\n        ctx.strokeStyle = '#8b5cf6'; ctx.lineWidth = 2.5; ctx.globalAlpha = 0.9; ctx.setLineDash([5, 5]);\r\n        ctx.beginPath();\r\n        predPoints[type].forEach((p, i) => {\r\n            const x = m + (p.x \/ W) * (W - m); const y = 10 + (p.y \/ H) * (H - 20);\r\n            i === 0 ? ctx.moveTo(x, y) : ctx.lineTo(x, y);\r\n        });\r\n        ctx.stroke(); ctx.setLineDash([]); ctx.globalAlpha = 1.0;\r\n        ctx.fillStyle = '#8b5cf6';\r\n        predPoints[type].forEach(p => {\r\n            const x = m + (p.x \/ W) * (W - m); const y = 10 + (p.y \/ H) * (H - 20);\r\n            ctx.beginPath(); ctx.arc(x, y, 4, 0, Math.PI * 2); ctx.fill();\r\n        });\r\n    }\r\n\r\n    function addPoint(e, type) {\r\n        const c = $(`c-pred-${type}`); const rect = c.getBoundingClientRect();\r\n        const x = e.clientX - rect.left; const y = e.clientY - rect.top;\r\n        if(x < 30 || x > rect.width - 10 || y < 10 || y > rect.height - 10) return;\r\n        predPoints[type].push({x, y}); const ctx = c.getContext('2d'); const dpr = window.devicePixelRatio || 1;\r\n        ctx.setTransform(dpr, 0, 0, dpr, 0, 0); drawGraphGrid(ctx, rect.width, rect.height, type); drawPredictionCurve(ctx, rect.width, rect.height, type);\r\n    }\r\n\r\n    function clearCanvas(type) {\r\n        predPoints[type] = []; const c = $(`c-pred-${type}`); const rect = c.getBoundingClientRect();\r\n        const ctx = c.getContext('2d'); const dpr = window.devicePixelRatio || 1;\r\n        ctx.setTransform(dpr, 0, 0, dpr, 0, 0); drawGraphGrid(ctx, rect.width, rect.height, type);\r\n    }\r\n\r\n    function savePredictions() {\r\n        \/\/ Guardar puntos + dimensiones del canvas en el momento de la prediccion\r\n        const dims = {};\r\n        ['pos', 'vel', 'acc'].forEach(type => {\r\n            const c = $('c-pred-' + type);\r\n            dims[type] = { w: c ? c.offsetWidth : 400, h: c ? c.offsetHeight : 220 };\r\n        });\r\n        localStorage.setItem('mrua_pred', JSON.stringify(predPoints));\r\n        localStorage.setItem('mrua_pred_dims', JSON.stringify(dims));\r\n        alert('\\u2705 Predicci\u00f3n guardada temporalmente. Avanz\u00e1 a la simulaci\u00f3n.'); navTo('simulation');\r\n    }\r\n\r\n    \/\/ BUG FIX: updateSimPhysics ahora calcula correctamente sin anular simAccel\r\n    function updateSimPhysics() {\r\n        const rad = simAngle * Math.PI \/ 180;\r\n        simAccel = G * Math.sin(rad);\r\n        \/\/ Tiempo para recorrer 5 metros desde reposo: t = sqrt(2d\/a)\r\n        simTEnd = simAccel > 0.01 ? Math.sqrt(2 * 5 \/ simAccel) : 10;\r\n    }\r\n\r\n    function initSimCanvases() {\r\n        \/\/ BUG FIX: Resetear bot\u00f3n al entrar\r\n        $('sim-play-btn').textContent = '\u25b6 Iniciar Simulaci\u00f3n';\r\n\r\n        \/\/ Canvas del plano (sim-ramp)\r\n        const rc = $('sim-ramp');\r\n        const dpr = window.devicePixelRatio || 1;\r\n        rc.width = rc.offsetWidth * dpr; rc.height = rc.offsetHeight * dpr;\r\n        const rctx = rc.getContext('2d'); rctx.scale(dpr, dpr);\r\n\r\n        \/\/ Canvas de gr\u00e1ficas reales\r\n        ['pos', 'vel', 'acc'].forEach(type => {\r\n            const c = $(`c-real-${type}`);\r\n            const dpr2 = window.devicePixelRatio || 1;\r\n            c.width = c.offsetWidth * dpr2; c.height = c.offsetHeight * dpr2;\r\n            const ctx = c.getContext('2d'); ctx.scale(dpr2, dpr2);\r\n            drawGraphGrid(ctx, c.offsetWidth, c.offsetHeight, type);\r\n        });\r\n\r\n        $('sim-angle').oninput = (e) => {\r\n            simAngle = parseInt(e.target.value);\r\n            $('sim-angle-val').innerText = simAngle + '\u00b0';\r\n            \/\/ Detener simulaci\u00f3n en curso si la hay\r\n            isSimPlaying = false;\r\n            if(simAnimId) { cancelAnimationFrame(simAnimId); simAnimId = null; }\r\n            simTime = 0;\r\n            $('sim-play-btn').textContent = '\u25b6 Iniciar Simulaci\u00f3n';\r\n            updateSimPhysics();\r\n            drawSimRamp(0);\r\n            drawSimGraphs(0);\r\n            $('sd-t').innerText = '0.0s'; $('sd-s').innerText = '0.0m'; $('sd-v').innerText = '0.0m\/s';\r\n        };\r\n    }\r\n\r\n    \/\/ BUG FIX: drawSimRamp corregido \u2014 ctx.lineTo en lugar de lineTo (llamada sin contexto)\r\n    function drawSimRamp(t) {\r\n        const c = $('sim-ramp'); if(!c) return;\r\n        const ctx = c.getContext('2d');\r\n        \/\/ BUG FIX: usar offsetWidth\/offsetHeight (dimensiones CSS, no f\u00edsicas)\r\n        const W = c.offsetWidth; const H = c.offsetHeight;\r\n        ctx.clearRect(0, 0, W, H);\r\n\r\n        const rad = simAngle * Math.PI \/ 180;\r\n        const base = W * 0.65;\r\n        const h = base * Math.tan(rad);\r\n        const drawH = Math.min(h, H * 0.65);\r\n        const drawB = drawH \/ Math.tan(rad);\r\n\r\n        \/\/ Geometr\u00eda: cima a la IZQUIERDA (inicio), base a la DERECHA (final)\r\n        const Lx = W * 0.12; const Ly = H * 0.82 - drawH; \/\/ Cima (punto alto, inicio)\r\n        const Rx = Lx + drawB; const Ry = H * 0.82;        \/\/ Base baja (final del recorrido)\r\n        const Cx = Lx;        const Cy = H * 0.82;          \/\/ Esquina inferior izquierda\r\n\r\n        \/\/ Relleno del tri\u00e1ngulo\r\n        ctx.fillStyle = 'rgba(30,58,110,0.25)';\r\n        ctx.beginPath();\r\n        ctx.moveTo(Lx, Ly);\r\n        ctx.lineTo(Rx, Ry);   \/\/ BUG FIX: antes era \"lineTo(Rx,Ry)\" sin ctx\r\n        ctx.lineTo(Cx, Cy);\r\n        ctx.closePath();\r\n        ctx.fill();\r\n\r\n        \/\/ Borde del tri\u00e1ngulo\r\n        ctx.strokeStyle = 'rgba(255,255,255,0.08)'; ctx.lineWidth = 1;\r\n        ctx.stroke();\r\n\r\n        \/\/ L\u00ednea del plano inclinado (superficie de deslizamiento)\r\n        ctx.strokeStyle = 'rgba(34,211,238,0.6)'; ctx.lineWidth = 3;\r\n        ctx.beginPath();\r\n        ctx.moveTo(Lx, Ly);\r\n        ctx.lineTo(Rx, Ry);\r\n        ctx.stroke();\r\n\r\n        \/\/ \u00c1ngulo del plano: marcar con arco\r\n        const arcR = 28;\r\n        ctx.strokeStyle = 'rgba(34,211,238,0.4)'; ctx.lineWidth = 1.5;\r\n        ctx.beginPath(); ctx.arc(Rx, Ry, arcR, -Math.PI, -Math.PI + rad * (-1) + Math.PI * 2); \/\/ simplificado:\r\n        \/\/ Dibujar arco en la esquina inferior derecha mostrando el \u00e1ngulo\r\n        ctx.beginPath(); ctx.arc(Rx, Ry, arcR, Math.PI, Math.PI + rad); ctx.stroke();\r\n        ctx.fillStyle = 'rgba(34,211,238,0.7)'; ctx.font = '11px Inter';\r\n        ctx.fillText(simAngle + '\u00b0', Rx - arcR - 28, Ry - 6);\r\n\r\n        \/\/ Posici\u00f3n del carrito sobre el plano\r\n        const slopeLen = Math.sqrt(drawB * drawB + drawH * drawH);\r\n        const angle = Math.atan2(Ry - Ly, Rx - Lx); \/\/ \u00e1ngulo positivo (baja hacia la derecha)\r\n        const dist = 0.5 * simAccel * t * t;\r\n        const normDist = Math.min((dist \/ 5), 1) * slopeLen; \/\/ 5m es el recorrido total\r\n\r\n        const bx = Lx + normDist * Math.cos(angle);\r\n        const by = Ly + normDist * Math.sin(angle);\r\n\r\n        ctx.save();\r\n        ctx.translate(bx, by);\r\n        ctx.rotate(angle);\r\n        drawCartBody(ctx);\r\n        ctx.restore();\r\n    }\r\n\r\n    function drawSimGraphs(t) {\r\n        ['pos', 'vel', 'acc'].forEach(type => {\r\n            const c = $(`c-real-${type}`); if(!c) return;\r\n            const ctx = c.getContext('2d');\r\n            const W = c.offsetWidth; const H = c.offsetHeight;\r\n            drawGraphGrid(ctx, W, H, type);\r\n\r\n            const tMax = Math.max(simTEnd, 0.1);\r\n            const maxPos = 5;\r\n            const maxVel = simAccel * tMax;\r\n            const maxAcc = Math.max(simAccel, 0.1);\r\n\r\n            ctx.strokeStyle = predColors[type]; ctx.lineWidth = 3;\r\n            ctx.shadowColor = predColors[type]; ctx.shadowBlur = 6;\r\n            ctx.beginPath();\r\n\r\n            const steps = 100;\r\n            const dt = t \/ steps;\r\n            for(let i = 0; i <= steps; i++) {\r\n                const ti = dt * i;\r\n                let val, maxVal;\r\n                if(type === 'pos')      { val = 0.5 * simAccel * ti * ti; maxVal = maxPos; }\r\n                else if(type === 'vel') { val = simAccel * ti;             maxVal = Math.max(maxVel, 0.1); }\r\n                else                   { val = simAccel;                   maxVal = maxAcc; }\r\n\r\n                const x = 30 + (ti \/ tMax) * (W - 40);\r\n                const y = (H - 10) - (val \/ maxVal) * (H - 30);\r\n                i === 0 ? ctx.moveTo(x, y) : ctx.lineTo(x, y);\r\n            }\r\n            ctx.stroke();\r\n            ctx.shadowBlur = 0;\r\n        });\r\n    }\r\n\r\n    function startSim() {\r\n        \/\/ BUG FIX: permitir reiniciar aunque ya termin\u00f3\r\n        if(isSimPlaying) return;\r\n        updateSimPhysics();\r\n        if(simAccel <= 0.01) { alert('El \u00e1ngulo es muy bajo, el cuerpo no descender\u00e1.'); return; }\r\n        \/\/ Reiniciar si ya hab\u00eda terminado\r\n        simTime = 0;\r\n        isSimPlaying = true;\r\n        simLastTs = null;\r\n        $('sim-play-btn').textContent = '\u23f8 Simulando...';\r\n        $('sd-t').innerText = '0.0s'; $('sd-s').innerText = '0.0m'; $('sd-v').innerText = '0.0m\/s';\r\n        drawSimRamp(0); drawSimGraphs(0);\r\n        simAnimId = requestAnimationFrame(animSimStep);\r\n    }\r\n\r\n    function animSimStep(ts) {\r\n        if(!simLastTs) simLastTs = ts;\r\n        const dt = (ts - simLastTs) \/ 1000;\r\n        simLastTs = ts;\r\n        simTime += dt;\r\n\r\n        if(simTime >= simTEnd) {\r\n            simTime = simTEnd;\r\n            isSimPlaying = false;\r\n            $('sim-play-btn').textContent = '\u25b6 Reiniciar Simulaci\u00f3n';\r\n        }\r\n\r\n        $('sd-t').textContent = simTime.toFixed(2) + 's';\r\n        $('sd-s').textContent = (0.5 * simAccel * simTime * simTime).toFixed(2) + 'm';\r\n        $('sd-v').textContent = (simAccel * simTime).toFixed(2) + 'm\/s';\r\n\r\n        drawSimRamp(simTime);\r\n        drawSimGraphs(simTime);\r\n\r\n        if(isSimPlaying) simAnimId = requestAnimationFrame(animSimStep);\r\n    }\r\n\r\n    function drawAnalysis() {\r\n        const savedPred = JSON.parse(localStorage.getItem('mrua_pred') || '{}');\r\n        updateSimPhysics();\r\n        ['pos', 'vel', 'acc'].forEach(type => {\r\n            const c = $(`c-comp-${type}`); if(!c) return;\r\n            const dpr = window.devicePixelRatio || 1;\r\n            c.width = c.offsetWidth * dpr; c.height = c.offsetHeight * dpr;\r\n            const ctx = c.getContext('2d'); ctx.scale(dpr, dpr);\r\n            const W = c.offsetWidth; const H = c.offsetHeight;\r\n            drawGraphGrid(ctx, W, H, type);\r\n\r\n            \/\/ Curva real\r\n            const tMax = Math.max(simTEnd, 0.1);\r\n            const maxPos = 5;\r\n            const maxVel = simAccel * tMax;\r\n            const maxAcc = Math.max(simAccel, 0.1);\r\n            ctx.strokeStyle = predColors[type]; ctx.lineWidth = 3;\r\n            ctx.beginPath();\r\n            const steps = 100;\r\n            for(let i = 0; i <= steps; i++) {\r\n                const ti = (simTEnd \/ steps) * i;\r\n                let val, maxVal;\r\n                if(type === 'pos')      { val = 0.5 * simAccel * ti * ti; maxVal = maxPos; }\r\n                else if(type === 'vel') { val = simAccel * ti;             maxVal = Math.max(maxVel, 0.1); }\r\n                else                   { val = simAccel;                   maxVal = maxAcc; }\r\n                const x = 30 + (ti \/ tMax) * (W - 40);\r\n                const y = (H - 10) - (val \/ maxVal) * (H - 30);\r\n                i === 0 ? ctx.moveTo(x, y) : ctx.lineTo(x, y);\r\n            }\r\n            ctx.stroke();\r\n\r\n            \/\/ Escala de predicciones usando dimensiones guardadas al momento de predecir\r\n            if(savedPred[type] && savedPred[type].length > 0) {\r\n                ctx.strokeStyle = '#8b5cf6'; ctx.lineWidth = 2.5;\r\n                ctx.globalAlpha = 0.85; ctx.setLineDash([5, 5]);\r\n                ctx.beginPath();\r\n\r\n                \/\/ Usar dimensiones guardadas (el canvas de predicci\u00f3n puede estar oculto ahora)\r\n                const savedDims = JSON.parse(localStorage.getItem('mrua_pred_dims') || '{}');\r\n                const origW = (savedDims[type] && savedDims[type].w > 50) ? savedDims[type].w : W;\r\n                const origH = (savedDims[type] && savedDims[type].h > 50) ? savedDims[type].h : H;\r\n\r\n                savedPred[type].forEach((p, i) => {\r\n                    \/\/ Normalizar desde coordenadas originales y re-mapear al canvas actual\r\n                    const nx = (p.x - 30) \/ (origW - 40); \/\/ 0..1 en eje t\r\n                    const ny = (p.y - 10) \/ (origH - 20); \/\/ 0..1 en eje valor (invertido: 0=arriba)\r\n                    const x = 30 + nx * (W - 40);\r\n                    const y = 10 + ny * (H - 20);\r\n                    i === 0 ? ctx.moveTo(x, y) : ctx.lineTo(x, y);\r\n                });\r\n                ctx.stroke();\r\n                ctx.setLineDash([]); ctx.globalAlpha = 1.0;\r\n            }\r\n        });\r\n\r\n        const savedText = JSON.parse(localStorage.getItem('mrua_text') || '{}');\r\n        if(savedText.q1) $('q1').value = savedText.q1;\r\n        if(savedText.q2) $('q2').value = savedText.q2;\r\n        if(savedText.q3) $('q3').value = savedText.q3;\r\n    }\r\n\r\n    function autoSaveText() {\r\n        const data = { q1: $('q1').value, q2: $('q2').value, q3: $('q3').value };\r\n        localStorage.setItem('mrua_text', JSON.stringify(data));\r\n    }\r\n\r\n    \/\/ ===== PDF GENERATION =====\r\n\r\n    \/\/ Colores para impresi\u00f3n (fondo blanco): curva real s\u00f3lida oscura, predicci\u00f3n violeta visible\r\n    const pdfColors = { pos: '#c27a00', vel: '#0a7a50', acc: '#1a4fa8' };\r\n    const pdfViolet = '#6d28d9';\r\n\r\n    \/**\r\n     * Genera un canvas temporal con fondo BLANCO redibujando:\r\n     *  - La grilla en gris claro\r\n     *  - La curva real en color oscuro (pdfColors)\r\n     *  - La predicci\u00f3n en violeta oscuro (pdfViolet), con l\u00ednea discontinua\r\n     * Devuelve el dataURL PNG listo para insertar en el PDF.\r\n     *\/\r\n    function buildPdfCanvas(type) {\r\n        const W = 400; const H = 200; \/\/ Alta resoluci\u00f3n para el PDF\r\n        const tmp = document.createElement('canvas');\r\n        tmp.width = W; tmp.height = H;\r\n        const ctx = tmp.getContext('2d');\r\n\r\n        \/\/ Fondo blanco\r\n        ctx.fillStyle = '#ffffff';\r\n        ctx.fillRect(0, 0, W, H);\r\n\r\n        const m = 35; \/\/ margen izquierdo (eje Y)\r\n        const padR = 15; const padT = 15; const padB = 20;\r\n        const plotW = W - m - padR;\r\n        const plotH = H - padT - padB;\r\n\r\n        \/\/ Grilla gris claro\r\n        ctx.strokeStyle = '#e0e0e0'; ctx.lineWidth = 1;\r\n        for(let x = m; x <= W - padR; x += plotW \/ 6) {\r\n            ctx.beginPath(); ctx.moveTo(x, padT); ctx.lineTo(x, H - padB); ctx.stroke();\r\n        }\r\n        for(let y = padT; y <= H - padB; y += plotH \/ 4) {\r\n            ctx.beginPath(); ctx.moveTo(m, y); ctx.lineTo(W - padR, y); ctx.stroke();\r\n        }\r\n\r\n        \/\/ Ejes principales\r\n        ctx.strokeStyle = '#555555'; ctx.lineWidth = 1.5;\r\n        ctx.beginPath(); ctx.moveTo(m, padT); ctx.lineTo(m, H - padB); ctx.lineTo(W - padR, H - padB); ctx.stroke();\r\n\r\n        \/\/ Etiquetas de ejes\r\n        ctx.fillStyle = '#333333'; ctx.font = 'bold 12px sans-serif';\r\n        ctx.fillText('t', W - padR + 2, H - padB + 4);\r\n        ctx.fillText(type === 'pos' ? 'x' : type === 'vel' ? 'v' : 'a', m - 14, padT + 4);\r\n\r\n        const tMax = Math.max(simTEnd, 0.1);\r\n        const maxPos = 5;\r\n        const maxVel = simAccel * tMax;\r\n        const maxAcc = Math.max(simAccel, 0.1);\r\n\r\n        \/\/ Helper: convierte valor f\u00edsico a coordenada canvas\r\n        function toX(ti) { return m + (ti \/ tMax) * plotW; }\r\n        function toY(val, maxVal) { return (H - padB) - (val \/ Math.max(maxVal, 0.001)) * plotH; }\r\n\r\n        \/\/ \u2014 Curva REAL (color oscuro s\u00f3lido) \u2014\r\n        ctx.strokeStyle = pdfColors[type]; ctx.lineWidth = 2.5; ctx.setLineDash([]);\r\n        ctx.beginPath();\r\n        const steps = 150;\r\n        for(let i = 0; i <= steps; i++) {\r\n            const ti = (simTEnd \/ steps) * i;\r\n            let val, maxVal;\r\n            if(type === 'pos')      { val = 0.5 * simAccel * ti * ti; maxVal = maxPos; }\r\n            else if(type === 'vel') { val = simAccel * ti;             maxVal = Math.max(maxVel, 0.1); }\r\n            else                   { val = simAccel;                   maxVal = maxAcc; }\r\n            const x = toX(ti); const y = toY(val, maxVal);\r\n            i === 0 ? ctx.moveTo(x, y) : ctx.lineTo(x, y);\r\n        }\r\n        ctx.stroke();\r\n\r\n        \/\/ \u2014 Curva PREDICCI\u00d3N (violeta oscuro, l\u00ednea discontinua) \u2014\r\n        const savedPred = JSON.parse(localStorage.getItem('mrua_pred') || '{}');\r\n        if(savedPred[type] && savedPred[type].length > 0) {\r\n            \/\/ Leer dimensiones guardadas al momento de predecir (canvas puede estar oculto ahora)\r\n            const savedDims = JSON.parse(localStorage.getItem('mrua_pred_dims') || '{}');\r\n            const origW = (savedDims[type] && savedDims[type].w > 50) ? savedDims[type].w : 400;\r\n            const origH = (savedDims[type] && savedDims[type].h > 50) ? savedDims[type].h : 220;\r\n\r\n            ctx.strokeStyle = pdfViolet; ctx.lineWidth = 2.5; ctx.setLineDash([8, 5]);\r\n            ctx.beginPath();\r\n            savedPred[type].forEach((p, i) => {\r\n                \/\/ Normalizar (0..1) y mapear al canvas PDF\r\n                const nx = (p.x - 30) \/ (origW - 40);\r\n                const ny = (p.y - 10) \/ (origH - 20);\r\n                const x = m + nx * plotW;\r\n                const y = padT + ny * plotH;\r\n                i === 0 ? ctx.moveTo(x, y) : ctx.lineTo(x, y);\r\n            });\r\n            ctx.stroke();\r\n            ctx.setLineDash([]);\r\n\r\n            \/\/ Puntos sobre la curva de predicci\u00f3n\r\n            ctx.fillStyle = pdfViolet;\r\n            savedPred[type].forEach(p => {\r\n                const nx = (p.x - 30) \/ (origW - 40);\r\n                const ny = (p.y - 10) \/ (origH - 20);\r\n                const x = m + nx * plotW;\r\n                const y = padT + ny * plotH;\r\n                ctx.beginPath(); ctx.arc(x, y, 3.5, 0, Math.PI * 2); ctx.fill();\r\n            });\r\n        }\r\n\r\n        \/\/ Leyenda en la esquina superior derecha\r\n        const lx = W - padR - 110; const ly = padT + 8;\r\n        \/\/ Real\r\n        ctx.strokeStyle = pdfColors[type]; ctx.lineWidth = 2.5; ctx.setLineDash([]);\r\n        ctx.beginPath(); ctx.moveTo(lx, ly); ctx.lineTo(lx + 22, ly); ctx.stroke();\r\n        ctx.fillStyle = '#333'; ctx.font = '10px sans-serif'; ctx.fillText('Real', lx + 26, ly + 4);\r\n        \/\/ Predicci\u00f3n\r\n        ctx.strokeStyle = pdfViolet; ctx.lineWidth = 2; ctx.setLineDash([6, 4]);\r\n        ctx.beginPath(); ctx.moveTo(lx, ly + 14); ctx.lineTo(lx + 22, ly + 14); ctx.stroke();\r\n        ctx.setLineDash([]);\r\n        ctx.fillStyle = '#333'; ctx.fillText('Predicci\u00f3n', lx + 26, ly + 18);\r\n\r\n        return tmp.toDataURL('image\/png');\r\n    }\r\n\r\n    function generatePDF() {\r\n        if(typeof window.jspdf === 'undefined') { alert('Error: Librer\u00eda PDF no cargada.'); return; }\r\n        const { jsPDF } = window.jspdf;\r\n        const doc = new jsPDF();\r\n\r\n        \/\/ \u2014 Encabezado \u2014\r\n        doc.setFillColor(8, 14, 30); doc.rect(0, 0, 210, 28, 'F');\r\n        doc.setTextColor(255, 255, 255);\r\n        doc.setFont('helvetica', 'bold'); doc.setFontSize(13);\r\n        doc.text('Informe de Laboratorio Remoto \u2014 MRUA', 20, 12);\r\n        doc.setFont('helvetica', 'normal'); doc.setFontSize(9);\r\n        doc.text('Facultad de Ingenier\u00eda y Ciencias Agropecuarias \u00b7 UNSL', 20, 20);\r\n        doc.setTextColor(0, 0, 0);\r\n\r\n        \/\/ \u2014 Datos del estudiante \u2014\r\n        doc.setFillColor(240, 244, 255); doc.rect(14, 32, 182, 20, 'F');\r\n        doc.setFont('helvetica', 'bold'); doc.setFontSize(10);\r\n        doc.text('Estudiante:', 18, 40);\r\n        doc.setFont('helvetica', 'normal');\r\n        doc.text($('stu-name').value || 'No indicado', 50, 40);\r\n        doc.setFont('helvetica', 'bold');\r\n        doc.text('Carrera:', 18, 47);\r\n        doc.setFont('helvetica', 'normal');\r\n        doc.text($('stu-career').value || 'No indicada', 42, 47);\r\n        doc.setFont('helvetica', 'normal'); doc.setFontSize(9); doc.setTextColor(100);\r\n        doc.text(`Fecha: ${new Date().toLocaleDateString()}`, 160, 47, { align: 'right' });\r\n        doc.setTextColor(0);\r\n\r\n        \/\/ \u2014 Secci\u00f3n: An\u00e1lisis y Reflexi\u00f3n \u2014\r\n        let y = 60;\r\n        doc.setFont('helvetica', 'bold'); doc.setFontSize(11);\r\n        doc.setTextColor(30, 60, 130);\r\n        doc.text('An\u00e1lisis y Reflexi\u00f3n', 20, y); y += 6;\r\n        doc.setTextColor(0);\r\n        doc.setLineWidth(0.5); doc.setDrawColor(30, 60, 130);\r\n        doc.line(20, y, 190, y); y += 6;\r\n\r\n        const answers = [$('q1').value, $('q2').value, $('q3').value];\r\n        const questions = [\r\n            '1. Comparaci\u00f3n entre predicci\u00f3n y experiencia:',\r\n            '2. Influencia del \u00e1ngulo del plano en la aceleraci\u00f3n:',\r\n            '3. Precisi\u00f3n y validez de la experiencia:'\r\n        ];\r\n        doc.setFontSize(10);\r\n        answers.forEach((ans, i) => {\r\n            doc.setFont('helvetica', 'bold'); doc.setTextColor(50, 50, 50);\r\n            doc.text(questions[i], 20, y); y += 5;\r\n            doc.setFont('helvetica', 'normal'); doc.setTextColor(80, 80, 80);\r\n            const splitText = doc.splitTextToSize(ans || 'Sin respuesta.', 168);\r\n            doc.text(splitText, 22, y); y += splitText.length * 5 + 4;\r\n            if(y > 250) { doc.addPage(); y = 20; }\r\n        });\r\n\r\n        \/\/ \u2014 Secci\u00f3n: Gr\u00e1ficas \u2014\r\n        if(y > 155) { doc.addPage(); y = 20; }\r\n        doc.setFont('helvetica', 'bold'); doc.setFontSize(11);\r\n        doc.setTextColor(30, 60, 130);\r\n        doc.text('Gr\u00e1ficas Cinem\u00e1ticas', 20, y); y += 4;\r\n        doc.setLineWidth(0.5); doc.line(20, y, 190, y); y += 3;\r\n\r\n        \/\/ Leyenda global dibujada con lineas (Unicode no soportado por jsPDF\/Helvetica)\r\n        const ly0 = y + 5;\r\n        doc.setDrawColor(80, 80, 80); doc.setLineWidth(1.2); doc.setLineDashPattern([], 0);\r\n        doc.line(22, ly0, 36, ly0);\r\n        doc.setFont('helvetica', 'normal'); doc.setFontSize(8); doc.setTextColor(60);\r\n        doc.text('Curva real', 39, ly0 + 1);\r\n        doc.setDrawColor(109, 40, 217); doc.setLineWidth(1.2); doc.setLineDashPattern([2, 1.5], 0);\r\n        doc.line(80, ly0, 94, ly0);\r\n        doc.setLineDashPattern([], 0);\r\n        doc.setTextColor(109, 40, 217);\r\n        doc.text('Prediccion del estudiante', 97, ly0 + 1);\r\n        doc.setTextColor(0);\r\n        y += 11;\r\n\r\n        \/\/ Titulos de las graficas\r\n        const titles = ['Posici\u00f3n vs Tiempo', 'Velocidad vs Tiempo', 'Aceleraci\u00f3n vs Tiempo'];\r\n        const imgW = 57; const imgH = 45; const gap = 3;\r\n        const startX = 20;\r\n\r\n        \/\/ Generar los tres canvas PDF con fondo blanco\r\n        try {\r\n            ['pos', 'vel', 'acc'].forEach((type, i) => {\r\n                const imgData = buildPdfCanvas(type);\r\n                const x = startX + i * (imgW + gap);\r\n\r\n                \/\/ Borde sutil alrededor de cada gr\u00e1fica\r\n                doc.setDrawColor(200); doc.setLineWidth(0.3);\r\n                doc.rect(x - 0.5, y - 0.5, imgW + 1, imgH + 1);\r\n\r\n                doc.addImage(imgData, 'PNG', x, y, imgW, imgH);\r\n\r\n                \/\/ T\u00edtulo debajo\r\n                doc.setFont('helvetica', 'bold'); doc.setFontSize(7.5);\r\n                doc.setTextColor(50);\r\n                doc.text(titles[i], x + imgW \/ 2, y + imgH + 4, { align: 'center' });\r\n            });\r\n        } catch(e) {\r\n            console.error('Error generando gr\u00e1ficas para PDF:', e);\r\n            doc.setTextColor(200, 0, 0);\r\n            doc.text('Error al capturar las gr\u00e1ficas.', 20, y + 20);\r\n        }\r\n\r\n        doc.setTextColor(0);\r\n        doc.save('Informe_MRUA.pdf');\r\n    }\r\n\r\n    function openModal(url) { $('mrua-iframe').src = url; $('mrua-modal').classList.add('show'); }\r\n    function closeModal() { $('mrua-modal').classList.remove('show'); $('mrua-iframe').src = 'about:blank'; }\r\n\r\n    function init() {\r\n        setTimeout(() => $('mrua-loader').classList.add('hide'), 800);\r\n        document.querySelectorAll('.mrua-nav-btn').forEach(btn => btn.addEventListener('click', () => navTo(btn.dataset.view)));\r\n        ['pos', 'vel', 'acc'].forEach(type => {\r\n            const c = $(`c-pred-${type}`);\r\n            c.addEventListener('click', (e) => addPoint(e, type));\r\n            c.addEventListener('touchend', (e) => {\r\n                e.preventDefault();\r\n                const touch = e.changedTouches[0];\r\n                addPoint({ clientX: touch.clientX, clientY: touch.clientY, target: e.target }, type);\r\n            });\r\n        });\r\n        window.addEventListener('scroll', () => $('mrua-back-top').classList.toggle('show', window.scrollY > 400));\r\n    }\r\n\r\n\r\n    \/\/ ===== LAZY YOUTUBE LOADER =====\r\n    function initLazyYT() {\r\n        document.querySelectorAll('.yt-lazy').forEach(wrap => {\r\n            if(wrap.dataset.init) return;\r\n            wrap.dataset.init = '1';\r\n            wrap.addEventListener('click', () => {\r\n                const id = wrap.dataset.id;\r\n                const iframe = document.createElement('iframe');\r\n                iframe.src = 'https:\/\/www.youtube.com\/embed\/' + id + '?autoplay=1&rel=0';\r\n                iframe.allow = 'accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture';\r\n                iframe.allowFullscreen = true;\r\n                \/\/ Ocultar thumbnail y bot\u00f3n\r\n                wrap.querySelectorAll('img, .yt-play').forEach(el => el.style.display = 'none');\r\n                wrap.appendChild(iframe);\r\n            });\r\n        });\r\n    }\r\n\r\n    if(document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', init); } else { init(); }\r\n\r\n    return { navTo, clearCanvas, savePredictions, startSim, openModal, closeModal, autoSaveText, generatePDF };\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Iniciando Laboratorio&#8230; Inicio Gu\u00eda Predicci\u00f3n Simulaci\u00f3n An\u00e1lisis Cuestionario Laboratorio Remoto de F\u00edsica Movimiento Rectil\u00edneoUniformemente Acelerado Comprensi\u00f3n de gr\u00e1ficas en cinem\u00e1tica mediante la simulaci\u00f3n de un&hellip;<\/p>\n","protected":false},"author":7,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-7420","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>F1_MRUA_simulacion - F\u00edsica 2<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/f1_mrua_simulacion\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"F1_MRUA_simulacion - F\u00edsica 2\" \/>\n<meta property=\"og:description\" content=\"Iniciando Laboratorio&#8230; Inicio Gu\u00eda Predicci\u00f3n Simulaci\u00f3n An\u00e1lisis Cuestionario Laboratorio Remoto de F\u00edsica Movimiento Rectil\u00edneoUniformemente Acelerado Comprensi\u00f3n de gr\u00e1ficas en cinem\u00e1tica mediante la simulaci\u00f3n de un&hellip;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/f1_mrua_simulacion\/\" \/>\n<meta property=\"og:site_name\" content=\"F\u00edsica 2\" \/>\n<meta property=\"article:modified_time\" content=\"2026-05-17T01:21:57+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/img.youtube.com\/vi\/PiASU3kB_sE\/maxresdefault.jpg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data1\" content=\"7 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/index.php\\\/f1_mrua_simulacion\\\/\",\"url\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/index.php\\\/f1_mrua_simulacion\\\/\",\"name\":\"F1_MRUA_simulacion - F\u00edsica 2\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/index.php\\\/f1_mrua_simulacion\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/index.php\\\/f1_mrua_simulacion\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/img.youtube.com\\\/vi\\\/PiASU3kB_sE\\\/maxresdefault.jpg\",\"datePublished\":\"2026-05-15T13:56:37+00:00\",\"dateModified\":\"2026-05-17T01:21:57+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/index.php\\\/f1_mrua_simulacion\\\/#breadcrumb\"},\"inLanguage\":\"es-AR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/index.php\\\/f1_mrua_simulacion\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es-AR\",\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/index.php\\\/f1_mrua_simulacion\\\/#primaryimage\",\"url\":\"https:\\\/\\\/img.youtube.com\\\/vi\\\/PiASU3kB_sE\\\/maxresdefault.jpg\",\"contentUrl\":\"https:\\\/\\\/img.youtube.com\\\/vi\\\/PiASU3kB_sE\\\/maxresdefault.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/index.php\\\/f1_mrua_simulacion\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Inicio\",\"item\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"F1_MRUA_simulacion\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/#website\",\"url\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/\",\"name\":\"F\u00edsica 2\",\"description\":\"FICA - UNSL\",\"publisher\":{\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es-AR\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/#organization\",\"name\":\"SAC- Secretar\u00eda General FICA\",\"url\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es-AR\",\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/wp-content\\\/uploads\\\/2021\\\/11\\\/SG-Logo.png\",\"contentUrl\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/wp-content\\\/uploads\\\/2021\\\/11\\\/SG-Logo.png\",\"width\":4483,\"height\":1231,\"caption\":\"SAC- Secretar\u00eda General FICA\"},\"image\":{\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"F1_MRUA_simulacion - F\u00edsica 2","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/f1_mrua_simulacion\/","og_locale":"es_ES","og_type":"article","og_title":"F1_MRUA_simulacion - F\u00edsica 2","og_description":"Iniciando Laboratorio&#8230; Inicio Gu\u00eda Predicci\u00f3n Simulaci\u00f3n An\u00e1lisis Cuestionario Laboratorio Remoto de F\u00edsica Movimiento Rectil\u00edneoUniformemente Acelerado Comprensi\u00f3n de gr\u00e1ficas en cinem\u00e1tica mediante la simulaci\u00f3n de un&hellip;","og_url":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/f1_mrua_simulacion\/","og_site_name":"F\u00edsica 2","article_modified_time":"2026-05-17T01:21:57+00:00","og_image":[{"url":"https:\/\/img.youtube.com\/vi\/PiASU3kB_sE\/maxresdefault.jpg","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Tiempo de lectura":"7 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/f1_mrua_simulacion\/","url":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/f1_mrua_simulacion\/","name":"F1_MRUA_simulacion - F\u00edsica 2","isPartOf":{"@id":"https:\/\/fisica2.fica.unsl.edu.ar\/#website"},"primaryImageOfPage":{"@id":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/f1_mrua_simulacion\/#primaryimage"},"image":{"@id":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/f1_mrua_simulacion\/#primaryimage"},"thumbnailUrl":"https:\/\/img.youtube.com\/vi\/PiASU3kB_sE\/maxresdefault.jpg","datePublished":"2026-05-15T13:56:37+00:00","dateModified":"2026-05-17T01:21:57+00:00","breadcrumb":{"@id":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/f1_mrua_simulacion\/#breadcrumb"},"inLanguage":"es-AR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/f1_mrua_simulacion\/"]}]},{"@type":"ImageObject","inLanguage":"es-AR","@id":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/f1_mrua_simulacion\/#primaryimage","url":"https:\/\/img.youtube.com\/vi\/PiASU3kB_sE\/maxresdefault.jpg","contentUrl":"https:\/\/img.youtube.com\/vi\/PiASU3kB_sE\/maxresdefault.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/f1_mrua_simulacion\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Inicio","item":"https:\/\/fisica2.fica.unsl.edu.ar\/"},{"@type":"ListItem","position":2,"name":"F1_MRUA_simulacion"}]},{"@type":"WebSite","@id":"https:\/\/fisica2.fica.unsl.edu.ar\/#website","url":"https:\/\/fisica2.fica.unsl.edu.ar\/","name":"F\u00edsica 2","description":"FICA - UNSL","publisher":{"@id":"https:\/\/fisica2.fica.unsl.edu.ar\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/fisica2.fica.unsl.edu.ar\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es-AR"},{"@type":"Organization","@id":"https:\/\/fisica2.fica.unsl.edu.ar\/#organization","name":"SAC- Secretar\u00eda General FICA","url":"https:\/\/fisica2.fica.unsl.edu.ar\/","logo":{"@type":"ImageObject","inLanguage":"es-AR","@id":"https:\/\/fisica2.fica.unsl.edu.ar\/#\/schema\/logo\/image\/","url":"https:\/\/fisica2.fica.unsl.edu.ar\/wp-content\/uploads\/2021\/11\/SG-Logo.png","contentUrl":"https:\/\/fisica2.fica.unsl.edu.ar\/wp-content\/uploads\/2021\/11\/SG-Logo.png","width":4483,"height":1231,"caption":"SAC- Secretar\u00eda General FICA"},"image":{"@id":"https:\/\/fisica2.fica.unsl.edu.ar\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/pages\/7420","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/comments?post=7420"}],"version-history":[{"count":76,"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/pages\/7420\/revisions"}],"predecessor-version":[{"id":7530,"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/pages\/7420\/revisions\/7530"}],"wp:attachment":[{"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/media?parent=7420"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}