*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --bg:#07080c;--panel:#0e1016;--panel2:#12161f;--line:#232a3a;
  --fg:#e2e8f0;--dim:#98a3b8;--mute:#6b7688;--faint:#414b5e;
  --acc:#4ade80;--acc2:#38bdf8;--err:#f87171;--warn:#fbbf24;

  --sig-b:"MjAyNQ==";
}

html,body{height:100%}
body{
  background:radial-gradient(1100px 620px at 12% -12%,#16203322,transparent),
             radial-gradient(820px 520px at 102% 0%,#162a1f22,transparent),
             var(--bg);
  color:var(--fg);
  font-family:ui-monospace,"SF Mono",Consolas,"Courier New",monospace;
  font-size:14px;line-height:1.6;
  min-height:100vh;
  display:flex;align-items:center;justify-content:center;
  padding:24px 18px;overflow-x:hidden;
  transition:background .6s;
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:"";position:fixed;inset:0;
  background-image:linear-gradient(#ffffff07 1px,transparent 1px),
                   linear-gradient(90deg,#ffffff07 1px,transparent 1px);
  background-size:46px 46px;pointer-events:none;z-index:0;
  -webkit-mask-image:radial-gradient(circle at 50% 42%,#000 0%,transparent 78%);
          mask-image:radial-gradient(circle at 50% 42%,#000 0%,transparent 78%);
}
body::after{
  content:"";position:fixed;inset:0;
  background:repeating-linear-gradient(0deg,transparent 0 2px,#00000033 2px 3px);
  pointer-events:none;z-index:0;opacity:.28;
}

.wrap{position:relative;z-index:2;width:100%;max-width:840px}
.view{display:none;animation:fadeUp .45s cubic-bezier(.2,.8,.2,1)}
.view.active{display:block}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}

.card{
  background:linear-gradient(180deg,#0f121a,#0b0e14);
  border:1px solid var(--line);border-radius:16px;padding:30px 26px;
  box-shadow:0 0 0 1px #ffffff05 inset,0 32px 80px -32px #000,0 0 90px -50px var(--acc);
  position:relative;overflow:hidden;
}
.card::before{
  content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--acc)55,transparent);
}
.card.glitch{animation:glitchAnim .3s steps(2) 2}
@keyframes glitchAnim{
  0%{transform:translate(0);filter:none}
  20%{transform:translate(-3px,1px);filter:hue-rotate(90deg)}
  40%{transform:translate(3px,-1px);filter:hue-rotate(-90deg)}
  60%{transform:translate(-2px,2px);filter:hue-rotate(180deg)}
  80%{transform:translate(2px,-2px);filter:hue-rotate(0deg)}
  100%{transform:translate(0);filter:none}
}

.logo{font-size:26px;letter-spacing:6px;color:var(--acc);text-align:center;
  margin-bottom:6px;text-shadow:0 0 24px #4ade8055;user-select:none}
h1{font-size:17px;font-weight:600;text-align:center;letter-spacing:5px;
  color:var(--fg);margin-bottom:6px}
.sub{text-align:center;font-size:12.5px;color:var(--dim);
  letter-spacing:1.2px;margin-bottom:22px}

form{display:flex;flex-direction:column;gap:14px}
label{display:block}
label>span{display:block;font-size:11.5px;letter-spacing:1.8px;
  color:var(--mute);margin-bottom:7px;text-transform:uppercase}

input[type=text],input[type=password],textarea{
  width:100%;background:#080a10;border:1px solid var(--line);
  border-radius:9px;padding:12px 14px;color:var(--fg);
  font-family:inherit;font-size:14.5px;outline:none;
  transition:border-color .2s,box-shadow .2s;resize:vertical;
}
input::placeholder,textarea::placeholder{color:var(--mute)}
input:focus,textarea:focus{border-color:#38bdf866;box-shadow:0 0 0 3px #38bdf81a}
input:disabled,textarea:disabled{opacity:.7;cursor:not-allowed}

button{
  font-family:inherit;font-size:13.5px;letter-spacing:2.5px;padding:13px 20px;
  border-radius:9px;border:1px solid #4ade8044;
  background:linear-gradient(180deg,#4ade8018,#4ade8008);
  color:var(--acc);cursor:pointer;transition:.2s;font-weight:600;
}
button:hover:not(:disabled){background:linear-gradient(180deg,#4ade8030,#4ade8012);
  box-shadow:0 0 24px -6px #4ade8066;transform:translateY(-1px)}
button:active:not(:disabled){transform:translateY(0)}
button:disabled{opacity:.4;cursor:not-allowed;border-color:var(--line);
  color:var(--mute);background:#ffffff05}

button.ghost{
  font-size:11.5px;padding:8px 16px;letter-spacing:1.5px;
  border-color:var(--line);background:transparent;color:var(--warn);
}
button.ghost:hover:not(:disabled){color:var(--warn);border-color:#fbbf2466;
  background:#fbbf240f;box-shadow:none;transform:none}

.msg{font-size:12.5px;letter-spacing:.4px;min-height:18px;text-align:center;
  line-height:1.75}
.msg.err{color:var(--err)}
.msg.ok{color:var(--acc)}
.msg.warn{color:var(--warn)}

.topbar{
  display:flex;align-items:center;justify-content:space-between;
  font-size:11.5px;letter-spacing:1.2px;color:var(--mute);
  padding-bottom:16px;margin-bottom:22px;border-bottom:1px solid var(--line);
  flex-wrap:wrap;gap:8px;
}
.topbar b{color:var(--acc);font-weight:600}
#timer{color:var(--dim);font-size:12px}

#logout{font-size:11px;padding:6px 12px;letter-spacing:1.2px;
  border-color:var(--line);background:transparent;color:var(--mute)}
#logout:hover{color:var(--err);border-color:#f8717144;
  background:#f871710f;box-shadow:none;transform:none}

.stage{display:none;margin-bottom:14px}
.stage.active{display:block}
.stage.done{display:block}
.stage.done .stage-body{display:none}

.stage-hd{display:flex;align-items:center;gap:10px;padding:12px 14px;
  background:var(--panel2);border:1px solid var(--line);border-radius:10px;
  font-size:12px;letter-spacing:1.2px}
.stage.active .stage-hd{border-color:#4ade8044;
  background:linear-gradient(180deg,#4ade800e,#4ade8004)}
.stage-no{color:var(--mute)}
.stage.active .stage-no{color:var(--acc)}
.stage-name{color:var(--fg);flex:1}
.stage-check{color:var(--acc);display:none}
.stage.done .stage-check{display:inline}

.stage-body{padding:18px 4px 4px}
.stage-desc{font-size:13.5px;color:var(--dim);line-height:1.95;
  margin-bottom:16px;letter-spacing:.2px}

.cipher{background:#080a10;border:1px solid var(--line);border-radius:10px;
  padding:22px;text-align:center;font-size:24px;letter-spacing:8px;
  color:var(--acc2);margin-bottom:16px;text-shadow:0 0 24px #38bdf844;
  user-select:all;word-break:break-all}
.cipher.small{font-size:16px;letter-spacing:3px;padding:18px 14px;line-height:2.1}

.field{display:flex;gap:10px;margin-bottom:12px}
.field input{flex:1}
.field button{flex-shrink:0;padding:12px 22px}
.field-col{display:flex;flex-direction:column;gap:12px;margin-bottom:12px}

.cand-box{background:#080a10;border:1px solid var(--line);border-radius:10px;
  padding:16px;margin-bottom:16px}
.cand-label{font-size:10.5px;letter-spacing:2.5px;color:var(--mute);
  margin-bottom:12px;text-transform:uppercase}
.cand-item{display:flex;align-items:center;gap:12px;padding:9px 12px;
  border-radius:8px;background:#0d1017;border:1px solid #1b2130;
  margin-bottom:8px;font-size:15px;letter-spacing:2.5px;color:var(--fg)}
.cand-item:last-child{margin-bottom:0}
.cand-idx{font-size:10.5px;color:var(--mute);letter-spacing:1px;flex-shrink:0;
  min-width:22px}
.cand-val{flex:1;user-select:all;word-break:break-all}

.sum-table{width:100%;border-collapse:collapse;font-size:12.5px;
  background:#080a10;border:1px solid var(--line);border-radius:10px;
  overflow:hidden;margin-bottom:16px}
.sum-table th,.sum-table td{padding:9px 12px;text-align:left;
  border-bottom:1px solid #1b2130}
.sum-table tr:last-child td{border-bottom:none}
.sum-table th{font-size:10.5px;letter-spacing:2px;color:var(--mute);
  font-weight:600;text-transform:uppercase}
.sum-table td{color:var(--dim)}
.sum-table td.k{color:var(--fg)}
.sum-table td.v{color:var(--acc2);font-weight:700;letter-spacing:1px}

.img-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:12px;margin-bottom:16px}
.img-cell{text-align:center}
.img-cell img{width:100%;border-radius:10px;border:1px solid var(--line);
  display:block}
.img-cap{font-size:11px;color:var(--mute);letter-spacing:1.5px;margin-top:8px;
  word-break:break-all}

.node-list{display:flex;flex-direction:column;gap:9px;margin-bottom:14px}

.node-item{
  display:flex;align-items:center;gap:12px;padding:13px 15px;
  background:var(--panel2);border:1px solid var(--line);border-radius:10px;
  text-decoration:none;color:var(--fg);font-size:13.5px;letter-spacing:1px;
  transition:.25s cubic-bezier(.2,.8,.2,1);cursor:pointer;
}
.node-item:hover{border-color:#38bdf855;
  background:linear-gradient(90deg,#38bdf80e,#38bdf802);transform:translateX(4px)}
.node-item.visited{border-color:#4ade8033}
.node-item.locked{opacity:.5;cursor:not-allowed}
.node-item.locked:hover{transform:none;border-color:var(--line)}
.node-item.current{border-color:#38bdf8aa;background:linear-gradient(90deg,#38bdf814,#38bdf803)}

.node-dot{width:7px;height:7px;border-radius:50%;background:var(--mute);
  flex-shrink:0;transition:.25s}
.node-item:hover .node-dot{background:var(--acc2);box-shadow:0 0 10px #38bdf888}
.node-item.visited .node-dot{background:var(--acc);box-shadow:0 0 10px #4ade8088}

.node-name{flex:1;font-size:13px}
.node-status{font-size:11.5px;color:var(--mute);letter-spacing:1px}
.node-status.ok{color:var(--acc)}

.progress{height:2px;background:var(--line);border-radius:2px;
  overflow:hidden;margin:18px 0 0}
.progress-bar{height:100%;width:0%;
  background:linear-gradient(90deg,var(--acc2),var(--acc));
  transition:width .5s cubic-bezier(.2,.8,.2,1);
  box-shadow:0 0 12px #4ade8088}

.node-top{display:flex;align-items:center;justify-content:space-between;
  padding-bottom:16px;margin-bottom:22px;border-bottom:1px solid var(--line);
  flex-wrap:wrap;gap:8px}
.node-url{font-size:13.5px;letter-spacing:1.8px;color:var(--acc);
  text-shadow:0 0 16px var(--acc)}

#nodeBack,#ghostBtn{font-size:11px;padding:7px 14px;letter-spacing:1.2px;
  border-color:var(--line);background:transparent;color:var(--mute)}
#nodeBack:hover,#ghostBtn:hover{color:var(--acc);border-color:var(--acc);
  background:#4ade800f;box-shadow:none;transform:none}

.node-meta{margin-bottom:16px}
.node-tag{display:inline-block;font-size:10.5px;letter-spacing:2.5px;
  padding:4px 10px;border:1px solid var(--line);border-radius:5px;color:var(--mute)}
.node-tag.acc{border-color:#4ade8044;color:var(--acc)}
.node-tag.err{border-color:#f8717144;color:var(--err)}

.log{background:#080a10;border:1px solid var(--line);border-radius:10px;
  padding:16px;margin-bottom:16px;display:flex;flex-direction:column;
  gap:8px;min-height:100px}
.log-line{font-size:12.5px;color:#a8b3c7;letter-spacing:.4px;line-height:1.8;
  word-break:break-all;white-space:pre-wrap}
.log-line::before{content:"> ";color:#4a5568}
.log-line.ok{color:var(--acc)}
.log-line.ok::before{color:#4ade8066}
.log-line.warn{color:var(--warn)}
.log-line.warn::before{color:#fbbf2466}
.log-line.typing::after{content:"▌";color:var(--acc);
  animation:blink .7s steps(2) infinite}

.sys-msg{font-size:12.5px;color:var(--dim);line-height:1.95;
  letter-spacing:.2px;padding:13px 15px;background:#ffffff04;
  border-left:2px solid var(--line);border-radius:0 6px 6px 0;margin-bottom:14px}
.sys-msg code{color:var(--acc2);background:#38bdf814;
  padding:1px 6px;border-radius:4px;font-size:12px}

.decoy-box{background:#080a10;border:1px solid #f8717133;
  border-radius:10px;padding:14px 16px;margin-bottom:14px;
  display:flex;align-items:center;justify-content:space-between;gap:12px}
.decoy-label{font-size:11px;color:#f87171;letter-spacing:2px}
.decoy-value{font-size:15px;letter-spacing:2px;color:#fca5a5;
  font-weight:600;user-select:all}

.hint-panel{background:#0a0f0a;border:1px solid #4ade8022;border-radius:10px;
  padding:13px 15px;margin-bottom:14px;font-size:12.5px;
  color:#a8b3c7;line-height:1.95}
.hint-panel::before{content:"◇ 线索 ";color:var(--acc);letter-spacing:2px}
.hint-panel code{color:var(--acc2);background:#38bdf814;
  padding:1px 6px;border-radius:4px;font-size:12px}
.hint-panel a{color:var(--acc2)}

.frag-box{background:#080a10;border:1px dashed #38bdf844;border-radius:10px;
  padding:16px;margin-bottom:14px;text-align:center}
.frag-label{font-size:10.5px;letter-spacing:2.5px;color:var(--mute);
  margin-bottom:8px}
.frag-value{font-size:19px;letter-spacing:4px;color:var(--acc2);
  font-weight:700;user-select:all;text-shadow:0 0 22px #38bdf855}

.win{text-align:center;padding:12px 0}
.win-icon{font-size:44px;margin-bottom:16px;
  filter:drop-shadow(0 0 24px #4ade8066);
  animation:pop .6s cubic-bezier(.2,1.6,.4,1)}
@keyframes pop{0%{transform:scale(.3);opacity:0}100%{transform:scale(1);opacity:1}}
.win h2{color:var(--acc);font-size:17px;letter-spacing:4px;
  margin-bottom:10px;text-shadow:0 0 30px #4ade8055}
.win .sub{margin-bottom:22px}

.key-box{background:#080a10;border:1px dashed #4ade8044;
  border-radius:11px;padding:20px;margin:20px 0}
.key-label{font-size:10.5px;letter-spacing:2.5px;color:var(--mute);
  margin-bottom:10px}
.key-value{font-size:16px;letter-spacing:3px;color:var(--acc);
  font-weight:700;word-break:break-all;
  text-shadow:0 0 24px #4ade8066;min-height:24px}

.win-stats{display:flex;justify-content:center;gap:16px;margin:20px 0;flex-wrap:wrap}
.stat{text-align:center;padding:12px 18px;background:#ffffff04;
  border:1px solid var(--line);border-radius:9px;min-width:92px}
.stat-val{font-size:18px;color:var(--acc2);font-weight:700;letter-spacing:1px}
.stat-label{font-size:10.5px;color:var(--mute);letter-spacing:1.5px;margin-top:5px}

.win-note{font-size:12.5px;color:var(--dim);line-height:2;
  letter-spacing:.3px;margin-top:16px}
.win-note code{color:var(--acc2);background:#38bdf812;
  padding:2px 6px;border-radius:4px;font-size:12px}

.footer{text-align:center;font-size:11px;letter-spacing:1.8px;
  color:var(--faint);margin-top:20px;user-select:none}

.map-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:14px;margin-top:22px}
.map-card{
  display:block;padding:18px;border:1px solid var(--line);border-radius:12px;
  background:linear-gradient(180deg,#0f121a,#0b0e14);text-decoration:none;
  color:inherit;transition:.3s cubic-bezier(.2,.8,.2,1);position:relative;
  overflow:hidden;
}
.map-card:hover{transform:translateY(-3px);box-shadow:0 20px 60px -30px var(--acc2);
  border-color:#38bdf855}
.map-card::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--acc2),transparent);
  opacity:0;transition:opacity .3s}
.map-card:hover::before{opacity:1}
.map-hd{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.map-id{font-size:14.5px;letter-spacing:3.5px;color:var(--acc2);font-weight:700}
.map-id.a{color:#4ade80}.map-id.b{color:#38bdf8}
.map-id.c{color:#c4b5fd}.map-id.d{color:#fbbf24}
.map-state{font-size:10.5px;letter-spacing:1.8px;color:var(--mute);
  border:1px solid var(--line);padding:3px 8px;border-radius:5px}
.map-host{font-size:11.5px;color:var(--dim);letter-spacing:.8px;word-break:break-all}
.map-desc{font-size:11.5px;color:var(--mute);line-height:1.85;margin-top:10px}
.map-id.n{color:#f87171}
.map-card.night{border-color:#f8717133}
.map-card.night::before{background:linear-gradient(90deg,transparent,#f87171,transparent)}
.map-card.night:hover{border-color:#f8717166;box-shadow:0 20px 60px -30px #f87171}

.chip-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px;justify-content:center}
.chip{font-size:11px;letter-spacing:1.2px;color:var(--mute);
  border:1px solid var(--line);border-radius:20px;padding:5px 12px}
.chip b{color:var(--acc2)}

::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-track{background:#0a0c11}
::-webkit-scrollbar-thumb{background:#2b3346;border-radius:5px}
::-webkit-scrollbar-thumb:hover{background:#3a4459}
::selection{background:#4ade8033;color:#e6ffed}

.fake-page{
  position:fixed;inset:0;background:#f5f5f5;color:#333;
  display:flex;align-items:center;justify-content:center;
  flex-direction:column;z-index:9999;font-family:Arial,sans-serif;
}
.fake-page h1{font-size:22px;color:#666;letter-spacing:0;margin-bottom:12px}
.fake-page p{color:#888;font-size:14px}

@media (max-width:520px){
  .card{padding:22px 16px}
  .field{flex-direction:column}
  .key-value{font-size:13px;letter-spacing:2px}
  .cipher{font-size:18px;letter-spacing:5px}
  .cipher.small{font-size:14px;letter-spacing:2px}
  .stage-desc{font-size:13px}
}