:root{color-scheme:dark;font-family:"Microsoft YaHei","PingFang SC",sans-serif;background:#15191f;color:#edf0f3;font-synthesis:none;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}body{position:fixed;inset:0;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}button{font:inherit;cursor:pointer;touch-action:none}button:focus-visible{outline:2px solid #d9b656;outline-offset:2px}button:disabled{cursor:default}[hidden]{display:none!important}
.app-shell{position:absolute;inset:0;width:100vw;height:100dvh;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:hidden;padding:0}
.game-frame{width:100%;height:100%;display:flex;flex-direction:column;flex:none;border:0;background:#273142;box-shadow:none;container-type:inline-size}.game-frame.is-result .command-bar{display:none}
.command-bar{height:64px;position:relative;display:flex;align-items:center;justify-content:center;padding:0 12px;background:#263040;border-bottom:1px solid #101823;z-index:2}
.hud{height:50px;display:flex;align-items:center;justify-content:center;padding:3px 0;background:linear-gradient(#fffefa,#e8e9e8);border:1px solid #a99b7d;border-radius:2px;pointer-events:none;color:#544c40}.hud>div{min-width:100px;padding:0 20px;border-left:1px solid #c8c3b8;display:grid;grid-template-columns:auto auto;align-items:baseline;column-gap:4px;white-space:nowrap}.hud>div:first-child{border:0}.hud span{grid-column:1/-1;font-size:10px;line-height:1.3;color:#756e63}.hud strong{font:700 28px/1 "Bahnschrift","Segoe UI",sans-serif;font-variant-numeric:tabular-nums;color:#6c5528}.hud small{font-size:11px;color:#817459;justify-self:start}.hud .timer{grid-template-columns:2ch auto;min-width:100px}.hud>div:nth-child(2) strong{color:#946a16}.hud .leak-count{min-width:80px;padding:0 15px}.hud .leak-count strong{font-size:23px;color:#9d5e55}.hud.urgent #time{color:#bf4544}
.tools{position:absolute;right:12px;display:flex;gap:6px;flex-shrink:0}.tool{position:relative;display:grid;place-items:center;border:1px solid #657287;color:#e7eaf0;background:#3b485d;width:40px;height:40px;padding:10px;border-radius:2px}.tool:hover:not(:disabled){background:#536178;border-color:#aeb9c8}.tool:disabled{display:none}.tool::after{content:attr(data-tooltip);position:absolute;top:calc(100% + 9px);right:0;z-index:5;background:#f2f2eb;border:1px solid #bba36e;color:#51472f;padding:5px 8px;font-size:11px;white-space:nowrap;pointer-events:none;opacity:0}.tool:hover:not(:disabled)::after,.tool:focus-visible::after{opacity:1}
button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.game-stage{position:relative;width:100%;flex:1;min-height:0;overflow:hidden;background:#273447;isolation:isolate}canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}
.retro-output{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center;pointer-events:none}
.tool[aria-pressed="true"]{color:#edcc83;border-color:#a58a50;background:#514b36;box-shadow:inset 0 0 0 1px #cba85c22}
.retro-active{border-color:#767967;box-shadow:0 0 0 3px #171d1b,0 12px 40px #0009}
.retro-active .command-bar{background:linear-gradient(#303a36,#202925);border-bottom-color:#77785c}
.retro-active .hud{background:linear-gradient(#303a33,#202922);border-color:#77785a;color:#e4ddbf;box-shadow:inset 0 1px 0 #bac4a41a}
.retro-active .hud>div{border-left-color:#5b6250}.retro-active .hud span{color:#b7baa3}.retro-active .hud strong,.retro-active .hud>div:nth-child(2) strong{color:#f0d28c;text-shadow:0 0 8px #d6b05c30}.retro-active .hud small{color:#b7baa3}.retro-active .hud .leak-count strong{color:#df9b83}.retro-active .hud.urgent #time{color:#ff8272}
.retro-active .tool{background:#303b33;border-color:#6d7867;color:#d9dfcc}.retro-active .tool:hover:not(:disabled){background:#485246}.retro-active .tool[aria-pressed="true"]{color:#f1d18e;background:#4d4a31;border-color:#b5995e}
.retro-active .screen{background:#0b110f55}.retro-active .screen-content{background:linear-gradient(135deg,#30392eef,#1b2522f7);border:1px solid #a69c72;box-shadow:inset 0 0 0 4px #19201b,0 12px 38px #0009;color:#e5ddbf}
.retro-active h1{color:#eed596;border-bottom-color:#88805c;letter-spacing:.08em}.retro-active .screen-copy{color:#c1c6b1}
.retro-active .start-button{color:#282b20;background:linear-gradient(#e1cc92,#b3a16d);border-color:#e6d5a2;border-bottom-color:#887c51;box-shadow:inset 0 0 0 2px #d4c49366,0 2px 0 #111913}.retro-active .start-button:hover{background:linear-gradient(#f1dea8,#c8b67f)}
.retro-active .result-caption,.retro-active .result-number>span{color:#d6c699}.retro-active .result-number>strong{color:#f0d28c;-webkit-text-stroke-color:#e1c47d;text-shadow:0 0 22px #d6b05c20}.retro-active .result-secondary{color:#b9bda8}.retro-active .result-secondary strong{color:#e5a58b}
.screen{position:absolute;inset:0;display:grid;place-items:center;background:#121c2d66}.screen.is-hidden{visibility:hidden;pointer-events:none}.screen-content{width:min(440px,86%);padding:26px 30px;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;color:#514a3e;background:linear-gradient(#f7f7f3,#e7e9ea);border:2px solid #9ea6aa;border-radius:2px;box-shadow:0 4px 16px #10182455}
h1{font-size:28px;line-height:1.3;margin:0;font-weight:800;letter-spacing:0;color:#786026;border-bottom:2px solid #a18747;padding:0 4px 5px}.screen-copy{font-size:14px;line-height:1.6;color:#6c675f;margin:0}
.start-button{min-width:180px;min-height:48px;display:inline-flex;justify-content:center;align-items:center;gap:12px;border:1px solid #a88b43;border-bottom:3px solid #907133;border-radius:3px;background:linear-gradient(#fff0b7,#e6c56d);color:#685021;padding:10px 22px;font-weight:700;font-size:16px;box-shadow:inset 0 0 0 2px #fff2c29c,0 2px 0 #bdb5a5}.start-button:hover{background:linear-gradient(#fff8d9,#f6da8f)}.start-button:active{transform:translateY(1px);box-shadow:inset 0 1px 3px #8d682633}.start-button:disabled{opacity:.6}
.is-result .screen-content{width:min(520px,88%);gap:16px;padding:26px 34px}.is-result .screen-copy{display:none}.is-result h1{font-size:22px;border:0;padding:0}.result-tally{display:flex;flex-direction:column;align-items:center;gap:4px}.result-caption{font-size:13px;color:#817253}.result-number{display:flex;align-items:baseline;justify-content:center;gap:8px;white-space:nowrap}.result-number>strong{font:900 176px/1 "Arial Black","Segoe UI",sans-serif;letter-spacing:0;color:#b48b26;-webkit-text-stroke:1px #7f5c1b;font-variant-numeric:tabular-nums}.result-number>span{font-size:28px;color:#80672e;font-weight:700}.result-secondary{margin:5px 0 0;font-size:16px;color:#888074;line-height:1.3}.result-secondary strong{font:700 20px/1 "Bahnschrift","Segoe UI",sans-serif;color:#9d655b}
.countdown{position:absolute;inset:0;display:grid;place-items:center;background:#141e2944;color:#ffe58d;text-shadow:0 3px 0 #635235,0 5px 20px #000;font:900 112px/1 Consolas,monospace;pointer-events:none}.rotate-hint{display:none}.sr-only{position:absolute;top:0;left:0;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-height:600px){.game-frame{width:100%;height:100%}}
@media(max-height:460px){.command-bar{height:52px}.is-result .screen-content{padding:10px 18px;gap:6px}.is-result h1{font-size:18px}.result-caption{font-size:11px}.result-number>strong{font-size:72px}.result-number>span{font-size:18px}.result-secondary{margin:0;font-size:12px}.result-secondary strong{font-size:15px}}
@media(orientation:portrait){.rotate-hint{display:block;font-size:12px;color:#aab4c1;margin:22px 0 0}}
@container(max-width:700px){.command-bar{height:56px;justify-content:flex-start;padding:0 148px 0 8px}.tools{right:8px}.hud{width:100%;height:46px;flex:1;justify-content:space-evenly}.hud>div{min-width:70px;padding:0 14px}.hud .timer{min-width:70px}.hud .leak-count{min-width:64px;padding:0 12px}.hud strong{font-size:25px}.hud .leak-count strong{font-size:21px}.screen-content{padding:18px 24px;gap:10px;width:min(410px,88%)}h1{font-size:24px;padding:0 4px 4px}.screen-copy{font-size:12px}.start-button{min-width:150px;min-height:44px;font-size:14px;padding:8px 16px}.countdown{font-size:72px}.is-result .screen-content{width:min(360px,88%);padding:14px 24px;gap:10px}.is-result h1{font-size:20px}.result-caption{font-size:11px}.result-number>strong{font-size:88px}.result-number>span{font-size:20px}.result-secondary{font-size:12px;margin-top:2px}.result-secondary strong{font-size:15px}}
@container(max-width:460px){.hud>div{min-width:0;padding:0 10px}.hud .timer{min-width:0}.hud .leak-count{min-width:0;padding:0 8px}.hud span{font-size:9px}.hud strong{font-size:24px}.hud .leak-count strong{font-size:20px}.hud small{font-size:9px}.tools{gap:4px}.screen-content{padding:14px 16px;gap:10px}h1{font-size:23px}.screen-copy{font-size:11px}.start-button{min-width:140px;min-height:44px;font-size:14px;gap:8px}.start-button svg{width:17px;height:17px}.is-result .screen-content{padding:8px 14px;gap:6px}.is-result h1{font-size:18px}.result-number>strong{font-size:80px}.result-caption{font-size:10px}.result-tally{gap:2px}.result-number>span{font-size:18px}.countdown{font-size:60px}}
@container(max-width:340px){.command-bar{padding-right:142px}.hud>div{padding:0 6px}.hud .leak-count{padding:0 6px}.hud strong{font-size:21px}.hud .leak-count strong{font-size:18px}.hud .timer{column-gap:2px}.is-result .screen-content{padding:8px 12px;gap:6px}.is-result h1{font-size:18px}.result-caption{display:none}.result-number>strong{font-size:64px}.result-secondary{font-size:11px}.result-secondary strong{font-size:13px}}
