@import"https://fonts.googleapis.com/css2?family=Press+Start+2P&family=VT323&display=swap";:root{--bg-color: #0d0e15;--bg-gradient-inner: rgba(30, 30, 45, .4);--bg-gradient-outer: rgba(13, 14, 21, .9);--card-bg: #1a1c29;--text-main: #e0e0e0;--text-muted: #8d93a8;--primary: #5c5c8a;--accent: #b93b3b;--highlight: #f0e68c;--border-color: #000000;--input-bg: #000000;--border-width: 3px;--shadow-offset: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 32px}body.light-mode{--bg-color: #e6e6fa;--bg-gradient-inner: rgba(255, 255, 255, .6);--bg-gradient-outer: rgba(230, 230, 250, 1);--card-bg: #ffffff;--text-main: #2d2d2d;--text-muted: #55596b;--primary: #7676a8;--accent: #d64545;--highlight: #b8860b;--border-color: #1a1a1a;--input-bg: #f0f0f0}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-main);font-family:VT323,monospace;font-size:20px;line-height:1.4;display:flex;justify-content:center;min-height:100vh;background-image:radial-gradient(circle at 50% 50%,var(--bg-gradient-inner) 0%,var(--bg-gradient-outer) 100%);transition:background-color 1s ease,color 1s ease,background-image 1s ease}.pixel-card,.btn,.pixel-input,.control-btn,h1,h2,h3,li,.counter-btn{transition:background-color 1s ease,color 1s ease,border-color 1s ease,box-shadow 1s ease}h1,h2,h3{font-family:"Press Start 2P",cursive;text-transform:uppercase;color:var(--highlight);margin-bottom:var(--spacing-md);text-shadow:2px 2px 0px var(--border-color);font-size:1.2rem;text-align:center}.app-container{width:100%;max-width:400px;padding:var(--spacing-md);display:flex;flex-direction:column;min-height:100vh}#phase-view-container{flex-grow:1;display:flex;flex-direction:column;width:100%}.lobby-container{display:flex;flex-direction:column;flex-grow:1;width:100%}.manager-controls,.waiting-message{margin-top:auto;padding-top:var(--spacing-md);width:100%}.pixel-card{background-color:var(--card-bg);border:var(--border-width) solid var(--border-color);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--border-color);padding:var(--spacing-md);margin-bottom:var(--spacing-md);position:relative}.btn{display:block;width:100%;background-color:var(--primary);color:#fff;font-family:"Press Start 2P",cursive;font-size:.8rem;padding:15px;margin-bottom:var(--spacing-md);border:var(--border-width) solid var(--border-color);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--border-color);cursor:pointer;text-align:center;text-decoration:none;transform:translate(0)}.btn:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--border-color);transition:transform .1s}.btn-secondary{background-color:var(--card-bg);color:var(--text-muted)}.btn-danger{background-color:var(--accent);color:#fff}.btn:disabled,.btn.disabled{background-color:#999;color:#ccc;border-color:#666;box-shadow:none;cursor:not-allowed;transform:none;pointer-events:none;opacity:.5}.full-width{width:100%}.highlight-text{color:#ff4e4e;text-shadow:2px 2px 0px #000}.lobby-grid{display:grid;grid-template-columns:1fr;gap:20px;margin-top:20px}@media(min-width:768px){.lobby-grid{grid-template-columns:1fr 1fr}}.responsive-container{max-width:800px;margin:0 auto;padding:10px}.qr-container canvas{max-width:100%;height:auto!important;image-rendering:pixelated;border:var(--border-width) solid var(--border-color)}.qr-card{display:flex;flex-direction:column;align-items:center;text-align:center}.pixel-list{list-style:none;width:100%}.pixel-list-item{display:flex;align-items:center;padding:8px 0;border-bottom:1px dashed var(--text-muted);font-size:1.2rem}.pixel-list-item:last-child{border-bottom:none}.player-dot{width:12px;height:12px;margin-right:12px;border-radius:2px}.player-dot.alive{background:#4eff4e}.player-dot.dead{background:#ff4e4e}.selectable-player{cursor:pointer;transition:background-color .2s;padding-left:10px;padding-right:10px}.selectable-player:hover{background-color:#ffffff0d}.selectable-player.selected{background-color:var(--accent);color:#fff;border-color:var(--highlight)}.selectable-player.selected .player-name{font-weight:700}.name-edit-input::placeholder{color:var(--text-muted);font-style:italic;opacity:.7}.own-player{border-left:4px solid var(--highlight);padding-left:8px}.pixel-input{width:100%;background-color:var(--input-bg);border:var(--border-width) solid var(--text-muted);color:var(--text-main);font-family:VT323,monospace;font-size:1.5rem;padding:10px;margin-bottom:var(--spacing-md);text-align:center;outline:none}.pixel-input:focus{border-color:var(--highlight);color:var(--highlight);background-color:var(--card-bg)}.qr-container{background-color:var(--card-bg);padding:10px;border:var(--border-width) solid var(--border-color);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--border-color);margin:0 auto var(--spacing-md) auto;width:210px;height:210px;display:flex;align-items:center;justify-content:center;transition:border-color 1s ease,background-color 1s ease}.player-list{list-style:none;padding:0}.player-list li{padding:8px;border-bottom:2px dashed var(--text-muted);font-size:1.2rem;text-transform:uppercase}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000d9;display:flex;justify-content:center;align-items:center;z-index:1000;padding:var(--spacing-md);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-content{max-width:350px;width:100%;animation:popup-bounce .3s ease-out}@keyframes popup-bounce{0%{transform:scale(.5);opacity:0}70%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}.counter-widget{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--spacing-sm);background-color:#0000001a;padding:5px;border-radius:4px}.counter-btn{width:40px;height:40px;background:var(--card-bg);color:var(--text-main);border:2px solid var(--border-color);font-family:"Press Start 2P";cursor:pointer}.counter-display{flex-grow:1;text-align:center;font-size:1.2rem;color:var(--highlight)}.playback-controls{display:flex;justify-content:space-around;align-items:center;margin-top:auto;padding-top:var(--spacing-lg)}.control-btn{width:60px;height:60px;background-color:var(--card-bg);border:var(--border-width) solid var(--text-muted);color:var(--text-main);display:flex;align-items:center;justify-content:center;font-size:1.5rem;cursor:pointer;transform:rotate(45deg)}.control-btn span{transform:rotate(-45deg);-webkit-user-select:none;user-select:none}.control-btn.large{width:80px;height:80px;background-color:var(--primary);border-color:var(--border-color);color:#fff}.role-image-container{width:100%;max-width:250px;margin:0 auto var(--spacing-md) auto;background:#0003;border:2px solid var(--border-color);display:flex;justify-content:center;align-items:center;padding:10px}.pixel-art-image{width:100%;height:auto;image-rendering:pixelated;display:block}.role-description-box{text-align:center;padding:10px;border-top:2px dashed var(--text-muted)}.night-title{color:#a3a3ff}.sleep-card{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-lg);text-align:center;min-height:200px}.moon-icon{font-size:4rem;margin-bottom:var(--spacing-md);filter:drop-shadow(0 0 10px rgba(163,163,255,.5))}#night-current-turn-display{margin-top:var(--spacing-md);font-style:italic;font-size:1.1rem}