:root{--cg-ink: #10212b;--cg-muted: #3d5563;--cg-bg: #e4eef3;--cg-sheet: #ffffff;--cg-line: #c5d5df;--cg-blue: #0c4a6e;--cg-blue-deep: #082f49;--cg-gap: #d5e2ea;--cg-mark: #fde68a;--cg-soft: #f4f8fb;}
body.cg-sheet,body.cg-sheet .main-header{background: var(--cg-bg);}
.cg-page{background: var(--cg-bg);color: var(--cg-ink);padding: 1.1rem 0 4.5rem;line-height: 1.55;}
.cg-page a{color: var(--cg-blue);text-decoration-thickness: 1px;text-underline-offset: 0.16em;}
.cg-page a:hover{color: var(--cg-blue-deep);}
.cg-page a:focus-visible,.cg-page summary:focus-visible,.cg-page .cg-path:focus-visible{outline: 2px solid var(--cg-blue);outline-offset: 3px;}
.cg-page h1{font-size: clamp(1.9rem, 4vw, 2.85rem);line-height: 1.08;letter-spacing: -0.03em;margin: 0.2rem 0 0.75rem;font-weight: 700;}
.cg-open > p{margin: 0;}
.cg-paths{display: grid;grid-template-columns: repeat(3, minmax(0, 1fr));gap: 0.75rem;margin: 1.15rem 0 0.9rem;}
.cg-page a.cg-path{display: flex;flex-direction: column;gap: 0.2rem;background: var(--cg-sheet);border: 1px solid var(--cg-line);border-radius: 14px;padding: 0.9rem 1rem 1rem;text-decoration: none;color: var(--cg-ink);min-height: 100%;}
.cg-page a.cg-path:hover{border-color: var(--cg-blue);color: var(--cg-ink);background: #f8fbfd;}
.cg-path span{font-size: 0.75rem;letter-spacing: 0.06em;text-transform: uppercase;color: var(--cg-muted);font-weight: 700;}
.cg-path strong{font-size: 1.15rem;color: var(--cg-blue);line-height: 1.25;}
.cg-path em{font-style: normal;font-size: 0.92rem;line-height: 1.45;color: var(--cg-ink);}
.cg-jump{display: flex;flex-wrap: wrap;gap: 0.45rem;margin: 0 0 0.2rem;}
.cg-page .cg-jump a{text-decoration: none;background: var(--cg-sheet);border: 1px solid var(--cg-line);border-radius: 999px;padding: 0.38rem 0.8rem;font-size: 0.88rem;font-weight: 700;color: var(--cg-blue);}
.cg-page .cg-jump a:hover{border-color: var(--cg-blue);background: #f3f8fb;color: var(--cg-blue-deep);}
.cg-byline{display: flex;flex-wrap: wrap;justify-content: space-between;gap: 0.45rem 1.25rem;margin: 1rem 0 0;padding-top: 0.8rem;border-top: 1px solid var(--cg-line);font-size: 0.875rem;color: var(--cg-muted);}
.cg-byline a{font-weight: 700;}
.cg-sec{margin-top: 2.6rem;scroll-margin-top: 5.5rem;}
.cg-num{margin: 0 0 0.35rem;font-family: ui-monospace, SFMono-Regular, Consolas, monospace;font-size: 0.75rem;letter-spacing: 0.08em;color: var(--cg-blue);}
.cg-sec h2{font-size: clamp(1.45rem, 2.6vw, 1.85rem);line-height: 1.2;margin: 0 0 0.75rem;letter-spacing: -0.02em;}
.cg-sec h2 u,.cg-copy u{text-underline-offset: 0.14em;}
.cg-copy p{margin: 0 0 0.9rem;}
.cg-copy h3{font-size: 1.02rem;margin: 1.35rem 0 0.4rem;color: var(--cg-blue-deep);}
.cg-copy h3:first-child{margin-top: 0;}
.cg-one{margin: 0.9rem 0;padding: 0.7rem 0.9rem;background: var(--cg-sheet);border: 1px solid var(--cg-line);border-radius: 12px;font-weight: 650;}
.cg-legend{display: flex;flex-wrap: wrap;gap: 0.75rem 1.25rem;list-style: none;padding: 0;margin: 0 0 0.75rem;font-size: 0.92rem;}
.cg-legend li{display: flex;align-items: center;gap: 0.45rem;}
.cg-swatch{width: 0.95rem;height: 0.95rem;border: 1px solid #5d7686;background: #ffffff;border-radius: 3px;display: inline-block;}
.cg-swatch-gap{background: #b9ccd6;}
.cg-scroll{overflow-x: auto;background: var(--cg-sheet);border: 1px solid var(--cg-line);border-radius: 14px;-webkit-overflow-scrolling: touch;}
.cg-matrix{width: 100%;min-width: 40rem;border-collapse: collapse;background: var(--cg-sheet);font-size: 0.92rem;}
.cg-matrix caption{caption-side: top;text-align: left;font-weight: 700;padding: 0.85rem 0.9rem 0.45rem;color: var(--cg-ink);}
.cg-matrix th,.cg-matrix td{border-bottom: 1px solid var(--cg-line);padding: 0.62rem 0.75rem;vertical-align: top;text-align: left;}
.cg-matrix thead th{font-size: 0.72rem;letter-spacing: 0.05em;text-transform: uppercase;color: var(--cg-muted);font-weight: 700;background: var(--cg-soft);position: sticky;top: 0;}
.cg-matrix tbody th,.cg-matrix thead th:first-child{position: sticky;left: 0;z-index: 2;background: var(--cg-soft);box-shadow: 1px 0 0 var(--cg-line);}
.cg-matrix thead th:first-child{z-index: 3;}
.cg-matrix tbody th{font-weight: 700;white-space: nowrap;}
.cg-matrix tbody tr:last-child th,.cg-matrix tbody tr:last-child td{border-bottom: 0;}
.cg-matrix tbody tr:hover td:not(.cg-gap):not(.cg-same),.cg-matrix tbody tr:hover th{background: #f3f8fb;}
.cg-page .cg-matrix a{display: inline-block;padding: 0.08rem 0;font-weight: 650;}
.cg-gap{background: var(--cg-gap);color: var(--cg-ink);font-size: 0.82rem;}
.cg-same{color: var(--cg-muted);background: #f7fafc;font-size: 0.82rem;}
.cg-pair{display: flex;flex-direction: column;align-items: flex-start;gap: 0.2rem;}
.cg-page code{font-family: ui-monospace, SFMono-Regular, Consolas, monospace;font-size: 0.86em;background: #e7f0f6;color: var(--cg-blue-deep);padding: 0.05em 0.32em;border-radius: 4px;white-space: nowrap;}
.cg-math{list-style: none;display: grid;grid-template-columns: repeat(4, minmax(0, 1fr));gap: 0.6rem;padding: 0;margin: 0.85rem 0 1rem;}
.cg-math li{background: var(--cg-sheet);border: 1px solid var(--cg-line);border-radius: 12px;padding: 0.7rem 0.75rem;display: flex;flex-direction: column;gap: 0.1rem;}
.cg-math b{font-size: 0.78rem;color: var(--cg-muted);font-weight: 700;}
.cg-math strong{font-size: 1.15rem;color: var(--cg-blue-deep);font-weight: 700;}
.cg-math span{font-size: 0.78rem;color: var(--cg-muted);}
.cg-mark{background: var(--cg-mark);padding: 0 0.12em;}
.cg-outliers{list-style: none;display: grid;grid-template-columns: 1fr 1fr;gap: 0.75rem;padding: 0;margin: 1rem 0 0;max-width: none;}
.cg-outliers li{background: var(--cg-sheet);border: 1px solid var(--cg-line);border-radius: 14px;padding: 0.9rem 1rem;line-height: 1.5;}
.cg-outliers a{font-weight: 700;}
.cg-gen{display: grid;grid-template-columns: 1fr 1fr;gap: 0.75rem;margin: 0.9rem 0 0;max-width: none;}
.cg-gen > div{display: block;background: var(--cg-sheet);border: 1px solid var(--cg-line);border-radius: 14px;padding: 0.95rem 1rem 1.05rem;}
.cg-gen dt{font-weight: 700;margin: 0 0 0.35rem;}
.cg-gen dt a{font-size: 1.02rem;text-decoration: none;}
.cg-gen dt a:hover{text-decoration: underline;}
.cg-gen dd{margin: 0;color: var(--cg-ink);line-height: 1.5;}
.cg-faq details{background: var(--cg-sheet);border: 1px solid var(--cg-line);border-radius: 12px;padding: 0.75rem 0.95rem;margin: 0 0 0.5rem;}
.cg-faq details:last-child{margin-bottom: 0;}
.cg-faq summary{cursor: pointer;font-weight: 700;list-style: none;display: flex;align-items: flex-start;gap: 0.55rem;}
.cg-faq summary::-webkit-details-marker{display: none;}
.cg-faq summary::before{content: "";width: 0.45rem;height: 0.45rem;margin-top: 0.4rem;border-right: 2px solid var(--cg-blue);border-bottom: 2px solid var(--cg-blue);transform: rotate(-45deg);flex: none;}
.cg-faq details[open] summary::before{transform: rotate(45deg);margin-top: 0.25rem;}
.cg-faq details[open]{background: #f8fbfd;}
.cg-faq p{margin: 0.55rem 0 0.15rem 1rem;}
.cg-close{margin-top: 2.25rem;padding: 0.95rem 1rem;background: var(--cg-sheet);border: 1px solid var(--cg-line);border-radius: 14px;}
@media (min-width: 860px){.cg-sec{display: grid;grid-template-columns: 3.25rem 1fr;column-gap: 1.15rem;}.cg-num{grid-column: 1;grid-row: 1;margin: 0.45rem 0 0;}.cg-sec > div{grid-column: 2;grid-row: 1;}}
@media (max-width: 900px){.cg-paths,.cg-math{grid-template-columns: 1fr 1fr;}}
@media (max-width: 700px){.cg-paths,.cg-math,.cg-gen,.cg-outliers{grid-template-columns: 1fr;}.cg-faq p{margin-left: 0;}}
