:root { --ink:#17212b; --muted:#667085; --line:#dbe2ea; --surface:#fff; --soft:#f6f8fb; --brand:#1267e8; --brand-dark:#0b4fb9; --danger:#b42318; --warning:#9a5b00; --success:#067647; }
* { box-sizing:border-box; } body { margin:0; color:var(--ink); background:var(--soft); font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height:1.45; } a { color:var(--brand-dark); text-decoration:none; } a:hover { text-decoration:underline; } .topbar { min-height:66px; background:#0d1f3a; color:#fff; display:flex; align-items:center; gap:34px; padding:0 max(24px, calc((100vw - 1180px)/2)); } .brand { color:#fff; font-weight:800; letter-spacing:-.02em; font-size:1.1rem; } .topbar nav { display:flex; gap:20px; } .topbar nav a { color:#c6d4ec; } .account { margin-left:auto; display:flex; align-items:center; gap:16px; color:#c6d4ec; font-size:.9rem; } .account form { margin:0; } .link-button { border:0; background:transparent; color:#fff; cursor:pointer; font:inherit; padding:5px; } .container { width:min(1120px, calc(100% - 36px)); margin:0 auto; padding:40px 0 64px; } h1,h2,h3,p { margin-top:0; } h1 { font-size:clamp(1.8rem, 3vw, 2.55rem); letter-spacing:-.04em; line-height:1.12; margin-bottom:12px; } h2 { font-size:1.28rem; letter-spacing:-.02em; margin-bottom:4px; } h3 { font-size:1rem; margin:14px 0 8px; } p { color:var(--muted); } .eyebrow { color:var(--brand); font-size:.72rem; letter-spacing:.1em; font-weight:800; margin-bottom:10px; } .hero { display:flex; justify-content:space-between; gap:35px; padding:24px 0 34px; } .hero > div:first-child { max-width:650px; } .stats { min-width:235px; display:grid; grid-template-columns:auto 1fr; align-content:center; column-gap:12px; row-gap:3px; padding:18px 22px; background:#eaf2ff; border-radius:14px; } .stats strong { color:var(--brand-dark); font-size:1.15rem; } .stats span { color:#46566d; font-size:.86rem; } section { margin-bottom:38px; } .section-title { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:15px; } .section-title p { margin:0; } .card-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:14px; } .card-grid.compact { grid-template-columns:repeat(3, minmax(0, 1fr)); } .product-card { display:block; min-height:180px; background:var(--surface); border:1px solid var(--line); border-radius:13px; padding:20px; color:var(--ink); transition:.16s ease; } .product-card:hover { text-decoration:none; transform:translateY(-2px); border-color:#a9c9ff; box-shadow:0 10px 24px #1018280d; } .product-card p { font-size:.9rem; min-height:52px; margin-bottom:12px; } .product-card small { color:var(--brand-dark); font-weight:700; } .card-icon { display:grid; place-items:center; height:31px; width:31px; background:#eaf2ff; color:var(--brand); border-radius:8px; font-weight:900; } .tag-list { display:flex; flex-wrap:wrap; gap:10px; } .tag-list span { background:#edf1f5; color:#48586d; padding:9px 12px; border-radius:20px; font-size:.88rem; } .login-card { width:min(440px, 100%); margin:9vh auto; background:#fff; padding:38px; border:1px solid var(--line); border-radius:16px; box-shadow:0 16px 50px #10182812; } .login-card > p { margin-bottom:28px; } .form-stack, .query-form { display:grid; gap:18px; } label { display:grid; gap:7px; color:#344054; font-size:.9rem; font-weight:650; } input, textarea { width:100%; border:1px solid #cdd5df; border-radius:8px; font:inherit; padding:11px 12px; color:var(--ink); background:#fff; } input:focus, textarea:focus { outline:3px solid #cce0ff; border-color:var(--brand); } textarea { min-height:84px; resize:vertical; } button.primary { width:max-content; min-width:150px; border:0; border-radius:8px; background:var(--brand); color:#fff; padding:12px 18px; font:700 .95rem inherit; cursor:pointer; } button.primary:hover { background:var(--brand-dark); } .form-page { max-width:670px; } .query-form { margin-top:27px; background:#fff; padding:26px; border:1px solid var(--line); border-radius:13px; } .cost-box { border-left:4px solid var(--brand); border-radius:5px; background:#edf4ff; padding:13px 15px; } .cost-box div { display:flex; justify-content:space-between; gap:15px; color:#304561; } .cost-box strong { color:var(--brand-dark); } .cost-box p { font-size:.84rem; margin:8px 0 0; } .check { display:flex; grid-template-columns:auto 1fr; align-items:start; gap:10px; font-weight:500; } .check input { width:auto; margin-top:4px; } .back { display:inline-block; margin-bottom:22px; font-size:.9rem; } .warning, .notice, .error { border-radius:9px; padding:13px 15px; margin-bottom:20px; } .warning { background:#fff5db; color:#754600; border:1px solid #f8d78b; } .notice { background:#ecfdf3; color:#05603a; border:1px solid #a6f4c5; } .error { background:#fef3f2; color:var(--danger); border:1px solid #fecdca; } .table-wrap { overflow:auto; background:#fff; border:1px solid var(--line); border-radius:12px; } table { border-collapse:collapse; width:100%; min-width:740px; font-size:.87rem; } th,td { padding:13px 14px; text-align:left; border-bottom:1px solid #eaecf0; vertical-align:top; } th { color:#667085; background:#f9fafb; font-size:.75rem; text-transform:uppercase; letter-spacing:.04em; } tr:last-child td { border-bottom:0; } .empty { color:var(--muted); text-align:center; padding:32px; } .status { display:inline-block; border-radius:999px; padding:3px 8px; font-size:.75rem; font-weight:700; text-transform:capitalize; background:#eef2f6; color:#475467; } .status.probusca { background:#fff0c7; color:#8a4b00; } .status.cache { background:#e0efff; color:#175cd3; } .status.base_local { background:#dff7e9; color:#067647; } .result-head { display:flex; justify-content:space-between; gap:20px; align-items:flex-start; } .result-meta { display:flex; align-items:center; gap:12px; white-space:nowrap; } .result-card, .audit-card { padding:25px; border-radius:13px; background:#fff; border:1px solid var(--line); } .result-list { margin:0; } .result-list > div { display:grid; grid-template-columns:minmax(150px, 28%) 1fr; gap:15px; padding:11px 0; border-bottom:1px solid #eaecf0; } .result-list > div:last-child { border-bottom:0; } dt { color:#667085; font-size:.86rem; } dd { margin:0; overflow-wrap:anywhere; } ul { padding-left:18px; margin:7px 0; } li { margin:4px 0; } details summary { cursor:pointer; color:var(--brand-dark); } .audit-card { background:#f8fafc; } .audit-card p { margin:6px 0 10px; color:#344054; } .audit-card small { color:#667085; } .page-heading { margin-bottom:22px; } .muted { color:#98a2b3; } @media (max-width:760px) { .topbar { padding:0 18px; gap:15px; } .topbar nav { display:none; } .account span { display:none; } .container { width:min(100% - 28px, 1120px); padding-top:27px; } .hero, .result-head { display:block; } .stats { margin-top:20px; } .card-grid, .card-grid.compact { grid-template-columns:1fr; } .product-card { min-height:0; } .product-card p { min-height:0; } .section-title { display:block; } .section-title p { margin-top:4px; } .result-meta { margin-top:12px; } .result-list > div { grid-template-columns:1fr; gap:4px; } }