*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; line-height: 1.6; color: #1a1a1a; background: #fafafa; }
.container { max-width: 800px; margin: 0 auto; padding: 0 1.5rem; }
header { background: #fff; border-bottom: 1px solid #e5e5e5; padding: 1rem 0; }
.logo { font-size: 1.5rem; font-weight: 700; color: #1a1a1a; text-decoration: none; letter-spacing: -0.02em; }
main { padding: 2rem 0; }
footer { border-top: 1px solid #e5e5e5; padding: 1.5rem 0; margin-top: 3rem; color: #666; font-size: 0.875rem; }

h1 { font-size: 1.75rem; font-weight: 700; margin-bottom: 0.5rem; }
h2 { font-size: 1.25rem; font-weight: 600; margin-top: 1.5rem; margin-bottom: 0.75rem; color: #333; }

.badge { display: inline-block; padding: 0.25rem 0.75rem; border-radius: 9999px; font-size: 0.75rem; font-weight: 600; text-transform: uppercase; }
.badge-active { background: #dcfce7; color: #166534; }
.badge-inactive { background: #fee2e2; color: #991b1b; }

.specs-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem; margin: 1.5rem 0; }
.spec-card { background: #fff; border: 1px solid #e5e5e5; border-radius: 8px; padding: 1rem; }
.spec-label { font-size: 0.75rem; color: #666; text-transform: uppercase; letter-spacing: 0.05em; }
.spec-value { font-size: 1.125rem; font-weight: 600; margin-top: 0.25rem; }

.tag { display: inline-block; padding: 0.25rem 0.5rem; background: #f3f4f6; border: 1px solid #e5e5e5; border-radius: 4px; font-size: 0.8125rem; margin: 0.125rem; }

.cost-callout { background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 8px; padding: 1.25rem; margin: 1.5rem 0; }
.cost-amount { font-size: 1.5rem; font-weight: 700; color: #1e40af; }

.claim-banner { background: #fefce8; border: 1px solid #fde68a; border-radius: 8px; padding: 1.25rem; margin: 2rem 0; }

.listing-card { background: #fff; border: 1px solid #e5e5e5; border-radius: 8px; padding: 1.25rem; margin-bottom: 1rem; text-decoration: none; display: block; color: inherit; transition: border-color 0.15s; }
.listing-card:hover { border-color: #3b82f6; }
.listing-card-title { font-size: 1.0625rem; font-weight: 600; margin-top: 0; margin-bottom: 0.25rem; color: #1a1a1a; }
.listing-meta { font-size: 0.875rem; color: #666; }

.pagination { display: flex; justify-content: center; gap: 0.5rem; margin-top: 2rem; }
.pagination a { padding: 0.5rem 1rem; border: 1px solid #e5e5e5; border-radius: 4px; text-decoration: none; color: #333; }
.pagination a:hover { background: #f3f4f6; }

.breadcrumb { font-size: 0.875rem; color: #666; margin-bottom: 1rem; }
.breadcrumb a { color: #3b82f6; text-decoration: none; }
.breadcrumb a:hover { text-decoration: underline; }

.subtitle { color: #666; font-size: 1rem; margin-bottom: 0.75rem; }

.summary { color: #374151; font-size: 0.95rem; line-height: 1.7; margin: 1.25rem 0; padding: 1rem 1.25rem; background: #fff; border-left: 3px solid #3b82f6; border-radius: 0 8px 8px 0; }

.cost-label { font-size: 0.875rem; font-weight: 400; color: #1e40af; }
.cost-note { font-size: 0.8125rem; color: #6b7280; margin-top: 0.5rem; }

.source-note { background: #f9fafb; border: 1px solid #e5e5e5; border-radius: 8px; padding: 1rem 1.25rem; margin-top: 2rem; font-size: 0.8125rem; color: #6b7280; }
.source-note strong { color: #374151; }

.agent-note { position: absolute; left: -9999px; height: 1px; width: 1px; overflow: hidden; }

.star-rating { margin: 0.75rem 0; display: flex; align-items: center; gap: 0.125rem; }
.star { font-size: 1.5rem; color: #d1d5db; }
.star-filled { color: #f59e0b; }
.rating-label { margin-left: 0.5rem; font-size: 0.875rem; color: #666; }

.rating-1, .rating-2 { color: #dc2626; }
.rating-3 { color: #d97706; }
.rating-4, .rating-5 { color: #16a34a; }

.fines-callout { background: #fef2f2; border: 1px solid #fecaca; border-radius: 8px; padding: 1.25rem; margin: 1.5rem 0; }
.fine-amount { font-size: 1.5rem; font-weight: 700; color: #dc2626; }
.fine-label { font-size: 0.875rem; color: #991b1b; margin-top: 0.25rem; }

.clean-record { background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 8px; padding: 1rem 1.25rem; margin: 1.5rem 0; color: #166534; font-size: 0.9375rem; }

/* City index — summary */
.city-summary { background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 8px; padding: 1rem 1.25rem; margin: 1rem 0 1.5rem; font-size: 0.9375rem; color: #1e3a5f; }

/* City index — enriched listing cards */
.listing-card-enriched { background: #fff; border: 1px solid #e5e5e5; border-radius: 8px; padding: 1.25rem; margin-bottom: 1rem; transition: border-color 0.15s; }
.listing-card-enriched:hover { border-color: #3b82f6; }
.listing-card-header { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.listing-card-name { font-size: 1.0625rem; font-weight: 600; color: #1a1a1a; text-decoration: none; }
.listing-card-name:hover { text-decoration: underline; color: #3b82f6; }
.badge-medicaid { background: #dbeafe; color: #1e40af; }
.listing-card-ratings { margin-top: 0.5rem; }
.star-sm { font-size: 1.125rem; color: #d1d5db; }
.star-sm.star-filled { color: #f59e0b; }
.rating-text { font-size: 0.8125rem; color: #666; margin-left: 0.25rem; }
.listing-card-details { display: flex; flex-wrap: wrap; gap: 0.375rem; margin-top: 0.5rem; }
.detail-chip { display: inline-block; padding: 0.2rem 0.5rem; background: #f3f4f6; border: 1px solid #e5e5e5; border-radius: 4px; font-size: 0.8125rem; color: #374151; }
.chip-fines { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.chip-clean { background: #f0fdf4; border-color: #bbf7d0; color: #166534; }

/* Detail page — risk summary boxes */
.risk-box { border-radius: 8px; padding: 1rem 1.25rem; margin: 1rem 0; font-size: 0.9375rem; }
.risk-high { background: #fef2f2; border: 1px solid #fca5a5; color: #991b1b; }
.risk-moderate { background: #fff7ed; border: 1px solid #fed7aa; color: #9a3412; }
.risk-good { background: #f0fdf4; border: 1px solid #bbf7d0; color: #166534; }
.risk-clean { background: #ecfdf5; border: 1px solid #6ee7b7; color: #065f46; }

/* Detail page — section intro text */
.section-intro { font-size: 0.875rem; color: #6b7280; margin-bottom: 0.75rem; line-height: 1.6; }

/* Detail page — staffing comparison */
.spec-compare { font-size: 0.75rem; color: #6b7280; margin-top: 0.25rem; }

/* Detail page — deficiency history */
.deficiency-summary { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1rem; }
.deficiency-list { display: flex; flex-direction: column; gap: 0.75rem; }
.deficiency-item { background: #fff; border: 1px solid #e5e5e5; border-radius: 8px; padding: 1rem; }
.deficiency-header { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.5rem; }
.deficiency-date { font-size: 0.8125rem; font-weight: 600; color: #374151; }
.deficiency-tag { font-size: 0.75rem; color: #6b7280; }
.deficiency-desc { font-size: 0.875rem; color: #4b5563; line-height: 1.6; }
.severity-badge { display: inline-block; padding: 0.125rem 0.5rem; border-radius: 4px; font-size: 0.75rem; font-weight: 600; }
.severity-critical { background: #fef2f2; color: #dc2626; border: 1px solid #fca5a5; }
.severity-harm { background: #fff7ed; color: #ea580c; border: 1px solid #fed7aa; }
.severity-potential { background: #fffbeb; color: #d97706; border: 1px solid #fde68a; }
.severity-minor { background: #f3f4f6; color: #6b7280; border: 1px solid #e5e5e5; }

/* Detail page — chain callout */
.chain-callout { background: #f5f3ff; border: 1px solid #ddd6fe; border-radius: 8px; padding: 1rem 1.25rem; margin: 1rem 0; font-size: 0.9375rem; color: #5b21b6; }

/* Detail page — CMS methodology collapsible */
.cms-methodology { background: #f9fafb; border: 1px solid #e5e5e5; border-radius: 8px; padding: 1rem 1.25rem; margin-top: 2rem; font-size: 0.875rem; color: #4b5563; }
.cms-methodology summary { cursor: pointer; font-weight: 600; color: #374151; }
.cms-methodology p, .cms-methodology ul { margin-top: 0.75rem; line-height: 1.6; }
.cms-methodology ul { padding-left: 1.25rem; }
.cms-methodology li { margin-bottom: 0.5rem; }
.cms-methodology a { color: #3b82f6; text-decoration: none; }
.cms-methodology a:hover { text-decoration: underline; }