.login-page{display:flex;flex-direction:column;justify-content:center;align-items: center;gap:20px;height:100%}.login-box{background:0 0;border:none;width:90%;max-width:400px;padding:0 32px}.login-box h1{font-size:var(--font-size-big);color:var(--text-header);text-align:center;text-transform:uppercase;letter-spacing:2px;margin-bottom:16px;font-weight:400}.login-box .subtitle{text-align:center;color:var(--text-dim);font-size:var(--font-size-small);margin-bottom:16px}.login-tabs{display:flex;gap:0;margin-bottom:16px}.login-tab{text-align:center;cursor:pointer;border:1px solid var(--border);background:var(--bg);color:var(--text-dim);font-size:var(--font-size-small);flex:1;padding:6px}.login-tab.active{background:var(--bg-header);color:var(--text-header);border-color:var(--border-light)}.login-field{margin-bottom:12px}.login-field label{display:block;color:var(--text-dim);font-size:var(--font-size-small);margin-bottom:4px}.login-field input{width:100%;font-size:16px}.login-submit{font-size:var(--font-size);letter-spacing:1px;display:flex;justify-content:center;align-items: center;gap:6px;width:100%;margin-top:8px;padding:6px}.login-submit:disabled{opacity:.7;cursor:not-allowed}.spinner{display:inline-block;border:2px solid var(--bg-header);animation:spin .6s linear infinite;border-top-color:#0000;border-radius:50%;width:12px;height:12px}@keyframes spin{to{transform:rotate(360deg)}}.login-error{color:var(--accent-red);text-align:center;font-size:var(--font-size-small);min-height:1.4em;margin-top:8px}.login-version{text-align:center;color:var(--text-dim);opacity:.5;margin-top:12px;font-size:7pt}.login-footer{color:var(--text-dim);font-size:var(--font-size-small);text-align:center}.login-logo-block{background:var(--bg-header);text-align:center;border:1px solid var(--border);padding:16px 24px 12px}.login-logo{display:block;width:120px;height:auto;margin:0 auto 8px}.login-logo-title{color:var(--text-header);font-size:var(--font-size-big);letter-spacing:1px;margin-bottom:4px;font-weight:700}.login-logo-since{color:var(--text-dim);font-size:var(--font-size-small);font-weight:400}.login-logo-url{color:#ffffef;font-weight:700}@media (max-width:768px){.login-page{justify-content:flex-start;gap:12px;padding-top:10vh}.login-logo-block{padding:12px 16px 8px}.login-logo{width:80px}.login-logo-title{font-size:var(--font-size)}.login-logo-since{font-size:7pt}.login-box{padding:16px 20px}}.chat-layout{display:grid;grid-template-rows:1fr auto;grid-template-columns:1fr 4px 240px;height:var(--app-height,100%);gap:0;padding-top:26px}.status-bar{position:fixed;top:var(--vv-offset,0px);z-index:50;background:var(--bg-header);color:var(--text-header);display:flex;font-size:var(--font-size-small);border-bottom:1px solid var(--border);justify-content:space-between;align-items: center;height:26px;padding:0 10px;left:0;right:0}.status-bar .status-left{display:flex;align-items: center;gap:8px}.status-bar .status-right{display:flex;align-items: center;gap:12px}.status-bar .online-count{color:var(--accent-green)}.logout-btn{display:flex;color:var(--accent-red);cursor:pointer;border-radius:3px;align-items: center;padding:2px}.logout-btn:hover{background:#f333}.burger-btn{display:none;color:var(--text-header);cursor:pointer;background:0 0;border:none;border-radius:3px;padding:2px;line-height:1}.burger-btn:hover{background:#ebbf8833}.column-divider{grid-column:2;grid-row:1;cursor:col-resize;background:var(--border);touch-action:none}.column-divider:hover{background:var(--accent-amber)}.message-area{grid-column:1;grid-row:1;overflow-y:auto;padding:4px 8px}.message-area .msg{word-wrap:break-word;margin:1px 0;line-height:1.35}.msg .nick-link{cursor:pointer;font-weight:400}.msg .nick-link:hover{background:var(--link-hover-bg)}.msg .nick-link.mine{color:var(--accent-red)!important}.msg-time{color:var(--text-dim);font-size:var(--font-size-small);margin-right:4px}.msg-login,.msg-logout{color:var(--text-dim);font-size:var(--font-size-small)}.msg-login .nick-inline{color:var(--accent-green)}.msg-logout .nick-inline{color:var(--text-dim)}.msg-kill{color:var(--accent-red);font-size:var(--font-size-small)}.msg-action{font-size:var(--font-size-small)}.msg-whisper{border-left:2px solid var(--accent-cyan);background:#00cccc0d;padding-left:6px}.msg-whisper .whisper-tag{color:var(--accent-cyan);font-size:var(--font-size-small)}.msg-system{color:var(--accent-amber);font-weight:400;font-size:var(--font-size-small)}.msg-invite{color:var(--accent-magenta);font-size:var(--font-size-small)}.input-area{grid-column:1/-1;grid-row:2;display:flex;background:var(--bg-panel);border-top:1px solid var(--border);align-items: center;gap:6px;padding:4px 8px}.input-wrap{position:relative;display:flex;flex:1;align-items: center;min-width:0}.input-wrap input[type=text]{width:100%;height:28px;padding-right:48px}.input-btn{position:absolute;display:flex;cursor:pointer;user-select:none;justify-content:center;align-items: center;width:24px;height:28px;font-size:12px;top:0;right:0}.input-btn-clear{color:var(--accent-red);right:0}.input-btn-send{color:var(--accent-green);right:24px}.input-btn:hover{background:var(--bg-hover)}.input-area .btn-whisper{background:var(--bg-header);color:var(--accent-cyan);border-color:var(--accent-cyan);white-space:nowrap;height:28px}.input-area .btn-whisper:hover{background:#00cccc26}.whisper-indicator{color:var(--accent-cyan);font-size:var(--font-size-small);display:flex;align-items: center;gap:4px}.whisper-indicator .cancel{cursor:pointer;color:var(--accent-red)}.private-overlay{position:fixed;display:flex;z-index:100;background:#000000b3;justify-content:center;align-items: center;inset:0}.private-chat{background:var(--bg);border:1px solid var(--accent-cyan);display:flex;flex-direction:column;width:500px;max-height:80vh}.private-chat .private-header{background:var(--bg-header);display:flex;color:var(--text-header);justify-content:space-between;align-items: center;padding:6px 10px}.private-chat .private-header .close-btn{cursor:pointer;color:var(--accent-red)}.private-chat .private-messages{overflow-y:auto;flex:1;min-height:200px;padding:8px}.private-chat .private-input{display:flex;border-top:1px solid var(--border);gap:4px;padding:6px}.private-chat .private-input input{flex:1}.kill-overlay{position:fixed;display:flex;z-index:100;background:#000000b3;justify-content:center;align-items: center;inset:0}.kill-menu{background:var(--bg);border:1px solid var(--accent-red);width:360px;padding:16px}.kill-menu h3{color:var(--accent-red);font-size:var(--font-size);margin-bottom:12px}.kill-menu .kill-field{margin-bottom:10px}.kill-menu .kill-field label{display:block;color:var(--text-dim);font-size:var(--font-size-small);margin-bottom:4px}.kill-menu .kill-field select,.kill-menu .kill-field input{width:100%}.kill-menu .kill-buttons{display:flex;justify-content:flex-end;gap:8px}.modal-overlay{position:fixed;display:flex;z-index:300;background:#000000b3;justify-content:center;align-items: center;inset:0}.modal-box{background:var(--bg-panel);border:1px solid var(--border);min-width:240px;max-width:90vw;padding:16px 24px}.modal-title{color:var(--text-header);font-size:var(--font-size);text-align:center;margin-bottom:12px}.modal-body{text-align:center;margin-bottom:16px}.modal-buttons{display:flex;justify-content:center;gap:8px}.modal-buttons button{min-width:60px}.drawer-overlay{display:none}@media (max-width:768px){.chat-layout{grid-template-columns:1fr}.column-divider,.chat-layout>.user-list{display:none}.message-area{grid-column:1}.burger-btn{display:inline-block}.status-bar .online-count{cursor:pointer}.drawer-overlay{display:block;position:fixed;z-index:200;background:#0009;inset:0}.drawer{position:absolute;background:var(--bg);border-left:1px solid var(--border);display:flex;overflow:hidden;flex-direction:column;width:260px;top:0;bottom:0;right:0}.drawer-header{background:var(--bg-header);color:var(--text-header);display:flex;font-size:var(--font-size);border-bottom:1px solid var(--border);justify-content:space-between;align-items: center;padding:8px 12px}.drawer-close{cursor:pointer;color:var(--accent-red);display:flex;border-radius:3px;align-items: center;padding:2px}.drawer-close:hover{background:#f333}.drawer .user-list{overflow-y:auto;grid-column:unset;grid-row:unset;flex:1}.input-area{grid-column:1}.input-wrap input[type=text]{font-size:16px}.private-chat{width:95vw;max-height:90vh}.kill-menu{width:90vw}}.user-list{grid-column:3;grid-row:1;overflow-y:auto;font-size:var(--font-size-small);padding:4px 6px}.user-list .mates-section{margin-bottom:2px}.user-list .mates-separator{border:none;border-top:1px solid var(--text);width:35px;margin:2px 0}.user-entry{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px;line-height:1.5}.user-entry .user-time{color:var(--text-dim);font-size:7pt}.user-entry .user-nick{cursor:pointer;font-size:9pt;font-weight:400}.user-entry .user-nick:hover{background:var(--link-hover-bg)}.user-entry .user-status{font-size:7pt;font-weight:400}.user-entry .user-city{color:var(--text-dim);font-size:7pt}.user-entry.ignored .user-nick{text-decoration:line-through}.user-entry .sleeping-icon{color:var(--text-dim);font-size:7pt}.user-entry .invisible-icon{color:var(--accent-cyan);font-size:7pt}.user-entry .altnick-marker{color:var(--text-dim);font-size:7pt}.user-list .user-count{color:var(--text-dim);font-size:var(--font-size-small);margin-top:4px}.user-context-menu{position:fixed;background:var(--bg-panel);border:1px solid var(--border-light);z-index:50;min-width:140px;padding:4px 0}.user-context-menu .menu-item{cursor:pointer;font-size:var(--font-size-small);color:var(--text);padding:3px 12px}.user-context-menu .menu-item:hover{background:var(--bg-header);color:var(--text-header)}.user-context-menu .menu-item.danger{color:var(--accent-red)}.user-context-menu .menu-separator{border-top:1px solid var(--border);margin:2px 0}:root{--bg:#000;--bg-panel:#0a0805;--bg-header:#403425;--bg-input:#1a1108;--bg-hover:#1a1108;--bg-user-highlight:#1a1108;--text:#d6ae7c;--text-dim:#8a7050;--text-header:#ebbf88;--text-bright:#ffffef;--link:#ffffef;--link-hover-bg:#905000;--accent-green:#00ff41;--accent-red:#f33;--accent-cyan:#0cc;--accent-amber:#fa0;--accent-magenta:#f0f;--border:#403425;--border-light:#ebbf88;--input-bg:#ebbf88;--input-border:#ebbf88;--input-text:#000;--scrollbar-thumb:#ebbf88;--scrollbar-track:#0a0805;--font:Arial,Helvetica,sans-serif;--font-size:10pt;--font-size-small:8pt;--font-size-big:12pt}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#app{height:100%;overflow:hidden;width:100%;height:100dvh}body{background:var(--bg);color:var(--text);font-family:var(--font);font-size:var(--font-size);-webkit-font-smoothing:none;-moz-osx-font-smoothing:auto;font-weight:700;line-height:1.4}a{color:var(--link);text-decoration:none;cursor:pointer;font-size:9pt;font-weight:400}a:hover{background:var(--link-hover-bg)}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--scrollbar-track)}::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border:1px solid var(--bg)}::-webkit-scrollbar-thumb:hover{background:var(--text)}*{scrollbar-color:var(--scrollbar-thumb)var(--scrollbar-track);scrollbar-width:thin}body:after{content:"";position:fixed;pointer-events:none;z-index:9999;background:repeating-linear-gradient(0deg,#0000,#0000 2px,#00000008 2px 4px);width:100%;height:100%;top:0;left:0}::selection{background:var(--accent-amber);color:var(--bg)}input,textarea,select{font-family:var(--font);font-size:var(--font-size);background:var(--input-bg);color:var(--input-text);border:1px solid var(--border);outline:none;padding:3px 6px}input:focus,textarea:focus{border-color:var(--input-border)}button,.btn{font-family:var(--font);background:var(--border-light);color:var(--bg-header);border:1px solid var(--text);cursor:pointer;border-radius:2px;padding:2px 12px;font-size:9pt;font-weight:700}button:hover,.btn:hover{background:var(--text);border-color:var(--text-dim)}button:active,.btn:active{background:var(--bg-header);color:var(--text-header)}hr{border:none;border-top:1px solid var(--border);margin:4px 0}small{font-size:var(--font-size-small)}big,strong{font-size:var(--font-size-big)}