:root{color-scheme:light;--ink:#263c31;--paper:#f5f2e9}html,body{overflow:auto;background:var(--paper);color:var(--ink)}main{height:auto;min-height:0;aspect-ratio:2/1;max-height:none;background:#a6c9d8}.scene-backdrop{display:none}#scene-frame{position:absolute;inset:0}#world{position:absolute;inset:0;width:100%;height:100%;background:transparent}header{top:4.5%}h1{font-size:clamp(30px,6vw,100px)}header p{font-size:clamp(7px,.8vw,14px)}footer{font-size:clamp(6px,.6vw,11px);bottom:2%}#loading{position:absolute;inset:0;display:grid;place-items:center;background:#ecede5;z-index:5;font-size:14px}#loading[hidden]{display:none}#preview-panel{max-width:1400px;margin:auto;padding:28px 30px 40px}.panel-title{display:flex;justify-content:space-between;gap:20px;align-items:center}h2{font-size:clamp(22px,2.4vw,34px);font-weight:500;margin:4px 0 24px;letter-spacing:-.035em}.eyebrow{font-size:10px;letter-spacing:.16em;color:#69766a}.control-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}fieldset{margin:0;padding:15px 0 0;border:0;border-top:1px solid #c6cdbf;min-width:0}legend{font-size:16px;font-weight:650;padding-right:15px}label{display:flex;flex-direction:column;font-size:12px;gap:5px;margin:10px 0}.check{flex-direction:row;align-items:center;gap:8px;line-height:1.4}select,button{font:inherit;font-size:12px;color:var(--ink);background:#fffdf7;border:1px solid #bfc9b8;border-radius:7px;padding:9px 10px;min-height:40px}select{width:100%}button{cursor:pointer}button:hover{background:#e4eadb}button:disabled{opacity:.5;cursor:default}input{accent-color:#486c4e}input[type=range]{width:100%;min-height:25px;margin:0}.buttons{display:flex;gap:6px;flex-wrap:wrap}output{display:block;min-height:20px;font-size:12px;font-weight:600}.hint{font-size:11px;line-height:1.6;color:#707c6f}a{color:#3f654c;font-size:12px}#scene-status{font-size:13px;line-height:1.6;margin:23px 0 8px}#source-note{max-width:950px}#marker-layer text{font:12px system-ui;paint-order:stroke;stroke:#fff;stroke-width:3px;fill:#8a2034}#marker-layer circle{fill:#f6c94a;stroke:#86283b;stroke-width:2px}#world image{pointer-events:none}#marker-layer[hidden]{display:none}:focus-visible{outline:3px solid #a78347;outline-offset:3px}.bee-sprite{transform-box:fill-box}.landing-gesture{transform-box:fill-box;transform-origin:center}@media(max-width:1000px){.control-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){main{min-height:0;aspect-ratio:2/1}.scene-backdrop{display:none}#world{background:transparent}header{top:7%}h1{font-size:9vw}header p{font-size:1.7vw;letter-spacing:.16em;margin-top:5px}footer{font-size:1.3vw;bottom:4%}#preview-panel{padding:22px 16px}.panel-title{display:block}.panel-title a{display:inline-block;margin-bottom:20px}h2{margin-bottom:10px}.control-grid{gap:24px 15px}select,button{padding:8px 6px;min-height:42px;font-size:12px}.hint{font-size:10px}main[data-detail="true"] header,main[data-detail="true"] footer{display:none}}@media(prefers-reduced-motion:reduce){.logo-wing,.logo-bee{animation:none!important}}
main[data-detail="true"] header,main[data-detail="true"] footer{display:none}
#preview-panel #scene-status{position:static;inset:auto;transform:none;z-index:auto;max-width:none;width:auto;display:block;background:none;border:0;border-radius:0;box-shadow:none;padding:0;color:var(--ink);text-align:left;text-shadow:none;opacity:1;pointer-events:auto;letter-spacing:normal;font-size:13px;margin:23px 0 8px}#preview-panel select{position:static;inset:auto;transform:none;background:#fffdf7;color:var(--ink);border:1px solid #bfc9b8;border-radius:7px;box-shadow:none;text-shadow:none;appearance:auto;width:100%;opacity:1}#preview-panel #weather-select{background:#fffdf7;color:var(--ink)}
#preview-panel #weather-select{max-width:none}#preview-panel #weather-select option{background:#fffdf7;color:var(--ink)}

.demo-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:0 0 24px;padding:16px;background:#e7ecdf;border-radius:10px}.demo-toolbar #start-demo{background:#3e6549;color:#fff;border-color:#3e6549;font-weight:600}.demo-toolbar #animation-info{font-size:12px;line-height:1.5;flex:1;min-width:190px}button:disabled{opacity:.45}@media(max-width:700px){.demo-toolbar{padding:12px}.demo-toolbar button{width:100%}}