.game-sifreli-bulmaca {
  --g-bg: #f1e2b8;
  --g-surface: #fffaf0;
  --g-ink: #2b2b2b;
  --g-muted: #655943;
  --g-accent: #b3261e;
  --g-line: #c4af7d;
  --sb-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}
.game-sifreli-bulmaca .game-landing-preview { border: 2px solid var(--g-line); border-bottom: 5px solid var(--g-accent); border-radius: 10px; }
.game-sifreli-bulmaca .game-landing h1 { font-family: ui-serif, "New York", Georgia, "Times New Roman", serif; }
.game-sifreli-bulmaca .game-player-bar { border-bottom: 2px solid var(--g-line); }
.game-sifreli-bulmaca .game-player-slot button { font-size: 13px; padding-inline: 10px; }
.sb-desk { max-width: 510px; }
.sb-clue { margin: 0 0 12px; font: 16px/1.4 ui-serif, "New York", Georgia, "Times New Roman", serif; text-align: center; }
.sb-code-sheet { padding: 14px 0; border-block: 1px solid var(--g-line); background: var(--g-surface); }
.sb-phrase { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 16px; }
.sb-word { display: flex; flex-wrap: wrap; justify-content: center; gap: 3px; max-width: 100%; }
.sb-tile { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 44px; height: 62px; padding: 0; border: 1px solid var(--g-line); border-radius: 2px; background: #fff; color: var(--g-ink); cursor: pointer; }
.sb-tile-number { font: 700 13px/1.4 var(--sb-mono); color: var(--g-muted); }
.sb-tile-letter { font: 800 25px/1.3 var(--sb-mono); }
.sb-tile.is-selected { border: 2px solid var(--g-accent); background: #ffe4cf; }
.sb-tile.is-locked { background: #e9dfc5; }
.sb-tile.is-wrong { background: #ffd1c9; border-color: var(--g-accent); }
.sb-tile.is-solved { border-color: var(--g-accent); }
.sb-input-head { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 12px 0; font-size: 13px; }
.sb-input-head strong { color: var(--g-accent); font: 800 20px var(--sb-mono); }
.sb-keyboard { display: grid; gap: 5px; }
.sb-key-row { display: flex; justify-content: center; gap: 5px; }
.sb-key-row button { flex: 1; min-width: 44px; height: 44px; padding: 0; border: 1px solid #b2a180; border-radius: 4px; background: var(--g-surface); color: var(--g-ink); font: 700 19px var(--sb-mono); box-shadow: 0 2px 0 #b2a180; cursor: pointer; }
.sb-key-row button:active { transform: translateY(2px); box-shadow: none; }
.sb-key-row .is-current { background: var(--g-accent); color: #fff; }
.sb-key-row button:disabled { opacity: .55; }
.sb-message { display: grid; place-items: center; min-height: 38px; margin: 8px 0; font-size: 13px; }
.sb-message[data-kind="success"] { padding: 8px; border: 2px solid var(--g-accent); font-weight: 800; }
.sb-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.sb-actions .game-btn-primary { grid-column: 1 / -1; }
.game-sifreli-bulmaca .game-levels { max-width: 510px; margin-top: 20px; }
.sb-levels button { font-family: var(--sb-mono); border-radius: 3px; }
.sb-levels button.is-done::after { content: " ✓"; }
.sb-levels button.is-current { border-color: var(--g-accent); background: var(--g-accent); color: #fff; }
.sb-example { margin-block: 18px; padding: 16px; border: 1px solid var(--g-line); background: var(--g-surface); text-align: center; }
.sb-example > span { display: block; font: 700 20px/1.5 var(--sb-mono); }
.game-sifreli-bulmaca .game-how h2 { margin-top: 28px; }
@media (min-width: 720px) {
  .sb-code-sheet { padding: 20px 10px; }
  .sb-tile { width: 48px; height: 66px; }
  .sb-clue { font-size: 18px; }
}
@media (min-width: 1080px) {
  .game-sifreli-bulmaca .game-player { max-width: 700px; }
}
