/* =========================================================
   V66 · DESIGN SYSTEM UNIFICADO
   Una sola jerarquía visual para toda la plataforma.
   ========================================================= */
:root{
  --ui-bg:#f5f7fb!important;
  --ui-surface:#ffffff!important;
  --ui-surface-2:#f8fafc!important;
  --ui-surface-3:#eef2f7!important;
  --ui-border:#dfe5ee!important;
  --ui-border-strong:#cbd5e1!important;
  --ui-text:#172033!important;
  --ui-text-2:#344054!important;
  --ui-muted:#667085!important;
  --ui-subtle:#98a2b3!important;
  --ui-nav:#101827!important;
  --ui-nav-2:#172235!important;
  --ui-primary:#635bdb!important;
  --ui-primary-2:#5148c8!important;
  --ui-primary-soft:#efedff!important;
  --ui-cyan:#17a9b8!important;
  --ui-green:#15966a!important;
  --ui-yellow:#d99a16!important;
  --ui-orange:#d97706!important;
  --ui-red:#d64555!important;
  --ui-radius:12px!important;
  --ui-radius-sm:9px!important;
  --ui-shadow:0 1px 2px rgba(16,24,40,.03),0 8px 24px rgba(16,24,40,.045)!important;
  --ui-shadow-lg:0 18px 48px rgba(16,24,40,.12)!important;
}
html,body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif!important;background:var(--ui-bg)!important;color:var(--ui-text)!important}
body{font-size:13px;line-height:1.45;letter-spacing:-.005em}
*,*:before,*:after{box-sizing:border-box}
button,input,select,textarea{font-family:inherit!important}
button{cursor:pointer}

/* Shell */
#app-shell{background:var(--ui-bg)!important}
.app-sidebar,aside.app-sidebar{width:258px!important;background:linear-gradient(180deg,var(--ui-nav) 0%,#0c1421 100%)!important;border-right:1px solid rgba(255,255,255,.07)!important;box-shadow:10px 0 30px rgba(15,23,42,.08)!important}
.app-sidebar .sidebar-brand{height:70px!important;padding:0 18px!important;border-bottom:1px solid rgba(255,255,255,.07)!important}
.app-sidebar .brand-mark{width:40px!important;height:40px!important;border-radius:11px!important;background:linear-gradient(135deg,var(--ui-primary),#7b74ea)!important;box-shadow:0 8px 20px rgba(99,91,219,.28)!important}
.app-sidebar .brand-name{font-size:15px!important;font-weight:800!important;letter-spacing:-.035em!important}
.app-sidebar .brand-sub{font-size:9px!important;letter-spacing:.08em!important;color:rgba(255,255,255,.42)!important}
.sidebar-context{margin:14px 12px 10px!important;padding:11px 12px!important;border-radius:11px!important;background:rgba(255,255,255,.055)!important;border:1px solid rgba(255,255,255,.075)!important}
.nav-section-label{padding:16px 10px 7px!important;font-size:8px!important;letter-spacing:.16em!important;color:rgba(255,255,255,.32)!important}
.app-nav{gap:3px!important}
.app-nav .nav-main,.app-nav .nav-group-toggle{height:40px!important;border-radius:9px!important;padding:0 11px!important;color:rgba(255,255,255,.63)!important;border:1px solid transparent!important;background:transparent!important}
.app-nav .nav-main:hover,.app-nav .nav-group-toggle:hover{background:rgba(255,255,255,.055)!important;color:#fff!important}
.app-nav .nav-main.active,.app-nav .nav-group.active>.nav-group-toggle,.app-nav .nav-group.open>.nav-group-toggle{background:linear-gradient(90deg,rgba(99,91,219,.22),rgba(99,91,219,.08))!important;border-color:rgba(123,116,234,.2)!important;box-shadow:inset 3px 0 0 var(--ui-primary)!important;color:#fff!important}
.app-nav .tab-label{font-size:12px!important;font-weight:650!important}
.app-nav .tab-icon{width:17px!important;height:17px!important}
.app-nav .active .tab-icon,.app-nav .nav-group.active .tab-icon{color:#a9a3ff!important}
.sidebar-plan-card{border-radius:11px!important;background:linear-gradient(135deg,rgba(99,91,219,.17),rgba(23,169,184,.035))!important;border:1px solid rgba(123,116,234,.18)!important}

/* Header */
.app-header{height:68px!important;padding:0 22px!important;background:rgba(255,255,255,.92)!important;border-bottom:1px solid var(--ui-border)!important;box-shadow:0 1px 0 rgba(16,24,40,.02)!important;backdrop-filter:blur(16px)!important}
.app-header .ah-search{height:40px!important;border-radius:10px!important;background:var(--ui-surface-2)!important;border:1px solid var(--ui-border)!important}
.app-header .ah-search:focus-within{border-color:rgba(99,91,219,.5)!important;box-shadow:0 0 0 3px rgba(99,91,219,.09)!important}
.ah-icon-btn,.header-actions button,.header-equipo-gestionar,.header-equipo-select{border-radius:10px!important;border:1px solid var(--ui-border)!important;background:#fff!important;color:var(--ui-text)!important}
.header-equipo-select{height:40px!important;font-weight:650!important}

/* Page */
main{background:var(--ui-bg)!important}
.tab-panel{max-width:1500px!important;margin:0 auto!important;padding:26px 28px 48px!important}
.tab-panel>h1,.tab-panel>h2,.page-title{font-weight:800!important;letter-spacing:-.04em!important;color:var(--ui-text)!important}
.tab-panel>p,.page-subtitle{color:var(--ui-muted)!important}

/* Universal cards / panels */
.card,.panel,.table-wrap,.inicio-card,.inicio-quick-card,.inicio-hero,.kpi-card,.modal-content,.section-card,.settings-card{border:1px solid var(--ui-border)!important;border-radius:var(--ui-radius)!important;background:var(--ui-surface)!important;box-shadow:var(--ui-shadow)!important}
.card,.panel,.section-card,.settings-card{padding:18px!important}
.card-title,.panel-header h2,.section-title{color:var(--ui-text)!important;font-weight:780!important;letter-spacing:-.025em!important}
.panel-header{margin-bottom:16px!important}
.muted,.text-muted{color:var(--ui-muted)!important}

/* Buttons */
.btn,.button,.btn-ghost,.btn-secondary,.btn-outline{min-height:36px!important;padding:0 13px!important;border-radius:9px!important;border:1px solid var(--ui-border)!important;background:#fff!important;color:var(--ui-text)!important;font-weight:650!important;box-shadow:none!important;transition:background .15s ease,border-color .15s ease,box-shadow .15s ease,transform .15s ease!important}
.btn:hover,.button:hover,.btn-ghost:hover,.btn-secondary:hover,.btn-outline:hover{background:var(--ui-surface-2)!important;border-color:var(--ui-border-strong)!important;box-shadow:0 5px 14px rgba(16,24,40,.06)!important;transform:translateY(-1px)}
.btn-primary,.button-primary,.btn.btn-primary{background:var(--ui-primary)!important;border-color:var(--ui-primary)!important;color:#fff!important;box-shadow:0 6px 16px rgba(99,91,219,.18)!important}
.btn-primary:hover,.button-primary:hover{background:var(--ui-primary-2)!important;border-color:var(--ui-primary-2)!important}
.btn-success{background:var(--ui-green)!important;border-color:var(--ui-green)!important;color:#fff!important}
.btn-warn{background:var(--ui-orange)!important;border-color:var(--ui-orange)!important;color:#fff!important}
.btn-danger,.btn-delete{background:#fff!important;color:var(--ui-red)!important;border-color:#f1c6cb!important}

/* Inputs */
input,select,textarea{min-height:38px!important;border:1px solid var(--ui-border)!important;border-radius:9px!important;background:#fff!important;color:var(--ui-text)!important;box-shadow:none!important}
textarea{padding:10px 12px!important}
input::placeholder,textarea::placeholder{color:#98a2b3!important}
input:focus,select:focus,textarea:focus{outline:none!important;border-color:rgba(99,91,219,.62)!important;box-shadow:0 0 0 3px rgba(99,91,219,.09)!important}
label{color:var(--ui-text-2)!important;font-weight:650!important}

/* KPI / metrics */
.kpi-card,.inicio-kpi{border-radius:11px!important;background:#fff!important;border:1px solid var(--ui-border)!important;box-shadow:none!important}
.kpi-value,.inicio-kpi-value{font-weight:820!important;letter-spacing:-.045em!important;color:var(--ui-text)!important}
.kpi-label,.inicio-kpi-label{font-size:10px!important;text-transform:uppercase!important;letter-spacing:.08em!important;color:var(--ui-muted)!important;font-weight:750!important}

/* Tables */
table{border-collapse:separate!important;border-spacing:0!important}
th{background:var(--ui-surface-2)!important;color:#667085!important;border-bottom:1px solid var(--ui-border)!important;font-size:10px!important;text-transform:uppercase!important;letter-spacing:.07em!important;font-weight:750!important}
td{border-bottom:1px solid #edf0f4!important;color:var(--ui-text-2)!important}
tbody tr:hover td{background:#fafbff!important}

/* Tabs / segmented controls */
.tabs,.tab-nav,.view-switch,.segmented{gap:4px!important;padding:4px!important;border:1px solid var(--ui-border)!important;background:var(--ui-surface-2)!important;border-radius:10px!important}
.tabs button,.tab-nav button,.view-switch button,.segmented button{border:0!important;border-radius:7px!important;background:transparent!important;color:var(--ui-muted)!important;font-weight:650!important}
.tabs button.active,.tab-nav button.active,.view-switch button.active,.segmented button.active{background:#fff!important;color:var(--ui-primary)!important;box-shadow:0 1px 4px rgba(16,24,40,.08)!important}

/* Badges / pills */
.badge,.pill,.status-badge,.tag,.chip{border-radius:999px!important;font-weight:720!important;border:1px solid transparent!important}

/* Modals */
.modal{background:rgba(15,23,42,.48)!important;backdrop-filter:blur(7px)!important}
.modal-content{box-shadow:var(--ui-shadow-lg)!important;overflow:hidden!important}
.modal-header{padding:18px 20px!important;border-bottom:1px solid var(--ui-border)!important;background:#fff!important}
.modal-header h2,.modal-header h3{font-weight:800!important;letter-spacing:-.03em!important;color:var(--ui-text)!important}
.modal-body{padding:20px!important}
.modal-actions{padding-top:16px!important;border-top:1px solid var(--ui-border)!important;display:flex!important;justify-content:flex-end!important;gap:8px!important}

/* Forms / wellness */
.wellness-question{background:#fff!important;border:1px solid var(--ui-border)!important;border-radius:12px!important;padding:16px!important;box-shadow:none!important}
.wellness-question-title h4{font-size:14px!important;font-weight:780!important;color:var(--ui-text)!important}
.badge-meaning{background:var(--ui-surface-2)!important;border:1px solid var(--ui-border)!important;color:var(--ui-muted)!important;border-radius:999px!important;padding:4px 8px!important;font-size:10px!important}
.wellness-scale{gap:6px!important}
.wellness-scale button{height:42px!important;border-radius:8px!important;border:1px solid var(--ui-border)!important;background:#fff!important;color:var(--ui-text-2)!important;font-weight:750!important}
.wellness-scale button:hover{border-color:var(--ui-primary)!important;background:var(--ui-primary-soft)!important;color:var(--ui-primary)!important}
.wellness-scale button.selected{background:var(--ui-primary)!important;border-color:var(--ui-primary)!important;color:#fff!important}

/* Planning / microcycle day cards */
.micro-day,.day-card,.plan-day,.calendar-day{border:1px solid var(--ui-border)!important;border-radius:12px!important;background:#fff!important;box-shadow:none!important;overflow:hidden!important}
.micro-day-header,.day-card-header,.plan-day-header{border-bottom:1px solid var(--ui-border)!important;background:var(--ui-surface-2)!important}
.micro-day-body,.day-card-body,.plan-day-body{padding:12px!important}

/* C1-C5 semantic accents — same component language, only status color changes */
.c1,.c2,.c3,.c4,.c5{border-radius:9px!important;box-shadow:none!important}

/* External load */
.external-load-card,.load-task,.task-card,.task-item{border:1px solid var(--ui-border)!important;border-radius:10px!important;background:#fff!important;box-shadow:none!important}
.task-card:hover,.task-item:hover{border-color:#cbd5e1!important;box-shadow:0 4px 12px rgba(16,24,40,.05)!important}
.task-card-header,.task-item-header{background:var(--ui-surface-2)!important;border-bottom:1px solid var(--ui-border)!important}

/* Player / profile */
.profile-card,.player-card{border:1px solid var(--ui-border)!important;border-radius:12px!important;background:#fff!important;box-shadow:var(--ui-shadow)!important}
.avatar,.profile-avatar,.user-avatar{border-radius:50%!important;border:2px solid #fff!important;box-shadow:0 2px 8px rgba(16,24,40,.12)!important}

/* Dashboard hero */
.inicio-hero{background:linear-gradient(135deg,#182235 0%,#202c45 58%,#343a70 100%)!important;color:#fff!important;border:0!important;box-shadow:0 16px 36px rgba(17,24,39,.16)!important}
.inicio-hero *{color:inherit}

/* Landing uses same brand language */
.landing{background:#f5f7fb!important;color:var(--ui-text)!important}
.landing-nav{background:rgba(245,247,251,.92)!important;border-bottom:1px solid var(--ui-border)!important;backdrop-filter:blur(16px)!important}
.ln-mark{background:linear-gradient(135deg,var(--ui-primary),#7b74ea)!important;border-radius:10px!important}
.hl-primary{color:var(--ui-primary)!important}
.btn-landing.btn-primary{background:var(--ui-primary)!important;border-color:var(--ui-primary)!important}
.price-card{border:1px solid var(--ui-border)!important;border-radius:14px!important;background:#fff!important;box-shadow:var(--ui-shadow)!important}

/* Scrollbars */
*{scrollbar-width:thin;scrollbar-color:#cbd5e1 transparent}
*::-webkit-scrollbar{width:8px;height:8px}
*::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:999px}
*::-webkit-scrollbar-track{background:transparent}

/* Dark theme: same design language, darker surfaces */
[data-theme="dark"]{
 --ui-bg:#0b1120!important;--ui-surface:#111827!important;--ui-surface-2:#151e2f!important;--ui-surface-3:#1b2638!important;
 --ui-border:#283448!important;--ui-border-strong:#3a4860!important;--ui-text:#f4f6fa!important;--ui-text-2:#d5dbe5!important;--ui-muted:#9aa5b7!important;
 --ui-primary:#8179ee!important;--ui-primary-2:#938cf5!important;--ui-primary-soft:#211f48!important;
}
[data-theme="dark"] .app-header{background:rgba(15,23,42,.93)!important;border-bottom-color:var(--ui-border)!important}
[data-theme="dark"] .app-header .ah-search,[data-theme="dark"] input,[data-theme="dark"] select,[data-theme="dark"] textarea,[data-theme="dark"] .btn,[data-theme="dark"] .header-actions button,[data-theme="dark"] .header-equipo-select{background:var(--ui-surface)!important;color:var(--ui-text)!important;border-color:var(--ui-border)!important}
[data-theme="dark"] .card,[data-theme="dark"] .panel,[data-theme="dark"] .table-wrap,[data-theme="dark"] .modal-content,[data-theme="dark"] .wellness-question,[data-theme="dark"] .task-card,[data-theme="dark"] .profile-card{background:var(--ui-surface)!important;border-color:var(--ui-border)!important}
[data-theme="dark"] th{background:var(--ui-surface-2)!important;color:var(--ui-muted)!important}
[data-theme="dark"] td{border-bottom-color:var(--ui-border)!important;color:var(--ui-text-2)!important}
[data-theme="dark"] tbody tr:hover td{background:var(--ui-surface-2)!important}
[data-theme="dark"] .modal-header{background:var(--ui-surface)!important;border-bottom-color:var(--ui-border)!important}

@media(max-width:900px){
 .tab-panel{padding:20px 14px 40px!important}
 .app-header{padding:0 12px!important}
 .card,.panel{padding:14px!important}
}