:root{font-family:Inter,Segoe UI,Arial,sans-serif;color:#f1f0db;background:#202722;color-scheme:dark}*{box-sizing:border-box}body{margin:0;overflow:hidden}canvas{display:block;width:100vw;height:100vh;touch-action:none}header{position:fixed;left:5vw;top:6vh;pointer-events:none}.eyebrow{font-size:10px;letter-spacing:.24em;color:#b6bea8}h1{font-family:Georgia,serif;font-size:clamp(28px,4vw,55px);font-weight:400;letter-spacing:-.04em;margin:13px 0 8px}h1 span{color:#d3ee73}header p{font-size:13px;color:#b6bea8;margin:0}aside{position:fixed;right:5vw;top:7vh;font-size:9px;letter-spacing:.16em;color:#cbd1bc;display:flex;align-items:center;gap:8px}.dot{width:6px;height:6px;border-radius:50%;background:#d3ee73}nav{position:fixed;left:50%;bottom:70px;transform:translateX(-50%);display:flex;align-items:center;gap:25px;padding:17px 22px;border:1px solid #c5d0a92a;border-radius:15px;background:#1b241ddc;backdrop-filter:blur(12px);box-shadow:0 8px 40px #0002}label{font-size:11px;color:#c9d0bc;display:flex;align-items:center;gap:10px}input{width:90px;accent-color:#d3ee73}output{font-variant-numeric:tabular-nums;min-width:33px;color:#e6edcb}.buttons{display:flex;gap:6px}button{font:inherit;font-size:11px;border:1px solid #cad5ad35;background:transparent;color:#eff4d6;padding:9px 13px;border-radius:6px;cursor:pointer;white-space:nowrap}button:hover{background:#c9e5851c;border-color:#d3ee73}button:focus-visible,a:focus-visible{outline:2px solid #e1f596;outline-offset:4px}footer{position:fixed;bottom:25px;left:5vw;right:5vw;display:flex;justify-content:space-between;color:#b2bba4;font-size:10px}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}#status{position:fixed;left:50%;top:48%;transform:translateX(-50%);color:#e4ebd2;font-size:13px}#status:empty{display:none}dialog{width:min(860px,92vw);max-height:85vh;border:1px solid #56604a;border-radius:18px;background:#242d25;color:#e6ebd8;padding:28px}dialog::backdrop{background:#081109ba;backdrop-filter:blur(8px)}.dialog-head{display:flex;align-items:center;justify-content:space-between}h2{font:normal 30px Georgia;margin:0}dialog p{font-size:13px;line-height:1.7;color:#bbc6ad}.grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.grid img{display:block;width:100%;aspect-ratio:1;object-fit:contain;background:repeating-conic-gradient(#333c32 0% 25%,#424b3d 0% 50%) 0/20px 20px;border-radius:8px}.grid b{display:block;font-size:13px;margin:14px 0 6px}.grid span{font-size:11px;color:#b5c2a4}@media(max-width:750px){aside{top:auto;bottom:150px;right:5vw;font-size:8px}nav{gap:12px;bottom:55px;width:90%;flex-wrap:wrap;justify-content:center;padding:12px}label{font-size:10px}footer{bottom:15px;font-size:8px;gap:15px}h1{font-size:32px}header{top:4vh}.grid{grid-template-columns:1fr}dialog{padding:20px}}
.fps-meter{position:fixed;right:5vw;top:calc(7vh + 28px);display:flex;align-items:baseline;gap:6px;padding:7px 10px;border:1px solid #c5d0a92a;border-radius:7px;background:#1b241dcc;pointer-events:none}.fps-meter output{min-width:2ch;text-align:right;font-size:17px;font-variant-numeric:tabular-nums;color:#e1edb8}.fps-meter span{font-size:9px;letter-spacing:.12em;color:#b6bea8}@media(max-width:750px){.fps-meter{top:32px;right:5vw}}
/* Soft painted presentation; leave the centre clear for the meadow. */
:root{background:#cbded5;color:#294e43;color-scheme:light}
header .eyebrow,header p,footer,aside{color:#4c7063}h1 span{color:#477d59}
nav{background:#eff5e9ed;border-color:#527a5540;box-shadow:0 8px 32px #36594712;bottom:52px}
label,nav output{color:#315b48}button{color:#315b48;border-color:#56745c55}button:hover{background:#acc6a54d;border-color:#527b59}input{accent-color:#537f58}.dot{background:#50825b}
.fps-meter{background:#eef4e6d9;border-color:#718f6e45}.fps-meter output{color:#315d43}.fps-meter span{color:#52745b}
header{top:4vh}h1{font-size:clamp(28px,3.3vw,44px)}#status{color:#315b48}
@media(max-width:750px){nav{bottom:50px}aside{bottom:176px}.fps-meter{top:27px}header p{font-size:11px}}
header{padding:14px 18px;margin:-14px -18px;border-radius:14px;background:linear-gradient(120deg,#eef3dfb0,#eef3df00);text-shadow:0 1px 1px #f3f4e160}
header p{max-width:360px;line-height:1.5}header h1{color:#29483e}
.travel-panel{position:fixed;left:5vw;top:170px;width:190px;padding:12px 14px;border:1px solid #718f6e35;border-radius:12px;background:#eef4e6df;backdrop-filter:blur(8px);color:#315b48}.travel-panel label{display:block;font-size:10px;letter-spacing:.06em;margin-bottom:7px}.travel-panel select{display:block;width:100%;font:inherit;font-size:12px;padding:8px 6px;border:1px solid #718f6e55;border-radius:6px;background:#f5f7eb;color:#315b48;cursor:pointer}.travel-panel small{display:block;font-size:8px;margin-top:8px;color:#52745b}@media(max-width:750px){.travel-panel{top:152px;width:168px;padding:9px 11px}.travel-panel small{font-size:7px}}

.generation{border-top:1px solid #718f6e35;margin-top:10px;padding-top:10px}.generation output{display:block;font-size:10px;color:#52745b;margin-bottom:7px;font-variant-numeric:tabular-nums}.generation button{width:100%;background:#426b50;color:#f1f4e4;border-color:#426b50;padding:9px 4px;font-size:12px}.generation button:hover{background:#34583f}.generation button:disabled{opacity:.65;cursor:wait}#scene:focus-visible{outline:2px solid #8aaa78;outline-offset:-3px}

.generation select{margin-bottom:9px}.travel-panel small{line-height:1.5}
body[data-character-mode=overview] .character-look,body[data-character-mode=overview] .character-panel output,body[data-character-mode=overview] .character-panel small{display:none}
.travel-panel{max-height:calc(100vh - 390px);overflow-y:auto;scrollbar-width:thin}

.tint-panel{position:fixed;right:5vw;top:91px;width:190px;padding:10px 12px;border:1px solid #718f6e35;border-radius:10px;background:#eef4e6ed;color:#315b48;font-size:11px}.tint-panel summary{cursor:pointer;list-style-position:inside}.tint-panel label{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:12px}.tint-panel input[type=color]{width:45px;height:29px;padding:2px;border:1px solid #718f6e55;background:transparent;cursor:pointer}.tint-panel input[type=range]{width:75px}.tint-panel p{font-size:9px;line-height:1.5;color:#52745b}.tint-panel button{width:100%;font-size:11px;padding:7px 4px}@media(max-width:600px){.tint-panel{top:auto;bottom:175px;width:164px}}
.tint-panel input[type=checkbox]{width:17px;flex-shrink:0}input:disabled,button:disabled{opacity:.45;cursor:default}nav{width:min(92vw,760px);flex-wrap:wrap;justify-content:center;gap:12px 22px}.relief-controls{display:flex;justify-content:center;align-items:center;gap:12px 20px;width:100%;flex-wrap:wrap;border-top:1px solid #718f6e30;padding-top:10px}.relief-controls label{gap:7px}.relief-controls input{width:80px}.relief-controls output{min-width:26px}.buttons{justify-content:center}@media(max-width:600px){nav{bottom:42px;padding:9px;gap:8px 16px}.relief-controls{gap:8px 12px}.relief-controls label{font-size:9px}.relief-controls input{width:66px}.tint-panel{top:86px;bottom:auto;width:155px}aside{bottom:220px}}
.character-panel{position:fixed;right:5vw;top:140px;width:190px;padding:11px;border-radius:12px;background:#eef4e6ed;border:1px solid #718f6e35;color:#315b48;font-size:10px}.character-panel button{width:100%;background:#426b50;color:#f1f4e4}.character-look{display:grid;gap:7px;margin:9px 0}.character-look label{display:block;font-size:9px}.character-look select{display:block;width:100%;margin-top:4px;padding:5px;border:1px solid #718f6e55;border-radius:5px;color:#315b48;background:#f5f7eb;font-size:11px}.character-panel output{display:block;color:#315b48;font-size:9px;line-height:1.4}.character-panel small{display:block;font-size:8px;line-height:1.6;margin-top:8px}.tint-panel[open]{z-index:4}.character-panel{z-index:2}body[data-character-mode=playing] header p,body[data-character-mode=playing] .travel-panel small{display:none}body[data-character-mode=playing] .travel-panel{top:140px}#sandbox-joystick{position:fixed;left:20px;bottom:190px;width:104px;height:104px;border-radius:50%;background:#eef4e677;border:1px solid #315b4866;touch-action:none;z-index:5;display:grid;place-items:center}#sandbox-joystick[hidden]{display:none}.joystick-knob{width:42px;height:42px;border-radius:50%;background:#426b50aa;border:2px solid #e9f3e5}.joystick-arrows{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;place-items:center;color:#426b50}.joystick-arrows i{font-style:normal}@media(max-width:600px){.character-panel{top:128px;width:145px;padding:8px}.character-panel small{font-size:7px}.character-look{gap:5px}.character-look select{font-size:10px}body[data-character-mode=playing] .travel-panel{width:135px;top:140px}body[data-character-mode=playing] .travel-panel .generation{display:none}body[data-character-mode=playing] header{max-width:220px}body[data-character-mode=playing] h1{font-size:27px}}

#rock-count{width:100%;box-sizing:border-box;padding:8px;margin-bottom:8px;border:1px solid #718f6e55;border-radius:6px;background:#f5f7eb;color:#315b48}#apply-rocks{margin-bottom:12px;background:transparent;color:#315b48}
#clear-view{position:fixed;right:24px;bottom:14px;z-index:8;background:#eef4e6e8;color:#315b48;border-color:#718f6e55;font-size:10px}.clear-view header,.clear-view .travel-panel,.clear-view .character-panel,.clear-view .tint-panel,.clear-view nav,.clear-view footer{display:none}

.bark-controls{border:0;border-bottom:1px solid #718f6e40;padding:10px 0;margin:12px 0}.bark-controls legend{font-weight:600}.bark-controls output{display:block;font-size:10px;color:#52745b;text-align:right;margin:5px 0}.bark-presets{display:flex;gap:4px;flex-wrap:wrap}.bark-presets button{width:auto;flex:1;font-size:9px;padding:6px}.tint-panel[open]{max-height:calc(100vh - 220px);overflow-y:auto;scrollbar-width:thin}