/* app.css — L'Aula de la Laia
   Base del mockup ../../aula-mockups.html (3 pells) + estils nous per a: login, distintiu
   IA permanent, celebracions, selector de pell, càmera, mini-jocs, indicador «pensant»,
   i responsivitat. Els valors de color/tipografia venen SEMPRE de variables (skins.css);
   aquest fitxer no fixa cap color fora dels tokens neutres definits a :root. */

/* ===== RESET ===== */
*,*::before,*::after{box-sizing:border-box;}
html,body{height:100%;margin:0;padding:0;}
html{font-size:17px;-webkit-text-size-adjust:100%;}
body{font-family:var(--font-body,'Inter',sans-serif);overflow:hidden;background:var(--bg,#111318);color:var(--text,#e7ecff);}
button,input,select,textarea{font:inherit;color:inherit;}
button{cursor:pointer;background:none;border:none;}
img,svg{display:block;max-width:100%;}
p{margin:0;}
a{color:inherit;}
[hidden]{display:none!important;}
:focus{outline:none;}
:focus-visible{outline:2px solid var(--focus,#2f5d9e);outline-offset:2px;border-radius:4px;}
::-webkit-scrollbar{width:9px;height:9px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:var(--border,rgba(0,0,0,.2));border-radius:99px;}

:root{
  --danger:#d64545; --danger-bg:#fdeaea; --danger-fg:#7a1d1d;
  --warn:#c68a1f; --warn-bg:#fbf1dc; --warn-fg:#5c4108;
  --ok:#2f9e57; --ok-bg:#e8f6ec; --ok-fg:#155a2a;
  --z-distintiu:500; --z-toast:900; --z-modal:1000; --z-casanova:80;
}

/* ===== DISTINTIU IA — sempre visible, independent de la pell i del rol ===== */
#distintiu-ia{
  position:sticky;top:0;left:0;right:0;z-index:var(--z-distintiu);
  display:flex;align-items:center;justify-content:center;gap:8px;
  background:#14161c;color:#eef0f5;padding:5px 12px;
  font-family:'Inter',sans-serif;font-size:12.5px;font-weight:600;letter-spacing:.01em;
  text-align:center;border-bottom:1px solid rgba(255,255,255,.08);
}
#distintiu-ia svg{width:14px;height:14px;flex:0 0 auto;color:#9fb2d9;}

/* ===== LOGIN ===== */
.login-screen{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:var(--bg);padding:24px;
}
.login-card{
  width:100%;max-width:380px;background:var(--bg2);border:1px solid var(--border);
  border-radius:var(--radius-card,14px);box-shadow:var(--shadow);padding:34px 30px 28px;
}
.login-brand{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:22px;text-align:center;}
.login-brand img,.login-brand svg{width:56px;height:56px;}
.login-brand h1{font-family:var(--font-head);font-size:26px;font-weight:700;margin:0;color:var(--text);}
.login-field{display:flex;flex-direction:column;gap:6px;margin-bottom:16px;}
.login-field label{font-size:13px;font-weight:600;color:var(--text-dim);}
.login-field input{
  border:1px solid var(--border);background:var(--bg);color:var(--text);
  border-radius:10px;padding:11px 14px;font-size:16px;
}
.login-error{
  background:var(--danger-bg);color:var(--danger-fg);border-radius:8px;
  padding:9px 12px;font-size:13.5px;margin-bottom:14px;
}
.login-error[hidden]{display:none;}
.login-submit{
  width:100%;background:var(--accent);color:var(--laia-bubble-fg);border-radius:10px;padding:12px;
  font-size:15px;font-weight:700;margin-top:6px;transition:filter .15s ease;
}
.login-submit:hover{filter:brightness(1.08);}
.login-submit:disabled{opacity:.6;cursor:default;}
.login-hint{
  margin-top:16px;text-align:center;font-size:12.5px;color:var(--text-dim);line-height:1.5;
}
.login-closed{
  background:var(--warn-bg);color:var(--warn-fg);border-radius:8px;padding:9px 12px;
  font-size:13.5px;margin-bottom:14px;
}

/* ===== APP SHELL ===== */
.app-shell{position:relative;height:100vh;display:flex;flex-direction:column;font-family:var(--font-body);color:var(--text);background:var(--bg);}
#distintiu-ia + .app-shell,#distintiu-ia ~ #root-app .app-shell{height:calc(100vh - 26px);}

/* ===== TOPBAR ===== */
.topbar{flex:0 0 auto;position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 22px;border-bottom:1px solid var(--border);background:var(--bg2);flex-wrap:wrap;}
.topbar-left,.topbar-mid,.topbar-right{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.topbar-mid{flex:1 1 auto;justify-content:center;}
.brand{display:flex;align-items:center;gap:10px;}
.gat-avatar{width:36px;height:36px;border-radius:50%;background:var(--accent);color:var(--laia-bubble-fg);display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-weight:700;font-size:18px;box-shadow:var(--shadow);flex:0 0 auto;overflow:hidden;}
.gat-avatar svg,.gat-avatar img{width:100%;height:100%;}
.brand-name{font-family:var(--font-head);font-weight:700;font-size:22px;color:var(--text);white-space:nowrap;}

.chip{display:flex;align-items:center;gap:6px;padding:6px 13px;border-radius:999px;background:var(--bg3);border:1px solid var(--border);font-size:12.5px;white-space:nowrap;}
.chip button{display:flex;align-items:center;gap:6px;}
.student-chip .student-grade{color:var(--text-dim);}
.student-chip .student-grade::before{content:"· ";}
.student-chip .student-name{font-weight:700;}
.topics-summary{font-family:var(--font-mono);font-weight:600;letter-spacing:.01em;}
.ts-sep{color:var(--text-dim);margin:0 3px;}
.streak-chip{font-family:var(--font-mono);font-weight:700;color:var(--accent2);}
.streak-chip svg{width:14px;height:14px;color:var(--accent2);}
.honesty-badge{color:var(--text-dim);font-size:11.5px;}
.honesty-badge svg{width:13px;height:13px;flex:0 0 auto;}

.skin-picker{position:relative;}
.skin-picker-btn{display:flex;align-items:center;gap:6px;}
.skin-picker-menu{
  position:absolute;top:calc(100% + 8px);right:0;background:var(--bg2);border:1px solid var(--border);
  border-radius:10px;box-shadow:var(--shadow);padding:6px;display:grid;grid-template-columns:repeat(3,1fr);
  gap:4px;z-index:60;min-width:190px;
}
.skin-picker-menu[hidden]{display:none;}
.skin-opt{
  display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 6px;border-radius:8px;
  font-size:11px;color:var(--text-dim);
}
.skin-opt:hover,.skin-opt:focus-visible{background:var(--bg3);color:var(--text);}
.skin-opt.locked{opacity:.4;cursor:not-allowed;}
.skin-opt .swatch{width:26px;height:26px;border-radius:50%;border:2px solid var(--border);}
.skin-opt.active .swatch{border-color:var(--accent);}

.xxt-btn{color:var(--text-dim);}
.xxt-btn.actiu{color:var(--accent2);background:var(--bg3);}
.xxt-btn svg{width:14px;height:14px;}

.easter-star{position:relative;background:none;border:none;padding:6px;margin:0;opacity:.16;color:var(--text-dim);display:flex;transition:opacity .15s ease;}
.easter-star svg{width:14px;height:14px;}
.easter-star:hover,.easter-star:focus-visible{opacity:.8;}
.easter-tip{position:absolute;top:130%;right:0;background:#111318;color:#fff;font-size:11.5px;font-family:'Inter',sans-serif;font-weight:400;padding:9px 11px;border-radius:8px;width:196px;line-height:1.4;opacity:0;transform:translateY(-4px);pointer-events:none;transition:all .15s ease;box-shadow:0 8px 22px rgba(0,0,0,.35);text-align:left;z-index:20;}
.easter-star:hover .easter-tip,.easter-star:focus-visible .easter-tip{opacity:1;transform:translateY(0);}

.hores-tancades-banner{
  background:var(--warn-bg);color:var(--warn-fg);text-align:center;padding:8px 14px;font-size:13px;font-weight:600;
}

/* ===== WORKSPACE GRID ===== */
.workspace{flex:1 1 auto;position:relative;z-index:1;display:grid;grid-template-columns:290px 1fr 40%;gap:18px;padding:18px;min-height:0;}

/* ---- left column: Avui ---- */
.col-left{overflow-y:auto;min-height:0;display:flex;flex-direction:column;gap:13px;padding-right:2px;}
.col-title{font-family:var(--font-head);font-size:19px;font-weight:700;margin:0 2px;color:var(--text);}

.card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-card);padding:15px;box-shadow:var(--shadow);}
.card-title{margin:0 0 10px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text-dim);}

.todo-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
.todo-item,.exam-item{display:flex;align-items:flex-start;gap:9px;}
.subject-badge{flex:0 0 auto;font-size:10px;font-weight:700;padding:3px 8px;border-radius:999px;color:var(--badge1-fg);background:var(--badge1-bg);margin-top:1px;}
.subject-badge.b2{background:var(--badge2-bg);color:var(--badge2-fg);}
.todo-text{display:flex;flex-direction:column;gap:2px;font-size:13px;}
.todo-text strong{font-weight:700;line-height:1.3;}
.todo-due,.review-meta{color:var(--text-dim);font-size:11.5px;}
.review-item{display:flex;flex-direction:column;gap:2px;font-size:13px;}
.review-item strong{font-weight:700;}
.empty-note{font-size:12.5px;color:var(--text-dim);font-style:italic;}

.game-card .game-riddle{font-size:12.5px;line-height:1.5;color:var(--text);margin:0 0 11px;}
.btn{border:none;border-radius:10px;padding:9px 16px;font-size:13px;font-weight:700;transition:all .15s ease;}
.btn-primary{background:var(--accent);color:var(--laia-bubble-fg);}
.btn-primary:hover{filter:brightness(1.1);transform:translateY(-1px);}
.btn-secondary{background:var(--badge2-bg);color:var(--badge2-fg);}
.btn-secondary:hover{filter:brightness(1.1);transform:translateY(-1px);}
.btn-ghost{background:var(--bg3);color:var(--text);}
.btn-ghost:hover{background:var(--border);}
.btn:disabled{opacity:.55;cursor:default;transform:none!important;filter:none!important;}
.btn-block{width:100%;}
.btn-sm{padding:6px 11px;font-size:12px;border-radius:8px;}

.dropzone{border:2px dashed var(--border);border-radius:var(--radius-card);padding:18px 12px;text-align:center;color:var(--text-dim);font-size:12px;display:flex;flex-direction:column;align-items:center;gap:8px;transition:all .15s ease;cursor:pointer;}
.dropzone:hover,.dropzone.dragover{border-color:var(--accent);color:var(--text);background:var(--bg3);}
.dropzone svg{width:22px;height:22px;color:var(--accent);}
.dropzone input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;}

.camera-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;}
.camera-btn svg{width:16px;height:16px;}

/* ---- center chat column ---- */
.col-center{display:flex;flex-direction:column;min-height:0;background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-card);overflow:hidden;box-shadow:var(--shadow);position:relative;}
.chat-messages{flex:1 1 auto;overflow-y:auto;min-height:0;padding:20px 24px;display:flex;flex-direction:column;gap:12px;font-size:17px;line-height:1.55;}
.msg{display:flex;}
.msg-alumne{justify-content:flex-end;}
.msg-gat{justify-content:flex-start;}
.msg-bubble{max-width:82%;padding:11px 16px;border-radius:16px;}
.msg-gat .msg-bubble{background:var(--gat-bubble-bg);color:var(--gat-bubble-fg);border:1px solid var(--gat-bubble-border);border-bottom-left-radius:5px;}
.msg-alumne .msg-bubble{background:var(--laia-bubble-bg);color:var(--laia-bubble-fg);border-bottom-right-radius:5px;}
.msg-bubble p{margin:0 0 8px;}
.msg-bubble p:last-child{margin-bottom:0;}
.msg-bubble ul,.msg-bubble ol{margin:6px 0;padding-left:20px;}
.msg-bubble code{font-family:var(--font-mono);font-size:14px;background:rgba(0,0,0,.08);border-radius:5px;padding:1px 5px;}
.msg-bubble .katex{font-size:1.02em;}
.msg-adjunts{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;}
.msg-adjunt-thumb{width:56px;height:56px;border-radius:8px;object-fit:cover;border:1px solid rgba(0,0,0,.15);}
.msg-adjunt-doc{display:flex;align-items:center;gap:5px;font-size:11.5px;background:rgba(0,0,0,.08);border-radius:8px;padding:5px 9px;}

.msg-pensant .msg-bubble{display:flex;align-items:center;gap:4px;padding:13px 18px;}
.think-dot{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.5;animation:thinkPulse 1.1s ease infinite;}
.think-dot:nth-child(2){animation-delay:.15s;}
.think-dot:nth-child(3){animation-delay:.3s;}
@keyframes thinkPulse{0%,80%,100%{opacity:.3;transform:scale(.8);}40%{opacity:1;transform:scale(1);}}

.chat-error{margin:0 24px 10px;background:var(--danger-bg);color:var(--danger-fg);border-radius:8px;padding:9px 12px;font-size:13px;}
.chat-error[hidden]{display:none;}

.composer{flex:0 0 auto;display:flex;flex-direction:column;gap:8px;padding:12px 18px;border-top:1px solid var(--border);background:var(--bg2);}
.composer-adjunts{display:flex;gap:8px;flex-wrap:wrap;}
.composer-adjunts[hidden]{display:none;}
.composer-adjunt{position:relative;width:52px;height:52px;border-radius:8px;overflow:hidden;border:1px solid var(--border);}
.composer-adjunt img{width:100%;height:100%;object-fit:cover;}
.composer-adjunt .doc-chip{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:var(--bg3);font-size:9px;text-align:center;padding:2px;}
.composer-adjunt-del{position:absolute;top:-4px;right:-4px;width:17px;height:17px;border-radius:50%;background:var(--danger);color:#fff;font-size:11px;line-height:1;display:flex;align-items:center;justify-content:center;}
.composer-row{display:flex;align-items:center;gap:9px;}
.composer-attach,.composer-camera{background:var(--bg3);border:1px solid var(--border);width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--text-dim);flex:0 0 auto;transition:all .15s ease;}
.composer-attach:hover,.composer-camera:hover{color:var(--accent);border-color:var(--accent);}
.composer-attach svg,.composer-camera svg{width:16px;height:16px;}
.composer-input{flex:1 1 auto;min-width:0;border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:999px;padding:10px 16px;font-size:16px;font-family:var(--font-body);resize:none;max-height:110px;}
.composer-input::placeholder{color:var(--text-dim);}
.composer-send{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;padding:0;flex:0 0 auto;}
.composer-send svg{width:15px;height:15px;}
.msgs-restants{font-size:11px;color:var(--text-dim);text-align:right;padding-right:4px;}

/* ---- right column: pissarra ---- */
.col-right{display:flex;flex-direction:column;min-height:0;background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-card);overflow:hidden;box-shadow:var(--shadow);}
.tab-bar{flex:0 0 auto;display:flex;gap:2px;padding:12px 14px 0;overflow-x:auto;}
.tab-btn{background:none;border:none;padding:8px 12px;font-size:12.5px;font-weight:700;color:var(--text-dim);border-radius:8px 8px 0 0;border-bottom:2px solid transparent;transition:all .15s ease;white-space:nowrap;}
.tab-btn:hover{color:var(--text);}
.tab-btn.active{color:var(--accent);border-bottom-color:var(--accent);}
.tab-panel{flex:1 1 auto;overflow-y:auto;min-height:0;padding:16px 20px 22px;}
.tab-panel[hidden]{display:none;}

.board-title{font-family:var(--font-head);font-size:18px;font-weight:700;margin:0 0 12px;}
.board-svg-wrap{background:var(--bg3);border:1px solid var(--border);border-radius:var(--radius-card);padding:14px;display:flex;justify-content:center;}
.board-caption{margin:10px 2px 0;font-size:12.5px;color:var(--text-dim);text-align:center;}
.board-empty{color:var(--text-dim);font-size:13px;text-align:center;padding:30px 10px;}

.video-frame{position:relative;aspect-ratio:16/9;background:linear-gradient(135deg,var(--bg3),var(--bg));border:1px solid var(--border);border-radius:var(--radius-card);overflow:hidden;margin-bottom:14px;}
.video-frame iframe{width:100%;height:100%;border:0;}
.video-note{display:flex;align-items:center;gap:6px;font-weight:700;font-size:12.5px;color:var(--accent2);margin:0 0 5px;}
.video-note svg{width:14px;height:14px;}
.video-sub{font-size:12px;color:var(--text-dim);}

.doc-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;}
.doc-item{display:flex;align-items:center;gap:11px;padding:12px 13px;background:var(--bg3);border:1px solid var(--border);border-radius:var(--radius-card);}
.doc-item svg{width:20px;height:20px;color:var(--accent);flex:0 0 auto;}
.doc-item strong{display:block;font-size:13px;font-weight:700;word-break:break-word;}
.doc-status{font-size:11.5px;color:var(--accent2);font-weight:600;}

.map-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:13px;}
.subject-card{background:var(--bg3);border:1px solid var(--border);border-radius:var(--radius-card);padding:13px 14px;}
.subject-card h4{margin:0 0 8px;font-family:var(--font-head);font-size:16px;font-weight:700;}
.topic-row{position:relative;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 0;font-size:12.5px;border-top:1px solid var(--border);}
.topic-row:first-of-type{border-top:none;}
.topic-row.celebrate{animation:topicPulse .7s ease;}
@keyframes topicPulse{0%{transform:scale(1);}35%{transform:scale(1.08);}100%{transform:scale(1);}}

.book-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;}
.book-item{padding:11px 13px;background:var(--bg3);border:1px solid var(--border);border-radius:var(--radius-card);font-size:12.5px;}
.book-item strong{display:block;font-size:13.5px;margin-bottom:2px;}
.book-status{font-size:11px;color:var(--accent2);font-weight:700;text-transform:uppercase;letter-spacing:.03em;}
.book-add{display:flex;gap:8px;margin-top:12px;}
.book-add input{flex:1 1 auto;border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:8px;padding:8px 10px;font-size:13px;}

/* ===== ARMARI (accessoris equipables d'en Casanova, §13.6 / P2 11/09) ===== */
.armari-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;}
.armari-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 13px;background:var(--bg3);border:1px solid var(--border);border-radius:var(--radius-card);font-size:13px;}
.armari-item.actiu{border-color:var(--accent2);}

/* ===== CELEBRACIÓ / DESBLOQUEIG ===== */
.celebra-toast{
  position:fixed;top:44px;left:50%;transform:translateX(-50%) translateY(-14px);
  background:var(--bg2);border:1px solid var(--accent2);border-radius:14px;box-shadow:var(--shadow);
  padding:14px 20px;display:flex;align-items:center;gap:12px;z-index:var(--z-toast);
  opacity:0;pointer-events:none;transition:all .35s cubic-bezier(.2,.9,.3,1.3);max-width:340px;
}
.celebra-toast.mostra{opacity:1;transform:translateX(-50%) translateY(0);pointer-events:auto;}
.celebra-toast .celebra-icona{font-size:26px;flex:0 0 auto;}
.celebra-toast .celebra-text strong{display:block;font-size:13.5px;}
.celebra-toast .celebra-text span{font-size:12px;color:var(--text-dim);}
.celebra-toast button{color:var(--text-dim);font-size:16px;padding:2px 4px;}

.modal-overlay{
  position:fixed;inset:0;background:rgba(10,10,15,.55);display:flex;align-items:center;
  justify-content:center;z-index:var(--z-modal);padding:20px;
}
.modal-overlay[hidden]{display:none;}
.modal-card{
  background:var(--bg2);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);
  padding:26px 26px 22px;max-width:420px;width:100%;max-height:80vh;overflow-y:auto;position:relative;
}
.modal-card h3{font-family:var(--font-head);font-size:22px;margin:0 0 12px;color:var(--accent2);}
.modal-card .modal-body{font-size:15px;line-height:1.6;white-space:pre-line;}
.modal-close{position:absolute;top:12px;right:14px;font-size:18px;color:var(--text-dim);}
.modal-actions{margin-top:18px;display:flex;justify-content:flex-end;gap:8px;}

/* ===== CÀMERA ===== */
.camera-overlay{
  position:fixed;inset:0;background:#000;display:flex;flex-direction:column;
  align-items:center;justify-content:center;z-index:var(--z-modal);gap:16px;
}
.camera-overlay[hidden]{display:none;}
.camera-video{width:min(92vw,560px);border-radius:14px;background:#000;}
.camera-indicator{
  position:absolute;top:22px;left:50%;transform:translateX(-50%);display:flex;align-items:center;
  gap:8px;background:rgba(0,0,0,.6);color:#fff;padding:7px 14px;border-radius:999px;font-size:13px;font-weight:600;
}
.camera-dot{width:9px;height:9px;border-radius:50%;background:#e5484d;animation:camBlink 1s ease infinite;}
@keyframes camBlink{0%,100%{opacity:1;}50%{opacity:.25;}}
.camera-actions{display:flex;gap:14px;}
.camera-shoot{width:64px;height:64px;border-radius:50%;background:#fff;border:4px solid rgba(255,255,255,.4);}
.camera-cancel{color:#fff;font-size:14px;font-weight:600;padding:10px 16px;}

/* ===== MINI-JOCS DE GAT ===== */
.minijoc-overlay{
  position:fixed;inset:0;background:rgba(10,10,15,.55);display:flex;align-items:center;
  justify-content:center;z-index:var(--z-modal);
}
.minijoc-overlay[hidden]{display:none;}
.minijoc-card{background:var(--bg2);border-radius:16px;padding:22px;width:min(92vw,420px);text-align:center;box-shadow:var(--shadow);}
.minijoc-card h3{font-family:var(--font-head);font-size:20px;margin:0 0 6px;}
.minijoc-card p{font-size:13px;color:var(--text-dim);margin-bottom:14px;}
.minijoc-arena{position:relative;width:100%;height:220px;background:var(--bg3);border-radius:12px;overflow:hidden;margin-bottom:14px;}
.minijoc-punt{position:absolute;width:30px;height:30px;border-radius:50%;background:var(--danger);box-shadow:0 0 0 6px rgba(214,69,69,.18);}
.minijoc-caixes{display:flex;gap:10px;justify-content:center;}
.minijoc-caixa{width:88px;height:88px;background:var(--bg3);border:2px solid var(--border);border-radius:12px;font-size:34px;display:flex;align-items:center;justify-content:center;}
.minijoc-caixa.trobada{background:var(--ok-bg);border-color:var(--ok);}
.minijoc-caixa.buida{opacity:.4;}
.minijoc-resultat{margin-top:10px;font-size:13.5px;font-weight:700;color:var(--accent2);min-height:18px;}

/* ===== EN CASANOVA — mount point (posicionament; l'animació/l'art és a casanova.css/js) =====
   #casanova-stage cobreix tot l'ample del workspace perquè left:X% (fixat per casanova.js) es
   pugui calcular sobre un únic sistema de coordenades, però casanova.js RESTRINGEIX el rang on
   paceja (PACEIG_MIN_PCT/MAX_PCT) a la banda dreta: efecte "capa fixa a la vora inferior dreta
   del xat/pissarra" sense necessitat de fixar aquí un ample de columna fràgil (les columnes són
   responsives, veure @media més avall). */
#casanova-stage{
  position:absolute;left:0;right:0;bottom:0;height:0;pointer-events:none;z-index:var(--z-casanova);
}
.casanova-avatar-wrap{
  position:absolute;bottom:0;width:96px;height:96px;pointer-events:none;
}
.casanova-bombolla{
  position:absolute;bottom:100%;left:50%;transform:translateX(-50%);margin-bottom:6px;
  background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:7px 11px;
  font-size:12.5px;white-space:nowrap;box-shadow:var(--shadow);opacity:0;transition:opacity .2s ease;
  max-width:220px;white-space:normal;text-align:center;
}
.casanova-bombolla.mostra{opacity:1;}

/* -- I1-C metodologia -- (I1-METODOLOGIA I1-C-superficies, brief §8). Discret a posta: sense
   vermell, sense compte enrere gran, cap etiqueta que delati per què hi és. */
.aula-met-temporitzador{padding:4px 0 8px;}
.aula-met-barra{height:4px;border-radius:4px;background:var(--bg2);overflow:hidden;}
.aula-met-omplert{height:100%;width:0;background:var(--accent,#7c9cff);transition:width 1s linear;}
.aula-met-oferta-pausa{
  display:flex;align-items:center;gap:10px;padding:8px 12px;margin-bottom:8px;
  background:var(--bg2);border:1px solid var(--border);border-radius:10px;font-size:13.5px;
}
.aula-met-oferta-pausa p{margin:0;flex:1;}
.pas-actual{padding:10px 4px;}
.pas-indicador{font-size:12.5px;font-weight:700;color:var(--text-dim);margin:0 0 6px;}
.pas-text{font-size:15px;line-height:1.5;margin:0;}
.pas-anteriors{margin-top:10px;font-size:12.5px;color:var(--text-dim);}
.pas-vell{margin:4px 0 0;opacity:.75;}
.check-criteri{font-size:15px;margin:0 0 14px;}
.aula-met-seguent{margin-top:6px;}
#aula-met-avui-mes{margin-top:8px;width:100%;}

/* ===== RESPONSIVE ===== */
@media (max-width:1100px){
  .workspace{grid-template-columns:1fr;grid-auto-rows:auto;overflow-y:auto;}
  .col-left,.col-right{max-height:none;}
  .col-center{min-height:420px;}
}
@media (max-width:640px){
  .topbar{padding:10px 14px;}
  .topbar-mid{order:3;flex-basis:100%;justify-content:flex-start;}
  .workspace{padding:12px;gap:12px;}
  .msg-bubble{max-width:92%;}
}