/* your custom style here */

@keyframes ms{100% { background-position: -3600px center;}}

@keyframes user{100% { background-position: -1080px center;}} 


.vcListRank { height:23px; width:auto; display:inline-block; }



.backgroundBox{
    background-size: cover;
}

#chatLogsContainer, #privateWrapContent{
	/* background: rgba(0,0,0,0.3); */
}

.vcChatRank {
    height: 16px;
}

/* v4.0.48: bounded pagination may wrap on narrow screens. */
.adminMemberPager{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px}
.vcPagerGap{display:inline-block;padding:0 3px;align-self:center}

/* v4.0.50: active page uses the theme button without its full action-button width. */
.adminMemberPager .adminMemberPageBtn.regButton{min-width:0}
/* Catalog upload target is never included in sortable catalog item collections. */
.vcCatalogUploadSlot{box-sizing:border-box;min-width:80px;min-height:90px;max-width:100%;padding:12px 8px;border:2px dashed currentColor;border-radius:8px;background:rgba(127,127,127,.08);color:inherit;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;cursor:pointer;flex:0 0 100px;align-self:stretch;font:inherit;font-size:14px;line-height:1.3;overflow-wrap:anywhere;}
.vcCatalogUploadSlot:hover,.vcCatalogUploadSlot:focus-visible,.vcCatalogUploadSlot.adminMultiUploadDragover{background:rgba(80,150,220,.22);outline:2px solid rgba(80,150,220,.5);outline-offset:2px;}
.vcCatalogUploadSlot[disabled]{cursor:wait;opacity:.6;}
.vcCatalogUploadSlot input[hidden]{display:none!important;}
.vcCatalogUploadSlot .fa{font-size:26px;}
.vcCatalogUploadHelp{margin:10px 0;color:#afb6c2;}
.vipAvatarAdminItems>.vcCatalogUploadSlot{min-width:0;width:100%;padding:8px 3px;font-size:11px;}
.vipAvatarAdminItems>.vcCatalogUploadSlot .fa{font-size:20px;}

/* Authentication CAPTCHA stays inside its own form, including guest upgrade. */
.vistaCaptchaBox{margin:12px auto;max-width:100%;text-align:center}.vistaCaptchaBox img{display:inline-block;max-width:calc(100% - 40px);height:auto;vertical-align:middle;border-radius:4px}.vistaCaptchaBox input{margin-top:8px;text-align:center}.vistaCaptchaBox:empty{display:none}

/* Vista Aero native scrollbar recreation, referenced against Microsoft's Aero
 * Explorer screenshot (uxguide/images/vis-graphic-image1.png). Native Vista
 * controls were not CSS. Firefox retains its standard-color native fallback.
 * Keep browser-owned scrolling and avoid global gutters on hidden wrappers.
 */
:root {
  --vc-scroll-grip-y: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%229%22%20height%3D%229%22%3E%3Cpath%20d%3D%22M1%201h7%22%20stroke%3D%22%23474747%22%2F%3E%3Cpath%20d%3D%22M1%202h7%22%20stroke%3D%22%23fff%22%2F%3E%3Cpath%20d%3D%22M1%204h7%22%20stroke%3D%22%23474747%22%2F%3E%3Cpath%20d%3D%22M1%205h7%22%20stroke%3D%22%23fff%22%2F%3E%3Cpath%20d%3D%22M1%207h7%22%20stroke%3D%22%23474747%22%2F%3E%3Cpath%20d%3D%22M1%208h7%22%20stroke%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E");
  --vc-scroll-grip-x: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%229%22%20height%3D%229%22%3E%3Cg%20transform%3D%22translate%289%200%29%20rotate%2890%29%22%3E%3Cpath%20d%3D%22M1%201h7%22%20stroke%3D%22%23474747%22%2F%3E%3Cpath%20d%3D%22M1%202h7%22%20stroke%3D%22%23fff%22%2F%3E%3Cpath%20d%3D%22M1%204h7%22%20stroke%3D%22%23474747%22%2F%3E%3Cpath%20d%3D%22M1%205h7%22%20stroke%3D%22%23fff%22%2F%3E%3Cpath%20d%3D%22M1%207h7%22%20stroke%3D%22%23474747%22%2F%3E%3Cpath%20d%3D%22M1%208h7%22%20stroke%3D%22%23fff%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  /* Shared theme tokens make this update immediately when the theme changes. */
  --vc-scroll-track: var(--vc-theme-scroll-track, color-mix(in srgb, var(--vc-deep, #555) 76%, #fff));
  --vc-scroll-track-shadow: var(--vc-theme-scroll-shadow, color-mix(in srgb, var(--vc-ink, #222) 28%, transparent));
  --vc-scroll-thumb: var(--vc-steel-mid, #aaa);
  --vc-scroll-light: var(--vc-steel-light, #ddd);
  --vc-scroll-dark: var(--vc-steel-dark, #888);
  --vc-scroll-border: color-mix(in srgb, var(--vc-ink, #444) 75%, #000);
  --vc-scroll-arrow: var(--vc-theme-scroll-arrow, color-mix(in srgb, var(--vc-steel-light, #ddd) 25%, #fff));
  --vc-scroll-hover-light: color-mix(in srgb, var(--vc-scroll-light) 80%, #fff);
  --vc-scroll-hover-dark: color-mix(in srgb, var(--vc-scroll-dark) 80%, var(--vc-accent, #777));
}
*, .editProfileDefaultList { scrollbar-width: auto; scrollbar-color: var(--vc-scroll-thumb) var(--vc-scroll-track); }
:is([id="vcPrivateLogs"], #containerShowChat, #vcRoomsContainer,
    #containerUser, #sideInside, .vcModalContent) { scrollbar-gutter: stable; }
[id="vcPrivateLogs"] { overflow-y: scroll; }
@supports selector(::-webkit-scrollbar) {
  *, .editProfileDefaultList { scrollbar-color: auto; scrollbar-width: auto; }
  ::-webkit-scrollbar { width: 14px; height: 14px; background: var(--vc-scroll-track); border: 1px solid var(--vc-scroll-border); }
  ::-webkit-scrollbar-track {
    background: var(--vc-scroll-track);
    box-shadow: inset 1px 0 2px var(--vc-scroll-track-shadow), inset -1px 0 2px var(--vc-scroll-track-shadow);
  }
  ::-webkit-scrollbar-track:horizontal {
    background: var(--vc-scroll-track);
    box-shadow: inset 0 1px 2px var(--vc-scroll-track-shadow), inset 0 -1px 2px var(--vc-scroll-track-shadow);
  }
  ::-webkit-scrollbar-thumb {
    min-height: 30px;
    min-width: 30px;
    border: 1px solid var(--vc-scroll-border);
    border-radius: 2px;
    background-color: var(--vc-scroll-thumb);
    background-image: var(--vc-scroll-grip-y), linear-gradient(90deg, var(--vc-scroll-light), var(--vc-scroll-thumb) 45%, var(--vc-scroll-dark) 46%, var(--vc-scroll-thumb));
    background-repeat: no-repeat;
    background-position: center;
    box-shadow: inset 1px 1px 0 #ffffffcc, inset -1px -1px 0 #0000001f;
  }
  ::-webkit-scrollbar-thumb:horizontal {
    background-image: var(--vc-scroll-grip-x), linear-gradient(var(--vc-scroll-light), var(--vc-scroll-thumb) 45%, var(--vc-scroll-dark) 46%, var(--vc-scroll-thumb));
  }
  ::-webkit-scrollbar-thumb:hover {
    border-color: var(--vc-scroll-border);
    background-image: var(--vc-scroll-grip-y), linear-gradient(90deg, var(--vc-scroll-hover-light) 45%, var(--vc-scroll-hover-dark) 46%, var(--vc-scroll-thumb));
  }
  ::-webkit-scrollbar-thumb:horizontal:hover {
    background-image: var(--vc-scroll-grip-x), linear-gradient(var(--vc-scroll-hover-light) 45%, var(--vc-scroll-hover-dark) 46%, var(--vc-scroll-thumb));
  }
  ::-webkit-scrollbar-thumb:active {
    border-color: var(--vc-scroll-border);
    background-image: var(--vc-scroll-grip-y), linear-gradient(90deg, var(--vc-scroll-thumb) 45%, var(--vc-scroll-dark) 46%, var(--vc-scroll-hover-dark));
  }
  ::-webkit-scrollbar-thumb:horizontal:active {
    background-image: var(--vc-scroll-grip-x), linear-gradient(var(--vc-scroll-thumb) 45%, var(--vc-scroll-dark) 46%, var(--vc-scroll-hover-dark));
  }
  /* Small bare arrow glyphs; the 14px native click targets remain usable. */
  ::-webkit-scrollbar-button { display: none; }
  ::-webkit-scrollbar-button:single-button {
    display: block;
    width: 14px;
    height: 14px;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background-color: var(--vc-scroll-track);
    background-position: center;
    background-repeat: no-repeat;
  }
  ::-webkit-scrollbar-button:single-button:hover { background-color: var(--vc-scroll-thumb); }
  ::-webkit-scrollbar-button:single-button:active { background-color: var(--vc-scroll-dark); }
  ::-webkit-scrollbar-button:single-button:vertical:decrement { background-image: linear-gradient(135deg, transparent 50%, var(--vc-scroll-arrow) 50%), linear-gradient(225deg, transparent 50%, var(--vc-scroll-arrow) 50%); background-size: 4px 4px; background-position: calc(50% - 2px) center, calc(50% + 2px) center; }
  ::-webkit-scrollbar-button:single-button:vertical:increment { background-image: linear-gradient(45deg, transparent 50%, var(--vc-scroll-arrow) 50%), linear-gradient(315deg, transparent 50%, var(--vc-scroll-arrow) 50%); background-size: 4px 4px; background-position: calc(50% - 2px) center, calc(50% + 2px) center; }
  ::-webkit-scrollbar-button:single-button:horizontal:decrement { background-image: linear-gradient(45deg, transparent 50%, var(--vc-scroll-arrow) 50%), linear-gradient(135deg, transparent 50%, var(--vc-scroll-arrow) 50%); background-size: 4px 4px; background-position: center calc(50% - 2px), center calc(50% + 2px); }
  ::-webkit-scrollbar-button:single-button:horizontal:increment { background-image: linear-gradient(225deg, transparent 50%, var(--vc-scroll-arrow) 50%), linear-gradient(315deg, transparent 50%, var(--vc-scroll-arrow) 50%); background-size: 4px 4px; background-position: center calc(50% - 2px), center calc(50% + 2px); }
  ::-webkit-scrollbar-corner { background: var(--vc-scroll-track); }
}
@media (forced-colors: active) {
  * { scrollbar-color: auto; }
  ::-webkit-scrollbar-track, ::-webkit-scrollbar-thumb,
  ::-webkit-scrollbar-button:single-button {
    background: Canvas;
    border-color: CanvasText;
    box-shadow: none;
  }
  ::-webkit-scrollbar-thumb { background: ButtonText; }
}

/* The room's virtual station reuses the radio control, not a second player. */
.vcRoomLiveRadioElement{display:flex;align-items:center;gap:7px;min-width:0;}
.vcRoomLiveRadioElement .subListName{display:flex;align-items:center;gap:6px;min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.vcRoomLiveRadioRoomIcon{width:22px;height:22px;object-fit:contain;flex:0 0 22px;}
.vcRoomLiveStationIcon{width:18px;height:18px;object-fit:contain;vertical-align:middle;margin-inline-end:5px;flex:none;}
.vcRoomLiveRadioBadge{font-size:10px;font-weight:bold;padding:2px 5px;border:1px solid #ffffff45;border-radius:9px;background:var(--vc-accent-dark,#274d38);color:#fff;flex:none;}
/* Room-station audience uses the common .vcRadioListeners badge skin. */
.radioBox.vcRoomLiveRadioHasSuggestion{height:auto;min-height:101px;}
.vcRoomLiveRadioSuggestion{flex:0 0 100%;width:100%;margin-top:6px;padding:8px;border:1px solid var(--vc-steel-dark,#555);border-radius:4px;background:var(--vc-deep,#243b4a);color:#fff;box-sizing:border-box;}
.vcRoomLiveRadioSuggestion p{font-size:11px;line-height:1.4;margin:0 0 6px;}
.vcRoomLiveRadioSuggestionActions{display:flex;gap:5px;align-items:center;}
.vcRoomLiveRadioSuggestionActions .regButton{flex:1;min-width:0;padding:5px;font-size:11px;}
.vcRoomLiveRadioSuggestionActions .panelBarItem{flex:0 0 24px;position:static;width:24px;height:24px;}
/* The room station icon shares the text baseline without pushing its name down. */
#currentStation.vcRoomLiveStation{align-items:center;}
#currentStation.vcRoomLiveStation .currentStationName{top:0;line-height:18px;align-self:center;}
#currentStation.vcRoomLiveStation>.vcRoomLiveStationIcon{display:block;margin-block:0;align-self:center;}

/* Room icon and name form one measured marquee unit, including its loop copy. */
[data-room-icon] .vcRadioNameOriginal,[data-room-icon] .vcRadioNameCopy{display:inline-flex;align-items:center;vertical-align:middle;}
[data-room-icon] .vcRoomLiveStationIcon{display:inline-block;width:18px;height:18px;object-fit:contain;flex:none;margin:0 5px 0 0;vertical-align:middle;}
/* Avoid inline-baseline extra descent below the moving icon/name unit. */
.radioStationScreen:has(#currentStation.vcRoomLiveStation){display:flex;align-items:center;}
#currentStation.vcRoomLiveStation{width:100%;height:18px;line-height:18px;}
#currentStation.vcRoomLiveStation .currentStationName{display:block;height:18px;line-height:18px;}
#currentStation.vcRoomLiveStation .vcRadioNameTrack{display:inline-flex;align-items:center;vertical-align:top;height:18px;}
#currentStation.vcRoomLiveStation .vcRadioNameOriginal,#currentStation.vcRoomLiveStation .vcRadioNameCopy{height:18px;line-height:18px;}

/* Private titles must shrink between the avatar and fixed window controls.
   Attribute selectors cover independent windows that clone the legacy IDs. */
:is(#privateTitlebar,[id="privateTitlebar"]) :is(#vcPrivateName,[id="vcPrivateName"]){min-width:0;overflow:hidden;width:auto}
:is(#privateTitlebar,[id="privateTitlebar"]) :is(#vcPrivateName,[id="vcPrivateName"])>p{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0}
[id="privateTitlebar"] [id="privateControls"]{flex-shrink:0;white-space:nowrap}

/* Prevent mobile focus auto-zoom caused by small composer text. Native browser
   viewport handling remains responsible for keyboard positioning. */
@media(max-width:900px){#mainMessageInput,[id="privateMessageInput"]{font-size:max(16px,var(--vc-message-size,16px))!important}}
