:root{
    --koru-bg:#0b0d0c;
    --koru-panel:#151816;
    --koru-panel-2:#1b1f1c;
    --koru-panel-3:#20241f;
    --koru-line:#272b28;
    --koru-lime:#C8E6A0;
    --koru-lime-dim:#8FAE6E;
    --koru-text:#EDEFEB;
    --koru-text-dim:#8E958D;
  }
  *{scrollbar-width:thin; scrollbar-color: var(--koru-line) transparent;}
  body{
    background-color: var(--koru-bg);
    background-image:
      radial-gradient(circle at 15% 0%, rgba(200,230,160,0.06), transparent 40%),
      radial-gradient(circle at 100% 30%, rgba(200,230,160,0.04), transparent 35%);
    color: var(--koru-text);
    font-family:'Inter', sans-serif;
  }
  .font-display{font-family:'Space Grotesk', sans-serif;}
  .font-mono{font-family:'JetBrains Mono', monospace;}
  .bg-panel{background-color:var(--koru-panel);}
  .bg-panel-2{background-color:var(--koru-panel-2);}
  .bg-panel-3{background-color:var(--koru-panel-3);}
  .border-koru{border-color:var(--koru-line);}
  .text-lime-koru{color:var(--koru-lime);}
  .bg-lime-koru{background-color:var(--koru-lime);}
  .text-dim{color:var(--koru-text-dim);}

  ::-webkit-scrollbar{width:8px;height:8px;}
  ::-webkit-scrollbar-track{background:transparent;}
  ::-webkit-scrollbar-thumb{background:var(--koru-line);border-radius:4px;}

  .koru-spiral{
    animation: spin-koru 6s linear infinite;
    transform-origin:center;
  }
  .koru-spiral.spinning{animation-duration:1.6s;}
  @keyframes spin-koru{ to { transform: rotate(360deg); } }

  .tab-active{
    background-color: var(--koru-lime);
    color:#0b0d0c;
    font-weight:600;
  }
  .page-tab-active{
    background-color: rgba(200,230,160,0.14);
    color: var(--koru-lime);
    font-weight:600;
  }
  .chip{
    border:1px solid var(--koru-line);
    transition: all .15s ease;
  }
  .chip:hover{ border-color: var(--koru-lime-dim); }
  .chip.active{
    background-color: rgba(200,230,160,0.12);
    border-color: var(--koru-lime);
    color: var(--koru-lime);
  }
  .range-mode-btn{
    color: var(--koru-text-dim);
    transition: all .15s ease;
  }
  .range-mode-btn.active{
    background-color: var(--koru-panel);
    color: var(--koru-lime);
    box-shadow: 0 0 0 1px var(--koru-lime-dim);
  }
  .ai-mode-btn{
    color: var(--koru-text-dim);
    transition: all .15s ease;
  }
  .ai-mode-btn.active{
    background-color: var(--koru-panel);
    color: var(--koru-lime);
    box-shadow: 0 0 0 1px var(--koru-lime-dim);
  }
  .input-koru{
    background-color: var(--koru-panel-2);
    border:1px solid var(--koru-line);
    color: var(--koru-text);
  }
  .input-koru:focus{
    outline:none;
    border-color: var(--koru-lime);
    box-shadow: 0 0 0 3px rgba(200,230,160,0.15);
  }
  .btn-primary{
    background-color: var(--koru-lime);
    color:#0b0d0c;
    font-weight:600;
    transition: transform .12s ease, box-shadow .12s ease;
  }
  .btn-primary:hover{ box-shadow: 0 0 0 4px rgba(200,230,160,0.15); }
  .btn-primary:active{ transform: scale(.97); }
  .btn-ghost{
    border:1px solid var(--koru-line);
    color: var(--koru-text);
    transition: all .15s ease;
  }
  .btn-ghost:hover{ border-color: var(--koru-lime-dim); color: var(--koru-lime); }

  .card-routine{
    background-color: var(--koru-panel);
    border:1px solid var(--koru-line);
    transition: border-color .15s ease, transform .12s ease;
  }
  .card-routine:hover{ border-color: var(--koru-lime-dim); transform: translateY(-1px); }
  .card-routine.selected{ border-color: var(--koru-lime); box-shadow: 0 0 0 1px var(--koru-lime); }

  .level-badge-3{ background-color: rgba(200,230,160,0.15); color: var(--koru-lime); border:1px solid var(--koru-lime-dim); }
  .level-badge-2{ background-color: rgba(255,255,255,0.06); color:#d7dad5; border:1px solid var(--koru-line); }
  .level-badge-1{ background-color: rgba(255,255,255,0.03); color: var(--koru-text-dim); border:1px solid var(--koru-line); }

  .timer-ring{ transition: stroke-dashoffset 1s linear; }

  @keyframes pulse-lime{
    0%,100%{ box-shadow: 0 0 0 0 rgba(200,230,160,0.35); }
    50%{ box-shadow: 0 0 0 10px rgba(200,230,160,0); }
  }
  .timer-pulsing{ animation: pulse-lime 1.6s ease-out infinite; }

  #sidebar{ transition: transform .25s ease; }
  /* #primaryNav anima tanto el deslizado (móvil/tablet, cajón) como el ancho (escritorio,
     plegado) — las dos como una sola declaración para no depender del orden de carga
     frente al <script> de Tailwind (evita que una pise a la otra). */
  #primaryNav{ transition: transform .25s ease, width .15s ease; }
  @media (max-width: 1023px){
    #sidebar.closed, #primaryNav.closed{ transform: translateX(-110%); }
  }

  .exercise-row{ animation: fade-in .2s ease; }
  .block-card{ animation: fade-in .2s ease; }
  @keyframes fade-in{ from{opacity:0; transform:translateY(-4px);} to{opacity:1; transform:translateY(0);} }

  .block-index-tag{
    background-color: rgba(200,230,160,0.14);
    color: var(--koru-lime);
    border:1px solid var(--koru-lime-dim);
    font-family:'Space Grotesk', sans-serif;
  }

  input[type="number"]::-webkit-outer-spin-button,
  input[type="number"]::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
  input[type="number"]{ -moz-appearance:textfield; }

  .cal-day{
    background-color: var(--koru-panel);
    border:1px solid var(--koru-line);
    transition: border-color .15s ease, background-color .15s ease;
    min-height: 92px;
  }
  .cal-day:hover{ border-color: var(--koru-lime-dim); }
  .cal-day.cal-outside{ opacity:.35; }
  .cal-day.cal-today{ border-color: var(--koru-lime-dim); }
  .cal-day.cal-selected{ border-color: var(--koru-lime); box-shadow: 0 0 0 1px var(--koru-lime); background-color: rgba(200,230,160,0.06); }
  .cal-pill{
    background-color: rgba(200,230,160,0.12);
    color: var(--koru-lime);
    border:1px solid var(--koru-lime-dim);
    font-size: 10px;
    line-height:1.3;
  }
  .session-card{
    background-color: var(--koru-panel-2);
    border:1px solid var(--koru-line);
    transition: border-color .15s ease;
  }
  .session-card:hover{ border-color: var(--koru-lime-dim); }

  .day-block{
    border:1px solid var(--koru-lime-dim);
    background-color: rgba(200,230,160,0.14);
    color: var(--koru-text);
    transition: filter .12s ease, border-color .12s ease;
    cursor: grab;
    touch-action: none;
    user-select: none;
  }
  .day-block:active{ cursor: grabbing; }
  .day-block:hover{ filter:brightness(1.15); border-color: var(--koru-lime); }
  .day-block-adhoc{
    border:1px solid var(--koru-line);
    background-color: var(--koru-panel-3);
  }
  .day-block-adhoc:hover{ border-color: var(--koru-lime-dim); }
  .day-block-aim{ box-shadow: inset 0 0 0 1.5px var(--koru-lime); }

  .occ-cell{ color: var(--koru-text); }
  .occ-cell-full{ background-color: rgba(200,230,160,0.14); border-color: var(--koru-lime-dim); }
  .occ-cell-mid{ background-color: rgba(251,191,36,0.10); border-color: rgba(251,191,36,0.5); }
  .occ-cell-low{ background-color: rgba(248,113,113,0.08); border-color: rgba(248,113,113,0.4); }

  .hour-card{
    background-color: var(--koru-panel-2);
    border: 1px solid var(--koru-lime-dim);
    box-shadow: 0 0 22px rgba(200,230,160,0.10), inset 0 0 0 1px rgba(200,230,160,0.04);
  }