/* CoinsCapture — Bitty the Bitcoin mascot */

.cc-btc-mascot {
    --cc-btc-size: 96px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 12px;
    padding: 18px 14px;
    color: var(--cc-ink, #110b29);
}

.cc-btc-mascot--sm { --cc-btc-size: 56px; gap: 8px; padding: 10px; }
.cc-btc-mascot--md { --cc-btc-size: 88px; }
.cc-btc-mascot--lg { --cc-btc-size: 120px; gap: 14px; padding: 24px 16px; }

.cc-btc-mascot--compact {
    flex-direction: row;
    text-align: left;
    gap: 14px;
    padding: 12px 14px;
}

.cc-btc-mascot--compact .cc-btc-mascot__copy {
    align-items: flex-start;
    text-align: left;
}

.cc-btc-mascot__stage {
    position: relative;
    width: var(--cc-btc-size);
    height: var(--cc-btc-size);
    flex-shrink: 0;
}

.cc-btc-mascot__svg {
    width: 100%;
    height: 100%;
    display: block;
    overflow: visible;
}

.cc-btc-mascot__body {
    transform-origin: 48px 46px;
    animation: cc-btc-float 2.8s ease-in-out infinite;
}

.cc-btc-mascot__shadow {
    transform-origin: 48px 86px;
    animation: cc-btc-shadow 2.8s ease-in-out infinite;
}

.cc-btc-mascot__orbit {
    position: absolute;
    font-size: 11px;
    font-weight: 800;
    color: var(--cc-accent, #f7931b);
    opacity: 0;
    pointer-events: none;
    user-select: none;
}

.cc-btc-mascot--loading .cc-btc-mascot__orbit {
    opacity: 1;
    animation: cc-btc-orbit 2.4s linear infinite;
}

.cc-btc-mascot--loading .cc-btc-mascot__orbit--a { left: 50%; top: 0; animation-delay: 0s; }
.cc-btc-mascot--loading .cc-btc-mascot__orbit--b { left: 50%; top: 0; animation-delay: -0.8s; font-size: 10px; color: #114980; }
.cc-btc-mascot--loading .cc-btc-mascot__orbit--c { left: 50%; top: 0; animation-delay: -1.6s; font-size: 9px; color: #16c784; }

.cc-btc-mascot--loading .cc-btc-mascot__body {
    animation: cc-btc-bounce 0.9s cubic-bezier(0.34, 1.45, 0.64, 1) infinite;
}

.cc-btc-mascot--empty .cc-btc-mascot__mouth {
    d: path("M40 62c4-3.2 12-3.2 16 0");
}

.cc-btc-mascot--empty .cc-btc-mascot__eye {
    ry: 1.2;
}

.cc-btc-mascot--error .cc-btc-mascot__mouth {
    d: path("M42 62c3-2.5 9-2.5 12 0");
}

.cc-btc-mascot--error .cc-btc-mascot__body {
    animation: cc-btc-shake 0.55s ease-in-out infinite;
}

.cc-btc-mascot--success .cc-btc-mascot__mouth {
    d: path("M38 56c4.5 6.5 15 6.5 19.5 0");
}

.cc-btc-mascot--success .cc-btc-mascot__eye--r {
    ry: 0.7;
}

.cc-btc-mascot--success .cc-btc-mascot__body {
    animation: cc-btc-pop 0.7s cubic-bezier(0.34, 1.45, 0.64, 1) 1;
}

.cc-btc-mascot--search .cc-btc-mascot__body {
    animation: cc-btc-peek 2.2s ease-in-out infinite;
}

.cc-btc-mascot__copy {
    display: flex;
    flex-direction: column;
    gap: 4px;
    max-width: 280px;
}

.cc-btc-mascot__title {
    margin: 0;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--cc-ink, #110b29);
    line-height: 1.3;
}

.cc-btc-mascot--sm .cc-btc-mascot__title { font-size: 13px; }
.cc-btc-mascot--lg .cc-btc-mascot__title { font-size: 18px; }

.cc-btc-mascot__msg {
    margin: 0;
    font-size: 13px;
    line-height: 1.45;
    color: var(--cc-muted, #6b7280);
}

.cc-btc-mascot--sm .cc-btc-mascot__msg { font-size: 12px; }

.cc-btc-state {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 160px;
    width: 100%;
}

.cc-btc-state--sm { min-height: 100px; }
.cc-btc-state--inline {
    min-height: 0;
    justify-content: flex-start;
}

.cc-btc-overlay {
    position: absolute;
    inset: 0;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--cc-surface, #fff) 72%, transparent);
    backdrop-filter: blur(2px);
    border-radius: inherit;
    opacity: 0;
    pointer-events: none;
    transition: opacity 180ms ease;
}

.cc-btc-overlay.is-visible {
    opacity: 1;
    pointer-events: auto;
}

.cc-btc-host {
    position: relative;
}

#cc-home-market-rows {
    position: relative;
    min-height: 80px;
}

.cc-btc-host.is-loading {
    min-height: 120px;
}

.cc-sk-placeholder {
    position: relative;
}

.cc-sk-placeholder .cc-btc-mascot--skeleton-buddy {
    position: absolute;
    right: 12px;
    bottom: 12px;
    z-index: 2;
    padding: 0;
    pointer-events: none;
    opacity: 0.92;
}

.cc-app-sk__buddy {
    display: flex;
    justify-content: center;
    margin: 8px 0 16px;
}

.cc-app-toast.cc-app-toast--mascot {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-left: 12px;
}

.cc-app-toast__coin {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 14px;
    color: #fff;
    background: linear-gradient(145deg, #ffc56a, #f7931b 55%, #b86208);
    box-shadow: 0 2px 8px rgba(247, 147, 27, 0.35);
    animation: cc-btc-pop 0.55s cubic-bezier(0.34, 1.45, 0.64, 1) 1;
}

.cc-app-toast__bitty {
    width: 28px;
    height: 28px;
    flex-shrink: 0;
}

@keyframes cc-btc-float {
    0%, 100% { transform: translateY(0) rotate(-2deg); }
    50% { transform: translateY(-7px) rotate(2deg); }
}

@keyframes cc-btc-shadow {
    0%, 100% { transform: scaleX(1); opacity: 0.9; }
    50% { transform: scaleX(0.78); opacity: 0.55; }
}

@keyframes cc-btc-bounce {
    0%, 100% { transform: translateY(0) scale(1); }
    40% { transform: translateY(-10px) scale(1.04); }
    60% { transform: translateY(-4px) scale(0.98); }
}

@keyframes cc-btc-orbit {
    0% { transform: rotate(0deg) translateY(calc(var(--cc-btc-size) * -0.48)) rotate(0deg); opacity: 0; }
    15% { opacity: 1; }
    85% { opacity: 1; }
    100% { transform: rotate(360deg) translateY(calc(var(--cc-btc-size) * -0.48)) rotate(-360deg); opacity: 0; }
}

@keyframes cc-btc-shake {
    0%, 100% { transform: translateX(0) rotate(0); }
    25% { transform: translateX(-3px) rotate(-4deg); }
    75% { transform: translateX(3px) rotate(4deg); }
}

@keyframes cc-btc-pop {
    0% { transform: scale(0.86); }
    60% { transform: scale(1.08); }
    100% { transform: scale(1); }
}

@keyframes cc-btc-peek {
    0%, 100% { transform: translateX(0) rotate(0); }
    30% { transform: translateX(6px) rotate(6deg); }
    60% { transform: translateX(-4px) rotate(-4deg); }
}

@media (prefers-reduced-motion: reduce) {
    .cc-btc-mascot__body,
    .cc-btc-mascot__shadow,
    .cc-btc-mascot__orbit,
    .cc-btc-mascot--loading .cc-btc-mascot__body,
    .cc-btc-mascot--error .cc-btc-mascot__body,
    .cc-btc-mascot--success .cc-btc-mascot__body,
    .cc-btc-mascot--search .cc-btc-mascot__body {
        animation: none !important;
    }
}

[data-theme="dark"] .cc-btc-mascot__shadow {
    fill: rgba(0, 0, 0, 0.45);
}

[data-theme="dark"] .cc-btc-overlay {
    background: color-mix(in srgb, var(--cc-surface, #16181e) 78%, transparent);
}