/* siete-y-media.css — HotelsCasa */
/* Стили идентичны blackjack, только цветовой акцент — тёмно-красный испанский стиль */

.sym-wrapper{display:inline-block}
.sym-open-btn{background:linear-gradient(135deg,#6b1a1a 0%,#9b2335 100%);color:#fff;border:none;border-radius:10px;padding:12px 28px;font-size:1rem;font-weight:600;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.25);transition:transform .15s,box-shadow .15s}
.sym-open-btn:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.3)}
.sym-modal{display:flex;position:fixed;inset:0;z-index:99999;background:rgba(0,0,0,.72);align-items:center;justify-content:center;padding:12px}
.sym-modal-inner{background:#1a1a2e;border-radius:16px;width:100%;max-width:460px;max-height:95dvh;overflow-y:auto;padding:20px;color:#e8e8f0;position:relative;box-shadow:0 20px 60px rgba(0,0,0,.6)}
.sym-prize-title{text-align:center;font-size:.8rem;font-weight:700;letter-spacing:.12em;color:#f4c430;text-transform:uppercase;margin-bottom:6px}
.sym-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.sym-logo{font-size:1.1rem;font-weight:800;color:#fff}.sym-logo span{color:#f4c430}
.sym-close{background:none;border:none;color:#aaa;font-size:1.3rem;cursor:pointer;padding:4px 8px;border-radius:6px}
.sym-coins-bar{background:rgba(255,255,255,.04);border-radius:12px;padding:12px 14px;margin-bottom:12px;position:relative}
.sym-coins-label{font-size:.75rem;color:#888;margin-bottom:8px;text-transform:uppercase;letter-spacing:.08em}
.sym-coins-row{display:flex;flex-wrap:wrap;gap:4px}
.sym-coin-slot{width:calc(5% - 4px);min-width:20px;aspect-ratio:1}
.sym-coin{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:.85rem;border-radius:50%;transition:transform .3s}
.sym-coin--empty{opacity:.25}.sym-coin--filled{opacity:1;animation:sym-pop .4s cubic-bezier(.17,.67,.47,1.4)}
@keyframes sym-pop{0%{transform:scale(0)}60%{transform:scale(1.3)}100%{transform:scale(1)}}
.sym-info-btn{position:absolute;top:10px;right:10px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);color:#ccc;border-radius:50%;width:24px;height:24px;font-size:.8rem;cursor:pointer}
.sym-info-popup{display:flex;position:absolute;inset:0;background:rgba(0,0,0,.8);z-index:10;align-items:center;justify-content:center;border-radius:16px;padding:20px}
.sym-info-inner{background:#16213e;border-radius:12px;padding:24px;max-width:340px;width:100%;position:relative;max-height:80vh;overflow-y:auto}
.sym-info-inner h3{color:#f4c430;margin-bottom:14px}
.sym-info-inner ul{padding-left:1.2em;line-height:1.9}
.sym-info-inner li{font-size:.9rem;color:#d0d0e0}
.sym-info-note{font-size:.78rem;color:#888;margin-top:12px}
.sym-info-close{position:absolute;top:10px;right:12px;background:none;border:none;color:#aaa;font-size:1.2rem;cursor:pointer}
.sym-player-status{display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.04);border-radius:10px;padding:8px 14px;margin-bottom:14px}
.sym-rank-badge{display:flex;align-items:center;gap:6px;font-size:.9rem;font-weight:600}
.sym-rank-icon{font-size:1.1rem}.sym-rank-name{color:#d0d0e0}
.sym-stats{display:flex;gap:14px;font-size:.78rem;color:#888}
.sym-stat-val{color:#f4c430;font-weight:700}
.sym-screen--mode h2{text-align:center;font-size:1rem;color:#d0d0e0;margin-bottom:16px}
.sym-mode-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.sym-mode-card{background:rgba(255,255,255,.05);border:1.5px solid rgba(255,255,255,.08);border-radius:12px;padding:18px 12px;text-align:center;position:relative}
.sym-mode-card--prize{border-color:rgba(244,196,48,.25)}.sym-mode-card--prize:hover{border-color:#f4c430;background:rgba(244,196,48,.06)}
.sym-mode-card--locked{opacity:.75}
.sym-mode-badge{position:absolute;top:-10px;left:50%;transform:translateX(-50%);background:#f4c430;color:#1a1a2e;font-size:.65rem;font-weight:800;padding:3px 10px;border-radius:20px;white-space:nowrap}
.sym-mode-icon{font-size:2rem;margin-bottom:8px}.sym-mode-title{font-size:.95rem;font-weight:700;margin-bottom:6px}
.sym-mode-desc{font-size:.78rem;color:#888;line-height:1.5;margin-bottom:12px}
.sym-mode-btn{background:rgba(255,255,255,.1);border:none;color:#e8e8f0;border-radius:8px;padding:8px 16px;font-size:.85rem;font-weight:600;cursor:pointer;width:100%}
.sym-mode-btn--prize{background:linear-gradient(135deg,#f4c430,#e0a800);color:#1a1a2e}
.sym-register-popup{display:flex;position:absolute;inset:0;background:rgba(0,0,0,.8);z-index:10;align-items:center;justify-content:center;border-radius:16px;padding:20px}
.sym-register-inner{background:#16213e;border-radius:12px;padding:28px 24px;max-width:300px;width:100%;text-align:center;position:relative}
.sym-register-inner h3{color:#f4c430;margin-bottom:10px}.sym-register-inner p{font-size:.88rem;color:#ccc;margin-bottom:16px}
.sym-register-close{position:absolute;top:10px;right:12px;background:none;border:none;color:#aaa;font-size:1.1rem;cursor:pointer}
.sym-register-btn{display:inline-block;background:linear-gradient(135deg,#f4c430,#e0a800);color:#1a1a2e;text-decoration:none;border-radius:8px;padding:10px 28px;font-weight:700}

/* ── Игра ── */
.sym-screen--game{padding:8px 0}
.sym-area{margin-bottom:12px}
.sym-area-label{font-size:.78rem;color:#888;text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px;display:flex;align-items:center;gap:8px}
.sym-banker-score{background:rgba(255,255,255,.1);border-radius:6px;padding:2px 8px;font-size:.88rem;color:#f4c430;font-weight:700}
.sym-cards{display:flex;flex-wrap:wrap;gap:6px;min-height:70px}

/* Счёт игрока — крупный */
.sym-score-display{text-align:center;margin:10px 0;background:rgba(255,255,255,.04);border-radius:10px;padding:10px}
.sym-score-label{font-size:.78rem;color:#888;margin-right:8px;text-transform:uppercase;letter-spacing:.06em}
.sym-score-val{font-size:1.8rem;font-weight:900;color:#52b788;transition:color .3s}
.sym-score-max{font-size:1rem;color:#666;margin-left:4px}

/* Испанские карты — немного иной стиль */
.sym-card{width:50px;height:70px;background:linear-gradient(160deg,#faf6f0,#f0e8d8);border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:4px;box-shadow:0 2px 8px rgba(0,0,0,.4);font-weight:700;animation:sym-deal .25s ease;border:1px solid rgba(0,0,0,.1)}
@keyframes sym-deal{from{transform:translateY(-16px) scale(.9);opacity:0}to{transform:none;opacity:1}}
.sym-card--back{background:linear-gradient(135deg,#6b1a1a,#9b2335);align-items:center;justify-content:center}
.sym-card--back span{font-size:1.8rem}
.sym-card--red .sym-card-rank{color:#c0392b}
.sym-card--figure{background:linear-gradient(160deg,#fff8f0,#ffe8cc)}
.sym-card-rank{font-size:.82rem;color:#111;line-height:1}
.sym-card-suit{font-size:1.2rem;line-height:1}

.sym-result-banner{text-align:center;font-size:1.2rem;font-weight:800;padding:10px 16px;border-radius:10px;margin:10px 0;animation:sym-banner .4s ease}
@keyframes sym-banner{from{transform:scale(.8);opacity:0}to{transform:none;opacity:1}}
.sym-result--win{background:rgba(45,106,79,.3);color:#52b788;border:1px solid rgba(82,183,136,.3)}
.sym-result--sym{background:rgba(244,196,48,.15);color:#f4c430;border:1px solid rgba(244,196,48,.4)}
.sym-result--bust{background:rgba(192,57,43,.2);color:#e74c3c;border:1px solid rgba(231,76,60,.3)}
.sym-result--lose{background:rgba(192,57,43,.15);color:#c0392b;border:1px solid rgba(192,57,43,.3)}
.sym-result--push{background:rgba(255,255,255,.05);color:#aaa;border:1px solid rgba(255,255,255,.1)}

.sym-actions{display:flex;gap:10px;justify-content:center;margin-top:12px}
.sym-btn{border:none;border-radius:10px;padding:12px 22px;font-size:.95rem;font-weight:700;cursor:pointer;transition:background .15s,opacity .15s}
.sym-btn--hit{background:#2d6a4f;color:#fff}.sym-btn--hit:hover{background:#3a8a64}
.sym-btn--stand{background:#6b1a1a;color:#fff}.sym-btn--stand:hover{background:#8b2020}
.sym-btn[disabled]{cursor:default}
.sym-next-actions{display:flex;gap:10px;justify-content:center;margin-top:12px}
.sym-btn--new{background:linear-gradient(135deg,#2d6a4f,#1a472a);color:#fff}
.sym-btn--menu{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);color:#ccc}

.sym-screen--champion{text-align:center;padding:20px 0}
.sym-champion-title{font-size:2rem;font-weight:900;color:#f4c430;text-shadow:0 0 20px rgba(244,196,48,.5);margin-bottom:12px}
.sym-champion-content p{font-size:.92rem;color:#ccc;margin-bottom:8px}
.sym-champion-btn{display:inline-block;background:linear-gradient(135deg,#f4c430,#e0a800);color:#1a1a2e;text-decoration:none;border-radius:10px;padding:12px 28px;font-weight:800;margin:8px 0 12px}
.sym-champion-play-btn{background:none;border:1px solid rgba(255,255,255,.15);color:#888;border-radius:8px;padding:8px 20px;font-size:.85rem;cursor:pointer;display:block;margin:0 auto}

.sym-modal-inner::-webkit-scrollbar{width:4px}
.sym-modal-inner::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:2px}

@media(max-width:420px){
    .sym-modal-inner{padding:14px}
    .sym-card{width:42px;height:60px}
    .sym-btn{padding:10px 16px;font-size:.85rem}
    .sym-coin-slot{min-width:16px}
}

/* v2: призовая карточка вырезана — единственная карточка по центру
   (сетка была на 2 колонки, и карточка прижималась влево) */
.sym-mode-cards { display: flex !important; justify-content: center; grid-template-columns: none; }
.sym-mode-cards .sym-mode-card { width: 100%; max-width: 300px; }