.splash-container{position:fixed;top:0;right:0;bottom:0;left:0;background:#000;display:flex;justify-content:center;align-items:center;opacity:0;transition:opacity .3s ease;z-index:9999}.splash-container.fade-in{opacity:1}.splash-container.fade-out{opacity:0;transition:opacity .4s ease .3s}.splash-content{display:flex;flex-direction:column;align-items:center;transition:transform .05s ease}.splash-content.glitch{animation:glitch-shake .3s ease}@keyframes glitch-shake{0%,to{transform:translate(0)}10%{transform:translate(-10px)}20%{transform:translate(10px)}30%{transform:translate(-5px)}40%{transform:translate(5px)}50%{transform:translate(0)}}.logo-container{margin-bottom:32px;transition:transform .15s ease}.logo-container.pulse{animation:logo-pulse .25s ease}@keyframes logo-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.void-outer{width:120px;height:120px;border-radius:60px;border:2px solid #00ff00;display:flex;justify-content:center;align-items:center;background:#00ff0008}.void-inner{width:80px;height:80px;border-radius:40px;border:1px solid rgba(0,255,0,.3);display:flex;justify-content:center;align-items:center;background:#000}.void-symbol{font-size:48px;color:#0f0;font-family:monospace;text-shadow:0 0 10px #00ff00}.title-container{display:flex;flex-direction:column;align-items:center;margin-bottom:48px}.splash-title{font-size:36px;font-family:monospace;font-weight:700;color:#0f0;letter-spacing:12px;text-shadow:0 0 15px #00ff00}.splash-subtitle{font-size:12px;font-family:monospace;color:#00ff0080;margin-top:8px;letter-spacing:2px}.boot-container{display:flex;flex-direction:column;align-items:flex-start;min-height:100px}.boot-line{font-size:12px;font-family:monospace;color:#00ff00b3;margin-bottom:4px;display:block}.boot-line.ready{color:#0f0}.cursor{font-size:12px;font-family:monospace;color:#0f0;opacity:.8;animation:blink .5s infinite}@keyframes blink{0%,50%{opacity:.8}51%,to{opacity:0}}.void-overlay{position:absolute;width:30vmin;height:30vmin;border-radius:50%;background:#000;transform:scale(0);opacity:0;transition:transform .5s ease,opacity .5s ease;pointer-events:none}.void-overlay.expand{transform:scale(10);opacity:1}.scanlines{position:absolute;top:0;right:0;bottom:0;left:0;opacity:.03;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,255,0,.1) 2px,rgba(0,255,0,.1) 4px);pointer-events:none}.onboarding-container{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;justify-content:center;align-items:center;z-index:9998}.onboarding-content{width:100%;max-width:400px;padding:32px;display:flex;flex-direction:column;align-items:center;transition:opacity .3s ease,transform .05s ease}.onboarding-content.in{opacity:0}.onboarding-content.visible{opacity:1}.onboarding-content.out{opacity:0;transition:opacity .15s ease}.onboarding-content.glitch{animation:onboarding-glitch .2s ease}@keyframes onboarding-glitch{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-4px)}80%{transform:translate(0)}}.onboarding-header{font-size:18px;font-family:monospace;font-weight:700;letter-spacing:4px;margin-bottom:40px;text-align:center;line-height:28px;cursor:default;white-space:pre-line}.onboarding-text-container{min-height:200px;display:flex;align-items:center;justify-content:center}.onboarding-text{font-size:14px;font-family:monospace;line-height:24px;text-align:center;color:var(--text);white-space:pre-line}.cursor-dim{opacity:.5;animation:blink .5s infinite}@keyframes blink{0%,50%{opacity:.5}51%,to{opacity:0}}.onboarding-button{margin-top:48px;padding:16px 32px;border-width:2px;border-style:solid;border-radius:4px;background:transparent;font-size:14px;font-family:monospace;font-weight:700;letter-spacing:2px;cursor:pointer;transition:background .2s ease,color .2s ease}.onboarding-button:hover:not(.disabled){background:var(--primary);color:var(--bg)!important}.onboarding-button.disabled{opacity:.3;cursor:not-allowed}.onboarding-progress{display:flex;flex-direction:row;margin-top:48px;gap:16px}.progress-dot{width:12px;height:12px;border-width:2px;border-style:solid;transform:rotate(45deg);transition:background .2s ease,border-color .2s ease}.ghost-dialog{position:relative;z-index:9000}.ghost-dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000f2}.ghost-dialog-container{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;justify-content:center;align-items:center;padding:16px}.ghost-dialog-panel{width:100%;max-width:340px;border-radius:8px;border-width:1px;border-style:solid;padding:20px;display:flex;flex-direction:column;align-items:center}.ghost-modal-header{font-size:16px;font-family:monospace;font-weight:700;letter-spacing:3px;margin-bottom:6px;text-align:center}.ghost-modal-subtitle{font-size:11px;font-family:monospace;text-align:center;margin-bottom:16px}.room-label{font-size:10px;font-family:monospace;letter-spacing:2px;margin-top:8px}.room-name-display{font-size:22px;font-family:monospace;font-weight:700;margin:12px 0}.ghost-modal-input{width:100%;height:48px;border-radius:8px;border-width:1px;border-style:solid;padding:0 16px;font-family:monospace;font-size:16px;text-align:center;margin-bottom:12px;outline:none}.ghost-modal-input:focus{border-color:var(--primary)!important}.ghost-modal-input::placeholder{color:var(--textMuted)}.ghost-modal-button{width:100%;padding:14px;border-width:1px;border-style:solid;border-radius:6px;background:transparent;font-size:13px;font-family:monospace;font-weight:700;letter-spacing:1px;cursor:pointer;margin-bottom:10px;transition:background .2s ease,color .2s ease}.ghost-modal-button:hover:not(.disabled){background:var(--primary);color:var(--bg)!important}.ghost-modal-button.disabled{opacity:.4;cursor:not-allowed}.ghost-modal-button.leave{margin-top:8px}.or-text{font-size:11px;font-family:monospace;margin:6px 0}.ghost-modal-hint{font-size:10px;font-family:monospace;margin-top:12px}.sidebar{position:fixed;top:0;left:0;height:100vh;width:240px;background:var(--bg, #0a0a0a);border-right:1px solid var(--border, rgba(255, 255, 255, .1));display:flex;flex-direction:column;z-index:100;transform:translate(-100%);transition:transform .25s cubic-bezier(.4,0,.2,1)}.sidebar.open{transform:translate(0)}@media(min-width:1025px){.sidebar{transform:translate(0);position:relative}.sidebar-close{display:none!important}.sidebar-header{justify-content:flex-start}}.sidebar-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;z-index:99;animation:fadeIn .15s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--border, rgba(255, 255, 255, .08));background:var(--bgOverlay, rgba(10, 10, 10, .6))}.sidebar-title-group{display:flex;align-items:center;gap:8px}.sidebar-icon{width:18px;height:18px;color:var(--primary, #a855f7)}.sidebar-title{font-size:15px;font-weight:600;letter-spacing:3px;color:var(--primary, #a855f7);margin:0}.sidebar-close{background:none;border:none;padding:6px;cursor:pointer;color:var(--textMuted, rgba(255, 255, 255, .5));border-radius:4px;display:flex;align-items:center;justify-content:center}.sidebar-close:hover{background:var(--primaryGhost, rgba(255, 255, 255, .1));color:var(--text, #fff)}.sidebar-close .icon{width:18px;height:18px}.sidebar-rooms{flex:1;overflow-y:auto;padding:8px}.sidebar-empty{padding:24px 12px;text-align:center;color:var(--textMuted, rgba(255, 255, 255, .4));font-size:13px}.sidebar-room{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:6px;cursor:pointer;color:var(--textDim, rgba(255, 255, 255, .7));transition:background .15s ease,color .15s ease;position:relative}.sidebar-room:hover{background:var(--primaryGhost, rgba(255, 255, 255, .08));color:var(--text, #fff)}.sidebar-room.active{background:var(--primaryBg, rgba(168, 85, 247, .15));color:var(--primary, #c084fc)}.room-icon{width:18px;height:18px;flex-shrink:0;opacity:.6}.sidebar-room.active .room-icon{opacity:1}.room-name{flex:1;font-size:14px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.unread-badge{background:var(--primary, #a855f7);color:var(--textInverse, #fff);font-size:11px;font-weight:600;padding:2px 8px;border-radius:10px;min-width:20px;text-align:center;margin-left:auto;margin-right:4px}.room-leave{background:none;border:none;padding:8px;border-radius:6px;cursor:pointer;color:var(--textMuted, rgba(255, 255, 255, .4));display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .15s ease,background .15s ease;flex-shrink:0}.sidebar-room:hover .room-leave{opacity:1}.room-leave:hover{background:#ef444433;color:var(--danger, #f87171)}.leave-icon{width:14px;height:14px}@media(max-width:1024px){.room-leave{opacity:1;padding:12px;background:#ef444426;color:var(--danger, #f87171);margin-left:8px}.room-leave:active{background:#ef444466;transform:scale(.95)}.leave-icon{width:20px;height:20px}.unread-badge{font-size:12px;padding:3px 10px}}.sidebar-join-btn{display:flex;align-items:center;justify-content:center;gap:6px;margin:8px;padding:10px 16px;background:var(--primaryBg, rgba(168, 85, 247, .2));border:1px solid var(--primaryFaded, rgba(168, 85, 247, .3));border-radius:6px;color:var(--primary, #c084fc);font-size:13px;font-weight:600;cursor:pointer;transition:background .15s ease,border-color .15s ease}.sidebar-join-btn:hover{background:var(--primaryGhost, rgba(168, 85, 247, .25));border-color:var(--primaryDim, rgba(168, 85, 247, .5))}.sidebar-join-btn .icon{width:16px;height:16px}*{box-sizing:border-box}.app{display:flex;flex-direction:row;width:100vw;height:100vh;height:100dvh;font-family:SF Mono,Fira Code,Consolas,monospace;overflow:hidden}.main-content{flex:1;display:flex;flex-direction:column;min-width:0;height:100%}.app-header{flex-shrink:0;display:flex;justify-content:space-between;align-items:center;padding:14px 20px;border-bottom:1px solid var(--border);background:var(--bgOverlay)}.header-left{display:flex;align-items:center;gap:10px}.hamburger-btn{background:none;border:none;padding:6px;cursor:pointer;color:var(--textMuted, rgba(255, 255, 255, .5));border-radius:6px;display:flex;align-items:center;justify-content:center;transition:background .15s ease,color .15s ease}.hamburger-btn:hover{background:#ffffff1a;color:var(--text, #fff)}.hamburger-icon{width:22px;height:22px}@media(min-width:1025px){.hamburger-btn{display:none}}.header-title{font-size:15px;font-weight:600;letter-spacing:3px}.header-right{display:flex;align-items:center;gap:10px}.status-dot{width:6px;height:6px;border-radius:50%}.status-text{font-size:10px;letter-spacing:1px;opacity:.8}.zone-info{flex-shrink:0;display:flex;align-items:center;padding:14px 20px;border-bottom:1px solid var(--border);background:linear-gradient(135deg,var(--bgOverlay) 0%,var(--bg) 100%)}.zone-left{flex:1;display:flex;flex-direction:column;gap:4px}.zone-name{font-size:16px;font-weight:600;letter-spacing:.5px;background:linear-gradient(90deg,var(--primary),var(--text));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.zone-config{font-size:11px;font-weight:500;letter-spacing:1px;text-transform:uppercase;opacity:.4}.ghost-button,.theme-toggle{background:none;border:none;font-size:16px;cursor:pointer;padding:6px 10px;font-family:inherit;opacity:.7;transition:opacity .15s}.ghost-button:hover,.theme-toggle:hover{opacity:1}.ghost-button-icon{width:20px;height:20px}.theme-toggle-icon{width:18px;height:18px}.reconnect-banner{display:flex;align-items:center;justify-content:center;gap:12px;padding:12px 20px;border-bottom:1px solid;font-size:13px;font-weight:500;letter-spacing:.5px}.reconnect-spinner{width:16px;height:16px;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.messages-container{flex:1;overflow-y:auto;overflow-x:hidden;padding:16px 20px;display:flex;flex-direction:column;gap:10px;scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;touch-action:pan-y;overscroll-behavior:contain}.messages-spacer{flex:1;min-height:0}.messages-container::-webkit-scrollbar{display:none}.empty-state{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px;opacity:.5}.empty-icon{font-size:40px}.empty-title{font-size:13px;font-weight:500;letter-spacing:2px}.empty-subtitle{font-size:11px}.message{padding:12px 14px;border-radius:6px;border:1px solid var(--border);background:var(--primaryBg);transition:opacity .15s ease}.message:hover{opacity:1!important}.message.own{border-right:3px solid var(--primary)}.message.other{border-left:3px solid var(--primary)}.message.glitching{border-color:var(--warning)}.message-header{display:flex;align-items:center;gap:10px;margin-bottom:6px}.message-username{font-size:12px;font-weight:600}.message-time{font-size:10px;opacity:.4}.message-text{font-size:14px;line-height:1.5;word-break:break-word}.message-link{color:inherit;text-decoration:underline;text-decoration-color:var(--primaryFaded)}.message-link:hover{text-decoration-color:var(--primary)}.message-expiry{font-size:11px;margin-top:8px;text-align:right;opacity:.7}.input-container{flex-shrink:0;display:flex;align-items:flex-start;padding:16px 20px;gap:12px;border-top:1px solid var(--border);background:linear-gradient(to top,var(--bg),var(--bgOverlay))}.input-wrapper{flex:1;display:flex;flex-direction:column;gap:6px;position:relative}.message-input{width:100%;min-height:44px;max-height:150px;padding:12px 16px;border:1px solid var(--border);border-radius:10px;background:var(--bg);color:var(--text);font-family:inherit;font-size:15px;font-weight:400;letter-spacing:.2px;line-height:1.5;outline:none;resize:none;overflow:hidden;transition:all .2s ease;box-shadow:0 2px 8px #00000026}.message-input:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primaryGhost),0 2px 12px #0003}.message-input::placeholder{color:var(--textMuted);font-weight:300;letter-spacing:.3px}.message-input:disabled{opacity:.4;box-shadow:none}.char-counter{font-size:11px;text-align:right;padding-right:6px;opacity:.6;transition:opacity .2s}.input-wrapper:focus-within .char-counter{opacity:1}.send-button{min-height:44px;align-self:flex-start;padding:12px 28px;border:2px solid var(--primary);border-radius:10px;background:var(--primary);color:var(--bg);font-family:inherit;font-weight:700;font-size:12px;letter-spacing:1.5px;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 8px var(--primaryGhost)}.send-button:hover:not(:disabled){background:transparent;color:var(--primary);box-shadow:0 0 16px var(--primaryGhost);transform:translateY(-1px)}.send-button:active:not(:disabled){transform:translateY(0)}.send-button:disabled{opacity:.4;cursor:default;background:var(--primaryGhost);border-color:var(--primaryFaded);color:var(--textMuted);box-shadow:none}@media(max-width:768px){.send-button{display:none}}::selection{background:var(--primaryFaded)}
