*{box-sizing:border-box;margin:0;padding:0}
:root{--or:#f38634;--ink:#141414;--rd:#e10600;--bg:#0f0f10;--card:#1c1c1f;--card2:#252528;--tx:#f2f2f2;--mut:#a5a5ab;--ok:#22c55e;--lg:#4a9be0}
html,body{background:var(--bg)}
body{font-family:-apple-system,"Segoe UI",Roboto,Inter,Arial,sans-serif;color:var(--tx);max-width:480px;margin:0 auto;min-height:100vh;-webkit-tap-highlight-color:transparent}
button,input,select,textarea{font:inherit;color:inherit}
header.top{background:linear-gradient(135deg,var(--rd),var(--or));padding:22px 18px 18px;padding-top:max(22px,env(safe-area-inset-top))}
header.top small{opacity:.88;font-size:11.5px;letter-spacing:1px;text-transform:uppercase;font-weight:600}
header.top h1{font-size:22px;margin-top:4px}
header.top p{font-size:13px;margin-top:6px;opacity:.93}
.wk{display:flex;align-items:center;gap:8px;margin-top:12px}
.wk button{background:rgba(0,0,0,.22);border:0;border-radius:8px;width:32px;height:30px;font-size:16px;font-weight:700}
.wk button:disabled{opacity:.35}
.wk span{font-size:13px;font-weight:700;flex:1;text-align:center;background:rgba(0,0,0,.18);border-radius:8px;padding:6px}
.tabs{display:flex;gap:6px;padding:12px 14px;background:#18181a;position:sticky;top:0;z-index:5}
.tab{flex:1;text-align:center;padding:8px 0 6px;border-radius:10px;background:var(--card2);font-size:13px;font-weight:700;border:0;position:relative}
.tab small{display:block;font-size:9.5px;font-weight:600;color:var(--mut);margin-top:1px}
.tab.lig small{color:#8fc3f0}
.tab.on{background:var(--or);color:var(--ink)}.tab.on small{color:var(--ink)}
.tab.done::after{content:"✓";position:absolute;top:-5px;right:-3px;background:var(--ok);color:#fff;border-radius:50%;width:16px;height:16px;font-size:10px;line-height:16px}
.sec{padding:14px 16px 6px}
.sec h2{font-size:16px;margin-bottom:3px}
.meta{font-size:12px;color:var(--mut);margin-bottom:10px}
.tag{display:inline-block;font-size:10px;font-weight:800;padding:2px 7px;border-radius:5px;vertical-align:middle;margin-left:6px;letter-spacing:.3px}
.tag.lig{background:var(--lg);color:#fff}.tag.fz{background:#3a2016;color:#ffb08f}
.note{background:#26211a;border-left:3px solid var(--or);border-radius:8px;padding:10px 12px;font-size:12.5px;color:#ddd;margin:4px 0 12px;line-height:1.4}
.note.blue{background:#16212c;border-left-color:var(--lg)}
details.note summary{cursor:pointer;font-weight:700;list-style:none}
details.note summary::after{content:" ▾";color:var(--or)}
details.note ol{padding-left:18px;margin-top:6px}
.bar{height:8px;background:#2c2c30;border-radius:6px;overflow:hidden;margin:6px 0 12px}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--rd),var(--or))}
.ex{background:var(--card);border-radius:14px;padding:12px;margin-bottom:10px;border:1px solid transparent}
.ex.ok{border-color:#1f5f37;background:#17221b}
.ex-top{display:flex;gap:11px;align-items:flex-start}
.num{width:30px;height:30px;border-radius:50%;background:#2c2c30;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:var(--or);flex-shrink:0}
.ex-main{flex:1;min-width:0}
.ex-main b{font-size:14.5px;display:block;line-height:1.25}
.ss{display:inline-block;background:var(--or);color:var(--ink);font-size:10px;font-weight:800;padding:1px 5px;border-radius:4px;margin-right:4px;vertical-align:1px}
.pres{font-size:12.5px;color:#ffcfb8;margin-top:3px;font-weight:600}
.tip{font-size:12px;color:var(--mut);margin-top:5px;line-height:1.38}
.nota{font-size:12px;color:#ffb08f;margin-top:3px}
.chk{width:32px;height:32px;border-radius:9px;border:2px solid #4a4a50;background:transparent;flex-shrink:0;color:#fff;font-size:18px;font-weight:800}
.chk.on{background:var(--ok);border-color:var(--ok)}
.ex-actions{display:flex;gap:8px;align-items:center;margin-top:10px;padding-left:41px}
.peso{display:flex;align-items:center;background:var(--card2);border-radius:9px;padding:0 8px;height:36px;flex:1;max-width:150px}
.peso input{background:transparent;border:0;width:100%;font-size:15px;font-weight:700;outline:none}
.peso span{font-size:11.5px;color:var(--mut)}
.alt-btn{background:transparent;border:1px solid #3a3a40;border-radius:9px;height:36px;padding:0 12px;font-size:12.5px;font-weight:600;color:#ddd;margin-left:auto}
.btn{display:block;width:calc(100% - 32px);margin:8px 16px 18px;background:var(--or);color:#fff;text-align:center;padding:14px;border-radius:12px;font-weight:800;border:0;font-size:15px;color:var(--ink)}
.btn.done{background:var(--ok);color:#fff}
.btn.ghost{background:var(--card2);color:var(--tx);width:100%;margin:12px 0 0}
.btn:disabled{opacity:.5}
.nav{position:sticky;bottom:0;display:flex;background:#141416;border-top:1px solid #26262a;padding-bottom:env(safe-area-inset-bottom)}
.nav a{flex:1;text-align:center;padding:10px 0 9px;font-size:11.5px;color:var(--mut);text-decoration:none;font-weight:600}
.nav a b{display:block;font-size:19px;margin-bottom:1px}
.nav a.on{color:var(--or)}
.pad{height:8px}
/* login */
.login{min-height:100vh;display:flex;flex-direction:column}
.login .hero{background:radial-gradient(120% 90% at 50% 0%,#3a1a08 0%,#0f0f10 70%);padding:52px 22px 26px;text-align:center;border-bottom:3px solid var(--or)}
.login .hero img{width:100%;max-width:340px;height:auto;display:block;margin:0 auto}
.login .hero .brand-sub{margin-top:12px;color:#d8d8d8}
.login .brand{font-size:30px;font-weight:900;letter-spacing:1.5px}
.login .brand-sub{font-size:11px;letter-spacing:4px;font-weight:700;margin-top:4px;opacity:.9}
.login form{padding:22px 22px 10px}
.login h2{font-size:20px;margin-bottom:4px}
.login p.m{color:var(--mut);font-size:13px;margin-bottom:18px}
label.f{display:block;font-size:12px;color:var(--mut);font-weight:600;margin:12px 0 6px}
input.in,select.in,textarea.in{width:100%;background:var(--card);border:1px solid #2e2e33;border-radius:11px;padding:13px 14px;font-size:15px;outline:none}
input.in:focus,select.in:focus,textarea.in:focus{border-color:var(--or)}
.err{color:#ff7b7b;font-size:13px;margin-top:10px;min-height:18px}
.demo{margin:4px 22px 24px;background:var(--card);border-radius:12px;padding:12px 14px;font-size:12.5px;color:#ccc;line-height:1.55}
.demo b{color:#fff}.demo button{background:var(--card2);border:0;border-radius:8px;padding:6px 10px;font-size:12px;font-weight:700;margin:6px 6px 0 0;color:#ffb08f}
/* instructor */
.card{background:var(--card);border-radius:14px;padding:13px;margin-bottom:10px}
.srow{display:flex;gap:11px;align-items:center}
.av{width:40px;height:40px;border-radius:50%;background:var(--or);display:flex;align-items:center;justify-content:center;font-weight:800;color:var(--ink);flex-shrink:0;font-size:14px}
.av.g{background:#3a3a40}
.srow b{font-size:14.5px;display:block}.srow span{font-size:12px;color:var(--mut)}
.plan-pill{font-size:12px;margin-top:9px;background:var(--card2);border-radius:9px;padding:8px 10px;color:#ddd}
.plan-pill.none{color:var(--mut);font-style:italic}
.small-btn{background:var(--or);color:var(--ink);border:0;border-radius:9px;padding:9px 12px;font-size:12.5px;font-weight:700;margin-top:10px;width:100%}
.tpl{display:block;background:var(--card);border:2px solid #2a2a2e;border-radius:13px;padding:12px;margin-bottom:9px;cursor:pointer}
.tpl input{display:none}
.tpl.on{border-color:var(--or);background:#241a15}
.tpl small{font-size:10.5px;color:var(--or);font-weight:800;letter-spacing:1px;text-transform:uppercase}
.tpl b{display:block;font-size:14.5px;margin:2px 0}
.tpl span{font-size:12px;color:var(--mut)}
.week-mini{display:flex;gap:4px;margin-top:7px}.week-mini i{flex:1;font-style:normal;font-size:9.5px;text-align:center;background:#2c2c30;border-radius:5px;padding:3px 1px;color:#ddd}.week-mini i.lig{background:#1d3347;color:#9cd0ff}
/* progreso */
.kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.kpi{background:var(--card);border-radius:14px;padding:12px}
.kpi b{font-size:24px;display:block;color:#fff}.kpi span{font-size:11.5px;color:var(--mut)}
.dots{display:flex;gap:6px;margin-top:8px}.dots i{flex:1;font-style:normal;text-align:center;font-size:11px;font-weight:700;padding:7px 0;border-radius:8px;background:#2c2c30;color:var(--mut)}.dots i.on{background:var(--ok);color:#fff}
.lift{background:var(--card);border-radius:12px;padding:11px 12px;margin-bottom:8px}
.lift-h{display:flex;justify-content:space-between;font-size:13.5px;font-weight:700}
.lift-h em{font-style:normal;color:var(--ok);font-size:12.5px}
.spark{display:flex;align-items:flex-end;gap:5px;height:44px;margin-top:8px}
.spark div{flex:1;background:linear-gradient(0deg,var(--rd),var(--or));border-radius:4px 4px 0 0;position:relative;min-height:4px}
.spark div span{position:absolute;top:-15px;left:0;right:0;text-align:center;font-size:9.5px;color:#ddd}
.spark-l{display:flex;gap:5px;font-size:9.5px;color:var(--mut);margin-top:3px}.spark-l span{flex:1;text-align:center}
.hist{font-size:12.5px;color:#ddd;padding:9px 0;border-bottom:1px solid #26262a;display:flex;justify-content:space-between}
.hist span{color:var(--mut)}
.empty{text-align:center;color:var(--mut);padding:30px 20px;font-size:13.5px;line-height:1.5}
h3.st{font-size:12px;text-transform:uppercase;letter-spacing:.8px;color:var(--or);margin:16px 0 8px}
/* sheet & toast */
.sheet{position:fixed;inset:0;z-index:50}.sheet.hidden{display:none}
.sheet-bg{position:absolute;inset:0;background:rgba(0,0,0,.6)}
.sheet-card{position:absolute;left:0;right:0;bottom:0;max-width:480px;margin:0 auto;background:#18181b;border-radius:20px 20px 0 0;padding:10px 18px calc(18px + env(safe-area-inset-bottom));max-height:85vh;overflow:auto}
.sheet-grip{width:40px;height:4px;border-radius:3px;background:#444;margin:0 auto 12px}
.sheet h3{font-size:16px;margin-bottom:2px}.sheet .meta{margin-bottom:12px}
.alt{background:var(--card);border-radius:12px;padding:11px 12px;margin-bottom:8px}
.alt small{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.8px;color:var(--or)}
.alt div{font-size:13.5px;margin-top:3px}.alt.na div{color:var(--mut);font-style:italic}
.toast{pointer-events:none;position:fixed;left:50%;bottom:84px;transform:translateX(-50%);background:#fff;color:#111;padding:11px 16px;border-radius:12px;font-size:13.5px;font-weight:700;z-index:60;box-shadow:0 6px 24px rgba(0,0,0,.4);max-width:90%;text-align:center}
.toast.hidden{display:none}

.hlogo{display:block;height:50px;width:auto;margin:0 0 8px -2px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.35))}