/* ============================================================
   ds-fallback.css — crownyuja.co.kr/ds/v1 이 열리지 않을 때의 대비

   이 시트는 반드시 ds/v1 보다 **먼저** 실린다.
   커스텀 속성은 나중 선언이 이기므로, ds/v1 이 정상적으로 열리면
   여기 값은 전부 덮인다. 열리지 않을 때만 남는다.

   왜 필요한가
     교실 와이파이나 방화벽에서 외부 도메인이 막히면 토큰이 전부 비고,
     var(--yj-amber) 같은 선언이 무효가 되어 버튼 배경이 통째로 사라진다.
     이 앱은 PWA 라 오프라인에서도 열린다 — 그때도 같은 일이 생긴다.

   출처: student/SDGs/ds-fallback.css 를 옮기고, 이 앱의 lang.css 가
         쓰는 토큰(간격·활자·안전영역·그림자)을 보탰다.
   값은 ds/v1 + themes/student.css 그대로다. DS 가 바뀌면 함께 갱신한다.
   ============================================================ */

:root {
  /* 브랜드 — student 테마 (리프 그린이 주, 앰버가 보조) */
  --yj-amber:        #4CAA48;
  --yj-amber-press:  #2D7A29;
  --yj-amber-tint:   rgba(76, 170, 72, .16);
  --yj-amber-ink:    #2F7A2C;
  --yj-orange:       #F5C800;
  --yj-orange-press: #DDB400;
  --yj-orange-tint:  rgba(245, 200, 0, .15);
  --yj-orange-ink:   #8A6F00;
  --yj-leaf:         #4CAA48;
  --yj-leaf-press:   #2D7A29;
  --yj-leaf-tint:    rgba(76, 170, 72, .14);
  --yj-leaf-ink:     #2F7A2C;
  --yj-forest:       #142814;
  --yj-grad:         linear-gradient(135deg, #4CAA48 0%, #F5C800 100%);
  --yj-grad-soft:    linear-gradient(135deg, rgba(76,170,72,.18) 0%, rgba(245,200,0,.16) 100%);

  /* 중립 */
  --yj-canvas:          #FFFFFF;
  --yj-cream:           #FBFAF6;
  --yj-surface:         #F5F4F0;
  --yj-surface-2:       #EDECE7;
  --yj-hairline:        #E8E7E4;
  --yj-hairline-strong: #D8D6D0;

  /* 텍스트 */
  --yj-ink-deep: #16181A;
  --yj-ink:      #37352F;
  --yj-slate:    #6F6E69;
  --yj-steel:    #9B9A97;
  --yj-on-dark:  #FFFFFF;

  /* 의미색 */
  --yj-success:    #4CAA48;
  --yj-warn:       #E67E22;
  --yj-error:      #C82014;
  --yj-error-tint: rgba(200, 32, 20, .10);

  /* 모서리 4종 */
  --yj-r-xs:   4px;
  --yj-r-sm:   8px;
  --yj-r-lg:   16px;
  --yj-r-full: 9999px;

  /* 모션 3종 */
  --yj-m-fast: 120ms;
  --yj-m-mid:  200ms;
  --yj-m-slow: 320ms;
  --yj-ease:   cubic-bezier(.2, .8, .2, 1);

  /* 간격 8단계 */
  --yj-s1:  4px;  --yj-s2:  8px;  --yj-s3: 12px;  --yj-s4: 16px;
  --yj-s5: 24px;  --yj-s6: 32px;  --yj-s7: 48px;  --yj-s8: 64px;

  /* 서체 */
  --yj-font-ui:   "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont,
                  "Apple SD Gothic Neo", "Malgun Gothic", "Segoe UI", sans-serif;
  --yj-font-disp: "Paperlogy", var(--yj-font-ui);

  /* 활자 — 본문 17px 아래로 내려가지 않는다 */
  --yj-t-h2:    19px;
  --yj-t-body:  17px;
  --yj-t-cap:   13px;
  --yj-t-label: 11px;

  /* 셸 */
  --yj-dock-h: 56px;
  --yj-tap:    44px;
  --yj-safe-t: env(safe-area-inset-top, 0px);
  --yj-safe-b: env(safe-area-inset-bottom, 0px);
  --yj-float-gap: calc(var(--yj-dock-h) + var(--yj-safe-b) + var(--yj-s4));

  /* 그림자 */
  --yj-sh-card:  0 1px 2px rgba(20,24,16,.05), 0 4px 14px rgba(20,24,16,.05);
  --yj-sh-sheet: 0 -8px 32px rgba(0,0,0,.18);
  --yj-sh-toast: 0 8px 24px rgba(0,0,0,.26);
}
