:root { color-scheme: light; --ink:#142c32; --muted:#536d72; --deep:#102e34; --teal:#117d77; --mint:#c9eee3; --line:#dce8e5; --paper:#f7faf8; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:system-ui,-apple-system,BlinkMacSystemFont,"Noto Sans KR","Malgun Gothic",sans-serif; line-height:1.7; word-break:keep-all; overflow-wrap:break-word; }
a { color:#086a65; text-underline-offset:3px; }
a:hover { color:#044b48; }
a:focus-visible { outline:3px solid #eb9e3c; outline-offset:3px; }
.site-header { min-height:84px; padding:16px max(24px,calc((100vw - 1240px)/2)); display:flex; align-items:center; justify-content:space-between; gap:20px; background:#fff; border-bottom:1px solid var(--line); }
.brand { display:flex; gap:11px; align-items:center; color:var(--ink); text-decoration:none; font-size:15px; letter-spacing:.09em; font-weight:800; line-height:1.25; }
.brand small { display:block; margin-top:3px; color:var(--muted); font-size:11px; font-weight:500; letter-spacing:0; }
.brand-mark { display:grid; place-items:center; width:38px; height:38px; border-radius:12px; color:#fff; background:var(--teal); font-size:22px; letter-spacing:0; }
.site-header nav { display:flex; align-items:center; gap:24px; font-size:13px; font-weight:700; }
.site-header nav a { color:#36585c; text-decoration:none; }
.hero { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr); gap:80px; padding:78px max(24px,calc((100vw - 1160px)/2)) 82px; color:#f4fffb; background:radial-gradient(circle at 85% 5%,#255a5a 0,transparent 36%),linear-gradient(120deg,#102e34,#163f41); }
.eyebrow { margin:0 0 12px; color:#0b7c74; font-size:11px; letter-spacing:.16em; font-weight:800; }
.hero .eyebrow { color:#9ee4d4; }
h1,h2,h3,p { margin-top:0; }
h1 { margin-bottom:21px; font-size:clamp(42px,5vw,66px); line-height:1.16; letter-spacing:-.045em; }
.hero-lead { max-width:600px; margin-bottom:28px; color:#c8ded9; font-size:17px; }
.hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:22px; }
.primary-link { display:inline-block; padding:12px 18px; border-radius:8px; color:#103a36; background:#b7eadb; font-size:14px; font-weight:800; text-decoration:none; }
.primary-link span { margin-left:12px; }
.text-link { color:#d4f3e9; font-size:14px; font-weight:700; text-decoration:none; }
.hero-aside { align-self:center; padding:27px 30px; border:1px solid #ffffff35; border-radius:14px; background:#ffffff0d; }
.aside-label { margin-bottom:18px; color:#a9d8cd; font-size:10px; font-weight:800; letter-spacing:.15em; }
.hero-aside ol { list-style:none; padding:0; margin:0; }
.hero-aside li { display:flex; gap:17px; padding:14px 0; border-top:1px solid #ffffff25; color:#c8ded9; font-size:13px; }
.hero-aside li b { color:#8fd6c4; font-size:12px; }
.hero-aside li strong { display:block; color:white; font-size:15px; }
.content { width:min(1160px,calc(100% - 48px)); margin:auto; }
.notice { display:flex; gap:18px; margin:35px 0 0; padding:17px 20px; border:1px solid #e8d7af; border-radius:9px; background:#fffbef; color:#67572f; font-size:13px; }
.notice strong { flex:none; color:#634d1d; }
.section { padding:72px 0; border-bottom:1px solid var(--line); scroll-margin-top:24px; }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:30px; margin-bottom:27px; }
.section-heading h2 { margin:0; font-size:clamp(25px,3vw,34px); line-height:1.3; letter-spacing:-.04em; }
.section-heading > p { max-width:350px; margin:0; color:var(--muted); font-size:14px; }
.journey-grid,.results-grid,.compare-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.card,.chart-card { margin:0; padding:28px; border:1px solid var(--line); border-radius:12px; background:#fff; }
.card h3,.chart-card h3 { margin:12px 0; font-size:21px; line-height:1.4; letter-spacing:-.03em; }
.card p,.result-copy p { color:#52686d; font-size:14px; }
.card-tag { display:inline-block; color:#9b6c22; font-size:10px; font-weight:800; letter-spacing:.12em; }
.card-tag.mint { color:#087d72; }
.number-flow { display:flex; align-items:center; justify-content:space-between; gap:5px; margin:25px 0; }
.number-flow div { min-width:0; }
.number-flow strong,.number-flow small { display:block; }
.number-flow strong { font-size:clamp(17px,1.9vw,25px); line-height:1.2; }
.number-flow small { color:var(--muted); font-size:11px; }
.number-flow > span { color:#9bb3ae; }
.fact-pair { display:flex; gap:42px; margin:25px 0; }
.fact-pair strong,.fact-pair small { display:block; }
.fact-pair strong { color:#117d77; font-size:27px; line-height:1.2; }
.fact-pair strong span { font-size:12px; }
.fact-pair small { margin-top:5px; color:var(--muted); font-size:11px; }
.caption,.card .caption { margin:15px 0 0; color:#60767a; font-size:12px; }
.paper-intro { display:grid; grid-template-columns:1.4fr .6fr; gap:28px; padding:34px; border-radius:12px; color:#f6fffc; background:var(--deep); }
.paper-intro h3 { max-width:650px; margin:7px 0 14px; font-size:24px; line-height:1.45; }
.paper-intro p { color:#c9ddda; font-size:14px; }
.paper-intro a { color:#9fe8d3; }
.paper-label { color:#83d0bd!important; font-size:11px!important; font-weight:800; letter-spacing:.12em; }
.paper-authors { color:#fff!important; font-weight:700; }
.paper-status { align-self:center; padding:20px; border:1px solid #ffffff30; border-radius:9px; background:#ffffff0c; }
.paper-status strong { font-size:13px; }
.paper-status p { margin:8px 0; font-size:12px; }
.paper-status span { color:#9ebdb7; font-size:11px; }
.method-flow { display:grid; grid-template-columns:repeat(4,1fr); margin-top:24px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.method-flow div { padding:19px; border-right:1px solid var(--line); }
.method-flow div:last-child { border:0; }
.method-flow span,.method-flow strong,.method-flow small { display:block; }
.method-flow span { color:#0b8d7e; font-size:11px; font-weight:800; }
.method-flow strong { margin:5px 0; font-size:14px; }
.method-flow small { color:var(--muted); font-size:11px; }
.study-facts { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:30px; }
.study-facts div { padding-left:15px; border-left:3px solid #9cdbca; }
.study-facts b,.study-facts span { display:block; }
.study-facts b { font-size:20px; line-height:1.3; }
.study-facts span { color:var(--muted); font-size:11px; }
.small-note { margin:20px 0 0; color:#536c6f; font-size:12px; }
.chart-card figcaption strong,.chart-card figcaption span { display:block; }
.chart-card figcaption strong { font-size:20px; line-height:1.45; }
.chart-card figcaption span { margin-top:7px; color:var(--muted); font-size:12px; }
.bars { margin-top:31px; }
.bar-row { margin:22px 0; }
.bar-label { display:flex; justify-content:space-between; gap:10px; font-size:13px; }
.bar-track { height:12px; margin:7px 0 3px; border-radius:8px; background:#edf3f1; overflow:hidden; }
.bar { display:block; height:100%; border-radius:8px; }
.bar.base { width:100%; background:#d9985a; }
.bar.proposed { width:37.48%; background:#159b88; }
.bar-row small { color:var(--muted); font-size:11px; }
.chart-foot { margin:20px 0 0; color:var(--muted); font-size:12px; }
.result-callout { padding:14px; border-radius:8px; background:#ecf8f4; color:#13665d; font-size:13px; font-weight:700; }
.table-hint { display:none; margin:20px 0 0; color:var(--muted); font-size:12px; }
.table-wrap { margin-top:24px; overflow-x:auto; border:1px solid var(--line); border-radius:10px; background:#fff; }
.table-wrap:focus-visible { outline:3px solid #eb9e3c; outline-offset:3px; }
table { width:100%; border-collapse:collapse; text-align:left; font-size:13px; }
caption { padding:16px 18px; text-align:left; font-weight:800; }
th,td { padding:13px 18px; border-top:1px solid var(--line); }
thead th { background:#f1f7f4; color:#355b59; }
tbody th { font-weight:600; }
.compare-grid article { padding:27px; border:1px solid var(--line); border-top:4px solid #0d8b80; border-radius:10px; background:#fff; }
.compare-grid article:nth-child(2) { border-top-color:#d49a54; }
.compare-grid article > span,.limit-grid span { color:#0c8277; font-size:11px; font-weight:800; letter-spacing:.08em; }
.compare-grid h3 { margin:8px 0; font-size:20px; }
.compare-grid p { color:#52686d; font-size:14px; }
.compare-grid small { color:#60767a; font-size:12px; }
.v3-note { display:flex; flex-wrap:wrap; align-items:center; gap:8px 20px; margin-top:20px; padding:18px 22px; border-radius:9px; background:#edf5f2; font-size:13px; }
.v3-note small { width:100%; color:var(--muted); }
.limit-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.limit-grid article { padding:23px; border-left:2px solid #b0d9ce; background:#fff; }
.limit-grid h3 { margin:9px 0; font-size:16px; }
.limit-grid p { margin-bottom:0; color:var(--muted); font-size:13px; }
.sources-list { padding-left:22px; color:#52686d; font-size:13px; }
.sources-list li { margin:12px 0; padding-left:4px; scroll-margin-top:20px; }
.sources-list strong { color:var(--ink); }
.site-footer { display:flex; justify-content:space-between; gap:20px; padding:30px max(24px,calc((100vw - 1160px)/2)); color:#bbd2cc; background:#102e34; font-size:12px; }
.site-footer a { color:#c6eadf; }
@media(max-width:760px) {
 .site-header { min-height:70px; padding:12px 20px; }
 .site-header nav { gap:12px; font-size:11px; }
 .site-header nav a:last-child { display:none; }
 .hero { grid-template-columns:1fr; gap:30px; padding:56px 24px; }
 .hero-lead { font-size:15px; }
 .hero-aside { padding:19px 22px; }
 .content { width:calc(100% - 40px); }
 .notice { flex-direction:column; gap:4px; }
 .section { padding:52px 0; }
 .section-heading { display:block; }
 .section-heading > p { margin-top:10px; }
 .journey-grid,.results-grid,.compare-grid,.paper-intro { grid-template-columns:1fr; }
 .card,.chart-card,.paper-intro { padding:23px; }
 .paper-intro h3 { font-size:20px; }
 .method-flow,.study-facts { grid-template-columns:1fr 1fr; }
 .method-flow div:nth-child(2) { border-right:0; }
 .method-flow div:nth-child(-n+2) { border-bottom:1px solid var(--line); }
 .method-flow div:last-child { border:0; }
 .limit-grid { grid-template-columns:1fr; }
 .table-hint { display:block; }
 .table-wrap { margin-top:8px; }
 .table-wrap table { min-width:580px; }
 .site-footer { padding:25px 20px; }
}
@media(max-width:370px) { .brand { font-size:12px; } .brand-mark { width:33px; height:33px; } .number-flow strong { font-size:16px; } .number-flow small { font-size:10px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
