@import "https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;700;800&family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap";:root{--bg-base:#f5f4f0;--bg-card:#fff;--text-primary:#000;--text-secondary:#27272a;--color-border:#000;--accent-yellow:#facc15;--accent-lime:#a3e635;--accent-blue:#60a5fa;--accent-red:#f87171;--accent-lavender:#c084fc;--bubble-me:#fef08a;--bubble-stranger:#dbeafe;--font-heading:"Space Grotesk", sans-serif;--font-body:"Space Grotesk", sans-serif;--font-mono:"Space Mono", monospace;--header-height:80px;--border-width:3px}*{box-sizing:border-box;font-family:var(--font-body);color:var(--text-primary);-webkit-font-smoothing:antialiased;margin:0;padding:0}body{background-color:var(--bg-base);background-image:radial-gradient(#00000026 1px,#0000 1px);background-size:24px 24px;min-height:100dvh;padding-bottom:2rem;overflow-x:hidden}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--bg-base);border-left:var(--border-width) solid var(--color-border)}::-webkit-scrollbar-thumb{background:var(--text-primary);border:2px solid var(--bg-base)}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.app-container{flex-direction:column;max-width:1000px;min-height:95dvh;margin:1.5rem auto;padding:0 1rem;display:flex}.brutalist-card{background:var(--bg-card);border:var(--border-width) solid var(--color-border);box-shadow:6px 6px 0px 0px var(--color-border);transition:transform .1s,box-shadow .1s;position:relative}.app-header{height:var(--header-height);justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding:0 1.5rem;display:flex}.logo{font-family:var(--font-heading);text-transform:uppercase;letter-spacing:-.04em;align-items:center;gap:.5rem;font-size:2rem;font-weight:800;display:flex}.logo span{background:var(--accent-yellow);border:var(--border-width) solid var(--color-border);box-shadow:2px 2px 0px 0px var(--color-border);margin-left:.25rem;padding:.1rem .5rem;display:inline-block;transform:rotate(-1.5deg)}.status-pills{align-items:center;gap:.75rem;display:flex}.online-badge{background:var(--accent-lime);border:var(--border-width) solid var(--color-border);box-shadow:3px 3px 0px 0px var(--color-border);font-family:var(--font-mono);align-items:center;gap:.5rem;padding:.4rem .85rem;font-size:.9rem;font-weight:700;display:inline-flex;transform:rotate(1deg)}.online-dot{border:2px solid var(--color-border);background-color:var(--text-primary);width:10px;height:10px}.main-content{height:calc(100% - var(--header-height) - 1.5rem);flex-direction:column;flex:1;padding-bottom:12px;display:flex}.main-content.status-idle{flex:1;overflow:visible}.main-content.status-searching,.main-content.status-chatting,.main-content.status-disconnected{overflow:hidden}.lobby-screen{text-align:center;flex-direction:column;justify-content:center;align-self:center;align-items:center;width:100%;max-width:650px;margin:auto;padding:3rem 2rem;display:flex}.lobby-icon-container{background:var(--accent-lavender);border:var(--border-width) solid var(--color-border);box-shadow:4px 4px 0px 0px var(--color-border);margin-bottom:2rem;padding:1.25rem;display:inline-flex;transform:rotate(-3deg)}.hero-title{font-family:var(--font-heading);text-transform:uppercase;letter-spacing:-.02em;margin-bottom:1.5rem;font-size:3rem;font-weight:800;line-height:1.1}.hero-subtitle{color:var(--text-secondary);font-family:var(--font-mono);border:2px dashed var(--color-border);background:#fff;margin-bottom:2.5rem;padding:.75rem 1rem;font-size:1rem;line-height:1.5}.btn{font-size:1.1rem;font-weight:800;font-family:var(--font-heading);text-transform:uppercase;letter-spacing:.02em;cursor:pointer;border:var(--border-width) solid var(--color-border);box-shadow:4px 4px 0px 0px var(--color-border);-webkit-user-select:none;user-select:none;background:#fff;justify-content:center;align-items:center;gap:.5rem;padding:1rem 2rem;transition:transform 50ms,box-shadow 50ms;display:inline-flex}.btn:hover{box-shadow:6px 6px 0px 0px var(--color-border);transform:translate(-2px,-2px)}.btn:active{box-shadow:0px 0px 0px 0px var(--color-border);transform:translate(2px,2px)}.btn-primary{background:var(--accent-yellow)}.btn-danger{background:var(--accent-red)}.btn-secondary{background:var(--bg-base)}.search-screen{flex-direction:column;flex:1;justify-content:center;align-items:center;display:flex}.radar-container{border:var(--border-width) solid var(--color-border);width:180px;height:180px;box-shadow:6px 6px 0px 0px var(--color-border);background:#fff;justify-content:center;align-items:center;margin-bottom:2.5rem;display:flex;position:relative}.radar-pulse{border:var(--border-width) dashed var(--color-border);width:80%;height:80%;animation:2s linear infinite radar-ping-brutalist;position:absolute}.radar-pulse:nth-child(2){animation-delay:1s}.radar-center{z-index:10;background:var(--accent-blue);border:var(--border-width) solid var(--color-border);width:70px;height:70px;box-shadow:3px 3px 0px 0px var(--color-border);justify-content:center;align-items:center;display:flex;position:relative}.radar-icon{width:28px;height:28px;color:#000!important}.radar-icon *{stroke:#000!important}.search-title{font-family:var(--font-heading);text-transform:uppercase;margin-bottom:.5rem;font-size:2.2rem;font-weight:800}.search-subtitle{font-family:var(--font-mono);color:var(--text-secondary);margin-bottom:2.5rem}.chat-container{flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.messages-container{background-color:#fafaf9;flex-direction:column;flex:1;gap:1.25rem;padding:1.5rem;display:flex;overflow-y:auto}.message-wrapper{flex-direction:column;max-width:75%;display:flex}.message-wrapper.me{align-self:flex-end;align-items:flex-end}.message-wrapper.stranger{align-self:flex-start;align-items:flex-start}.message-bubble{word-break:break-word;border:var(--border-width) solid var(--color-border);padding:.85rem 1.25rem;font-size:1rem;font-weight:500;line-height:1.45}.me .message-bubble{background:var(--bubble-me);box-shadow:4px 4px 0px 0px var(--color-border)}.stranger .message-bubble{background:var(--bubble-stranger);box-shadow:-4px 4px 0px 0px var(--color-border)}.message-meta{font-family:var(--font-mono);margin-top:.5rem;padding:0 .25rem;font-size:.75rem;font-weight:700}.system-message{border:var(--border-width) solid var(--color-border);color:var(--text-primary);text-align:center;max-width:90%;box-shadow:3px 3px 0px 0px var(--color-border);text-transform:uppercase;align-self:center;margin:.75rem 0;padding:.6rem 1.5rem;font-size:.9rem;font-weight:700}.system-message.error{background:var(--accent-red)}.system-message.success{background:var(--accent-lime)}.input-container{border-top:var(--border-width) solid var(--color-border);background:#fff;flex-direction:column;gap:.75rem;padding:1.25rem 1.5rem;display:flex;position:relative}.input-row-main{gap:1rem;width:100%;display:flex}.input-row-controls{justify-content:space-between;align-items:center;gap:1rem;width:100%;display:flex}.chat-input{border:var(--border-width) solid var(--color-border);color:#000;font-size:1rem;font-family:var(--font-mono);box-shadow:4px 4px 0px 0px var(--color-border);background:#fff;outline:none;flex:1;padding:1rem 1.25rem;transition:transform .1s,box-shadow .1s}.chat-input:focus{box-shadow:5px 5px 0px 0px var(--color-border);transform:translate(-1px,-1px)}.chat-input::placeholder{color:#64748b}.btn-ctrl{min-width:140px}.btn-send{justify-content:center;align-items:center;width:54px;height:54px;padding:0;display:flex}.btn-send svg{stroke:#000!important}.typing-indicator-container{border:2px solid var(--color-border);box-shadow:-3px 3px 0px 0px var(--color-border);background:#fff;align-self:flex-start;align-items:center;gap:.5rem;margin-bottom:.5rem;margin-left:1.5rem;padding:.5rem .85rem;display:flex}.typing-text{font-family:var(--font-mono);text-transform:uppercase;font-size:.8rem;font-weight:700}.typing-dots{gap:4px;display:flex}.typing-dot{background:var(--text-primary);border:1px solid var(--color-border);width:8px;height:8px;animation:1s ease-in-out infinite both typing-bounce-brutalist}.typing-dot:nth-child(2){background:var(--accent-yellow);animation-delay:.2s}.typing-dot:nth-child(3){background:var(--accent-lime);animation-delay:.4s}.rules-container{border:var(--border-width) solid var(--color-border);box-shadow:4px 4px 0px 0px var(--color-border);text-align:left;background:#fff;margin-bottom:2.5rem;padding:1.5rem}.rules-title{font-family:var(--font-heading);text-transform:uppercase;letter-spacing:.02em;margin-bottom:.75rem;font-size:1.1rem;font-weight:800}.rules-list{font-family:var(--font-mono);flex-direction:column;gap:.5rem;font-size:.85rem;list-style-type:none;display:flex}.rules-list li{padding-left:1.25rem;position:relative}.rules-list li:before{content:"■";color:var(--accent-red);position:absolute;top:0;left:0}@keyframes radar-ping-brutalist{0%{opacity:1;transform:scale(.6)}to{opacity:0;transform:scale(1.3)}}@keyframes typing-bounce-brutalist{0%,80%,to{transform:translateY(0)}40%{transform:translateY(-6px)}}.privacy-consent{text-align:left;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:flex-start;gap:.75rem;margin-bottom:2rem;font-size:.9rem;display:flex}.privacy-consent input[type=checkbox]{border:var(--border-width) solid var(--color-border);appearance:none;cursor:pointer;width:22px;height:22px;box-shadow:2px 2px 0px 0px var(--color-border);background:#fff;outline:none;flex-shrink:0;transition:transform 50ms,box-shadow 50ms;position:relative}.privacy-consent input[type=checkbox]:hover{box-shadow:3px 3px 0px 0px var(--color-border);transform:translate(-1px,-1px)}.privacy-consent input[type=checkbox]:checked{background:var(--accent-lime)}.privacy-consent input[type=checkbox]:checked:after{content:"✔";color:#000;font-size:14px;font-weight:900;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.privacy-consent label{cursor:pointer;line-height:1.4;font-family:var(--font-mono);font-size:.85rem;font-weight:700}.btn:disabled{cursor:not-allowed;color:#94a3b8!important;box-shadow:0px 0px 0px 0px var(--color-border)!important;background:#e2e8f0!important;transform:none!important}.floating-sticker{font-family:var(--font-mono);text-transform:uppercase;border:var(--border-width) solid var(--color-border);box-shadow:4px 4px 0px 0px var(--color-border);-webkit-user-select:none;user-select:none;pointer-events:none;z-index:5;padding:.6rem 1.2rem;font-size:.9rem;font-weight:800;position:absolute}.sticker-left-1{background:var(--accent-lavender);top:10%;left:-130px;transform:rotate(-8deg)}.sticker-left-2{background:var(--accent-lime);bottom:20%;left:-160px;transform:rotate(6deg)}.sticker-right-1{background:var(--accent-yellow);top:20%;right:-140px;transform:rotate(5deg)}.sticker-right-2{background:var(--accent-blue);bottom:12%;right:-150px;transform:rotate(-6deg)}@media (width<=1100px){.floating-sticker{display:none}}.chat-window-header{border-bottom:var(--border-width) solid var(--color-border);background:#fff;justify-content:space-between;align-items:center;padding:.75rem 1.5rem;display:flex}.partner-info{align-items:center;gap:.75rem;display:flex}.partner-text{text-align:left;flex-direction:column;display:flex}.partner-name{font-family:var(--font-heading);text-transform:uppercase;font-size:1rem;font-weight:800}.partner-status{font-family:var(--font-mono);color:#16a34a;font-size:.75rem;font-weight:700}.partner-status.unstable{color:#ea580c}.my-pseudo-badge{font-family:var(--font-mono);background:var(--accent-yellow);border:2px solid var(--color-border);box-shadow:2px 2px 0px 0px var(--color-border);padding:.25rem .5rem;font-size:.8rem;font-weight:700;transform:rotate(-1deg)}@media (width<=640px){.app-container{max-width:100%;height:100dvh;margin:0;padding:0 .5rem}.app-header{height:65px;margin-bottom:.25rem;padding:0 .5rem}.main-content{height:calc(100% - 65px - .25rem);padding-bottom:0}.chat-container.brutalist-card{box-shadow:none;border-bottom:none;border-left:none;border-right:none}.lobby-screen{margin:1rem auto;padding:1.5rem 1rem}.hero-title{margin-bottom:1rem;font-size:2rem}.hero-subtitle{margin-bottom:1.5rem;padding:.5rem;font-size:.9rem}.rules-container{margin-bottom:1.5rem;padding:1rem}.privacy-consent{margin-bottom:1.5rem}.chat-window-header{padding:.5rem .75rem}.my-pseudo-badge{font-size:.75rem}.partner-name{font-size:.9rem}.message-wrapper{max-width:90%}.input-container{border-bottom:none;gap:.5rem;padding:.75rem}.input-row-main,.input-row-controls{gap:.5rem}.btn-action-game{padding:.65rem .75rem;font-size:.8rem}.chat-input{padding:.75rem 1rem}.btn-ctrl{min-width:85px;padding:.65rem .5rem;font-size:.8rem}.logo{font-size:1.4rem}}.message-bubble-row{align-items:flex-end;gap:.75rem;width:100%;display:flex}.message-bubble-container{align-items:center;gap:.5rem;max-width:calc(100% - 36px);display:flex;position:relative}.me .message-bubble-container{flex-direction:row-reverse}.stranger .message-bubble-container{flex-direction:row}.message-actions-container{opacity:0;z-index:10;align-items:center;transition:opacity .15s ease-in-out;display:flex}.message-bubble-container:hover .message-actions-container{opacity:1}@media (width<=768px){.message-actions-container{opacity:.5}}.react-trigger-btn{border:2px solid var(--color-border);cursor:pointer;width:24px;height:24px;color:var(--text-primary);background:#fff;border-radius:50%;justify-content:center;align-items:center;margin:0;padding:0;font-size:13px;line-height:1;transition:transform .1s,box-shadow .1s;display:flex;box-shadow:1.5px 1.5px #000}.react-trigger-btn:hover{background:var(--accent-yellow);transform:translate(-1px,-1px);box-shadow:2px 2px #000}.react-trigger-btn:active{transform:translate(1px,1px);box-shadow:0 0 #000}.reaction-picker-menu{border:2px solid var(--color-border);z-index:100;white-space:nowrap;background:#fff;border-radius:4px;gap:.35rem;padding:.25rem;display:flex;position:absolute;top:-46px;left:50%;transform:translate(-50%);box-shadow:3px 3px #000}.reaction-emoji-btn{cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:.1rem .25rem;font-size:1.25rem;transition:transform .1s ease-in-out;display:flex}.reaction-emoji-btn:hover{transform:scale(1.25)}.reaction-emoji-btn.selected{background:var(--accent-yellow);border:1px solid var(--color-border);border-radius:3px}.message-reactions-row{border-top:1px dashed var(--color-border);flex-wrap:wrap;gap:.35rem;margin-top:.4rem;padding-top:.4rem;display:flex}.reaction-pill{border:1.5px solid var(--color-border);cursor:pointer;font-size:.7rem;font-family:var(--font-mono);background:#fff;border-radius:2px;align-items:center;gap:.2rem;padding:.1rem .35rem;font-weight:700;transition:transform .1s,box-shadow .1s;display:flex;box-shadow:1px 1px #000}.reaction-pill:hover{transform:translate(-.5px,-.5px);box-shadow:1.5px 1.5px #000}.reaction-pill:active{transform:translate(.5px,.5px);box-shadow:0 0 #000}.reaction-pill.me{background:var(--accent-yellow)}.reaction-pill.stranger{background:var(--accent-blue)}.reaction-pill.both{background:var(--accent-lime)}.reaction-pill .react-count{background:var(--text-primary);color:#fff;border-radius:2px;padding:.05rem .2rem;font-size:.6rem}.btn-action-game{white-space:nowrap;box-shadow:2px 2px 0px 0px var(--color-border);padding:.85rem 1rem;font-size:.9rem}.game-drawer{background:var(--accent-yellow);border-top:none;border-left:none;border-right:none;border-bottom:var(--border-width) solid var(--color-border);box-shadow:none;padding:1rem}.game-drawer-header{border-bottom:2px dashed var(--color-border);justify-content:space-between;align-items:center;margin-bottom:.75rem;padding-bottom:.5rem;display:flex}.game-title{font-family:var(--font-heading);text-transform:uppercase;font-size:1.1rem;font-weight:800}.btn-close-game{border:2px solid var(--color-border);font-family:var(--font-heading);text-transform:uppercase;cursor:pointer;box-shadow:1.5px 1.5px 0px 0px var(--color-border);background:#fff;padding:.25rem .5rem;font-size:.85rem;font-weight:800;transition:transform 50ms,box-shadow 50ms}.btn-close-game:hover{box-shadow:2.5px 2.5px 0px 0px var(--color-border);background:var(--accent-red);color:#fff;transform:translate(-1px,-1px)}.btn-close-game:active{box-shadow:0px 0px 0px 0px var(--color-border);transform:translate(1px,1px)}.game-status-msg{font-family:var(--font-mono);text-align:center;border:2px solid var(--color-border);background:#fff;padding:1rem;font-size:.95rem;font-weight:700}.game-invite-controls{border:2px solid var(--color-border);font-family:var(--font-heading);text-transform:uppercase;background:#fff;flex-direction:column;align-items:center;gap:.75rem;padding:1rem;font-size:1rem;font-weight:800;display:flex}.invite-btn-row{gap:.75rem;display:flex}.btn-game-accept,.btn-game-decline{box-shadow:2px 2px 0px 0px var(--color-border);border-width:2px;padding:.4rem 1rem;font-size:.9rem}.btn-game-accept{background:var(--accent-lime)}.btn-game-decline{background:var(--accent-red)}.game-play-area{justify-content:center;padding:.5rem 0;display:flex}.game-board-and-status{align-items:center;gap:1.5rem;display:flex}.game-board-grid{background:var(--color-border);border:var(--border-width) solid var(--color-border);box-shadow:4px 4px 0px 0px var(--color-border);grid-template-rows:repeat(3,70px);grid-template-columns:repeat(3,70px);gap:.35rem;padding:.35rem;display:grid}.game-board-cell{font-family:var(--font-heading);cursor:pointer;background:#fff;border:none;justify-content:center;align-items:center;padding:0;font-size:2rem;font-weight:800;transition:background .1s;display:flex}.game-board-cell:hover:not(:disabled){background:var(--accent-lime)}.game-board-cell:disabled{cursor:not-allowed}.game-board-cell.filled{background:#f8fafc}.game-board-cell.my-cell{color:var(--accent-blue)}.game-board-cell.partner-cell{color:var(--accent-red)}.game-sidebar{border:2px solid var(--color-border);width:160px;height:220px;font-family:var(--font-mono);box-shadow:3px 3px 0px 0px var(--color-border);background:#fff;flex-direction:column;justify-content:space-between;padding:.75rem;display:flex}.game-symbols-info{text-transform:uppercase;text-align:left;flex-direction:column;gap:.5rem;font-size:.85rem;font-weight:700;display:flex}.game-symbols-info strong{font-size:1rem}.game-outcome-container{flex-direction:column;gap:.5rem;display:flex}.game-outcome-title{font-family:var(--font-heading);text-transform:uppercase;text-align:center;border:2px solid var(--color-border);background:var(--accent-yellow);padding:.35rem;font-size:.95rem;font-weight:800}.game-outcome-container .btn{box-shadow:2px 2px 0px 0px var(--color-border);border-width:2px;padding:.5rem .75rem;font-size:.85rem}@media (width<=640px){.game-board-and-status{flex-direction:column;align-items:center;gap:1rem}.game-sidebar{flex-direction:column;align-items:stretch;gap:.75rem;width:220px;height:auto;padding:.75rem}.game-symbols-info{flex-direction:row;justify-content:space-between;align-items:center;gap:1rem;display:flex}.game-outcome-container{flex-direction:column;gap:.5rem;width:100%;display:flex}.game-outcome-title{width:100%;padding:.5rem;font-size:.95rem}.game-outcome-container .btn{width:100%;padding:.5rem;font-size:.9rem}}.lobby-actions-row{justify-content:center;gap:1rem;width:100%;max-width:500px;margin-top:.5rem;display:flex}@media (width<=640px){.lobby-actions-row{flex-direction:column;width:100%}.lobby-actions-row .btn{width:100%}}.invite-alert-banner{background:var(--accent-yellow);font-weight:700;font-family:var(--font-mono);text-align:center;border:var(--border-width) solid var(--color-border);width:100%;box-shadow:4px 4px 0px 0px var(--color-border);margin-bottom:1.5rem;padding:.85rem 1.25rem;font-size:.9rem;animation:2s ease-in-out infinite pulse-border}@keyframes pulse-border{0%,to{box-shadow:4px 4px 0px 0px var(--color-border)}50%{box-shadow:6px 6px 0px 0px var(--color-border)}}@media (width<=480px){.invite-alert-banner{margin-bottom:1rem;padding:.6rem .75rem;font-size:.8rem}}.share-link-container{text-align:left;border:var(--border-width) solid var(--color-border);width:100%;max-width:500px;box-shadow:4px 4px 0px 0px var(--color-border);background:#fff;margin:1rem 0 1.5rem;padding:1.25rem}.share-link-label{font-family:var(--font-mono);text-transform:uppercase;margin-bottom:.5rem;font-size:.85rem;font-weight:800}.share-link-input-group{gap:.75rem;display:flex}.share-link-input{border:var(--border-width) solid var(--color-border);min-width:0;font-family:var(--font-mono);background:var(--bg-base);box-shadow:2px 2px 0px 0px var(--color-border);outline:none;flex:1;padding:.75rem;font-size:.9rem}.btn-copy{box-shadow:2px 2px 0px 0px var(--color-border)!important;padding:0 1.25rem!important;font-size:.95rem!important}.btn-copy:hover{box-shadow:3px 3px 0px 0px var(--color-border)!important;transform:translate(-1px,-1px)!important}.btn-copy:active{box-shadow:0px 0px 0px 0px var(--color-border)!important;transform:translate(1px,1px)!important}@media (width<=480px){.share-link-input-group{flex-direction:column;gap:.75rem}.btn-copy{width:100%;padding:.75rem!important}}.server-wake-banner{border:var(--border-width) solid var(--color-border);box-shadow:4px 4px 0px 0px var(--color-border);text-align:left;background:#fef08a;flex-direction:column;gap:.75rem;width:100%;margin-bottom:2rem;padding:1.25rem;display:flex}.wake-banner-content{align-items:flex-start;gap:1rem;display:flex}.wake-emoji{-webkit-user-select:none;user-select:none;font-size:2.2rem;line-height:1;animation:2s ease-in-out infinite wake-bounce;display:inline-block}@keyframes wake-bounce{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-4px)rotate(-5deg)}}.wake-text{flex-direction:column;gap:.25rem;display:flex}.wake-text strong{font-family:var(--font-heading);text-transform:uppercase;letter-spacing:-.01em;font-size:1.1rem}.wake-text p{font-family:var(--font-mono);color:var(--text-secondary);font-size:.8rem;font-weight:700;line-height:1.4}.wake-loader{border:2px solid var(--color-border);background:#fff;width:100%;height:12px;position:relative;overflow:hidden}.wake-loader-bar{background:var(--accent-lime);border-right:2px solid var(--color-border);height:100%;animation:2s linear infinite wake-slide;position:absolute;top:0}@keyframes wake-slide{0%{width:40%;left:-40%}50%{width:50%;left:20%}to{width:40%;left:100%}}@media (width<=640px){.server-wake-banner{margin-bottom:1.5rem;padding:1rem}.wake-emoji{font-size:1.8rem}.wake-text strong{font-size:.95rem}.wake-text p{font-size:.75rem}}.powerup-toolbar{border-top:var(--border-width) solid var(--color-border);border-bottom:var(--border-width) solid var(--color-border);-webkit-user-select:none;user-select:none;background:#fafafa;align-items:center;gap:.75rem;padding:.5rem 1rem;display:flex}.powerup-label{font-family:var(--font-heading);text-transform:uppercase;color:var(--text-secondary);letter-spacing:.05em;font-size:.75rem;font-weight:800}.powerup-buttons{gap:.5rem;display:flex}.btn-powerup{border:2px solid var(--color-border);width:32px;height:32px;box-shadow:1.5px 1.5px 0px var(--color-border);cursor:pointer;background:#fff;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:1.1rem;transition:all .15s cubic-bezier(.175,.885,.32,1.275);display:flex}.btn-powerup:hover:not(:disabled){box-shadow:3px 3px 0px var(--color-border);transform:translateY(-2px)}.btn-powerup:active:not(:disabled){box-shadow:.5px .5px 0px var(--color-border);transform:translateY(1px)}.btn-powerup-lightning:hover:not(:disabled){background:#fef08a}.btn-powerup-love:hover:not(:disabled){background:#fecdd3}.btn-powerup-panda:hover:not(:disabled){background:#e2e8f0}.btn-powerup-freeze:hover:not(:disabled){background:#bae6fd}.btn-powerup.cooldown{cursor:not-allowed;opacity:.6;background-image:repeating-linear-gradient(45deg,#e2e8f0,#e2e8f0 4px,#cbd5e1 4px 8px);box-shadow:1.5px 1.5px 0px var(--color-border)!important;transform:none!important}.effect-overlay{pointer-events:none;z-index:10;width:100%;height:100%;position:absolute;top:0;left:0;overflow:hidden}.lightning-flash{background:#fef08a59;animation:.35s ease-out forwards effect-flash}@keyframes effect-flash{0%{opacity:0}10%{opacity:1}25%{opacity:.2}35%{opacity:.9}to{opacity:0}}.chat-container.effect-active-lightning{animation:.4s ease-in-out effect-shake}@keyframes effect-shake{0%,to{transform:translate(0)rotate(0)}10%,30%,50%,70%,90%{transform:translate(-3px,2px)rotate(-.5deg)}20%,40%,60%,80%{transform:translate(3px,-2px)rotate(.5deg)}}.love-shower{justify-content:space-around;display:flex}.pixel-heart{font-size:1.8rem;animation:3.2s cubic-bezier(.25,1,.5,1) forwards effect-rise-fade;position:absolute}.heart-1{animation-delay:0s;left:10%}.heart-2{animation-delay:.15s;left:25%}.heart-3{animation-delay:50ms;left:40%}.heart-4{animation-delay:.2s;left:55%}.heart-5{animation-delay:.1s;left:70%}.heart-6{animation-delay:.25s;left:85%}.heart-7{animation-delay:.3s;left:18%}.heart-8{animation-delay:.12s;left:48%}.heart-9{animation-delay:.28s;left:62%}.heart-10{animation-delay:80ms;left:78%}@keyframes effect-rise-fade{0%{opacity:0;bottom:-10%;transform:scale(.5)rotate(0)}15%{opacity:1;transform:scale(1.1)rotate(5deg)}to{opacity:0;bottom:110%;transform:scale(.9)rotate(-10deg)}}.panda-overlay{justify-content:center;align-items:center;display:flex}.giant-panda{-webkit-user-select:none;user-select:none;font-size:6rem;line-height:1;animation:1.5s cubic-bezier(.175,.885,.32,1.5) forwards effect-panda-bounce}@keyframes effect-panda-bounce{0%{opacity:0;transform:scale(0)rotate(-45deg)}30%{opacity:1;transform:scale(1.3)rotate(15deg)}50%{transform:scale(1)rotate(-5deg)}80%{opacity:1;transform:scale(1)rotate(0)}to{opacity:0;transform:scale(.8)translateY(-30px)}}.freeze-overlay{-webkit-backdrop-filter:blur(1.5px);background:#bae6fd1f;border:4px solid #bae6fd;animation:1.5s ease-in-out forwards effect-freeze-melt;box-shadow:inset 0 0 40px #38bdf840}@keyframes effect-freeze-melt{0%{opacity:0;-webkit-backdrop-filter:blur();backdrop-filter:blur()}15%{opacity:1;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}80%{opacity:.9;-webkit-backdrop-filter:blur(1.5px);backdrop-filter:blur(1.5px)}to{opacity:0;-webkit-backdrop-filter:blur();backdrop-filter:blur()}}.chat-container.effect-active-freeze{transition:border-color .3s,box-shadow .3s;border-color:#bae6fd!important;box-shadow:4px 4px #38bdf8!important}.modal-overlay{-webkit-backdrop-filter:blur(2px);z-index:50;background:#00000080;justify-content:center;align-items:center;width:100%;height:100%;padding:1.5rem;display:flex;position:absolute;top:0;left:0}.brutalist-modal{border:var(--border-width) solid var(--color-border);background:#fff;flex-direction:column;width:100%;max-width:460px;max-height:90%;animation:.3s cubic-bezier(.175,.885,.32,1.275) modal-pop;display:flex;box-shadow:8px 8px #000}@keyframes modal-pop{0%{opacity:0;transform:scale(.9)translateY(10px)}to{opacity:1;transform:scale(1)translateY(0)}}.modal-header{border-bottom:var(--border-width) solid var(--color-border);background:#fafafa;justify-content:space-between;align-items:center;padding:1rem 1.25rem;display:flex}.modal-header h3{font-family:var(--font-heading);text-transform:uppercase;margin:0;font-size:1.1rem}.btn-close-modal{border:2px solid var(--color-border);cursor:pointer;background:0 0;justify-content:center;align-items:center;width:28px;height:28px;padding:0;font-size:.85rem;font-weight:700;display:flex;box-shadow:1.5px 1.5px #000}.btn-close-modal:hover{transform:translate(-.5px,-.5px);box-shadow:2px 2px #000}.btn-close-modal:active{transform:translate(1px,1px);box-shadow:0 0 #000}.lobby-btn-row{flex-wrap:wrap;gap:1.25rem;width:100%;margin-top:1.75rem;display:flex}.lobby-btn-main{flex:1;justify-content:center;min-width:160px;padding:1.1rem 1.5rem;font-size:1.15rem}@media (width<=480px){.lobby-btn-row{flex-direction:column}.lobby-btn-main{flex:unset;width:100%}}.mode-selection-grid{text-align:left;grid-template-columns:repeat(2,1fr);gap:1.25rem;width:100%;margin-top:1.5rem;display:grid}.mode-card{background:#fff;flex-direction:column;padding:1.25rem;transition:transform .2s,box-shadow .2s;display:flex}.mode-card:hover{box-shadow:6px 6px 0px 0px var(--color-border);transform:translate(-2px,-2px)}.mode-icon{margin-bottom:.75rem;font-size:2.25rem;display:inline-block}.mode-card h3{text-transform:uppercase;margin-bottom:.5rem;font-size:1.2rem;font-weight:800}.mode-card p{color:var(--text-secondary);flex:1;margin-bottom:1.25rem;font-size:.85rem}.mode-sub-actions{gap:.5rem;width:100%;display:flex}.btn-full{width:100%}.btn-half{flex:1;padding:.5rem!important;font-size:.85rem!important}.animate-pulse{animation:2s ease-in-out infinite pulse-effect}@keyframes pulse-effect{0%,to{opacity:1}50%{opacity:.85}}@media (width<=640px){.mode-selection-grid{grid-template-columns:1fr;gap:1rem}}@media (width<=345px){.app-header{height:55px;padding:0 .25rem}.logo{font-size:1.3rem}.logo span{border-width:2px;padding:.05rem .25rem}.online-badge{box-shadow:2px 2px 0px 0px var(--color-border);border-width:2px;padding:.25rem .5rem;font-size:.75rem}}@media (width<=280px){.online-badge{display:none!important}.app-header{justify-content:center;height:50px;padding:0 .25rem}.logo{font-size:1.1rem}.logo span{border-width:1.5px;padding:.05rem .2rem}}@media (width<=450px){.chat-window-header{padding:.5rem .75rem}.partner-name{font-size:.85rem}.partner-status{font-size:.7rem}.my-pseudo-badge{padding:.15rem .35rem;font-size:.7rem}.my-pseudo-badge div{display:none!important}}@media (width<=345px){.chat-window-header{padding:.4rem .5rem}.chat-window-header svg{width:26px!important;height:26px!important}.partner-name{font-size:.8rem}.partner-status{font-size:.65rem}}@media (width<=280px){.chat-window-header{padding:.35rem .25rem}.chat-window-header svg{display:none!important}.partner-name{font-size:.75rem}.partner-status{font-size:.6rem}.my-pseudo-badge{display:none!important}}.btn-powerup-glitch:hover:not(:disabled){background:#ddd6fe}.chat-container.effect-active-glitch{filter:invert()hue-rotate(180deg)contrast(1.5);animation:.25s infinite glitch-screen-shake;border-color:var(--accent-red)!important}.glitch-overlay{pointer-events:none;z-index:100;background:#ff000026}.glitch-static{background-image:linear-gradient(#12101000 50%,#00000040 50%),linear-gradient(90deg,#ff00000f,#00ff0005,#0000ff0f);background-size:100% 4px,6px 100%;position:absolute;inset:0}@keyframes glitch-screen-shake{0%{transform:translate(0)}20%{transform:translate(-5px,4px)}40%{transform:translate(5px,-4px)}60%{transform:translate(-4px,-3px)}80%{transform:translate(4px,3px)}to{transform:translate(0)}}