/* Desktop coordinates follow the supplied 1920 x 1080 game reference. */
:root{color-scheme:dark;--bg:#050606;--panel:#070808;--text:#deded9;--muted:#7c8581;--line:#92958e;--cyan:#8dbbb4;--red:#d66b73;--green:#a9e7b0;font-family:"Courier New","Microsoft YaHei",monospace}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);min-height:100dvh}button,input,select{font:inherit}button{cursor:pointer;border-radius:0}button:disabled{cursor:default;opacity:.4}button,a,input,select{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:5px}[hidden]{display:none!important}a{color:inherit;text-decoration:none}::selection{background:#46625c;color:white}
.game-screen{position:absolute;left:50%;top:50%;width:1920px;height:1080px;transform:translate(-50%,-50%) scale(var(--screen-scale,1));overflow:hidden;background:#050606;border:6px solid #050606;outline:1px solid #60645d;outline-offset:-7px}
.game-screen::after{content:"";position:absolute;inset:0;z-index:8;pointer-events:none;opacity:.23;background:repeating-linear-gradient(0deg,transparent 0 2px,#000 2px 3px),repeating-linear-gradient(90deg,#e16c681b 0 1px,#77bca81b 1px 2px,transparent 2px 3px)}.no-effects .game-screen::after{display:none}
.terminal-background{position:absolute;inset:0;pointer-events:none;overflow:hidden;color:#646c65;font:12px/1.5 "Courier New",monospace;letter-spacing:1px}.background-code{position:absolute;top:163px;left:9px;width:420px;height:350px;border:2px solid #71716a;padding:12px;white-space:pre-wrap;opacity:.75}.background-code.right{top:135px;left:auto;right:30px;width:420px;height:278px;padding-top:175px;color:#517b75;font-size:10px}.background-explorer{position:absolute;top:450px;left:8px;width:423px;height:540px;border:2px solid #77786f;background:linear-gradient(0deg,transparent 0 31px,#83827b 31px 55px,transparent 55px)}.background-explorer div{padding:6px 13px;border-bottom:1px solid #74756d}.background-explorer p{margin:16px 14px}.background-console{position:absolute;right:11px;top:416px;width:450px;height:545px;border:3px double #787d73;padding:140px 15px 15px;color:#619a93;font-size:10px;overflow:hidden}
.topbar{z-index:3;position:absolute;left:0;right:0;top:0;height:49px;border-bottom:1px solid #72786c;display:flex;align-items:center}.system-name{position:absolute;left:1020px;top:18px;font-size:12px;line-height:14px;letter-spacing:2px;color:#718278;white-space:nowrap}.connection{margin-left:414px;height:49px;width:570px;border-inline:1px solid #72786c;display:flex;align-items:center;gap:25px;padding-left:27px;font-size:17px;letter-spacing:3px;color:#9fa497}.signal{height:30px;width:322px;background:repeating-linear-gradient(90deg,#aeb7ae 0 6px,transparent 6px 12px)}.system-icons{margin-right:24px;color:#a1a99f;letter-spacing:6px}.text-button{border:0;background:none;color:var(--muted);padding:8px;font-size:13px}.text-button:hover{color:white}.topbar .text-button{margin-left:auto;margin-right:25px}.game-prompt{pointer-events:none;position:absolute;left:36px;top:7px;z-index:2;font:29px "Microsoft YaHei",sans-serif;display:flex;align-items:center;gap:7px;color:#f0f0ec;text-shadow:1px 2px #000}.game-prompt kbd{height:36px;min-width:36px;font-size:17px}
kbd{display:inline-flex;align-items:center;justify-content:center;background:#dedfd9;color:#151717;border:1px solid #aeb2ab;border-radius:2px;font:15px "Courier New",monospace;padding:2px 4px;min-width:29px;height:29px;text-shadow:none}
.app-shell{position:absolute;inset:0}.session-heading{position:absolute;top:51px;left:365px;right:365px;height:16px;display:flex;align-items:center;justify-content:space-between;color:#91a99d;font-size:11px;line-height:16px;letter-spacing:1px;white-space:nowrap}.terminal{position:absolute;left:327px;top:74px;width:1254px;height:920px;border:2px solid #dedfd8;padding:13px 37px 13px 35px;display:grid;grid-template-columns:470px 686px;gap:22px;background:#060707;box-shadow:0 0 0 4px #000}.terminal::before,.terminal::after{content:"≪ ▫\A\A ≪ ▫\A\A ▫\A\A ≪\A\A ▫▫\A\A ≪ ▫\A\A ▫\A\A ≪\A\A ▫▫";white-space:pre;position:absolute;top:13px;bottom:12px;width:25px;font:10px/43px monospace;color:#5faaa2;overflow:hidden;left:5px}.terminal::after{left:auto;right:4px;transform:rotate(180deg)}
.components-column{display:grid;grid-template-rows:98px 1fr 98px;gap:22px;position:relative;padding-bottom:24px}.target-column{display:grid;grid-template-rows:674px 194px;gap:22px;min-width:0}.panel{border:1px solid #b1b4aa;background:#060707;position:relative;min-width:0}.panel-heading{position:relative;height:24px;margin:0 0 0;display:flex;justify-content:center;align-items:center;background:repeating-linear-gradient(0deg,#d3d8ce 0 1px,#89938d 1px 2px,#d3d8ce 2px 3px,#18221e 3px 4px);color:#090c0b;letter-spacing:2px;font:bold 19px/1 "Courier New",monospace;text-shadow:1px 0 #495e57}.panel-heading>span:first-child{background:#cbd1c7;padding:0 8px}.panel-heading .panel-code{position:absolute;right:10px;top:32px;font:10px "Microsoft YaHei",sans-serif;color:#7da19a;letter-spacing:0}.panel::after{content:"CPP.1A\A ▫ ▫";white-space:pre;position:absolute;left:18px;top:34px;font:9px/12px monospace;color:#77b6ac;letter-spacing:1px;pointer-events:none}.timer-panel::after{content:"CPP.A8\A ▫ ▫"}.target-panel::after,.progress-panel::after{display:none}
.timer{height:71px;display:flex;align-items:center;justify-content:center;gap:7px;color:var(--red);font:56px/1 "Courier New",monospace;letter-spacing:2px;text-shadow:0 0 4px #ce5b6466}.timer.practice{font:36px "Microsoft YaHei",sans-serif;letter-spacing:12px}.timer.urgent{animation:warning 1s infinite}.timer-sub{display:none}.digit{display:inline-block;position:relative;width:30px;height:44px}.digit i{position:absolute;display:block;background:#492026;opacity:.22;box-shadow:0 0 2px #d5666744}.digit i:nth-child(1),.digit i:nth-child(4),.digit i:nth-child(7){left:4px;width:22px;height:5px;clip-path:polygon(12% 0,88% 0,100% 50%,88% 100%,12% 100%,0 50%)}.digit i:nth-child(1){top:0}.digit i:nth-child(4){top:20px}.digit i:nth-child(7){bottom:0}.digit i:nth-child(2),.digit i:nth-child(3),.digit i:nth-child(5),.digit i:nth-child(6){width:5px;height:20px;clip-path:polygon(50% 0,100% 12%,100% 88%,50% 100%,0 88%,0 12%)}.digit i:nth-child(2){left:0;top:2px}.digit i:nth-child(3){right:0;top:2px}.digit i:nth-child(5){left:0;bottom:2px}.digit i:nth-child(6){right:0;bottom:2px}
.d0 i:not(:nth-child(4)),.d1 i:nth-child(3),.d1 i:nth-child(6),.d2 i:nth-child(1),.d2 i:nth-child(3),.d2 i:nth-child(4),.d2 i:nth-child(5),.d2 i:nth-child(7),.d3 i:nth-child(1),.d3 i:nth-child(3),.d3 i:nth-child(4),.d3 i:nth-child(6),.d3 i:nth-child(7),.d4 i:nth-child(2),.d4 i:nth-child(3),.d4 i:nth-child(4),.d4 i:nth-child(6),.d5 i:nth-child(1),.d5 i:nth-child(2),.d5 i:nth-child(4),.d5 i:nth-child(6),.d5 i:nth-child(7),.d6 i:not(:nth-child(3)),.d7 i:nth-child(1),.d7 i:nth-child(3),.d7 i:nth-child(6),.d8 i,.d9 i:not(:nth-child(5)){background:var(--red);opacity:1}.clock-colon{font:bold 47px/1 monospace;margin-top:-7px}
.components-panel{border-bottom:0}.components-panel::before{content:"";position:absolute;left:-1px;right:-1px;top:100%;height:145px;border:1px solid #b1b4aa;border-top:0;pointer-events:none}.components-instruction,.component-footer,.fragment-index{display:none}.fragment-grid{display:grid;grid-template-columns:repeat(2,122px);justify-content:center;gap:22px 22px;padding-top:29px}.fragment{position:relative;width:122px;height:122px;background:#030404;border:1px solid #babcb3;padding:6px;touch-action:manipulation}.fragment img{width:100%;height:100%;object-fit:contain;opacity:.19;filter:grayscale(1);pointer-events:none;user-select:none}.fragment:hover{border-color:#fff}.fragment.selected img{opacity:.96}.fragment.cursor::before{content:"";position:absolute;inset:-12px;pointer-events:none;background:linear-gradient(#dce1d7,#dce1d7) left top/23px 3px no-repeat,linear-gradient(#dce1d7,#dce1d7) left top/3px 23px no-repeat,linear-gradient(#dce1d7,#dce1d7) right top/23px 3px no-repeat,linear-gradient(#dce1d7,#dce1d7) right top/3px 23px no-repeat,linear-gradient(#dce1d7,#dce1d7) left bottom/23px 3px no-repeat,linear-gradient(#dce1d7,#dce1d7) left bottom/3px 23px no-repeat,linear-gradient(#dce1d7,#dce1d7) right bottom/23px 3px no-repeat,linear-gradient(#dce1d7,#dce1d7) right bottom/3px 23px no-repeat}.fragment:focus-visible{outline:none}.fragment.correct{border:2px solid var(--green);background:#13271b}.fragment.correct img{opacity:1}.fragment.incorrect{border:2px solid var(--red);background:#291519}
.countdown-panel{margin:0 24px;padding:25px 22px 12px;z-index:1}.countdown-panel::after{display:none}.countdown-heading{position:absolute;top:3px;left:6px;right:6px;display:flex;align-items:center;gap:9px;font:bold 17px "Courier New",monospace;letter-spacing:2px;white-space:nowrap;color:#d4d9cf}.countdown-heading::before,.countdown-heading::after{content:"";flex:1;height:9px;border-block:1px solid #b9bfb3;background:linear-gradient(transparent 3px,#a5afa4 3px 4px,transparent 4px)}.countdown-title{display:none}.countdown-bars{display:flex;gap:6px;height:56px}.countdown-bars i{display:block;flex:1;background:linear-gradient(var(--red) 0 79%,transparent 79% 86%,var(--red) 86%);box-shadow:0 0 3px #d66b7333}.countdown-bars i.off{opacity:.12}
.target-panel{display:flex;flex-direction:column}.target-content{display:flex;gap:20px;padding:10px 17px 8px 24px;flex:1;min-height:0}.target-scanner{flex:1;min-width:0;display:flex;flex-direction:column}.scan-label{height:22px;color:#78aba1;font:9px monospace;letter-spacing:1px;display:flex;justify-content:space-between}.fingerprint-stage{flex:1;min-height:0;position:relative;display:flex;align-items:flex-start;justify-content:center;overflow:hidden;background-image:radial-gradient(#69877855 .65px,transparent .8px);background-size:10px 9px}.fingerprint-stage img{width:400px;height:512px;object-fit:contain;opacity:.24;filter:grayscale(1);margin-top:0;user-select:none}.ruler{width:12px;position:absolute;top:0;bottom:18px;background:repeating-linear-gradient(to bottom,#98a29777 0 5px,transparent 5px 127px)}.ruler-left{left:0}.ruler-right{right:0}.scan-line{display:none}.scan-footer{height:70px;display:flex;align-items:flex-end;color:#638980;font:10px monospace}.scanner-ring{position:absolute;bottom:12px;right:32px;width:59px;height:59px;border:3px solid #364a42;border-top-color:#b3c6b8;border-bottom-color:#b3c6b8;border-radius:50%;animation:rotate 6s linear infinite}.scanner-ring::after{content:"";position:absolute;inset:5px;border:5px double #719185;border-radius:50%;border-right-color:transparent}.no-effects .scanner-ring{animation:none}
.attempts{width:97px;height:482px;flex-shrink:0;align-self:flex-start;border:1px solid #c1c4b7;margin-top:23px;text-align:center;position:relative}.attempts-heading{display:block;background:#c9cfc3;color:#151b17;font:bold 15px/17px "Courier New",monospace;letter-spacing:1px;padding:4px 0}.attempt-indicators{display:flex;flex-direction:column;gap:11px;margin:42px 23px 0}.attempt-indicators::before{content:"▫▫▫";position:absolute;top:48px;left:15px;color:#7db9ab;font:18px monospace;letter-spacing:3px}.attempt-indicators i{display:block;height:49px;border:1px solid #c6b6ab;background:repeating-linear-gradient(0deg,#a551586e 0 1px,#c76a7380 1px 3px)}.attempt-indicators i.used{opacity:.13}#attempt-count{position:absolute;bottom:12px;left:0;right:0;font:10px monospace;color:#779b91}
.progress-list{display:grid;grid-template-columns:repeat(4,110px);justify-content:center;gap:23px;padding-top:28px}.progress-item{height:110px;border:1px solid #babeb3;display:flex;align-items:center;justify-content:center;position:relative}.progress-item img{width:74px;height:96px;object-fit:contain;opacity:.17;filter:grayscale(1)}.progress-item.active{outline:3px solid #d4d9cc;outline-offset:8px}.progress-item.done img{opacity:.5}.progress-item.done{border-color:var(--green)}.progress-number{display:none}.progress-check{position:absolute;right:5px;bottom:4px;color:var(--green)}.progress-panel::before{content:"▱ ▫";position:absolute;left:23px;top:40px;font:11px monospace;color:#7bb3a7}
.action-bar{position:absolute;left:365px;right:365px;top:998px;height:20px;display:flex;align-items:center;justify-content:space-between}.feedback{font:11px "Microsoft YaHei",sans-serif;color:#89968b}.feedback.success{color:var(--green)}.feedback.error{color:var(--red)}.action-buttons{display:flex;gap:15px}.action-buttons button{background:none;border:0;color:#a1b0a4;padding:0;font:11px "Microsoft YaHei",sans-serif;min-height:20px}.action-buttons kbd{height:16px;min-width:22px;font-size:10px}.primary-button,.secondary-button{border:1px solid #b2b9a9;padding:11px 17px;font-size:12px;letter-spacing:1px;min-height:39px;background:#c3caba;color:#101810;font-weight:600}.primary-button:hover:not(:disabled){background:#e5e9df}.secondary-button{background:transparent;color:var(--text)}.footer{position:absolute;bottom:0;left:0;right:0;height:49px;border-top:1px solid #777e70;display:flex;align-items:center;justify-content:space-between}.os-label{height:100%;display:flex;color:#9aa591;font-size:16px;letter-spacing:3px}.os-label span{width:180px;display:grid;place-items:center;border-right:1px solid #777e70}.os-label span+span{width:145px}.keyboard-help{display:flex;gap:20px;align-items:center;margin-right:29px;font:19px "Microsoft YaHei",sans-serif}.keyboard-help>span{display:flex;align-items:center;gap:7px}.keyboard-help kbd{font-size:19px}.footer-note{display:none}.exit-progress{position:absolute;bottom:0;left:0;height:3px;width:0;background:var(--red);z-index:10}.exit-progress.holding{width:100%;transition:width .9s linear}.status-dot,.tiny-dot{display:inline-block;width:5px;height:5px;background:var(--cyan);margin-right:5px}
dialog{color:var(--text);background:#0c1517;border:1px solid #506b62;padding:35px;width:min(470px,calc(100% - 32px));max-height:calc(100% - 32px);overflow:auto;box-shadow:0 20px 100px #000a}dialog::backdrop{background:#03090bce;backdrop-filter:blur(6px)}.dialog-eyebrow{display:flex;align-items:center;gap:9px;font:9px Consolas,monospace;letter-spacing:1.5px;color:var(--muted)}h2{font-size:33px;font-weight:500;line-height:1.45;letter-spacing:2px;margin:24px 0 13px}h2 span{color:var(--cyan)}.dialog-description{font-size:12px;color:var(--muted);line-height:1.9;margin:0 0 24px}.mode-options{border:0;margin:0 0 23px;padding:0;display:flex;flex-direction:column;gap:10px}.mode-card{display:flex;align-items:center;gap:15px;padding:16px;border:1px solid var(--line);cursor:pointer;background:#101b1b}.mode-card:has(input:checked){border-color:var(--cyan);background:#162c28}.mode-card input{accent-color:var(--cyan);order:3;margin-left:auto}.mode-icon{font:27px Consolas,monospace;color:var(--cyan);width:26px;text-align:center}.mode-card strong{font-size:13px;letter-spacing:1px;font-weight:500}.mode-card small{display:block;font-size:10px;color:var(--muted);margin-top:6px}.settings-row{display:flex;align-items:center;justify-content:space-between;margin:14px 0;font-size:11px;color:var(--muted)}select{padding:5px 9px;border:1px solid var(--line);background:#101b1b;color:var(--text);font-size:11px}input[type=checkbox]{accent-color:var(--cyan);width:15px;height:15px}.personal-best{border-top:1px solid var(--line);margin-top:22px;padding-top:16px;font-size:10px;color:var(--muted);line-height:1.8}.start-button{width:100%;display:flex;justify-content:space-between;align-items:center;margin-top:20px;padding:14px 18px;font-size:12px}.dialog-tip{text-align:center;font-size:9px;color:#617b71;margin:16px 0 0}.resume-button{display:block;margin:14px auto 0}.result-dialog{text-align:center}.result-dialog .dialog-eyebrow{justify-content:center}.result-symbol{font:42px Consolas,monospace;color:var(--cyan);border:1px solid #33564a;width:75px;height:75px;display:grid;place-items:center;margin:25px auto 0}.result-dialog h2{font-size:27px;margin-top:18px}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;gap:8px}.result-stats span{display:block;font-size:10px;color:var(--muted);margin-bottom:9px}.result-stats strong{font:21px Consolas,monospace;color:var(--text)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Match the utility dialogs to the same terminal without altering their controls. */
dialog{background:#080b09;border:1px solid #abb5a3;font-family:"Courier New","Microsoft YaHei",monospace;box-shadow:0 0 0 4px #050705,0 0 0 5px #4e5c4b}dialog::backdrop{background:#000a;backdrop-filter:none}h2{font-size:29px;letter-spacing:4px}.mode-card{background:#0c100d}.mode-card:has(input:checked){background:#19211b;border-color:#b7c3ac}select{background:#0c100d}.dialog-description{color:#9aa795}.dialog-tip{color:#87957f}
@keyframes rotate{to{transform:rotate(360deg)}}@keyframes warning{50%{opacity:.5}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
