/* SAIA-AI Hub — estilos de la app (Liquid Glass). Tokens §2 de docs/design/DIRECTRICES-LIQUID-GLASS.md copiados VERBATIM al inicio. */
/* ===== Tokens §2 (VERBATIM) ===== */
:root{
  /* acento base + semánticos */
  --accent:#0A84FF; --accent-ink:#fff;
  --ok:#30D158; --warn:#FF9F0A; --danger:#FF453A; --info:#64D2FF;
  /* texto */
  --ink:rgba(255,255,255,.92); --ink-2:rgba(255,255,255,.60); --ink-3:rgba(255,255,255,.38);
  /* vidrio (oscuro) */
  --glass:rgba(30,30,34,.55); --glass-2:rgba(44,44,48,.55);
  --stroke:rgba(255,255,255,.16); --hair:rgba(255,255,255,.08);
  --blur:20px; --blur-thin:8px; --blur-thick:40px;
  /* fondo vivo (mesh pastel sobre base oscura) */
  --bg:#0b0b0f;
  --mesh:radial-gradient(60% 50% at 15% 10%,rgba(94,132,255,.28),transparent 60%),
         radial-gradient(50% 45% at 85% 15%,rgba(191,90,242,.22),transparent 60%),
         radial-gradient(55% 50% at 70% 90%,rgba(100,210,255,.18),transparent 60%);
  /* sombras multicapa */
  --shadow:0 1px 2px rgba(0,0,0,.25),0 8px 24px rgba(0,0,0,.35);
  --shadow-lg:0 2px 6px rgba(0,0,0,.30),0 20px 50px rgba(0,0,0,.45);
  /* radios y espaciado */
  --r-card:22px; --r-btn:13px; --r-chip:999px; --r-sheet:28px;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px; --s8:32px;
  /* tipografía (escala iOS) */
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter",system-ui,sans-serif;
  --t-caption:11px; --t-footnote:13px; --t-body:15px; --t-headline:17px;
  --t-title3:20px; --t-title2:24px; --t-title1:28px; --t-large:34px;
}
:root[data-theme="light"]{
  --ink:rgba(0,0,0,.88); --ink-2:rgba(0,0,0,.55); --ink-3:rgba(0,0,0,.35);
  --glass:rgba(255,255,255,.62); --glass-2:rgba(255,255,255,.75);
  --stroke:rgba(255,255,255,.7); --hair:rgba(0,0,0,.06);
  --accent:#007AFF; --bg:#eef1f6;
  --mesh:radial-gradient(60% 50% at 15% 10%,rgba(94,132,255,.22),transparent 60%),
         radial-gradient(50% 45% at 85% 15%,rgba(191,90,242,.16),transparent 60%),
         radial-gradient(55% 50% at 70% 90%,rgba(100,210,255,.16),transparent 60%);
  --shadow:0 1px 2px rgba(0,0,0,.06),0 8px 24px rgba(0,0,0,.10);
  --shadow-lg:0 2px 6px rgba(0,0,0,.08),0 20px 50px rgba(0,0,0,.14);
}
body{background:var(--bg);background-image:var(--mesh);background-attachment:fixed;color:var(--ink);font-family:var(--font);}
.glass{background:var(--glass);backdrop-filter:blur(var(--blur)) saturate(180%);-webkit-backdrop-filter:blur(var(--blur)) saturate(180%);border:1px solid var(--stroke);box-shadow:var(--shadow);border-radius:var(--r-card);}

/* ===== Ajustes de visibilidad (NO tocan el bloque verbatim) =====
   En claro el vidrio blanco sobre #eef1f6 se perdía: se añade un aro tintado,
   sombras con matiz azul, texto terciario más oscuro y tintas de estado AA. */
:root{
  --ring:rgba(255,255,255,0); --spec:rgba(255,255,255,.22);
  --ok-t:#30D158; --warn-t:#FF9F0A; --danger-t:#FF6A60; --info-t:#64D2FF;
  --chip-bg:rgba(255,255,255,.08);
  --t-eval:#FF6A60; --t-ent:#FFB84D; --t-live:#64D2FF; --t-otro:#9aa8ff;
  --t-eval-ink:#FF8A82; --t-ent-ink:#FFB84D; --t-live-ink:#8BE0FF; --t-otro-ink:#b8c2ff;
  --code-bg:rgba(8,8,12,.62); --code-ink:#e6e8ef;
  --c-k:#ff7ab2; --c-t:#78c2ff; --c-s:#fc6a5d; --c-n:#d9c97c; --c-c:#8a97a4; --c-f:#67e0b8;
  --bubble-user:linear-gradient(180deg,#2b95ff,#0A84FF);
  --scrim:rgba(0,0,0,.45);
  --ease:cubic-bezier(0.32,0.72,0,1); --tabh:64px;
}
:root[data-theme="light"]{
  --ring:rgba(28,40,90,.11); --spec:rgba(255,255,255,.95);
  --ink-3:rgba(0,0,0,.46);
  --glass:rgba(255,255,255,.74); --glass-2:rgba(255,255,255,.92);
  --hair:rgba(20,30,70,.08);
  --shadow:0 1px 2px rgba(20,30,70,.08),0 8px 24px rgba(20,30,70,.12);
  --shadow-lg:0 2px 6px rgba(20,30,70,.10),0 20px 50px rgba(20,30,70,.18);
  --ok-t:#1a7f37; --warn-t:#9a5b00; --danger-t:#c4261d; --info-t:#006a8f;
  --chip-bg:rgba(20,30,70,.06);
  --t-eval:#E5382C; --t-ent:#D98200; --t-live:#0A84C6; --t-otro:#5b6cff;
  --t-eval-ink:#C4281C; --t-ent-ink:#8F5300; --t-live-ink:#0A6D9E; --t-otro-ink:#3a49d6;
  --code-bg:rgba(255,255,255,.85); --code-ink:#1d1d24;
  --c-k:#b3236b; --c-t:#0b5cad; --c-s:#c0392b; --c-n:#8a6d00; --c-c:#6b7785; --c-f:#0a7a5c;
  --scrim:rgba(20,24,40,.28);
}
.glass{box-shadow:var(--shadow),0 0 0 1px var(--ring),inset 0 1px 0 var(--spec)}

/* ===== Base / nativo móvil ===== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;overscroll-behavior:none;color-scheme:dark}
html[data-theme=light]{color-scheme:light}
body{margin:0;min-height:100dvh;font-size:var(--t-body);line-height:1.45;-webkit-font-smoothing:antialiased;font-feature-settings:"cv11","ss01";transition:background-color .35s var(--ease)}
body.lock{overflow:hidden}
h1,h2,h3,h4,p,ul,ol{margin:0;padding:0}
ul,ol{list-style:none}
button,a,[role=button],.tab{touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
a{color:inherit;text-decoration:none}
input,textarea,select{font:inherit;font-size:16px;color:var(--ink)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:10px}
.i{width:20px;height:20px;stroke-width:1.9;flex:none}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
[hidden]{display:none!important}
.glass{position:relative}
.glass::before{content:"";position:absolute;inset:0 0 auto 0;height:1px;border-radius:inherit;background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent);pointer-events:none;opacity:.8}
:root[data-theme=light] .glass::before{background:linear-gradient(90deg,transparent,rgba(255,255,255,1),transparent)}

/* ===== Layout ===== */
.app{display:block;min-height:100dvh}
.side{display:none}
.main{min-width:0;padding:0 var(--s4) calc(var(--tabh) + 100px + env(safe-area-inset-bottom,0px));max-width:1120px;margin:0 auto}

/* ===== Barra superior ===== */
.top{position:sticky;top:0;z-index:20;margin:0 calc(var(--s4) * -1);padding:calc(env(safe-area-inset-top,0px) + var(--s2)) var(--s4) var(--s3);background:linear-gradient(var(--bg),transparent)}
.top-bar{display:flex;align-items:center;gap:var(--s1);min-height:52px;padding:4px 6px 4px var(--s2);border-radius:calc(var(--r-card) + 2px)}
.mini-title{font-size:var(--t-headline);font-weight:600;letter-spacing:-.01em;margin-left:var(--s2);white-space:nowrap;display:none}
.top.scrolled .mini-title{display:block}
.top.scrolled .search{display:none}
.search{flex:1;min-width:0;display:flex;align-items:center;gap:var(--s2);height:40px;padding:0 var(--s3);margin-left:var(--s2);border-radius:var(--r-btn);background:var(--hair);border:1px solid transparent;color:var(--ink-2);transition:border-color .2s,background .2s}
.search:focus-within{border-color:var(--accent);background:var(--glass-2)}
.search input{flex:1;min-width:0;background:none;border:0;outline:0;height:100%}
.search input::placeholder{color:var(--ink-3)}
.kbd{font-size:var(--t-caption);font-weight:600;color:var(--ink-3);border:1px solid var(--hair);border-radius:6px;padding:1px 6px;display:none}
.top-grow{flex:1}
.icon-btn{width:44px;height:44px;border-radius:var(--r-btn);display:grid;place-items:center;color:var(--ink);flex:none;transition:background .15s,transform .1s}
.icon-btn:active{transform:scale(.94);background:var(--hair)}
.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:600;font-size:12px;color:#fff;background:linear-gradient(135deg,#5e84ff,#bf5af2);box-shadow:inset 0 1px 0 rgba(255,255,255,.4);flex:none}
.theme .moon{display:none}
:root[data-theme=light] .theme .sun{display:none}
:root[data-theme=light] .theme .moon{display:block}
.status{display:inline-flex;align-items:center;gap:7px;height:44px;padding:0 var(--s2);border-radius:var(--r-btn);font-size:var(--t-footnote);font-weight:600;color:var(--ink-2)}
.status .sd{width:9px;height:9px;border-radius:50%;background:var(--ink-3);flex:none}
.status.ok .sd{background:var(--ok);box-shadow:0 0 0 3px color-mix(in srgb,var(--ok) 25%,transparent)}
.status.demo .sd{background:var(--warn);box-shadow:0 0 0 3px color-mix(in srgb,var(--warn) 25%,transparent)}
.status.chk .sd{animation:blink 1.2s infinite}
@keyframes blink{50%{opacity:.3}}
.status span{display:none}

/* ===== Título grande ===== */
.hero{padding:var(--s4) var(--s1) var(--s5)}
.hero h1{font-size:var(--t-large);line-height:1.1;font-weight:700;letter-spacing:-.025em}
.hero p{margin-top:var(--s1);color:var(--ink-2);font-size:var(--t-body)}
.summary{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s4)}
.pill-s{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 var(--s3);border-radius:var(--r-chip);font-size:var(--t-footnote);font-weight:500;background:var(--glass);border:1px solid var(--stroke);box-shadow:0 0 0 1px var(--ring);backdrop-filter:blur(var(--blur-thin));-webkit-backdrop-filter:blur(var(--blur-thin));white-space:nowrap}
.pill-s .i{width:15px;height:15px}
.pill-s.warn{color:var(--warn-t)} .pill-s.ok{color:var(--ok-t)} .pill-s.bad{color:var(--danger-t)}
button.pill-s{min-height:30px}

.sec-h{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);margin:var(--s6) var(--s1) var(--s3);flex-wrap:wrap}
.sec-h h2{font-size:var(--t-title3);font-weight:650;letter-spacing:-.018em}
.link{display:inline-flex;align-items:center;gap:2px;color:var(--accent);font-size:var(--t-footnote);font-weight:600;min-height:44px;padding:0 var(--s1)}
.link .i{width:16px;height:16px}

/* segmented iOS */
.seg{display:inline-flex;padding:3px;border-radius:var(--r-btn);background:var(--hair);position:relative;max-width:100%;overflow-x:auto;scrollbar-width:none}
.seg::-webkit-scrollbar{display:none}
.seg button{position:relative;min-height:36px;padding:0 var(--s3);border-radius:10px;font-size:var(--t-footnote);font-weight:600;color:var(--ink-2);white-space:nowrap;transition:color .2s,background .25s var(--ease)}
.seg button[aria-pressed=true]{color:var(--ink);background:var(--glass-2);box-shadow:var(--shadow),inset 0 1px 0 var(--spec)}
.seg.wide{display:flex;width:100%}
.seg.wide button{flex:1}

/* chips de estado */
.chip{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 10px;border-radius:var(--r-chip);font-size:12px;font-weight:600;white-space:nowrap;min-width:max-content;background:color-mix(in srgb,var(--k) 18%,transparent);color:var(--k);border:1px solid color-mix(in srgb,var(--k) 32%,transparent)}
.chip .i{width:13px;height:13px;stroke-width:2.2}
.chip.pend{--k:var(--info-t)} .chip.ent{--k:var(--ok-t)} .chip.venc{--k:var(--danger-t)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--c);box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 22%,transparent);flex:none}

/* ===== Próximos vencimientos ===== */
.due{display:flex;gap:var(--s3);overflow-x:auto;scroll-snap-type:x mandatory;margin:0 calc(var(--s4) * -1);padding:var(--s1) var(--s4) var(--s4);scrollbar-width:none;overscroll-behavior-x:contain;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 28px),transparent)}
.due::-webkit-scrollbar{display:none}
.task{--c:var(--accent);flex:none;width:264px;scroll-snap-align:start;padding:var(--s4);display:flex;flex-direction:column;gap:var(--s2);overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.task::after{content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:0 3px 3px 0;background:var(--c)}
.task:active{transform:scale(.975)}
.task .co{display:flex;align-items:center;gap:6px;font-size:var(--t-caption);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2)}
.task h3{font-size:var(--t-headline);line-height:1.25;font-weight:600;letter-spacing:-.012em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.5em}
.task .meta{display:flex;align-items:center;justify-content:space-between;gap:var(--s2);margin-top:var(--s1)}
.when-t{white-space:nowrap;display:inline-flex;align-items:center;gap:6px;font-size:var(--t-footnote);color:var(--ink-2);font-variant-numeric:tabular-nums}
.when-t .i{width:15px;height:15px}
.when-t.hot{color:var(--warn-t);font-weight:600}
.when-t.late{color:var(--danger-t);font-weight:600}

/* ===== Rejilla de materias ===== */
.grid{display:grid;grid-template-columns:1fr;gap:var(--s4)}
.card{--c:var(--accent);--ci:#0b0b0f;display:flex;flex-direction:column;gap:var(--s4);padding:var(--s5);overflow:hidden;min-height:196px;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s}
.card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(120% 90% at 100% 0%,color-mix(in srgb,var(--c) 30%,transparent),transparent 62%)}
:root[data-theme=light] .card::after{background:radial-gradient(120% 90% at 100% 0%,color-mix(in srgb,var(--c) 24%,transparent),transparent 62%)}
.card>*{position:relative;z-index:1}
.card:active{transform:scale(.978)}
.card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s3)}
.card h3{font-size:var(--t-title3);line-height:1.15;font-weight:650;letter-spacing:-.02em}
.sub{margin-top:var(--s1);font-size:var(--t-footnote);color:var(--ink-2)}
.prg{--p:0;position:relative;width:64px;height:64px;flex:none;display:grid;place-items:center}
.prg>svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.prg .trk{fill:none;stroke:color-mix(in srgb,var(--c) 22%,transparent);stroke-width:5}
.prg .bar{fill:none;stroke:var(--c);stroke-width:5;stroke-linecap:round}
.prg b{font-size:var(--t-footnote);font-weight:700;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.prg b small{font-size:9px;font-weight:600;color:var(--ink-2)}
.next{display:flex;align-items:center;gap:var(--s2);font-size:var(--t-footnote);color:var(--ink-2)}
.next .i{width:15px;height:15px;color:var(--c)}
.next strong{color:var(--ink);font-weight:600}
.next.bad .i{color:var(--danger-t)}
.card-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:var(--s3);padding-top:var(--s3);border-top:1px solid var(--hair)}
.prof{display:flex;align-items:center;gap:var(--s2);min-width:0}
.prof .av{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700;color:var(--ci);background:var(--c);box-shadow:inset 0 1px 0 rgba(255,255,255,.35);flex:none}
.prof span.n{font-size:var(--t-footnote);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.badge{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 10px;border-radius:var(--r-chip);font-size:12px;font-weight:700;white-space:nowrap;min-width:max-content;background:var(--c);color:var(--ci);font-variant-numeric:tabular-nums;box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 2px 10px color-mix(in srgb,var(--c) 40%,transparent)}
.badge .i{width:13px;height:13px;stroke-width:2.4}
.badge.zero{background:color-mix(in srgb,var(--ok) 20%,transparent);color:var(--ok-t);box-shadow:none;border:1px solid color-mix(in srgb,var(--ok) 34%,transparent)}
.empty{text-align:center;padding:var(--s8) var(--s4);color:var(--ink-2);display:grid;gap:6px;justify-items:center;font-size:var(--t-footnote)}
.empty .i{width:30px;height:30px;color:var(--ink-3)}
.empty strong{color:var(--ink);font-size:var(--t-headline)}

/* ===== Filas (tareas / eventos) ===== */
.panel{padding:var(--s4);border-radius:var(--r-card);margin-top:var(--s4)}
.panel h3{font-size:var(--t-headline);font-weight:600;letter-spacing:-.01em}
.panel-sub{font-size:var(--t-footnote);color:var(--ink-2);margin:2px 0 var(--s3)}
.list{display:grid;gap:var(--s2)}
.row{--c:var(--accent);display:grid;grid-template-columns:auto 1fr;gap:6px 14px;align-items:start;padding:12px 14px 12px 12px;border-radius:18px;background:var(--glass-2);border:1px solid var(--hair);box-shadow:0 0 0 1px var(--ring),inset 0 1px 0 var(--spec);position:relative;overflow:hidden}
.row::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:var(--c)}
.row.past{opacity:.62}
.row.live{background:linear-gradient(135deg,color-mix(in srgb,var(--info) 16%,transparent),transparent 70%),var(--glass-2);border-color:color-mix(in srgb,var(--info) 40%,transparent)}
.when{width:56px;text-align:center;padding-left:4px}
.when b{display:block;font-size:var(--t-headline);font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.01em;line-height:1.2}
.when small{display:block;font-size:11px;color:var(--ink-2);margin-top:1px}
.r-body{min-width:0;display:grid;gap:5px}
.r-top{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.r-title{font-weight:600;font-size:var(--t-body);line-height:1.3;overflow-wrap:anywhere}
.r-meta{font-size:var(--t-footnote);color:var(--ink-2);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.r-side{grid-column:2;display:flex;align-items:center;gap:var(--s2);flex-wrap:wrap;margin-top:2px}
.rel{font-size:var(--t-footnote);font-weight:600;color:var(--ink-2);font-variant-numeric:tabular-nums;margin-right:auto}
.rel.urgent{color:var(--t-eval-ink)}
.tl-group{display:grid;gap:var(--s2);margin-bottom:var(--s5)}
.tl-head{display:flex;align-items:baseline;gap:10px;padding:0 4px}
.tl-head h3{font-size:var(--t-headline);font-weight:600;letter-spacing:-.01em;display:inline-flex;align-items:center;gap:8px}
.tl-head small{color:var(--ink-2);font-size:var(--t-footnote)}
.tl-head .line{flex:1;height:1px;background:var(--hair);align-self:center}
.tl-head .hoy{background:var(--accent);color:var(--accent-ink);font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;border-radius:99px;padding:2px 9px}
.tl-head .cnt{font-size:12px;font-weight:700;color:var(--ink-2);background:var(--hair);border-radius:99px;padding:1px 9px}

/* botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:0 16px;border-radius:var(--r-btn);font-size:var(--t-footnote);font-weight:600;background:var(--chip-bg);border:1px solid var(--hair);box-shadow:inset 0 1px 0 var(--spec);transition:transform .12s var(--ease),background .2s,filter .2s}
.btn:active{transform:scale(.97)}
.btn.pri{background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 88%,#fff),var(--accent));color:var(--accent-ink);border-color:rgba(255,255,255,.25);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 6px 18px color-mix(in srgb,var(--accent) 40%,transparent)}
.btn.sm{min-height:36px;padding:0 12px;border-radius:11px;font-size:12px}
.btn .i{width:16px;height:16px}
.btn[disabled]{opacity:.45;pointer-events:none}
.btn.ask{color:var(--accent)}
.tchip{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 9px 0 7px;border-radius:99px;font-size:11px;font-weight:600;letter-spacing:.02em;color:var(--ti);background:color-mix(in srgb,var(--tc) 16%,transparent);border:1px solid color-mix(in srgb,var(--tc) 36%,transparent);white-space:nowrap}
.tchip .i{width:12px;height:12px}
.t-eval{--tc:var(--t-eval);--ti:var(--t-eval-ink)} .t-ent{--tc:var(--t-ent);--ti:var(--t-ent-ink)} .t-live{--tc:var(--t-live);--ti:var(--t-live-ink)} .t-otro{--tc:var(--t-otro);--ti:var(--t-otro-ink)}

/* ===== Stream de materia ===== */
.back{display:inline-flex;align-items:center;gap:2px;min-height:44px;padding:0 10px 0 4px;color:var(--accent);font-weight:500;border-radius:var(--r-btn)}
.back .i{width:22px;height:22px}
.mhero{--c:var(--accent);position:relative;overflow:hidden;border-radius:26px;padding:var(--s5);margin-top:var(--s2);
  background:radial-gradient(120% 140% at 100% 0%,color-mix(in srgb,var(--c) 50%,transparent),transparent 60%),radial-gradient(90% 120% at 0% 100%,color-mix(in srgb,var(--c) 24%,transparent),transparent 65%),var(--glass);
  backdrop-filter:blur(var(--blur)) saturate(180%);-webkit-backdrop-filter:blur(var(--blur)) saturate(180%);border:1px solid var(--stroke);box-shadow:var(--shadow-lg),0 0 0 1px var(--ring),inset 0 1px 0 var(--spec)}
.mhero-row{display:flex;gap:var(--s4);align-items:flex-start;justify-content:space-between;position:relative;z-index:1}
.kicker{display:inline-flex;align-items:center;gap:8px;font-size:var(--t-footnote);font-weight:600;color:var(--ink-2)}
.mhero h1{font-size:var(--t-title1);line-height:1.1;letter-spacing:-.025em;font-weight:700;margin:6px 0 var(--s3)}
.mhero .prof{color:var(--ink-2);font-size:var(--t-footnote)}
.mhero .prof .av{width:34px;height:34px;font-size:13px}
.mhero .prof b{display:block;color:var(--ink);font-weight:600;font-size:var(--t-body)}
.mhero .prg{width:76px;height:76px}
.mhero .prg .trk{stroke:rgba(255,255,255,.2)} :root[data-theme=light] .mhero .prg .trk{stroke:rgba(0,0,0,.1)}
.mhero .prg .bar{stroke:var(--ink)}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s2);margin-top:var(--s5);position:relative;z-index:1}
.fact{padding:10px 12px;border-radius:16px;background:rgba(255,255,255,.08);border:1px solid var(--hair);min-width:0}
:root[data-theme=light] .fact{background:rgba(255,255,255,.6)}
.fact span{display:block;font-size:var(--t-caption);color:var(--ink-2);font-weight:500}
.fact b{display:block;font-size:var(--t-headline);font-weight:650;letter-spacing:-.015em;margin-top:1px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mhero-act{margin-top:var(--s4);position:relative;z-index:1}
.group-h{font-size:var(--t-footnote);font-weight:600;color:var(--ink-2);letter-spacing:.02em;margin:var(--s6) var(--s2) var(--s2);display:flex;align-items:center;gap:8px}
.group-h::after{content:"";flex:1;height:1px;background:var(--hair)}
.feed{display:flex;flex-direction:column;gap:var(--s3)}
.post{--k:var(--c,var(--accent));padding:var(--s4)}
.post::after{content:"";position:absolute;left:0;top:18px;bottom:18px;width:3px;border-radius:0 3px 3px 0;background:var(--k)}
.p-head{display:flex;gap:var(--s3);align-items:flex-start}
.ico{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;flex:none;color:var(--k);background:color-mix(in srgb,var(--k) 16%,transparent);border:1px solid color-mix(in srgb,var(--k) 30%,transparent)}
.p-meta{min-width:0;flex:1}
.p-over{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:var(--t-caption);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2)}
.p-title{font-size:var(--t-headline);font-weight:600;letter-spacing:-.015em;line-height:1.3;margin-top:2px;overflow-wrap:anywhere}
.p-by{font-size:var(--t-footnote);color:var(--ink-2);margin-top:2px}
.p-body{margin-top:var(--s3);font-size:var(--t-body);line-height:1.5;opacity:.88;overflow-wrap:anywhere}
.p-foot{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2);margin-top:var(--s4);padding-top:var(--s3);border-top:1px solid var(--hair)}

/* ===== Cronograma ===== */
.chero{--c:var(--accent);padding:var(--s5);border-radius:26px;overflow:hidden;display:grid;gap:var(--s5);margin-bottom:var(--s5);
  background:radial-gradient(90% 140% at 100% 0%,color-mix(in srgb,var(--c) 30%,transparent),transparent 62%),radial-gradient(60% 90% at 0% 100%,color-mix(in srgb,var(--info) 14%,transparent),transparent 60%),var(--glass);
  backdrop-filter:blur(var(--blur)) saturate(180%);-webkit-backdrop-filter:blur(var(--blur)) saturate(180%);border:1px solid var(--stroke);box-shadow:var(--shadow),0 0 0 1px var(--ring),inset 0 1px 0 var(--spec);position:relative}
.live-dot{display:inline-flex;align-items:center;gap:7px;height:24px;padding:0 10px;border-radius:99px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--t-live-ink);background:color-mix(in srgb,var(--info) 16%,transparent);border:1px solid color-mix(in srgb,var(--info) 40%,transparent)}
.live-dot::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--t-live);animation:pulse 2s infinite}
.chero.is-live .live-dot{color:#fff;background:var(--danger);border-color:transparent}
.chero.is-live .live-dot::before{background:#fff}
@keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--t-live) 65%,transparent)}70%{box-shadow:0 0 0 9px transparent}100%{box-shadow:0 0 0 0 transparent}}
.hero-top{display:flex;align-items:center;gap:var(--s2);flex-wrap:wrap}
.hero-course{font-size:var(--t-footnote);font-weight:600;color:var(--ink-2);display:inline-flex;align-items:center;gap:7px}
.chero h2{font-size:var(--t-title2);line-height:1.15;font-weight:700;letter-spacing:-.02em;margin:var(--s3) 0 var(--s2)}
.chero .prof{color:var(--ink-2);font-size:var(--t-footnote)}
.count{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:8px}
.unit{padding:12px 4px 9px;border-radius:16px;text-align:center;background:color-mix(in srgb,var(--bg) 38%,transparent);border:1px solid var(--hair)}
:root[data-theme=light] .unit{background:rgba(255,255,255,.7)}
.unit .n{display:block;font-size:34px;font-weight:700;line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.unit .l{display:block;margin-top:5px;font-size:10.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
.live-msg{padding:var(--s4);border-radius:16px;background:color-mix(in srgb,var(--danger) 14%,transparent);border:1px solid color-mix(in srgb,var(--danger) 30%,transparent);font-weight:600;display:flex;align-items:center;gap:10px}
.hero-meta{display:flex;flex-wrap:wrap;gap:6px 16px;color:var(--ink-2);font-size:var(--t-footnote);margin-top:var(--s3)}
.hero-meta span{display:inline-flex;align-items:center;gap:6px}
.hero-meta .i{width:15px;height:15px}
.hero-actions{display:flex;gap:var(--s2);flex-wrap:wrap;margin-top:var(--s4)}
.hero-actions .btn{flex:1 1 140px;min-height:46px}
.hero-actions .pri{flex:2 1 180px}
.tools{display:flex;flex-direction:column;gap:var(--s3);margin-bottom:var(--s4)}
.filters{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px 1px}
.filters::-webkit-scrollbar{display:none}
.fchip{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 12px;border-radius:var(--r-chip);font-size:var(--t-footnote);font-weight:600;border:1px solid var(--hair);background:var(--glass);color:var(--ink-2);white-space:nowrap;transition:background .2s,color .2s,border-color .2s,transform .12s}
.fchip:active{transform:scale(.96)}
.fchip .i{width:15px;height:15px}
.fchip[aria-pressed=true]{color:var(--ti);background:color-mix(in srgb,var(--tc) 16%,var(--glass-2));border-color:color-mix(in srgb,var(--tc) 42%,transparent)}
.fchip[aria-pressed=false]{opacity:.75}
.cal{padding:var(--s4);border-radius:26px}
.cal-head{display:flex;align-items:center;gap:var(--s2);margin-bottom:var(--s3)}
.cal-head h2{font-size:var(--t-title3);font-weight:700;letter-spacing:-.02em;flex:1}
.nav-b{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;border:1px solid var(--hair);transition:background .2s,transform .12s}
.nav-b:active{transform:scale(.92)}
.today-b{height:44px;padding:0 14px;border-radius:12px;border:1px solid var(--hair);font-size:var(--t-footnote);font-weight:600;color:var(--accent)}
.dows,.days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.dows span{text-align:center;font-size:var(--t-caption);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);padding:4px 0 8px}
.day{position:relative;min-height:52px;border-radius:14px;padding:6px 2px;display:flex;flex-direction:column;align-items:center;gap:5px;border:1px solid transparent;transition:background .2s,border-color .2s,transform .12s var(--ease)}
.day:active{transform:scale(.95)}
.day .num{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:var(--t-body);font-weight:500;font-variant-numeric:tabular-nums}
.day.out{opacity:.35}
.day.past .num{color:var(--ink-3)}
.day.has{background:var(--glass-2);border-color:var(--hair)}
.day.today .num{background:var(--accent);color:var(--accent-ink);font-weight:700;box-shadow:0 4px 12px color-mix(in srgb,var(--accent) 55%,transparent)}
.day[aria-pressed=true]{background:color-mix(in srgb,var(--accent) 16%,transparent);border-color:color-mix(in srgb,var(--accent) 55%,transparent)}
.dots{display:flex;gap:3px;justify-content:center;flex-wrap:wrap;min-height:6px}
.dots i{width:6px;height:6px;border-radius:50%;background:var(--c);display:block}
.pills{display:none}
.pill{--c:var(--accent);display:flex;align-items:center;gap:5px;height:22px;padding:0 6px 0 5px;border-radius:7px;font-size:11px;font-weight:600;white-space:nowrap;overflow:hidden;color:var(--ti);background:color-mix(in srgb,var(--tc) 16%,transparent);border-left:3px solid var(--c);text-align:left}
.pill .i{width:11px;height:11px;flex:none}
.pill span{overflow:hidden;text-overflow:ellipsis}
.more{font-size:11px;font-weight:600;color:var(--ink-2);padding-left:6px;text-align:left}
.legend{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:var(--s4);padding-top:var(--s3);border-top:1px solid var(--hair);font-size:12px;color:var(--ink-2)}
.legend span{display:inline-flex;align-items:center;gap:6px}
.legend i{width:8px;height:8px;border-radius:50%;background:var(--c);display:block}

/* ===== Resumen IA (colapsable), avisos y login ===== */
.ia{grid-column:1 / -1;margin-top:6px;border-radius:14px;background:color-mix(in srgb,var(--accent) 9%,transparent);border:1px solid color-mix(in srgb,var(--accent) 24%,transparent);min-width:0}
.r-body .ia{grid-column:auto}
.ia summary{display:flex;align-items:center;gap:8px;min-height:40px;padding:0 12px;font-size:var(--t-footnote);font-weight:600;color:var(--accent);cursor:pointer;list-style:none;-webkit-user-select:none;user-select:none}
.ia summary::-webkit-details-marker{display:none}
.ia summary .i{width:15px;height:15px}
.ia summary .cv{margin-left:auto;transition:transform .25s var(--ease)}
.ia[open] summary .cv{transform:rotate(180deg)}
.ia-b{padding:0 12px 10px;font-size:var(--t-footnote);line-height:1.5;color:var(--ink);overflow-wrap:anywhere;font-weight:400}
.ia-n{padding:0 12px 10px;font-size:11px;color:var(--ink-2);display:flex;gap:6px;align-items:center}
.ia-n .i{width:12px;height:12px}
.banner{display:flex;gap:12px;align-items:flex-start;padding:var(--s3) var(--s4);margin:var(--s2) 0 var(--s2);border-radius:var(--r-card);font-size:var(--t-footnote);color:var(--ink-2);line-height:1.45;background:color-mix(in srgb,var(--warn) 12%,var(--glass-2));border:1px solid color-mix(in srgb,var(--warn) 38%,transparent);box-shadow:0 0 0 1px var(--ring)}
.banner.bad{background:color-mix(in srgb,var(--danger) 11%,var(--glass-2));border-color:color-mix(in srgb,var(--danger) 40%,transparent)}
.banner b{display:block;color:var(--ink);font-size:var(--t-body);margin-bottom:2px}
.banner>.i{margin-top:2px;color:var(--warn-t);width:22px;height:22px}
.banner.bad>.i{color:var(--danger-t)}
.login{position:fixed;inset:0;z-index:70;display:grid;place-items:center;padding:max(var(--s4),env(safe-area-inset-top)) var(--s4) max(var(--s4),env(safe-area-inset-bottom));background:var(--bg);background-image:var(--mesh);overflow-y:auto;overscroll-behavior:contain}
.login .lt{position:absolute;top:calc(env(safe-area-inset-top,0px) + 12px);right:12px}
.lcard{width:min(420px,100%);padding:var(--s6) var(--s5);border-radius:var(--r-sheet);display:grid;gap:var(--s4);box-shadow:var(--shadow-lg),0 0 0 1px var(--ring),inset 0 1px 0 var(--spec);backdrop-filter:blur(var(--blur-thick)) saturate(180%);-webkit-backdrop-filter:blur(var(--blur-thick)) saturate(180%)}
.lcard .logo{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#5e84ff,#bf5af2);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 10px 24px rgba(94,132,255,.4)}
.lcard .logo .i{width:26px;height:26px}
.lcard h1{font-size:var(--t-title1);line-height:1.1;font-weight:700;letter-spacing:-.025em}
.lcard .lead{color:var(--ink-2);font-size:var(--t-body);margin-top:-6px}
.lcard label.f{display:grid;gap:6px;font-size:var(--t-footnote);font-weight:600;color:var(--ink-2)}
.lcard input[type=email]{height:52px;padding:0 14px;border-radius:var(--r-btn);background:var(--hair);border:1px solid var(--stroke);outline:0;width:100%}
:root[data-theme=light] .lcard input[type=email]{background:rgba(255,255,255,.9);border-color:rgba(20,30,70,.16)}
.lcard input[type=email]:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
.lcard .btn{min-height:50px;font-size:var(--t-body)}
.lmsg{font-size:var(--t-footnote);min-height:1.3em;line-height:1.4}
.lmsg.bad{color:var(--danger-t)} .lmsg.ok{color:var(--ok-t)}
.lnote{font-size:12px;color:var(--ink-2);line-height:1.45;text-align:center}
.ldemo{justify-self:center;min-height:44px;padding:0 14px;font-size:var(--t-footnote);font-weight:600;color:var(--ink-2);border-radius:var(--r-btn);text-decoration:underline;text-underline-offset:3px}
.ldemo:hover{color:var(--ink)}
.lsent{display:grid;gap:var(--s3);justify-items:start}
.lsent .big{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;color:var(--ok-t);background:color-mix(in srgb,var(--ok) 16%,transparent);border:1px solid color-mix(in srgb,var(--ok) 34%,transparent)}
.lsent .big .i{width:28px;height:28px}
.lsent p{color:var(--ink-2);font-size:var(--t-body);overflow-wrap:anywhere}
.lsent p b{color:var(--ink)}
.lrow{display:flex;gap:var(--s2);flex-wrap:wrap;width:100%}
.lrow .btn{flex:1 1 140px}
.acc{display:flex;align-items:center;gap:var(--s3);flex-wrap:wrap;justify-content:space-between;padding:var(--s3);border-radius:var(--r-btn);background:var(--hair);font-size:var(--t-footnote)}
.acc span{min-width:0;overflow-wrap:anywhere;color:var(--ink-2)}
.acc span b{color:var(--ink)}

/* ===== Pantallas nuevas: Aula, Evaluaciones, Calificaciones, Mensajes ===== */
.toast.show.act{pointer-events:auto;display:flex;align-items:center;gap:10px;padding:6px 6px 6px 16px}
.toast button{height:36px;padding:0 14px;border-radius:var(--r-chip);color:var(--accent);font-weight:700}
.tabbar .nb2{position:absolute;top:4px;left:calc(50% + 6px)}
.msheet{position:fixed;z-index:55;left:var(--s3);right:var(--s3);bottom:calc(var(--s2) + env(safe-area-inset-bottom,0px));max-width:520px;margin:0 auto;padding:var(--s3);border-radius:var(--r-sheet);display:grid;gap:2px;transform:translateY(130%);visibility:hidden;transition:transform .4s var(--ease),visibility 0s .4s;box-shadow:var(--shadow-lg),0 0 0 1px var(--ring)}
.msheet.open{transform:none;visibility:visible;transition:transform .4s var(--ease)}
.msheet a,.msheet button{display:flex;align-items:center;gap:var(--s3);min-height:52px;padding:0 var(--s3);border-radius:var(--r-btn);font-weight:600;text-align:left;width:100%}
.msheet a .i,.msheet button .i{color:var(--accent)}
.msheet a:active,.msheet button:active{background:var(--hair)}
.msheet .mh{padding:6px var(--s3) 8px;font-size:var(--t-caption);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.scrim.m{z-index:54}
body.more-open .scrim.m{opacity:1;pointer-events:auto}
@media (min-width:1024px){.msheet,.scrim.m{display:none}}

/* hojas inferiores genéricas (detalle de evaluación en móvil) */
.esheet{position:fixed;z-index:56;left:0;right:0;bottom:0;max-height:90dvh;display:flex;flex-direction:column;border-radius:var(--r-sheet) var(--r-sheet) 0 0;border:1px solid var(--stroke);border-bottom:0;box-shadow:var(--shadow-lg),0 0 0 1px var(--ring);background:var(--glass);backdrop-filter:blur(var(--blur-thick)) saturate(180%);-webkit-backdrop-filter:blur(var(--blur-thick)) saturate(180%);transform:translateY(106%);visibility:hidden;transition:transform .45s var(--ease),visibility 0s .45s}
:root[data-theme=light] .esheet{background:rgba(250,251,254,.94)}
:root[data-theme=dark] .esheet{background:rgba(24,24,28,.86)}
.esheet.open{transform:none;visibility:visible;transition:transform .45s var(--ease)}
.esheet.dragging{transition:none}
.esheet .grab{height:28px}
.esheet-b{overflow-y:auto;overscroll-behavior:contain;padding:var(--s2) var(--s5) calc(var(--s6) + env(safe-area-inset-bottom,0px))}
.scrim.e{z-index:55}
body.esheet-open .scrim.e{opacity:1;pointer-events:auto}
body.esheet-open{overflow:hidden}
@media (min-width:1024px){.esheet,.scrim.e{display:none}body.esheet-open{overflow:auto}}

/* ----- Aula ----- */
.au-live{position:relative;z-index:1;margin-top:var(--s4);display:flex;align-items:center;gap:var(--s3);padding:12px;border-radius:18px;background:rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.14);flex-wrap:wrap}
:root[data-theme=light] .au-live{background:rgba(255,255,255,.62);border-color:rgba(20,30,70,.1)}
.au-live .li{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:color-mix(in srgb,var(--danger) 22%,transparent);color:var(--danger-t);flex:none}
.au-live .lt{min-width:0;flex:1 1 180px}
.au-live small{display:block;font-size:var(--t-caption);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.au-live b{display:block;font-size:var(--t-body);font-weight:600;line-height:1.3;overflow-wrap:anywhere}
.au-live .cd{font-variant-numeric:tabular-nums;font-weight:700;font-size:var(--t-footnote);color:var(--ink)}
.au-live .btn{flex:1 1 100%}
@media (min-width:600px){.au-live .btn{flex:none}}
.au-pills{display:flex;flex-wrap:wrap;gap:6px;margin-top:var(--s4);position:relative;z-index:1}
.au-pill{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 11px;border-radius:var(--r-chip);font-size:12px;font-weight:600;background:var(--chip-bg);color:var(--ink-2);border:1px solid var(--hair);white-space:nowrap}
.au-pill .i{width:13px;height:13px}
.au-tabs-wrap{position:sticky;top:calc(64px + env(safe-area-inset-top,0px));z-index:15;margin:var(--s4) calc(var(--s4) * -1) var(--s3);padding:4px var(--s4)}
.au-tabs{display:flex;gap:2px;padding:3px;border-radius:16px;overflow-x:auto;scrollbar-width:none;background:var(--glass);backdrop-filter:blur(var(--blur)) saturate(180%);-webkit-backdrop-filter:blur(var(--blur)) saturate(180%);border:1px solid var(--stroke);box-shadow:var(--shadow),0 0 0 1px var(--ring)}
.au-tabs::-webkit-scrollbar{display:none}
.au-tabs button{flex:1 0 auto;min-height:44px;padding:0 14px;border-radius:13px;display:inline-flex;align-items:center;justify-content:center;gap:7px;font-size:var(--t-footnote);font-weight:600;color:var(--ink-2);white-space:nowrap;transition:color .2s,background .25s var(--ease)}
.au-tabs button .i{width:17px;height:17px}
.au-tabs button[aria-selected=true]{color:var(--ink);background:var(--glass-2);box-shadow:var(--shadow),inset 0 1px 0 var(--spec)}
:root[data-theme=light] .au-tabs button[aria-selected=true]{background:#fff}
.au-cnt{min-width:18px;height:18px;padding:0 5px;border-radius:9px;display:inline-grid;place-items:center;font-size:11px;font-weight:700;background:var(--danger);color:#fff}
.au-cols{display:block}
.au-aside{display:none}
.au-chips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 calc(var(--s4) * -1) var(--s3);padding:2px var(--s4)}
.au-chips::-webkit-scrollbar{display:none}
.au-chips .fchip{--tc:var(--c);--ti:var(--ink);min-height:40px}
.topic{overflow:hidden;margin-bottom:var(--s3)}
.topic>summary{display:flex;align-items:center;gap:var(--s3);min-height:56px;padding:var(--s3) var(--s4);list-style:none;cursor:pointer;font-weight:600}
.topic>summary::-webkit-details-marker{display:none}
.topic>summary .tn{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 22%,transparent);flex:none}
.topic>summary .tn .i{width:16px;height:16px}
.topic>summary small{display:block;color:var(--ink-2);font-size:12px;font-weight:500}
.topic>summary .cv{margin-left:auto;color:var(--ink-2);transition:transform .3s var(--ease)}
.topic[open]>summary .cv{transform:rotate(180deg)}
.items{border-top:1px solid var(--hair)}
.item{display:flex;align-items:center;gap:var(--s3);padding:10px var(--s4);min-height:56px;flex-wrap:wrap}
.item+.item{border-top:1px solid var(--hair)}
.item .ic{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;flex:none;background:var(--chip-bg);color:var(--ink-2)}
.item .ic.pdf{background:color-mix(in srgb,var(--danger) 16%,transparent);color:var(--danger-t)}
.item .ic.lnk{background:color-mix(in srgb,var(--info) 16%,transparent);color:var(--info-t)}
.item .ic.vid{background:color-mix(in srgb,var(--ok) 16%,transparent);color:var(--ok-t)}
.item .tx{flex:1;min-width:0}
.item .tx b{display:block;font-weight:500;line-height:1.3;overflow-wrap:anywhere}
.item .tx small{color:var(--ink-2);font-size:12px}
.item .go{color:var(--ink-3);width:44px;height:44px;display:grid;place-items:center;border-radius:12px;flex:none}
.item .ia{flex:1 1 100%;margin:0 0 4px}
.vc{display:flex;gap:var(--s3);align-items:center;padding:var(--s4);flex-wrap:wrap;margin-bottom:var(--s3)}
.vc.next{border-color:color-mix(in srgb,var(--c) 55%,var(--stroke))}
.plat{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;flex:none;font-weight:700;color:#fff;font-size:15px;background:linear-gradient(135deg,#5b5fc7,#7b83eb)}
.plat.meet{background:linear-gradient(135deg,#00832d,#00ac47)}
.plat.yt{background:linear-gradient(135deg,#d93025,#ff5a4d)}
.plat.gen{background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 55%,#000))}
.vc .tx{flex:1 1 160px;min-width:0}
.vc .tx b{display:block;font-weight:600;line-height:1.3;overflow-wrap:anywhere}
.vc .tx small{display:block;color:var(--ink-2);font-size:var(--t-footnote)}
.au-avg{display:flex;align-items:center;gap:var(--s4);padding:var(--s5);margin-bottom:var(--s3);flex-wrap:wrap}
.au-avg .big{font-size:var(--t-large);font-weight:700;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}
.au-avg .big small{font-size:var(--t-headline);color:var(--ink-2);font-weight:600}
.au-avg .tx{flex:1 1 160px;min-width:0;color:var(--ink-2);font-size:var(--t-footnote)}
.gr{display:flex;align-items:center;gap:var(--s3);padding:12px var(--s4);min-height:56px}
.gr+.gr{border-top:1px solid var(--hair)}
.gr .tx{flex:1;min-width:0}
.gr .tx b{display:block;font-weight:500;line-height:1.3;overflow-wrap:anywhere}
.gr .tx small{color:var(--ink-2);font-size:12px}
.gr .n{font-weight:700;font-size:var(--t-headline);font-variant-numeric:tabular-nums;text-align:right;min-width:56px}
.gr .n small{color:var(--ink-3);font-weight:500;font-size:12px}
.person{display:flex;align-items:center;gap:var(--s3);padding:12px var(--s4);min-height:64px}
.person+.person{border-top:1px solid var(--hair)}
.person .avatar{width:44px;height:44px;font-size:15px}
.person .tx{flex:1;min-width:0}
.person .tx b{display:block;font-weight:600}
.person .tx small{color:var(--ink-2);font-size:var(--t-footnote)}
.mini{display:flex;gap:var(--s3);align-items:center;padding:10px 0;min-height:52px}
.mini+.mini{border-top:1px solid var(--hair)}
.mini .dt{width:42px;text-align:center;flex:none;line-height:1.1}
.mini .dt b{display:block;font-size:var(--t-headline);font-weight:700}
.mini .dt small{font-size:10px;text-transform:uppercase;font-weight:700;letter-spacing:.06em;color:var(--ink-2)}
.mini .tx{flex:1;min-width:0}
.mini .tx b{display:block;font-size:var(--t-footnote);font-weight:600;line-height:1.3;overflow-wrap:anywhere}
.mini .tx small{color:var(--ink-2);font-size:12px}
.au-card{padding:var(--s4);border-radius:var(--r-card)}
.au-card h3{font-size:var(--t-footnote);font-weight:700;display:flex;align-items:center;gap:7px;margin-bottom:var(--s2)}
.au-note{display:flex;gap:10px;padding:var(--s3) var(--s4);border-radius:14px;background:var(--hair);color:var(--ink-2);font-size:var(--t-footnote);margin-top:var(--s3);line-height:1.45}
.au-note .i{width:16px;height:16px;margin-top:1px}
@media (min-width:600px){.au-tabs-wrap{margin-left:calc(var(--s6) * -1);margin-right:calc(var(--s6) * -1);padding-left:var(--s6);padding-right:var(--s6)}.au-chips{margin-left:calc(var(--s6) * -1);margin-right:calc(var(--s6) * -1);padding-left:var(--s6);padding-right:var(--s6)}}
@media (min-width:1024px){
  .au-tabs-wrap{top:72px;margin:var(--s5) 0 var(--s4);padding:4px 0}
  .au-tabs{display:inline-flex;max-width:100%}
  .au-tabs button{padding:0 20px;font-size:var(--t-body)}
  .au-chips{margin:0 0 var(--s3);padding:2px 0;flex-wrap:wrap}
  .au-cols{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:var(--s6);align-items:start}
  .au-aside{display:flex;flex-direction:column;gap:var(--s4);position:sticky;top:150px}
}

/* ----- Evaluaciones ----- */
.ev-stats{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3);margin-bottom:var(--s5)}
.ev-stat{padding:var(--s4);display:flex;flex-direction:column;gap:4px;min-width:0}
.ev-stat .k{display:flex;align-items:center;gap:6px;font-size:var(--t-caption);font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2)}
.ev-stat .k .i{width:15px;height:15px}
.ev-stat .v{font-size:var(--t-title1);font-weight:700;letter-spacing:-.025em;line-height:1.1;font-variant-numeric:tabular-nums}
.ev-stat .v small{font-size:var(--t-footnote);font-weight:600;color:var(--ink-2);margin-left:3px}
.ev-stat .n{font-size:var(--t-footnote);color:var(--ink-2)}
.ev-stat.avg{grid-column:1 / -1;flex-direction:row;align-items:center;gap:var(--s4);padding:var(--s5)}
.ev-stat.avg .txt{display:flex;flex-direction:column;gap:6px;min-width:0}
.ev-stat.avg .v{font-size:var(--t-title2)}
.egr{--pk:var(--ink-3);--sz:72px;position:relative;width:var(--sz);height:var(--sz);flex:none;display:grid;place-items:center}
.egr>svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);overflow:visible}
.egr .trk{fill:none;stroke:color-mix(in srgb,var(--pk) 22%,transparent);stroke-width:7}
.egr .bar{fill:none;stroke:var(--pk);stroke-width:7;stroke-linecap:round}
.egr .num{position:relative;display:flex;flex-direction:column;align-items:center;line-height:1;font-variant-numeric:tabular-nums}
.egr .num b{font-size:calc(var(--sz) * .3);font-weight:700;letter-spacing:-.03em}
.egr .num small{font-size:calc(var(--sz) * .15);font-weight:600;color:var(--ink-2);margin-top:2px}
.egr.none .trk{stroke:var(--ink-3);stroke-dasharray:4 5;stroke-width:5;opacity:.7}
.egr.none .num{color:var(--ink-2)}
.egr.none .num .i{width:calc(var(--sz) * .3);height:calc(var(--sz) * .3)}
.egr.ok{--pk:var(--ok)} .egr.mid{--pk:var(--accent)} .egr.bad{--pk:var(--danger)}
.pchip{--k:var(--ink-2);display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 10px;border-radius:var(--r-chip);font-size:12px;font-weight:600;white-space:nowrap;min-width:max-content;color:var(--k);background:color-mix(in srgb,var(--k) 16%,transparent);border:1px solid color-mix(in srgb,var(--k) 28%,transparent)}
.pchip .i{width:13px;height:13px;stroke-width:2.2}
.pchip.ok{--k:var(--ok-t)} .pchip.mid{--k:var(--accent)} .pchip.bad{--k:var(--danger-t)} .pchip.soft{--k:var(--ink-2);background:var(--hair);border-color:transparent;font-weight:500} .pchip.pend{--k:var(--info-t)}
.ev-filters{padding:var(--s4);display:flex;flex-direction:column;gap:var(--s3);margin-bottom:var(--s4)}
.f-lab{font-size:var(--t-caption);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);margin-bottom:6px}
.ev-chips{display:flex;gap:var(--s2);overflow-x:auto;scrollbar-width:none;margin:0 calc(var(--s4) * -1);padding:2px var(--s4);overscroll-behavior-x:contain}
.ev-chips::-webkit-scrollbar{display:none}
.cbtn{--c:var(--accent);flex:none;display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 var(--s3);border-radius:var(--r-chip);font-size:var(--t-footnote);font-weight:500;white-space:nowrap;background:var(--hair);border:1px solid transparent;color:var(--ink-2);transition:background .2s,color .2s,border-color .2s,transform .1s}
.cbtn:active{transform:scale(.96)}
.cbtn .dot{width:9px;height:9px}
.cbtn[aria-pressed=true]{color:var(--ink);font-weight:600;background:color-mix(in srgb,var(--c) 20%,var(--glass-2));border-color:color-mix(in srgb,var(--c) 55%,transparent)}
.cbtn .cnt{font-size:11px;font-weight:600;color:var(--ink-3);font-variant-numeric:tabular-nums}
.ev-res{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);flex-wrap:wrap;margin:0 var(--s1) var(--s3);min-height:28px;font-size:var(--t-footnote);color:var(--ink-2)}
.ev-res b{color:var(--ink)}
.ev-cols{display:block}
.ev-detail{display:none}
.ev-month{position:sticky;top:calc(env(safe-area-inset-top,0px) + 70px);z-index:5;display:flex;align-items:baseline;gap:var(--s3);margin:var(--s5) 0 var(--s3);padding:6px var(--s3);width:max-content;max-width:100%;border-radius:var(--r-chip);background:var(--glass);backdrop-filter:blur(var(--blur-thin)) saturate(180%);-webkit-backdrop-filter:blur(var(--blur-thin)) saturate(180%);border:1px solid var(--stroke);box-shadow:0 0 0 1px var(--ring)}
.ev-month:first-child{margin-top:0}
.ev-month h2{font-size:var(--t-footnote);font-weight:700;letter-spacing:.02em}
.ev-month span{font-size:12px;color:var(--ink-2)}
.tl-item{--c:var(--accent);position:relative;padding:0 0 var(--s3) 26px;list-style:none}
.tl-item::before{content:"";position:absolute;left:7px;top:26px;bottom:-4px;width:2px;border-radius:1px;background:var(--hair)}
.tl-item:last-child::before{display:none}
.node{position:absolute;left:0;top:22px;width:16px;height:16px;border-radius:50%;background:var(--bg);border:3px solid var(--c);box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 18%,transparent)}
.tl-item.ng .node{border-style:dashed;box-shadow:none}
.evc{--c:var(--accent);display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s3);width:100%;text-align:left;padding:var(--s4) var(--s4) var(--s3) var(--s5);min-height:44px;overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .3s,background .3s;position:relative}
.evc::after{content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:0 3px 3px 0;background:var(--c)}
.evc:active{transform:scale(.99)}
.evc.sel{border-color:color-mix(in srgb,var(--c) 70%,var(--stroke));box-shadow:var(--shadow-lg),0 0 0 1px color-mix(in srgb,var(--c) 40%,transparent)}
.evc.ng{background:transparent;border-style:dashed;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.evc.ng::before{display:none}
.evc .info{min-width:0;display:flex;flex-direction:column;gap:6px}
.evc .co{display:flex;align-items:center;gap:7px;font-size:var(--t-caption);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2)}
.evc h3{font-size:var(--t-headline);line-height:1.25;font-weight:600;letter-spacing:-.012em;overflow-wrap:anywhere}
.evc .wh{display:flex;align-items:center;gap:6px;font-size:var(--t-footnote);color:var(--ink-2);font-variant-numeric:tabular-nums}
.evc .wh .i{width:14px;height:14px}
.evc .mt{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.evc .egr{--sz:60px}
.d-head{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--s3)}
.d-head .co{display:flex;align-items:center;gap:7px;font-size:var(--t-caption);font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2)}
.d-head h2{font-size:var(--t-title3);line-height:1.2;font-weight:650;letter-spacing:-.02em;text-wrap:balance;overflow-wrap:anywhere}
.d-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.d-legend{font-size:11px;color:var(--ink-2)}
.dl{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2);margin:var(--s5) 0 var(--s4)}
.dl>div{padding:var(--s3);border-radius:14px;background:var(--hair);min-width:0}
.dl dt{font-size:var(--t-caption);font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2);margin-bottom:3px}
.dl dd{margin:0;font-size:var(--t-footnote);font-weight:600;line-height:1.3;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.dl .wide{grid-column:1 / -1}
.d-body{display:flex;flex-direction:column;gap:var(--s3)}
.quote{--c:var(--accent);position:relative;padding:var(--s3) var(--s3) var(--s3) var(--s4);border-radius:16px;background:color-mix(in srgb,var(--c) 9%,var(--hair));border:1px solid color-mix(in srgb,var(--c) 16%,transparent)}
.quote::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:2px;background:var(--c)}
.q-head{display:flex;align-items:center;gap:var(--s2);margin-bottom:6px;font-size:var(--t-footnote);font-weight:600}
.q-head small{display:block;font-size:11px;color:var(--ink-2);font-weight:500}
.q-av{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700;color:var(--ci,#0b0b0f);background:var(--c);flex:none}
.q-text{font-size:var(--t-footnote);line-height:1.5;overflow-wrap:anywhere}
.q-text.clamp{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.q-more{display:inline-flex;align-items:center;gap:3px;min-height:44px;font-size:12px;font-weight:600;color:var(--accent)}
.quote.none{background:transparent;border-style:dashed;border-color:var(--hair)}
.quote.none::before{display:none}
.quote.none .q-text{color:var(--ink-2)}
.ai-btn{display:inline-flex;align-items:center;gap:7px;align-self:flex-start;min-height:44px;padding:0 var(--s4);border-radius:var(--r-btn);font-size:var(--t-footnote);font-weight:600;color:#fff;background:linear-gradient(135deg,#5e84ff 0%,#0A84FF 50%,#bf5af2 100%);border:1px solid rgba(255,255,255,.3);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 6px 16px rgba(10,132,255,.3);transition:transform .15s}
.ai-btn:active{transform:scale(.96)}
.ai-btn .i{width:16px;height:16px}
.ai-btn[disabled]{opacity:.7;cursor:progress}
.ai-box{padding:var(--s3) var(--s4);border-radius:16px;background:var(--glass-2);border:1px solid var(--stroke);display:flex;flex-direction:column;gap:var(--s2);box-shadow:0 0 0 1px var(--ring)}
.ai-box h4{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.ai-box h4 .i{width:14px;height:14px}
.ai-box .md{font-size:var(--t-footnote)}
.ai-box small{font-size:11px;color:var(--ink-2)}
.ai-box.err{border-color:color-mix(in srgb,var(--danger) 45%,transparent)}
.sk{height:10px;border-radius:5px;background:var(--hair);animation:blink 1.2s infinite}
.d-ph{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--s2);padding:var(--s8) var(--s4);color:var(--ink-2)}
.d-ph .i{width:30px;height:30px}
.d-ph strong{color:var(--ink);font-size:var(--t-headline)}
.spin{animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media (min-width:600px){.ev-stats{grid-template-columns:1.4fr 1fr 1fr}.ev-stat.avg{grid-column:auto}}
@media (min-width:1024px){
  .ev-chips{flex-wrap:wrap;overflow:visible;margin:0;padding:0}
  .ev-cols{display:grid;grid-template-columns:minmax(0,1fr) 372px;gap:var(--s6);align-items:start}
  .ev-month{top:84px}
  .ev-detail{display:block;position:sticky;top:84px;max-height:calc(100dvh - 100px);overflow:auto;overscroll-behavior:contain;padding:var(--s6) var(--s5);border-radius:var(--r-sheet);scrollbar-width:thin}
}

/* ----- Calificaciones ----- */
.cg-chips{display:flex;gap:var(--s2);overflow-x:auto;scrollbar-width:none;margin:0 calc(var(--s4) * -1);padding:var(--s1) var(--s4) var(--s3);overscroll-behavior-x:contain}
.cg-chips::-webkit-scrollbar{display:none}
.cg-layout{display:flex;flex-direction:column;gap:var(--s4)}
.cg-sum{padding:var(--s4);position:relative;overflow:hidden;min-width:0}
.cg-sum::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(120% 90% at 100% 0%,color-mix(in srgb,var(--c) 22%,transparent),transparent 62%)}
.cg-sum>*{position:relative;z-index:1}
.cg-lbl{font-size:var(--t-caption);font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2)}
.cg-avgrow{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.cg-avgnum{font-size:var(--t-large);line-height:1.1;font-weight:700;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.cg-avgof{font-size:var(--t-headline);font-weight:500;color:var(--ink-2)}
.cg-avgsub{margin-top:2px;font-size:var(--t-footnote);color:var(--ink-2)}
.cg-blk{padding-top:var(--s4);margin-top:var(--s4);border-top:1px solid var(--hair)}
.cg-blk h3{font-size:var(--t-footnote);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2);display:flex;align-items:center;gap:6px;margin-bottom:var(--s3)}
.cg-blk h3 .i{width:15px;height:15px}
.cg-wring{display:flex;align-items:center;gap:var(--s4)}
.cg-ring{position:relative;width:68px;height:68px;flex:none}
.cg-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.cg-ring circle{fill:none;stroke-width:7;stroke-linecap:round}
.cg-ring .tr{stroke:var(--hair)}
.cg-ring .fg{stroke:var(--warn);stroke-dasharray:175.9;transition:stroke-dashoffset .5s var(--ease),stroke .25s}
.cg-ring.ok .fg{stroke:var(--ok)} .cg-ring.over .fg{stroke:var(--danger)}
.cg-ring b{position:absolute;inset:0;display:grid;place-items:center;font-size:var(--t-footnote);font-weight:700;font-variant-numeric:tabular-nums}
.cg-wtxt{min-width:0;flex:1}
.cg-wtxt strong{display:block;font-size:var(--t-body);font-weight:600}
.cg-wtxt span{display:block;font-size:var(--t-footnote);color:var(--ink-2);margin-top:2px}
.cg-stack{position:relative;height:26px;border-radius:9px;background:var(--hair);display:flex;margin-top:var(--s2)}
.cg-stack .sg{height:100%;min-width:0;flex:none;transition:width .5s var(--ease)}
.cg-stack .sg:first-child{border-radius:9px 0 0 9px}
.cg-stack .sg.got{background:var(--e)}
.cg-stack .sg.pot{background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--e) 62%,transparent) 0 4px,transparent 4px 8px);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--e) 70%,transparent)}
.cg-stack .sg+.sg{box-shadow:inset 1px 0 0 var(--bg)}
.cg-tick{position:absolute;top:-5px;bottom:-5px;width:2px;border-radius:2px;background:var(--ink);transition:left .45s var(--ease);z-index:2}
.cg-tick span{position:absolute;top:100%;left:50%;transform:translateX(-50%);margin-top:3px;font-size:var(--t-caption);font-weight:600;white-space:nowrap}
.cg-axis{display:flex;justify-content:space-between;margin-top:20px;font-size:var(--t-caption);color:var(--ink-3);font-variant-numeric:tabular-nums}
.cg-legend{display:flex;flex-direction:column;gap:6px;margin-top:var(--s3)}
.cg-legend li{display:flex;align-items:center;gap:var(--s2);font-size:var(--t-footnote);min-width:0;list-style:none}
.cg-legend i{width:10px;height:10px;border-radius:3px;background:var(--e);flex:none}
.cg-legend li.pend i{background:repeating-linear-gradient(135deg,var(--e) 0 2px,transparent 2px 4px);box-shadow:inset 0 0 0 1px var(--e)}
.cg-legend span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink-2)}
.cg-legend em{font-style:normal;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.cg-need{border-radius:16px;padding:var(--s4);background:color-mix(in srgb,var(--k) 12%,transparent);border:1px solid color-mix(in srgb,var(--k) 28%,transparent);--k:var(--info-t)}
.cg-need.ok{--k:var(--ok-t)} .cg-need.warn{--k:var(--warn-t)} .cg-need.danger{--k:var(--danger-t)}
.cg-need .top{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.cg-need .nm{font-size:var(--t-title1);font-weight:700;letter-spacing:-.025em;font-variant-numeric:tabular-nums;color:var(--k);line-height:1.1}
.cg-need .nl{font-size:var(--t-body);font-weight:600}
.cg-need p{margin-top:6px;font-size:var(--t-footnote);color:var(--ink-2)}
.cg-need p b{color:var(--ink)}
.cg-goal{display:flex;align-items:center;gap:var(--s2);flex-wrap:wrap;margin-top:var(--s3);font-size:var(--t-footnote);color:var(--ink-2)}
.cg-presets{display:flex;gap:6px;flex-wrap:wrap}
.cg-preset{height:40px;min-width:44px;padding:0 12px;border-radius:var(--r-chip);font-size:var(--t-footnote);font-weight:600;background:var(--hair);color:var(--ink-2);border:1px solid transparent;font-variant-numeric:tabular-nums}
.cg-preset[aria-pressed=true]{color:var(--ink);background:color-mix(in srgb,var(--accent) 24%,transparent);border-color:color-mix(in srgb,var(--accent) 55%,transparent)}
.cg-step{display:inline-flex;align-items:center;height:44px;border-radius:var(--r-btn);background:var(--hair);border:1px solid transparent}
.cg-step:focus-within{border-color:var(--accent)}
.cg-step button{width:40px;height:100%;display:grid;place-items:center;border-radius:var(--r-btn);color:var(--ink-2)}
.cg-step button:active{transform:scale(.9);background:var(--hair)}
.cg-step button .i{width:16px;height:16px;stroke-width:2.4}
.cg-step input{width:46px;height:100%;background:none;border:0;outline:0;text-align:center;font-weight:600;font-variant-numeric:tabular-nums;padding:0}
.cg-step .pc{margin-left:-6px;margin-right:4px;color:var(--ink-3);font-size:var(--t-footnote)}
.cg-head{display:flex;align-items:center;gap:var(--s2);margin:var(--s2) var(--s1) var(--s3)}
.cg-head h2{font-size:var(--t-title3);font-weight:650;letter-spacing:-.018em;flex:1;min-width:0}
.cg-head h2 small{display:block;font-size:var(--t-footnote);font-weight:500;letter-spacing:0;color:var(--ink-2);margin-top:2px}
.cg-save{font-size:12px;color:var(--ink-2);display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.cg-save .i{width:14px;height:14px}
.cg-save.bad{color:var(--danger-t)}
.cg-notice{display:flex;gap:var(--s3);align-items:flex-start;padding:var(--s3) var(--s4);margin-bottom:var(--s3);border-radius:16px;background:color-mix(in srgb,var(--k) 13%,transparent);border:1px solid color-mix(in srgb,var(--k) 30%,transparent);--k:var(--warn-t);font-size:var(--t-footnote)}
.cg-notice.over{--k:var(--danger-t)}
.cg-notice.info{--k:var(--info-t)}
.cg-notice .i{color:var(--k);margin-top:1px;width:18px;height:18px}
.cg-notice b{color:var(--k)}
.cg-notice p{flex:1;color:var(--ink-2)}
.cg-notice .acts{display:flex;gap:var(--s2);flex-wrap:wrap;margin-top:var(--s2)}
.cg-sugg{list-style:none;margin-top:var(--s2);display:grid;gap:4px;color:var(--ink)}
.cg-sugg li{display:flex;gap:8px;justify-content:space-between;font-size:var(--t-footnote)}
.cg-sugg li span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cg-sugg li em{font-style:normal;font-weight:600;font-variant-numeric:tabular-nums}
.cg-list{list-style:none;display:flex;flex-direction:column;gap:var(--s3)}
.cg-cols{display:none}
.cg-row{--e:var(--accent);padding:var(--s4);display:grid;gap:var(--s3);grid-template-columns:1fr 1fr;grid-template-areas:"name name" "w w" "o n" "a a";border-radius:var(--r-card);position:relative}
.cg-row::after{content:"";position:absolute;left:0;top:16px;bottom:16px;width:3px;border-radius:0 3px 3px 0;background:var(--e)}
.cg-row.enter{animation:vin .4s var(--ease)}
.cg-name{grid-area:name;display:flex;align-items:center;gap:var(--s2);min-width:0}
.cg-w{grid-area:w} .cg-n{grid-area:n} .cg-o{grid-area:o} .cg-a{grid-area:a}
.cg-edot{width:10px;height:10px;border-radius:3px;background:var(--e);flex:none}
.cg-nm{flex:1;min-width:0;height:44px;padding:0 10px;margin-left:-10px;background:transparent;border:1px solid transparent;border-radius:10px;outline:0;font-weight:600;letter-spacing:-.01em;text-overflow:ellipsis}
.cg-nm:hover{background:var(--hair)}
.cg-nm:focus{background:var(--hair);border-color:var(--accent)}
.cg-lb{display:block;font-size:var(--t-caption);font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2);margin-bottom:6px}
.cg-w .cg-step{width:100%;justify-content:space-between}
.cg-w .cg-step input{flex:1}
.cg-w .cg-step .pc{margin-left:-24px}
.cg-wr{display:block;width:100%;height:28px;margin:6px 0 0;background:transparent;-webkit-appearance:none;appearance:none;touch-action:pan-y}
.cg-wr::-webkit-slider-runnable-track{height:6px;border-radius:6px;background:linear-gradient(90deg,var(--e) var(--p,0%),var(--hair) var(--p,0%))}
.cg-wr::-moz-range-track{height:6px;border-radius:6px;background:var(--hair)}
.cg-wr::-moz-range-progress{height:6px;border-radius:6px;background:var(--e)}
.cg-wr::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;margin-top:-8px;border-radius:50%;background:#fff;border:0;box-shadow:0 1px 3px rgba(0,0,0,.35),0 0 0 1px rgba(0,0,0,.08)}
.cg-wr::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:0;box-shadow:0 1px 3px rgba(0,0,0,.35)}
.cg-nwrap{display:flex;align-items:center;height:44px;padding:0 12px;border-radius:var(--r-btn);background:var(--hair);border:1px solid transparent}
.cg-nwrap:focus-within{border-color:var(--accent)}
.cg-nwrap.bad{border-color:var(--danger)}
.cg-nwrap.ro{background:transparent;border:1px dashed var(--stroke)}
.cg-nwrap input,.cg-nwrap select{flex:1;min-width:0;width:100%;height:100%;background:none;border:0;outline:0;font-weight:600;font-variant-numeric:tabular-nums;padding:0}
.cg-nwrap select{appearance:none;-webkit-appearance:none;font-weight:500;text-overflow:ellipsis;cursor:pointer}
.cg-nwrap select option{color:#111;background:#fff}
.cg-nwrap input::placeholder{color:var(--ink-3);font-weight:500}
.cg-nwrap .of{color:var(--ink-3);font-size:var(--t-footnote);margin-left:4px;white-space:nowrap}
.cg-seg{display:flex;padding:3px;border-radius:var(--r-btn);background:var(--hair);height:44px}
.cg-seg button{flex:1;border-radius:10px;font-size:var(--t-footnote);font-weight:600;color:var(--ink-2);display:inline-flex;align-items:center;justify-content:center;gap:4px;transition:background .2s,color .2s}
.cg-seg button[aria-pressed=true]{color:var(--ink);background:var(--glass-2);box-shadow:var(--shadow),inset 0 1px 0 var(--spec)}
:root[data-theme=light] .cg-seg button[aria-pressed=true]{background:#fff}
.cg-a{display:flex;align-items:center;justify-content:space-between;padding-top:var(--s3);border-top:1px solid var(--hair)}
.cg-a .cg-lb{margin:0}
.cg-ap{white-space:nowrap;font-variant-numeric:tabular-nums;font-size:var(--t-footnote);font-weight:600}
.cg-ap small{font-weight:500;color:var(--ink-2)}
.cg-del{width:44px;height:44px;border-radius:var(--r-btn);display:grid;place-items:center;color:var(--ink-2);flex:none;transition:background .15s,color .15s,transform .1s}
.cg-del:active{transform:scale(.92);color:var(--danger-t);background:color-mix(in srgb,var(--danger) 15%,transparent)}
.cg-del.col{display:none;grid-area:del}
.cg-add{width:100%;min-height:52px;margin-top:var(--s3);display:flex;align-items:center;justify-content:center;gap:8px;border-radius:var(--r-card);border:1.5px dashed var(--stroke);color:var(--ink-2);font-weight:600;font-size:var(--t-footnote)}
.cg-add:active{transform:scale(.985)}
@media (hover:hover) and (pointer:fine){.cg-del:hover{color:var(--danger-t);background:color-mix(in srgb,var(--danger) 15%,transparent)}.cg-add:hover{background:var(--hair);color:var(--ink);border-color:var(--accent)}}
@media (min-width:760px){
  .cg-cols{display:grid;padding:0 var(--s4) var(--s2);font-size:var(--t-caption);font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3)}
  .cg-cols,.cg-row{grid-template-columns:minmax(120px,1fr) 150px 120px 130px 84px 44px;column-gap:var(--s2)}
  .cg-row{grid-template-areas:"name w o n a del";align-items:center;padding:var(--s3) var(--s4)}
  .cg-row .cg-lb{display:none}
  .cg-a{display:block;border:0;padding:0;text-align:right}
  .cg-name .cg-del{display:none}
  .cg-del.col{display:grid}
  .cg-w .cg-step,.cg-nwrap,.cg-seg{height:40px}
  .cg-wr{margin-top:0}
}
@media (min-width:1024px){
  .cg-chips{margin:0;padding:var(--s1) 0 var(--s3);flex-wrap:wrap;overflow:visible}
}
@media (min-width:1440px){
  .cg-layout{display:grid;grid-template-columns:380px minmax(0,1fr);gap:var(--s5);align-items:start}
  .cg-sum{position:sticky;top:84px;max-height:calc(100dvh - 100px);overflow:auto;overscroll-behavior:contain}
  .cg-cols,.cg-row{grid-template-columns:minmax(100px,1fr) 128px 96px 112px 66px 40px;column-gap:6px}
}

/* ----- Mensajes (solo lectura) ----- */
.mj-stage{position:relative}
.mj-list{display:flex;flex-direction:column;min-height:0;overflow:hidden}
.mj-head{padding:var(--s3) var(--s4) var(--s2);flex:none}
.mj-head h1{font-size:var(--t-large);font-weight:700;letter-spacing:-.03em;line-height:1.1}
.mj-sub{margin-top:var(--s1);color:var(--ink-2);font-size:var(--t-footnote);display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.mj-sub .sd{width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px color-mix(in srgb,var(--ok) 22%,transparent)}
.mj-sub .sd.old{background:var(--warn);box-shadow:0 0 0 3px color-mix(in srgb,var(--warn) 22%,transparent)}
.mj-seg{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:var(--s3);padding:3px;border-radius:var(--r-btn);background:var(--hair)}
.mj-seg button{height:40px;border-radius:10px;font-size:var(--t-footnote);font-weight:600;color:var(--ink-2);display:flex;align-items:center;justify-content:center;gap:6px;transition:background .2s,color .2s}
.mj-seg button[aria-pressed=true]{color:var(--ink);background:var(--glass-2);box-shadow:var(--shadow),inset 0 1px 0 var(--spec)}
:root[data-theme=light] .mj-seg button[aria-pressed=true]{background:#fff}
.mj-seg .n{min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--accent);color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center}
.mj-subj{display:flex;gap:var(--s2);overflow-x:auto;padding:var(--s3) 0 2px;scrollbar-width:none}
.mj-subj::-webkit-scrollbar{display:none}
.mj-pill{flex:none;display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 var(--s3);border-radius:var(--r-chip);font-size:var(--t-footnote);font-weight:600;color:var(--ink-2);background:var(--hair);border:1px solid transparent;white-space:nowrap}
.mj-pill .d{width:8px;height:8px;border-radius:50%;background:var(--c,var(--ink-3))}
.mj-pill[aria-pressed=true]{color:var(--ink);background:color-mix(in srgb,var(--c,var(--accent)) 20%,transparent);border-color:color-mix(in srgb,var(--c,var(--accent)) 55%,transparent)}
.mj-rows{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:var(--s2) var(--s2) var(--s4)}
.mj-row{--c:var(--accent);position:relative;display:flex;gap:var(--s3);width:100%;text-align:left;padding:var(--s3);border-radius:18px;min-height:76px;align-items:flex-start;transition:background .2s,transform .2s var(--ease)}
.mj-row:active{transform:scale(.985);background:var(--hair)}
.mj-row[aria-current=true]{background:color-mix(in srgb,var(--c) 14%,var(--hair))}
.mj-row+.mj-row::before{content:"";position:absolute;left:68px;right:var(--s3);top:0;height:1px;background:var(--hair)}
.mj-row[aria-current=true]::before,.mj-row[aria-current=true]+.mj-row::before{opacity:0}
.av{--c:var(--accent);position:relative;width:48px;height:48px;border-radius:50%;flex:none;display:grid;place-items:center;font-weight:700;font-size:var(--t-body);color:#fff;background:linear-gradient(135deg,color-mix(in srgb,var(--c) 88%,#000),color-mix(in srgb,var(--c) 52%,#000));box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 4px 12px color-mix(in srgb,var(--c) 30%,transparent)}
.av.sm{width:40px;height:40px;font-size:var(--t-footnote)}
.mj-rb{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.mj-r1{display:flex;align-items:baseline;gap:var(--s2)}
.mj-name{flex:1;min-width:0;font-weight:600;letter-spacing:-.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mj-when{flex:none;font-size:var(--t-footnote);color:var(--ink-2);font-variant-numeric:tabular-nums}
.mj-row.unread .mj-when{color:var(--accent);font-weight:600}
.mj-row.unread .mj-name{font-weight:700}
.mj-r2{display:flex;align-items:center;gap:var(--s2);min-width:0}
.mchip{flex:none;display:inline-flex;align-items:center;gap:5px;height:20px;max-width:100%;padding:0 8px;border-radius:var(--r-chip);font-size:11px;font-weight:600;white-space:nowrap;color:var(--c);background:color-mix(in srgb,var(--c) 16%,transparent);border:1px solid color-mix(in srgb,var(--c) 30%,transparent);overflow:hidden;text-overflow:ellipsis}
:root[data-theme=light] .mchip{color:color-mix(in srgb,var(--c) 55%,#000);background:color-mix(in srgb,var(--c) 20%,#fff)}
.mchip .d{width:6px;height:6px;border-radius:50%;background:var(--c);flex:none}
.mj-snip{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--ink-2);font-size:var(--t-footnote);line-height:1.4;overflow-wrap:anywhere}
.mj-row.unread .mj-snip{color:var(--ink)}
.mj-badge{flex:none;min-width:22px;height:22px;padding:0 7px;border-radius:11px;background:var(--accent);color:#fff;font-size:12px;font-weight:700;display:grid;place-items:center;margin-left:auto}
.mj-foot{flex:none;display:flex;align-items:center;justify-content:center;gap:6px;padding:var(--s3) var(--s4);font-size:var(--t-caption);color:var(--ink-2);text-align:center}
.mj-foot .i{width:13px;height:13px}
.mj-empty{margin:auto;max-width:300px;padding:var(--s8) var(--s4);text-align:center;display:flex;flex-direction:column;align-items:center;gap:var(--s2)}
.mj-empty .ico{width:72px;height:72px;border-radius:24px;display:grid;place-items:center;color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,var(--hair));border:1px solid var(--stroke);margin-bottom:var(--s3)}
.mj-empty .ico .i{width:30px;height:30px}
.mj-empty h3{font-size:var(--t-headline);font-weight:700}
.mj-empty p{color:var(--ink-2);font-size:var(--t-footnote);line-height:1.5}
.mj-thread{position:fixed;inset:0;z-index:45;display:flex;flex-direction:column;min-height:0;background:var(--bg);background-image:var(--mesh);background-attachment:fixed;transform:translateX(100%);transition:transform .35s var(--ease);visibility:hidden}
.mj-stage.show-thread .mj-thread{transform:none;visibility:visible}
.mj-th{display:flex;align-items:center;gap:var(--s2);padding:calc(var(--s2) + env(safe-area-inset-top,0px)) var(--s3) var(--s2) var(--s1);flex:none;background:var(--glass);backdrop-filter:blur(var(--blur)) saturate(180%);-webkit-backdrop-filter:blur(var(--blur)) saturate(180%);border-bottom:1px solid var(--hair)}
.mj-back{height:44px;min-width:44px;padding:0 var(--s2) 0 var(--s1);border-radius:var(--r-btn);display:flex;align-items:center;color:var(--accent);font-weight:500}
.mj-back .i{width:26px;height:26px;stroke-width:2.4}
.mj-tm{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.mj-tn{font-weight:700;letter-spacing:-.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mj-ts{display:flex;align-items:center;gap:var(--s2);color:var(--ink-2);font-size:var(--t-caption);min-width:0}
.mj-priv{display:inline-flex;align-items:center;gap:5px;color:var(--ink-2);font-size:var(--t-caption);height:24px;padding:0 var(--s2);border-radius:var(--r-chip);background:var(--hair);white-space:nowrap}
.mj-priv .i{width:12px;height:12px;color:var(--ok-t)}
.mj-msgs{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:var(--s4) var(--s4) var(--s6);display:flex;flex-direction:column;gap:3px}
.mj-day{align-self:center;margin:var(--s4) 0 var(--s2);padding:3px 12px;border-radius:var(--r-chip);font-size:var(--t-caption);font-weight:600;color:var(--ink-2);background:color-mix(in srgb,var(--bg) 88%,var(--glass-2));border:1px solid var(--hair);position:sticky;top:0;z-index:1}
.mj-note{align-self:center;display:flex;align-items:center;gap:6px;margin-bottom:var(--s3);padding:6px var(--s3);border-radius:var(--r-chip);font-size:var(--t-caption);color:var(--ink-2);background:var(--hair);text-align:center}
.mj-note .i{width:12px;height:12px;color:var(--ok-t);flex:none}
.mm{display:flex;flex-direction:column;max-width:min(80%,560px)}
.mm.in{align-self:flex-start;align-items:flex-start}
.mm.out{align-self:flex-end;align-items:flex-end}
.mm.first{margin-top:var(--s2)}
.mb{padding:9px 14px;border-radius:20px;line-height:1.42;overflow-wrap:anywhere;white-space:pre-wrap;-webkit-user-select:text;user-select:text}
.mm.in .mb{background:var(--glass-2);border:1px solid var(--hair);box-shadow:inset 0 1px 0 var(--spec)}
:root[data-theme=dark] .mm.in .mb{background:rgba(255,255,255,.09)}
.mm.out .mb{background:var(--bubble-user);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 4px 14px rgba(10,132,255,.28)}
.mm.in.first .mb{border-top-left-radius:20px}
.mm.in:not(.last) .mb{border-bottom-left-radius:8px}
.mm.in.last .mb{border-bottom-left-radius:6px}
.mm.in:not(.first) .mb{border-top-left-radius:8px}
.mm.out:not(.last) .mb{border-bottom-right-radius:8px}
.mm.out.last .mb{border-bottom-right-radius:6px}
.mm.out:not(.first) .mb{border-top-right-radius:8px}
.mb a{color:var(--accent);font-weight:500;text-decoration:underline;text-underline-offset:2px;border-radius:4px;padding:0 1px;background:color-mix(in srgb,var(--accent) 12%,transparent)}
.mm.out .mb a{color:#fff;background:rgba(255,255,255,.18)}
.mm-meta{margin:3px var(--s2) 0;font-size:var(--t-caption);color:var(--ink-2);font-variant-numeric:tabular-nums}
.mj-ro{flex:none;margin:0 var(--s3) calc(var(--s3) + env(safe-area-inset-bottom,0px));padding:var(--s3);display:flex;align-items:center;gap:var(--s3);border-radius:var(--r-card);flex-wrap:wrap}
.mj-ro .ic{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;flex:none;color:var(--ink-2);background:var(--hair)}
.mj-ro p{flex:1 1 140px;min-width:0;font-size:var(--t-footnote);line-height:1.35;color:var(--ink-2)}
.mj-ro p b{display:block;color:var(--ink);font-size:var(--t-body)}
.mj-ro .btn{flex:1 1 100%}
.mj-noth{display:none}
body.mj-open .fab,body.mj-open .tabbar{display:none}
@media (hover:hover) and (pointer:fine){.mj-row:hover{background:var(--hair)}.mj-row[aria-current=true]:hover{background:color-mix(in srgb,var(--c) 18%,var(--hair))}.evc:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.cbtn:hover,.mj-pill:hover{color:var(--ink)}.ai-btn:hover{filter:brightness(1.08)}}
@media (min-width:1024px){
  .mj-stage{display:grid;grid-template-columns:minmax(330px,390px) minmax(0,1fr);gap:var(--s4);height:calc(100dvh - 120px);min-height:520px}
  .mj-head{padding:var(--s5) var(--s5) var(--s2)}
  .mj-head h1{font-size:var(--t-title1)}
  .mj-thread{position:relative;inset:auto;z-index:auto;transform:none;visibility:visible;transition:none;border-radius:var(--r-card);overflow:hidden;border:1px solid var(--stroke);box-shadow:var(--shadow),0 0 0 1px var(--ring);background:var(--glass);backdrop-filter:blur(var(--blur)) saturate(180%);-webkit-backdrop-filter:blur(var(--blur)) saturate(180%)}
  .mj-th{padding:var(--s4) var(--s5);background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;gap:var(--s3)}
  .mj-back{display:none}
  .mj-msgs{padding:var(--s5) var(--s8) var(--s6)}
  .mj-ro{margin:0 var(--s5) var(--s5)}
  .mj-ro .btn{flex:none}
  .mm{max-width:min(70%,560px)}
  .mj-thread.none .mj-th,.mj-thread.none .mj-msgs,.mj-thread.none .mj-ro{display:none}
  .mj-thread.none .mj-noth{display:flex;margin:auto;flex-direction:column;align-items:center;text-align:center;gap:var(--s2);max-width:300px;color:var(--ink-2);font-size:var(--t-footnote)}
  .mj-noth .i{width:30px;height:30px}
  body.mj-open .fab{display:flex}
}

/* ===== Esqueleto de carga ===== */

/* ===== Tab bar iOS (móvil) ===== */
.tabbar{position:fixed;z-index:30;left:var(--s3);right:var(--s3);bottom:calc(var(--s2) + env(safe-area-inset-bottom,0px));height:var(--tabh);display:grid;grid-template-columns:repeat(5,1fr);gap:2px;padding:6px;border-radius:30px;box-shadow:var(--shadow-lg),0 0 0 1px var(--ring);max-width:520px;margin:0 auto;backdrop-filter:blur(var(--blur-thick)) saturate(180%);-webkit-backdrop-filter:blur(var(--blur-thick)) saturate(180%)}
.tab{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border-radius:24px;font-size:10px;font-weight:600;color:var(--ink-2);transition:color .2s,background .3s var(--ease),transform .1s}
.tab:active{transform:scale(.94)}
.tab[aria-current=page]{color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,transparent)}
.tab .i{width:23px;height:23px}
.nb{min-width:17px;height:17px;padding:0 5px;border-radius:9px;background:var(--danger);color:#fff;font-size:10px;font-weight:700;display:grid;place-items:center}
.tab .nb{position:absolute;top:4px;left:calc(50% + 6px);box-shadow:0 0 0 2px var(--bg)}

/* ===== FAB Tutor IA ===== */
.fab{position:fixed;z-index:31;right:var(--s4);bottom:calc(var(--tabh) + var(--s4) + env(safe-area-inset-bottom,0px) + var(--s2));display:flex;align-items:center;gap:var(--s2);height:52px;padding:0 var(--s4);border-radius:26px;color:#fff;font-weight:600;font-size:var(--t-body);
  background:linear-gradient(135deg,#5e84ff 0%,#0A84FF 45%,#bf5af2 100%);border:1px solid rgba(255,255,255,.35);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 2px 6px rgba(0,0,0,.3),0 14px 34px rgba(10,132,255,.45);transition:transform .35s var(--ease),opacity .25s}
.fab:active{transform:scale(.95)}
.fab .i{width:22px;height:22px}
.fab::before{content:"";position:absolute;inset:-5px;border-radius:inherit;border:1px solid rgba(100,160,255,.5);animation:fpulse 3.2s ease-out infinite;pointer-events:none}
@keyframes fpulse{0%{opacity:.7;transform:scale(.96)}70%,100%{opacity:0;transform:scale(1.14)}}
.fab span{display:none}
body.tutor-open .fab{opacity:0;pointer-events:none;transform:scale(.8)}

/* ===== Tutor IA: bottom sheet (móvil) / drawer (desktop) ===== */
.scrim{position:fixed;inset:0;z-index:40;background:var(--scrim);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .35s var(--ease)}
body.tutor-open #scrim{opacity:1;pointer-events:auto}
.tutor{position:fixed;z-index:50;display:flex;flex-direction:column;overflow:hidden;left:0;right:0;bottom:0;height:min(88dvh,780px);border-radius:var(--r-sheet) var(--r-sheet) 0 0;
  background:var(--glass);backdrop-filter:blur(var(--blur-thick)) saturate(180%);-webkit-backdrop-filter:blur(var(--blur-thick)) saturate(180%);
  border:1px solid var(--stroke);border-bottom:0;box-shadow:var(--shadow-lg),0 0 0 1px var(--ring);transition:transform .4s var(--ease)}
:root[data-theme=dark] .tutor{background:rgba(24,24,28,.78)}
:root[data-theme=light] .tutor{background:rgba(250,251,254,.9)}
.tutor.closed{transform:translateY(106%);pointer-events:none}
.tutor.dragging{transition:none}
.grab{display:grid;place-items:center;height:24px;flex:none;touch-action:none;cursor:grab}
.grab i{width:38px;height:5px;border-radius:3px;background:var(--ink-3)}
.t-head{display:flex;align-items:center;gap:var(--s3);padding:2px var(--s4) var(--s3);flex:none}
.persona{position:relative;width:44px;height:44px;border-radius:15px;display:grid;place-items:center;color:#fff;font-weight:700;font-size:15px;background:linear-gradient(145deg,color-mix(in srgb,var(--c) 90%,#fff),color-mix(in srgb,var(--c) 55%,#3a2cff));border:1px solid rgba(255,255,255,.35);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 6px 16px color-mix(in srgb,var(--c) 45%,transparent);flex:none}
.persona::after{content:"";position:absolute;right:-2px;bottom:-2px;width:12px;height:12px;border-radius:50%;background:var(--ok);border:2px solid var(--bg)}
.t-who{flex:1;min-width:0}
.t-who b{display:block;font-size:var(--t-headline);font-weight:650;letter-spacing:-.015em;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.t-who span{display:block;font-size:var(--t-footnote);color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.t-head .icon-btn{background:var(--chip-bg)}
.t-courses{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:0 var(--s4) var(--s3);flex:none;border-bottom:1px solid var(--hair)}
.t-courses::-webkit-scrollbar{display:none}
.cc{--c:var(--accent);display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:0 12px;border-radius:var(--r-chip);font-size:12px;font-weight:600;color:var(--ink-2);background:var(--chip-bg);border:1px solid var(--hair);white-space:nowrap}
.cc[aria-pressed=true]{color:var(--ink);background:color-mix(in srgb,var(--c) 20%,transparent);border-color:color-mix(in srgb,var(--c) 50%,transparent)}
.cc .dot{width:7px;height:7px;box-shadow:none}
.msgs{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:var(--s4);display:flex;flex-direction:column;gap:var(--s4);-webkit-overflow-scrolling:touch}
.m{display:flex;gap:10px;max-width:100%}
.m.user{justify-content:flex-end}
.m .bub{min-width:0;-webkit-user-select:text;user-select:text}
.m.user .bub{max-width:88%;padding:10px 14px;border-radius:20px 20px 6px 20px;background:var(--bubble-user);color:#fff;line-height:1.45;box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 6px 16px rgba(10,132,255,.28);overflow-wrap:anywhere;white-space:pre-wrap}
.m.ai .mini{--c:var(--accent);width:28px;height:28px;border-radius:10px;font-size:11px;margin-top:2px;flex:none;display:grid;place-items:center;color:#fff;font-weight:700;background:linear-gradient(145deg,color-mix(in srgb,var(--c) 90%,#fff),color-mix(in srgb,var(--c) 55%,#3a2cff));border:1px solid rgba(255,255,255,.3)}
.m.ai .bub{flex:1;padding:12px 14px;border-radius:6px 20px 20px 20px;background:var(--glass-2);border:1px solid var(--hair);box-shadow:inset 0 1px 0 var(--spec)}
:root[data-theme=dark] .m.ai .bub{background:rgba(255,255,255,.07)}
.m.ai.err .bub{border-color:color-mix(in srgb,var(--danger) 45%,transparent);background:color-mix(in srgb,var(--danger) 10%,transparent)}
.prov{margin-top:8px;font-size:11px;color:var(--ink-3);display:flex;align-items:center;gap:6px}
.md{--c:var(--accent);font-size:var(--t-body);line-height:1.55;overflow-wrap:anywhere}
.md>*+*{margin-top:10px}
.md strong{font-weight:650}
.md em{font-style:italic}
.md ol,.md ul{display:flex;flex-direction:column;gap:8px}
.md ol{counter-reset:s}
.md ol>li{counter-increment:s;position:relative;padding-left:30px}
.md ol>li::before{content:counter(s);position:absolute;left:0;top:1px;width:21px;height:21px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;color:var(--accent);background:color-mix(in srgb,var(--c) 18%,transparent);border:1px solid color-mix(in srgb,var(--c) 34%,transparent)}
.md ul>li{position:relative;padding-left:20px}
.md ul>li::before{content:"";position:absolute;left:5px;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--c)}
.md code{font-family:"JetBrains Mono","SF Mono",ui-monospace,Menlo,Consolas,monospace;font-size:.86em;padding:1px 6px;border-radius:7px;background:var(--chip-bg);border:1px solid var(--hair);color:var(--c-f)}
.md h4{font-size:var(--t-body);font-weight:700;letter-spacing:-.01em}
.md a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.md hr{border:0;height:1px;background:var(--hair)}
.md .tip{display:block;padding:10px 12px;border-radius:14px;background:color-mix(in srgb,var(--c) 12%,transparent);border:1px solid color-mix(in srgb,var(--c) 28%,transparent);font-size:var(--t-footnote);line-height:1.5}
.code{border-radius:16px;overflow:hidden;background:var(--code-bg);border:1px solid var(--stroke);box-shadow:0 0 0 1px var(--ring);margin-top:12px}
.md>.code{margin-top:12px}
.code-h{display:flex;align-items:center;gap:8px;padding:4px 6px 4px 12px;border-bottom:1px solid var(--hair);font-size:12px;color:var(--ink-2);font-weight:500}
.code-h .lang{display:inline-flex;align-items:center;gap:6px;text-transform:lowercase}
.code-h .lang .i{width:14px;height:14px}
.code-h .btn{min-height:36px;padding:0 10px;font-size:12px;margin-left:auto;background:transparent;border-color:transparent;box-shadow:none;color:var(--ink-2)}
.code pre{margin:0;padding:12px 14px;overflow-x:auto;overscroll-behavior-x:contain;font-family:"JetBrains Mono","SF Mono",ui-monospace,Menlo,Consolas,monospace;font-size:12.5px;line-height:1.65;color:var(--code-ink);tab-size:4;-webkit-user-select:text;user-select:text}
.code pre code{all:unset;white-space:pre}
.hk{color:var(--c-k)}.hs{color:var(--c-s)}.hn{color:var(--c-n)}.hc{color:var(--c-c);font-style:italic}
.typing{display:inline-flex;gap:4px;padding:6px 0}
.typing i{width:7px;height:7px;border-radius:50%;background:var(--ink-3);animation:bl 1.2s infinite var(--ease)}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes bl{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-4px);opacity:1}}
.sugg{display:flex;flex-wrap:wrap;gap:8px;padding:0 var(--s4) var(--s2);flex:none}
.sugg button{min-height:36px;padding:0 14px;border-radius:var(--r-chip);font-size:var(--t-footnote);font-weight:500;color:var(--accent);background:var(--glass-2);border:1px solid var(--stroke);box-shadow:0 0 0 1px var(--ring);text-align:left;transition:transform .12s var(--ease)}
.sugg button:active{transform:scale(.96)}
.comp{flex:none;padding:var(--s2) var(--s3) calc(var(--s3) + env(safe-area-inset-bottom,0px));position:relative}
.box{display:flex;flex-direction:column;border-radius:24px;padding:6px 6px 6px 14px;background:var(--glass-2);border:1px solid var(--stroke);box-shadow:var(--shadow),0 0 0 1px var(--ring);transition:border-color .2s,box-shadow .2s}
:root[data-theme=dark] .box{background:rgba(255,255,255,.08)}
.box:focus-within{border-color:color-mix(in srgb,var(--accent) 70%,transparent);box-shadow:var(--shadow),0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
.box textarea{width:100%;resize:none;border:0;outline:0;background:transparent;line-height:1.4;padding:8px 0 4px;min-height:44px;max-height:120px}
.box textarea::placeholder{color:var(--ink-3)}
.box-row{display:flex;align-items:center;gap:6px}
.model{position:relative}
.model>button{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 10px 0 8px;border-radius:var(--r-chip);font-size:12px;font-weight:600;color:var(--ink-2);background:var(--chip-bg);border:1px solid var(--hair)}
.model>button .i{width:14px;height:14px}
.model>button .sd{width:7px;height:7px;border-radius:50%;background:var(--ok)}
.menu{position:absolute;left:0;bottom:calc(100% + 8px);width:min(272px,calc(100vw - 48px));padding:6px;border-radius:18px;background:var(--glass-2);backdrop-filter:blur(var(--blur-thick)) saturate(180%);-webkit-backdrop-filter:blur(var(--blur-thick)) saturate(180%);border:1px solid var(--stroke);box-shadow:var(--shadow-lg),0 0 0 1px var(--ring);transform-origin:bottom left;transform:scale(.92) translateY(6px);opacity:0;pointer-events:none;visibility:hidden;transition:transform .25s var(--ease),opacity .2s,visibility 0s .25s;z-index:5}
:root[data-theme=dark] .menu{background:rgba(40,40,46,.92)}
.menu.show{transform:none;opacity:1;pointer-events:auto;visibility:visible;transition:transform .25s var(--ease),opacity .2s}
.menu button{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:10px;border-radius:12px;min-height:48px}
.menu button b{display:block;font-size:var(--t-footnote);font-weight:600;line-height:1.3}
.menu button small{display:block;font-size:12px;color:var(--ink-2);line-height:1.3}
.menu button .chk{margin-left:auto;color:var(--accent);opacity:0}
.menu button[aria-checked=true] .chk{opacity:1}
.menu button[aria-checked=true]{background:var(--chip-bg)}
.send{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:var(--accent-ink);margin-left:auto;box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 6px 16px color-mix(in srgb,var(--accent) 45%,transparent);transition:transform .12s var(--ease),opacity .2s}
.send:active{transform:scale(.92)}
.send:disabled{opacity:.4;box-shadow:none}
.fine{text-align:center;font-size:11px;color:var(--ink-3);margin-top:8px;line-height:1.35}

/* ===== Ajustes (dialog) ===== */
dialog.cfg{padding:0;border:1px solid var(--stroke);color:var(--ink);width:min(460px,calc(100vw - 24px));max-height:calc(100dvh - 32px);overflow:auto;border-radius:var(--r-sheet);background:var(--glass-2);backdrop-filter:blur(var(--blur-thick)) saturate(180%);-webkit-backdrop-filter:blur(var(--blur-thick)) saturate(180%);box-shadow:var(--shadow-lg),0 0 0 1px var(--ring)}
:root[data-theme=dark] dialog.cfg{background:rgba(28,28,34,.9)}
dialog.cfg::backdrop{background:var(--scrim);backdrop-filter:blur(3px)}
.cfg form{padding:var(--s5);display:grid;gap:var(--s4)}
.cfg h2{font-size:var(--t-title3);font-weight:700;letter-spacing:-.02em;display:flex;align-items:center;justify-content:space-between}
.cfg label.f{display:grid;gap:6px;font-size:var(--t-footnote);font-weight:600;color:var(--ink-2)}
.cfg input[type=url]{height:48px;padding:0 14px;border-radius:var(--r-btn);background:var(--hair);border:1px solid var(--stroke);outline:0;width:100%}
.cfg input[type=url]:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
.cfg .hint{font-size:12px;color:var(--ink-2);line-height:1.4}
.cfg .msg{font-size:var(--t-footnote);min-height:1.3em}
.cfg .msg.ok{color:var(--ok-t)} .cfg .msg.bad{color:var(--danger-t)}
.cfg .acts{display:flex;gap:var(--s2);flex-wrap:wrap}
.cfg .acts .btn{flex:1 1 120px}

/* toast */
.toast{position:fixed;z-index:80;left:50%;bottom:calc(var(--tabh) + 40px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);opacity:0;pointer-events:none;padding:10px 16px;border-radius:99px;font-size:var(--t-footnote);font-weight:600;transition:opacity .3s var(--ease),transform .3s var(--ease);max-width:calc(100vw - 32px);text-align:center}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* vista */

/* ===== Hover solo con puntero fino ===== */
@media (hover:hover) and (pointer:fine){
  .card:hover,.task:hover,.post:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg),0 0 0 1px var(--ring),inset 0 1px 0 var(--spec)}
  .card:hover{border-color:color-mix(in srgb,var(--c) 55%,var(--stroke))}
  .icon-btn:hover,.status:hover{background:var(--hair)}
  .tab:hover{color:var(--ink)}
  .fab:hover{transform:translateY(-2px) scale(1.03)}
  .sugg button:hover,.btn:hover{background:var(--glass-2)}
  .btn.pri:hover{filter:brightness(1.08);background:var(--accent)}
  .nav-i:hover,.nav-c:hover{background:var(--hair)}
  .seg button:hover:not([aria-pressed=true]){color:var(--ink)}
  .day:hover:not([aria-pressed=true]){background:var(--hair)}
  .row:hover{border-color:var(--stroke)}
  .nav-b:hover,.today-b:hover{background:var(--glass-2)}
  .fchip:hover{border-color:var(--stroke)}
  .cc:hover{color:var(--ink)}
}

/* ===== ≥ 600px ===== */
@media (min-width:600px){
  .grid{grid-template-columns:repeat(2,1fr)}
  .task{width:288px}
  .main{padding-left:var(--s6);padding-right:var(--s6)}
  .top{margin:0 calc(var(--s6) * -1);padding-left:var(--s6);padding-right:var(--s6)}
  .due{margin:0 calc(var(--s6) * -1);padding-left:var(--s6);padding-right:var(--s6)}
  .tutor{left:50%;right:auto;width:min(640px,100%);margin-left:calc(min(640px,100%) / -2)}
}
@media (min-width:720px){
  .chero{grid-template-columns:1.1fr 1fr;align-items:center;padding:var(--s6) 28px;gap:var(--s8)}
  .chero h2{font-size:var(--t-title1)}
  .tools{flex-direction:row;align-items:center;justify-content:space-between}
  .cal{padding:var(--s5)}
  .day{min-height:112px;align-items:stretch;padding:8px 6px;gap:6px}
  .day .num{width:26px;height:26px;font-size:var(--t-footnote);align-self:flex-start;margin-left:2px}
  .dots{display:none}
  .pills{display:grid;gap:3px}
  .dows,.days{gap:6px}
  .row{grid-template-columns:auto 1fr auto;align-items:center}
  .r-side{grid-column:3;margin-top:0;justify-content:flex-end;min-width:210px}
  .rel{margin-right:0}
}

/* ===== Desktop ≥ 1024px ===== */
@media (min-width:1024px){
  :root{--tabh:0px}
  .app{display:grid;grid-template-columns:288px minmax(0,1fr)}
  .side{display:flex;flex-direction:column;gap:var(--s4);position:sticky;top:var(--s4);height:calc(100dvh - 32px);margin:var(--s4) 0 var(--s4) var(--s4);padding:var(--s4);border-radius:var(--r-sheet);
    backdrop-filter:blur(var(--blur-thick)) saturate(180%);-webkit-backdrop-filter:blur(var(--blur-thick)) saturate(180%);overflow:auto;overscroll-behavior:contain}
  .brand{display:flex;align-items:center;gap:var(--s3);padding:var(--s1) var(--s2)}
  .logo{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#5e84ff,#bf5af2);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 6px 16px rgba(94,132,255,.4)}
  .brand b{display:block;font-size:var(--t-headline);letter-spacing:-.02em;line-height:1.1}
  .brand small{color:var(--ink-2);font-size:var(--t-caption)}
  .nav{display:flex;flex-direction:column;gap:2px}
  .nav-i{display:flex;align-items:center;gap:var(--s3);min-height:44px;padding:0 var(--s3);border-radius:var(--r-btn);color:var(--ink-2);font-weight:500;transition:background .15s}
  .nav-i[aria-current=page]{background:color-mix(in srgb,var(--accent) 20%,transparent);color:var(--ink);font-weight:600}
  .nav-i[aria-current=page] .i{color:var(--accent)}
  .nav-i .nb{margin-left:auto;min-width:20px;height:20px;border-radius:10px;font-size:11px}
  .nav-h{margin:var(--s2) var(--s3) 2px;font-size:var(--t-caption);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
  .nav-c{--c:var(--accent);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:2px var(--s3);min-height:48px;padding:6px var(--s3);border-radius:var(--r-btn);color:var(--ink);font-size:var(--t-footnote);font-weight:500;transition:background .15s}
  .nav-c[aria-current=page]{background:var(--glass-2);box-shadow:0 0 0 1px var(--ring),0 1px 3px rgba(0,0,0,.15)}
  .nav-c .bar{grid-column:2 / 4;height:3px;border-radius:2px;background:color-mix(in srgb,var(--c) 22%,transparent);overflow:hidden}
  .nav-c .bar i{display:block;height:100%;background:var(--c);border-radius:2px}
  .nav-c span.t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .nav-c em{font-style:normal;font-size:12px;color:var(--ink-2);font-variant-numeric:tabular-nums}
  .me{margin-top:auto;display:flex;align-items:center;gap:var(--s3);padding:var(--s3);border-radius:var(--r-btn);background:var(--hair);text-align:left;width:100%}
  .me b{display:block;font-size:var(--t-footnote);font-weight:600}
  .me small{color:var(--ink-2);font-size:var(--t-caption)}
  .main{padding:0 var(--s8) var(--s8);width:100%}
  .top{margin:0 calc(var(--s8) * -1);padding:var(--s4) var(--s8) var(--s3)}
  .top-bar{padding-left:var(--s5);gap:var(--s2)}
  .mini-title{display:block;margin-right:auto;margin-left:0}
  .top.scrolled .search{display:flex}
  .top.scrolled .mini-title{display:block}
  .search{flex:0 1 340px;margin-left:auto}
  .kbd{display:inline-block}
  .status span{display:inline}
  .hero{margin-top:calc(var(--s2) * -1)}
  .hero h1{font-size:44px;letter-spacing:-.032em}
  .due{margin:0 calc(var(--s8) * -1);padding:var(--s1) var(--s8) var(--s4);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 24px,#000 calc(100% - 48px),transparent);mask-image:linear-gradient(90deg,transparent 0,#000 24px,#000 calc(100% - 48px),transparent)}
  .grid{grid-template-columns:repeat(3,1fr);gap:var(--s5)}
  .tabbar{display:none}
  .fab{right:var(--s8);bottom:var(--s8);height:56px;border-radius:28px;padding:0 var(--s5) 0 var(--s4)}
  .fab span{display:inline}
  .toast{bottom:32px}
  .grab{display:none}
  .scrim{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;pointer-events:none!important}
  .tutor{left:auto;top:var(--s3);right:var(--s3);bottom:var(--s3);height:auto;width:416px;margin-left:0;border-radius:var(--r-sheet);border-bottom:1px solid var(--stroke)}
  .tutor.closed{transform:translateX(112%)}
  .t-head{padding-top:var(--s4)}
  body.lock{overflow:auto}
}
@media (max-width:420px){
  .facts{grid-template-columns:1fr 1fr}.facts .fact:first-child{grid-column:1 / -1}
  .mhero h1{font-size:26px}
  .mhero .prg{width:64px;height:64px}
  .unit .n{font-size:30px}
  .p-foot .btn{flex:1}
}
@media (prefers-reduced-transparency:reduce){
  .glass,.pill-s,.tutor,.tabbar,.menu,dialog.cfg,.mhero,.chero{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:var(--glass-2)}
}
@media (prefers-contrast:more){
  :root{--stroke:rgba(255,255,255,.5);--ink-2:rgba(255,255,255,.8);--ink-3:rgba(255,255,255,.65)}
  :root[data-theme=light]{--stroke:rgba(0,0,0,.35);--ink-2:rgba(0,0,0,.75);--ink-3:rgba(0,0,0,.6);--ring:rgba(0,0,0,.35)}
}

/* =====================================================================
   MOTION — implementa docs/design/AUDITORIA-ANIMACIONES.md (T0–T15)
   Reglas: solo transform/opacity; blur/backdrop nunca animados; interrumpible
   (transiciones CSS); reduced-motion = sin movimiento, solo fundidos cortos.
   ===================================================================== */

/* ---- T0: tokens de movimiento ---- */
:root{
  --ease:cubic-bezier(0.32,0.72,0,1);
  --ease-out:cubic-bezier(0.23,1,0.32,1);
  --ease-in-out:cubic-bezier(0.77,0,0.175,1);
  --spring-soft:linear(0,0.218,0.556,0.805,0.941,0.999,1.014,1.014,1.008,1.004,1.001,1,1,1,1,1,1);
  --spring-tight:linear(0,0.249,0.589,0.814,0.929,0.978,0.996,1.001,1.001,1.001,1.001,1,1,1,1);
  --dur-press:120ms;--dur-release:320ms;--dur-fast:180ms;--dur-base:260ms;
  --dur-sheet-in:420ms;--dur-sheet-out:300ms;--dur-enter:420ms;--stagger:40ms;
}

/* ---- T2: press feedback asimétrico y hover suave ---- */
.task,.card,.row,.post,.evc,.cg-row{transition:transform var(--dur-release) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out),border-color var(--dur-fast)}
.task:active,.card:active{transform:scale(.975);transition-duration:var(--dur-press)}
.evc:active{transform:scale(.985);transition-duration:var(--dur-press)}
.btn,.fchip,.sugg button,.tab,.nav-b,.day,.send,.icon-btn,.cbtn,.cg-preset,.mj-pill,.mj-row,.cc,.au-tabs button{transition-timing-function:var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .card:hover,.task:hover,.post:hover,.evc:hover{transition-duration:var(--dur-fast)}
}

/* ---- T1: entrada de vistas y tarjetas (el estado final lo da el CSS normal, no la animación) ---- */
.view{animation:vin var(--dur-fast) var(--ease-out) backwards}
@keyframes vin{from{opacity:0}}
@media (prefers-reduced-motion:no-preference){
  .rise{animation:rise var(--dur-enter) var(--ease) backwards;animation-delay:calc(min(var(--d,0),6) * var(--stagger))}
  @keyframes rise{from{opacity:0;transform:translateY(10px) scale(.985)}}
}

/* ---- T13: presupuesto de GPU en móvil: blur solo en barras, hojas, menú y diálogo ---- */
@media (max-width:600px),(pointer:coarse){
  .glass:not(.top-bar):not(.tabbar):not(.msheet):not(.toast),.pill-s,.mhero,.chero{backdrop-filter:none;-webkit-backdrop-filter:none}
  .glass:not(.top-bar):not(.tabbar):not(.msheet):not(.toast){background:color-mix(in srgb,var(--bg) 40%,var(--glass-2))}
  .tabbar,.tutor{--blur-thick:28px}
  body{background-attachment:scroll}
  dialog.cfg::backdrop{backdrop-filter:none;-webkit-backdrop-filter:none}
}

/* ---- T3: indicador deslizante (tab bar, sidebar, segmentados, pestañas del aula) ---- */
.tabbar{--n:5}
.tab-pill{position:absolute;top:6px;bottom:6px;left:6px;width:calc((100% - 12px - (var(--n) - 1) * 2px) / var(--n));border-radius:24px;background:color-mix(in srgb,var(--accent) 14%,transparent);transform:translateX(calc(var(--i,0) * (100% + 2px)));transition:transform 360ms var(--ease);transition-timing-function:var(--spring-tight);pointer-events:none}
.tab[aria-current=page]{background:none}
.tab{transition:color var(--dur-fast),transform var(--dur-press) var(--ease-out)}
.side .nav{position:relative}
.nav-pill{position:absolute;left:0;right:0;top:0;height:44px;border-radius:var(--r-btn);background:color-mix(in srgb,var(--accent) 20%,transparent);transform:translateY(var(--y,0px));transition:transform 360ms var(--ease),opacity var(--dur-fast);transition-timing-function:var(--spring-tight),ease;pointer-events:none}
.nav-i[aria-current=page]{background:none}
.nav-i{position:relative;transition:background var(--dur-fast),color var(--dur-fast)}
.has-pill{position:relative}
.has-pill>button,.has-pill>a{position:relative;z-index:1}
.has-pill>button[aria-pressed=true],.has-pill>button[aria-selected=true],.has-pill>a[aria-pressed=true],.has-pill>a[aria-selected=true]{background:none!important;box-shadow:none!important}
.spill{position:absolute;left:0;top:0;z-index:0;background:var(--glass-2);box-shadow:var(--shadow),inset 0 1px 0 var(--spec);transition:transform 360ms var(--ease);transition-timing-function:var(--spring-tight);pointer-events:none}
:root[data-theme=light] .spill{background:#fff}
.seg button,.au-tabs button,.mj-seg button,.cg-seg button{transition:color var(--dur-fast)}

/* ---- T4: transición entre vistas (View Transitions) ---- */
html[data-nav-dir]:not([data-nav-dir=theme]) #view{view-transition-name:view}
html[data-nav-dir] .view{animation:none}
::view-transition-group(root){animation:none}
::view-transition-old(view),::view-transition-new(view){animation-duration:var(--dur-fast);animation-timing-function:var(--ease-out)}
html[data-nav-dir=push]::view-transition-old(view){animation:vt-out-l 260ms var(--ease) both}
html[data-nav-dir=push]::view-transition-new(view){animation:vt-in-r 340ms var(--ease) both}
html[data-nav-dir=pop]::view-transition-old(view){animation:vt-out-r 260ms var(--ease) both}
html[data-nav-dir=pop]::view-transition-new(view){animation:vt-in-l 340ms var(--ease) both}
@keyframes vt-in-r{from{opacity:0;transform:translateX(28px)}}
@keyframes vt-out-l{to{opacity:0;transform:translateX(-10px)}}
@keyframes vt-in-l{from{opacity:0;transform:translateX(-28px)}}
@keyframes vt-out-r{to{opacity:0;transform:translateX(10px)}}
html[data-nav-dir]:not([data-nav-dir=theme])::view-transition-old(root){display:none}
html[data-nav-dir]:not([data-nav-dir=theme])::view-transition-new(root){animation:none}
/* ---- T7: cambio de tema suave ---- */
html[data-nav-dir=theme]::view-transition-old(root),html[data-nav-dir=theme]::view-transition-new(root){animation-duration:260ms;animation-timing-function:var(--ease-out)}
html[data-nav-dir=theme]::view-transition-old(view),html[data-nav-dir=theme]::view-transition-new(view){animation-duration:260ms}
html.theme-fade,html.theme-fade body,html.theme-fade .glass,html.theme-fade .card,html.theme-fade .tabbar,html.theme-fade .top-bar{transition:background-color .25s var(--ease-out),color .25s var(--ease-out),border-color .25s var(--ease-out),box-shadow .25s var(--ease-out)}

/* ---- T5: hojas iOS (Tutor, detalle, Más): scrim ligado, salida más rápida que la entrada ---- */
.scrim{backdrop-filter:none;-webkit-backdrop-filter:none;transition:opacity var(--dur-sheet-in) var(--ease)}
body:not(.tutor-open) .scrim:not(.e):not(.m){transition-duration:var(--dur-sheet-out)}
.scrim.dragging{transition:none}
.tutor{transition:transform var(--dur-sheet-in) var(--ease)}
.tutor.closed{transition-duration:var(--dur-sheet-out)}
.tutor.dragging{will-change:transform}
.t-head{touch-action:none}
.t-head .icon-btn{touch-action:manipulation}
.esheet{transition:transform var(--dur-sheet-out) var(--ease),visibility 0s var(--dur-sheet-out)}
.esheet.open{transition:transform var(--dur-sheet-in) var(--ease),visibility 0s}
.esheet.dragging{will-change:transform;transition:none}
.msheet{transition:transform var(--dur-sheet-out) var(--ease),visibility 0s var(--dur-sheet-out)}
.msheet.open{transition:transform var(--dur-sheet-in) var(--ease),visibility 0s}
.mj-thread{transition:transform var(--dur-sheet-in) var(--ease),visibility 0s var(--dur-sheet-in)}
.mj-stage.show-thread .mj-thread{transition:transform var(--dur-sheet-in) var(--ease),visibility 0s}

/* ---- T14: el drawer flota sobre el contenido (sin reflow del main) ---- */

/* ---- T6: burbujas del chat ---- */
@media (prefers-reduced-motion:no-preference){
  .m-in{animation:min var(--dur-base) var(--ease-out) backwards}
  .m.user.m-in{transform-origin:100% 100%}
  .m.ai.m-in{transform-origin:0 100%}
  @keyframes min{from{opacity:0;transform:translateY(8px) scale(.98)}}
}

/* ---- T8: anillos con stroke-dashoffset (sin repintar dasharray) ---- */
.prg .bar{stroke-dasharray:100;stroke-dashoffset:calc(100 - var(--p));transition:none;filter:none}
.egr .bar{stroke-dasharray:100;stroke-dashoffset:calc(100 - var(--p,0));filter:none}
@media (min-width:601px) and (pointer:fine){
  .prg .bar{filter:drop-shadow(0 0 6px color-mix(in srgb,var(--c) 55%,transparent))}
  .egr .bar{filter:drop-shadow(0 0 5px color-mix(in srgb,var(--pk) 50%,transparent))}
}
@media (prefers-reduced-motion:no-preference){
  .anim .prg .bar,.anim .egr .bar{animation:ringin 800ms var(--ease) 60ms backwards}
  @keyframes ringin{from{stroke-dashoffset:100}}
}

/* ---- T9: skeleton coherente, shimmer en el compositor ---- */
.skel{position:relative;overflow:hidden;min-height:196px;background:var(--hair);border-radius:var(--r-card);animation:none}
.skel::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,var(--glass-2) 50%,transparent 70%);transform:translateX(-100%);animation:sh 1.4s linear infinite}
@keyframes sh{to{transform:translateX(100%)}}
.sk-line{height:16px;border-radius:8px;background:var(--hair);position:relative;overflow:hidden}

/* ---- T10: toast con resorte, menú, insignias ---- */
.toast{transition:opacity var(--dur-base) var(--ease-out),transform 360ms var(--ease-out)}
.toast.show{transition-timing-function:var(--ease-out),var(--spring-soft)}
.menu{transition:transform var(--dur-base) var(--ease),opacity var(--dur-fast),visibility 0s 150ms}
.menu.show{transition:transform var(--dur-base) var(--ease),opacity var(--dur-fast),visibility 0s}
.menu button .chk{transform:scale(.6);transition:opacity var(--dur-fast),transform var(--dur-fast) var(--ease-out)}
.menu button[aria-checked=true] .chk{transform:none}
.cc{transition:background var(--dur-fast),border-color var(--dur-fast),color var(--dur-fast)}
@media (prefers-reduced-motion:no-preference){
  .nb.pop{animation:nbpop 300ms var(--spring-soft)}
  @keyframes nbpop{from{transform:scale(.6)}}
}

/* ---- T11: título de la barra superior que colapsa (móvil) ---- */
@media (max-width:1023px){
  .mini-title{display:block;position:absolute;opacity:0;transform:translateY(4px);pointer-events:none;transition:opacity var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out)}
  .top.scrolled .mini-title{position:static;opacity:1;transform:none;pointer-events:auto}
  .search{transition:opacity var(--dur-fast),border-color .2s,background .2s}
  .top.scrolled .search{display:flex;opacity:0;pointer-events:none}
}

/* ---- T12: diálogo de Ajustes con entrada/salida ---- */
dialog.cfg{opacity:0;transform:translateY(100%);transition:opacity var(--dur-base) var(--ease-out),transform 380ms var(--ease),overlay 380ms allow-discrete,display 380ms allow-discrete}
dialog.cfg[open]{opacity:1;transform:none}
@starting-style{dialog.cfg[open]{opacity:0;transform:translateY(100%)}}
dialog.cfg::backdrop{opacity:0;transition:opacity var(--dur-base),overlay var(--dur-base) allow-discrete,display var(--dur-base) allow-discrete}
dialog.cfg[open]::backdrop{opacity:1}
@starting-style{dialog.cfg[open]::backdrop{opacity:0}}
@media (min-width:600px){
  dialog.cfg{transform:scale(.96);transition-duration:160ms,240ms,160ms,160ms}
  dialog.cfg[open]{transform:none;transition-duration:240ms,240ms,240ms,240ms}
  @starting-style{dialog.cfg[open]{transform:scale(.96);opacity:0}}
}

/* ---- T15: microdetalles ---- */
.unit .n.tick{animation:tick 140ms var(--ease-out)}
@keyframes tick{from{opacity:.4;transform:translateY(4px)}}
.login:not([hidden]){animation:vin var(--dur-base) var(--ease-out) backwards}
.login:not([hidden]) .lcard{animation:rise var(--dur-enter) var(--ease) backwards}
#loginSent:not([hidden]){animation:min var(--dur-base) var(--ease-out) backwards}
#loginForm.out{opacity:0;transition:opacity 120ms linear}
.lsent .big svg path:last-child{stroke-dasharray:8;stroke-dashoffset:0;animation:draw 450ms var(--ease-out) 150ms backwards}
@keyframes draw{from{stroke-dashoffset:8}}
@supports (interpolate-size:allow-keywords){
  .ia{interpolate-size:allow-keywords}
  .ia::details-content{block-size:0;overflow:clip;transition:block-size var(--dur-base) var(--ease),content-visibility var(--dur-base) allow-discrete}
  .ia[open]::details-content{block-size:auto}
  .topic::details-content{block-size:0;overflow:clip;transition:block-size var(--dur-base) var(--ease),content-visibility var(--dur-base) allow-discrete}
  .topic[open]::details-content{block-size:auto}
}
.cal[data-dir=next] .days,.cal[data-dir=next] .dows{animation:cal-in-r 220ms var(--ease-in-out) backwards}
.cal[data-dir=prev] .days,.cal[data-dir=prev] .dows{animation:cal-in-l 220ms var(--ease-in-out) backwards}
@keyframes cal-in-r{from{opacity:0;transform:translateX(24px)}}
@keyframes cal-in-l{from{opacity:0;transform:translateX(-24px)}}
.panel.fx{animation:vin var(--dur-fast) var(--ease-out) backwards}
.fab::before{animation:fpulse 3.2s ease-out 2}
body.tutor-open .fab::before{animation:none}

/* ---- CLS: la barra superior y el contenedor de vista no se mueven al cambiar de ruta ---- */
.view{display:flow-root}
@media (min-width:1024px){
  .mini-title{flex:1 1 0;min-width:0;overflow:hidden;text-overflow:ellipsis;margin-right:0}
  .top-grow{display:none}
  .search{flex:0 0 340px;margin-left:var(--s3)}
}

/* ---- Reduced motion: menos y más suave, no cero (checklist 6.1 + pantallas nuevas) ---- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important}
  .view,.rise,.m-in,.tick,.nb.pop,.panel.fx,.cal .days,.cal .dows,.login,.lcard,#loginSent,.lsent .big svg path,.spin{animation:none!important}
  .tab-pill,.nav-pill,.spill{transition:none!important}
  .tutor,.tutor.closed{transition:opacity var(--dur-fast) linear!important}
  .tutor.closed{transform:none;opacity:0}
  .scrim{transition:opacity var(--dur-fast) linear!important}
  .esheet,.esheet.open,.msheet,.msheet.open{transition:opacity var(--dur-fast) linear,visibility 0s!important;transform:none!important}
  .esheet:not(.open),.msheet:not(.open){opacity:0}
  .mj-thread,.mj-stage.show-thread .mj-thread{transition:opacity var(--dur-fast) linear,visibility 0s!important;transform:none!important}
  .mj-thread{opacity:0}.mj-stage.show-thread .mj-thread{opacity:1}
  .menu,.menu.show{transform:none!important;transition:opacity var(--dur-fast),visibility 0s!important}
  dialog.cfg,dialog.cfg[open]{transform:none!important;transition:opacity var(--dur-fast),overlay var(--dur-fast) allow-discrete,display var(--dur-fast) allow-discrete!important}
  .toast,.toast.show{transform:translate(-50%,0)!important;transition:opacity var(--dur-fast)!important}
  .skel::after,.fab::before,.status.chk .sd,.live-dot::before,.typing i,.skel{animation:none!important}
  .anim .prg .bar,.anim .egr .bar,.prg .bar,.cg-ring .fg{animation:none!important;transition:none!important}
  .card:active,.task:active,.btn:active,.row:active,.evc:active,.tab:active,.icon-btn:active,.fab:active{transform:none!important}
  .card:hover,.task:hover,.post:hover,.evc:hover,.fab:hover{transform:none!important}
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation-duration:120ms!important}
  .mini-title{transform:none;transition:opacity var(--dur-fast)}
  /* sin transiciones de transform en superficies tocables: solo color/fondo/borde/sombra/opacidad */
  .task,.card,.row,.post,.evc,.cg-row,.fab,.tab,.icon-btn,.btn,.nav-b,.day,.send,.sugg button,.cbtn,.cg-preset,.mj-row,.mj-pill,.fchip,.cc,.au-tabs button,.seg button,.cg-seg button,.mj-seg button,.nav-i,.today-b,.search,.menu button .chk{transition-property:background-color,color,border-color,box-shadow,opacity!important;transition-duration:var(--dur-press)!important}
  body.tutor-open .fab{transform:none}
}
