body { --game-accent:#567ba0; --game-soft:#eaf3fa; background:radial-gradient(ellipse at 85% 0%,var(--game-soft),transparent 650px); }
body[data-game="detektiv"] { --game-accent:#54826b; --game-soft:#e6f3e9; }
body[data-game="tovarna"] { --game-accent:#a27141; --game-soft:#fff0db; }
.game-brand-mark { color:var(--game-accent); background:var(--game-soft); font-weight:900; }
.thinking-card { max-width:940px; margin:0 auto; padding:clamp(16px,3vw,30px); }
.level-picker { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin-bottom:24px; }
.level-picker button { min-height:52px; padding:10px; border:2px solid #e1e8e0; border-radius:13px; background:#fafcf8; color:#43594d; font-weight:850; }
.level-picker button[aria-pressed="true"] { border-color:var(--game-accent); background:var(--game-soft); color:#304e44; }
.level-picker button:disabled { cursor:default; }
.challenge-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; }
.challenge-head h2 { margin:0; font-size:1.15rem; }
.round-label { margin:0 0 5px; color:var(--game-accent); font-size:.75rem; font-weight:850; text-transform:uppercase; letter-spacing:.09em; }
.stars-score { display:grid; justify-items:center; min-width:85px; padding:10px 14px; background:var(--game-soft); border-radius:15px; }
.stars-score strong { font-size:1.8rem; line-height:1; color:var(--game-accent); }
.stars-score span { margin-top:6px; font-size:.7rem; white-space:nowrap; }
.round-progress { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px; margin-bottom:22px; }
.round-progress span { display:grid; place-items:center; min-height:27px; border-radius:8px; background:#f0f3ec; color:var(--filipika-muted,#59485a); font-size:.72rem; letter-spacing:1px; }
.round-progress .done { background:#fff0c9; color:#99641f; }
.round-progress .current { outline:2px solid var(--game-accent); outline-offset:1px; }
.thinking-instructions { margin:0 0 18px; color:#53685a; font-size:.9rem; line-height:1.6; }
.thinking-instructions p { margin:0; }
.thinking-instructions ul { margin:0; padding-left:21px; }
.game-board { min-height:220px; padding:clamp(12px,2.2vw,24px); border:1px solid #dde6d9; border-radius:18px; background:#fbfcf8; }
.game-board:focus { outline:none; }
.game-board button { touch-action:manipulation; }
.game-board button:focus-visible { outline:3px solid var(--game-accent); outline-offset:3px; }
.demo-help { margin:17px 0; text-align:center; color:#60735f; font-size:.88rem; line-height:1.6; }
.round-feedback { display:grid; justify-items:center; gap:5px; margin:22px 0; padding:20px; border-radius:17px; background:#eef8ee; color:#2e704f; text-align:center; }
.round-feedback[data-wrong] { color:#a44d36; background:#fff0e9; }
#feedback-symbol { font:900 72px/1 system-ui,sans-serif; }
.round-feedback h3,.round-feedback p { margin:0; }
#round-stars { color:#9b691f; font-size:1.55rem; letter-spacing:5px; }
#feedback-explanation { color:#526956; font-size:.9rem; line-height:1.6; margin-top:6px; }
.thinking-summary { padding:23px; margin:20px 0; border-radius:17px; text-align:center; background:var(--game-soft); }
.thinking-summary h3 { margin:0 0 20px; }
.result-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.result-grid div { display:grid; gap:6px; }
.result-grid strong { color:var(--game-accent); font-size:clamp(1.2rem,4vw,1.8rem); }
.result-grid span { color:#61705f; font-size:.75rem; }
.actions { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:10px; margin-top:23px; }
#next { min-height:56px; padding:12px 25px; border-radius:15px; font-size:1rem; }
#save-status { min-height:1.5em; text-align:center; }
#retry { display:block; margin:10px auto 0; }
@media(max-width:520px) { .game-board { padding:12px; }.thinking-card { padding:16px; }.thinking-summary { padding:19px 10px; }.challenge-head h2 { font-size:1rem; }.level-picker { gap:6px; }.round-progress span { font-size:.6rem; letter-spacing:0; }.stars-score { min-width:70px; }.result-grid { gap:5px; } }