#roomEntryDialog{box-sizing:border-box;width:min(540px,calc(100% - 24px));max-height:calc(100dvh - 24px);padding:0;border:1px solid #4a677d;border-radius:20px;background:#111f31;color:#f3f8fc;overflow:auto}#roomEntryDialog::backdrop{background:#020812c9}#roomEntryDialog *{box-sizing:border-box;min-width:0}#roomEntryDialog header{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px;background:#111f31;position:sticky;top:0;z-index:1;border-bottom:1px solid #354c62}#roomEntryDialog h2{font-size:22px;margin:0}.room-entry-body{padding:16px}.room-entry-body form{display:grid;gap:16px}.room-entry-body label{display:block;font-size:15px}.room-entry-body .input{display:block;width:100%;margin-top:8px}.room-entry-body p{line-height:1.5}.room-entry-body button,#roomEntryDialog header button{min-height:44px;white-space:normal}.room-entry-body form>button{width:100%}.room-entry-check{display:flex!important;align-items:center;gap:10px;min-height:44px}.room-entry-check input{width:20px;height:20px}.room-directory{display:grid;gap:12px;margin-bottom:12px}.room-directory article{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid #3e716f;border-radius:14px;background:#142b3b}.room-directory h3{font-size:17px;margin:0;overflow-wrap:anywhere}.room-directory p{font-size:14px;margin:5px 0 0;color:#b9c8d8}.room-directory button{flex-shrink:0}.room-browse{width:100%;margin-top:8px}#roomEntryNotice:empty{display:none}#roomEntryNotice{color:#ffe1a4;font-size:14px}#nameHint{margin-top:10px}label[for=name]{display:block;margin-bottom:10px}#name[aria-invalid=true]{border-color:#ff819f}body.invited-entry #browseRooms{display:none}#roomEntryDialog [hidden]{display:none!important}@media(max-width:360px){.room-directory article{flex-wrap:wrap}.room-directory button{width:100%}}@media(pointer:coarse){#roomEntryDialog button{min-height:48px}}
#roomEntryDialog.showing-directory{width:min(700px,calc(100% - 24px))}.room-entry-body>h3{font-size:16px;margin:16px 0 10px;color:#c3f7e8}.room-directory-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding-bottom:12px;border-bottom:1px solid #354c62}.room-directory-hint{font-size:14px;color:#b9c8d8;margin:0}.room-directory-hint{margin:-4px 0 12px}.room-vacancies{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.room-vacancies article{display:grid;gap:12px;background:linear-gradient(145deg,#153039,#142032);border-color:#3a646b}.room-vacancies h3{font-size:16px}.room-vacancies button{width:100%;padding-inline:10px}.room-vacancies p{font-size:13px}.room-directory-footer{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between}.room-directory-notice:empty{display:none}.room-directory-notice{width:100%;font-size:13px;margin:0;color:#ffe1a4}@media(max-width:480px){.room-directory-actions{gap:8px}.room-directory-actions button{width:100%}.room-vacancies{grid-template-columns:1fr;gap:8px}.room-vacancies article{display:flex;flex-wrap:nowrap;padding:10px;gap:8px}.room-vacancies button{width:auto;min-width:110px}.room-directory-footer button{flex:1}}

.room-directory-footer [data-directory-action=refresh]{margin-inline-start:auto;padding-inline:12px;font-size:13px;color:#b9c8d8;background:transparent;border-color:transparent}.room-code-error:empty{display:none}.room-code-error{margin:0;font-size:14px;color:#ffe1a4}.room-code-form #roomEntryCode{font-size:22px;letter-spacing:.15em;text-align:center}.room-code-form #roomEntryCode[aria-invalid=true]{border-color:#ff819f}@media(max-width:360px){#roomEntryDialog header{gap:8px;padding:12px}#roomEntryDialog h2{font-size:20px}.room-entry-body{padding:12px}.room-directory-actions button{padding-inline:8px;font-size:14px}}
@media(max-width:480px) and (max-height:650px){#roomEntryDialog.showing-directory header{padding-block:8px}#roomEntryDialog.showing-directory .room-entry-body{padding-block:8px}#roomEntryDialog.showing-directory .room-directory-actions{padding-bottom:8px}#roomEntryDialog.showing-directory .room-entry-body>h3{margin-block:12px 8px}#roomEntryDialog.showing-directory .room-directory-hint{margin-bottom:8px}#roomEntryDialog.showing-directory .room-vacancies{gap:6px}#roomEntryDialog.showing-directory .room-vacancies article{padding-block:8px}}