:root { --navy:#071426; --navy2:#0d2138; --ink:#172033; --muted:#5e6b7d; --line:#d8dee8; --paper:#f7f9fc; --white:#ffffff; --gold:#c7a65a; --blue:#2e5f93; --red:#a33c3c; --amber:#8a5b00; --green:#236b47; }
* { box-sizing:border-box; }
html { background:#e8edf5; }
body { margin:0; font:15px/1.6 Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif; color:var(--ink); background:#e8edf5; }
main { max-width:1050px; margin:0 auto; background:var(--white); min-height:100vh; box-shadow:0 20px 80px rgba(7,20,38,.14); }
.cover { background:linear-gradient(135deg,var(--navy),var(--navy2)); color:white; padding:54px 64px 46px; border-bottom:5px solid var(--gold); }
.brand-lockup { display:flex; align-items:center; gap:4px; margin-bottom:22px; }
.report-logo { width:74px; height:74px; object-fit:contain; flex:0 0 auto; }
.brand { letter-spacing:.18em; text-transform:uppercase; color:#d7c38a; font-size:12px; font-weight:700; }
.brand-subline { margin-top:5px; color:#d6e0ee; font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
h1 { margin:0 0 12px; font-size:38px; line-height:1.1; max-width:900px; }
.subtitle { color:#d6e0ee; font-size:18px; max-width:900px; }
.meta { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-top:34px; }
.meta div { background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18); border-radius:14px; padding:14px; }
.meta b { display:block; color:#d7c38a; font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
.content { padding:42px 64px 64px; }
section.block { border-bottom:1px solid var(--line); padding:22px 0; }
h2 { font-size:24px; margin:0 0 14px; color:#0c1b2f; }
h3 { margin:.2em 0; font-size:18px; }
h4 { margin:18px 0 6px; color:#26364d; }
p { margin:0 0 12px; }
ul { margin:8px 0 0 20px; padding:0; }
li { margin:5px 0; }
.callout { background:#f4f7fb; border-left:4px solid var(--blue); padding:16px 18px; border-radius:10px; }
.table-scroll { max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; margin:14px 0; border-radius:12px; }
table { width:100%; border-collapse:collapse; margin:0; font-size:14px; }
th { text-align:left; background:#10243d; color:white; padding:10px; }
td { vertical-align:top; border:1px solid var(--line); padding:10px; overflow-wrap:anywhere; word-break:normal; }
.badge { display:inline-flex; align-items:center; justify-content:center; min-width:72px; line-height:1.15; white-space:nowrap; padding:3px 9px; border-radius:999px; font-size:12px; font-weight:700; }
.badge.high { background:#fde8e8; color:#7f1d1d; border:1px solid #f5b7b7; }
.badge.medium { background:#fff3cf; color:#644600; border:1px solid #eed38c; }
.badge.low { background:#e8f5ee; color:#1d5c3a; border:1px solid #afd8c1; }
.finding { border:1px solid var(--line); border-radius:16px; margin:16px 0; padding:18px; background:#fff; box-shadow:0 8px 24px rgba(15,35,60,.06); }
.finding-head { display:grid; grid-template-columns:54px 1fr auto; gap:12px; align-items:center; border-bottom:1px solid var(--line); padding-bottom:10px; margin-bottom:8px; }
.finding-head span { background:#10243d; color:white; border-radius:10px; text-align:center; padding:8px 0; font-weight:800; }
.finding-head strong { display:inline-flex; align-items:center; justify-content:center; min-width:72px; color:#7f1d1d; background:#fde8e8; border:1px solid #f5b7b7; padding:5px 10px; border-radius:999px; font-size:12px; }
code { background:#eef2f7; padding:2px 5px; border-radius:5px; color:#1d3555; }
.footer { color:#6a7485; font-size:12px; padding-top:22px; }
@media (max-width: 760px) { .cover { padding:34px 24px 30px; } .brand-lockup { gap:2px; margin-bottom:18px; } .report-logo { width:62px; height:62px; } h1 { font-size:30px; } .subtitle { font-size:16px; } .meta { grid-template-columns:1fr 1fr; } .content { padding:28px 18px 40px; } section.block { padding:20px 0; } h2 { font-size:22px; } .table-scroll { border:1px solid var(--line); background:#fff; } .table-scroll table { min-width:680px; font-size:13px; } .table-scroll th, .table-scroll td { padding:9px; } .finding-head { grid-template-columns:44px 1fr; } .finding-head strong { grid-column:2; justify-self:start; } }
@page { size:A4; margin:11mm 12mm; }
@media print { * { -webkit-print-color-adjust:exact; print-color-adjust:exact; } html, body { width:210mm; margin:0 !important; padding:0 !important; background:#fff !important; font-size:9.7pt; line-height:1.35; } main { width:auto; max-width:none; min-height:auto; margin:0; padding:0; background:#fff; box-shadow:none !important; } .cover { min-height:188mm; display:flex; flex-direction:column; justify-content:center; padding:22mm 17mm 18mm; border-bottom:4pt solid var(--gold); break-after:page; page-break-after:always; } .brand-lockup { gap:3pt; margin-bottom:14pt; } .report-logo { width:43pt; height:43pt; } .brand { font-size:9.5pt; letter-spacing:.16em; } .brand-subline { margin-top:3pt; font-size:7.8pt; letter-spacing:.07em; } h1 { font-size:25pt; line-height:1.08; margin:0 0 8pt; max-width:172mm; } .subtitle { font-size:11pt; line-height:1.38; max-width:172mm; } .meta { grid-template-columns:repeat(4,minmax(0,1fr)); gap:6pt; margin-top:20pt; } .meta div { border-radius:7pt; padding:8pt; } .meta b { font-size:7.5pt; } .content { padding:0; } section.block { padding:0 0 5.5mm; margin:0 0 5.5mm; border-bottom:.45pt solid var(--line); break-inside:auto; page-break-inside:auto; } h2 { font-size:14.2pt; margin:0 0 5pt; } h3 { font-size:11.1pt; margin:0 0 3.5pt; } h4 { font-size:9.6pt; margin:6pt 0 2pt; } p { margin:0 0 5pt; } ul { margin:3.5pt 0 0 12pt; } li { margin:1.6pt 0; } .callout { border-radius:0; padding:7pt 9pt; } .table-scroll { margin:6pt 0; overflow:visible; border-radius:0; } table { table-layout:fixed; margin:0; font-size:8.2pt; } th, td { padding:4.2pt 5pt; overflow-wrap:anywhere; } .finding { margin:0 0 5.5mm; padding:8pt 9pt; border-radius:7pt; box-shadow:none !important; break-inside:auto; page-break-inside:auto; } .finding-head { grid-template-columns:30pt 1fr auto; gap:6pt; padding-bottom:4.5pt; margin-bottom:4pt; } .finding-head span { border-radius:5pt; padding:4pt 0; } .finding-head strong, .badge { border-radius:999px; padding:2.5pt 5.5pt; font-size:7.8pt; min-width:48pt; } .footer { display:none; } }
