.custom-ch-top-bg{background-color: #F0F7FF;}
/* 표시 설정에서 html의 data 속성을 변경하면 즉시 적용됩니다.
   browser: 기존 디자인 / light: 밝게 / gray: 회색 / dark: 어두운 배경
   어두운 배경 종류: soft, black, navy, brown
   아래 변수를 수정하면 각 스킨의 색상을 바꿀 수 있습니다. */
html[data-background="light"] { --skin-page:#f9fafb; --skin-surface:#fff; --skin-text:#1f2937; --skin-border:#e5e7eb; --skin-top:#f0f7ff; }
html[data-background="gray"] { --skin-page:#e5e7eb; --skin-surface:#f9fafb; --skin-text:#1f2937; --skin-border:#cbd5e1; --skin-top:#e2e8f0; }
html[data-background="dark"] { --skin-page:#111827; --skin-surface:#1f2937; --skin-text:#e5e7eb; --skin-border:#475569; --skin-top:#182235; }
html[data-background="dark"][data-dark-background="black"] { --skin-page:#000; --skin-surface:#171717; --skin-border:#404040; --skin-top:#101010; }
html[data-background="dark"][data-dark-background="navy"] { --skin-page:#0f172a; --skin-surface:#1e293b; --skin-border:#334155; --skin-top:#17213a; }
html[data-background="dark"][data-dark-background="brown"] { --skin-page:#1c1917; --skin-surface:#292524; --skin-border:#57534e; --skin-top:#241f1b; }
html:is([data-background="light"],[data-background="gray"],[data-background="dark"]) body,
html:is([data-background="light"],[data-background="gray"],[data-background="dark"]) body > .min-h-screen {
    background:var(--skin-page) !important; color:var(--skin-text);
}
html:is([data-background="light"],[data-background="gray"],[data-background="dark"]) .custom-ch-top-bg { background:var(--skin-top) !important; }
html[data-background="dark"] :is(.bg-white,.bg-gray-50,.bg-gray-100,.news-fixed-channel,.news-headline-ticker,.community-editor-body,.editor-toolbar) {
    background:var(--skin-surface) !important; color:var(--skin-text); border-color:var(--skin-border);
}
html[data-background="dark"] :is(.text-gray-600,.text-gray-700,.text-gray-800,.text-gray-900) { color:var(--skin-text) !important; }
html[data-background="dark"] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),textarea,select) {
    background-color:var(--skin-page); color:var(--skin-text); border-color:var(--skin-border);
}
html[data-background="dark"] :is(.account-dropdown,.picker-panel) { background:var(--skin-surface); color:var(--skin-text); }

/* =========================================================
   사용자 스킨 작업 안내: 설정 변경 시 body에 아래 클래스가 적용됩니다.
   브라우저 기본: body.skin-browser
   밝게:          body.skin-light
   회색:          body.skin-gray
   어둡게:        body.skin-dark + 아래 세부 클래스 중 하나
   기본 어둡게:   body.skin-dark-soft
   검정:          body.skin-dark-black
   남색:          body.skin-dark-navy
   갈색:          body.skin-dark-brown
   다른 배경으로 바꾸면 이전 스킨 클래스는 자동으로 제거됩니다.

   사용 예시 (주석을 해제하고 원하는 색상으로 수정):

   body.skin-light {
       --skin-page: #f8fafc;
       --skin-top: #e0f2fe;
   }
   body.skin-dark-navy {
       --skin-page: #0b1120;
       --skin-surface: #172033;
       --skin-text: #e2e8f0;
   }
   body.skin-dark .원하는클래스 {
       background-color: #1e293b !important;
       color: #e2e8f0 !important;
   }
   body.skin-gray .custom-ch-top-bg {
       background-color: #dbe3ec !important;
   }
   ========================================================= */