kyeongmin
688ddbbb17
5단계 AI 파이프라인: 1. Kei 실장(Opus via Kei API) — 꼭지 추출 + 정보 구조 파악 2. 디자인 팀장 — FAISS 블록 검색 + Opus 추천 + Sonnet 블록 매핑 3. Kei 편집자(Kei API) — 도메인 전문 텍스트 정리 4. 디자인 실무자(Sonnet + Jinja2) — CSS 변수 조정 + HTML 조립 5. 디자인 팀장(Sonnet) — 균형 재검토 (최대 2회 루프) 블록 라이브러리 46개 (6 카테고리) + _legacy 13개 FAISS 블록 검색 (bge-m3, 1024차원) SVG N개 동적 배치 (cos/sin 좌표 계산) Pillow 이미지 크기 측정 + base64 인라인 컨테이너 예산 기반 블록 배치 (zone별 높이 px) Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
85 lines
2.1 KiB
CSS
85 lines
2.1 KiB
CSS
/* Design Agent — 기본 슬라이드 스타일 */
|
|
@import url('./tokens.css');
|
|
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css');
|
|
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
/* 슬라이드 컨테이너: 16:9 고정 비율 */
|
|
.slide {
|
|
width: 1280px;
|
|
height: 720px;
|
|
aspect-ratio: 16 / 9;
|
|
overflow: hidden;
|
|
background: var(--color-bg);
|
|
font-family: 'Pretendard Variable', 'Pretendard', 'Noto Sans KR', sans-serif;
|
|
color: var(--color-text);
|
|
font-size: var(--font-body);
|
|
line-height: var(--line-height-ko);
|
|
word-break: keep-all;
|
|
padding: var(--spacing-page);
|
|
display: grid;
|
|
gap: var(--spacing-block);
|
|
}
|
|
|
|
/* 슬라이드 제목 */
|
|
.slide-title {
|
|
font-size: var(--font-title);
|
|
font-weight: var(--weight-black);
|
|
color: var(--color-primary);
|
|
border-bottom: var(--accent-border) solid var(--color-accent);
|
|
padding-bottom: var(--spacing-small);
|
|
}
|
|
|
|
/* 섹션 제목 */
|
|
.section-title {
|
|
font-size: var(--font-subtitle);
|
|
font-weight: var(--weight-bold);
|
|
color: var(--color-primary);
|
|
margin-bottom: var(--spacing-small);
|
|
}
|
|
|
|
/* 본문 */
|
|
.body-text {
|
|
font-size: var(--font-body);
|
|
color: var(--color-text);
|
|
line-height: var(--line-height-ko);
|
|
}
|
|
|
|
/* 캡션/출처 */
|
|
.caption {
|
|
font-size: var(--font-caption);
|
|
color: var(--color-text-light);
|
|
font-style: italic;
|
|
}
|
|
|
|
/* 강조 텍스트 */
|
|
.highlight {
|
|
color: var(--color-accent);
|
|
font-weight: var(--weight-bold);
|
|
}
|
|
|
|
/* 경고/문제 강조 */
|
|
.danger {
|
|
color: var(--color-danger);
|
|
font-weight: var(--weight-bold);
|
|
}
|
|
|
|
/* ── 컨테이너 레이아웃 ── */
|
|
/* grid area: flex 축소 허용. overflow는 프레임(.slide)에서만 hidden. */
|
|
/* A-1(Sonnet 디자인 조정)이 텍스트 양에 맞게 CSS를 사전 조정하므로,
|
|
area 레벨에서는 overflow: visible로 텍스트 잘림을 방지한다. */
|
|
.slide > div {
|
|
overflow: visible;
|
|
min-height: 0;
|
|
min-width: 0;
|
|
}
|
|
/* area 안에서 flex-column 그룹핑된 블록들의 축소 허용 */
|
|
.slide > div > div {
|
|
min-height: 0;
|
|
flex-shrink: 1;
|
|
}
|