/* Estilos de la app móvil, de las páginas legales y del registro. Van aparte
   de style.css para que el trabajo de diseño y este no se pisen. */
/* App móvil: deja libre la zona de la cámara y de la barra inferior del teléfono. */
@media(max-width:780px){.sidebar{padding-top:calc(16px + env(safe-area-inset-top,0px))}footer{padding-bottom:calc(17px + env(safe-area-inset-bottom,0px))}}#auth{padding-top:calc(20px + env(safe-area-inset-top,0px));padding-bottom:calc(20px + env(safe-area-inset-bottom,0px))}
/* iPhone amplía la página al enfocar un campo con letra menor de 16px y no vuelve a reducirla. */
@media(max-width:780px){input,select,textarea{font-size:16px!important}}
/* Los símbolos de la interfaz se dibujan como texto, no como emojis de colores. */
html{font-variant-emoji:text}
/* Páginas de privacidad y aviso legal. */
.legal-page{overflow:auto}.legal{max-width:720px;margin:0 auto;padding:calc(28px + env(safe-area-inset-top,0px)) 20px calc(60px + env(safe-area-inset-bottom,0px));font-size:15px;line-height:1.7}.legal .brand{margin-bottom:26px}.legal h1{font:700 30px Sora,sans-serif;margin:0 0 4px}.legal h2{font:600 18px Sora,sans-serif;margin:34px 0 10px}.legal p,.legal ul{margin:0 0 14px}.legal ul{padding-left:20px}.legal li{margin-bottom:6px}.legal a{color:var(--accent);text-decoration:underline}.legal a.brand{color:inherit;text-decoration:none}.legal-meta{color:var(--muted);font-size:13px}.legal-draft{border:1px solid var(--accent);border-radius:10px;padding:12px 14px;font-size:13px}.legal table{width:100%;border-collapse:collapse;font-size:14px;margin-bottom:14px;display:block;overflow-x:auto}.legal th,.legal td{text-align:left;vertical-align:top;padding:9px 10px;border-bottom:1px solid var(--border);min-width:96px}.legal th{font-size:12px;color:var(--muted)}.legal-links{margin-top:40px;padding-top:18px;border-top:1px solid var(--border);font-size:14px}
footer a{color:inherit;text-decoration:underline}
/* Aceptación de condiciones en el registro y recordatorios de la app móvil. */
.auth-terms:not([hidden]),.notify-row{display:flex!important;gap:10px;align-items:flex-start;font-size:13px;line-height:1.5}.auth-terms input,.notify-row input{width:auto!important;margin:3px 0 0;flex-shrink:0}.auth-terms a{color:var(--accent);text-decoration:underline}
.notify-panel{padding:22px;margin-top:20px}.notify-panel h2{font:600 16px Sora,sans-serif;margin:0 0 6px}.notify-invite{padding:18px;margin-bottom:18px;display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}.notify-invite .form-hint{margin:4px 0 0}.notify-actions{display:flex;gap:8px;align-items:center}
/* En la app móvil no hay pie de página web; sus enlaces están en Mi disponibilidad. */
.nativa footer{display:none}.about-links{display:grid;gap:12px;margin:8px 0 0}.about-links a{color:var(--accent);text-decoration:underline;font-size:14px}.legal h3{font:600 15px Sora,sans-serif;margin:20px 0 6px}
/* La pantalla de entrada tapa también la barra de pestañas inferior. */
#auth{z-index:120}
/* En móvil, la cuarta pestaña lleva a los ajustes (disponibilidad, recordatorios, cuenta). */
.app-nav .nav-ajustes{display:none}@media(max-width:780px){.sidebar .app-nav .nav-ajustes{display:flex}}
/* Los campos de hora de iPhone no se salen de su columna. */
@media(max-width:780px){input,select,textarea{min-width:0;max-width:100%}.form-grid>*{min-width:0}input[type=time],input[type=date]{-webkit-appearance:none;appearance:none}}
/* En la app, el contenido no asoma por detrás de la hora y la batería al desplazarse. */
.nativa body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--bg);z-index:110}
@media(max-width:780px){input[type=time],input[type=date]{min-height:46px}}
/* Mientras se carga el plan no se queda la pantalla vacía. */
#main:empty::before{content:"Cargando tu plan…";display:block;padding:90px 20px;text-align:center;color:var(--muted);font-size:15px}
/* Las pestañas visibles se reparten siempre en una sola fila. Se mantienen las cuatro secciones principales también en la app móvil. */
@media(max-width:780px){.sidebar .app-nav{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}}

/* En un iPad la app se abre en una ventana de iPhone sin margen superior del sistema. */
@media(max-width:780px){.nativa .sidebar{padding-top:calc(16px + max(env(safe-area-inset-top,0px),14px))}}
/* Páginas de recuperar y cambiar la contraseña. */
.account-page{max-width:460px}.account-page form{display:grid;gap:4px;margin-top:22px}.auth-forgot{display:block;text-align:center;margin-top:12px;font-size:12px;color:var(--muted);text-decoration:underline}
/* Entrada suave de cada pantalla en la app móvil. */
@keyframes entra{from{opacity:.35}to{opacity:1}}@media(prefers-reduced-motion:no-preference){.nativa #main>*{animation:entra .16s ease-out}}

/* Asistente: conversación */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.ai-chat{display:flex;flex-direction:column;max-width:760px;height:calc(100dvh - 210px);min-height:380px;padding:0}.ai-log{flex:1;overflow-y:auto;padding:22px 22px 8px;display:flex;flex-direction:column;gap:12px;overscroll-behavior:contain}
.ai-msg{max-width:86%;line-height:1.65;font-size:14px}.ai-msg p{margin:0;padding:11px 15px;border-radius:16px;white-space:pre-wrap;overflow-wrap:anywhere}.ai-me{align-self:flex-end}.ai-me p{background:var(--accent);color:#fff;border-bottom-right-radius:5px}[data-theme="dark"] .ai-me p{color:#1d1a26}.ai-bot{align-self:flex-start}.ai-bot p{background:var(--soft);color:var(--ink);border-bottom-left-radius:5px}
.ai-wait p{color:var(--muted)}@media(prefers-reduced-motion:no-preference){.ai-wait p{animation:ai-pulso 1.4s ease-in-out infinite}}@keyframes ai-pulso{50%{opacity:.5}}
.ai-proposal{margin-top:8px;border:1px solid var(--border);border-radius:14px;padding:14px 16px;background:var(--bg)}.ai-proposal h3{font:700 13px var(--font-heading);margin:0 0 8px}.ai-proposal ul{margin:0 0 12px;padding-left:18px}.ai-proposal li{margin:4px 0}.ai-proposal .notice{margin:0 0 12px}.ai-proposal .form-hint{margin:0}.ai-actions{display:flex;gap:8px;flex-wrap:wrap}.ai-done{margin:0;color:var(--green,#4c8473);font-weight:600;font-size:13px}
.ai-hello{margin:auto 0;text-align:center;padding:10px 0}.ai-hello strong{font:700 20px var(--font-heading)}.ai-hello p{color:var(--muted);margin:8px 0 18px;line-height:1.6}.ai-hello .ai-examples{justify-content:center;margin:0}.ai-hello .ai-examples .button{font-size:12px;padding:9px 13px}
.ai-chat #ai-form{display:flex;gap:8px;align-items:flex-end;margin:0;padding:10px 16px 0;border-top:1px solid var(--border)}.ai-chat #ai-form textarea{flex:1;min-height:46px;max-height:140px;resize:none;border-radius:14px;padding:11px 14px;line-height:1.4}.ai-chat #ai-form .button{min-height:46px;border-radius:14px}.ai-chat .ai-error{margin:0;padding:0 22px}.ai-chat .ai-error:not(:empty){padding-bottom:8px}.ai-chat .ai-source{margin:8px 16px 12px;line-height:1.6}.ai-source .text-button{font-size:inherit;display:inline;padding:0}
.ai-intro{max-width:620px}.ai-intro h2{margin-top:0}.ai-points{padding-left:18px;margin:16px 0 22px;line-height:1.7;font-size:13px;color:var(--muted)}.ai-points li{margin:6px 0}
@media(max-width:780px){.ai-chat{height:calc(100dvh - 235px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));border-radius:12px}.ai-log{padding:16px 14px 6px}.ai-msg{max-width:92%;font-size:15px}.ai-actions .button{flex:1}}
.ai-chat .ai-source .text-button{min-height:0;min-width:0;line-height:inherit;margin:0;vertical-align:baseline}.ai-intro .form-hint{margin-top:14px}
.ai-chat #ai-form textarea{scrollbar-width:none}
/* Asistente en el móvil: la conversación ocupa la pantalla; el título ya está en la barra inferior */
@media(max-width:780px){#main:has(.ai-chat)>.heading{display:none}.ai-chat{height:calc(100dvh - 148px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))}.ai-chat .ai-source{font-size:11px;line-height:1.5;margin:6px 14px 10px}.ai-chat #ai-form{padding:8px 12px 0}.ai-proposal{padding:12px 14px}.ai-actions .button{min-height:44px}}
.ai-msg a{color:inherit;text-decoration:underline;overflow-wrap:anywhere}
/* Acceso directo al asistente (solo con barra lateral; en el móvil está la pestaña) */
.ai-fab{position:fixed;right:24px;bottom:24px;z-index:30;display:none;align-items:center;gap:9px;padding:12px 18px 12px 14px;border:0;border-radius:999px;background:var(--accent);color:var(--on-accent,#fff);font:600 14px var(--font-body);cursor:pointer;box-shadow:0 8px 24px rgba(41,37,59,.22)}
.ai-fab svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}.ai-fab:hover{filter:brightness(1.06)}.ai-fab:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
@media(min-width:781px){.ai-fab:not([hidden]){display:inline-flex}}
dialog[open]~.ai-fab{display:none}
.ai-chat .ai-source a{color:inherit}
/* Dudas y sugerencias */
.fb-dialog{width:min(520px,calc(100% - 24px));max-height:calc(100dvh - 40px);padding:24px;border-radius:20px;border:1px solid var(--border);background:var(--surface,#fff);color:var(--ink);overflow:auto;text-align:left}.fb-dialog::backdrop{background:#0007}
.fb-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.fb-head h2{font:600 22px var(--font-heading);margin:0}.fb-intro{color:var(--muted);line-height:1.6;margin:10px 0 18px}
.fb-kinds{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}.fb-kinds label{margin:0;cursor:pointer}.fb-kinds input{position:absolute;opacity:0;pointer-events:none}.fb-kinds span{display:inline-block;padding:10px 14px;border-radius:999px;border:1px solid var(--border);font-size:14px;font-weight:600}.fb-kinds input:checked+span{background:var(--soft);border-color:var(--accent);color:var(--ink)}.fb-kinds input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.fb-text{display:block;font-size:15px}.fb-text textarea{display:block;width:100%;margin-top:6px;font:inherit;font-size:16px;line-height:1.5;padding:12px 14px;border-radius:12px;border:1px solid var(--border);background:var(--bg);color:var(--ink);resize:vertical;min-height:120px}
.fb-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:14px}.fb-dialog .ai-error{margin:8px 0 0;min-height:1.2em}
.side-feedback{display:flex;gap:14px;align-items:center;width:100%;margin-top:10px;padding:13px 14px;border:0;border-top:1px solid var(--border);border-radius:0;background:transparent;color:var(--muted);font:500 13px var(--font-body);text-align:left;white-space:nowrap;cursor:pointer}.side-feedback:hover{color:var(--ink)}.side-feedback svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round;display:block}.side-feedback:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media(max-width:780px){.side-feedback{display:none}}
/* Entrada: crear cuenta y entrar tienen el mismo peso visual */
.auth-card #auth-switch{display:block;width:100%;margin:12px 0 0;padding:13px 12px;border:1px solid var(--border);border-radius:10px;background:transparent;color:var(--ink);font:600 14px var(--font-body);text-align:center;cursor:pointer}.auth-card #auth-switch:hover{border-color:var(--accent)}
.auth-card #auth-sub{margin:6px 0 20px;font-size:14px;line-height:1.5}
/* Bienvenida: tramo de clase por la tarde */
.welcome-pm{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:end}.welcome-pm .text-button{grid-column:1/-1;justify-self:start}.welcome-pm-add{grid-column:1/-1;justify-self:start;padding-left:0}
/* Editor de exámenes: asignatura como opciones, no como desplegable */
.subject-picker{border:0;padding:0;margin:0 0 18px;min-width:0}.subject-picker legend{font-weight:600;margin-bottom:10px;padding:0}.subject-options{margin:0}.subject-other-field{display:block;margin-top:12px}
.subject-options{display:flex;flex-wrap:wrap;gap:8px}.subject-options .part-choice{min-height:0;padding:10px 15px;border-radius:999px;font-size:15px;position:relative}.subject-options .part-choice input{position:absolute;opacity:0;pointer-events:none}.subject-options .part-choice:has(input:checked){border-color:var(--accent);background:var(--accent);color:var(--on-accent,#fff)}.subject-options .part-choice:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}.subject-options .subject-other{border-style:dashed}
/* Rueda de Mi día: solo la cifra dentro; debajo, a qué se refiere */
.wheel-figure{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:0}.wheel-caption{margin:0;color:var(--muted);font-size:13px;font-weight:500;text-align:center;white-space:nowrap}.wheel-center strong{line-height:1;white-space:nowrap}
/* Bienvenida: asignaturas por grupos */
.welcome-group{border-top:1px solid var(--border);padding:12px 0 4px}.welcome-group:first-of-type{border-top:0;padding-top:0}.welcome-group summary{cursor:pointer;font:600 15px var(--font-heading);padding:4px 0 10px;list-style-position:inside}.welcome-group .welcome-chips{margin-bottom:8px}
.welcome-weekend{margin-top:18px}
.exam-quick{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;margin:10px 0}.exam-quick .text-button{padding:0}
/* Seguimiento: empezar o añadir una sesión eligiendo cuál */
.study-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.session-picker h3{font:600 15px var(--font-heading);margin:18px 0 8px}.session-picker details{margin:16px 0 6px}.session-picker summary{cursor:pointer;font:600 15px var(--font-heading);padding:6px 0 10px}.session-picker>.text-button{margin-top:14px;padding:8px 0;min-height:44px}
.session-option{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;min-height:56px;margin:0 0 8px;padding:12px 14px;text-align:left;background:var(--surface);color:var(--ink);border:1px solid var(--border);border-radius:12px}.session-option:hover,.session-option:focus-visible{border-color:var(--accent);background:var(--soft)}.session-option>span:first-child{min-width:0}.session-option strong{display:block;font-size:15px}.session-option small{display:block;font-size:14px;color:var(--muted);overflow-wrap:anywhere}.session-option-time{flex:0 0 auto;font-size:14px;color:var(--muted);white-space:nowrap;text-align:right}
.session-picker-empty{color:var(--muted)}
.pending-dialog select{min-height:48px;font-size:16px;width:100%}
/* Mi día: añadir una tarea al plan y ánimo en examen y víspera */
.balance-home .agenda-section-heading h2{margin-right:auto}.balance-home .agenda-section-heading .text-button{white-space:nowrap}
.exam-cheer{display:flex;align-items:center;justify-content:space-between;gap:14px}.exam-cheer strong{font-size:15px}.exam-cheer p{margin:4px 0 0;font-size:14px;line-height:1.6}.exam-cheer button{flex:0 0 auto;white-space:nowrap}
/* Calendario: en ordenador la marca dice «Examen»; en móvil no cabe y queda la inicial */
.exam-flag-long{display:none}
@media(min-width:781px){.calendar .cal-day .calendar-exam-flag{width:auto;padding:0 6px;letter-spacing:.2px}.exam-flag-long{display:inline}.exam-flag-short{display:none}.legend .exam-key{display:none!important}}
@media(max-width:780px){.study-actions{justify-content:stretch;width:100%}.study-actions .button{flex:1;min-height:44px}.study-page .heading{flex-direction:column}.exam-cheer{flex-direction:column;align-items:flex-start}.session-option{flex-direction:column;align-items:flex-start;gap:4px}}
/* Modo soporte: un administrador dentro de la cuenta de un estudiante */
#support-banner{position:sticky;top:0;z-index:60;display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;padding:calc(8px + env(safe-area-inset-top)) 16px 8px;background:#8a3b12;color:#fff;font-size:14px;line-height:1.4;text-align:center}#support-banner button{background:#fff;color:#8a3b12;border:0;border-radius:8px;padding:6px 14px;font-weight:600;min-height:32px}
/* Mi día: propuesta de adelantar el estudio, como tarjeta discreta */
.early-card{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 20px;padding:14px 16px;border:1px solid var(--border);border-radius:14px;background:color-mix(in srgb,var(--accent) 7%,var(--surface));color:var(--ink)}.early-card strong{display:block;font:600 15px/1.4 var(--font-heading)}.early-card p{margin:3px 0 0;font-size:14px;line-height:1.5;color:var(--muted)}.early-card-button{flex:0 0 auto;min-height:44px;padding:0 16px;border:0;border-radius:12px;background:var(--accent);color:var(--on-accent,#fff);font-weight:600;white-space:nowrap}
@media(max-width:560px){.early-card{flex-direction:column;align-items:stretch}.early-card-button{width:100%}}
/* Editor de examen: cada tema es una tarjeta completa (el título va dentro) y añadir otro se ve bien */
.parts-form fieldset.topic-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0;padding:14px;border:1px solid var(--border);border-radius:14px;background:color-mix(in srgb,var(--accent) 5%,var(--surface))}.parts-form .topic-row legend{float:left;width:100%;grid-column:1/-1;padding:0;margin:0 0 2px;font:600 14px var(--font-heading);color:var(--ink)}
@media(max-width:480px){.parts-form fieldset.topic-row{grid-template-columns:1fr}}
.parts-form button[data-topic-add]{display:flex;align-items:center;justify-content:center;width:100%;min-height:48px;margin:4px 0 12px;border:1.5px dashed var(--accent);border-radius:14px;background:var(--soft);color:var(--accent);font-weight:600;font-size:15px;text-decoration:none}
/* Mi día: pasar un examen del formato por partes al de temas */
.topics-card{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 20px;padding:16px;border:1px solid color-mix(in srgb,var(--accent) 35%,var(--border));border-radius:14px;background:color-mix(in srgb,var(--accent) 9%,var(--surface));color:var(--ink)}.topics-card strong{display:block;font:600 15px/1.4 var(--font-heading)}.topics-card p{margin:4px 0 0;font-size:14px;line-height:1.5;color:var(--muted)}.topics-card-actions{display:flex;flex-direction:column;align-items:stretch;gap:4px;flex:0 0 auto}.topics-card-actions .text-button{min-height:40px}
@media(max-width:560px){.topics-card{flex-direction:column;align-items:stretch}}
.convert-note{margin-bottom:14px}
/* Editor de temas: afinar el tiempo con carillas, lo que ya llevas o tu propio tiempo */
.parts-form .topic-fine{grid-column:1/-1;margin:2px 0 0}.parts-form .topic-fine summary{cursor:pointer;color:var(--accent);font-size:14px;font-weight:600;padding:4px 0;min-height:32px}.topic-fine-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}.topic-fine-grid label:last-child{grid-column:1/-1}.topic-fine-grid input,.topic-fine-grid select{width:100%}
@media(max-width:480px){.topic-fine-grid{grid-template-columns:1fr}}
/* Mi día: cierre del día con un toque */
.close-day{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:0 0 20px;padding:14px 16px;border:1px solid color-mix(in srgb,var(--accent) 35%,var(--border));border-radius:14px;background:color-mix(in srgb,var(--accent) 9%,var(--surface))}.close-day strong{font:600 16px/1.4 var(--font-heading)}.close-day-actions{display:flex;gap:8px;align-items:center}.close-day-actions .button,.close-day-actions .early-card-button{min-height:44px}
@media(max-width:560px){.close-day{flex-direction:column;align-items:stretch}.close-day-actions{display:grid;grid-template-columns:1fr 1fr auto}}
/* Menos texto en móvil: datos del examen uno debajo de otro y avisos plegados */
.exam-fit details{margin:4px 0}.exam-fit summary{cursor:pointer;font-weight:600}.exam-fit p{margin:4px 0}
@media(max-width:560px){.exam-card .card-meta{flex-direction:column;align-items:flex-start;gap:4px}.day-load{font-size:15px}}
.parts-form .topic-fine summary{font-size:15px}.pending-dialog .day-popup-head+label{margin-top:12px}
/* Arranque: pantalla de carga con la sesión abierta y portada con «Empezar» para quien llega por primera vez */
#app-loading,#start{position:fixed;inset:0;z-index:130;display:grid;place-items:center;align-content:center;gap:22px;background:var(--bg);padding:calc(24px + env(safe-area-inset-top,0px)) 24px calc(24px + env(safe-area-inset-bottom,0px))}
#start[hidden]{display:none}#app-loading .brand,#start .brand{font-size:34px}
.loading-dots{display:flex;gap:8px}.loading-dots i{width:9px;height:9px;border-radius:50%;background:var(--accent);opacity:.35;animation:maenia-dot 1s ease-in-out infinite}.loading-dots i:nth-child(2){animation-delay:.15s}.loading-dots i:nth-child(3){animation-delay:.3s}
@keyframes maenia-dot{50%{opacity:1;transform:translateY(-4px)}}
@media(prefers-reduced-motion:reduce){.loading-dots i{animation:none;opacity:.7}}
.start-card{width:min(420px,100%);display:grid;gap:14px;text-align:center}.start-card h1{font:600 30px/1.2 var(--font-heading);margin:18px 0 0}.start-card p{margin:0 0 10px;color:var(--muted);font-size:17px;line-height:1.5}.start-card .button{min-height:52px;font-size:17px}.start-card .text-button{min-height:44px;font-size:16px}
#start .brand,#app-loading .brand{display:flex;justify-content:center;align-items:center;gap:8px}
/* «¿Qué hemos mejorado?» */
.novedades-dialog h2{font:600 22px/1.3 var(--font-heading);margin:0 0 14px}.novedades-dialog ul{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:14px}.novedades-dialog li{display:grid;gap:2px}.novedades-dialog li strong{font-size:16px}.novedades-dialog li span{font-size:15px;line-height:1.45;color:var(--muted)}
/* Mi día: atajo para meter una sesión de estudio en el tiempo libre */
.add-study{display:block;width:100%;margin:12px 0 4px;padding:12px 14px;min-height:48px;border:1.5px dashed var(--accent);border-radius:14px;background:var(--soft);color:var(--accent);font-weight:600;font-size:15px;text-align:left}
/* Editor de temas compacto: número y nombre, y tamaño y nivel con un toque */
.parts-form fieldset.topic-row{grid-template-columns:1fr;gap:8px;padding:10px 12px}
.topic-help{margin:4px 0 0}
.topic-name{display:flex;align-items:center;gap:8px}.topic-name input{flex:1;min-width:0}
.topic-num{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--soft);color:var(--accent);font-weight:700;font-size:14px}
.topic-remove{flex:none;width:40px;height:40px;border:1px solid var(--border);border-radius:10px;background:transparent;color:var(--muted);font-size:15px;cursor:pointer}
.topic-chips{display:flex;gap:6px}.topic-row .topic-chips label{flex:1;position:relative;margin:0;color:var(--ink);font-size:14px}
.topic-chips input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.topic-chips span{display:block;text-align:center;padding:8px 4px;border:1px solid var(--border);border-radius:10px;background:var(--bg);white-space:nowrap}
.topic-chips input:checked+span{background:var(--accent);border-color:var(--accent);color:var(--on-accent);font-weight:600}
.topic-chips input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.parts-form .topic-fine{margin:0}
details.topic-tell{margin:4px 0 14px;padding:0;border:0;background:none}details.topic-tell summary{cursor:pointer;color:var(--accent);font-weight:600;font-size:15px;padding:6px 0}
details.topic-tell[open]{padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--soft)}details.topic-tell textarea{margin:8px 0}
/* Ficha de tema: el tiempo, lo primero y bien visible; debajo, tamaño, cómo lo llevas y carillas */
.parts-form fieldset.topic-row{gap:12px;padding:14px}
.topic-time{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 12px;padding:12px 14px;border-radius:12px;background:color-mix(in srgb,var(--accent) 14%,transparent);border:1px solid color-mix(in srgb,var(--accent) 35%,transparent)}
.topic-time-text{display:grid;gap:2px}.topic-time-text strong{font-size:15px}.topic-time-text span{font-size:13px;color:var(--muted)}
.topic-time-control{display:flex;align-items:center;gap:6px}
.topic-time-control button{width:40px;height:40px;border-radius:50%;border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);background:var(--surface);color:var(--accent);font-size:22px;font-weight:600;line-height:1;cursor:pointer}
.topic-time-control output{min-width:76px;text-align:center;font:600 22px/1.1 var(--font-heading);color:var(--ink)}
.topic-time [data-time-auto]{grid-column:1/-1;justify-self:start;min-height:32px;font-size:14px}
.topic-row.own-time .topic-time-text span{color:var(--accent);font-weight:600}
.topic-field{display:grid;gap:6px}.topic-field>span{font-size:13px;color:var(--muted)}
.parts-form .topic-row .topic-fine-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.parts-form .topic-row .topic-fine-grid label{display:grid;gap:5px;font-size:13px;color:var(--muted)}
@media(max-width:380px){.topic-time{grid-template-columns:1fr}.topic-time-control{justify-content:center}}
/* Mis exámenes: tiempo de cada tema, se cambia tocándolo */
.topic-times{margin:12px 0 4px;padding:12px 14px;border:1px solid var(--border);border-radius:14px;background:var(--bg)}
.topic-times-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin:0 0 6px}.topic-times-head strong{font-size:15px}.topic-times-head span{font-size:13px;color:var(--muted)}
.topic-times ul{list-style:none;margin:0;padding:0;display:grid}
.topic-times li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 0;border-top:1px solid var(--border)}.topic-times li:first-child{border-top:0}
.topic-times li>span{min-width:0;overflow-wrap:anywhere;font-size:15px}
.time-pill{flex:none;min-width:72px;min-height:38px;padding:6px 12px;border-radius:99px;border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--ink);font:600 15px/1 var(--font-heading);cursor:pointer}
.time-pill::after{content:" ▾";font-size:11px;color:var(--accent)}.time-pill.own{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.time-pill.own::after{color:inherit}
.time-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:14px 0 12px}
.time-options button{min-height:46px;border-radius:12px;border:1px solid var(--border);background:var(--bg);color:var(--ink);font:600 15px var(--font-heading);cursor:pointer}
.time-options button.on,.topic-time-dialog .button.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.topic-time-dialog .button.wide{width:100%;margin-bottom:6px}.topic-time-dialog .text-button{display:block;margin:4px auto 0}
@media(max-width:380px){.time-options{grid-template-columns:repeat(3,minmax(0,1fr))}}
.parts-form .topic-row .topic-fine-grid label:last-child{grid-column:auto}.parts-form .topic-row .topic-fine-grid input{box-sizing:border-box;width:100%}
/* «¿Qué has hecho?»: hecha, a medias o no, y cuánto te dejaste */
.checkin-tasks article.checkin-task{display:grid;gap:10px;align-items:stretch}
.checkin-what h3{margin:4px 0}.checkin-what span{font-size:14px;color:var(--muted)}
.checkin-choice{display:flex;gap:6px}.checkin-choice label{flex:1;position:relative}
.checkin-choice input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.checkin-choice span{display:grid;place-items:center;gap:2px;min-height:44px;padding:6px 4px;text-align:center;border:1px solid var(--border);border-radius:12px;background:var(--bg);font-weight:600;font-size:15px}
.checkin-choice span small{font-weight:400;font-size:12px;color:var(--muted)}
.checkin-choice input:checked+span{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.checkin-choice input:checked+span small{color:inherit}
.checkin-choice input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.checkin-left{display:grid;gap:6px;padding:10px 12px;border-radius:12px;background:color-mix(in srgb,var(--accent) 10%,transparent)}.checkin-left p{margin:0;font-size:14px;font-weight:600}
.checkin-summary{min-height:1.4em;margin:12px 0 0;font-weight:600}
/* Apuntar lo que has estudiado: cuatro desplegables y guardar */
.quick-log form{display:grid;gap:12px}.quick-log label{display:grid;gap:6px;font-size:14px;font-weight:600;color:var(--muted)}
.quick-log select{width:100%;min-height:48px;font-size:16px;font-weight:500;color:var(--ink)}
.quick-log-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.quick-log label.quick-log-extra{display:flex;align-items:center;gap:8px;font-weight:500;color:var(--ink)}.quick-log-extra[hidden]{display:none}
.off-plan-button{width:100%;margin:12px 0 4px}
.quick-log .quick-log-extra input{flex:none;width:22px;height:22px;min-height:0;margin:0;padding:0;accent-color:var(--accent)}.quick-log label.quick-log-extra{font-size:15px;line-height:1.35}
.start-card h1{white-space:nowrap;font-size:min(30px,calc((100vw - 48px) / 16.4));letter-spacing:-.01em}
.usage-stats{display:flex;align-items:flex-start;gap:10px;margin-top:18px;font-size:14px;line-height:1.45;color:var(--muted)}.usage-stats input{flex:none;width:20px;height:20px;margin:1px 0 0;accent-color:var(--accent)}
/* Cambiar de tema: solo el icono, discreto, como el asistente y Ajustes de la cabecera. */
:root .theme-toggle,:root[data-theme] .theme-toggle{min-width:44px;min-height:44px;padding:0;border:0;border-radius:999px;background:transparent;color:var(--muted);font-size:21px;line-height:1}
:root .theme-toggle:hover,:root[data-theme] .theme-toggle:hover{background:var(--soft);color:var(--ink)}
/* En la app del iPhone, los iconos de la cabecera (asistente, Ajustes, tema) bajan como el logo,
   por debajo de la hora y la batería; si no, la franja de arriba los tapa. */
@media(max-width:780px){.nativa .shell>header{top:max(env(safe-area-inset-top,0px),14px);z-index:111}}
/* Cabecera: asistente, Ajustes y tema, los tres del mismo tamaño, con el mismo trazo y alineados. */
.shell>header .header-right{align-items:center}
.shell>header .icon-button,:root .theme-toggle,:root[data-theme] .theme-toggle{display:inline-grid;place-items:center;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;margin:0;border:0;border-radius:999px;line-height:0;vertical-align:middle}
.shell>header .icon-button svg,.theme-toggle svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.shell>header .mobile-settings,:root .theme-toggle{color:var(--muted)}
@media(max-width:780px){body .shell>header{height:66px}}
@media(min-width:781px){.shell>header .mobile-assistant{display:none}}
