/* ═══════════════════════════════════════════════
   DryFairy — Pixel Art GUI (v3)
   Sprites als border-image MIT border-width damit
   die 9-Slice Grafiken tatsächlich sichtbar sind.
   ═══════════════════════════════════════════════ */


/* ═══════════════════════════════════════════════
   1. LOGIN — Lesbarkeit
   ═══════════════════════════════════════════════ */

.sf-login-box {
    border: 16px solid transparent;
    border-image: url('img/gui/basic_view/board/board_01.png') 16 fill / 16px stretch;
    border-radius: 0;
    box-shadow: none;
    image-rendering: pixelated;
}

.sf-login-form input {
    background: #0e0c08;
    border: 4px solid transparent;
    border-image: url('img/gui/basic_view/frame/frame_07.png') 4 / 4px stretch;
    border-radius: 0;
    color: #ffffff;
    padding: 12px 14px;
    font-size: 15px;
    font-weight: 500;
    image-rendering: pixelated;
    caret-color: #DEA726;
}
.sf-login-form input::placeholder { color: #6a5a40; }
.sf-login-form input:focus {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
    background: #12100a;
    box-shadow: 0 0 0 1px rgba(222,167,38,0.3);
    outline: none;
}

.sf-login-tab {
    border: 5px solid transparent;
    border-image: url('img/gui/shop/button/button_category_01.png') 5 fill / 5px stretch;
    border-radius: 0;
    image-rendering: pixelated;
    background: transparent;
}
.sf-login-tab.active {
    border-image-source: url('img/gui/shop/button/button_square_04.png');
    color: #f0e8d8;
}


/* ═══════════════════════════════════════════════
   2. HUD TOP BAR
   ═══════════════════════════════════════════════ */

/* Dashboard-Zeilen: mehr vertikalen Platz für größere Icons */
.sf-dash-resources {
    padding: 6px 12px;
    gap: 6px;
}
.sf-dash-nav {
    padding: 4px 12px;
}

.sf-hud-outer {
    border: 4px solid transparent;
    border-image: url('img/gui/basic_view/board/board_04.png') 4 fill / 4px stretch;
    border-radius: 0;
    box-shadow: none;
    image-rendering: pixelated;
}

.sf-res {
    border: 4px solid transparent;
    border-image: url('img/gui/basic_view/frame/frame_07.png') 4 fill / 4px stretch;
    border-radius: 0;
    box-shadow: none;
    image-rendering: pixelated;
    padding: 6px 14px;
    font-size: 16px;
    gap: 8px;
}
.sf-res-val {
    font-size: 16px;
}
.sf-res-rate {
    font-size: 13px;
}
.sf-res:hover {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
}


/* ═══════════════════════════════════════════════
   3. UNTERSCHLUPF TOOLBAR
   ═══════════════════════════════════════════════ */

.sf-ho-toolbar {
    border: 6px solid transparent;
    border-image: url('img/gui/shop/board/board_02.png') 8 fill / 6px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}

.sf-ho-tbtn {
    border: 5px solid transparent;
    border-image: url('img/gui/shop/button/button_category_01.png') 5 fill / 5px stretch;
    border-radius: 0;
    background: transparent;
    image-rendering: pixelated;
    color: var(--sf-text-dim);
}
.sf-ho-tbtn:hover,
.sf-ho-tbtn.active {
    border-image-source: url('img/gui/shop/button/button_square_04.png');
    background: transparent;
    color: #f0e8d8;
    text-shadow: 1px 1px 0 rgba(0,0,0,0.5);
}


/* ═══════════════════════════════════════════════
   4. UNTERSCHLUPF SIDEBAR (rechts)
   ═══════════════════════════════════════════════ */

.sf-ho-sidebar {
    border: 12px solid transparent;
    border-image: url('img/gui/basic_view/board/board_01.png') 12 fill / 12px stretch;
    border-radius: 0;
    image-rendering: pixelated;
    border-left-width: 16px;
}

.sf-ho-sb-header {
    border-bottom: 6px solid transparent;
    border-image: url('img/gui/shop/board/board_01.png') 6 fill / 6px stretch;
    image-rendering: pixelated;
}


/* ═══════════════════════════════════════════════
   5. UNTERSCHLUPF GRID ZELLEN
   ═══════════════════════════════════════════════ */

.sf-ho-grid {
    border-radius: 0;
    gap: 2px;
}

.sf-hc {
    border-radius: 2px;
}

/* Gebäude-Zellen */
.sf-hc-bld {
    border: 4px solid transparent;
    border-image: url('img/gui/Inventory/frame/frame_02.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}
.sf-hc-bld:hover {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
    box-shadow: none;
    transform: none;
}

/* Level Badge */
.sf-hc-lvl {
    border: 3px solid transparent;
    border-image: url('img/gui/basic_view/frame/frame_07.png') 3 fill / 3px stretch;
    border-radius: 0;
    background: transparent;
    image-rendering: pixelated;
}

/* Leere Zelle */
.sf-hc-empty {
    border: 4px solid transparent;
    border-image: url('img/gui/Inventory/frame/frame_04.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}
.sf-hc-empty:hover {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
    box-shadow: none;
}

/* Selektiert */
.sf-hc-sel {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png') !important;
}


/* ═══════════════════════════════════════════════
   6. ADVISOR PANEL (links)
   ═══════════════════════════════════════════════ */

.sf-advisor-panel {
    border: 12px solid transparent;
    border-image: url('img/gui/basic_view/board/board_01.png') 12 fill / 12px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}

.sf-adv-portrait {
    border: 4px solid transparent;
    border-image: url('img/gui/basic_view/frame/frame_08.png') 4 fill / 4px stretch;
    border-radius: 0;
    box-shadow: none;
    image-rendering: pixelated;
}


/* ═══════════════════════════════════════════════
   7. PANELS & SIDEBARS
   ═══════════════════════════════════════════════ */

.sf-planet-sidebar {
    border: 14px solid transparent;
    border-image: url('img/gui/basic_view/board/board_01.png') 14 fill / 14px stretch;
    border-radius: 0;
    box-shadow: none;
    image-rendering: pixelated;
}

.sf-brew-sidebar {
    border: 12px solid transparent;
    border-image: url('img/gui/basic_view/board/board_01.png') 12 fill / 12px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}

.sf-notif-panel {
    border: 12px solid transparent;
    border-image: url('img/gui/basic_view/board/board_01.png') 12 fill / 12px stretch;
    border-radius: 0;
    box-shadow: none;
    image-rendering: pixelated;
}


/* ═══════════════════════════════════════════════
   8. BUTTONS
   ═══════════════════════════════════════════════ */

.sf-btn {
    border: 5px solid transparent;
    border-image: url('img/gui/shop/button/button_square_01.png') 5 fill / 5px stretch;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
    image-rendering: pixelated;
    transition: filter 0.15s;
}
.sf-btn:hover {
    filter: brightness(1.2);
    transform: none;
    background: transparent;
    box-shadow: none;
}

.sf-btn-primary,
.sf-btn-brewery {
    border: 5px solid transparent;
    border-image: url('img/gui/shop/button/button_square_04.png') 5 fill / 5px stretch;
    background: transparent;
    color: #f0e8d8;
    text-shadow: 1px 1px 0 rgba(0,0,0,0.5);
}
.sf-btn-primary:hover,
.sf-btn-brewery:hover {
    filter: brightness(1.3);
    background: transparent;
    box-shadow: none;
    transform: none;
}

.sf-btn-danger {
    border: 5px solid transparent;
    border-image: url('img/gui/shop/button/button_square_03.png') 5 fill / 5px stretch;
    background: transparent;
    color: #f0e8d8;
}

.sf-btn-sm {
    border-width: 4px;
    border-image-width: 4px;
    border-image-slice: 4;
}

.sf-btn-back,
.sf-dash-back {
    border: 5px solid transparent;
    border-image: url('img/gui/basic_view/button/button_round_01.png') 5 fill / 5px stretch;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
    image-rendering: pixelated;
}


/* ═══════════════════════════════════════════════
   9. TABS
   ═══════════════════════════════════════════════ */

.sf-tab {
    border: 5px solid transparent;
    border-image: url('img/gui/shop/button/button_category_01.png') 5 fill / 5px stretch;
    border-radius: 0;
    background: transparent;
    image-rendering: pixelated;
}
.sf-tab.active,
.sf-tab:hover {
    border-image-source: url('img/gui/shop/button/button_square_04.png');
    background: transparent;
    color: #f0e8d8;
    text-shadow: 1px 1px 0 rgba(0,0,0,0.5);
}


/* ═══════════════════════════════════════════════
   10. CARDS
   ═══════════════════════════════════════════════ */

.sf-building-card,
.sf-body-card,
.sf-dorf-action-card,
.sf-build-option {
    border: 5px solid transparent;
    border-image: url('img/gui/Inventory/frame/frame_02.png') 5 fill / 5px stretch;
    border-radius: 0;
    box-shadow: none;
    image-rendering: pixelated;
}
.sf-building-card:hover,
.sf-body-card:hover,
.sf-build-option:hover,
.sf-building-card.active {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
    box-shadow: none;
    transform: none;
}

.sf-building-detail {
    border: 12px solid transparent;
    border-image: url('img/gui/basic_view/board/board_01.png') 12 fill / 12px stretch;
    border-radius: 0;
    box-shadow: none;
    image-rendering: pixelated;
}


/* ═══════════════════════════════════════════════
   11. HEADERS
   ═══════════════════════════════════════════════ */

.sf-system-header,
.sf-planet-header {
    border: 6px solid transparent;
    border-image: url('img/gui/shop/frame/frame_02.png') 6 fill / 6px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}

.sf-dorf-detail-header {
    border: 6px solid transparent;
    border-image: url('img/gui/shop/frame/frame_01.png') 6 fill / 6px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}


/* ═══════════════════════════════════════════════
   12. OVERLAYS & MODALS
   ═══════════════════════════════════════════════ */

.sf-confirm-box,
.sf-ho-overlay-panel {
    border: 16px solid transparent;
    border-image: url('img/gui/basic_view/board/board_01.png') 16 fill / 16px stretch;
    border-radius: 0;
    box-shadow: none;
    image-rendering: pixelated;
}

.sf-toast {
    border: 10px solid transparent;
    border-image: url('img/gui/basic_view/board/board_03.png') 10 fill / 10px stretch;
    border-radius: 0;
    box-shadow: none;
    image-rendering: pixelated;
}


/* ═══════════════════════════════════════════════
   13. INFO BOXES
   ═══════════════════════════════════════════════ */

.sf-detail-desc {
    border: 4px solid transparent;
    border-image: url('img/gui/shop/frame/frame_04.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}

.sf-detail-production {
    border: 4px solid transparent;
    border-image: url('img/gui/shop/frame/frame_06.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}

.sf-onboarding-box {
    border: 4px solid transparent;
    border-image: url('img/gui/shop/frame/frame_06.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}


/* ═══════════════════════════════════════════════
   14. ITEM SLOTS
   ═══════════════════════════════════════════════ */

.sf-brew-slot,
.sf-brew-tile {
    border: 4px solid transparent;
    border-image: url('img/gui/Inventory/frame/frame_03.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}
.sf-brew-slot:hover,
.sf-brew-tile:hover {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
}


/* ═══════════════════════════════════════════════
   15. GALAXY / SYSTEM MAP
   ═══════════════════════════════════════════════ */

.sf-gal-legend,
.sf-gal-controls {
    border: 8px solid transparent;
    border-image: url('img/gui/basic_view/board/board_03.png') 8 fill / 8px stretch;
    border-radius: 0;
    box-shadow: none;
    image-rendering: pixelated;
}

.sf-gal-tooltip {
    border: 4px solid transparent;
    border-image: url('img/gui/shop/frame/frame_04.png') 4 fill / 4px stretch;
    border-radius: 0;
    box-shadow: none;
    image-rendering: pixelated;
}


/* ═══════════════════════════════════════════════
   16. BOTEN
   ═══════════════════════════════════════════════ */

.sf-dorf-boten-bar {
    border: 5px solid transparent;
    border-image: url('img/gui/Inventory/frame/frame_02.png') 5 fill / 5px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}

.sf-dorf-scene {
    border-radius: 0;
}


/* ═══════════════════════════════════════════════
   17. BUILD MENU
   ═══════════════════════════════════════════════ */

.sf-ho-build-menu {
    border: 12px solid transparent;
    border-image: url('img/gui/basic_view/board/board_01.png') 12 fill / 12px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}

.sf-ho-build-item {
    border: 4px solid transparent;
    border-image: url('img/gui/Inventory/frame/frame_02.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}
.sf-ho-build-item:hover {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
}


/* ═══════════════════════════════════════════════
   18. CLOSE BUTTONS
   ═══════════════════════════════════════════════ */

.sf-detail-close,
.sf-ho-close,
.sf-notif-close {
    border: 4px solid transparent;
    border-image: url('img/gui/shop/button&frame/xbutton_01.png') 4 fill / 4px stretch;
    border-radius: 0;
    background: transparent;
    image-rendering: pixelated;
    box-shadow: none;
}
.sf-detail-close:hover,
.sf-ho-close:hover,
.sf-notif-close:hover {
    border-image-source: url('img/gui/shop/button&frame/xframe_01.png');
    filter: brightness(1.3);
    background: transparent;
}


/* ═══════════════════════════════════════════════
   19. PROGRESS BARS
   ═══════════════════════════════════════════════ */

.sf-scan-bar,
.sf-storage-bar {
    border-radius: 2px;
}

.sf-hc-prog {
    border-radius: 0;
}
.sf-hc-prog-bar {
    border-radius: 0;
}


/* ═══════════════════════════════════════════════
   20. COMPACT NAV (integriert in Ressourcen-Leiste)
   ═══════════════════════════════════════════════ */

/* Container: rechts in der Ressourcen-Zeile */
.sf-dash-compact-nav {
    display: flex;
    align-items: center;
    gap: 2px;
    margin-left: auto;
    padding-left: 12px;
    flex-shrink: 0;
}

/* Kompakte Icon-Buttons — rahmenlos, dezent */
.sf-cnav-btn {
    background: none;
    border: none;
    color: var(--sf-text-dim);
    cursor: pointer;
    padding: 4px 6px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s, background 0.2s;
    font-size: 14px;
    text-decoration: none;
}
.sf-cnav-btn:hover {
    color: var(--sf-accent);
    background: rgba(222,167,38,0.1);
}
.sf-cnav-btn .gg-icon {
    width: 18px !important;
    height: 18px !important;
    font-size: 15px !important;
    line-height: 18px !important;
}

/* Benachrichtigungs-Badge */
.sf-cnav-notif {
    position: relative;
}
.sf-cnav-notif .sf-notif-badge {
    position: absolute;
    top: -2px;
    right: -2px;
    font-size: 9px;
    min-width: 14px;
    height: 14px;
    line-height: 14px;
    padding: 0 3px;
    border-radius: 7px;
    background: #e53935;
    color: #fff;
    text-align: center;
}

/* Trenner */
.sf-cnav-sep {
    width: 1px;
    height: 16px;
    background: rgba(222,167,38,0.2);
    margin: 0 6px;
}

/* Username + Version */
.sf-cnav-user {
    font-size: 12px;
    color: var(--sf-text-dim);
    cursor: pointer;
    padding: 2px 6px;
    border-radius: 4px;
    white-space: nowrap;
    transition: color 0.2s;
}
.sf-cnav-user:hover {
    color: var(--sf-accent);
}
.sf-cnav-ver {
    font-size: 10px;
    opacity: 0.6;
    margin-left: 4px;
}

/* Logout — dezent rot */
.sf-cnav-logout {
    color: var(--sf-red, #e53935);
    font-size: 12px;
    font-weight: bold;
    opacity: 0.6;
}
.sf-cnav-logout:hover {
    opacity: 1;
    background: rgba(229,57,53,0.1);
    color: #ff5252;
}


/* ═══════════════════════════════════════════════
   21. DIVIDERS
   ═══════════════════════════════════════════════ */

.sf-ho-sb-section {
    border-bottom-color: #2a2218;
}


/* ═══════════════════════════════════════════════
   22. RESEARCH TABS
   ═══════════════════════════════════════════════ */

.rt-active {
    border: 4px solid transparent;
    border-image: url('img/gui/shop/frame/frame_06.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}


/* ═══════════════════════════════════════════════
   23. SIDEBAR BUILDING EINTRÄGE
   ═══════════════════════════════════════════════ */

.sf-ho-sb-bld {
    border: 3px solid transparent;
    border-image: url('img/gui/basic_view/frame/frame_07.png') 3 fill / 3px stretch;
    border-radius: 0;
    image-rendering: pixelated;
    margin-bottom: 2px;
}
.sf-ho-sb-bld:hover {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
}

/* Sidebar Kategorie-Header */
.sf-ho-sb-cat {
    border: 4px solid transparent;
    border-image: url('img/gui/shop/frame/frame_04.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
    margin-bottom: 4px;
}

/* Sidebar Section Dividers */
.sf-ho-sb-section {
    border-bottom: 3px solid transparent;
    border-image: url('img/gui/exchange/bar/bar_01.png') 0 0 3 0 / 0 0 3px 0 stretch;
    image-rendering: pixelated;
}


/* ═══════════════════════════════════════════════
   24. ADVISOR NOTIF ITEMS
   ═══════════════════════════════════════════════ */

.sf-adv-nitem {
    border: 3px solid transparent;
    border-image: url('img/gui/basic_view/frame/frame_07.png') 3 fill / 3px stretch;
    border-radius: 0;
    image-rendering: pixelated;
    margin-bottom: 2px;
}
.sf-adv-nitem:hover {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
}
.sf-adv-nitem.sf-adv-unread {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
}

/* Advisor Dialog Controls */
.sf-adv-controls {
    border-top: 3px solid transparent;
    border-image: url('img/gui/exchange/bar/bar_01.png') 0 0 3 0 / 0 0 3px 0 stretch;
    image-rendering: pixelated;
}


/* ═══════════════════════════════════════════════
   25. GRABBARE ZELLEN (candig)
   ═══════════════════════════════════════════════ */

.sf-hc-candig {
    border: 4px solid transparent;
    border-image: url('img/gui/Inventory/frame/frame_05.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}
.sf-hc-candig:hover {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
    box-shadow: none;
}

/* Fels-Zellen */
.sf-hc-rock {
    border-radius: 0;
}

/* Ausgegrabene Zellen */
.sf-hc-dug {
    border: 3px solid transparent;
    border-image: url('img/gui/Inventory/frame/frame_03.png') 3 fill / 3px stretch;
    border-radius: 0;
    image-rendering: pixelated;
    box-shadow: none;
}


/* ═══════════════════════════════════════════════
   26. BREADCRUMB / NAVIGATION LABEL
   ═══════════════════════════════════════════════ */

.sf-crumb {
    border: 4px solid transparent;
    border-image: url('img/gui/shop/frame/frame_04.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}
.sf-crumb.active,
.sf-crumb:last-child {
    border-image-source: url('img/gui/shop/frame/frame_06.png');
}


/* ═══════════════════════════════════════════════
   27. SCROLLBAR — Pixel-Style
   ═══════════════════════════════════════════════ */

::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: #1a1510;
    border-left: 1px solid #3a3020;
}
::-webkit-scrollbar-thumb {
    background: #4a3c28;
    border: 1px solid #5a4c38;
    border-radius: 0;
}
::-webkit-scrollbar-thumb:hover {
    background: #6a5c40;
    border-color: #DEA726;
}


/* ═══════════════════════════════════════════════
   28. QUEUE PANEL
   ═══════════════════════════════════════════════ */

.sf-ho-queue-panel {
    border: 12px solid transparent;
    border-image: url('img/gui/basic_view/board/board_01.png') 12 fill / 12px stretch;
    border-radius: 0;
    box-shadow: none;
    image-rendering: pixelated;
}

.sf-ho-queue-item {
    border: 3px solid transparent;
    border-image: url('img/gui/basic_view/frame/frame_07.png') 3 fill / 3px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}


/* ═══════════════════════════════════════════════
   29. DORF BOTEN DETAILS
   ═══════════════════════════════════════════════ */

.sf-dorf-bote {
    border: 4px solid transparent;
    border-image: url('img/gui/Inventory/frame/frame_02.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}
.sf-dorf-bote:hover {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
}

/* Dorfplatz Action Cards */
.sf-dorf-action-card {
    border: 5px solid transparent;
    border-image: url('img/gui/Inventory/frame/frame_02.png') 5 fill / 5px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}
.sf-dorf-action-card:hover {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
}


/* ═══════════════════════════════════════════════
   30. SURFACE ZELLEN
   ═══════════════════════════════════════════════ */

.sf-hc-surface.sf-hc-empty {
    border: 3px dashed rgba(255,255,255,0.15);
    border-radius: 0;
    border-image: none;
}
.sf-hc-surface.sf-hc-empty:hover {
    border: none;
    border-image: none;
    box-shadow: none;
}

.sf-hc-surface.sf-hc-bld {
    border: none;
    border-image: none;
    background: transparent;
}
.sf-hc-surface.sf-hc-bld:hover {
    border: none;
    border-image: none;
    background: transparent;
    box-shadow: none;
}


/* ═══════════════════════════════════════════════
   31. EXCHANGE / TRADE FRAMES
   ═══════════════════════════════════════════════ */

.sf-trade-item,
.sf-exchange-item {
    border: 4px solid transparent;
    border-image: url('img/gui/exchange/frame/frame_01.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}


/* ═══════════════════════════════════════════════
   32. SKILL / FORSCHUNGS-FRAMES
   ═══════════════════════════════════════════════ */

.sf-skill-frame,
.sf-research-item {
    border: 5px solid transparent;
    border-image: url('img/gui/skill/frame/frame_01.png') 5 fill / 5px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}
.sf-skill-frame:hover,
.sf-research-item:hover {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
}


/* ═══════════════════════════════════════════════
   33. ICON FRAMES (Detail-Icons)
   ═══════════════════════════════════════════════ */

.sf-detail-icon {
    border: 4px solid transparent;
    border-image: url('img/gui/basic_view/frame/frame_08.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}

.sf-body-icon {
    border: 3px solid transparent;
    border-image: url('img/gui/basic_view/frame/frame_08.png') 3 fill / 3px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}


/* ═══════════════════════════════════════════════
   34. PROGRESS BARS — Pixel Gauge Sprites
   ═══════════════════════════════════════════════ */

.sf-scan-bar,
.sf-storage-bar {
    border: 2px solid transparent;
    border-image: url('img/gui/basic_view/frame&gauge/frame_01.png') 2 fill / 2px stretch;
    border-radius: 0;
    height: 8px;
    image-rendering: pixelated;
}

.sf-hc-prog {
    border-radius: 0;
    background: rgba(0,0,0,0.3);
}
.sf-hc-prog-bar {
    border-radius: 0;
}

/* Wachstumsbalken */
.sf-hc-grow-bar {
    border-radius: 0;
}
.sf-hc-grow-fill {
    border-radius: 0;
}


/* ═══════════════════════════════════════════════
   35. NOTIFICATION BADGE
   ═══════════════════════════════════════════════ */

.sf-dash-notif-badge {
    border-radius: 0;
    border: 1px solid #DEA726;
}


/* ═══════════════════════════════════════════════
   36. CHANGELOG / VERSION OVERLAY
   ═══════════════════════════════════════════════ */

.sf-changelog-panel {
    border: 14px solid transparent;
    border-image: url('img/gui/basic_view/board/board_01.png') 14 fill / 14px stretch;
    border-radius: 0;
    box-shadow: none;
    image-rendering: pixelated;
}

.sf-changelog-entry {
    border: 3px solid transparent;
    border-image: url('img/gui/basic_view/frame/frame_07.png') 3 fill / 3px stretch;
    border-radius: 0;
    image-rendering: pixelated;
    margin-bottom: 4px;
}


/* ═══════════════════════════════════════════════
   37. SYSTEM / PROVINZ-VIEW
   ═══════════════════════════════════════════════ */

/* Sidebar rechts */
.sf-system-sidebar {
    border: 14px solid transparent;
    border-image: url('img/gui/basic_view/board/board_01.png') 14 fill / 14px stretch;
    border-radius: 0;
    box-shadow: none;
    image-rendering: pixelated;
}

/* Hex-Map Container */
.sf-hex-system-wrap {
    border: 6px solid transparent;
    border-image: url('img/gui/basic_view/frame/frame_07.png') 6 fill / 6px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}

/* Sidebar Section-Überschriften */
.sf-system-sidebar h3 {
    border: 3px solid transparent;
    border-image: url('img/gui/shop/frame/frame_04.png') 3 fill / 3px stretch;
    border-radius: 0;
    image-rendering: pixelated;
    padding: 6px 10px;
}

/* Info-Zeilen (Typ, Gefahr, etc.) */
.sf-info-row {
    border: 3px solid transparent;
    border-image: url('img/gui/basic_view/frame/frame_07.png') 3 fill / 3px stretch;
    border-radius: 0;
    image-rendering: pixelated;
    margin-bottom: 2px;
}
.sf-info-row:hover {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
    background: transparent;
}

/* POI Chips */
.sf-poi-chip {
    border: 4px solid transparent;
    border-image: url('img/gui/Inventory/frame/frame_02.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}
.sf-poi-chip:hover {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
    background: transparent;
}

/* Typ-Badge ("Normales Gebiet") */
.sf-sys-type {
    border: 4px solid transparent;
    border-image: url('img/gui/shop/button/button_category_01.png') 4 fill / 4px stretch;
    border-radius: 0;
    background: transparent;
    image-rendering: pixelated;
}

/* Erkunden-Button */
.sf-btn-explore {
    border: 5px solid transparent;
    border-image: url('img/gui/shop/button/button_square_02.png') 5 fill / 5px stretch;
    border-radius: 0;
    background: transparent;
    image-rendering: pixelated;
    color: #f0e8d8;
    text-shadow: 1px 1px 0 rgba(0,0,0,0.5);
}
.sf-btn-explore:hover {
    filter: brightness(1.3);
    background: transparent;
    box-shadow: none;
    transform: none;
}

/* Fog of War — unbekannte Himmelskörper */
.sf-body-unknown {
    border: 4px dashed transparent;
    border-image: url('img/gui/basic_view/frame/frame_07.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}

/* Counted View (Level-2 System) */
.sf-system-counted {
    border: 8px solid transparent;
    border-image: url('img/gui/basic_view/board/board_03.png') 8 fill / 8px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}


/* ═══════════════════════════════════════════════
   38. BRAUEREI / BRAUSTUBE
   ═══════════════════════════════════════════════ */

/* Sidebar-Header */
.sf-brew-sidebar-header {
    border-bottom: 3px solid transparent;
    border-image: url('img/gui/exchange/bar/bar_01.png') 0 0 3 0 / 0 0 3px 0 stretch;
    image-rendering: pixelated;
}

/* Inventar Section Labels (GERÄTE, PHIOLEN, ZUTATEN) */
.sf-brew-inv-label {
    border-bottom: 3px solid transparent;
    border-image: url('img/gui/exchange/bar/bar_01.png') 0 0 3 0 / 0 0 3px 0 stretch;
    image-rendering: pixelated;
}

/* Panel Section Headers (REZEPTBUCH, Entdeckungsjournal) */
.sf-brew-panel-section h3 {
    border-bottom: 3px solid transparent;
    border-image: url('img/gui/exchange/bar/bar_01.png') 0 0 3 0 / 0 0 3px 0 stretch;
    image-rendering: pixelated;
}

/* Crafting-Tisch */
.sf-craft-table {
    border: 8px solid transparent;
    border-image: url('img/gui/basic_view/board/board_01.png') 8 fill / 8px stretch;
    border-radius: 0;
    image-rendering: pixelated;
    box-shadow: none;
}
.sf-craft-table::before,
.sf-craft-table::after {
    display: none;
}

/* Craft-Slots */
.sf-craft-slot {
    border: 5px solid transparent;
    border-image: url('img/gui/Inventory/frame/frame_03.png') 5 fill / 5px stretch;
    border-radius: 0;
    image-rendering: pixelated;
    box-shadow: none;
}
.sf-craft-slot::before,
.sf-craft-slot::after {
    display: none;
}
.sf-craft-slot-filled {
    border-image-source: url('img/gui/Inventory/frame/frame_02.png');
    box-shadow: none;
}

/* Phiolen-Slot */
.sf-craft-slot-vial {
    border-image-source: url('img/gui/skill/frame/frame_01.png');
}
.sf-craft-slot-vial.sf-craft-slot-filled {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
    box-shadow: none;
}

/* Ergebnis-Slot */
.sf-craft-result {
    border: 5px solid transparent;
    border-image: url('img/gui/Inventory/frame/frame_03.png') 5 fill / 5px stretch;
    border-radius: 0;
    image-rendering: pixelated;
    box-shadow: none;
}
.sf-craft-result::before,
.sf-craft-result::after {
    display: none;
}
.sf-craft-result-ready {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png') !important;
    box-shadow: 0 0 20px rgba(222,167,38,0.25) !important;
}

/* Kombinationshilfe Panel */
.sf-craft-hints {
    border: 6px solid transparent;
    border-image: url('img/gui/basic_view/board/board_03.png') 6 fill / 6px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}

/* Einzelne Hint-Zeilen */
.sf-craft-hint {
    border: 3px solid transparent;
    border-image: url('img/gui/basic_view/frame/frame_07.png') 3 fill / 3px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}
.sf-craft-hint-available:hover {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
    box-shadow: none;
}

/* Rezeptkarten */
.sf-brew-recipe-card {
    border: 4px solid transparent;
    border-image: url('img/gui/Inventory/frame/frame_02.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}
.sf-brew-recipe-card:hover {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
}
.sf-brew-recipe-locked {
    border: 4px dashed transparent;
    border-image: url('img/gui/basic_view/frame/frame_07.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}

/* Produce Button */
.sf-btn-produce {
    border: 4px solid transparent;
    border-image: url('img/gui/shop/button/button_square_04.png') 4 fill / 4px stretch;
    border-radius: 0;
    background: transparent;
    image-rendering: pixelated;
}
.sf-btn-produce:hover {
    filter: brightness(1.3);
    background: transparent;
}

/* Craft Action Buttons */
.sf-craft-btn {
    border: 5px solid transparent !important;
    border-image: url('img/gui/shop/button/button_square_04.png') 5 fill / 5px stretch !important;
    border-radius: 0 !important;
    background: transparent !important;
    image-rendering: pixelated;
    box-shadow: none !important;
}
.sf-craft-btn:hover {
    filter: brightness(1.3);
    transform: none !important;
    box-shadow: none !important;
}
.sf-craft-btn-potion {
    border-image-source: url('img/gui/shop/button/button_square_02.png') !important;
}
.sf-craft-reset {
    border-image-source: url('img/gui/shop/button/button_square_01.png') !important;
}

/* Tile Bild-Karten */
.sf-brew-tile-img {
    border: 3px solid transparent;
    border-image: url('img/gui/Inventory/frame/frame_02.png') 3 fill / 3px stretch;
    border-radius: 0;
    image-rendering: pixelated;
    box-shadow: none;
}
.sf-brew-tile:hover .sf-brew-tile-img {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
    box-shadow: none;
}

/* Tile Mengen-Badge */
.sf-brew-tile-qty {
    border-radius: 0;
    border: 2px solid transparent;
    border-image: url('img/gui/basic_view/frame/frame_08.png') 2 fill / 2px stretch;
    image-rendering: pixelated;
}

/* Tile Eigenschafts-Punkte */
.sf-brew-tile-prop {
    border-radius: 2px;
}

/* Info-Panel rechts */
.sf-brew-info-panel {
    border: 12px solid transparent;
    border-image: url('img/gui/basic_view/board/board_01.png') 12 fill / 12px stretch;
    border-radius: 0;
    image-rendering: pixelated;
    border-left-width: 14px;
}

/* Info-Panel Header */
.sf-brew-ip-header {
    border-bottom: 3px solid transparent;
    border-image: url('img/gui/exchange/bar/bar_01.png') 0 0 3 0 / 0 0 3px 0 stretch;
    image-rendering: pixelated;
}

/* Info-Panel Bild */
.sf-brew-ip-img,
.sf-brew-ip-emoji {
    border: 4px solid transparent;
    border-image: url('img/gui/basic_view/frame/frame_08.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
    box-shadow: none;
}

/* Info-Panel Beschreibung */
.sf-brew-ip-desc {
    border: 3px solid transparent;
    border-image: url('img/gui/shop/frame/frame_04.png') 3 fill / 3px stretch;
    border-radius: 0;
    border-left-width: 4px;
    image-rendering: pixelated;
}

/* Info-Panel Pills — helle Textfarbe für Kontrast auf dunklem Rahmen */
.sf-brew-ip-pill {
    border-radius: 0;
    border: 2px solid transparent;
    border-image: url('img/gui/basic_view/frame/frame_07.png') 2 fill / 2px stretch;
    image-rendering: pixelated;
    color: #e8d8c0 !important;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.6);
}

/* Info-Panel Values */
.sf-brew-ip-value {
    border-radius: 0;
    border: 2px solid transparent;
    border-image: url('img/gui/basic_view/frame/frame_07.png') 2 fill / 2px stretch;
    image-rendering: pixelated;
}

/* Overlay */
.sf-brew-overlay-content {
    border: 12px solid transparent;
    border-image: url('img/gui/basic_view/board/board_01.png') 12 fill / 12px stretch;
    border-radius: 0;
    image-rendering: pixelated;
    box-shadow: 0 12px 48px rgba(0,0,0,0.4);
}

/* Tutorial */
.sf-brew-tutorial {
    border: 12px solid transparent;
    border-image: url('img/gui/basic_view/board/board_01.png') 12 fill / 12px stretch;
    border-radius: 0;
    image-rendering: pixelated;
    box-shadow: 0 8px 32px rgba(0,0,0,0.6);
}

/* Brau-Tisch (Karten-System) */
.sf-brew-table {
    border: 4px dashed transparent;
    border-image: url('img/gui/Inventory/frame/frame_05.png') 4 fill / 4px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}

/* Brew Cards */
.sf-brew-card {
    border: 3px solid transparent;
    border-image: url('img/gui/Inventory/frame/frame_02.png') 3 fill / 3px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}
.sf-brew-card:hover {
    border-image-source: url('img/gui/basic_view/frame/frame_08.png');
    box-shadow: none;
}

/* Kein-Match Box */
.sf-craft-no-match,
.sf-brew-no-match {
    border: 3px solid transparent;
    border-image: url('img/gui/shop/frame/frame_04.png') 3 fill / 3px stretch;
    border-radius: 0;
    image-rendering: pixelated;
}

/* Qualitäts-Anzeige */
.sf-craft-quality {
    border-radius: 0;
}

/* Footer */
.sf-brew-footer {
    border-top: 3px solid transparent;
    border-image: url('img/gui/exchange/bar/bar_01.png') 3 0 0 0 / 3px 0 0 0 stretch;
    image-rendering: pixelated;
}

/* Recipe Hint */
.sf-brew-recipe-hint {
    border: 2px solid transparent;
    border-image: url('img/gui/shop/frame/frame_04.png') 2 fill / 2px stretch;
    border-radius: 0;
    border-left-width: 3px;
    image-rendering: pixelated;
}

/* Brau-Fortschrittsbalken */
.sf-brew-progress-bar {
    border-radius: 0;
}
.sf-brew-progress-fill {
    border-radius: 0;
}


/* ═══════════════════════════════════════════════
   39. BRAUEREI — Schrift-Finetuning
   ═══════════════════════════════════════════════ */

/* Produce Button — Text heller + lesbarer */
.sf-btn-produce {
    color: #f0e8d8;
    text-shadow: 1px 1px 0 rgba(0,0,0,0.6);
    font-weight: 700;
}

/* Craft Buttons — Text-Kontrast */
.sf-craft-btn {
    color: #f0e8d8 !important;
    text-shadow: 1px 1px 0 rgba(0,0,0,0.6) !important;
}
.sf-craft-reset {
    color: #b8a880 !important;
    opacity: 0.8;
}

/* Inventar Section Labels — etwas heller */
.sf-brew-inv-label {
    color: #b8a880;
    font-size: 11px;
    letter-spacing: 1.5px;
}

/* Sidebar Titel */
.sf-brew-sidebar-title {
    text-shadow: 1px 1px 0 rgba(0,0,0,0.5);
}

/* Hint-Zeilen Text-Kontrast */
.sf-craft-hint {
    color: #d0c0a0;
}
.sf-craft-hint-result {
    text-shadow: 0 0 4px rgba(222,167,38,0.3);
}

/* Kombinationshilfe Titel */
.sf-craft-hints-title {
    color: rgba(222,167,38,0.65);
    text-shadow: 1px 1px 0 rgba(0,0,0,0.4);
}

/* Craft Slot Labels deutlicher */
.sf-craft-slot-label {
    color: rgba(222,167,38,0.55);
    text-shadow: 0 1px 3px rgba(0,0,0,0.7);
    font-size: 10px;
}

/* Rezeptkarte Text-Kontrast */
.sf-brew-recipe-title strong {
    color: #e8dcc0;
    text-shadow: 0 1px 0 rgba(0,0,0,0.3);
}

/* Panel Section Headers heller */
.sf-brew-panel-section h3 {
    color: #c8b890;
    text-shadow: 0 1px 0 rgba(0,0,0,0.3);
}

/* Tile Name lesbarer */
.sf-brew-tile-name {
    color: #c8b890;
    text-shadow: 0 1px 2px rgba(0,0,0,0.5);
}

/* Tile Qty Badge Text */
.sf-brew-tile-qty {
    font-weight: 800;
    text-shadow: 0 1px 2px rgba(0,0,0,0.6);
}

/* Entdeckungsjournal Counter */
.sf-brew-panel-section {
    color: #c8b890;
}

/* "Leeren" Button lesbarer */
.sf-craft-actions .sf-craft-reset {
    font-size: 13px !important;
    padding: 8px 18px !important;
}

/* Rezept-Phiolen-Dropdown */
.sf-brew-recipe-actions .sf-brew-vial-select {
    border: 2px solid transparent;
    border-image: url('img/gui/basic_view/frame/frame_07.png') 2 fill / 2px stretch;
    border-radius: 0;
    image-rendering: pixelated;
    color: #d8c8a0;
    font-size: 10px;
}

/* "Tippe auf ein Tile für Details" — rechte Sidebar Hint */
.sf-brew-info-empty {
    color: #6a5a40;
    font-size: 12px;
    text-shadow: 0 1px 0 rgba(0,0,0,0.3);
}

/* ═══════════════════════════════════════════════════
   40. ICON SIZING — Pixel-Art Icons deutlich größer
   ═══════════════════════════════════════════════════ */

/* Global: Pixel-Art crisp rendering for all PNG icons */
img.gg-icon {
    image-rendering: pixelated !important;
    image-rendering: crisp-edges !important;
}

/* ── Unterschlupf Grid — Gebäude-Icons im Ameisenbau ── */
/* Haupticon im Grid-Feld — füllt die Zelle gut aus */
.sf-hc-icon .gg-icon {
    width: 64px !important;
    height: 64px !important;
    font-size: 56px !important;
    line-height: 64px !important;
}

/* Produktions-Anzeige im Grid (Ernte-Icons, Credits/h etc.) */
.sf-hc-prod .gg-icon {
    width: 18px !important;
    height: 18px !important;
    font-size: 16px !important;
    line-height: 18px !important;
    vertical-align: middle;
}

/* Partikel-Effekte (Credits-Regen) bleiben klein */
.sf-hc-particles .gg-icon {
    width: 12px !important;
    height: 12px !important;
}

/* Leere Zellen — Plus-Icon / Pflanzen */
.sf-hc-empty-icon .gg-icon {
    width: 32px !important;
    height: 32px !important;
}

/* Dig-Cost Icons (Lumen neben Kosten) */
.sf-hc-dig-cost .gg-icon {
    width: 18px !important;
    height: 18px !important;
}

/* Dig-Icon (Spitzhacke im Zentrum) */
.sf-hc-dig-icon .gg-icon {
    width: 40px !important;
    height: 40px !important;
}

/* ── Unterschlupf Toolbar — Buttons oben ── */
.sf-ho-title-icon .gg-icon {
    width: 28px !important;
    height: 28px !important;
    font-size: 24px !important;
    line-height: 28px !important;
}

.sf-ho-tbtn .gg-icon {
    width: 22px !important;
    height: 22px !important;
    font-size: 19px !important;
    line-height: 22px !important;
}

/* ── Unterschlupf Sidebar — Gebäudeliste ── */
.sf-ho-bld-icon .gg-icon {
    width: 30px !important;
    height: 30px !important;
    font-size: 26px !important;
    line-height: 30px !important;
}

.sf-ho-cat-head .gg-icon {
    width: 22px !important;
    height: 22px !important;
    font-size: 19px !important;
    line-height: 22px !important;
}

/* Sidebar Stat-Zeile (Oben/Unten Zähler) */
.sf-ho-sb-stat .gg-icon {
    width: 18px !important;
    height: 18px !important;
}

/* Sidebar Ressourcen-Icons */
.sf-ho-res-icon .gg-icon {
    width: 22px !important;
    height: 22px !important;
    font-size: 19px !important;
    line-height: 22px !important;
}

/* Sidebar Build-Queue und Verteidigung */
.sf-ho-queue-item .gg-icon,
.sf-ho-queue-title .gg-icon {
    width: 20px !important;
    height: 20px !important;
}
.sf-ho-def-row .gg-icon {
    width: 18px !important;
    height: 18px !important;
}

/* ── Unterschlupf Detail-Panel (rechte Sidebar bei Klick) ── */
.sf-ho-det-prod .gg-icon,
.sf-ho-prod-header .gg-icon {
    width: 22px !important;
    height: 22px !important;
    font-size: 19px !important;
    line-height: 22px !important;
}

.sf-ho-syn-item .gg-icon {
    width: 18px !important;
    height: 18px !important;
}

.sf-ho-confirm-time .gg-icon,
.sf-ho-cost-line .gg-icon {
    width: 18px !important;
    height: 18px !important;
}

/* Harvest / Build Buttons */
.sf-ho-btn-harvest .gg-icon,
.sf-ho-btn-build .gg-icon,
.sf-ho-btn-special .gg-icon {
    width: 18px !important;
    height: 18px !important;
}

/* Assigned recipe icon in detail panel */
.sf-ho-assigned-icon .gg-icon {
    width: 28px !important;
    height: 28px !important;
    font-size: 24px !important;
    line-height: 28px !important;
}

/* ── Bau-Menü (Sidebar im Build-Modus) ── */
.sf-ho-sb-section .gg-icon {
    width: 20px !important;
    height: 20px !important;
}
.sf-ho-sb-title .gg-icon {
    width: 20px !important;
    height: 20px !important;
}

/* ── Lager-Overlay ── */
.sf-lager-icon .gg-icon {
    width: 28px !important;
    height: 28px !important;
    font-size: 24px !important;
    line-height: 28px !important;
}
.sf-lager-title .gg-icon {
    width: 22px !important;
    height: 22px !important;
}

/* ── Boten-Overlay ── */
.sf-bo-badge .gg-icon {
    width: 16px !important;
    height: 16px !important;
}
.sf-bo-action-icon .gg-icon {
    width: 24px !important;
    height: 24px !important;
}
.sf-bo-section-head .gg-icon,
.sf-bo-unlock-head .gg-icon {
    width: 22px !important;
    height: 22px !important;
}

/* ── Proviant-Overlay ── */
.sf-ho-provisions .gg-icon {
    width: 22px !important;
    height: 22px !important;
}

/* ── Dashboard / HUD — Ressourcen-Leiste oben links ── */
.sf-res .gg-icon {
    width: 24px !important;
    height: 24px !important;
    font-size: 20px !important;
    line-height: 24px !important;
}

.sf-queue-icon .gg-icon {
    width: 32px !important;
    height: 32px !important;
}

/* ── Galaxy / System View ── */
.sf-poi-chip .gg-icon {
    width: 22px !important;
    height: 22px !important;
}
.sf-btn-explore .gg-icon {
    width: 20px !important;
    height: 20px !important;
}

/* ── Research View ── */
.rt-tab-icon .gg-icon {
    width: 22px !important;
    height: 22px !important;
}
.rt-cost .gg-icon,
.rt-detail-cost-icon .gg-icon {
    width: 18px !important;
    height: 18px !important;
}

/* ── Cellar View ── */
.sf-cellar-stat .gg-icon {
    width: 20px !important;
    height: 20px !important;
}

/* ── Brewery View — Rezeptbuch-Icons ── */
.sf-rc-item .gg-icon,
.sf-rc-result .gg-icon {
    width: 22px !important;
    height: 22px !important;
}
.sf-craft-hint-icon .gg-icon {
    width: 24px !important;
    height: 24px !important;
}

/* ── Notifications ── */
.sf-notif-icon .gg-icon {
    width: 22px !important;
    height: 22px !important;
}

/* ── Raid Bar ── */
.sf-ho-raid-title .gg-icon {
    width: 18px !important;
    height: 18px !important;
}