:root { --ink:#202022; --muted:#707075; --paper:#fffdf9; --line:#e7e1d8; --accent:#a85c4c; --accent-dark:#884334; --soft:#f7eee8; --ok:#267751; --warn:#a36a00; }
* { box-sizing:border-box; } body { margin:0; min-width:320px; color:var(--ink); background:#f5f2ed; font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; } .shell { max-width:1050px; margin:0 auto; padding:34px 22px 60px; } .brand-bar { display:flex; align-items:center; gap:14px; margin-bottom:28px; } .brand-bar img { width:47px; height:47px; object-fit:contain; border-radius:12px; } h1,h2,h3,p { margin-top:0; } h1 { font-size:24px; margin-bottom:0; } h2 { font-size:19px; margin-bottom:8px; } h3 { margin-bottom:5px; font-size:16px; } .eyebrow { color:var(--accent); letter-spacing:.12em; font-size:11px; font-weight:800; margin-bottom:6px; } .local-badge { margin-left:auto; color:var(--accent-dark); border:1px solid #dcaea3; border-radius:99px; padding:6px 9px; font-size:11px; font-weight:800; letter-spacing:.06em; } .card { background:var(--paper); border:1px solid var(--line); border-radius:18px; box-shadow:0 8px 28px rgba(77,55,35,.05); } .intro { display:flex; justify-content:space-between; gap:20px; padding:26px; margin-bottom:18px; } .intro p:last-child { color:var(--muted); margin-bottom:0; } .url-note { font-size:12px; max-width:300px; align-self:end; overflow-wrap:anywhere; } .layout { display:grid; grid-template-columns:1.3fr .9fr; gap:18px; margin-bottom:18px; } .form-card,.checklist,.batches { padding:25px; } label { display:block; font-size:13px; font-weight:700; margin:15px 0; } label span { font-weight:400; color:var(--muted); } input { display:block; width:100%; margin-top:7px; border:1px solid #d9d2c9; border-radius:10px; padding:11px 12px; font:inherit; background:#fff; } input:focus { outline:2px solid #ebc9bf; border-color:var(--accent); } button,.button-link { border:0; border-radius:10px; background:var(--accent); color:#fff; cursor:pointer; padding:11px 14px; font:700 13px inherit; text-decoration:none; display:inline-block; } button:hover,.button-link:hover { background:var(--accent-dark); } button:disabled { opacity:.65; cursor:wait; } .secondary { background:#f1e9e2; color:#67382f; } .secondary:hover { background:#e5d7cd; } .hint,.message,.checklist li { color:var(--muted); font-size:13px; line-height:1.55; } .message { min-height:20px; margin:12px 0 0; color:var(--accent-dark); font-weight:600; } .checklist ol { padding-left:21px; margin-bottom:0; } .checklist li { margin:10px 0; } .section-head { display:flex; justify-content:space-between; align-items:start; border-bottom:1px solid var(--line); padding-bottom:17px; } .section-head h2 { margin-bottom:0; } .batch-row { display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:18px; padding:18px 0; border-bottom:1px solid var(--line); } .batch-row:last-child { border-bottom:0; padding-bottom:0; } .batch-main p,.batch-status small { margin:0; color:var(--muted); font-size:12px; } .batch-status { display:grid; gap:7px; text-align:right; } .status { border-radius:999px; padding:5px 8px; font-size:11px; font-weight:800; background:#f1e5d5; color:#785528; } .status.active { background:#dff2e7; color:#1c6b46; } .batch-actions { display:flex; gap:8px; align-items:center; } .empty { color:var(--muted); margin:19px 0 0; } .verify-body { min-height:100vh; display:grid; place-items:center; background:radial-gradient(circle at top,#f5e4db,#f5f2ed 55%); } .verify-shell { width:min(100%,460px); text-align:center; padding:34px 22px; } .verify-logo { width:68px; height:68px; object-fit:contain; border-radius:18px; margin-bottom:14px; } .verify-shell h1 { font-size:28px; margin-bottom:22px; } .result-card { background:#fffdf9; border:1px solid var(--line); border-radius:20px; padding:29px 24px; box-shadow:0 12px 35px rgba(77,55,35,.1); } .result-card h2 { margin:12px 0 8px; } .result-card p { color:var(--muted); line-height:1.55; margin-bottom:0; } .result-icon { margin:auto; width:43px; height:43px; border-radius:50%; display:grid; place-items:center; font-size:26px; color:#fff; background:#858585; } .success .result-icon { background:var(--ok); } .warning .result-icon { background:var(--warn); } .error .result-icon { background:#bd4139; } dl { text-align:left; background:#faf7f3; border-radius:12px; padding:4px 13px; margin:20px 0 0; } dl div { display:flex; justify-content:space-between; gap:10px; border-bottom:1px solid var(--line); padding:10px 0; font-size:13px; } dl div:last-child { border:0; } dt { color:var(--muted); } dd { margin:0; font-weight:700; } .verify-help,.subtle-link { color:var(--muted); font-size:13px; line-height:1.55; display:block; margin:19px 0; } .subtle-link { color:var(--accent-dark); } .spinner { width:28px; height:28px; border:3px solid #eadbd3; border-top-color:var(--accent); border-radius:50%; margin:auto; animation:spin .8s linear infinite; } @keyframes spin { to { transform:rotate(360deg); } } @media (max-width:680px) { .shell { padding:20px 14px 36px; } .intro,.layout { display:block; } .intro > * + * { margin-top:17px; } .checklist { margin-top:18px; } .batch-row { grid-template-columns:1fr; gap:10px; } .batch-status { text-align:left; justify-items:start; } .batch-actions { margin-top:3px; } }