/* 알뜰서버 — 손글씨 스크랩북/노트 분위기 테마 (번들 무수정, 번들 CSS 뒤에 로드해 덮어씀).
 * 따뜻한 크림 종이 배경 + 손글씨 한글 폰트 + 둥근 검정 알약 버튼 + 부드러운 종이 카드 + 은은한 낙서.
 * 메인(랜딩=로그인 전)·로그인·로그인 후 대시보드 전부에 적용. 가독성 위해 본문은 Pretendard 유지, 제목/포인트만 손글씨. */
/* 제목·포인트용 폰트 = SUIT(sun-typeface, 상업용 무료). 자체 호스팅(필요 굵기만 로드: 400/700/800). */
@font-face {
  font-family: 'SUIT';
  src: url('/app/fonts/SUIT-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SUIT';
  src: url('/app/fonts/SUIT-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SUIT';
  src: url('/app/fonts/SUIT-ExtraBold.woff2') format('woff2');
  font-weight: 800 900;
  font-style: normal;
  font-display: swap;
}
/* 붓글씨 느낌 제목용 = 주아체(배민, 상업용 무료). 메인 랜딩 헤드라인 등에만 사용. */
@font-face {
  font-family: 'Jua';
  src: url('/app/fonts/Jua-400.woff2') format('woff2');
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
}
/* 온글잎 손글씨체 — 랜딩 히어로용(2026-07-21). 자체 호스팅. */
@font-face {
  font-family: 'OngleipEoyeonce';   /* 온글잎 의연체 — 헤드라인 */
  src: url('/app/fonts/OngleipEoyeonce.woff') format('woff');
  font-weight: normal; font-display: swap;
}
@font-face {
  font-family: 'OngleipParkDahyeon';  /* 온글잎 박다현체 — 태그 */
  src: url('/app/fonts/OngleipParkDahyeon.woff2') format('woff2');
  font-weight: normal; font-display: swap;
}
@font-face {
  font-family: 'GriunCherry1Spoon';  /* 그리운 체리 한스푼 — 헤드라인(GRIUN) */
  src: url('/app/fonts/GriunCherry1Spoon.woff2') format('woff2');
  font-weight: normal; font-display: swap;
}
@font-face {
  font-family: 'OngleipWishList';  /* 온글잎 위씨리스트 — 헤드라인 */
  src: url('/app/fonts/OngleipWishList.woff2') format('woff2');
  font-weight: normal; font-display: swap;
}
@font-face {
  font-family: 'KyoboHandwriting2025';  /* 교보문고 손글씨 2025 이유빈 — 태그 */
  src: url('/app/fonts/KyoboHandwriting2025.woff2') format('woff2');
  font-weight: normal; font-display: swap;
}
@font-face {
  font-family: 'SoyoDanpung';  /* 소요단풍체 — 태그(동두천시) */
  src: url('/app/fonts/SoyoDanpung.woff2') format('woff2');
  font-weight: normal; font-display: swap;
}

:root {
  --ink: #2c2722;            /* 따뜻한 먹색 */
  --sub: #8a8073;            /* 흙빛 회색 */
  --line: #e7ddca;           /* 부드러운 종이 테두리 */
  --accent: #f0699a;         /* 손그림 핑크 포인트 */
  --bg: #FEFAF5;             /* 따뜻한 크림(2026-07-21 변경) */
  --paper: #fffdf7;          /* 카드용 밝은 종이 */
  --hand: 'SUIT', 'Apple SD Gothic Neo', system-ui, sans-serif;
}

/* 배경: 업로드한 모눈종이+손그림 낙서 이미지(al-bg.jpg)를 전체 페이지 고정 배경으로. */
body {
  background: var(--bg) !important;
  color: var(--ink);
}
body::before {
  content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  /* CSS 격자(고정 24px, 뷰포트 무관 균일). 2026-07-21: SVG(cover 스케일) → linear-gradient 로 교체. */
  background-color: #FEFAF5;
  background-image:
    linear-gradient(rgba(120,150,170,0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(120,150,170,0.08) 1px, transparent 1px);
  background-size: 24px 24px;
}
#app, .wrap { position: relative; z-index: 1; }

/* 제목·브랜드·포인트는 손글씨 */
h1, h2, h3, .brand h1, .tab, .al-loginlogo + *, .sectit, .secttl {
  font-family: var(--hand);
  letter-spacing: .2px;
}
h1 { font-weight: 700 !important; }
.kv, .auth .kv { font-family: var(--hand); font-size: 16px; color: var(--sub); }

/* 둥근 검정 알약 버튼 (CTA) */
.primary, .sm.primary, .big, button.primary {
  background: #1f1b16 !important; color: #fff7ea !important; border-color: #1f1b16 !important;
  border-radius: 999px !important; font-family: var(--hand); font-weight: 700 !important;
  box-shadow: 0 4px 0 rgba(40,33,24,.18); letter-spacing: .3px;
}
.primary:hover, .sm.primary:hover, .big:hover { background: #000 !important; }
.big { box-shadow: 0 5px 0 rgba(40,33,24,.18); }
/* 카카오 로그인은 브랜드색 유지하되 알약 */
.kakao { border-radius: 999px !important; font-family: var(--hand); font-weight: 700; }
/* 일반 버튼/아이콘 더 둥글게 + 종이질감 */
.tbtn, .copy, .icon, .pickbtn, .addtile, .step, .agm-btn { border-radius: 14px !important; }
.icon { background: var(--paper); border-color: var(--line); }

/* 카드/패널 = 살짝 떠 있는 종이 */
.panel, .mcard, .stat, .usagebox, .sharedbox, .ten, .pickbtn, .modal, .al-agm-card, .step, .warn {
  border-radius: 18px !important;
  background: var(--paper);
  border: 1px solid var(--line) !important;
  box-shadow: 0 6px 18px rgba(120,95,40,.07);
}
.addtile { border: 2px dashed var(--line) !important; border-radius: 18px !important; background: #fffdf6; }
/* 대시보드 사이드바 배경만 페이지 배경(#FEFAF5)과 통일. 본문(.dash-content)은 기존 화이트(#fffdfa) 유지. 2026-07-21. */
.dash-side { background: #FEFAF5 !important; }
.dash-content { background: #fffdfa !important; }

/* 로그인/회원가입 탭 = 종이 토글 */
.tabs { background: #f3ead7 !important; border-radius: 999px !important; padding: 5px; }
.tab { border-radius: 999px !important; font-size: 16px; }
.tab.on { background: var(--paper) !important; color: var(--ink) !important; box-shadow: 0 2px 6px rgba(120,95,40,.12); }

/* 입력칸 = 종이 */
input, textarea, select {
  background: var(--paper) !important;
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
}
input:focus, textarea:focus { outline: 2px solid rgba(240,105,154,.35); border-color: var(--accent) !important; }
/* AI 채팅 컴포저 안 textarea 는 컨테이너(.aichat-inbox)가 박스 역할 — 전역 입력칸 테마가 이중 박스를 만들지 않게 예외 */
.aichat-inbox textarea, .wc-box textarea { background: transparent !important; border: none !important; border-radius: 0 !important; }
.aichat-inbox textarea:focus, .wc-box textarea:focus { outline: none; }

/* 링크/포인트 색 */
a { color: #d9568a; }
.brandbar { border-bottom: 2px dashed var(--line) !important; }

/* 로그인 화면 중앙 카드 느낌 + 손그림 여백 */
.wrap.auth { max-width: 460px; margin: 0 auto; }
.wrap.auth .brand { margin-top: 30px !important; }

/* 배경 이미지(al-bg.jpg)에 이미 손그림 낙서가 들어있어 JS 주입 낙서는 끔(중복 방지) */
#al-doodles { display: none !important; }

/* 메인 랜딩 아래 '요금제 안내'(#al-pricing)도 크림 종이 테마로 통일(기존 흰/파랑 → 종이/핑크) */
#al-pricing h2 { font-family: var(--hand); color: var(--ink); }
#al-pricing .al-plan { background: var(--paper) !important; border: 1px solid var(--line) !important; border-radius: 18px !important; box-shadow: 0 6px 18px rgba(120,95,40,.07); }
#al-pricing .al-plan h3 { font-family: var(--hand); color: var(--ink); }
#al-pricing .al-price { color: #d9568a !important; }
#al-pricing .al-plan ul { color: var(--sub); }
#al-pricing .al-note { color: var(--sub); }

/* 공유받은 작업공간 AI 채팅수정: 초록과 같은 채도의 밝은 파란(요청) */
.ten-act3 .full.prim.ai-blue{background:linear-gradient(180deg,#3b82f6,#2563eb) !important;border-color:transparent !important}
.ten-act3 .full.prim.ai-blue small{color:#dbe8ff !important}