/* =====================================================
   서사 디자인 시스템 — CSS 변수
   "도구는 사라지고, 글만 남아야 한다"
   ===================================================== */

/* ===== 라이트 테마 ===== */
:root {
    /* 배경 — 따뜻한 종이 질감 */
    --bg:               #f5f2ee;
    --bg-card:          #faf8f5;
    --bg-input:         #ede9e4;
    --bg-input-focus:   #faf8f5;

    /* 텍스트 계층 */
    --text-primary:     #1c1917;
    --text-secondary:   #57534e;
    --text-muted:       #78716c;
    --text-faint:       #a8a29e;

    /* 테두리 */
    --border:           #e7e5e2;
    --border-muted:     #ede9e6;
    --border-mid:       #dbd8d4;

    /* 그림자 — 최소한으로 */
    --shadow-card:      rgba(0,0,0,0.03);
    --shadow-modal:     rgba(0,0,0,0.10);
    --modal-shadow:     rgba(0,0,0,0.10);

    /* 어센트 — 앰버/세피아 (잉크 느낌) */
    --accent:           #92400e;
    --accent-bg:        #fef3c7;
    --accent-soft:      #fefce8;

    /* 버튼 */
    --btn-primary-bg:   #1c1917;
    --btn-primary-hover:#292524;
    --btn-primary-text: #faf8f5;

    /* 에러 */
    --error-bg:         #fff7f7;
    --error-border:     #fecaca;
    --error-text:       #b91c1c;

    /* 기타 */
    --backdrop:         rgba(0,0,0,0.38);
    --toggle-off:       #d6d3d1;

    /* episode-editor 호환 별칭 */
    --surface:          #faf8f5;
    --text:             #1c1917;
    --text-mid:         #57534e;
    --input-bg:         #ede9e4;
    --input-bg-2:       #f5f2ee;

    /* AI 버튼 — 앰버 계열 */
    --ai-btn-border:    #c9956a;
    --ai-btn-hover:     #fef9ee;
    --check-btn-border: #c9956a;
    --check-btn-hover:  #fef9ee;

    /* AI 결과 박스 */
    --result-bg:        #fef9ee;
    --result-border:    #e9c97e;
    --consistency-bg:   #fefdf0;
    --consistency-border:#c9956a;

    /* diff */
    --diff-before-bg:   #fff8f8;
    --diff-after-bg:    #f4fff6;
    --diff-section-border: #e7e5e2;

    /* 텍스트 선택 */
    --selection-bg:     rgba(146,64,14,0.13);
    --selected-preview-bg: #fef9ee;
}

/* ===== 다크 테마 — 작가가 가장 많이 사용하는 환경 ===== */
[data-theme="dark"] {
    color-scheme: dark;

    /* 배경 — 따뜻한 거의-검정 */
    --bg:               #0f0e0d;
    --bg-card:          #1a1917;
    --bg-input:         #232120;
    --bg-input-focus:   #2a2825;

    /* 텍스트 — 순백 아닌 크림색 */
    --text-primary:     #e8e3dd;
    --text-secondary:   #a8a29e;
    --text-muted:       #79756f;
    --text-faint:       #57534e;

    /* 테두리 */
    --border:           #2e2c2a;
    --border-muted:     #272523;
    --border-mid:       #3a3835;

    /* 그림자 */
    --shadow-card:      rgba(0,0,0,0.22);
    --shadow-modal:     rgba(0,0,0,0.48);
    --modal-shadow:     rgba(0,0,0,0.48);

    /* 어센트 — 다크에서도 앰버 */
    --accent:           #d97706;
    --accent-bg:        #1c1005;
    --accent-soft:      #1a1208;

    /* 버튼 */
    --btn-primary-bg:   #e8e3dd;
    --btn-primary-hover:#d6d0c9;
    --btn-primary-text: #0f0e0d;

    /* 에러 */
    --error-bg:         #280d0d;
    --error-border:     #5c1c1c;
    --error-text:       #fca5a5;

    /* 기타 */
    --backdrop:         rgba(0,0,0,0.62);
    --toggle-off:       #3f3c3a;

    /* episode-editor 호환 별칭 */
    --surface:          #1a1917;
    --text:             #e8e3dd;
    --text-mid:         #a8a29e;
    --input-bg:         #232120;
    --input-bg-2:       #1a1917;

    /* AI 버튼 */
    --ai-btn-border:    #5a4530;
    --ai-btn-hover:     #1c1208;
    --check-btn-border: #5a4530;
    --check-btn-hover:  #1c1208;

    /* AI 결과 박스 */
    --result-bg:        #1c1208;
    --result-border:    #5a4530;
    --consistency-bg:   #1c1208;
    --consistency-border:#5a4530;

    /* diff */
    --diff-before-bg:   #2a0000;
    --diff-after-bg:    #001a00;
    --diff-section-border: #2e2c2a;

    /* 텍스트 선택 */
    --selection-bg:     rgba(217,119,6,0.22);
    --selected-preview-bg: #1c1208;
}
