*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Tahoma,Arial,sans-serif;background:#f4f6f8;color:#17202a}button,input{font:inherit}.hidden{display:none!important}.center-page{min-height:100vh;display:grid;place-items:center;padding:20px}.card{background:#fff;border:1px solid #e5e8eb;border-radius:16px;box-shadow:0 12px 35px #0000000b}.landing{width:min(460px,100%);padding:38px;text-align:center}.landing h1{margin-top:0}.form{padding:26px;width:min(620px,100%)}.form h1,.form h2{margin-top:0}.form label{display:block;font-size:14px;margin:12px 0}.form input:not([type=checkbox]){width:100%;margin-top:7px;padding:12px;border:1px solid #d7dce1;border-radius:10px;outline:none}.form input:focus{border-color:#6d8aa8}.btn,.ghost,.tool,.control{border:0;border-radius:10px;padding:11px 16px;cursor:pointer}.btn{background:#1f2937;color:#fff}.ghost{background:#eef1f4;color:#17202a}.form .btn{width:100%;margin-top:10px}.msg{min-height:24px;margin-top:10px;color:#a33;font-size:13px}.check{display:flex!important;align-items:center;gap:8px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.actions{display:flex;gap:8px}.actions .btn{width:auto}.admin-wrap{width:min(1100px,100%);margin:auto;padding:24px}.admin-head,.section-title{display:flex;align-items:center;justify-content:space-between;gap:16px}.admin-head h1{margin:0}.admin-head p{color:#667085}.admin-wrap>section{margin-top:20px}.class-list{display:grid;gap:12px}.class-item{background:#fff;border:1px solid #e5e8eb;border-radius:14px;padding:16px;display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}.class-item h3{margin:0 0 8px}.meta{color:#667085;font-size:13px;line-height:2}.class-link{direction:ltr;text-align:left;background:#f6f7f8;padding:7px 10px;border-radius:8px;display:inline-block;max-width:100%;overflow:auto}.class-actions{display:flex;gap:8px}.class-actions button{padding:8px 11px;border:0;border-radius:8px;cursor:pointer}.danger{background:#fff0f0!important;color:#b42318}.class-body{background:#11161c}.room{height:100vh;display:grid;grid-template-rows:52px 1fr 64px;overflow:hidden}.room-head{background:#fff;color:#17202a;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-bottom:1px solid #ddd}.board-area{position:relative;background:#20262d;overflow:hidden}.board-tools{position:absolute;z-index:10;top:10px;left:10px}.tool{background:#fff}.board-area canvas{position:absolute;inset:0;width:100%;height:100%;background:#fff;cursor:crosshair}.tiles{position:absolute;right:12px;bottom:12px;display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end;max-width:55%;pointer-events:none}.tile{position:relative;background:#0e1216;color:#fff;border:1px solid #3a424b;border-radius:10px;overflow:hidden;width:210px;min-height:48px;box-shadow:0 8px 20px #0005}.tile video{display:block;width:100%;height:125px;object-fit:cover;background:#000}.tile .name{padding:9px;font-size:13px}.tile.speaking{border-color:#75c46b}.tile.audio-only{width:auto;min-width:150px}.controls{background:#fff;display:flex;justify-content:center;gap:8px;align-items:center;border-top:1px solid #ddd}.control{background:#eef1f4;color:#17202a}.control.on{background:#dcecff}.users-panel{position:absolute;right:10px;bottom:74px;width:min(320px,calc(100% - 20px));max-height:55vh;overflow:auto;background:#fff;color:#17202a;border-radius:12px;box-shadow:0 12px 35px #0005;z-index:30}.users-head{display:flex;justify-content:space-between;padding:12px 14px;border-bottom:1px solid #ddd}.users-head button{border:0;background:none;font-size:24px;cursor:pointer}.user-row{padding:10px 14px;border-bottom:1px solid #eee;font-size:14px}.join-card{max-width:430px}.join-card h1{font-size:22px}.section-title{margin-top:25px}.section-title h2{margin:0}@media(max-width:650px){.grid3{grid-template-columns:1fr}.admin-wrap{padding:14px}.class-item{grid-template-columns:1fr}.class-actions{justify-content:flex-start}.tiles{max-width:75%}.tile{width:150px}.tile video{height:90px}.controls{gap:4px;padding:6px}.control{padding:9px 8px;font-size:12px}}