/* SIAR · Base — variables, reset, tipografía, layout general */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
--ink:#0d0d0d;--ink2:#3a3a3a;--ink3:#6b6b6b;--ink4:#a8a8a8;--ink5:#d0d0d0;
--bg:#ffffff;--bg2:#f7f7f7;--bg3:#f0f0f0;--bg4:#e8e8e8;
--line:#e2e2e2;--line2:#d0d0d0;
--cta:#1e3a5f;--cta-l:#eef2f8;--cta-b:#b8cce0;--cta-mid:#2d5280;
--ctx:#0f4a44;--ctx-l:#e8f5f3;--ctx-b:#a8d8d2;
--ins:#1a3a6b;--ins-l:#eef2fc;--ins-b:#b8cef0;
--opt:#6b4800;--opt-l:#fdf6e8;--opt-b:#e8c87a;
--input-bg:#fefefe;--input-border:#b8b8b8;--input-ph:#a8a8a8;
--chip-bg:#efefef;--chip-border:#d0d0d0;--chip-color:#3a3a3a;
--chip-sel-bg:#0d0d0d;--chip-sel-color:#ffffff;
--ex:#2d1f6b;--ex-l:#f0eefb;--ex-b:#c4b8f0;
--prev:#0a4a3a;--prev-l:#e8f5f0;--prev-b:#9ad4c4;
--miedo-act:#7a1a1a;--miedo-act-l:#fdf0f0;--miedo-act-b:#e8b8b8;
--miedo-acord:#5a0a1a;--miedo-acord-l:#f8e8ec;--miedo-acord-b:#d49aaa;
--meta-verde:#0f4a1a;--meta-verde-l:#e8f5ec;
--meta-azul:#1a3a6b;--meta-azul-l:#eef2fc;
--meta-morado:#3a1a6b;--meta-morado-l:#f0eefb;
--funnel1:#1a3a6b;--funnel2:#1a4a5a;--funnel3:#0f4a3a;--funnel4:#3a3a1a;--funnel5:#0d0d0d;
--canal:#1e3a5f;--canal-l:#eef2f8;--canal-b:#b8cce0;
--ok:#1a6b3c;--ok-l:#edf7f1;--ok-b:#b8dfc9;
--warn:#7a4f00;--warn-l:#fdf5e6;--warn-b:#f0d090;
--err:#7a1a1a;--err-l:#fdf0f0;--err-b:#e8b8b8;
--info:#1a3a6b;--info-l:#f0f4fd;--info-b:#b8cef0;
--r:12px;--rs:8px;--sh:0 1px 3px rgba(0,0,0,.06),0 4px 12px rgba(0,0,0,.04);
--sidebar-w:220px;
}
html{scroll-behavior:smooth}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;background:var(--bg);color:var(--ink);font-size:15px;line-height:1.65;min-height:100vh}

/* AUTH */
#auth-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:24px;background:var(--bg)}
.auth-logo{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--ink3);margin-bottom:48px}
.auth-card{width:100%;max-width:400px;background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:36px;box-shadow:var(--sh)}
.auth-card h1{font-size:22px;font-weight:600;letter-spacing:-.02em;color:var(--ink);margin-bottom:6px}
.auth-card p{font-size:14px;color:var(--ink3);margin-bottom:28px;line-height:1.6}
.auth-btn{width:100%;padding:12px 20px;background:var(--ink);color:#fff;border:none;border-radius:var(--rs);font-size:14px;font-weight:500;cursor:pointer;transition:opacity .18s;font-family:inherit}
.auth-btn:hover{opacity:.85}
.auth-note{font-size:12px;color:var(--ink4);margin-top:16px;text-align:center;line-height:1.5}

/* LOADING */
#loading-overlay{position:fixed;inset:0;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:999;gap:14px}
.loading-spinner{width:28px;height:28px;border:2.5px solid var(--line);border-top-color:var(--ink);border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.loading-text{font-size:13px;color:var(--ink4)}
#loading-overlay.hidden{display:none}

/* APP SHELL */
#app{display:none;min-height:100vh}
#app.visible{display:flex;flex-direction:column}

/* TOPBAR */
.topbar{height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid var(--line);background:var(--bg);position:sticky;top:0;z-index:100}
.topbar__brand{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink3)}
.topbar__right{display:flex;align-items:center;gap:8px}
.topbar__user-btn{display:flex;align-items:center;gap:7px;padding:5px 10px;border-radius:var(--rs);border:1px solid var(--line);background:var(--bg2);cursor:pointer;font-size:12px;color:var(--ink2);font-family:inherit;transition:all .15s}
.topbar__user-btn:hover{background:var(--bg3);border-color:var(--line2)}
.topbar__avatar{width:22px;height:22px;border-radius:50%;background:var(--ink);color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.topbar__signout{font-size:12px;color:var(--ink4);background:none;border:none;cursor:pointer;padding:5px 9px;border-radius:6px;transition:background .15s;font-family:inherit}
.topbar__signout:hover{background:var(--bg3);color:var(--ink2)}
.save-status{font-size:11px;color:var(--ink4);display:flex;align-items:center;gap:5px;min-width:70px;justify-content:flex-end;transition:color .2s}
.save-status.saving{color:var(--warn)}.save-status.saved{color:var(--ok)}
.save-status.error{color:var(--err)}
.topbar__menu-btn{display:none;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--rs);border:1px solid var(--line);background:none;cursor:pointer;font-size:16px;color:var(--ink3);font-family:inherit}

/* BODY LAYOUT */
.app-body{display:flex;flex:1;min-height:0}

/* SIDEBAR */
.sidebar{width:var(--sidebar-w);flex-shrink:0;border-right:1px solid var(--line);background:var(--bg);padding:20px 0;position:sticky;top:52px;height:calc(100vh - 52px);overflow-y:auto}
.sidebar__label{font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink5);padding:0 16px;margin-bottom:6px}
.phase-nav{display:flex;flex-direction:column;gap:2px;padding:0 8px}
.phase-item{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:var(--rs);border:none;background:none;cursor:pointer;font-family:inherit;width:100%;text-align:left;transition:background .15s;position:relative}
.phase-item:hover:not(.locked){background:var(--bg2)}
.phase-item.active{background:var(--bg3)}
.phase-item.locked{opacity:.45;cursor:not-allowed}
.phase-item__dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;background:var(--line2)}
.phase-item.active .phase-item__dot{background:var(--ink)}
.phase-item__info{flex:1;min-width:0}
.phase-item__num{font-size:9px;font-weight:700;color:var(--ink4);letter-spacing:.06em;text-transform:uppercase;line-height:1}
.phase-item__name{font-size:13px;font-weight:500;color:var(--ink2);line-height:1.3;margin-top:1px}
.phase-item.active .phase-item__name{color:var(--ink);font-weight:600}
.phase-item__badge{font-size:9px;font-weight:600;padding:2px 6px;border-radius:4px;background:var(--bg4);color:var(--ink4);white-space:nowrap;flex-shrink:0}

/* MAIN CONTENT */
.main-content{flex:1;min-width:0;overflow-y:auto}
.main-inner{max-width:700px;margin:0 auto;padding:0 24px 100px}

/* RESPONSIVE */
@media(max-width:768px){
  .sidebar{display:none}
  .sidebar.open{display:block;position:fixed;left:0;top:52px;height:calc(100vh - 52px);z-index:200;box-shadow:4px 0 20px rgba(0,0,0,.1)}
  .sidebar-backdrop{display:none;position:fixed;inset:0;top:52px;background:rgba(0,0,0,.3);z-index:199}
  .sidebar-backdrop.show{display:block}
  .topbar__menu-btn{display:flex}
}

/* PANEL */
.panel-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:300;align-items:flex-start;justify-content:flex-end;padding-top:52px}
.panel-overlay.open{display:flex}
.panel{width:100%;max-width:480px;height:calc(100vh - 52px);background:var(--bg);border-left:1px solid var(--line);display:flex;flex-direction:column;overflow:hidden}
.panel__hd{padding:20px 24px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.panel__title{font-size:16px;font-weight:600;color:var(--ink);letter-spacing:-.01em}
.panel__close{width:28px;height:28px;border-radius:6px;border:1px solid var(--line);background:none;cursor:pointer;font-size:16px;color:var(--ink3);display:flex;align-items:center;justify-content:center;font-family:inherit;transition:background .15s}
.panel__close:hover{background:var(--bg3)}
.panel__body{flex:1;overflow-y:auto;padding:20px 24px}
.panel__footer{padding:16px 24px;border-top:1px solid var(--line);flex-shrink:0}
.panel-section{margin-bottom:22px}
.panel-section__title{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink4);margin-bottom:10px}
.panel-field{margin-bottom:12px}
.panel-field label{font-size:12px;font-weight:500;color:var(--ink3);display:block;margin-bottom:5px}
.panel-field input{font-family:inherit;width:100%;padding:8px 12px;border:1.5px solid var(--input-border);border-radius:var(--rs);font-size:13px;background:var(--input-bg);color:var(--ink);transition:border-color .18s}
.panel-field input:focus{outline:none;border-color:var(--ink3)}

/* STRATEGY CARDS */
.strat-card{border:1px solid var(--line);border-radius:var(--rs);padding:12px 14px;margin-bottom:8px;cursor:pointer;transition:all .15s;display:flex;align-items:flex-start;gap:10px}
.strat-card:hover{border-color:var(--line2);background:var(--bg2)}
.strat-card.active-strat{border-color:var(--ink);background:var(--bg2)}
.strat-card__info{flex:1;min-width:0}
.strat-card__name{font-size:13px;font-weight:600;color:var(--ink);margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.strat-card__meta{font-size:11px;color:var(--ink4)}
.strat-card__fase{font-size:10px;font-weight:600;padding:2px 7px;border-radius:5px;background:var(--cta-l);color:var(--cta);flex-shrink:0;align-self:center}
.strat-card__del{width:24px;height:24px;border-radius:5px;border:none;background:none;cursor:pointer;color:var(--ink5);font-size:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s}
.strat-card__del:hover{background:var(--err-l);color:var(--err)}
.strat-card__export{width:24px;height:24px;border-radius:5px;border:none;background:none;cursor:pointer;color:var(--ink5);font-size:13px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s;margin-right:2px}
.strat-card__export:hover{background:var(--cta-l);color:var(--cta)}
.strats-section{margin-bottom:18px}
.strats-section__hdr{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--ink4);padding:4px 0 8px;border-bottom:1px solid var(--line);margin-bottom:8px}
.strats-section__empty{font-size:12px;color:var(--ink5);padding:8px 0;font-style:italic}
.empty-state{text-align:center;padding:32px 16px;color:var(--ink4);font-size:13px;line-height:1.6}

/* PHASE LOCKED */
#phase-locked{display:none;padding:60px 24px;text-align:center;max-width:480px;margin:0 auto}
#phase-locked.visible{display:block}
.locked-icon{font-size:36px;margin-bottom:16px;opacity:.3}
.locked-title{font-size:20px;font-weight:600;color:var(--ink);margin-bottom:8px;letter-spacing:-.01em}
.locked-sub{font-size:14px;color:var(--ink3);line-height:1.7;margin-bottom:24px}
.locked-badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:6px 14px;border-radius:20px;background:var(--bg3);color:var(--ink4);border:1px solid var(--line2)}

/* STRATEGY NAME BAR */
.strat-namebar{display:flex;align-items:center;gap:10px;padding:14px 0;border-bottom:1px solid var(--line);margin-bottom:24px}
.strat-namebar__input{flex:1;font-family:inherit;font-size:15px;font-weight:600;border:none;background:none;color:var(--ink);outline:none;letter-spacing:-.01em}
.strat-namebar__input::placeholder{color:var(--ink5);font-weight:400}
.strat-namebar__badge{font-size:10px;font-weight:600;padding:3px 8px;border-radius:5px;background:var(--ok-l);color:var(--ok);white-space:nowrap;flex-shrink:0}
.strat-namebar__new{font-size:12px;color:var(--ink4);background:none;border:1px solid var(--line);border-radius:var(--rs);padding:5px 10px;cursor:pointer;font-family:inherit;transition:all .15s;white-space:nowrap}
.strat-namebar__new:hover{background:var(--bg2);color:var(--ink2)}

/* HEADER */
.hdr{padding:8px 0 24px;border-bottom:1px solid var(--line);margin-bottom:24px}
.hdr__phase{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink4);margin-bottom:10px}
.hdr__title{font-size:clamp(22px,4vw,32px);font-weight:600;letter-spacing:-.03em;line-height:1.15;color:var(--ink);margin-bottom:10px}
.hdr__title span{color:var(--ink3);font-weight:400}
.hdr__sub{font-size:14px;color:var(--ink3);max-width:480px;line-height:1.7}
.prog{display:flex;gap:5px;align-items:center;margin-top:20px}
.prog__s{height:2px;flex:1;border-radius:2px;background:var(--bg4);transition:background .3s}
.prog__s.done{background:var(--ink)}.prog__s.on{background:var(--ink3)}
.prog__lbl{font-size:11px;color:var(--ink4);padding-left:10px;white-space:nowrap}

/* STEPS */
.steps{display:flex;gap:0;margin-bottom:24px;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.steps::-webkit-scrollbar{display:none}
.step{flex:0 0 auto;min-width:72px;font-size:12px;font-weight:500;padding:11px 10px;border:none;background:var(--bg2);color:var(--ink4);cursor:pointer;transition:all .18s;border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:center;gap:2px;font-family:inherit;min-height:44px}
.step:last-child{border-right:none}
.step__num{font-size:10px;opacity:.7}
.step:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;z-index:1;position:relative}
.step:hover:not(.on){background:var(--bg3);color:var(--ink2)}
.step.on{background:var(--ink);color:#fff}
.step.done{background:var(--bg3);color:var(--ink2)}
/* SECTIONS */
.sec{display:none}
.sec.on{display:block;animation:fadeUp .25s ease both}
@keyframes fadeUp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}

/* CARDS */
.card{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);margin-bottom:12px;overflow:hidden;box-shadow:var(--sh)}
.card__hd{padding:16px 20px;border-bottom:1px solid var(--line);display:flex;gap:12px;align-items:flex-start}
.card__label{font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink4);margin-bottom:3px}
.card__name{font-size:18px;font-weight:600;letter-spacing:-.02em;color:var(--ink);margin-bottom:3px}
.card__desc{font-size:12px;color:var(--ink3);line-height:1.55}
.card__bd{padding:20px}

/* CALLOUTS */
.callout{padding:12px 15px;border-radius:var(--rs);font-size:13px;line-height:1.7;border-left:3px solid;margin-bottom:14px}
.callout.info{background:var(--ins-l);border-color:var(--ins-b);color:var(--ins)}
.callout.ok{background:var(--ok-l);border-color:var(--ok-b);color:var(--ok)}
.callout.warn{background:var(--warn-l);border-color:var(--warn-b);color:var(--warn)}
.callout.neutral{background:#f9f9f9;border-color:#d8d8d8;color:var(--ink2)}

/* DIVIDER */
.dv{display:flex;align-items:center;gap:10px;margin:16px 0 12px}
.dv span{font-size:10px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--ink4);white-space:nowrap}
.dv::before,.dv::after{content:'';flex:1;height:1px;background:var(--line)}

/* FIELDS */
.f{margin-bottom:12px}
.f__lbl{font-size:13px;font-weight:600;color:var(--ink2);margin-bottom:5px;display:flex;align-items:center;gap:5px}
.req{color:var(--err);font-size:13px;font-weight:700;line-height:1;flex-shrink:0;margin-left:2px}
/* Screen-reader only utility */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}

/* Required fields note */
.required-note{font-size:12px;color:var(--ink4);margin-bottom:14px;line-height:1.5}
.required-note span{color:var(--err);font-weight:700}

/* Focus visible improvements for all interactive elements */
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline-offset:0;border-color:var(--accent)}

/* Modal accessibility - trap focus visually */
.modal-overlay:not(.open){visibility:hidden;pointer-events:none}
.modal-overlay.open{visibility:visible}

/* Sidebar: inert content behind open panel (CSS only - JS handles inert attr) */
.main-inner[aria-hidden="true"]{pointer-events:none;user-select:none}

/* Mobile: minimum touch target for interactive elements */
@media(max-width:768px){
  .phase-item{min-height:44px}
  .strat-namebar__new{min-height:36px;padding:6px 14px}
  .btn{min-height:40px}
  .chips{gap:8px}
  .chip{padding:7px 14px}
}

.f__hint{font-size:11px;color:var(--ink4);margin-bottom:5px;line-height:1.5}
.f__warn{font-size:11px;color:var(--warn);background:var(--warn-l);border-radius:4px;padding:5px 9px;margin-top:5px;display:none;line-height:1.5}
.f__warn.show{display:block}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
@media(max-width:500px){.f2{grid-template-columns:1fr}}

input[type=text],input[type=email],input[type=number],select,textarea{
  font-family:inherit;width:100%;padding:9px 13px;
  border:1.5px solid var(--input-border);border-radius:var(--rs);font-size:14px;
  background:var(--input-bg);color:var(--ink);resize:vertical;
  transition:border-color .18s,box-shadow .18s;line-height:1.5;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.04);
}
textarea{min-height:66px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--ink3);box-shadow:inset 0 1px 2px rgba(0,0,0,.04),0 0 0 3px rgba(0,0,0,.06)}
input::placeholder,textarea::placeholder{color:var(--input-ph)}

/* CHIPS */
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.chip{font-size:12px;padding:5px 13px;border-radius:20px;border:1px solid var(--chip-border);background:var(--chip-bg);color:var(--chip-color);cursor:pointer;transition:all .15s;user-select:none;font-family:inherit;font-weight:500;
  /* button reset */
  line-height:1.4;display:inline-flex;align-items:center;appearance:none;-webkit-appearance:none}
.chip:hover:not(.sel){border-color:var(--ink3);color:var(--ink);background:var(--bg4)}
.chip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.chip.sel,.chip[aria-pressed="true"]{background:var(--chip-sel-bg);border-color:var(--chip-sel-bg);color:var(--chip-sel-color)}
.chip[aria-pressed="true"]:focus-visible{outline:2px solid var(--chip-sel-color);outline-offset:2px}
.chip.disabled{opacity:.3;cursor:not-allowed;pointer-events:none}

/* PROFILE HINT */
.profile-hint{background:var(--ctx-l);border:1px solid var(--ctx-b);border-radius:var(--rs);padding:11px 14px;margin-bottom:12px;display:none}
.profile-hint.show{display:block}
.profile-hint__title{font-size:10px;font-weight:700;color:var(--ctx);letter-spacing:.06em;text-transform:uppercase;margin-bottom:7px}
.profile-hint__tags{display:flex;flex-wrap:wrap;gap:5px}
.profile-hint__tag{font-size:11px;padding:3px 9px;border-radius:8px;background:rgba(255,255,255,.8);border:1px solid var(--ctx-b);color:var(--ctx)}

/* MIEDOS */
.miedos-list{display:flex;flex-direction:column;gap:5px;margin-bottom:8px}
.miedo{display:flex;gap:10px;align-items:flex-start;padding:9px 13px;border-radius:var(--rs);border:1px solid var(--miedo-act-b);background:var(--miedo-act-l);cursor:pointer;transition:all .15s;font-size:13px;color:var(--miedo-act);font-family:inherit;text-align:left;width:100%}
.miedo:hover{border-color:var(--miedo-act);background:#fce8e8}
.miedo.on{background:#fad4d4;border-color:var(--miedo-act)}
.miedo__box{width:15px;height:15px;border-radius:4px;border:1.5px solid var(--miedo-act-b);flex-shrink:0;margin-top:2px;display:flex;align-items:center;justify-content:center;font-size:10px;transition:all .15s}
.miedo.on .miedo__box{background:var(--miedo-act);border-color:var(--miedo-act);color:#fff}

/* ACORDEON */
.acordeon{border:1px solid var(--miedo-acord-b);border-radius:var(--rs);overflow:hidden;margin-bottom:10px}
.acordeon__trigger{width:100%;display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:var(--miedo-acord-l);border:none;cursor:pointer;font-size:12px;font-weight:600;color:var(--miedo-acord);font-family:inherit;border-bottom:1px solid var(--miedo-acord-b)}
.acordeon__arrow{font-size:10px;transition:transform .22s}
.acordeon__trigger.open .acordeon__arrow{transform:rotate(180deg)}
.acordeon__body{display:none;padding:10px;border-top:1px solid var(--miedo-acord-b);background:var(--bg)}
.acordeon__body.open{display:flex;flex-direction:column;gap:5px}

/* CTX BLOCK */
.ctx-block{background:var(--ctx-l);border:1px solid var(--ctx-b);border-radius:var(--rs);padding:12px 14px;margin-bottom:14px}
.ctx-block__title{font-size:10px;font-weight:700;color:var(--ctx);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}
.ctx-tags{display:flex;flex-wrap:wrap;gap:5px}
.ctx-tag{font-size:11px;padding:3px 10px;border-radius:8px;background:rgba(255,255,255,.8);border:1px solid var(--ctx-b);color:var(--ctx)}
.ctx-tag.empty{color:var(--ink4);font-style:italic;border-style:dashed;border-color:var(--line2);background:transparent}

/* EXAMPLE BOX */
.example-box{border:1px dashed var(--ex-b);border-radius:var(--rs);padding:11px 14px;margin-bottom:16px;background:var(--ex-l)}
.example-box__label{font-size:10px;font-weight:700;color:var(--ex);text-transform:uppercase;letter-spacing:.08em;margin-bottom:5px}
.example-box__text{font-size:13px;color:var(--ex);line-height:1.7;font-style:italic;opacity:.85}

/* FORMULA */
.formula-step{margin-bottom:14px}
.formula-step__num{display:inline-flex;width:22px;height:22px;border-radius:50%;background:var(--ink);color:#fff;font-size:11px;font-weight:700;align-items:center;justify-content:center;margin-right:7px;flex-shrink:0;vertical-align:middle}
.formula-connector{text-align:center;font-size:11px;color:var(--ink5);padding:3px 0}

/* PREVIEW */
.preview-main{background:var(--prev-l);border:1px solid var(--prev-b);border-radius:var(--rs);padding:16px;margin-bottom:8px}
.preview-main__label{font-size:10px;font-weight:700;color:var(--prev);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}
.preview-main__text{font-size:14px;color:var(--prev);line-height:1.75;font-style:italic;min-height:40px}
.preview-main__text.empty{color:var(--prev-b);font-size:12px;font-style:normal}
.preview-short{background:var(--bg3);border:1px solid var(--line);border-radius:var(--rs);padding:12px 14px;margin-bottom:14px}
.preview-short__label{font-size:10px;font-weight:600;color:var(--ink4);text-transform:uppercase;letter-spacing:.08em;margin-bottom:5px}
.preview-short__text{font-size:13px;color:var(--ink2);line-height:1.65;font-style:italic}
.uses-note{padding:0 0 14px;border-bottom:1px solid var(--line);margin-bottom:14px}
.uses-note__label{font-size:11px;color:var(--ink4);margin-bottom:6px}
.uses-grid{display:flex;flex-wrap:wrap;gap:5px}
.use-tag{font-size:11px;padding:2px 9px;border-radius:6px;background:var(--bg3);color:var(--ink4);border:1px solid var(--line)}

/* SAVE CTA */
.save-cta{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;background:var(--cta-l);border:1px solid var(--cta-b);border-radius:var(--rs);margin-bottom:12px}
.save-cta__title{font-size:13px;font-weight:600;color:var(--cta)}
.save-cta__sub{font-size:11px;color:var(--cta);opacity:.7;margin-top:2px}

/* VCHECKS */
.vcheck-item{display:flex;gap:10px;align-items:flex-start;padding:8px 0;border-bottom:1px solid var(--line);font-size:12px;color:var(--ink3);line-height:1.5}
.vcheck-item:last-child{border:none}
.vcheck-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;margin-top:5px;background:var(--line2);transition:background .2s}
.vcheck-dot.ok{background:var(--ok)}.vcheck-dot.fail{background:var(--err)}
.vcheck-label{flex:1}
.vcheck-status{font-size:10px;font-weight:600;padding:2px 7px;border-radius:6px;white-space:nowrap}
.vcheck-status.ok{background:var(--ok-l);color:var(--ok)}
.vcheck-status.fail{background:var(--err-l);color:var(--err)}

/* STRENGTH */
.strength-wrap{margin-bottom:16px}
.strength-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.strength-lbl{font-size:11px;font-weight:500;color:var(--ink3)}
.strength-badge{font-size:11px;font-weight:600;padding:3px 10px;border-radius:8px;transition:all .3s}
.strength-badge.weak{background:var(--err-l);color:var(--err)}
.strength-badge.ok{background:var(--warn-l);color:var(--warn)}
.strength-badge.good{background:var(--ins-l);color:var(--ins)}
.strength-badge.strong{background:var(--ok-l);color:var(--ok);font-weight:700}
.strength-track{height:4px;background:var(--bg3);border-radius:2px;overflow:hidden}
.strength-fill{height:100%;border-radius:2px;transition:width .5s,background .5s}

/* CALC */
.calc-inputs{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-bottom:18px}
@media(max-width:480px){.calc-inputs{grid-template-columns:1fr}}
.calc-input{background:var(--bg2);border:1px solid var(--line);border-radius:var(--rs);padding:12px 14px}
.calc-input__lbl{font-size:10px;font-weight:600;color:var(--ink4);text-transform:uppercase;letter-spacing:.08em;margin-bottom:5px}
.calc-input input{border:none;background:transparent;padding:0;font-size:22px;font-weight:600;color:var(--ink);width:100%;letter-spacing:-.02em}
.calc-input input:focus{outline:none;box-shadow:none}
.calc-input__unit{font-size:11px;color:var(--ink4);margin-top:3px}
.calc-input--verde{background:var(--meta-verde-l);border-color:#9ad4aa}
.calc-input--verde .calc-input__lbl{color:var(--meta-verde)}
.calc-input--verde input{color:var(--meta-verde)}
.calc-input--azul{background:var(--meta-azul-l);border-color:#9ab8f0}
.calc-input--azul .calc-input__lbl{color:var(--meta-azul)}
.calc-input--azul input{color:var(--meta-azul)}
.calc-input--morado{background:var(--meta-morado-l);border-color:#c4b8f0}
.calc-input--morado .calc-input__lbl{color:var(--meta-morado)}
.calc-input--morado input{color:var(--meta-morado)}

/* ROAS */
.roas-wrap{margin-bottom:18px}
.roas-header{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px}
.roas-lbl{font-size:12px;font-weight:500;color:var(--ink2)}
.roas-sub{font-size:11px;color:var(--ink4)}
.roas-val{font-size:22px;font-weight:600;color:var(--ink);letter-spacing:-.02em}
input[type=range]{width:100%;height:3px;border-radius:2px;-webkit-appearance:none;background:linear-gradient(to right,var(--ink) var(--pct,22%),var(--bg4) var(--pct,22%));cursor:pointer;border:none;padding:0}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:var(--ink);border:2px solid var(--bg);box-shadow:0 1px 4px rgba(0,0,0,.2)}
input[type=range]:focus{outline:none}
.roas-zones{display:flex;justify-content:space-between;font-size:10px;color:var(--ink5);margin-top:5px}

/* FUNNEL TABLE */
.funnel-table{margin-bottom:20px;display:flex;flex-direction:column;gap:6px}
.funnel-row{display:grid;grid-template-columns:1fr 70px 120px;align-items:center;gap:10px;padding:10px 14px;background:var(--bg2);border-radius:var(--rs);border:1px solid var(--line)}
@media(max-width:500px){.funnel-row{grid-template-columns:1fr 60px}.funnel-row__bar{display:none}}
.funnel-row--highlight{background:var(--bg3);border-color:var(--line2)}
.funnel-row__stage{font-size:13px;color:var(--ink2)}
.funnel-row--highlight .funnel-row__stage{font-weight:600;color:var(--ink)}
.funnel-row__num{font-size:18px;font-weight:600;color:var(--ink);text-align:right;letter-spacing:-.02em}
.funnel-row--highlight .funnel-row__num{font-size:22px}
.funnel-row__bar{height:6px;background:var(--bg4);border-radius:3px;overflow:hidden}
.funnel-row__fill{height:100%;border-radius:3px;transition:width .5s cubic-bezier(.4,0,.2,1)}

/* KPIS */
.kpis-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:18px}
@media(max-width:480px){.kpis-grid{grid-template-columns:repeat(2,1fr)}}
.kpi-card{background:var(--bg2);border:1px solid var(--line);border-radius:var(--rs);padding:12px 14px;text-align:center}
.kpi-card.primary{background:var(--bg3);border-color:var(--line2)}
.kpi-card__num{font-size:20px;font-weight:600;color:var(--ink);letter-spacing:-.02em;line-height:1.1;margin-bottom:4px}
.kpi-card__lbl{font-size:11px;color:var(--ink3);line-height:1.3}

/* TASAS */
.tasas-summary{background:var(--ins-l);border:1px solid var(--ins-b);border-radius:var(--rs);padding:10px 14px;margin-bottom:0;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:8px}
.tasas-summary__label{font-size:12px;font-weight:600;color:var(--ins)}
.tasas-summary__sub{font-size:11px;color:var(--ins);opacity:.75}
.tasas-summary__arrow{font-size:10px;color:var(--ins);transition:transform .22s}
.tasas-summary.open .tasas-summary__arrow{transform:rotate(180deg)}
.tasas-body{display:none;padding:12px 14px;background:var(--ins-l);border:1px solid var(--ins-b);border-top:none;border-radius:0 0 var(--rs) var(--rs);margin-bottom:16px}
.tasas-body.open{display:block}

/* RESULT HIGHLIGHT */
.result-highlight{display:flex;gap:14px;align-items:flex-start;background:var(--ins-l);border:1px solid var(--ins-b);border-radius:var(--r);padding:16px 18px;margin-bottom:18px}
.result-highlight__icon{font-size:16px;color:var(--ins);opacity:.5;flex-shrink:0;margin-top:2px}
.result-highlight__text{font-size:13px;color:var(--ins);line-height:1.75}

/* CALC MODE */
.calc-mode-btn{font-family:inherit;font-size:12px;font-weight:500;padding:7px 16px;border-radius:var(--rs);cursor:pointer;border:1px solid var(--line2);background:var(--bg2);color:var(--ink3);transition:all .18s}
.calc-mode-btn.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.calc-mode-btn:hover:not(.active){background:var(--bg3);color:var(--ink2)}

/* CANAL */
.canal-block{background:var(--canal-l);border:1px solid var(--canal-b);border-radius:var(--r);padding:16px 18px;margin-bottom:16px}
.canal-block__label{font-size:10px;font-weight:700;color:var(--canal);text-transform:uppercase;letter-spacing:.1em;margin-bottom:10px}
.canal-block__grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
@media(max-width:480px){.canal-block__grid{grid-template-columns:1fr}}
.canal-item{background:#fff;border-radius:var(--rs);padding:12px 14px;border:1px solid var(--canal-b)}
.canal-item__badge{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px}
.canal-item__badge.principal{color:var(--canal)}
.canal-item__badge.secundario{color:var(--ink4)}
.canal-item__name{font-size:16px;font-weight:700;color:var(--ink)}
.canal-item.principal{border-color:var(--canal);border-width:2px}
.canal-item.secundario{opacity:.8}
.canal-justificacion{font-size:12px;color:var(--canal);line-height:1.65;border-top:1px solid var(--canal-b);padding-top:10px;font-style:italic}

/* PROP BADGE */
.prop-badge{display:none;background:var(--bg2);border:1px solid var(--line2);border-radius:var(--rs);padding:9px 14px;margin-bottom:14px;font-size:12px;color:var(--ink2);align-items:center;gap:8px}
.prop-badge.show{display:flex}
.prop-badge__texto{flex:1;font-style:italic;line-height:1.5}

/* COMP */
.comp-trigger{width:100%;display:flex;align-items:center;gap:12px;padding:13px 16px;background:var(--opt-l);border:1px solid var(--opt-b);border-radius:var(--r);cursor:pointer;text-align:left;transition:background .15s;margin-bottom:12px;font-family:inherit}
.comp-trigger:hover{background:#fef9ee}
.comp-trigger__info{flex:1}
.comp-trigger__title{font-size:13px;font-weight:600;color:var(--opt)}
.comp-trigger__sub{font-size:11px;color:var(--opt);opacity:.7;margin-top:2px}
.comp-trigger__arrow{font-size:10px;color:var(--opt);transition:transform .22s;flex-shrink:0;opacity:.6}
.comp-trigger.open{border-bottom-left-radius:0;border-bottom-right-radius:0;margin-bottom:0}
.comp-trigger.open .comp-trigger__arrow{transform:rotate(180deg)}
.comp-body{display:none;background:var(--bg);border:1px solid var(--opt-b);border-top:none;border-bottom-left-radius:var(--r);border-bottom-right-radius:var(--r);padding:16px;margin-bottom:12px}
.comp-body.open{display:block}

/* PROMPT */
.prompt-selectors{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}
@media(max-width:440px){.prompt-selectors{grid-template-columns:1fr}}
.prompt-sel-lbl{font-size:11px;font-weight:500;color:var(--ink3);margin-bottom:4px}
.prompt-box{background:var(--bg2);border:1px solid var(--line);border-radius:var(--rs);padding:11px 13px;font-size:11px;color:var(--ink3);line-height:1.75;max-height:180px;overflow-y:auto;margin-bottom:10px;font-family:monospace;white-space:pre-wrap}

/* ESTRATEGIA BASE */
.strat-header{padding:8px 0 24px;border-bottom:1px solid var(--line);margin-bottom:20px}
.strat-header__label{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink4);margin-bottom:8px}
.strat-header__title{font-size:clamp(22px,4vw,30px);font-weight:700;letter-spacing:-.03em;color:var(--ink);margin-bottom:8px;line-height:1.1}
.strat-header__sub{font-size:13px;color:var(--ink3);line-height:1.65;max-width:500px}
.strat-block{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);margin-bottom:10px;overflow:hidden}
.strat-block--prop{border-left:3px solid var(--ink)}
.strat-block__hd{padding:12px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;background:var(--bg2)}
.strat-block__num{font-size:10px;font-weight:700;color:var(--ink4);letter-spacing:.08em}
.strat-block__title{font-size:13px;font-weight:600;color:var(--ink);letter-spacing:-.01em}
.strat-block__bd{padding:16px 18px}
.strat-para{font-size:13px;color:var(--ink2);line-height:1.7;padding:12px 0}
.strat-meta-chips{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}
.strat-meta-chip{font-size:12px;padding:4px 12px;border-radius:20px;background:var(--bg3);border:1px solid var(--line2);color:var(--ink2);font-weight:500}
.strat-meta-chip.hi{background:var(--ins-l);border-color:var(--ins-b);color:var(--ins)}
.strat-prop-full{font-size:15px;font-weight:400;color:var(--ink);line-height:1.75;font-style:italic;padding:8px 0 14px;border-bottom:1px solid var(--line);margin-bottom:14px}

/* EMBUDO VISUAL */
.strat-funnel{display:flex;flex-direction:column;align-items:center;gap:2px;margin-bottom:16px}
.strat-funnel__stage{width:100%;display:flex;justify-content:center}
.strat-funnel__stage:nth-child(1) .strat-funnel__bar{width:100%}
.strat-funnel__stage:nth-child(2) .strat-funnel__bar{width:80%}
.strat-funnel__stage:nth-child(3) .strat-funnel__bar{width:62%}
.strat-funnel__stage:nth-child(4) .strat-funnel__bar{width:46%}
.strat-funnel__stage:nth-child(5) .strat-funnel__bar{width:32%}
.strat-funnel__bar{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-radius:var(--rs);gap:8px}
.strat-funnel__stage:nth-child(1) .strat-funnel__bar{background:#e8e8e8}
.strat-funnel__stage:nth-child(2) .strat-funnel__bar{background:#dedede}
.strat-funnel__stage:nth-child(3) .strat-funnel__bar{background:#d4d4d4}
.strat-funnel__stage:nth-child(4) .strat-funnel__bar{background:#cacaca}
.strat-funnel__stage--final .strat-funnel__bar{background:var(--ink)!important}
.strat-funnel__label{font-size:12px;color:var(--ink2);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.strat-funnel__stage--final .strat-funnel__label{color:rgba(255,255,255,.75)}
.strat-funnel__num{font-size:16px;font-weight:700;color:var(--ink);letter-spacing:-.02em;white-space:nowrap;flex-shrink:0}
.strat-funnel__stage--final .strat-funnel__num{color:#fff;font-size:18px}
.strat-funnel-title{font-size:11px;font-weight:600;color:var(--ink4);text-transform:uppercase;letter-spacing:.08em;margin-bottom:14px}

/* STRAT KPIS */
.strat-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:16px 18px}
@media(max-width:480px){.strat-kpis{grid-template-columns:repeat(2,1fr)}}
.strat-kpi{background:var(--bg2);border:1px solid var(--line);border-radius:var(--rs);padding:12px;text-align:center}
.strat-kpi--main{background:var(--bg3);border-color:var(--line2)}
.strat-kpi__num{font-size:20px;font-weight:700;color:var(--ink);letter-spacing:-.03em;line-height:1;margin-bottom:5px}
.strat-kpi__lbl{font-size:11px;color:var(--ink3);line-height:1.3}

/* CHECKLIST */
.auto-ck-item{display:flex;align-items:center;gap:12px;padding:10px 18px;border-bottom:1px solid var(--line)}
.auto-ck-item:last-of-type{border:none}
.auto-ck__dot{width:8px;height:8px;border-radius:50%;background:var(--line2);flex-shrink:0;transition:background .25s}
.auto-ck-item.done .auto-ck__dot{background:var(--ok)}
.auto-ck__text{flex:1;font-size:13px;color:var(--ink3)}
.auto-ck-item.done .auto-ck__text{color:var(--ink)}
.auto-ck__status{font-size:10px;font-weight:600;padding:2px 8px;border-radius:8px;white-space:nowrap}
.auto-ck-item.done .auto-ck__status{background:var(--ok-l);color:var(--ok)}
.auto-ck-item.miss .auto-ck__status{background:var(--bg3);color:var(--ink4)}
.strat-ck-score{padding:12px 18px;font-size:12px;color:var(--ink3);display:flex;align-items:center;gap:8px;background:var(--bg2);border-top:1px solid var(--line)}
.strat-ck-badge{font-size:11px;font-weight:600;padding:2px 9px;border-radius:8px;background:var(--bg3);color:var(--ink3)}
.strat-ck-badge.complete{background:var(--ok-l);color:var(--ok)}

/* ACCIONES */
.strat-actions{margin-top:18px}
.strat-actions__hint{font-size:12px;color:var(--ink4);margin-bottom:8px;line-height:1.45}
.strat-actions__primary{display:flex;gap:8px;margin-bottom:10px}
@media(max-width:440px){.strat-actions__primary{flex-direction:column}}
.btn-outline-dark{background:transparent;color:var(--ink);border:1.5px solid var(--ink);font-family:inherit;font-size:13px;font-weight:500;padding:10px 20px;border-radius:var(--rs);cursor:pointer;transition:all .18s}
.btn-outline-dark:hover{background:var(--ink);color:#fff}
.strat-actions__nav{display:flex;justify-content:space-between;padding-top:12px;border-top:1px solid var(--line)}

/* NAV */
.nav{display:flex;justify-content:space-between;align-items:center;margin-top:20px;padding-top:18px;border-top:1px solid var(--line);flex-wrap:wrap;gap:10px}
.nav-hint{font-size:12px;color:var(--ink4)}

/* BUTTONS */
.btn{font-family:inherit;font-size:13px;font-weight:500;padding:10px 20px;border-radius:var(--rs);cursor:pointer;transition:all .18s;border:none}
.btn-dark{background:var(--ink);color:#fff}.btn-dark:hover{opacity:.85}
.btn-cta{background:var(--cta-mid);color:#fff}.btn-cta:hover{background:var(--cta)}
.btn-ghost{background:var(--bg2);color:var(--ink2);border:1px solid var(--line)}.btn-ghost:hover{border-color:var(--line2);background:var(--bg3)}
.btn-sm{padding:7px 14px;font-size:12px}
.btn-copy{background:var(--bg2);color:var(--ink3);border:1px solid var(--line);font-size:12px;padding:7px 14px}
.btn-copy.copied{background:var(--ok-l);color:var(--ok);border-color:var(--ok-b)}

/* TOAST */
.toast{position:fixed;bottom:22px;right:22px;background:var(--ink);color:#fff;padding:11px 18px;border-radius:var(--rs);font-size:13px;font-weight:500;opacity:0;transform:translateY(8px);transition:all .28s;pointer-events:none;z-index:999;max-width:300px}
.toast.show{opacity:1;transform:translateY(0)}

/* PDF OVERLAY */
.pdf-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:500;align-items:center;justify-content:center;flex-direction:column;gap:12px}
.pdf-overlay.show{display:flex}
.pdf-overlay .loading-spinner{border-color:rgba(255,255,255,.3);border-top-color:#fff}
.pdf-overlay .loading-text{color:#fff}

/* MODAL NOMBRE */
.modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:600;align-items:center;justify-content:center;padding:20px}
.modal-overlay.open{display:flex}
.modal-box{width:100%;max-width:440px;background:var(--bg);border-radius:var(--r);border:1px solid var(--line);box-shadow:0 8px 32px rgba(0,0,0,.18);overflow:hidden}
.modal-box__hd{padding:18px 22px 0;border-bottom:none}
.modal-box__title{font-size:16px;font-weight:600;color:var(--ink);letter-spacing:-.01em}
.modal-box__body{padding:14px 22px 0}
.modal-box__desc{font-size:13px;color:var(--ink3);line-height:1.6;margin-bottom:12px}
.modal-box__input{font-family:inherit;width:100%;padding:10px 13px;border:1.5px solid var(--input-border);border-radius:var(--rs);font-size:14px;background:var(--input-bg);color:var(--ink);transition:border-color .18s}
.modal-box__input:focus{outline:none;border-color:var(--ink3);box-shadow:0 0 0 3px rgba(0,0,0,.06)}
.modal-box__footer{padding:16px 22px;display:flex;justify-content:flex-end;gap:8px}