:root {
  /* Core brand + neutrals (Figma) */
  --color-primary: #6100FF; /* Button/Brand */
  --color-primary-hover: #5200E0;
  --color-secondary: #111111; /* used sparingly as accent */
  --color-text-primary: #111111; /* Font/02_black */
  --color-paper: #FFFFFF; /* BG/White_Color */
  --color-background: #F7F7FB; /* BG/Light_Color */

  /* Lines */
  --color-border: #E5E5EC; /* Line/Regular_Color */
  --line-regular: #E5E5EC;
  --line-light: #F1F1F5;
  --line-black: #111111;

  /* Extras */
  --brand: #6100FF;
  --radius-md: 6px;  /* 라운드(48-height) 기준 */
  --radius-lg: 16px; /* Dialog 등 대형 */
  --shadow-1: 0 4px 16px rgba(0,0,0,0.08);
  --shadow-dialog: var(--shadow-1);
  --font-family-sans: "Pretendard", "Noto Sans KR", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

body {
  margin: 0;
  min-height: 100vh;
  background: #F7F7FB;
  background: var(--color-background);
  font-family: 'Pretendard', 'Noto Sans KR', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 한국어 텍스트에 Noto Sans KR 적용 */
:lang(ko) {
  font-family: 'Noto Sans KR', 'Pretendard', sans-serif;
}

code {
  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
    monospace;
}

* {
  box-sizing: border-box;
}

.voice-input-active {
  background-color: #f3e5f5;
  border-color: #9c27b0;
}

.voice-input-listening {
  animation: pulse 1.5s infinite;
}

@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(156, 39, 176, 0.7);
  }
  70% {
    box-shadow: 0 0 0 10px rgba(156, 39, 176, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(156, 39, 176, 0);
  }
}

/* 학생 페이지에서 붙여넣기 방지를 위한 CSS */
/* 모바일 환경을 위한 추가적인 보안 스타일 */
.student-input-field {
  /* 텍스트 선택 제한 (붙여넣기를 위한 선택 방지) */
  -webkit-user-select: text !important;
  user-select: text !important;
  
  /* 모바일 터치 콜아웃 비활성화 */
  -webkit-touch-callout: none !important;
  
  /* 모바일 브라우저의 자동 기능 비활성화 */
  -webkit-user-modify: read-write-plaintext-only !important;
  
  /* iOS Safari를 위한 추가 설정 */
  -webkit-appearance: none !important;
}

/* 모바일에서 길게 누르기 메뉴 비활성화 */
.student-input-field,
.student-input-field * {
  -webkit-touch-callout: none !important;
  -webkit-user-select: text !important;
  touch-action: manipulation !important;
}

/* Android Chrome을 위한 추가 설정 */
.student-input-field textarea,
.student-input-field input {
  pointer-events: auto !important;
  touch-action: manipulation !important;
}

/* 붙여넣기 관련 의사 요소 스타일 */
.student-input-field::selection {
  background-color: rgba(25, 118, 210, 0.2);
}

.student-input-field::-moz-selection {
  background-color: rgba(25, 118, 210, 0.2);
}

/* Landing utilities */
.gradient-text {
  background: linear-gradient(135deg, #111111 0%, #6100FF 100%);
  background: linear-gradient(135deg, var(--color-secondary) 0%, var(--color-primary) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.section-muted {
  background-color: transparent;
}

/* Arch image frame */
.arch-frame {
  border-radius: 24px; /* 상하 동일한 네모 형태 */
  border: 6px solid #F1F1F5;
  border: 6px solid var(--line-light);
  padding: 12px;
}

.arch-image {
  border-radius: 16px; /* 상하 동일 */
}

/* Speech bubble */
.bubble {
  padding: 10px 12px;
  border-radius: 12px;
  background: #FFFFFF;
  background: var(--color-paper);
  border: 1px solid #E5E5EC;
  border: 1px solid var(--color-border);
}

/* Stat pill card */
.pill-card {
  border-radius: 14px;
  padding: 16px 20px;
}

/* Floating CTA */
.floating-cta {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: 24px;
  z-index: 1200;
  border-radius: 9999px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.08);
  box-shadow: var(--shadow-1);
}

/* Aardvark-like refinements */
.overline-compact {
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-weight: 700;
  color: #6b7280;
}

.bubble {
  box-shadow: 0 8px 24px rgba(0,0,0,0.08);
  -webkit-backdrop-filter: saturate(120%) blur(2px);
          backdrop-filter: saturate(120%) blur(2px);
}

/* Chat message bubble gradients */
.my-message-bubble {
  background: linear-gradient(135deg, #6B46C1 0%, #1E3A8A 100%) !important;
  color: white !important;
}

/* Instagram-like chat styles */
.chat-header {
  background: rgba(255, 255, 255, 0.95) !important;
  -webkit-backdrop-filter: blur(20px) !important;
          backdrop-filter: blur(20px) !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
}

.chat-input-area {
  background: rgba(255, 255, 255, 0.95) !important;
  -webkit-backdrop-filter: blur(20px) !important;
          backdrop-filter: blur(20px) !important;
  border-top: 1px solid rgba(0, 0, 0, 0.1) !important;
}

.chat-main {
  background: transparent !important;
}

.arch-frame {
  border-color: rgba(0,0,0,0.06);
}

/* Material Symbols (Outlined) */
.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Hero background */
.hero {
  background: transparent;
}

/* Anchor section offset for sticky navbar */
.anchor-section {
  scroll-margin-top: 88px;
}

/* Logo badge style (used as lightweight logo-cloud) */
.logo-badge {
  border-radius: 9999px !important;
  -webkit-backdrop-filter: saturate(140%) blur(4px);
          backdrop-filter: saturate(140%) blur(4px);
}

/* Instagram avatar ring */
.ig-ring {
  background: linear-gradient(135deg, #6B46C1 0%, #1E3A8A 100%);
  padding: 2px;
  border-radius: 50%;
}
.ig-ring > .inner {
  background: #fff;
  border-radius: 50%;
}

/* Compact card spacing for feed */
.feed-card {
  border: 1px solid rgba(0,0,0,0.06);
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
}
