@import"https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;500;600&family=Noto+Sans+JP:wght@300;400;500&display=swap";:root{font-family:Noto Sans JP,sans-serif;color:#e1e6e9;background:#05090e;font-synthesis:none}*{box-sizing:border-box}body{margin:0;overflow:hidden}canvas{display:block;position:fixed;inset:0;width:100%;height:100%;outline:none}header,footer,.record,.intro,.location,.touch,#notice{position:fixed;z-index:2}header{top:36px;left:42px;right:42px;display:flex;justify-content:space-between;align-items:center;pointer-events:none}.brand{display:flex;gap:13px;font:500 23px Barlow Condensed,sans-serif;letter-spacing:4px}.brand-mark{color:#d8ac71;border:1px solid #84704f;width:38px;height:38px;display:grid;place-items:center;font:26px sans-serif}.brand small{display:block;font:9px Noto Sans JP,sans-serif;letter-spacing:2.2px;color:#798790;margin-top:5px}.live{font:11px Barlow Condensed,sans-serif;letter-spacing:2px;color:#b4bfc5;display:flex;gap:10px;align-items:center}.live span{font:10px Noto Sans JP,sans-serif;color:#75818c;margin-left:18px;letter-spacing:2px}i{display:inline-block;width:5px;height:5px;border-radius:100%;background:#d4ae75;box-shadow:0 0 9px #c5a06c66}.intro{top:23%;left:42px;pointer-events:none;animation:fade-intro 15s forwards}.intro>span{font:10px Barlow Condensed,sans-serif;letter-spacing:3px;color:#b8a180}h1{font-size:25px;letter-spacing:5px;font-weight:300;margin:16px 0}.intro p{font-size:11px;letter-spacing:2px;color:#89949c}@keyframes fade-intro{0%,50%{opacity:1}to{opacity:.17}}.location{right:42px;top:46%;text-align:right;border-right:1px solid #a38a5e77;padding-right:15px;pointer-events:none}.location span{font-size:12px;letter-spacing:4px;color:#9da6ac}.location small{display:block;font:10px Barlow Condensed,sans-serif;letter-spacing:2px;color:#65747f;margin-top:9px}footer{left:42px;right:42px;bottom:38px;display:flex;align-items:center;justify-content:space-between;gap:20px}.instruments{display:flex;align-items:center;gap:25px}.instruments>div{display:flex;align-items:baseline;gap:9px}.instruments span{font:400 48px Barlow Condensed,sans-serif;letter-spacing:2px}.instruments small{font:9px Barlow Condensed,sans-serif;letter-spacing:1.5px;color:#7f8b95}.instruments b{width:1px;height:32px;background:#4a566244}.instruments .distance{flex-direction:column;gap:1px}.distance span{font-size:26px}.controls{display:flex;gap:5px;align-items:center;color:#71808c;font-size:10px}.key{border:1px solid #75869440;border-radius:3px;width:24px;height:25px;display:grid;place-items:center;font:11px monospace}.or{margin:0 4px}.control-label{margin-left:9px;letter-spacing:1px}.actions{display:flex;gap:8px}button{font:10px Noto Sans JP,sans-serif;color:#99a8b3;letter-spacing:1px;background:#111a2270;border:1px solid #697c8e30;border-radius:3px;padding:10px 12px;cursor:pointer}button:hover,button[aria-pressed=true]{color:#e8c18c;border-color:#b59b6966;background:#30292070}button:focus-visible{outline:2px solid #edc386;outline-offset:4px}.record{bottom:111px;left:43px;font:9px Barlow Condensed,sans-serif;letter-spacing:2px;color:#677681;display:flex;align-items:center;gap:8px}.record i{width:3px;height:3px;background:#77918e;box-shadow:none}.record span{margin-left:12px;letter-spacing:1px}#notice{bottom:145px;left:50%;transform:translate(-50%);font-size:12px;color:#e2c79f;background:#131c25dd;padding:12px 20px;border-radius:4px;opacity:0;transition:opacity .3s;pointer-events:none;max-width:90vw}#notice.show{opacity:1}.touch{display:none;bottom:145px;left:22px;right:22px;justify-content:space-between;pointer-events:none}.touch button{pointer-events:auto;width:62px;height:56px;font-size:24px;touch-action:none;-webkit-user-select:none;user-select:none}body:after{content:"";position:fixed;inset:0;pointer-events:none;box-shadow:inset 0 0 160px #0006;z-index:1}@media(max-width:900px){header{top:24px;left:24px;right:24px}.live span,.controls{display:none}footer{left:24px;right:24px;bottom:22px}.actions{gap:4px}button{padding:9px 8px;font-size:9px}.record{left:25px;bottom:95px}.location{right:24px;top:34%}.intro{left:24px;top:18%}h1{font-size:20px}.instruments{gap:12px}.instruments span{font-size:36px}.instruments .distance span{font-size:23px}}@media(pointer:coarse){.touch{display:flex}}@media(max-width:520px){.brand{font-size:18px;letter-spacing:3px}.brand small{font-size:7px}.live{font-size:9px}.instruments small{font-size:8px}.instruments{gap:9px}.actions{display:grid;grid-template-columns:1fr 1fr}.location{display:none}footer{align-items:end}.record{bottom:112px}.intro{top:19%}}#pa-hint{position:fixed;z-index:3;left:50%;bottom:135px;transform:translate(-50%);padding:13px 22px;border:1px solid #a6bf9b55;border-radius:4px;background:#09120eee;color:#c7d6b9;font-size:12px;letter-spacing:1px;opacity:0;transition:opacity .5s;pointer-events:none;text-align:center;max-width:92vw;width:max-content}#pa-hint.visible{opacity:1}@media(max-width:600px){#pa-hint{bottom:215px;font-size:10px;padding:12px}.touch{display:flex}}#pa-hint:after{content:"";position:absolute;left:0;bottom:0;height:3px;width:var(--hold,0%);background:#c7d6b9;border-radius:4px;transition:width .1s}#depart{position:fixed;z-index:4;left:50%;bottom:195px;transform:translate(-50%);touch-action:none;-webkit-user-select:none;user-select:none;padding:12px 24px;color:#d4e1ca;border-color:#9abb8a77;background:#101b12ee}#depart[hidden]{display:none}@media(max-width:600px){#depart{bottom:280px}}[hidden]{display:none!important}.session{position:fixed;z-index:5;right:42px;top:92px;display:flex;align-items:center;gap:10px}.session>span{font:11px Barlow Condensed,sans-serif;letter-spacing:1.5px;color:#b5c1ba}.session button{font-size:10px}#share-panel{position:absolute;right:0;top:48px;width:340px;max-width:calc(100vw - 40px);padding:17px;background:#091018f5;border:1px solid #8f9d823d;border-radius:5px}#share-panel label{font-size:11px;color:#c9d2c0}#invite-link{margin:12px 0;width:100%;padding:9px;background:#05090e;border:1px solid #68786c55;border-radius:3px;color:#c1d0bb;font:11px monospace}#share-help{display:block;font-size:10px;color:#88968f;line-height:1.8}#share-close{margin-top:10px}@media(max-width:900px){.session{right:24px;top:80px}.session>span{font-size:10px}}@media(max-width:520px){.session{left:24px;right:24px;top:80px;gap:7px}.session>span{margin-right:auto}.intro{top:23%}}#customization{position:fixed;z-index:4;left:24px;top:145px;width:250px;padding:18px;background:#081017ed;border:1px solid #9d885448;border-radius:6px;max-height:calc(100dvh - 310px);overflow:auto}#customization>small{font:10px monospace;letter-spacing:3px;color:#c8ad7e}#customization h2{font-size:18px;font-weight:300;letter-spacing:3px;margin:10px 0 18px}#customization fieldset{padding:0;border:0;margin:14px 0}#customization legend{font-size:11px;color:#b4bfbf;margin-bottom:10px}#customization fieldset div{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}#customization button{padding:7px 2px;letter-spacing:0;font-size:10px;background:#111b23}#customization button:before{content:"";display:block;width:18px;height:5px;margin:0 auto 6px;background:var(--swatch);border:1px solid #ffffff33;border-radius:2px}#customization button[aria-pressed=true]{outline:1px solid #e4c28a;color:#f3d8ac}#customization p{font-size:10px;color:#7e918f;line-height:1.9;margin-bottom:0}@media(max-width:600px){#customization{left:12px;top:126px;width:205px;padding:12px;max-height:calc(100dvh - 370px)}#customization h2{margin:6px 0;font-size:15px}#customization fieldset{margin:10px 0}#customization p{display:none}}#customization #traffic-choices{grid-template-columns:1fr 1fr}#traffic-choices button:before{display:none}