html,body{background:#16233A;min-height:100%}
body{padding:env(safe-area-inset-top,0) 0 env(safe-area-inset-bottom,0)}
.ahead,.chead{display:flex;align-items:center;gap:.5rem;font-weight:700;color:#fff;padding:1rem 1.2rem}
.ahead svg,.chead svg{width:26px;height:26px}
.abox{background:#fff;margin:0 1rem;border-radius:14px;padding:1.4rem}
.abox h1{font-size:1.35rem}
#aCode{font-size:1.6rem;letter-spacing:.18em;text-align:center;font-weight:700;text-transform:uppercase}
.idcard{background:#fff;margin:1rem;border-radius:16px;overflow:hidden;max-width:440px;margin-left:auto;margin-right:auto}
.chead{background:var(--brand);font-size:.95rem}
.cstatus{background:var(--bad);color:#fff;font-weight:700;padding:.7rem 1.2rem}
.cbody{display:flex;gap:1rem;padding:1rem 1.2rem .4rem;align-items:center}
.cphoto{width:96px;aspect-ratio:3/4;border-radius:8px;background:#E6EAF0 center/cover no-repeat;flex:none;border:1px solid var(--line)}
.cname{font-size:1.45rem;font-weight:800;line-height:1.15}
.cklass{font-size:1.15rem;font-weight:700;color:var(--brand);margin-top:.2rem}
.clabel{font-size:.8rem;color:var(--ink2);margin-top:.4rem}
.qrwrap{position:relative;margin:.6rem auto 0;width:min(72vw,300px);aspect-ratio:1;overflow:hidden;border-radius:8px}
#qr svg{width:100%;height:100%;display:block}
.live{position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 40%,rgba(31,78,140,.13) 50%,transparent 60%);
  background-size:250% 100%;animation:sweep 2.2s linear infinite}
@keyframes sweep{from{background-position:120% 0}to{background-position:-120% 0}}
.timer{height:6px;background:#E6EAF0;margin:.8rem 1.2rem 0;border-radius:3px;overflow:hidden}
.bar{height:100%;background:var(--brand);width:100%;transition:width 1s linear}
.clock{text-align:center;font-size:2.2rem;font-weight:800;font-variant-numeric:tabular-nums;margin-top:.4rem;color:var(--ink)}
.hint{text-align:center;color:var(--ink2);font-size:.85rem;padding:0 1.2rem 1.2rem;margin:.2rem 0 0}
.ufoot{display:flex;justify-content:space-between;align-items:center;max-width:440px;margin:0 auto;padding:0 1rem 1.5rem}
.ufoot .btn{color:#C9D3E2;border-color:#4A5D7E}
.ufoot .muted{color:#9FB0C8}
.blocked .qrwrap,.blocked .timer{opacity:.12;filter:grayscale(1)}