

    /* ============================
    다크모드
    ============================ */  
    .theme-theme-ui-dark {
    --bg-image: url(https://i.imgur.com/k6U76aj.png);
    --logo: url(https://i.imgur.com/nWbGfqA.png);
    --color-column: rgba(0, 0, 0, .4);
    --color-columns: #1e202850;
    --color-brand-twitter: #1d9bf0;
    --color-brand-twitter-bg: #15202b;
    --color-brand-twitter-dim: #8b98a5;
    --color-brand-twitter-mud: #273340;
    --color-brand-twitter-dark: #232543;
    --color-brand-twitter-threaded-line: #425364;
    --color-brand-mastodon: #ffae00;
    --color-brand-mastodon-links: #ffae00;
    --color-brand-mastodon-bg: #1e2028;
    --color-brand-mastodon-dim: #717c9b;
    --color-brand-mastodon-mud: #403527;
    --color-brand-mastodon-dark: #433223;
    --color-brand-mastodon-threaded-line: #403527;
    --color-brand-mastodon-text-light: #8493a7;
    --color-bg: var(--color-brand-mastodon-bg);
    --color-bg-75: #1e2028bf;
    --color-fg: #fff;
    --color-border: #ffae0030;
    --color-dim: #be9d73;
    --color-accent: #ffae00;
    --color-accent-dark: #ffae00;
    --color-accent-dark-50: #ffae0080;
    --color-green: #00ba7c;
    --color-red: #f91880;
    --color-red-75: #f91880bf;
    --color-yellow: #ffac33;
    --color-light-shade: #ffffff05;
    --color-focusable-toot: #ffffff09;
    --color-light-text: #fff;
    --color-mud: var(--color-brand-mastodon-mud);
    --color-black-coral: #5a5371;
    --color-profile-button-hover: #f1eff41a;
    --color-column-link-hover: #f7f7f91a;
    --color-modal-overlay: #5b708366;
    --color-dark: var(--color-brand-mastodon-dark);
    --color-thread-line: var(--color-brand-mastodon-threaded-line);
    --color-gainsboro: #dcd9e8;
    --color-light-purple: #9baec8;
    --color-lighter-purple: #a5b8d3;
    --color-dark-electric-blue: #576078;
    --color-button-text: #f7f9f9;
    --color-ghost-button-text: var(--color-button-text);
    --color-verified: #79bd9a;
    --color-destructive: #df405a;
    --color-light-fuchsia-pink: #ff8cfd;
    --color-hashtag: var(--color-accent);
    --color-mention: var(--color-accent);
    --color-link: var(--color-accent);
    --color-bg-compose-form: rgb(64 51 39 / 40%);
    --color-bg-compose-form-focus: rgb(64 54 39 / 80%);
    --color-outer-space: #fff;
    --font-size: 15px;
    --font-size-smaller: 13px;
    --font-size-12: 12px;
    --font-size-mid: 14px;
    --font-size-bigger: 17px;
    --font-size-title: 19px;
    --font-size-heading: 20px;
    --font-weight-regular: 400;
    --font-weight-semibold: 500;
    --font-weight-bold: 700;
    --line-height: 22px;
    --line-height-mid: 20px;
    --gap-default: 12px;
    --gap-column-link: 12px;
    --size-avatar: 48px;
    --size-avatar-small: 32px;
    --size-icon-notification: 30px;
    --width-main-panel: 600px;
    --width-side-panel: 260px;
    --width-column: 380px;
    --border-radius: 16px;
    --border-radius-badges: 4px;
    --badges-distance-from-edge: 12px;
    --active-header-box-shadow: 0 1px 0 rgba(140, 141, 255, .3);
    --active-header-radial-gradient: radial-gradient(ellipse, rgba(99, 100, 255, .23) 0, rgba(99, 100, 255, 0) 60%);
    --compose-form-linear-gradient: linear-gradient(180deg, #1e2028, #1e2028 53%, rgba(30, 32, 40, .814) 76%, rgba(30, 32, 40, .708) 87%, rgba(30, 32, 40, .458) 97%, rgba(30, 32, 40, 0));
    --main-color: #ffae00;
    --main-text: #f8f8f8;
    --highlight-text: #FF0000;
     --default-black: #333333;
    --grey: #4e4e4e;
    --default-white: #f8f8f8;
    --brown : #5c503a;
            /* 공통요소 */
            /* UI 헤더 */
            .layout-single-column .ui__header {
                background-color: transparent;
                border-color: transparent;
            }
            /* 버튼 */
            .button.button--block {
                background-color: var(--main-color) !important;
                color: var(--default-white) !important;
                border-color: var(--main-color) !important;
            }
            .button.button--block:hover {
                background-color: var(--default-white) !important;
                color: var(--main-color) !important;
                border-color: var(--default-white) !important;
            }
            /* 라인 버튼 */
            .button.button--block.button-tertiary {
                background-color: transparent !important;
                color: var(--main-color) !important;
                border-color: var(--main-color) !important;
            }
            .button.button--block.button-tertiary:hover {
                background-color: var(--main-color) !important;
                color: var(--default-white) !important;
            }
            .button.button-secondary {
                background-color: transparent !important;
                color: var(--main-color) !important;
                border-color: var(--main-color) !important;
            }
            .button.button-secondary:hover {
                background-color: var(--main-color) !important;
                color: var(--default-white) !important;
                border-color: var(--main-color) !important;
            }
            .button.button {
                color: var(--main-color);
                background-color: transparent;
                border-color: var(--main-color);
            }
            .button.icon-button {
                color: var(--main-color);
                background-color: transparent;
            }
            /* 검색창 */
            .search__input {
                background-color: var(--default-white);
                color: var(--default-black);
            }
            .search__input::placeholder {
                color: var(--grey);
            }    
            .search__icon .fa-search.active {
                background-color: var(--default-white);
                color: var(--default-black) !important;
            }
            .search__popout {
                background-color: var(--default-white);
                box-shadow: 0 8px 24px -4px rgba(0,0,0,0.18);
            }
            .search__popout h4 span {
                color: var(--default-black);
            }
            .search__popout__menu__message {
                color: var(--grey);
            }
            .search__popout__menu__item {
                color: var(--grey);
            }
            .search__popout__menu__item:hover {
                background-color: var(--main-color);
            }
            .search__popout__menu mark {
                color: var(--default-black);
            }

            /* 드롭다운 메뉴 */
            .dropdown-menu,
            .dropdown-animation.dropdown-menu {
                background-color: var(--main-color) !important;
            }
            .dropdown-menu__container {
                background-color: var(--main-color);
                color: var(--default-white);
            }
            .dropdown-menu__item,
            .dropdown-menu__item > a {
                background-color: var(--main-color) !important;
                color: var(--default-white) !important; 
            }
            .dropdown-menu__item:hover,
            .dropdown-menu__item > a:hover {
                background-color: var(--default-white) !important;
                color: var(--main-color) !important;
            }
            .dropdown-menu__separator {
                border-bottom-color: var(--default-white)
            }
            /* 토글 나오는 그거 */
            .column-header__collapsible-inner {
                background-color: var(--main-color);
                border-color: var(--main-color); 
                color: var(--default-white);
            }
            .column-settings__section {
                color: var(--default-white);
            }
            .setting-toggle__label {
                color: var(--default-white);
            }
            .layout-single-column .react-toggle .react-toggle-track {
            background-color: var(--grey);
            }
            .react-toggle.react-toggle--checked .react-toggle-track {
            background-color: var(--highlight-text);
            }
            .react-toggle--checked .react-toggle-thumb {
            border-color: var(--highlight-text);
            }
            /* footer */
            .link-footer a span {
                color: var(--main-color);   
                text-decoration: none !important;
            }
            .link-footer strong {
                color: var(--main-color);
            }
            .link-footer .version {
                color: var(--main-color);
            }
            /* column */
            /* column 헤더 */
            .column-header__wrapper {
                background-color: transparent;
                border-color: var(--main-color); 
                color: var(--main-color);
            }
            .column-header__wrapper .fa-sliders:before{
                color: var(--main-color);
            }
            /* taps bar : 돌아가기 등 */
            .column-header__back-button span {
                color: var(--main-color); 
            }
           .fa-chevron-left:before {
                color: var(--main-color);
            }
            .fa-eye:before {
                color: var(--main-color);
            }
            .column-back-button {
                color: var(--main-color);
            }
            /* column body : 타임라인 등 */
            .scrollable.about {
                background-color: rgba(25, 25, 25, 0.5) !important;
                border-color: var(--main-color) !important;
            }
            /* 알림창 */
            .notification__filter-bar button.active:after {
            background-color: var(--main-color);
            } 
            .empty-column-indicator>span {
                color: var(--main-color);
            }
            /* 프로필 */
            account-role {
                color: var(--main-color);
                border-color: var(--main-color);
            }
    }

    /* ============================
    디폴트 모드
    ============================ */
body.theme-default.layout-single-column {
    --active-header-radial-gradient: radial-gradient(ellipse, rgb(239, 154, 154 / 25%) 0, rgb(255, 0, 81 / 0%) 60%);
    --bg-image: url(https://i.imgur.com/7RsBmxX.png);
    --logo: url(https://i.imgur.com/Bz4kY3H.png);
    --color-column: hsla(0, 0%, 100%, .8);
    --color-brand-mastodon: #be2a4d;
    --color-brand-mastodon-links: #df98a2;
    --color-accent-dark-50: #be2a4d80;
    --color-accent: #ffae00;
    --color-accent-dark: #ffae00;
    --color-border: #ffae0050;
    --color-dim: #e09900;
    --color-mud: #fff4e8;
    --color-light-purple: #ffae00;
    --color-bg-compose-form: rgb(192 175 108 / 20%);
    --color-bg-compose-form-focus: rgba(255, 248, 220, 0.679);
    --color-bg: #fff;
    --color-fg: #000;
    --color-green: #17bf63;
    --color-red: #e0245e;
    --color-red-75: #e0245ebf;
    --color-light-shade: #00000005;
    --color-focusable-toot: rgba(0, 0, 0, .035);
    --color-light-text: #1f1b23;
    --color-black-coral: #9188a6;
    --color-profile-button-hover: #1e1b231a;
    --color-column-link-hover: #1e1b231a;
    --color-modal-overlay: #6a5b8366;
    --color-dark: #f7f9f9;
    --color-thread-line: #e1e8ed;
    --color-topaz: #ffae00;
    --color-dark-electric-blue: #9088a6;
    --color-bg-75: #ffffffbf;
    --color-accent: var(--color-accent-dark);
    --color-ghost-button-text: var(--color-accent-dark);
    --color-hashtag: var(--color-accent-dark);
    --color-mention: var(--color-accent-dark);
    --compose-form-linear-gradient: linear-gradient(180deg, #fff, #fff 53%, hsla(0, 0%, 100%, .814) 76%, hsla(0, 0%, 100%, .708) 87%, hsla(0, 0%, 100%, .458) 97%, hsla(0, 0%, 100%, 0));
    --color-outer-space: #1f1b23;
    --main-color: #ffae00;
    --main-text: #f8f8f8;
    --highlight-text: #FF0000;
     --default-black: #333333;
    --grey: #4e4e4e;
    --default-white: #f8f8f8;
    --brown : #5c503a;
/*버튼 색 변경*/
.button.button--block {
                background-color: var(--main-color) !important;
                color: var(--default-white) !important;
                border-color: var(--main-color) !important;
            }
            .button.button--block:hover {
                background-color: var(--default-white) !important;
                color: var(--main-color) !important;
                border-color: var(--default-white) !important;
            }
}

.warning-banner {
    display: none !important;
}

/* 1. 모든 기본 아바타 이미지 숨기기 */
.account__avatar img[src*="missing.png"] {
    display: none !important;
}

/* 2. 부모 .account__avatar에 배경 이미지 적용 */
.account__avatar img[src*="missing.png"] {
    width: 100%;
    height: 100%;
}

/* 3. 실제 적용: 부모에 배경 이미지 */
.account__avatar {
    background-image: url('https://i.imgur.com/usQ9cpD.png') !important;
    background-size: cover !important;       /* 이미지 꽉 채우기 */
    background-position: center !important;  /* 중앙 정렬 */
    border-radius: 50% !important;           /* 원형 유지 */
}


.account-role {
    align-items: center;
    border: 1px solid #ffae00;
    border-radius: 6px;
    color: #ffae00;
    display: inline-flex
;
    font-size: 12px;
    font-weight: 500;
    gap: 4px;
    letter-spacing: .5px;
    line-height: 16px;
    padding: 4px;
    padding-inline-end: 8px;
}

.layout-single-column .notification .account__relationship>.button {
    border: 1px solid var(--main-color);
    color: var(--main-color);
}

.error-column__image {
    display: none;
}

.error-column {
    align-items: center;
    background: transparent;
}

.announcements__mastodon {
  display: none !important;
}

.announcements {
  display: block !important;   /* flex -> block 으로 바꿔서 한 줄 전체 차지 */
}

.announcements__container {
  width: 100% !important;      /* 가로폭 꽉 차기 */
  padding: 0 !important;       /* 혹시 남은 여백 제거 */
  margin: 0 !important;
}

.announcements__item__content {
  margin: 0 !important;
  padding: 0 !important;
  text-align: justify;         /* 필요하면 양쪽 정렬 */
}

.account-role {
    display: none;
}


