:root{color-scheme:light;--ink:#253c33;--muted:#58695e;--paper:#f6f5e9;--line:#cbd1be;--green:#cde3ac;--lilac:#c9bae3;--dark:#243b32;--white:#fffef6;--amber:#dca275}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 system-ui,-apple-system,"Noto Sans JP",sans-serif}button,input{font:inherit}button{color:inherit;border:1px solid var(--line);background:var(--white);border-radius:5px;cursor:pointer;padding:12px 13px;min-height:44px;transition:background .15s}button:hover{background:#e8edde}button:disabled{opacity:.4;cursor:default}button:focus-visible,input:focus-visible,summary:focus-visible,canvas:focus-visible,a:focus-visible{outline:3px solid #8960bb;outline-offset:3px}input{width:100%;min-width:0;background:var(--white);border:1px solid var(--line);border-radius:5px;color:var(--ink);padding:8px 12px;min-height:44px}input[type=range]{accent-color:#56734a;min-height:24px;padding:0;background:transparent;border:0;cursor:pointer}header{height:100px;max-width:1440px;margin:auto;padding:22px 40px;display:flex;align-items:center;justify-content:space-between;gap:15px}.wordmark{text-decoration:none;color:var(--ink);display:flex;align-items:center;gap:14px;font-family:serif;font-weight:700;font-size:25px;letter-spacing:.05em}.mark{font:36px/1 monospace;background:var(--dark);color:var(--green);padding:4px 12px 8px;border-radius:5px}.wordmark small{display:block;font:12px/1.7 system-ui;letter-spacing:.18em}.header-note{font-size:14px;text-align:right}.header-note b{display:block;font:12px/1.8 monospace;letter-spacing:.09em;color:var(--muted)}main{max-width:1440px;margin:0 auto;padding:14px 40px 0}.workbench{display:grid;grid-template-columns:290px minmax(0,1fr);border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--white);box-shadow:0 8px 32px #273b3210}.controls{padding:28px 24px;background:#eef0e2;border-right:1px solid var(--line)}.eyebrow{font:12px/1.5 monospace;letter-spacing:.14em;color:var(--muted)}h1{font:600 30px/1.45 serif;letter-spacing:.04em;margin:15px 0 24px}h2{font:600 23px/1.4 serif;margin:5px 0 0}h3{font-size:18px;line-height:1.5;margin:8px 0 12px}.algorithm{display:grid;grid-template-columns:1fr 1fr;gap:7px}.algorithm button{font:bold 13px/1.5 monospace;padding:12px 4px}.algorithm button span{display:block;font:12px/1.7 system-ui;margin-top:4px}.algorithm .selected{background:var(--dark);border-color:var(--dark);color:#f0f5df}.hint{font-size:13px;line-height:1.8;min-height:48px;color:var(--muted);margin:14px 0 22px}label{display:block;font-size:14px;font-weight:600;margin:15px 0 6px}label span{font-size:12px;float:right;color:var(--muted);font-weight:400}.seed-row{display:flex;gap:6px}.seed-row input{font-family:monospace}.seed-row button{font-size:23px;line-height:1;width:45px;padding:5px}.dimensions{display:grid;grid-template-columns:1fr 1fr;gap:12px}output{float:right;background:var(--green);padding:0 8px;border-radius:4px;min-width:32px;text-align:center}.range-labels{font-size:12px;color:var(--muted);display:flex;justify-content:space-between}.primary{width:100%;background:var(--dark);color:#fffef6;border-color:var(--dark);margin-top:24px;font-size:15px}.primary:hover{background:#3e5c4c}.quiet{font-size:12px;text-align:center;color:var(--muted);margin:8px 0 0;min-height:18px}.tiny-note{margin-top:24px;padding-top:18px;border-top:1px solid var(--line);color:var(--muted);font-size:12px;line-height:1.8}.map-panel{padding:25px 28px 18px;min-width:0}.map-heading{display:flex;justify-content:space-between;align-items:center;gap:15px}.mono{font-family:monospace}.seed-badge{font-size:12px;background:#f0edfa;padding:4px 12px;border-radius:4px;max-width:50%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.metrics{display:grid;grid-template-columns:repeat(4,1fr);margin:22px 0 18px}.metrics>div{border-left:1px solid var(--line);padding-left:18px}.metrics>div:first-child{border:0;padding-left:0}.metrics strong{display:block;font:600 28px/1.2 monospace}.metrics span{display:block;font-size:12px;margin-top:7px;color:var(--muted)}.canvas-shell{background:var(--dark);padding:28px 18px 20px;position:relative;border:1px solid #253c33;border-radius:6px;overflow:hidden;min-height:250px;display:flex;align-items:center;justify-content:center}canvas{display:block;max-width:100%;width:100%;height:auto;image-rendering:pixelated;cursor:crosshair;touch-action:manipulation}canvas:focus-visible{outline-offset:-4px}.map-overlay{pointer-events:none;position:absolute;top:6px;left:12px;right:12px;display:flex;justify-content:space-between;color:#e5ead9;font:12px/1.4 monospace}.map-overlay #phase-pill{font-family:system-ui}.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin:12px 0 18px}.legend>span{display:flex;align-items:center;gap:5px}.legend i{width:12px;height:12px;display:inline-block}.floor{background:#bad48c}.other{background:#c8aada}.path{background:#f4c788}.legend .legend-end{margin-left:auto;font:12px/1.4 monospace}.timeline{border-top:1px solid var(--line);padding-top:15px}.step-heading{display:flex;justify-content:space-between;gap:12px;font-size:12px;margin-bottom:12px}.step-heading #step-count{color:var(--muted);white-space:nowrap}.timeline-actions{display:flex;align-items:center;gap:6px}.timeline-actions button{padding:5px 12px;min-height:35px;font-size:14px}.timeline-actions input{flex:1;margin:0 8px;min-width:20px}.timeline-actions #play{min-width:53px;font-size:12px}.path-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:12px}.path-row p{font-size:12px;margin:0;color:var(--muted)}.path-row button{border:0;background:transparent;padding:4px;min-height:32px;font-size:12px;white-space:nowrap;text-decoration:underline}#message:empty{display:none}#message{font-size:13px;background:#f4edd7;padding:12px 12px;border-radius:4px;margin-top:12px}#message.error{background:#f7e5da;color:#843f24}.bottom-grid{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:28px;margin:32px 0}.method-panel{padding:4px 0}.method-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin-top:13px}.method-grid article{position:relative;padding-left:40px}.method-number{position:absolute;top:8px;left:0;width:27px;height:27px;background:var(--green);text-align:center;border:1px solid #adc68c;border-radius:4px;font:15px/27px monospace}.method-number.lilac{background:var(--lilac);border-color:#b8a6d4}.method-grid h3{font-family:monospace}.method-grid h3 small{display:block;font:12px/1.5 system-ui;margin-top:5px}.method-grid p,.export-panel p{font-size:13px;line-height:1.85;color:var(--muted);margin:12px 0}.process{font:12px/1.6 system-ui;color:#486245;background:#e9eddc;padding:7px 12px;border-radius:4px}.metric-note{font-size:12px;color:var(--muted);margin:20px 0 0;padding-top:14px;border-top:1px solid var(--line)}.export-panel{background:#ebe5f2;border:1px solid #d7cbe1;border-radius:8px;padding:22px}.downloads{display:flex;gap:6px;margin:15px 0 12px}.downloads button{flex:1;padding:8px;font-size:13px;border-color:#cabcda}.import-row{display:flex;gap:8px;align-items:center}.import-row button{font-size:12px;padding:4px 0;border:0;background:transparent;min-height:32px;text-decoration:underline}.export-panel .export-note{font-size:12px;margin:12px 0 0}.export-panel details{font-size:12px;margin-top:15px;border-top:1px solid #d2c6de;padding-top:12px}.export-panel details p{font-size:12px}summary{cursor:pointer}footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;padding:20px 0 26px;font-size:12px;color:var(--muted)}a{color:inherit} [hidden]{display:none!important}@media(min-width:1350px){.canvas-shell canvas{max-width:792px}.map-panel{padding-left:36px;padding-right:36px}}@media(max-width:1000px){header{padding:20px 24px}main{padding:12px 24px 0}.workbench{grid-template-columns:250px minmax(0,1fr)}.controls{padding:24px 18px}.map-panel{padding:24px 18px}.metrics strong{font-size:24px}.metrics>div{padding-left:12px}.metrics span{font-size:12px}.bottom-grid{grid-template-columns:1fr 310px;gap:20px}.method-grid{gap:15px}.method-grid article{padding-left:0}.method-number{position:static;display:block}.legend{gap:12px}}@media(max-width:760px){header{height:88px;padding:15px 18px}.wordmark{font-size:22px}.header-note{display:none}main{padding:6px 14px 0}.workbench{display:flex;flex-direction:column}.controls{border-right:0;border-bottom:1px solid var(--line);padding:19px}.controls h1{font:600 24px/1.4 serif;margin:8px 0 15px}.controls h1 br{display:none}.controls .eyebrow{display:none}.algorithm button{font-size:14px}.hint{min-height:0;margin:12px 0 16px}#settings{display:grid;grid-template-columns:1fr 1fr;gap:4px 15px}#settings>label{grid-column:1/-1;margin:0}#settings>.seed-row{grid-column:1/-1}.dimensions{gap:12px}.dimensions label{margin-top:12px}#bsp-controls,#cellular-controls{align-self:center}#bsp-controls label,#cellular-controls label{margin-top:12px}.primary{margin:12px 0 0;grid-column:1/-1}.quiet{grid-column:1/-1}.tiny-note{display:none}.map-panel{padding:19px 14px 15px}.map-heading h2{font-size:21px}.metrics{margin-top:20px}.metrics strong{font-size:23px}.metrics span{font-size:12px}.canvas-shell{padding:27px 8px 14px;min-height:0}.legend{font-size:12px;gap:12px}.legend .legend-end{display:none}.timeline-actions{gap:4px}.timeline-actions button{padding:6px;min-width:30px;min-height:40px}.timeline-actions input{margin:0 3px}.step-heading{font-size:12px}.path-row p{font-size:12px}.path-row button{font-size:12px}.bottom-grid{grid-template-columns:1fr;gap:22px;margin:26px 4px}.method-grid{gap:20px}.method-grid p{font-size:12px}.metric-note{font-size:12px}.export-panel{padding:20px}.export-panel .export-note{font-size:12px}footer{display:block;margin:0 4px}footer span{display:block;margin:5px 0}.seed-badge{max-width:43%;font-size:12px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Readable technical labels at every viewport. */
.hint,.method-grid p,.export-panel p{font-size:14px}.algorithm button span{font-size:14px}.step-heading,.path-row p{font-size:14px}.metrics span{font-size:12px}.legend,.quiet,.tiny-note,.range-labels,.metric-note,.export-panel .export-note,footer{font-size:12px}.path-row button{font-size:12px}.export-panel details,.export-panel details p{font-size:13px}.timeline-actions #play{font-size:14px}.export-panel summary{font-size:14px}@media(max-width:760px){.step-heading,.path-row p{font-size:12px}.metrics span{font-size:12px}.method-grid p{font-size:14px}.legend{font-size:12px}.range-labels{font-size:12px}.metrics strong{font-size:22px}}
