*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;background:#1a1a1a;color:#eee;-webkit-font-smoothing:antialiased}button{font-family:inherit}.join-screen{display:flex;align-items:center;justify-content:center;height:100%;padding:16px}.join-form{background:#2a2a2a;padding:32px;border-radius:12px;width:100%;max-width:380px;display:flex;flex-direction:column;gap:16px;box-shadow:0 8px 32px #0006}.join-form h1{font-size:22px}.join-form .subtitle{font-size:13px;color:#888;margin-top:-8px;margin-bottom:8px}.join-form label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:#aaa}.join-form input{padding:10px 12px;background:#1a1a1a;border:1px solid #3a3a3a;border-radius:6px;color:#eee;font-size:14px;outline:none;transition:border-color .15s}.join-form input:focus{border-color:#4a90e2}.join-form button{padding:12px;background:#4a90e2;color:#fff;border:0;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:background .15s;margin-top:4px}.join-form button:hover:not(:disabled){background:#5aa0f2}.join-form button:disabled{opacity:.6;cursor:not-allowed}.join-form .error{color:#f55;font-size:13px;padding:8px 12px;background:rgba(245,85,85,.1);border-radius:4px}.meeting{height:100%;display:grid;grid-template-rows:auto 1fr auto;position:relative}.meeting-header{padding:12px 16px;background:#2a2a2a;border-bottom:1px solid #3a3a3a;display:flex;justify-content:space-between;align-items:center}.meeting-header .room-label{font-weight:600;font-size:14px}.meeting-header .count{color:#aaa;font-size:13px}.meeting-main{display:grid;grid-template-columns:1fr 240px;gap:12px;padding:12px;overflow:hidden;min-height:0}.video-grid{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));grid-auto-rows:minmax(180px,1fr);align-content:start;overflow:auto}.tile{position:relative;background:#2a2a2a;border-radius:8px;overflow:hidden;aspect-ratio:4 / 3;min-height:180px}.tile-video{width:100%;height:100%}.tile-video video{width:100%!important;height:100%!important;object-fit:cover!important}.tile-placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#2a2a2a,#1f1f1f)}.tile-placeholder .avatar{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,#4a90e2,#2a5fa0);color:#fff;display:flex;align-items:center;justify-content:center;font-size:26px;font-weight:600}.tile-label{position:absolute;left:8px;bottom:8px;background:rgba(0,0,0,.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;padding:4px 10px;border-radius:4px;font-size:12px;display:flex;align-items:center;gap:6px}.tile-label .muted-tag{color:#fa8;font-size:11px}.participants{background:#2a2a2a;border-radius:8px;padding:16px;overflow:auto}.participants h3{font-size:13px;color:#aaa;margin-bottom:12px;font-weight:500}.participants ul{list-style:none}.participants li{padding:10px 0;border-bottom:1px solid #3a3a3a;display:flex;justify-content:space-between;align-items:center;font-size:13px;gap:8px}.participants li:last-child{border-bottom:0}.participants .pname{color:#ddd}.participants .badges{display:flex;gap:4px}.participants .badge{font-size:11px;color:#fa8;background:rgba(250,136,80,.1);padding:2px 6px;border-radius:3px}.control-bar{padding:14px;background:#2a2a2a;border-top:1px solid #3a3a3a;display:flex;justify-content:center;gap:12px}.ctrl{padding:10px 24px;background:#3a3a3a;color:#fff;border:0;border-radius:6px;cursor:pointer;font-size:13px;min-width:110px;transition:background .15s}.ctrl:hover{background:#4a4a4a}.ctrl.off{background:#5a3a3a;color:#fa8}.ctrl.off:hover{background:#6a4242}.ctrl.danger{background:#d33;color:#fff}.ctrl.danger:hover{background:#e44}.error-toast{position:absolute;top:56px;left:50%;transform:translate(-50%);background:rgba(245,85,85,.95);color:#fff;padding:10px 16px;border-radius:6px;font-size:13px;cursor:pointer;display:flex;align-items:center;gap:12px;box-shadow:0 4px 16px #0006;max-width:80%}.error-toast .dismiss{font-size:18px;line-height:1;opacity:.7}@media (max-width: 768px){.meeting-main{grid-template-columns:1fr}.participants{display:none}}