:root{color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:transparent;color:#505c48;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}main{width:100%;max-width:800px;margin:auto}#scene{display:block;width:100%;height:auto}.legend-row{display:flex;justify-content:center;align-items:center;gap:18px;padding:0 12px 12px;min-height:48px}#legend{display:flex;justify-content:center;gap:24px;flex-wrap:wrap}.key{display:flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.08em;line-height:1.6}.key i{display:inline-block;width:16px;height:6px;background:var(--key)}#play{flex:0 0 36px;height:36px;background:none;border:0;color:inherit;font:16px ui-monospace,monospace;cursor:pointer}#play:hover{color:#253b2c}#play:focus-visible{outline:1px solid #505c48;outline-offset:3px}#play:disabled{opacity:.4}.scene-label{fill:#c4cfb7;font:13px ui-monospace,monospace;letter-spacing:1.5px}.scene-small{fill:#95a58f;font:11px ui-monospace,monospace;letter-spacing:1px}#error{font:12px/1.5 ui-monospace,monospace;text-align:center;padding:12px}@media(max-width:480px){#legend{gap:10px 18px}.key{font-size:9px;gap:5px}.key i{width:12px}.legend-row{gap:8px;padding-inline:4px}}