.ghep-tranh{--ghep-tranh-frame:#120a0e;--ghep-tranh-frame-line:#e8c56a8c;--ghep-tranh-grid:#e8c56a29;--ghep-tranh-tray:#f5e8c70d;--ghep-tranh-edge:#12080c8c;--ghep-tranh-shadow:#00000073;--ghep-tranh-lift:#f2c94c;--ghep-tranh-focus:#ffd86b;--ghep-tranh-blank:#3a2430;border:1px solid var(--tro-choi-line);background:var(--tro-choi-paper-soft);border-radius:20px;gap:.8rem;max-width:1040px;margin:2rem auto 0;padding:clamp(.75rem,3vw,1.6rem);display:grid;position:relative}html[data-theme=light] .ghep-tranh{--ghep-tranh-frame:#e9dcc0;--ghep-tranh-frame-line:#8a5a1299;--ghep-tranh-grid:#5a3a1a29;--ghep-tranh-tray:#2a1c190d;--ghep-tranh-edge:#2a1c1973;--ghep-tranh-shadow:#2a1c194d;--ghep-tranh-lift:#8a5a12;--ghep-tranh-focus:#9a2f3b;--ghep-tranh-blank:#d8c6a4}.ghep-tranh__preview{border:1px dashed var(--tro-choi-gold);color:var(--tro-choi-gold);border-radius:12px;margin:0;padding:.6rem .9rem;font-size:.92rem;font-weight:700}.ghep-tranh__title{font:600 clamp(1.2rem, 4.2vw, 1.55rem) / 1.3 var(--font-serif,Lora, "Lora fallback", Georgia, serif);text-align:center;margin:.2rem 0 0}.ghep-tranh__note{color:var(--tro-choi-copy);background:var(--tro-choi-paper);border-radius:12px;margin:0;padding:.6rem .9rem;font-size:.95rem}.ghep-tranh__loading{color:var(--tro-choi-muted);text-align:center;margin:2rem 0}.ghep-tranh__setup{gap:.5rem;display:grid}.ghep-tranh__choices{flex-wrap:wrap;justify-content:center;gap:.4rem;display:flex}.ghep-tranh__chip,.ghep-tranh__secondary,.ghep-tranh__toggle,.ghep-tranh__primary{border:1px solid var(--tro-choi-line);min-height:44px;color:var(--tro-choi-ink);background:var(--tro-choi-paper);font:inherit;cursor:pointer;border-radius:999px;padding:.5rem .95rem;font-size:.95rem;font-weight:700}.ghep-tranh__chip[aria-pressed=true],.ghep-tranh__toggle[aria-pressed=true]{border-color:var(--tro-choi-gold);color:var(--tro-choi-gold)}.ghep-tranh__chip[aria-pressed=true]:before,.ghep-tranh__toggle[aria-pressed=true]:before{content:"✓ "}.ghep-tranh__primary{border-color:var(--tro-choi-gold);color:var(--tro-choi-bg);background:var(--tro-choi-gold)}.ghep-tranh__chip:hover,.ghep-tranh__secondary:hover:not(:disabled),.ghep-tranh__toggle:hover:not(:disabled){border-color:var(--tro-choi-gold)}.ghep-tranh__secondary:disabled,.ghep-tranh__toggle:disabled{opacity:.55;cursor:default}.ghep-tranh__chip:focus-visible,.ghep-tranh__secondary:focus-visible,.ghep-tranh__toggle:focus-visible,.ghep-tranh__primary:focus-visible,.ghep-tranh__end h3:focus-visible{outline:3px solid var(--tro-choi-son);outline-offset:2px}.ghep-tranh__bar{justify-content:center;align-items:center;gap:.9rem;display:flex}.ghep-tranh__thumb{border:1px solid var(--ghep-tranh-frame-line);background:var(--ghep-tranh-blank);border-radius:10px;flex:none;width:64px;height:64px}.ghep-tranh__stats{color:var(--tro-choi-copy);font-variant-numeric:tabular-nums;flex-wrap:wrap;gap:.25rem 1rem;margin:0;font-size:.98rem;display:flex}.ghep-tranh__stats strong{color:var(--tro-choi-ink)}.ghep-tranh__clock{color:var(--tro-choi-gold);font-weight:700}.ghep-tranh__wrap{min-width:0}.ghep-tranh__field{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:pan-y;width:100%;height:auto;display:block}.ghep-tranh__tray{fill:var(--ghep-tranh-tray);stroke:var(--tro-choi-line);stroke-dasharray:6 6}.ghep-tranh__frame{fill:var(--ghep-tranh-frame);stroke:var(--ghep-tranh-frame-line);stroke-width:3px}.ghep-tranh__ghost{opacity:.22;pointer-events:none}.ghep-tranh__ghost.is-whole{opacity:1}.ghep-tranh__grid{fill:none;stroke:var(--ghep-tranh-grid);stroke-width:1.5px;pointer-events:none}.ghep-tranh__blank{fill:var(--ghep-tranh-blank)}.ghep-tranh__piece{cursor:grab;touch-action:none}.ghep-tranh__piece.is-placed{cursor:default;pointer-events:none}.ghep-tranh__shadow{fill:var(--ghep-tranh-shadow)}.ghep-tranh__edge{fill:none;stroke:var(--ghep-tranh-edge);stroke-width:1.6px;stroke-linejoin:round;pointer-events:none}.ghep-tranh__piece.is-placed .ghep-tranh__edge{stroke-width:.8px;opacity:.5}.ghep-tranh__piece.is-lifted .ghep-tranh__edge{stroke:var(--ghep-tranh-lift);stroke-width:4px}.ghep-tranh[data-solved="1"] .ghep-tranh__piece .ghep-tranh__edge{opacity:0}.ghep-tranh[data-motion=full][data-solved="1"] .ghep-tranh__piece .ghep-tranh__edge{transition:opacity .9s}.ghep-tranh__handle{pointer-events:none;outline:none}.ghep-tranh__handle path{fill:none;stroke:#0000;stroke-width:5px;stroke-linejoin:round}.ghep-tranh__handle:focus-visible path,.ghep-tranh__handle:focus path{stroke:var(--ghep-tranh-focus)}.ghep-tranh__handle[aria-pressed=true] path{stroke:var(--ghep-tranh-lift);stroke-dasharray:10 6}.ghep-tranh__help{color:var(--tro-choi-muted);text-align:center;margin:0;font-size:.9rem;line-height:1.55}.ghep-tranh__message{min-height:3em;color:var(--tro-choi-ink);background:var(--tro-choi-paper);text-align:center;border-radius:12px;margin:0;padding:.6rem .9rem;font-size:.98rem;line-height:1.55}.ghep-tranh__end{border:1px solid var(--tro-choi-gold);text-align:center;border-radius:16px;justify-items:center;gap:.5rem;padding:1rem;display:grid}.ghep-tranh__end h3{font:600 1.3rem / 1.3 var(--font-serif,Lora, "Lora fallback", Georgia, serif);margin:0}.ghep-tranh__end p{color:var(--tro-choi-copy);margin:0}.ghep-tranh__actions{flex-wrap:wrap;justify-content:center;gap:.5rem;display:flex}.ghep-tranh__best{color:var(--tro-choi-muted);text-align:center;margin:0;font-size:.88rem}@media (width<=560px){.ghep-tranh__choices{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.ghep-tranh__chip{padding-inline:.6rem;font-size:.9rem;line-height:1.25}}
