:root{color-scheme:dark;font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#d4d7d8;background:#09171d;--active-opacity:.65;--idle-opacity:0;--vignette:.43;--bottom-shade:.38}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden}
button,input,select{font:inherit;color:inherit;-webkit-tap-highlight-color:transparent}
button{cursor:pointer;background:#202326;border:1px solid #363a3e;border-radius:4px}
button:hover{background:#2a2e32;border-color:#555b60}
button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid #b0bcc5;outline-offset:3px}
[hidden]{display:none!important}
a{color:#bbcbd5;text-underline-offset:3px}
#experience,#scene{position:fixed;inset:0}
#scene{background:#09171d var(--scene-poster,url('assets/poster.webp')) center/cover no-repeat;isolation:isolate;overflow:hidden}
#scene canvas,#scene img{position:absolute;pointer-events:none;user-select:none}
#sky,#water,#life{inset:0;width:100%;height:100%}
#sky{z-index:0}
#terrain{z-index:1;top:19.4%;left:0;width:100%;height:59%;object-fit:fill}
#water{z-index:2}
#foreground{z-index:3;inset:-1%;width:102%;height:102%;object-fit:fill;will-change:transform}
#life{z-index:4}
.scene-grade{position:absolute;inset:0;z-index:5;pointer-events:none;background:linear-gradient(180deg,rgba(3,11,17,.21),transparent 20%,transparent 60%,rgba(1,8,11,var(--bottom-shade)) 100%),radial-gradient(ellipse at 57% 42%,transparent 35%,rgba(2,8,12,var(--vignette)) 100%)}
#scene[data-fallback="true"] #terrain,#scene[data-fallback="true"] #foreground{display:none}
#scene:not(.ready) canvas,#scene:not(.ready) img{visibility:hidden}
#settings-toggle{position:fixed;bottom:max(16px,env(safe-area-inset-bottom));right:max(16px,env(safe-area-inset-right));width:42px;height:42px;display:grid;place-items:center;z-index:15;color:#bdc8cb;background:#121b20ba;border:1px solid #b6c2c526;border-radius:5px;opacity:var(--active-opacity);transition:opacity .8s ease}
#settings-toggle svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round}
body.controls-idle #settings-toggle{opacity:var(--idle-opacity);cursor:none}
body.controls-idle #scene{cursor:none}
#settings-toggle:focus-visible{opacity:var(--active-opacity)}
body[data-corner="bottom-left"] #settings-toggle{left:max(16px,env(safe-area-inset-left));right:auto}
body[data-corner="top-right"] #settings-toggle{top:max(16px,env(safe-area-inset-top));bottom:auto}
body[data-corner="top-left"] #settings-toggle{left:max(16px,env(safe-area-inset-left));right:auto;top:max(16px,env(safe-area-inset-top));bottom:auto}
body.drawer-open #settings-toggle{visibility:hidden;pointer-events:none}
#settings-drawer{position:fixed;z-index:20;top:0;right:0;bottom:0;width:min(390px,100vw);display:flex;flex-direction:column;background:#17191c;border-left:1px solid #363a3e;transform:translateX(100%);visibility:hidden;transition:transform .22s ease,visibility .22s;box-shadow:-8px 0 24px #0003;font-size:12px}
body.drawer-open #settings-drawer{transform:translateX(0);visibility:visible}
.drawer-header{display:flex;align-items:center;justify-content:space-between;padding:16px 18px 10px;padding-top:max(16px,env(safe-area-inset-top));flex-shrink:0}
h1{font-size:14px;font-weight:500;margin:0}
.drawer-heading{display:flex;flex-direction:column;gap:9px}
.drawer-heading>a{font-size:10px;text-decoration:none;color:#81939d}
.drawer-heading>a:hover{color:#d4d7d8}
#settings-close{border:0;background:none;font-size:23px;line-height:1;width:30px;height:30px;color:#8e969b}
.transport,.config-actions{display:flex;gap:6px;padding:0 18px 9px;flex-shrink:0}
.transport button,.config-actions button{flex:1;padding:7px 5px;font-size:11px;white-space:nowrap}
.transport button[aria-pressed="true"]{border-color:#809099;color:#edf0f2}
.config-actions button{background:transparent;color:#a3abb0;border-color:#303438;font-size:10px}
.search-row{padding:4px 18px 12px;display:flex;align-items:center;gap:10px;border-bottom:1px solid #303438;flex-shrink:0}
#settings-search{width:100%;min-width:0;border:1px solid #32383d;border-radius:4px;background:#111315;font-size:11px;padding:8px 9px;outline-offset:1px}
#parameter-count{font-size:10px;font-variant-numeric:tabular-nums;color:#717b83;white-space:nowrap}
#settings-scroll{overflow-y:auto;overscroll-behavior:contain;flex:1;min-height:0;padding:0 18px 20px;scrollbar-width:thin;scrollbar-color:#454d54 #17191c}
details.group{border-bottom:1px solid #303438}
summary{cursor:pointer;list-style:none}
summary::-webkit-details-marker{display:none}
.group>summary{display:flex;align-items:center;gap:8px;padding:14px 0;color:#bbc3c9;font-size:12px;user-select:none}
.group>summary:before,.credits>summary:before{content:'›';font-size:17px;line-height:1;width:10px;color:#75818a}
.group[open]>summary:before,.credits[open]>summary:before{transform:rotate(90deg)}
.group-title{flex:1}
.group-count{font-size:9px;color:#65717a}
.group-reset{border:0;background:none;color:#727e87;width:24px;height:24px;font-size:14px}
.group-reset:hover{background:#292e33}
.group-fields{padding:0 0 7px}
.setting{padding:7px 0 11px}
.setting-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:9px}
.setting label{font-size:11px;color:#adb7bf;flex:1;min-width:0}
.value-control{display:flex;align-items:center;gap:5px}
input[type="number"]{width:76px;padding:3px 4px;text-align:right;font:11px ui-monospace,SFMono-Regular,Consolas,monospace;background:#111518;border:1px solid #343b42;border-radius:3px;appearance:textfield;-moz-appearance:textfield;font-variant-numeric:tabular-nums}
input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.unit{font-size:9px;color:#6e7e87;width:30px;text-align:right}
input[type="range"]{width:100%;height:3px;margin:4px 0 2px;appearance:none;-webkit-appearance:none;cursor:pointer;background:#39434b;border-radius:2px;accent-color:#aebcc5}
input[type="range"]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:10px;height:10px;border-radius:50%;background:#aebcc5}
input[type="range"]::-moz-range-thumb{border:0;width:10px;height:10px;border-radius:50%;background:#aebcc5}
.range-bounds{display:flex;justify-content:space-between;color:#525f69;font:8px ui-monospace,monospace;margin-top:4px}
.setting-boolean,.setting-color,.setting-select{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0}
input[type="checkbox"]{margin:0;width:15px;height:15px;accent-color:#aebcc5;cursor:pointer}
input[type="color"]{width:39px;height:23px;padding:2px;background:#20262b;border:1px solid #404951;border-radius:3px;cursor:pointer}
.color-value{font:10px ui-monospace,monospace;color:#6e7e87}
select{max-width:145px;background:#111518;border:1px solid #343b42;border-radius:3px;padding:4px 6px;font-size:10px}
#no-results{color:#8a969e;font-size:11px;padding:12px 0}
.credits{margin-top:19px;font-size:10px;color:#707d87}
.credits>summary{display:flex;align-items:center;gap:7px}
.credits p{line-height:1.65;color:#7e8b95}
.drawer-footer{display:flex;justify-content:space-between;gap:12px;border-top:1px solid #303438;padding:10px 18px;padding-bottom:max(10px,env(safe-area-inset-bottom));font-size:9px;color:#6d7d88;flex-shrink:0}
#config-status{max-width:250px;text-align:right}
#config-status.error{color:#d3988d}
@media(max-width:760px){#scene{background-image:var(--scene-mobile-poster,var(--scene-poster))}body[data-scene-kind="lake"] #scene[data-fallback="true"],body[data-scene-kind="lake"] #scene:not(.ready){background-position:70% center}#settings-drawer{width:min(360px,100vw)}#settings-toggle{width:42px;height:42px}}
@media(max-height:480px){.drawer-header{padding:8px 14px 4px}.transport,.config-actions{padding:0 14px 5px}.transport button,.config-actions button{padding:5px}.search-row{padding:3px 14px 7px}#settings-scroll{padding:0 14px 10px}.drawer-footer{padding:7px 14px}}
@media(prefers-reduced-motion:reduce){#settings-drawer,#settings-toggle{transition:none}}