*{box-sizing:border-box;margin:0;padding:0}html,body{background:#000;width:100%;height:100%;overflow:hidden}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}video{object-fit:cover;background:#000;width:100%;height:100%}.page{flex-direction:column;width:100%;height:100%;display:flex}.page video{flex:1}.status{z-index:10;color:#fff;pointer-events:none;background:#0009;border-radius:.375rem;padding:.5rem .75rem;font-size:.875rem;position:fixed;top:1rem;left:1rem;right:1rem}.room-info{z-index:10;color:#fff;word-break:break-all;background:#0009;border-radius:.375rem;max-width:calc(100% - 2rem);padding:.5rem .75rem;font-size:.875rem;position:fixed;top:3.5rem;left:1rem}.room-info a{color:#7dd3fc}.action-btn{z-index:20;color:#000;cursor:pointer;pointer-events:auto;touch-action:manipulation;background:#fff;border:none;border-radius:9999px;padding:.75rem 1.25rem;font-size:1rem;position:fixed;bottom:2rem;left:50%;transform:translate(-50%)}.action-btn[hidden]{display:none}.db-meter{z-index:15;pointer-events:none;background:#00000080;border-radius:9999px;align-items:center;width:320px;height:2rem;display:flex;position:fixed;bottom:6rem;left:50%;overflow:hidden;transform:translate(-50%)}.db-meter-bar{background:linear-gradient(90deg,#4ade80 0%,#facc15 70%,#f87171 100%);border-radius:9999px;height:100%;transition:width 50ms linear}.db-meter-value{color:#fff;font-variant-numeric:tabular-nums;text-shadow:0 1px 2px #0009;font-size:.875rem;position:absolute;right:.75rem}.home{color:#fff;text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:1rem;width:100%;height:100%;padding:1rem;display:flex}.home h1{font-size:1.5rem}.home a{color:#000;background:#fff;border-radius:9999px;padding:.75rem 1.5rem;font-weight:500;text-decoration:none}.join-form{flex-direction:column;gap:.5rem;width:100%;max-width:320px;margin-top:.5rem;display:flex}.join-form input{color:#fff;text-align:center;background:#ffffff1a;border:1px solid #ffffff4d;border-radius:9999px;padding:.75rem 1rem;font-size:1rem}.join-form input::placeholder{color:#fff9}.home .action-btn{width:auto;min-width:200px;position:static;transform:none}.join-form .action-btn{width:100%;position:static;transform:none}.camera-settings-toggle{z-index:20;position:fixed;bottom:2rem;left:1.5rem;right:auto;transform:none}.camera-settings-panel{z-index:30;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;background:#000000d9;border-radius:1rem;width:min(22rem,100vw - 2rem);max-height:calc(100vh - 7rem);padding:1rem;font-size:.875rem;position:fixed;bottom:5.5rem;left:1rem;overflow-y:auto;box-shadow:0 10px 30px #00000080}.camera-settings-header{justify-content:space-between;align-items:center;margin-bottom:.75rem;display:flex}.camera-settings-header h2{font-size:1rem;font-weight:600}.camera-settings-close{color:#fff;cursor:pointer;background:#ffffff26;border:none;border-radius:.375rem;padding:.25rem .5rem}.camera-setting{border-bottom:1px solid #ffffff1a;grid-template-columns:7rem 1fr auto;align-items:center;gap:.75rem;padding:.5rem 0;display:grid}.camera-setting.fill-light-toggle{grid-template-columns:7rem 1fr}.camera-setting span{font-weight:500}.camera-setting select{color:#fff;background:#ffffff1a;border:1px solid #ffffff4d;border-radius:.375rem;padding:.375rem .5rem;font-size:.875rem}.camera-setting input[type=range]{accent-color:#7dd3fc;width:100%}.camera-setting output{text-align:right;font-variant-numeric:tabular-nums;min-width:3rem}.toggle{color:#fff;cursor:pointer;background:#fff3;border:none;border-radius:9999px;justify-self:end;padding:.375rem .875rem;font-size:.875rem;transition:background .15s}.toggle.active{color:#000;background:#7dd3fc}.camera-settings-actions{gap:.5rem;margin-top:.75rem;display:flex}.preset-btn,.reset-btn{cursor:pointer;border:none;border-radius:.5rem;flex:1;padding:.5rem .75rem;font-size:.875rem}.preset-btn{color:#000;background:#fef08a}.reset-btn{color:#fff;background:#ffffff26}.camera-settings-empty{color:#ffffffb3;padding:.75rem 0;font-size:.8125rem}.fill-light-active{background:#fff}.fill-light-active video{border:1.5rem solid #fff;box-shadow:0 0 4rem #fffc}@media (width<=480px){.camera-settings-panel{width:calc(100vw - 1rem);left:.5rem}.camera-setting{grid-template-columns:6rem 1fr auto}.camera-setting.fill-light-toggle{grid-template-columns:6rem 1fr}}
