/* Tareas Melatte: mismos colores que el club (crema, café y dorado), pensado primero para el móvil */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:16px/1.45 Inter,system-ui,sans-serif;background:var(--claro);color:var(--tinta)}
body.oscuro{background:var(--fondo);color:var(--claro)}
h1{font:700 1.7rem/1.15 Fraunces,Georgia,serif;margin:.6rem 0 .3rem}
h2{font:600 1.2rem/1.2 Fraunces,Georgia,serif;margin:1.8rem 0 .6rem}
a{color:inherit}
.suave{opacity:.75}.pequeno{font-size:.85rem}.oculto{display:none!important}
.estrecho{max-width:560px;margin:0 auto;padding:16px 16px 48px}
.ancho{max-width:1100px;margin:0 auto;padding:16px 16px 64px}

.cabeza{display:flex;align-items:center;gap:10px;padding:6px 0 10px;font-size:.95rem}
.cabeza img{width:34px;height:34px;object-fit:contain;border-radius:8px;background:#fff1}
.cabeza .salir{margin-left:auto;font-size:.9rem;opacity:.8;text-decoration:none}

.caja{display:grid;gap:12px;padding:16px;border-radius:16px;background:#fff;color:var(--tinta);box-shadow:0 1px 2px #0001,0 6px 24px #0000000d}
label{display:grid;gap:4px;font-weight:600;font-size:.92rem}
label small{font-weight:400;opacity:.7}
input,select,textarea{font:inherit;padding:11px 12px;border:1px solid #d9cfc0;border-radius:10px;background:#fff;color:var(--tinta);width:100%}
textarea{resize:vertical}
input:focus,select:focus,textarea:focus{outline:2px solid var(--acento);outline-offset:1px}
.casilla{display:flex;align-items:center;gap:8px;font-weight:500}.casilla input{width:auto}
.fila{display:flex;flex-wrap:wrap;gap:12px;align-items:end}.fila>label{flex:1 1 140px}

.boton{display:inline-block;border:0;border-radius:12px;padding:12px 18px;font:600 1rem Inter,sans-serif;background:var(--acento);color:#2a1f17;cursor:pointer;text-decoration:none;text-align:center}
.boton:disabled{opacity:.5;cursor:default}
.boton.secundario{background:#efe6d8;color:var(--tinta)}
.boton.pequeno{padding:8px 12px;font-size:.9rem}
.enlace{background:none;border:0;color:#a33;text-decoration:underline;cursor:pointer;font:inherit}
.aviso{background:#fff3cd;color:#5c4400;border-radius:12px;padding:10px 14px;margin:10px 0}
.ok{background:#e3f4e6;color:#1d5b2a;border-radius:12px;padding:10px 14px;margin:10px 0}
.vacio{padding:18px;border-radius:14px;background:#0000000a;text-align:center}

.barra{height:6px;border-radius:9px;background:#0000001a;overflow:hidden;margin:6px 0}
.barra i{display:block;height:100%;background:var(--acento);transition:width .3s}

.chip{display:inline-block;padding:2px 9px;border-radius:99px;font-size:.8rem;font-weight:600;background:#0000000f;white-space:nowrap}
.chip.a-tiempo{background:#d9f2df;color:#1d5b2a}.chip.tarde{background:#fde8c8;color:#7a4a00}
.chip.retraso,.chip.sin-hacer{background:#fbd5d5;color:#8a1c1c}.chip.en-curso{background:#e7e1f7;color:#3d2c7a}

/* Mis tareas */
.listas{display:grid;gap:12px}
.tarjeta-lista{display:block;padding:14px 16px;border-radius:16px;background:#fff;text-decoration:none;box-shadow:0 1px 2px #0001,0 6px 20px #0000000d;border-left:6px solid var(--acento)}
.tarjeta-lista.retraso{border-left-color:#d64545}.tarjeta-lista.a-tiempo,.tarjeta-lista.tarde{border-left-color:#3e9b55}
.tl-arriba{display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:1.05rem}
.proximos{padding-left:18px}

/* Lista de tareas */
.resumen-progreso{position:sticky;top:0;z-index:2;background:var(--claro);padding:8px 0}
.tareas{list-style:none;padding:0;margin:8px 0;display:grid;gap:8px}
.tarea{background:#fff;border-radius:14px;box-shadow:0 1px 2px #0001}
.tarea-boton{display:flex;gap:12px;align-items:flex-start;width:100%;padding:14px;border:0;background:none;text-align:left;font:inherit;color:inherit;cursor:pointer}
.check{flex:0 0 30px;height:30px;border-radius:50%;display:grid;place-items:center;border:2px solid #cdbfa9;font-weight:700;font-size:.85rem}
.tarea.hecha .check{background:#3e9b55;border-color:#3e9b55;color:#fff}
.tarea.hecha .tarea-texto{opacity:.65}
.icono-foto{font-style:normal;font-size:.85rem}
.tarea-hecha{display:flex;gap:10px;align-items:center;padding:0 14px 12px 56px}
.tarea-hecha img{width:64px;height:64px;object-fit:cover;border-radius:8px}
.fin{margin:16px 0;padding:18px;border-radius:16px;background:#3e9b55;color:#fff;font-weight:600;text-align:center;font-size:1.1rem}

.hoja{border:0;padding:0;width:100%;max-width:560px;margin:auto auto 0;border-radius:20px 20px 0 0;max-height:96dvh}
.hoja::backdrop{background:#000a}
.hoja-cuerpo{display:grid;gap:12px;padding:16px 16px calc(16px + env(safe-area-inset-bottom))}
.hoja-titulo{font-weight:700;font-size:1.05rem;margin:0}
.camara{position:relative;background:#111;border-radius:14px;overflow:hidden;height:min(52dvh,120vw);display:grid;place-items:center}
.camara video,.camara img{width:100%;height:100%;object-fit:cover}
.camara-error{color:#fff;padding:20px;text-align:center}
.botones-camara{display:flex;gap:10px}.botones-camara .boton{flex:1}
.disparo{font-size:1.1rem;padding:14px}
.nota{font-weight:600}
.hoja-pie{display:flex;gap:10px}.hoja-pie .boton{flex:1}
[hidden]{display:none!important}

/* Panel */
.panel-cabeza{background:var(--fondo);color:var(--claro);padding:10px 16px 0}
.panel-cabeza .cabeza{max-width:1100px;margin:0 auto}
.panel-cabeza nav{max-width:1100px;margin:0 auto;display:flex;gap:4px;overflow-x:auto}
.panel-cabeza nav a{padding:10px 14px;text-decoration:none;border-radius:10px 10px 0 0;opacity:.8;white-space:nowrap}
.panel-cabeza nav a[aria-current]{background:var(--claro);color:var(--tinta);opacity:1;font-weight:600}
.cifras{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin:12px 0 18px}
.cifras div{background:#fff;border-radius:14px;padding:12px 14px;box-shadow:0 1px 2px #0001}
.cifras b{display:block;font:700 1.8rem Fraunces,serif}.cifras small{opacity:.7}
.cifras .a-tiempo b{color:#2f7d45}.cifras .tarde b{color:#9a6200}.cifras .retraso b{color:#b42f2f}
.tabla-envoltura{overflow-x:auto;background:#fff;border-radius:14px;box-shadow:0 1px 2px #0001}
table{border-collapse:collapse;width:100%;font-size:.92rem}
th,td{padding:10px 12px;border-bottom:1px solid #eee4d6;text-align:left;vertical-align:top}
th{font-size:.8rem;text-transform:uppercase;letter-spacing:.03em;opacity:.7}
tr.apagada{opacity:.5}
td .barra{width:90px}
.bien{color:#2f7d45}.regular{color:#9a6200}.mal{color:#b42f2f}
.incidencias{list-style:none;padding:0;display:grid;gap:8px}.incidencias li{background:#fff;border-radius:12px;padding:10px 14px;border-left:4px solid #d64545}
.galeria{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin-top:14px}
.galeria figure{margin:0;background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 1px 2px #0001}
.galeria img,.sin-foto{width:100%;aspect-ratio:3/4;object-fit:cover;display:grid;place-items:center;background:#f1ebe1}
.galeria .pendiente .sin-foto{background:#fbd5d5;color:#8a1c1c;font-weight:600}
.galeria figcaption{padding:10px 12px;font-size:.9rem}
.filtro,.en-linea{display:flex;flex-wrap:wrap;gap:10px;align-items:end;margin-bottom:10px}
.fila-equipo{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.fila-equipo input[name=nombre]{flex:2 1 160px}.fila-equipo input[name=telefono]{flex:1 1 130px}.fila-equipo input[name=pin]{flex:0 1 120px}
.formulario{max-width:760px}
.registro{list-style:none;padding:0;font-size:.88rem}.registro li{padding:6px 0;border-bottom:1px solid #eee4d6}
.registro .error b{color:#b42f2f}.registro .aviso{background:none;padding:0;margin:0;color:inherit}.registro .aviso b{color:#2f7d45}