/* Batch research: a decoder console with a live authenticity cross-reference. Loaded last. */
#panel-batches {
  --bc-year: #5b62d6; --bc-month: #24998a; --bc-day: #d9822b; --bc-week: #c0508a; --bc-plant: #6a7c98;
  --bc-lot: #8a8478; --bc-serial: #8a4dd6; --bc-counter: #b8891c; --bc-mark: #7c7a80;
  --bc-pass: var(--positive, #246047); --bc-watch: var(--amber, #8a5a0c); --bc-fail: var(--red, #a12a3d); --bc-info: #3d74c4;
  --bc-open: color-mix(in srgb, var(--muted) 45%, var(--line));
  --bc-mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;
}
:root[data-color-mode=dark] #panel-batches { --bc-year: #8f95f5; --bc-month: #5fd1c0; --bc-day: #f2a65a; --bc-week: #ec8fbd; --bc-plant: #9fb0c9; --bc-lot: #b8b2a6; --bc-serial: #c19af5; --bc-counter: #e8c25a; --bc-info: #7fb0f2; }
#panel-batches [data-role=year] { --role: var(--bc-year); } #panel-batches [data-role=month] { --role: var(--bc-month); }
#panel-batches [data-role=day] { --role: var(--bc-day); } #panel-batches [data-role=week] { --role: var(--bc-week); }
#panel-batches [data-role=plant] { --role: var(--bc-plant); } #panel-batches [data-role=lot] { --role: var(--bc-lot); }
#panel-batches [data-role=serial] { --role: var(--bc-serial); } #panel-batches [data-role=counter] { --role: var(--bc-counter); }
#panel-batches [data-role=mark] { --role: var(--bc-mark); }
#panel-batches [data-state=pass] { --state: var(--bc-pass); } #panel-batches [data-state=watch] { --state: var(--bc-watch); }
#panel-batches [data-state=fail] { --state: var(--bc-fail); } #panel-batches [data-state=info] { --state: var(--bc-info); }
#panel-batches [data-state=unknown] { --state: var(--bc-open); }
.bc-mono { font-family: var(--bc-mono); letter-spacing: .06em; }
.bc-kicker { font-size: 11px; font-weight: 650; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.bc-status { margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--muted); }
.bc-status:empty { display: none; }
.bc-note { margin: 0; font-size: 12px; line-height: 1.5; color: var(--muted); }

/* ---------- Hero ---------- */
.bc-hero { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .85fr); gap: 28px; align-items: center; padding: clamp(18px, 3vw, 34px) 0 24px; }
.bc-hero h1 { margin: 12px 0 14px; font: 400 clamp(36px, 4.6vw, 58px)/1.04 var(--studio-serif, Georgia, serif); letter-spacing: -.02em; color: var(--ink); }
.bc-hero h1 em { font-weight: 400; color: var(--accent-color); }
.bc-hero p { max-width: 58ch; margin: 0; font-size: 15px; line-height: 1.65; color: var(--muted); }
.bc-hero-stats { display: flex; flex-wrap: wrap; gap: 10px; margin: 22px 0 0; }
.bc-hero-stats div { display: flex; flex-direction: column-reverse; padding: 10px 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--bg-card); }
.bc-hero-stats dt { font-size: 11.5px; color: var(--muted); }
.bc-hero-stats dd { margin: 0; font: 400 26px/1.1 var(--studio-serif, Georgia, serif); color: var(--ink); }
.bc-hero-plate { position: relative; display: grid; justify-items: center; gap: 18px; min-height: 264px; padding: 26px; overflow: hidden; border: 1px solid var(--line); border-radius: 28px; background: radial-gradient(70% 70% at 50% 30%, color-mix(in srgb, var(--accent-color) 12%, var(--bg-card)), var(--bg-card) 72%); }
.bc-hero-bottle { position: relative; z-index: 1; display: grid; justify-items: center; }
.bc-hero-cap { width: 56px; height: 30px; border-radius: 8px 8px 4px 4px; background: linear-gradient(135deg, #e9d59b, #9c7a33 60%, #d7bd73); box-shadow: inset 0 -3px 0 rgb(0 0 0 / .15); }
.bc-hero-glass { display: grid; place-items: center; width: 168px; height: 158px; margin-top: -1px; border-radius: 28px; background: linear-gradient(160deg, color-mix(in srgb, var(--accent-color) 18%, #ffffff), color-mix(in srgb, var(--accent-color) 42%, #cfd6e6)); box-shadow: inset 0 0 0 1px rgb(255 255 255 / .6), inset 14px 0 30px rgb(255 255 255 / .25), 0 18px 40px var(--shadow); }
.bc-hero-label { display: flex; gap: 6px; padding: 10px 12px; border-radius: 12px; background: rgb(255 255 255 / .9); box-shadow: 0 6px 16px rgb(0 0 0 / .12); }
.bc-hero-label b { display: grid; place-items: center; width: 28px; height: 36px; border-radius: 6px; border-bottom: 3px solid var(--c); font: 700 22px/1 var(--bc-mono); color: #2a2633; }
.bc-hero-label b:nth-child(1) { --c: var(--bc-year); } .bc-hero-label b:nth-child(2) { --c: var(--bc-month); } .bc-hero-label b:nth-child(n+3) { --c: var(--bc-lot); }
.bc-hero-legend { position: relative; z-index: 1; display: flex; gap: 16px; font-size: 12px; font-weight: 600; color: var(--muted); }
.bc-hero-legend i { display: inline-block; width: 12px; height: 3px; margin-inline-end: 6px; border-radius: 2px; background: var(--role); vertical-align: middle; }
.bc-hero-beam { position: absolute; top: 0; bottom: 0; left: -40%; width: 40%; background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--accent-color) 24%, transparent), transparent); pointer-events: none; }

/* ---------- Console ---------- */
.bc-console { display: grid; grid-template-columns: minmax(330px, 440px) minmax(0, 1fr); gap: 20px; align-items: start; margin: 4px 0 24px; }
.bc-panel { display: grid; gap: 12px; min-width: 0; padding: 22px; border: 1px solid var(--line); border-radius: 24px; background: var(--bg-card); box-shadow: 0 1px 2px var(--shadow), 0 18px 40px color-mix(in srgb, var(--shadow) 60%, transparent); }
.bc-step { display: flex; align-items: center; gap: 10px; margin-top: 4px; font-size: 13.5px; font-weight: 650; color: var(--ink); }
.bc-step-extra { margin-top: 10px; padding-top: 14px; border-top: 1px solid var(--line); }
.bc-step-n { display: grid; place-items: center; flex-shrink: 0; width: 24px; height: 24px; border-radius: 50%; background: var(--accent-color); color: var(--on-accent); font-size: 12px; font-weight: 700; }
.bc-step-hint, .bc-optional { margin-inline-start: auto; font-size: 11.5px; font-weight: 500; color: var(--muted); text-align: end; }
.bc-input { appearance: none; -webkit-appearance: none; display: block; width: 100%; min-height: 44px; box-sizing: border-box; margin: 0; padding: 10px 13px; border: 1px solid color-mix(in srgb, var(--control-line) 22%, var(--line)); border-radius: 12px; background: color-mix(in srgb, var(--ink) 2.5%, var(--bg-card)); color: var(--ink); font: inherit; font-size: 14px; line-height: 1.4; box-shadow: inset 0 1px 2px color-mix(in srgb, var(--ink) 5%, transparent); outline: none; transition: border-color .15s, box-shadow .15s, background-color .15s; }
.bc-input::placeholder { color: color-mix(in srgb, var(--muted) 72%, transparent); }
.bc-input:hover { border-color: color-mix(in srgb, var(--control-line) 50%, var(--line)); }
.bc-input:focus, .bc-input:focus-visible { border-color: var(--accent-color); background: var(--bg-card); box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent-color) 16%, transparent); outline: none; }
select.bc-input { padding-inline-end: 34px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='m3 4.5 3 3 3-3' fill='none' stroke='%23888' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; cursor: pointer; }
textarea.bc-input { min-height: 84px; resize: vertical; }
.bc-input-lg { min-height: 50px; padding-inline-start: 42px; font-size: 15.5px; }
.bc-code-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.bc-input-code { min-height: 56px; font: 650 21px/1 var(--bc-mono); letter-spacing: .2em; text-transform: uppercase; }
.bc-input-code::placeholder { font-size: 15px; letter-spacing: .08em; text-transform: none; }
.bc-decode { min-height: 56px; padding: 0 22px; border-radius: 14px; }
.bc-combo { position: relative; }
.bc-combo-icon { position: absolute; z-index: 1; left: 14px; top: 25px; translate: 0 -50%; width: 18px; height: 18px; fill: none; stroke: var(--muted); stroke-width: 1.8; stroke-linecap: round; pointer-events: none; }
.bc-combo-list { position: absolute; z-index: 40; top: calc(100% + 6px); inset-inline: 0; max-height: 320px; overflow: auto; padding: 6px; border: 1px solid var(--line); border-radius: 16px; background: var(--bg-card); box-shadow: var(--shadow-panel); overscroll-behavior: contain; }
.bc-combo-list [role=option] { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 12px; border-radius: 10px; color: var(--ink); font-size: 13.5px; cursor: pointer; }
.bc-combo-list [role=option]:hover, .bc-combo-list [role=option][aria-selected=true] { background: var(--tint); }
.bc-combo-list small { flex-shrink: 0; padding: 2px 8px; border-radius: 999px; background: var(--soft); color: var(--muted); font-size: 11px; font-weight: 600; }
.bc-combo-list small[data-cap=date] { background: color-mix(in srgb, var(--bc-year) 14%, var(--bg-card)); color: var(--bc-year); }
.bc-combo-empty { margin: 0; padding: 12px; font-size: 13px; color: var(--muted); }
.bc-capability { display: grid; gap: 6px; padding: 12px 14px; border-radius: 14px; background: var(--soft); border: 1px solid var(--line); font-size: 12.5px; line-height: 1.55; color: var(--text); }
.bc-capability p, .bc-capability small { margin: 0; }
.bc-capability small { color: var(--muted); }
.bc-cap-chip { justify-self: start; padding: 3px 10px; border-radius: 999px; background: var(--bg-card); border: 1px solid var(--line); font-size: 11px; font-weight: 650; color: var(--muted); }
.bc-capability[data-cap=date] .bc-cap-chip { border-color: color-mix(in srgb, var(--bc-year) 40%, var(--line)); background: color-mix(in srgb, var(--bc-year) 12%, var(--bg-card)); color: var(--bc-year); }
.bc-capability[data-cap=check] .bc-cap-chip { border-color: color-mix(in srgb, var(--accent-color) 35%, var(--line)); color: var(--accent-color); }

/* Code plate */
.bc-plate { position: relative; display: flex; flex-wrap: wrap; align-items: flex-start; gap: 12px 14px; min-height: 86px; padding: 14px; overflow: hidden; border: 1px dashed color-mix(in srgb, var(--control-line) 30%, var(--line)); border-radius: 16px; background: repeating-linear-gradient(135deg, transparent 0 10px, color-mix(in srgb, var(--ink) 2%, transparent) 10px 11px), color-mix(in srgb, var(--ink) 1.5%, var(--bg-card)); }
.bc-plate[data-state=read] { border-style: solid; border-color: color-mix(in srgb, var(--accent-color) 30%, var(--line)); }
.bc-plate-empty { align-self: center; font-size: 12.5px; color: var(--muted); }
.bc-seg-group { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; max-width: 100%; }
.bc-seg-label { flex-basis: 100%; margin-top: 2px; text-align: center; font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--role); }
.bc-tile { display: grid; place-items: center; width: 32px; height: 42px; border: 1px solid var(--line); border-bottom: 3px solid var(--role); border-radius: 9px; background: var(--bg-card); color: var(--ink); font: 700 19px/1 var(--bc-mono); box-shadow: 0 2px 6px var(--shadow); }
.bc-plate::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--accent-color) 26%, transparent) 50%, transparent); transform: translateX(-110%); pointer-events: none; }
.bc-recent { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
.bc-recent:empty { display: none; }
.bc-recent button, .bc-examples button { display: inline-flex; align-items: center; gap: 4px; min-height: 30px; padding: 4px 11px; border: 1px solid var(--line); border-radius: 999px; background: var(--bg-card); color: var(--ink); font: inherit; font-size: 12px; cursor: pointer; transition: border-color .15s, background-color .15s; }
.bc-recent button:hover, .bc-examples button:hover { border-color: color-mix(in srgb, var(--accent-color) 45%, var(--line)); background: var(--tint); }
.bc-recent .bc-recent-clear { border-color: transparent; background: none; color: var(--muted); }

/* Signal groups */
.bc-groups { display: grid; gap: 8px; }
.bc-group { overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: var(--bg-card); transition: border-color .2s; }
.bc-group[open] { border-color: color-mix(in srgb, var(--accent-color) 28%, var(--line)); }
.bc-group summary { display: flex; align-items: center; gap: 10px; padding: 12px 14px; color: var(--ink); font-size: 13.5px; font-weight: 600; list-style: none; cursor: pointer; }
.bc-group summary::-webkit-details-marker { display: none; }
.bc-group summary::after { content: ""; flex-shrink: 0; width: 7px; height: 7px; margin: 0 2px 3px 4px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(45deg); transition: transform .2s; }
.bc-group[open] summary::after { margin-bottom: -3px; transform: rotate(-135deg); }
.bc-group-state { margin-inline-start: auto; padding: 2px 9px; border-radius: 999px; background: color-mix(in srgb, var(--state) 14%, var(--bg-card)); color: var(--state); font-size: 11px; font-weight: 650; }
.bc-group-state[data-state=unknown] { background: var(--soft); color: var(--muted); }
.bc-group-body { display: grid; gap: 12px; padding: 0 14px 14px; }
.bc-group-blurb { margin: 0; font-size: 12px; line-height: 1.5; color: var(--muted); }
.bc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.bc-field { display: grid; gap: 6px; min-width: 0; margin: 0; }
.bc-field-label { font-size: 12px; font-weight: 600; color: var(--ink); }
.bc-field small { font-size: 11px; color: var(--muted); }
.bc-picker.photo-scent-picker { position: relative; }
.bc-picker .photo-picker-results { border-radius: 14px; box-shadow: var(--shadow-panel); }
.bc-picker .photo-picker-selection { margin: 0; border-radius: 12px; }
.bc-inspect { display: grid; gap: 8px; }
.bc-inspect-row { display: grid; gap: 8px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--soft); }
.bc-inspect-row strong { display: block; font-size: 13px; color: var(--ink); }
.bc-inspect-row small { display: block; margin-top: 2px; font-size: 11.5px; line-height: 1.45; color: var(--muted); }
.bc-tri { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3px; padding: 3px; border: 1px solid var(--line); border-radius: 10px; background: var(--bg-card); }
.bc-tri button { min-height: 30px; padding: 4px 6px; border: 0; border-radius: 8px; background: transparent; color: var(--muted); font: inherit; font-size: 12px; font-weight: 500; cursor: pointer; transition: background-color .15s, color .15s; }
.bc-tri button:hover { color: var(--ink); background: var(--soft); }
.bc-tri button[aria-pressed=true][data-inspect-value=right] { background: color-mix(in srgb, var(--bc-pass) 16%, var(--bg-card)); color: var(--bc-pass); font-weight: 650; }
.bc-tri button[aria-pressed=true][data-inspect-value=unsure] { background: color-mix(in srgb, var(--bc-info) 14%, var(--bg-card)); color: var(--bc-info); font-weight: 650; }
.bc-tri button[aria-pressed=true][data-inspect-value=wrong] { background: color-mix(in srgb, var(--bc-fail) 14%, var(--bg-card)); color: var(--bc-fail); font-weight: 650; }

/* ---------- Results ---------- */
.bc-output { min-width: 0; }
.bc-result-grid { display: grid; gap: 16px; }
.bc-card { min-width: 0; padding: 22px; border: 1px solid var(--line); border-radius: 24px; background: var(--bg-card); box-shadow: 0 1px 2px var(--shadow); }
.bc-card-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px; }
.bc-card-head > div { flex: 1 1 200px; min-width: 0; }
.bc-card h2 { margin: 6px 0 0; font: 400 28px/1.15 var(--studio-serif, Georgia, serif); color: var(--ink); }
.bc-chip { flex-shrink: 0; padding: 4px 10px; border: 1px solid var(--line); border-radius: 999px; background: var(--soft); color: var(--muted); font-size: 11.5px; font-weight: 600; }
.bc-chip[data-kind=source] { border-color: color-mix(in srgb, var(--bc-year) 35%, var(--line)); background: color-mix(in srgb, var(--bc-year) 10%, var(--bg-card)); color: var(--bc-year); }
.bc-lead { margin: 12px 0 0; font-size: 14px; line-height: 1.65; color: var(--text); }
.bc-dates { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; margin: 16px 0 0; padding: 0; list-style: none; }
.bc-dates li { display: grid; gap: 4px; padding: 14px 16px; border: 1px solid color-mix(in srgb, var(--bc-year) 22%, var(--line)); border-radius: 16px; background: linear-gradient(160deg, color-mix(in srgb, var(--bc-year) 8%, var(--bg-card)), var(--bg-card) 70%); }
.bc-date-kind { font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--bc-year); }
.bc-dates strong { font: 400 22px/1.2 var(--studio-serif, Georgia, serif); color: var(--ink); }
.bc-dates small { font-size: 11.5px; color: var(--muted); }
.bc-axis { position: relative; height: 46px; margin: 18px 8px 0; }
.bc-axis-line { position: absolute; left: 0; right: 0; top: 13px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, var(--line), color-mix(in srgb, var(--bc-year) 35%, var(--line))); }
.bc-axis-dot { position: absolute; left: var(--x); top: 7px; width: 14px; height: 14px; margin-left: -7px; border-radius: 50%; background: var(--bc-year); box-shadow: 0 0 0 4px color-mix(in srgb, var(--bc-year) 20%, transparent); }
.bc-axis-dot em { position: absolute; top: 20px; left: 50%; translate: -50% 0; font-size: 11px; font-style: normal; color: var(--muted); }
.bc-axis-end { position: absolute; right: -6px; top: 24px; font-size: 11px; color: var(--muted); }
.bc-printed { display: grid; gap: 10px; margin-top: 16px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 16px; background: var(--soft); }
.bc-printed > div { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.bc-printed > div > div { display: grid; gap: 2px; }
.bc-printed span:not(.bc-kicker) { font-size: 11.5px; color: var(--muted); }
.bc-printed strong { font: 400 20px/1.2 var(--studio-serif, Georgia, serif); color: var(--ink); }
.bc-printed small { font-size: 11.5px; color: var(--muted); }
.bc-notes { margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--line); }
.bc-notes summary { font-size: 13px; font-weight: 600; color: var(--ink); cursor: pointer; }
.bc-notes ul { margin: 10px 0 0; padding-inline-start: 18px; font-size: 12.5px; line-height: 1.6; color: var(--muted); }
.bc-notes li + li { margin-top: 4px; }
.bc-cite { margin: 10px 0 0; font-size: 11.5px; color: var(--muted); }
.bc-auth-head { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 18px; align-items: center; }
.bc-auth-head p { margin: 6px 0 0; font-size: 13.5px; line-height: 1.55; color: var(--text); }
.bc-auth[data-verdict=review] h2 { color: var(--bc-fail); }
.bc-auth[data-verdict=narrow] h2 { color: var(--bc-watch); }
.bc-auth[data-verdict=aligned] h2 { color: var(--bc-pass); }
.bc-ring { width: 96px; height: 96px; overflow: visible; }
.bc-ring .bc-ring-track { fill: none; stroke: color-mix(in srgb, var(--line) 60%, transparent); stroke-width: 7; }
.bc-ring g circle { fill: none; stroke: var(--state); stroke-width: 7; stroke-linecap: round; }
.bc-ring text { fill: var(--ink); font: 400 21px var(--studio-serif, Georgia, serif); }
.bc-ring .bc-ring-sub { fill: var(--muted); font: 650 7.5px Inter, system-ui, sans-serif; letter-spacing: .1em; text-transform: uppercase; }
.bc-tally { display: flex; flex-wrap: wrap; gap: 6px; margin: 16px 0 2px; }
.bc-tally span { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px 3px 7px; border-radius: 999px; background: color-mix(in srgb, var(--state) 12%, var(--bg-card)); color: var(--state); font-size: 12px; font-weight: 600; }
.bc-tally span[data-state=unknown] { background: var(--soft); color: var(--muted); }
.bc-tally svg { width: 14px; height: 14px; }
.bc-check-group h3 { margin: 18px 0 8px; font: 650 11px/1.4 Inter, system-ui, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.bc-checks { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.bc-check { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 12px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--bg-card); }
.bc-check:is([data-state=fail], [data-state=watch]) { border-color: color-mix(in srgb, var(--state) 38%, var(--line)); background: color-mix(in srgb, var(--state) 5%, var(--bg-card)); }
.bc-check-icon { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: color-mix(in srgb, var(--state) 15%, var(--bg-card)); color: var(--state); }
.bc-check[data-state=unknown] .bc-check-icon { background: var(--soft); color: var(--muted); }
.bc-check-icon svg { width: 16px; height: 16px; }
.bc-check-top { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.bc-check-top strong { font-size: 14px; color: var(--ink); }
.bc-check-state { flex-shrink: 0; font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--state); }
.bc-check[data-state=unknown] .bc-check-state { color: var(--muted); }
.bc-check-copy { min-width: 0; }
.bc-check-copy p { margin: 4px 0 0; font-size: 12.5px; line-height: 1.55; color: var(--muted); }
.bc-check-action { margin-top: 8px; padding: 0; border: 0; background: none; color: var(--accent-color); font: inherit; font-size: 12.5px; font-weight: 650; cursor: pointer; }
.bc-check-action:hover { text-decoration: underline; text-underline-offset: 3px; }
.bc-disclaimer { margin: 16px 0 0; font-size: 12px; line-height: 1.55; color: var(--muted); }
.bc-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 14px; }

/* Starting states */
.bc-start { display: grid; justify-items: start; gap: 10px; padding: 28px; border: 1px dashed color-mix(in srgb, var(--control-line) 30%, var(--line)); border-radius: 24px; background: var(--bg-card); }
.bc-start h2 { margin: 0; font: 400 30px/1.15 var(--studio-serif, Georgia, serif); color: var(--ink); }
.bc-start p { max-width: 60ch; margin: 0; font-size: 14px; line-height: 1.65; color: var(--muted); }
.bc-start-error { border-style: solid; border-color: color-mix(in srgb, var(--bc-fail) 35%, var(--line)); }
.bc-start-art { display: flex; align-items: flex-end; gap: 5px; height: 40px; }
.bc-start-art span { width: 8px; height: 100%; border-radius: 3px; background: color-mix(in srgb, var(--accent-color) 70%, var(--bg-card)); transform-origin: bottom; }
.bc-start-art span:nth-child(2) { background: var(--bc-month); } .bc-start-art span:nth-child(3) { background: var(--bc-day); }
.bc-examples { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 6px; }
.bc-examples > span { font-size: 12px; color: var(--muted); }
.bc-examples b { font-family: var(--bc-mono); }

/* ---------- Community and coverage ---------- */
.bc-community, .bc-coverage { margin: 0 0 22px; padding: 24px; border: 1px solid var(--line); border-radius: 24px; background: var(--bg-card); }
.bc-section-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px 20px; }
.bc-section-head h2 { margin: 8px 0 6px; font: 400 30px/1.15 var(--studio-serif, Georgia, serif); color: var(--ink); }
.bc-section-head p { max-width: 62ch; margin: 0; font-size: 13.5px; line-height: 1.6; color: var(--muted); }
.bc-community-result:empty { display: none; }
.bc-community-head { margin-top: 16px; }
.bc-community-head h3 { margin: 0; font: 400 21px/1.2 var(--studio-serif, Georgia, serif); color: var(--ink); }
.bc-community-head p { margin: 4px 0 0; font-size: 13px; color: var(--muted); }
.bc-conflict { margin: 12px 0 0; padding: 10px 14px; border-inline-start: 3px solid var(--bc-fail); border-radius: 8px; background: color-mix(in srgb, var(--bc-fail) 7%, var(--bg-card)); font-size: 13px; }
.bc-report-list { display: grid; gap: 10px; margin-top: 12px; }
.bc-report { display: grid; gap: 8px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 16px; background: var(--soft); }
.bc-report[data-agrees=false] { border-color: color-mix(in srgb, var(--bc-fail) 40%, var(--line)); }
.bc-report[data-agrees=true] { border-color: color-mix(in srgb, var(--bc-pass) 35%, var(--line)); }
.bc-report-top { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px; }
.bc-report-top strong { font: 400 22px/1.2 var(--studio-serif, Georgia, serif); color: var(--ink); }
.bc-report-top span { font-size: 11.5px; font-weight: 650; color: var(--muted); }
.bc-report[data-agrees=false] .bc-report-top span { color: var(--bc-fail); }
.bc-report[data-agrees=true] .bc-report-top span { color: var(--bc-pass); }
.bc-report p { margin: 0; font-size: 13px; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; color: var(--text); }
.bc-report-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 11.5px; color: var(--muted); }
.bc-report-meta a { color: var(--muted); text-decoration: underline dotted; text-underline-offset: 3px; }
.bc-report .secondary { justify-self: start; }
.bc-evidence { margin-top: 16px; border: 1px solid var(--line); border-radius: 16px; }
.bc-evidence summary { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 12px; padding: 14px 16px; cursor: pointer; font-size: 14px; font-weight: 600; color: var(--ink); }
.bc-evidence summary small { font-size: 12px; font-weight: 500; color: var(--muted); }
.bc-evidence > p { margin: 0 16px; font-size: 12.5px; line-height: 1.55; color: var(--muted); }
.bc-evidence-form { display: grid; gap: 12px; padding: 14px 16px 16px; }
.bc-evidence-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.bc-coverage-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.bc-seg { display: inline-flex; gap: 2px; padding: 3px; border: 1px solid var(--line); border-radius: 12px; background: var(--soft); }
.bc-seg button { min-height: 32px; padding: 5px 12px; border: 0; border-radius: 9px; background: transparent; color: var(--muted); font: inherit; font-size: 12.5px; font-weight: 500; cursor: pointer; }
.bc-seg button[aria-pressed=true] { background: var(--bg-card); color: var(--ink); box-shadow: 0 1px 3px var(--shadow), 0 0 0 1px var(--line); }
.bc-coverage-search { display: flex; align-items: center; gap: 8px; min-height: 38px; padding: 0 12px; border: 1px solid var(--line); border-radius: 11px; background: var(--bg-card); }
.bc-coverage-search:focus-within { border-color: var(--accent-color); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-color) 14%, transparent); }
.bc-coverage-search svg { width: 16px; height: 16px; fill: none; stroke: var(--muted); stroke-width: 1.8; stroke-linecap: round; }
.bc-coverage-search input { width: 160px; min-width: 0; padding: 7px 0; border: 0; outline: none; background: transparent; color: var(--ink); font: inherit; font-size: 13px; }
.bc-coverage-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(178px, 1fr)); gap: 8px; margin-top: 16px; }
.bc-house { display: grid; justify-items: start; gap: 3px; min-width: 0; padding: 12px 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--bg-card); color: var(--ink); font: inherit; text-align: start; cursor: pointer; transition: transform .18s, border-color .18s, box-shadow .18s; }
.bc-house:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--accent-color) 40%, var(--line)); box-shadow: 0 8px 20px var(--shadow); }
.bc-house strong { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13.5px; }
.bc-house span { font-size: 11.5px; font-weight: 650; color: var(--accent-color); }
.bc-house[data-cap=date] span { color: var(--bc-year); }
.bc-house small { font-size: 11px; color: var(--muted); }
.bc-empty { grid-column: 1 / -1; margin: 0; padding: 20px; text-align: center; color: var(--muted); }
.bc-method { margin: 0 0 30px; padding: 16px 20px; border: 1px solid var(--line); border-radius: 16px; background: var(--soft); }
.bc-method summary { font-size: 14px; font-weight: 600; color: var(--ink); cursor: pointer; }
.bc-method p { max-width: 82ch; margin: 10px 0 0; font-size: 13px; line-height: 1.65; color: var(--muted); }
.bc-method strong { color: var(--ink); }

/* ---------- Motion ---------- */
@media (prefers-reduced-motion: no-preference) {
  :root:not([data-motion=off]) #panel-batches .bc-hero-beam { animation: bc-beam 4.5s ease-in-out infinite; }
  :root:not([data-motion=off]) #panel-batches .bc-hero-label b { animation: bc-hero-char 4.5s ease-in-out infinite; animation-delay: calc(var(--i) * .32s); }
  :root:not([data-motion=off]) #panel-batches .bc-tile[data-new] { animation: bc-tile-in .45s cubic-bezier(.2, .8, .2, 1.15) both; animation-delay: calc(var(--i) * 30ms); }
  :root:not([data-motion=off]) #panel-batches .bc-plate[data-scan]::after { animation: bc-scan 1s ease-out; }
  :root:not([data-motion=off]) #panel-batches .bc-card { animation: bc-rise .5s cubic-bezier(.2, .8, .2, 1) both; }
  :root:not([data-motion=off]) #panel-batches .bc-auth { animation-delay: .08s; }
  :root:not([data-motion=off]) #panel-batches .bc-check { animation: bc-rise .45s cubic-bezier(.2, .8, .2, 1) both; animation-delay: calc(.12s + var(--i) * 45ms); }
  :root:not([data-motion=off]) #panel-batches .bc-ring g circle { animation: bc-seg .55s ease-out both; animation-delay: calc(.1s + var(--i) * 55ms); }
  :root:not([data-motion=off]) #panel-batches .bc-dates li { animation: bc-pop .5s cubic-bezier(.2, .8, .2, 1.2) both; animation-delay: calc(var(--i) * 70ms); }
  :root:not([data-motion=off]) #panel-batches .bc-axis-dot { animation: bc-pop .5s cubic-bezier(.2, .8, .2, 1.3) both; animation-delay: calc(.25s + var(--i) * 90ms); }
  :root:not([data-motion=off]) #panel-batches .bc-report { animation: bc-rise .45s ease both; animation-delay: calc(var(--i) * 60ms); }
  :root:not([data-motion=off]) #panel-batches .bc-start-art span { animation: bc-bars 1.6s ease-in-out infinite; }
  :root:not([data-motion=off]) #panel-batches .bc-start-art span:nth-child(2) { animation-delay: .2s; }
  :root:not([data-motion=off]) #panel-batches .bc-start-art span:nth-child(3) { animation-delay: .4s; }
  :root:not([data-motion=off]) #panel-batches .bc-group-body { animation: bc-rise .3s ease both; }
}
@keyframes bc-beam { 0% { left: -40%; } 55%, 100% { left: 110%; } }
@keyframes bc-hero-char { 0%, 62%, 100% { transform: none; background: transparent; } 8%, 18% { transform: translateY(-3px); background: color-mix(in srgb, var(--c) 16%, transparent); } }
@keyframes bc-tile-in { from { opacity: 0; transform: translateY(8px) rotateX(-70deg); } to { opacity: 1; transform: none; } }
@keyframes bc-scan { from { transform: translateX(-110%); } to { transform: translateX(110%); } }
@keyframes bc-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes bc-pop { from { opacity: 0; transform: scale(.85); } to { opacity: 1; transform: none; } }
@keyframes bc-seg { from { opacity: 0; stroke-width: 2; } to { opacity: 1; stroke-width: 7; } }
@keyframes bc-bars { 0%, 100% { transform: scaleY(.35); } 50% { transform: scaleY(1); } }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
  .bc-console { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 820px) {
  .bc-hero { grid-template-columns: minmax(0, 1fr); }
  .bc-hero-plate { min-height: 0; padding: 20px; }
  .bc-hero-glass { width: 140px; height: 124px; }
}
@media (max-width: 600px) {
  .bc-panel, .bc-card, .bc-community, .bc-coverage { padding: 16px; border-radius: 20px; }
  .bc-grid { grid-template-columns: minmax(0, 1fr); }
  .bc-input { font-size: 16px; }
  .bc-input-code { font-size: 19px; letter-spacing: .14em; }
  .bc-decode { padding: 0 16px; }
  .bc-tile { width: 28px; height: 38px; font-size: 17px; }
  .bc-auth-head { grid-template-columns: 76px minmax(0, 1fr); gap: 14px; }
  .bc-ring { width: 76px; height: 76px; }
  .bc-card h2, .bc-start h2 { font-size: 24px; }
  .bc-step-hint { display: none; }
  .bc-coverage-tools, .bc-coverage-search { width: 100%; }
  .bc-coverage-search input { width: 100%; }
  .bc-coverage-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.bc-shelf-reminder { margin-top:18px; padding:15px; border:1px solid var(--line); border-radius:12px; background:var(--soft); }
.bc-shelf-reminder > strong { color:var(--ink); font-size:.8rem; }
.bc-shelf-reminder p { color:var(--muted); font-size:.73rem; line-height:1.8; margin:8px 0; overflow-wrap:anywhere; }
.bc-shelf-reminder a { color:var(--accent-color,var(--ink)); font-size:.68rem; }