:root{color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:system-ui,Segoe UI,Hiragino Sans,Noto Sans JP,sans-serif;background:#05070c;color:#dfe6f2}.app{display:flex;flex-direction:column;height:100vh}.disclaimer{background:#2a1f10;color:#ffe0b0;font-size:12.5px;line-height:1.5;padding:7px 14px;border-bottom:1px solid #6a5018}.disclaimer b{color:#ffcf87}.hdr{display:flex;align-items:baseline;gap:14px;padding:10px 16px;border-bottom:1px solid #1a2030;flex-wrap:wrap}.hdr h1{font-size:20px;margin:0;color:#ffb454;letter-spacing:.5px}.hdr .sub{font-size:13px;color:#9fb0c8}.hdr .sub b{color:#cfe4ff}.hdr .twin{color:#7fd0ff;font-size:11px;border:1px solid #2f5478;border-radius:10px;padding:1px 7px;margin-left:6px}.viewtabs{display:flex;gap:6px;margin-left:auto}.viewtabs button{padding:6px 12px;font-size:12.5px;cursor:pointer;background:#131a28;color:#cdd8ea;border:1px solid #263248;border-radius:6px}.viewtabs button.on{background:#33240f;border-color:#b47a2f;color:#ffdca8}.body{display:flex;flex:1;min-height:0}.panel{width:300px;flex-shrink:0;overflow-y:auto;padding:14px;background:#0a0e16;border-right:1px solid #1a2030}.grp-title{font-size:12px;color:#6f82a0;text-transform:uppercase;letter-spacing:1px;margin:14px 0 7px}.grp-title:first-child{margin-top:0}.presets{display:flex;flex-wrap:wrap;gap:6px}.presets button{flex:1 1 46%;padding:8px 6px;font-size:12px;cursor:pointer;background:#131a28;color:#cdd8ea;border:1px solid #263248;border-radius:6px}.presets button.on{background:#33240f;border-color:#b47a2f;color:#ffdca8}.presets button:hover{border-color:#b47a2f}.seg{display:flex;gap:6px}.seg.wrap{flex-wrap:wrap}.seg.wrap button{flex:1 1 28%}.seg button{flex:1;padding:8px 6px;font-size:12px;cursor:pointer;background:#131a28;color:#cdd8ea;border:1px solid #263248;border-radius:6px}.seg button.on{background:#33240f;border-color:#b47a2f;color:#ffdca8}.sl{display:block;font-size:12.5px;color:#aab8d0;margin:12px 0 4px}.sl b{float:right;color:#cfe4ff;font-weight:600}.sl input{width:100%;margin-top:6px;accent-color:#b47a2f}.metrics{margin-top:14px;border-top:1px solid #1a2030;padding-top:10px}.metrics div{display:flex;justify-content:space-between;font-size:12.5px;padding:3px 0}.metrics span{color:#8fa0bc}.metrics b{color:#cfe4ff}.metrics b.fe{color:#e0603a}.metrics b.nfe{color:#4aa3d6}.note{margin-top:14px;font-size:12px;line-height:1.6;color:#9aabc4}.note b{color:#cfe4ff}.stage{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:12px;overflow-y:auto}.mdcanvas{width:min(100%,760px);background:#070c14;border:1px solid #1a2740;border-radius:8px;display:block}.mdcanvas.sq{width:min(100%,640px);aspect-ratio:1}.iqwrap{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%}.busy{position:absolute;top:10px;left:50%;transform:translate(-50%);z-index:5;background:#131a28cc;color:#cfe4ff;font-size:12px;padding:4px 12px;border-radius:12px;border:1px solid #263248}.legend{display:flex;flex-wrap:wrap;gap:12px;font-size:11px;color:#8fa0bc;justify-content:center}.legend span{display:flex;align-items:center;gap:4px}.legend i{display:inline-block;width:10px;height:10px;border-radius:50%}.ftr{font-size:11px;color:#7386a0;padding:7px 14px;border-top:1px solid #1a2030;line-height:1.5}.ftr b{color:#9fb4d0}