:root{color:#202521;background:#e8eae5;font-family:Inter,Noto Sans SC,Microsoft YaHei,system-ui,sans-serif;font-synthesis:none;--ink: #202521;--muted: #697269;--line: #cdd2cc;--panel: #f7f8f5;--green: #3d684d;--green-dark: #2d4e39;--gold: #b68a2e;--danger: #a9433d}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;overflow:hidden}#app{height:100vh;height:100dvh;display:grid;grid-template-rows:auto minmax(0,1fr)}button,input,select{font:inherit;letter-spacing:0}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}svg{width:16px;height:16px;stroke-width:1.8}button svg{flex-shrink:0}button:focus-visible,a:focus-visible,.switch-row:has(input:focus-visible){outline:2px solid var(--gold);outline-offset:2px}.topbar{min-height:62px;padding:10px 22px;gap:10px 16px;color:#f3f5f0;background:#202521;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;border-bottom:3px solid var(--gold)}.brand{display:flex;align-items:center;gap:11px}.brand-mark{width:32px;height:32px;flex-shrink:0;image-rendering:pixelated}.brand strong,.brand small{display:block;letter-spacing:0}.brand strong{font-size:16px;font-weight:650}.brand small{margin-top:2px;color:#aeb7af;font-size:10px;text-transform:uppercase}.runtime{display:flex;align-items:center;gap:8px;color:#cbd1cb;font-size:12px;white-space:nowrap}.status-dot{width:7px;height:7px;border-radius:50%;background:#c3a253}.status-dot.ready{background:#70b37e}.status-dot.error{background:#e06c63}.version{padding-left:10px;margin-left:4px;border-left:1px solid #505750;color:#929b93}.about-link{min-height:34px;padding:0 8px;display:inline-flex;align-items:center;gap:5px;color:#dce3dc;text-decoration:none;border:1px solid #505750}.about-link:hover,.about-link[aria-current=page]{color:#f0c65d;border-color:var(--gold)}.about-page{min-height:0;padding:clamp(20px,5vw,64px) 20px;overflow-y:auto;background:#e8eae5}.about-content{max-width:760px;margin:0 auto}.about-back{min-height:44px;margin-bottom:18px;display:inline-flex;align-items:center;gap:8px;color:var(--green-dark);text-decoration:none;font-size:13px}.about-back:hover{text-decoration:underline}.about-card{padding:clamp(24px,5vw,48px);border:1px solid var(--line);border-top:3px solid var(--gold);background:var(--panel)}.about-heading>span{color:#806324;font-size:12px}.about-heading h1{margin:14px 0;color:var(--green-dark);font-size:clamp(24px,4vw,32px);line-height:1.35}.about-heading p{margin:0;color:var(--muted);font-size:13px;line-height:1.8}.about-details{margin:32px 0 0}.about-details>div{display:grid;grid-template-columns:128px minmax(0,1fr);gap:12px;padding:22px 0;border-top:1px solid var(--line)}.about-details dt{color:var(--muted);font-size:12px;line-height:1.8}.about-details dd{min-width:0;margin:0;font-size:14px;line-height:1.6}.about-author{color:var(--green-dark);font-weight:650}.about-source{display:inline-flex;align-items:baseline;gap:7px;max-width:100%;overflow-wrap:anywhere;color:var(--green);text-underline-offset:4px}.about-source svg{flex-shrink:0;align-self:center}.workspace{min-height:0;display:grid;grid-template-columns:clamp(280px,23vw,360px) minmax(0,1fr)}.controls{min-width:0;min-height:0;overflow:hidden;background:var(--panel);border-right:1px solid var(--line)}#generation-form{height:100%;display:flex;flex-direction:column}.control-fields{min-height:0;overflow-y:auto;flex:1}.control-section{padding:18px 20px;border-bottom:1px solid var(--line)}.section-title{margin-bottom:14px;display:flex;align-items:center;justify-content:space-between;color:#424942;font-size:12px;font-weight:700;text-transform:uppercase}.section-title svg{color:#7e887e}.segmented{display:grid;grid-template-columns:1fr 1fr;margin-bottom:15px;border:1px solid #bfc5bf;background:#e7e9e5}.segmented button{height:34px;border:0;color:#626a63;background:transparent;font-size:13px}.segmented button.active{color:#fff;background:var(--green)}label{display:block;margin-bottom:13px;color:#555e56;font-size:12px}label,input,select{min-width:0}input,select{width:100%;height:36px;margin-top:6px;padding:0 10px;color:var(--ink);border:1px solid #bdc4bd;border-radius:2px;outline:none;background:#fff}input:focus,select:focus{border-color:var(--green);box-shadow:0 0 0 2px #3d684d21}.field-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.field-note{min-height:32px;margin:-4px 0 0;color:var(--muted);font-size:11px;line-height:1.5}.recipe-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 10px}.input-action{display:grid;grid-template-columns:minmax(0,1fr) 36px;gap:6px}.input-action .icon-button{margin-top:6px}.icon-button{width:36px;height:36px;padding:0;display:inline-grid;place-items:center;border:1px solid #bac1bb;background:#f9faf8;color:#4f5850}.inline-error{margin:12px 20px 0;padding:10px;color:#7f2e29;background:#f6dedb;border-left:3px solid var(--danger);font-size:12px}.form-actions{padding:14px 20px;display:flex;flex-shrink:0;gap:8px;background:var(--panel);border-top:1px solid var(--line)}.form-actions button{height:40px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0}.primary{flex:1;color:#fff;background:var(--green)}.primary:hover{background:var(--green-dark)}.secondary{padding:0 15px;color:#4e5650;background:#dde1dc}.generate-hint{margin:0;padding:10px 20px 0;color:#8a651d;background:var(--panel);font-size:11px;line-height:1.45}.result-area{min-width:0;min-height:0;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;background:#dfe3dd}.result-toolbar{min-width:0;min-height:50px;padding:8px 14px;gap:8px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;background:#f7f8f5;border-bottom:1px solid var(--line)}.view-tabs,.toolbar-actions{min-width:0;display:flex;flex-wrap:wrap;align-items:center;gap:4px}.toolbar-actions{margin-left:auto}.download-actions{display:flex;gap:4px;margin-left:auto}.view-tabs button,.toolbar-actions button{height:34px;padding:0 11px;display:inline-flex;align-items:center;gap:6px;border:1px solid transparent;color:#626a63;background:transparent;font-size:12px}.view-tabs button,.toolbar-actions button,.report-header button{flex-shrink:0;white-space:nowrap}.view-tabs button.active{color:var(--green-dark);border-bottom-color:var(--green)}.toolbar-actions button{border-color:#c1c7c1;background:#fff}.toolbar-actions .accent{color:#fff;border-color:var(--green);background:var(--green)}.toolbar-actions .icon-button{padding:0;justify-content:center}.notice{min-width:0;min-height:50px;padding:9px 18px;display:flex;flex-direction:column;justify-content:center;overflow-wrap:anywhere;color:#586159;background:#edf0eb;border-bottom:1px solid #cbd0ca}.notice strong{color:#303630;font-size:12px}.notice span{margin-top:2px;font-size:11px}.notice.working{border-left:3px solid var(--gold)}.notice.success{border-left:3px solid var(--green)}.notice.error{color:#773832;background:#f5e4e1;border-left:3px solid var(--danger)}.preview-layout{min-width:0;min-height:0;padding:14px;display:grid;grid-template-columns:minmax(0,1fr) 156px;grid-template-rows:minmax(0,1fr);gap:12px}.canvas-shell{position:relative;min-width:0;min-height:0;overflow:hidden;background:#171b18;border:1px solid #343b35}#preview-note{position:absolute;top:10px;left:10px;right:10px;margin:0;padding:7px 9px;color:#d8ddd8;background:#151916e0;font-size:10px;line-height:1.5;pointer-events:none}canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}canvas:active{cursor:grabbing}.legend{position:absolute;left:10px;bottom:10px;padding:7px 9px;display:flex;flex-wrap:wrap;gap:9px;color:#d8ddd8;background:#151916e0;border:1px solid #495049;font-size:10px}.legend span{display:flex;align-items:center;gap:4px}.legend b{width:9px;height:9px;display:inline-block}.legend .land{background:#6f8c58}.legend .water{background:#477b8c}.legend .shore{background:#b6aa72}.legend .cliff{background:#655f54}.legend .ore{background:#e4bd42}.layers{min-width:0;min-height:0;padding:14px;overflow-y:auto;background:#f7f8f5;border:1px solid #c8cec8}.switch-row{height:34px;margin:0;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e1e4df}.switch-row input{position:absolute;width:1px;height:1px;margin:0;opacity:0;pointer-events:none}.switch-row i{width:28px;height:16px;position:relative;border-radius:10px;background:#b5bbb5;transition:.15s}.switch-row i:after{content:"";width:12px;height:12px;position:absolute;top:2px;left:2px;border-radius:50%;background:#fff;transition:.15s}.switch-row input:checked+i{background:var(--green)}.switch-row input:checked+i:after{transform:translate(12px)}.native-parameter-switch{margin-bottom:8px;cursor:pointer}.native-parameter-switch:has(input:disabled){cursor:default;opacity:.55}.native-parameter-note{margin:0 0 14px}.report-panel{min-width:0;min-height:0;margin:14px;display:flex;flex-direction:column;background:#171b18;border:1px solid #343b35}.report-header{min-height:44px;padding:8px 14px;display:flex;flex-wrap:wrap;flex-shrink:0;align-items:center;justify-content:space-between;gap:8px 12px;color:#d9e0da;border-bottom:1px solid #343b35;font-size:12px}.report-header button{min-height:30px;padding:0 9px;display:inline-flex;align-items:center;gap:6px;color:#d9e0da;background:#2b332d;border:1px solid #4b5b4d}.report{min-height:0;margin:0;padding:18px;flex:1;overflow:auto;color:#d9e0da;font:12px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere}.result-meta{min-width:0;min-height:34px;padding:8px 15px;display:flex;flex-wrap:wrap;align-items:center;gap:4px 20px;overflow-wrap:anywhere;color:#6b736c;background:#f1f3ef;border-top:1px solid var(--line);font-size:10px}.result-meta span{min-width:0}.runtime-separator{width:1px;height:14px;margin:0 3px;background:#505750}#offline-status{color:#f0c65d}.offline-overlay{--offline-gap: 18px;position:fixed;right:max(var(--offline-gap),env(safe-area-inset-right));bottom:max(var(--offline-gap),env(safe-area-inset-bottom));z-index:20;width:min(420px,calc(100% - 2 * var(--offline-gap) - env(safe-area-inset-left) - env(safe-area-inset-right)));opacity:1;pointer-events:none;transform:translateY(0);transition:opacity .26s ease,transform .26s ease}.offline-overlay.is-hiding{opacity:0;pointer-events:none;transform:translateY(10px)}.offline-dialog{width:100%;max-height:calc(100dvh - 2 * var(--offline-gap) - env(safe-area-inset-top) - env(safe-area-inset-bottom));padding:15px 16px;overflow-y:auto;overflow-wrap:anywhere;color:#e7ece7;background:#202521;border:1px solid #657067;border-top:3px solid var(--gold);box-shadow:0 18px 42px #00000047;pointer-events:auto}.offline-overlay.ready .offline-dialog{border-top-color:var(--green)}.offline-overlay.error .offline-dialog{border-top-color:var(--danger)}.offline-kicker{color:#b9c2b9;font:11px/1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.08em}.offline-dialog h1{margin:8px 0 4px;color:#f5f7f3;font-size:17px;font-weight:650}.offline-dialog p{margin:0 0 10px;color:#bfc8bf;font-size:11px;line-height:1.45}.offline-dialog progress{width:100%;height:7px;display:block;appearance:none;border:0;background:#424a43}.offline-dialog progress::-webkit-progress-bar{background:#424a43}.offline-dialog progress::-webkit-progress-value{background:var(--gold)}.offline-dialog progress::-moz-progress-bar{background:var(--gold)}.offline-overlay.ready progress::-webkit-progress-value,.offline-overlay.ready progress::-moz-progress-bar{background:#70b37e}.offline-overlay.error progress::-webkit-progress-value,.offline-overlay.error progress::-moz-progress-bar{background:var(--danger)}.offline-progress-meta{margin-top:6px;display:flex;justify-content:space-between;color:#bfc8bf;font-size:10px}.offline-progress-meta strong{color:#f0c65d;font-weight:650}.offline-overlay.ready .offline-progress-meta strong{color:#89cc94}.offline-loading-meta{min-height:17px;margin-top:8px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;color:#bfc8bf;font-size:11px;line-height:1.5;font-variant-numeric:tabular-nums}#offline-eta{margin-left:auto;white-space:nowrap}.offline-actions{margin-top:10px;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.offline-actions:not(:has(button:not([hidden]))){display:none}.offline-actions button{min-height:30px;padding:0 11px;display:inline-flex;align-items:center;justify-content:center;gap:7px;border:0;font-size:11px}.offline-actions .primary{flex:0 0 auto;color:#fff;background:var(--green)}.offline-actions .secondary{color:#d3dbd3;background:#394239}[hidden]{display:none!important}@media(max-width:1100px){.runtime .version{display:none}.preview-layout{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto}.layers{max-height:180px;padding:10px}.layers .section-title{margin-bottom:6px}#layer-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));column-gap:16px}}@media(max-width:820px),(max-width:1000px)and (max-height:500px){body{overflow:auto}#app{height:auto;min-height:100vh;min-height:100dvh;display:block}.topbar{min-height:56px;padding:10px max(12px,env(safe-area-inset-right)) 10px max(12px,env(safe-area-inset-left))}.runtime .version,.brand small,#runtime-status,.runtime-separator{display:none}.offline-overlay{--offline-gap: 10px}.workspace{grid-template-columns:minmax(0,1fr)}.controls{overflow:visible;border-right:0;border-bottom:1px solid var(--line)}#generation-form{height:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.control-fields{display:contents}.control-section:first-child{border-right:1px solid var(--line)}.form-actions,.generate-hint,.inline-error{grid-column:1 / -1}.form-actions{padding-bottom:max(14px,env(safe-area-inset-bottom))}.result-area{grid-template-rows:auto auto auto auto}.preview-layout{grid-template-rows:auto auto;padding:10px}.canvas-shell{height:clamp(260px,60svh,600px)}.report-panel{height:clamp(300px,65svh,660px);margin:10px}.result-meta{padding-bottom:max(8px,env(safe-area-inset-bottom))}}@media(max-width:540px){.about-details>div{grid-template-columns:minmax(0,1fr);gap:8px}.brand{gap:8px}.brand strong{font-size:14px}.runtime{gap:5px;font-size:10px}#generation-form{display:block}.control-section{padding:16px}.control-section:first-child{border-right:0}.result-toolbar{padding:8px 10px}.view-tabs{width:100%}.view-tabs button{flex:1;justify-content:center;padding:0 8px}.toolbar-actions{width:100%}.report-header{padding:8px 10px}.report{padding:12px;font-size:11px}}@media(pointer:coarse),(max-width:540px){.about-link{min-height:44px}input,select{height:44px;font-size:16px}.input-action{grid-template-columns:minmax(0,1fr) 44px}.icon-button{width:44px;height:44px}.segmented button,.form-actions button,.view-tabs button,.toolbar-actions button,.report-header button,.offline-actions button,.switch-row{min-height:44px}}.parameter-details{margin-top:12px;border-top:1px solid var(--line);padding-top:10px}.parameter-details summary{cursor:pointer;padding:4px 0 8px;font-weight:600}.parameter-details .field-row{margin-top:8px}.neutral-counts{min-width:0;margin:10px 0;padding:8px;border:1px solid var(--line);border-radius:6px}.neutral-counts legend{padding:0 4px;font-size:12px}@media(prefers-reduced-motion:reduce){.offline-overlay,.switch-row i,.switch-row i:after{transition:none}}
