/* Source PPT coordinates in a 1280 x 720 canvas. The bitmap remains unchanged. */
:root { color-scheme: dark; --page-background: #1b2020; --field-background: #363a3d; --program-background: #2f3336; --action-background: #10d9e5; --text: #fff; }
* { box-sizing: border-box; }
html, body { margin: 0; width: 100%; height: 100%; overflow: hidden; background: var(--page-background); }
body { display: grid; place-items: center; }
.screen { position: absolute; width: 1280px; height: 720px; transform-origin: center; font-family: Calibri, "Microsoft YaHei", "微软雅黑", "PingFang SC", sans-serif; color: var(--text); letter-spacing: 0; }
.screen > * { position: absolute; margin: 0; }
.interface-image { left: 0; top: .4px; width: 1280px; height: 719.2px; pointer-events: none; }
.project-name-mask { left: 12.933px; top: 14.267px; width: 231.4px; height: 26.733px; background: #262729; }
.generation-mark-mask { left: 1152px; top: 681px; width: 116px; height: 26px; background-image: url("assets/leveling-interface.png"); background-size: 1280px 719.2px; background-position: -1020px -680.6px; border-bottom-right-radius: 5px; }
.parameters { left: 953.8px; top: 102.333px; width: 212.267px; height: 119.467px; background: var(--field-background); display: flex; flex-direction: column; justify-content: center; padding: 4.8px 9.6px; }
.parameters label { display: flex; align-items: baseline; height: 30px; font-size: 21.333px; line-height: 30px; white-space: nowrap; }
.parameters input { width: 88px; min-width: 0; height: 26px; padding: 0 2px; margin: 0 3px 0 0; border: 0; border-bottom: 1px solid var(--text); border-radius: 0; background: transparent; color: inherit; font: inherit; line-height: 25px; text-align: center; appearance: textfield; }
.parameters .target input { width: 62px; }
.parameters input::-webkit-inner-spin-button, .parameters input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.parameters input:focus-visible { outline: 1px solid var(--action-background); outline-offset: 1px; }
.image-button { display: block; padding: 0; border: 0; background: transparent; cursor: pointer; }
.generate { left: 471.5px; top: 517.8px; width: 135.9px; height: 48.4px; border-radius: 5px; }
.inject { left: 777.333px; top: 347px; width: 131.867px; height: 35.8px; border: 0; border-radius: 5.97px; background: var(--action-background); color: #000; font: 700 16px/1 Calibri, "Microsoft YaHei", "PingFang SC", sans-serif; cursor: pointer; }
.generate:focus-visible, .inject:focus-visible, .home:focus-visible { outline: 2px solid white; outline-offset: 3px; }
.generate:active { background: rgb(0 0 0 / 8%); }
.inject:active { filter: brightness(.9); }
.program { left: 722.4px; top: 409.2px; width: 496.2px; height: 164.333px; padding: 4.8px 9.6px; background: var(--program-background); overflow-y: auto; overflow-x: hidden; scrollbar-width: thin; scrollbar-color: #707c7f var(--program-background); }
.program:focus-visible { outline: 1px solid var(--action-background); }
.program::-webkit-scrollbar { width: 8px; }
.program::-webkit-scrollbar-track { background: var(--program-background); }
.program::-webkit-scrollbar-thumb { background: #707c7f; border-radius: 2px; }
pre { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font: 16px/1.2 Calibri, "Microsoft YaHei", "PingFang SC", sans-serif; }
code { font: inherit; }
.result { left: 913.733px; top: 347px; width: 297.267px; height: 35.867px; display: flex; align-items: center; padding: 4.8px 9.6px; font-size: 16px; line-height: 18px; font-weight: 700; }
.home { left: 53px; top: 646px; width: 33px; height: 34px; border-radius: 6px; }
[hidden] { display: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.native-title { left: 489px; top: 12px; width: 305px; height: 30px; background: #1c2b2d; font: 700 24px/30px "Microsoft YaHei","PingFang SC",sans-serif; text-align: center; white-space: nowrap; }
.header-data { left: 846px; top: 16px; width: 405px; height: 24px; padding: 0 5px; background: #24292b; font-size: 15px; line-height: 24px; white-space: nowrap; }
.level-state { left: 962px; top: 257px; width: 252px; height: 30px; background: #343b3e; font-size: 18px; line-height: 30px; font-weight: 600; }
.ai-heading, .code-heading { top: 350px; height: 30px; background: #2a383b; font-size: 20px; line-height: 30px; font-weight: 600; }
.ai-heading { left: 46px; width: 135px; }.code-heading { left: 688px; width: 84px; }
.ai-advice { left: 55px; top: 439px; width: 550px; height: 35px; padding: 0 2px; background: #353b3e; font-size: 16px; line-height: 35px; font-weight: 500; }
.script-hint { left: 73px; top: 529px; width: 350px; height: 28px; background: #202627; font-size: 14px; line-height: 28px; }
.generate { background: #10d5e0; color: #000; font-size: 18px; font-weight: 600; }
.line-numbers { left: 680px; top: 413px; width: 28px; height: 169px; padding: 0; list-style: none; background: #34393b; color: #aab0b2; font: 16px/24px Calibri,sans-serif; text-align: center; }
.footer-state { top: 649px; height: 27px; background: #222a2d; font-size: 16px; font-weight: 600; line-height: 27px; text-align: center; }
.generated-state { left: 204px; width: 114px; }.validated-state { left: 373px; width: 105px; color: #ffcd30; }.confirmed-state { left: 527px; width: 107px; }
.safety-note { left: 728px; top: 652px; width: 469px; height: 25px; background: #222a2d; font-size: 14px; line-height: 25px; }