:root{--sky-top: #a8d8f0;--sky-bottom: #80b8e0;--parchment: #b88a5a;--parchment-recess: #8a6038;--filigree: #f0e8d0;--score-ink: #5a3820;--frame: #2a1810;--cell: 48px;min-height:100svh;background:var(--frame)}*{box-sizing:border-box}html,body{margin:0;height:100%}body{background:var(--frame);color:var(--score-ink);font-family:Georgia,Times New Roman,serif;min-height:100svh;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);display:flex;align-items:center;justify-content:center}#app{display:flex;flex-direction:row;gap:calc(var(--cell) / 3);padding:calc(var(--cell) / 3)}:root[data-layout=portrait] #app{flex-direction:column-reverse;align-items:center;gap:calc(var(--cell) * .2);padding:calc(var(--cell) * .2)}.info{background:var(--parchment);border:1px solid var(--frame);border-radius:4px;display:flex;flex-direction:column;width:calc(var(--cell) * 25 / 6);padding:calc(var(--cell) * .5) calc(var(--cell) / 3);gap:calc(var(--cell) * .5)}:root[data-layout=portrait] .info{flex-direction:row;width:calc(var(--cell) * 7);height:calc(var(--cell) * 2.4);padding:calc(var(--cell) * .2) 0;gap:0;align-items:center}.score{font-size:calc(var(--cell) * .75);font-weight:700;color:var(--score-ink);text-align:center;line-height:1}:root[data-layout=portrait] .score{flex:2.5;min-width:0;font-size:calc(var(--cell) * .6)}.preview{background:var(--parchment-recess);border-radius:4px;height:calc(var(--cell) * 2);box-shadow:inset 0 2px 4px #00000040;display:flex;align-items:center;justify-content:center}:root[data-layout=portrait] .preview{flex:3}.preview canvas{display:block}.actions{display:flex;flex-direction:row;justify-content:center;margin-top:auto;gap:calc(var(--cell) * .3)}:root[data-layout=portrait] .actions{flex-direction:column;margin-top:0;gap:calc(var(--cell) * .2);flex:1.5;align-items:center}.actions__button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;border-radius:4px;padding:0;margin:0;color:var(--score-ink);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:color .12s ease-out,background-color .12s ease-out;-webkit-tap-highlight-color:transparent}.actions__button svg{display:block;width:calc(var(--cell) * .5);height:calc(var(--cell) * .5)}.actions__button:hover{background:#f0e8d059}.actions__button:focus-visible{outline:2px solid var(--score-ink);outline-offset:2px}.actions__button:active{background:var(--score-ink);color:var(--filigree)}.playfield{position:relative;width:calc(var(--cell) * 7);height:calc(var(--cell) * 12);background:linear-gradient(var(--sky-top),var(--sky-bottom));border:1px solid var(--frame);border-radius:4px;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none}.playfield canvas{display:block}.game-over{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .6s ease-out;pointer-events:none}.game-over[hidden]{display:none}.game-over.is-visible{opacity:1;pointer-events:auto}.game-over__panel{background:var(--parchment);border:2px solid var(--parchment-recess);border-radius:8px;padding:28px 48px;box-shadow:0 6px 24px #0000008c;display:flex;flex-direction:column;align-items:center;gap:14px;color:var(--score-ink);text-align:center}.game-over__title{font-size:56px;font-weight:700;line-height:1;transform:rotate(-3deg);letter-spacing:2px}.game-over__score{font-size:32px;font-weight:700}.game-over__hint{font-size:14px;opacity:0;transition:opacity .6s ease-out}.game-over.is-visible .game-over__hint{opacity:.85;transition-delay:.8s}:root[data-layout=landscape] .game-over__hint-portrait,:root[data-layout=portrait] .game-over__hint-landscape{display:none}.restart-confirm{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#00000059;opacity:0;transition:opacity .2s ease-out;pointer-events:none}.restart-confirm[hidden]{display:none}.restart-confirm.is-visible{opacity:1;pointer-events:auto}.restart-confirm__panel{background:var(--parchment);border:2px solid var(--parchment-recess);border-radius:8px;padding:24px 36px;box-shadow:0 6px 24px #0000008c;display:flex;flex-direction:column;align-items:center;gap:12px;color:var(--score-ink);text-align:center;max-width:calc(var(--cell) * 6)}.restart-confirm__title{font-size:28px;font-weight:700;line-height:1.1}.restart-confirm__hint{font-size:14px;opacity:.85}:root[data-layout=landscape] .restart-confirm__hint-portrait,:root[data-layout=portrait] .restart-confirm__hint-landscape{display:none}.leaderboard{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#00000059;opacity:0;transition:opacity .2s ease-out;pointer-events:none}.leaderboard[hidden]{display:none}.leaderboard.is-visible{opacity:1;pointer-events:auto}.leaderboard__panel{background:var(--parchment);border:2px solid var(--parchment-recess);border-radius:8px;padding:calc(var(--cell) * .5) calc(var(--cell) * .55);box-shadow:0 6px 24px #0000008c;color:var(--score-ink);display:flex;flex-direction:column;align-items:stretch;gap:calc(var(--cell) * .3);max-width:calc(var(--cell) * 7.5);max-height:calc(var(--cell) * 11)}.leaderboard__title{font-size:calc(var(--cell) * .55);font-weight:700;text-align:center;letter-spacing:1px;transform:rotate(-2deg)}.leaderboard__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:calc(var(--cell) * .05);overflow-y:auto}.leaderboard__row{display:flex;align-items:center;gap:calc(var(--cell) * .2);font-size:calc(var(--cell) * .3);line-height:1}.leaderboard__icon{display:block;flex:0 0 auto}.leaderboard__score{font-weight:700;text-align:center;font-variant-numeric:tabular-nums;flex:1 1 auto}.leaderboard__date{opacity:.7;font-variant-numeric:tabular-nums;flex:0 0 auto}.leaderboard__empty{text-align:center;font-size:calc(var(--cell) * .32);padding:calc(var(--cell) * .4) calc(var(--cell) * .2);opacity:.85}.leaderboard__empty[hidden]{display:none}.leaderboard__games-played{text-align:center;font-size:calc(var(--cell) * .28);padding-top:calc(var(--cell) * .35);opacity:.7;font-variant-numeric:tabular-nums}.leaderboard__games-played[hidden]{display:none}#splash{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--frame);z-index:100;transition:opacity .5s ease-out}#splash.is-loaded{opacity:0;pointer-events:none}
