.join-grain{min-width:0;color:var(--text-primary);gap:16px;display:grid;container:join-grain/inline-size}.join-grain__intro,.join-grain__panel,.join-grain__assessment,.join-grain__diagnosis,.join-grain__comparison,.join-grain__details{border:1px solid var(--diagram-border);border-radius:var(--radius-section,14px);background:var(--diagram-surface);min-width:0}.join-grain__intro{padding:18px 20px}.join-grain__eyebrow{color:var(--diagram-accent);letter-spacing:.08em;text-transform:uppercase;font-size:10px;font-weight:850;display:block}.join-grain__intro h2,.join-grain__assessment h3,.join-grain__diagnosis h3,.join-grain__section-heading h3{color:var(--text-primary);margin:4px 0 0;font-size:18px;line-height:1.35}.join-grain__intro p,.join-grain__assessment-heading>p,.join-grain__diagnosis li,.join-grain__section-heading p{color:var(--text-secondary);margin:8px 0 0;font-size:12px;line-height:1.65}.join-grain__controls{border:1px solid var(--diagram-border);border-radius:var(--radius-section,14px);background:var(--surface-1);gap:14px;min-width:0;margin:0;padding:16px;display:grid}.join-grain__controls>legend,.join-grain__join-type>legend,.join-grain__overrides>legend,.join-grain__repairs>legend{color:var(--text-primary);padding:0 6px;font-size:12px;font-weight:850}.join-grain__parameter-grid,.join-grain__override-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;min-width:0;display:grid}.join-grain__field{min-width:0;color:var(--text-secondary);gap:6px;font-size:11px;font-weight:750;display:grid}.join-grain__field select{border:1px solid var(--border-strong);border-radius:var(--radius-control,8px);background:var(--surface-1);width:100%;min-width:0;min-height:38px;color:var(--text-primary);font:inherit;padding:7px 9px}.join-grain__join-type,.join-grain__overrides,.join-grain__repairs{border:1px solid var(--border);border-radius:var(--radius-control,8px);gap:9px;min-width:0;margin:0;padding:10px 12px 12px;display:grid}.join-grain__join-type label,.join-grain__repairs label{min-width:0;color:var(--text-primary);cursor:pointer;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:3px 9px;font-size:12px;font-weight:800;display:grid}.join-grain__join-type input,.join-grain__repairs input{width:16px;height:16px;accent-color:var(--diagram-accent);margin:1px 0 0}.join-grain__join-type label small,.join-grain__repairs label small{color:var(--text-muted);grid-column:2;font-size:10px;font-weight:500;line-height:1.55}.join-grain__overrides>p{color:var(--text-muted);margin:0;font-size:10px;line-height:1.5}.join-grain__actions{flex-wrap:wrap;gap:8px;display:flex}.join-grain__button{border:1px solid var(--border-strong);border-radius:var(--radius-control,8px);background:var(--surface-1);min-height:36px;color:var(--text-secondary);font:inherit;cursor:pointer;padding:7px 12px;font-size:11px;font-weight:800}.join-grain__button:hover{border-color:var(--diagram-accent);color:var(--diagram-accent)}.join-grain__button--primary{border-color:var(--button-primary-bg);background:var(--button-primary-bg);color:var(--button-primary-text)}.join-grain__button--primary:hover{border-color:var(--button-primary-hover-bg);background:var(--button-primary-hover-bg);color:var(--button-primary-text)}.join-grain__button:focus-visible,.join-grain__field select:focus-visible,.join-grain__join-type input:focus-visible,.join-grain__repairs input:focus-visible,.join-grain__table-scroll:focus-visible,.join-grain__details summary:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}.join-grain__live-status{border-left:4px solid var(--diagram-accent);border-radius:0 var(--radius-control,8px) var(--radius-control,8px) 0;background:var(--diagram-accent-soft);color:var(--text-primary);margin:0;padding:10px 13px;font-size:11px;font-weight:750;line-height:1.6}.join-grain__assessment{border-left:4px solid var(--warning-text);background:var(--warning-bg);gap:12px;padding:15px;display:grid}.join-grain__assessment[data-result=matches-target]{border-left-color:var(--success-text);background:var(--success-bg)}.join-grain__assessment-heading{flex-wrap:wrap;justify-content:space-between;align-items:start;gap:5px 18px;display:flex}.join-grain__assessment-heading>p{max-width:440px;margin-top:0}.join-grain__assessment[data-result=matches-target] .join-grain__eyebrow{color:var(--success-text)}.join-grain__assessment[data-result=differs-from-target] .join-grain__eyebrow{color:var(--warning-text)}.join-grain__check-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.join-grain__check{border:1px solid var(--border);border-radius:var(--radius-control,8px);background:var(--surface-1);min-width:0;padding:10px}.join-grain__check>div{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:5px;display:flex}.join-grain__check strong{color:var(--text-primary);font-size:11px}.join-grain__check p{color:var(--text-secondary);overflow-wrap:anywhere;margin:7px 0 0;font-size:10px;line-height:1.5}.join-grain__status{border:1px solid var(--warning-border);background:var(--warning-bg);color:var(--warning-text);white-space:nowrap;border-radius:999px;align-items:center;padding:2px 7px;font-size:9px;font-weight:850;display:inline-flex}.join-grain__status[data-status=match]{border-color:var(--success-border);background:var(--success-bg);color:var(--success-text)}.join-grain__diagnosis{border-left:4px solid var(--warning-text);background:var(--warning-bg);grid-template-columns:minmax(170px,.7fr) minmax(0,1.3fr);gap:12px;padding:14px 16px;display:grid}.join-grain__diagnosis h3{font-size:15px}.join-grain__diagnosis ul{gap:5px;margin:0;padding-left:18px;display:grid}.join-grain__diagnosis li{color:var(--text-secondary);margin:0}.join-grain__input-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:12px;min-width:0;display:grid}.join-grain__panel{gap:10px;padding:13px;display:grid}.join-grain__panel-heading h3,.join-grain__section-heading h3{color:var(--text-primary);margin:0;font-size:14px;line-height:1.4}.join-grain__panel-heading p,.join-grain__section-heading p{color:var(--text-muted);margin:4px 0 0;font-size:10px;line-height:1.5}.join-grain__table-scroll{overscroll-behavior-inline:contain;border-radius:var(--radius-control,8px);min-width:0;max-width:100%;overflow:auto}.join-grain__table{border:1px solid var(--diagram-border);border-collapse:separate;border-spacing:0;background:var(--diagram-surface);width:100%;min-width:470px;color:var(--text-secondary);font-size:11px;line-height:1.45}.join-grain__table caption{border:1px solid var(--diagram-border);background:var(--surface-2);color:var(--text-secondary);text-align:left;border-bottom:0;padding:8px 10px;font-size:10px;font-weight:750}.join-grain__table th,.join-grain__table td{border-right:1px solid var(--border);border-bottom:1px solid var(--border);text-align:left;vertical-align:top;padding:7px 9px}.join-grain__table tr>:last-child{border-right:0}.join-grain__table tbody tr:last-child>*{border-bottom:0}.join-grain__table thead th,.join-grain__table tfoot th,.join-grain__table tfoot td{background:var(--surface-2);color:var(--text-primary);white-space:nowrap;font-size:10px;font-weight:800}.join-grain__table tbody th{color:var(--text-primary);font-weight:800}.join-grain__table code{color:var(--text-primary);overflow-wrap:anywhere;font-size:10px}.join-grain__row-state,.join-grain__relation{border:1px solid var(--border);background:var(--surface-2);color:var(--text-secondary);white-space:nowrap;border-radius:999px;align-items:center;padding:2px 6px;font-size:9px;font-weight:750;display:inline-flex}.join-grain__row-state[data-state=filtered]{border-color:var(--warning-border);background:var(--warning-bg);color:var(--warning-text)}.join-grain__relation[data-relation="1:1"]{border-color:var(--success-border);background:var(--success-bg);color:var(--success-text)}.join-grain__relation[data-relation="1:N"],.join-grain__relation[data-relation=N\:1],.join-grain__relation[data-relation=N\:M]{border-color:var(--warning-border);background:var(--warning-bg);color:var(--warning-text)}.join-grain__relation[data-relation=unmatched]{border-color:var(--danger-border);background:var(--danger-bg);color:var(--danger-text)}.join-grain__table--ledger{min-width:680px}.join-grain__table tfoot tr>*{border-bottom:0}.join-grain__table td[data-delta="1"]{color:var(--danger-text);font-weight:800}.join-grain__table td[data-delta="-1"]{color:var(--warning-text);font-weight:800}.join-grain__empty-cell,.join-grain__empty{color:var(--text-muted);padding:12px;font-size:11px}.join-grain__details{padding:12px 14px}.join-grain__details summary{color:var(--text-primary);cursor:pointer;font-size:12px;font-weight:850}.join-grain__details[open] summary{margin-bottom:10px}.join-grain__details pre{border:1px solid var(--border-strong);border-radius:var(--radius-control,8px);background:var(--code-bg);max-width:100%;color:var(--code-text);tab-size:2;margin:0;padding:13px;font-size:11px;line-height:1.6;overflow:auto}.join-grain__details>p{color:var(--text-secondary);margin:0 0 9px;font-size:10px;line-height:1.55}.join-grain__comparison{gap:12px;padding:14px;display:grid}.join-grain__section-heading{flex-wrap:wrap;justify-content:space-between;align-items:start;gap:8px;display:flex}.join-grain__comparison-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.join-grain__comparison-card{border:1px solid var(--border);border-radius:var(--radius-control,8px);background:var(--surface-1);align-content:start;gap:6px;min-width:0;padding:11px;display:grid}.join-grain__comparison-card[data-current=true]{border-color:var(--diagram-accent);box-shadow:inset 0 0 0 1px var(--diagram-accent)}.join-grain__comparison-card h4{color:var(--text-primary);margin:0;font-size:11px}.join-grain__comparison-card p{color:var(--text-secondary);overflow-wrap:anywhere;margin:0;font-size:10px;line-height:1.5}@container join-grain (width<=760px){.join-grain__check-grid,.join-grain__comparison-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.join-grain__diagnosis{grid-template-columns:1fr}}@container join-grain (width<=620px){.join-grain__parameter-grid,.join-grain__override-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.join-grain__input-grid{grid-template-columns:1fr}.join-grain__intro{padding:15px}}@container join-grain (width<=420px){.join-grain{gap:12px}.join-grain__controls{padding:12px}.join-grain__parameter-grid,.join-grain__override-grid,.join-grain__check-grid,.join-grain__comparison-grid{grid-template-columns:1fr}.join-grain__join-type label,.join-grain__repairs label{font-size:11px}.join-grain__assessment,.join-grain__diagnosis,.join-grain__panel{padding:11px}.join-grain__assessment-heading>p{margin-top:6px}.join-grain__actions .join-grain__button{flex:100%}}