.sf-game{--ink:#36575a;--copper:#b38d54;position:relative;isolation:isolate;width:min(100%,500px);margin:auto;border:1px solid #afc4bb;border-radius:14px;overflow:hidden;background:#e7ecdf;color:var(--ink);font:13px/1.3 system-ui,sans-serif}.sf-game *{box-sizing:border-box}.sf-game button,.sf-game select{font:inherit;color:inherit}.sf-game button{min-height:40px;border:1px solid #a2b8ac;border-radius:7px;background:#f6efd9;padding:6px 9px;touch-action:manipulation;cursor:pointer}.sf-game button:disabled{opacity:.45;cursor:default}.sf-game button:focus-visible,.sf-game select:focus-visible{outline:3px solid #bd8d44;outline-offset:-3px}.sf-hud{display:flex;gap:8px;align-items:center;padding:8px 10px;background:#f1e9d1;border-bottom:1px solid #bbc9b6}.sf-game .sf-heading{flex:1;min-width:0;text-align:start;border:0;background:transparent;padding:0}.sf-heading strong,.sf-heading small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sf-heading strong{font-size:13px}.sf-heading small{font-size:11px;margin-top:3px}.sf-meters{display:grid;grid-template-columns:auto auto;gap:2px 9px;font-size:11px;font-variant-numeric:tabular-nums}.sf-meters b{color:#987940}.sf-meters span:last-child{grid-column:1/-1;text-align:end}.sf-warning{color:#a65e43}.sf-game .sf-menu{min-width:40px;font-size:18px}.sf-factory{padding:8px;background:#365b60}.sf-board{display:grid;grid-template-columns:repeat(8,minmax(30px,1fr));direction:ltr;width:min(100%,368px);margin:auto;border:1px solid #7d9d8f;border-radius:5px;overflow:hidden;background:#75998e}.sf-game .sf-cell{aspect-ratio:1;position:relative;display:block;min-width:30px;min-height:30px;border:0;border-radius:0;padding:0;background:#73968a;box-shadow:inset -1px -1px #3d686a80;opacity:1;overflow:hidden}.sf-game .sf-cell:nth-child(2n){background:#7b9c8d}.sf-game .sf-cell:hover:not(:disabled){background:#9cb5a0}.sf-game .sf-cell.sf-deposit{background:#7f8c76}.sf-game .sf-cell.sf-rough{background:#a7a185}.sf-game .sf-cell.sf-selected{outline:3px solid #f5d183;outline-offset:-3px;z-index:1}.sf-cell-art{display:block;width:100%;height:100%}.sf-cell-art svg{display:block;width:100%;height:100%}.sf-cell-art>b{display:block;text-align:center;line-height:2;font-size:24px;color:#526e68}.sf-cargo{position:absolute;bottom:1px;right:2px;min-width:13px;font-size:15px;line-height:1;text-shadow:0 0 2px #fff6d4,0 1px 1px #fff6d4;pointer-events:none}.sf-work{position:absolute;bottom:0;left:0;height:3px;background:#e6c879;pointer-events:none}.sf-starved:after,.sf-blocked:after{content:'ϟ';position:absolute;top:0;right:2px;font-size:13px;color:#f8dfa0;text-shadow:0 1px #765e3a}.sf-blocked:after{content:'!';color:#ffd8ab}.sf-toolbox{display:flex;gap:5px;overflow-x:auto;scrollbar-width:thin;padding:7px;background:#d9e2d2;overscroll-behavior-x:contain}.sf-game .sf-toolbox button{display:flex;align-items:center;gap:3px;flex:0 0 auto;min-width:72px;min-height:45px;padding:3px 5px;font-size:10px}.sf-toolbox button svg,.sf-toolbox button>b{display:block;width:32px;height:32px}.sf-toolbox button>b{font-size:26px;text-align:center}.sf-toolbox span small{display:block;color:#8e784f;font-size:9px}.sf-game button[aria-pressed=true]{background:#416f70;border-color:#345e63;color:#fff1d5}.sf-toolbox button[aria-pressed=true] small{color:#e4d5a9}.sf-toolbox button[hidden]{display:none}.sf-edit{display:flex;gap:6px;padding:0 7px 6px;background:#d9e2d2}.sf-edit button{flex:none;font-size:11px;min-width:42px}.sf-edit select{flex:1;min-width:0;min-height:40px;border:1px solid #a6b8a4;border-radius:7px;background:#f8f1dd;padding:5px;font-size:11px}.sf-inspect{min-height:39px;padding:6px 9px;background:#edf0e3;font-size:11px;line-height:1.35;color:#66817b;overflow-wrap:anywhere}.sf-footer{display:flex;gap:7px;align-items:center;padding:7px;background:#f3ead1;border-top:1px solid #bcc9b5}.sf-game .sf-primary{background:#47777a;color:#fff5d8;border-color:#376369}.sf-footer>.sf-primary{flex:1;font-size:12px}.sf-footer>button{min-width:42px}.sf-save{font-size:9px;max-width:90px;line-height:1.3;color:#778b75;overflow-wrap:anywhere}.sf-layer{position:absolute;inset:0;z-index:4;display:flex;align-items:center;justify-content:center;background:#244b51c9;padding:14px;backdrop-filter:blur(3px)}.sf-layer[hidden]{display:none}.sf-panel{width:min(100%,420px);max-height:100%;overflow:auto;overscroll-behavior:contain;padding:20px;border:1px solid #b9ac81;border-radius:13px;background:#f7eed7;box-shadow:0 12px 25px #1d3e4433;outline:none}.sf-panel h2{font-size:21px;line-height:1.25;margin:0 0 12px;color:#426d71}.sf-panel p{font-size:12px;line-height:1.6;color:#798875;margin:9px 0}.sf-panel-actions{display:flex;flex-direction:column;gap:7px;margin-top:15px}.sf-panel-actions button{font-size:12px;min-height:42px}.sf-result{font-size:35px;text-align:center;color:#b09152;padding:10px}@media(max-width:440px){.sf-game{border-radius:9px}.sf-hud{padding:6px 7px;gap:6px}.sf-heading strong{font-size:11px}.sf-heading small{font-size:10px}.sf-meters{font-size:10px;gap:2px 7px}.sf-factory{padding:6px}.sf-toolbox{padding:6px;gap:4px}.sf-game .sf-toolbox button{min-width:70px;min-height:43px;font-size:9px}.sf-edit{padding:0 6px 5px;gap:5px}.sf-edit button,.sf-edit select{font-size:10px}.sf-inspect{font-size:10px;min-height:37px;padding:5px 7px}.sf-footer{padding:6px;gap:5px}.sf-footer>.sf-primary{font-size:11px}.sf-save{font-size:8px;max-width:64px}.sf-panel{padding:16px}.sf-panel h2{font-size:19px}.sf-panel p{font-size:11px}}@media(prefers-reduced-motion:reduce){.sf-game *{animation:none!important;transition:none!important}}