:root{
  --bg:#f4f5f7; --card:#ffffff; --text:#1f2933; --muted:#6b7280; --line:#e5e7eb;
  --green:#5fbf8f; --green-dark:#2f8f68; --blue:#6aa9ff; --orange:#ffb454;
  --shadow:0 12px 30px rgba(31,41,51,.08); --radius:22px; --safe-bottom:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box} body{margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text);min-height:100vh}
button,input,select,textarea{font:inherit}button{cursor:pointer;border:0}.app{max-width:980px;margin:0 auto;min-height:100vh;padding:18px 16px calc(92px + var(--safe-bottom))}
header.top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.brand h1{margin:0;font-size:1.45rem;letter-spacing:-.03em}.brand p{margin:4px 0 0;color:var(--muted);font-size:.9rem}.version{font-size:.75rem;color:var(--green-dark);background:#e8f7ef;border:1px solid #ccebdc;border-radius:999px;padding:7px 10px;white-space:nowrap}
.tabs{position:fixed;left:0;right:0;bottom:0;z-index:50;background:rgba(255,255,255,.88);backdrop-filter:blur(16px);border-top:1px solid var(--line);padding:8px 8px calc(8px + var(--safe-bottom))}.tabs-inner{max-width:980px;margin:0 auto;display:grid;grid-template-columns:repeat(7,1fr);gap:5px}.tab{border-radius:16px;padding:7px 4px;color:#52606d;background:transparent;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:.68rem;min-height:54px}.tab span:first-child{font-size:1.25rem}.tab.active{background:#e8f7ef;color:#146c49;font-weight:800}
.screen{display:none}.screen.active{display:block;animation:fade .18s ease-out}@keyframes fade{from{opacity:.6;transform:translateY(4px)}to{opacity:1;transform:none}}
.grid{display:grid;gap:14px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px}.card.soft{box-shadow:none}.section-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.section-title h2,.section-title h3{margin:0;font-size:1.05rem;letter-spacing:-.02em}.small{font-size:.83rem;color:var(--muted)}.pill{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:5px 9px;background:#f3f4f6;color:#4b5563;font-size:.75rem;font-weight:700;white-space:nowrap}
.meal-block h3{margin:0 0 10px;font-size:1.15rem}.recipe-option{border:1px solid var(--line);border-radius:18px;padding:12px;display:grid;gap:7px;background:#fff}.recipe-option.selected{border-color:var(--green);box-shadow:0 0 0 3px rgba(95,191,143,.18)}.recipe-head{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}.recipe-name{font-weight:850;letter-spacing:-.02em}.meta{display:flex;gap:6px;flex-wrap:wrap}.btn-row{display:flex;gap:8px;flex-wrap:wrap}.btn{border-radius:14px;padding:10px 12px;background:#eef2f7;color:#263445;font-weight:800}.btn.primary{background:var(--green);color:#073b28}.btn.blue{background:#e7f0ff;color:#1d5aa8}.btn.orange{background:#fff2dd;color:#8a5200}.btn.dark{background:#1f2933;color:white}.btn:active{transform:scale(.98)}
.summary-bars{display:grid;gap:8px}.bar-row{display:grid;grid-template-columns:92px 1fr 48px;gap:9px;align-items:center;font-size:.85rem}.bar{height:9px;background:#edf0f3;border-radius:999px;overflow:hidden}.bar>i{display:block;height:100%;border-radius:999px;background:var(--green);width:50%}.week-grid{display:grid;grid-template-columns:repeat(7,minmax(120px,1fr));gap:10px;overflow-x:auto;padding-bottom:6px}.day-card{min-width:132px;border-radius:20px;background:white;border:1px solid var(--line);padding:12px;box-shadow:0 8px 18px rgba(31,41,51,.05)}.day-card.today{border-color:var(--green);box-shadow:0 0 0 3px rgba(95,191,143,.14)}.day-name{font-weight:900;margin-bottom:9px}.slot{border-radius:14px;background:#f8fafc;padding:9px;margin-top:7px;min-height:70px}.slot b{display:block;font-size:.76rem;color:#52606d;margin-bottom:4px}.slot span{font-size:.82rem}.pro-list{display:grid;gap:10px}.pro-item{border-radius:18px;border:1px solid var(--line);background:#fff;padding:13px}.pro-item h3{margin:0 0 4px;font-size:1rem}.pro-item p{margin:0;color:var(--muted);font-size:.86rem;line-height:1.35}
.girls-screen{position:relative;overflow:hidden;border-radius:28px;min-height:calc(100vh - 130px);padding:12px;box-shadow:var(--shadow);isolation:isolate;background-image:var(--world-bg);background-size:cover;background-position:center;transition:background-image .35s ease}.girls-screen::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.005) 42%,rgba(255,255,255,.09));z-index:-1}.path-card{background:rgba(255,255,255,.38);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.38);border-radius:22px;padding:9px;margin-bottom:10px;box-shadow:0 10px 25px rgba(0,0,0,.10)}.path-line{display:flex;align-items:center;gap:10px;overflow-x:auto;padding:8px 2px 4px}.node{flex:0 0 auto;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:white;border:3px solid rgba(255,255,255,.75);box-shadow:0 6px 14px rgba(31,41,51,.16);font-size:1.25rem}.node.done{background:#e8f7ef;border-color:#79d8aa}.node.current{background:#fff5d8;border-color:#ffbf4d;transform:scale(1.08)}.connector{flex:0 0 28px;height:5px;border-radius:999px;background:rgba(255,255,255,.8)}.connector.done{background:#79d8aa}.girl-card{background:rgba(255,255,255,.46);backdrop-filter:blur(7px);border:1px solid rgba(255,255,255,.42);border-radius:22px;padding:10px;box-shadow:0 12px 28px rgba(0,0,0,.14)}.girl-card.reward-pulse{animation:rewardPulse .7s ease}@keyframes rewardPulse{0%{transform:scale(1)}40%{transform:scale(1.035);box-shadow:0 0 0 6px rgba(255,191,77,.28)}100%{transform:scale(1)}}.girl-head{display:flex;align-items:center;gap:9px;margin-bottom:8px}.avatar{width:46px;height:46px;border-radius:16px;display:grid;place-items:center;background:#fff4d6;font-size:1.65rem;box-shadow:0 8px 16px rgba(31,41,51,.1)}.girl-head h3{margin:0;font-size:1rem}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:8px}.stat,.debug-item{border-radius:14px;background:rgba(255,255,255,.58);padding:7px;text-align:center;box-shadow:0 4px 12px rgba(0,0,0,.06)}.stat b,.debug-item b{display:block;font-size:1rem}.stat span,.debug-item span{font-size:.72rem;color:var(--muted)}
.debug-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.reward-box{margin-top:7px;border-radius:16px;background:linear-gradient(135deg,rgba(255,245,190,.62),rgba(255,204,229,.58));border:1px solid rgba(255,255,255,.55);padding:8px;display:flex;align-items:center;justify-content:space-between;gap:8px;box-shadow:0 5px 14px rgba(0,0,0,.07)}.mini-progress{height:8px;border-radius:999px;background:rgba(255,255,255,.7);overflow:hidden;margin-top:5px}.mini-progress i{display:block;height:100%;border-radius:999px;background:var(--green);transition:width .25s ease}.test-actions,.world-preview{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.world-chip{border-radius:999px;padding:5px 8px;background:rgba(255,255,255,.58);font-size:.72rem;font-weight:800}.world-chip.active{background:#fff5d8;color:#8a5200;box-shadow:0 0 0 2px rgba(255,191,77,.35)}
details.recipe-pro{border:1px solid var(--line);border-radius:18px;padding:12px;background:white}details.recipe-pro summary{font-weight:900;cursor:pointer}.recipe-detail{margin-top:10px;display:grid;gap:8px;color:#374151;font-size:.9rem}.input-row{display:grid;gap:8px;margin-top:10px}input,select,textarea{border:1px solid var(--line);border-radius:14px;padding:10px 12px;background:white;width:100%}textarea{min-height:86px;resize:vertical}.toast{position:fixed;left:50%;bottom:86px;transform:translateX(-50%) translateY(30px);background:#1f2933;color:white;padding:11px 14px;border-radius:999px;box-shadow:0 12px 28px rgba(0,0,0,.22);opacity:0;pointer-events:none;transition:.22s ease;z-index:80;font-size:.88rem}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media(max-width:760px){.app{padding-left:12px;padding-right:12px}.grid.two{grid-template-columns:1fr}.tabs-inner{grid-template-columns:repeat(7,1fr)}.tab{font-size:.58rem;min-height:50px}.tab span:first-child{font-size:1.1rem}.brand h1{font-size:1.2rem}.version{display:none}.debug-grid{grid-template-columns:repeat(2,1fr)}#screen-ninas .grid.two{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.girls-screen{padding:9px}.path-card{padding:9px}.quest-debug{padding:8px}.girl-card{padding:8px}.girl-card .small{display:none}.btn-row .btn{padding:8px 9px;font-size:.78rem}.reward-box strong{font-size:.78rem}.stat b{font-size:.9rem}.stat span{font-size:.63rem}}

/* V0.8 NIÑAS: más fondo visible, tarjetas compactas */
.girl-card .reward-box strong{font-size:.86rem}.girl-card .reward-box .small{font-size:.72rem}

/* V0.9 NIÑAS: fondo protagonista estilo cuento */
#screen-ninas .path-card h2,
#screen-ninas .quest-debug h3,
#screen-ninas .girl-head h3,
#screen-ninas .reward-box strong,
#screen-ninas .stat b,
#screen-ninas .debug-item b{
  text-shadow: 0 1px 2px rgba(255,255,255,.75);
}

#screen-ninas .small,
#screen-ninas .stat span,
#screen-ninas .debug-item span{
  color:#344054;
}

#screen-ninas .pill{
  background:rgba(255,255,255,.58);
}

#screen-ninas .btn{
  box-shadow:0 5px 14px rgba(0,0,0,.08);
}

#screen-ninas .btn.primary{
  background:rgba(95,191,143,.88);
}

#screen-ninas .btn.orange{
  background:rgba(255,242,221,.78);
}

#screen-ninas .btn.blue{
  background:rgba(231,240,255,.80);
}

#screen-ninas .avatar{
  background:rgba(255,244,214,.74);
}

/* V1.0 NIÑAS: UI definitiva modo cuento */
#screen-ninas .girls-screen{
  padding:10px;
}

#screen-ninas .path-card{
  max-width:100%;
}

#screen-ninas .path-card .small{
  margin:6px 0 2px;
}

#screen-ninas .grid.two{
  align-items:start;
}

#screen-ninas .girl-card{
  background:rgba(255,255,255,.40);
  backdrop-filter:blur(6px);
  border-color:rgba(255,255,255,.36);
}

#screen-ninas .quest-debug{
  position:absolute;
  right:12px;
  bottom:12px;
  z-index:5;
  width:min(360px, calc(100% - 24px));
  margin:0;
  border-radius:20px;
  background:rgba(255,255,255,.28);
  backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.36);
  box-shadow:0 10px 25px rgba(0,0,0,.14);
  padding:0;
  overflow:hidden;
}

#screen-ninas .quest-debug:not([open]){
  width:auto;
  background:rgba(255,255,255,.42);
}

#screen-ninas .debug-summary{
  list-style:none;
  cursor:pointer;
  padding:9px 12px;
  font-weight:900;
  color:#1f2933;
  user-select:none;
}

#screen-ninas .debug-summary::-webkit-details-marker{
  display:none;
}

#screen-ninas .quest-debug[open]{
  padding:0 10px 10px;
}

#screen-ninas .quest-debug[open] .debug-summary{
  padding:9px 2px 8px;
}

#screen-ninas .quest-debug .debug-grid,
#screen-ninas .quest-debug .reward-box,
#screen-ninas .quest-debug .world-preview,
#screen-ninas .quest-debug .test-actions{
  margin-left:0;
  margin-right:0;
}

#screen-ninas .quest-debug .btn{
  padding:8px 9px;
  font-size:.78rem;
}

#screen-ninas .debug-grid{
  grid-template-columns:repeat(4,1fr);
}

#screen-ninas .test-actions{
  gap:6px;
}

#screen-ninas .world-preview{
  gap:5px;
}

#screen-ninas .world-chip{
  padding:4px 7px;
}

@media(max-width:760px){
  #screen-ninas .quest-debug{
    right:9px;
    bottom:9px;
    width:min(330px, calc(100% - 18px));
  }

  #screen-ninas .quest-debug:not([open]){
    width:auto;
  }

  #screen-ninas .debug-grid{
    grid-template-columns:repeat(2,1fr);
  }

  #screen-ninas .path-card .small{
    display:none;
  }
}

/* V1.2 DEBUG NIÑAS: forzar mundo + objetivos */
#screen-ninas .quest-goals{
  display:grid;
  gap:6px;
  margin-top:8px;
}

#screen-ninas .goal-line{
  display:flex;
  gap:8px;
  justify-content:space-between;
  align-items:center;
  border-radius:12px;
  padding:7px 8px;
  background:rgba(255,255,255,.48);
  font-size:.78rem;
}

#screen-ninas .goal-line b{
  white-space:nowrap;
}

#screen-ninas .goal-line span{
  text-align:right;
  color:#344054;
}

#screen-ninas .debug-label{
  margin-top:8px;
  font-weight:900;
  font-size:.8rem;
  color:#344054;
}

#screen-ninas button.world-chip{
  border:0;
  cursor:pointer;
}

#screen-ninas .world-chip.active{
  transform:scale(1.03);
}

@media(max-width:760px){
  #screen-ninas .goal-line{
    align-items:flex-start;
    flex-direction:column;
    gap:3px;
  }

  #screen-ninas .goal-line span{
    text-align:left;
  }
}

/* V1.3 fondos cuento PRO */
#screen-ninas .girls-screen{
  background-size:cover;
  background-position:center center;
}
#screen-ninas .path-card,
#screen-ninas .girl-card{
  background:rgba(255,255,255,.34);
}
#screen-ninas .quest-debug{
  background:rgba(255,255,255,.24);
}


/* V2.1: sonidos opcionales NIÑAS */
.sound-settings .sound-row{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
  margin-top:10px;
}

.switch-line{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border-radius:14px;
  padding:9px 10px;
  background:#f8fafc;
  font-weight:800;
}

.switch-line input{
  width:20px;
  height:20px;
  accent-color:var(--green);
}


/* V2.2 FIX: asegurar partículas visibles encima de NIÑAS */
#screen-ninas .magic-particles{
  z-index:20 !important;
}

#screen-ninas .magic-particle{
  font-size:1.55rem;
  opacity:1;
}

#screen-ninas .girl-card.reward-pulse{
  animation:rewardPulseV2Fix .75s ease !important;
}

@keyframes rewardPulseV2Fix{
  0%{transform:scale(1)}
  35%{
    transform:scale(1.04);
    box-shadow:0 0 0 9px rgba(255,210,90,.28), 0 15px 34px rgba(0,0,0,.22)
  }
  100%{transform:scale(1)}
}