/* V10.8.1664 (TEST) Class Lobby, new design (itutor.world style: blue #2f6fe0, soft rounded cards, title case). Look-only; scoped to html.lb1664 (class is added by lb1664.js).
   Off: localStorage lb1664=0 then reload, or remove this file's <link> and lb1664.js <script> from student-portal/index.html. */
html.v1058.lb1664 .lob{background:linear-gradient(180deg,#eef4ff 0,#f6f9ff 320px,#f7f9fd 100%)!important;font-family:Inter,Poppins,system-ui,sans-serif;color:#10214a}
html.v1058.lb1664 .lob .world{max-width:1240px;padding:22px 28px 64px!important;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);grid-template-areas:none;gap:16px 26px;align-items:start}
html.v1058.lb1664 .lob .world>*{grid-area:auto}
html.v1058.lb1664 .lob .lob-logo{grid-column:1;grid-row:1}
html.v1058.lb1664 .lob .v58back{grid-column:2;grid-row:1;justify-self:end;border:1px solid #d3def5;background:#fff;color:#2f6fe0;font:600 .92rem Inter,Poppins,sans-serif;border-radius:999px;padding:.6rem 1.1rem;box-shadow:0 2px 8px #2f6fe018;min-height:42px}
html.v1058.lb1664 .lob .v58back:hover{background:#eef4ff}
html.v1058.lb1664 .lob .v58back:focus-visible,html.v1058.lb1664 .lob .jbtn:focus-visible,html.v1058.lb1664 .lob .mode:focus-visible,html.v1058.lb1664 .lob .lb-dev select:focus-visible,html.v1058.lb1664 .lob .dchk button:focus-visible{outline:3px solid #2f6fe055;outline-offset:2px}
html.v1058.lb1664 .lob .lob-pill,html.v1058.lb1664 .lob .ltbtn,html.v1058.lb1664 .lob .ltray,html.v1058.lb1664 .lob .ltray2{display:none!important}
html.v1058.lb1664 .lob .lb-head{grid-column:1/-1;grid-row:2;margin:4px 0 2px!important}
html.v1058.lb1664 .lob .lb-head h1{margin:0;font:700 clamp(1.7rem,3vw,2.2rem)/1.15 Poppins,Inter,sans-serif;color:#10214a;letter-spacing:-.01em}
html.v1058.lb1664 .lob .lb-head p{margin:.35rem 0 0;font:500 1rem/1.5 Inter,sans-serif;color:#4a5672}
html.v1058.lb1664 .lob .lb-main{grid-column:1;grid-row:3;display:flex;flex-direction:column;gap:16px;min-width:0}
html.v1058.lb1664 .lob .lb-side{grid-column:2;grid-row:3;display:flex;flex-direction:column;gap:16px;min-width:0}
html.v1058.lb1664 .lob .world>.cbar{grid-column:1/-1;grid-row:4}
/* camera / mic preview card */
html.v1058.lb1664 .lob .prev{aspect-ratio:16/10;border-radius:20px!important;background:#0f1d3d!important;border:1px solid #d9e3f7;box-shadow:0 12px 34px #10214a22!important}
html.v1058.lb1664 .lob .prev .chip{background:#fffffff0!important;color:#10214a!important;font:600 .82rem Inter,sans-serif;border-radius:999px;padding:.4rem .85rem;left:14px!important;bottom:14px!important}
html.v1058.lb1664 .lob .prev .off{color:#dbe6ff;font:500 1rem/1.5 Inter,sans-serif}
html.v1058.lb1664 .lob .prev .tph{background:#2f6fe0;color:#fff;margin:0 auto 10px}
/* cards */
html.v1058.lb1664 .lob .lb-info,html.v1058.lb1664 .lob .lb-dev,html.v1058.lb1664 .lob .choose{background:#fff!important;border:1px solid #e1e8f6!important;border-radius:20px!important;box-shadow:0 10px 30px #10214a12!important;padding:20px 22px!important;box-sizing:border-box}
html.v1058.lb1664 .lob .lb-id{display:flex;align-items:center;gap:14px;margin-bottom:14px}
html.v1058.lb1664 .lob .lb-av{flex:none;width:52px;height:52px;border-radius:50%;background:#2f6fe0;color:#fff;display:grid;place-items:center;font:700 1.3rem Poppins,sans-serif}
html.v1058.lb1664 .lob .lb-id h2{margin:0;font:700 1.3rem/1.2 Poppins,Inter,sans-serif;color:#10214a}
html.v1058.lb1664 .lob .lb-id small{display:block;margin-top:2px;color:#4a5672;font:500 .9rem Inter,sans-serif}
html.v1058.lb1664 .lob .lb-info dl{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:12px 16px}
html.v1058.lb1664 .lob .lb-info dl>div{background:#f5f8ff;border-radius:14px;padding:10px 14px;min-width:0}
/* V10.8.1673 Class Time sits beside Grade (Tutor|Subject / Grade|Class Time); full width only when Grade is missing (3 boxes) */
html.v1058.lb1664 .lob .lb-info dl>div:last-child:nth-child(odd){grid-column:1/-1}
html.v1058.lb1664 .lob .lb-info dl>div:last-child:nth-child(even) dd{font-size:.95rem;overflow-wrap:break-word}
html.v1058.lb1664 .lob .lb-info dt{font:600 .75rem Inter,sans-serif;color:#5d6a8a;text-transform:uppercase;letter-spacing:.04em}
html.v1058.lb1664 .lob .lb-info dd{margin:2px 0 0;font:600 1rem/1.35 Inter,sans-serif;color:#10214a;overflow-wrap:anywhere}
html.v1058.lb1664 .lob .lb-info dd small{display:block;font:500 .85rem Inter,sans-serif;color:#4a5672}
html.v1058.lb1664 .lob .lb-state{margin-top:14px}
html.v1058.lb1664 .lob .lb-pill{display:inline-block;padding:.4rem .95rem;border-radius:999px;font:700 .9rem Inter,sans-serif}
html.v1058.lb1664 .lob .lb-pill.wait{background:#fff3d6;color:#8a5200}html.v1058.lb1664 .lob .lb-pill.ok{background:#e1f6e8;color:#14663a}html.v1058.lb1664 .lob .lb-pill.end{background:#e8ecf4;color:#4a5672}
html.v1058.lb1664 .lob .lb-hint{margin:.55rem 0 0;font:500 .95rem/1.5 Inter,sans-serif;color:#4a5672}
/* devices */
html.v1058.lb1664 .lob .lb-dev h3{margin:0 0 12px;font:700 1.1rem Poppins,Inter,sans-serif;color:#10214a}
html.v1058.lb1664 .lob .lb-dev label{display:block;margin:0 0 12px;font:600 .85rem Inter,sans-serif;color:#33415f}
html.v1058.lb1664 .lob .lb-dev select{display:block;width:100%;margin-top:5px;height:46px;border:1.5px solid #cdd8ef;border-radius:12px;background:#fff;color:#10214a;font:500 .95rem Inter,sans-serif;padding:0 12px;box-sizing:border-box}
html.v1058.lb1664 .lob .lb-dev select:disabled{background:#f1f4fa;color:#7a869f}
html.v1058.lb1664 .lob .lb-mic{display:flex;align-items:center;gap:12px;font:600 .85rem Inter,sans-serif;color:#33415f}
html.v1058.lb1664 .lob .lb-meter{flex:1;height:10px;border-radius:99px;background:#e6edf9;overflow:hidden}
html.v1058.lb1664 .lob .lb-meter i{display:block;height:100%;width:0;background:#2f6fe0;border-radius:99px;transition:width .08s linear}
html.v1058.lb1664 .lob .lb-dnote{margin:.6rem 0 0;color:#a12a20;font:600 .88rem Inter,sans-serif}.lb1664 .lb-dnote:empty{display:none}
html.v1058.lb1664 .lob .lb-dfoot{margin:.7rem 0 0;color:#5d6a8a;font:500 .82rem/1.45 Inter,sans-serif}
/* choose + join */
html.v1058.lb1664 .lob .choose h2{font:700 1.2rem Poppins,Inter,sans-serif!important;color:#10214a!important;margin:0 0 14px!important}
html.v1058.lb1664 .lob .choose h2 em{color:#2f6fe0!important}
html.v1058.lb1664 .lob .mode{background:#f7f9ff!important;border:1.5px solid #dbe4f6!important;border-radius:16px!important;color:#10214a!important;cursor:pointer;min-height:48px}
html.v1058.lb1664 .lob .mode:hover{border-color:#2f6fe0!important}
html.v1058.lb1664 .lob .mode.on{background:#eef4ff!important;border-color:#2f6fe0!important;box-shadow:0 0 0 3px #2f6fe022!important}
html.v1058.lb1664 .lob .mode .mi svg{color:#2f6fe0}
html.v1058.lb1664 .lob .mode .rad{border-color:#2f6fe0!important}html.v1058.lb1664 .lob .mode.on .rad{background:radial-gradient(#2f6fe0 45%,#fff 50%)!important}
html.v1058.lb1664 .lob .mode span{color:#4a5672!important}
html.v1058.lb1664 .lob .mnote{background:#eef4ff!important;color:#26324f!important;border-radius:12px!important;font:500 .9rem Inter,sans-serif!important}
html.v1058.lb1664 .lob .jbtn{min-height:54px;background:#2f6fe0!important;color:#fff!important;border-radius:14px!important;font:700 1.05rem Poppins,Inter,sans-serif!important;box-shadow:0 10px 22px #2f6fe03d!important;cursor:pointer}
html.v1058.lb1664 .lob .jbtn:hover:not([disabled]){background:#2459bd!important}
html.v1058.lb1664 .lob .jbtn[disabled]{background:#c9d6f0!important;color:#4a5b82!important;box-shadow:none!important;cursor:not-allowed}
html.v1058.lb1664 .lob .jerr{color:#a12a20;font:600 .9rem Inter,sans-serif;margin:.5rem 0 0}.lb1664 .jerr:empty{display:none}
/* checks bar */
html.v1058.lb1664 .lob .cbar{background:#fff!important;border:1px solid #e1e8f6!important;border-radius:16px!important;color:#4a5672!important;font:500 .92rem Inter,sans-serif!important;box-shadow:0 6px 20px #10214a0d}
html.v1058.lb1664 .lob .cbar .dchk>*{background:#eef4ff;border:1px solid #d3def5;color:#2f6fe0;font:600 .85rem Inter,sans-serif}
html.v1058.lb1664 .lob .cbar .dchk .ok{background:#e1f6e8;border-color:#bfe3c9;color:#14663a}html.v1058.lb1664 .lob .cbar .dchk .bad{background:#fdeceb;border-color:#f4c4c0;color:#a12a20}
@media (max-width:980px){
  html.v1058.lb1664 .lob .world{grid-template-columns:1fr auto;padding:16px 16px 40px!important;gap:14px}
  html.v1058.lb1664 .lob .lob-logo{grid-column:1;grid-row:1}html.v1058.lb1664 .lob .v58back{grid-column:2;grid-row:1}
  html.v1058.lb1664 .lob .lb-main,html.v1058.lb1664 .lob .lb-side{display:contents}
  html.v1058.lb1664 .lob .lb-head{grid-row:auto;order:1;grid-column:1/-1}
  html.v1058.lb1664 .lob .lb-info{order:2;grid-column:1/-1;grid-row:auto}
  html.v1058.lb1664 .lob .prev{order:3;grid-column:1/-1;grid-row:auto;aspect-ratio:4/3}
  html.v1058.lb1664 .lob .lb-dev{order:5;grid-column:1/-1;grid-row:auto}
  html.v1058.lb1664 .lob .choose{order:4;grid-column:1/-1;grid-row:auto}
  html.v1058.lb1664 .lob .world>.cbar{order:6;grid-column:1/-1;grid-row:auto}
  html.v1058.lb1664 .lob .lob-logo,html.v1058.lb1664 .lob .v58back{order:0}
}
@media (max-width:599px){
  html.v1058.lb1664 .lob .lb-info,html.v1058.lb1664 .lob .lb-dev,html.v1058.lb1664 .lob .choose{padding:16px!important;border-radius:18px!important}
  html.v1058.lb1664 .lob .lb-info dl{grid-template-columns:1fr 1fr;gap:10px}
  html.v1058.lb1664 .lob .modes{grid-template-columns:1fr 1fr}
  html.v1058.lb1664 .lob .jbtn{min-height:56px}
}
/* the old lobby positions these absolutely at fixed offsets; inside the new columns they flow normally */
html.v1058.lb1664 .lob .lb-side .choose,html.v1058.lb1664 .lob .lb-main .prev{position:relative!important;left:auto!important;top:auto!important;right:auto!important;bottom:auto!important;width:auto!important;margin:0!important;transform:none!important}
html.v1058.lb1664 .lob .lb-side .choose{height:auto!important}