/* CLOQ pixel-art shared styles for /lk/* pages */
/* JetBrains Mono — tech monospace font with full Cyrillic + Latin support */
@font-face{font-family:'CLOQ Mono';font-style:normal;font-weight:700;font-display:swap;
  src:url('/landing/fonts/jbm-cyrillic.woff2') format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'CLOQ Mono';font-style:normal;font-weight:700;font-display:swap;
  src:url('/landing/fonts/jbm-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
body{font-weight:700;letter-spacing:0.5px}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
body{background:#0a0a18;color:#e0e0e0;font-family:'CLOQ Mono', monospace;
  min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
  padding:30px 16px;image-rendering:pixelated;position:relative;overflow-x:hidden}
.stars{position:fixed;inset:0;z-index:0}
.star{position:absolute;width:2px;height:2px;background:#fff}
@keyframes blink{0%,100%{opacity:.1}50%{opacity:.7}}
.scanline{position:fixed;inset:0;z-index:2;pointer-events:none;
  background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.04) 2px,rgba(0,0,0,.04) 4px)}
.card{position:relative;z-index:1;width:100%;max-width:440px;
  background:linear-gradient(180deg,#10102a 0%,#0e0e22 100%);
  border:3px solid #2a3a5a;padding:32px 24px 28px;text-align:center;
  box-shadow:0 0 60px rgba(123,158,194,.06),inset 0 0 80px rgba(123,158,194,.02)}
.pixel-bar-top{height:6px;margin:-32px -24px 0;
  background:repeating-linear-gradient(90deg,#3a5a8a 0,#3a5a8a 4px,transparent 4px,transparent 8px);opacity:.5}
.pixel-bar-bot{height:6px;margin:24px -24px -28px;
  background:repeating-linear-gradient(90deg,#3a5a8a 0,#3a5a8a 4px,transparent 4px,transparent 8px);opacity:.5}
.ghost-canvas{width:100%;height:130px;position:relative;overflow:hidden;margin:18px 0 6px}
.ghost-canvas canvas{display:block;margin:0 auto;image-rendering:pixelated}
h1{font-size:22px;color:#9bbed8;margin:6px 0 4px;letter-spacing:5px;
  text-shadow:0 0 20px rgba(123,158,194,.5),0 2px 0 #1a1a3a}
.pixel-dots{display:flex;justify-content:center;gap:10px;margin:8px 0 4px}
.pixel-dots span{width:4px;height:4px;background:#3a5a8a;display:inline-block}
.sub{font-size:10px;color:#6a7a9a;margin-bottom:18px;line-height:1.6;letter-spacing:1px}
.sect-label{font-size:10px;color:#3a5a8a;margin:18px 0 12px;letter-spacing:2px}
.field{text-align:left;margin-bottom:14px}
.label{font-size:10px;color:#5a6a8a;margin-bottom:6px;letter-spacing:1px;display:block}
.input{width:100%;padding:14px 12px;background:#0a0a18;border:2px solid #2a3a5a;
  color:#aab8d0;font-family:'CLOQ Mono', monospace;font-size:13px;outline:none;
  transition:all .15s}
.input:focus{border-color:#5a8ab8;box-shadow:0 0 12px rgba(123,158,194,.25)}
.input::placeholder{color:#3a4a6a}
.btn{display:block;width:100%;padding:14px;margin-bottom:6px;
  background:#141430;border:2px solid #2a3a5a;color:#aab8d0;font-family:'CLOQ Mono', monospace;
  font-size:13px;text-decoration:none;text-align:center;cursor:pointer;
  transition:all .15s;position:relative;overflow:hidden}
.btn:hover{background:#1e2048;border-color:#7b9ec2;color:#fff;
  box-shadow:0 0 16px rgba(123,158,194,.25)}
.btn:active{transform:scale(.97)}
.btn-primary{background:linear-gradient(180deg,#5a8ab8 0%,#4a7aaa 100%);
  border:2px solid #7baed2;color:#fff;font-size:14px;
  box-shadow:0 0 20px rgba(123,158,194,.35),0 4px 0 #3a6a92;margin-top:8px}
.btn-primary:hover{background:linear-gradient(180deg,#6a9ac8 0%,#5a8ab8 100%)}
.btn-tg{background:linear-gradient(180deg,#3a8ab8 0%,#2a7aa8 100%);
  border:2px solid #5b9ec2;color:#fff;box-shadow:0 0 16px rgba(58,138,184,.3),0 4px 0 #1a5a82;margin-top:6px}
.btn-danger{background:linear-gradient(180deg,#8a3a3a 0%,#7a2a2a 100%);
  border:2px solid #c25b5b;color:#fff;box-shadow:0 0 16px rgba(184,58,58,.3),0 4px 0 #5a1010}
.divider{font-size:10px;color:#3a4a6a;margin:14px 0 8px;letter-spacing:1px;text-align:center}
.divider::before,.divider::after{content:'';display:inline-block;width:30%;height:2px;background:#2a3a5a;vertical-align:middle;margin:0 8px}
.btn-icon{display:inline-block;margin-right:6px}
.links{display:flex;justify-content:space-between;margin-top:14px;gap:10px;flex-wrap:wrap}
.links a{font-size:10px;color:#5a8ab8;text-decoration:none;letter-spacing:.5px;transition:color .15s}
.links a:hover{color:#9bbed8}
.error{display:none;background:#3a1010;border:2px solid #6a2020;color:#ffaaaa;
  font-size:10px;padding:10px;margin-bottom:14px;letter-spacing:.5px;line-height:1.6}
.error.show{display:block}
.toast{position:fixed;top:16px;left:50%;transform:translateX(-50%);
  background:#22c55e;border:2px solid #4ade80;color:#000;padding:10px 18px;
  font-family:'CLOQ Mono', monospace;font-size:11px;opacity:0;transition:opacity .3s;
  pointer-events:none;z-index:100;white-space:nowrap}
.toast.show{opacity:1}
.info-box{background:#0e1024;border:2px solid #1e2a44;padding:14px 12px;margin-bottom:10px;text-align:left}
.info-row{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px;font-size:11px;flex-wrap:wrap}
.info-row:last-child{margin-bottom:0}
.info-key{color:#5a6a8a;letter-spacing:.5px;font-size:10px}
.info-val{color:#aab8d0;text-align:right;word-break:break-all}
.status-active{color:#4ade80}
.status-expired{color:#f87171}
.status-frozen{color:#fbbf24}
.sub-url-box{background:#06060f;border:2px solid #2a3a5a;padding:10px;font-size:10px;
  color:#7b9ec2;word-break:break-all;line-height:1.6;cursor:pointer;margin-bottom:10px;
  transition:all .15s;text-align:left}
.sub-url-box:hover{border-color:#5a8ab8;color:#9bbed8}
.qr-box{background:#fff;padding:14px;display:none;margin:10px auto;width:fit-content}
.qr-box.show{display:block}
.qr-box img,.qr-box canvas{display:block;width:200px;height:200px;image-rendering:pixelated}
@media(max-width:480px){
  .card{padding:24px 18px 24px}
  h1{font-size:18px;letter-spacing:3px}
  .pixel-bar-top{margin:-24px -18px 0}
  .pixel-bar-bot{margin:18px -18px -24px}
}