*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#101614;color:#e4e7df;font:14px/1.5 system-ui,-apple-system,sans-serif}#viewport{position:fixed;inset:0}canvas{display:block;touch-action:none}button,select{font:inherit;color:inherit;background:#222b28;border:1px solid #53605a;border-radius:3px;padding:9px 12px;cursor:pointer}button:hover{background:#3b4840}button:focus-visible{outline:2px solid #d8bd76}header{position:absolute;top:26px;left:28px;right:28px;display:flex;align-items:center;gap:16px;pointer-events:none;text-shadow:0 2px 10px #000}header button{margin-left:auto;pointer-events:auto;border-radius:50%;width:38px;height:38px;padding:0}.mark{border:1px solid #a6ad9c;padding:9px 12px;letter-spacing:2px;color:#e0c383;font-weight:700}small,.eyebrow{font-size:12px;letter-spacing:2px;color:#b4c0b7}h1{font-size:24px;margin:0;font-weight:500;letter-spacing:3px}h1 span{font-size:14px;letter-spacing:1px;color:#b6beb5;margin-left:9px}.panel{position:absolute;right:28px;top:120px;width:278px;padding:22px;background:#111a17e8;border:1px solid #4d595244;backdrop-filter:blur(16px);max-height:calc(100dvh - 195px);overflow:auto}.eyebrow{display:flex;justify-content:space-between;font-size:11px}h2{font-size:23px;font-weight:500;margin:13px 0 4px}p{color:#b3beb4;margin:5px 0 18px;font-size:13px}.views{display:grid;gap:5px}.views button{text-align:left;border-color:transparent;background:transparent;color:#b7c3b9}.views button.selected{background:#36463a;color:#e6d4a1;border-left:2px solid #d9c080}.line{height:1px;background:#46514888;margin:16px 0}label{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:14px 0}select{width:115px;font-size:13px;padding:5px}input[type=range]{width:115px;accent-color:#c9ae70}input[type=checkbox]{accent-color:#baa16a;width:17px;height:17px}.primary{width:100%;background:#d7c48c;color:#202a23;border:0}.pair{display:flex;gap:7px;margin-top:8px}.pair button{font-size:12px;flex:1;padding:8px}.note{font-size:11px;line-height:1.8;margin:17px 0 0;color:#8f9b92}footer{position:absolute;bottom:21px;left:28px;right:28px;display:flex;align-items:center;gap:18px;text-shadow:0 2px 7px black}footer span:first-child{color:#e0c383;border-left:2px solid;padding-left:10px}footer span:nth-child(2){color:#b8c4ba;font-size:12px}footer button{margin-left:auto;font-size:12px}#paneltoggle{display:none}#loading{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;background:#101814;z-index:5}#loading b{letter-spacing:4px;font-size:24px}#loading span{color:#a6b5a9}dialog{background:#15201b;color:#eee;border:1px solid #637467;border-radius:5px;max-width:850px;width:90vw;padding:20px}dialog::backdrop{background:#000b}dialog img{width:100%;margin-top:15px}dialog .close{float:right}dialog p{font-size:15px;clear:both;margin-top:20px}#walkpad{position:absolute;bottom:90px;left:30px;right:340px;pointer-events:none}#walkpad[hidden]{display:none}.dpad{width:148px;display:grid;grid-template-columns:repeat(3,46px);gap:5px;pointer-events:auto}.dpad button{height:46px;font-size:20px;touch-action:none}.dpad button:first-child{grid-column:2}.dpad button:nth-child(2){grid-row:2;grid-column:1}.dpad button:nth-child(3){grid-row:2;grid-column:2}.dpad button:nth-child(4){grid-row:2;grid-column:3}.vertical{position:absolute;right:0;bottom:0;display:grid;gap:8px;pointer-events:auto}.vertical button{touch-action:none} @media(max-width:700px){header{top:18px;left:16px;right:16px;gap:10px}h1{font-size:20px}h1 span{display:none}.mark{padding:8px;font-size:12px}small{font-size:10px}.panel{display:none;right:14px;top:90px;width:260px;max-height:calc(100dvh - 180px);padding:17px}.panel.open{display:block}#paneltoggle{display:block;position:absolute;top:97px;right:16px}.panel.open~#paneltoggle{top:auto;bottom:74px}footer{bottom:18px;left:16px;right:16px;gap:10px}footer span:nth-child(2){max-width:145px;font-size:11px}#walkpad{left:18px;right:18px;bottom:95px}body:has(.panel.open) #walkpad{display:none} }