:root{--panel: rgba(253, 246, 227, .94);--panel-dark: rgba(46, 38, 24, .78);--ink: #4a3a20;--ink-soft: #7a6540;--line: #e2d4b2;--accent: #e8a33d;--accent-soft: #fbe8c8;--green: #4ab86e;--radius: 12px;--radius-sm: 8px;--shadow: 0 4px 18px rgba(60, 40, 10, .16);--font: "Segoe UI", "Malgun Gothic", sans-serif;--rail-w: 116px}*{margin:0;padding:0;box-sizing:border-box}html,body,#app{width:100%;height:100%;overflow:hidden;font-family:var(--font);-webkit-user-select:none;user-select:none}#view{display:block;width:100%;height:100%}.panel,#filebar,#status,#warnings,#growth{background:var(--panel);border-radius:var(--radius);box-shadow:var(--shadow)}button{font-family:inherit;cursor:pointer}#rail{position:fixed;right:12px;top:12px;bottom:12px;width:var(--rail-w);display:flex;flex-direction:column;gap:8px;pointer-events:none;z-index:20}#rail>*{pointer-events:auto;flex:0 0 auto}#filebar{order:1}#status{order:2}#warnings{order:3}#rail-foot{order:9;margin-top:auto;display:flex;flex-direction:column;gap:6px}#filebar{display:flex;flex-direction:column;gap:4px;padding:7px 7px 8px;font-size:11px}.fb-title{font-size:9.5px;font-weight:700;color:var(--ink-soft);letter-spacing:.04em;padding-bottom:2px;border-bottom:1px solid var(--line)}.fb-row{display:flex;flex-direction:column;gap:4px}#filebar select,#filebar button,#filebar label{width:100%;padding:5px 4px;border:1px solid var(--line);border-radius:var(--radius-sm);background:#fff;font-size:10.5px;color:var(--ink);text-align:center;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#filebar select{text-align:left;padding-left:5px}#filebar select:hover,#filebar button:hover,#filebar label:hover{background:var(--accent-soft)}#fb-reset{border-color:#e0b0a0!important;color:#a05030!important}#status{padding:5px 7px;font-size:10.5px;line-height:1.4;color:var(--ink-soft);white-space:pre-line;word-break:keep-all;overflow-wrap:anywhere}#warnings{max-height:34vh;overflow-y:auto;padding:6px 7px;font-size:10.5px;line-height:1.35;color:var(--ink);word-break:keep-all}#warnings .warn{padding:4px 5px;font-size:10.5px;line-height:1.3}#warnings:empty{display:none}#warnings .warn{display:block;width:100%;text-align:left;padding:5px 6px;margin:2px 0;border:none;border-radius:6px;background:#fdf0d8;color:#8a5a20;font-size:11.5px}#warnings .warn:hover{background:#fbe4b8}#toolbar{position:fixed;left:0;top:0;bottom:0;width:252px;background:var(--panel);border-right:1px solid var(--line);box-shadow:3px 0 16px #3c280a1a;overflow-y:auto;overflow-x:hidden;padding:10px 12px 16px;z-index:15;scrollbar-width:thin;overscroll-behavior:contain}.tb-brand{display:flex;flex-direction:column;gap:1px;padding:2px 2px 8px;margin-bottom:8px;border-bottom:2px solid var(--line)}.tb-brand b{font-size:13px;color:var(--ink);letter-spacing:.02em}.tb-brand span{font-size:10px;color:var(--ink-soft)}.tool-group{margin-bottom:10px}.tool-group-title{font-size:10.5px;font-weight:700;color:var(--ink-soft);letter-spacing:.06em;padding:3px 4px 4px;border-bottom:1px solid var(--line);margin-bottom:5px}.tool-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}#design-editor{position:fixed;top:0;right:0;bottom:0;left:0;background:#1e190f99;display:flex;align-items:center;justify-content:center;z-index:300}.de-card{background:var(--panel);border-radius:16px;padding:16px 20px 18px;max-height:94vh;overflow-y:auto;box-shadow:0 12px 44px #281e0a73}.de-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}#de-name{flex:1;font-size:15px;font-weight:700;color:var(--ink);padding:6px 10px;border:1px solid var(--line);border-radius:var(--radius-sm);background:#fff;font-family:inherit}#de-close{border:none;background:transparent;font-size:15px;color:var(--ink-soft)}.de-body{display:flex;gap:18px;align-items:flex-start}#de-canvas{display:block;border:2px solid var(--line);border-radius:6px;cursor:crosshair;image-rendering:pixelated}.de-tilewrap{margin-top:10px;font-size:11px;color:var(--ink-soft)}#de-tile{display:block;margin-top:4px;border:2px solid var(--line);border-radius:6px;image-rendering:pixelated}.de-right{width:230px;display:flex;flex-direction:column;gap:12px}.de-sec h4{font-size:11.5px;color:var(--ink-soft);margin-bottom:6px;letter-spacing:.04em}.de-tools,.de-brush,.de-actions,.de-save{display:grid;grid-template-columns:1fr 1fr;gap:5px}.de-brush{grid-template-columns:auto 1fr 1fr 1fr;align-items:center;font-size:11px;color:var(--ink-soft);margin-top:5px}.de-actions{grid-template-columns:1fr 1fr 1fr}#design-editor button{padding:6px 8px;border:1px solid var(--line);border-radius:var(--radius-sm);background:#fff;font-size:11.5px;color:var(--ink);font-family:inherit}#design-editor button:hover{background:var(--accent-soft)}#design-editor button.active{border-color:var(--accent);background:var(--accent-soft);font-weight:700}#design-editor button.primary{background:var(--green);border-color:#3a9c58;color:#fff;font-weight:700}.de-palette{display:grid;grid-template-columns:repeat(8,1fr);gap:3px}.de-swatch{height:24px;padding:0!important;border:2px solid rgba(0,0,0,.18)!important;border-radius:5px!important}.de-swatch.active{outline:2px solid var(--accent);outline-offset:1px}.de-transparent{grid-column:span 2;font-size:9.5px!important;background:repeating-conic-gradient(#ddd,#ddd 25%,#fff 0%,#fff 50%) 0 0/10px 10px!important}.de-colorrow{display:flex;align-items:center;gap:6px;margin-top:7px;font-size:11px;color:var(--ink-soft)}#de-color{width:38px;height:26px;padding:0;border:1px solid var(--line);border-radius:5px;background:none}#de-hex{flex:1;width:0;padding:5px 7px;border:1px solid var(--line);border-radius:5px;font-size:11px;font-family:monospace}#de-snap{width:100%;margin-top:7px}#design-import{position:fixed;top:0;right:0;bottom:0;left:0;background:#1e190f99;display:flex;align-items:center;justify-content:center;z-index:300}.di-card{background:var(--panel);border-radius:16px;padding:16px 20px 18px;max-height:94vh;overflow-y:auto;box-shadow:0 12px 44px #281e0a73}.di-body{display:flex;gap:20px;align-items:flex-start}.di-col h4{font-size:11.5px;color:var(--ink-soft);margin-bottom:6px}#di-src,#di-out,#di-tile{display:block;border:2px solid var(--line);border-radius:6px}#di-src{cursor:grab}#di-out,#di-tile{image-rendering:pixelated}#di-name{flex:1;font-size:15px;font-weight:700;color:var(--ink);padding:6px 10px;border:1px solid var(--line);border-radius:var(--radius-sm);background:#fff;font-family:inherit}#design-import button,.di-file{padding:6px 10px;border:1px solid var(--line);border-radius:var(--radius-sm);background:#fff;font-size:11.5px;color:var(--ink);font-family:inherit;cursor:pointer}.di-file{display:block;margin-top:8px;text-align:center;border-style:dashed}#design-import button:hover,.di-file:hover{background:var(--accent-soft)}#design-import button.primary{background:var(--green);border-color:#3a9c58;color:#fff;font-weight:700}#design-import button:disabled{opacity:.45;cursor:default}.di-slider{display:flex;align-items:center;gap:7px;margin-top:7px;font-size:11px;color:var(--ink-soft)}.di-slider input{flex:1;accent-color:var(--accent)}.di-slider b{width:30px;text-align:right;font-variant-numeric:tabular-nums}.di-check{display:flex;align-items:center;gap:6px;margin-top:9px;font-size:11.5px;color:var(--ink)}.di-note{width:264px;margin:10px 0;font-size:10.5px;line-height:1.5;color:var(--ink-soft)}.di-grid-pick{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;width:264px;margin-bottom:2px}#design-import .di-grid-pick button{display:flex;flex-direction:column;align-items:center;gap:2px;padding:7px 4px;line-height:1.2}.di-grid-pick button b{font-size:13px;color:var(--ink)}.di-grid-pick button span{font-size:9.5px;color:var(--ink-soft)}#design-import .di-grid-pick button.active{border-color:var(--accent);background:var(--accent-soft)}.di-slots{width:264px;margin:7px 0 2px;padding:5px 7px;border-radius:var(--radius-sm);background:#4ab86e24;font-size:10.5px;line-height:1.45;color:var(--ink)}.di-slots.short{background:#c8503221;color:#a04028}#di-tilewrap[hidden]{display:none}#design-import .de-save{display:grid;grid-template-columns:1fr 1fr;gap:6px}.design-head{margin-bottom:6px}.design-head button{width:100%;padding:7px 8px;border:1px dashed var(--line);border-radius:var(--radius-sm);background:#785a280f;font-size:11.5px;color:var(--ink-soft);font-family:inherit}.design-head button:hover{background:var(--accent-soft);color:var(--ink)}#slot-menu{position:fixed;z-index:60;min-width:168px;padding:4px;display:flex;flex-direction:column;gap:1px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 10px 28px #281e0a47}#slot-menu button{padding:7px 10px;text-align:left;border:0;border-radius:var(--radius-sm);background:transparent;color:var(--ink);font-size:12px;font-family:inherit;cursor:pointer}#slot-menu button:hover{background:var(--accent-soft)}#slot-menu button.danger{color:#c0392b}#slot-menu button.danger:hover{background:#c0392b1f}#slot-menu.rename{flex-direction:row;gap:4px;padding:6px}#slot-menu.rename input{flex:1;min-width:0;padding:6px 8px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--panel-2, #fff);color:var(--ink);font-size:12px;font-family:inherit}#slot-menu.rename button.primary{flex:0 0 auto;background:var(--accent);color:#fff}.design-tool{position:relative}.de-edit{position:absolute;top:1px;right:1px;font-size:9px;opacity:.55;line-height:1}.design-tool:hover .de-edit{opacity:1}.design-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}.design-tool .dz{width:38px;height:38px;image-rendering:pixelated;border-radius:4px;display:block}#toolbar .tool.design-tool .label{font-size:9px;line-height:1.15;white-space:normal;overflow:visible;text-overflow:clip;text-align:center;word-break:keep-all}.tool-mode{display:grid;grid-template-columns:repeat(2,1fr);gap:4px}.mode-btn{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px 2px;border:2px solid transparent;border-radius:var(--radius-sm);background:#785a2812;color:var(--ink-soft);font-size:11px}.mode-btn .icon{font-size:13px}.mode-btn:hover{background:#785a2824}.mode-btn.active{border-color:#4ab8ff;background:#ddf0ff;color:#1c5e8a;font-weight:600}#toolbar .tool{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:0;padding:7px 2px 6px;border:2px solid transparent;border-radius:var(--radius-sm);background:transparent}#toolbar .tool .icon{font-size:18px;line-height:1.1}#toolbar .tool .label{max-width:100%;font-size:10px;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#toolbar .tool:hover{background:#785a2817}#toolbar .tool.active{border-color:var(--accent);background:var(--accent-soft)}#hint{position:fixed;left:50%;bottom:12px;transform:translate(-50%);background:var(--panel-dark);color:#fdf6e3;border-radius:999px;padding:6px 16px;font-size:11.5px;letter-spacing:.02em;pointer-events:none;white-space:nowrap;z-index:18}body.mode-fps #hint{bottom:96px}#growth{position:fixed;left:50%;bottom:48px;transform:translate(-50%);display:flex;align-items:center;gap:10px;padding:8px 14px;font-size:12px;color:var(--ink);z-index:18}body.mode-fps #growth{bottom:132px}#growth input[type=range]{width:150px;accent-color:var(--green)}#hotbar{position:fixed;left:50%;bottom:14px;transform:translate(-50%);display:flex;gap:5px;background:var(--panel-dark);border-radius:14px;padding:6px;z-index:18}.hb-slot{position:relative;width:56px;height:58px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;border:2px solid rgba(255,250,235,.22);border-radius:9px;background:#fffaeb1a}.hb-slot:hover{background:#fffaeb33}.hb-slot.active{border-color:#ffd75e;background:#ffd75e38}.hb-key{position:absolute;top:2px;left:5px;font-size:9px;color:#fffaebbf}.hb-icon{font-size:17px}.hb-label{font-size:9px;color:#fdf6e3;white-space:nowrap}#crosshair{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);color:#ffffffeb;font-size:18px;text-shadow:0 0 4px rgba(0,0,0,.6);pointer-events:none;z-index:17}#basemapBtn,#helpBtn{width:100%;padding:7px 6px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--panel);font-size:10.5px;line-height:1.3;white-space:normal;word-break:keep-all;color:var(--ink);box-shadow:var(--shadow)}#basemapBtn{order:1}#helpBtn{order:2}#basemapBtn:hover,#helpBtn:hover{background:var(--accent-soft)}body.mode-fps #filebar,body.mode-fps #warnings,body.mode-fps #basemapBtn{display:none}#wizard{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;background:#171a20;z-index:100}#wz-canvas-wrap{flex:1;min-width:0}#wz-canvas{display:block;cursor:crosshair}#wz-panel{width:300px;padding:20px 18px;background:var(--panel);display:flex;flex-direction:column;gap:12px;overflow-y:auto}#wz-panel h2{font-size:17px;color:var(--ink)}#wz-panel p{font-size:12.5px;line-height:1.6;color:var(--ink-soft)}#wz-tools{display:flex;flex-wrap:wrap;gap:6px}#wz-tools button,#wz-nav button{padding:7px 12px;border:2px solid var(--line);border-radius:var(--radius-sm);background:#fff;font-size:12px}#wz-tools button.active{border-color:var(--accent);background:var(--accent-soft)}#wz-tools input[type=file]{font-size:12px;width:100%}.wz-colors{display:flex;gap:6px;width:100%}.wz-color{width:28px;height:28px;border-radius:50%!important;padding:0!important}.wz-color.active{outline:3px solid var(--ink)}#wz-nav{margin-top:auto;display:flex;justify-content:space-between}#wz-nav button:disabled{opacity:.4;cursor:default}#wz-nav button.primary{background:var(--green);border-color:#3a9c58;color:#fff;font-weight:700;padding:9px 16px}#wz-panel p{white-space:pre-line}#help{position:fixed;top:0;right:0;bottom:0;left:0;background:#1e190f8c;display:flex;align-items:center;justify-content:center;z-index:200}#help[hidden]{display:none}.help-card{background:var(--panel);border-radius:16px;padding:22px 26px;max-width:880px;max-height:86vh;overflow-y:auto;box-shadow:0 10px 40px #281e0a66}.help-card h2{font-size:18px;color:var(--ink);margin-bottom:14px;display:flex;justify-content:space-between}.help-close{font-size:13px;color:#a08a60;cursor:pointer}.help-cols{display:flex;gap:22px;flex-wrap:wrap}.help-cols section{flex:1;min-width:230px}.help-cols h3{font-size:13.5px;color:var(--ink-soft);margin-bottom:7px}.help-cols table{width:100%;border-collapse:collapse;font-size:12px;color:var(--ink)}.help-cols td{padding:3.5px 6px;border-bottom:1px solid #ede0c4}.help-cols td:first-child{font-weight:600;white-space:nowrap;color:#8a6a35}