
/* =========================================================
   Web3 Unified UI Pack V1
   Applies to Trade / History / Withdraw / Profile / Auth / News / 404
   Visual-only: does not change PHP logic or API functions.
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500;600;700;800;900&family=Rajdhani:wght@400;500;600;700&family=Exo+2:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root{
    --web3-bg:#020817;
    --web3-bg-2:#061A3C;
    --web3-deep:#020A1B;
    --web3-card:#071B3B;
    --web3-card-2:#0B234B;
    --web3-card-3:#102F62;
    --web3-line:rgba(91,176,255,.20);
    --web3-line-soft:rgba(255,255,255,.07);
    --web3-cyan:#00E0FF;
    --web3-blue:#1888FF;
    --web3-blue-2:#0057FF;
    --web3-gold:#F0B90B;
    --web3-gold-2:#FFD60A;
    --web3-text:#F4F8FF;
    --web3-muted:#9FB3D9;
    --web3-green:#00D084;
    --web3-red:#FF4D6D;
    --web3-shadow:0 24px 80px rgba(0,0,0,.42);
    --web3-font:"Exo 2", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --web3-display:"Orbitron", "Exo 2", sans-serif;
    --web3-mono:"Rajdhani", "Roboto Mono", monospace;
}

html,body{
    background:
        radial-gradient(circle at 80% 8%, rgba(0,132,255,.24), transparent 27%),
        radial-gradient(circle at 16% 76%, rgba(0,224,255,.12), transparent 28%),
        radial-gradient(circle at 50% 18%, rgba(240,185,11,.065), transparent 32%),
        linear-gradient(135deg,var(--web3-bg) 0%, var(--web3-bg-2) 48%, var(--web3-deep) 100%) !important;
    color:var(--web3-text) !important;
    font-family:var(--web3-font) !important;
}

body{
    min-height:100vh;
    padding-bottom:76px !important;
}

body::before{
    content:"";
    position:fixed;
    inset:0;
    pointer-events:none;
    z-index:-3;
    background-image:
        linear-gradient(rgba(83,177,255,.12) 1px, transparent 1px),
        linear-gradient(90deg, rgba(83,177,255,.12) 1px, transparent 1px);
    background-size:46px 46px;
    opacity:.18;
    mask-image:radial-gradient(circle at 50% 28%, #000 0%, transparent 74%);
    animation:web3GridMove 18s linear infinite;
}

body::after{
    content:"";
    position:fixed;
    inset:0;
    pointer-events:none;
    z-index:-2;
    background:
        radial-gradient(circle at var(--mouse-x, 50%) var(--mouse-y, 20%), rgba(0,224,255,.12), transparent 18%),
        radial-gradient(circle at 50% 0%, rgba(240,185,11,.06), transparent 24%);
}

*{
    scrollbar-color:rgba(0,224,255,.45) rgba(255,255,255,.04);
}

a{ color:var(--web3-cyan) !important; }

h1,h2,h3,h4,
.section-title,
.finance-header h1,
.news-header h1,
.profile-header h1,
.auth-card h1,
.current-symbol-name,
.logo span,
.site-name,
.brand{
    font-family:var(--web3-display) !important;
    letter-spacing:-.035em !important;
    color:var(--web3-text) !important;
}

.price-col,
.current-price-value,
.balance-value,
.profit-value,
.asset-value,
.amount,
.amount-input,
.history-val,
.stat-card div,
.btcc-stat-v4 h3{
    font-family:var(--web3-mono) !important;
    letter-spacing:-.02em !important;
}

/* animated page background layer */
.web3-page-bg{
    position:fixed;
    inset:0;
    overflow:hidden;
    pointer-events:none;
    z-index:-1;
}

.web3-page-bg span{
    position:absolute;
    display:block;
    width:340px;
    height:340px;
    border-radius:999px;
    filter:blur(18px);
    opacity:.40;
    background:radial-gradient(circle, rgba(0,224,255,.18), rgba(24,136,255,.08) 45%, transparent 72%);
    animation:web3OrbFloat 12s ease-in-out infinite;
}

.web3-page-bg span:nth-child(1){ left:-120px; top:10%; }
.web3-page-bg span:nth-child(2){ right:-140px; top:30%; animation-delay:-4s; background:radial-gradient(circle, rgba(240,185,11,.16), transparent 72%); }
.web3-page-bg span:nth-child(3){ left:35%; bottom:-180px; width:520px; height:520px; animation-delay:-7s; opacity:.25; }

/* navbar */
.navbar{
    background:rgba(2,8,23,.82) !important;
    border-bottom:1px solid rgba(91,176,255,.16) !important;
    backdrop-filter:blur(18px) !important;
    -webkit-backdrop-filter:blur(18px) !important;
}
.nav-link{
    color:var(--web3-muted) !important;
    border-radius:999px !important;
    font-weight:700 !important;
}
.nav-link:hover,
.nav-link.active{
    color:#fff !important;
    background:linear-gradient(135deg, rgba(24,136,255,.28), rgba(0,224,255,.16)) !important;
    box-shadow:0 0 22px rgba(0,224,255,.14) !important;
}
.bottom-nav{
    background:rgba(2,8,23,.92) !important;
    border-top:1px solid rgba(91,176,255,.16) !important;
    backdrop-filter:blur(22px) !important;
    -webkit-backdrop-filter:blur(22px) !important;
}
.bottom-nav-item{
    color:var(--web3-muted) !important;
    border-radius:18px !important;
    font-family:var(--web3-font) !important;
    font-weight:700 !important;
}
.bottom-nav-item.active{
    color:#fff !important;
    background:linear-gradient(135deg, rgba(24,136,255,.44), rgba(0,224,255,.22)) !important;
}

/* Core containers */
.container,
.finance-container,
.profile-container,
.news-container{
    position:relative;
    z-index:1;
}

.finance-container,
.profile-container,
.news-container{
    max-width:1080px !important;
    padding-bottom:96px !important;
}

.main-content,
.trade-page,
.finance-container,
.profile-container,
.news-container,
.auth-container,
.error-page{
    background:transparent !important;
}

/* Universal glass cards */
.card,
.profile-card,
.asset-card,
.stat-card,
.history-card-item,
.bind-section,
.withdraw-section,
.news-card,
.auth-card,
.error-content,
.symbol-info-bar,
.funding-rate-bar,
.chart-section-top,
.order-book-panel,
.trade-form-panel,
.position-tabs-container,
.positions-content,
.custom-tabs,
.table-wrapper,
.news-categories{
    background:
        linear-gradient(180deg, rgba(255,255,255,.050), rgba(255,255,255,.016)),
        rgba(7,27,59,.78) !important;
    border:1px solid var(--web3-line) !important;
    border-radius:24px !important;
    box-shadow:
        var(--web3-shadow),
        0 0 42px rgba(0,224,255,.045),
        inset 0 0 0 1px rgba(255,255,255,.026) !important;
    backdrop-filter:blur(16px) !important;
    -webkit-backdrop-filter:blur(16px) !important;
    position:relative;
    overflow:hidden;
}

.card::before,
.profile-card::before,
.asset-card::before,
.stat-card::before,
.history-card-item::before,
.bind-section::before,
.withdraw-section::before,
.news-card::before,
.auth-card::before,
.error-content::before,
.chart-section-top::before,
.trade-form-panel::before,
.order-book-panel::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:.42;
    background:
        radial-gradient(circle at 18% 0%, rgba(0,224,255,.11), transparent 32%),
        linear-gradient(125deg, rgba(255,255,255,.055), transparent 38%);
}

.finance-header,
.news-header{
    margin:18px 0 18px !important;
}

.finance-header h1,
.news-header h1{
    font-size:clamp(1.45rem, 4vw, 2.2rem) !important;
}

/* Buttons */
.btn,
.action-btn-full,
.trade-action-btn,
.news-category-btn,
.custom-tab,
.timeframe-btn,
.indicator-btn,
.duration-card,
.country-selector-btn,
.lang-toggle-btn{
    border-radius:15px !important;
    font-family:var(--web3-font) !important;
    font-weight:800 !important;
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease !important;
}

.btn:hover,
.action-btn-full:hover,
.trade-action-btn:hover,
.news-category-btn:hover,
.custom-tab:hover,
.timeframe-btn:hover,
.indicator-btn:hover,
.duration-card:hover{
    transform:translateY(-2px);
}

.btn-primary,
.action-btn-full{
    background:linear-gradient(135deg, var(--web3-blue), var(--web3-cyan)) !important;
    border:none !important;
    color:#fff !important;
    box-shadow:0 14px 34px rgba(0,132,255,.25) !important;
}

.btn-outline,
.btn-secondary{
    background:rgba(255,255,255,.035) !important;
    border:1px solid rgba(91,176,255,.30) !important;
    color:var(--web3-text) !important;
}

.btn-outline:hover,
.btn-secondary:hover{
    border-color:var(--web3-cyan) !important;
    box-shadow:0 0 22px rgba(0,224,255,.14) !important;
}

/* Inputs */
.form-control,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="tel"],
select,
textarea,
.binance-input,
.amount-input,
.search-input-wrapper,
.binance-input-wrapper,
.phone-input-wrapper,
.input-group{
    background:rgba(2,8,23,.52) !important;
    border-color:rgba(91,176,255,.22) !important;
    color:var(--web3-text) !important;
    border-radius:15px !important;
}

.form-control:focus,
input:focus,
select:focus,
textarea:focus,
.search-input-wrapper:focus-within,
.binance-input-wrapper:focus-within,
.phone-input-wrapper:focus-within{
    border-color:var(--web3-cyan) !important;
    box-shadow:0 0 0 3px rgba(0,224,255,.14) !important;
    outline:none !important;
}

.form-label,
.binance-label,
.input-label,
.duration-label,
.balance-label,
.asset-label,
.history-label,
.info-item .label{
    color:var(--web3-muted) !important;
    font-weight:700 !important;
}

::placeholder{ color:rgba(159,179,217,.70) !important; }

/* Alerts */
.alert{
    border-radius:18px !important;
    border:1px solid rgba(255,255,255,.08) !important;
    background:rgba(7,27,59,.76) !important;
    backdrop-filter:blur(12px) !important;
}
.alert-success{ border-color:rgba(0,208,132,.26) !important; }
.alert-danger{ border-color:rgba(255,77,109,.26) !important; }
.alert-warning{ border-color:rgba(240,185,11,.30) !important; }
.alert-info{ border-color:rgba(0,224,255,.28) !important; }

/* Auth pages */
.auth-container{
    min-height:calc(100vh - 110px) !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:24px 14px 96px !important;
}
.auth-card{
    width:100%;
    max-width:460px !important;
    padding:30px !important;
}
.auth-kicker{
    color:var(--web3-cyan) !important;
    font-family:var(--web3-display) !important;
}
.auth-card h1{
    font-size:clamp(1.75rem, 6vw, 2.6rem) !important;
}

/* Trade page */
.web3-trade-page,
.trade-page{
    position:relative;
    isolation:isolate;
    display:flex !important;
    flex-direction:column !important;
    gap:10px !important;
    padding-bottom:90px !important;
}
.symbol-info-bar{
    margin:12px auto 0 !important;
    width:calc(100% - 24px) !important;
}
.current-symbol-name{
    color:var(--web3-cyan) !important;
    text-shadow:0 0 18px rgba(0,224,255,.20);
}
.price-change.positive{ color:var(--web3-green) !important; }
.price-change.negative{ color:var(--web3-red) !important; }
.funding-rate-bar{
    margin:0 12px !important;
    color:var(--web3-muted) !important;
}
.funding-value{ color:var(--web3-gold) !important; }
.chart-section-top{
    margin:0 12px !important;
    overflow:hidden !important;
}
.chart-toolbar,
.order-book-header-row{
    background:rgba(2,8,23,.42) !important;
    border-color:rgba(91,176,255,.14) !important;
}
.chart-wrapper,
#klineChart{
    background:#020817 !important;
}
.timeframe-btn,
.indicator-btn,
.duration-card{
    background:rgba(2,8,23,.52) !important;
    border:1px solid rgba(91,176,255,.18) !important;
    color:var(--web3-muted) !important;
}
.timeframe-btn.active,
.indicator-btn.active,
.duration-card.active{
    background:linear-gradient(135deg, rgba(24,136,255,.24), rgba(0,224,255,.12)) !important;
    border-color:rgba(0,224,255,.38) !important;
    color:#fff !important;
    box-shadow:0 0 20px rgba(0,224,255,.10) !important;
}
.trade-main-layout{
    background:transparent !important;
    padding:0 12px 12px !important;
    gap:12px !important;
}
.order-book-current-price{
    background:linear-gradient(90deg, transparent, rgba(0,224,255,.07), transparent) !important;
}
.current-price-value{
    font-size:1.35rem !important;
    font-weight:900 !important;
}
.current-price-value.up,
.ob-price.buy,
.ratio-buy{ color:var(--web3-green) !important; }
.current-price-value.down,
.ob-price.sell,
.ratio-sell{ color:var(--web3-red) !important; }
.ob-depth.buy{ background:rgba(0,208,132,.22) !important; }
.ob-depth.sell{ background:rgba(255,77,109,.22) !important; }
.amount-input{
    height:58px !important;
    font-size:1.45rem !important;
    font-weight:900 !important;
}
.balance-value,
.profit-value{
    color:var(--web3-gold) !important;
}
.buy-btn{
    background:linear-gradient(135deg,#00D084,#24FFC0) !important;
    color:#03140F !important;
}
.sell-btn{
    background:linear-gradient(135deg,#FF4D6D,#FF7A92) !important;
    color:#26060C !important;
}
.position-tabs-container,
.positions-content{
    margin:0 12px !important;
}

/* Finance / Withdraw / History */
.asset-card{
    padding:26px !important;
    background:
        radial-gradient(circle at 80% 20%, rgba(0,224,255,.12), transparent 34%),
        linear-gradient(135deg, rgba(7,27,59,.90), rgba(2,8,23,.82)) !important;
}
.asset-value,
.balance-display .amount{
    color:#fff !important;
    font-size:clamp(2rem, 8vw, 3rem) !important;
    font-weight:900 !important;
}
.asset-value span,
.currency{
    color:var(--web3-muted) !important;
    font-size:.95rem !important;
}
.custom-tabs{
    display:flex;
    gap:8px;
    padding:8px !important;
}
.custom-tab{
    background:rgba(2,8,23,.40) !important;
    color:var(--web3-muted) !important;
    border:1px solid transparent !important;
}
.custom-tab.active{
    background:linear-gradient(135deg, rgba(24,136,255,.25), rgba(0,224,255,.13)) !important;
    color:#fff !important;
    border-color:rgba(0,224,255,.34) !important;
}
.history-card-item{
    padding:18px !important;
    margin-bottom:12px !important;
}
.history-symbol{
    color:#fff !important;
    font-family:var(--web3-display) !important;
}
.status-badge,
.badge-sm{
    border-radius:999px !important;
    font-weight:800 !important;
}
.status-badge.win,
.badge-long{ background:rgba(0,208,132,.15) !important; color:var(--web3-green) !important; }
.status-badge.lose,
.badge-short{ background:rgba(255,77,109,.15) !important; color:var(--web3-red) !important; }

/* Profile */
.profile-header{
    background:
        radial-gradient(circle at 50% 0%, rgba(0,224,255,.16), transparent 36%),
        linear-gradient(180deg, rgba(7,27,59,.86), rgba(2,8,23,.72)) !important;
    border:1px solid var(--web3-line) !important;
    border-radius:28px !important;
    padding:34px 18px !important;
    box-shadow:var(--web3-shadow) !important;
}
.avatar i{
    color:var(--web3-cyan) !important;
    filter:drop-shadow(0 0 18px rgba(0,224,255,.28));
}
.profile-grid{
    gap:16px !important;
}
.credit-circle{
    background:rgba(2,8,23,.44) !important;
    border-color:rgba(0,224,255,.26) !important;
}
.credit-circle .score{
    color:var(--web3-gold) !important;
}

/* News */
.news-categories{
    padding:8px !important;
    display:flex !important;
    gap:8px !important;
    overflow-x:auto !important;
}
.news-category-btn{
    background:rgba(2,8,23,.48) !important;
    border:1px solid rgba(91,176,255,.18) !important;
    color:var(--web3-muted) !important;
    white-space:nowrap;
}
.news-category-btn.active{
    background:linear-gradient(135deg, rgba(24,136,255,.35), rgba(0,224,255,.14)) !important;
    color:#fff !important;
}
.news-grid{
    gap:16px !important;
}
.news-loading i{
    color:var(--web3-cyan) !important;
    animation:web3Spin 1.2s linear infinite;
}

/* 404 */
.error-page{
    min-height:calc(100vh - 140px) !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
}
.error-content{
    padding:44px 28px !important;
    text-align:center;
}
.error-content h1{
    font-size:clamp(5rem, 22vw, 10rem) !important;
    background:linear-gradient(135deg,#fff,var(--web3-cyan),var(--web3-blue)) !important;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    -webkit-text-fill-color:transparent !important;
}
.btn-home{
    display:inline-flex !important;
    align-items:center;
    gap:8px;
    padding:14px 22px;
    border-radius:15px;
    background:linear-gradient(135deg,var(--web3-blue),var(--web3-cyan)) !important;
    color:#fff !important;
    text-decoration:none !important;
    font-weight:800;
}

/* Reveal animation */
.web3-reveal{
    opacity:0;
    transform:translateY(20px);
    transition:opacity .65s ease, transform .65s ease;
}
.web3-reveal.web3-visible{
    opacity:1;
    transform:translateY(0);
}

/* Mobile */
@media(max-width:992px){
    .finance-container,
    .profile-container,
    .news-container{
        padding-left:12px !important;
        padding-right:12px !important;
    }
    .trade-main-layout{
        display:flex !important;
        flex-direction:column !important;
        padding:0 10px 96px !important;
    }
    .symbol-info-bar{
        position:sticky !important;
        top:0 !important;
        z-index:80 !important;
        width:calc(100% - 20px) !important;
        margin:8px 10px 0 !important;
    }
    .symbol-select-wrapper{
        width:100% !important;
        flex-wrap:wrap !important;
        gap:8px !important;
    }
    .symbol-search{
        min-width:100% !important;
    }
    .chart-wrapper{
        min-height:320px !important;
    }
    .order-book-panel{
        max-height:330px !important;
    }
    .duration-grid{
        grid-template-columns:repeat(4,1fr) !important;
        gap:8px !important;
    }
    .trade-buttons{
        position:sticky !important;
        bottom:78px !important;
        z-index:60 !important;
        background:rgba(2,8,23,.82) !important;
        border:1px solid rgba(91,176,255,.16) !important;
        padding:8px !important;
        margin:8px -8px -4px !important;
        border-radius:22px !important;
        backdrop-filter:blur(18px) !important;
    }
    .profile-grid{
        grid-template-columns:1fr !important;
    }
    .auth-card{
        padding:24px 18px !important;
        border-radius:24px !important;
    }
}

@media(max-width:520px){
    .duration-grid{
        grid-template-columns:repeat(2,1fr) !important;
    }
    .trade-action-btn{
        min-height:56px !important;
    }
    .asset-card,
    .profile-card,
    .history-card-item,
    .bind-section,
    .withdraw-section{
        border-radius:20px !important;
        padding:18px !important;
    }
    .finance-header h1,
    .news-header h1{
        font-size:1.28rem !important;
    }
}

/* Keyframes */
@keyframes web3GridMove{
    from{ background-position:0 0,0 0; }
    to{ background-position:46px 46px,46px 46px; }
}
@keyframes web3OrbFloat{
    0%,100%{ transform:translate3d(0,0,0) scale(1); }
    35%{ transform:translate3d(24px,-18px,0) scale(1.05); }
    70%{ transform:translate3d(-18px,16px,0) scale(.96); }
}
@keyframes web3Spin{
    to{ transform:rotate(360deg); }
}

/* FIX floating coins */
.bu-floating-symbols{
    position:absolute !important;
    inset:0 !important;
    pointer-events:none !important;
    z-index:5 !important;
}

.bu-floating-symbols span{
    position:absolute !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    padding:8px 14px !important;
    border-radius:999px !important;

    background:rgba(240,185,11,.08) !important;
    border:1px solid rgba(240,185,11,.18) !important;

    color:#f0b90b !important;
    font-size:.75rem !important;
    font-weight:700 !important;

    backdrop-filter:blur(10px) !important;
}

/* desktop positions */
.bu-floating-symbols span:nth-child(1){
    top:34%;
    left:0%;
}

.bu-floating-symbols span:nth-child(2){
    top:26%;
    right:4%;
}

.bu-floating-symbols span:nth-child(3){
    bottom:18%;
    left:10%;
}

.bu-floating-symbols span:nth-child(4){
    bottom:28%;
    right:12%;
}

/* mobile */
@media(max-width:768px){

    .bu-floating-symbols span:nth-child(1){
        top:12%;
        left:4%;
    }

    .bu-floating-symbols span:nth-child(2){
        top:18%;
        right:4%;
    }

    .bu-floating-symbols span:nth-child(3){
        bottom:24%;
        left:6%;
    }

    .bu-floating-symbols span:nth-child(4){
        bottom:30%;
        right:6%;
    }
}
/* MOBILE HERO FIX */
@media(max-width:768px){

    .hero-content,
    .btcc-v4-content,
    .bu-hero-grid{
        display:flex !important;
        flex-direction:column !important;
    }

    .hero-video,
    .btcc-v4-video,
    .hero-media{
        order:-1 !important;
        width:100% !important;
        margin-bottom:24px !important;
    }

    .hero-left,
    .hero-text,
    .btcc-v4-left{
        width:100% !important;
    }
}

/* =========================================================
   HOME STABLE FIXES - video first mobile + floating coin + market rows
   ========================================================= */
:root{
    --bu-font:"Exo 2", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --bu-font-display:"Orbitron", "Exo 2", sans-serif;
    --bu-font-mono:"Rajdhani", "Roboto Mono", monospace;
}

.home-container .bu-floating-symbols{
    position:absolute !important;
    inset:0 !important;
    z-index:3 !important;
    pointer-events:none !important;
}
.home-container .bu-floating-symbols span{
    position:absolute !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:8px 12px !important;
    border-radius:999px !important;
    font-family:var(--bu-font-display) !important;
    font-size:.72rem !important;
    font-weight:900 !important;
    letter-spacing:.02em !important;
    color:#FFD60A !important;
    background:rgba(240,185,11,.10) !important;
    border:1px solid rgba(240,185,11,.24) !important;
    box-shadow:0 0 18px rgba(240,185,11,.16), 0 10px 28px rgba(0,0,0,.28) !important;
    animation:buChipFloat 7s ease-in-out infinite !important;
    white-space:nowrap !important;
}
.home-container .bu-floating-symbols span:nth-child(1){
    top: 30% !important;
    left: -1% !important;
    animation-delay: -1s !important;
}.home-container .bu-floating-symbols span:nth-child(2){top:28% !important;right:7% !important;animation-delay:-3s !important;}
.home-container .bu-floating-symbols span:nth-child(3){bottom:18% !important;left:12% !important;animation-delay:-5s !important;}
.home-container .bu-floating-symbols span:nth-child(4){bottom:28% !important;right:14% !important;animation-delay:-2s !important;}

.home-container .bu-animated-scene,
.home-container .btcc-v4-noise,
.home-container .btcc-v4-grid,
.home-container .btcc-v4-orb,
.home-container .btcc-v4-ring,
.home-container .btcc-v4-lines,
.home-container .bu-grid-motion,
.home-container .bu-flow-line,
.home-container .bu-orb{
    display:block !important;
    visibility:visible !important;
}

/* Market row exact structure from home.js */
.binance-market-list{overflow:hidden !important;}
.binance-market-header,
.binance-market-row{
    display:grid !important;
    grid-template-columns:minmax(180px,1.45fr) minmax(130px,1fr) minmax(130px,1fr) minmax(130px,1fr) minmax(130px,1fr) 48px !important;
    align-items:center !important;
    gap:14px !important;
}
.binance-market-row .market-left{grid-column:1 !important;min-width:0 !important;display:flex !important;align-items:center !important;gap:12px !important;}
.binance-market-row .market-mid{display:contents !important;}
.binance-market-row .market-right{display:contents !important;}
.binance-market-row .price-col{grid-column:2 !important;text-align:right !important;font-family:var(--bu-font-mono) !important;white-space:nowrap !important;}
.binance-market-row .change-col{grid-column:3 !important;text-align:right !important;font-family:var(--bu-font-mono) !important;white-space:nowrap !important;}
.binance-market-row .volume-col{grid-column:4 !important;text-align:right !important;font-family:var(--bu-font-mono) !important;white-space:nowrap !important;}
.binance-market-row .trend-col{grid-column:5 !important;justify-self:end !important;min-width:108px !important;}
.binance-market-row .trade-shortcut{grid-column:6 !important;justify-self:end !important;width:38px !important;height:38px !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;border-radius:14px !important;opacity:1 !important;visibility:visible !important;}
.coin-meta{min-width:0 !important;}
.coin-meta .symbol,.coin-meta .name{white-space:nowrap !important;overflow:hidden !important;text-overflow:ellipsis !important;}

@media(max-width:992px){
    .home-container .btcc-hero-v4{padding:10px 0 32px !important;}
    .home-container .btcc-v4-shell{padding:12px !important;border-radius:24px !important;}
    .home-container .btcc-hero-grid-v4{display:flex !important;flex-direction:column !important;gap:16px !important;}
    .home-container .hero-visual{order:1 !important;width:100% !important;margin:0 0 8px 0 !important;display:flex !important;justify-content:center !important;}
    .home-container .btcc-video-frame-v4{order:1 !important;width:100% !important;max-width:100% !important;margin:0 auto !important;display:block !important;}
    .home-container .btcc-hero-content-v4{order:2 !important;width:100% !important;padding:0 !important;}
    .home-container .btcc-video-card-v4{border-radius:20px !important;width:100% !important;display:block !important;overflow:hidden !important;}
    .home-container .btcc-video-card-v4 video{display:block !important;width:100% !important;aspect-ratio:16/9 !important;height:auto !important;max-height:250px !important;object-fit:cover !important;}
    .home-container .btcc-video-topbar-v4{display:none !important;}
    .home-container .bu-floating-symbols span{font-size:.58rem !important;padding:6px 9px !important;opacity:.80 !important;}
    .home-container .bu-floating-symbols span:nth-child(1){top:4% !important;left:5% !important;}
    .home-container .bu-floating-symbols span:nth-child(2){top:15% !important;right:5% !important;}
    .home-container .bu-floating-symbols span:nth-child(3){bottom:10% !important;left:6% !important;}
    .home-container .bu-floating-symbols span:nth-child(4){bottom:22% !important;right:6% !important;}
    .home-container .btcc-title-v4{font-size:clamp(1.95rem,12vw,2.85rem) !important;line-height:.98 !important;margin-top:6px !important;}
    .home-container .btcc-actions-v4{display:grid !important;grid-template-columns:1fr !important;gap:10px !important;}
    .home-container .btcc-actions-v4 .btn{width:100% !important;min-width:0 !important;}
    .home-container .btcc-stats-v4{grid-template-columns:repeat(3,1fr) !important;gap:8px !important;}
    .home-container .btcc-stat-v4{padding:10px 6px !important;text-align:center !important;}
    .home-container .btcc-stat-v4 h3{font-size:.88rem !important;}
    .home-container .btcc-stat-v4 p{font-size:.55rem !important;}

    .binance-market-header{display:none !important;}
    .binance-market-row{
        display:grid !important;
        grid-template-columns:1fr auto !important;
        grid-template-areas:"pair change" "price action" "volume trend" !important;
        gap:8px 12px !important;
        padding:14px 12px !important;
        border-radius:18px !important;
        margin-bottom:10px !important;
    }
    .binance-market-row .market-left{grid-area:pair !important;}
    .binance-market-row .price-col{grid-area:price !important;text-align:left !important;font-size:1.04rem !important;}
    .binance-market-row .change-col{grid-area:change !important;text-align:right !important;align-self:center !important;}
    .binance-market-row .volume-col{grid-area:volume !important;text-align:left !important;font-size:.78rem !important;color:#9fb3d9 !important;}
    .binance-market-row .trend-col{grid-area:trend !important;justify-self:end !important;min-width:92px !important;}
    .binance-market-row .trade-shortcut{grid-area:action !important;justify-self:end !important;width:36px !important;height:36px !important;}
}

@keyframes buChipFloat{0%,100%{transform:translateY(0);opacity:.62}50%{transform:translateY(-12px);opacity:1}}


