@import url("../../assets/game-demo.css?v=20261019-tangram-demo-1");
.tangram-stage{width:100%;max-width:760px;margin:0 auto;direction:ltr}.puzzle-frame{position:relative;isolation:isolate;overflow:hidden}#board{display:block;width:100%;height:auto;overflow:visible;touch-action:none;user-select:none;-webkit-user-select:none}.target-outline{fill:#090d13;stroke:#b89452;stroke-width:1.5;stroke-dasharray:5 5;filter:drop-shadow(0 3px 5px #0008)}.target-guide{fill:none;stroke:#b8945270;stroke-width:1;pointer-events:none}.piece{cursor:grab;outline:none;touch-action:none}.piece .piece-face{stroke:#ffffff75;stroke-width:1.5;stroke-linejoin:round;paint-order:stroke fill}.piece .piece-edge{fill:none;stroke:#ffffff38;stroke-width:1;pointer-events:none}.piece:not(.placed){filter:drop-shadow(0 5px 3px #0008)}.piece.selected .piece-face,.piece:focus-visible .piece-face{stroke:#fff0b2;stroke-width:4}.piece.dragging{cursor:grabbing;filter:none}.piece.placed{cursor:default}.puzzle-tools{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:12px 0 22px}.tool-button{min-height:64px;padding:7px 3px;border:1px solid #68512d;border-radius:13px;background:linear-gradient(160deg,#24231e,#12151c);color:#eed49a;cursor:pointer;font:inherit;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.tool-button>span{display:block;font-size:25px;line-height:1.15}.tool-button small{display:block;margin-top:5px;font-size:12px;line-height:1.25;color:#d3c3a3}.tool-button:last-child small{font-size:12px}.tool-button:hover{border-color:#dfbd72;background:#29261f}.tool-button:disabled{opacity:.4;cursor:default}.game-anchor-placeholder{position:fixed;left:50%;bottom:env(safe-area-inset-bottom,0px);transform:translateX(-50%);width:320px;height:50px;display:flex;align-items:center;justify-content:center;gap:15px;background:#10141b;border:1px dashed #5c4b30;border-radius:7px 7px 0 0;color:#a89b83;font-size:11px;z-index:10}.game-anchor-close{position:absolute;right:1px;top:1px;width:44px;height:46px;background:none;border:0;color:#d9c18c;font-size:23px;cursor:pointer}.game-anchor-placeholder>span{padding-right:27px}.game-anchor-placeholder[hidden],.preview-capture .game-anchor-placeholder{display:none}.preview-capture .puzzle-tools{display:none}.preview-capture .tangram-stage{pointer-events:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.drawer-backdrop{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:#03060a55;z-index:5;cursor:default;touch-action:manipulation}.pieces-drawer{position:absolute;bottom:10px;left:10px;right:10px;max-height:calc(100% - 20px);display:flex;flex-direction:column;padding:12px;border:1px solid #ad8b4c;border-radius:16px;background:linear-gradient(155deg,#24282e,#10151d);box-shadow:0 -12px 35px #0009;z-index:6;animation:drawer-enter .16s ease-out}.drawer-heading{display:flex;flex:none;align-items:center;justify-content:space-between;gap:12px;margin:0 0 10px}.drawer-heading h2{margin:0;color:#eed7a0;font:normal 19px Georgia,serif}.drawer-heading .icon-button{width:40px;height:40px;min-width:40px}.drawer-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:3px;scrollbar-color:#a6884c #131820;scrollbar-width:thin}.drawer-piece{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:1;min-width:0;min-height:56px;padding:5px 5px 15px;border:1px solid #665334;border-radius:10px;background:#0b111a;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.drawer-piece:hover{background:#242a30;border-color:#ecd29a}.drawer-piece-preview{display:block;width:100%;height:100%;max-height:100px;pointer-events:none;overflow:visible}.drawer-piece .piece-face{stroke:#fff9;stroke-width:1.5;stroke-linejoin:round}.drawer-piece .piece-edge{fill:none;stroke:#fff5;stroke-width:1}.drawer-piece-number{position:absolute;right:7px;bottom:3px;color:#e0c995;font:12px Arial,sans-serif}.drawer-empty{margin:14px 0 22px;color:#c9baa0;font-size:15px;line-height:1.5}.pieces-drawer[hidden],.drawer-backdrop[hidden],.drawer-empty[hidden],.preview-capture .drawer-toggle,.preview-capture .pieces-drawer,.preview-capture .drawer-backdrop{display:none}.reduce-motion .pieces-drawer{animation:none}@keyframes drawer-enter{from{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}@media(prefers-reduced-motion:reduce){.pieces-drawer{animation:none}}
@container gf-page (min-width:600px){.tool-button{min-height:74px}.tool-button small,.tool-button:last-child small{font-size:13px}.puzzle-tools{gap:12px}.puzzle-frame{position:relative;isolation:isolate;overflow:hidden}}@media(prefers-reduced-motion:reduce){.piece{transition:none!important}}body.reduce-motion .piece{transition:none!important}

.drawer-toggle{position:relative}.drawer-toggle .drawer-icon{height:29px;display:flex;align-items:center;justify-content:center}.drawer-toggle .drawer-count{position:absolute;right:5px;top:5px;display:flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding:0 3px;border-radius:8px;background:#d7b56a;color:#14120d;font:700 11px Arial,sans-serif}.drawer-toggle[aria-expanded=true]{border-color:#ffe7aa}

/* Shared scorebar and dialog styles remain in page.css. */
.scorebar>button#level-cycle{flex:1 1 0}.scorebar>div{flex:1 1 0}#level-cycle:hover{background:#242018}#level-cycle strong::after{content:" ›";font:16px Arial,sans-serif;color:#bca36c}
.tangram-result{text-align:center}.tangram-result .result-emblem{display:grid;place-items:center;width:94px;height:94px;margin:2px auto 18px;border:1px solid #8a6a35;border-radius:24px;background:radial-gradient(circle at 50% 30%,#3e3522,#121820);box-shadow:0 8px 24px #0005}.result-emblem svg{filter:drop-shadow(0 3px 3px #0007)}.tangram-result .result-puzzle{margin:0 0 8px;color:var(--gold-light);font-size:13px;font-weight:700;letter-spacing:.04em}.tangram-result h2{margin:0;font-size:clamp(24px,6vw,32px);line-height:1.2}.tangram-result .result-description{margin:10px 0 0;color:var(--muted);line-height:1.5}.tangram-result .result-values{gap:10px;margin:22px 0}.tangram-result .result-values>div{padding:15px 8px;background:#0b1018}.tangram-result .result-values span{font-size:12px;line-height:1.3}.tangram-result .result-values strong{font-variant-numeric:tabular-nums}.tangram-result .result-actions{display:grid;gap:10px}.tangram-result .result-actions>button{margin:0;width:100%}.tangram-result .result-close{width:100%;margin-top:12px}

.tangram-result .result-values>div:last-child{grid-column:1/-1}