/* =====================================================
   1. 배경 화면 설정 (라이트 / 다크 완벽 분리)
   ===================================================== */

/* [기본] 라이트 모드 배경 */
html, body, .app-body, .ui {
  background: url("https://i.imgur.com/jTNO5em.jpg") no-repeat center center fixed !important;
  background-size: cover !important;
}

/* [다크 모드] 시스템 설정 및 마스토돈 테마 대응 */
@media (prefers-color-scheme: dark) {
  html, body, .app-body, .ui {
    background: url("https://i.imgur.com/C51XfjQ.jpg") no-repeat center center fixed !important;
    background-size: cover !important;
  }
}
/* 마스토돈 설정에서 '다크 테마'를 직접 선택했을 때를 대비 */
.theme-dark html, .theme-dark body, .theme-dark .app-body, .theme-dark .ui {
  background: url("https://i.imgur.com/C51XfjQ.jpg") no-repeat center center fixed !important;
  background-size: cover !important;
}

/* UI 투명화 */
.columns-area, .column, .drawer__inner, .column-header, .ui__header, .ui__drawer, .scrollable {
  background: transparent !important;
  background-color: transparent !important;
}


/* =====================================================
   2. 휘핑 로고 제거 및 내 로고 덮어쓰기
   ===================================================== */

/* 기존 이미지(휘핑 로고) 숨기기 */
.ui__header__logo img.logo {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

/* 로고가 들어갈 링크 영역에 내 로고 주입 */
.ui__header__logo {
  display: inline-block !important;
  vertical-align: middle;
  
  /* 로고 크기 설정 (원하는 크기로 조정하세요) */
  width: 180px !important; 
  height: 45px !important;
  
  background-repeat: no-repeat !important;
  background-position: left center !important;
  background-size: contain !important;
  
  /* [기본] 라이트 모드 로고 주소 */
  background-image: url("https://i.imgur.com/oWoh30c.png") !important;
}

/* [다크 모드] 로고 이미지 교체 */
@media (prefers-color-scheme: dark) {
  .ui__header__logo {
    background-image: url("https://i.imgur.com/KhGM0yX.png") !important;
  }
}
.theme-dark .ui__header__logo {
  background-image: url("https://i.imgur.com/KhGM0yX.png") !important;
}


/* =====================================================
   3. 기타 불필요한 영역 제거 (랜딩 페이지 등)
   ===================================================== */
.landing-page__logo, .hero-widget__img {
  display: none !important;
}