/* Jocul iese din coloana temei și folosește toată lățimea ferestrei. */
.pp-game { box-sizing: border-box; width: calc(100vw - 24px); max-width: none; margin: 1.5em 0 1.5em calc(50% - 50vw + 12px); }

.pp-bar { display: flex; flex-wrap: wrap; gap: .5em; align-items: center; margin-bottom: .75em; }
.pp-select, .pp-btn { padding: .45em .8em; font-size: 1rem; border: 1px solid #c3c4c7; border-radius: 4px; background: #fff; color: #1d2327; cursor: pointer; }
.pp-btn:hover, .pp-select:hover { background: #f0f0f1; }
.pp-stats { margin-left: auto; font-variant-numeric: tabular-nums; color: #50575e; }

.pp-holder { display: block; width: 100%; }
.pp-game svg.pp-board { display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; max-height: calc(100vh - 120px); min-height: 120px; visibility: visible !important; }
.pp-board { background: #e8e8e8; border-radius: 6px; user-select: none; -webkit-user-select: none; touch-action: none; }
.pp-tray { fill: #f0f0f1; }
.pp-frame { fill: #fff; stroke: #8c8f94; stroke-width: 3; stroke-dasharray: 14 8; }
.pp-ghost { opacity: .14; pointer-events: none; transition: opacity .2s; }
.pp-show-preview .pp-ghost { opacity: .7; }
.pp-piece { cursor: grab; }
.pp-piece.pp-locked { cursor: default; pointer-events: none; }
.pp-edge-light { fill: none; stroke: rgba(255, 255, 255, .55); stroke-width: 3; pointer-events: none; }
.pp-edge-dark { fill: none; stroke: rgba(0, 0, 0, .4); stroke-width: 1.2; pointer-events: none; }
.pp-piece.pp-drag { cursor: grabbing; filter: drop-shadow(0 8px 12px rgba(0, 0, 0, .45)); }
.pp-solved .pp-edge-light, .pp-solved .pp-edge-dark { opacity: 0; transition: opacity .6s; }
.pp-solved .pp-frame { stroke: none; }

.pp-notice { margin: 0; padding: .75em 1em; background: #f6f7f7; border-left: 4px solid #8c8f94; color: #1d2327; }
.pp-win { margin-top: .75em; padding: .75em 1em; background: #edfaef; border-left: 4px solid #00a32a; color: #1d2327; }

.pp-gallery { display: grid; grid-template-columns: repeat(var(--pp-cols, 3), 1fr); gap: 1em; }
.pp-card { position: relative; display: block; text-decoration: none; color: inherit; border-radius: 6px; overflow: hidden; background: #f6f7f7; }
.pp-card img { display: block; width: 100%; height: auto; }
.pp-card-title { display: block; padding: .5em .75em; font-weight: 600; }
.pp-badge { position: absolute; top: .5em; right: .5em; padding: .15em .6em; border-radius: 999px; background: rgba(0, 0, 0, .7); color: #fff; font-size: .85rem; }

@media (max-width: 600px) {
	.pp-gallery { grid-template-columns: repeat(2, 1fr); }
	.pp-stats { margin-left: 0; width: 100%; }
}

/* Pe pagina puzzle-ului nu se afișează timpul de citire. */
.single-pp_puzzle .wp-block-post-time-to-read, .single-pp_puzzle .reading-time, .single-pp_puzzle .entry-reading-time, .single-pp_puzzle .post-reading-time, .single-pp_puzzle .rt-reading-time { display: none !important; }

/* Șablonul paginii unui puzzle. */
body.pp-template { margin: 0; background: #fff; }
.pp-page { box-sizing: border-box; width: 100%; padding: 10px 12px 16px; }
.pp-page-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25em 1em; margin-bottom: .5em; }
.pp-page-title { margin: 0; font-size: 1.4rem; line-height: 1.3; }
.pp-back { text-decoration: none; color: #2271b1; }
.pp-back:hover { text-decoration: underline; }
.pp-page .pp-game { width: 100%; margin: 0; }