/* Chess Game — HotelsCasa v1.0 (mobile-first) */

.cg-wrapper { display:inline-block; }

.cg-open-btn {
    background: linear-gradient(135deg, #f0c040, #e0a020);
    color: #1a1a2e; font-size: 16px; font-weight: 800;
    padding: 12px 26px; border: none; border-radius: 50px;
    cursor: pointer; box-shadow: 0 4px 16px rgba(240,192,64,.35);
    -webkit-tap-highlight-color: transparent; touch-action: manipulation;
    transition: transform .15s;
}
.cg-open-btn:active { transform: scale(.96); }

/* ---- Модалка ---- */
.cg-modal {
    position: fixed; inset: 0; z-index: 999990;
    background: rgba(2,6,16,.88);
    display: flex; align-items: center; justify-content: center;
    padding: 10px;
    overscroll-behavior: contain;
}
.cg-modal-inner {
    background: linear-gradient(160deg, #0d1b2a, #101626);
    border: 1px solid #2a3a60; border-radius: 22px;
    width: 100%; max-width: 480px;
    max-height: 94dvh;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 14px 14px calc(14px + env(safe-area-inset-bottom));
    color: #cdd9e8;
    font-family: 'Segoe UI', system-ui, sans-serif;
}

/* ---- Шапка ---- */
.cg-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.cg-logo { font-weight:900; font-size:15px; color:#f0c040; letter-spacing:.5px; }
.cg-logo span { color:#fff; }
.cg-header-right { display:flex; align-items:center; gap:10px; }
.cg-coins-mini {
    display:flex; align-items:center; gap:3px;
    background:rgba(240,192,64,.12); border:1px solid rgba(240,192,64,.4);
    border-radius:40px; padding:4px 10px; font-size:13px; font-weight:700; color:#f0c040;
}
.cg-close {
    background:none; border:none; color:#ff7070; font-size:20px;
    cursor:pointer; min-width:38px; min-height:38px;
    -webkit-tap-highlight-color:transparent; touch-action:manipulation;
}

/* ---- Тикер сверху: объекты + новости ---- */
.cg-ticker {
    display:flex; align-items:center; gap:8px;
    background:rgba(255,255,255,.04);
    border:1px solid #2a3a60; border-radius:14px;
    padding:6px 8px; margin-bottom:12px;
    overflow:hidden;
}
.cg-ticker-label {
    flex-shrink:0; font-size:11px; font-weight:800; color:#f0c040;
    background:rgba(240,192,64,.12); border-radius:20px; padding:4px 9px;
    white-space:nowrap;
}
.cg-ticker-viewport { overflow:hidden; flex:1; }
.cg-ticker-track {
    display:flex; gap:14px; width:max-content;
    animation:cgTickerScroll 45s linear infinite;
}
.cg-ticker:hover .cg-ticker-track { animation-play-state:paused; }
@keyframes cgTickerScroll {
    from { transform:translateX(0); }
    to   { transform:translateX(-50%); }
}
.cg-ticker-item {
    display:flex; align-items:center; gap:8px;
    text-decoration:none; flex-shrink:0; max-width:230px;
}
.cg-ticker-thumb {
    width:34px; height:34px; border-radius:8px; object-fit:cover; flex-shrink:0;
}
.cg-ticker-thumb--ph {
    display:flex; align-items:center; justify-content:center;
    background:#16223a; font-size:16px;
}
.cg-ticker-info { min-width:0; }
.cg-ticker-name {
    font-size:11.5px; font-weight:700; color:#fff;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:180px;
}
.cg-ticker-meta {
    font-size:10.5px; color:#7e90b0;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:180px;
}

/* ---- Экран выбора режима ---- */
.cg-screen--mode h2 { font-size:19px; color:#fff; margin:4px 0 4px; text-align:center; }
.cg-sub { text-align:center; font-size:13px; color:#7e90b0; margin:0 0 14px; }

.cg-mode-cards { display:flex; gap:12px; flex-wrap:wrap; }
.cg-mode-card {
    flex:1; min-width:170px;
    background:rgba(255,255,255,.04); border:1px solid #2a3a60;
    border-radius:18px; padding:16px 12px; text-align:center; position:relative;
}
.cg-mode-card--prize { border-color:#f0c040; background:rgba(240,192,64,.06); }
.cg-mode-badge {
    position:absolute; top:-10px; left:50%; transform:translateX(-50%);
    background:#f0c040; color:#1a1a2e; font-size:11px; font-weight:800;
    border-radius:20px; padding:3px 12px; white-space:nowrap;
}
.cg-mode-icon { font-size:34px; margin-bottom:6px; }
.cg-mode-title { font-weight:800; color:#fff; font-size:15px; margin-bottom:4px; }
.cg-mode-desc { font-size:12px; color:#7e90b0; line-height:1.5; margin-bottom:12px; }

.cg-mode-btn--prize {
    background:linear-gradient(135deg,#f0c040,#e0a020); color:#1a1a2e;
    border:none; border-radius:40px; padding:10px 18px;
    font-weight:800; font-size:14px; cursor:pointer;
    -webkit-tap-highlight-color:transparent; touch-action:manipulation;
    min-height:42px;
}
.cg-mode-btn--prize:active { transform:scale(.96); }

.cg-level-chips { display:flex; flex-wrap:wrap; gap:6px; justify-content:center; }
.cg-level-chip {
    background:#16223a; border:1px solid #2a3a60; color:#cdd9e8;
    font-size:12px; border-radius:30px; padding:7px 12px; cursor:pointer;
    -webkit-tap-highlight-color:transparent; touch-action:manipulation;
    min-height:34px; transition:all .15s;
}
.cg-level-chip:active { background:#f0c040; color:#1a1a2e; }

.cg-info-toggle {
    display:block; margin:16px auto 0; background:none; border:none;
    color:#7e90b0; font-size:12px; cursor:pointer; text-decoration:underline;
    -webkit-tap-highlight-color:transparent; touch-action:manipulation; min-height:36px;
}
.cg-info-box {
    background:rgba(255,255,255,.04); border-radius:14px;
    padding:12px 16px; margin-top:8px; font-size:12px;
}
.cg-info-box ul { margin:0; padding-left:16px; }
.cg-info-box li { margin-bottom:6px; line-height:1.5; }
.cg-info-box strong { color:#f0c040; }

/* ---- Экран игры ---- */
.cg-status {
    display:flex; align-items:center; justify-content:space-between;
    font-size:13px; margin-bottom:8px; gap:8px;
}
.cg-status-level { color:#7e90b0; }
.cg-status-turn  { color:#f0c040; font-weight:700; }

.cg-board-wrap { position:relative; }
.cg-board {
    display:grid;
    grid-template-columns:repeat(8, 1fr);
    width:100%; max-width:440px; margin:0 auto;
    aspect-ratio:1/1;
    border-radius:10px; overflow:hidden;
    border:2px solid #2a3a60;
    touch-action:manipulation;
    user-select:none; -webkit-user-select:none;
}
.cg-sq {
    display:flex; align-items:center; justify-content:center;
    font-size:clamp(20px, 8.5vw, 38px);
    line-height:1; cursor:pointer;
    -webkit-tap-highlight-color:transparent;
}
.cg-sq--light { background:#e8d5b0; }
.cg-sq--dark  { background:#a87d52; }
.cg-pc--w { color:#fff; text-shadow:0 1px 2px rgba(0,0,0,.7); }
.cg-pc--b { color:#16121a; text-shadow:0 1px 1px rgba(255,255,255,.25); }
.cg-sq--sel    { outline:3px solid #f0c040; outline-offset:-3px; }
.cg-sq--target { box-shadow:inset 0 0 0 100vmax rgba(46,204,113,.35); }

/* Оверлей конца партии */
.cg-overlay {
    position:absolute; inset:0;
    background:rgba(2,6,16,.82);
    display:flex; align-items:center; justify-content:center;
    border-radius:10px;
}
.cg-overlay-box { text-align:center; padding:18px; }
.cg-overlay-msg { font-size:17px; font-weight:800; color:#fff; margin-bottom:16px; line-height:1.5; }
.cg-overlay-btns { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }
.cg-again-btn {
    background:linear-gradient(135deg,#f0c040,#e0a020); color:#1a1a2e;
    border:none; border-radius:40px; padding:11px 20px; font-weight:800;
    cursor:pointer; min-height:42px;
    -webkit-tap-highlight-color:transparent; touch-action:manipulation;
}
.cg-menu-btn, .cg-resign-btn, .cg-back-btn {
    background:transparent; border:1px solid #2a3a60; color:#7e90b0;
    border-radius:40px; padding:10px 18px; font-size:13px; cursor:pointer;
    min-height:40px;
    -webkit-tap-highlight-color:transparent; touch-action:manipulation;
}
.cg-game-btns { display:flex; gap:10px; justify-content:center; margin-top:10px; }

/* ---- Чат ---- */
.cg-chat {
    margin-top:14px; background:#0c1322;
    border:1px solid #2a3a60; border-radius:16px; overflow:hidden;
}
.cg-chat-header {
    background:#141d33; padding:9px 14px;
    font-size:13px; font-weight:700; color:#f0c040;
}
.cg-chat-msgs {
    max-height:160px; overflow-y:auto; padding:10px;
    display:flex; flex-direction:column; gap:6px;
    overscroll-behavior:contain;
}
.cg-msg {
    max-width:86%; padding:7px 11px; border-radius:14px;
    font-size:12.5px; line-height:1.45; word-wrap:break-word;
}
.cg-msg--bot  { background:#1a2640; color:#cdd9e8; align-self:flex-start; }
.cg-msg--user { background:#f0c040; color:#1a1a2e; align-self:flex-end; }
.cg-chat-input-row { display:flex; gap:8px; padding:10px; border-top:1px solid #1c2945; }
.cg-chat-input {
    flex:1; background:#16223a; border:1px solid #2a3a60; color:#fff;
    border-radius:30px; padding:9px 14px; font-size:13px; min-height:40px;
}
.cg-chat-input:focus { outline:none; border-color:#f0c040; }
.cg-chat-send {
    background:#f0c040; color:#1a1a2e; border:none; border-radius:50%;
    width:42px; height:42px; font-size:15px; cursor:pointer; flex-shrink:0;
    -webkit-tap-highlight-color:transparent; touch-action:manipulation;
}

/* ---- Десктоп ---- */
@media (min-width: 760px) {
    .cg-modal-inner { max-width: 560px; }
}