/* ======================================================
   Düz Okey: masa, ıstaka, taşlar, koltuklar, alt şerit ve mobil düzen 101 Okey ile aynıdır (okey101.css).
   Burada masa ve ıstaka düzenine dokunulmaz; yalnızca Düz Okey'e özgü parçalar var:
   açılan taşlar alanının yerindeki boş çuha, görseli olmayan Bitir/Gösterge düğmeleri, başlangıç özeti ve pencereler.
   ====================================================== */

/* ---------- Orta alan: düz Okey'de masaya taş açılmaz; 101'deki açılan taşlar alanının yeri boş çuha olarak kalır ---------- */
.dz-felt { grid-area: melds; align-self: stretch; min-width: 0; min-height: 140px; }

/* ---------- Görseli olmayan hamle düğmeleri: görselli düğmelerle aynı boyut ---------- */
.ok-btn.dz-btn-text {
    --btn-h: 64px;
    min-width: calc(var(--btn-h) * 252 / 230);
    min-height: var(--btn-h);
    padding: 4px 12px;
    border-radius: 12px;
    white-space: normal;
}
.ok-btn-confirm.dz-btn-text:not([aria-disabled="true"]) { background: #2f7d4f; border-color: #86d7a6; color: #fff; }
@media (max-height: 800px) and (min-width: 861px) {
    .ok-buttons .dz-btn-text { --btn-h: 60px; }
}
@media (max-width: 860px) {
    .dz-felt { min-height: 64px; }
}
@media (max-width: 520px) {
    .ok-buttons .dz-btn-text { --btn-h: min(64px, calc((100vw - 60px) / 4 * 230 / 252)); padding: 4px; font-size: 12.5px; }
}

/* ---------- Puanlar ---------- */
.dz-page .ok-score.is-low .ok-score-total { color: #ffb4ab; }

/* ---------- Başlangıç özeti ---------- */
.dz-summary {
    margin: 0 auto 6px;
    max-width: 520px;
    padding: 12px 16px;
    border-radius: 14px;
    background: rgba(0, 0, 0, .25);
    text-align: left;
}
.dz-summary-lead { margin: 0 0 8px; font-size: 14.5px; color: var(--p-sage); }
.dz-summary-lead strong { color: var(--p-cream); }
.dz-summary-table { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.dz-summary-table td { padding: 5px 4px; border-bottom: 1px solid rgba(255,255,255,.07); color: var(--p-cream); }
.dz-summary-table td:last-child { text-align: right; color: var(--p-mustard); font-weight: 700; font-variant-numeric: tabular-nums; }

/* ---------- Pencereler ---------- */
.dz-dialog { width: min(640px, calc(100vw - 32px)); }
.dz-indicator-show { display: flex; align-items: center; gap: 12px; margin: 12px 0; font-size: 22px; color: var(--p-cream); }
.dz-finish-options { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 10px; }
.dz-finish-options p { width: 100%; margin: 0; }
.dz-kind[aria-pressed="true"] { border-color: var(--p-mustard); background: rgba(229,169,59,.18); color: var(--p-mustard); }
.dz-deco { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0; }
.dz-deco-meld { display: inline-flex; flex-direction: column; gap: 3px; padding: 4px 6px 6px; border-radius: 10px; background: rgba(0,0,0,.25); }
.dz-deco-label { font-size: 11px; font-weight: 600; color: var(--p-sage); }
.dz-deco-tiles { display: flex; gap: 2px; }
.dz-deco-note { width: 100%; margin: 2px 0 0 !important; font-size: 13.5px; }
.dz-indicator-line { padding: 8px 12px; border-radius: 10px; background: rgba(229,169,59,.12); color: var(--p-cream); }
.dz-result .pg-result-table tr.is-out td, .dz-result .pg-result-table tr.is-out th { color: #ffb4ab; }
.dz-history-seat { margin-bottom: 12px; }
.dz-history-seat h3 { margin: 6px 0 !important; font-size: 17px !important; }
.dz-history-tiles { display: flex; flex-wrap: wrap; gap: 3px; min-height: 20px; font-size: 13px; }
.dz-history-tiles .is-top { outline: 2px solid var(--p-mustard); outline-offset: 1px; }
.dz-history-taken { margin: 4px 0 0 !important; font-size: 13px; color: var(--p-sage-dim); }

@media (max-width: 520px) {
    .dz-summary { padding: 10px 12px; }
}