/* ============ Design tokens ============ */ /* 팔레트 기준: kna.io.kr (레퍼런스) 흰 배경(#fff)이 주가 되고, 보조 띠는 아주 옅은 회색(#f5f6f8), 본문은 회색(#808291)·제목은 차콜(#292d36). 고려대 정체성인 크림슨은 액센트로 남긴다 — 레퍼런스의 오렌지(#dd6531)는 그 사이트가 쓴 상용 컨설팅 템플릿의 기본색이지 KNA가 고른 색이 아니다. */ :root{ --accent:#C00C2A; /* 사이트 포인트 색상 — 이 한 줄만 바꾸면 전체 강조색이 함께 바뀐다 */ --ink:#292d36; /* 제목 — 검정이 아니라 차콜 */ --ink-soft:#6b6e7d; /* 본문 — 레퍼런스는 #808291 이지만 흰 배경에서 3.8:1 로 WCAG AA(4.5:1) 미달. 같은 회색 계열을 유지한 채 진하게 조정했다. 흰 배경 5.1:1 / 회색 띠 4.7:1 로 두 배경 모두에서 통과한다. 독자층이 장년이다. */ --crimson:var(--accent); --crimson-deep:color-mix(in srgb,var(--accent) 82%,#000); --crimson-soft:color-mix(in srgb,var(--accent) 34%,#fff); --paper:#ffffff; /* 본문 배경 — 순백 */ --paper-2:#f5f6f8; /* 교차 띠 — 레퍼런스의 #f7f7f7 계열 */ /* --line(회색 경계선) 은 토큰째 삭제했다. 면과 여백으로 나누고 선을 긋지 않는다. */ --white:#ffffff; --shadow: 0 18px 40px -22px rgba(41,45,54,.28); --sans:'Pretendard','Noto Sans KR',sans-serif; --serif:var(--sans); /* 레퍼런스가 전면 sans라 세리프를 쓰지 않는다. 되돌리려면 이 줄만 'Noto Serif KR', serif 로 */ --maxw:1180px; /* 좌우 여백. 헤더와 본문이 같은 선에 서야 하므로 .wrap 과 .header-inner 가 이 값 하나를 같이 쓴다. 한쪽만 고치면 로고가 섹션 제목보다 바깥으로 튀어나간다 — 실제로 그렇게 어긋나 있었다. */ --gutter:28px; --header-h:76px; /* 교우 활동 모드의 판 두 장 — 사이드 폭과 바닥 여백. 본문이 이 값만큼 물러난다 */ --side-w:206px; --shell-x:clamp(20px,4.5vw,72px); --shell-y:26px} @media(max-width:720px){ :root{--gutter:20px} } /* 고정 헤더에 가려지지 않도록 모든 앵커 대상에 여백 */ [id]{scroll-margin-top:calc(var(--header-h) + 20px)} *{box-sizing:border-box;margin:0;padding:0} /* 브라우저 기본