
.ciae-wrap{max-width:1100px;margin:28px auto;padding:0 14px;font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial}
.ciae-auth{background:#fff;border:1px solid #ececf2;border-radius:18px;padding:14px}
.ciae-aula-head{display:flex;justify-content:space-between;gap:14px;align-items:center;margin-bottom:12px}
.ciae-h1{font-size:22px;font-weight:950;letter-spacing:-.02em}
.ciae-sub{color:#666;margin-top:4px}
.ciae-aula-head-actions .ciae-btn{margin-left:6px}

.ciae-card{background:#fff;border:1px solid #ececf2;border-radius:22px;padding:14px;box-shadow:0 18px 45px rgba(0,0,0,.06)}
.ciae-card-row{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:10px 0}
.ciae-title{font-weight:950;font-size:16px}
.ciae-pill{display:inline-flex;margin-top:6px;background:#f2f3f6;border:1px solid #e2e3ea;border-radius:999px;padding:4px 10px;font-size:12px;font-weight:900;color:#333;width:fit-content}
.ciae-meta{color:#666;margin-top:6px}
.ciae-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid #e2e3ea;background:#fff;border-radius:14px;padding:10px 12px;font-weight:900;cursor:pointer;text-decoration:none;color:#111}
.ciae-btn:hover{box-shadow:0 10px 20px rgba(0,0,0,.08)}
.ciae-primary{background:#111;color:#fff;border-color:#111}

.ciae-group{margin:18px 0 26px}
.ciae-group-title{font-weight:950;font-size:18px;margin:10px 0 8px;letter-spacing:-.01em}

.ciae-layout{display:grid;grid-template-columns:1.35fr .65fr;gap:14px;align-items:start}
.ciae-left{min-width:0}
.ciae-right{display:grid;gap:12px}
.ciae-sidecard{background:#fff;border:1px solid #ececf2;border-radius:22px;padding:14px;box-shadow:0 18px 45px rgba(0,0,0,.06)}
.ciae-side-title{font-weight:950;margin-bottom:10px}
.ciae-side-line{display:flex;justify-content:space-between;gap:10px;margin:8px 0;color:#333}
.ciae-side-line .k{color:#666}
.ciae-side-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.ciae-side-list{margin:0;padding-left:18px}
.ciae-side-list li{margin:6px 0}
.ciae-side-list a{word-break:break-word}
.ciae-muted{color:#666;font-size:13px}

.ciae-seg{display:inline-flex;background:#f2f3f6;border:1px solid #e2e3ea;border-radius:16px;padding:4px;gap:4px}
.ciae-seg button{border:0;background:transparent;padding:10px 12px;border-radius:12px;font-weight:900;cursor:pointer}
.ciae-seg button.is-active{background:#fff;border:1px solid #ececf2;box-shadow:0 10px 20px rgba(0,0,0,.08)}

.ciae-panel{background:#fff;border:1px solid #ececf2;border-radius:22px;padding:14px;box-shadow:0 18px 45px rgba(0,0,0,.06)}
.ciae-panel-head{margin-bottom:10px}
.ciae-panel-title{font-weight:950}
.ciae-panel-sub{color:#666;font-size:13px;margin-top:4px}
.ciae-embed{height:520px;border-radius:18px;overflow:hidden;border:1px solid #e7e7f2;background:#000}
.ciae-wait{background:#f7f7fb;border:1px solid #e7e7f2;border-radius:18px;padding:14px;font-weight:950}

.ciae-notes,.ciae-internal-ta{width:100%;min-height:220px;border:1px solid #dcdce7;border-radius:16px;padding:12px;font-size:14px;margin-top:10px}
.ciae-internal-student{width:100%;border:1px solid #dcdce7;border-radius:14px;padding:10px}
.ciae-internal-search{width:100%;border:1px solid #dcdce7;border-radius:14px;padding:10px;margin:0 0 10px 0;background:#fff}
.ciae-notes-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:10px}
.ciae-internal-list{margin-top:10px;display:grid;gap:8px}
.ciae-note-item{background:#fff;border:1px solid #ececf2;border-radius:16px;padding:10px}
.ciae-note-meta{color:#666;font-size:12px;margin-bottom:6px}
.ciae-att-table table{width:100%;border-collapse:collapse;font-size:13px}
.ciae-att-table th,.ciae-att-table td{padding:8px;border-bottom:1px solid #eee;text-align:left}

.ciae-wb-canvas{width:100%;height:420px;border-radius:18px;border:1px solid #e7e7f2;background:#fff}
.ciae-wb-toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}

@media (max-width: 960px){
  .ciae-layout{grid-template-columns:1fr}
  .ciae-embed{height:420px}
  .ciae-aula-head{flex-direction:column;align-items:flex-start}
}


/* Status pill */
.ciae-status-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:#f2f3f7;border:1px solid #e7e8ef;font-size:12px;color:#3b3f4a;vertical-align:middle;margin-left:8px}
.ciae-status-pill:before{content:'';width:8px;height:8px;border-radius:50%;background:#aab0bd}
.ciae-status-pill.is-live{background:#ecfff3;border-color:#bfead0;color:#125c33}
.ciae-status-pill.is-live:before{background:#22c55e}

/* Segmented tabs polish */
.ciae-tabs{background:#f4f5f9;border:1px solid #e6e7ef;border-radius:14px;padding:6px;display:flex;gap:6px}
.ciae-tab{flex:1;text-align:center;padding:10px 12px;border-radius:12px;color:#2a2d35;text-decoration:none;font-weight:600;transition:all .18s ease}
.ciae-tab:hover{background:#ffffff;border:1px solid #e6e7ef}
.ciae-tab.is-active{background:#ffffff;border:1px solid #dcddee;box-shadow:0 8px 20px rgba(0,0,0,.06)}

/* Segmented control polish */
.ciae-aula-head-actions{display:flex;flex-wrap:wrap;gap:8px}
.ciae-aula-head-actions .ciae-btn{border-radius:12px;background:#f2f3f7;border:1px solid #e7e8ef;color:#252a34}
.ciae-aula-head-actions .ciae-btn.is-active{background:#111827;color:#fff;border-color:#111827}
.ciae-aula-head-actions .ciae-btn:hover{filter:brightness(0.98)}

.ciae-host-stop{display:none}


/* Responsive */
@media (max-width: 980px){
  .ciae-aula-body{grid-template-columns:1fr;gap:14px}
  .ciae-aula-right{position:static;top:auto}
  .ciae-aula-head{flex-direction:column;align-items:flex-start}
  .ciae-aula-head-actions{width:100%}
  .ciae-aula-head-actions .ciae-btn{flex:1;justify-content:center}
  .ciae-aula-card{padding:14px}
}

@media (max-width: 600px){
  .ciae-wrap{margin:18px auto;padding:0 10px}
  .ciae-aula-head{padding:14px;border-radius:16px}
  .ciae-aula-title{font-size:18px;line-height:1.2}
  .ciae-status-pill{margin-left:6px;padding:3px 8px;font-size:11px}
  .ciae-aula-head-actions{gap:6px}
  .ciae-aula-head-actions .ciae-btn{padding:10px 10px;border-radius:12px;font-size:13px}
  .ciae-side{padding:12px;border-radius:16px}
  .ciae-side h3{font-size:14px}
  .ciae-material-item a{word-break:break-word}
  .ciae-whiteboard-wrap{height:320px}
  .ciae-notes textarea{min-height:160px}
  .ciae-aulas-grid{grid-template-columns:1fr}
  .ciae-aula-card-title{font-size:15px}
}
