:root { --bg:#f4f4f7; --card:#fff; --ink:#111; --ink-2:#555; --line:#e3e3ea; --accent:#5235f0; --ok:#0b7a4b; }
@media (prefers-color-scheme: dark) {
  :root { --bg:#0c0c10; --card:#17171d; --ink:#f3f3f7; --ink-2:#b4b4c0; --line:#2b2b36; --accent:#8b76ff; --ok:#4fd79b; }
  .brand img { filter:invert(1); }
}
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; display:grid; place-items:start center; padding:40px 16px; background:var(--bg); color:var(--ink);
       font:16px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; }
.card { width:min(640px, 100%); background:var(--card); border:1px solid var(--line); border-radius:18px; padding:28px 28px 22px; }
.brand { display:block; max-width:300px; margin-bottom:18px; }
.brand img { width:100%; height:auto; display:block; }
h1 { font-size:24px; line-height:1.25; margin:6px 0 14px; }
.order { margin:0; color:var(--ink-2); font-weight:600; }
.mono { font-family:ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing:.02em; }
.muted { color:var(--ink-2); } .small { font-size:13px; }
.btn { display:inline-block; appearance:none; border:0; border-radius:10px; padding:10px 16px; background:var(--accent); color:#fff; font:600 15px inherit; text-decoration:none; cursor:pointer; }
.find label { display:block; font-weight:600; margin-bottom:6px; }
.find .row { display:flex; gap:8px; }
.find input { flex:1; min-width:0; height:44px; padding:0 12px; border-radius:10px; border:1px solid var(--line); background:transparent; color:inherit; font:15px ui-monospace, Menlo, monospace; }
.scans { width:100%; border-collapse:collapse; margin:6px 0 12px; font-size:14px; }
.scans th, .scans td { text-align:left; padding:8px 6px; border-bottom:1px solid var(--line); vertical-align:top; }
.scans th { color:var(--ink-2); font-weight:600; }
@media (max-width:520px) { .card { padding:20px 16px; } h1 { font-size:21px; } .scans { font-size:13px; } }