@import"https://fonts.googleapis.com/css2?family=VT323&display=swap";.app-container{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box}.main-content{width:100%;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center}.error-message{background-color:#ef444433;color:var(--color-accent-red);border:2px solid var(--color-accent-red);padding:1rem;border-radius:8px;margin-bottom:1rem;text-align:center;font-size:1.2rem}.loading-screen{font-size:3rem;color:var(--color-primary);animation:pulse 1.5s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.homepage{display:flex;flex-direction:column;align-items:center;text-align:center}.homepage-title{font-size:6rem;color:var(--color-primary);text-shadow:4px 4px 0px var(--color-background-panel);margin-bottom:.5rem;letter-spacing:.2em}.homepage-tagline{font-size:1.75rem;color:var(--color-text);margin-bottom:3rem}.homepage-input-container{width:100%;max-width:400px;margin-bottom:2rem}.homepage-input{width:100%;padding:.75rem;text-align:center;font-size:2rem;box-sizing:border-box}.homepage-buttons{display:flex;flex-direction:column;gap:1rem;width:100%;max-width:400px;margin-bottom:2rem}.btn{padding:1rem;font-size:2rem;border-radius:8px;text-shadow:2px 2px 0px rgba(0,0,0,.2);transform:translateY(0);transition:all .1s ease-in-out}.btn:hover{transform:translateY(-2px)}.btn:active{border-style:inset}.btn-blue{background-color:var(--color-accent-blue);color:var(--color-text);border-color:var(--color-accent-blue-hover)}.btn-blue:hover{background-color:var(--color-accent-blue-hover)}.btn-green{background-color:var(--color-accent-green);color:var(--color-text);border-color:var(--color-accent-green-hover)}.btn-green:hover{background-color:var(--color-accent-green-hover)}.btn-red{background-color:var(--color-accent-red);color:var(--color-text);border-color:var(--color-accent-red-hover)}.btn-red:hover{background-color:var(--color-accent-red-hover)}.join-game-container{display:flex;gap:.5rem;width:100%;max-width:400px}.join-game-input{flex-grow:1;text-align:center;font-size:1.5rem;text-transform:uppercase}.join-game-button{background-color:var(--color-primary);color:var(--color-text-dark);border-color:var(--color-primary-hover);padding:.75rem 1.5rem;font-size:1.5rem}.join-game-button:hover{background-color:var(--color-primary-hover)}.lobby{display:flex;flex-direction:column;align-items:center;text-align:center;width:100%;max-width:600px}.lobby-title{font-size:4rem;color:var(--color-text);margin-bottom:1rem}.lobby-code-display{background-color:var(--color-background);border:4px dashed var(--color-primary);padding:1rem 2rem;border-radius:8px;margin-bottom:2rem}.lobby-code{font-size:5rem;color:var(--color-primary);letter-spacing:.5em}.player-list-container{width:100%;margin-bottom:2rem}.player-list-title{font-size:2.5rem;margin-bottom:1rem}.player-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem}.player-card{background-color:var(--color-background-panel);padding:1rem;border-radius:8px;border:2px solid var(--color-border);font-size:1.75rem;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.ready-indicator{position:absolute;top:4px;left:4px;font-size:1.5rem;line-height:1;color:var(--color-border)}.ready-indicator.ready{color:var(--color-accent-green);text-shadow:0 0 5px var(--color-accent-green)}.kick-button{position:absolute;top:4px;right:4px;background-color:var(--color-accent-red);color:var(--color-text);border:1px solid var(--color-accent-red-hover);border-radius:50%;width:28px;height:28px;font-size:20px;line-height:24px;padding:0;display:flex;align-items:center;justify-content:center;text-align:center}.kick-button:hover{background-color:var(--color-accent-red-hover);transform:scale(1.1)}.player-card-host-tag{font-size:1rem;color:var(--color-primary);margin-top:.25rem}.lobby-actions{width:100%;max-width:400px}.lobby-waiting-text{font-size:1.5rem;color:var(--color-text);animation:pulse 2s infinite}.player-card.offline{opacity:.5;border-style:dashed;background-color:#333}.player-card-offline-tag{font-size:1rem;color:var(--color-accent-red);margin-top:.25rem}.game-page{width:100%;height:100vh;display:flex;flex-direction:column;position:relative}.game-page-main{flex-grow:1;position:relative}.player-ring-container{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center}.player-ring{width:90%;height:90%;max-width:600px;max-height:600px;position:relative}.central-table{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:35%;height:35%;background-color:#111;border-radius:50%;border:4px solid var(--color-primary)}.player-seat{position:absolute;width:100px;height:100px;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;justify-content:center}.player-avatar{width:60px;height:60px;background-color:var(--color-border);border:3px solid var(--color-text);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2rem}.player-avatar.mastermind{border-color:var(--color-primary);box-shadow:0 0 15px var(--color-primary)}.player-name{margin-top:.5rem;font-size:1.2rem;background-color:#00000080;padding:.1rem .5rem;border-radius:4px}.game-header{display:flex;justify-content:space-between;align-items:flex-start;padding-bottom:1rem;border-bottom:2px solid var(--color-border);margin-bottom:1rem}.info-board{background-color:#111;border:2px solid var(--color-border);border-radius:8px;padding:.5rem 1rem;text-align:center}.info-board-title{font-size:1.5rem;color:var(--color-primary);letter-spacing:.1em;border-bottom:1px solid var(--color-border);padding-bottom:.25rem;margin-bottom:.5rem}.mission-track{display:flex;gap:.75rem}.mission-card{width:70px;height:70px;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:1.2rem;border:2px solid var(--color-border)}.mission-card.pending{background-color:var(--color-background-panel)}.mission-card.success{background-color:var(--color-accent-blue);box-shadow:0 0 10px var(--color-accent-blue)}.mission-card.failure{background-color:var(--color-accent-red);box-shadow:0 0 10px var(--color-accent-red)}.mission-card-team-size{font-size:2rem;font-weight:700}.vote-track{display:flex;gap:.5rem}.vote-marker{width:30px;height:30px;border-radius:50%;border:2px solid var(--color-border);background-color:var(--color-background-panel)}.vote-marker.failed{background-color:var(--color-accent-red);box-shadow:0 0 8px var(--color-accent-red)}.game-info-center{text-align:center}.game-info-role{font-size:1.5rem}.game-info-role .role-thief{color:var(--color-accent-blue)}.game-info-role .role-agent{color:var(--color-accent-red)}.game-info-round{font-size:1.2rem;color:var(--color-text)}.modal-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background-color:#000000d9;display:flex;align-items:center;justify-content:center;z-index:50}.modal-content{background-color:var(--color-background-panel);border-style:solid;border-width:64px;border-image-source:url(/assets/ui_panel.png);border-image-slice:8;border-image-repeat:repeat;padding:2rem;width:100%;max-width:500px;text-align:center}.modal-title{font-size:2.5rem;margin-bottom:1rem}.modal-description{font-size:1.5rem;margin-bottom:2rem}.modal-actions{display:flex;justify-content:center;gap:1rem}.action-banner{position:absolute;bottom:0;left:0;right:0;background-color:#000000b3;padding:1.5rem;text-align:center;font-size:1.75rem;animation:pulse 2s infinite;border-top:2px solid var(--color-border)}.game-log{position:absolute;bottom:1rem;right:1rem;width:300px;height:45%;background-color:#0009;border:2px solid var(--color-border);border-radius:8px;display:flex;flex-direction:column;padding:.5rem}.game-log-title{font-size:1.5rem;text-align:center;padding-bottom:.5rem;margin-bottom:.5rem;border-bottom:1px solid var(--color-border)}.game-log-entries{flex-grow:1;overflow-y:auto;font-size:1rem;padding-right:.5rem}.game-log-entries p{margin:0 0 .5rem}.ui-button{background-color:#00000080;border:2px solid var(--color-primary);color:var(--color-primary);padding:8px 16px;font-size:1.2rem;border-radius:5px;margin:5px}.ui-button:hover{background-color:var(--color-primary);color:var(--color-text-dark)}.game-ui-bar{position:absolute;left:10px;right:10px;display:flex;justify-content:space-between;align-items:center;z-index:10;pointer-events:none}.game-ui-bar>div{pointer-events:auto}.game-ui-bar.top{top:10px}.game-ui-bar.bottom{bottom:10px}.ui-top-left,.ui-top-right,.ui-bottom-left,.ui-bottom-right{position:static}.app-container>.ui-bottom-left{position:absolute;bottom:10px;left:10px;z-index:10}.modal-backdrop-light{position:absolute;top:0;right:0;bottom:0;left:0;background-color:#0009;display:flex;align-items:center;justify-content:center;z-index:40}.modal-backdrop-log{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:flex-end;justify-content:flex-end;z-index:40;padding:20px;pointer-events:none}.modal-backdrop-log .modal-content{pointer-events:auto;max-width:400px;max-height:50vh;display:flex;flex-direction:column}.modal-backdrop-log .modal-scrollable-content{flex-grow:1;background-color:transparent;padding:0;border-radius:0}.modal-scrollable-content{max-height:50vh;overflow-y:auto;padding:1rem;background-color:var(--color-background);border-radius:8px;scrollbar-width:none;-ms-overflow-style:none}.modal-scrollable-content::-webkit-scrollbar{display:none}.player-card.selected{background-color:var(--color-accent-blue);color:var(--color-text);border-color:var(--color-primary);transform:translateY(-2px)}.text-green{color:var(--color-accent-green)}.text-red{color:var(--color-accent-red)}.text-yellow{color:var(--color-primary);font-weight:700}.vote-results-container ul{list-style-type:none;padding-left:0;margin:0}.vote-results-container h4{margin-top:0;border-bottom:2px solid var(--color-border);padding-bottom:.5rem}.game-over{display:flex;flex-direction:column;align-items:center;text-align:center;padding:2rem;border-radius:8px;border:4px solid var(--color-border);width:100%;max-width:600px}.game-over.thieves-win{border-color:var(--color-accent-blue);box-shadow:0 0 20px var(--color-accent-blue)}.game-over.agents-win{border-color:var(--color-accent-red);box-shadow:0 0 20px var(--color-accent-red)}.winner-title{font-size:5rem;margin:1rem 0;text-transform:uppercase}.role-reveal-list{list-style:none;padding:0;margin:2rem 0;width:100%;max-width:400px;text-align:left}.vote-results-container{display:flex;justify-content:space-around;text-align:left;background-color:var(--color-background);padding:1rem;border-radius:8px}.vote-list ul{list-style-type:none;padding-left:0;margin:0}.vote-list h4{margin-top:0;border-bottom:2px solid var(--color-border);padding-bottom:.5rem}.role-reveal-list li{display:flex;justify-content:space-between;align-items:center;padding:.5rem 1rem;margin-bottom:.5rem;border-radius:4px;background-color:var(--color-background);font-size:1.5rem;border-left-width:4px;border-left-style:solid}.role-reveal-list .player-name{font-weight:700}.role-reveal-list li.thief-role{border-left-color:var(--color-accent-blue)}.role-reveal-list li.agent-role{border-left-color:var(--color-accent-red)}.offline-player-name{opacity:.6;text-decoration:line-through}.how-to-play-section{margin-bottom:1.5rem}.how-to-play-section h3{font-size:2rem;color:var(--color-primary);border-bottom:2px solid var(--color-border);padding-bottom:.5rem;margin-bottom:1rem}.how-to-play-section p,.how-to-play-section li,.how-to-play-section dd{font-size:1.25rem;line-height:1.6}.how-to-play-section dt{font-size:1.5rem;font-weight:700;margin-top:1rem}.settings-button{background-color:#00000080;border:2px solid var(--color-border);color:var(--color-text);padding:8px;border-radius:50%;display:flex;align-items:center;justify-content:center;width:48px;height:48px}.settings-button:hover{border-color:var(--color-primary);color:var(--color-primary)}.settings-section{margin:2rem 0}.settings-section label{display:block;font-size:1.5rem;margin-bottom:1rem}.volume-control{display:flex;align-items:center;gap:1rem}.volume-control span{font-size:2rem}.volume-control input[type=range]{flex-grow:1}.log-chat-wrapper{display:flex;flex-direction:column;height:100%;width:100%}.log-chat-entries{flex-grow:1;overflow-y:auto;font-size:1.1rem;padding-right:.5rem;margin-bottom:1rem}.log-entry-item{margin:0 0 .5rem;color:#aaa;font-style:italic}.chat-entry-item{margin:0 0 .5rem;word-break:break-word}.chat-input-form{display:flex;margin-top:auto;padding-top:.5rem;border-top:2px solid var(--color-border)}.chat-input{flex-grow:1}.chat-send-button{background-color:var(--color-primary);color:var(--color-text-dark);border-color:var(--color-primary-hover);padding:.5rem 1rem;font-size:1.2rem}.chat-send-button:hover{background-color:var(--color-primary-hover)}html{font-size:14px}.homepage-title{font-size:4rem}.homepage-tagline{font-size:1.25rem;margin-bottom:2rem}.btn{padding:.75rem;font-size:1.5rem}.lobby-code{font-size:3rem;letter-spacing:.2em}.player-ring{width:100%;height:100%;max-width:none;max-height:none}.player-seat{width:80px;height:80px}.player-avatar{width:50px;height:50px}.player-name{font-size:1rem}.ui-button{padding:6px 12px;font-size:1rem;margin:4px}.modal-content{padding:1rem;border-width:32px;max-width:90vw}.modal-title{font-size:1.75rem}.modal-description{font-size:1.1rem}@media (min-width: 768px){html{font-size:16px}.homepage-title{font-size:6rem}.homepage-tagline{font-size:1.75rem}.btn{padding:1rem;font-size:2rem}.lobby-code{font-size:5rem;letter-spacing:.5em}.player-ring{width:90%;height:90%;max-width:600px;max-height:600px}.player-seat{width:100px;height:100px}.player-avatar{width:60px;height:60px}.player-name{font-size:1.2rem}.ui-button{padding:8px 16px;font-size:1.2rem;margin:5px}.modal-content{padding:2rem;border-width:64px;max-width:500px}.modal-title{font-size:2.5rem}.modal-description{font-size:1.5rem}}html,body,#root{height:100%;margin:0;padding:0;overflow:hidden}:root{--color-background: #1a1a1a;--color-background-panel: #2a2a2e;--color-border: #4a4a50;--color-text: #e0e0e0;--color-text-dark: #1a1a1a;--color-primary: #facc15;--color-primary-hover: #eab308;--color-accent-blue: #3b82f6;--color-accent-blue-hover: #2563eb;--color-accent-red: #ef4444;--color-accent-red-hover: #dc2626;--color-accent-green: #22c55e;--color-accent-green-hover: #16a34a}*{image-rendering:pixelated;image-rendering:crisp-edges}body{margin:0;font-family:VT323,monospace;background-color:var(--color-background);color:var(--color-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}button{font-family:VT323,monospace;cursor:pointer;border:2px solid var(--color-border);transition:all .2s ease-in-out;padding:10px 20px;font-size:1.5rem;text-transform:uppercase}button:disabled{cursor:not-allowed;opacity:.5}input{font-family:VT323,monospace;background-color:var(--color-background-panel);border:2px solid var(--color-border);color:var(--color-text);padding:10px;font-size:1.5rem}input:focus{outline:2px solid var(--color-primary);border-color:var(--color-primary)}
