.compat{scroll-margin-top:7rem}.compat__grid{display:grid;gap:.35rem 2rem;border-radius:1.5rem;border:1px solid var(--color-line, #ece7ea);background:#ffffffb8;padding:1.1rem 1.25rem}@media(min-width:860px){.compat__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.compat__row{display:grid;grid-template-columns:6.5rem 1fr auto;align-items:center;gap:.75rem;padding:.5rem 0}.compat__label{font-size:.95rem;font-weight:600}.compat__bar{display:grid;grid-template-columns:repeat(5,1fr);gap:.3rem}.compat__seg{height:.58rem;border-radius:999px;background:#2b1f2714}.compat__score{min-width:2.2rem;text-align:right;font-size:.9rem;font-weight:700}.compat__seg.is-love{background:#e0507a}.compat__seg.is-friend{background:#e5a23c}.compat__seg.is-work{background:#7a5be0}.compat__seg.is-intimacy{background:#d6456d}.compat__seg.is-money{background:#3f9d6b}.compat__seg.is-kids{background:#4b8fd1}.compat__seg.is-home{background:#5867dc}.compat__seg.is-character{background:#b26b12}.compat__note{grid-column:1 / -1;margin-top:-.15rem;font-size:.78rem;line-height:1.4;color:var(--color-muted, #6b6675)}.compat__row.is-empty .compat__label,.compat__row.is-empty .compat__score{color:var(--color-muted, #6b6675);font-weight:600}.compat__row.is-empty .compat__seg{background:#2b1f270f}.compat--v2 .compat__grid{gap:1rem 2.5rem;border:1px solid var(--color-line);border-radius:var(--radius-card);background:var(--color-card);box-shadow:var(--shadow-card);padding:1.75rem}@media(min-width:860px){.compat--v2 .compat__grid{grid-template-columns:1fr 1fr}}.compat--v2 .compat__row{grid-template-columns:7.5rem 1fr auto;gap:.25rem .625rem;padding:0}.compat--v2 .compat__label{font-size:.875rem;font-weight:500}.compat--v2 .compat__bar{gap:.25rem}.compat--v2 .compat__seg{height:.5rem;border-radius:4px;background:var(--color-line)}.compat--v2 .compat__seg.is-on{background:var(--color-accent-text)}.compat--v2 .compat__score{min-width:1.75rem;font-size:.875rem;font-weight:500;color:var(--color-muted)}.compat--v2 .compat__note{margin-top:0;font-size:.75rem;font-weight:500;color:var(--color-faint)}@media(max-width:767px){.compat--v2 .compat__grid{padding:1.125rem}.compat--v2 .compat__row{grid-template-columns:6rem 1fr auto}}
