* { box-sizing: border-box; }
body { margin: 0; font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; background: #f4f6f8; color: #1b2430; }
.wrap { max-width: 1100px; margin: 0 auto; padding: 0 20px; }
header { background: #10233f; color: #fff; padding: 36px 0 28px; }
header h1 { margin: 0 0 6px; font-size: 30px; }
.tagline { margin: 0 0 10px; font-size: 17px; color: #c9d6ea; }
.privacy { margin: 0; font-size: 14px; color: #8fd6a4; font-weight: 600; }
main { padding: 24px 0 40px; }
.card { background: #fff; border: 1px solid #dde3ea; border-radius: 10px; padding: 22px 24px; margin-bottom: 22px; }
.card h2 { margin: 0 0 10px; font-size: 20px; }
.hint { color: #5a6675; font-size: 14px; margin: 0 0 14px; }
.hidden { display: none; }
.load-grid, .map-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 14px; }
@media (max-width: 800px) { .load-grid, .map-grid { grid-template-columns: 1fr; } }
.filebox { border: 2px dashed #b9c4d2; border-radius: 8px; padding: 16px; }
.filebox h3 { margin: 0 0 10px; font-size: 15px; }
.file-meta { font-size: 13px; color: #33404f; margin-top: 8px; }
.file-opts { margin-top: 8px; font-size: 13px; }
.file-opts label { margin-right: 14px; }
.btn { background: #1d5fd1; color: #fff; border: 0; border-radius: 7px; padding: 10px 18px; font-size: 15px; font-weight: 600; cursor: pointer; margin: 4px 8px 4px 0; }
.btn:disabled { background: #9db4d4; cursor: not-allowed; }
.btn.secondary { background: #e8eef7; color: #14315e; }
.btn.small { padding: 4px 10px; font-size: 12.5px; margin: 2px 4px 2px 0; }
.settings-row { display: flex; gap: 22px; flex-wrap: wrap; margin: 12px 0 16px; font-size: 14px; }
.settings-row label { display: flex; flex-direction: column; gap: 4px; font-weight: 600; }
select, input[type="text"] { padding: 6px 8px; border: 1px solid #b9c4d2; border-radius: 6px; font-size: 14px; background: #fff; }
table { border-collapse: collapse; width: 100%; font-size: 13px; }
th, td { border: 1px solid #dde3ea; padding: 6px 8px; text-align: left; vertical-align: top; }
th { background: #eef2f7; position: sticky; top: 0; }
tr.price-up td.status { background: #fde2e2; color: #8f1d1d; font-weight: 700; }
tr.price-down td.status { background: #def3e2; color: #166534; font-weight: 700; }
tr.pack-change td { background: #fff7dd; }
tr.new-sku td.status { background: #e0eafd; color: #1d3fae; font-weight: 700; }
tr.disc td.status { background: #eee; color: #444; font-weight: 700; }
tr.unresolved td.status { background: #fdeacc; color: #8a5a00; font-weight: 700; }
.summary-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.chip { border-radius: 999px; padding: 6px 14px; font-size: 13.5px; font-weight: 700; background: #eef2f7; }
.chip.warn { background: #fdeacc; }
.chip.bad { background: #fde2e2; }
.chip.good { background: #def3e2; }
.panel { border: 1px solid #e5c07b; background: #fffaf0; border-radius: 8px; padding: 14px 16px; margin-bottom: 14px; }
.panel.bad { border-color: #e58a8a; background: #fff4f4; }
.panel h3 { margin: 0 0 8px; font-size: 15px; }
.panel .row-item { padding: 8px 0; border-top: 1px solid #eee2cd; font-size: 13.5px; }
.panel .row-item:first-of-type { border-top: 0; }
.filters { margin: 10px 0; }
.filters button { margin-right: 6px; }
.filters button.active { outline: 2px solid #1d5fd1; }
.table-scroll { max-height: 480px; overflow: auto; border: 1px solid #dde3ea; border-radius: 8px; }
.export-ok { color: #166534; font-weight: 700; }
.export-blocked { color: #8f1d1d; font-weight: 700; }
.scope ul { font-size: 14px; line-height: 1.55; }
footer { border-top: 1px solid #dde3ea; padding: 16px 0 30px; color: #5a6675; font-size: 12.5px; }
.saved-note { font-size: 12.5px; color: #166534; margin-top: 6px; }
.issues-flag { color: #8a5a00; font-size: 12px; }