/* Capa visual del espacio privado. */
body.is-private-route {
  --color-bg: #f6f4ee;
  --color-surface: #fffdf8;
  --color-surface-soft: #f1efe7;
  --color-text: #171714;
  --color-muted: #67675e;
  --color-border: #e4e3da;
  --color-sidebar: #fffdf8;
  background: var(--color-bg);
  color: var(--color-text);
}

body.is-private-route #privateApp .private-layout,
body.is-private-route #privateApp .private-main { background: #f6f4ee; color: #171714; }
body.is-private-route #privateApp .private-sidebar { background: #fffdf8; color: #171714; border-color: #e4e3da; box-shadow: none; }
body.is-private-route #privateApp .private-sidebar .brand { color: #171714; }
body.is-private-route #privateApp .private-sidebar nav a,
body.is-private-route #privateApp .sidebar-user strong { color: #171714; }
body.is-private-route #privateApp .sidebar-section > p,
body.is-private-route #privateApp .sidebar-user > span,
body.is-private-route #privateApp .sidebar-legal-links a { color: #67675e; }
body.is-private-route #privateApp .private-sidebar nav a { border-radius: 11px; }
body.is-private-route #privateApp .private-sidebar nav a:hover { background: #f1efe7; border-color: #e4e3da; }
body.is-private-route #privateApp .private-sidebar nav a.active { color: #171714; background: #f2c400; border-color: #f2c400; box-shadow: none; }
body.is-private-route #privateApp .private-sidebar nav a::before,
body.is-private-route #privateApp .private-sidebar nav a::after { color: #67675e; }
body.is-private-route #privateApp .private-sidebar nav a.active::before,
body.is-private-route #privateApp .private-sidebar nav a.active::after { color: #171714; background: transparent; }
body.is-private-route #privateApp .mobile-more-nav > summary { color: #67675e; }
body.is-private-route #privateApp .mobile-more-panel { background: #fffdf8; border-color: #e4e3da; box-shadow: 0 8px 30px #302b2218; }
body.is-private-route #privateApp :is(.data-card, .card, .metric-card, .ops-panel, .admin-metrics article, .progress-snapshot article, .task-row, .week-goal, .trophy-card, .mobile-week-card, .mobile-ranking-preview, .onboarding-goal-card, .onboarding-contract-card, .test-progress-card, .likert-question) {
  background: #fffdf8;
  color: #171714;
  border-color: #e4e3da;
  border-radius: 20px;
  box-shadow: 0 6px 20px #302b2205;
}
/* Se conserva la distinción de la siguiente acción, sin gradientes oscuros. */
body.is-private-route #privateApp :is(.home-next-action-card, .home-primary-card, .mobile-focus-card) { background: #f2c400; color: #171714; border-color: #f2c400; box-shadow: none; }
body.is-private-route #privateApp :is(h1, h2, h3, h4, .progress-snapshot strong, .admin-metrics strong, .question-title, .test-block-title) { color: #171714; }
body.is-private-route #privateApp .private-heading h1 { font-family: Inter, system-ui, sans-serif; font-size: clamp(30px, 3.6vw, 46px); font-weight: 750; line-height: 1.12; letter-spacing: -.045em; }
body.is-private-route #privateApp :is(.muted-copy, .data-card p, .admin-metrics span, .progress-snapshot span, .progress-snapshot small, .eyebrow, .mobile-week-meta, .mobile-ranking-preview li, .mobile-ranking-preview li small, .test-block-number, .test-block-range) { color: #67675e; }
body.is-private-route #privateApp :is(.home-next-action-card, .home-primary-card, .mobile-focus-card) :is(p, .eyebrow) { color: #494016; }
body.is-private-route #privateApp :is(.mobile-ranking-preview > div strong, .mobile-ranking-preview > a, .mobile-ranking-preview li span, .mobile-week-meta span:last-child) { color: #3f6f5b; }
body.is-private-route #privateApp .mobile-ranking-preview li.is-current { background: #eaf0e9; color: #171714; border-color: #d9e3d7; }
body.is-private-route #privateApp .button { border-radius: 11px; min-height: 44px; box-shadow: none; }
body.is-private-route #privateApp .button.primary { background: #171714; border-color: #171714; color: #fffdf8; }
body.is-private-route #privateApp .button.primary:hover { background: #34372c; }
body.is-private-route #privateApp :is(.button.secondary, .logout-button, .table-button) { background: #fffdf8; color: #171714; border-color: #e4e3da; }
body.is-private-route #privateApp :is(input:not([type=checkbox]):not([type=radio]):not([type=range]), select, textarea) { background: #fffdf8; color: #171714; border-color: #bcbeb2; border-radius: 10px; box-shadow: none; }
body.is-private-route #privateApp :is(input, textarea)::placeholder { color: #67675e; }
body.is-private-route #privateApp label { color: #171714; }
body.is-private-route #privateApp .onboarding-examples button,
body.is-private-route #privateApp .likert-options span { background: #f1efe7; color: #171714; border-color: #e4e3da; }
body.is-private-route #privateApp .likert-options input:checked + span { background: #f2c400; color: #171714; border-color: #f2c400; }
body.is-private-route #privateApp :is(th, td) { border-color: #e4e3da; }
body.is-private-route #privateApp th { background: #f1efe7; color: #67675e; }
body.is-private-route #privateApp td { color: #171714; }
body.is-private-route #privateApp :is(a, button, input, select, textarea, summary):focus-visible { outline: 3px solid #153d63; outline-offset: 3px; }
@media (max-width: 1020px) {
  body.is-private-route #privateApp .private-sidebar { background: #fffdf8; border-color: #e4e3da; box-shadow: 0 -4px 16px #302b2208; }
}
@media (max-width: 760px) {
  body.is-private-route #privateApp .private-heading h1 { font-size: clamp(30px, 8vw, 40px); }
}

/* Acceso: entrada breve y movimiento decorativo, respetando movimiento reducido. */
body #privateApp .auth-screen.auth-screen-premium { background: #f6f4ee; color: #171714; }
body #privateApp .auth-card.auth-login-card { background: #fffdf8; border: 1px solid #e4e3da; border-radius: 24px; box-shadow: 0 20px 60px #302b220c; animation: usi-access-enter .55s ease-out both; }
body #privateApp .auth-premium-panel { background: #f2c400; color: #171714; border-color: #e4e3da; }
body #privateApp .auth-premium-panel::before { inset: auto -140px 30px auto; width: 360px; height: 360px; border: 1px solid #1717141a; border-radius: 50%; background: transparent; animation: usi-access-orbit 2.2s ease-out both; }
body #privateApp .auth-premium-panel::after { right: -95px; bottom: 75px; width: 270px; height: 270px; border: 1px solid #17171415; border-radius: 50%; background: transparent; animation: usi-access-orbit 2.8s ease-out both; }
body #privateApp .auth-premium-panel :is(h2, .brand) { color: #171714; }
body #privateApp .auth-premium-panel :is(p, .eyebrow) { color: #494016; }
body #privateApp .auth-premium-panel h2 { font-family: Inter, system-ui, sans-serif; font-size: clamp(30px, 3.5vw, 46px); letter-spacing: -.045em; line-height: 1.12; }
body #privateApp .auth-premium-signals span { background: #ffffff65; border-color: #17171412; color: #494016; }
body #privateApp .auth-form-panel { background: #fffdf8; color: #171714; }
body #privateApp .auth-login-card h1 { color: #171714; font-family: Inter, system-ui, sans-serif; letter-spacing: -.045em; }
body #privateApp .auth-login-card :is(.auth-form label, .premium-remember) { color: #171714; }
body #privateApp .auth-login-card :is(.auth-form-panel > p, .auth-secure-note, .eyebrow) { color: #67675e; }
body #privateApp .auth-login-card .auth-form input:not([type=checkbox]) { background: #fffdf8; color: #171714; border-color: #bcbeb2; box-shadow: none; border-radius: 10px; }
body #privateApp .auth-login-card .auth-form input::placeholder { color: #67675e; }
body #privateApp .auth-login-card .premium-remember { background: transparent; border-color: transparent; }
body #privateApp .auth-login-card input[type=checkbox] { accent-color: #3f6f5b; }
body #privateApp .auth-login-card .button.primary { background: #171714; color: #fffdf8; border-color: #171714; border-radius: 11px; box-shadow: none; }
body #privateApp .auth-login-card .button.primary:hover { background: #34372c; }
body #privateApp .auth-login-card .auth-links a { color: #3f6f5b; }
body #privateApp .auth-login-card :is(input, button, a):focus-visible { outline: 3px solid #153d63; outline-offset: 3px; }
@keyframes usi-access-enter { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
/* Hoy: una siguiente acción y detalles que se abren cuando hacen falta. */
body #privateApp .participant-app-home .mobile-today-dashboard { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 20px; }
body #privateApp .participant-app-home .mobile-today-heading { grid-column: 1 / -1; color: #67675e; }
body #privateApp .participant-app-home .mobile-today-heading span { color: #3f6f5b; }
body #privateApp .participant-app-home .mobile-focus-card { display: grid; align-content: start; gap: 16px; padding: 30px; border-radius: 20px; background: #f2c400; }
body #privateApp .participant-app-home .mobile-focus-card :is(h2, span) { color: #171714; }
body #privateApp .participant-app-home .mobile-focus-card h2 { font-family: Inter, system-ui, sans-serif; font-size: clamp(26px, 3vw, 36px); line-height: 1.15; letter-spacing: -.04em; }
body #privateApp .participant-app-home .mobile-focus-card > p { color: #494016; }
body #privateApp .participant-app-home .mobile-week-card { display: grid; align-content: center; gap: 16px; padding: 26px; }
body #privateApp .participant-app-home .mobile-week-card strong { color: #171714; font-size: clamp(26px, 3vw, 36px); letter-spacing: -.04em; }
body #privateApp .participant-app-home .mobile-week-card > p { color: #67675e; }
body #privateApp .home-study-shortcuts { grid-column: 1 / -1; display: flex; gap: 12px; flex-wrap: wrap; }
body #privateApp .participant-app-home .home-section-details { display: block; background: #fffdf8; border: 1px solid #e4e3da; border-radius: 16px; padding: 0 20px; }
body #privateApp .participant-app-home .home-section-details > summary { color: #171714; padding: 18px 0; cursor: pointer; min-height: 54px; }
body #privateApp .participant-app-home .home-section-details[open] { padding-bottom: 20px; }
body #privateApp .participant-app-home .home-section-details[open] > :not(summary) { margin-top: 16px; }
body #privateApp .participant-app-home .home-section-details[open] :is(.home-command-grid, .home-next-action-card, .activation-card, .second-attempt-index-card, .first-intent-card, .home-nudge-grid) { display: grid; }
body #privateApp .participant-app-home .mobile-focus-card .button { transition: background .15s, transform .15s; }
body #privateApp .participant-app-home .mobile-focus-card .button:hover { transform: translateY(-2px); }
body #privateApp .participant-app-home .mobile-focus-card .button:active { transform: translateY(0); }
@media (max-width: 760px) {
  body #privateApp .participant-app-home .mobile-today-dashboard { grid-template-columns: minmax(0, 1fr); }
  body #privateApp .participant-app-home .mobile-focus-card { padding: 24px; }
  body #privateApp .participant-app-home .home-study-shortcuts > a { flex: 1 1 140px; }
}
@keyframes usi-access-orbit { from { opacity: 0; scale: .86; } to { opacity: 1; scale: 1; } }
@media (prefers-reduced-motion: reduce) {
  body #privateApp .auth-card.auth-login-card,
  body #privateApp .auth-premium-panel::before,
  body #privateApp .auth-premium-panel::after { animation: none; }
  body #privateApp .participant-app-home .mobile-focus-card .button { transition: none; transform: none; }
}

/* Placeholders estáticos: sin animación ni bloqueo artificial de duración. */
.space-skeleton { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 32px; max-width: 1200px; margin: auto; padding: 32px 24px; min-height: 70vh; }
.space-skeleton-sidebar, .space-skeleton-main { min-width: 0; }
.skeleton-line, .skeleton-card { background: #e8e5dc; border-radius: 14px; }
.skeleton-line { height: 18px; width: 72%; margin-bottom: 24px; }
.skeleton-title { height: 32px; width: 55%; margin-bottom: 32px; }
.skeleton-subtitle { width: 40%; }
.skeleton-card { min-height: 160px; }
.skeleton-focus { min-height: 240px; margin: 32px 0 24px; }
.skeleton-card-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
@media (max-width: 760px) {
  .space-skeleton { grid-template-columns: 1fr; padding: 24px 16px; }
  .space-skeleton-sidebar { display: none; }
  .skeleton-card-row { gap: 16px; }
  .skeleton-focus { min-height: 220px; }
}

body #privateApp .participant-app-home .home-focus-reason { font-size: 15px; line-height: 1.55; margin: 0; }
body #privateApp .participant-app-home .home-plan-advice { border-top: 1px solid #e4e3da; padding-top: 16px; }
body #privateApp .participant-app-home .home-plan-advice > summary { cursor: pointer; padding: 12px 0; color: #3f6f5b; }
body #privateApp .participant-app-home :is(#home-plan, #home-progress) { scroll-margin-top: 24px; }
@media (max-width: 760px) {
  body #privateApp .participant-app-home .home-study-shortcuts > button { flex: 1 1 140px; }
}

/* Mi espacio: ritmo compacto y una sola acción dominante. */
body #privateApp .participant-app-home .private-main { max-width: 1040px; width: 100%; padding: clamp(18px, 3vw, 32px); gap: 14px; }
body #privateApp .participant-app-home .private-heading { margin-bottom: 4px; gap: 12px; }
body #privateApp .participant-app-home .private-heading h1 { font-size: clamp(26px, 3vw, 36px); }
body #privateApp .participant-app-home .mobile-today-dashboard { gap: 14px; margin-bottom: 18px; }
body #privateApp .participant-app-home .mobile-today-heading { margin: 0; }
body #privateApp .participant-app-home .mobile-focus-card { padding: 22px; gap: 10px; min-height: 0; border-radius: 18px; }
body #privateApp .participant-app-home .mobile-focus-card h2 { font-size: clamp(23px, 2.5vw, 30px); margin: 0; }
body #privateApp .participant-app-home .mobile-focus-card .button { margin-top: 6px; }
body #privateApp .participant-app-home .mobile-week-card { padding: 20px; gap: 10px; min-height: 0; border-radius: 18px; }
body #privateApp .participant-app-home .mobile-week-card strong { font-size: clamp(24px, 2.5vw, 30px); }
body #privateApp .participant-app-home .home-section-details { padding: 0 16px; border-radius: 14px; margin: 0 0 10px; }
body #privateApp .participant-app-home .home-section-details > summary { padding: 14px 0; min-height: 48px; font-weight: 650; font-size: 15px; }
body #privateApp .participant-app-home .home-section-details[open] { padding-bottom: 16px; }
body #privateApp .participant-app-home .home-command-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 14px; margin-bottom: 14px; }
body #privateApp .participant-app-home .home-primary-card { grid-column: 1 / -1; }
body #privateApp .participant-app-home .data-card { padding: 18px; border-radius: 14px; min-width: 0; min-height: 0; overflow-wrap: anywhere; }
body #privateApp .participant-app-home .data-card h2 { font-size: clamp(20px, 2vw, 25px); line-height: 1.25; margin-bottom: 10px; }
body #privateApp .participant-app-home .data-card .eyebrow { font-size: 11px; }
body #privateApp .participant-app-home .home-weekly-ritual .weekly-ritual-grid { gap: 18px; }
body #privateApp .participant-app-home :is(.case-form, .compact-form) { gap: 12px; }
body #privateApp .participant-app-home [data-home-lazy] { display: none; }
@media (max-width: 760px) {
  body #privateApp .participant-app-home .private-main { padding: 18px 14px 100px; }
  body #privateApp .participant-app-home .mobile-focus-card { padding: 20px; }
  body #privateApp .participant-app-home .mobile-week-card { padding: 16px; }
  body #privateApp .participant-app-home .home-study-shortcuts { gap: 8px; }
  body #privateApp .participant-app-home .home-study-shortcuts .button { font-size: 13px; }
  body #privateApp .participant-app-home .weekly-ritual-grid { grid-template-columns: minmax(0, 1fr); }
}

body #privateApp .personal-performance-dashboard { padding: clamp(18px, 3vw, 28px); background: #fffdf8; }
.performance-header, .performance-chart-heading, .performance-footer { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.performance-header h2 { margin: 4px 0 8px; }
.performance-header p { margin: 0; }
.performance-momentum { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(150px, .8fr); align-items: center; gap: 10px 22px; margin-top: 22px; padding: 18px 20px; overflow: hidden; background: #171714; color: #fffdf8; border-radius: 16px; }
.performance-momentum::after { content: ""; position: absolute; width: 130px; height: 130px; right: -50px; top: -55px; border: 1px solid #ffffff24; border-radius: 50%; }
.performance-momentum > div:first-child { display: grid; gap: 4px; }
.performance-momentum span { color: #bfc1b8; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.performance-momentum strong { color: #fffdf8; font-size: clamp(18px, 2.3vw, 24px); line-height: 1.15; }
.performance-momentum small { grid-column: 1 / -1; max-width: 620px; color: #cfd0c9; line-height: 1.45; }
.performance-momentum-path { position: relative; display: flex; align-items: flex-end; justify-content: space-between; height: 48px; padding: 0 3px 9px; }
.performance-momentum-path::before { content: ""; position: absolute; left: 4px; right: 4px; bottom: 12px; height: 2px; background: linear-gradient(90deg, #f2c40055, #f2c400); transform: rotate(-8deg); transform-origin: left; }
.performance-momentum-path i { position: relative; z-index: 1; width: 9px; height: 9px; border: 2px solid #171714; border-radius: 50%; background: #f2c400; }
.performance-momentum-path i:nth-child(2) { margin-bottom: 4px; }
.performance-momentum-path i:nth-child(3) { margin-bottom: 8px; }
.performance-momentum-path i:nth-child(4) { margin-bottom: 14px; }
.performance-momentum-path i:nth-child(5) { margin-bottom: 20px; }
.performance-momentum-path b { position: absolute; right: 0; top: -2px; width: 20px; height: 20px; border-radius: 50%; background: #f2c400; box-shadow: 0 0 0 6px #f2c4002b; }
.performance-momentum-down .performance-momentum-path { transform: scaleY(-1); }
.performance-momentum-neutral .performance-momentum-path::before { transform: none; }
.performance-period { display: inline-flex; padding: 4px; gap: 4px; background: #f1efe7; border-radius: 12px; }
.performance-period button { border: 0; background: transparent; color: #67675e; border-radius: 9px; min-height: 44px; padding: 8px 14px; cursor: pointer; font: inherit; }
.performance-period button[aria-pressed=true] { background: #171714; color: #fffdf8; }
.performance-overview { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 28px; align-items: center; margin: 26px 0; }
.performance-ring { width: 170px; height: 170px; padding: 12px; border-radius: 50%; background: conic-gradient(#3f6f5b var(--progress), #e9e7de 0); }
.performance-ring > div { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; background: #fffdf8; border-radius: 50%; text-align: center; }
.performance-ring strong { font-size: 38px; line-height: 1.2; letter-spacing: -.05em; color: #171714; }
.performance-ring span { font-size: 12px; line-height: 1.4; color: #67675e; }
.performance-kpis { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.performance-kpis > div { background: #f6f4ee; padding: 15px; border-radius: 14px; display: grid; gap: 6px; }
.performance-kpis span { font-size: 12px; color: #67675e; }
.performance-kpis strong { font-size: clamp(22px, 2.5vw, 30px); letter-spacing: -.04em; color: #171714; }
.performance-kpis small { font-size: 11px; font-weight: 400; color: #77786f; }
.performance-activity { border: 1px solid #e4e3da; border-radius: 16px; padding: 18px; }
.performance-chart-heading h3 { margin: 0; font-size: 16px; }
.performance-chart-heading > span { font-size: 11px; color: #67675e; }
.performance-chart-heading i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #3f6f5b; margin-right: 4px; }
.performance-chart-heading i.is-productive { margin-left: 8px; background: #f2c400; }
.performance-bars { display: grid; grid-template-columns: repeat(var(--days), minmax(0, 1fr)); gap: 5px; margin: 18px 0 12px; }
.performance-day { border: 0; background: transparent; padding: 0 2px; min-width: 0; cursor: pointer; color: #67675e; border-radius: 6px; }
.performance-bar-track { display: flex; align-items: flex-end; height: 110px; border-bottom: 1px solid #e4e3da; }
.performance-bar-track i { position: relative; display: block; width: 100%; max-width: 44px; margin: auto auto 0; overflow: hidden; background: #aac0ad; border-radius: 7px 7px 2px 2px; }
.performance-bar-track i b { position: absolute; left: 0; right: 0; bottom: 0; display: block; background: #3f6f5b; border-radius: 5px 5px 2px 2px; }
.performance-day[aria-pressed=true] .performance-bar-track i, .performance-day:hover .performance-bar-track i { background: #f4d961; }
.performance-day[aria-pressed=true] .performance-bar-track i b, .performance-day:hover .performance-bar-track i b { background: #171714; }
.performance-day[aria-pressed=true] { background: #eaf0e9; color: #234a36; }
.performance-day small { display: block; font-size: 10px; margin-top: 8px; white-space: nowrap; }
.performance-day-detail { font-size: 13px; color: #3f6f5b; margin: 12px 0 0; min-height: 36px; }
.performance-empty { font-size: 14px; line-height: 1.5; color: #67675e; }
.performance-footer { margin: 20px 0; }
.performance-footer > span { max-width: 280px; font-size: 11px; color: #67675e; }
@media (max-width: 600px) {
  .performance-momentum { grid-template-columns: 1fr; padding: 16px; }
  .performance-momentum-path { display: none; }
  .performance-overview { grid-template-columns: 1fr; gap: 18px; margin: 20px 0; }
  .performance-ring { width: 142px; height: 142px; margin: auto; }
  .performance-kpis { gap: 10px; }
  .performance-kpis > div { padding: 12px; }
  .performance-activity { padding: 12px; }
  .performance-bars { gap: 2px; }
  .performance-footer .button { width: 100%; }
}

/* Experiencia de usuario: navegación común, centrada en empezar y continuar. */
body.is-private-route #privateApp .participant-navigation {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 20px 16px;
  overflow: visible;
  border: 0;
  background: #171714;
  color: #fffdf8;
  box-shadow: 12px 0 40px rgba(23, 23, 20, .08);
}
body.is-private-route #privateApp .participant-brand { display: flex; align-items: center; gap: 10px; padding: 4px 8px 18px; color: #fffdf8 !important; font-size: 15px; }
body.is-private-route #privateApp .participant-brand .brand-symbol { width: 34px; height: 34px; }
body.is-private-route #privateApp .participant-primary-nav { display: grid; gap: 6px; }
body.is-private-route #privateApp .participant-primary-nav a,
body.is-private-route #privateApp .participant-tools-nav summary,
body.is-private-route #privateApp .participant-tools-panel a {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 48px;
  padding: 6px 10px;
  border: 1px solid transparent;
  border-radius: 13px;
  color: #c9cac3;
  font-size: 14px;
  font-weight: 650;
  text-decoration: none;
  cursor: pointer;
  list-style: none;
}
body.is-private-route #privateApp .participant-tools-nav summary::-webkit-details-marker { display: none; }
body.is-private-route #privateApp .participant-navigation :is(.participant-primary-nav a, .participant-tools-nav summary, .participant-tools-panel a):hover { background: #ffffff0d; color: #fffdf8; }
body.is-private-route #privateApp .participant-navigation :is(.participant-primary-nav a.active, .participant-tools-nav.active > summary, .participant-tools-panel a.active) { border-color: #f2c400; background: #f2c400; color: #171714; }
body.is-private-route #privateApp .participant-navigation .participant-primary-nav a:not(.active),
body.is-private-route #privateApp .participant-navigation .participant-tools-panel a:not(.active) { color: #c9cac3 !important; }
.participant-nav-icon { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 10px; background: #ffffff0d; }
.participant-nav-icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
body.is-private-route #privateApp .participant-navigation .active .participant-nav-icon { background: #ffffff52; }
.participant-tools-nav { position: relative; }
.participant-tools-panel { display: none; gap: 5px; margin-top: 6px; padding: 6px; border-radius: 14px; background: #24241f; }
.participant-tools-nav[open] .participant-tools-panel { display: grid; }
.participant-tools-panel a { min-height: 44px !important; font-size: 13px !important; }
.participant-tools-panel .participant-nav-icon { width: 32px; height: 32px; }
.participant-tools-panel .participant-nav-icon svg { width: 18px; height: 18px; }
.participant-sidebar-spacer { flex: 1; }
body.is-private-route #privateApp .participant-user-card { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 9px; padding: 10px; border: 1px solid #ffffff12; border-radius: 14px; background: #ffffff08; }
.participant-user-avatar { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 50%; background: #f2c400; color: #171714; font-size: 12px; font-weight: 800; }
.participant-user-card > span:nth-child(2) { display: grid; min-width: 0; gap: 2px; }
.participant-user-card small { color: #92948b; font-size: 10px; }
.participant-user-card strong { overflow: hidden; color: #fffdf8 !important; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
body.is-private-route #privateApp .participant-user-card button { min-height: 34px; padding: 0 7px; border: 0; background: transparent; color: #aeb0a8; font-size: 11px; cursor: pointer; }
body.is-private-route #privateApp .participant-user-card button:hover { color: #fffdf8; }

body.is-private-route #privateApp .participant-page-header { align-items: flex-end; margin-bottom: clamp(20px, 3vw, 34px); padding-bottom: 20px; border-bottom: 1px solid #e4e3da; }
body.is-private-route #privateApp .participant-page-header > div { display: grid; gap: 5px; }
body.is-private-route #privateApp .participant-page-header h1 { margin: 0; font-size: clamp(28px, 3.4vw, 44px); }
body.is-private-route #privateApp .participant-page-header p:not(.eyebrow) { max-width: 570px; margin: 0; color: #67675e; font-size: 15px; line-height: 1.5; }
body.is-private-route #privateApp .participant-page-header .eyebrow { margin: 0; color: #3f6f5b; }
body.is-private-route #privateApp .participant-header-action { flex: 0 0 auto; }

@media (min-width: 1021px) {
  body.is-private-route #privateApp .participant-app-shell { --private-sidebar-width: 236px; }
  body.is-private-route #privateApp .participant-navigation { width: var(--private-sidebar-width); min-width: var(--private-sidebar-width); max-width: var(--private-sidebar-width); }
}

@media (max-width: 1020px) {
  body.is-private-route #privateApp .participant-navigation {
    left: max(10px, env(safe-area-inset-left));
    right: max(10px, env(safe-area-inset-right));
    bottom: max(8px, env(safe-area-inset-bottom));
    display: grid;
    grid-template-columns: minmax(0, 1fr) 60px;
    gap: 4px;
    padding: 6px;
    border: 1px solid #ffffff1f;
    border-radius: 19px;
    background: #171714f5;
    box-shadow: 0 12px 40px #17171438;
    backdrop-filter: blur(18px);
  }
  body.is-private-route #privateApp .participant-brand,
  body.is-private-route #privateApp .participant-user-card,
  body.is-private-route #privateApp .participant-sidebar-spacer { display: none; }
  body.is-private-route #privateApp .participant-primary-nav { display: grid; grid-template-columns: repeat(auto-fit, minmax(54px, 1fr)); gap: 3px; overflow: visible; }
  body.is-private-route #privateApp .participant-primary-nav a,
  body.is-private-route #privateApp .participant-tools-nav > summary { display: grid; grid-template-columns: 1fr; gap: 2px; min-width: 0; width: 100%; min-height: 54px; height: 54px; padding: 4px 2px; place-items: center; border-radius: 14px; }
  body.is-private-route #privateApp .participant-primary-nav a span:last-child,
  body.is-private-route #privateApp .participant-tools-nav > summary span:last-child { position: static; display: block !important; width: auto; height: auto; margin: 0; padding: 0; overflow: visible; clip: auto; color: inherit; font-size: 10px; line-height: 1; white-space: nowrap; }
  body.is-private-route #privateApp .participant-primary-nav .participant-nav-icon,
  body.is-private-route #privateApp .participant-tools-nav > summary .participant-nav-icon { position: static; display: grid !important; margin: 0; padding: 0; overflow: visible; clip: auto; white-space: normal; }
  body.is-private-route #privateApp .participant-primary-nav a::before,
  body.is-private-route #privateApp .participant-primary-nav a::after { content: none; }
  body.is-private-route #privateApp .participant-primary-nav .participant-nav-icon,
  body.is-private-route #privateApp .participant-tools-nav > summary .participant-nav-icon { width: 26px; height: 26px; background: transparent; }
  body.is-private-route #privateApp .participant-primary-nav svg,
  body.is-private-route #privateApp .participant-tools-nav > summary svg { width: 20px; height: 20px; }
  body.is-private-route #privateApp .participant-tools-nav { display: block; min-width: 0; }
  body.is-private-route #privateApp .participant-tools-nav > summary { color: #c9cac3; }
  body.is-private-route #privateApp .participant-tools-panel { position: fixed; right: max(10px, env(safe-area-inset-right)); bottom: calc(78px + env(safe-area-inset-bottom)); left: max(10px, env(safe-area-inset-left)); z-index: 130; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; padding: 10px; border: 1px solid #e4e3da; background: #fffdf8; box-shadow: 0 18px 50px #17171430; }
  body.is-private-route #privateApp .participant-tools-panel a { grid-template-columns: 34px minmax(0, 1fr); color: #34352f !important; background: #f6f4ee; }
  body.is-private-route #privateApp .participant-tools-panel a.active { color: #171714; background: #f2c400; }
  body.is-private-route #privateApp .participant-tools-panel .participant-nav-icon { background: #fffdf8; }
  body.is-private-route #privateApp .participant-page-header { align-items: flex-start; }
}

@media (max-width: 560px) {
  body.is-private-route #privateApp .participant-page-header { display: grid; gap: 15px; }
  body.is-private-route #privateApp .participant-header-action { width: 100%; }
  body.is-private-route #privateApp .participant-tools-panel { grid-template-columns: 1fr 1fr; }
}

/* Ranking: competición visual, comparable y centrada en el siguiente bloque. */
body #privateApp .ranking-experience {
  display: grid;
  gap: 18px;
}

body #privateApp .ranking-experience .progress-snapshot {
  gap: 10px;
}

body #privateApp .ranking-experience .progress-snapshot article {
  min-height: 108px;
  padding: 18px;
  border: 1px solid #e4e3da;
  border-radius: 15px;
  background: #fffdf8;
  box-shadow: none;
}

body #privateApp .ranking-visual-card {
  gap: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 22px;
  background: #fffdf8;
  box-shadow: 0 22px 60px rgba(23, 23, 20, .1);
}

body #privateApp .ranking-visual-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 210px;
  gap: clamp(24px, 5vw, 70px);
  align-items: center;
  min-height: 330px;
  padding: clamp(28px, 5vw, 58px);
  overflow: hidden;
  background:
    radial-gradient(circle at 88% 18%, rgba(242, 196, 0, .24), transparent 25%),
    linear-gradient(145deg, #171714 0%, #23231e 62%, #303024 100%);
  color: #fffdf8;
}

body #privateApp .ranking-visual-hero::before,
body #privateApp .ranking-visual-hero::after {
  position: absolute;
  content: "";
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 50%;
  pointer-events: none;
}

body #privateApp .ranking-visual-hero::before {
  width: 330px;
  height: 330px;
  right: -120px;
  bottom: -210px;
}

body #privateApp .ranking-visual-hero::after {
  width: 180px;
  height: 180px;
  right: 120px;
  top: -125px;
}

body #privateApp .ranking-visual-copy {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: start;
  gap: 14px;
}

body #privateApp .ranking-visual-copy .eyebrow {
  margin: 0;
  color: #f2c400 !important;
}

body #privateApp .ranking-visual-copy h2 {
  max-width: 720px;
  margin: 0;
  color: #fffdf8 !important;
  font-size: clamp(34px, 5vw, 64px);
  line-height: .98;
  letter-spacing: -.055em;
}

body #privateApp .ranking-visual-copy > p:not(.eyebrow) {
  max-width: 600px;
  margin: 0;
  color: #c8c9c1;
  font-size: 15px;
  line-height: 1.55;
}

body #privateApp .ranking-visual-copy .ranking-toolbar {
  margin-top: 2px;
}

body #privateApp .ranking-visual-copy .ranking-scope {
  min-height: 30px;
  border-color: rgba(255, 255, 255, .12);
  background: rgba(255, 255, 255, .07);
  color: #dedfd8;
  font-size: 11px;
}

body #privateApp .ranking-visual-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 8px;
}

body #privateApp .ranking-visual-actions .button {
  width: auto;
  min-height: 46px;
}

body #privateApp .ranking-visual-actions .button.primary {
  border-color: #f2c400;
  background: #f2c400;
  color: #171714;
}

body #privateApp .ranking-jump-button {
  border-color: rgba(255, 255, 255, .22);
  background: rgba(255, 255, 255, .08);
  color: #fffdf8;
}

body #privateApp .ranking-jump-button:hover {
  border-color: rgba(255, 255, 255, .42);
  background: rgba(255, 255, 255, .14);
}

body #privateApp .ranking-position-ring {
  --ranking-progress: 0%;
  position: relative;
  z-index: 1;
  width: 190px;
  height: 190px;
  padding: 11px;
  border-radius: 50%;
  background: conic-gradient(#f2c400 var(--ranking-progress), rgba(255, 255, 255, .12) 0);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .08), 0 22px 60px rgba(0, 0, 0, .22);
}

body #privateApp .ranking-position-ring > div {
  display: flex;
  height: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 50%;
  background: #20201c;
  text-align: center;
}

body #privateApp .ranking-position-ring span,
body #privateApp .ranking-position-ring small {
  color: #aeb0a8;
  font-size: 11px;
  font-weight: 700;
}

body #privateApp .ranking-position-ring span {
  letter-spacing: .1em;
  text-transform: uppercase;
}

body #privateApp .ranking-position-ring strong {
  margin: 5px 0;
  color: #fffdf8;
  font-size: 52px;
  line-height: 1;
  letter-spacing: -.06em;
}

body #privateApp .ranking-chase-panel {
  display: grid;
  grid-template-columns: minmax(220px, .9fr) minmax(180px, 1.2fr) auto;
  gap: 20px;
  align-items: center;
  padding: 18px clamp(24px, 4vw, 46px);
  border-bottom: 1px solid #e4e3da;
  background: #eff4ee;
}

body #privateApp .ranking-chase-panel > div:first-child {
  display: grid;
  gap: 4px;
}

body #privateApp .ranking-chase-panel span,
body #privateApp .ranking-section-heading span {
  color: #3f6f5b;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}

body #privateApp .ranking-chase-panel strong {
  color: #171714;
  font-size: 14px;
  line-height: 1.4;
}

body #privateApp .ranking-chase-panel small {
  color: #67675e;
  font-size: 11px;
  white-space: nowrap;
}

body #privateApp .ranking-chase-track,
body #privateApp .ranking-row-progress {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #d9ded6;
}

body #privateApp .ranking-chase-track i,
body #privateApp .ranking-row-progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #3f6f5b, #f2c400);
}

body #privateApp .ranking-podium-section,
body #privateApp .ranking-board-section {
  display: grid;
  gap: 16px;
  padding: clamp(24px, 4vw, 42px);
}

body #privateApp .ranking-board-section {
  padding-top: 6px;
}

body #privateApp .ranking-section-heading {
  display: flex;
  gap: 18px;
  align-items: end;
  justify-content: space-between;
}

body #privateApp .ranking-section-heading h3 {
  margin: 4px 0 0;
  color: #171714;
  font-size: clamp(20px, 2.5vw, 28px);
  letter-spacing: -.035em;
}

body #privateApp .ranking-section-heading small {
  color: #77786f;
  font-size: 11px;
}

body #privateApp .ranking-visual-card .ranking-podium {
  gap: 12px;
}

body #privateApp .ranking-visual-card .ranking-podium-card {
  position: relative;
  min-height: 220px;
  padding: 20px 12px;
  overflow: hidden;
  border: 1px solid #e4e3da;
  border-radius: 18px;
  background: #f6f4ee;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

body #privateApp .ranking-visual-card .ranking-podium-card::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 5px;
  background: #b8bab1;
  content: "";
}

body #privateApp .ranking-visual-card .ranking-podium-card.rank-1 {
  min-height: 258px;
  border-color: rgba(242, 196, 0, .7);
  background: linear-gradient(180deg, #fff9dc, #fffdf8);
  box-shadow: 0 18px 42px rgba(216, 170, 0, .13);
}

body #privateApp .ranking-visual-card .ranking-podium-card.rank-1::after {
  background: #f2c400;
}

body #privateApp .ranking-visual-card .ranking-podium-card.rank-2::after {
  background: #8f938b;
}

body #privateApp .ranking-visual-card .ranking-podium-card.rank-3::after {
  background: #b67849;
}

body #privateApp .ranking-visual-card .ranking-podium-card:hover {
  transform: translateY(-5px);
  border-color: #c9c8bf;
  box-shadow: 0 18px 34px rgba(23, 23, 20, .1);
}

body #privateApp .ranking-visual-card .ranking-medal {
  color: #67675e;
  font-size: 14px;
  letter-spacing: .08em;
}

body #privateApp .ranking-visual-card .rank-1 .ranking-medal {
  color: #8d7000;
}

body #privateApp .ranking-custom-row {
  border: 1px solid #e4e3da;
  border-radius: 15px;
  background: #fffdf8;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

body #privateApp .ranking-custom-row:hover {
  transform: translateX(4px);
  border-color: #c9c8bf;
  box-shadow: 0 10px 26px rgba(23, 23, 20, .07);
}

body #privateApp .ranking-custom-row.is-current-user {
  border-color: #f2c400;
  background: #fff9dc;
}

body #privateApp .ranking-custom-row .ranking-row-progress {
  grid-column: 3 / -1;
  width: 100%;
  height: 5px;
}

body #privateApp .ranking-custom-row.is-jump-highlighted {
  animation: rankingRowHighlight 1.35s ease;
}

@keyframes rankingRowHighlight {
  0%, 100% { box-shadow: 0 12px 34px rgba(216, 170, 0, .13); }
  40% { box-shadow: 0 0 0 7px rgba(242, 196, 0, .2), 0 18px 38px rgba(216, 170, 0, .2); }
}

@media (max-width: 760px) {
  body #privateApp .ranking-visual-hero {
    grid-template-columns: 1fr;
    min-height: 0;
    padding: 28px 22px;
  }

  body #privateApp .ranking-position-ring {
    width: 142px;
    height: 142px;
    justify-self: start;
  }

  body #privateApp .ranking-position-ring strong {
    font-size: 40px;
  }

  body #privateApp .ranking-chase-panel {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 18px 22px;
  }

  body #privateApp .ranking-chase-panel small {
    white-space: normal;
  }

  body #privateApp .ranking-custom-row .ranking-row-progress {
    grid-column: 1 / -1;
    display: block;
    padding: 0;
  }
}

@media (max-width: 620px) {
  body #privateApp .ranking-visual-actions,
  body #privateApp .ranking-visual-actions .button {
    width: 100%;
  }

  body #privateApp .ranking-visual-card .ranking-podium {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  body #privateApp .ranking-visual-card .ranking-podium-card,
  body #privateApp .ranking-visual-card .ranking-podium-card.rank-1,
  body #privateApp .ranking-visual-card .ranking-podium-card.rank-2 {
    min-height: 0;
    justify-items: start;
    text-align: left;
  }

  body #privateApp .ranking-visual-card .ranking-podium-card.rank-1 {
    order: -1;
  }

  body #privateApp .ranking-visual-card .ranking-podium-card .ranking-badges {
    justify-content: flex-start;
  }

  body #privateApp .ranking-section-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 6px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body #privateApp .ranking-visual-card .ranking-podium-card,
  body #privateApp .ranking-custom-row {
    transition: none;
    transform: none;
  }

  body #privateApp .ranking-custom-row.is-jump-highlighted {
    animation: none;
    outline: 4px solid rgba(242, 196, 0, .28);
  }
}

/* Hoy: estadísticas útiles, una acción principal y espacio flexible. */
body #privateApp .participant-app-home .private-main { max-width: none; min-width: 0; min-height: 100svh; }
body #privateApp .participant-app-home .participant-page-header { display: flex; margin-bottom: 4px; padding-bottom: 18px; }
body #privateApp .participant-app-home .participant-header-action { display: none; }
body #privateApp .today-dashboard { display: grid; gap: 20px; min-width: 0; margin-bottom: 12px; }
body #privateApp .today-dashboard :is(h2, p) { margin: 0; }
body #privateApp .today-dashboard h2 { color: #171714; font-size: clamp(20px, 1.8vw, 26px); letter-spacing: -.04em; line-height: 1.2; }
body #privateApp .today-dashboard .eyebrow { color: #3f6f5b; font-size: 10px; font-weight: 700; line-height: 1.5; letter-spacing: .1em; text-transform: uppercase; }
body #privateApp .today-intro { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; color: #67675e; font-size: 13px; }
body #privateApp .today-streak { padding: 7px 11px; border: 1px solid #dae4d6; border-radius: 999px; background: #eaf0e5; color: #345640; font-size: 11px; }
body #privateApp .today-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
body #privateApp .today-metric { position: relative; display: grid; align-content: start; gap: 8px; min-width: 0; padding: 18px 48px 18px 18px; border: 1px solid #e4e3da; border-radius: 18px; background: #fffdf8; text-align: left; font: inherit; cursor: pointer; transition: border-color .18s ease, background .18s ease; }
body #privateApp .today-metric:hover { border-color: #9cab92; background: #f9fbf4; }
body #privateApp .today-metric > span { color: #67675e; font-size: 12px; }
body #privateApp .today-metric > strong { color: #171714; font-size: clamp(22px, 2.2vw, 34px); line-height: 1.1; letter-spacing: -.055em; }
body #privateApp .today-metric > small { color: #67675e; font-size: 11px; line-height: 1.4; }
body #privateApp .today-metric-arrow { position: absolute; top: 16px; right: 16px; color: #8d9685; font-size: 18px; font-style: normal; }
body #privateApp .today-consistency-ring { position: absolute; top: 18px; right: 12px; width: 32px; height: 32px; border-radius: 50%; background: conic-gradient(#3f6f5b var(--progress), #e8ecdf 0); }
body #privateApp .today-consistency-ring::after { content: ''; position: absolute; inset: 5px; border-radius: 50%; background: #fffdf8; }
body #privateApp .today-main-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.4fr); gap: 20px; }
body #privateApp :is(.today-focus-card, .today-activity-card, .today-plan-card, .today-insight-card) { min-width: 0; border-radius: 22px; padding: clamp(20px, 2.2vw, 28px); border: 1px solid #e4e3da; }
body #privateApp .today-focus-card { display: flex; flex-direction: column; align-items: stretch; gap: 20px; background: #20271e; color: #fffdf8; border-color: #20271e; }
body #privateApp .today-focus-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
body #privateApp .today-focus-card .eyebrow { color: #dfebcf !important; }
body #privateApp .today-focus-mark { display: grid; width: 38px; height: 38px; place-items: center; border: 1px solid #ffffff25; border-radius: 50%; color: #f2c400; font-size: 24px; }
body #privateApp .today-focus-card h2 { color: #fffdf8 !important; font-size: clamp(24px, 2.35vw, 36px); }
body #privateApp .today-focus-card > p { color: #d2d9cb; font-size: 14px; line-height: 1.65; }
body #privateApp .today-focus-facts { display: flex; flex-wrap: wrap; gap: 8px; }
body #privateApp .today-focus-facts span { padding: 6px 9px; border-radius: 8px; background: #ffffff0c; color: #dfebcf; font-size: 11px; line-height: 1.4; }
body #privateApp .today-focus-card .button.primary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 50px; margin-top: auto; background: #f2c400; color: #171714; border-color: #f2c400; box-shadow: none; border-radius: 12px; }
body #privateApp .today-focus-card .button.primary:hover { background: #ffdb32; }
body #privateApp .today-focus-card > small { color: #b7c3ad; font-size: 11px; }
body #privateApp .today-activity-card { display: flex; flex-direction: column; gap: 18px; background: #fffdf8; }
body #privateApp :is(.today-activity-card, .today-plan-card) > header { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; }
body #privateApp :is(.today-activity-card, .today-plan-card) > header > div:first-child { display: grid; gap: 6px; }
body #privateApp .today-activity-card .performance-period { flex-shrink: 0; }
body #privateApp .today-activity-card .performance-period button { padding: 8px 11px; font-size: 12px; }
body #privateApp .today-activity-summary { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; }
body #privateApp .today-activity-summary strong { color: #171714; font-size: clamp(28px, 3vw, 42px); line-height: 1.1; letter-spacing: -.05em; }
body #privateApp .today-activity-summary > span { color: #67675e; font-size: 11px; line-height: 1.6; }
body #privateApp .today-chart-scroll { min-width: 0; overflow-x: auto; scrollbar-width: thin; scrollbar-color: #c6cfbc transparent; }
body #privateApp .today-bars { gap: 6px; margin: 0; grid-template-columns: repeat(var(--days), minmax(32px, 1fr)); }
body #privateApp .today-bars-month { grid-template-columns: repeat(var(--days), minmax(40px, 1fr)); }
body #privateApp .today-bars .performance-day { padding: 8px 2px; }
body #privateApp .today-bars .performance-bar-track { height: 140px; background: repeating-linear-gradient(to top, transparent 0, transparent 34px, #e4e3da80 34px, #e4e3da80 35px); }
body #privateApp .today-bars .performance-bar-track i { background: #81a27f; border-radius: 8px 8px 2px 2px; transition: background .18s ease; }
body #privateApp .today-bars .performance-day[aria-pressed=true] .performance-bar-track i,
body #privateApp .today-bars .performance-day:hover .performance-bar-track i { background: #3f6f5b; }
body #privateApp .today-activity-card .performance-day-detail { min-height: 20px; margin: 0; color: #345640; font-size: 12px; line-height: 1.5; }
body #privateApp .today-chart-hint { color: #67675e; font-size: 11px; }
body #privateApp .today-secondary-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, .9fr); gap: 20px; }
body #privateApp .today-plan-card { display: grid; align-content: start; gap: 16px; background: #fffdf8; }
body #privateApp .today-text-button { display: inline-flex; align-items: center; justify-content: space-between; gap: 10px; width: fit-content; max-width: 100%; padding: 10px 0; min-height: 44px; border: 0; border-radius: 6px; background: transparent; color: #345640; font: inherit; font-size: 12px; font-weight: 650; text-align: left; cursor: pointer; }
body #privateApp .today-text-button:hover { color: #171714; text-decoration: underline; }
body #privateApp .today-goal { color: #67675e; font-size: 13px; line-height: 1.6; }
body #privateApp .today-task-progress { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #67675e; font-size: 11px; }
body #privateApp .today-task-progress strong { color: #345640; }
body #privateApp .today-plan-card .metric-track { height: 5px; margin-top: -8px; }
body #privateApp .today-task-list { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
body #privateApp .today-task-list button { display: flex; gap: 12px; align-items: center; width: 100%; min-height: 48px; padding: 10px 0; border: 0; border-bottom: 1px solid #e4e3da; background: transparent; color: #171714; font: inherit; text-align: left; cursor: pointer; }
body #privateApp .today-task-list button:hover { color: #3f6f5b; }
body #privateApp .today-task-list i { display: grid; flex: 0 0 24px; height: 24px; place-items: center; border: 1px solid #c6cfbc; border-radius: 8px; color: #3f6f5b; font-size: 11px; font-style: normal; }
body #privateApp .today-task-list button > span { display: grid; min-width: 0; gap: 4px; }
body #privateApp .today-task-list strong { font-size: 13px; font-weight: 550; line-height: 1.4; }
body #privateApp .today-task-list small { color: #67675e; font-size: 11px; }
body #privateApp .today-plan-note { color: #67675e; font-size: 11px; line-height: 1.6; }
body #privateApp .today-empty-copy { color: #67675e; font-size: 13px; line-height: 1.6; }
body #privateApp .today-insight-card { display: flex; flex-direction: column; align-items: start; gap: 16px; background: #eaf0e5; border-color: #dae4d6; }
body #privateApp .today-insight-card > p:not(.eyebrow) { color: #345640; font-size: 14px; line-height: 1.65; }
body #privateApp .today-timing { display: grid; gap: 5px; padding-top: 14px; width: 100%; border-top: 1px solid #cbd7c2; }
body #privateApp .today-timing :is(span, small) { color: #52644a; font-size: 11px; }
body #privateApp .today-timing strong { color: #345640; font-size: 15px; }
body #privateApp .today-insight-card .today-text-button { margin-top: auto; }
@media (min-width: 1600px) {
  body #privateApp .today-bars .performance-bar-track { height: 180px; }
}
@media (max-width: 1180px) {
  body #privateApp .today-metric { padding: 16px 38px 16px 14px; }
  body #privateApp .today-metric > strong { font-size: 24px; }
  body #privateApp .today-consistency-ring { width: 26px; height: 26px; right: 8px; }
}
@media (max-width: 820px) {
  body #privateApp .today-main-grid { grid-template-columns: 1fr; }
  body #privateApp .today-focus-card { gap: 14px; }
  body #privateApp .today-focus-card .button.primary { margin-top: 4px; }
  body #privateApp .today-secondary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  body #privateApp .participant-app-home .private-main { padding: 20px 14px calc(110px + env(safe-area-inset-bottom)); }
  body #privateApp .participant-app-home .participant-page-header h1 { font-size: 28px; }
  body #privateApp .participant-app-home .participant-page-header p:not(.eyebrow) { font-size: 13px; }
  body #privateApp .today-dashboard { gap: 14px; }
  body #privateApp .today-intro { order: 0; font-size: 12px; }
  body #privateApp .today-main-grid { display: contents; }
  body #privateApp .today-focus-card { order: 1; }
  body #privateApp .today-metrics { order: 2; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  body #privateApp .today-metric { padding: 16px 36px 16px 14px; border-radius: 16px; }
  body #privateApp .today-metric > strong { font-size: 26px; }
  body #privateApp .today-metric > small { font-size: 10px; }
  body #privateApp .today-activity-card { order: 3; }
  body #privateApp .today-secondary-grid { order: 4; grid-template-columns: 1fr; gap: 14px; }
  body #privateApp :is(.today-focus-card, .today-activity-card, .today-plan-card, .today-insight-card) { padding: 20px; border-radius: 20px; }
  body #privateApp .today-focus-card h2 { font-size: 27px; }
  body #privateApp .today-bars { gap: 3px; }
  body #privateApp .today-bars .performance-bar-track { height: 120px; }
}
@media (prefers-reduced-motion: reduce) {
  body #privateApp .today-dashboard * { transition: none; }
}

/* Barra lateral plegable: la navegación permanece accesible y el contenido gana ancho. */
body #privateApp .participant-sidebar-toggle { display: none; }
@media (max-width: 1020px) {
  body #privateApp .participant-sidebar-header { display: none; }
}
@media (min-width: 1021px) {
  body #privateApp .participant-app-shell { transition: padding-left .24s ease; }
  body #privateApp .participant-app-shell:has(.participant-navigation.is-collapsed) { --private-sidebar-width: 80px; }
  body #privateApp .participant-navigation { transition: width .24s ease, min-width .24s ease, max-width .24s ease, padding .24s ease; }
  body #privateApp .participant-sidebar-header { display: flex; align-items: center; gap: 8px; min-height: 50px; }
  body #privateApp .participant-sidebar-header .participant-brand { flex: 1; min-width: 0; gap: 8px; padding: 0; }
  body #privateApp .participant-sidebar-header .participant-brand .brand-symbol { flex-shrink: 0; width: 30px; height: 30px; }
  body #privateApp .participant-sidebar-header .participant-brand > span { overflow: visible; white-space: normal; font-size: 12px; line-height: 1.35; }
  body #privateApp .participant-sidebar-toggle { display: grid; flex: 0 0 36px; place-items: center; width: 36px; min-height: 40px; padding: 0; border: 1px solid #ffffff24; border-radius: 10px; background: #ffffff08; color: #d8dbd0; cursor: pointer; }
  body #privateApp .participant-sidebar-toggle:hover { border-color: #f2c400; background: #ffffff12; color: #f2c400; }
  body #privateApp .participant-sidebar-toggle svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .24s ease; }
  body #privateApp .participant-navigation.is-collapsed { padding: 18px 12px; gap: 12px; }
  body #privateApp .participant-navigation.is-collapsed .participant-sidebar-header { flex-direction: column; gap: 10px; }
  body #privateApp .participant-navigation.is-collapsed .participant-brand { flex: 0 0 auto; }
  body #privateApp .participant-navigation.is-collapsed .participant-brand > span { display: none; }
  body #privateApp .participant-navigation.is-collapsed .participant-sidebar-toggle { flex: 0 0 auto; width: 44px; min-height: 36px; }
  body #privateApp .participant-navigation.is-collapsed .participant-sidebar-toggle svg { transform: rotate(180deg); }
  body #privateApp .participant-navigation.is-collapsed :is(.participant-primary-nav a, .participant-tools-nav > summary) { position: relative; grid-template-columns: 1fr; justify-items: center; gap: 0; padding: 6px; }
  body #privateApp .participant-navigation.is-collapsed :is(.participant-primary-nav a, .participant-tools-nav > summary) > span:last-child { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  body #privateApp .participant-navigation.is-collapsed .participant-primary-nav a::before { content: none; }
  body #privateApp .participant-navigation.is-collapsed :is(.participant-primary-nav a, .participant-tools-nav > summary)::after { content: attr(aria-label); position: absolute; z-index: 150; left: calc(100% + 14px); top: 50%; right: auto; bottom: auto; width: max-content; height: auto; max-width: 200px; padding: 9px 12px; border: 1px solid #ffffff20; border-radius: 10px; background: #24241f; color: #fffdf8; box-shadow: 0 8px 24px #17171424; font-size: 12px; line-height: 1.4; white-space: nowrap; transform: translateY(-50%); pointer-events: none; opacity: 0; visibility: hidden; transition: opacity .15s ease; }
  body #privateApp .participant-navigation.is-collapsed :is(.participant-primary-nav a, .participant-tools-nav > summary):is(:hover, :focus-visible)::after { opacity: 1; visibility: visible; }
  body #privateApp .participant-navigation.is-collapsed .participant-tools-nav[open] > summary::after { visibility: hidden; }
  body #privateApp .participant-navigation.is-collapsed .participant-tools-panel { position: absolute; top: 0; left: calc(100% + 14px); z-index: 140; width: 240px; max-height: min(440px, max(120px, calc(100dvh - 390px))); margin: 0; padding: 10px; overflow-y: auto; border: 1px solid #ffffff20; border-radius: 16px; box-shadow: 0 16px 40px #17171426; }
  body #privateApp .participant-navigation.is-collapsed .participant-user-card { grid-template-columns: 1fr; justify-items: center; gap: 6px; padding: 8px 3px; }
  body #privateApp .participant-navigation.is-collapsed .participant-user-card > span:nth-child(2) { display: none; }
  body #privateApp .participant-navigation.is-collapsed .participant-user-card button { min-height: 40px; padding: 0 5px; }
}
@media (prefers-reduced-motion: reduce) {
  body #privateApp :is(.participant-app-shell, .participant-navigation, .participant-sidebar-toggle svg),
  body #privateApp .participant-navigation.is-collapsed :is(.participant-primary-nav a, .participant-tools-nav > summary)::after { transition: none; }
}

/* Cuenta: el avatar es la única entrada; ajustes bajo demanda sin abandonar el estudio. */
body #privateApp .participant-account-button { display: grid; place-items: center; align-self: flex-start; flex: 0 0 44px; width: 44px; height: 44px; padding: 2px; border: 1px solid #ffffff30; border-radius: 50%; background: #ffffff0a; cursor: pointer; }
body #privateApp .participant-account-button:hover { border-color: #f2c400; }
body #privateApp .participant-account-button .usi-avatar { width: 36px; height: 36px; margin: 0; border-radius: 50%; overflow: hidden; }
body #privateApp .participant-account-button img { width: 100%; height: 100%; object-fit: cover; }
body #privateApp .account-dialog { --account-bg: #fffdf8; --account-text: #171714; --account-muted: #67675e; --account-border: #e4e3da; position: fixed; inset: auto auto 24px 20px; width: min(420px, calc(100vw - 32px)); max-height: min(680px, calc(100dvh - 48px)); margin: 0; padding: 24px; overflow-y: auto; overscroll-behavior: contain; border: 1px solid var(--account-border); border-radius: 24px; background: var(--account-bg); color: var(--account-text); box-shadow: 0 24px 80px #17171440; color-scheme: light; }
body #privateApp .account-dialog::backdrop { background: #17171445; }
body #privateApp .account-dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
body #privateApp .account-dialog :is(h2, label, strong, summary) { color: var(--account-text); }
body #privateApp .account-dialog h2 { margin: 4px 0 0; font-size: 24px; letter-spacing: -.035em; }
body #privateApp .account-dialog :is(.eyebrow, .muted-copy, small) { color: var(--account-muted); }
body #privateApp .account-close { flex-shrink: 0; width: 44px; height: 44px; border: 1px solid var(--account-border); border-radius: 50%; background: transparent; color: var(--account-text); font-size: 26px; cursor: pointer; }
body #privateApp .account-identity { display: flex; align-items: center; gap: 12px; margin: 22px 0; }
body #privateApp .account-identity > div:last-child { display: grid; min-width: 0; gap: 4px; overflow-wrap: anywhere; }
body #privateApp .account-preferences { display: grid; gap: 12px; padding: 18px 0; border-block: 1px solid var(--account-border); }
body #privateApp .account-preferences label { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 14px; }
body #privateApp .account-preferences select { width: 140px; min-height: 44px; }
body #privateApp .account-preferences p { margin: 0; font-size: 12px; line-height: 1.5; }
body #privateApp .account-night-switch input { width: 44px; height: 24px; accent-color: #3f6f5b; cursor: pointer; }
body #privateApp .account-dialog details { padding: 14px 0; border-bottom: 1px solid var(--account-border); }
body #privateApp .account-dialog summary { min-height: 32px; padding: 6px 0; font-size: 14px; cursor: pointer; }
body #privateApp .account-dialog details[open] > summary { margin-bottom: 16px; }
body #privateApp .account-dialog .profile-image-editor { display: grid; grid-template-columns: 1fr; padding: 0; background: transparent; }
body #privateApp .account-dialog .case-form { gap: 14px; }
body #privateApp .account-dialog textarea { min-height: 70px; }
body #privateApp .account-dialog .file-control { overflow-wrap: anywhere; }
body #privateApp .account-logout { width: 100%; min-height: 44px; margin-top: 16px; padding: 10px; border: 1px solid var(--account-border); border-radius: 12px; background: transparent; color: var(--account-text); font: inherit; font-size: 14px; cursor: pointer; }
body #privateApp .account-logout:hover { background: #bd443c15; color: #b83b32; }
body #privateApp .home-access-note { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 16px; border: 1px solid #e4e3da; border-radius: 14px; color: #67675e; font-size: 12px; }
body #privateApp .home-access-note summary { cursor: pointer; }
body #privateApp .compact-question { padding: 16px 20px; }
body #privateApp .compact-question summary { cursor: pointer; font-size: 14px; }
body #privateApp .compact-question summary > span { float: right; color: #3f6f5b; font-size: 12px; }
body #privateApp .compact-question h2 { margin-top: 20px; font-size: 18px; }
body #privateApp .compact-question textarea { min-height: 70px; }
@media (max-width: 1020px) {
  body.is-private-route #privateApp .participant-navigation { grid-template-columns: minmax(0, 1fr) 48px 44px; }
  body #privateApp .participant-account-button { align-self: center; }
  body #privateApp .account-dialog { inset: auto 16px calc(88px + env(safe-area-inset-bottom)) 16px; width: auto; max-height: calc(100dvh - 120px); padding: 20px; }
}
@media (max-width: 370px) {
  body #privateApp .participant-primary-nav a { min-width: 0; }
  body #privateApp .participant-primary-nav { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  body #privateApp .participant-primary-nav a span:last-child { font-size: 9px; }
}
/* Modo noche solo en el espacio del participante, conservando los acentos de USI. */
body.is-private-route[data-private-theme="dark"] { --color-bg: #151916; --color-surface: #202621; --color-surface-soft: #29322b; --color-text: #edf1e8; --color-muted: #b1beae; --color-border: #3b493e; color-scheme: dark; background: #151916; color: #edf1e8; }
body[data-private-theme="dark"] #privateApp .account-dialog { --account-bg: #202621; --account-text: #edf1e8; --account-muted: #b1beae; --account-border: #3b493e; color-scheme: dark; }
body[data-private-theme="dark"] #privateApp :is(.private-layout, .private-main) { background: #151916; color: #edf1e8; }
body[data-private-theme="dark"] #privateApp :is(.data-card, .card, .metric-card, .progress-snapshot article, .today-metric, .today-activity-card, .today-plan-card, .home-section-details, .task-row, .task-frequency-card, .task-goals-card, .task-guide-card, .task-editor-item, .trophy-card, .admin-metrics article, .home-access-note) { background: #202621; color: #edf1e8; border-color: #3b493e; }
body[data-private-theme="dark"] #privateApp :is(h1, h2, h3, h4, label, .today-metric > strong, .today-activity-summary > strong, .today-task-list strong, .progress-snapshot strong) { color: #edf1e8; }
body[data-private-theme="dark"] #privateApp :is(.muted-copy, .eyebrow, .data-card p, .today-metric > span, .today-metric > small, .today-activity-summary > span, .today-intro, .today-task-list small, .today-plan-note, .today-chart-hint, .today-empty-copy, .performance-day-detail, .progress-snapshot span, .progress-snapshot small) { color: #b1beae; }
body[data-private-theme="dark"] #privateApp :is(input:not([type=checkbox]):not([type=radio]):not([type=range]), select, textarea, .button.secondary, .table-button) { background: #202621; color: #edf1e8; border-color: #506153; }
body[data-private-theme="dark"] #privateApp :is(input, textarea)::placeholder { color: #b1beae; }
body[data-private-theme="dark"] #privateApp :is(.today-text-button, .today-task-list button, .today-task-progress, .today-goal, .today-bars small) { color: #c2d7bd; border-color: #3b493e; }
body[data-private-theme="dark"] #privateApp :is(.metric-track, .today-bars .performance-bar-track) { background: #344538; }
body[data-private-theme="dark"] #privateApp .today-insight-card { background: #293c2f; border-color: #49624c; }
body[data-private-theme="dark"] #privateApp .today-insight-card :is(p, small, span, strong) { color: #c2d7bd; }
body[data-private-theme="dark"] #privateApp .today-focus-card :is(h2, p, .eyebrow) { color: #fffdf8; }
body[data-private-theme="dark"] #privateApp .today-focus-card .button.primary { color: #171714; }
body[data-private-theme="dark"] #privateApp .home-section-details > summary { color: #edf1e8; }
body[data-private-theme="dark"] #privateApp .today-task-progress strong { color: #c2d7bd; }
body[data-private-theme="dark"] #privateApp .participant-tools-panel a { color: #edf1e8 !important; background: #202621; }
body[data-private-theme="dark"] #privateApp .participant-tools-panel a.active { background: #f2c400; color: #171714 !important; }
body #privateApp .account-night-switch input[type="checkbox"] { appearance: none; flex: 0 0 44px; width: 44px; height: 26px; min-height: 0; margin: 0; padding: 3px; border: 0; border-radius: 999px; background: #adb8a9; }
body #privateApp .account-night-switch input[type="checkbox"]::before { content: ""; display: block; width: 20px; height: 20px; border-radius: 50%; background: #fffdf8; box-shadow: 0 1px 3px #17171430; transition: transform .15s ease; }
body #privateApp .account-night-switch input[type="checkbox"]:checked { background: #3f6f5b; }
body #privateApp .account-night-switch input[type="checkbox"]:checked::before { transform: translateX(18px); }
body #privateApp .account-dialog .case-form > label { display: grid; grid-template-columns: 1fr; gap: 7px; }
body #privateApp .account-dialog :is(select, textarea, input:not([type="checkbox"]):not([type="range"]):not([type="file"])) { width: 100%; min-width: 0; }
@media (prefers-reduced-motion: reduce) { body #privateApp .account-night-switch input[type="checkbox"]::before { transition: none; } }

body #privateApp .account-dialog .form-message:empty { display: none; }

/* La barra se abre por puntero o foco; ninguna animación reconstruye la vista. */
@media (min-width: 1021px) {
  body #privateApp .participant-sidebar-header { min-height: 40px; }
  body #privateApp .participant-navigation.is-collapsed .participant-sidebar-header { gap: 0; }
  body #privateApp .participant-navigation .participant-brand { min-height: 40px; }
}
/* Indicadores, reconocimientos y novedades: una función clara por tarjeta. */
body #privateApp .group-hub-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr)); gap: 10px; margin-bottom: 16px; }
body #privateApp .group-hub-actions a, body #privateApp .progress-achievements-link { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 16px 18px; border: 1px solid #dae4d6; border-radius: 16px; background: #eaf0e5; color: #345640; font-size: 14px; text-decoration: none; }
body #privateApp .progress-achievements-link small { color: inherit; font-size: 12px; }
body #privateApp .group-hub-actions a:hover, body #privateApp .progress-achievements-link:hover { border-color: #3f6f5b; }
body #privateApp .usi-notice-list { display: grid; gap: 0; padding: 0; margin: 16px 0 0; list-style: none; }
body #privateApp .usi-notice-list li { display: grid; grid-template-columns: 26px minmax(0, 1fr); column-gap: 10px; padding: 14px 0; border-top: 1px solid #e4e3da; }
body #privateApp .usi-notice-list i { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #eaf0e5; color: #345640; font-style: normal; }
body #privateApp .usi-notice-list p { margin: 0; overflow-wrap: anywhere; font-size: 13px; line-height: 1.6; }
body #privateApp .usi-notice-list small { grid-column: 2; margin-top: 4px; color: #67675e; font-size: 11px; }
body #privateApp .personal-alerts-card { border-left: 3px solid #f2c400; }
body #privateApp .participant-isi-head, body #privateApp .xp-journey-head { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
body #privateApp :is(.participant-isi-card, .xp-journey-card) h2 { font-size: clamp(21px, 2.4vw, 30px); letter-spacing: -.035em; }
body #privateApp .participant-isi-card .isi-score-ring { flex: 0 0 112px; width: 112px; height: 112px; }
body #privateApp .participant-isi-card .isi-action { display: grid; gap: 10px; padding: 18px; border-radius: 16px; background: #eaf0e5; border: 1px solid #dae4d6; }
body #privateApp .participant-isi-card .isi-action .button { justify-self: start; margin-top: 4px; }
body #privateApp .participant-isi-card .isi-action strong { color: #345640; }
body #privateApp .participant-isi-card .isi-comparison { font-size: 12px; }
body #privateApp :is(.isi-method, .xp-help) { margin-top: 18px; padding-top: 16px; border-top: 1px solid #e4e3da; }
body #privateApp :is(.isi-method, .xp-help) summary { min-height: 32px; font-size: 13px; cursor: pointer; }
body #privateApp :is(.isi-method, .xp-help)[open] summary { margin-bottom: 16px; }
body #privateApp .recognition-workspace { display: grid; gap: 20px; }
body #privateApp .xp-level-medal { display: grid; flex: 0 0 88px; place-content: center; gap: 2px; width: 88px; height: 88px; border: 1px solid #d3bc3e; border-radius: 26px; background: #f2c400; color: #171714; text-align: center; transform: rotate(-4deg); }
body #privateApp .xp-level-medal span { font-size: 11px; font-weight: 600; }
body #privateApp .xp-level-medal strong { color: #171714; font-size: 32px; }
body #privateApp .xp-journey-facts { display: flex; gap: 32px; margin: 24px 0; }
body #privateApp .xp-journey-facts > div { display: grid; gap: 4px; }
body #privateApp .xp-journey-facts strong { color: #345640; font-size: 24px; }
body #privateApp .xp-journey-facts span { color: #67675e; font-size: 12px; }
body #privateApp .xp-next-level { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 10px; font-size: 12px; color: #67675e; }
body #privateApp .xp-next-level strong { color: #345640; }
body #privateApp .xp-journey-card .xp-track { height: 10px; background: #eaf0e5; }
body #privateApp .xp-journey-card .xp-track i { background: #3f6f5b; }
body #privateApp .milestone-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 12px; }
body #privateApp .milestone-trophy { display: flex; gap: 14px; align-items: start; min-height: 0; padding: 18px; border-radius: 16px; background: #f1efe7; border-color: #e4e3da; }
body #privateApp .milestone-trophy > div:nth-child(2) { min-width: 0; flex: 1; }
body #privateApp .milestone-trophy .milestone-medal { flex: 0 0 44px; width: 44px; height: 44px; }
body #privateApp .milestone-trophy h3 { font-size: 14px; }
body #privateApp .milestone-trophy p { font-size: 12px; line-height: 1.5; }
body #privateApp .milestone-trophy > strong { align-self: end; font-size: 10px; }
body #privateApp .milestone-trophy.earned { background: #eaf0e5; border-color: #b9ceb3; }
body #privateApp .milestone-trophy.locked { opacity: 1; }
body #privateApp .challenge-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
body #privateApp .challenge-item { background: #f1efe7; border: 1px solid #e4e3da; border-radius: 16px; }
body #privateApp .challenge-item.is-complete { background: #eaf0e5; border-color: #b9ceb3; }
body #privateApp .challenge-status { display: block; margin-bottom: 8px; color: #3f6f5b; font-size: 11px; }
body[data-private-theme="dark"] #privateApp :is(.milestone-trophy, .challenge-item) { background: #29322b; border-color: #3b493e; }
body[data-private-theme="dark"] #privateApp :is(.milestone-trophy.earned, .challenge-item.is-complete, .isi-action, .group-hub-actions a, .progress-achievements-link) { background: #293c2f; border-color: #49624c; color: #c2d7bd; }
body[data-private-theme="dark"] #privateApp :is(.isi-action strong, .xp-journey-facts strong, .xp-next-level strong, .challenge-status, .challenge-item span) { color: #c2d7bd; }
body[data-private-theme="dark"] #privateApp :is(.xp-journey-facts span, .xp-next-level) { color: #b1beae; }
@media (max-width: 600px) {
  body #privateApp .participant-isi-head { align-items: start; gap: 12px; }
  body #privateApp .participant-isi-card .isi-score-ring { flex-basis: 80px; width: 80px; height: 80px; }
  body #privateApp .participant-isi-card .isi-score-ring strong { font-size: 26px; }
  body #privateApp .xp-level-medal { flex-basis: 68px; width: 68px; height: 68px; border-radius: 20px; }
  body #privateApp .milestone-trophy { flex-wrap: wrap; }
  body #privateApp .progress-achievements-link { flex-wrap: wrap; }
}
@media (hover: hover) and (pointer: fine) {
  body:has(.participant-app-shell) { cursor: url('/assets/usi-cursor.svg?v=dot-1') 8 8, auto; }
  body #privateApp .participant-app-shell * { cursor: inherit; }
  body #privateApp .participant-app-shell :is(a, button, summary, select, [role="button"], input[type="checkbox"], input[type="radio"], input[type="range"]) { cursor: url('/assets/usi-cursor-link.svg?v=dot-1') 8 8, pointer; }
  body #privateApp .participant-app-shell :is(textarea, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"])) { cursor: text; }
  body #privateApp .participant-app-shell :disabled { cursor: not-allowed; }
}
@media (hover: hover) and (pointer: fine) {
  body #privateApp .account-dialog * { cursor: inherit; }
  body #privateApp .account-dialog :is(a, button, summary, select, input[type="checkbox"], input[type="range"]) { cursor: url('/assets/usi-cursor-link.svg?v=dot-1') 8 8, pointer; }
  body #privateApp .account-dialog :is(textarea, input:not([type="checkbox"]):not([type="range"]):not([type="file"])) { cursor: text; }
}
body #privateApp .milestone-trophy { display: grid; grid-template-columns: 44px minmax(0, 1fr); }
body #privateApp .milestone-trophy .milestone-medal { grid-row: 1 / span 2; }
body #privateApp .milestone-trophy > strong { grid-column: 2; justify-self: start; }
body #privateApp .milestone-filter-row { flex-wrap: wrap; }
body #privateApp .milestone-filter-row .filter { min-height: 44px; background: #f1efe7; color: #345640; border-color: #dae4d6; }
body #privateApp .milestone-filter-row .filter.active { background: #3f6f5b; color: #fffdf8; border-color: #3f6f5b; }
body[data-private-theme="dark"] #privateApp .milestone-filter-row .filter { background: #29322b; color: #c2d7bd; border-color: #49624c; }
body[data-private-theme="dark"] #privateApp .milestone-filter-row .filter.active { background: #3f6f5b; color: #fffdf8; }

/* Always-visible Today questions, alerts and group actions. */
body #privateApp .today-notices-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 20px; margin: 20px 0; align-items: start; }
body #privateApp .today-notices-grid:not(:has(> *)) { display: none; }
body #privateApp .today-notices-grid > .data-card { margin: 0; min-width: 0; }
body #privateApp .today-notices-grid h2 { font-size: 20px; margin: 8px 0 16px; }
body #privateApp .today-notices-grid .case-form { margin-top: 0; }
body #privateApp .today-group-card { margin-top: 20px; min-width: 0; }
body #privateApp .today-group-card > h2 { font-size: 24px; margin: 8px 0 20px; }
body #privateApp .today-group-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 16px; align-items: start; }
body #privateApp .today-group-grid > * { min-width: 0; margin: 0; }
body #privateApp .today-group-card .home-notifications-card { margin: 0 0 20px; }
body #privateApp .today-group-grid > .group-access-card { grid-column: 1 / -1; }
body #privateApp .today-group-grid .friend-invite-card .data-card-header { display: block; }
body #privateApp .today-group-grid .friend-invite-card h2 { font-size: 22px; overflow-wrap: anywhere; }
body #privateApp .today-group-grid .friend-invite-card .data-card-header > button { margin-top: 12px; }

body #privateApp .block-entry-card { max-width:820px; margin:24px auto; text-align:left; border-top:4px solid #f2c400; padding:clamp(24px,4vw,44px); }
body #privateApp .block-entry-card h2 { font-size:clamp(26px,3vw,38px); line-height:1.15; overflow-wrap:anywhere; }
body #privateApp .block-entry-card .focus-entry-actions { justify-content:flex-start; margin-top:24px; flex-wrap:wrap; }
body #privateApp .block-entry-facts { display:flex; gap:12px; flex-wrap:wrap; margin-top:20px; font-size:14px; }
body #privateApp .block-entry-facts span { background:#eaf0e5; color:#345640; padding:10px 14px; border-radius:14px; }
body #privateApp .block-entry-advice { margin-top:20px; border-left:3px solid #f2c400; padding:12px 18px; background:#f3f5ec; border-radius:0 14px 14px 0; }
body #privateApp .block-entry-advice p { font-size:15px; margin:8px 0; }
body[data-private-theme="dark"] #privateApp :is(.block-entry-facts span,.block-entry-advice) { background:#293c2f; color:#d3dfcd; }
@media(max-width:680px) { body #privateApp .block-entry-card .focus-entry-actions .button { width:100%; } }

/* Visual Plan: existing tasks and seven-day rules, compact presentation. */
body #privateApp .plan-next-step { display:flex; gap:24px; justify-content:space-between; align-items:center; border-top:4px solid #f2c400; }
body #privateApp .plan-next-step h2 { font-size:clamp(24px,3vw,32px); margin:8px 0; }
body #privateApp .plan-next-step .button { flex-shrink:0; }
body #privateApp .plan-counts { display:flex; gap:24px; flex-wrap:wrap; margin-top:20px; }
body #privateApp .plan-counts span { display:flex; flex-direction:column; gap:6px; font-size:13px; }
body #privateApp .plan-counts strong { font-size:30px; }
body #privateApp .plan-week-days { display:flex; gap:10px; overflow-x:auto; padding:12px 0 18px; }
body #privateApp .plan-week-days button { min-width:76px; display:flex; flex-direction:column; gap:6px; align-items:center; padding:12px; border:1px solid #d5dfd0; border-radius:16px; background:#f2f5ed; color:#345640; }
body #privateApp .plan-week-days button[aria-pressed="true"] { background:#f2c400; color:#171714; border-color:#f2c400; }
body #privateApp .plan-week-days button.is-today { box-shadow:inset 0 -3px #3f6f5b; }
body #privateApp .plan-week-days strong { font-size:22px; }
body #privateApp .plan-task-grid, body #privateApp .plan-goals { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); gap:16px; }
body #privateApp .plan-task-card, body #privateApp .plan-goal { min-width:0; border:1px solid #d5dfd0; border-radius:16px; padding:16px; background:#f5f7f1; }
body #privateApp .plan-task-card-head { display:flex; gap:12px; align-items:start; }
body #privateApp .plan-task-card-head > div { min-width:0; overflow-wrap:anywhere; }
body #privateApp .plan-task-card-head p { font-size:14px; margin:6px 0; }
body #privateApp .plan-task-check { width:44px; height:44px; flex-shrink:0; border:1px solid #a9bea0; border-radius:50%; background:transparent; color:inherit; font-size:24px; }
body #privateApp .plan-task-card-actions { display:flex; gap:14px; align-items:start; flex-wrap:wrap; margin-top:14px; }
body #privateApp .plan-task-edit { flex:1; min-width:0; }
body #privateApp .plan-task-edit summary, body #privateApp .plan-add-task summary { padding:12px 0; font-size:14px; }
body #privateApp .plan-task-edit .task-editor-row { display:flex; flex-direction:column; align-items:stretch; padding:12px 0 0; }
body #privateApp .plan-task-edit .task-editor-main { width:100%; }
body #privateApp .plan-goal summary { display:flex; flex-direction:column; gap:12px; min-height:110px; overflow-wrap:anywhere; }
body #privateApp .plan-goal summary strong { font-size:19px; }
body #privateApp .plan-goal summary :is(span,small) { color:#54714c; font-size:13px; }
body #privateApp .plan-journey-steps { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr)); gap:12px; margin-top:20px; align-items:start; }
body #privateApp .plan-journey-step { min-width:0; padding:16px; border:1px solid #d5dfd0; border-radius:16px; }
body #privateApp .plan-journey-step summary { display:flex; flex-direction:column; gap:8px; }
body #privateApp .plan-step-dot { display:grid; place-items:center; width:36px; height:36px; border-radius:50%; background:#e2eada; color:#345640; }
body #privateApp .plan-journey-step.completed .plan-step-dot { background:#3f6f5b; color:white; }
body #privateApp .plan-journey-step[open] { border-color:#c7a000; }
body #privateApp .plan-journey-step .button { width:100%; margin-top:16px; }
body #privateApp .plan-undo-notice { display:flex; gap:20px; justify-content:space-between; align-items:center; padding:14px 20px; border:1px solid #a9bea0; border-radius:16px; background:#eaf0e5; color:#345640; }
body #privateApp .plan-undo-notice button { min-height:44px; padding:8px 16px; }
body #privateApp .plan-task-card.is-completing { animation:plan-task-done .18s ease-out; }
@keyframes plan-task-done { to { opacity:.35; transform:scale(.97); } }
body[data-private-theme="dark"] #privateApp :is(.plan-task-card,.plan-goal,.plan-journey-step,.plan-undo-notice) { background:#29342b; border-color:#49624c; color:#edf1e8; }
body[data-private-theme="dark"] #privateApp .plan-goal summary :is(span,small) { color:#b0c3a8; }
@media(max-width:680px) { body #privateApp .plan-next-step { flex-direction:column; align-items:stretch; } body #privateApp .plan-week-board > .data-card-header { flex-wrap:wrap; } }
@media(prefers-reduced-motion:reduce) { body #privateApp .plan-task-card.is-completing { animation:none; } }

body #privateApp .plan-week-controls { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:12px; }
body #privateApp .plan-week-controls strong { text-align:center; font-size:14px; }
body #privateApp .plan-goals-panel > .case-form { display:block; }
body #privateApp .plan-goals-panel > .case-form > .button { margin-top:20px; }
body #privateApp .plan-add-task { min-width:0; }
body #privateApp .plan-task-card-head :is(strong,small) { display:block; }
body #privateApp .plan-task-card-head small { margin-top:6px; }
body[data-private-theme="dark"] #privateApp .plan-visual-workspace :is(.muted-copy,.plan-task-card-head p) { color:#b8c6b2; }

/* Wide, visual block entry and preparation, scoped away from the running timer. */
body #privateApp .block-entry-card { width:100%; max-width:none; margin:24px 0; display:grid; grid-template-columns:minmax(0,1.4fr) minmax(260px,.6fr); align-items:center; gap:40px; min-height:390px; border:1px solid #d5dfd0; border-radius:28px; background:linear-gradient(120deg,#f3f6eb,#e6eddd); }
body #privateApp .block-entry-copy { min-width:0; }
body #privateApp .block-entry-card h2 { font-size:clamp(32px,3.7vw,54px); max-width:20ch; letter-spacing:-.035em; margin:12px 0 20px; }
body #privateApp .block-entry-copy > .muted-copy { max-width:60ch; font-size:17px; line-height:1.65; }
body #privateApp .block-entry-card .button.primary, body #privateApp .block-setup-card button[type="submit"] { background:#f2c400; color:#171714; border-color:#f2c400; min-height:52px; border-radius:16px; }
body #privateApp .block-entry-visual { display:flex; flex-direction:column; align-items:center; gap:24px; min-width:0; }
body #privateApp .block-focus-orbit { position:relative; width:clamp(190px,22vw,280px); aspect-ratio:1; display:grid; place-items:center; }
body #privateApp .block-focus-orbit i { position:absolute; border:1px solid #b2c7a7; border-radius:50%; inset:0; }
body #privateApp .block-focus-orbit i:nth-child(2) { inset:14%; border-style:dashed; }
body #privateApp .block-focus-orbit i:nth-child(3) { inset:28%; background:#dbe6cc; border:0; }
body #privateApp .block-focus-orbit:after { content:""; width:16px; height:16px; background:#f2c400; border:4px solid #f3f6eb; border-radius:50%; position:absolute; top:7%; left:20%; }
body #privateApp .block-focus-symbol { position:relative; font-size:64px; color:#345640; }
body #privateApp .block-focus-caption { font-size:14px; color:#54714c; }
body #privateApp .block-layout:has(.block-setup-card) .block-main { width:100%; max-width:none; padding:clamp(20px,4vw,56px); }
body #privateApp .block-setup-card { width:100%; max-width:none; margin:0; padding:clamp(20px,3vw,40px); border-radius:28px; }
body #privateApp .block-setup-card .case-form { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:28px; align-items:start; }
body #privateApp .block-setup-card .block-setup-section { display:block; min-width:0; margin:0; padding:24px; background:#f3f6ed; border:1px solid #d5dfd0; border-radius:22px; }
body #privateApp .block-setup-card .block-setup-section-heading h2 { font-size:clamp(23px,2.3vw,32px); margin:10px 0; }
body #privateApp .block-setup-card .block-setup-section-heading .eyebrow:before { content:"01 · "; color:#54714c; }
body #privateApp .block-setup-card .block-setup-section:nth-of-type(2) .eyebrow:before { content:"02 · "; }
body #privateApp .block-setup-card .block-task-choice-list { display:grid; gap:12px; margin-top:24px; }
body #privateApp .block-setup-card .block-task-choice { min-width:0; border-radius:16px; padding:18px; background:#fff; border:1px solid #d5dfd0; }
body #privateApp .block-setup-card .block-task-choice:has(input:checked) { border-color:#3f6f5b; background:#e3ecd8; box-shadow:inset 3px 0 #3f6f5b; }
body #privateApp .block-setup-card .block-duration-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:24px; }
body #privateApp .block-setup-card .block-duration-choice span { min-height:92px; display:flex; align-items:center; justify-content:center; font-size:24px; border-radius:18px; background:#fff; }
body #privateApp .block-setup-card .block-duration-choice:has(input:checked) span { background:#f2c400; color:#171714; border-color:#f2c400; }
body #privateApp .block-setup-card .block-custom-duration { grid-column:1 / -1; border-radius:16px; }
body #privateApp .block-setup-card .block-setup-details, body #privateApp .block-setup-card .case-form > button { grid-column:1 / -1; }
body #privateApp .block-setup-card .block-setup-details { padding:18px 22px; border:1px solid #d5dfd0; border-radius:18px; }
body #privateApp .block-setup-card .case-form > button { justify-self:stretch; font-size:17px; }
body[data-private-theme="dark"] #privateApp .block-entry-card { background:linear-gradient(120deg,#202c22,#2a3c2e); border-color:#49624c; }
body[data-private-theme="dark"] #privateApp .block-focus-orbit i { border-color:#66805f; }
body[data-private-theme="dark"] #privateApp .block-focus-orbit i:nth-child(3) { background:#3a513a; }
body[data-private-theme="dark"] #privateApp .block-focus-orbit:after { border-color:#2a3c2e; }
body[data-private-theme="dark"] #privateApp :is(.block-focus-symbol,.block-focus-caption) { color:#c4d6b7; }
body[data-private-theme="dark"] #privateApp .block-setup-card .block-setup-section { background:#263329; border-color:#49624c; }
body[data-private-theme="dark"] #privateApp .block-setup-card :is(.block-task-choice,.block-duration-choice span) { background:#354238; color:#edf1e8; border-color:#49624c; }
body[data-private-theme="dark"] #privateApp .block-setup-card .block-task-choice:has(input:checked) { background:#3b5039; }
@media(max-width:900px) { body #privateApp .block-entry-card { grid-template-columns:1fr; gap:24px; min-height:0; } body #privateApp .block-entry-visual { display:none; } body #privateApp .block-setup-card .case-form { grid-template-columns:1fr; gap:20px; } }
@media(max-width:480px) { body #privateApp .block-setup-card .block-setup-section { padding:18px; } body #privateApp .block-setup-card .block-duration-choice span { min-height:76px; font-size:20px; } }

body #privateApp .private-main:has(> .block-setup-card) { max-width:none; }
body #privateApp .block-setup-card .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
body #privateApp .block-setup-card .block-task-selector, body #privateApp .block-setup-card .block-duration-selector { border:0; padding:0; background:transparent; min-width:0; }
body[data-private-theme="dark"] #privateApp .block-setup-card .block-duration-choice:has(input:checked) span { background:#f2c400; color:#171714; }
body #privateApp .block-setup-card .block-duration-options > :last-child { grid-column:1 / -1; }
body #privateApp .block-setup-card .block-custom-duration { display:flex; align-items:center; gap:16px; width:100%; padding:16px; }
body #privateApp .block-setup-card .block-custom-duration input { width:110px; min-width:90px; flex:none; font-size:20px; }
body #privateApp .participant-app-shell .block-setup-card button[type="submit"].button.primary { background:#f2c400; color:#171714; border-color:#f2c400; }
body[data-private-theme="dark"] #privateApp :is(.block-entry-copy,.block-setup-card) .muted-copy { color:#c0cfb7; }

/* Mi progreso: datos personales y controles locales, sin bloquear la vista. */
.participant-app-shell .progress-dashboard { display:grid; gap:22px; width:100%; min-width:0; }
.progress-header,.progress-section-head { display:flex; align-items:center; justify-content:space-between; gap:18px; }
.progress-header h2 { font-size:clamp(30px,4vw,48px); letter-spacing:-.045em; margin:6px 0; }
.progress-periods { display:flex; padding:5px; border-radius:18px; background:var(--color-surface,#fff); border:1px solid var(--color-border,#dae4dd); flex-shrink:0; }
.progress-periods button { border:0; border-radius:13px; background:transparent; color:inherit; padding:11px 17px; font:inherit; }
.progress-periods button[aria-pressed="true"] { background:#f5cd43; color:#162e24; font-weight:750; }
.progress-dashboard .progress-snapshot { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.progress-dashboard .progress-snapshot article { padding:22px; border-radius:22px; min-width:0; background:var(--color-surface,#fff); border:1px solid var(--color-border,#dae4dd); display:grid; gap:8px; align-content:start; }
.progress-dashboard .progress-snapshot strong { font-size:clamp(24px,2.6vw,36px); letter-spacing:-.04em; }
.progress-dashboard .progress-snapshot .progress-plan-card { background:#193c2c; color:#fff; }
.progress-dashboard .progress-plan-card strong { font-size:19px; line-height:1.35; letter-spacing:0; overflow-wrap:anywhere; }
.progress-plan-card a { color:#f5cd43; }
.progress-visual-grid { display:grid; grid-template-columns:minmax(0,2fr) minmax(240px,1fr); gap:18px; }
.progress-dashboard .data-card { border-radius:24px; padding:24px; min-width:0; }
.progress-section-head h2,.progress-dashboard h2 { font-size:23px; margin:5px 0 12px; }
.progress-bars { display:grid; grid-template-columns:repeat(var(--progress-days),minmax(16px,1fr)); overflow-x:auto; gap:5px; height:220px; margin:24px 0 16px; }
.progress-bar { display:flex; flex-direction:column; gap:9px; align-items:center; justify-content:flex-end; border:0; background:transparent; color:inherit; min-width:0; padding:2px; border-radius:10px; }
.progress-bar-track { display:flex; align-items:flex-end; background:rgba(105,145,117,.09); border-radius:8px; width:100%; height:185px; overflow:hidden; }
.progress-bar-track i { display:block; width:100%; background:#5a956d; border-radius:8px; transition:height .2s ease; }
.progress-bar:hover .progress-bar-track i,.progress-bar.selected .progress-bar-track i { background:#e1b826; }
.progress-bar small { font-size:10px; white-space:nowrap; }
.progress-bars[style*="30"] .progress-bar:nth-child(2n) small { visibility:hidden; }
.progress-calendar { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:7px; margin:20px 0; }
.progress-calendar button { aspect-ratio:1; border:1px solid rgba(100,140,110,.2); border-radius:9px; background:rgba(80,145,100,var(--activity)); color:inherit; font:inherit; font-size:12px; padding:0; }
.progress-advice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.progress-advice-grid .data-card { display:flex; flex-direction:column; align-items:flex-start; }
.progress-advice-grid p { line-height:1.65; }
.progress-advice-grid .button { margin-top:auto; }
.progress-history-list { margin-top:14px; max-height:600px; overflow:auto; }
.progress-history-row { border-top:1px solid var(--color-border,#dce5de); padding:14px 0; }
.progress-history-row summary { display:flex; align-items:center; justify-content:space-between; gap:20px; list-style:none; }
.progress-history-row summary span { display:grid; gap:5px; min-width:0; }
.progress-history-row summary span:last-child { text-align:right; flex-shrink:0; }
.progress-history-row strong { overflow-wrap:anywhere; }
.progress-history-row small { opacity:.65; font-size:12px; }
.progress-estimates { border-radius:18px; }
.progress-dashboard select { max-width:100%; border-radius:12px; padding:10px; font:inherit; color:inherit; background:var(--color-surface,#fff); border:1px solid var(--color-border,#dae4dd); }
body[data-private-theme="dark"] .progress-dashboard .progress-snapshot article,body[data-private-theme="dark"] .progress-periods,body[data-private-theme="dark"] .progress-dashboard select { background:#1d3027; border-color:#354b3d; }
body[data-private-theme="dark"] .progress-dashboard .progress-plan-card { background:#284c36; }
@media(max-width:1100px) { .progress-dashboard .progress-snapshot { grid-template-columns:repeat(2,minmax(0,1fr)); } .progress-visual-grid { grid-template-columns:minmax(0,1fr); } }
@media(max-width:600px) { .progress-header { align-items:flex-start; flex-direction:column; } .progress-periods { width:100%; } .progress-periods button { flex:1; } .progress-dashboard .data-card { padding:18px; } .progress-dashboard .progress-snapshot article { padding:16px; } .progress-advice-grid { grid-template-columns:minmax(0,1fr); } .progress-section-head { align-items:flex-start; flex-wrap:wrap; } .progress-bars { gap:2px; } .progress-bars[style*="30"] .progress-bar small { visibility:hidden; } }
@media(prefers-reduced-motion:reduce) { .progress-bar-track i { transition:none; } }
.progress-dashboard .progress-plan-card strong { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
@media(max-width:600px) { .progress-dashboard .progress-plan-card strong { font-size:16px; } }
.block-optional-panel { border:1px solid var(--color-border,#d9e4dc); border-radius:16px; padding:14px 18px; margin:12px 0; }
.block-optional-panel summary { font-weight:650; padding:4px 0; }
.block-optional-panel[open] summary { margin-bottom:16px; }
.block-close-form > .focus-actions { display:flex; flex-wrap:wrap; gap:12px; justify-content:flex-end; }
.account-dialog .trophy-identity-grid { grid-template-columns:1fr; }
.library-tools { display:grid; grid-template-columns: minmax(0,1.4fr) minmax(180px,1fr) minmax(160px,.6fr); gap:18px; align-items:end; }
.library-tools h2 { margin:6px 0; font-size:24px; }
.library-tools label { display:grid; gap:8px; }
.library-tools [data-library-filter-message] { grid-column:1/-1; margin:0; font-size:13px; opacity:.7; }
.library-grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); align-items:start; }
.library-grid .library-card { border-radius:22px; padding:22px; }
[data-library-resource][hidden] { display:none!important; }
.library-skeleton { display:grid; gap:14px; padding:20px 0; }
.library-skeleton span { display:block; height:18px; border-radius:8px; background:var(--color-border,#e1e9e3); }
.library-skeleton span:first-child { width:55%; height:28px; }
.library-skeleton span:last-child { width:75%; }
@media(max-width:760px) { .library-tools { grid-template-columns:1fr; } }
.calendar-editor { border:1px solid var(--color-border,#dce5df); border-radius:18px; padding:16px; }
.calendar-editor summary { font-weight:700; }
.calendar-editor[open] summary { margin-bottom:18px; }
.exam-calendar-layout { grid-template-columns:minmax(0,1fr) minmax(240px,.32fr); }
.diagnostic-test-card { border-radius:24px; }
@media(max-width:900px) { .exam-calendar-layout { grid-template-columns:1fr; } }
.admin-shell .admin-command-metrics { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:14px; }
.admin-shell .admin-command-metrics > article { border-radius:20px; padding:20px; }
.admin-shell .data-card,.group-admin-shell .data-card { border-radius:22px; }
.admin-shell .table-wrapper { overflow:auto; }
.admin-shell table { width:100%; border-collapse:collapse; }
.admin-shell td,.admin-shell th { padding:12px 14px; }

/* Comunidad: clasificaciones sobre registros existentes. */
.community-ranking { width:100%; display:grid; gap:22px; }
.community-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.community-heading h2 { font-size:clamp(30px,4vw,54px); letter-spacing:-2px; margin:10px 0; }
.community-tabs,.community-periods { display:flex; flex-wrap:wrap; gap:8px; }
.community-tabs { padding:6px; background:#eceee7; border-radius:16px; }
.community-tabs button { flex:1; min-height:48px; border:0; border-radius:12px; background:transparent; color:#171714; font:inherit; cursor:pointer; }
.community-tabs button[aria-pressed="true"],.community-periods button[aria-pressed="true"] { background:#f2c400; color:#171714; }
.community-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.community-summary span { padding:20px; border:1px solid #8883; border-radius:18px; font-size:12px; }
.community-summary strong { display:block; font-size:clamp(22px,3vw,36px); margin-bottom:8px; }
.community-podium { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:22px 0; }
.community-winner { display:grid; justify-items:center; gap:14px; text-align:center; padding:28px 16px; border:1px solid #8883; border-radius:24px; background:linear-gradient(145deg,#f2c40016,transparent); }
.community-winner:first-child { background:linear-gradient(145deg,#f2c40055,#f2c40015); }
.community-medal { display:grid; place-items:center; width:58px; height:58px; border-radius:50%; background:#f2c400; color:#171714; font-size:24px; font-weight:800; }
.community-winner strong { overflow-wrap:anywhere; }
.community-list { display:grid; gap:8px; }
.community-row { display:grid; grid-template-columns:40px minmax(0,1fr) auto; align-items:center; gap:16px; padding:18px; border:1px solid #8883; border-radius:16px; }
.community-row strong { overflow-wrap:anywhere; }
.community-meter { max-width:280px; height:5px; background:#8882; margin-top:10px; border-radius:8px; }
.community-meter i { display:block; height:100%; border-radius:inherit; background:#3f6f5b; }
.community-row.is-current-user,.community-winner.is-current-user { border:2px solid #d9b000; }
.community-empty { padding:36px; border:1px solid #8883; border-radius:24px; }
@media(max-width:700px) { .community-heading { align-items:flex-start; flex-direction:column; } .community-summary { gap:8px; } .community-summary span { padding:14px 10px; } .community-podium { gap:8px; } .community-winner { padding:18px 8px; font-size:12px; } .community-row { gap:10px; padding:14px 10px; grid-template-columns:28px minmax(0,1fr) auto; } .community-row b { font-size:12px; } }
.community-periods .button { width:auto; flex:1; min-width:90px; min-height:44px; padding:10px; font-size:12px; }
/* Administración: lenguaje visual USI, sin alterar las herramientas ni permisos. */
body.is-private-route #privateApp .admin-shell .private-main { padding:clamp(20px,3vw,44px); }
body.is-private-route #privateApp .admin-shell .admin-hero { position:relative; overflow:hidden; padding:32px; border-radius:24px; background:radial-gradient(ellipse at 95% 0%,#557b4c66,transparent 60%),#102f26; border:1px solid #294a39; gap:24px; align-items:center; margin-bottom:24px; }
body.is-private-route #privateApp .admin-shell .admin-hero h1 { color:#fffdf8; font-size:clamp(28px,3vw,43px); line-height:1.12; letter-spacing:-1.5px; margin:10px 0; }
body.is-private-route #privateApp .admin-shell .admin-hero .eyebrow { color:#f2c400; letter-spacing:1.5px; }
body.is-private-route #privateApp .admin-shell .admin-hero .muted-copy { color:#d3ddd5; max-width:650px; line-height:1.6; }
body.is-private-route #privateApp .admin-shell .admin-hero .button { background:#ffffff0c; border-color:#ffffff45; color:#fffdf8; flex-shrink:0; }
body.is-private-route #privateApp .admin-shell :is(.data-card,.ops-panel,.card) { border-radius:20px; border:1px solid #dfe5db; box-shadow:0 6px 22px #173b3005; padding:clamp(18px,2vw,28px); }
body.is-private-route #privateApp .admin-shell :is(.data-card,.ops-panel) h2 { font-size:clamp(20px,2vw,26px); line-height:1.25; letter-spacing:-.6px; }
body.is-private-route #privateApp .admin-shell .admin-metrics { gap:12px; }
body.is-private-route #privateApp .admin-shell .admin-metrics article { border:1px solid #dfe5db; border-radius:18px; padding:20px; background:linear-gradient(145deg,#fffdf8,#eff3eb); box-shadow:none; min-width:0; }
body.is-private-route #privateApp .admin-shell .admin-metrics strong { color:#234c37; font-size:clamp(26px,3vw,36px); letter-spacing:-1px; line-height:1.2; overflow-wrap:anywhere; }
body.is-private-route #privateApp .admin-shell .admin-metrics span { color:#5d695e; font-size:12px; line-height:1.5; }
body.is-private-route #privateApp .admin-shell .admin-metrics .metric-warning { border-left:3px solid #d6aa00; }
body.is-private-route #privateApp .admin-shell .admin-metrics .metric-urgent { border-left:3px solid #a84736; }
body.is-private-route #privateApp .admin-shell .button { border-radius:12px; min-height:42px; box-shadow:none; }
body.is-private-route #privateApp .admin-shell .button.primary { background:#f2c400; color:#173b30; border-color:#f2c400; }
body.is-private-route #privateApp .admin-shell :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea) { border-radius:12px; border-color:#ccd6c8; background:#fffdf8; color:#172b23; }
body.is-private-route #privateApp .admin-shell :is(input,select,textarea,button,a):focus-visible { outline:3px solid #9a7800; outline-offset:3px; }
body.is-private-route #privateApp .admin-shell .table-wrapper { border:1px solid #dfe5db; border-radius:14px; overflow:auto; }
body.is-private-route #privateApp .admin-shell th { background:#eaf0e5; color:#294835; font-size:12px; font-weight:650; border-bottom:1px solid #d5dfce; }
body.is-private-route #privateApp .admin-shell td { border-bottom:1px solid #e6eadf; font-size:13px; line-height:1.5; }
body.is-private-route #privateApp .admin-shell tbody tr:hover { background:#eff3eb; }
body.is-private-route #privateApp .admin-shell :is(.admin-content-row,.admin-plan-day-row) { border-radius:14px; border-color:#dfe5db; }
body.is-private-route #privateApp .admin-shell .chart-track { background:#e4eadf; border-radius:10px; overflow:hidden; }
body.is-private-route #privateApp .admin-shell .chart-track i { background:#3f6f5b; border-radius:inherit; }
body[data-private-theme="dark"] #privateApp .admin-shell :is(.data-card,.ops-panel,.card,.admin-metrics article) { background:#202e25; border-color:#3b493e; color:#edf1e8; }
body[data-private-theme="dark"] #privateApp .admin-shell .admin-metrics strong { color:#e8d366; }
body[data-private-theme="dark"] #privateApp .admin-shell .admin-metrics span { color:#becbbd; }
body[data-private-theme="dark"] #privateApp .admin-shell :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea) { background:#17231c; color:#edf1e8; border-color:#536450; }
body[data-private-theme="dark"] #privateApp .admin-shell th { background:#293c2e; color:#edf1e8; }
body[data-private-theme="dark"] #privateApp .admin-shell td { border-color:#3b493e; }
body[data-private-theme="dark"] #privateApp .admin-shell tbody tr:hover { background:#293c2e; }
@media(max-width:700px) { body.is-private-route #privateApp .admin-shell .private-main { padding:18px 14px; } body.is-private-route #privateApp .admin-shell .admin-hero { padding:24px; flex-direction:column; align-items:flex-start; } body.is-private-route #privateApp .admin-shell .admin-command-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } body.is-private-route #privateApp .admin-shell .admin-metrics article { padding:16px; } body.is-private-route #privateApp .admin-shell .admin-hero .button { align-self:flex-start; } }
/* Pantallas secundarias del usuario: superficies compactas y estados legibles. */
body.is-private-route #privateApp .participant-app-shell :is(.library-tools,.diagnostic-test-card) { background:#fffdf8; border:1px solid #dce3d6; border-radius:22px; padding:clamp(20px,3vw,30px); box-shadow:0 8px 24px #173b3006; }
body.is-private-route #privateApp .participant-app-shell .library-tools h2 { color:#244b37; letter-spacing:-.7px; }
body.is-private-route #privateApp .participant-app-shell .library-card { background:#fffdf8; border:1px solid #dce3d6; border-radius:20px; box-shadow:0 8px 24px #173b3006; min-width:0; padding:24px; }
body.is-private-route #privateApp .participant-app-shell .library-card h3 { color:#244b37; font-size:22px; letter-spacing:-.5px; line-height:1.25; }
body.is-private-route #privateApp .participant-app-shell .library-card-locked { border-style:dashed; box-shadow:none; }
body.is-private-route #privateApp .participant-app-shell .library-card .button.primary { background:#f2c400; border-color:#f2c400; color:#173b30; }
body.is-private-route #privateApp .participant-app-shell .library-card .button { border-radius:24px; }
body.is-private-route #privateApp .participant-app-shell .empty-state { padding:35px 24px; text-align:center; border:1px dashed #b9cbb2; background:#edf2e8; box-shadow:none; }
body.is-private-route #privateApp .participant-app-shell .empty-state p { max-width:480px; margin:0 auto; color:#496044; line-height:1.7; }
body.is-private-route #privateApp .participant-app-shell .empty-state > span:empty { display:none; }
body.is-private-route #privateApp .participant-app-shell .task-empty-state { padding:18px 22px; border-radius:14px; background:#edf2e8; color:#496044; line-height:1.6; }
body.is-private-route #privateApp .participant-app-shell .likert-question { padding:22px; border-color:#dce3d6; border-radius:18px; }
body.is-private-route #privateApp .participant-app-shell .likert-options span { border-radius:12px; min-height:44px; }
body.is-private-route #privateApp .participant-app-shell .form-message:not(:empty) { padding:12px 16px; border-radius:12px; border-left:3px solid currentColor; line-height:1.6; overflow-wrap:anywhere; }
body.is-private-route #privateApp .participant-app-shell .library-skeleton span { background:#e1e8da; }
body[data-private-theme="dark"] #privateApp .participant-app-shell :is(.library-tools,.library-card,.diagnostic-test-card,.likert-question) { background:#202e25; border-color:#42543e; }
body[data-private-theme="dark"] #privateApp .participant-app-shell :is(.library-tools h2,.library-card h3) { color:#edf1e8; }
body[data-private-theme="dark"] #privateApp .participant-app-shell :is(.empty-state,.task-empty-state) { background:#26382a; border-color:#607856; color:#d2dfca; }
body[data-private-theme="dark"] #privateApp .participant-app-shell .empty-state p { color:#d2dfca; }
body[data-private-theme="dark"] #privateApp .participant-app-shell .library-skeleton span { background:#3b4e36; }
@media(max-width:700px) { body.is-private-route #privateApp .participant-app-shell :is(.library-card,.likert-question) { padding:20px; } body.is-private-route #privateApp .participant-app-shell .library-card h3 { font-size:20px; } }

/* Temporizador: ocupa el viewport; contenido secundario en panel desplegable. */
body.is-private-route #privateApp .block-layout:has(.focus-room-running) { width:100%; max-width:none; margin:0; padding:0; min-height:100svh; display:block; }
body.is-private-route #privateApp .block-main:has(.focus-room-running) { width:100%; max-width:none; margin:0; padding:0; }
body.is-private-route #privateApp .focus-room-running { position:relative; width:100%; max-width:none; margin:0; border-radius:0; height:100svh; min-height:0; padding:clamp(14px,3vh,30px) 20px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:clamp(8px,1.5vh,16px); box-sizing:border-box; }
body.is-private-route #privateApp .focus-room-running > :is(h1,p) { margin:0; max-width:900px; text-align:center; }
body.is-private-route #privateApp .focus-room-running h1 { font-size:clamp(22px,4vh,40px); line-height:1.2; }
body.is-private-route #privateApp .focus-room-running .focus-timer { margin:0; padding:18px 12px; min-height:0; width:min(680px,100%); max-width:100%; aspect-ratio:auto; container-type:normal; }
body.is-private-route #privateApp .focus-room-running .elapsed-time { font-size:clamp(48px,min(17vh,15vw),136px); line-height:1.1; font-variant-numeric:tabular-nums; max-inline-size:100%; overflow:visible; color:#fffdf8; }
body.is-private-route #privateApp .focus-room-running .focus-actions { margin:0; opacity:1; transform:none; gap:12px; }
body.is-private-route #privateApp .focus-room-running .operative-phrase { font-size:clamp(14px,2.3vh,20px); line-height:1.4; }
.focus-session-extras { width:min(100%,700px); position:relative; }
.focus-session-extras > summary { text-align:center; cursor:pointer; min-height:44px; padding:12px; font-size:13px; }
.focus-session-extras[open] .focus-session-extras-body { position:absolute; bottom:100%; left:0; right:0; max-height:55svh; overflow:auto; padding:22px; border:1px solid #bfccb6; border-radius:18px; background:#fffdf8; color:#172b23; box-shadow:0 15px 50px #00000025; z-index:5; }
body[data-private-theme="dark"] .focus-session-extras[open] .focus-session-extras-body { background:#202e25; color:#edf1e8; border-color:#52654b; }
@media(max-height:520px) { body.is-private-route #privateApp .focus-room-running { gap:4px; padding:8px 16px; } body.is-private-route #privateApp .focus-room-running .elapsed-time { font-size:18vh; } body.is-private-route #privateApp .focus-room-running h1 { font-size:22px; } }

.tiope-context-card { max-width:900px; margin:0 auto; }
.tiope-context-card fieldset { border:0; padding:0; margin:28px 0; }.tiope-context-card legend { font-size:14px; font-weight:650; margin-bottom:14px; }
.tiope-context-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }.tiope-context-options label { cursor:pointer; position:relative; }.tiope-context-options input { position:absolute; opacity:0; }.tiope-context-options span { display:flex; align-items:center; min-height:78px; padding:20px; border:1px solid #b4c5ac; border-radius:16px; background:#edf2e8; color:#234b35; font-size:16px; font-weight:600; }.tiope-context-options input:checked + span { background:#f2c400; color:#173b30; border-color:#f2c400; }.tiope-context-options input:focus-visible + span { outline:3px solid #9a7800; outline-offset:3px; }.tiope-context-goal { display:grid; gap:10px; margin:20px 0; }.tiope-context-summary { display:flex; align-items:center; flex-wrap:wrap; gap:12px; font-size:13px; }
body[data-private-theme="dark"] .tiope-context-options span { background:#26382a; color:#edf1e8; border-color:#637958; }body[data-private-theme="dark"] .tiope-context-options input:checked + span { background:#f2c400; color:#173b30; }
@media(max-width:600px) { .tiope-context-options { grid-template-columns:1fr; }.tiope-context-options span { min-height:64px; padding:16px; } }

/* Small-step help stays inside the existing focus cards. */
body #privateApp .starting-help { margin-top:16px; width:100%; }
body #privateApp .starting-help-form { margin-top:14px; padding:20px; border:1px solid #ffffff25; border-radius:20px; background:#ffffff0b; display:grid; gap:12px; text-align:left; }
body #privateApp .starting-help-form[hidden] { display:none; }
body #privateApp .starting-help-form label { display:grid; gap:8px; }
body #privateApp .starting-help-form :is(input,select) { width:100%; min-width:0; }
body #privateApp .starting-help-form p { margin:0; font-size:14px; }
body #privateApp .starting-help-form h3 { margin:0; }

body #privateApp .return-guide-card { display:flex; flex-direction:column; gap:12px; }
body #privateApp .return-guide-action { display:grid; gap:6px; padding:14px; border-radius:16px; background:color-mix(in srgb, #f2c400 10%, transparent); overflow-wrap:anywhere; }
body #privateApp .return-guide-evidence { padding-top:12px; border-top:1px solid #8883; font-size:13px; }
body #privateApp .return-guide-card .button { align-self:flex-start; white-space:normal; }

/* A quiet clock and compact parking space. */
body.is-private-route #privateApp .focus-room-running .focus-timer,
body.is-private-route #privateApp .focus-room-running .focus-timer.is-alert,
body.is-private-route #privateApp .focus-room-running .focus-timer .elapsed-time { animation:none; box-shadow:none; background:none; }
body.is-private-route #privateApp .focus-room-running .focus-timer::before,
body.is-private-route #privateApp .focus-room-running .focus-timer::after { display:none; }
body #privateApp .block-distraction-capture { width:100%; padding:20px; border:1px solid #ccd9d0; border-radius:20px; background:#f2f6f3; color:#173b30; text-align:left; }
body #privateApp .block-distraction-capture > div { display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; }
body #privateApp .block-distraction-capture .eyebrow { width:100%; margin:0; color:#315b45; }
body #privateApp .block-distraction-capture > div > span { margin-left:auto; font-size:12px; color:#425b4d; }
body #privateApp .block-distraction-capture form { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; margin-top:16px; align-items:end; }
body #privateApp .block-distraction-capture .park-note-label { display:grid; gap:8px; font-size:13px; }
body #privateApp .block-distraction-capture input { min-width:0; width:100%; border:1px solid #a6bdad; border-radius:12px; padding:12px; background:#ffffff; color:#173b30; }
body #privateApp .block-distraction-capture button { background:#f2c400; color:#081e19; border:0; padding:12px 16px; border-radius:14px; min-height:44px; }
body #privateApp .block-distraction-capture :is(form > small,.form-message) { grid-column:1/-1; margin:0; color:#425b4d; }
body #privateApp .block-distraction-capture .form-message:empty { display:none; }
body #privateApp .block-distraction-capture ul { display:grid; gap:8px; padding:0; margin:16px 0 0; list-style:none; }
body #privateApp .block-distraction-capture li { padding:10px 12px; border-radius:12px; background:#e1ece4; color:#173b30; overflow-wrap:anywhere; font-size:14px; }
body #privateApp .block-distraction-capture li span { color:#315b45; }
@media(max-width:600px) { body #privateApp .block-distraction-capture form { grid-template-columns:1fr; } }

body #privateApp .block-distraction-capture :is(strong,.park-note-label) { color:#173b30; }
body #privateApp .block-distraction-capture > small { color:#425b4d; }
body #privateApp .block-distraction-capture input::placeholder { color:#536b5c; opacity:1; }
body #privateApp .block-distraction-capture input:focus-visible { outline:2px solid #315b45; outline-offset:3px; }
body #privateApp .block-distraction-capture button span { color:#081e19; }
body #privateApp .block-distraction-capture .form-message.error { color:#9b2525; }