* {box-sizing:border-box}html,body {margin:0; padding:0; font-family:'Open Sans',sans-serif; color:#fff; background:linear-gradient(to bottom,#093028,#237A57) no-repeat center center fixed; background-size:cover}body {display:flex; flex-direction:column; min-height:100vh}.app-header {display:flex; justify-content:space-between; align-items:center; padding:12px 20px; background:rgba(0,0,0,0.3); backdrop-filter:blur(6px)}.header-left {display:flex; align-items:center}.logo-block {display:flex; align-items:center; gap:8px}.app-logo {width:40px; height:40px; border-radius:50%}.app-title {font-size:1.2rem; font-weight:600; letter-spacing:0.5px}.header-right {display:flex; align-items:center; gap:20px}.players-count-tools {display:flex; align-items:center; gap:6px}.players-count-tools label {font-weight:600; font-size:0.95rem; opacity:0.9}.count-btn {padding:6px 14px; font-size:1rem; border:none; border-radius:6px; font-weight:600; cursor:pointer; background:#27ae60; color:#fff; transition:background 0.3s ease,box-shadow 0.3s}.count-btn:hover {background:#2ecc71; box-shadow:0 0 10px rgba(46,204,113,0.7)}#playerCount {width:50px; text-align:center; border:none; border-radius:6px; padding:6px; background:rgba(255,255,255,0.2); color:#fff; font-size:0.95rem}.reset-btn {padding:8px 16px; font-size:0.95rem; border:none; border-radius:8px; font-weight:600; cursor:pointer; background:#c0392b; color:#fff; transition:background 0.3s ease,box-shadow 0.3s}.reset-btn:hover {background:#e74c3c; box-shadow:0 0 10px rgba(231,76,60,0.6)}.main-content {display:flex; flex:1; gap:20px; padding:20px}.table-section {flex:1; display:flex; justify-content:center; align-items:center}.poker-table {position:relative; width:900px; height:600px; margin:0 auto; background:url("https://via.placeholder.com/900x600/046A38/ffffff?text=Poker+Table") no-repeat center center; background-size:cover; border-radius:50%; box-shadow:0 0 15px rgba(0,0,0,0.5),inset 0 0 40px rgba(0,0,0,0.5); opacity:0; animation:fadeInScale 0.8s forwards}@keyframes fadeInScale {to {opacity:1; transform:scale(1)}}.poker-table::before {content:"Rastor Technologic"; position:absolute; top:30%; left:50%; transform:translate(-50%,-50%); font-size:2rem; font-weight:700; color:#fff; opacity:0.05; pointer-events:none; user-select:none}.board-zone {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:80%; display:flex; flex-direction:row; justify-content:center; align-items:flex-start; gap:40px}.board-row {display:flex; flex-direction:column; align-items:center; gap:8px; background:rgba(0,0,0,0.15); padding:6px; border-radius:8px}.board-label {font-weight:700; letter-spacing:1px; text-transform:uppercase; font-size:0.9rem; margin-bottom:4px}.board-buttons {display:flex; gap:8px; justify-content:center}.board-btn {padding:6px 12px; font-size:0.8rem; font-weight:600; border:none; border-radius:6px; cursor:pointer; background:#2980b9; color:#fff; transition:background 0.3s,box-shadow 0.3s}.board-btn:hover {background:#3498db; box-shadow:0 0 10px rgba(52,152,219,0.6)}.board-btn:disabled {background:#7f8c8d; cursor:not-allowed}.board-cards-row {display:flex; align-items:center; gap:8px}.card-chosen {width:44px; height:60px; background:#fff; color:#000; border-radius:4px; border:1px solid #666; display:flex; align-items:center; justify-content:center; font-weight:bold; font-size:1.2rem; transition:transform 0.3s}.card-chosen.heart,.card-chosen.diamond {color:red}.card-chosen.spade,.card-chosen.club {color:black}.card-chosen:hover {transform:translateY(-3px)}.players-circle {position:absolute; width:100%; height:100%; pointer-events:none}.player-row {position:absolute; pointer-events:auto; width:140px; background:rgba(0,0,0,0.3); border-radius:10px; padding:10px; text-align:center; box-shadow:0 0 6px rgba(0,0,0,0.3); transform:translate(-50%,-50%); transition:transform 0.3s; z-index:100}.player-name {width:100%; border:none; background:rgba(255,255,255,0.2); color:#fff; padding:4px; border-radius:6px; margin-bottom:8px; text-align:center; font-size:0.85rem; font-weight:600}.choose-btn {display:inline-block; padding:6px 10px; cursor:pointer; border:none; border-radius:6px; background:#27ae60; color:#fff; font-weight:600; transition:background 0.3s,box-shadow 0.3s; font-size:0.8rem; margin-bottom:8px}.choose-btn:hover {background:#2ecc71; box-shadow:0 0 10px rgba(46,204,113,0.6)}.choose-btn:disabled {background:#ccc; color:#666; cursor:not-allowed}.cards-and-strength {display:flex; flex-direction:column; align-items:center}.chosen-cards {display:flex; gap:4px; flex-wrap:wrap; margin-bottom:6px}.card-chosen.player-card {width:42px; height:58px; font-size:1.2rem}.hand-strength,.hand-equity {font-size:0.8rem; margin-bottom:4px; text-align:center}.analytics-block {width:580px; background:rgba(0,0,0,0.4); backdrop-filter:blur(10px); border-radius:12px; padding:20px; box-shadow:0 0 8px rgba(0,0,0,0.4); overflow-y:auto; max-height:calc(100vh - 60px); font-size:1rem; line-height:1.5; text-align:left}.analytics-title {text-align:center; font-weight:700; margin-top:0; margin-bottom:16px; letter-spacing:1px; text-transform:uppercase; font-size:1.2rem}.winners-block {background:rgba(255,255,255,0.2); border-radius:8px; padding:12px; margin-bottom:15px; text-align:center}.winner-name {color:#f1c40f; font-weight:600}.result-section h4 {margin:0 0 8px 0; font-weight:600; text-transform:uppercase; letter-spacing:0.5px; font-size:1rem; text-decoration:underline}.result-list {list-style:none; padding-left:0; margin:0}.result-list li {margin-bottom:8px; font-weight:500}.result-explanation {background:rgba(0,0,0,0.4); padding:10px; border-radius:6px; margin-top:10px; font-size:0.95rem; white-space:pre-wrap}.result-explanation p {margin:0 0 12px 0; line-height:1.5}.modal-overlay {position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.8); display:none; justify-content:center; align-items:center; z-index:999}.modal-content {background:rgba(255,255,255,0.15); backdrop-filter:blur(10px); border-radius:12px; padding:20px; max-width:900px; width:90%; max-height:80%; overflow-y:auto; position:relative; box-shadow:0 8px 32px rgba(0,0,0,0.4)}.modal-header {display:flex; justify-content:space-between; align-items:center; margin-bottom:10px}.modal-header h2 {margin:0; font-size:1rem; letter-spacing:0.5px; text-transform:uppercase}.modal-header button {background:#c0392b; border:none; color:#fff; font-weight:600; padding:6px 12px; cursor:pointer; border-radius:6px; transition:background 0.2s,transform 0.2s}.modal-header button:hover {background:#e74c3c}.modal-header button:active {transform:scale(0.97)}.suit-group {margin-bottom:16px}.suit-title {margin-bottom:8px; font-weight:600; font-size:0.95rem; text-transform:uppercase}.cards-grid {display:flex; flex-wrap:wrap; gap:6px}.card-item {width:46px; height:64px; background:#fff; color:#000; border-radius:6px; border:1px solid #666; display:flex; align-items:center; justify-content:center; font-weight:bold; user-select:none; transition:transform 0.1s,opacity 0.3s; font-size:1.2rem; cursor:pointer}.card-item:hover {transform:scale(1.05)}.heart,.diamond {color:red}.spade,.club {color:black}.card-disabled {opacity:0.4; cursor:not-allowed; transform:none !important}.alert-overlay {position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.8); display:none; justify-content:center; align-items:center; z-index:1000}.alert-content {background:rgba(255,255,255,0.15); backdrop-filter:blur(10px); border-radius:12px; padding:20px; max-width:400px; width:90%; text-align:center; box-shadow:0 8px 32px rgba(0,0,0,0.4)}.alert-content h2 {margin:0 0 10px 0; font-size:1rem; text-transform:uppercase; letter-spacing:0.5px; font-weight:600}#alertMessage {margin-bottom:15px; font-size:0.95rem; white-space:pre-wrap; text-align:left}.alert-content button {background:rgba(255,255,255,0.2); border:none; color:#fff; font-weight:600; cursor:pointer; padding:8px 16px; border-radius:8px; transition:background 0.2s,transform 0.2s}.alert-content button:hover {background:rgba(255,255,255,0.3)}.alert-content button:active {transform:scale(0.97)}.app-footer {text-align:center; padding:10px; font-size:0.85rem; color:rgba(255,255,255,0.6); background:rgba(0,0,0,0.3); backdrop-filter:blur(6px)}@media (max-width:1200px) {.poker-table {width:700px; height:450px} #playerRow1 {top:5%; left:50%} #playerRow2 {top:15%; left:85%} #playerRow3 {top:40%; left:95%} #playerRow4 {top:70%; left:85%} #playerRow5 {top:88%; left:50%} #playerRow6 {top:70%; left:15%} #playerRow7 {top:40%; left:5%}}@media (max-width:992px) {.main-content {flex-direction:column} .analytics-block {width:100%; max-height:none; margin-top:20px; order:3} .table-section {order:1; margin-bottom:20px}}@media (max-width:768px) {.poker-table {width:90%; height:400px} .player-row {width:120px; padding:8px} .card-chosen {width:38px; height:52px; font-size:0.75rem} .board-btn {padding:6px 10px; font-size:0.8rem}}@media (max-width:480px) {.app-title {font-size:0.95rem} .player-row {width:100px; padding:6px} .player-name {font-size:0.75rem} .choose-btn {font-size:0.7rem; padding:4px 8px} .card-chosen {width:32px; height:46px; font-size:0.7rem}}.tooltip {position:absolute; background:rgba(0,0,0,0.85); color:#fff; padding:8px 10px; border-radius:6px; font-size:0.8rem; line-height:1.4; white-space:pre-wrap; max-width:260px; z-index:100000; pointer-events:none; box-shadow:0 0 10px rgba(0,0,0,0.5); text-align:left; opacity:0; transition:opacity 0.2s ease-in-out}.inline-spinner {display:inline-block; width:14px; height:14px; margin-left:4px; border:2px solid rgba(255,255,255,.35); border-top-color:#fff; border-radius:50%; animation:spin .8s linear infinite; vertical-align:middle}@keyframes spin {to {transform:rotate(360deg)}}