:root { color-scheme: light; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: #192521; background: #f2efe7; font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.site-header { display: flex; min-height: 74px; padding: 14px max(21px, calc((100% - 1160px) / 2)); gap: 20px; align-items: center; justify-content: space-between; border-bottom: 1px solid #aeb8ad; background: #fffdf7; }
.wordmark { color: #192521; font-size: 1.65rem; font-weight: 900; letter-spacing: -0.075em; text-decoration: none; }
a { color: inherit; }
a:focus-visible { outline: 3px solid #28748a; outline-offset: 4px; }
.site-header-routes { display: flex; align-items: center; gap: 20px; }
.site-header-routes > a { font-size: 0.8rem; font-weight: 750; text-decoration: none; }
.records-main { width: min(1160px, calc(100% - 42px)); margin: 0 auto; padding: clamp(30px, 5vw, 76px) 0 76px; }
.records-intro { max-width: 780px; }
.records-kicker, .record-topline, .record-source, .records-index span, .records-index small { font: 800 0.7rem/1.4 ui-monospace, "SFMono-Regular", Menlo, monospace; letter-spacing: 0.04em; }
.records-kicker { margin: 0 0 13px; color: #36594a; }
h1 { margin: 0; font-size: clamp(2.5rem, 7vw, 5.4rem); line-height: 0.95; letter-spacing: -0.065em; text-wrap: balance; }
.records-intro > p:not(.records-kicker) { max-width: 720px; margin: 22px 0; color: #435249; font-size: 1rem; line-height: 1.6; }
.records-intro > a, .record-page > a { display: inline-flex; min-height: 44px; padding: 11px 14px; align-items: center; border: 1px solid #244639; color: #fff; background: #244639; font-size: 0.83rem; font-weight: 800; text-decoration: none; }
.records-intro > a:hover, .record-page > a:hover { background: #35634c; }
.records-index { display: grid; margin: 38px 0 44px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.records-index a { display: grid; min-width: 0; padding: 18px; gap: 7px; border: 1px solid #244639; background: #fffdf7; text-decoration: none; }
.records-index a:hover { background: #e5ece3; box-shadow: 4px 4px 0 #d4a868; }
.records-index span, .records-index small { color: #36594a; }
.records-index strong { font-size: 1.12rem; letter-spacing: -0.03em; }
.records-pair { display: grid; margin-top: 22px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.record-page { min-width: 0; padding: clamp(22px, 3vw, 36px); border: 1px solid #244639; background: #fffdf7; scroll-margin-top: 20px; }
.record-check { background: #e5ece3; }
.record-page:target { outline: 4px solid #d4a868; outline-offset: 3px; }
.record-topline { display: flex; gap: 12px; justify-content: space-between; flex-wrap: wrap; color: #36594a; }
.record-page h2 { margin: 30px 0 10px; font-size: clamp(1.75rem, 3vw, 2.6rem); line-height: 1.08; letter-spacing: -0.052em; text-wrap: balance; }
.record-page h3 { margin: 28px 0 8px; font-size: 0.95rem; }
.record-release { display: inline-block; margin: 2px 0 12px; padding: 6px 8px; border: 1px solid #36594a; color: #36594a; font-size: 0.76rem; font-weight: 800; }
.record-verdict { margin: 2px 0 0; color: #244639; font-weight: 800; }
.record-page p, .record-page li { line-height: 1.55; }
.record-page ol { margin: 22px 0; padding-left: 24px; }
.record-page li + li { margin-top: 9px; }
.record-limit { padding: 13px; border-left: 4px solid #a96948; background: #f8f0e1; }
.record-source { margin: 28px 0 18px; padding-top: 14px; border-top: 1px dashed #9daaa0; overflow-wrap: anywhere; color: #4c5b52; }
.record-source code { font: inherit; }
.records-footer { display: flex; padding: 24px max(21px, calc((100% - 1160px) / 2)); gap: 18px; flex-wrap: wrap; border-top: 1px solid #9daaa0; }
.records-footer a { font-size: 0.83rem; font-weight: 800; }
@media (max-width: 740px) { .records-index, .records-pair { grid-template-columns: minmax(0, 1fr); } .site-header-routes { gap: 8px; } .site-header-routes > a { display: none; } .site-header { gap: 8px; } .view-switch { --shell-switch-link-padding: 0 9px; --shell-switch-font-size: 0.7rem; } }
@media (max-width: 380px) { .site-header { padding-inline: 12px; } .wordmark { font-size: 1.35rem; } .view-switch { --shell-switch-link-padding: 0 6px; --shell-switch-font-size: 0.67rem; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }