/* ============================================================ RE:WALK 공용 디자인 토큰 (단일 소스) ------------------------------------------------------------ 모든 도구는 에서 이 파일을 가장 먼저 불러옵니다. 각 도구의 로컬 변수(--navy, --ok, --high …)는 이름을 유지한 채 값만 아래 토큰(var(--t-…))을 가리키도록 재지정합니다. → 색/폰트/라운드/그림자를 바꿀 때는 이 파일만 수정하면 됩니다. ============================================================ */ :root{ /* ── 브랜드 ───────────────────────────── */ --t-navy: #1F3864; /* 기본 네이비(제목·주요 버튼) */ --t-navy-soft: #2A4A7C; /* 살짝 밝은 네이비(측면 navy2) */ --t-blue: #2E5C9E; /* 중간 파랑(보조 강조) */ --t-blue-soft: #5B8BD0; /* 밝은 파랑 */ --t-sky: #4A90E2; /* 액션 파랑(셸·등록 버튼) */ --t-amber: #D9842A; /* 앰버 강조 */ --t-amber-dark: #B5651D; /* 진한 앰버 */ --t-amber-tint: #F6E7D3; /* 앰버 배경 틴트 */ --t-green: #2E8B57; /* 성공/정상 */ --t-green-dark: #247046; /* 진한 성공 */ --t-danger: #C0392B; /* 경고/삭제 */ /* ── 중립(텍스트·면·선) ───────────────── */ --t-ink: #243244; /* 진한 제목 텍스트 */ --t-text: #2C3E50; /* 본문 텍스트 */ --t-gray: #6B7787; /* 흐린 텍스트(muted) */ --t-line: #D8E0EA; /* 기본 경계선 */ --t-line-soft: rgba(31,56,100,.14); /* 반투명 경계선(측면) */ --t-line-strong: rgba(31,56,100,.24); --t-paleblue: #EEF3FA; /* 아주 옅은 파랑 면 */ --t-lightblue: #DCE7F4; /* 옅은 파랑 면/선 */ --t-bg: #F7F9FC; /* 도구 배경 */ --t-surface: #FFFFFF; /* 카드/패널 */ --t-stage: #0B1220; /* 영상 스테이지(카메라 프리뷰 배경) */ --t-grid: rgba(46,92,158,.05); /* 옅은 격자 오버레이(측면) */ /* ── 타이포그래피 ─────────────────────── */ --t-sans: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Malgun Gothic', sans-serif; --t-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace; /* ── 라운드 ───────────────────────────── */ --t-r-sm: 8px; --t-r: 12px; --t-r-lg: 16px; --t-pill: 999px; /* ── 그림자 ───────────────────────────── */ --t-shadow-sm: 0 1px 3px rgba(31,56,100,.06); --t-shadow: 0 6px 18px rgba(31,56,100,.10); --t-shadow-lg: 0 10px 24px rgba(31,56,100,.18); }