:root{
  --bg:#0d1117;--panel:#161b22;--border:#30363d;--border2:#21262d;--fg:#e6edf3;--txt:#c9d1d9;
  --dim:#8b949e;--faint:#6e7781;--green:#3fb950;--red:#ff7b72;--gold:#e3b341;--blue:#58a6ff;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--fg);font-family:"SF Mono",ui-monospace,Menlo,"D2Coding",monospace}
body{padding:16px;display:flex;justify-content:center}
.wrap{width:100%;max-width:600px}
.term{border:1px solid var(--border);border-radius:14px;background:var(--panel);overflow:hidden;box-shadow:0 8px 28px rgba(0,0,0,.4)}
.bar{display:flex;align-items:center;gap:7px;padding:11px 14px;border-bottom:1px solid var(--border);background:#0b0f14}
.dot{width:11px;height:11px;border-radius:50%}.r{background:#ff5f56}.y{background:#ffbd2e}.g{background:#27c93f}
.bar .t{margin-left:8px;color:var(--faint);font-size:13px}
.body{padding:20px 18px 26px}
h1{font-size:21px;margin:2px 0 4px}
.sub{color:var(--dim);font-size:13px;margin:0 0 16px;line-height:1.6}

.pwwrap{position:relative;margin-bottom:8px}
#pw{width:100%;min-height:80px;background:#0b0f14;border:1px solid var(--border);color:var(--fg);
  border-radius:10px;padding:14px;font:inherit;font-size:17px;resize:vertical;line-height:1.5;word-break:break-all}
#pw:focus{outline:none;border-color:var(--green)}
.meta{display:flex;justify-content:space-between;align-items:center;color:var(--dim);font-size:12.5px;margin:4px 2px 12px}
.pbar{flex:1;height:5px;background:var(--border2);border-radius:3px;margin-left:10px;overflow:hidden}
.pbar>i{display:block;height:100%;background:var(--green);width:7%;transition:width .4s}

.loadg{text-align:center;color:var(--gold);font-size:15px;padding:40px 10px;animation:pop .3s}
#rules{display:flex;flex-direction:column;gap:8px}
.rule{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--border);border-radius:10px;
  padding:12px 13px;background:#0b0f14;font-size:14px;line-height:1.5;animation:pop .25s}
.rule.ok{border-color:rgba(63,185,80,.5);background:rgba(63,185,80,.07)}
.rule.no{border-color:rgba(255,123,114,.45)}
.rule.chk{border-color:rgba(227,179,65,.45)}
.rule .ric{font-size:16px;flex:0 0 auto;line-height:1.4}
.rule .rtx{color:var(--txt)}
.rule .rtx b{color:var(--fg)}
.ok{color:var(--green)}.no{color:var(--red)}.chk{color:var(--gold)}
@keyframes pop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

.win{text-align:center;animation:pop .4s}
.win .trophy{font-size:60px}
.win .wt{font-size:28px;font-weight:900;color:var(--green);margin-top:4px}
.win .ws{color:var(--dim);font-size:14px;margin-top:8px}
.win .ws b{color:var(--fg)}
.win .wc{color:var(--gold);font-size:15px;margin:14px 0;font-style:italic}
.pwbox{background:#0b0f14;border:1px dashed var(--border);border-radius:10px;padding:13px;font-size:14px;
  color:var(--txt);word-break:break-all;line-height:1.6;max-height:160px;overflow:auto;text-align:left}
.share{display:flex;gap:9px;margin-top:20px}
.share button{flex:1;background:#0b0f14;border:1px solid var(--border);color:var(--fg);border-radius:10px;padding:13px;font:inherit;font-size:14px;cursor:pointer}
.share .prime{border-color:var(--green);color:var(--green);font-weight:700}
.foot{color:var(--faint);font-size:12px;text-align:center;margin-top:16px;line-height:1.7}
.hidden{display:none}
a{color:var(--blue)}