/* Zajednički Probaj dock ostaje neutralan; font igre ne nameće se drugim igrama.
   Prata nema sva bosanska slova pa nedostajuće znakove crta Prata Fix. */
@font-face { font-family: "Prata Fix"; font-display: swap; src: url(fonts/prata-fix.woff2) format("woff2");
  unicode-range: U+0106-0107, U+010C-010D, U+0160-0161, U+017D-017E; }

:root {
  --pf-bg: #f6f1e7; --pf-bg-2: #fdfaf3; --pf-deep: #efe7d8;
  --pf-primary: #f2674a; --pf-hl: #c4472d; --pf-ink: #1d1b1e; --pf-ink-muted: #625a5d;
  --pf-paper: #fdfaf3; --pf-manila: #e2d9c9; --pf-note: #fff3b8; --pf-stamp: #c34a35;
  --pf-text: #1d1b1e; --pf-text-dim: #625a5d; --pf-line: #e2d9c9; --pf-focus: #5b3fb0;
  --pf-display: "Space Grotesk", "Rubik", system-ui, sans-serif;
  --pf-head: "Space Grotesk", "Manrope", system-ui, sans-serif;
  --pf-sans: "Manrope", "Rubik", system-ui, -apple-system, "Segoe UI", sans-serif;
  color-scheme: light;
}

/* Uvodni naslov koristi tipografiju igre; navigacija i PRO oznake i dalje Probaj. */
:root[data-pf-game="045-living-city"] { --pf-splash-title: "Literata", Georgia, serif; --pf-splash-weight: 600; }
:root[data-pf-game="120-one-line-cartoon"] { --pf-splash-title: "Pangolin", cursive; --pf-splash-weight: 400; }
:root[data-pf-game="064-ai-mafia"] { --pf-splash-title: "Playfair Display", Georgia, serif; --pf-splash-weight: 700; }
:root[data-pf-game="048-say-it-3d"] { --pf-splash-title: "Prata", "Prata Fix", Georgia, serif; --pf-splash-weight: 400; }
:root[data-pf-game="032-self-writing-game"] { --pf-splash-title: "Unbounded", "Onest", sans-serif; --pf-splash-weight: 700; }
:root[data-pf-game="101-chess-characters"] { --pf-splash-title: "Balsamiq Sans", "Rubik", sans-serif; --pf-splash-weight: 700; }
:root[data-pf-game="054-interrogation"] { --pf-splash-title: "Oswald", sans-serif; --pf-splash-weight: 600; }
:root[data-pf-game="zakuha-ga"] { --pf-splash-title: "Dela Gothic One", "Rubik", sans-serif; --pf-splash-weight: 400; }
:root[data-probaj-theme="dark"] {
  --pf-bg: #202322; --pf-bg-2: #292e2b; --pf-deep: #171a18;
  --pf-primary: #ff8369; --pf-hl: #ff8a70; --pf-ink: #f2eee4; --pf-ink-muted: #babeb5;
  --pf-paper: #292e2b; --pf-manila: #424743; --pf-note: #3a2d63; --pf-stamp: #ff8a70;
  --pf-text: #f2eee4; --pf-text-dim: #babeb5; --pf-line: #424743; --pf-focus: #c9b8f5;
  color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  :root[data-probaj-theme="auto"] {
    --pf-bg: #202322; --pf-bg-2: #292e2b; --pf-deep: #171a18;
    --pf-primary: #ff8369; --pf-hl: #ff8a70; --pf-ink: #f2eee4; --pf-ink-muted: #babeb5;
    --pf-paper: #292e2b; --pf-manila: #424743; --pf-note: #3a2d63; --pf-stamp: #ff8a70;
    --pf-text: #f2eee4; --pf-text-dim: #babeb5; --pf-line: #424743; --pf-focus: #c9b8f5;
    color-scheme: dark;
  }
}

/* Zajednički sklopivi meni ostaje, ali logo ne pluta preko gameplaya. */
.pf-dock { position: fixed; z-index: 2147482500; right: 12px; bottom: max(12px, env(safe-area-inset-bottom));
  display: flex; align-items: center; gap: 6px; padding: 5px 6px; max-width: calc(100vw - 24px);
  background: var(--pf-paper); color: var(--pf-text); border: 1.5px solid var(--pf-line); border-radius: 14px;
  box-shadow: 0 3px 0 #a98bf0, 0 8px 24px #0004; font: 500 13px/1 var(--pf-sans); }
.pf-dock a, .pf-dock button { font: 600 12.5px/1 var(--pf-sans); letter-spacing: .01em; }
/* Sklopivi zajednički meni: mali pristupačan jezičak umjesto stalnog prekrivanja igre. */
.pf-toggle { min-width: 42px; min-height: 40px; display: grid; place-items: center;
  border: 1px solid var(--pf-line); border-radius: 10px; background: var(--pf-bg-2);
  color: var(--pf-text); cursor: pointer; font-size: 22px !important; }
.pf-toggle:hover { background: var(--pf-manila); }
.pf-toggle:focus-visible { outline: 2px solid var(--pf-focus); outline-offset: 2px; }
.pf-dock.pf-collapsed { top: auto !important; bottom: max(12px, env(safe-area-inset-bottom)) !important;
  right: 6px; padding: 4px; transform: none; width: auto; max-width: none; }
.pf-dock.pf-collapsed > :not(.pf-toggle) { display: none !important; }
.pf-home { display: inline-flex; align-items: center; gap: 6px; color: var(--pf-text); text-decoration: none;
  padding: 8px 10px; border-radius: 9px; white-space: nowrap; }
.pf-home:hover, .pf-home:focus-visible { background: var(--pf-bg-2); color: var(--pf-text); outline: none; }
.pf-home b { font: 700 13px/1 var(--pf-head); color: var(--pf-primary); letter-spacing: .02em; }
.pf-report {display:inline-flex;align-items:center;gap:5px;padding:8px 9px;border-radius:9px;text-decoration:none;color:var(--pf-hl);font:750 12px/1 var(--pf-sans);white-space:nowrap}
.pf-report:hover,.pf-report:focus-visible{background:var(--pf-bg-2);color:var(--pf-text);outline:2px solid var(--pf-focus);outline-offset:1px}
.pf-report b{font:700 12px/1 var(--pf-sans)}
.pf-sep { width: 1px; align-self: stretch; margin: 3px 0; background: var(--pf-line); }
.pf-lang { display: inline-flex; gap: 2px; }
.pf-lang button { border: 0; background: transparent; color: var(--pf-text-dim); min-width: 34px; min-height: 30px;
  border-radius: 9px; cursor: pointer; }
.pf-lang button:hover { background: var(--pf-bg-2); color: var(--pf-text); }
.pf-lang button[aria-pressed="true"] { background: var(--pf-primary); color: #231a18; }
.pf-lang button:focus-visible, .pf-home:focus-visible { outline: 2px solid var(--pf-focus); outline-offset: 2px; }
.pf-theme {border:1px solid var(--pf-line);border-radius:9px;background:var(--pf-bg-2);color:var(--pf-text);cursor:pointer;min-width:34px;min-height:30px;font:650 12px var(--pf-sans);}
.pf-theme:focus-visible {outline:2px solid var(--pf-focus);outline-offset:2px;}
.pf-stamp { font: 700 11px/1 var(--pf-head); letter-spacing: .08em; text-transform: uppercase; color: var(--pf-hl);
  border: 1.5px solid var(--pf-primary); border-radius: 7px; padding: 5px 7px; white-space: nowrap; transform: rotate(-2deg); }
/* Prijava na Probaj u docku: ime naloga i plan (Pro/Free), ili "Prijava" za gosta */
.pf-acct { display: inline-flex; align-items: center; gap: 6px; max-width: 220px; padding: 6px 8px; border-radius: 9px;
  color: var(--pf-text); text-decoration: none; font: 600 12.5px/1 var(--pf-sans); white-space: nowrap; border: 1.5px solid var(--pf-line); }
.pf-acct:hover, .pf-acct:focus-visible { background: var(--pf-bg-2); color: var(--pf-text); outline: none; }
.pf-acct:focus-visible { outline: 2px solid var(--pf-focus); outline-offset: 2px; }
.pf-acct i { width: 8px; height: 8px; border-radius: 50%; background: #3ccb7f; box-shadow: 0 0 0 3px #3ccb7f33; flex: none; }
.pf-acct-name { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.pf-acct b { flex: none; font: 700 11px/1 var(--pf-head); letter-spacing: .08em; text-transform: uppercase; padding: 4px 6px; border-radius: 6px;
  background: var(--pf-bg-2); color: var(--pf-text); }
.pf-acct.pf-pro { border-color: var(--pf-primary); }
.pf-acct.pf-pro b { background: var(--pf-primary); color: #231a18; }
.pf-acct.pf-guest { color: var(--pf-hl); border-color: var(--pf-primary); }
/* Uski ekrani: dock postaje jezičak uz desni rub (sredina visine), da ne prekriva kontrole igara dolje */
@media (max-width: 760px) {
  .pf-dock.pf-collapsed { top: 52% !important; bottom: auto !important; right: 0;
    transform: translateY(-50%); border-radius: 12px 0 0 12px; border-right: 0; padding: 4px 3px 4px 4px; }
  .pf-dock.pf-collapsed .pf-toggle { min-width: 38px; min-height: 44px; }
  .pf-dock { top: 50%; bottom: auto; right: 0; transform: translateY(-50%); flex-direction: column; gap: 3px; padding: 5px 4px;
    border-right: 0; border-radius: 12px 0 0 12px; box-shadow: -3px 0 0 var(--pf-primary), 0 8px 24px #0007; }
  .pf-home { padding: 8px 9px; } .pf-home b { display: none; } .pf-home span { font-size: 15px; }
  .pf-report {padding:8px 9px}.pf-report b{display:none}
  .pf-sep { width: auto; height: 1px; align-self: stretch; margin: 0 3px; }
  .pf-lang { flex-direction: column; }
  .pf-stamp { display: none; }
  .pf-acct { flex-direction: column; gap: 4px; padding: 6px 4px; max-width: none; }
  .pf-acct-name { display: none; }
  .pf-acct b { font-size: 9.5px; padding: 3px 4px; }
  .pf-acct.pf-guest { font-size: 10px; padding: 6px 3px; }
}

/* Ulazni ekran (kao u Micro-Management): naslov igre, kratko "učitavam" */
.pf-splash { position: fixed; inset: 0; z-index: 2147483000; display: grid; place-content: center; text-align: center;
  gap: 14px; background: radial-gradient(ellipse at 50% 40%, color-mix(in srgb, var(--pf-primary) 12%, var(--pf-bg)) 0, var(--pf-bg) 60%, var(--pf-deep) 100%);
  color: var(--pf-text); transition: opacity .45s ease, visibility .45s; }
.pf-splash.pf-out { opacity: 0; visibility: hidden; }
.pf-splash h2 { margin: 0; font: var(--pf-splash-weight,700) clamp(26px, 5vw, 57px)/1.14 var(--pf-splash-title,var(--pf-display)); letter-spacing: -.025em; text-transform: none; padding: 0 18px; max-width: min(820px,94vw); overflow-wrap: break-word; }
.pf-splash p { margin: 0; font: 500 15px/1.4 var(--pf-sans); color: var(--pf-text-dim); }
.pf-splash .pf-bar { width: min(260px, 60vw); height: 6px; border-radius: 6px; margin: 4px auto 0; background: var(--pf-manila); overflow: hidden; }
.pf-splash .pf-bar i { display: block; width: 40%; height: 100%; background: var(--pf-primary); border-radius: 6px; animation: pf-run 1.1s ease-in-out infinite; }
@keyframes pf-run { 0% { transform: translateX(-100%); } 100% { transform: translateX(260%); } }
.pf-splash small { font: 700 11px/1 var(--pf-head); letter-spacing: .1em; color: var(--pf-hl); text-transform: uppercase; }
@media (prefers-reduced-motion: reduce) { .pf-splash .pf-bar i { animation: none; width: 100%; } .pf-splash { transition: none; } }

/* Oznaka režima u igri kad pravi AI radi (AI.paintBadge u _ai/ai.js): isti izgled u svakoj igri */
.pf-ai-pro { background: #ffd23f !important; color: #1e2230 !important; border-color: #1e2230 !important; }
.pf-ai-pro * { color: #1e2230 !important; }

/* Igra koja još nema potpun engleski: EN dugme je isključeno. */
.pf-lang button:disabled { opacity: .4; cursor: not-allowed; }
.pf-lang button:disabled:hover { background: transparent; color: var(--pf-text-dim); }