/* Parchment, painted colour and quiet light, matching the existing storybook. */
.world-game{--ink:#294f49;max-width:900px;margin:0 auto;padding:12px 20px 14px;color:var(--ink);outline:none}
.world-game button{touch-action:manipulation;min-height:48px}
.game-intro{margin:0 0 12px;text-align:center;font-family:Georgia,serif;font-size:1.15rem;line-height:1.45}
.game-tools{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.world-game .game-tools button{padding:8px 14px;font-size:.9rem}
.game-tools [aria-pressed=true]{background:#315c51;color:#fff8e5;border-color:#315c51}
.game-help,.game-save{font-size:.8rem;line-height:1.45;text-align:center;margin:8px 0;color:#52665a}
.game-feedback{font-family:Georgia,serif;text-align:center;min-height:1.6em;margin:12px 0 6px;line-height:1.45;color:#31564b}
.picture-puzzle{--rows:2;position:relative;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(var(--rows),1fr);gap:5px;aspect-ratio:3/2;max-width:650px;width:100%;margin:auto;padding:9px;background:#b99361;border:3px solid #8b6948;border-radius:17px;box-shadow:0 12px 30px #46382224,inset 0 0 0 2px #e9cb95;isolation:isolate}
.picture-piece{display:block;padding:0;min-width:0;border:1px solid #fffc;box-shadow:0 2px 4px #1d322546;border-radius:5px;cursor:grab;touch-action:none!important;user-select:none;-webkit-user-select:none;position:relative;transition:box-shadow .18s,filter .18s;min-height:0!important;opacity:1!important}
.picture-piece:hover{filter:brightness(1.07)}
.picture-piece:focus-visible{outline:4px solid #fff6be;outline-offset:-5px;z-index:2}
.picture-piece.selected-piece{box-shadow:inset 0 0 0 5px #fff2ad,0 0 0 3px #315d50;z-index:3;filter:brightness(1.12)}
.picture-piece.dragging-piece{z-index:5;box-shadow:0 16px 30px #142b4670;cursor:grabbing;pointer-events:none;transition:none}
.puzzle-finished,.show-picture{gap:0}.puzzle-finished .picture-piece,.show-picture .picture-piece{border:0;border-radius:0;box-shadow:none;cursor:default}
.puzzle-finished{border-color:#5f8b66;box-shadow:0 0 0 4px #a5ba8255,0 12px 30px #46382224}
.sky-layout{display:flex;justify-content:center;align-items:center;gap:30px;padding:4px 0}
.sky-frame{position:relative;padding:10px;border:2px solid #bda274;border-radius:22px;background:#2e494c;box-shadow:0 12px 30px #28352b30,inset 0 0 0 3px #e4cfae55;flex-shrink:0}
.star-board{position:relative;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(12,1fr);gap:3px;height:min(53svh,480px);aspect-ratio:2/3;background:radial-gradient(ellipse at 35% 20%,#3f6266,#243c46 80%);border-radius:9px;overflow:hidden;padding:5px}
.star-cell{display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;background:#f9efd30a;border-radius:5px;font-size:clamp(12px,2.3vh,21px);color:#244c4c;line-height:1}
.filled-star,.next-cell{background:var(--block);box-shadow:inset 0 2px 1px #fff7,inset 0 -3px 1px #21383d25;border:1px solid #fffa}
.falling-star{filter:brightness(1.12);box-shadow:inset 0 2px 1px #fff7,0 0 8px #efdfb033}
.landing-star{border:1px dashed #e9e0c080;background:#f9efd315}
.sky-overlay{position:absolute;inset:11px;border-radius:12px;background:#203e44eF;color:#fff4d5;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;text-align:center;padding:18px;backdrop-filter:blur(4px)}
.sky-overlay[hidden]{display:none}.sky-overlay h3{color:#fff4d5;font:1.55rem Georgia,serif;margin:0}.sky-overlay p{font-size:.9rem;line-height:1.5;margin:0 0 12px}.sky-moon{font:3.5rem Georgia,serif;color:#e7ce8c}
.sky-aside{width:245px;max-width:100%;display:flex;flex-direction:column;align-items:center}
.next-stars{display:flex;align-items:center;justify-content:center;gap:14px;padding:10px 14px;background:#e8dfc861;border:1px solid #d9cba7;border-radius:16px}
.next-stars .eyebrow{font-size:.68rem}.next-shape{display:grid;grid-template-columns:repeat(4,16px);grid-template-rows:repeat(3,16px);gap:2px}.next-cell{border-radius:4px}
.star-controls{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:100%;margin:16px 0 10px}
.star-control{font:1.6rem system-ui,sans-serif;color:#31564b;border:1px solid #b7bba2;border-radius:16px;background:linear-gradient(#fffcf0,#e9e4cd);box-shadow:0 3px 0 #b7b79b;cursor:pointer;padding:6px 10px;min-height:56px!important}
.star-control:active{transform:translateY(2px);box-shadow:0 1px 0 #b7b79b}.star-control:last-child{grid-column:2/4}.star-control:disabled{opacity:.42;box-shadow:none}
.star-landed{animation:star-land .2s ease-out}.game-sparkles{pointer-events:none;position:absolute;inset:0;overflow:hidden;z-index:8}.game-sparkles span{position:absolute;left:calc(8% + var(--i)*7.3%);top:70%;color:#fff2b4;font-size:24px;text-shadow:0 1px 4px #b88045;animation:game-sparkle 1.2s ease-out both;animation-delay:calc(var(--i)*18ms)}
.game-storage-warning{padding:22px;background:#f5ead0;border-radius:18px;text-align:center}
@keyframes game-sparkle{0%{opacity:0;transform:translateY(0) scale(.3)}20%{opacity:1}100%{opacity:0;transform:translateY(-180px) rotate(60deg) scale(1.2)}}
@keyframes star-land{50%{filter:brightness(1.16)}}
@media(max-width:600px){.world-game{padding:10px 12px}.game-intro{font-size:1rem;margin-bottom:10px}.game-tools{gap:6px;margin-bottom:10px}.world-game .game-tools button{padding:6px 11px}.picture-puzzle{padding:6px;gap:4px;border-radius:13px}.sky-layout{flex-direction:column;gap:10px}.star-board{height:min(43svh,400px)}.sky-frame{padding:7px;border-radius:17px}.sky-overlay{inset:8px}.sky-aside{width:330px;display:grid;grid-template-columns:1fr 1fr;gap:6px 12px}.next-stars{padding:4px 8px;gap:8px}.next-shape{grid-template-columns:repeat(4,10px);grid-template-rows:repeat(3,10px);gap:1px}.sky-aside .game-feedback{font-size:.9rem;margin:0}.star-controls{grid-column:1/-1;grid-template-columns:repeat(5,1fr);margin:3px 0;gap:7px}.star-control{min-height:50px!important;border-radius:13px}.star-control:last-child{grid-column:auto}.sky-aside .game-tools{grid-column:1/-1;margin:0}.sky-aside .game-help{grid-column:1/-1;margin:2px 0}.stars-game .game-save{margin:5px 0}}
@media(prefers-reduced-motion:reduce){.world-game *{animation:none!important;transition:none!important;scroll-behavior:auto!important}.game-sparkles{display:none}}
.still-game *{animation:none!important;transition:none!important}.still-game .game-sparkles{display:none}
