* { box-sizing: border-box; }
:root {
  --cc-blue-1: #18274B;
  --cc-blue-2: #18274B;
  --cc-blue-3: #18274B;
  --cc-white: #ffffff;
  --cc-text: #0f172a;
  --cc-muted: #5b667a;
  --cc-border: #d9e2f3;
  --cc-shadow: 0 10px 24px rgba(24, 39, 75, 0.14);
}
html, body { overflow-x: hidden; max-width: 100%; }
body { margin: 0; padding-top: 84px; font-family: Inter, Roboto, "SF Pro Text", "Helvetica Neue", "Segoe UI", Arial, sans-serif; background: #F3F5F8; color: #111827; -webkit-text-size-adjust: 100%; }
.container { max-width: 1360px; margin: 0 auto; padding: 0 20px 32px; background: transparent; }
.app-nav { display:flex; justify-content:space-between; align-items:center; position: fixed; top: 0; left: 0; right: 0; z-index: 120; width: 100%; margin: 0; padding: 12px 20px; gap: 10px; background: rgba(24,39,75,.96); backdrop-filter: blur(12px); box-shadow: 0 8px 24px rgba(15,23,42,.12); overflow: visible; box-sizing: border-box; min-height: 68px; }
.brand { display: inline-flex; align-items: center; justify-content: flex-start; white-space: nowrap; text-decoration: none; flex: 0 0 auto; width: 56px; min-width: 56px; max-width: 56px; overflow: visible; margin-left: -14px; }
.brand-logo { display:block; width: 56px; max-width: 56px; height: 56px; max-height: 56px; object-fit: contain; object-position: center center; background: transparent; }
.nav-actions { display:flex; align-items:center; gap:10px; margin-left:auto; flex: 0 0 auto; min-width: max-content; position: relative; z-index: 130; }
.site-basket-toggle { border:1px solid rgba(255,255,255,.35); background:#fff; color:#18274B; border-radius:999px; padding:8px 12px; font-weight:800; box-shadow:none; }
.site-basket-toggle span { display:inline-grid; place-items:center; min-width:22px; height:22px; margin-left:6px; padding:0 6px; border-radius:999px; background:#18274B; color:#fff; font-size:12px; }
.site-basket-drawer { position:fixed; top:76px; right:18px; width:min(420px, calc(100vw - 28px)); max-height:calc(100vh - 96px); overflow:auto; z-index:180; background:#fff; border:1px solid var(--cc-border); border-radius:18px; box-shadow:0 24px 70px rgba(15,23,42,.24); padding:16px; }
.site-basket-head { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }
.site-basket-head h2 { margin:0; }
.site-basket-body { display:grid; gap:12px; margin:12px 0; }
.site-basket-store { border:1px solid #e2e8f0; border-radius:14px; padding:12px; background:#f8fafc; }
.site-basket-store h3 { margin:0; font-size:16px; }
.site-basket-store p { margin:4px 0 0; color:#64748b; font-size:13px; }
.site-basket-store-head { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; margin-bottom:10px; }
.site-basket-store ul { margin:0 0 10px; padding:0; list-style:none; display:grid; gap:8px; }
.site-basket-store li { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; font-size:14px; padding:8px; border-radius:10px; background:#fff; border:1px solid #e8eef7; }
.site-basket-store li strong { display:block; line-height:1.25; }
.site-basket-store li span { display:block; margin-top:3px; color:#64748b; font-size:12px; }
.site-basket-foot { display:flex; gap:10px; position:sticky; bottom:0; background:#fff; padding-top:10px; }
.basket-select-line { display:flex; align-items:center; gap:8px; margin:10px 0; font-weight:700; color:#18274B; }
.primary-link-button { display:inline-flex; align-items:center; justify-content:center; padding:10px 14px; border-radius:10px; background:#18274B; color:#fff; text-decoration:none; font-weight:800; }
.primary-mini { border:0; border-radius:999px; padding:7px 10px; background:#18274B; color:#fff; font-weight:800; font-size:12px; white-space:nowrap; }
.nav-link { color:#ffffff; text-decoration:none; padding:8px 6px; line-height:1; white-space: nowrap; display:inline-flex; align-items:center; height:34px; }
.nav-cta { color:#2f5fd6; background:#fff; border-radius:999px; padding:8px 14px; text-decoration:none; font-weight:700; line-height:1; white-space: nowrap; display:inline-flex; align-items:center; height:34px; }
.nav-menu { position: relative; top: 2px; }
.nav-menu summary { list-style:none; cursor:pointer; width:34px; height:34px; display:grid; place-items:center; padding:0; border:0; background: transparent; }
.nav-menu summary::-webkit-details-marker { display:none; }
.burger { width: 22px; height: 16px; position: relative; display: inline-block; }
.burger span { position:absolute; left:0; width:100%; height:3px; background:#ffffff; border-radius:4px; transition: transform .22s ease, opacity .18s ease, top .22s ease; }
.burger span:nth-child(1){ top:0; }
.burger span:nth-child(2){ top:6px; }
.burger span:nth-child(3){ top:12px; }
.nav-menu[open] .burger span:nth-child(1){ top:6px; transform: rotate(45deg); }
.nav-menu[open] .burger span:nth-child(2){ opacity:0; }
.nav-menu[open] .burger span:nth-child(3){ top:6px; transform: rotate(-45deg); }
.menu-panel { position:absolute; right:0; top:42px; min-width:220px; display:grid; gap:4px; padding:8px; border:1px solid var(--cc-border); border-radius:10px; background:#ffffff; z-index:200; box-shadow: var(--cc-shadow); opacity:0; transform: translateY(-6px); pointer-events:none; transition: opacity .22s ease, transform .22s ease; }
.nav-menu[open] .menu-panel { opacity:1; transform: translateY(0); pointer-events:auto; }
.menu-panel a { color:#1e293b; text-decoration:none; padding:8px 10px; border-radius:8px; }
.menu-panel a:hover { background: #eef2ff; }
.hero { display:none; }
.status-badge { display:none; }
.journey-switch {
  display: flex;
  gap: 10px;
  margin: 8px 0 14px;
  padding: 4px;
  background:#E8EDF5;
  border-radius:999px;
  width:fit-content;
}
.journey-pill {
  border: 0;
  background: transparent;
  color: #475569;
  border-radius: 999px;
  padding: 10px 16px;
  font-size: 14px;
  line-height: 1;
  white-space: nowrap;
  box-shadow: none;
}
.journey-pill.active {
  background: #ffffff;
  color: #18274b;
  box-shadow: 0 2px 10px rgba(15,23,42,.08);
}
.journey-intro {
  display:none;
}
.top-filter-bar {
  position: sticky;
  top: 84px;
  z-index: 90;
  margin: 0 0 16px;
  padding: 6px 0 12px;
  display: flex;
  gap: 8px;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  background: linear-gradient(180deg, #F3F5F8 0%, #F3F5F8 72%, rgba(243,245,248,0) 100%);
}
.store-type-pill {
  border: 1px solid #D7DEEA;
  background: #fff;
  color: #334155;
  border-radius: 999px;
  padding: 10px 14px;
  font-size: 14px;
  line-height: 1;
  white-space: nowrap;
  box-shadow:none;
}
.store-type-pill.active {
  background: #18274b;
  border-color: #18274b;
  color: #fff;
}
h1, h2 { margin: 0 0 10px; }
section { margin-top: 16px; padding: 14px; border: 1px solid var(--cc-border); border-radius: 14px; background: #ffffff; box-shadow: var(--cc-shadow); }
.muted { color: var(--cc-muted); margin-top: 0; }
.search-row { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.search-row-clean { align-items: stretch; margin-bottom: 18px; }
#searchForm { scroll-margin-top: 110px; }
.planner-row { display: grid; grid-template-columns: 1fr !important; gap: 10px; margin-top: 10px; padding: 12px; border: 1px solid var(--cc-border); border-radius: 12px; background: #ffffff; box-shadow: var(--cc-shadow); }
.planner-row label { display: block; color: #475569; font-size: 13px; width: 100%; }
.planner-row select { display: block; width: 100%; margin-top: 6px; }
input[type="text"], textarea, select { flex: 1; min-width: 220px; padding: 10px 12px; border-radius: 12px; border: 1px solid #b9c9ed; background: #ffffff; color: #0f172a; -webkit-appearance: none; appearance: none; font-size: 16px; box-shadow: 0 2px 6px rgba(15,23,42,.05); }
textarea { width: 100%; min-height: 72px; transition: min-height .2s ease, padding .2s ease; }
textarea.compact { min-height: 46px; padding-top: 8px; padding-bottom: 8px; }
.query-wrap { position: relative; flex: 1; min-width: 220px; overflow: visible; }
.query-wrap textarea { display:block; width:100%; padding: 14px 52px 14px 16px; border-radius: 16px; border: 1px solid #D8DEE9; background:#fff; box-shadow:none; resize: vertical; }
.query-wrap textarea::placeholder { color: transparent; }
.scan-list-btn {
  position: absolute;
  right: 8px;
  bottom: 8px;
  z-index: 4;
  width: 30px;
  height: 30px;
  border: 0;
  background: transparent;
  color: #2f5fd6;
  font-size: 24px;
  font-weight: 700;
  line-height: 28px;
  text-align: center;
  padding: 0;
  cursor: pointer;
}
.scan-list-btn.disabled { opacity: .45; pointer-events:none; }
.scan-list-input-overlay {
  position: absolute;
  right: 8px;
  bottom: 8px;
  width: 30px;
  height: 30px;
  opacity: 0;
  z-index: 5;
  cursor: pointer;
}
.ocr-progress {
  margin: 6px 0 0;
  height: 3px;
  border-radius: 999px;
  background: #e7eefc;
  overflow: hidden;
}
.ocr-progress-fill {
  display: block;
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, #2f5fd6, #6b8df0);
  transition: width .25s ease;
}
.scan-list-btn.processing { animation: pulse 1.1s ease-in-out infinite; }
button { min-height: 44px; padding: 10px 16px; border: 1px solid var(--cc-blue-2); border-radius: 12px; background: linear-gradient(135deg, var(--cc-blue-1), var(--cc-blue-2)); color: white; font-weight: 700; cursor: pointer; font-size: 15px; box-shadow: none; }
button.secondary { background: #ffffff; border: 1px solid #c7d2e5; color: var(--cc-blue-2); }
.text-button { min-height: auto; padding: 0; background: transparent; border: 0; color: var(--cc-blue-2); font-weight: 600; }
.icon-button { min-height: 40px; min-width: 40px; padding: 0; border-radius: 999px; border: 1px solid #d7deea; background: #fff; color: #111827; box-shadow: none; }
button:disabled { opacity: 0.6; cursor: not-allowed; }
.status-line { margin-top: 8px; min-height: 0; color: #607086; font-size: 14px; }
.status-line:empty { display: none; }
.controls { display: grid; gap: 12px; }
.details-panel > summary {
  font-weight: 700;
  color: #18274b;
}
.details-panel[open] > summary {
  margin-bottom: 10px;
}
.basket-primary-cta {
  align-items: center;
  justify-content: space-between;
}
.mode-basket #top5Section,
.mode-basket #resultsSection,
.mode-basket #singleResultsSummary {
  display: none;
}
.mode-basket #basketSection {
  order: 1;
}
.mode-basket #controlsSection {
  order: 2;
}
.mode-single #basketSection {
  display: none;
}
.toggles label { display: inline-flex; align-items: center; gap: 8px; color: #334155; }
.actions { display: flex; gap: 8px; flex-wrap: wrap; }
.selection-actions { align-items: center; margin-top: 4px; }
.combine-output { margin-top: 10px; display: grid; gap: 10px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
details { width: 100%; }
details > summary { list-style: none; cursor: pointer; width: fit-content; margin-bottom: 8px; }
details > summary::-webkit-details-marker { display: none; }
.chip { border-radius: 999px; padding: 6px 10px; font-size: 13px; background: #f8fbff; border: 1px solid #d4def4; color:#1e293b; box-shadow: 0 2px 6px rgba(15,23,42,.05); }
.query-assist { display:none !important; margin-top: 8px; min-height: 0; }
.query-assist:empty { display: none; }
.basket-review {
  margin-top: 12px;
}
.basket-review-list {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}
.basket-review-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: start;
}
.basket-review-row input,
.basket-review-row select {
  min-width: 0;
}
.basket-review-main {
  display: grid;
  gap: 10px;
}
.basket-review-meta {
  display: grid;
  grid-template-columns: minmax(110px, 140px) minmax(180px, 1fr);
  gap: 10px;
}
.basket-review-meta-stacked {
  grid-template-columns: 1fr;
}
.basket-review-field {
  display: grid;
  gap: 6px;
}
.basket-review-field span {
  font-size: 12px;
  font-weight: 600;
  color: #52627a;
}
.basket-review-remove {
  align-self: center;
  min-width: 40px;
  height: 40px;
  border: 1px solid #d4def4;
  background: #fff;
  color: #475569;
}
.basket-review-remove:hover {
  background: #f8fafc;
}
.basket-choice-group {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.basket-choice-chip {
  cursor: pointer;
}
.basket-choice-chip.active {
  background: #dfe9ff;
  border-color: #7da2ef;
  color: #23407a;
}
.single-results-hero {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 12px;
}
.single-results-hero .summary-block {
  height: 100%;
}
.chip.assist { cursor: pointer; background: #eaf0ff; border-color: #b9c9ef; }
.chip.assist:hover { background: #dfe9ff; }
.chip.assist-group { background: #f3f6ff; border-color: #d4def4; color: #35518c; }
.filter-chip { background: #ffffff; border: 1px solid #b9c9ed; color: #1f2a3c; }
.filter-chip input { margin-right: 6px; accent-color: var(--cc-blue-2); }
.row-select { display: inline-flex; align-items: center; gap: 6px; }
.row-select input { accent-color: var(--cc-blue-2); }
.chip.ok { border-color: #2b9f5a; background:#f4fbf6; }
.chip.silver { border-color: #d2a12b; background: #fff8e8; color:#5c460f; }
.chip.blocked, .chip.error { border-color: #c94747; background:#fff5f5; color:#7f1d1d; }
.chip.timeout { border-color: #d07b2f; background:#fff6ed; color:#7c3d12; }
.chip.no_results { border-color: #94a3b8; background:#f8fafc; color:#475569; }
.chip.parser { border-color: #6b6bd6; background:#f5f5ff; color:#3730a3; }
.pulse { animation: pulse 1.1s ease-in-out infinite; }
@keyframes pulse { 0% { opacity: .55; } 50% { opacity: 1; } 100% { opacity: .55; } }
.list { margin: 0; padding-left: 20px; }
.list li { margin-bottom: 6px; }
.table-wrap { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; margin-top: 8px; min-width: 700px; }
th, td { border-bottom: 1px solid #e2e8f0; text-align: left; padding: 8px; vertical-align: top; word-break: break-word; }
.legacy-results { display:none !important; }
.results-shell { display:grid; grid-template-columns: 296px minmax(0, 1fr); gap: 28px; padding: 0; background: transparent; border: 0; box-shadow: none; }
.results-sidebar { display:block; }
.results-main { min-width: 0; background:#F3F5F8; position:relative; z-index:1; }
.results-toolbar { display:flex; gap:8px; margin: 0 0 12px; }
.toolbar-button { flex:1; background:#fff; color:#111827; border:1px solid #d7deea; box-shadow:none; }
.active-filter-row { display:flex; align-items:center; justify-content:space-between; gap:12px; margin: 0 0 16px; }
.active-filter-chips { display:flex; gap:8px; flex-wrap:wrap; overflow:auto; }
.active-chip { min-height:32px; padding:6px 12px; border-radius:999px; background:#fff; color:#111827; border:1px solid #d7deea; font-size:14px; font-weight:600; }
.results-summary-row { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:18px; padding-bottom: 6px; }
.results-count-block h2 { font-size:30px; margin-bottom:4px; letter-spacing:-0.02em; }
.deals-rail-section { margin-bottom: 18px; }
.deals-rail-header { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-bottom:10px; }
.deals-rail { display:flex; gap:14px; overflow-x:auto; padding-bottom:6px; scroll-snap-type:x proximity; }
.deal-card { flex:0 0 260px; background:#fff; border:1px solid #E3E7EF; border-radius:18px; padding:14px; display:grid; gap:12px; box-shadow:0 6px 18px rgba(15,23,42,.04); scroll-snap-align:start; }
.deal-card-image-wrap { display:flex; align-items:center; justify-content:center; min-height:120px; border-radius:14px; background:#F8FAFC; }
.deal-card-image { width:120px; height:120px; object-fit:contain; }
.deal-card-title { margin:0; font-size:16px; line-height:1.3; }
.desktop-sort-wrap { display:flex; align-items:center; gap:10px; }
.sort-inline-label { color:#6B7280; font-size:14px; }
.sort-select { min-width:220px; height:44px; border-radius:12px; border:1px solid #D7DEEA; box-shadow:none; }
.results-grid { display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap:24px; }
.product-card { background:#fff; border:1px solid #E3E7EF; border-radius:20px; padding:18px; display:flex; flex-direction:column; gap:14px; min-height:100%; box-shadow: 0 6px 18px rgba(15,23,42,.04); }
.product-card-main { display:flex; flex-direction:column; gap:14px; }
.product-card-image-wrap { display:flex; align-items:center; justify-content:center; width:100%; min-height:160px; border-radius:16px; background:#F8FAFC; }
.product-card-image { width:160px; height:160px; object-fit:contain; }
.placeholder-card-image { display:flex; align-items:center; justify-content:center; width:160px; height:160px; border-radius:12px; background:#EEF2F7; color:#8A93A3; font-size:14px; }
.product-meta-top { display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; }
.store-badge { display:inline-flex; align-items:center; min-height:28px; padding:4px 10px; border-radius:999px; background:#EEF3FF; color:#1D4ED8; font-size:14px; font-weight:600; }
.confidence-badge { display:inline-flex; align-items:center; min-height:28px; padding:4px 10px; border-radius:999px; font-size:14px; font-weight:700; }
.confidence-badge.high { background:#ECFDF3; color:#16794B; }
.confidence-badge.good { background:#EFF6FF; color:#1D4ED8; }
.confidence-badge.check { background:#FFF7ED; color:#B45309; }
.confidence-badge.low { background:#FEF2F2; color:#B91C1C; }
.product-title { font-size:17px; line-height:1.3; font-weight:700; margin:0; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.pack-size { margin:0; font-size:14px; color:#6B7280; }
.promo-line { margin:0; font-size:14px; color:#1D4ED8; font-weight:600; }
.price-block { display:grid; gap:4px; }
.price-main { font-size:32px; line-height:1; font-weight:700; color:#111827; }
.unit-price-line { font-size:14px; color:#6B7280; }
.card-actions { margin-top:auto; }
.select-button { width:100%; }
.select-button.selected { background:#E8F0FF; color:#1D4ED8; border-color:#B7CCF8; }
.card-details { border-top:1px solid #E5EAF2; padding-top:12px; }
.card-details summary { width:100%; display:flex; align-items:center; justify-content:space-between; font-size:14px; color:#111827; }
.card-details-body { display:grid; gap:12px; padding-top:12px; }
.details-grid { display:grid; gap:8px; font-size:14px; color:#374151; }
.credibility-line { font-size:13px; color:#6B7280; margin:0; }
.details-section strong { display:block; margin-bottom:6px; }
.details-list { margin:0; padding-left:18px; color:#6B7280; }
.secondary-link-button { display:inline-flex; align-items:center; justify-content:center; min-height:40px; padding:10px 14px; border-radius:12px; border:1px solid #d7deea; color:#18274B; text-decoration:none; font-weight:600; }
.empty-state { padding:24px; background:#fff; border:1px solid #E3E7EF; border-radius:16px; text-align:center; }
.filter-panel-card { background:#fff; border:1px solid #E3E7EF; border-radius:20px; padding:18px; box-shadow: 0 6px 18px rgba(15,23,42,.04); position:sticky; top:104px; overflow:hidden; }
.filter-panel-header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.filter-panel-groups { display:grid; gap:14px; }
.filter-group { display:grid; gap:10px; padding:0 0 12px; border-bottom:1px solid #EEF2F7; }
.filter-group:last-child { padding-bottom:0; border-bottom:0; }
.filter-group h3 { margin:0; font-size:15px; color:#111827; }
.sheet-option { display:flex; align-items:center; gap:10px; min-height:44px; font-size:15px; color:#111827; }
.sheet-option input { width:18px; height:18px; accent-color:#18274B; }
.sheet-backdrop { position:fixed; inset:0; background:rgba(15,23,42,.45); z-index:160; touch-action:none; overscroll-behavior:none; }
.bottom-sheet { position:fixed; left:0; right:0; bottom:0; z-index:170; max-height:85dvh; display:flex; flex-direction:column; background:#fff; border-radius:20px 20px 0 0; padding:10px 16px 16px; box-shadow:0 -12px 30px rgba(15,23,42,.18); overflow:hidden; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; touch-action:pan-y; transform:translateY(calc(100% + 24px)); opacity:0; pointer-events:none; visibility:hidden; }
.bottom-sheet[data-open="true"] { transform:translateY(0); opacity:1; pointer-events:auto; visibility:visible; }
.bottom-sheet[hidden],
.mobile-overlay-sheet[hidden],
.sheet-backdrop[hidden] {
  display: none !important;
}
.sheet-handle { width:48px; height:5px; border-radius:999px; background:#D1D5DB; margin:0 auto 12px; flex:0 0 auto; }
.sheet-header { display:flex; align-items:center; justify-content:space-between; position:sticky; top:0; background:#fff; padding-bottom:12px; flex:0 0 auto; z-index:1; }
.sheet-body { overflow-y:auto; overflow-x:hidden; display:grid; gap:16px; padding-bottom:12px; flex:1 1 auto; min-height:0; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; touch-action:pan-y; }
.filter-inline-range { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.filter-inline-range select { width:100%; }
.sheet-footer { position:sticky; bottom:0; display:flex; gap:12px; background:#fff; padding-top:12px; flex:0 0 auto; }
.skeleton-grid { display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap:24px; }
.skeleton-card { background:#fff; border:1px solid #E3E7EF; border-radius:16px; padding:18px; display:grid; gap:12px; }
.skeleton-box { background:linear-gradient(90deg, #EEF2F7 25%, #F8FAFC 50%, #EEF2F7 75%); background-size:200% 100%; animation:skeletonShimmer 1.3s linear infinite; border-radius:12px; }
@keyframes skeletonShimmer { from { background-position:200% 0; } to { background-position:-200% 0; } }
.mobile-only { display:none; }
.desktop-only { display:block; }
.result-product { display:flex; gap:10px; align-items:flex-start; }
.result-media { display:flex; flex-direction:column; align-items:center; gap:4px; min-width:52px; }
.result-thumb { width:44px; height:44px; object-fit:cover; border-radius:8px; border:1px solid #3d538e; background:#1a2544; }
.result-thumb.placeholder { background: linear-gradient(180deg, #20325f, #152344); }
.no-image-note { font-size: 11px; color: #64748b; text-align: center; line-height: 1.2; }
.result-name { font-weight:600; }
a { color: #2f5fd6; }

.partner-section h2 { margin-bottom: 6px; }
.btn-link { display:inline-block; padding:10px 14px; border-radius:10px; border:1px solid #ffffff; background:#4a7dff; color:#fff; text-decoration:none; font-weight:600; }
.btn-link.secondary-link { background:#2a3f74; }
.site-footer { margin-top: 28px; padding: 16px; border: 1px solid #E3E7EF; border-radius: 16px; background: #ffffff; display: flex; justify-content: space-between; align-items: end; gap: 12px; color: #475569; font-size: 13px; }
.aw-marker { opacity: .8; font-size: 12px; }
.risk-note { margin-top: 10px; padding: 10px 12px; border:1px solid #f3c27a; background:#fff8ec; color:#7c4a03; border-radius:10px; font-size:13px; }
.global-beta-risk { margin: 12px 0; padding: 10px 12px; border:1px solid #f3c27a; background:#fff7e7; color:#7c4a03; border-radius:10px; font-size:13px; }
.legal-page h2 { margin-top: 16px; }
.legal-page ul { margin: 8px 0 0 20px; color: #475569; }

.legend-gold { color: #5dd283; }
.legend-silver { color: #e0b14a; }
.legend-parked { color: #e06a6a; }

.recipe-row { display: grid; gap: 10px; }
.recipe-summary { margin-top: 10px; display:grid; gap:10px; }
.summary-block { border:1px solid var(--cc-border); border-radius:12px; background:#fff; padding:10px 12px; box-shadow: 0 2px 8px rgba(15,23,42,.05); }
.summary-block h3 { margin: 0 0 8px; font-size: 15px; }
.recipe-store-list { display: flex; gap: 8px; flex-wrap: wrap; }
.match-grid { display: grid; gap: 16px; margin-top: 12px; }
.match-card { border: 1px solid #dbe3f2; border-radius: 10px; padding: 10px; background: #ffffff; }
.match-card h4 { margin: 0 0 8px; font-size: 14px; color: #0f172a; }
.match-row { display: flex; justify-content: space-between; gap: 8px; font-size: 12px; padding: 4px 0; color: #334155; }
.match-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; margin-top: 12px; }
.basket-ingredient-section { display:grid; gap:12px; }
.basket-ingredient-header h3 { margin:0; font-size:18px; color:#111827; }
.basket-suggestion-block { display:grid; gap:8px; margin:10px 0 14px; padding:10px 12px; background:#f8fbff; border:1px solid #d4def4; border-radius:14px; }
.basket-suggestion-group { display:flex; flex-wrap:wrap; gap:8px; align-items:center; color:#334155; font-size:13px; }
.basket-suggestion-chip { cursor:pointer; }
.basket-match-group { display:grid; gap:10px; margin:12px 0 18px; }
.basket-match-group h4 { margin:0; font-size:14px; color:#334155; }
.price-range-control { display:grid; gap:8px; min-width:220px; }
.price-range-header, .price-range-values { display:flex; justify-content:space-between; align-items:center; font-size:13px; color:#475569; }
.price-range-slider-wrap { position:relative; height:28px; display:grid; align-items:center; }
.price-range-slider-wrap input[type="range"] { position:absolute; left:0; right:0; width:100%; margin:0; pointer-events:auto; background:transparent; }
.basket-results-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap:16px; }
.basket-product-card { border-radius:18px; }
.basket-inline-meta { margin-top: 8px; }
.basket-action-panel { display:flex; justify-content:space-between; gap:16px; align-items:flex-start; border-color:#b9c8ef; background:linear-gradient(135deg,#ffffff,#f6f8ff); }
.basket-action-buttons { display:flex; flex-wrap:wrap; gap:10px; justify-content:flex-end; }
.basket-store-block { display:grid; gap:14px; margin-top:14px; padding:0; overflow:hidden; }
.basket-store-block > summary { list-style:none; cursor:pointer; display:flex; justify-content:space-between; gap:12px; align-items:center; padding:12px 14px; background:#f8fafc; border-bottom:1px solid #e2e8f0; }
.basket-store-block > summary::-webkit-details-marker { display:none; }
.basket-store-block > summary span { display:grid; gap:3px; }
.basket-store-block > summary small { color:#64748b; font-size:13px; font-weight:500; }
.basket-store-proceed { white-space:nowrap; }
.basket-store-product-block { padding:0 14px 14px; }
.basket-store-product-block h4 { margin:0 0 10px; padding-top:4px; color:#18274B; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }

.auth-card { max-width: 560px; margin: 20px auto; }
.auth-form { display: grid; gap: 12px; }
.auth-form label { display: grid; gap: 6px; color: #334155; font-weight: 500; }

@media (max-width: 1199px) {
  .results-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
  body { padding-top: 76px; }
  .journey-switch { overflow-x: auto; overflow-y: hidden; }
  .basket-primary-cta { align-items: stretch; flex-direction: column; }
  .single-results-hero { grid-template-columns: 1fr; }
  .basket-review-row { grid-template-columns: 1fr; }
  .basket-review-meta { grid-template-columns: 1fr; }
  .basket-review-remove { justify-self: end; }
  .basket-action-panel { flex-direction:column; }
  .basket-action-buttons { width:100%; justify-content:stretch; }
  .basket-action-buttons button { flex:1; }
  .basket-store-block > summary { align-items:flex-start; flex-direction:column; }
  .basket-store-proceed { width:100%; }
  .app-nav { align-items: center; min-height:64px; padding: 10px 16px; }
  .brand { width: 56px; min-width: 56px; max-width: 56px; margin-left: -8px; }
  .brand-logo { width: 56px; max-width: 56px; height: 56px; max-height: 56px; }
  .nav-actions { gap: 8px; }
  .nav-link { font-size: 14px; }
  .nav-cta { display:none; }

  .search-row { display: grid; grid-template-columns: 1fr; gap: 10px; }
  .search-row button { width: 100%; min-height: 48px; }
  textarea { min-height: 56px; }
  .query-wrap { min-width: 0; }
  .query-wrap textarea { min-height:56px; max-height: 32vh; border-radius:16px; -webkit-appearance:none; appearance:none; font-size:16px; }
  .scan-list-btn, .scan-list-input-overlay { right: 10px; bottom: 10px; }

  section, .planner-row { border-radius: 12px; }
  .results-shell { grid-template-columns: 1fr; gap:16px; }
  .results-sidebar { display:none; }
  .mobile-only { display:flex; }
  .desktop-only { display:none; }
  .sticky-results-tools { position:sticky; top:72px; z-index:95; background:#F3F5F8; padding:4px 0 10px; }
  .top-filter-bar,
  .journey-switch,
  .sticky-results-tools {
    transform: translateZ(0);
  }
  .mobile-overlay-sheet {
    inset: auto 0 0 0;
  }
  .mobile-overlay-sheet:not([data-open="true"]) {
    display: none !important;
    transform: translateY(120%) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
  .mobile-overlay-sheet[data-open="true"]:not([hidden]) {
    display: flex !important;
    transform: translateY(0) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
  .active-filter-row { flex-direction:column; align-items:flex-start; }
  .active-filter-chips { flex-wrap:nowrap; width:100%; overflow:auto; }
  .results-summary-row { flex-direction:column; align-items:flex-start; gap:8px; }
  .results-count-block h2 { font-size:24px; }
  .deals-rail-header { flex-direction:column; align-items:flex-start; }
  .deal-card { flex-basis: 220px; }
  .results-grid { grid-template-columns: 1fr; gap:12px; }
  .basket-results-grid { grid-template-columns: 1fr; gap:12px; }
  .skeleton-grid { grid-template-columns: 1fr; gap:12px; }
  .product-card { padding:14px; border-radius:16px; }
  .product-card-main { display:grid; grid-template-columns:112px minmax(0,1fr); gap:14px; align-items:start; }
  .product-card-image-wrap { width:112px; min-width:112px; min-height:112px; border-radius:12px; }
  .product-card-image, .placeholder-card-image { width:112px; height:112px; }
  .product-title { font-size:18px; -webkit-line-clamp:2; }
  .price-main { font-size:34px; }
  .card-actions { margin-top:8px; }
  .sheet-footer button { flex:1; }

  table { min-width: 100%; border: 0; }
  thead { display: none; }
  tr { display: block; border: 1px solid #dbe3f2; border-radius: 10px; padding: 8px; margin-bottom: 10px; background:#fff; }
  td { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; border: 0; padding: 6px 0; overflow-wrap: anywhere; }
  td::before { content: attr(data-label); font-weight: 600; color: #64748b; }
}
