/*
 * Modern görünüm (varsayılan): aydınlık kabuk, düz renkler, sade bileşenler. Klasik ahşap görünüm
 * ayarlardan seçilince html.ui-classic ile eski stiller geçerli kalır; bu dosya yalnızca
 * html.ui-modern altında çalışır. Oyun kuralları ve yerleşim değişmez, sadece renk ve doku.
 */
html.ui-modern {
  --bg: #f6f1e7; --bg2: #ffffff; --panel-1: #ffffff; --panel-2: #f1ebdf;
  --line: rgba(0, 0, 0, .1); --line-strong: rgba(0, 0, 0, .18);
  --text: #1d140c; --muted: #6b5a44; --gold: #c2402f; --gold-light: #1d140c; --gold-dark: #8a6224; --cream: #1d140c;
  --green-1: #2fbd5a; --green-2: #1f8f42; --red-1: #d9534f; --red-2: #b02a26; --blue-1: #3a6fc0; --blue-2: #1c3a73;
  --shadow: 0 10px 30px rgba(0, 0, 0, .12);
}
html.ui-modern body { background: #f6f1e7; color: var(--text); }

/* Paneller: ahşap yerine beyaz kart */
html.ui-modern .menu-card, html.ui-modern .modal-card { background: #fff; box-shadow: 0 16px 40px rgba(0, 0, 0, .14), inset 0 0 0 1px rgba(0, 0, 0, .06); }
html.ui-modern .menu-card::before, html.ui-modern .modal-card::before { display: none; }
html.ui-modern .card-title, html.ui-modern .modal-card h2 { color: #1d140c; font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; letter-spacing: -.3px; }
html.ui-modern h3 { color: #8a6224; font-family: system-ui, sans-serif; }
html.ui-modern .modal-card p, html.ui-modern .rules p, html.ui-modern .rules li { color: #3d3226; }
html.ui-modern .hint { color: #6b5a44; }
html.ui-modern .gold-hint { color: #8a6224; }
html.ui-modern .field input, html.ui-modern .join-row input, html.ui-modern .field select { background: #faf7f0; color: #1d140c; box-shadow: none; border-color: rgba(0, 0, 0, .14); }
html.ui-modern .back { color: #6b5a44; }

/* Butonlar: düz, yuvarlak, tek renk */
html.ui-modern .btn { background: #f1ebdf; color: #1d140c; border-color: rgba(0, 0, 0, .1); box-shadow: 0 2px 0 rgba(0, 0, 0, .08); text-shadow: none; }
html.ui-modern .btn-green { background: linear-gradient(180deg, #2fbd5a, #1f8f42); color: #fff; }
html.ui-modern .btn-red { background: linear-gradient(180deg, #d9534f, #b02a26); color: #fff; }
html.ui-modern .btn-gold { background: #1d140c; color: #fff; border-color: #1d140c; text-shadow: none; }
html.ui-modern .tile { background: #faf7f0; color: #1d140c; border-color: rgba(0, 0, 0, .08); }
html.ui-modern .seg { background: #f1ebdf; border-color: rgba(0, 0, 0, .08); }
html.ui-modern .seg button { color: #6b5a44; }
html.ui-modern .seg button .stars { color: #c2402f; }
html.ui-modern .seg button.on { background: #1d140c; color: #fff; border-color: #1d140c; box-shadow: none; }
html.ui-modern .seg button.on .stars { color: #ffd27a; }
html.ui-modern .divider { color: #6b5a44; }
html.ui-modern .divider::before, html.ui-modern .divider::after { background: rgba(0, 0, 0, .1); }
html.ui-modern .code { color: #1d140c; text-shadow: none; }
html.ui-modern .spinner { border-color: rgba(0, 0, 0, .1); border-top-color: #1f8f42; }
html.ui-modern .lang-switch button { background: #f1ebdf; color: #6b5a44; border-color: rgba(0, 0, 0, .1); }
html.ui-modern .lang-switch button.on { background: #1d140c; color: #fff; border-color: #1d140c; }

/* Ayarlar */
html.ui-modern .setting-row { background: #faf7f0; border-color: rgba(0, 0, 0, .08); }
html.ui-modern .setting-row .icon { filter: none; }
html.ui-modern .toggle i { background: #d8d0bf; border-color: transparent; box-shadow: none; }
html.ui-modern .toggle i::after { background: #fff; }
html.ui-modern .toggle input:checked + i { background: #1f8f42; }
html.ui-modern .theme-sw { background: #faf7f0; border-color: rgba(0, 0, 0, .1); color: #6b5a44; }
html.ui-modern .theme-sw.on { border-color: #1d140c; color: #1d140c; box-shadow: none; }

/* Rekor tablosu */
html.ui-modern .table-wrap { background: #fff; border-color: rgba(0, 0, 0, .08); }
html.ui-modern .lb thead th { background: #f1ebdf; color: #6b5a44; border-color: rgba(0, 0, 0, .08); }
html.ui-modern .lb tbody tr { border-color: rgba(0, 0, 0, .06); }
html.ui-modern .lb tbody tr:nth-child(odd) { background: #faf7f0; }
html.ui-modern .lb td:nth-child(3) { color: #1d140c; }
html.ui-modern .lb tr.me td { background: #e3f6e8; color: #1d140c; }

/* Oyun ekranı */
html.ui-modern #game { background: #f6f1e7; }
html.ui-modern .icon-btn { background: #fff; border-color: rgba(0, 0, 0, .1); color: #1d140c; box-shadow: 0 2px 6px rgba(0, 0, 0, .08); }
html.ui-modern .player { color: #1d140c; }
html.ui-modern .player .pip, html.ui-modern .pinfo .meta { color: #6b5a44; }
html.ui-modern .rating-pill { color: #8a6224; }
html.ui-modern .player.active { background: #fff; border-color: #2fbd5a; box-shadow: 0 0 0 3px rgba(47, 189, 90, .18); }
html.ui-modern .scoreboard { background: #fff; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08), 0 4px 12px rgba(0, 0, 0, .08); }
html.ui-modern .score-tile { border-color: rgba(0, 0, 0, .12); box-shadow: none; font-family: system-ui, sans-serif; }
html.ui-modern .score-tile.c0 { background: #faf7f0; color: #1d140c; }
html.ui-modern .score-tile.c1 { background: #1d140c; color: #fff; }
html.ui-modern #matchText { color: #6b5a44; }
html.ui-modern .ctrl-btn { background: #fff; color: #1d140c; border-color: rgba(0, 0, 0, .12); box-shadow: 0 2px 0 rgba(0, 0, 0, .08), 0 6px 14px rgba(0, 0, 0, .08); }
html.ui-modern .ctrl-btn .icon { color: #1d140c; }
html.ui-modern .ctrl-btn.primary { background: linear-gradient(180deg, #2fbd5a, #1f8f42); color: #fff; border-color: transparent; }
html.ui-modern .ctrl-btn.cube { background: #1d140c; color: #fff; border-color: #1d140c; }
html.ui-modern .status { color: #6b5a44; }
html.ui-modern #statusText { color: #1d140c; }
html.ui-modern .turn-pill { background: #fff; color: #1d140c; border-color: rgba(0, 0, 0, .12); }
html.ui-modern .turn-pill.me { background: #1f8f42; color: #fff; border-color: #1f8f42; }
html.ui-modern .turn-pill.opp { background: #1d140c; color: #fff; border-color: #1d140c; }
html.ui-modern .turn-pill.opp .dot { border-color: #fff; }
html.ui-modern .turn-pill.roll { background: #c2402f; color: #fff; border-color: #c2402f; }
html.ui-modern .fair-badge { background: #e3f6e8; color: #1f8f42; border-color: rgba(31, 143, 66, .35); }
html.ui-modern .fair-badge.verified { background: #1f8f42; color: #fff; }
html.ui-modern .coach-line.good { background: #e3f6e8; color: #1f8f42; }
html.ui-modern .coach-line.minor { background: #fff3cf; color: #8a6224; }
html.ui-modern .coach-line.error { background: #ffe6d6; color: #b4531a; }
html.ui-modern .coach-line.blunder { background: #ffe0dd; color: #b02a26; }
html.ui-modern .timer { color: #6b5a44; }

/* Tahta üstü yazılar ve rozetler */
html.ui-modern svg.board .badge circle { fill: #1d140c; stroke: #fff; }
html.ui-modern svg.board .badge-text { fill: #fff; font-family: system-ui, sans-serif; }
html.ui-modern svg.board .tray-count { fill: #1d140c; font-family: system-ui, sans-serif; }
html.ui-modern svg.board .ring.src { stroke: #1f8f42; }
html.ui-modern svg.board .ring.sel { stroke: #2fbd5a; }
html.ui-modern svg.board .target-pt, html.ui-modern svg.board .target-tray { fill: #2fbd5a; }
html.ui-modern svg.board .target { stroke: #1f8f42; }
html.ui-modern svg.board .cube-face { fill: #fff; stroke: #1d140c; }
html.ui-modern svg.board .cube-text { fill: #1d140c; font-family: system-ui, sans-serif; }
html.ui-modern svg.board .roll-prompt rect { fill: #fff; stroke: #1d140c; }
html.ui-modern svg.board .roll-prompt text, html.ui-modern svg.board .roll-prompt-label { fill: #1d140c; }

/* Oyun sonu ve bildirim */
html.ui-modern .modal { background: rgba(29, 20, 12, .45); }
html.ui-modern .modal-card.win { background: linear-gradient(180deg, #e3f6e8, #fff); box-shadow: 0 16px 40px rgba(0, 0, 0, .18), inset 0 0 0 2px #2fbd5a; }
html.ui-modern .modal-card.win h2 { background: none; color: #1f8f42; -webkit-text-fill-color: #1f8f42; }
html.ui-modern .modal-card.lose { background: linear-gradient(180deg, #eef0f5, #fff); box-shadow: 0 16px 40px rgba(0, 0, 0, .18), inset 0 0 0 2px #8a93a8; }
html.ui-modern .modal-card.lose h2 { color: #3a4254; }
html.ui-modern .mars-badge { background: #1d140c; color: #fff; }
html.ui-modern .points-earned { color: #1f8f42 !important; }
html.ui-modern .score-row figcaption, html.ui-modern .score-row .vs { color: #6b5a44; }
html.ui-modern .toast { background: #1d140c; border-color: transparent; }
html.ui-modern .toast.success { background: #1f8f42; } html.ui-modern .toast.error { background: #b02a26; } html.ui-modern .toast.gold { background: #8a6224; }
html.ui-modern .fair-body dt { color: #8a6224; }
html.ui-modern .fair-body dd { color: #3d3226; }
html.ui-modern .coach-report .acc { color: #1d140c; }
html.ui-modern .emote-bubble { background: #1d140c; color: #fff; }
html.ui-modern .emote-bar button { background: #faf7f0; border-color: rgba(0, 0, 0, .1); }
html.ui-modern svg.board .fx-ripple { stroke: #1f8f42; }
html.ui-modern svg.board .fx-ripple.hit { stroke: #c2402f; }
html.ui-modern svg.board .fx-trail { stroke: #1d140c; }