*{box-sizing:border-box}body{margin:0;background:#0a0c0e;overflow:hidden;font-family:system-ui,-apple-system,sans-serif;user-select:none;-webkit-user-select:none}#game{display:block;width:100vw;height:100vh;cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M7 25l3-8 11-11 5 5-11 11-8 3z' fill='%23f4f7f8' stroke='%2311171a' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M18 9l5 5M10 17l5 5' stroke='%236bc8f2' stroke-width='3'/%3E%3C/svg%3E") 7 25,crosshair;image-rendering:pixelated;touch-action:none}#game.cursor-invalid{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='12' fill='%2311171a' fill-opacity='.88' stroke='%23ff6969' stroke-width='3'/%3E%3Cpath d='M10 10l12 12M22 10L10 22' stroke='%23fff' stroke-width='3.5' stroke-linecap='round'/%3E%3C/svg%3E") 16 16,not-allowed}.world-controls{position:fixed;bottom:20px;left:20px;z-index:2;display:flex;gap:10px;align-items:center;padding:8px;border:1px solid rgb(255 255 255 / 18%);border-radius:10px;background:#0a0c0ee0;color:#c9d3d8;box-shadow:0 8px 24px #0000003d;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.world-controls button{padding:8px 12px;border:1px solid #9ddcff;border-radius:7px;background:#46a0cd38;color:#fff;font:inherit;font-weight:650;cursor:pointer}.world-controls select{max-width:240px;padding:7px 28px 7px 9px;border:1px solid rgb(255 255 255 / 28%);border-radius:7px;background:#192127;color:#fff;font:inherit}.world-controls label{font-size:12px}.world-controls button:disabled{cursor:default;opacity:.5}#world-status{max-width:260px;color:#ffcf7d;font-size:12px}.world-controls button:hover{background:#46a0cd5c}.world-controls button:focus-visible{outline:2px solid white;outline-offset:2px}#world-name{padding-right:4px;font-size:12px}#tile-palette{position:fixed;top:20px;right:20px;z-index:1;width:min(420px,calc(100vw - 24px));max-height:calc(100vh - 24px);padding:14px;border:1px solid rgb(255 255 255 / 18%);border-radius:12px;background:#0a0c0ee0;box-shadow:0 10px 30px #00000047;color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);overflow-y:auto}#tile-palette h2{margin:0 0 12px;font-size:13px;font-weight:650;letter-spacing:.08em;text-align:center;text-transform:uppercase}#tile-palette h2:not(:first-child){margin-top:18px}.foundation-options,.surface-options,.cliff-options,.transition-options,.object-options,.collision-options{display:grid;grid-template-columns:repeat(2,64px);gap:10px;justify-content:center}.tile-options{display:grid;grid-template-columns:repeat(auto-fill,64px);gap:10px;justify-content:center;width:100%}.palette-tabs{display:flex;gap:4px;margin:-4px -4px 16px;overflow-x:auto;scrollbar-width:thin}.palette-tabs button{flex:0 0 auto;padding:8px 10px;border:1px solid rgb(255 255 255 / 14%);border-radius:7px;background:#ffffff0d;color:#b9c2c7;cursor:pointer}.palette-tabs button[aria-pressed=true]{border-color:#9ddcff;background:#46a0cd38;color:#fff}.palette-panel[hidden]{display:none}.palette-hint{margin:-7px 0 10px;color:#aab4ba;font-size:11px;text-align:center}.palette-empty{padding:36px 10px;color:#8f9aa0;text-align:center}.brush-size-control{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 0 16px;color:#d6dde1;font-size:13px;font-weight:650}.brush-size-control button{display:grid;width:32px;height:32px;padding:0;place-items:center;border:1px solid rgb(255 255 255 / 20%);border-radius:6px;background:#20282c;cursor:pointer}.brush-size-control button:hover{background:#2c383e}.brush-size-control button[aria-pressed=true]{border-color:#9ddcff;background:#46a0cd47;box-shadow:0 0 0 1px #9ddcff}.brush-size-control button:focus-visible{outline:2px solid white;outline-offset:2px}.brush-size-control i{display:block;border-radius:50%;background:#e8f5fb}.brush-size-control [data-brush-size="1"] i{width:6px;height:6px}.brush-size-control [data-brush-size="3"] i{width:13px;height:13px}.brush-size-control [data-brush-size="5"] i{width:21px;height:21px}.brush-size-control [data-brush-size=area] i{width:20px;height:20px;border:2px solid #e8f5fb;border-radius:2px;background:repeating-linear-gradient(135deg,#e8f5fb 0 2px,transparent 2px 5px)}.brush-size-control button[aria-pressed=true] i{background:#fff}.brush-size-control [data-brush-size=area][aria-pressed=true] i{border-color:#fff;background:repeating-linear-gradient(135deg,white 0 2px,transparent 2px 5px)}.cliff-options{grid-template-columns:repeat(4,48px)}.cliff-options .tile-option{width:48px;height:48px;color:#fff;font-size:18px;font-weight:750;text-shadow:0 1px 2px rgb(0 0 0 / 80%)}.collision-options{grid-template-columns:repeat(3,40px)}.collision-options .tile-option{width:40px;height:40px;color:#fff;font-size:22px;font-weight:700}.tile-option{width:64px;height:64px;padding:0;border:3px solid transparent;border-radius:8px;background:var(--tile-color);cursor:pointer}.tile-option:hover{transform:scale(1.04)}.tile-option--sprite{position:relative;display:grid;place-items:center;background:repeating-conic-gradient(#27343a 0,#27343a 25%,#35464e 0,#35464e 50%) 0 / 16px 16px}.tile-option__tree-age{position:absolute;right:2px;bottom:2px;min-width:17px;padding:1px 3px;border:1px solid rgb(255 255 255 / 55%);border-radius:4px;background:#10191de0;color:#fff;font:700 11px/14px system-ui,sans-serif;pointer-events:none}.tile-option__icon{width:48px;height:48px;image-rendering:pixelated;pointer-events:none}.tile-option[aria-pressed=true]{border-color:#fff;box-shadow:0 0 0 2px #00000073}.tile-option:focus-visible{outline:3px solid white;outline-offset:3px}.tile-option--erase{border-color:#ffffff47;background:linear-gradient(45deg,transparent 46%,#d94b4b 47% 53%,transparent 54%),repeating-conic-gradient(#d7dde1 0,#d7dde1 25%,#fff 0,#fff 50%) 0 / 16px 16px;color:#2c343a;font-size:42px;font-weight:300;line-height:1}.collision-toggle,.height-toggle{display:flex;gap:7px;align-items:center;margin-top:12px;font-size:12px;cursor:pointer}.designer-link{display:block;margin-top:14px;color:#9ddcff;font-size:12px;text-align:center}
