:root {
    color-scheme: only dark; /* v745: запрет алгоритмического перекрашивания (Force Dark) в Android WebView */
    --gold: #fecb00;
    --gold-glow: rgba(254, 203, 0, 0.4);
    --white: #ffffff;
    --grey-text: #999999;
    --panel-bg: linear-gradient(to bottom, #2b2b2b 0%, #000000 100%);
    --box-gradient: linear-gradient(to bottom, #fceb8d 0%, #d89f02 100%);
    --font-main: 'Montserrat', 'Inter', sans-serif;
    --font-nums: 'Outfit', 'Montserrat', sans-serif;
    --bg-color: #02140a; /* Very Dark Emerald Green */
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    user-select: none;
}

input, textarea, [contenteditable="true"] {
    user-select: text;
}

button, input, select, textarea {
    font-family: inherit;
}

body {
    font-family: var(--font-main);
    background: radial-gradient(circle at center, #062b16 0%, #02140a 100%);
    color: var(--white);
    overflow: hidden; /* Disabled scroll for the game panel */
    display: flex;
    height: 100vh;
}

/* Menu Toggle Button */
.menu-toggle {
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 100;
    background: transparent;
    border: none;
    color: var(--grey-text);
    width: 40px;
    height: 40px;
    cursor: pointer;
    transition: color 0.3s ease;
}

.menu-toggle:hover {
    color: var(--gold);
}

.menu-toggle svg {
    width: 32px;
    height: 32px;
}

/* Sidebar */
.sidebar {
    position: fixed;
    top: 0;
    left: 0;
    width: 280px;
    height: 100vh;
    background-color: #111;
    border-right: 1px solid #333;
    transform: translateX(-100%);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 50;
    padding-top: 80px;
    will-change: transform;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.sidebar.open {
    transform: translateX(0);
}

.sidebar-header {
    padding: 0 20px 20px;
    border-bottom: 1px solid #333;
    margin-bottom: 20px;
}

.sidebar-header h2 {
    color: var(--gold);
    font-size: 1.2rem;
}

.menu-items {
    list-style: none;
    padding: 0 10px;
}

.menu-item {
    display: block;
    text-decoration: none;
    box-sizing: border-box;
    width: 100%;
    text-align: left;
    background: transparent;
    border: none;
    color: var(--grey-text);
    font-size: 1.1rem;
    padding: 15px 20px;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s;
}

.menu-item:hover {
    background: #222;
    color: var(--white);
}

.menu-item.active {
    background: rgba(254, 203, 0, 0.1);
    color: var(--gold);
    border-left: 3px solid var(--gold);
}

/* Main Content & Page Switching */
#main-content {
    flex: 1;
    height: 100%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    width: 100%;
    position: relative;
    padding: 0;
    will-change: transform;
}

.page-view {
    display: none;
    width: 100%;
    height: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-gutter: stable;
    padding: 30px 20px;
    opacity: 0;
    box-sizing: border-box;
}

.page-view.active {
    display: flex;
    animation: pageFadeIn 0.5s forwards cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes pageFadeIn {
    from { 
        opacity: 0; 
        transform: translateY(10px); 
    }
    to { 
        opacity: 1; 
        transform: translateY(0); 
    }
}

.page-title {
    color: var(--gold);
    font-size: 2rem;
    text-transform: uppercase;
    margin-bottom: 20px; /* Reduced gap */
    letter-spacing: 2px;
}

.compact-title {
    margin-bottom: 10px;
}

.compact-section {
    margin-top: -10px !important;
}

.seating-panel {
    max-width: 1600px !important;
}

/* Poker Tables Visuals */
.tables-grid {
    display: flex;
    justify-content: center;
    gap: 80px;
    flex-wrap: wrap;
    width: 100%;
}

.table-wrap {
    padding: 60px 40px;
}

.poker-table {
    width: 380px;
    height: 220px;
    background: radial-gradient(circle, #0a7c2e 0%, #054d1c 100%);
    border: 14px solid #3d2b1f; /* Thicker wood rim */
    border-radius: 110px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 20px 50px rgba(0,0,0,0.7), inset 0 0 30px rgba(0,0,0,0.5);
}

.table-number {
    font-family: var(--font-nums);
    font-size: 5rem;
    color: rgba(255,255,255,0.15);
    user-select: none;
    filter: drop-shadow(0 0 10px rgba(255,255,255,0.05));
}

.dealer-spot {
    position: absolute;
    top: -15px;
    left: 50%;
    transform: translateX(-50%);
    width: 46px;
    height: 46px;
    background: #fff;
    color: #000;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 900;
    font-size: 1.2rem;
    box-shadow: 0 6px 15px rgba(0,0,0,0.6);
    z-index: 10;
    border: 4px solid #222;
}

.seats-container {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.seat {
    position: absolute;
    width: 34px;
    height: 34px;
    background: #1a1a1a;
    border: 2px solid var(--gold);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--white);
    transition: all 0.2s;
    box-shadow: 0 4px 8px rgba(0,0,0,0.5);
    z-index: 8;
}

/* Positioning 10 seats exactly ON THE RIM clockwise from dealer */
.s1  { top: 5%;   left: 70%;  transform: translate(-50%, -50%); }
.s2  { top: 25%;  left: 93%;  transform: translate(-50%, -50%); }
.s3  { top: 50%;  left: 100%; transform: translate(-50%, -50%); }
.s4  { top: 75%;  left: 93%;  transform: translate(-50%, -50%); }
.s5  { top: 95%;  left: 70%;  transform: translate(-50%, -50%); }
.s6  { top: 95%;  left: 30%;  transform: translate(-50%, -50%); }
.s7  { top: 75%;  left: 7%;   transform: translate(-50%, -50%); }
.s8  { top: 50%;  left: 0%;   transform: translate(-50%, -50%); }
.s9  { top: 25%;  left: 7%;   transform: translate(-50%, -50%); }
.s10 { top: 5%;   left: 30%;  transform: translate(-50%, -50%); }

/* Players List Section */
.players-list-section {
    margin-top: 80px;
    width: 100%;
    max-width: 100%;
}

.players-columns-wrapper {
    width: 100%;
}

.notes-grid {
    width: 100%;
}

.section-title {
    color: var(--gold);
    font-size: 1.5rem;
    margin-bottom: 20px;
    text-align: center;
}

.players-table-container {
    background: rgba(255,255,255,0.03);
    border: 1px solid #333;
    border-radius: 8px;
    overflow: hidden;
}

.players-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 1rem;
    table-layout: fixed;
}

.players-table th {
    background: #222;
    color: var(--gold);
    text-align: left;
    padding: 15px;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.8rem;
    letter-spacing: 1px;
    white-space: nowrap;
    height: 50px;
    box-sizing: border-box;
    vertical-align: middle;
}

.players-table td {
    padding: 12px 15px;
    border-bottom: 1px solid #222;
    color: #ccc;
}

.seating-grid td, .seating-grid th {
    text-align: center;
}

.seating-grid th:first-child, .seating-grid td:first-child {
    width: 80px;
    color: var(--gold);
    font-weight: bold;
    background: rgba(0,0,0,0.2);
}

/* Waiting List Styles */
.waiting-list-section {
    margin-top: 30px;
    width: 100%;
    max-width: 900px;
}

.waiting-list-container {
    background: rgba(255,255,255,0.03);
    border: 1px solid #333;
    border-radius: 8px;
    padding: 20px;
}

/* Add Player Form */
.add-player-form-section {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid #222;
    width: 100%;
    max-width: 900px;
}

.form-row {
    display: flex;
    gap: 20px;
    align-items: flex-end;
    background: rgba(255,255,255,0.02);
    padding: 20px;
    border-radius: 8px;
    border: 1px solid #333;
}

.input-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}

.input-group label {
    font-size: 0.75rem;
    color: var(--gold);
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 700;
}

.styled-input {
    background: #111;
    border: 1px solid #444;
    padding: 12px 15px;
    border-radius: 4px;
    color: var(--white);
    font-family: inherit;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.styled-input:focus {
    outline: none;
    border-color: var(--gold);
    box-shadow: 0 0 8px rgba(254, 203, 0, 0.2);
}

.styled-input::placeholder {
    color: #666;
    font-style: italic;
    opacity: 0.6;
}

/* Убираем светлый (лавандовый) фон автозаполнения браузера (Yandex/Chrome) —
   держим поле тёмным. Автозаполнение красит фон поверх CSS через внутренний стиль,
   поэтому перекрываем его inset-тенью. */
.styled-input:-webkit-autofill,
.styled-input:-webkit-autofill:hover,
.styled-input:-webkit-autofill:focus,
.styled-input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1000px #111 inset !important;
    -webkit-text-fill-color: #ffffff !important;
    caret-color: #ffffff;
    transition: background-color 9999s ease-in-out 0s;
}

.compact-input {
    max-width: 100px;
}

.add-btn-premium {
    background: linear-gradient(135deg, var(--gold) 0%, #b8860b 100%);
    color: #000;
    border: none;
    padding: 12px 30px;
    border-radius: 4px;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
    transition: transform 0.2s, filter 0.2s;
    height: 45px;
}

.add-btn-premium:hover {
    transform: translateY(-2px);
    filter: brightness(1.1);
}

.clear-btn-premium {
    background: linear-gradient(135deg, #2c3e50 0%, #1a252f 100%);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.15);
    padding: 12px 30px;
    border-radius: 4px;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
    transition: transform 0.2s, filter 0.2s, border-color 0.2s;
    height: 45px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 0.5px;
}

.clear-btn-premium:hover {
    transform: translateY(-2px);
    border-color: var(--gold);
    filter: brightness(1.1);
}


/* Rebuy / Addon Buttons and Badges */
.registration-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin-bottom: 20px;
}

/* Hide number arrows */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
}

.calendar-nav {
    display: flex;
    align-items: center;
    gap: 8px;
    width: auto;
    width: 100%;
    min-width: unset;
    box-sizing: border-box;
}

.cal-nav-btn {
    background: rgba(254, 203, 0, 0.1);
    border: 1.5px solid #333;
    color: var(--gold);
    width: 32px;
    height: 32px;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    transition: all 0.2s;
    box-sizing: border-box;
}

.cal-nav-btn:hover {
    background: var(--gold);
    color: #000;
    border-color: #fff;
    box-shadow: 0 0 15px rgba(254, 203, 0, 0.4);
}

.cal-nav-btn:disabled {
    opacity: 0.3;
    cursor: not-allowed;
    pointer-events: none;
}

.calendar-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    background: #0a0a0a;
    border: 1.5px solid #333;
    border-radius: 8px;
    padding: 0 10px;
    transition: all 0.3s;
    justify-content: center;
    flex: 1;
    min-width: 0;
    height: 32px;
    box-sizing: border-box;
}

.calendar-wrapper:hover {
    border-color: var(--gold);
    box-shadow: 0 0 15px rgba(254, 203, 0, 0.2);
}

.registration-date-input {
    background: transparent;
    border: none;
    color: var(--gold);
    padding: 0;
    font-family: 'Quicksand', sans-serif;
    font-weight: 700;
    font-size: 0.95rem;
    outline: none;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    min-width: 0;
    width: 100%;
    text-align: center;
    box-sizing: border-box;
}

.registration-date-input:hover, .registration-date-input:focus {
    font-family: 'Quicksand', sans-serif;
    font-weight: 700;
}



.registration-date-input::-webkit-calendar-picker-indicator {
    display: none !important;
}

/* Custom Calendar Popup - REDESIGNED FOR PREMIUM LOOK */
.calendar-popup {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.9);
    background: linear-gradient(145deg, #1a1a1a 0%, #050505 100%);
    border: 1px solid rgba(254, 203, 0, 0.3);
    border-radius: 24px;
    padding: 30px;
    z-index: 2500;
    width: 360px;
    box-shadow: 
        0 30px 60px rgba(0,0,0,0.8), 
        0 0 20px rgba(254, 203, 0, 0.1),
        inset 0 0 1px 1px rgba(255,255,255,0.05);
    opacity: 0;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    pointer-events: none;
    backdrop-filter: blur(20px);
    user-select: none;
}

.calendar-popup.show {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
    pointer-events: auto;
}

.calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25px;
}

#cal-month-year {
    color: var(--gold);
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-size: 1.1rem;
    text-shadow: 0 0 15px rgba(254, 203, 0, 0.5);
    font-family: var(--font-nums);
}

.cal-nav {
    background: rgba(254, 203, 0, 0.05);
    border: 1px solid rgba(255,255,255,0.1);
    color: var(--gold);
    cursor: pointer;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.3s ease;
}

.cal-nav:hover {
    background: var(--gold);
    color: #000;
    box-shadow: 0 0 15px var(--gold-glow);
    border-color: #fff;
}

.calendar-weekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    text-align: center;
    font-size: 0.75rem;
    color: #666;
    margin-bottom: 15px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.calendar-days {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 10px;
}

.cal-day {
    aspect-ratio: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    border-radius: 12px;
    font-size: 0.95rem;
    color: #999;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    font-weight: 600;
    border: 1px solid transparent;
    font-family: var(--font-nums);
}

.cal-day:hover:not(.prev-month):not(.next-month) {
    background: rgba(254, 203, 0, 0.15);
    color: var(--gold);
    border-color: rgba(254, 203, 0, 0.4);
    transform: scale(1.1);
}

.cal-day.today {
    border: 1px solid rgba(254, 203, 0, 0.5);
    color: var(--gold);
    background: rgba(254, 203, 0, 0.05);
}

.cal-day.selected {
    background: linear-gradient(135deg, var(--gold) 0%, #b8860b 100%);
    color: #000;
    box-shadow: 0 0 20px var(--gold-glow);
    font-weight: 900;
    transform: scale(1.1);
}

.cal-day.prev-month, .cal-day.next-month {
    color: #2a2a2a;
    cursor: default;
}

.calendar-footer {
    margin-top: 25px;
    padding-top: 20px;
    border-top: 1px solid rgba(255,255,255,0.05);
    display: flex;
    justify-content: center;
}

#cal-today-btn {
    background: rgba(255,255,255,0.02);
    border: 1px solid rgba(255,255,255,0.1);
    color: var(--gold);
    font-size: 0.8rem;
    padding: 10px 30px;
    border-radius: 10px;
    cursor: pointer;
    text-transform: uppercase;
    font-weight: 900;
    letter-spacing: 1.5px;
    transition: all 0.3s;
}

#cal-today-btn:hover {
    background: rgba(254, 203, 0, 0.1);
    border-color: var(--gold);
    box-shadow: 0 0 15px rgba(254, 203, 0, 0.2);
}

.bar-services-section {
    border-bottom: 1px solid #222;
    padding-bottom: 30px;
}

.bar-btn {
    background: linear-gradient(135deg, #2ecc71 0%, #27ae60 100%) !important;
}

#tour-date-wrapper:hover .styled-input {
    border-color: var(--gold);
    box-shadow: 0 0 12px rgba(254, 203, 0, 0.3);
}

.badge-bar {
    background: #27ae60;
    color: #fff;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 800;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

.player-info-cell {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    padding: 3px 0;
}

.player-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

.badge {
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 500;
    text-transform: uppercase;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 3px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.3);
}

.badge-rebuy { background: #0088ff; }
.badge-addon { background: #fecb00; color: #000; }

.badge-count {
    background: rgba(0,0,0,0.3);
    padding: 1px 4px;
    border-radius: 3px;
    font-size: 0.6rem;
}

.reset-action {
    min-width: 32px !important;
    border-color: rgba(255,255,255,0.2) !important;
    color: rgba(255,255,255,0.5) !important;
}

.reset-action:hover {
    background: rgba(255,255,255,0.1) !important;
    color: #fff !important;
}

.action-btns {
    display: flex;
    gap: 4px;
    justify-content: flex-start;
    padding-left: 0; /* Removed to align with cell padding */
}

.btn-ra {
    min-width: 40px;
    height: 32px;
    padding: 0 3px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.03);
    border: 1.5px solid rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.8);
    font-family: 'Quicksand', sans-serif; /* Extremely soft and smooth font */
    font-weight: 700;
    font-size: 0.7rem;
    letter-spacing: 0.2px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    backdrop-filter: blur(5px);
}

.btn-ra:hover {
    transform: translateY(-2px);
    color: #fff;
}

/* Rebuy - Neon Blue */
.rebuy-action {
    border-color: #0088ff;
    color: #0088ff;
    box-shadow: inset 0 0 8px rgba(0, 136, 255, 0.1);
}

.rebuy-action:hover {
    background: #0088ff;
    box-shadow: 0 0 20px rgba(0, 136, 255, 0.4);
    border-color: #00d4ff;
    color: #fff;
}

/* Addon - Neon Gold */
.addon-action {
    border-color: #fecb00;
    color: #fecb00;
    box-shadow: inset 0 0 8px rgba(254, 203, 0, 0.1);
}

.addon-action:hover {
    background: #fecb00;
    box-shadow: 0 0 20px rgba(254, 203, 0, 0.4);
    border-color: #fff700;
    color: #000;
}

/* Out - Neon Red */
.out-action {
    border-color: #ff4444;
    color: #ff4444;
    box-shadow: inset 0 0 8px rgba(255, 68, 68, 0.1);
}

.out-action:hover {
    background: #ff4444;
    box-shadow: 0 0 20px rgba(255, 68, 68, 0.4);
    border-color: #ff8888;
    color: #fff;
}

/* Tips - Amethyst Purple */
.tips-action {
    border-color: #9b59b6;
    color: #9b59b6;
    box-shadow: inset 0 0 8px rgba(155, 89, 182, 0.1);
}

.tips-action:hover {
    background: #9b59b6;
    box-shadow: 0 0 20px rgba(155, 89, 182, 0.4);
    border-color: #af7ac5;
    color: #fff;
}

/* Bar - Emerald Green */
.bar-action {
    border-color: #2ecc71;
    color: #2ecc71;
    box-shadow: inset 0 0 8px rgba(46, 204, 113, 0.1);
}

.bar-action:hover {
    background: #2ecc71;
    box-shadow: 0 0 20px rgba(46, 204, 113, 0.4);
    border-color: #58d68d;
    color: #fff;
}

/* Hookah (Кальян) - Orange */
.hookah-action {
    border-color: #e67e22;
    color: #e67e22;
    box-shadow: inset 0 0 8px rgba(230, 126, 34, 0.1);
}

.hookah-action:hover {
    background: #e67e22;
    box-shadow: 0 0 20px rgba(230, 126, 34, 0.4);
    border-color: #f0a05a;
    color: #fff;
}

/* Rebuy x2 - Neon Cyan */
.rebuy2-action {
    border-color: #1fc8db;
    color: #1fc8db;
    box-shadow: inset 0 0 8px rgba(31, 200, 219, 0.1);
}

.rebuy2-action:hover {
    background: #1fc8db;
    box-shadow: 0 0 20px rgba(31, 200, 219, 0.4);
    border-color: #6ee0ee;
    color: #002b30;
}

/* Re-entry - Neon Pink */
.reentry-action,
.reentry2-action {   /* v724: RNTRY x2 — тот же розовый, что и RNTRY */
    border-color: #ff5fa2;
    color: #ff5fa2;
    box-shadow: inset 0 0 8px rgba(255, 95, 162, 0.1);
}

.reentry-action:hover,
.reentry2-action:hover {
    background: #ff5fa2;
    box-shadow: 0 0 20px rgba(255, 95, 162, 0.4);
    border-color: #ff9bc4;
    color: #fff;
}

.badge-tips {
    background: #9b59b6;
    color: #fff;
}

.badge-hookah {
    background: #e67e22;
    color: #fff;
}

/* Lit button states when clicked or active */
.btn-ra.active-lit-gold {
    background: #fecb00 !important;
    box-shadow: 0 0 25px rgba(254, 203, 0, 0.6) !important;
    border-color: #fff700 !important;
    color: #000 !important;
    transform: translateY(-2px) !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}
.btn-ra.active-lit-green {
    background: #2ecc71 !important;
    box-shadow: 0 0 25px rgba(46, 204, 113, 0.6) !important;
    border-color: #58d68d !important;
    color: #fff !important;
    transform: translateY(-2px) !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}
.btn-ra.active-lit-red {
    background: #ff4444 !important;
    box-shadow: 0 0 25px rgba(255, 68, 68, 0.6) !important;
    border-color: #ff8888 !important;
    color: #fff !important;
    transform: translateY(-2px) !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}
.btn-ra.active-lit-orange {
    background: #e67e22 !important;
    box-shadow: 0 0 25px rgba(230, 126, 34, 0.6) !important;
    border-color: #f0a05a !important;
    color: #fff !important;
    transform: translateY(-2px) !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

/* Player Out Styling */
.player-out {
    opacity: 0.55;
    filter: grayscale(0.7);
    transition: all 0.5s ease;
    background: rgba(255, 255, 255, 0.01);
}

.player-out .btn-ra {
    pointer-events: none;
    border-color: #555;
    color: #666;
}

.player-out .out-action {
    pointer-events: auto; /* Allow undo */
    opacity: 1;
    filter: none;
}

.delete-player-btn {
    background: none;
    border: none;
    color: #ff4444;
    font-size: 1.5rem;
    cursor: pointer;
    line-height: 1;
    padding: 0 10px;
    transition: transform 0.2s, color 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.delete-player-btn:hover {
    color: #ff0000;
    transform: scale(1.2);
}

.waiting-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(5, auto); /* Max 5 items per column */
    grid-auto-flow: column; /* Fill columns first */
    gap: 0 40px;
    padding-left: 25px;
    color: #ccc;
}

.waiting-list li {
    padding: 5px 0;
    border-bottom: 1px solid #222;
}

.waiting-list li::marker {
    color: var(--gold);
    font-weight: bold;
}

/* v638: меню выезжает ПОВЕРХ контента (не сдвигаем весь #main-content —
   сдвиг тяжёлой страницы с SVG-кругом и свечениями давал рывок при выезде меню). */
.content-shifted {
    transform: none;
}

.app-background {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: radial-gradient(circle at center, #062b16 0%, #02140a 100%);
}

.light-rays {
    display: none !important;
}

.bwin-panel {
    z-index: 2;
    width: 98%;
    max-width: 1250px;
    background: var(--panel-bg);
    border-radius: 15px;
    border: 1px solid #333;
    padding: 40px 50px;
    box-shadow: 0 30px 80px rgba(0,0,0,0.9), inset 0 2px 10px rgba(255,255,255,0.05);
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* 3-Column Base Grid for all rows */
.grid-row {
    display: grid;
    grid-template-columns: 1fr 340px 1fr;
    width: 100%;
    align-items: flex-start;
}

/* Top Row */
.top-row {
    margin-bottom: 40px;
}

.top-item {
    display: flex;
    flex-direction: column;
}

.top-item:nth-child(1) { align-items: flex-start; }
.top-item:nth-child(2) { align-items: center; }
.top-item:nth-child(3) { align-items: flex-end; }

.top-item .label {
    font-size: 0.85rem;
    color: var(--grey-text);
    margin-bottom: 5px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}

.top-item .value {
    color: var(--gold);
    font-size: 1.8rem;
    text-shadow: 0 0 12px var(--gold-glow);
    font-variant-numeric: tabular-nums;
}

.level-item .value {
    font-size: 1.8rem;
    font-weight: 700;
}

/* Main Timer Row */
.main-timer-row {
    margin-bottom: 30px;
    align-items: flex-start !important;
    padding-top: 55px !important; /* админ-вид: как было (правка подъёма колонок — только для ТВ/фуллскрина) */
    box-sizing: border-box !important;
}

.stats-side-container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

.blinds-container {
    display: flex;
    flex-direction: column;
    align-items: flex-end; /* Aligns right edge with Top Row's right edge */
}

.circular-progress {
    width: 442px;
    height: 442px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}



.progress-ring {
    position: absolute;
    top: 0;
    left: 0;
    transform: rotate(-90deg) scaleY(-1);
}

.progress-ring__circle {
    transition: stroke-dashoffset 1s linear;
    filter: drop-shadow(0 0 12px rgba(254, 203, 0, 0.7));
}

.timer-large {
    font-size: 5.85rem;
    color: var(--gold);
    text-shadow: 0 0 20px var(--gold-glow);
    line-height: 1;
    z-index: 2;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    width: 100%;
    align-items: center;
}

.t-part { 
    font-variant-numeric: tabular-nums; 
    letter-spacing: 0;
}
.t-min { text-align: right; }
.t-sec { text-align: left; }
.t-sep { 
    display: flex;
    justify-content: center;
    width: 26px;
    text-align: center;
}

/* Controls Grid - Specifically tight center */
.center-container {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.timer-controls-row {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px; /* v645: было 20px — 6 круглых кнопок теперь влезают в центральную колонку без сжатия */
    margin-top: -15px !important; /* raised closer to the progress ring */
    width: 100%;
    flex-wrap: nowrap;
}

.ctrl-center { display: flex; justify-content: center; }

.control-btn {
    background: rgba(254, 203, 0, 0.05);
    border: 2px solid var(--gold);
    color: var(--gold);
    width: 48px;
    height: 48px;
    flex: 0 0 48px; /* v645: НЕ сжимать -> кнопки остаются идеально круглыми (а не овальными) */
    box-sizing: border-box;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    box-shadow: 0 0 10px rgba(254, 203, 0, 0.2);
}

.control-btn:hover {
    background: var(--gold);
    color: #000;
    box-shadow: 0 0 20px var(--gold-glow);
    transform: translateY(-2px);
}

.play-btn {
    box-shadow: 0 0 20px var(--gold-glow);
}

.play-btn:hover {
    box-shadow: 0 0 30px var(--gold-glow);
}


.timer-jump {
    font-family: 'Outfit', sans-serif;
}

.control-btn svg {
    width: 22px;
    height: 22px;
}

.play-btn svg {
    width: 30px;
    height: 30px;
}

/* Seating & Waiting Unified 3-Column Layout */
.seating-dashboard-layout {
    display: grid !important;
    grid-template-columns: 3fr 3fr 2fr !important;
    gap: 20px !important;
    width: 100% !important;
    max-width: 1280px !important;
    margin: 0 auto !important;
    box-sizing: border-box;
}

.seating-column {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

.seating-column .waiting-card {
    height: 100% !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
}

.seating-column .waiting-card .table-seats {
    flex-grow: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
}

.table-card {
    background: rgba(255, 255, 255, 0.02) !important;
    border: 1px solid rgba(254, 203, 0, 0.1) !important;
    border-radius: 12px !important;
    width: 100% !important;
    padding: 15px !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5) !important;
    transition: transform 0.3s !important;
}

.seating-card {
    min-height: auto !important;
}

.waiting-card {
    min-height: 500px !important;
}

.table-card:hover {
    transform: translateY(-5px) !important;
    border-color: rgba(254, 203, 0, 0.5) !important;
}

.table-title {
    color: var(--gold) !important;
    font-size: 1.1rem !important;
    font-weight: 800 !important;
    text-align: center !important;
    margin-bottom: 15px !important;
    padding-bottom: 10px !important;
    border-bottom: 1px solid rgba(255,255,255,0.05) !important;
}

.table-seats {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}

.seat-item {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 6px 12px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-radius: 8px !important;
    font-size: 0.9rem !important;
    transition: background 0.2s;
}

.seat-item:hover {
    background: rgba(255, 255, 255, 0.08) !important;
}

.seat-num {
    color: var(--gold) !important;
    font-weight: 800 !important;
    min-width: 25px !important;
}

.seat-name {
    color: #eee !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.hidden {
    display: none !important;
}

/* Custom Modal Styles */
.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.85);
    backdrop-filter: blur(8px);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2000; /* Above sidebar */
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

.modal-overlay.show {
    opacity: 1;
    pointer-events: auto;
}

.modal-content {
    background: var(--panel-bg);
    border: 1px solid var(--gold);
    border-radius: 20px;
    padding: 40px;
    max-width: 500px;
    width: 90%;
    max-height: 90vh;
    overflow-y: auto;
    text-align: center;
    box-shadow: 0 0 50px rgba(254, 203, 0, 0.3), inset 0 0 20px rgba(0,0,0,0.5);
    transform: scale(0.9);
    transition: transform 0.2s ease-out;
    position: relative;
}

/* Custom Scrollbar for Modal */
.modal-content::-webkit-scrollbar {
    width: 6px;
}
.modal-content::-webkit-scrollbar-track {
    background: rgba(255,255,255,0.05);
    border-radius: 10px;
}
.modal-content::-webkit-scrollbar-thumb {
    background: var(--gold);
    border-radius: 10px;
    box-shadow: 0 0 10px var(--gold-glow);
}

.modal-overlay.show .modal-content {
    transform: scale(1);
}

.modal-content h2 {
    color: var(--gold);
    margin-bottom: 20px;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-size: 1.5rem;
    text-shadow: 0 0 15px var(--gold-glow);
}

.modal-content p {
    color: #eee;
    margin-bottom: 35px;
    font-size: 1.15rem;
    line-height: 1.6;
    font-weight: 500;
}

.modal-actions {
    display: flex;
    gap: 20px;
    justify-content: center;
}

.modal-btn {
    padding: 14px 40px;
    border-radius: 10px;
    font-weight: 900;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border: none;
    font-size: 0.9rem;
    letter-spacing: 1px;
}

.modal-btn.confirm {
    background: linear-gradient(135deg, var(--gold) 0%, #b8860b 100%);
    color: #000;
    box-shadow: 0 10px 20px rgba(254, 203, 0, 0.2);
}

.modal-btn.confirm:hover {
    box-shadow: 0 0 25px var(--gold-glow);
    transform: translateY(-3px);
    filter: brightness(1.1);
}

.modal-btn.cancel {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid #444;
    color: #aaa;
}

.modal-btn.cancel:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    border-color: #888;
}

/* Bottom Boxes */
.bottom-boxes {
    display: flex;
    gap: 30px;
    justify-content: center;
    width: 100%;
}

.info-box {
    width: 300px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid #333;
    border-radius: 8px;
    color: #fff;
    box-shadow: 0 10px 25px rgba(0,0,0,0.4);
    overflow: hidden;
}

.box-header {
    font-weight: 900;
    font-size: 0.9rem;
    padding: 10px 15px;
    background: rgba(254, 203, 0, 0.1);
    color: var(--gold);
    text-transform: uppercase;
    letter-spacing: 1px;
    border-bottom: 1px solid #333;
}

.box-content {
    padding: 15px;
}

.box-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    font-size: 0.95rem;
    font-weight: 600;
}

.row-label {
    color: rgba(255,255,255,0.6);
}

.row-value {
    color: var(--gold);
    font-family: 'Outfit', sans-serif;
    font-weight: 800;
}

.box-row:last-child {
    margin-bottom: 0;
}

.day-check {
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
}

.day-check input {
    display: none;
}

.day-check span {
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,0.05);
    border: 1px solid #333;
    border-radius: 8px;
    font-size: 0.75rem;
    font-weight: 800;
    color: #666;
    transition: all 0.2s;
}

.day-check input:checked + span {
    background: var(--gold);
    color: #000;
    border-color: var(--gold);
    box-shadow: 0 0 10px var(--gold-glow);
}

.styled-select {
    appearance: none;
    background-image: url('data:image/svg+xml;charset=US-ASCII,<svg xmlns=%22http://www.w3.org/2000/svg%22 width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23fecb00%22 stroke-width=%222%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22><polyline points=%226 9 12 15 18 9%22></polyline></svg>');
    background-repeat: no-repeat;
    background-position: right 15px center;
    background-size: 16px;
    padding-right: 40px;
    background-color: rgba(0,0,0,0.3) !important;
    color: #fff !important;
    border: 1px solid #333 !important;
    cursor: pointer;
}

.styled-select option {
    background-color: #111;
    color: #fff;
    padding: 10px;
}

.tournament-title-header {
    text-align: center;
    font-family: 'Inter', sans-serif;
    font-weight: 900;
    font-size: 2.2rem;
    color: var(--gold);
    text-transform: uppercase;
    letter-spacing: 4px;
    margin-bottom: 25px;
    text-shadow: 0 0 15px rgba(254, 203, 0, 0.4);
    border-bottom: 1px solid rgba(254, 203, 0, 0.1);
    padding-bottom: 15px;
}

.game-header-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding: 0 10px;
}

/* TV Compact mode */
.bwin-panel {
    padding: 20px !important;
}

.circular-progress {
    transform: scale(0.9);
    margin: -20px 0 !important;
}

.controls-grid {
    margin-top: 10px !important;
    gap: 15px !important;
}

.main-timer-row {
    margin-bottom: 0 !important;
}

.fullscreen-btn {
    position: absolute;
    right: 20px;
    bottom: 20px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid #444;
    color: #666;
    padding: 8px;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fullscreen-btn:hover {
    background: rgba(254, 203, 0, 0.1);
    color: var(--gold);
    border-color: var(--gold);
    box-shadow: 0 0 15px rgba(254, 203, 0, 0.2);
}

.break-overlay {
    position: absolute;
    top: -40px;
    left: 50%;
    transform: translateX(-50%);
    color: #ff3b30;
    font-size: 2.5rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 5px;
    text-shadow: 0 0 20px rgba(255, 59, 48, 0.6);
    animation: pulseBreak 2s infinite ease-in-out;
    z-index: 10;
    white-space: nowrap;
}

@keyframes pulseBreak {
    0%, 100% { opacity: 0.8; transform: translateX(-50%) scale(1); }
    50% { opacity: 1; transform: translateX(-50%) scale(1.05); }
}

.add-btn-premium {
    background: linear-gradient(135deg, var(--gold) 0%, #b8860b 100%);
    color: #000;
    border: none;
    padding: 10px 20px;
    border-radius: 8px;
    font-weight: 800;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 0.85rem;
    box-shadow: 0 0 10px rgba(254, 203, 0, 0.2);
}

.add-btn-premium:hover {
    background: var(--gold);
    box-shadow: 0 0 25px var(--gold-glow);
    transform: translateY(-2px);
}

.clear-btn-premium {
    background: rgba(255, 255, 255, 0.05);
    border: 2px solid #444;
    color: #888;
    padding: 10px 20px;
    border-radius: 8px;
    font-weight: 800;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 0.85rem;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

.clear-btn-premium:hover {
    background: #555;
    color: #fff;
    box-shadow: 0 0 20px rgba(255, 255, 255, 0.1);
    transform: translateY(-2px);
    border-color: #777;
}

/* Fullscreen Mode - Universal Proportional Scaling (Cinema Perfect) */
.bwin-panel.fullscreen-active {
    width: 100vw !important;
    height: 100vh !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: radial-gradient(circle at center, #062b16 0%, #02140a 100%) !important;
    border: none !important;
    border-radius: 0 !important;
    
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
}

/* Keep fullscreen button and TV pin button visible in fullscreen mode */
.bwin-panel.fullscreen-active .fullscreen-btn {
    display: flex !important;
}

.bwin-panel.fullscreen-active #btn-fullscreen {
    right: 20px !important;
}

.bwin-panel.fullscreen-active #btn-tv-pin-game {
    right: 60px !important;
}

/* Fullscreen Wrapper for Game page */
.game-fullscreen-wrapper {
    width: 100% !important;
    margin: 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    transition: transform 0.3s ease;
    box-sizing: border-box;
}

/* In fullscreen mode, lock the base logical dimensions to exactly 1260px width and 738px height.
   This guarantees that the Cinema perfect scaling works with 100% accuracy on any TV! */
.bwin-panel.fullscreen-active .game-fullscreen-wrapper {
    position: absolute !important;
    width: 1260px !important;
    height: 738px !important;
    max-width: none !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    transform-origin: 0 0 !important;
    -webkit-transform-origin: 0 0 !important;
}

/* Header styling inside fullscreen */
.bwin-panel.fullscreen-active #active-tournament-name {
    margin: 0 0 20px 0 !important;
    text-align: center !important;
    width: 100% !important;
}

/* Main timer grid inside fullscreen */
.bwin-panel.fullscreen-active .main-timer-row {
    display: grid !important;
    grid-template-columns: 315px 1fr 315px !important;
    gap: 30px !important;
    align-items: flex-start !important;
    
    width: 1260px !important; /* Lock base logical width */
    height: 644px !important; /* Lock base logical height */
    margin: 60px auto 0 auto !important;
    padding: 0 !important;
    
    flex-shrink: 0 !important;
}

/* Center container offset to fill bottom space in fullscreen - raised by ~70px (approx 10% of height) */
.bwin-panel.fullscreen-active .center-container {
    margin-top: -10px !important;
}

/* v643: узкий экран/портрет планшета — лочим ландшафтную раскладку (1260px) и масштабируем ВСЮ обёртку
   целиком (как во фуллскрине), чтобы 3-колоночный грид не рассыпался и правые панели не уезжали за экран.
   Класс game-narrow-fit вешает JS (adjustFullscreenScale) когда ширина панели < ~1000px. */
.bwin-panel.game-narrow-fit {
    position: relative !important;
    overflow: hidden !important;
}
.bwin-panel.game-narrow-fit .game-fullscreen-wrapper {
    position: absolute !important;
    width: 1260px !important;
    max-width: none !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    transform-origin: 0 0 !important;
    -webkit-transform-origin: 0 0 !important;
    transition: none !important;
}
.bwin-panel.game-narrow-fit .main-timer-row {
    grid-template-columns: 1fr 340px 1fr !important;
    width: 1260px !important;
    flex-shrink: 0 !important;
}




/* End of file */

#game-prizes {
    font-family: var(--font-nums);
    font-weight: 700;
    font-size: 1rem;
    color: var(--gold);
    text-align: left;
    white-space: pre-line;
    min-height: 50px;
    letter-spacing: 0.5px;
}

/* --- CUSTOM DROPDOWN --- */
.custom-dropdown {
    position: absolute;
    top: calc(100% + 5px);
    left: 0;
    right: 0;
    background: #111;
    border: 1px solid var(--gold);
    border-radius: 8px;
    z-index: 1000;
    max-height: 200px;
    overflow-y: auto;
    box-shadow: 0 10px 30px rgba(0,0,0,0.8);
    scrollbar-width: thin;
    scrollbar-color: var(--gold) #111;
}

.custom-dropdown.hidden {
    display: none;
}

.dropdown-item {
    padding: 12px 15px;
    color: #eee;
    cursor: pointer;
    transition: all 0.2s;
    font-size: 0.9rem;
    border-bottom: 1px solid #222;
}

.dropdown-item:last-child {
    border-bottom: none;
}

.dropdown-item:hover {
    background: var(--gold);
    color: #000;
    font-weight: 700;
}

.custom-dropdown::-webkit-scrollbar {
    width: 6px;
}

.custom-dropdown::-webkit-scrollbar-thumb {
    background: var(--gold);
    border-radius: 3px;
}

.comment-mirror-card {
    border-color: rgba(0, 136, 204, 0.3) !important;
    background: rgba(0, 136, 204, 0.05) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}

/* --- COMMENTS IN REGISTRATION --- */
.comments-list-section {
    margin: 20px 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
    max-width: 900px;
}

.comment-item {
    background: rgba(254, 203, 0, 0.05);
    border: 1px solid rgba(254, 203, 0, 0.2);
    border-radius: 8px;
    padding: 12px 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    animation: fadeIn 0.3s ease;
}

.comment-text {
    color: #fff;
    font-size: 0.95rem;
    line-height: 1.4;
}

.btn-delete-comment {
    background: transparent;
    border: none;
    color: #ff4444;
    font-size: 1.2rem;
    cursor: pointer;
    padding: 0 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s;
}

.btn-delete-comment:hover {
    transform: scale(1.2);
    color: #ff6666;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
}

/* --- GALLERY SECTION --- */
.gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 25px;
    margin-top: 30px;
}

.gallery-item {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    aspect-ratio: 16/9;
    background: #1a1a1a;
    border: 1px solid #333;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    cursor: pointer;
}

.gallery-item:hover {
    transform: scale(1.03);
    box-shadow: 0 10px 30px rgba(0,0,0,0.5), 0 0 15px var(--gold-glow);
    border-color: var(--gold);
}

.gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: filter 0.3s ease;
}

.gallery-item:hover img {
    filter: brightness(0.7);
}

.gallery-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20px;
    background: linear-gradient(transparent, rgba(0,0,0,0.9));
    opacity: 0;
    transition: opacity 0.3s ease;
}

.gallery-item:hover .gallery-overlay {
    opacity: 1;
}

.gallery-overlay span {
    color: var(--gold);
    font-size: 0.9rem;
    font-weight: 700;
}

/* --- TELEGRAM SECTION --- */
.telegram-integration {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 50px 0;
}

.tg-card {
    background: linear-gradient(145deg, #1a1a1a, #0a0a0a);
    border: 1px solid #333;
    border-radius: 20px;
    padding: 40px;
    max-width: 500px;
    text-align: center;
    box-shadow: 0 20px 50px rgba(0,0,0,0.5);
    transition: transform 0.3s ease, border-color 0.3s ease;
}

.tg-card:hover {
    border-color: #0088cc;
    transform: translateY(-5px);
}

.tg-icon {
    width: 80px;
    height: 80px;
    background: #0088cc;
    color: #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 25px;
    box-shadow: 0 0 25px rgba(0, 136, 204, 0.4);
}

.tg-icon svg {
    width: 45px;
    height: 45px;
}

.tg-card h3 {
    font-size: 1.8rem;
    margin-bottom: 15px;
    color: #fff;
}

.tg-card p {
    color: var(--grey-text);
    line-height: 1.6;
    margin-bottom: 30px;
}

.tg-link-btn {
    display: inline-block;
    background: #0088cc;
    color: #fff;
    text-decoration: none;
    padding: 15px 40px;
    border-radius: 30px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: all 0.3s ease;
    box-shadow: 0 10px 20px rgba(0, 136, 204, 0.2);
}

.tg-link-btn:hover {
    background: #00aaff;
    box-shadow: 0 15px 30px rgba(0, 136, 204, 0.4);
    transform: translateY(-2px);
}

/* --- NOTES SECTION --- */
.notes-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
    margin-top: 30px;
}

.note-card {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid #333;
    border-radius: 12px;
    padding: 20px;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.note-card:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: var(--gold);
    transform: translateY(-3px);
}

.note-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.note-title {
    font-weight: 700;
    color: var(--gold);
    font-size: 1.1rem;
    background: transparent;
    border: none;
    outline: none;
    width: 100%;
}

.note-content {
    color: #ccc;
    font-size: 0.95rem;
    line-height: 1.5;
    min-height: 100px;
    background: transparent;
    border: none;
    outline: none;
    width: 100%;
    resize: none;
    font-family: inherit;
}

/* Скрыть скроллбар везде для textarea */
textarea {
    -ms-overflow-style: none;
    scrollbar-width: none;
}
textarea::-webkit-scrollbar {
    display: none;
}

.note-date {
    font-size: 0.8rem;
    color: #bbb;
}

.btn-delete-note {
    background: transparent;
    border: none;
    color: #555;
    cursor: pointer;
    transition: color 0.2s;
    padding: 5px;
}

.btn-delete-note:hover {
    color: #ff4444;
}

.empty-state {
    grid-column: 1 / -1;
    text-align: center;
    padding: 100px 0;
    color: var(--grey-text);
    font-style: italic;
    opacity: 0.5;
}
/* --- LOGIN PAGE --- */
.login-container {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}

.login-box {
    background: linear-gradient(145deg, #1a1a1a 0%, #050505 100%);
    border: 1px solid rgba(254, 203, 0, 0.2);
    border-radius: 24px;
    padding: 40px;
    width: 100%;
    max-width: 420px;
    box-shadow: 0 40px 100px rgba(0,0,0,0.8), 0 0 30px rgba(254, 203, 0, 0.1);
    backdrop-filter: blur(20px);
    text-align: center;
    animation: loginBoxAppear 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes loginBoxAppear {
    from { opacity: 0; transform: translateY(20px) scale(0.95); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.login-header {
    margin-bottom: 35px;
}

.login-logo {
    width: 70px;
    height: 70px;
    background: rgba(254, 203, 0, 0.05);
    border: 1px solid rgba(254, 203, 0, 0.2);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 20px;
    box-shadow: 0 0 20px rgba(254, 203, 0, 0.1);
}

.login-logo svg {
    width: 35px;
    height: 35px;
}

.login-header h2 {
    color: var(--white);
    font-size: 1.8rem;
    margin-bottom: 10px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.login-header p {
    color: var(--grey-text);
    font-size: 0.9rem;
}

.login-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.login-form .input-group {
    text-align: left;
}

.login-form .styled-input {
    width: 100%;
    background: rgba(255,255,255,0.02);
}

.login-btn-premium {
    background: linear-gradient(135deg, var(--gold) 0%, #b8860b 100%);
    color: #000 !important;
    border: none;
    padding: 15px;
    border-radius: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 2px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    margin-top: 10px;
    box-shadow: 0 10px 20px rgba(254, 203, 0, 0.2);
}

.login-btn-premium:hover {
    transform: translateY(-3px);
    box-shadow: 0 15px 30px rgba(254, 203, 0, 0.4);
    filter: brightness(1.1);
}

.login-footer {
    margin-top: 20px;
}

.login-footer a {
    color: var(--grey-text);
    text-decoration: none;
    font-size: 0.85rem;
    transition: color 0.2s;
}

.login-footer a:hover {
    color: var(--gold);
}
/* --- COMMENTS SECTION --- */
.comments-list-section {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.comment-item {
    background: rgba(254, 203, 0, 0.05);
    border: 1px solid rgba(254, 203, 0, 0.1);
    border-radius: 12px;
    padding: 15px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: transform 0.2s, border-color 0.2s;
}

.comment-item:hover {
    border-color: rgba(254, 203, 0, 0.3);
    background: rgba(254, 203, 0, 0.08);
}

.comment-text {
    color: #eee;
    font-size: 0.95rem;
    line-height: 1.5;
    font-weight: 500;
}

.btn-delete-comment {
    background: transparent;
    border: none;
    color: #ff4444;
    font-size: 1.4rem;
    cursor: pointer;
    opacity: 0.5;
    transition: opacity 0.2s, transform 0.2s;
    line-height: 1;
    padding: 5px;
}

.btn-delete-comment:hover {
    opacity: 1;
    transform: scale(1.2);
}

/* OUT MODAL PREMIUM STYLES */
.modal-header-premium {
    text-align: center;
    margin-bottom: 25px;
    padding-bottom: 15px;
    border-bottom: 1px solid rgba(254, 203, 0, 0.2);
}

.modal-subtitle {
    color: var(--grey-text);
    font-size: 0.9rem;
    margin-top: 5px;
}

.out-calculation-section {
    background: rgba(0, 0, 0, 0.3);
    padding: 20px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.05);
    margin-bottom: 25px;
}

.calc-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
    font-size: 0.95rem;
    color: #ccc;
}

.calc-divider {
    height: 1px;
    background: rgba(255, 255, 255, 0.1);
    margin: 15px 0;
}

.total-row {
    font-weight: 900;
    font-size: 1.2rem;
    color: #fff;
    margin-bottom: 0;
}

.gold-text {
    color: var(--gold);
    text-shadow: 0 0 10px rgba(254, 203, 0, 0.3);
}

.section-subtitle {
    font-size: 0.85rem;
    text-transform: uppercase;
    color: var(--gold);
    letter-spacing: 1px;
    margin-bottom: 12px;
    opacity: 0.8;
}

.prizes-grid, .earn-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 25px;
}

.bonus-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    padding: 10px 15px;
    border-radius: 12px;
    transition: all 0.3s ease;
}

.bonus-row:hover {
    border-color: rgba(254, 203, 0, 0.3);
    background: rgba(254, 203, 0, 0.05);
}

.bonus-label {
    font-size: 0.9rem;
    color: #eee;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 6px;
}

.bonus-label span {
    color: var(--gold);
    font-weight: 900;
}

.bonus-label span.bonus-remaining {
    color: #888;
    font-size: 0.8rem;
    font-weight: normal;
    white-space: nowrap;
}

.bonus-controls {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #000;
    border-radius: 8px;
    padding: 2px;
    border: 1px solid #333;
}

.bonus-btn {
    width: 32px;
    height: 32px;
    border-radius: 6px;
    border: none;
    background: rgba(255, 255, 255, 0.05);
    color: var(--gold);
    font-size: 1.2rem;
    font-weight: 900;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
}

.bonus-btn:hover {
    background: var(--gold);
    color: #000;
}

.bonus-input {
    width: 40px;
    background: transparent;
    border: none;
    color: #fff;
    text-align: center;
    font-family: var(--font-nums);
    font-weight: 700;
    font-size: 1rem;
    outline: none;
}

.earn-prize-btn {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #fff;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 0.75rem;
    cursor: pointer;
    transition: all 0.2s;
}

.earn-prize-btn:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: #666;
}

.earn-prize-btn.active {
    background: #27ae60;
    border-color: #2ecc71;
}

.earned-prizes-tags {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    min-height: 20px;
}

.prize-tag {
    background: rgba(39, 174, 96, 0.2);
    color: #2ecc71;
    border: 1px solid rgba(39, 174, 96, 0.4);
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.7rem;
    display: flex;
    align-items: center;
    gap: 5px;
}

.prize-tag .remove-prize {
    cursor: pointer;
    font-weight: 900;
    font-size: 0.9rem;
}

.prize-tag .remove-prize:hover {
    color: #fff;
}

/* PLAYERS PAGE STYLES */
.players-grid-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 20px;
    margin-top: 30px;
}

.player-db-card {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 16px;
    padding: 20px;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    gap: 15px;
    position: relative;
    overflow: hidden;
}

.player-db-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg, var(--gold), transparent);
}

.player-db-card:hover {
    transform: translateY(-5px);
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(254, 203, 0, 0.3);
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}

.player-db-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.player-db-id {
    font-family: var(--font-nums);
    font-weight: 900;
    color: var(--gold);
    font-size: 1.2rem;
    background: rgba(254, 203, 0, 0.1);
    padding: 2px 10px;
    border-radius: 6px;
}

.player-db-name {
    font-size: 1.1rem;
    font-weight: 700;
    color: #fff;
    margin-top: 5px;
}

.player-db-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.stat-box {
    background: rgba(0,0,0,0.2);
    padding: 10px;
    border-radius: 8px;
    text-align: center;
}

.stat-value {
    display: block;
    font-family: var(--font-nums);
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--gold);
}

.stat-label {
    font-size: 0.65rem;
    text-transform: uppercase;
    color: var(--grey-text);
    letter-spacing: 1px;
}

.player-db-section-title {
    font-size: 0.75rem;
    text-transform: uppercase;
    color: var(--gold);
    letter-spacing: 1px;
    opacity: 0.7;
    margin-bottom: 8px;
}

.player-db-history {
    max-height: 150px;
    overflow-y: auto;
    padding-right: 5px;
}

.history-item {
    display: grid;
    grid-template-columns: 80px 1fr 100px;
    align-items: center;
    font-size: 0.8rem;
    padding: 10px 0;
    border-bottom: 1px solid rgba(255,255,255,0.03);
    gap: 15px;
}

.history-date { 
    color: #888; 
    font-family: var(--font-nums);
}

.history-name { 
    color: #ccc; 
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.history-place {
    font-weight: 700;
    text-align: right;
}

.history-place.top-rank {
    color: var(--gold);
}

.history-place.other-rank {
    color: #666;
    font-weight: 400;
}

.player-db-history {
    max-height: 250px;
    overflow-y: auto;
    padding-right: 10px;
    scroll-behavior: auto;
}

.player-db-history::-webkit-scrollbar {
    width: 6px;
}
.player-db-history::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.02);
    border-radius: 10px;
}
.player-db-history::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--gold), #b38f00);
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(254, 203, 0, 0.3);
}
.player-db-history::-webkit-scrollbar-thumb:hover {
    background: #fecb00;
}

.player-db-prizes {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.player-prize-tag {
    background: rgba(254, 203, 0, 0.1);
    border: 1px solid rgba(254, 203, 0, 0.2);
    color: var(--gold);
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.7rem;
}

.player-db-history::-webkit-scrollbar {
    width: 4px;
}
.player-db-history::-webkit-scrollbar-thumb {
    background: rgba(254, 203, 0, 0.2);
    border-radius: 2px;
}
.player-db-history::-webkit-scrollbar-track {
    background: transparent;
}

/* INTERACTIVE TABLE ROWS */
.clickable-row {
    transition: background-color 0.2s;
}

.clickable-row:hover {
    background-color: rgba(255, 255, 255, 0.05) !important;
}

.clickable-row:hover td {
    color: #fff !important;
}

.global-players-section .players-table td {
    padding: 15px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03);
    vertical-align: middle;
}

.delete-player-btn {
    background: transparent;
    border: none;
    color: #ff4444;
    font-size: 1.4rem;
    font-weight: 900;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    transition: transform 0.2s, color 0.2s;
}

.delete-player-btn:hover {
    color: #ff6666;
    transform: scale(1.2);
}

#btn-close-details-x:hover {
    color: var(--gold) !important;
    transform: scale(1.1);
}

/* Стили аватарки */
.player-avatar-container {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    border: 2px solid var(--gold);
    background: rgba(0,0,0,0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    overflow: hidden;
    position: relative;
    box-shadow: 0 0 15px rgba(254, 203, 0, 0.2);
    transition: all 0.3s ease;
    flex-shrink: 0;
}

.player-avatar-container:hover {
    box-shadow: 0 0 25px rgba(254, 203, 0, 0.4);
    border-color: #fff;
}

.player-avatar-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.avatar-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

/* TOUR DETAILS MODAL STYLING */
.tournament-status-badge {
    text-transform: uppercase;
    letter-spacing: 1px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}
.status-planned {
    background: rgba(254, 203, 0, 0.1) !important;
    color: var(--gold) !important;
    border: 1px solid rgba(254, 203, 0, 0.3) !important;
}
.status-active {
    background: rgba(39, 174, 96, 0.1) !important;
    color: #27ae60 !important;
    border: 1px solid rgba(39, 174, 96, 0.3) !important;
}
.status-completed {
    background: rgba(231, 76, 60, 0.1) !important;
    color: #e74c3c !important;
    border: 1px solid rgba(231, 76, 60, 0.3) !important;
}

.tour-details-grid .detail-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.tour-details-grid .detail-label {
    font-size: 0.75rem;
    color: var(--grey-text);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.tour-details-grid .detail-value {
    font-weight: 700;
    color: #fff;
    font-size: 0.95rem;
}

.rank-badge {
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 85px;
    text-align: center;
    box-shadow: 0 2px 4px rgba(0,0,0,0.3);
}

.rank-1 {
    background: linear-gradient(135deg, #ffd700 0%, #b8860b 100%) !important;
    color: #000 !important;
    box-shadow: 0 0 10px rgba(255, 215, 0, 0.4) !important;
}

.rank-2 {
    background: linear-gradient(135deg, #c0c0c0 0%, #708090 100%) !important;
    color: #000 !important;
    box-shadow: 0 0 8px rgba(192, 192, 192, 0.3) !important;
}

.rank-3 {
    background: linear-gradient(135deg, #cd7f32 0%, #8b4513 100%) !important;
    color: #fff !important;
    box-shadow: 0 0 8px rgba(205, 127, 50, 0.3) !important;
}

.rank-other {
    background: rgba(255,255,255,0.05) !important;
    color: #ccc !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
}

.rank-in-game {
    background: rgba(39, 174, 96, 0.15) !important;
    color: #2ecc71 !important;
    border: 1px solid rgba(39, 174, 96, 0.4) !important;
    box-shadow: 0 0 8px rgba(46, 204, 113, 0.2) !important;
}

/* РУКА ДНЯ - СТИЛИ КАРТ */
.poker-cards-display {
    display: flex;
    gap: 6px;
    margin-bottom: 8px;
    flex-wrap: wrap;
}

.mini-card {
    width: 42px;
    height: 60px;
    background:
        radial-gradient(130% 90% at 50% -8%, rgba(150,190,210,0.10), transparent 55%),
        linear-gradient(158deg, #333b42 0%, #141a1f 52%, #0a0e11 100%); /* оникс / графит (холодный тёмный) */
    border-radius: 6px;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 2px;
    padding: 4px 6px;
    font-family: 'Cinzel', serif;
    font-weight: 700;
    box-shadow: 0 4px 10px rgba(0,0,0,0.5), 0 0 8px rgba(226,190,120,0.22), inset 0 1px 0 rgba(255,255,255,0.08), inset 0 0 18px rgba(0,0,0,0.4);
    border: 1px solid rgba(226, 190, 120, 0.55); /* антично-золотая рамка */
    margin-right: 6px;
    transition: transform 0.2s, box-shadow 0.2s;
    user-select: none;
    position: relative;
    box-sizing: border-box;
}

.mini-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 12px rgba(0,0,0,0.5);
}

/* Номинал всегда золотой; масть — свой цвет (осветлён под тёмный фон) */
.mini-card.suit-spades .card-suit, .selectable-card.suit-spades .card-suit {
    color: #eef1f4; text-shadow: 0 0 8px rgba(255,255,255,0.25); /* пики — серебро */
}
.mini-card.suit-hearts .card-suit, .selectable-card.suit-hearts .card-suit {
    color: #ff5566; text-shadow: 0 0 8px rgba(255,50,70,0.30); /* черви — красный */
}
.mini-card.suit-diamonds .card-suit, .selectable-card.suit-diamonds .card-suit {
    color: #ffab45; text-shadow: 0 0 8px rgba(255,150,40,0.30); /* бубны — янтарь */
}
.mini-card.suit-clubs .card-suit, .selectable-card.suit-clubs .card-suit {
    color: #59a8e6; text-shadow: 0 0 8px rgba(60,150,230,0.30); /* трефы — голубой */
}

.mini-card .card-rank {
    font-size: 1.17rem;
    line-height: 0.9;
    font-weight: 700;
    color: #fecb00; /* золотой номинал */
    text-shadow: 0 0 10px rgba(254,203,0,0.35);
    position: static;
}

.mini-card .card-suit {
    font-size: 1.15rem; /* масть */
    line-height: 0.9;
    position: static;
}

/* Золотая линия-разделитель между номиналом и мастью */
.card-rule {
    display: none !important; /* убрана золотая черта между номиналом и мастью */
    width: 16px;
    height: 2px;
    background: #fecb00;
    opacity: 0.8;
    border-radius: 2px;
    box-shadow: 0 0 5px rgba(254,203,0,0.5);
    flex: 0 0 auto;
}

/* SVG-масти (премиальные, вместо системных глифов) */
/* Номинал приподнят на 5% над чертой, масть опущена на 5% под неё */
.card-rank {
    position: relative !important;
    top: -5% !important;
}
.card-suit {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative !important;
    top: 5% !important;
}
.card-suit svg {
    width: 0.92em;
    height: 0.92em;
    display: block;
    filter: drop-shadow(0 1px 1.5px rgba(0,0,0,0.55));
}

/* СЕТКА ДЛЯ СЕЛЕКТОРА КАРТ */
.deck-grid-row {
    display: flex;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.selectable-card {
    width: 46px;
    height: 64px;
    background:
        radial-gradient(130% 90% at 50% -8%, rgba(150,190,210,0.10), transparent 55%),
        linear-gradient(158deg, #333b42 0%, #141a1f 52%, #0a0e11 100%); /* оникс / графит (холодный тёмный) */
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 2px;
    padding: 4px 6px;
    font-family: 'Cinzel', serif;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(0,0,0,0.5), 0 0 8px rgba(226,190,120,0.22), inset 0 1px 0 rgba(255,255,255,0.08), inset 0 0 18px rgba(0,0,0,0.4);
    border: 1px solid rgba(226, 190, 120, 0.55); /* антично-золотая рамка */
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    user-select: none;
    position: relative;
    box-sizing: border-box;
}

.selectable-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 16px rgba(0,0,0,0.5);
}

.selectable-card.selected {
    border: 2px solid #fecb00 !important; /* золотая подсветка выбора */
    box-shadow: 0 0 16px rgba(254, 203, 0, 0.55) !important;
    transform: translateY(-4px) scale(1.05) !important;
    background:
        radial-gradient(130% 90% at 50% -8%, rgba(255,225,170,0.22), transparent 60%),
        linear-gradient(158deg, #454e56 0%, #141a1f 100%) !important;
}

.selectable-card .card-rank {
    font-size: 1.25rem;
    line-height: 0.9;
    font-weight: 700;
    color: #fecb00; /* золотой номинал */
    text-shadow: 0 0 10px rgba(254,203,0,0.35);
    position: static;
}

.selectable-card .card-suit {
    font-size: 1.22rem; /* масть */
    line-height: 0.9;
    position: static;
}

.selectable-card .card-rule {
    width: 18px;
}

/* Compact styling for the game page sidebar to prevent overflow */
.stats-side-container {
    gap: 6px !important;
}

.stats-side-container .info-box {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.stats-side-container .info-box .box-header {
    padding: 6px 12px !important;
    font-size: 0.97rem !important;
}

.stats-side-container .info-box .box-content {
    padding: 6px 12px !important;
}

.stats-side-container .info-box .box-row {
    margin-bottom: 4px !important;
    font-size: 1.03rem !important;
}

.stats-side-container .break-info-box .box-content {
    padding: 6px 0 !important;
}

.stats-side-container #break-display {
    font-size: 2.18rem !important;
}

/* Stacked cards and comment layout for Hand of the Day */
.hand-day-item-stacked {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.hand-day-item-stacked:not(:last-child) {
    margin-bottom: 8px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    padding-bottom: 8px !important;
}

.hand-day-item-stacked .hand-day-title {
    color: var(--gold);
    font-size: 0.8rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 2px;
}

.hand-day-cards-row {
    display: flex;
    gap: 5px;
    flex-wrap: nowrap !important; /* Prevent wrapping */
    margin-bottom: 4px;
}

.hand-day-cards-row .mini-card {
    width: 42px;
    height: 60px;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 2px;
    padding: 4px 6px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.5), 0 0 8px rgba(226,190,120,0.22), inset 0 1px 0 rgba(255,255,255,0.08), inset 0 0 18px rgba(0,0,0,0.4);
    border-radius: 6px;
    margin-right: 6px;
}

.hand-day-cards-row .mini-card .card-rank {
    font-size: 1.17rem;
    font-weight: 800;
    line-height: 0.9;
    position: static;
}

.hand-day-cards-row .mini-card .card-suit {
    font-size: 1.15rem; /* масть */
    line-height: 0.9;
    position: static;
}

.hand-day-item-stacked .hand-day-comment {
    font-size: 0.78rem;
    color: #e0e0e0;
    line-height: 1.3;
    white-space: pre-wrap;
    word-break: break-word;
    margin-top: 2px;
}

/* Compact TV Dashboard Styles for Seating & Waiting Lists */
.seating-panel .seat-item {
    padding: 2.2px 8px !important; /* Compact padding for stacked vertical layout */
    gap: 6px !important;
    font-size: 0.78rem !important; /* Elegant 12px font for compact high-density info */
    border-radius: 5px !important;
    background: rgba(255, 255, 255, 0.02) !important;
    border: 1px solid rgba(255, 255, 255, 0.03) !important;
}
.seating-panel .table-seats {
    gap: 3px !important; /* Tight gaps for a perfect fit */
}
.seating-panel .table-card {
    padding: 6px 10px !important; /* Balanced inner spacing */
    border-radius: 8px !important;
}
.seating-panel .table-title {
    margin-bottom: 6px !important;
    padding-bottom: 4px !important;
    font-size: 0.92rem !important;
}
.seating-panel .waiting-card {
    min-height: auto !important; /* Allow it to auto-size dynamically */
}

/* TV Mode Seating Page Font Size Adjustments (+10% size) */
body.tv-mode #seating-tournament-name {
    font-size: 1.45rem !important;
}
body.tv-mode .seating-stats-bar {
    font-size: 0.95rem !important;
}
body.tv-mode .seating-panel .seat-item {
    padding: 3px 8px !important;
    font-size: 0.86rem !important;
}
body.tv-mode .seating-panel .table-title {
    font-size: 1.05rem !important;
}
body.tv-mode .seating-panel .seat-num {
    min-width: 28px !important;
}

/* Fullscreen Wrapper for Seating page */
.seating-fullscreen-wrapper {
    width: 100% !important;
    max-width: 1280px !important; /* Centered, narrow and premium readability on large monitors/TVs */
    margin: 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    transition: transform 0.3s ease;
    box-sizing: border-box;
}

/* In fullscreen mode, lock the base logical dimensions to exactly 1400px width and 720px height.
   This guarantees that the Cinema perfect scaling works with 100% accuracy on any TV! */
.seating-panel.fullscreen-active .seating-fullscreen-wrapper {
    width: 1400px !important;
    height: 720px !important;
    max-width: none !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    padding: 10px 20px !important;
}

.seating-panel.fullscreen-active .seating-dashboard-layout {
    max-width: 1360px !important; /* Fully utilizes the wider logical screen space (1400px - padding) */
}

/* Fullscreen Game Panel Specific Compact Styles to Prevent Overflow */
.bwin-panel.fullscreen-active .stats-side-container,
.bwin-panel.fullscreen-active .blinds-container {
    gap: 22px !important;
    margin-top: -45px !important; /* v640: боковые колонки подняты под потолок (у ряда отступ сверху 60px) */
}

/* Tighten the info boxes inside the sidebar and blinds container in fullscreen */
.bwin-panel.fullscreen-active .stats-side-container .info-box,
.bwin-panel.fullscreen-active .blinds-container .info-box {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.bwin-panel.fullscreen-active .stats-side-container .info-box .box-header,
.bwin-panel.fullscreen-active .blinds-container .info-box .box-header {
    padding: 4px 10px !important;
    font-size: 0.91rem !important;
}

.bwin-panel.fullscreen-active .stats-side-container .info-box .box-content,
.bwin-panel.fullscreen-active .blinds-container .info-box .box-content {
    padding: 4px 10px !important;
}

/* Tighten individual rows */
.bwin-panel.fullscreen-active .stats-side-container .info-box .box-row,
.bwin-panel.fullscreen-active .blinds-container .info-box .box-row {
    margin-bottom: 2px !important;
    font-size: 0.95rem !important;
}

/* Adjust break time display in fullscreen */
.bwin-panel.fullscreen-active .stats-side-container .break-info-box .box-content {
    padding: 4px 0 !important;
}

.bwin-panel.fullscreen-active .stats-side-container #break-display {
    font-size: 1.94rem !important;
}

/* Adjust prizes content styling in fullscreen */
.bwin-panel.fullscreen-active #game-prizes {
    font-size: 0.99rem !important;
    min-height: auto !important;
    line-height: 1.2 !important;
}

/* Hand of the Day container specific styles in fullscreen */
.bwin-panel.fullscreen-active #game-hands-container {
    padding: 4px 10px !important;
}

.bwin-panel.fullscreen-active .hand-day-item-stacked {
    gap: 2px !important;
}

.bwin-panel.fullscreen-active .hand-day-item-stacked:not(:last-child) {
    margin-bottom: 12px !important;
    padding-bottom: 12px !important;
}

.bwin-panel.fullscreen-active .hand-day-item-stacked .hand-day-title {
    font-size: 1.28rem !important;
    margin-bottom: 6px !important;
}

.bwin-panel.fullscreen-active .hand-day-cards-row {
    gap: 4px !important;
    flex-wrap: nowrap !important; /* Prevent wrapping */
    margin-bottom: 4px !important;
}

/* Scale up the mini-cards in Hand of the Day for better visibility on TV screens in fullscreen */
.bwin-panel.fullscreen-active .hand-day-cards-row .mini-card {
    width: 52px !important;
    height: 74px !important;
    padding: 5px 7px !important;
    border-radius: 8px !important;
    box-shadow: 0 6px 14px rgba(0,0,0,0.5), 0 0 10px rgba(254, 203, 0, 0.45) !important; /* Larger gold glow for TV */
    margin-right: 0 !important;
}

.bwin-panel.fullscreen-active .hand-day-cards-row .mini-card .card-rank {
    font-size: 1.45rem !important;
    position: relative !important;
    top: -5% !important;
}

.bwin-panel.fullscreen-active .hand-day-cards-row .mini-card .card-suit {
    font-size: 1.42rem !important; /* масть */
    position: relative !important;
    top: 5% !important;
}

.bwin-panel.fullscreen-active .hand-day-cards-row .mini-card .card-rule {
    width: 22px !important;
}

.bwin-panel.fullscreen-active .hand-day-item-stacked .hand-day-comment {
    font-size: 1.33rem !important;
    line-height: 1.4 !important;
    margin-top: 6px !important;
}

/* Tighten the right column components in fullscreen */
.bwin-panel.fullscreen-active .blinds-container .calendar-nav {
    margin-bottom: 6px !important;
}

.bwin-panel.fullscreen-active .blinds-container .calendar-nav .cal-nav-btn {
    padding: 2px 6px !important;
    font-size: 0.75rem !important;
}

.bwin-panel.fullscreen-active .blinds-container .calendar-nav .registration-date-input {
    font-size: 0.78rem !important;
    height: auto !important;
    padding: 2px !important;
}

.bwin-panel.fullscreen-active .blinds-container .blinds-box .box-content {
    min-height: auto !important;
    padding: 8px 10px !important;
}

.bwin-panel.fullscreen-active .blinds-container #blinds-display {
    font-size: 2.66rem !important;
    font-weight: 900 !important;
}

.bwin-panel.fullscreen-active .blinds-container #ante-container,
.bwin-panel.fullscreen-active .blinds-container #ante-container * {
    margin-top: 4px !important;
    font-size: 1.85rem !important;
    font-weight: 900 !important;
}

.bwin-panel.fullscreen-active .circular-progress {
    margin-top: -45px !important;
}

.bwin-panel.fullscreen-active .blinds-container .tournament-info-box .box-row {
    margin-bottom: 2px !important;
}

.bwin-panel.fullscreen-active .blinds-container #game-note {
    font-size: 0.95rem !important;
    line-height: 1.2 !important;
}

/* ==========================================================================
   РАЗДЕЛ: ТЕЛЕГРАМ-БОТ (УПРАВЛЕНИЕ)
   ========================================================================== */
.tg-admin-panel {
    background: rgba(26, 26, 26, 0.6) !important;
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-radius: 16px !important;
    padding: 30px !important;
}

.tg-tab-btn {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.05);
    color: var(--grey-text);
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 0.95rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.tg-tab-btn:hover {
    background: rgba(254, 203, 0, 0.05);
    color: var(--white);
    border-color: rgba(254, 203, 0, 0.3);
}

.tg-tab-btn.active {
    background: rgba(254, 203, 0, 0.15) !important;
    color: var(--gold) !important;
    border-color: var(--gold) !important;
    box-shadow: 0 0 15px rgba(254, 203, 0, 0.2);
}

.tg-stat-card {
    transition: all 0.3s ease;
}

.tg-stat-card:hover {
    transform: translateY(-3px);
    border-color: var(--gold) !important;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.4);
}

.tg-schedule-row {
    transition: background 0.2s;
    border-radius: 6px;
    padding: 8px;
}

.tg-schedule-row:hover {
    background: rgba(255, 255, 255, 0.02);
}

.tg-schedule-row .day-label {
    font-family: var(--font-main);
    font-size: 0.95rem;
    letter-spacing: 0.5px;
}

.tg-form-container {
    box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.4);
}

.checkbox-group input[type="checkbox"] {
    accent-color: var(--gold);
}

/* Стили для панели форматирования */
.tg-toolbar-btn {
    transition: all 0.2s ease;
}

.tg-toolbar-btn:hover {
    background: rgba(254, 203, 0, 0.15) !important;
    color: var(--gold) !important;
    border-color: var(--gold) !important;
    box-shadow: 0 0 8px rgba(254, 203, 0, 0.2);
}

.tg-emoji-btn {
    transition: all 0.15s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.tg-emoji-btn:hover {
    transform: scale(1.3) translateY(-2px);
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.4);
}

.tg-emoji-search-container:focus-within {
    border-color: #3498db !important;
    box-shadow: 0 0 8px rgba(52, 152, 219, 0.4) !important;
}

#emoji-list-scrollable::-webkit-scrollbar {
    width: 6px;
}
#emoji-list-scrollable::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.02);
    border-radius: 10px;
}
#emoji-list-scrollable::-webkit-scrollbar-thumb {
    background: rgba(52, 152, 219, 0.3);
    border-radius: 10px;
    transition: background 0.2s;
}
#emoji-list-scrollable::-webkit-scrollbar-thumb:hover {
    background: rgba(52, 152, 219, 0.6);
}

/* СТИЛИ ДЛЯ РУЧНОЙ РАССАДКИ ИГРОКОВ */
.seating-tab-btn {
    transition: all 0.25s ease;
}
.seating-tab-btn:hover {
    border-color: rgba(254, 203, 0, 0.5) !important;
    color: #fff !important;
    background: rgba(255, 255, 255, 0.05) !important;
}
.seating-tab-btn.active-table {
    border-color: var(--gold) !important;
    background: rgba(254, 203, 0, 0.15) !important;
    color: var(--gold) !important;
    box-shadow: 0 0 10px rgba(254, 203, 0, 0.2);
}

.seating-place-btn {
    aspect-ratio: 1 / 1;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid #333;
    color: #ccc;
    border-radius: 50%;
    font-size: 1.1rem;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
}
.seating-place-btn:hover {
    border-color: var(--gold);
    color: #fff;
    background: rgba(254, 203, 0, 0.05);
}
.seating-place-btn.active-place {
    border-color: var(--gold) !important;
    background: var(--gold) !important;
    color: #000 !important;
    box-shadow: 0 0 12px var(--gold-glow);
}
.seating-place-btn.occupied-place {
    border-color: #e74c3c;
    background: rgba(231, 76, 60, 0.05);
    color: #e74c3c;
}
.seating-place-btn.occupied-place:hover {
    background: rgba(231, 76, 60, 0.1);
}

/* Интерактивный hover для игроков в авторассадке */
.seat-item.interactive-seat {
    transition: all 0.2s ease;
    position: relative;
}
.seat-item.interactive-seat:hover {
    background: rgba(254, 203, 0, 0.15) !important;
    border-color: var(--gold) !important;
    box-shadow: 0 0 12px rgba(254, 203, 0, 0.4) !important;
}
.seat-item.interactive-seat:hover .seat-name {
    color: var(--gold) !important;
}
.seat-item.interactive-seat:hover .seat-num {
    color: var(--gold) !important;
}

/* Стили для интерактивной пересадки */
.seat-item.moving-source {
    background: rgba(254, 203, 0, 0.22) !important;
    border: 1px solid var(--gold) !important;
    box-shadow: 0 0 15px rgba(254, 203, 0, 0.6) !important;
    animation: pulse-gold-glow 1.5s infinite alternate;
}

@keyframes pulse-gold-glow {
    0% { box-shadow: 0 0 6px rgba(254, 203, 0, 0.25); }
    100% { box-shadow: 0 0 18px rgba(254, 203, 0, 0.7); }
}

.seating-move-banner {
    background: rgba(254, 203, 0, 0.08);
    border: 1px solid var(--gold);
    color: #fff;
    padding: 10px 18px;
    border-radius: 8px;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 0.95rem;
    box-shadow: 0 4px 15px rgba(254, 203, 0, 0.15);
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    box-sizing: border-box;
}
.seating-move-banner.hidden {
    display: none !important;
}
.seating-move-banner .banner-text {
    display: flex;
    align-items: center;
    gap: 10px;
}
.seating-move-banner .banner-cancel-btn {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: #fff;
    padding: 5px 14px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.85rem;
    font-weight: bold;
    transition: all 0.2s;
}
.seating-move-banner .banner-cancel-btn:hover {
    background: rgba(231, 76, 60, 0.2);
    border-color: #e74c3c;
    color: #fff;
}

/* Вкладки для подраздела Турниры */
.tour-tab-btn {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.05);
    color: var(--grey-text);
    padding: 8px 16px;
    border-radius: 6px;
    font-size: 0.9rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.3s ease;
}

.tour-tab-btn:hover {
    background: rgba(254, 203, 0, 0.05);
    color: var(--white);
    border-color: rgba(254, 203, 0, 0.3);
}

.tour-tab-btn.active {
    background: rgba(254, 203, 0, 0.15) !important;
    color: var(--gold) !important;
    border-color: var(--gold) !important;
    box-shadow: 0 0 12px rgba(254, 203, 0, 0.2);
}

/* Custom Login Overlay Styles */
.login-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.88);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    z-index: 99999;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.login-overlay.hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.login-card {
    background: linear-gradient(145deg, #181818 0%, #080808 100%);
    border: 1.5px solid rgba(254, 203, 0, 0.35);
    border-radius: 24px;
    padding: 40px;
    width: 100%;
    max-width: 380px;
    box-shadow: 0 30px 60px rgba(0,0,0,0.8), 0 0 30px rgba(254, 203, 0, 0.15), inset 0 0 1px 1px rgba(255,255,255,0.05);
    text-align: center;
}

.login-logo-container {
    margin-bottom: 25px;
}

.login-logo-img {
    max-height: 100px;
    width: auto;
    display: block;
    margin: 0 auto;
    filter: drop-shadow(0 0 15px rgba(254, 203, 0, 0.3));
}

.login-card h2 {
    color: var(--white);
    font-family: 'Inter', sans-serif;
    font-weight: 900;
    letter-spacing: 4px;
    margin-bottom: 10px;
    font-size: 1.8rem;
}

.login-card p {
    color: var(--grey-text);
    font-size: 0.9rem;
    margin-bottom: 30px;
    line-height: 1.4;
}

.login-card .input-group {
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.login-card .input-group label {
    font-size: 0.75rem;
    color: var(--gold);
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 700;
}

.login-error {
    color: #ff4757;
    font-size: 0.85rem;
    margin-top: 15px;
    text-align: center;
    background: rgba(255, 71, 87, 0.1);
    padding: 10px;
    border-radius: 6px;
    border: 1px solid rgba(255, 71, 87, 0.2);
}

.login-error.hidden {
    display: none;
}

/* Background Blur class when login is active */
.app-blurred {
    filter: blur(15px) !important;
    pointer-events: none !important;
    user-select: none !important;
}

.password-wrapper {
    position: relative;
    width: 100%;
}

.toggle-password-btn {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: none !important;
    border: none !important;
    color: var(--grey-text) !important;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    width: 24px;
    height: 24px;
    transition: color 0.2s ease;
    box-shadow: none !important;
    z-index: 10;
}

.toggle-password-btn:hover {
    color: var(--gold) !important;
}

.toggle-password-btn svg {
    pointer-events: none;
}

.toggle-password-btn .hidden {
    display: none !important;
}

/* Custom Lightbox Overlay for Admin Panel */
.lightbox-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(12, 8, 5, 0.96);
    z-index: 20000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s;
}

.lightbox-overlay.active {
    opacity: 1;
    visibility: visible;
}

.lightbox-content {
    position: relative;
    max-width: 90%;
    max-height: 85%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lightbox-img {
    max-width: 100%;
    max-height: 80vh;
    object-fit: contain;
    border-radius: 8px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.5);
    border: 1px solid rgba(255,255,255,0.05);
    user-select: none;
    -webkit-user-drag: none;
    transform: scale(0.95);
    transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.lightbox-overlay.active .lightbox-img {
    transform: scale(1);
}

.lightbox-close {
    position: absolute;
    top: -45px;
    right: 0;
    background: none;
    border: none;
    color: #eee;
    font-size: 2.2rem;
    cursor: pointer;
    opacity: 0.8;
    transition: all 0.2s ease;
    line-height: 1;
}

.lightbox-close:hover {
    color: var(--gold);
    opacity: 1;
}

.lightbox-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #fff;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    transition: all 0.2s ease;
    user-select: none;
}

.lightbox-nav:hover {
    background: rgba(255, 255, 255, 0.1);
    color: var(--gold);
    border-color: var(--gold);
}

.lightbox-nav.prev {
    left: -65px;
}

.lightbox-nav.next {
    right: -65px;
}

/* Lightbox Description & Counter */
.lightbox-desc {
    position: absolute;
    bottom: -65px;
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
    max-width: 500px;
    z-index: 20010;
    box-sizing: border-box;
    color: #fff;
    font-size: 1rem;
    font-family: 'Outfit', sans-serif;
    text-align: center;
    word-wrap: break-word;
    text-shadow: 0 2px 4px rgba(0,0,0,0.8);
    background: rgba(0,0,0,0.6);
    padding: 8px 16px;
    border-radius: 6px;
}

.lightbox-counter {
    position: absolute;
    bottom: -95px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 20010;
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.85rem;
    letter-spacing: 1px;
}

@media (max-width: 768px) {
    .lightbox-nav.prev {
        left: 10px;
        top: 50%;
        bottom: auto;
        transform: translateY(-50%);
    }
    .lightbox-nav.next {
        right: 10px;
        top: 50%;
        bottom: auto;
        transform: translateY(-50%);
    }
    .lightbox-desc {
        position: fixed;
        bottom: 50px;
        left: 5%;
        width: 90%;
        transform: none;
        max-width: 100%;
    }
    .lightbox-counter {
        position: fixed;
        bottom: 20px;
        left: 50%;
        transform: translateX(-50%);
    }
    .lightbox-close {
        top: 15px;
        right: 15px;
        position: fixed;
        font-size: 2.5rem;
        z-index: 20005;
    }
    .lightbox-content {
        max-height: 80%;
        width: 100%;
        max-width: 100%;
    }
}

/* --- СИСТЕМНОЕ ПРЕДУПРЕЖДЕНИЕ (МОНИТОРИНГ РЕСУРСОВ) --- */
.system-alert-banner {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: linear-gradient(90deg, #ff4444, #cc0000);
    color: #fff;
    text-align: center;
    padding: 12px 20px;
    font-family: 'Outfit', 'Inter', sans-serif;
    font-size: 0.95rem;
    font-weight: 900;
    letter-spacing: 0.05em;
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5);
    border-bottom: 2px solid var(--gold);
    box-sizing: border-box;
}

.system-alert-banner.hidden {
    display: none !important;
}

.alert-dismiss-btn {
    background: #fff;
    color: #cc0000;
    border: none;
    padding: 5px 15px;
    border-radius: 4px;
    font-weight: bold;
    cursor: pointer;
    font-size: 0.85rem;
    transition: background 0.2s, transform 0.1s;
}

.alert-dismiss-btn:hover {
    background: #ffcccc;
    transform: scale(1.05);
}

.alert-dismiss-btn:active {
    transform: scale(0.95);
}

/* Сдвиги макета при активном предупреждении */
body.has-alert-banner .menu-toggle {
    top: calc(20px + var(--banner-height, 45px));
}

body.has-alert-banner .sidebar {
    top: var(--banner-height, 45px);
    height: calc(100vh - var(--banner-height, 45px));
}

body.has-alert-banner #main-content {
    padding-top: var(--banner-height, 45px);
}

html.tv-mode {
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: radial-gradient(circle at center, #062b16 0%, #02140a 100%) !important;
}

body.tv-mode {
    width: 100vw !important;
    height: 100vh !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: radial-gradient(circle at center, #062b16 0%, #02140a 100%) !important;
    /* Calibrate color variables specifically for TV screen cooler color temperature shift (makes yellow-gold look warm matte orange-gold) */
    --gold: #ff9500 !important; 
    --gold-glow: rgba(255, 149, 0, 0.4) !important;
    --box-gradient: linear-gradient(to bottom, #ffdf7a 0%, #e65100 100%) !important;
}

body.tv-mode #sidebar,
body.tv-mode #menu-btn,
body.tv-mode #system-alert-banner,
body.tv-mode .clear-btn-premium,
body.tv-mode .calendar-nav,
body.tv-mode .add-player-form-section,
body.tv-mode .registration-header .clear-btn-premium,
body.tv-mode #btn-reset-seating,
body.tv-mode .timer-controls-row {
    display: none !important;
}

body.tv-mode #main-content {
    margin-left: 0 !important;
    padding: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    top: 0 !important;
}

body.tv-mode .page-view {
    padding: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
}

body.tv-mode .bwin-panel {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 20px !important; /* Reduced padding */
    width: 100vw !important;
    height: 100vh !important;
    box-sizing: border-box !important;
    transform: scale(var(--tv-scale, 1.0)) !important; /* Compense TV Overscan (default to 1.0 for full stretch) */
    transform-origin: center center !important;
}



body.tv-mode .seating-dashboard-layout {
    max-width: 1360px !important;
}

body.tv-mode #active-tournament-name {
    margin: 120px 0 20px 0 !important;
    text-align: center !important;
    width: 100% !important;
}



/* Кнопки выбора оплаты в окне расчета */
.payment-method-btn {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid #444;
    color: #888;
    box-shadow: none;
}
.payment-method-btn:hover {
    background: rgba(255, 255, 255, 0.08);
    color: #bbb;
    border-color: #666;
}
.payment-method-btn.active-card {
    background: linear-gradient(135deg, var(--gold) 0%, #b8860b 100%) !important;
    color: #000 !important;
    border: none !important;
    box-shadow: 0 4px 15px rgba(254, 203, 0, 0.2) !important;
}
.payment-method-btn.active-card:hover {
    filter: brightness(1.1);
    box-shadow: 0 0 20px var(--gold-glow) !important;
}
.payment-method-btn.active-cash {
    background: linear-gradient(135deg, #2ecc71 0%, #27ae60 100%) !important;
    color: #fff !important;
    border: 1px solid #2ecc71 !important;
    box-shadow: 0 4px 15px rgba(46, 204, 113, 0.2) !important;
}
.payment-method-btn.active-cash:hover {
    filter: brightness(1.1);
    box-shadow: 0 0 20px rgba(46, 204, 113, 0.4) !important;
}

/* Глобальная плавная прокрутка для всех списков и контейнеров */
html, 
.page-view, 
.player-db-history, 
.players-table-container, 
.seating-tables-grid, 
.waiting-list-scroll, 
.registration-list, 
.out-prizes-section, 
.modal-content {
    scroll-behavior: smooth !important;
}

/* Плавный переход для всех интерактивных элементов проекта */
button,
input,
select,
.clickable-row,
.clickable-row td,
.cal-nav-btn,
.add-btn-premium,
.clear-btn-premium,
.payment-method-btn,
.nav-item,
.seating-table,
.table-card,
.waiting-player-card,
.waiting-player-card *,
.tab-btn,
.seat-slot,
.seat-slot *,
.action-btn,
.bonus-control-btn,
.bonus-row,
.bonus-row *,
.delete-player-btn,
.modal-overlay,
.modal-content {
    transition: background 0.25s cubic-bezier(0.4, 0, 0.2, 1), 
                background-color 0.25s cubic-bezier(0.4, 0, 0.2, 1), 
                border-color 0.25s cubic-bezier(0.4, 0, 0.2, 1), 
                color 0.25s cubic-bezier(0.4, 0, 0.2, 1), 
                box-shadow 0.25s cubic-bezier(0.4, 0, 0.2, 1), 
                opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1), 
                transform 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Hide fullscreen toggle buttons on TV mode completely */
body.tv-mode .fullscreen-btn,
body.tv-mode .bwin-panel.fullscreen-active .fullscreen-btn,
body.tv-mode .seating-panel.fullscreen-active .fullscreen-btn {
    display: none !important;
}

/* Force targeted text elements in side column blocks to use the main Inter font, 0.9rem size, regular weight */
.stats-side-container .box-header,
.stats-side-container .row-label,
.stats-side-container .row-value:not(#break-display),
.stats-side-container .hand-day-comment,
.stats-side-container .hand-day-title,
.blinds-container .box-header,
.blinds-container .row-label,
.blinds-container .row-value,
.blinds-container #game-note {
    font-family: 'Inter', sans-serif !important;
    font-size: 1.09rem !important;
    font-weight: 400 !important;
}

.blinds-container #blinds-display {
    font-size: 2.66rem !important;
    font-weight: 900 !important;
}
.blinds-container #ante-container,
.blinds-container #ante-container * {
    font-size: 1.85rem !important;
    font-weight: 900 !important;
}

/* ==========================================================================
   ПАНЕЛЬ ПЕРЕКЛЮЧЕНИЯ СТОЛОВ ДЛЯ АДМИНИСТРАТОРА (СКРЫТА НА ТВ)
   ========================================================================== */
.admin-table-selector {
    position: absolute !important;
    top: 20px !important;
    right: 30px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    z-index: 1000 !important;
}
.admin-table-selector .selector-label {
    color: var(--grey-text) !important;
    font-size: 0.85rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    font-family: var(--font-main) !important;
}
.admin-table-selector .table-select-btn {
    width: 32px !important;
    height: 32px !important;
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid #444 !important;
    color: var(--grey-text) !important;
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.2s ease !important;
    font-family: var(--font-main) !important;
}
.admin-table-selector .table-select-btn:hover {
    border-color: var(--gold) !important;
    color: var(--white) !important;
}
.admin-table-selector .table-select-btn.active {
    background: var(--gold) !important;
    color: #000 !important;
    border-color: var(--gold) !important;
    box-shadow: 0 0 10px var(--gold-glow) !important;
}
/* Hide on TV screens */
body.tv-mode .admin-table-selector {
    display: none !important;
}

/* v644: селектор экранов для вывода РАССАДКИ (аналог admin-table-selector, но в потоке, по центру) */
.seating-screen-selector {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
    margin: 0 auto 10px auto !important;
}
.seating-screen-selector .selector-label {
    color: var(--grey-text) !important;
    font-size: 0.85rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    font-family: var(--font-main) !important;
}
.seating-screen-selector .seating-select-btn {
    width: 32px !important;
    height: 32px !important;
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid #444 !important;
    color: var(--grey-text) !important;
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.2s ease !important;
    font-family: var(--font-main) !important;
}
.seating-screen-selector .seating-select-btn:hover {
    border-color: var(--gold) !important;
    color: var(--white) !important;
}
.seating-screen-selector .seating-select-btn.active {
    background: var(--gold) !important;
    color: #000 !important;
    border-color: var(--gold) !important;
    box-shadow: 0 0 10px var(--gold-glow) !important;
}
body.tv-mode .seating-screen-selector {
    display: none !important;
}

/* BACKGROUND SUITS PATTERN FOR TV MODE */
.suits-bg-pattern {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    overflow: hidden !important;
    pointer-events: none !important;
    z-index: 0 !important;
}

.suits-bg-pattern .bg-suit {
    position: absolute !important;
    opacity: 0.06 !important; /* 6% opacity for clearer visibility */
    pointer-events: none !important;
}

.suits-bg-pattern .bg-suit svg {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
}

.suits-bg-pattern .bg-suit path {
    fill: none !important;
    stroke: #ffffff !important;
    stroke-width: 2.5px !important;
}

/* BACKGROUND TIMER LOGO TEXT */
.bg-timer-text {
    position: absolute !important;
    top: 408px !important; /* v745: поднято (было 439): на ТВ-вьюпортах ~720 низ резался overflow'ом */
    left: 50% !important;
    transform: translateX(-50%) !important;
    font-family: 'Ruslan Display', cursive !important;
    font-size: 3.6rem !important;
    color: transparent !important; /* completely transparent fill, blending with the emerald green background */
    -webkit-text-stroke: 1px var(--gold) !important; /* solid gold outline */
    text-shadow: none !important; /* disabled to prevent shadow from bleeding inside the transparent text */
    filter: drop-shadow(0 0 5px var(--gold)) !important; /* strong golden glow for maximum visibility during flash */
    opacity: 0.85; /* no !important here so keyframes can override and animate it */
    white-space: nowrap !important;
    letter-spacing: 0.25rem !important;
    pointer-events: none !important;
    z-index: 1 !important;
    user-select: none !important;
    -webkit-animation: neon-shimmer 20s infinite ease-in-out; /* no !important here */
    animation: neon-shimmer 20s infinite ease-in-out; /* no !important here */
}

/* BACKGROUND TIMER SUBTITLE */
.bg-timer-subtitle {
    position: absolute !important;
    top: 476px !important; /* v745: было 523 — слоган резался на ТВ (вьюпорт ~720); теперь сразу под «фулл хаус» */
    left: 50% !important;
    transform: translateX(-50%) !important;
    font-family: 'Inter', sans-serif !important; /* clean premium font */
    font-size: 0.82rem !important; /* elegant small size */
    font-weight: 500 !important;
    color: rgba(254, 203, 0, 0.9) !important; /* насыщенное золото; яркость даёт opacity-анимация */
    text-shadow: 0 0 8px rgba(254, 203, 0, 0.45) !important; /* мягкое золотое свечение — ярче на вспышке */
    white-space: nowrap !important;
    letter-spacing: 0.18rem !important; /* premium tracking */
    text-transform: uppercase !important; /* elegant uppercase layout */
    pointer-events: none !important;
    z-index: 1 !important;
    user-select: none !important;
    opacity: 0.85; /* базовая (как у «фулл хаус»); no !important -> keyframes управляют */
    -webkit-animation: neon-shimmer 20s infinite ease-in-out; /* та же анимация -> мерцает синхронно */
    animation: neon-shimmer 20s infinite ease-in-out;
}

/* PROGRESS RING BACKGROUND CIRCLE COLOR (DARK GOLD) */
.progress-ring__circle_bg {
    stroke: rgba(254, 203, 0, 0.18) !important; /* elegant dark gold in standard view */
}

/* TV screen color correction */
html.tv-mode .progress-ring__circle_bg {
    stroke: rgba(255, 149, 0, 0.18) !important; /* calibrated dark gold for TV screens */
}

/* PERIODIC NEON SHIMMER ANIMATION (once every 20 seconds) */
@-webkit-keyframes neon-shimmer {
    0%, 90%, 100% {
        opacity: 0.85;
    }
    91.6% { /* start of first rapid flicker */
        opacity: 0.70;
    }
    92.4% { /* drop back */
        opacity: 0.85;
    }
    93.4% { /* sudden bright neon flash! */
        opacity: 1.0;
    }
    94.2% { /* partial dropout */
        opacity: 0.50;
    }
    95.4% { /* second bright flash and hold! */
        opacity: 1.0;
    }
    98.0% { /* hold bright neon glow */
        opacity: 1.0;
    }
}

@keyframes neon-shimmer {
    0%, 90%, 100% {
        opacity: 0.85;
    }
    91.6% { /* start of first rapid flicker */
        opacity: 0.70;
    }
    92.4% { /* drop back */
        opacity: 0.85;
    }
    93.4% { /* sudden bright neon flash! */
        opacity: 1.0;
    }
    94.2% { /* partial dropout */
        opacity: 0.50;
    }
    95.4% { /* second bright flash and hold! */
        opacity: 1.0;
    }
    98.0% { /* hold bright neon glow */
        opacity: 1.0;
    }
}

/* --- АДАПТИВНАЯ ВЕРСИЯ ДЛЯ ПЛАНШЕТОВ И МОБИЛЬНЫХ УСТРОЙСТВ --- */
body {
    height: 100vh !important;
    height: 100dvh !important;
}

.sidebar {
    height: 100vh !important;
    height: 100dvh !important;
}

@media (max-width: 1400px) {
    #main-content,
    .content-shifted {
        transform: none !important;
        transition: none !important;
    }

    /* Настройки вьюпорта и общих отступов */
    .page-view {
        padding: 15px 10px !important;
    }
    
    .registration-header {
        padding-left: 60px !important;
        box-sizing: border-box !important;
    }
    
    .bwin-panel {
        padding: 20px 15px !important;
        width: 98% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    
    /* Сетки и колонки переводим в вертикальный вид */
    .players-columns-wrapper {
        flex-direction: column !important;
        gap: 20px !important;
        width: 100% !important;
    }
    
    .tables-grid {
        gap: 25px !important;
    }
    
    /* Таблицы скроллим по горизонтали, чтобы не обрезались */
    .players-table-container {
        width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    .players-table {
        min-width: 750px !important; /* Гарантирует читаемость колонок при скролле */
    }
}

@media (max-width: 768px) {
    .registration-header {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 15px !important;
        width: 100% !important;
    }
    
    .registration-header > * {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        justify-content: space-between !important;
    }
    
    .tournament-selector {
        justify-content: center !important;
    }
}

/* Hide background timer logo text on admin panel to avoid overlap with controls */
body:not(.tv-mode) .bg-timer-text,
body:not(.tv-mode) .bg-timer-subtitle {
    display: none !important;
}

#page-game .bwin-panel {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* ================= v705: РАССАДКА — раскладка и размер под планшет =================
   Столы идут ОДНОЙ КОЛОНКОЙ сверху вниз (по столу в ряд) — так легко попасть пальцем.
   Лист ожидания справа и «липкий», чтобы не уезжал при прокрутке столов.
   На ТВ (body.tv-mode) вид НЕ меняется: колонка столов раскладывается обратно в сетку 2x2. */

/* Две колонки: столы | лист ожидания.
   minmax(0, ...) обязателен: у fr-колонки минимум = min-content, и длинные имена
   в листе ожидания раздувают его, отбирая ширину у столов (было 283px против 404px). */
.seating-dashboard-layout {
    /* v718: лист ожидания шире на 30% (было 220–290px) — имена не влезали. Колонка столов
       задана как «весь остаток», поэтому сужается на столько же сама. */
    grid-template-columns: minmax(0, 1fr) minmax(286px, 377px) !important;
    max-width: 1560px !important;
    align-items: start !important;
}
/* ТВ: пропорции как раньше — столы занимают 3/4 ширины */
body.tv-mode .seating-dashboard-layout {
    grid-template-columns: minmax(0, 6fr) minmax(0, 2fr) !important;
}
.seating-tables {
    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;
}

/* --- ТВ: столы обратно сеткой 2x2 (t1 t2 / t3 t4) — как было --- */
body.tv-mode .seating-tables {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    align-content: start !important;
}

/* --- АДМИНКА: крупные строки под палец (тач-цель 44-48px вместо прежних ~20px) --- */
body:not(.tv-mode) .seating-panel .seat-item {
    padding: 11px 14px !important;
    gap: 12px !important;
    font-size: 1rem !important;
    border-radius: 8px !important;
    border-color: rgba(255, 255, 255, 0.07) !important;
}
body:not(.tv-mode) .seating-panel .table-seats { gap: 7px !important; }
body:not(.tv-mode) .seating-panel .table-card {
    padding: 14px 16px !important;
    border-radius: 12px !important;
}
body:not(.tv-mode) .seating-panel .table-title {
    font-size: 1.15rem !important;
    margin-bottom: 12px !important;
    padding-bottom: 8px !important;
}
body:not(.tv-mode) .seating-panel .seat-num {
    min-width: 32px !important;
    font-size: 1.02rem !important;
}
/* выбранный для переноса игрок — заметно подсвечен, видно кого несём */
body:not(.tv-mode) .seating-panel .seat-item.moving-source {
    outline: 2px solid var(--gold) !important;
    background: rgba(254, 203, 0, 0.14) !important;
}
/* Липкий лист ожидания НЕ делаем: карточка ожидания (20 мест) выше экрана,
   при position:sticky её низ навсегда уезжал бы за нижнюю границу. Выбор игрока
   и так сохраняется при прокрутке, так что тап -> прокрутка -> тап работает. */
/* на планшете «подпрыгивание» карточки мешает попадать пальцем — выключаем */
body:not(.tv-mode) .seating-panel .table-card:hover { transform: none !important; }

/* ================= v706: имена экранов вместо номеров =================
   Кнопки-селекторы были сделаны под ОДНУ ЦИФРУ (width: 32px) — «Стол № 1» в них
   не помещался. Отпускаем ширину по тексту, высоту оставляем 32px. */
.admin-table-selector .table-select-btn,
.seating-screen-selector .seating-select-btn {
    width: auto !important;
    min-width: 32px !important;
    padding: 0 10px !important;
    font-size: 0.8rem !important;
    white-space: nowrap !important;
}
/* селекторы не должны разъезжаться в 2 ряда на узком экране — даём перенос осознанно */
.admin-table-selector { flex-wrap: wrap !important; }

/* ================= v709: «Рука дня разыграна» =================
   Блок ГАСНЕТ, но остаётся на экране (просьба клуба — не прятать). */

/* заголовок теперь несёт кнопку — разводим по краям */
.hand-of-the-day-box > .box-header,
.hand-of-the-day-box-2 > .box-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
}

/* кнопка «Разыграна» — только в админке */
.hand-played-btn {
    flex: 0 0 auto;
    padding: 3px 10px;
    font-family: var(--font-main);
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: var(--grey-text);
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid #555;
    border-radius: 5px;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.2s ease;
}
.hand-played-btn:hover:not(:disabled) { border-color: var(--gold); color: #fff; }
.hand-played-btn:disabled { opacity: 0.35; cursor: default; }
/* нажата = рука разыграна */
.hand-played-btn.active {
    background: var(--gold);
    border-color: var(--gold);
    color: #000;
}

/* На ТВ кнопки быть не должно — там только результат (погасшая рука) */
body.tv-mode .hand-played-btn,
body.is-tv .hand-played-btn { display: none !important; }

/* ПОГАСШАЯ РУКА — и в админке, и на телевизорах.
   Гасим только содержимое и карты; заголовок оставляем читаемым, иначе на ТВ
   издалека непонятно, что это вообще за блок. */
.info-box.hand-played .box-content { opacity: 0.28 !important; filter: grayscale(0.85) !important; }
.info-box.hand-played > .box-header { opacity: 0.55 !important; }
.info-box.hand-played > .box-header .hand-played-btn { opacity: 1 !important; }
.info-box.hand-played { border-color: #333 !important; }

/* v717: стрелки листа ожидания продублированы внизу — это для админа (планшет).
   На ТВ высота канваса залочена, лишняя строка ломает раскладку -> прячем. */
body.tv-mode .waiting-pagination,
body.is-tv .waiting-pagination { display: none !important; }

/* ================= v719: шапка Авто-рассадки =================
   Селектор экранов и поиск разнесены по краям и выровнены ПО КОЛОНКАМ рассадки.
   Поэтому здесь ТА ЖЕ сетка, что у .seating-dashboard-layout (колонки/gap/max-width):
   любое расхождение — и блоки перестанут совпадать с краями столов и листа ожидания. */
.seating-header-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(286px, 377px) !important;
    gap: 20px !important;
    width: 100% !important;
    max-width: 1560px !important;
    margin: 0 auto 10px auto !important;
    align-items: center !important;
    box-sizing: border-box;
}
/* селектор — к левому краю колонки столов (туда же, где начинается «Стол № 1») */
.seating-header-row .seating-screen-selector {
    justify-content: flex-start !important;
    margin: 0 !important;
}
/* поиск — к правому краю колонки листа ожидания */
.seating-header-row .seating-search {
    display: flex !important;
    justify-content: flex-end !important;
}
/* найденный игрок — золотая рамка; строку не прячем, иначе поедут номера мест */
.seating-panel .seat-item.search-hit {
    border: 1px solid var(--gold) !important;
    background: rgba(254, 203, 0, 0.16) !important;
    box-shadow: 0 0 10px rgba(254, 203, 0, 0.25) !important;
}
/* на ТВ ни шапки, ни подсветки поиска быть не должно */
body.tv-mode .seating-header-row,
body.is-tv .seating-header-row { display: none !important; }
body.tv-mode .seating-panel .seat-item.search-hit,
body.is-tv .seating-panel .seat-item.search-hit {
    border-color: transparent !important; background: none !important; box-shadow: none !important;
}

/* ================= v725: ГОСТИ (НЕ В ИГРЕ) ================= */
/* v727: кнопка «Добавить гостя» — цельная сплошная, в один цвет, без переноса, на уровне даты */
.btn-add-guest {
    height: 44px; padding: 0 22px; white-space: nowrap;
    background: var(--gold); color: #000; border: none; border-radius: 8px;
    font-family: var(--font-main); font-weight: 800; font-size: 0.95rem;
    letter-spacing: 0.3px; cursor: pointer; transition: filter 0.15s ease;
}
.btn-add-guest:hover { filter: brightness(1.08); }
.btn-add-guest:active { filter: brightness(0.95); }
.guests-list { display: flex; flex-direction: column; gap: 10px; }
.guest-row {
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
    padding: 12px 16px; background: rgba(255,255,255,0.03);
    border: 1px solid #333; border-radius: 10px; flex-wrap: wrap;
}
/* v728: РАССЧИТАН — строка темнеет (чек закрыт). Ввод/«+»/«Рассчитать» гасим и блокируем,
   кнопка возврата (круговая стрелка) остаётся активной — ею гостя возвращают «с нуля». */
.guest-row.is-paid { border-color: #2e2e2e; background: rgba(0,0,0,0.38); }
.guest-row.is-paid .guest-name,
.guest-row.is-paid .guest-sum-badge { opacity: 0.5; }
.guest-row.is-paid .guest-amount-inp,
.guest-row.is-paid .guest-add-btn,
.guest-row.is-paid .guest-pay-btn { opacity: 0.35; pointer-events: none; filter: grayscale(0.6); }
/* кнопка «вернуть с нуля» на рассчитанной строке — подсвечена, чтобы её было видно */
.guest-row.is-paid .guest-reset-btn { border-color: var(--gold); color: var(--gold); opacity: 1; }
.guest-row.is-paid .guest-reset-btn:hover { background: var(--gold); color: #000; }
.guest-main { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; min-width: 0; }
.guest-name { color: #fff; font-weight: 700; font-size: 1.05rem; }
.guest-sum-badge {
    font-family: var(--font-nums); font-weight: 900; font-size: 0.95rem;
    padding: 3px 10px; border-radius: 6px; background: rgba(255,202,0,0.15);
    color: #ffca00; border: 1px solid rgba(255,202,0,0.4);
}
.guest-sum-badge.empty { background: transparent; color: var(--grey-text); border-color: #444; font-weight: 700; font-size: 0.8rem; }
.guest-sum-badge.paid { background: rgba(46,204,113,0.15); color: #2ecc71; border-color: rgba(46,204,113,0.5); }
.guest-paid-tag { font-size: 0.7rem; font-weight: 800; letter-spacing: 0.5px; padding: 2px 8px; border-radius: 5px; text-transform: uppercase; }
.guest-paid-tag.card { background: rgba(74,163,255,0.15); color: #4aa3ff; border: 1px solid rgba(74,163,255,0.5); }
.guest-paid-tag.cash { background: rgba(46,204,113,0.15); color: #2ecc71; border: 1px solid rgba(46,204,113,0.5); }
.guest-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.guest-actions .btn-ra { height: 36px; padding: 0 12px; min-width: auto; }
/* v726/v727: поле ввода суммы прямо в строке */
.guest-amount-inp {
    width: 110px; height: 36px; box-sizing: border-box;
    background: rgba(255,255,255,0.05); border: 1px solid #444; border-radius: 8px;
    color: #fff; font-family: var(--font-nums); font-weight: 700; font-size: 0.95rem;
    text-align: center; padding: 0 8px; transition: border-color 0.2s ease;
}
.guest-amount-inp:focus { outline: none; border-color: var(--gold); }
.guest-amount-inp::-webkit-outer-spin-button, .guest-amount-inp::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
/* v727: убираем белый фон и жёлтую подсветку автозаполнения браузера */
.guest-amount-inp:-webkit-autofill,
.guest-amount-inp:-webkit-autofill:hover,
.guest-amount-inp:-webkit-autofill:focus {
    -webkit-text-fill-color: #fff !important;
    -webkit-box-shadow: 0 0 0 1000px #262626 inset !important;
    caret-color: #fff;
    transition: background-color 9999s ease-in-out 0s;
}
/* «+» — добавить в чек */
.guest-add-btn { border-color: #ffca00; color: #ffca00; font-size: 1.3rem; font-weight: 900; min-width: 40px !important; }
.guest-add-btn:hover { background: #ffca00; color: #000; }
/* обнулить счёт (круговая стрелка) */
.guest-reset-btn { border-color: #888; color: #bbb; min-width: 40px !important; display: inline-flex; align-items: center; justify-content: center; }
.guest-reset-btn:hover { background: #888; color: #fff; }
/* Оплата */
.guest-pay-btn { border-color: #2ecc71; color: #2ecc71; font-weight: 800; }
.guest-pay-btn:hover { background: #2ecc71; color: #fff; }
.guest-del-btn { border-color: #e74c3c; color: #e74c3c; min-width: 40px !important; }
.guest-del-btn:hover { background: #e74c3c; color: #fff; }
/* Кнопки способа оплаты в модалке ОПЛАТА */
.guest-pay-method {
    height: 48px; border-radius: 10px; font-weight: 800; font-size: 0.95rem;
    background: rgba(255,255,255,0.04); border: 1.5px solid #555; color: rgba(255,255,255,0.85);
    cursor: pointer; transition: all 0.2s ease; font-family: var(--font-main);
}
.guest-pay-method:hover { border-color: var(--gold); color: #fff; }
.guest-pay-method.active-pay { background: var(--gold); border-color: var(--gold); color: #000; box-shadow: 0 0 16px var(--gold-glow); }

/* ================= v735: окно «РАСПРЕДЕЛЕНИЕ ПО МЕСТАМ» — стиль клуба ================= */
#reseat-overlay {
    position: fixed; inset: 0; z-index: 99999;
    display: flex; align-items: center; justify-content: center;
    background: radial-gradient(ellipse at center, rgba(2,20,10,0.92) 0%, rgba(0,0,0,0.96) 100%);
    backdrop-filter: blur(6px);
    font-family: var(--font-main);
    animation: reseatFadeIn 0.3s ease;
}
#reseat-overlay.hidden { display: none !important; }
@keyframes reseatFadeIn { from { opacity: 0; transform: scale(0.98); } to { opacity: 1; transform: scale(1); } }
.reseat-box {
    position: relative;
    max-width: min(92vw, 900px); max-height: 92vh; overflow-y: auto;
    background: var(--panel-bg);
    border: 1px solid rgba(254,203,0,0.5); border-radius: 18px;
    padding: clamp(24px, 4vh, 48px) clamp(28px, 5vw, 64px); text-align: center;
    box-shadow: 0 30px 90px rgba(0,0,0,0.9), 0 0 60px rgba(254,203,0,0.15), inset 0 2px 12px rgba(255,255,255,0.04);
}
/* золотая декоративная линия сверху — как акценты в панелях клуба */
.reseat-deco-top {
    width: 90px; height: 4px; margin: 0 auto 20px;
    background: var(--box-gradient); border-radius: 3px;
    box-shadow: 0 0 16px var(--gold-glow);
}
.reseat-title {
    color: var(--gold); font-family: var(--font-main); font-weight: 900;
    font-size: clamp(1.6rem, 4.5vw, 3rem); letter-spacing: clamp(2px, 0.5vw, 5px);
    text-transform: uppercase; text-shadow: 0 0 26px var(--gold-glow);
    line-height: 1.15;
}
.reseat-sub {
    color: var(--grey-text); font-size: clamp(0.85rem, 1.7vw, 1.15rem);
    margin: 10px 0 clamp(20px, 3.5vh, 34px); font-weight: 500; letter-spacing: 0.5px;
}
.reseat-list { display: flex; flex-direction: column; gap: 14px; margin-bottom: clamp(20px, 3.5vh, 34px); }
.reseat-move {
    background: rgba(255,255,255,0.03); border: 1px solid #333; border-radius: 14px;
    padding: clamp(12px, 1.8vh, 18px) clamp(16px, 2vw, 24px);
    display: flex; flex-direction: column; align-items: center; gap: 10px;
}
.reseat-who {
    color: #fff; font-weight: 800; font-size: clamp(1.05rem, 2.4vw, 1.7rem);
    letter-spacing: 0.5px; text-shadow: 0 1px 4px rgba(0,0,0,0.5);
}
.reseat-route { display: flex; align-items: center; justify-content: center; gap: clamp(12px, 2.5vw, 28px); flex-wrap: wrap; }
.reseat-badge {
    display: inline-flex; flex-direction: column; align-items: center; gap: 2px;
    padding: clamp(8px, 1.2vh, 12px) clamp(14px, 2vw, 22px);
    border-radius: 12px; min-width: clamp(110px, 16vw, 160px);
    font-family: var(--font-nums);
}
.reseat-badge b { font-size: clamp(1.1rem, 2.6vw, 1.9rem); font-weight: 900; letter-spacing: 0.5px; }
.reseat-badge i { font-size: clamp(0.75rem, 1.5vw, 1rem); font-style: normal; text-transform: uppercase; letter-spacing: 1px; opacity: 0.85; }
.reseat-badge.from { background: rgba(255,255,255,0.04); border: 1px solid #555; color: var(--grey-text); }
.reseat-badge.from b { color: #cfcfcf; }
.reseat-badge.to { background: rgba(254,203,0,0.12); border: 1px solid rgba(254,203,0,0.55); color: var(--gold); box-shadow: 0 0 20px rgba(254,203,0,0.15); }
.reseat-arrow { color: var(--gold); font-size: clamp(1.8rem, 4.5vw, 3rem); font-weight: 900; text-shadow: 0 0 16px var(--gold-glow); line-height: 1; }
.reseat-count {
    color: var(--gold); font-family: var(--font-nums); font-weight: 900;
    font-size: clamp(2.2rem, 6vw, 4rem); text-shadow: 0 0 24px var(--gold-glow);
    line-height: 1; display: flex; align-items: baseline; justify-content: center; gap: 10px;
}
.reseat-count em { font-style: normal; font-size: clamp(0.9rem, 2vw, 1.3rem); color: var(--grey-text); text-transform: uppercase; letter-spacing: 2px; }

/* v736: планшеты — тапы по кнопкам экранов и действий срабатывают мгновенно, без
   300мс-задержек и двойных тапов (touch-action: manipulation отключает zoom-жесты на кнопке) */
.seating-screen-selector .seating-select-btn,
.admin-table-selector .table-select-btn,
.tv-assign-btn,
.btn-ra,
.tg-toolbar-btn {
    touch-action: manipulation;
    -webkit-tap-highlight-color: rgba(254, 203, 0, 0.25);
}

/* ===== v737: окно «Распределение по местам» — масштаб под число игроков ===== */
/* Бокс — флекс-колонка БЕЗ прокрутки: список сжимается, таймер (reseat-count) виден всегда */
.reseat-box { display: flex; flex-direction: column; overflow: hidden; max-height: 94vh; }
.reseat-list { flex: 0 1 auto; min-height: 0; overflow: hidden; }
.reseat-count { flex-shrink: 0; }

/* 3-4 переезда: компактнее и в 2 колонки, бокс шире */
.reseat-box.rs-c2 { max-width: min(96vw, 1240px); }
.reseat-box.rs-c2 .reseat-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: clamp(12px, 2vh, 20px); }
.reseat-box.rs-c2 .reseat-move { padding: clamp(8px, 1.2vh, 12px) clamp(10px, 1.4vw, 16px); gap: 6px; }
.reseat-box.rs-c2 .reseat-who { font-size: clamp(0.95rem, 1.9vw, 1.35rem); }
.reseat-box.rs-c2 .reseat-badge { min-width: clamp(84px, 10vw, 120px); padding: clamp(5px, 0.8vh, 8px) clamp(9px, 1.2vw, 14px); }
.reseat-box.rs-c2 .reseat-badge b { font-size: clamp(0.95rem, 2vw, 1.35rem); }
.reseat-box.rs-c2 .reseat-badge i { font-size: clamp(0.65rem, 1.1vw, 0.85rem); }
.reseat-box.rs-c2 .reseat-arrow { font-size: clamp(1.2rem, 2.8vw, 1.9rem); }
.reseat-box.rs-c2 .reseat-title { font-size: clamp(1.3rem, 3.4vw, 2.3rem); }
.reseat-box.rs-c2 .reseat-sub { margin-bottom: clamp(10px, 1.8vh, 18px); }
.reseat-box.rs-c2 .reseat-count { font-size: clamp(1.8rem, 4.5vw, 3rem); }

/* 5+ переездов: максимально сжато, 2 колонки */
.reseat-box.rs-c3 { max-width: min(97vw, 1320px); }
.reseat-box.rs-c3 .reseat-deco-top { margin-bottom: 10px; }
.reseat-box.rs-c3 .reseat-list { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-bottom: clamp(8px, 1.4vh, 14px); }
.reseat-box.rs-c3 .reseat-move { padding: 6px 10px; gap: 4px; border-radius: 10px; flex-direction: row; justify-content: space-between; flex-wrap: wrap; }
.reseat-box.rs-c3 .reseat-who { font-size: clamp(0.85rem, 1.5vw, 1.1rem); }
.reseat-box.rs-c3 .reseat-badge { min-width: clamp(64px, 7.5vw, 92px); padding: 4px 8px; border-radius: 8px; }
.reseat-box.rs-c3 .reseat-badge b { font-size: clamp(0.85rem, 1.6vw, 1.1rem); }
.reseat-box.rs-c3 .reseat-badge i { font-size: clamp(0.55rem, 0.9vw, 0.7rem); }
.reseat-box.rs-c3 .reseat-arrow { font-size: clamp(1rem, 2.2vw, 1.5rem); }
.reseat-box.rs-c3 .reseat-title { font-size: clamp(1.1rem, 2.8vw, 1.9rem); letter-spacing: 2px; }
.reseat-box.rs-c3 .reseat-sub { margin-bottom: 8px; font-size: clamp(0.75rem, 1.3vw, 0.95rem); }
.reseat-box.rs-c3 .reseat-count { font-size: clamp(1.5rem, 3.8vw, 2.4rem); }

/* v738: примечание и комментарии «Руки дня» — многострочные (Enter в настройках турнира),
   переводы строк отображаются на экранах как в «Призах» */
#game-note, .hand-day-comment { white-space: pre-line; }

/* v739: ряд действий в «Записи на игру» — компактнее, чтобы крестик удаления
   не выдавливало за край на узких экранах/планшетах. Кнопки чуть уже, зазоры меньше,
   всё остаётся читаемым и пропорциональным. */
#registration-body .action-btns { gap: 3px; flex-wrap: nowrap; }
#registration-body .btn-ra { min-width: 34px; padding: 0 2px; font-size: 0.64rem; letter-spacing: 0; }
#registration-body .btn-ra.reentry-action,
#registration-body .btn-ra.reentry2-action,
#registration-body .btn-ra.rebuy2-action { font-size: 0.58rem; line-height: 1.05; }
#registration-body .btn-ra.calc-action { font-size: 0.53rem !important; padding: 0 2px !important; }
#registration-body td:last-child { min-width: 32px; }
#registration-body .delete-player-btn { padding: 0 6px; }

/* v795.1: услуга не прописана в турнире -> кнопка видна, но НЕАКТИВНА */
#registration-body .btn-ra.svc-off,
#registration-body .btn-ra:disabled {
    opacity: 0.22;
    filter: grayscale(0.85);
    cursor: not-allowed;
    pointer-events: none;
}

/* v741 (к script v799): выбывший игрок может остаться "за баром" и продолжать заказывать -
   ЧАЙ/БАР/КЛН и РАСЧЁТ у него кликабельны (игровые кнопки RBY/RE/ADD по-прежнему заблокированы).
   Родительский .player-out оставляет ряд притушенным - это ок, кнопки при этом работают. */
.player-out .tips-action,
.player-out .bar-action,
.player-out .hookah-action,
.player-out .calc-action {
    pointer-events: auto;
}
.player-out .tips-action { border-color: #9b59b6; color: #9b59b6; }
.player-out .bar-action { border-color: #2ecc71; color: #2ecc71; }
.player-out .hookah-action { border-color: #e67e22; color: #e67e22; }

/* ===== v805: состояния выбывшего игрока в «Записи на игру» ===== */
/* OUT, но НЕ рассчитан: имя и игровые кнопки притушены ИНДИВИДУАЛЬНО (не через
   opacity родителя — иначе детей не «зажечь»), БАР/КЛН/ЧАЙ в полную яркость,
   РАСЧЁТ пульсирует золотом, пока админ не рассчитает */
.player-out.player-awaiting-calc { opacity: 1; filter: none; background: rgba(255, 255, 255, 0.015); }
.player-out.player-awaiting-calc td { color: #777; }
.player-out.player-awaiting-calc .player-info-cell { opacity: 0.55; filter: grayscale(0.7); }
.player-out.player-awaiting-calc .tips-action { opacity: 1; border-color: #9b59b6; color: #9b59b6; }
.player-out.player-awaiting-calc .bar-action { opacity: 1; border-color: #2ecc71; color: #2ecc71; }
.player-out.player-awaiting-calc .hookah-action { opacity: 1; border-color: #e67e22; color: #e67e22; }
.player-out.player-awaiting-calc .out-action { pointer-events: auto; }
.player-out.player-awaiting-calc .calc-action {
    pointer-events: auto;
    opacity: 1;
    border-color: #f1c40f !important;
    color: #f1c40f !important;
    animation: calc-awaiting-pulse 1.6s infinite ease-in-out;
}
@keyframes calc-awaiting-pulse {
    0%, 100% { box-shadow: 0 0 5px rgba(241, 196, 15, 0.35); }
    50% { box-shadow: 0 0 16px rgba(241, 196, 15, 0.9); }
}
/* Рассчитан: ВСЯ строка полностью тёмная, кнопки погашены (кроме OUT — вернуть можно) */
.player-out.player-settled { opacity: 0.32; filter: grayscale(0.9); }
.player-out.player-settled .btn-ra {
    pointer-events: none;
    border-color: #444 !important;
    color: #555 !important;
    box-shadow: none !important;
    animation: none !important;
}
.player-out.player-settled .out-action { pointer-events: auto; }
.player-out.player-settled .calc-action { pointer-events: auto; }


/* v744: окно «Бонусы» игрока — тонкий аккуратный бегунок вместо системного «бруса»
   (09.08: окно расширено 460->640, системный скроллбар выглядел грубо) */
#player-bonus-body::-webkit-scrollbar { width: 5px; }
#player-bonus-body::-webkit-scrollbar-track { background: rgba(255,255,255,0.04); border-radius: 3px; }
#player-bonus-body::-webkit-scrollbar-thumb { background: rgba(254,203,0,0.45); border-radius: 3px; }
#player-bonus-body::-webkit-scrollbar-thumb:hover { background: rgba(254,203,0,0.7); }
#player-bonus-body { scrollbar-width: thin; scrollbar-color: rgba(254,203,0,0.45) rgba(255,255,255,0.04); }


/* v744.1: подсказка в поле произвольного бонуса — курсивом, приглушённо */
#pb-grant-custom::placeholder { font-style: italic; color: rgba(255,255,255,0.35); }

/* v745: явная поддержка тёмной темы - WebView с авто-затемнением видит, что сайт сам тёмный, и не перекрашивает его */
@media (prefers-color-scheme: dark) {
    :root { color-scheme: only dark; }
}


/* v746: строка бонуса при расчёте — длинные названия («Бесплатная позиция в меню»)
   раньше наезжали на счётчик (nowrap без ограничения ширины). Метка занимает свободное
   место и переносится, «(Доступно: N)» — под названием, счётчик справа не сжимается. */
.bonus-row { gap: 12px; }
.bonus-row .bonus-label {
    white-space: normal;
    flex: 1 1 auto;
    min-width: 0;
    flex-wrap: wrap;
    align-items: baseline;
    line-height: 1.3;
    overflow-wrap: anywhere;
}
.bonus-row .bonus-label span.bonus-remaining { flex-basis: 100%; }
.bonus-row .bonus-controls { flex: 0 0 auto; }