:root { color-scheme: dark; -webkit-text-size-adjust:100%; text-size-adjust:100%; --bg:#0b0d0f; --panel:#12161a; --line:#29313a; --text:#e8edf2; --muted:#94a0aa; --accent:#d5ff67; --danger:#ff6b6b; --blue:#7dd3fc; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; min-height:100svh; overflow-x:clip; padding-left:env(safe-area-inset-left); padding-right:env(safe-area-inset-right); background:radial-gradient(circle at 12% 8%,#192026 0,transparent 34%),var(--bg); color:var(--text); font:16px/1.55 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace; }
.shell { width:min(1040px,calc(100% - 40px)); margin:0 auto; padding:48px 0 28px; }
.shell > *,.lookup-row > * { min-width:0; }
.auth-page .shell { width:min(460px,calc(100% - 32px)); min-height:100vh; min-height:100svh; padding:32px 0; display:grid; place-items:center; }
.auth-page > footer { display:none; }
.panel { background:color-mix(in srgb,var(--panel) 94%,transparent); border:1px solid var(--line); border-radius:14px; padding:24px; box-shadow:0 16px 48px #0005; }
.auth-card { width:100%; padding:30px; }
.brand-lockup { min-width:0; }
.brand-title { margin:0; font-size:clamp(30px,4vw,40px); line-height:1.05; letter-spacing:.035em; }
.auth-intro { margin:0; }
.auth-section { margin:26px 0 22px; padding-top:22px; border-top:1px solid var(--line); }
.auth-title { margin:0 0 7px; font-size:20px; line-height:1.25; letter-spacing:-.015em; }
.auth-section .muted { margin:0; }
.auth-section .auth-note { margin-top:10px; }
.auth-card form { margin:0; }
.auth-card form button,.auth-action { width:100%; }
.auth-meta { display:flex; justify-content:space-between; gap:12px; margin-top:20px; padding-top:17px; border-top:1px solid var(--line); color:#697580; font-size:10px; line-height:1.4; }
h1,h2,p { margin-top:0; } h1 { margin-bottom:0; font-size:clamp(30px,4vw,42px); line-height:1.05; letter-spacing:-.045em; } h2 { font-size:19px; line-height:1.25; margin:0; }
.eyebrow { color:var(--accent); font-size:12px; letter-spacing:.16em; margin-bottom:10px; }
.environment-badge { display:inline-flex; align-items:center; min-height:26px; margin-bottom:12px; padding:5px 9px; border:1px solid #d5ff6755; border-radius:999px; color:var(--accent); background:#d5ff6709; font-size:11px; font-weight:700; line-height:1; letter-spacing:.13em; }
.muted { color:var(--muted); } .small { font-size:12px; margin:12px 0 0; }
label { display:block; color:#cbd5df; margin:22px 0 8px; }
input { width:100%; min-height:48px; -webkit-appearance:none; appearance:none; background:#090b0d; color:var(--text); border:1px solid #35404b; border-radius:9px; padding:13px 14px; font:inherit; font-size:16px; outline:none; }
input:focus { border-color:var(--accent); box-shadow:0 0 0 3px #d5ff6720; }
button,.button-link { display:inline-flex; justify-content:center; align-items:center; min-height:44px; border:0; border-radius:9px; background:var(--accent); color:#111; font:700 14px/1 ui-monospace,monospace; padding:14px 18px; cursor:pointer; text-decoration:none; }
.auth-card form button { margin-top:18px; } button:disabled { opacity:.55; cursor:wait; }
.ghost { color:var(--muted); background:transparent; border:1px solid var(--line); }
.danger { background:transparent; color:var(--danger); border:1px solid #ff6b6b66; padding:10px 12px; }
.notice { border-left:3px solid var(--accent); background:#d5ff670c; padding:12px 14px; margin:18px 0; color:#d8e3cb; }
.topbar { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:20px; margin-bottom:24px; }
.logout-form { margin:0; }
.logout-button { min-height:40px; padding:9px 13px; color:var(--muted); background:#0c0f12aa; border:1px solid var(--line); font-size:12px; font-weight:600; }
.logout-button:hover,.logout-button:focus-visible { color:var(--text); border-color:#56636f; outline:none; }
.lookup-row { display:grid; grid-template-columns:1fr auto; gap:10px; }
.results { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:16px; }
.result-context { display:flex; align-items:baseline; gap:10px; margin:18px 2px 0; min-width:0; }
.result-context span { color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.11em; }
.result-context strong { min-width:0; overflow-wrap:anywhere; color:var(--text); font-size:14px; }
.result-card header { display:flex; align-items:center; justify-content:space-between; gap:12px; border-bottom:1px solid var(--line); padding-bottom:16px; }
.badge { color:var(--muted); border:1px solid var(--line); border-radius:999px; padding:4px 9px; font-size:11px; }
.badge[data-outcome="found"] { color:var(--accent); border-color:#d5ff6755; }
.subscriptions { display:grid; gap:10px; margin-top:16px; }
.subscription { display:flex; align-items:center; justify-content:space-between; gap:12px; background:#0c0f12; border:1px solid #222a31; border-radius:9px; padding:12px; }
.subscription strong,.subscription span { display:block; } .subscription span { color:var(--muted); font-size:12px; margin-top:3px; }
.subscription span[data-active="true"] { color:var(--accent); }
.reset-button { width:100%; margin-top:6px; }
[hidden] { display:none !important; }
dialog { width:min(560px,calc(100% - 32px)); max-height:calc(100dvh - 24px); overflow:auto; padding:0; color:var(--text); background:transparent; border:0; }
dialog::backdrop { background:#020406cc; backdrop-filter:blur(5px); }
.modal-card { background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:24px; box-shadow:0 24px 80px #000b; }
.modal-header { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; border-bottom:1px solid var(--line); padding-bottom:16px; }
.modal-card > .muted { margin:18px 0 14px; }
.modal-items { display:grid; gap:10px; }
.modal-item { display:flex; justify-content:space-between; align-items:center; gap:16px; background:#0c0f12; border:1px solid #222a31; border-radius:9px; padding:13px 14px; }
.modal-item span { color:var(--muted); font-size:12px; text-align:right; }
.modal-item span[data-state="accepted"] { color:var(--accent); }
.modal-item span[data-state="failed"],.modal-item span[data-state="partial"] { color:var(--danger); }
.modal-item span[data-state="processing"] { color:var(--blue); }
.modal-progress { min-height:24px; margin:16px 0 0; color:var(--muted); font-size:12px; }
.modal-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:20px; }
.loading,.error { grid-column:1/-1; color:var(--muted); } .error { color:#ffaaaa; }
footer { text-align:center; color:#5d6872; font-size:11px; padding:16px; }
@media (max-width:700px) {
  body { font-size:15px; }
  .shell { width:calc(100% - 24px); padding:22px 0 20px; }
  .auth-page .shell { width:calc(100% - 24px); padding:20px 0; }
  .panel,.modal-card { padding:18px; border-radius:12px; }
  .auth-card { padding:24px 20px; }
  .brand-title { font-size:30px; }
  .auth-meta { flex-direction:column; gap:3px; }
  h1 { font-size:clamp(28px,9vw,34px); }
  .topbar { align-items:start; gap:12px; margin-bottom:18px; }
  .environment-badge { margin-bottom:10px; font-size:10px; }
  .logout-button { min-height:38px; padding:8px 11px; }
  .results { grid-template-columns:1fr; gap:12px; margin-top:12px; }
  .result-context { display:grid; gap:2px; margin:16px 2px 0; }
  .lookup-row { grid-template-columns:1fr; }
  .lookup-row button { width:100%; }
  .result-card header { padding-bottom:13px; }
  .subscription { padding:11px 12px; }
  dialog { width:calc(100% - 24px); }
  .modal-actions { display:grid; grid-template-columns:1fr; }
  .modal-actions button { width:100%; }
}