:root{--navy:#16295a;--blue:#2757a5;--lt:#eef4ff;--line:#c8d1e3;--green:#23a455;--away:#e6a23c;--off:#9aa3b2;--danger:#b42318;--text:#182033;--panel:#fff;--shadow:0 10px 34px rgba(20,39,80,.18)}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font:14px/1.4 system-ui,-apple-system,Segoe UI,sans-serif;background:#dfe7f4;color:var(--text)}button,input,textarea,select{font:inherit}button{cursor:pointer;border:1px solid #9aaac8;background:linear-gradient(#fff,#e8edf6);border-radius:5px;padding:7px 11px;color:#17264a}button:hover{filter:brightness(.97)}button.primary{background:linear-gradient(#3975ce,#1f4e9a);border-color:#1a4488;color:#fff;font-weight:700}input,textarea,select{border:1px solid #9eacc3;border-radius:5px;background:#fff;padding:8px;outline:none}input:focus,textarea:focus,select:focus{border-color:#3267b7;box-shadow:0 0 0 3px #3267b722}label{display:grid;gap:5px;margin:11px 0;font-weight:600}.hidden{display:none!important}.login-shell{min-height:100%;display:grid;place-items:center;background:radial-gradient(circle at 50% 20%,#f8fbff,#c8d5eb)}.login-card{width:min(390px,92vw);background:#fff;border:1px solid #9facc4;border-radius:12px;box-shadow:var(--shadow);overflow:hidden;padding:26px}.brand-lockup{display:flex;align-items:center;gap:15px;margin-bottom:20px}.brand-lockup h1{margin:0;color:var(--navy);font-size:30px}.brand-lockup p{margin:1px 0;color:#60708d}.running-man{width:56px;height:56px;border-radius:50%;background:#ffcf16;border:5px solid #101f48;display:grid;place-items:center;font-size:25px;color:#101f48;font-weight:900}.running-man.small{width:29px;height:29px;border-width:3px;font-size:12px}.login-card .primary{width:100%;padding:10px}.check{display:flex;align-items:center;gap:7px;font-weight:400}.check input{width:auto}.fineprint{font-size:11px;color:#758099;text-align:center;margin:18px 0 0}.error{color:var(--danger);min-height:20px;margin-top:8px}.app{height:100%;display:grid;grid-template-rows:50px 1fr}.topbar{background:linear-gradient(#213d7b,#132754);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 12px;border-bottom:1px solid #0e1c40}.brand-small,.self,.top-actions{display:flex;align-items:center;gap:8px}.top-actions button,.top-actions select{padding:5px 8px}.dot{width:10px;height:10px;border-radius:50%;display:inline-block;background:var(--off)}.dot.online{background:var(--green)}.dot.away{background:var(--away)}.workspace{min-height:0;display:grid;grid-template-columns:280px 1fr}.buddy-panel{background:#f8fbff;border-right:1px solid #aab8cf;display:grid;grid-template-rows:auto auto 1fr auto;min-height:0}.toolbar,.buddy-footer{display:flex;gap:5px;padding:8px;border-bottom:1px solid var(--line)}.buddy-footer{border-top:1px solid var(--line);border-bottom:0}.toolbar button,.buddy-footer button{flex:1}.search{padding:7px}.search input{width:100%}.buddy-list{overflow:auto;padding:2px 7px 12px}.group-title{display:flex;align-items:center;justify-content:space-between;padding:8px 4px 4px;font-weight:800;color:#334e7f}.buddy{display:flex;align-items:center;gap:8px;padding:6px;border-radius:5px;user-select:none}.buddy:hover{background:#e3edff}.buddy.offline{opacity:.55}.buddy .name{flex:1}.buddy small{color:#69758c}.empty{padding:20px;color:#738098;text-align:center}.chat-area{background:#fff;display:grid;grid-template-rows:39px 1fr;min-width:0;min-height:0}.tabs{background:#e7edf7;border-bottom:1px solid var(--line);display:flex;overflow-x:auto;align-items:end;padding-left:5px}.tab{height:33px;border-radius:6px 6px 0 0;border-bottom:0;margin-right:3px;white-space:nowrap}.tab.active{background:#fff;font-weight:700}.welcome{display:grid;place-content:center;text-align:center;color:#77849b}.welcome-icon{font-size:60px;color:#ffca0a;text-shadow:2px 2px #203665}.conversation{display:grid;grid-template-rows:auto 1fr auto auto;min-height:0}.chat-head{display:flex;justify-content:space-between;align-items:center;padding:9px 12px;border-bottom:1px solid var(--line);background:#fbfcff}.chat-head span{display:block;color:#6d7b94;font-size:12px}.messages{overflow:auto;padding:15px;background:linear-gradient(#fff,#fbfcff)}.msg{margin:4px 0}.msg .meta{font-size:11px;color:#748198}.msg .bubble{display:inline-block;max-width:min(75%,700px);padding:7px 9px;border-radius:7px;background:#edf2fb;word-break:break-word}.msg.mine{text-align:right}.msg.mine .bubble{background:#dbeaff}.system-msg{text-align:center;color:#7a8597;font-size:12px;margin:9px}.typing{height:24px;padding:3px 12px;color:#6b7589;font-style:italic}.composer{display:grid;grid-template-columns:1fr auto;gap:8px;padding:9px;border-top:1px solid var(--line)}.composer textarea{resize:none}.toast{position:fixed;right:18px;top:66px;z-index:99;background:#172a59;color:#fff;padding:10px 14px;border-radius:7px;box-shadow:var(--shadow);opacity:0;pointer-events:none;transform:translateY(-7px);transition:.2s}.toast.show{opacity:1;transform:none}dialog{border:0;border-radius:10px;padding:0;box-shadow:var(--shadow);width:min(460px,94vw)}dialog::backdrop{background:#10204488}.modal{padding:18px}.modal h2{margin:0 0 12px;color:#20396e}.modal.wide{width:min(720px,94vw)}dialog:has(.wide){width:min(720px,94vw)}.buttons{display:flex;justify-content:flex-end;gap:7px;margin-top:16px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.split{display:flex;gap:6px;flex-wrap:wrap}.results{margin-top:12px;max-height:250px;overflow:auto}.result{padding:8px;border-bottom:1px solid #e3e7ef}.info-body{max-height:55vh;overflow:auto}.info-grid{display:grid;grid-template-columns:120px 1fr;gap:7px}.profile-box{background:#f4f6fa;border:1px solid #dde2eb;padding:10px;border-radius:5px;white-space:pre-wrap}.settings-tabs{display:grid;grid-template-columns:1fr 1fr;gap:18px}.settings-tabs section:last-child{grid-column:1/-1;border-top:1px solid var(--line);padding-top:8px}.room-layout{display:grid;grid-template-columns:1fr 190px;min-height:0}.room-layout>div:first-child{display:grid;grid-template-rows:1fr auto auto;min-height:0}.room-layout>div:last-child{border-left:1px solid var(--line);padding:10px;overflow:auto}.room-layout h3{margin:0 0 8px}.room-user{padding:4px}.unread{background:#cfe0ff!important;font-weight:800}@media(max-width:760px){.workspace{grid-template-columns:1fr}.buddy-panel{position:absolute;z-index:5;left:0;top:50px;bottom:0;width:260px;box-shadow:var(--shadow)}.chat-area{grid-column:1}.topbar .brand-small strong{display:none}.settings-tabs{grid-template-columns:1fr}.room-layout{grid-template-columns:1fr}.room-layout>div:last-child{display:none}}

/* Public landing dashboard */
.landing-wrap{width:min(980px,94vw);display:grid;grid-template-columns:minmax(300px,390px) minmax(360px,1fr);gap:24px;align-items:start}
.server-card{background:var(--panel,#fff);border:1px solid rgba(0,0,0,.14);border-radius:14px;padding:22px;box-shadow:0 14px 40px rgba(0,0,0,.16)}
.server-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px}
.server-card-head h2{margin:0 0 3px;font-size:1.25rem}.server-card-head p{margin:0;color:#667085;font-size:.9rem}
.icon-btn{width:38px;height:38px;border-radius:50%;font-size:1.25rem;padding:0}
.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px 0 20px}
.stat{background:#f4f7fb;border:1px solid #dce3ed;border-radius:10px;padding:14px 10px;text-align:center}.stat strong{display:block;font-size:1.8rem;line-height:1;color:#172a59;margin-bottom:6px}.stat span{font-size:.77rem;color:#596579;font-weight:600}
.public-rooms-block h3{font-size:.95rem;margin:0 0 9px}.public-room-list{border:1px solid #dce3ed;border-radius:10px;max-height:225px;overflow:auto;background:#fafbfc}
.public-room{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;border-bottom:1px solid #e7ebf0}.public-room:last-child{border-bottom:0}.public-room-name{font-weight:650;color:#263755}.public-room-meta{font-size:.76rem;color:#7b8494;white-space:nowrap}
.wide-btn{width:100%;margin-top:14px}.secondary{background:#eef2f8;color:#172a59;border:1px solid #bdc8d9;font-weight:650}
.modal-note{margin-top:-6px;color:#667085;font-size:.9rem}.captcha-label{margin-top:4px}.captcha-question{display:inline-block;margin-left:6px;padding:3px 8px;background:#eef2f8;border:1px solid #cbd5e1;border-radius:6px;font-weight:700;color:#172a59}.honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}.success{color:#176b36;font-size:.9rem;margin-top:8px;min-height:1.2em}
@media(max-width:820px){.landing-wrap{grid-template-columns:1fr;max-width:470px}.stats-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:470px){.stats-grid{grid-template-columns:1fr}.stat{display:flex;align-items:center;justify-content:space-between;text-align:left}.stat strong{margin:0}.landing-wrap{width:min(96vw,470px)}}

.public-room-link{text-decoration:none}.public-room-link:hover{text-decoration:underline}.public-room-link:focus-visible{outline:2px solid currentColor;outline-offset:2px;border-radius:3px}

/* v6.4.1 public AIM room links */
.public-room-link{color:#1f5fbf;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px;cursor:pointer}
.public-room-link:hover{font-weight:700}

/* v6.7 room browser */
.room-browser-modal{width:min(520px,94vw)}
.room-browser-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.room-browser-heading h2{margin-bottom:2px}.room-browser-count{font-size:12px;color:#6d7b94}
.room-browser-modal h3{margin:15px 0 7px;color:#334e7f;font-size:14px}.room-browser-list{border:1px solid var(--line);border-radius:7px;max-height:260px;overflow:auto;background:#f9fbff}
.room-browser-item{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;border:0;border-bottom:1px solid #e2e8f2;border-radius:0;background:#fff;padding:10px 12px;text-align:left}.room-browser-item:last-child{border-bottom:0}.room-browser-item:hover{background:#eaf2ff}.room-browser-name{font-weight:700;color:#1f4e9a}.room-browser-meta{font-size:11px;color:#748198;white-space:nowrap}.room-browser-create{border-top:1px solid var(--line);margin-top:15px;padding-top:2px}.room-browser-help{font-size:11px;color:#748198;margin:5px 0 0}


/* v6.8 — public chat browser auto-sizing */
#chat-room-modal .modal-card,
#chatRoomModal .modal-card,
#chat-room-dialog .modal-card,
.chat-room-modal .modal-card,
.chat-room-dialog .modal-card {
    width: fit-content;
    min-width: min(420px, calc(100vw - 32px));
    max-width: min(760px, calc(100vw - 32px));
    max-height: calc(100vh - 48px);
    overflow: auto;
}

#chat-room-modal .public-room-list,
#chatRoomModal .public-room-list,
#chat-room-dialog .public-room-list,
.chat-room-modal .public-room-list,
.chat-room-dialog .public-room-list {
    width: 100%;
    max-height: min(52vh, 520px);
    overflow-y: auto;
}

@media (max-width: 560px) {
    #chat-room-modal .modal-card,
    #chatRoomModal .modal-card,
    #chat-room-dialog .modal-card,
    .chat-room-modal .modal-card,
    .chat-room-dialog .modal-card {
        width: calc(100vw - 24px);
        min-width: 0;
        max-width: calc(100vw - 24px);
        max-height: calc(100vh - 24px);
    }
}


/* v6.8.1 — public chat browser approximately 2x larger */
#chat-room-modal .modal-card,
#chatRoomModal .modal-card,
#chat-room-dialog .modal-card,
.chat-room-modal .modal-card,
.chat-room-dialog .modal-card {
    width: min(840px, calc(100vw - 32px));
    min-width: min(760px, calc(100vw - 32px));
    max-width: min(1100px, calc(100vw - 32px));
    max-height: calc(100vh - 32px);
}

#chat-room-modal .public-room-list,
#chatRoomModal .public-room-list,
#chat-room-dialog .public-room-list,
.chat-room-modal .public-room-list,
.chat-room-dialog .public-room-list {
    max-height: min(70vh, 800px);
}

@media (max-width: 800px) {
    #chat-room-modal .modal-card,
    #chatRoomModal .modal-card,
    #chat-room-dialog .modal-card,
    .chat-room-modal .modal-card,
    .chat-room-dialog .modal-card {
        width: calc(100vw - 24px);
        min-width: 0;
        max-width: calc(100vw - 24px);
        max-height: calc(100vh - 24px);
    }
}


/* v6.8.2 — Public Chat Rooms dialog occupies half the viewport */
#chat-room-modal .modal-card,
#chatRoomModal .modal-card,
#chat-room-dialog .modal-card,
.chat-room-modal .modal-card,
.chat-room-dialog .modal-card {
    width: 50vw;
    height: 50vh;
    min-width: 0;
    max-width: 50vw;
    min-height: 0;
    max-height: 50vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

#chat-room-modal .public-room-list,
#chatRoomModal .public-room-list,
#chat-room-dialog .public-room-list,
.chat-room-modal .public-room-list,
.chat-room-dialog .public-room-list {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
}

@media (max-width: 700px) {
    #chat-room-modal .modal-card,
    #chatRoomModal .modal-card,
    #chat-room-dialog .modal-card,
    .chat-room-modal .modal-card,
    .chat-room-dialog .modal-card {
        width: calc(100vw - 24px);
        height: 70vh;
        max-width: calc(100vw - 24px);
        max-height: 70vh;
    }
}


/* v6.8.3 — larger Public Chat Rooms dialog, no clipped content */
#chat-room-modal .modal-card,
#chatRoomModal .modal-card,
#chat-room-dialog .modal-card,
.chat-room-modal .modal-card,
.chat-room-dialog .modal-card {
    width: 75vw;
    height: 75vh;
    min-width: 0;
    max-width: 75vw;
    min-height: 0;
    max-height: 75vh;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: auto;
    box-sizing: border-box;
}

#chat-room-modal .modal-card *,
#chatRoomModal .modal-card *,
#chat-room-dialog .modal-card *,
.chat-room-modal .modal-card *,
.chat-room-dialog .modal-card * {
    box-sizing: border-box;
    max-width: 100%;
}

#chat-room-modal .public-room-list,
#chatRoomModal .public-room-list,
#chat-room-dialog .public-room-list,
.chat-room-modal .public-room-list,
.chat-room-dialog .public-room-list {
    flex: 1 1 auto;
    min-height: 180px;
    max-height: none;
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}

#chat-room-modal input,
#chatRoomModal input,
#chat-room-dialog input,
.chat-room-modal input,
.chat-room-dialog input,
#chat-room-modal textarea,
#chatRoomModal textarea,
#chat-room-dialog textarea,
.chat-room-modal textarea,
.chat-room-dialog textarea {
    width: 100%;
}

#chat-room-modal .modal-actions,
#chatRoomModal .modal-actions,
#chat-room-dialog .modal-actions,
.chat-room-modal .modal-actions,
.chat-room-dialog .modal-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

@media (max-width: 800px) {
    #chat-room-modal .modal-card,
    #chatRoomModal .modal-card,
    #chat-room-dialog .modal-card,
    .chat-room-modal .modal-card,
    .chat-room-dialog .modal-card {
        width: calc(100vw - 20px);
        height: calc(100vh - 20px);
        max-width: calc(100vw - 20px);
        max-height: calc(100vh - 20px);
    }
}


/* v6.8.4 — Chat Rooms popup fills the browser window */
#chat-room-modal,
#chatRoomModal,
#chat-room-dialog,
.chat-room-modal,
.chat-room-dialog {
    padding: 0 !important;
}

#chat-room-modal .modal-card,
#chatRoomModal .modal-card,
#chat-room-dialog .modal-card,
.chat-room-modal .modal-card,
.chat-room-dialog .modal-card,
.modal-overlay .chat-room-modal,
.modal-overlay .chat-room-dialog {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    min-width: 100vw !important;
    min-height: 100vh !important;
    max-width: 100vw !important;
    max-height: 100vh !important;
    margin: 0 !important;
    border-radius: 0 !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    display: flex !important;
    flex-direction: column !important;
}

#chat-room-modal .public-room-list,
#chatRoomModal .public-room-list,
#chat-room-dialog .public-room-list,
.chat-room-modal .public-room-list,
.chat-room-dialog .public-room-list {
    flex: 1 1 auto !important;
    min-height: 250px !important;
    max-height: none !important;
    width: 100% !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}


/* v6.8.5 — verified against actual Chat Rooms DOM */
dialog#chatRoomModal[open] {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
}

dialog#chatRoomModal > form.modal.room-browser-modal {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 28px !important;
    border-radius: 0 !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}

dialog#chatRoomModal .room-browser-list {
    flex: 1 1 auto !important;
    width: 100% !important;
    min-height: 240px !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

dialog#chatRoomModal .room-browser-create {
    flex: 0 0 auto !important;
    width: 100% !important;
}

dialog#chatRoomModal .room-browser-create input {
    width: 100% !important;
    box-sizing: border-box !important;
}

dialog#chatRoomModal .buttons {
    flex: 0 0 auto !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

dialog#chatRoomModal .room-browser-heading {
    flex: 0 0 auto !important;
}


/* v6.8.6 — verified Chat Rooms DOM, centered at 50% viewport */
dialog#chatRoomModal[open] {
    position: fixed !important;
    inset: 0 !important;
    width: 50vw !important;
    height: 50vh !important;
    min-width: 50vw !important;
    min-height: 50vh !important;
    max-width: 50vw !important;
    max-height: 50vh !important;
    margin: auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
}

dialog#chatRoomModal > form.modal.room-browser-modal {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 22px !important;
    border-radius: 10px !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}

dialog#chatRoomModal .room-browser-list {
    flex: 1 1 auto !important;
    min-height: 100px !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

@media (max-width: 800px) {
    dialog#chatRoomModal[open] {
        width: calc(100vw - 24px) !important;
        height: 75vh !important;
        min-width: calc(100vw - 24px) !important;
        min-height: 75vh !important;
        max-width: calc(100vw - 24px) !important;
        max-height: 75vh !important;
    }
}
