:root{--face: #b99562;--face-lt: #d8bd8c;--face-dk: #7d5d34;--face-dk2: #5b4224;--ink: #2a1f12;--yellow: #ffe24a;--title: #4d6b74;--title-lt: #6c8c95;--title-dk: #2f464c;--panel: #c9a66f;--disabled: #9b8462;--pressed: #9d7c4c;--red: #c9382a;--green: #3f8f3a;--amber: #d9a21b}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#bfe0f5;font-family:Pixelify Sans,Trebuchet MS,Segoe UI,sans-serif;font-size:13px;color:var(--ink)}#app{position:relative;width:100%;height:100%}canvas#view{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:crosshair}canvas#view.pan{cursor:grabbing}canvas#view.pick{cursor:pointer}canvas#view.doze{cursor:not-allowed}canvas#view.doze.pick{cursor:pointer}.win{position:absolute;background:var(--face);border:1px solid var(--face-dk2);box-shadow:inset 1px 1px 0 var(--face-lt),inset -1px -1px 0 var(--face-dk),3px 3px #00000059;user-select:none;min-width:200px;z-index:10}.win.front{z-index:20}.win .bar{background:var(--title);color:#fff;padding:3px 6px 3px 8px;display:flex;align-items:center;justify-content:space-between;box-shadow:inset 1px 1px 0 var(--title-lt),inset -1px -1px 0 var(--title-dk);cursor:move;font-size:13px;letter-spacing:.02em;text-shadow:1px 1px 0 rgba(0,0,0,.4)}.win .bar .x{width:14px;height:14px;border:1px solid var(--title-dk);background:var(--title-lt);color:#fff;font-size:11px;line-height:12px;text-align:center;cursor:pointer}.win .body{padding:8px}.grp{position:relative;border:1px solid var(--face-dk);box-shadow:inset 1px 1px 0 var(--face-lt);padding:14px 6px 6px;margin:10px 0 0}.grp>label{position:absolute;top:-8px;left:8px;background:var(--face);padding:0 4px;font-size:12px}.row{display:flex;gap:2px;justify-content:center;flex-wrap:wrap;align-items:center}.btn{min-width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;gap:4px;white-space:nowrap;background:var(--face);border:1px solid var(--face-dk2);box-shadow:inset 1px 1px 0 var(--face-lt),inset -1px -1px 0 var(--face-dk);color:var(--ink);cursor:pointer;padding:0 5px;font:inherit}.btn:hover{background:#c4a06c}.btn:active,.btn.on{background:var(--pressed);box-shadow:inset 1px 1px 0 var(--face-dk),inset -1px -1px 0 var(--face-lt)}.btn.off,.btn:disabled{color:var(--disabled);box-shadow:none;border-color:#8f7853;cursor:default;background:var(--face)}.btn.off svg,.btn:disabled svg{opacity:.45}.btn.wide{width:100%;justify-content:space-between}.btn.text{padding:0 10px}.btn.tall{height:34px}.btn.red{background:#b04a3e;color:#fff}.btn.red.on{background:#7f2a20}.btn.amber{background:#d1a13a}.btn.amber.on{background:#8e6a1c;color:#fff}.btn.green{background:#4f9a48;color:#fff}.btn.green.on{background:#2e6a29}.btn.blue{background:#3f6fb3;color:#fff}.btn.blue.on{background:#223f6b}.btn:focus-visible{outline:2px solid var(--yellow);outline-offset:1px}.special{margin-top:6px;height:20px;display:flex;align-items:center;justify-content:space-between;padding:0 6px;background:var(--face);border:1px solid var(--face-dk2);box-shadow:inset 1px 1px 0 var(--face-lt);cursor:pointer;font-size:12px}.special .val{color:var(--yellow);text-shadow:1px 1px 0 var(--ink)}.dropdown{position:absolute;z-index:40;background:var(--face);border:1px solid var(--face-dk2);box-shadow:2px 2px #0000004d;padding:3px;display:grid;grid-template-columns:repeat(2,1fr);gap:1px 12px;max-height:60vh;overflow:auto;font-size:12px}.dropdown .it{padding:2px 6px;cursor:pointer;white-space:nowrap}.dropdown .it:hover{background:var(--pressed);color:#fff}.dropdown .it.off{color:var(--disabled);cursor:default}.dropdown .it.on{color:var(--yellow);text-shadow:1px 1px 0 var(--ink)}.build{margin-top:10px;border:1px solid var(--face-dk);box-shadow:inset 1px 1px 0 var(--face-lt);height:176px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:6px;cursor:pointer;position:relative}.build:hover{background:#c4a06c}.build.off{cursor:default;opacity:.7}.build svg{position:absolute;top:6px;left:50%;transform:translate(-50%)}.build .t{font-size:13px}.build .c{font-size:12px;color:#3b2d1b}.build .h{position:absolute;top:6px;right:8px;font-size:11px;color:#3b2d1b}.nav{display:flex;gap:6px;justify-content:center;margin-top:8px}.kv{display:grid;grid-template-columns:max-content 1fr;gap:3px 12px;font-size:12.5px}.kv .v{text-align:right;font-variant-numeric:tabular-nums}.kv .red{color:#b3261e;font-weight:700}.tabs{display:flex;gap:2px;margin:-8px -8px 8px;padding:6px 6px 0;background:var(--face-dk)}.tabs .tab{padding:4px 9px;background:var(--face);border:1px solid var(--face-dk2);border-bottom:none;cursor:pointer;font-size:12px;opacity:.8}.tabs .tab.on{opacity:1;box-shadow:inset 1px 1px 0 var(--face-lt)}.spin{display:inline-flex;align-items:center;border:1px solid var(--face-dk2);box-shadow:inset 1px 1px #00000026;background:#cfb07e;height:22px}.spin .v{min-width:84px;text-align:center;padding:0 6px}.spin button{width:20px;height:20px;border:none;background:var(--face);cursor:pointer;font:inherit;color:var(--ink);border-left:1px solid var(--face-dk)}.spin button:hover{background:#c4a06c}select.sel{font:inherit;background:#cfb07e;border:1px solid var(--face-dk2);color:var(--ink);height:22px}.status-line{margin-top:6px;padding:4px 6px;background:#cfb07e;border:1px solid var(--face-dk);font-size:12px;min-height:22px}.lights{display:flex;gap:4px}.lights .btn{width:26px;height:26px}.rating{display:grid;grid-template-columns:90px 1fr max-content;gap:3px 8px;align-items:center;font-size:12.5px}.rating .bar{height:10px;background:#8d7048;border:1px solid var(--face-dk2);position:relative}.rating .bar i{position:absolute;left:0;top:0;bottom:0}.rating .e i{background:#2f8f2a}.rating .i i{background:#d9a21b}.rating .n i{background:#b04a3e}#toolbar{position:absolute;top:8px;left:8px;display:flex;gap:4px;z-index:30;flex-wrap:wrap;max-width:70vw}#toolbar .btn{height:30px}#toolbar .btn.text{font-size:12.5px}.tip{position:absolute;z-index:60;background:#fff8dc;border:1px solid var(--ink);padding:2px 6px;font-size:12px;pointer-events:none;box-shadow:2px 2px #0000004d}#toasts{position:absolute;left:50%;bottom:24px;transform:translate(-50%);display:flex;flex-direction:column;gap:6px;z-index:50;align-items:center;pointer-events:none}.toast{background:var(--face);border:1px solid var(--face-dk2);box-shadow:inset 1px 1px 0 var(--face-lt),3px 3px #00000059;padding:6px 14px;text-align:center;min-width:240px}.toast .t{font-size:13px}.toast .d{font-size:12px;color:#3b2d1b;margin-top:2px}.toast.error .t{color:#8c1d12}.toast.info{border-color:#2f5a2c}.modal{position:absolute;inset:0;background:#00000040;z-index:45;display:grid;place-items:center}.picker{width:640px;max-width:94vw}.picker .list{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.picker .card{background:#cfb07e;border:1px solid var(--face-dk2);box-shadow:inset 1px 1px 0 var(--face-lt);padding:8px;cursor:pointer}.picker .card:hover{background:#d9bd8c}.picker .card h4{margin:0 0 4px;font-size:13px}.picker .card p{margin:0;font-size:11.5px;color:#3b2d1b;line-height:1.35}.picker .card .sw{height:6px;margin-bottom:6px}.help{width:520px;max-width:94vw;font-size:12.5px}.help table{width:100%;border-collapse:collapse}.help td{padding:2px 6px;border-bottom:1px solid var(--face-dk)}.help td:first-child{font-family:ui-monospace,monospace;white-space:nowrap}.graph{background:#1d2a30;border:1px solid var(--face-dk2);display:block}.graphbtns{display:flex;gap:3px;margin-bottom:6px}#loading{position:absolute;inset:0;display:grid;place-items:center;background:#bfe0f5;z-index:100;font-size:18px}.hint{font-size:11.5px;color:#3b2d1b;margin-top:6px;line-height:1.35}.picker.designs{width:700px}.picker .card h4{display:flex;justify-content:space-between;align-items:center}.picker .card .del{width:14px;height:14px;border:1px solid var(--face-dk2);font-size:11px;line-height:12px;text-align:center;color:#5a1d12}.picker .card .del:hover{background:#e0a090}.design-preview{background:#e8d9b6;border:1px solid var(--face-dk2);box-shadow:inset 1px 1px 0 var(--face-dk2);margin-bottom:6px;display:flex;justify-content:center}.design-preview svg{display:block;max-width:100%;height:auto}