.occ-r { --r-accent: var(--occ-primary, #2563eb);
--r-accent-soft: #eff6ff;
--r-ink: #111827;
--r-muted: #6b7280;
--r-faint: #9ca3af;
--r-line: #e5e7eb;
--r-card: #ffffff;
--r-ground: #f8fafc;
--r-good: #16a34a;
--r-good-soft: #ecfdf5;
--r-warn: #d97706;
--r-warn-soft: #fffbeb;
--r-bad: #dc2626;
--r-bad-soft: #fef2f2;
--r-lock: #7c3aed;
--r-lock-soft: #f5f3ff;
--r-radius: 12px; width: 100%;
max-width: none;
margin: 0;
padding: 0;
color: var(--r-ink);
font-size: 16px;
line-height: 1.55;
-webkit-text-size-adjust: 100%;
}
.occ-r *,
.occ-r *::before,
.occ-r *::after { box-sizing: border-box; }
.occ-r a { color: var(--r-accent); }
.occ-r :focus-visible { outline: 3px solid var(--r-accent); outline-offset: 2px; border-radius: 4px; }
.occ-r-visually-hidden {
position: absolute !important;
width: 1px; height: 1px;
margin: -1px; padding: 0; border: 0;
clip: rect(0 0 0 0); overflow: hidden; white-space: nowrap;
} .occ-r-section {
background: var(--r-card);
border: 1px solid var(--r-line);
border-radius: var(--r-radius);
padding: 18px 16px;
margin: 0 0 16px;
scroll-margin-top: 64px; max-width: 100%;
overflow-x: hidden; overflow-x: clip; overflow-wrap: anywhere; }
.occ-r-sec-head {
display: flex;
align-items: flex-start;
gap: 12px;
margin-bottom: 14px;
flex-wrap: wrap;
}
.occ-r-sec-icon {
flex: none;
width: 40px; height: 40px;
display: grid; place-items: center;
border-radius: 10px;
background: var(--r-accent-soft);
color: var(--r-accent);
font-size: 17px;
}
.occ-r-sec-title { flex: 1; min-width: 180px; }
.occ-r-sec-title h2 {
margin: 0;
font-size: clamp(1.15rem, 2.5vw, 1.35rem);
line-height: 1.25;
text-wrap: balance;
}
.occ-r-sec-title p { margin: 2px 0 0; font-size: 0.85rem; color: var(--r-muted); }
.occ-r-subhead { font-size: 1rem; margin: 20px 0 10px; }
.occ-r-hint { font-size: 0.85rem; color: var(--r-muted); margin: 8px 0; }
.occ-r-na { color: var(--r-faint); } .occ-r-badge {
display: inline-flex; align-items: center; gap: 6px;
font-size: 0.75rem; font-weight: 700;
padding: 5px 10px; border-radius: 999px;
white-space: nowrap;
}
.occ-r-badge--good { background: var(--r-good-soft); color: var(--r-good); }
.occ-r-badge--warn { background: var(--r-warn-soft); color: var(--r-warn); }
.occ-r-badge--bad { background: var(--r-bad-soft); color: var(--r-bad); }
.occ-r-badge--info { background: var(--r-accent-soft); color: var(--r-accent); }
.occ-r-badge--locked { background: var(--r-lock-soft); color: var(--r-lock); }
.occ-r-state { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; font-size: 0.92rem; }
.occ-r-state--clear { color: var(--r-good); }
.occ-r-state--found { color: var(--r-bad); }
.occ-r-state--na { color: var(--r-faint); font-weight: 500; } .occ-r-verdict {
background: linear-gradient(135deg, #0f172a 0%, #1e3a5f 100%);
color: #fff;
border: none;
}
.occ-r-verdict-meta {
display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap;
font-size: 0.75rem; color: rgba(255, 255, 255, 0.65);
margin-bottom: 14px;
}
.occ-r-verdict-main { display: flex; flex-direction: column; gap: 20px; }
.occ-r-plate {
display: inline-block;
background: #fbbf24;
color: #111827;
font-weight: 800;
font-size: clamp(1.15rem, 4.5vw, 1.5rem);
letter-spacing: 0.06em;
padding: 4px 14px;
border-radius: 6px;
border: 1px solid rgba(0, 0, 0, 0.3);
font-family: "Arial Narrow", Arial, sans-serif;
}
.occ-r-verdict h1 {
margin: 10px 0 8px;
font-size: clamp(1.35rem, 4.5vw, 1.9rem);
line-height: 1.2;
color: #fff;
text-wrap: balance;
}
.occ-r-chips { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; }
.occ-r-chips li {
display: inline-flex; align-items: center; gap: 6px;
font-size: 0.82rem;
background: rgba(255, 255, 255, 0.12);
padding: 5px 11px; border-radius: 999px;
}
.occ-r-photo {
display: block;
max-width: 260px; width: 100%;
border-radius: 10px;
margin-top: 14px;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
}
.occ-r-verdict-score { text-align: center; }
.occ-r-ring { position: relative; width: 120px; height: 120px; margin: 0 auto; background: #fff; border-radius: 50%; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25); }
.occ-r-ring-track { stroke: #e5e7eb; }
.occ-r-ring svg { transform: rotate(-90deg); display: block; }
.occ-r-ring-num {
position: absolute; inset: 0;
display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.occ-r-ring-num strong { font-size: 2rem; line-height: 1; font-variant-numeric: tabular-nums; }
.occ-r-ring-num span { font-size: 0.65rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--r-muted); }
.occ-r-verdict-pill {
display: inline-block; margin-top: 10px;
background: #fff; padding: 6px 16px; border-radius: 999px;
font-size: 0.85rem; font-weight: 700;
}
.occ-r-verdict-note { margin-top: 8px; font-size: 0.72rem; color: rgba(255, 255, 255, 0.8); }
.occ-r-verdict--low .occ-r-ring-bar, .occ-r-verdict--low .occ-r-ring-num strong { stroke: var(--r-good); color: var(--r-good); }
.occ-r-verdict--low .occ-r-verdict-pill { color: var(--r-good); }
.occ-r-verdict--medium .occ-r-ring-bar, .occ-r-verdict--medium .occ-r-ring-num strong { stroke: var(--r-warn); color: var(--r-warn); }
.occ-r-verdict--medium .occ-r-verdict-pill { color: var(--r-warn); }
.occ-r-verdict--high .occ-r-ring-bar, .occ-r-verdict--high .occ-r-ring-num strong { stroke: var(--r-bad); color: var(--r-bad); }
.occ-r-verdict--high .occ-r-verdict-pill { color: var(--r-bad); }
.occ-r-verdict--unknown .occ-r-ring-num strong { color: var(--r-faint); }
.occ-r-verdict--unknown .occ-r-verdict-pill { color: var(--r-faint); } .occ-r-riskdetail { margin-top: 18px; background: rgba(255, 255, 255, 0.07); border-radius: 10px; }
.occ-r-riskdetail > summary {
cursor: pointer;
padding: 12px 14px;
font-weight: 600; font-size: 0.9rem;
display: flex; align-items: center; gap: 8px;
list-style: none;
}
.occ-r-riskdetail > summary::-webkit-details-marker { display: none; }
.occ-r-riskdetail > summary::after { content: "▾"; margin-left: auto; transition: transform 0.15s; }
.occ-r-riskdetail[open] > summary::after { transform: rotate(180deg); }
.occ-r-riskcats { display: grid; gap: 10px; padding: 0 12px 12px; }
.occ-r-riskcat { background: #fff; color: var(--r-ink); border-radius: 8px; padding: 12px; }
.occ-r-riskcat-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.occ-r-riskcat-head h3 { margin: 0; font-size: 0.9rem; flex: 1; }
.occ-r-riskcat-head span { font-weight: 800; font-variant-numeric: tabular-nums; }
.occ-r-riskcat--low .occ-r-riskcat-head { color: var(--r-good); }
.occ-r-riskcat--medium .occ-r-riskcat-head { color: var(--r-warn); }
.occ-r-riskcat--high .occ-r-riskcat-head { color: var(--r-bad); }
.occ-r-riskcat ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 5px; }
.occ-r-check { display: flex; align-items: baseline; gap: 8px; font-size: 0.85rem; }
.occ-r-check--pass i { color: var(--r-good); }
.occ-r-check--warning i { color: var(--r-warn); }
.occ-r-check--fail i { color: var(--r-bad); }
.occ-r-check--locked i, .occ-r-check--unavailable i { color: var(--r-faint); }
.occ-r-check--locked a { color: var(--r-lock); text-decoration: underline; } .occ-r-nav {
position: sticky;
top: 0;
z-index: 40;
background: rgba(255, 255, 255, 0.96);
backdrop-filter: blur(6px);
border: 1px solid var(--r-line);
border-radius: 10px;
margin: 0 0 16px;
}
.occ-r-nav-inner { display: flex; align-items: center; gap: 10px; padding: 8px 10px; }
.occ-r-nav-plate {
background: #fbbf24; color: #111827;
font-weight: 800; font-size: 0.72rem; letter-spacing: 0.05em;
padding: 3px 8px; border-radius: 4px;
border: 1px solid rgba(0, 0, 0, 0.25);
white-space: nowrap;
}
.occ-r-nav-verdict { font-size: 0.72rem; font-weight: 700; white-space: nowrap; }
.occ-r-nav-verdict--low { color: var(--r-good); }
.occ-r-nav-verdict--medium { color: var(--r-warn); }
.occ-r-nav-verdict--high { color: var(--r-bad); }
.occ-r-nav-verdict--unknown { color: var(--r-faint); }
.occ-r-nav-chips {
display: flex; gap: 4px;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
}
.occ-r-nav-chips::-webkit-scrollbar { display: none; }
.occ-r-nav-chips a {
flex: none;
font-size: 0.8rem; font-weight: 600;
color: var(--r-muted);
text-decoration: none;
padding: 8px 10px;
border-radius: 8px;
min-height: 36px;
display: inline-flex; align-items: center;
}
.occ-r-nav-chips a:hover { background: var(--r-accent-soft); color: var(--r-accent); }
.occ-r-nav-chips a.occ-r-nav--active { background: var(--r-accent-soft); color: var(--r-accent); } .occ-r-alerts { background: var(--r-bad-soft); border-color: var(--r-bad); }
.occ-r-alerts h2 { color: var(--r-bad); font-size: 1.1rem; margin: 0 0 10px; display: flex; align-items: center; gap: 8px; }
.occ-r-alerts ul { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 6px; }
.occ-r-alerts li { display: flex; align-items: baseline; gap: 8px; font-weight: 600; color: #7f1d1d; }
.occ-r-alerts li i { color: var(--r-bad); }
.occ-r-alerts p { margin: 0; font-size: 0.88rem; color: #7f1d1d; } .occ-r-cards { display: grid; grid-template-columns: 1fr; gap: 10px; }
.occ-r-cards--two { grid-template-columns: 1fr; }
.occ-r-cards--flush { gap: 12px; }
.occ-r-card {
display: flex; align-items: flex-start; gap: 12px;
background: var(--r-ground);
border: 1px solid var(--r-line);
border-radius: 10px;
padding: 12px;
text-decoration: none;
color: var(--r-ink);
min-height: 44px;
}
a.occ-r-card:hover { border-color: var(--r-accent); }
.occ-r-card-icon {
flex: none; width: 36px; height: 36px;
display: grid; place-items: center;
border-radius: 50%;
background: var(--r-line); color: var(--r-muted);
font-size: 15px;
}
.occ-r-card--good .occ-r-card-icon { background: var(--r-good-soft); color: var(--r-good); }
.occ-r-card--warn .occ-r-card-icon { background: var(--r-warn-soft); color: var(--r-warn); }
.occ-r-card--bad .occ-r-card-icon { background: var(--r-bad-soft); color: var(--r-bad); }
.occ-r-card--info .occ-r-card-icon { background: var(--r-accent-soft); color: var(--r-accent); }
.occ-r-card--locked .occ-r-card-icon { background: var(--r-lock-soft); color: var(--r-lock); }
.occ-r-card-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.occ-r-card-body strong { font-size: 0.85rem; }
.occ-r-card-body > span { font-size: 0.85rem; color: var(--r-muted); }
.occ-r-card-body em { font-size: 0.75rem; color: var(--r-faint); font-style: normal; }
.occ-r-card--locked { border-style: dashed; }
.occ-r-card--locked .occ-r-card-body > span { color: var(--r-lock); font-weight: 600; } .occ-r-stats { display: grid; grid-template-columns: 1fr; gap: 10px; margin-bottom: 14px; }
.occ-r-stat {
background: var(--r-ground);
border: 1px solid var(--r-line);
border-radius: 10px;
padding: 12px 14px;
text-align: center;
}
.occ-r-stat-label { display: block; font-size: 0.75rem; color: var(--r-muted); margin-bottom: 4px; }
.occ-r-stat-value { display: block; font-size: clamp(1.1rem, 3vw, 1.4rem); font-weight: 800; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.occ-r-stat--good { background: var(--r-good-soft); border-color: var(--r-good); }
.occ-r-stat--good .occ-r-stat-value { color: var(--r-good); }
.occ-r-stat--warn { background: var(--r-warn-soft); border-color: var(--r-warn); }
.occ-r-stat--warn .occ-r-stat-value { color: var(--r-warn); }
.occ-r-stat--bad { background: var(--r-bad-soft); border-color: var(--r-bad); }
.occ-r-stat--bad .occ-r-stat-value { color: var(--r-bad); } .occ-r-rows { display: grid; gap: 0; margin-bottom: 8px; }
.occ-r-row {
display: flex; justify-content: space-between; align-items: baseline; gap: 16px;
padding: 9px 2px;
border-bottom: 1px solid var(--r-line);
font-size: 0.92rem;
}
.occ-r-row:last-child { border-bottom: none; }
.occ-r-row-label { color: var(--r-muted); flex: 0 1 auto; min-width: 0; max-width: 55%; }
.occ-r-row-value { text-align: right; font-weight: 600; overflow-wrap: anywhere; } .occ-r-locked-row {
display: flex; justify-content: space-between; align-items: center; gap: 12px;
padding: 12px;
margin: 8px 0;
min-height: 44px;
background: var(--r-lock-soft);
border: 1px dashed var(--r-lock);
border-radius: 10px;
text-decoration: none;
color: var(--r-ink);
font-size: 0.9rem;
}
.occ-r-locked-row .occ-r-row-label {
color: var(--r-ink);
max-width: none;
flex: 1 1 auto; min-width: 0;
white-space: normal;
overflow-wrap: anywhere;
}
.occ-r-locked-row .occ-r-row-label i { color: var(--r-lock); margin-right: 4px; }
.occ-r-locked-chip { color: var(--r-lock); font-weight: 700; white-space: nowrap; }
.occ-r-locked-row:hover { border-style: solid; }
.occ-r-locked-panel {
background: var(--r-lock-soft);
border: 1px dashed var(--r-lock);
border-radius: 10px;
padding: 16px;
margin: 8px 0;
}
.occ-r-locked-panel-head { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 10px; }
.occ-r-locked-panel-icon {
flex: none; width: 40px; height: 40px;
display: grid; place-items: center;
border-radius: 10px;
background: #fff; color: var(--r-lock);
font-size: 17px;
}
.occ-r-locked-panel h3 { margin: 0 0 2px; font-size: 1rem; }
.occ-r-locked-panel p { margin: 0; font-size: 0.85rem; color: var(--r-muted); }
.occ-r-locked-panel-list { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 6px; }
.occ-r-locked-panel-list li { display: flex; gap: 8px; align-items: baseline; font-size: 0.88rem; }
.occ-r-locked-panel-list i { color: var(--r-good); }
.occ-r-cta {
display: inline-flex; align-items: center; justify-content: center; gap: 8px;
width: 100%;
min-height: 46px;
background: var(--r-lock);
color: #fff !important;
font-weight: 700; font-size: 0.95rem;
border-radius: 10px;
text-decoration: none;
padding: 10px 18px;
}
.occ-r-cta:hover { filter: brightness(1.08); } .occ-r-hcard {
border: 1px solid var(--r-line);
border-radius: 10px;
padding: 14px;
margin-bottom: 12px;
background: var(--r-ground);
}
.occ-r-hcard h3 { margin: 0 0 8px; font-size: 0.95rem; display: flex; align-items: center; gap: 8px; }
.occ-r-hcard--inline { margin-top: 4px; }
.occ-r-record {
background: #fff;
border: 1px solid var(--r-line);
border-radius: 8px;
padding: 6px 12px;
margin-top: 10px;
} .occ-r-tablewrap { overflow-x: auto; }
.occ-r-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
.occ-r-table th {
text-align: left; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em;
color: var(--r-muted); padding: 8px 10px; border-bottom: 2px solid var(--r-line);
}
.occ-r-table td { padding: 9px 10px; border-bottom: 1px solid var(--r-line); font-variant-numeric: tabular-nums; }
.occ-r-tr--bad td { background: var(--r-bad-soft); }
.occ-r-delta--up { color: var(--r-good); font-weight: 600; }
.occ-r-delta--down { color: var(--r-bad); font-weight: 700; }
@media (max-width: 479px) {
.occ-r-table thead { display: none; }
.occ-r-table, .occ-r-table tbody, .occ-r-table tr, .occ-r-table td { display: block; width: 100%; }
.occ-r-table tr { border: 1px solid var(--r-line); border-radius: 8px; margin-bottom: 8px; background: #fff; }
.occ-r-tr--bad { border-color: var(--r-bad); }
.occ-r-table td { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px dashed var(--r-line); }
.occ-r-table td:last-child { border-bottom: none; }
.occ-r-table td::before { content: attr(data-th); color: var(--r-muted); font-size: 0.8rem; }
} .occ-r-timeline { list-style: none; margin: 0; padding: 0 0 0 18px; border-left: 2px solid var(--r-line); display: grid; gap: 14px; }
.occ-r-test, .occ-r-event { position: relative; background: var(--r-ground); border: 1px solid var(--r-line); border-radius: 10px; padding: 12px; }
.occ-r-test::before, .occ-r-event::before {
content: ""; position: absolute; left: -24px; top: 18px;
width: 10px; height: 10px; border-radius: 50%;
background: var(--r-faint);
}
.occ-r-test--pass::before { background: var(--r-good); }
.occ-r-test--fail::before { background: var(--r-bad); }
.occ-r-test-head { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.occ-r-test-result { font-weight: 700; display: inline-flex; gap: 6px; align-items: center; }
.occ-r-test--pass .occ-r-test-result { color: var(--r-good); }
.occ-r-test--fail .occ-r-test-result { color: var(--r-bad); }
.occ-r-test-date { color: var(--r-muted); font-size: 0.85rem; }
.occ-r-test-meta { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 6px; font-size: 0.85rem; color: var(--r-muted); }
.occ-r-defects { margin-top: 8px; }
.occ-r-defects summary { cursor: pointer; font-size: 0.85rem; font-weight: 600; color: var(--r-accent); }
.occ-r-defects ul { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 6px; }
.occ-r-defects li { font-size: 0.85rem; display: flex; gap: 8px; align-items: baseline; }
.occ-r-defect-type { flex: none; font-size: 0.66rem; font-weight: 800; padding: 2px 6px; border-radius: 4px; }
.occ-r-defect--advisory .occ-r-defect-type { background: var(--r-warn-soft); color: var(--r-warn); }
.occ-r-defect--serious .occ-r-defect-type { background: var(--r-bad-soft); color: var(--r-bad); }
.occ-r-event { display: flex; gap: 12px; }
.occ-r-event-icon {
flex: none; width: 34px; height: 34px; display: grid; place-items: center;
border-radius: 50%; background: var(--r-accent-soft); color: var(--r-accent); font-size: 14px;
}
.occ-r-event strong { display: block; font-size: 0.92rem; }
.occ-r-event-date { font-size: 0.8rem; color: var(--r-muted); }
.occ-r-event p { margin: 4px 0 0; font-size: 0.85rem; } .occ-r-warnbox {
display: flex; gap: 12px; align-items: flex-start;
background: var(--r-warn-soft);
border: 1px solid var(--r-warn);
border-radius: 10px;
padding: 12px 14px;
margin: 0 0 16px;
}
.occ-r-warnbox i { color: var(--r-warn); margin-top: 3px; }
.occ-r-warnbox p { margin: 0; font-size: 0.9rem; } .occ-r-vin {
display: flex; flex-direction: column; gap: 4px;
background: var(--r-ground); border: 1px solid var(--r-line); border-radius: 10px;
padding: 12px 14px; margin-bottom: 6px;
}
.occ-r-vin span { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--r-muted); }
.occ-r-vin code { font-size: clamp(1rem, 3.5vw, 1.3rem); font-weight: 700; letter-spacing: 0.08em; overflow-wrap: anywhere; }
.occ-r-val-hero { text-align: center; padding: 8px 0 16px; }
.occ-r-val-amount { display: block; font-size: clamp(2rem, 7vw, 2.8rem); font-weight: 800; color: var(--r-good); font-variant-numeric: tabular-nums; }
.occ-r-val-label { display: block; font-weight: 600; }
.occ-r-val-ctx { display: block; font-size: 0.8rem; color: var(--r-muted); margin-top: 4px; }
.occ-r-stats--wrap { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.occ-r-ncap-stars { font-size: 1.4rem; margin-bottom: 12px; }
.occ-r-star--on { color: #f59e0b; }
.occ-r-star--off { color: var(--r-line); }
.occ-r-bars { display: grid; gap: 10px; }
.occ-r-bar { display: grid; grid-template-columns: 110px 1fr 44px; align-items: center; gap: 10px; font-size: 0.85rem; }
.occ-r-bar-label { color: var(--r-muted); }
.occ-r-bar-track { display: block; height: 8px; background: var(--r-line); border-radius: 999px; overflow: hidden; }
.occ-r-bar-fill { display: block; height: 100%; background: var(--r-accent); border-radius: 999px; }
.occ-r-bar-num { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; } .occ-r-group { border: 1px solid var(--r-line); border-radius: 10px; margin-bottom: 10px; background: var(--r-ground); }
.occ-r-group > summary {
cursor: pointer; list-style: none;
display: flex; align-items: center; gap: 8px;
padding: 12px 14px;
font-weight: 700; font-size: 0.95rem;
min-height: 44px;
}
.occ-r-group > summary::-webkit-details-marker { display: none; }
.occ-r-group > summary::after { content: "▾"; margin-left: auto; color: var(--r-muted); transition: transform 0.15s; }
.occ-r-group[open] > summary::after { transform: rotate(180deg); }
.occ-r-group-count {
font-size: 0.72rem; font-weight: 700;
background: var(--r-accent-soft); color: var(--r-accent);
border-radius: 999px; padding: 2px 8px;
}
.occ-r-group .occ-r-rows, .occ-r-group .occ-r-equip { padding: 0 14px 10px; }
.occ-r-equip { list-style: none; margin: 0; display: grid; gap: 6px; }
.occ-r-equip li { display: flex; align-items: baseline; gap: 8px; font-size: 0.9rem; border-bottom: 1px solid var(--r-line); padding: 7px 0; }
.occ-r-equip li:last-child { border-bottom: none; }
.occ-r-equip-name { flex: 1; }
.occ-r-equip-chip { font-size: 0.66rem; font-weight: 800; background: var(--r-accent-soft); color: var(--r-accent); border-radius: 4px; padding: 2px 6px; white-space: nowrap; }
.occ-r-equip-price { font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; } .occ-r-empty {
text-align: center;
padding: 22px 16px;
background: var(--r-ground);
border: 1px dashed var(--r-line);
border-radius: 10px;
color: var(--r-muted);
}
.occ-r-empty i { font-size: 22px; margin-bottom: 6px; color: var(--r-faint); }
.occ-r-empty p { margin: 0; font-size: 0.9rem; }
.occ-r-provenance { background: transparent; border: none; text-align: center; padding-top: 4px; }
.occ-r-provenance p { margin: 4px 0; font-size: 0.8rem; color: var(--r-muted); } @media (min-width: 480px) {
.occ-r-cards { grid-template-columns: repeat(2, 1fr); }
.occ-r-stats { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 768px) {
.occ-r-section { padding: 24px; }
.occ-r-cards { grid-template-columns: repeat(2, 1fr); }
.occ-r-cards--two { grid-template-columns: repeat(2, 1fr); }
.occ-r-stats { grid-template-columns: repeat(3, 1fr); }
.occ-r-verdict-main { flex-direction: row; align-items: flex-start; justify-content: space-between; }
.occ-r-riskcats { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
.occ-r-cards { grid-template-columns: repeat(4, 1fr); }
} @media (prefers-reduced-motion: reduce) {
.occ-r *, .occ-r *::before, .occ-r *::after { transition: none !important; animation: none !important; }
} @media print {
.occ-r { max-width: none; padding: 0; font-size: 12px; }
.occ-r-nav,
.occ-r-locked-row,
.occ-r-locked-panel,
.occ-r-cta,
.occ-ai-insight-box,
.occ-upgrade-bar,
#occ-upgrade-sticky { display: none !important; }
.occ-r-section { break-inside: avoid; border: 1px solid #ccc; margin-bottom: 10px; }
.occ-r-verdict { background: #fff !important; color: #000; border: 2px solid #000; }
.occ-r-verdict h1 { color: #000; }
.occ-r-verdict-meta { color: #444; }
.occ-r-chips li { background: #eee; color: #000; }
.occ-r-riskdetail, .occ-r-group, .occ-r-defects { display: block; }
.occ-r-riskdetail > summary::after, .occ-r-group > summary::after { display: none; }
details:not([open]) > *:not(summary) { display: block; }
.occ-r-tablewrap { overflow: visible; }
a { text-decoration: none; color: inherit; }
}