.sunny-select-shell {
    position: relative;
    min-width: 0;
    max-width: 100%;
    display: inline-flex;
    align-items: stretch;
    box-sizing: border-box;
    vertical-align: middle;
}

.sunny-select-native {
    display: none !important;
}

.sunny-select-trigger {
    width: 100%;
    min-width: 0;
    height: var(--sunny-select-height, 36px);
    min-height: var(--sunny-select-height, 36px);
    margin: 0;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
    overflow: hidden;
    border: 1px solid var(--sunny-select-border, #48484a);
    border-radius: var(--sunny-select-radius, 7px);
    outline: none !important;
    background: var(--sunny-select-bg, #242426);
    color: var(--sunny-select-text, #f5f5f7);
    font-family: var(--sunny-select-font-family, inherit);
    font-size: var(--sunny-select-font-size, 14px);
    font-weight: var(--sunny-select-font-weight, 700);
    line-height: 1;
    letter-spacing: 0;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.16s ease, background 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
}

.sunny-select-trigger:hover:not(:disabled),
.sunny-select-trigger:focus-visible,
.sunny-select-shell.is-open .sunny-select-trigger {
    border-color: var(--sunny-select-accent, #ff9f0a) !important;
    color: color-mix(in srgb, var(--sunny-select-accent, #ff9f0a) 76%, white) !important;
    box-shadow: none;
}

.sunny-select-shell.is-disabled {
    opacity: 0.46;
}

.sunny-select-trigger:disabled {
    cursor: not-allowed;
}

.sunny-select-value {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    letter-spacing: 0;
}

.sunny-select-arrow {
    width: 8px;
    height: 8px;
    position: absolute;
    right: 11px;
    top: 50%;
    flex: 0 0 8px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-70%) rotate(45deg);
    opacity: 0.9;
    pointer-events: none;
    transition: transform 0.16s ease;
}

.sunny-select-shell.is-open .sunny-select-arrow {
    transform: translateY(-28%) rotate(225deg);
}

.sunny-select-menu {
    position: fixed;
    z-index: 30000;
    box-sizing: border-box;
    padding: 5px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 1px solid color-mix(in srgb, var(--sunny-select-accent, #ff9f0a) 54%, #5a5a5f);
    border-radius: 8px;
    background: rgba(25, 25, 28, 0.98);
    color: color-mix(in srgb, var(--sunny-select-accent, #ff9f0a) 70%, white);
    box-shadow: 0 16px 36px rgba(0,0,0,0.58), 0 0 0 1px rgba(255,255,255,0.04) inset;
    backdrop-filter: blur(var(--glass-blur-popover)) saturate(var(--glass-saturation-popover));
    -webkit-backdrop-filter: blur(var(--glass-blur-popover)) saturate(var(--glass-saturation-popover));
    font-family: var(--sunny-select-font-family, inherit);
    scrollbar-width: thin;
    scrollbar-color: var(--sunny-select-accent, #ff9f0a) rgba(0,0,0,0.3);
}

.sunny-select-menu[hidden] {
    display: none !important;
}

.sunny-select-menu::-webkit-scrollbar {
    width: 9px;
}

.sunny-select-menu::-webkit-scrollbar-track {
    background: rgba(0,0,0,0.26);
}

.sunny-select-menu::-webkit-scrollbar-thumb {
    border: 2px solid rgba(0,0,0,0.26);
    border-radius: 8px;
    background: var(--sunny-select-accent, #ff9f0a);
}

.sunny-select-option {
    width: 100%;
    min-height: 36px;
    padding: 7px 10px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    border: 0;
    border-radius: 5px;
    outline: none !important;
    background: transparent;
    color: color-mix(in srgb, var(--sunny-select-accent, #ff9f0a) 68%, white);
    font-family: var(--sunny-select-font-family, inherit);
    font-size: max(13px, var(--sunny-select-font-size, 14px));
    font-weight: var(--sunny-select-font-weight, 700);
    line-height: 1.3;
    letter-spacing: 0;
    text-align: left;
    white-space: normal;
    cursor: pointer;
    transition: background 0.13s ease, color 0.13s ease;
}

.sunny-select-option:hover:not(:disabled),
.sunny-select-option:focus-visible {
    background: color-mix(in srgb, var(--sunny-select-accent, #ff9f0a) 18%, #242426);
    color: color-mix(in srgb, var(--sunny-select-accent, #ff9f0a) 84%, white);
}

.sunny-select-option.is-selected {
    background: color-mix(in srgb, var(--sunny-select-accent, #ff9f0a) 34%, #242426);
    color: color-mix(in srgb, var(--sunny-select-accent, #ff9f0a) 88%, white);
    box-shadow: inset 3px 0 0 var(--sunny-select-accent, #ff9f0a);
}

.sunny-select-option:disabled {
    color: #6f6f74;
    cursor: not-allowed;
}

.sunny-select-group-label {
    padding: 7px 10px 4px;
    color: #8e8e93;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0;
}

body .sunny-select-option.font-preview-huninn,
body .sunny-select-value.font-preview-huninn {
    font-family: "jf open 粉圓", "Chiron Hei HK", sans-serif !important;
}

body .sunny-select-option.font-preview-hei,
body .sunny-select-value.font-preview-hei {
    font-family: "Chiron Hei HK", "PingFang TC", "Microsoft JhengHei", sans-serif !important;
}

body .sunny-select-option.font-preview-mincho,
body .sunny-select-value.font-preview-mincho {
    font-family: "GenRyu Min TC", "Songti TC", "PMingLiU", serif !important;
}

body .sunny-select-option.font-preview-iansui,
body .sunny-select-value.font-preview-iansui {
    font-family: "Iansui", "Chiron Hei HK", cursive !important;
}

body .sunny-select-option.font-preview-mono,
body .sunny-select-value.font-preview-mono {
    font-family: Consolas, Monaco, Menlo, monospace !important;
}

body.decorative-animations-off .sunny-select-trigger,
body.decorative-animations-off .sunny-select-arrow,
body.decorative-animations-off .sunny-select-option {
    transition: none !important;
}

body.glass-effects-off .sunny-select-menu {
    background: #1c1c1f;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}