:root{--t-ink:#1e3a5f;--t-accent:#f59e0b;--t-success:#16a34a;--t-error:#dc2626;--t-light:#f1f5f9;--t-border:#e2e8f0;--t-blue:#2563eb}*{box-sizing:border-box;margin:0;padding:0}.tpo-wrapper{background:var(--t-light);min-height:100vh;padding-bottom:3rem;font-family:Segoe UI,system-ui,sans-serif}.tpo-topbar{justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto;padding:1.25rem 4% .9rem;display:flex}.btn-back{color:#0f172a;border:1px solid var(--t-border);background:#fff;border-radius:99px;align-items:center;gap:.5rem;padding:.55rem 1.1rem;font-size:.88rem;font-weight:600;text-decoration:none;transition:all .2s;display:inline-flex;box-shadow:0 2px 4px #0000000a}.btn-back:hover{background:#f8fafc;transform:translateY(-1px)}.tpo-header{text-align:center;max-width:1200px;margin:0 auto;padding:0 4% 1.1rem}.tpo-header h1{color:var(--t-ink);letter-spacing:-.02em;margin-bottom:.3rem;font-size:2rem;font-weight:800}.tpo-header p{color:#64748b;max-width:540px;margin:0 auto;font-size:.95rem}.tpo-tabs{flex-wrap:wrap;gap:.65rem;max-width:1200px;margin:0 auto .9rem;padding:0 4%;display:flex}.tab-btn{border:2px solid var(--t-border);cursor:pointer;color:#64748b;text-align:center;background:#fff;border-radius:12px;flex:1;min-width:140px;padding:.65rem .85rem;font-size:.86rem;font-weight:600;line-height:1.35;transition:all .2s}.tab-btn:hover{border-color:var(--t-blue);color:var(--t-blue)}.tab-btn.active{background:var(--t-ink);border-color:var(--t-ink);color:#fff;box-shadow:0 4px 12px #1e3a5f40}.tab-emoji{margin-bottom:.1rem;font-size:1.15rem;display:block}.tpo-config{flex-wrap:wrap;align-items:center;gap:.75rem;max-width:1200px;margin:0 auto .9rem;padding:0 4%;display:flex}.cfg-label{text-transform:uppercase;letter-spacing:.06em;color:#64748b;font-size:.73rem;font-weight:700}.cfg-select{border:1px solid var(--t-border);color:#0f172a;cursor:pointer;background:#fff;border-radius:8px;outline:none;padding:.42rem .8rem;font-size:.86rem;transition:border-color .2s}.cfg-select:focus{border-color:var(--t-blue)}.seg-ctrl{background:var(--t-light);border:1px solid var(--t-border);border-radius:8px;display:flex;overflow:hidden}.seg-btn{cursor:pointer;color:#64748b;background:0 0;border:none;padding:.4rem .9rem;font-size:.82rem;font-weight:600;transition:all .2s}.seg-btn.active{background:var(--t-ink);color:#fff}.seg-btn:hover:not(.active){background:#fff}.cfg-icon-btn{border:1px solid var(--t-border);cursor:pointer;color:#64748b;background:#fff;border-radius:8px;padding:.4rem .85rem;font-size:.82rem;font-weight:600;transition:all .2s}.cfg-icon-btn:hover{border-color:var(--t-blue);color:var(--t-blue)}.cfg-icon-btn.snd-on{background:var(--t-ink);border-color:var(--t-ink);color:#fff}.tpo-content{max-width:1200px;margin:0 auto;padding:0 4%}.exercise-area{align-items:stretch;gap:1.25rem;margin-bottom:1rem;display:flex}.ex-left-panel{flex-direction:column;flex-shrink:0;width:28%;min-width:250px;max-width:300px;display:flex}.ex-left-card{border:1px solid var(--t-border);background:#fff;border-radius:16px;flex-direction:column;flex:1;gap:.6rem;padding:1.1rem 1rem;display:flex;overflow:hidden;box-shadow:0 4px 12px #0000000a}.ex-exnum{text-transform:uppercase;letter-spacing:.07em;color:#94a3b8;flex-shrink:0;font-size:.72rem;font-weight:700}.ex-qdivider{border:none;border-top:1px solid var(--t-border);flex-shrink:0;margin:0}#panel-m1,#panel-23{flex-direction:column;flex:1;gap:.6rem;min-height:0;display:none}.ex-qlabel{color:var(--t-ink);flex-shrink:0;font-size:.82rem;font-weight:700}.leer-opts-list{flex-direction:column;flex:1;gap:.5rem;display:flex;overflow-y:auto}.leer-opt{border:2px solid var(--t-border);cursor:pointer;text-align:left;background:#fff;border-radius:10px;flex-shrink:0;align-items:center;gap:.55rem;width:100%;padding:.65rem .8rem;transition:all .2s;display:flex}.leer-opt:hover:not(:disabled){border-color:var(--t-blue);background:#eff6ff}.leer-opt.correct{border-color:var(--t-success);background:#f0fdf4}.leer-opt.wrong{border-color:var(--t-error);background:#fef2f2}.leer-opt:disabled{cursor:default}.opt-inciso{color:var(--t-blue);flex-shrink:0;min-width:1.3rem;font-family:Segoe UI,sans-serif;font-size:.76rem;font-weight:900}.leer-opt.correct .opt-inciso{color:var(--t-success)}.leer-opt.wrong .opt-inciso{color:var(--t-error)}.opt-val{color:var(--t-ink);font-family:Courier New,monospace;font-size:1.35rem;font-weight:800}.leer-opt.correct .opt-val{color:var(--t-success)}.leer-opt.wrong .opt-val{color:var(--t-error)}#prob-text{color:var(--t-ink);flex-direction:column;flex:1;font-size:.88rem;font-weight:500;line-height:1.65;display:flex;overflow-y:auto}#prob-text .ptime{color:var(--t-blue);background:#eff6ff;border-radius:6px;margin:.1rem;padding:.1rem .5rem;font-family:Courier New,monospace;font-size:1.1rem;font-weight:800;display:inline-block}#prob-text .pact-row{color:var(--t-ink);flex-wrap:wrap;align-items:center;gap:.4rem;margin-bottom:.3rem;font-size:.88rem;font-weight:700;display:flex}#prob-text .pact-emoji{font-size:1.3rem}.m2-instr{text-align:center;color:var(--t-ink);margin-bottom:.5rem;font-size:1.76rem;font-weight:800;line-height:1.25}.m2-time-wrap{flex:1;justify-content:center;align-items:center;display:flex}#prob-text .m2-time-wrap .ptime{white-space:nowrap;padding:.6rem 1.2rem;font-size:2.2rem}.m3-content{margin-bottom:auto}.digital-readout-panel{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.8rem;display:flex}.action-panel-23{flex-direction:column;flex:none;gap:.6rem;display:flex}.btn-submit{background:var(--t-blue);color:#fff;cursor:pointer;border:none;border-radius:10px;flex-shrink:0;width:100%;padding:.75rem 1rem;font-size:.95rem;font-weight:700;transition:all .2s;box-shadow:0 4px 10px #2563eb4d}.btn-submit:hover:not(:disabled){background:#1d4ed8;transform:translateY(-1px)}.btn-submit:disabled{opacity:.4;cursor:not-allowed;transform:none}.feedback-msg{text-align:center;border-radius:10px;flex-shrink:0;width:100%;padding:.6rem .8rem;font-size:.9rem;font-weight:600;display:none}.feedback-msg.ok{color:var(--t-success);background:#f0fdf4;border:1px solid #86efac;display:block}.feedback-msg.err{color:var(--t-error);background:#fef2f2;border:1px solid #fca5a5;display:block}#feedback-m1,#feedback-23{padding:.8rem .7rem;font-size:1.35rem;line-height:1.4}.tpo-hint{color:#92400e;text-align:center;background:#fffbeb;border:1px solid #fde68a;border-radius:10px;flex-shrink:0;padding:.55rem .8rem;font-size:.8rem;display:none}.tpo-hint.show{display:block}.btn-next-leer{background:var(--t-success);color:#fff;cursor:pointer;text-align:center;border:none;border-radius:10px;flex-shrink:0;width:100%;margin-top:auto;padding:.7rem 1rem;font-size:.9rem;font-weight:700;transition:all .2s;display:none;box-shadow:0 4px 10px #16a34a4d}.btn-next-leer.show{display:block}.btn-next-leer:hover{background:#15803d;transform:translateY(-1px)}.btn-next-23{background:var(--t-success);color:#fff;cursor:pointer;text-align:center;border:none;border-radius:10px;flex-shrink:0;width:100%;margin-top:auto;padding:.7rem 1rem;font-size:.9rem;font-weight:700;transition:all .2s;display:none;box-shadow:0 4px 10px #16a34a4d}.btn-next-23.show{display:block}.btn-next-23:hover{background:#15803d;transform:translateY(-1px)}.ex-clocks-panel{flex-wrap:wrap;flex:1;justify-content:center;align-items:center;gap:1.25rem;min-width:0;display:flex}.exercise-area.mode-calcular .ex-clocks-panel{flex-wrap:nowrap}.clock-wrapper{flex-direction:column;align-items:center;gap:.55rem;display:flex}.clock-label{color:#64748b;text-transform:uppercase;letter-spacing:.06em;font-size:.78rem;font-weight:700}.clock-svg-wrap{filter:drop-shadow(0 8px 24px #1e3a5f33);justify-content:center;align-items:center;display:flex}#clock-demo,#clock-answer{width:400px;max-width:100%;height:400px;max-height:45vh;display:block}.exercise-area.mode-leer #clock-demo,.exercise-area.mode-construir #clock-answer{width:min(520px,72vw - 250px - 1.25rem);height:min(520px,72vw - 250px - 1.25rem);max-height:none}.exercise-area.mode-calcular #clock-demo,.exercise-area.mode-calcular #clock-answer{width:min(400px,36vw - 1.5rem);height:min(400px,36vw - 1.5rem)}.flash-ok{animation:.55s f-ok}.flash-err{animation:.4s f-err}@keyframes f-ok{0%{filter:drop-shadow(0 0 #16a34a00)}50%{filter:drop-shadow(0 0 22px #16a34ae6)}to{filter:drop-shadow(0 8px 24px #1e3a5f33)}}@keyframes f-err{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-5px)}80%{transform:translate(5px)}}.clock-arrow{color:var(--t-accent);align-self:center;font-size:2rem;font-weight:900;display:none}.clock-arrow.show{display:block}.digital-ro{background:var(--t-ink);color:#fff;border-radius:10px;align-items:baseline;gap:.3rem;padding:.38rem 1rem;font-family:Courier New,monospace;display:flex}.digi-time{letter-spacing:.06em;font-size:1.8rem;font-weight:800}.digi-ampm{opacity:.6;font-size:.8rem;font-weight:600}.handle-legend{color:#64748b;align-items:center;gap:.85rem;font-size:.72rem;font-weight:600;display:flex}.leg-dot{border-radius:50%;flex-shrink:0;width:10px;height:10px;display:inline-block}.tpo-progress-section{margin-top:1.25rem}.progress-card{border:1px solid var(--t-border);background:#fff;border-radius:12px;flex-direction:column;gap:.8rem;padding:1rem 1.2rem;display:flex}.progress-count{color:var(--t-ink);text-align:center;font-size:.86rem;font-weight:700}.progress-bar-wrap{background:var(--t-light);border-radius:99px;width:100%;height:8px;overflow:hidden}.progress-stats-row{justify-content:space-between;align-items:center;width:100%;display:flex}.progress-bar-fill{background:var(--t-blue);border-radius:99px;width:0%;height:100%;transition:width .4s}.score-display{color:var(--t-accent);align-items:center;gap:.3rem;font-size:1rem;font-weight:800;display:flex}.stars-display{font-size:1.1rem}#result-overlay{z-index:1000;background:#0f172ac7;justify-content:center;align-items:center;padding:1rem;display:none;position:fixed;inset:0}#result-overlay.show{display:flex}.result-card{text-align:center;background:#fff;border-radius:24px;width:100%;max-width:420px;padding:2.25rem;animation:.4s cubic-bezier(.175,.885,.32,1.275) pop-in;box-shadow:0 24px 64px #00000040}@keyframes pop-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.res-emoji{margin-bottom:.65rem;font-size:3.2rem}.res-title{color:var(--t-ink);margin-bottom:.35rem;font-size:1.6rem;font-weight:800}.res-sub{color:#64748b;margin-bottom:1.1rem;font-size:.92rem}.res-stars{margin-bottom:.55rem;font-size:2.1rem}.res-score{color:var(--t-accent);margin-bottom:1.6rem;font-size:1.25rem;font-weight:800}.res-actions{flex-wrap:wrap;justify-content:center;gap:.65rem;display:flex}.btn-again{background:var(--t-ink);color:#fff;cursor:pointer;border:none;border-radius:12px;padding:.8rem 1.6rem;font-size:.92rem;font-weight:700;transition:all .2s}.btn-again:hover{background:#152d4b;transform:translateY(-2px)}@media (width<=760px){.exercise-area{flex-direction:column}.ex-clocks-panel{flex-direction:column;order:1;flex-wrap:wrap!important}.ex-left-panel{order:2;width:100%;min-width:0;max-width:100%}.clock-arrow{display:none!important}.exercise-area.mode-leer #clock-demo,.exercise-area.mode-construir #clock-answer{width:min(420px,100vw - 2.5rem);height:min(420px,100vw - 2.5rem)}.exercise-area.mode-calcular #clock-demo,.exercise-area.mode-calcular #clock-answer{width:min(340px,100vw - 3rem);height:min(340px,100vw - 3rem)}.leer-opts-list{grid-template-columns:1fr 1fr;display:grid}.ex-left-card{max-height:none}.tpo-header h1{font-size:1.6rem}.tab-btn{min-width:100px;padding:.5rem .35rem;font-size:.78rem}}@media (width<=440px){.leer-opts-list{grid-template-columns:1fr}.tpo-config{gap:.45rem}}@media print{header,nav,footer,.tpo-topbar,.tpo-config,.tpo-tabs,.tpo-progress-section,#result-overlay{display:none!important}}