.creative-player{padding:18px;background:#fffdf5;border:3px solid white;border-radius:26px;box-shadow:var(--shadow)}.creative-heading{display:flex;align-items:center;gap:16px}.creative-heading h1{margin:0;font-size:25px}.creative-heading p{margin:6px 0;color:var(--muted);font-size:14px}.creative-modes{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:18px 0}.creative-modes .capsule{padding:0 18px;min-height:44px}.creative-status{text-align:center;color:#536e50;font-size:15px;min-height:24px}.puzzle-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.7fr);gap:24px;max-width:980px;margin:auto;align-items:start}.puzzle-board,.puzzle-tray{display:grid;grid-template-columns:repeat(var(--cols),1fr);grid-template-rows:repeat(var(--rows),1fr);aspect-ratio:1}.puzzle-board{background:#e5e8d5;border:5px solid #d3dbbf;border-radius:12px;overflow:hidden;gap:2px}.puzzle-slot{background:#f0f1e3;background-repeat:no-repeat;padding:0;min-width:0;min-height:0;color:#9aa68c;font-size:20px}.puzzle-slot.filled{background-color:#e5e8d5}.puzzle-tray{gap:8px;padding:8px;background:#f1e9d6;border-radius:14px}.puzzle-piece{background-repeat:no-repeat;border-radius:7px;min-width:0;min-height:0;touch-action:none;border:2px solid white;box-shadow:0 3px 5px #294c3b25}.puzzle-piece.chosen{outline:4px solid #eaa62e;outline-offset:1px;z-index:1}.puzzle-piece:disabled{opacity:.12;cursor:default}.puzzle-ghost{position:fixed;z-index:1000;transform:translate(-50%,-50%);pointer-events:none;opacity:.85}.puzzle-reference{margin-top:16px;background:#f2f1e5;padding:12px;border-radius:14px}.puzzle-reference summary{cursor:pointer;min-height:32px}.puzzle-reference img{display:block;width:100%;max-width:260px;margin:10px auto;border-radius:10px}.sticker-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:22px;align-items:start}.sticker-canvas{position:relative;aspect-ratio:1.2;border:5px solid white;outline:2px solid #d8e0c7;border-radius:22px;overflow:hidden;background:linear-gradient(#ccebe9 0 50%,#d9e6ba 50%);isolation:isolate}.sticker-hills{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 20% 100%,#b3ce91 0 44%,transparent 44.3%),radial-gradient(ellipse at 100% 100%,#9cbd7d 0 40%,transparent 40.3%)}.sticker-layer{position:absolute;inset:0;pointer-events:none}.placed-sticker{position:absolute;transform:translate(-50%,-50%);font-size:calc(clamp(25px,4.5vw,48px)*var(--size));width:1.25em;height:1.25em;line-height:1;padding:0;background:transparent;touch-action:none;pointer-events:auto;user-select:none;-webkit-user-select:none;border-radius:12px}.placed-sticker.selected{outline:2px dashed #64814b;background:#ffffff40}.sticker-palette{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.sticker-palette button{padding:8px 3px;background:#eef0dc;border:2px solid transparent;border-radius:14px;min-height:64px}.sticker-palette button.chosen{border-color:#e2a43a;background:#fff0bd}.sticker-palette span{font-size:29px;display:block}.sticker-palette small{font-size:11px}.sticker-edit{display:flex;gap:8px;margin-top:14px}.sticker-edit .capsule{font-size:13px;padding:0 12px;flex:1}.creative-player button:focus-visible{outline:3px solid #c1882b;outline-offset:2px}
@media(max-width:700px) and (orientation:portrait){.creative-player{padding:12px}.creative-heading{gap:10px}.creative-heading h1{font-size:20px}.creative-heading .capsule{padding:0 12px;white-space:nowrap}.puzzle-layout,.sticker-layout{grid-template-columns:1fr;gap:16px}.puzzle-layout>aside{display:grid;grid-template-columns:1fr 90px;gap:12px;align-items:start}.puzzle-reference{margin:0;font-size:13px;padding:8px}.puzzle-tray{gap:6px}.creative-modes{gap:6px}.creative-modes .capsule{padding:0 10px;font-size:13px}.sticker-palette{grid-template-columns:repeat(6,1fr);gap:5px}.sticker-palette span{font-size:25px}.sticker-palette button{min-height:58px}.placed-sticker{font-size:calc(30px*var(--size))}}
@media(orientation:landscape) and (max-height:600px){body:has(.creative-player) .topbar{display:none}.creative-player{padding:10px}.creative-heading h1{font-size:20px}.creative-heading p{font-size:12px}.creative-modes{margin:10px 0}.creative-status{margin:8px}.puzzle-layout{max-width:700px;grid-template-columns:1fr 1fr}.puzzle-board,.puzzle-tray{max-height:calc(100dvh - 200px);width:auto;margin:auto}.sticker-layout{grid-template-columns:minmax(0,1fr) 280px}.sticker-canvas{max-height:calc(100dvh - 160px)}.creative-player .game-actions{margin-top:12px}}