/* Live catalog comparison; shared VRealm design tokens. */
#vr-compare-app { min-width: 0; max-width: 100%; color: var(--text); font-family: var(--font-ui); }
.vrc-page-intro { margin: 0 0 28px; }
.vrc-page-intro h1 { margin: 0 0 14px; font-size: clamp(2rem,4.8vw,3.8rem); line-height: 1.08; letter-spacing: -.055em; }
.vrc-page-intro p { max-width: 780px; color: var(--muted); line-height: 1.65; }
.vrc-catalog-links { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0; }
.vr-device-form { padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.vr-device-form > label { display: grid; gap: 8px; max-width: 420px; color: var(--muted); font-size: .85rem; }
.vr-device-form select { width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid var(--line-strong); border-radius: 9px; background: var(--surface-deep); color: var(--text); font: inherit; }
.vr-device-form fieldset { min-width: 0; margin: 22px 0; padding: 0; border: 0; }
.vr-device-form legend { margin-bottom: 12px; color: var(--muted); font-size: .85rem; }
.vr-device-options { display: flex; flex-wrap: wrap; gap: 8px; }
.vr-device-options label { max-width: 100%; overflow-wrap: anywhere; }
.vr-device-options input { flex: 0 0 auto; }
.vr-device-form > button { margin: 0 8px 4px 0; }
.vr-device-form > button[type="submit"] { background: var(--accent); color: var(--bg); }
.vr-device-form > button:disabled { opacity: .5; cursor: not-allowed; }
.vr-compare-results { min-width: 0; margin-top: 28px; }
.vr-compare-scroll { max-width: 100%; overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius); }
.vr-compare-scroll:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
.vr-compare-table { width: 100%; min-width: 650px; table-layout: fixed; border-collapse: separate; border-spacing: 0; background: var(--surface); font: .86rem/1.6 var(--font-ui); }
.vr-compare-table caption { padding: 15px 20px; color: var(--muted); text-align: left; background: var(--surface-deep); }
.vr-compare-table th, .vr-compare-table td { min-width: 170px; padding: 18px; border-bottom: 1px solid var(--line); border-right: 1px solid var(--line); text-align: left; vertical-align: top; overflow-wrap: anywhere; }
.vr-compare-table th { font-weight: 600; background: var(--surface-2); }
.vr-compare-table th:first-child { width: 170px; }
.vr-compare-table tbody th { color: var(--muted); font-size: .8rem; }
.vr-compare-table thead th:not(:first-child) { font-size: 1.1rem; }
.vr-compare-table th img { display: block; width: 100%; height: 130px; margin-bottom: 14px; object-fit: contain; border-radius: 8px; background: var(--surface-deep); }
.vr-compare-table td { color: var(--muted); }
.vr-compare-table tr > :last-child { border-right: 0; }
.vr-compare-table tbody tr:last-child > * { border-bottom: 0; }
@media(max-width: 580px) { .vr-device-form { padding: 16px; } .vr-device-options { display: grid; } .vr-compare-table th, .vr-compare-table td { padding: 12px; } }