.removebg { color: #ddd; padding: 0 0 50px; text-align: left; }
.removebg [hidden] { display: none !important; }
.removebg p { line-height: 1.7; }
.removebg button { border: 1px solid #53565f; border-radius: 7px; background: #36383f; color: #fff; padding: 9px 25px; cursor: pointer; font: inherit; }
.removebg button:hover:not(:disabled) { border-color: #af92fb; background: #45414f; }
.removebg button:disabled { opacity: .45; cursor: not-allowed; }
.removebg button:focus-visible, .removebg input:focus-visible { outline: 2px solid #b79aff; outline-offset: 3px; }
.removebg .rb-primary { background: #7954ca; border-color: #9270db; }
.removebg #rbChoose { background: #000; color: #fff; border-color: #827394; }
.removebg #rbChoose:hover:not(:disabled) { background: #151218; border-color: #b79aff; }
.removebg .rb-upload-actions { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 50px; padding:20px; }
#tabs { text-align: center; }
.removebg .rb-drop { text-align: center; }

.removebg .rb-drop.rb-drag { border-color: #ba9aff; background: #393143; }
.removebg .rb-drop p { color: #aaa; margin: 10px 0 20px; }
.removebg .rb-engine-panel { text-align: center; }
.removebg .rb-engine-panel .loadBox { display: block; padding: 12px 0; margin: 0 auto; }
.removebg .rb-engine-panel .rb-status { background: transparent; padding: 0; }
.removebg .rb-engine-panel .rb-progress { max-width: 560px; margin: 0 auto 20px; }
@media (prefers-reduced-motion: reduce) { .removebg .loadBox .itemLoad { animation: none; } }
.removebg .rb-help { color: #a0a1a8; font-size: 12px; margin: 12px 0; }
.removebg .rb-status { background: #292b30; padding: 12px 15px; border-radius: 7px; overflow-wrap: anywhere; }
.removebg .rb-errors { color: #ffc4bd; background: #492e31; padding: 12px 15px; border-radius: 7px; white-space: pre-line; overflow-wrap: anywhere; max-height: 180px; overflow: auto; margin-bottom: 15px; }
.removebg .rb-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding-top: 12px; }
.removebg input[type=checkbox] { accent-color: #a782ef; width: 16px; height: 16px; vertical-align: middle; }
.removebg #rbSummary { color: #aaa; font-size: 12px; }
.removebg .rb-toolbar-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-left: auto; }
.removebg #rbSummary { text-align: left; }
.removebg #rbDownload { background: #e8891c; color: #fff; padding: 5px 10px; border: 0; border-radius: 4px; }
.removebg #rbDownload:hover:not(:disabled) { background: #cf7410; }
.removebg #rbClear { padding: 5px 10px; border: 0; border-radius: 4px; }
.removebg .rb-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 18px; margin-top: 20px; }
.removebg .rb-card { background: #2b2d31; border: 1px solid #000; border-radius: 10px; overflow: hidden; min-width: 0; }
.removebg .rb-card[data-state=done] { border-color: #42c784; }
.removebg .rb-card[data-state=failed] { border-color: #f26464; }
.removebg .rb-progress { display: block; width: 100%; height: 7px; border: 0; accent-color: #9872e8; overflow: hidden; border-radius: 4px; }
.removebg .rb-card .rb-progress { border-radius: 0; margin: 0; }
.removebg .rb-progress::-webkit-progress-bar { background: #42444a; }
.removebg .rb-progress::-webkit-progress-value { background: #9872e8; }
.removebg .rb-progress:indeterminate { background: linear-gradient(90deg, #42444a 25%, #9872e8 50%, #42444a 75%); background-size: 200% 100%; animation: rb-progress 1.4s linear infinite; }
.removebg .rb-progress:indeterminate::-webkit-progress-bar { background: transparent; }
.removebg .rb-card[data-state=done] .rb-progress { accent-color: #42c784; }
.removebg .rb-card[data-state=done] .rb-progress::-webkit-progress-value { background: #42c784; }
#rbStatus{padding:20px; margin-top:-50px;}
@keyframes rb-progress { to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .removebg .rb-progress:indeterminate { animation: none; } }
.removebg .rb-card-top { display: flex; align-items: center; gap: 7px; padding: 10px; }
.removebg .rb-name { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 13px; }
.removebg .rb-card-top button { padding: 3px 7px; font-size: 12px; }
.removebg .rb-thumbnail { width: 100%; height: 200px; display: block; object-fit: contain; border: 0; border-radius: 0; padding: 0; }
.removebg .rb-thumbnail img { width: 100%; height: 100%; object-fit: contain; display: block; }
.removebg .rb-checker { background-color: #eee; background-image: conic-gradient(#ccc 25%, transparent 0 50%, #ccc 0 75%, transparent 0); background-size: 20px 20px; }
.removebg .rb-card-status { padding: 12px; font-size: 12px; min-height: 42px; overflow-wrap: anywhere; line-height: 1.6; }
.removebg .rb-status-badge { display: inline-block; padding: 2px 7px; border-radius: 5px; }
.removebg .rb-card[data-state=done] .rb-status-badge { background: #42c784; color: #102d20; }
.removebg .rb-card[data-state=processing] .rb-status-badge { background: #f4ca50; color: #382b08; }
.removebg .rb-card[data-state=failed] .rb-status-badge { background: #f26464; color: #3b1010; }
.removebg .rb-card-actions { padding: 0 12px 12px; display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.removebg .rb-card-actions button { font-size: 12px; padding: 7px 10px; }
.removebg .rb-card-status, .removebg .rb-name, .removebg .rb-card-top button { color: #666; }
.removebg .rb-card[data-state=done] { cursor: default; }
.removebg#rbCompare { padding: 0; }
.removebg .rb-dialog { background: #24262b; color: #ddd; padding: 20px; }
.removebg .rb-dialog-heading { display: flex; gap: 20px; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.removebg .rb-dialog-heading h3 { overflow-wrap: anywhere; margin: 0; font-size: 17px; }
.removebg .rb-dialog-actions { display: flex; justify-content: center; margin-top: 20px; }
.removebg .rb-dialog-actions button { padding: 12px 40px; font-size: 15px; font-weight: bold; }
.removebg .rb-comparison:focus-visible { outline: 2px solid #b79aff; outline-offset: 3px; }
.removebg .rb-comparison { position: relative; width: min(100%, calc(65vh * var(--ratio, 1))); aspect-ratio: var(--ratio, 1); margin: auto; overflow: hidden; background: #303237; cursor: ew-resize; touch-action: none; user-select: none; }
.removebg .rb-comparison img { width: 100%; height: 100%; object-fit: contain; display: block; pointer-events: none; }
.removebg .rb-result-layer { position: absolute; inset: 0; clip-path: inset(0 calc(100% - var(--split)) 0 0); pointer-events: none; }
.removebg .rb-divider { position: absolute; top: 0; bottom: 0; left: var(--split); width: 2px; background: #fff; transform: translateX(-50%); pointer-events: none; }
.removebg .rb-divider span { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: grid; place-items: center; width: 50px; height: 50px; border-radius: 50%; background: #fff; color: #7954ca; font-size: 24px; box-shadow: 0 2px 12px #0005; }
@media (max-width: 1000px) {
    .removebg #rbSummary { width: 100%; margin: 0; }
    .removebg .rb-grid { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
}