*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;margin:0;padding:0;overflow-x:hidden}.app{width:100vw;min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:10px;box-sizing:border-box}.victory-banner{position:fixed;top:0;left:0;right:0;padding:20px;z-index:1000;animation:slideDown .5s ease;box-shadow:0 4px 20px #0000004d}.victory-banner.black-win{background:linear-gradient(135deg,#2c3e50,#34495e);color:#fff}.victory-banner.white-win{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.victory-banner.draw{background:linear-gradient(135deg,#95a5a6,#7f8c8d);color:#fff}@keyframes slideDown{0%{transform:translateY(-100%)}to{transform:translateY(0)}}.victory-banner-content{text-align:center;max-width:100%;margin:0 auto}.victory-title{font-size:2rem;font-weight:700;margin-bottom:10px}.victory-stats{font-size:1rem;margin-bottom:15px;opacity:.9}.restart-button-small{padding:10px 25px;font-size:1rem;background:#fff;color:#667eea;border:none;border-radius:8px;cursor:pointer;transition:all .3s;font-weight:700}.restart-button-small:hover{transform:translateY(-2px);box-shadow:0 5px 15px #ffffff4d}.game-container{background:#fff;border-radius:20px;padding:10px;box-shadow:0 20px 60px #0000004d;width:100%;max-width:1200px;display:flex;flex-direction:column;box-sizing:border-box}.game-header{text-align:center;margin-bottom:6px}.game-title{font-size:1.8rem;font-weight:700;color:#333;margin-bottom:0;cursor:pointer;transition:all .3s;-webkit-user-select:none;user-select:none}.game-title:hover{color:#667eea;transform:scale(1.05)}.mode-selector{display:flex;gap:12px;justify-content:center;margin-bottom:8px}.mode-button{padding:8px 24px;font-size:.9rem;border:2px solid #667eea;border-radius:10px;background:#fff;color:#667eea;cursor:pointer;transition:all .3s;font-weight:700}.mode-button:hover{background:#667eea;color:#fff;transform:translateY(-2px);box-shadow:0 5px 15px #667eea4d}.mode-button.active{background:#667eea;color:#fff}.game-info{display:flex;flex-direction:row;justify-content:center;margin-bottom:8px;gap:10px;max-width:100%;margin-left:auto;margin-right:auto;flex-wrap:nowrap}.player-info{padding:6px 12px;border-radius:6px;background:#f5f5f5;transition:all .3s;font-size:.9rem;text-align:center;font-weight:500;min-width:100px;flex-shrink:0;white-space:nowrap}.player-info.active{background:#667eea;color:#fff;transform:scale(1.05);box-shadow:0 5px 15px #667eea4d;font-weight:700}.board-wrapper{position:relative;margin:0 auto;width:100%;max-width:min(calc(100vh - 180px),calc(100vw - 40px));aspect-ratio:1}.win-condition{text-align:center;margin-top:10px;font-size:.9rem;color:#666;font-weight:500}.board{display:grid;grid-template-columns:repeat(8,1fr);gap:4px;background:#ddd;padding:4px;border-radius:10px;width:100%;height:100%;position:relative;overflow:hidden;box-sizing:border-box}.tile{aspect-ratio:1;border-radius:6px;position:relative}.tile.clickable{cursor:pointer}.tile.hovered-line{transform:scale(1.08);box-shadow:0 0 15px #667eea99,0 0 25px #667eea4d;z-index:5;filter:brightness(1.2);transition:all .2s ease}.tile.selected-line{box-shadow:0 0 20px #ffd700cc,0 0 30px #ffd70080;z-index:6;filter:brightness(1.3)}.tile.selected-line.black-player{animation:pulseUp 1s ease-in-out infinite}.tile.selected-line.white-player{animation:pulseRight 1s ease-in-out infinite}@keyframes pulseUp{0%,to{transform:translateY(0) scale(1.05)}50%{transform:translateY(-8px) scale(1.08)}}@keyframes pulseRight{0%,to{transform:translate(0) scale(1.05)}50%{transform:translate(8px) scale(1.08)}}.tile.black{background:#2c3e50}.tile.white{background:#ecf0f1}.tile.empty{background:transparent}.tile.winning{animation:glow 1.5s ease-in-out infinite;box-shadow:0 0 20px #ffd700cc;z-index:10}@keyframes glow{0%,to{box-shadow:0 0 10px #ffd70099,0 0 20px #ffd70066;transform:scale(1)}50%{box-shadow:0 0 20px gold,0 0 30px #ffd700cc,0 0 40px #ffd70099;transform:scale(1.05)}}.tile.removing{animation:fadeOut .5s ease}@keyframes fadeOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0)}}.controls{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none}.row-controls,.col-controls{position:absolute}.row-controls{left:-50px;top:0;height:100%;display:flex;flex-direction:column;justify-content:space-around}.col-controls{top:-50px;left:0;width:100%;display:flex;justify-content:space-around}.control-button{width:40px;height:40px;border-radius:50%;border:2px solid #667eea;background:#fff;color:#667eea;font-size:1.2rem;cursor:pointer;pointer-events:auto;transition:all .3s;display:flex;align-items:center;justify-content:center}.control-button:hover{background:#667eea;color:#fff;transform:scale(1.1)}.control-button:disabled{opacity:.3;cursor:not-allowed}@media (max-width: 768px){.game-title{font-size:2rem}.game-container{padding:20px}.game-info{flex-direction:row;gap:8px}.player-info{font-size:.85rem;padding:5px 10px;min-width:90px}.board-wrapper{margin:30px auto}.row-controls{left:-45px}.col-controls{top:-45px}.control-button{width:35px;height:35px;font-size:1rem}.victory-title{font-size:1.5rem}.victory-stats{font-size:.9rem}}@media (max-width: 480px){.game-title{font-size:1.5rem}.game-container{padding:15px}.game-info{gap:6px}.player-info{font-size:.8rem;padding:4px 8px;min-width:80px}.board{gap:2px;padding:2px}.row-controls{left:-40px}.col-controls{top:-40px}.control-button{width:30px;height:30px;font-size:.9rem}.victory-title{font-size:1.2rem}.victory-stats{font-size:.8rem}.restart-button-small{padding:8px 20px;font-size:.9rem}}