*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#78b6ce;color:#fff;font-family:Arial,'Noto Sans JP',sans-serif}button,input{font:inherit}button{cursor:pointer;color:inherit;border:1px solid #ffffff38;background:#132e39ab;border-radius:9px;padding:12px 16px;backdrop-filter:blur(12px)}button:hover{background:#284c59}button:focus-visible,input:focus-visible{outline:3px solid #bfff6b;outline-offset:4px}#world{display:block;width:100vw;height:100dvh}header{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:26px 32px;background:linear-gradient(#102d3b77,transparent)}.brand{display:flex;align-items:center;gap:12px;font-size:27px}.brand strong{font-size:22px;letter-spacing:4px}.brand>span{font-size:10px;letter-spacing:2px;border-left:1px solid #ffffff55;padding-left:16px;max-width:110px;line-height:1.6}.top-actions{display:flex;gap:8px;font-size:13px}.top-actions button span{margin-left:12px;opacity:.5}.location{position:absolute;top:124px;left:34px;text-shadow:0 2px 12px #1b435e66}.eyebrow{font-size:11px;letter-spacing:3px;color:#c5edeb}h1{font-size:27px;letter-spacing:2px;margin:12px 0}.location p{font-size:10px;letter-spacing:2px}.location p span{display:block;margin-top:12px;letter-spacing:1px;font-size:12px;opacity:.8}.compass{position:absolute;top:102px;left:50%;transform:translateX(-50%);text-align:center;font-size:12px}.compass b{font-size:22px;font-weight:400;letter-spacing:3px;display:block;margin-top:8px}.ticks{font-size:24px;letter-spacing:7px;margin-top:4px;opacity:.7}.mission{position:absolute;right:32px;top:128px;width:196px;background:#153642a3;backdrop-filter:blur(15px);border:1px solid #ffffff29;border-radius:12px;padding:20px}.mission strong{font-size:40px;font-weight:400}.mission div>span{font-size:14px;opacity:.6;margin-left:10px}.mission p{font-size:12px;line-height:1.7;color:#d5e9e9}.progress,.bar{height:3px;background:#ffffff25;margin-top:16px}.progress i,.bar i{display:block;height:100%;background:#c5ff79;width:0;transition:width .2s}#reticle{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:12px;opacity:.65}#reticle i{width:25px;height:1px;background:#fff}#reticle span{font-size:20px}footer{position:absolute;bottom:58px;left:50%;transform:translateX(-50%);width:min(860px,calc(100% - 56px));display:flex;align-items:center;justify-content:space-between;padding:23px 28px;background:#0c2632da;backdrop-filter:blur(18px);border:1px solid #fff3;border-radius:15px;gap:24px}.readout>span,.readout label{font-size:10px;letter-spacing:1px;color:#a4c0cc}.readout b{font-size:38px;font-weight:400;font-variant-numeric:tabular-nums}.readout small{font-size:11px;color:#aac4cc;margin-left:8px}.readout>small{margin-left:0;display:block;margin-top:9px}.readout{min-width:120px}.throttle{width:155px}.throttle label b{font-size:14px;color:#c5ff79;letter-spacing:0;float:right}.throttle input{width:100%;accent-color:#c5ff79;margin-top:21px;cursor:pointer}.attitude{flex-shrink:0;width:76px;height:76px;border:3px solid #648794;border-radius:50%;position:relative;overflow:hidden}.attitude #horizon{position:absolute;inset:-45px;background:linear-gradient(#4d92ac 50%,#bb8d58 50%)}.fixed{position:absolute;top:25px;left:7px;color:#efffa5}.keyhint{position:absolute;bottom:22px;left:0;right:0;text-align:center;color:#d2e4e9;font-size:11px}.keyhint span{border:1px solid #ffffff40;border-radius:4px;padding:3px 5px;margin-left:18px;margin-right:5px}.overlay{position:absolute;inset:0;background:#0827375e;backdrop-filter:blur(4px);display:grid;place-items:center;padding:20px}.overlay[hidden]{display:none}.overlay section{background:#102c38ee;border:1px solid #fff3;box-shadow:0 25px 100px #09222f66;border-radius:20px;width:420px;max-width:100%;padding:36px}.overlay h2{font-size:38px;letter-spacing:3px;margin:16px 0}.overlay p{font-size:14px;color:#bcd3dd;line-height:1.9}.instructions{border-top:1px solid #fff2;padding-top:16px;margin:20px 0 24px}.instructions>div{display:flex;align-items:center;gap:7px;margin:10px 0;font-size:13px}.instructions span{margin-left:12px;color:#d0e2e7}kbd{display:inline-grid;place-items:center;min-width:27px;height:25px;border:1px solid #78929d66;border-bottom-width:3px;border-radius:4px;font-size:12px}.primary{background:#c5ff79;color:#102c38;width:100%;font-weight:700;border:0;padding:17px}.primary:hover{background:#dbffaa}.primary span{float:right}.overlay small{font-size:10px;display:block;text-align:center;color:#8baab6;margin-top:16px}#notice{position:absolute;top:35%;left:50%;transform:translateX(-50%);padding:14px 24px;border-radius:10px;background:#12313dd9;color:#e3ffc9;display:none;text-align:center;white-space:nowrap;font-size:15px}.touch{display:none;position:absolute;bottom:200px;left:20px;text-align:center}.touch button{width:48px;height:46px;margin:2px;touch-action:none;padding:0;font-size:23px;user-select:none}
@media(pointer:coarse){.touch{display:block}.keyhint{display:none}}@media(max-width:700px){header{padding:18px}.brand strong{font-size:16px;letter-spacing:2px}.brand>span{display:none}.brand{font-size:22px;gap:6px}.top-actions button{padding:10px;font-size:11px}.top-actions button span{display:none}.location{top:90px;left:20px}.location h1{font-size:19px}.location p,.location .eyebrow{display:none}.compass{top:145px}.mission{top:90px;right:18px;width:125px;padding:12px}.mission .eyebrow{font-size:9px;letter-spacing:1px}.mission strong{font-size:28px}.mission p{font-size:10px}.mission .progress{margin-top:8px}footer{bottom:20px;padding:15px;gap:12px;width:calc(100% - 28px);flex-wrap:wrap}.readout{min-width:80px;flex:1}.readout b{font-size:28px}.readout>span,.readout label{font-size:9px;letter-spacing:0}.attitude{width:54px;height:54px}.fixed{font-size:12px;left:4px;top:17px}#reset{padding:10px}#reset span{display:none}.throttle{min-width:130px}.throttle input{margin-top:12px}.overlay section{padding:26px}.overlay h2{font-size:32px}.keyhint{display:none}#notice{max-width:90%;white-space:normal;width:max-content}.touch{bottom:205px}}

/* aigeek に置くにあたって足した1つだけ＝開始画面の出どころ表記 */
.overlay .credit{margin:14px 0 0;font-size:12px;line-height:1.7;color:#8b93a1;max-width:34em}
.overlay .credit strong{color:#c9ff68;font-weight:600}
.overlay .credit a{color:#c9ff68;text-decoration:underline;text-underline-offset:2px}
