#puzzle-root h1{font-size:28px}
.puzzle-header{padding-top:6px;padding-bottom:6px;min-height:64px}.puzzle-tools{display:flex;gap:6px;align-items:center}.puzzle-tool{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:48px;height:48px;min-height:48px;margin:0;padding:4px 7px;border-radius:10px;box-shadow:0 2px 0 #075c70}.puzzle-tool .tool-icon{font-size:19px;line-height:20px}.puzzle-tool .tool-label{font-size:10px;line-height:12px}.puzzle-tool.is-muted{background:#fffdf4;color:#234653;box-shadow:0 2px 0 #8dbac1}.puzzle-tool.is-muted .tool-icon{text-decoration:line-through}
.puzzle-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;align-items:center;max-width:520px;margin:auto}
.puzzle-stage{position:relative;aspect-ratio:720/460;min-width:0;overflow:hidden;border-radius:24px;background:#dff4f9}
#puzzle-canvas{position:absolute;inset:0}#puzzle-canvas canvas{display:block;width:100%;height:100%}
#puzzle-slots{position:absolute;left:2.777778%;top:4.347826%;width:58.333333%;height:91.304348%;display:grid;gap:0}
.puzzle-slot{margin:0;padding:0;border-radius:0;background:transparent;box-shadow:none;border:2px dashed #247787;min-height:0;min-width:0;position:relative;color:#075c70;font-size:17px}
.puzzle-slot span{display:inline-grid;place-items:center;background:#fffdf2;border-radius:50%;width:30px;height:30px;pointer-events:none}
.puzzle-slot:hover:not(:disabled){background:#ffffff38}.puzzle-slot.is-over{background:#ffe06c55;border:3px solid #bc6c26}.puzzle-slot:disabled{opacity:1;border:1px solid #ffffff70}.puzzle-slot:disabled span{display:none}
.puzzle-slot:focus-visible{outline-offset:-5px;z-index:1}
.puzzle-panel{min-width:0}#puzzle-status{min-height:1.5em;margin:10px auto 14px;font-size:17px;font-weight:700}
#puzzle-pieces{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:8px auto;max-width:240px;width:85%}
.puzzle-piece{aspect-ratio:1;margin:0;padding:0;border:3px solid #75b4bd;border-radius:12px;background-color:#fff;position:relative;touch-action:none;user-select:none;-webkit-user-select:none;overflow:hidden;min-width:0;min-height:44px;box-shadow:0 4px 0 #75b4bd}
.puzzle-piece-image{display:block;position:absolute;inset:0;background-repeat:no-repeat;pointer-events:none}
.puzzle-piece[aria-pressed=true]{border-color:#b05a27;outline:3px solid #f5c54b;outline-offset:2px}.puzzle-piece:disabled{opacity:.2;visibility:hidden}.puzzle-piece.is-dragging{opacity:.4}
.puzzle-ghost{position:fixed;z-index:50;pointer-events:none;transform:translate(-50%,-50%);background-color:#fff;border:3px solid #e7b43c;border-radius:10px;background-repeat:no-repeat;box-shadow:0 8px 20px #23465340}
.puzzle-paused{position:absolute;inset:0;display:grid;place-items:center;background:#edf8f4f5;font-size:22px;font-weight:700;z-index:4}
#puzzle-success{padding:12px;margin:10px auto;max-width:330px}#puzzle-success h2{font-size:24px}#puzzle-progress{font-size:14px;min-height:1.5em}
#puzzle-start,#puzzle-next{background:#ce553b;box-shadow:0 4px 0 #9f402e}#puzzle-restart{background:#ffe06c;color:#624b19;box-shadow:0 4px 0 #c4a348}
.puzzle-stage.is-retry{animation:answer-nudge .3s ease-in-out}
@media(max-width:700px){.puzzle-header{padding:6px 12px}.puzzle-demo-label{display:none}#puzzle-root{margin-top:8px}#puzzle-root h1{font-size:24px;margin:6px 0}#puzzle-pieces{margin:6px auto}.puzzle-panel .controls{gap:2px}.puzzle-panel .controls button{font-size:13px;padding:8px 10px}#puzzle-status{font-size:15px;margin:6px auto 8px}#puzzle-progress{margin:8px 0}}
@media(max-height:800px) and (min-width:701px){#puzzle-root{margin:6px auto}#puzzle-root h1{font-size:24px;margin:5px 0}.puzzle-layout{max-width:min(440px,60svh)}#puzzle-status{font-size:15px;margin:4px auto 8px}#puzzle-pieces{max-width:min(200px,28svh)}.parent-note{margin:6px 0}}
@media(prefers-reduced-motion:reduce){.puzzle-stage.is-retry{animation:none}}
