#puzzle-content{height:100%}.puzzle-options{display:flex;flex-wrap:wrap;gap:14px;align-items:end}.puzzle-options label{flex:1;min-width:140px;font-size:12px}.puzzle-options select{width:100%;min-height:40px}.puzzle-options .primary{min-height:42px;margin:0}.puzzle-options .text-button{min-height:42px}
.puzzle-viewport{position:absolute;inset:0;background-color:#aac0ac;background-image:radial-gradient(#fff2 1px,transparent 1px),radial-gradient(ellipse at 50% 40%,#e3edde55,transparent 70%);background-size:4px 4px,100% 100%;touch-action:none;overflow:hidden}.puzzle-viewport[data-table=sand]{background-color:#dbccb3}.puzzle-viewport[data-table=night]{background-color:#344760;background-image:radial-gradient(#ffffff14 1px,transparent 1px);background-size:4px 4px}
.jigsaw-table{display:block;width:100%;height:100%;user-select:none;-webkit-user-select:none;touch-action:none;cursor:grab}.jigsaw-table.panning{cursor:grabbing}.jigsaw-mat{fill:#f5f0e3b3;stroke:#819585;stroke-width:3;filter:drop-shadow(0 5px 6px #26382d40)}.jigsaw-reference{pointer-events:none}.jigsaw-piece{cursor:grab;touch-action:none;filter:drop-shadow(1px 3px 2px #20342870);outline:none}.jigsaw-piece:focus-visible{filter:drop-shadow(0 0 7px #0e7875)}.jigsaw-piece.dragging{cursor:grabbing;filter:drop-shadow(3px 7px 4px #1b2d2670)}.jigsaw-piece.snapped{cursor:default;filter:none}.jigsaw-piece-paper{fill:#f9f3e4;stroke:#fff8eb;stroke-width:3}.jigsaw-edge{fill:none;stroke:#fff9e7d9;stroke-width:2.4;stroke-linejoin:round;pointer-events:none;paint-order:stroke}.snapped .jigsaw-edge{stroke:#ffffff75;stroke-width:.9}.joined .jigsaw-edge{stroke:#fff0c2d9}
.puzzle-filters,.puzzle-view-tools{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.puzzle-filters{margin-bottom:9px}.puzzle-filters button,.puzzle-view-tools button{min-height:40px;padding:9px 14px;border:1px solid #a2bcad;border-radius:12px;background:#edf4e7;color:#315f54;font:600 12px system-ui}.puzzle-filters button[aria-pressed=true]{background:#37776b;color:#fff9e7;border-color:#245e54}.puzzle-filters small{font:600 11px system-ui;opacity:.8;margin-left:5px}.puzzle-view-tools label{display:flex;align-items:center;gap:7px;font:12px system-ui;margin:0}.puzzle-view-tools select{min-height:40px;width:auto;margin:0;padding:7px 10px}.puzzle-help{font:12px/1.5 system-ui;color:#557465;margin:9px 0 0;max-width:none}
.puzzle-mini-hud{position:absolute;left:12px;top:10px;display:flex;align-items:center;gap:12px;max-width:calc(100% - 210px);padding:7px 12px;border-radius:16px;background:#fffaf0dd;color:#315e55;box-shadow:0 3px 12px #283c3020;font:12px system-ui;pointer-events:none}.puzzle-mini-hud button{pointer-events:auto;border:1px solid #a5bcae;border-radius:10px;background:#edf4e7;color:#315e55;padding:7px 10px;min-height:34px}.game-dialog[data-top-open=false] .puzzle-mini-hud{left:66px;top:64px}.puzzle-status{position:absolute;left:14px;right:190px;bottom:14px;width:max-content;max-width:calc(100% - 210px);margin:0;padding:9px 13px;background:#fffaf0e8;border:1px solid #acbfaf;border-radius:13px;color:#395e4e;font:12px/1.5 system-ui;pointer-events:none}.puzzle-status:empty{display:none}#puzzle-save{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:20}.puzzle-scene>.picture-party{z-index:30}
.card-puzzle{display:block;width:calc(100% - 10px);margin:10px 5px 0;padding:9px;background:linear-gradient(110deg,var(--metal-light,#f2dee8),#fffaf2);border:1px solid var(--metal-mid,#d9b8cb);border-radius:10px;color:var(--metal-dark,#8c607a);font-size:11px;font-weight:600}
.rankings-dialog{width:670px;max-width:calc(100vw - 20px)}.rank-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}.rank-tabs button{border:1px solid #dfc7d3;border-radius:13px;padding:10px 13px;font-size:12px}.rank-tabs button[aria-pressed=true]{background:#946b83;color:white}#rank-filters{display:flex;gap:15px;margin:15px 0}#rank-filters label{flex:1;font-size:12px}#rank-table{min-height:100px;overflow:auto;font-size:13px}#rank-table table{width:100%;border-collapse:collapse;text-align:left}#rank-table th,#rank-table td{padding:12px 8px;border-bottom:1px solid #e4d1c7}#rank-table tbody tr:first-child{background:#fff0cb;font-weight:700}body.dark #rank-table tbody tr:first-child{background:#5c4c32}
@media(max-width:760px){.puzzle-options{gap:8px}.puzzle-options label{min-width:120px}.puzzle-options select{font-size:12px}.puzzle-options .primary{font-size:12px}.puzzle-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.puzzle-filters button{padding:8px 10px}.puzzle-view-tools{gap:6px}.puzzle-view-tools button{font-size:11px;padding:8px 10px}.puzzle-help{font-size:11px}.puzzle-mini-hud{top:10px;left:8px;gap:6px;padding:6px 9px;font-size:11px;max-width:calc(100% - 12px)}.puzzle-mini-hud button{font-size:11px}.game-dialog[data-top-open=false] .puzzle-mini-hud{left:10px;top:65px}.puzzle-status{font-size:11px;left:10px;right:10px;bottom:62px;max-width:calc(100% - 20px);box-sizing:border-box}.rank-tabs button{font-size:10px;padding:9px}.rankings-dialog{padding:24px 18px}}

.game-dialog[data-top-open=false] .puzzle-mini-hud{left:12px;top:auto;bottom:70px}

/* A quiet, centred tabletop with a slim tool rail and floating drawers. */
#puzzle-content .puzzle-scene{position:absolute;inset:0}
#puzzle-content .game-top-bar{position:absolute;top:68px;left:70px;right:90px;max-width:790px;max-height:45dvh;border:1px solid #bbccbe;border-radius:22px;padding:20px;box-shadow:0 16px 50px #182e3b30}
#puzzle-content .game-bottom-bar{position:absolute;bottom:65px;right:78px;width:min(420px,calc(100% - 94px));max-height:65dvh;padding:20px;border:1px solid #bbccbe;border-radius:22px;box-shadow:0 16px 50px #182e3b30}
#puzzle-content .puzzle-viewport{background-color:#688c83;background-image:repeating-linear-gradient(35deg,#ffffff05 0 1px,transparent 1px 4px),radial-gradient(ellipse at 50% 40%,#acc2a655,transparent 80%);background-size:auto,100% 100%}
#puzzle-content .puzzle-viewport[data-table=sand]{background-color:#b6a187}
#puzzle-content .puzzle-viewport[data-table=night]{background-color:#2c3e50}
#puzzle-content .jigsaw-mat{fill:#dbe4d028;stroke:#e8f0e066;stroke-width:1.5;rx:2;filter:none}
#puzzle-content .jigsaw-piece{filter:drop-shadow(1px 2px 1px #172e3650)}
#puzzle-content .jigsaw-piece-paper{stroke:none;fill:#f5ebd8}
#puzzle-content .jigsaw-edge{stroke:#3c38265c;stroke-width:.7;vector-effect:non-scaling-stroke}
#puzzle-content .jigsaw-piece.dragging{filter:drop-shadow(2px 6px 4px #172e3670)}
#puzzle-content .snapped{filter:none}
#puzzle-content .snapped .jigsaw-edge{stroke:#46392345;stroke-width:.5}
#puzzle-content .puzzle-mini-hud{left:50%;top:16px;bottom:auto;transform:translateX(-50%);border-radius:18px;max-width:calc(100% - 340px);background:#fff9edee;padding:10px 20px;gap:14px;box-shadow:0 3px 15px #15383126}
.puzzle-hud-label{font:700 10px system-ui;letter-spacing:1.3px;color:#5f8173}
#puzzle-time{font-variant-numeric:tabular-nums}
.puzzle-rail{position:absolute;right:12px;top:50%;transform:translateY(-50%);z-index:10;display:flex;flex-direction:column;gap:4px;background:#fff9edeb;border:1px solid #bfd0c1;border-radius:24px;padding:8px;box-shadow:0 5px 20px #17373033}
.puzzle-rail button{display:grid;place-items:center;width:42px;height:42px;border:0;border-radius:14px;background:transparent;color:#315e58;font:25px system-ui;cursor:pointer}
.puzzle-rail button:hover,.puzzle-rail button[aria-pressed=true]{background:#d5e7dd;color:#164940}
.puzzle-rail span{height:1px;background:#bdcec3;margin:5px}
.puzzle-preview{position:absolute;left:20px;bottom:65px;width:230px;max-width:45vw;background:#fffaef;border:1px solid #c3b39c;box-shadow:0 8px 25px #17373040;border-radius:16px;padding:10px;z-index:11}
.puzzle-preview[hidden]{display:none}.puzzle-preview div{display:flex;align-items:center;justify-content:space-between;font:600 12px system-ui;color:#537063;margin:0 0 8px}.puzzle-preview button{border:0;background:none;font-size:24px;color:#537063;min-width:35px;min-height:35px}.puzzle-preview img{display:block;width:100%;border-radius:7px}
#puzzle-content .puzzle-status{left:50%;right:auto;transform:translateX(-50%);bottom:18px;max-width:calc(100% - 340px);text-align:center;background:#fff9eddf;border:0;box-shadow:none}
#puzzle-content .puzzle-filters{display:grid;grid-template-columns:1fr 1fr}
#puzzle-content .puzzle-options label{font:600 12px system-ui;color:#537063}
@media(max-width:760px){#puzzle-content .game-top-bar{left:10px;right:76px;top:66px;padding:14px;max-height:65dvh}#puzzle-content .game-bottom-bar{right:76px;bottom:62px;width:calc(100% - 86px);padding:14px;max-height:68dvh}.puzzle-rail{right:8px;padding:5px;gap:2px;border-radius:21px}.puzzle-rail button{width:39px;height:39px;font-size:24px}.puzzle-hud-label{display:none}#puzzle-content .puzzle-mini-hud{top:64px;max-width:calc(100% - 100px);padding:9px 12px;font-size:11px}#puzzle-content .puzzle-status{bottom:65px;max-width:calc(100% - 95px);width:max-content;font-size:11px}.puzzle-preview{left:10px;bottom:65px;width:185px;max-width:calc(100% - 100px)}}

/* A fixed picture and a separate, reachable tray. Moving pieces are cached bitmaps. */
#puzzle-content .puzzle-board-space{position:absolute;inset:58px 0 152px;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none}
#puzzle-content .puzzle-board-space.tray-collapsed{bottom:48px}
.puzzle-world{position:absolute;left:0;top:0;width:600px;height:600px;transform-origin:0 0;background:#e3e5d0;outline:2px solid #fff7df8c;border-radius:3px;box-shadow:0 4px 18px #152f3c25;will-change:transform;isolation:isolate}
.puzzle-world:before{content:'Teil für Teil entsteht dein Kunstwerk';position:absolute;inset:0;display:grid;place-items:center;color:#647d6b;font:18px Georgia;pointer-events:none}
.puzzle-world[data-occupied=true]:before{display:none}
.puzzle-placed,.puzzle-free-layer,.puzzle-reference{position:absolute;inset:0;display:block;width:600px;height:600px;pointer-events:none}
.puzzle-reference{opacity:.22;object-fit:fill}.puzzle-reference[hidden]{display:none}
.puzzle-cluster{display:block;position:relative;padding:0!important;margin:0!important;min-height:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;line-height:0;cursor:grab;user-select:none;-webkit-user-select:none;touch-action:none;pointer-events:auto;flex:none}
.puzzle-cluster.on-board{position:absolute}.puzzle-cluster canvas,.puzzle-moving-cluster canvas{display:block;width:100%;height:100%;pointer-events:none}
.puzzle-cluster:focus-visible{outline:2px dashed #fff4b8;outline-offset:3px}
.puzzle-moving-cluster{position:absolute;left:0;top:0;z-index:35;pointer-events:none;will-change:transform;contain:layout style paint;cursor:grabbing}
.puzzle-parts-drawer{position:absolute;bottom:0;left:0;right:0;z-index:8;height:152px;background:#f5f1e4f2;border-top:1px solid #acbbaa;box-sizing:border-box;box-shadow:0 -2px 10px #26423912;color:#315c52}
.puzzle-drawer-head{height:44px;padding:4px 12px;display:flex;align-items:center;justify-content:center;gap:14px;box-sizing:border-box}
.puzzle-drawer-head>strong{font:600 12px system-ui;white-space:nowrap}
#puzzle-content .puzzle-drawer-head .puzzle-filters{display:flex;gap:6px;margin:0}
#puzzle-content .puzzle-drawer-head .puzzle-filters button{font:600 12px system-ui;min-height:34px;padding:6px 11px;border-radius:9px}
.puzzle-drawer-head>button{min-width:36px;min-height:36px;padding:0;border:0;border-radius:10px;background:transparent;color:#426556;font:23px system-ui}
.puzzle-parts-scroll{height:108px;display:flex;align-items:center;gap:10px;overflow-x:auto;overflow-y:hidden;padding:2px 14px 10px;box-sizing:border-box;scrollbar-width:thin;scrollbar-color:#93ab98 transparent;overscroll-behavior-x:contain;touch-action:pan-x;user-select:none;-webkit-user-select:none}
.puzzle-piece-tile{display:flex;align-items:center;justify-content:center;flex:none;min-width:94px;height:94px;position:relative;padding:0 6px;background:#e4e5d280;border-radius:12px}
.puzzle-piece-tile small{position:absolute;right:2px;bottom:0;font:600 10px system-ui;padding:3px 5px;background:#fff8e4;border-radius:5px;pointer-events:none}
.puzzle-parts-drawer.collapsed{height:44px}.puzzle-parts-drawer.collapsed .puzzle-parts-scroll{display:none}
.puzzle-tray-empty{font:13px system-ui!important;color:#617869;margin:auto!important;padding:15px!important;text-align:center}
#puzzle-content .puzzle-mini-hud{top:14px;left:50%;max-width:calc(100% - 390px);padding:8px 13px;font:12px system-ui;background:#f7f6e6cc;box-shadow:none;border:0;border-radius:12px;gap:10px}
#puzzle-content .puzzle-rail{top:calc(50% - 52px);right:10px;padding:4px;gap:2px;border-radius:15px;background:#fff9e7c9;box-shadow:none;border-color:#ccdcc080}
#puzzle-content .puzzle-rail button{width:34px;height:36px;font-size:24px;border-radius:10px}
#puzzle-content .puzzle-rail button:disabled{opacity:.4}
#puzzle-content .puzzle-preview{bottom:164px;left:12px;width:200px;background:#fff9eae8;padding:9px;box-shadow:0 4px 18px #17373025}
#puzzle-content .puzzle-status{bottom:160px;max-width:calc(100% - 160px);padding:6px 12px;font-size:12px;background:#fff9edc9;border-radius:10px}
.puzzle-loading{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);padding:15px 20px;background:#fff9ec;border:1px solid #c4c8ab;border-radius:15px;color:#456457;font:14px system-ui;z-index:20;max-width:80%;text-align:center}.puzzle-loading[hidden]{display:none}
#puzzle-dialog .game-bar-toggle-bottom{top:10px;bottom:auto;right:150px}
#puzzle-content .game-top-bar,#puzzle-content .game-bottom-bar{left:auto;right:12px;top:62px;bottom:auto;width:min(390px,calc(100% - 24px));max-height:70dvh;padding:15px;border-radius:15px;background:#fffaf0f5;box-shadow:0 5px 22px #183b3526;border:1px solid #c3cbb4}
#puzzle-content .game-bottom-bar{right:150px;width:min(330px,calc(100% - 24px))}
#puzzle-content .game-bottom-bar h3{font:600 16px Georgia;margin:0 0 12px;color:#4b6d59}
#puzzle-content .puzzle-options{gap:10px}.puzzle-options label:first-child{flex-basis:100%}
@media(max-width:700px){#puzzle-content .puzzle-board-space{inset:60px 0 132px}.puzzle-parts-drawer{height:132px}.puzzle-parts-scroll{height:88px;padding-bottom:8px}.puzzle-piece-tile{height:77px;min-width:78px}.puzzle-drawer-head{gap:6px;padding:4px 7px}.puzzle-drawer-head>strong{font-size:10px}#puzzle-content .puzzle-drawer-head .puzzle-filters{gap:4px}#puzzle-content .puzzle-drawer-head .puzzle-filters button{font-size:11px;padding:7px 8px;min-height:36px}.puzzle-filters small{font-size:10px;margin-left:3px}#puzzle-content .puzzle-mini-hud{top:62px;max-width:calc(100% - 100px);padding:6px 10px;font-size:11px;z-index:6}#puzzle-content .puzzle-status{bottom:139px;max-width:calc(100% - 70px);font-size:11px}#puzzle-content .puzzle-preview{bottom:142px;width:160px}.puzzle-world:before{font-size:18px}#puzzle-dialog .game-bar-toggle-bottom{right:137px}#puzzle-content .game-bottom-bar{right:12px}#puzzle-content .puzzle-rail{right:6px;padding:3px}#puzzle-content .puzzle-rail button{width:30px;height:35px}}
@media(max-width:360px){.puzzle-drawer-head>strong{display:none}}