
.pr15puzzle * { box-sizing: border-box; }
.pr15puzzle { --bg:#0f172a; --panel:#111827; --accent:#38bdf8; --tile:#1f2937; --tileText:#f9fafb; --muted:#94a3b8; --win:#22c55e; color: var(--tileText); font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji"; }
.pr15puzzle .wrap{ width: min(92vw, 760px); margin: 0 auto; }
.pr15puzzle .header{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.75rem; margin-bottom:1rem;}
.pr15puzzle .title{ font-size:clamp(1.2rem,2.4vw + .6rem,1.8rem); font-weight:700; letter-spacing:.3px; }
.pr15puzzle .stats{ display:flex; gap:1rem; font-variant-numeric:tabular-nums; color:var(--muted); }
.pr15puzzle .board{ background:linear-gradient(180deg,#0b1220,var(--panel)); padding:14px; border-radius:18px; box-shadow:0 10px 25px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,255,255,.06); }
.pr15puzzle .grid{ width:min(92vw, 520px); height:min(92vw, 520px); display:grid; grid-template-columns:repeat(4,1fr); grid-template-rows:repeat(4,1fr); gap:10px; }
.pr15puzzle .tile{ display:grid; place-items:center; background:var(--tile); border-radius:14px; font-size:clamp(1.4rem,4vw + .6rem,2.4rem); font-weight:800; user-select:none; cursor:pointer; transition:transform .1s ease, box-shadow .1s ease, background .2s ease; box-shadow:0 6px 14px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.05); }
.pr15puzzle .tile:active{ transform:scale(.98); }
.pr15puzzle .tile:hover{ box-shadow:0 10px 22px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,255,255,.08); }
.pr15puzzle .empty{ background:transparent; box-shadow:none; cursor:default; }
.pr15puzzle .controls{ display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1rem; }
.pr15puzzle button, .pr15puzzle select{ background:#0b1220; color:var(--tileText); border:1px solid rgba(148,163,184,.3); padding:.6rem .9rem; border-radius:12px; font-weight:600; cursor:pointer; }
.pr15puzzle button:hover{ border-color:var(--accent); }
.pr15puzzle .cta{ background:var(--accent); color:#00111a; border-color:transparent; }
.pr15puzzle .cta:hover{ filter:brightness(1.05); }
.pr15puzzle .toast{ margin-top:.75rem; color:var(--muted); font-size:.95rem; }
.pr15puzzle .win{ color:var(--win); font-weight:700; }
.pr15puzzle .grid.image-mode .tile{ background-size:400% 400%; background-position:center; font-size:0; }
.pr15puzzle .grid.image-mode .tile.empty{ background:transparent; }
@media (prefers-color-scheme: light) {
  .pr15puzzle { --bg:#f8fafc; --panel:#f1f5f9; --tile:#e2e8f0; --tileText:#0f172a; --muted:#475569; }
}
