*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;font:14px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#cfd4d2;color:#f5f6f4}#view,canvas{position:absolute;inset:0;width:100%;height:100%;display:block}header{position:absolute;z-index:4;inset:0 0 auto;height:62px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(#151717e8,transparent);pointer-events:none}header b{display:flex;align-items:center;gap:9px}header i{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:#d9e65e;color:#171919;font-style:normal}button{font:inherit;cursor:pointer}header button{pointer-events:auto;color:white;background:#1a1c1caa;border:1px solid #ffffff2e;border-radius:9px;padding:8px 11px}aside{position:absolute;z-index:3;top:74px;left:16px;width:310px;padding:17px;border:1px solid #ffffff22;border-radius:17px;background:#171919e8;backdrop-filter:blur(15px);box-shadow:0 20px 60px #0005}small{display:block;margin:0 0 8px;color:#aeb5b0;font-size:10px;font-weight:700;letter-spacing:.11em}.variants,.places{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:16px}.variants button,.places button{min-height:37px;border:1px solid #ffffff1f;border-radius:9px;background:#ffffff0d;color:#eef0ee}.variants button.on{background:#e7ece8;color:#171919;font-weight:700}#walk{width:100%;min-height:46px;margin-bottom:18px;border:0;border-radius:10px;background:#d9e65e;color:#171919;font-weight:750}aside p{margin:14px 0 0;padding-top:12px;border-top:1px solid #ffffff1a;color:#adb4af;font-size:11px;line-height:1.6}#status{position:absolute;z-index:3;left:16px;bottom:16px;padding:8px 11px;border-radius:18px;background:#171919bc;font-size:12px;color:#d9e65e}#touch{display:none;position:absolute;z-index:5;right:18px;bottom:18px;text-align:center;user-select:none;touch-action:none}#touch span{display:block}#touch button{width:48px;height:48px;margin:2px;border:1px solid #ffffff38;border-radius:12px;background:#181a1ad9;color:white;font-size:20px}@media(max-width:700px){header b{font-size:0}aside{top:68px;left:10px;width:calc(100% - 20px);max-height:calc(100% - 150px);overflow:auto}#touch{display:block}#status{left:10px;bottom:10px}aside p{display:none}}
