/* 数字人工厂 UI Refinement v5.3 - production compatibility layer */
:root{
  --ui5-primary:#6557F5;--ui5-primary-2:#4F66F7;--ui5-text:#181A2A;--ui5-muted:#8E93A7;
  --ui5-border:rgba(43,46,88,.10);--ui5-surface:#fff;--ui5-bg:#F6F7FC;
  --ui5-shadow:0 8px 28px rgba(53,48,112,.07);--ui5-shadow-lg:0 18px 50px rgba(53,48,112,.12)
}
body.ui-v5-front{background:var(--ui5-bg)!important;color:var(--ui5-text)!important}
body.ui-v5-front .app-shell{min-height:100vh!important;display:flex!important;flex-direction:column!important}
body.ui-v5-front .app-main{flex:1!important}

/* ---------- PC 左侧导航：Logo / 算力胶囊 / 个人中心分区 ---------- */
@media (min-width:769px){
  body.ui-v5-front .app-shell{padding-left:244px!important}
  body.ui-v5-front .app-header{
    position:fixed!important;inset:0 auto 0 0!important;width:244px!important;height:100vh!important;z-index:160!important;
    background:rgba(255,255,255,.96)!important;border-right:1px solid var(--ui5-border)!important;border-bottom:0!important;
    box-shadow:8px 0 28px rgba(49,45,103,.035)!important;backdrop-filter:blur(18px)!important;overflow:hidden!important
  }
  body.ui-v5-front .header-inner{
    width:100%!important;max-width:none!important;height:100%!important;margin:0!important;padding:22px 16px 18px!important;
    display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:0!important
  }
  body.ui-v5-front .logo{
    flex:0 0 auto!important;min-height:62px!important;padding:6px 10px 20px!important;margin:0 0 20px!important;
    border-bottom:1px solid rgba(43,46,88,.07)!important;justify-content:flex-start!important;font-size:17px!important
  }
  body.ui-v5-front .logo-icon,body.ui-v5-front .logo-img{width:42px!important;height:42px!important;flex:0 0 42px!important;border-radius:12px!important}
  body.ui-v5-front .logo-text{font-size:17px!important;max-width:150px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;-webkit-text-fill-color:var(--ui5-text)!important;background:none!important}
  body.ui-v5-front .nav{display:flex!important;flex:1 1 auto!important;flex-direction:column!important;width:100%!important;gap:6px!important;overflow:visible!important}
  body.ui-v5-front .nav a{
    width:100%!important;min-height:48px!important;padding:0 14px!important;display:flex!important;align-items:center!important;gap:12px!important;
    border-radius:12px!important;color:#5D6175!important;font-size:15px!important;font-weight:650!important;white-space:nowrap!important;transition:.18s!important
  }
  body.ui-v5-front .nav a::before{width:24px!important;height:24px!important;display:grid!important;place-items:center!important;font-size:18px!important;color:#777B90!important}
  body.ui-v5-front .nav a:nth-child(1)::before{content:'✦'}
  body.ui-v5-front .nav a:nth-child(2)::before{content:'▣'}
  body.ui-v5-front .nav a:nth-child(3)::before{content:'◉'}
  body.ui-v5-front .nav a:nth-child(4)::before{content:'◎'}
  body.ui-v5-front .nav a:nth-child(5)::before{content:'◈'}
  body.ui-v5-front .nav a:hover{background:rgba(101,87,245,.06)!important;color:var(--ui5-primary)!important;transform:translateX(2px)!important}
  body.ui-v5-front .nav a.nav-active,body.ui-v5-front .nav a.router-link-active{background:rgba(101,87,245,.10)!important;color:var(--ui5-primary)!important;font-weight:750!important;box-shadow:inset 3px 0 0 var(--ui5-primary)!important}
  body.ui-v5-front .nav a.nav-active::before,body.ui-v5-front .nav a.router-link-active::before{color:var(--ui5-primary)!important}

  body.ui-v5-front .user-area{
    flex:0 0 auto!important;margin-top:18px!important;padding-top:18px!important;border-top:1px solid rgba(43,46,88,.07)!important;
    width:100%!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:12px!important
  }
  body.ui-v5-front .seconds-badge{
    order:1!important;width:100%!important;min-height:64px!important;margin:0!important;padding:10px 13px!important;
    display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;gap:2px!important;
    border:1px solid #F2DEA8!important;border-radius:14px!important;background:linear-gradient(160deg,#FFFDF7,#FFF8E7)!important;
    color:#9B6700!important;font-size:0!important;font-weight:800!important;line-height:1.2!important;box-shadow:0 5px 16px rgba(75,62,30,.045)!important;
    font-variant-numeric:tabular-nums!important;white-space:nowrap!important
  }
  body.ui-v5-front .seconds-badge::before{content:'剩余点数';font-size:11px!important;line-height:1.2!important;color:#A9915C!important;font-weight:600!important}
  body.ui-v5-front .seconds-badge::after{content:attr(data-balance);font-size:17px!important;line-height:1.2!important;color:#9B6700!important;font-weight:800!important}
  body.ui-v5-front .recharge-btn{display:none!important}
  body.ui-v5-front .avatar-link{
    order:2!important;width:100%!important;height:62px!important;margin:0!important;padding:0 13px!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:11px!important;
    border-radius:14px!important;border:1px solid var(--ui5-border)!important;background:#fff!important;color:var(--ui5-primary)!important;font-size:18px!important;box-shadow:0 5px 16px rgba(53,48,112,.045)!important
  }
  body.ui-v5-front .avatar-link::after{content:'个人中心';color:#35384A!important;font-size:14px!important;font-weight:700!important}
  body.ui-v5-front .avatar-link::before{content:'';width:36px;height:36px;position:absolute;border-radius:11px;background:linear-gradient(145deg,#EEEAFE,#E8F0FF);z-index:-1}
  body.ui-v5-front .avatar-link{position:relative;isolation:isolate}
  body.ui-v5-front .avatar-link:hover{border-color:rgba(101,87,245,.28)!important;box-shadow:0 9px 24px rgba(60,50,140,.09)!important;transform:translateY(-1px)!important}
  body.ui-v5-front .user-area>.btn:not(.recharge-btn){width:100%!important;min-height:44px!important}

  body.ui-v5-front .app-main{width:100%!important;max-width:1500px!important;margin:0 auto!important;padding:34px 36px 58px!important}
  body.ui-v5-front .app-footer{margin-top:auto!important;min-height:58px!important;padding:15px 28px!important;background:rgba(250,250,255,.78)!important;border-top:1px solid var(--ui5-border)!important}
  body.ui-v5-front .footer-inner{max-width:1500px!important;font-size:12px!important;gap:14px!important}
}

/* ---------- 首页创作区 + 实时预览 ---------- */
body.ui-v5-front .home-page.ui-v5-home{
  display:grid!important;grid-template-columns:minmax(0,1fr) minmax(390px,430px)!important;
  grid-template-areas:'hero hero' 'mode preview' 'form preview'!important;gap:22px!important;align-items:start!important
}
body.ui-v5-front .home-page.ui-v5-home>.hero{grid-area:hero!important;text-align:left!important;padding:4px 2px 0!important;margin:0!important}
body.ui-v5-front .home-page.ui-v5-home>.hero .hero-title{font-size:29px!important;-webkit-text-fill-color:var(--ui5-text)!important;background:none!important;line-height:1.25!important}
body.ui-v5-front .home-page.ui-v5-home>.hero .hero-sub{font-size:14px!important;margin-top:6px!important;color:#6B7084!important}
body.ui-v5-front .home-page.ui-v5-home>.mode-switch{grid-area:mode!important;margin:0!important;gap:12px!important}
body.ui-v5-front .home-page.ui-v5-home>.mode-switch .mode-btn{min-height:92px!important;padding:17px 18px!important;border-radius:15px!important;box-shadow:none!important}
body.ui-v5-front .home-page.ui-v5-home>.mode-switch .mode-icon{font-size:24px!important}
body.ui-v5-front .home-page.ui-v5-home>.form-card{grid-area:form!important;padding:23px!important;border-radius:16px!important;box-shadow:var(--ui5-shadow)!important}
body.ui-v5-front .home-page.ui-v5-home .form-group{margin-bottom:17px!important}
body.ui-v5-front .home-page.ui-v5-home .label{font-size:14px!important;color:#414457!important;font-weight:700!important}
body.ui-v5-front .home-page.ui-v5-home .avatar-card{flex-basis:108px!important;border-radius:13px!important;padding:6px!important;min-width:108px!important}
body.ui-v5-front .home-page.ui-v5-home .avatar-thumb{width:94px!important;height:100px!important;border-radius:10px!important}
body.ui-v5-front .home-page.ui-v5-home .avatar-name{font-size:12px!important;margin-top:6px!important}
body.ui-v5-front .home-page.ui-v5-home textarea.input{min-height:116px!important;font-size:14px!important}
body.ui-v5-front .home-page.ui-v5-home .ratio-btn{min-height:78px!important;padding:12px!important}
body.ui-v5-front .home-page.ui-v5-home .generate-btn{min-height:54px!important;font-size:16px!important}

.ui-v5-preview-column{grid-area:preview;display:flex;flex-direction:column;gap:15px;position:sticky;top:24px;align-self:start;min-width:0}
.ui-v5-preview-card,.ui-v5-mini-card{background:#fff;border:1px solid var(--ui5-border);box-shadow:var(--ui5-shadow);border-radius:16px}
.ui-v5-preview-card{padding:20px}
.ui-v5-preview-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:15px}
.ui-v5-preview-head h3{margin:0;color:#242738;font-size:17px;line-height:1.3}
.ui-v5-preview-head p{margin:5px 0 0;color:#999EAF;font-size:11px}.ui-v5-live-dot{display:inline-block;width:7px;height:7px;margin-right:6px;border-radius:50%;background:#16C68A}
.ui-v5-stage{width:min(100%,300px);aspect-ratio:9/16;margin:0 auto 16px;border-radius:18px;overflow:hidden;background:linear-gradient(145deg,#EFEFF6,#E7EBF4);box-shadow:inset 0 0 0 1px rgba(44,47,86,.05),0 12px 30px rgba(42,44,76,.12)}
.ui-v5-stage.landscape{width:100%;aspect-ratio:16/9}.ui-v5-stage img,.ui-v5-stage video{width:100%;height:100%;display:block;object-fit:cover}.ui-v5-stage-empty{width:100%;height:100%;display:grid;place-content:center;text-align:center;color:#A2A6B4;font-size:12px}.ui-v5-stage-empty b{display:block;margin-bottom:8px;color:var(--ui5-primary);font-size:34px}
.ui-v5-summary{padding:13px 14px;border:1px solid #ECECF2;border-radius:12px;background:#FCFCFE}.ui-v5-summary h4{margin:0 0 6px;font-size:13px}.ui-v5-summary p{min-height:42px;margin:0;color:#666B7E;font-size:12px;line-height:1.65;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.ui-v5-summary-meta{margin-top:10px;padding-top:9px;border-top:1px solid #EEEFF3;display:flex;justify-content:space-between;color:#9CA0B0;font-size:11px}.ui-v5-summary-meta strong{color:#3C4052;font-size:12px}
.ui-v5-preview-info{display:grid;grid-template-columns:1fr 1fr;gap:14px}.ui-v5-mini-card{min-height:190px;padding:17px}.ui-v5-mini-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:14px}.ui-v5-mini-head h4{margin:0;font-size:14px}.ui-v5-mini-head span{color:#9CA0B0;font-size:10px}
.ui-v5-config-list{display:flex;flex-direction:column;gap:11px}.ui-v5-config-row{display:flex;justify-content:space-between;gap:8px;align-items:center}.ui-v5-config-row span{color:#9CA0B0;font-size:11px}.ui-v5-config-row strong{max-width:104px;color:#45485B;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ui-v5-points{background:linear-gradient(155deg,#fff 0%,#F7F5FF 100%);border-color:rgba(101,87,245,.16)}.ui-v5-cost-label{color:#969AAB;font-size:11px}.ui-v5-cost-wrap{display:flex;align-items:baseline;gap:4px;margin-top:2px}.ui-v5-cost{color:var(--ui5-primary);font-size:35px;line-height:1;font-weight:850;letter-spacing:-.04em}.ui-v5-cost-unit{color:var(--ui5-primary);font-size:12px;font-weight:700}.ui-v5-remain{margin-top:14px;padding-top:12px;border-top:1px solid rgba(101,87,245,.10);display:flex;align-items:center;justify-content:space-between;gap:8px}.ui-v5-remain span{color:#9CA0B0;font-size:11px}.ui-v5-remain strong{color:#4A4D60;font-size:12px}.ui-v5-point-warning{display:none;margin-top:8px;color:#DC5B5B;font-size:10px}.ui-v5-points.insufficient .ui-v5-point-warning{display:block}

/* ---------- 充值页 ---------- */
body.ui-v5-front .recharge-page{max-width:1180px!important;margin:0 auto!important}
body.ui-v5-front .recharge-page .page-header h2{font-size:28px!important}
body.ui-v5-front .recharge-page .balance-card{min-height:164px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;background:linear-gradient(120deg,#7558FF,#5065F7)!important;border:0!important;border-radius:16px!important;box-shadow:0 18px 44px rgba(83,74,210,.20)!important}
body.ui-v5-front .recharge-page .balance-label{font-size:13px!important}
body.ui-v5-front .recharge-page .balance-value{font-size:42px!important;margin:4px 0!important}
body.ui-v5-front .recharge-page .plans{gap:12px!important}
body.ui-v5-front .recharge-page .plan-card{position:relative!important;min-height:154px!important;padding:18px 14px!important;border-radius:15px!important;overflow:hidden!important;box-shadow:none!important;background:#fff!important}
body.ui-v5-front .recharge-page .plan-card:hover{transform:translateY(-2px)!important;border-color:rgba(101,87,245,.30)!important;box-shadow:0 10px 26px rgba(62,55,133,.09)!important}
body.ui-v5-front .recharge-page .plan-card.active{border:2px solid var(--ui5-primary)!important;padding:17px 13px!important;background:linear-gradient(180deg,#fff,#F8F7FF)!important;box-shadow:0 0 0 3px rgba(101,87,245,.08)!important}
body.ui-v5-front .recharge-page .plan-card.active::after{content:'✓';position:absolute;right:10px;top:10px;width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:var(--ui5-primary);color:#fff;font-size:12px;font-weight:900;box-shadow:0 4px 12px rgba(101,87,245,.26)}
body.ui-v5-front .recharge-page .plan-seconds{font-size:25px!important;color:var(--ui5-primary)!important}.recharge-page .plan-price{font-size:17px!important}.recharge-page .plan-hint{font-size:11px!important}
body.ui-v5-front .recharge-page .pay-channels{gap:12px!important}.recharge-page .channel{min-height:74px!important;border-radius:15px!important;padding:12px 16px!important;position:relative!important}.recharge-page .channel.active{border:2px solid var(--ui5-primary)!important;padding:11px 15px!important;box-shadow:0 0 0 3px rgba(101,87,245,.07)!important}.recharge-page .channel::after{content:'';width:18px;height:18px;margin-left:auto;border:1.5px solid #D4D7E1;border-radius:50%;box-sizing:border-box}.recharge-page .channel.active::after{border:5px solid var(--ui5-primary)}
.recharge-page .channel-icon{width:40px!important;height:40px!important;flex:0 0 40px!important;display:grid!important;place-items:center!important;font-size:0!important}.recharge-page .channel-icon img{width:40px;height:40px;display:block;object-fit:contain;border-radius:10px}.recharge-page .channel span:not(.channel-icon){font-size:14px!important}.recharge-page .pay-btn{min-height:54px!important;border-radius:12px!important}

/* ---------- 前台固定页脚 ---------- */
body.ui-v5-front .app-footer{margin-top:auto!important}.ui-v5-original-footer{display:none!important}.footer-copyright{color:#666B7E}.footer-icp{color:#8F94A6}

/* ---------- 后台：放大信息密度，移除无效头部元素 ---------- */
body.ui-v5-admin .header-time{display:none!important}
body.ui-v5-admin .admin-content{padding:26px 28px!important;font-size:14px!important}
body.ui-v5-admin .stats-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:16px!important}
body.ui-v5-admin .stat-card{min-height:112px!important;padding:20px!important;border-radius:15px!important;box-shadow:0 6px 22px rgba(40,42,77,.05)!important}
body.ui-v5-admin .stat-value{font-size:26px!important}.ui-v5-hidden{display:none!important}
body.ui-v5-admin .trend-card,body.ui-v5-admin .latest-users.card,body.ui-v5-admin .dist-card{border-radius:14px!important;box-shadow:0 6px 22px rgba(40,42,77,.045)!important}

/* 后台版权卡（生产兼容注入） */
.ui-v5-admin-site-card{margin-top:12px;padding:18px 20px;border:1px solid #ebecef;border-radius:12px;background:#fff}.ui-v5-admin-site-card h4{margin:0 0 5px;color:#333748;font-size:14px}.ui-v5-admin-site-card>p{margin:0 0 15px;color:#969bab;font-size:11px}.ui-v5-admin-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.ui-v5-admin-field label{display:block;margin-bottom:6px;color:#5e6375;font-size:12px;font-weight:700}.ui-v5-admin-field input{width:100%;height:42px;padding:0 12px;border:1px solid #dbdde6;border-radius:9px;background:#fafafd;color:#303344;outline:none}.ui-v5-admin-field input:focus{border-color:var(--ui5-primary);background:#fff;box-shadow:0 0 0 3px rgba(101,87,245,.08)}.ui-v5-admin-field small{display:block;margin-top:5px;color:#a0a4b2;font-size:10px}.ui-v5-admin-save-state{display:none;margin-top:10px;color:#2B9B6D;font-size:11px}.ui-v5-admin-save-state.show{display:block}

@media (max-width:1180px) and (min-width:769px){
 body.ui-v5-front .home-page.ui-v5-home{grid-template-columns:minmax(0,1fr) 360px!important}.ui-v5-preview-info{grid-template-columns:1fr!important}.ui-v5-mini-card{min-height:160px}
}
@media (max-width:920px){body.ui-v5-admin .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.ui-v5-admin-fields{grid-template-columns:1fr}}
@media (max-width:768px){
  body.ui-v5-front .app-shell{padding-left:0!important}
  body.ui-v5-front .app-main{padding:22px 14px 96px!important}
  body.ui-v5-front .home-page.ui-v5-home{display:flex!important;flex-direction:column!important;gap:16px!important}
  body.ui-v5-front .home-page.ui-v5-home>.hero{width:100%!important;padding-top:6px!important}.ui-v5-preview-column{position:static;width:100%}.ui-v5-preview-info{grid-template-columns:1fr 1fr}.ui-v5-mini-card{min-height:175px}.ui-v5-stage{max-height:430px}
  body.ui-v5-front .app-footer{padding:14px 14px calc(86px + env(safe-area-inset-bottom))!important}.footer-inner{font-size:11px!important;text-align:center!important;gap:7px 12px!important}
  body.ui-v5-front .recharge-page .plans{grid-template-columns:1fr 1fr!important}.recharge-page .pay-channels{grid-template-columns:1fr!important}
  body.ui-v5-admin .admin-content{padding:16px!important}
}
@media (max-width:520px){.ui-v5-preview-info{grid-template-columns:1fr}.ui-v5-mini-card{min-height:auto}body.ui-v5-front .recharge-page .plans{grid-template-columns:1fr!important}}

@media (max-width: 768px){
  body.ui-v5-front .home-page.ui-v5-home>.mode-switch{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:0!important;
    border:1px solid var(--ui5-border)!important;
    border-radius:15px!important;
    overflow:hidden!important;
    background:#fff!important
  }
  body.ui-v5-front .home-page.ui-v5-home>.mode-switch .mode-btn{
    min-height:64px!important;
    padding:10px 8px!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
    border:0!important;
    border-radius:0!important;
    transform:none!important;
    box-shadow:none!important;
    text-align:center!important
  }
  body.ui-v5-front .home-page.ui-v5-home>.mode-switch .mode-btn+ .mode-btn{
    border-left:1px solid var(--ui5-border)!important
  }
  body.ui-v5-front .home-page.ui-v5-home>.mode-switch .mode-desc{
    display:none!important
  }
  body.ui-v5-front .home-page.ui-v5-home>.mode-switch .mode-icon{
    font-size:18px!important
  }
  body.ui-v5-front .home-page.ui-v5-home>.mode-switch .mode-title{
    font-size:13px!important;
    white-space:nowrap!important
  }
  body.ui-v5-front .home-page.ui-v5-home>.mode-switch .mode-check{
    display:none!important
  }
}

/* =========================================================
   UI Refinement v5.4 - requested responsive/admin refinements
   ========================================================= */

/* PC front sidebar: cleaner icon system */
@media (min-width:769px){
  body.ui-v5-front .nav a::before{
    width:32px!important;height:32px!important;flex:0 0 32px!important;
    border-radius:10px!important;font-size:16px!important;font-weight:800!important;
    color:#656A7C!important;background:#F3F4F8!important;
    transition:.18s ease!important
  }
  body.ui-v5-front .nav a:nth-child(1)::before{content:'✦';background:#F0EDFF!important;color:#6557F5!important}
  body.ui-v5-front .nav a:nth-child(2)::before{content:'▤';background:#EEF5FF!important;color:#3975DB!important}
  body.ui-v5-front .nav a:nth-child(3)::before{content:'♪';background:#ECFAF7!important;color:#159878!important}
  body.ui-v5-front .nav a:nth-child(4)::before{content:'◇';background:#FFF3F7!important;color:#D7628B!important}
  body.ui-v5-front .nav a:nth-child(5)::before{content:'⚡';background:#FFF7E8!important;color:#C88715!important}
  body.ui-v5-front .nav a:hover::before{
    transform:scale(1.04)!important;
  }
  body.ui-v5-front .nav a.nav-active::before,
  body.ui-v5-front .nav a.router-link-active::before{
    color:#fff!important;background:linear-gradient(145deg,#7259FF,#5369F7)!important;
    box-shadow:0 5px 13px rgba(101,87,245,.22)!important
  }

  /* PC creation page heading */
  body.ui-v5-front .home-page.ui-v5-home>.hero{
    position:relative!important;overflow:hidden!important;
    padding:22px 24px 21px!important;
    border:1px solid rgba(101,87,245,.11)!important;
    border-radius:18px!important;
    background:
      radial-gradient(circle at 88% 18%,rgba(101,87,245,.12),transparent 28%),
      linear-gradient(135deg,#FFFFFF 0%,#FAF9FF 58%,#F5F7FF 100%)!important;
    box-shadow:0 8px 28px rgba(53,48,112,.055)!important
  }
  body.ui-v5-front .home-page.ui-v5-home>.hero::before{
    content:'AI DIGITAL HUMAN';display:inline-flex!important;align-items:center!important;
    height:24px!important;padding:0 9px!important;margin-bottom:8px!important;
    border-radius:999px!important;background:#EEEAFE!important;color:#6557F5!important;
    font-size:10px!important;font-weight:800!important;letter-spacing:.08em!important
  }
  body.ui-v5-front .home-page.ui-v5-home>.hero::after{
    content:'✦';position:absolute;right:26px;top:18px;
    width:48px;height:48px;display:grid;place-items:center;
    border-radius:15px;background:linear-gradient(145deg,#7259FF,#5369F7);
    color:#fff;font-size:23px;box-shadow:0 10px 24px rgba(101,87,245,.20)
  }
  body.ui-v5-front .home-page.ui-v5-home>.hero .hero-title{
    max-width:calc(100% - 90px)!important;
    margin:0!important;font-size:31px!important;font-weight:850!important;
    letter-spacing:-.035em!important;color:#202334!important
  }
  body.ui-v5-front .home-page.ui-v5-home>.hero .hero-sub{
    max-width:calc(100% - 90px)!important;margin-top:7px!important;
    font-size:13px!important;line-height:1.65!important;color:#73788A!important
  }
}

/* Mobile: real responsive layout instead of desktop scaling */
@media (max-width:768px){
  html,body{width:100%!important;max-width:100%!important;overflow-x:hidden!important}
  body.ui-v5-front .app-shell{width:100%!important;min-width:0!important}
  body.ui-v5-front .app-header{
    width:100%!important;min-width:0!important;background:rgba(255,255,255,.96)!important;
    border-bottom:1px solid rgba(43,46,88,.08)!important;backdrop-filter:blur(18px)!important
  }
  body.ui-v5-front .header-inner{
    width:100%!important;max-width:none!important;height:58px!important;padding:0 14px!important;
    gap:10px!important
  }
  body.ui-v5-front .logo{min-width:0!important;flex:1!important;gap:8px!important}
  body.ui-v5-front .logo-icon,body.ui-v5-front .logo-img{width:34px!important;height:34px!important;flex:0 0 34px!important;border-radius:10px!important}
  body.ui-v5-front .logo-text{max-width:150px!important;overflow:hidden!important;text-overflow:ellipsis!important;font-size:15px!important}
  body.ui-v5-front .user-area{flex:0 0 auto!important;gap:7px!important}
  body.ui-v5-front .avatar-link{width:34px!important;height:34px!important}
  body.ui-v5-front .app-main{
    width:100%!important;max-width:100%!important;min-width:0!important;
    margin:0!important;padding:14px 12px 92px!important
  }

  body.ui-v5-front .home-page.ui-v5-home{
    width:100%!important;max-width:100%!important;min-width:0!important;
    display:flex!important;flex-direction:column!important;gap:12px!important
  }
  body.ui-v5-front .home-page.ui-v5-home>*{min-width:0!important;max-width:100%!important}
  body.ui-v5-front .home-page.ui-v5-home>.hero{
    order:1!important;width:100%!important;
    padding:16px 16px 15px!important;margin:0!important;
    border:1px solid rgba(101,87,245,.10)!important;border-radius:16px!important;
    background:
      radial-gradient(circle at 90% 10%,rgba(101,87,245,.11),transparent 34%),
      linear-gradient(145deg,#FFF,#F8F8FF)!important;
    box-shadow:none!important;text-align:left!important
  }
  body.ui-v5-front .home-page.ui-v5-home>.hero::before{
    content:'AI DIGITAL HUMAN';display:inline-flex!important;align-items:center!important;
    height:21px!important;padding:0 8px!important;margin-bottom:7px!important;
    border-radius:999px!important;background:#EEEAFE!important;color:#6557F5!important;
    font-size:9px!important;font-weight:800!important;letter-spacing:.07em!important
  }
  body.ui-v5-front .home-page.ui-v5-home>.hero .hero-title{
    margin:0!important;font-size:22px!important;line-height:1.3!important;
    letter-spacing:-.025em!important;color:#202334!important
  }
  body.ui-v5-front .home-page.ui-v5-home>.hero .hero-sub{
    margin-top:5px!important;font-size:12px!important;line-height:1.55!important;color:#7B8091!important
  }
  body.ui-v5-front .home-page.ui-v5-home>.hero .hero-agency{
    margin-top:8px!important;padding:4px 9px!important;font-size:10px!important
  }

  /* One compact mode block, two polished left/right actions */
  body.ui-v5-front .home-page.ui-v5-home>.mode-switch{
    order:2!important;width:100%!important;min-width:0!important;
    display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:6px!important;padding:5px!important;margin:0!important;
    border:1px solid rgba(43,46,88,.08)!important;border-radius:15px!important;
    background:#F0F1F7!important;overflow:visible!important
  }
  body.ui-v5-front .home-page.ui-v5-home>.mode-switch .mode-btn{
    width:100%!important;min-width:0!important;min-height:58px!important;
    padding:8px 7px!important;margin:0!important;
    display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:center!important;
    gap:7px!important;border:1px solid transparent!important;border-radius:11px!important;
    background:transparent!important;color:#717688!important;
    box-shadow:none!important;transform:none!important;text-align:center!important
  }
  body.ui-v5-front .home-page.ui-v5-home>.mode-switch .mode-btn+.mode-btn{border-left-color:transparent!important}
  body.ui-v5-front .home-page.ui-v5-home>.mode-switch .mode-btn.active{
    border-color:rgba(101,87,245,.11)!important;background:#fff!important;color:#4F46D9!important;
    box-shadow:0 4px 14px rgba(45,42,93,.09)!important
  }
  body.ui-v5-front .home-page.ui-v5-home>.mode-switch .mode-icon{
    width:30px!important;height:30px!important;flex:0 0 30px!important;
    display:grid!important;place-items:center!important;border-radius:9px!important;
    background:rgba(101,87,245,.08)!important;color:#6557F5!important;font-size:16px!important
  }
  body.ui-v5-front .home-page.ui-v5-home>.mode-switch .mode-btn:nth-child(2) .mode-icon{
    background:rgba(38,163,183,.09)!important;color:#228C9E!important
  }
  body.ui-v5-front .home-page.ui-v5-home>.mode-switch .mode-title{
    min-width:0!important;font-size:12px!important;line-height:1.25!important;
    font-weight:750!important;white-space:normal!important
  }
  body.ui-v5-front .home-page.ui-v5-home>.mode-switch .mode-desc,
  body.ui-v5-front .home-page.ui-v5-home>.mode-switch .mode-check{display:none!important}

  body.ui-v5-front .home-page.ui-v5-home>.form-card{
    order:3!important;width:100%!important;min-width:0!important;
    padding:16px!important;margin:0!important;border-radius:16px!important;
    box-shadow:0 4px 18px rgba(45,42,93,.045)!important
  }
  body.ui-v5-front .home-page.ui-v5-home .form-group{margin-bottom:15px!important}
  body.ui-v5-front .home-page.ui-v5-home .label{font-size:13px!important;margin-bottom:7px!important}
  body.ui-v5-front .home-page.ui-v5-home .avatar-picker{
    width:100%!important;max-width:100%!important;gap:9px!important;
    padding-bottom:7px!important;overflow-x:auto!important;scroll-snap-type:x proximity!important
  }
  body.ui-v5-front .home-page.ui-v5-home .avatar-card{
    flex:0 0 82px!important;min-width:82px!important;padding:5px!important;scroll-snap-align:start!important
  }
  body.ui-v5-front .home-page.ui-v5-home .avatar-thumb{
    width:70px!important;height:76px!important;border-radius:10px!important
  }
  body.ui-v5-front .home-page.ui-v5-home .ratio-row{gap:8px!important}
  body.ui-v5-front .home-page.ui-v5-home .ratio-btn{
    min-height:68px!important;padding:9px!important;border-width:1px!important;border-radius:11px!important
  }
  body.ui-v5-front .home-page.ui-v5-home .ratio-v{width:23px!important;height:37px!important}
  body.ui-v5-front .home-page.ui-v5-home .ratio-h{width:39px!important;height:23px!important}
  body.ui-v5-front .home-page.ui-v5-home .voice-row{gap:7px!important;align-items:stretch!important}
  body.ui-v5-front .home-page.ui-v5-home .voice-select{min-width:0!important;width:100%!important}
  body.ui-v5-front .home-page.ui-v5-home .preview-btn{padding:0 12px!important;flex:0 0 auto!important}
  body.ui-v5-front .home-page.ui-v5-home textarea.input{min-height:104px!important}
  body.ui-v5-front .home-page.ui-v5-home .billing-tip{font-size:11px!important;line-height:1.55!important}
  body.ui-v5-front .home-page.ui-v5-home .generate-btn{width:100%!important;min-height:48px!important}

  body.ui-v5-front .home-page.ui-v5-home>.ui-v5-preview-column{
    order:4!important;width:100%!important;min-width:0!important;position:static!important;gap:12px!important
  }
  body.ui-v5-front .ui-v5-preview-card{padding:16px!important;border-radius:16px!important}
  body.ui-v5-front .ui-v5-stage{
    width:min(72vw,280px)!important;max-width:100%!important;max-height:none!important;margin:0 auto 14px!important
  }
  body.ui-v5-front .ui-v5-preview-info{
    grid-template-columns:1fr 1fr!important;gap:10px!important
  }
  body.ui-v5-front .ui-v5-mini-card{min-height:0!important;padding:14px!important;border-radius:14px!important}
  body.ui-v5-front .mobile-tabbar{
    padding:5px 4px calc(5px + env(safe-area-inset-bottom))!important;
    box-shadow:0 -8px 28px rgba(42,43,70,.06)!important
  }
  body.ui-v5-front .tab-item{padding:5px 0!important;font-size:10px!important}
  body.ui-v5-front .tab-item .tab-icon{font-size:19px!important}
}

/* Very narrow phones */
@media (max-width:390px){
  body.ui-v5-front .home-page.ui-v5-home>.mode-switch .mode-btn{gap:5px!important;padding:7px 5px!important}
  body.ui-v5-front .home-page.ui-v5-home>.mode-switch .mode-icon{width:27px!important;height:27px!important;flex-basis:27px!important;font-size:14px!important}
  body.ui-v5-front .home-page.ui-v5-home>.mode-switch .mode-title{font-size:11px!important}
  body.ui-v5-front .ui-v5-preview-info{grid-template-columns:1fr!important}
}

/* Mobile login/register: full card, no clipping */
@media (max-width:768px){
  body.ui-v5-front .auth-page{
    width:100%!important;min-height:calc(100svh - 58px)!important;height:auto!important;
    padding:10px 0 18px!important;overflow:visible!important;place-items:start center!important
  }
  body.ui-v5-front .auth-page .bg-glow{opacity:.12!important;filter:blur(90px)!important}
  body.ui-v5-front .auth-card{
    width:100%!important;max-width:430px!important;min-width:0!important;
    margin:0 auto!important;padding:22px 18px 20px!important;
    border-radius:18px!important;box-shadow:0 10px 34px rgba(58,52,132,.10)!important
  }
  body.ui-v5-front .auth-header{margin-bottom:16px!important}
  body.ui-v5-front .auth-logo{width:46px!important;height:46px!important;margin-bottom:9px!important;border-radius:13px!important;font-size:23px!important}
  body.ui-v5-front .auth-title{font-size:20px!important;line-height:1.25!important}
  body.ui-v5-front .auth-sub{font-size:12px!important;margin-top:4px!important}
  body.ui-v5-front .mode-tabs{margin-bottom:15px!important;padding:4px!important}
  body.ui-v5-front .mode-tabs button{height:34px!important;font-size:13px!important}
  body.ui-v5-front .auth-form{gap:0!important}
  body.ui-v5-front .auth-form .form-group{margin-bottom:13px!important}
  body.ui-v5-front .auth-form .label{margin-bottom:6px!important;font-size:12px!important}
  body.ui-v5-front .auth-form .input{min-width:0!important;min-height:44px!important;padding:10px 12px!important;font-size:16px!important}
  body.ui-v5-front .captcha-row{width:100%!important;min-width:0!important;gap:8px!important;align-items:stretch!important}
  body.ui-v5-front .captcha-input{min-width:0!important;flex:1 1 auto!important}
  body.ui-v5-front .captcha-img{width:108px!important;min-width:108px!important;height:44px!important;border-radius:10px!important}
  body.ui-v5-front .pwd-rule-tip{margin-top:6px!important;font-size:10px!important;line-height:1.45!important}
  body.ui-v5-front .forgot-row{margin-top:4px!important}
  body.ui-v5-front .auth-btn{height:46px!important;margin-top:3px!important}
  body.ui-v5-front .alert{margin-bottom:12px!important;padding:9px 11px!important;font-size:12px!important}
}
@media (max-width:360px){
  body.ui-v5-front .auth-card{padding:18px 14px!important}
  body.ui-v5-front .captcha-img{width:96px!important;min-width:96px!important}
}
@media (max-width:768px) and (max-height:700px){
  body.ui-v5-front .auth-page{padding-top:6px!important}
  body.ui-v5-front .auth-card{padding-top:17px!important;padding-bottom:17px!important}
  body.ui-v5-front .auth-header{margin-bottom:11px!important}
  body.ui-v5-front .auth-logo{width:40px!important;height:40px!important;margin-bottom:7px!important}
}

/* Admin: white sidebar + polished data surfaces */
body.ui-v5-admin .admin-shell{background:#F5F6FA!important}
body.ui-v5-admin .admin-sidebar{
  background:#fff!important;color:#242738!important;
  border-right:1px solid #E8EAF0!important;box-shadow:6px 0 24px rgba(35,38,61,.035)!important
}
body.ui-v5-admin .sidebar-brand{border-bottom:1px solid #EEF0F4!important}
body.ui-v5-admin .brand-name{color:#252838!important}
body.ui-v5-admin .sidebar-nav{padding:14px 10px!important;gap:5px!important}
body.ui-v5-admin .nav-item{
  min-height:44px!important;padding:10px 12px!important;border-radius:10px!important;
  color:#686D7E!important
}
body.ui-v5-admin .nav-item:hover{background:#F6F5FF!important;color:#5D50E4!important}
body.ui-v5-admin .nav-item.active{
  background:#F0EEFF!important;color:#5C4FE5!important;font-weight:700!important;
  box-shadow:inset 3px 0 0 #6557F5!important
}
body.ui-v5-admin .nav-icon{
  width:30px!important;height:30px!important;display:grid!important;place-items:center!important;
  border-radius:9px!important;background:#F4F5F8!important;font-size:15px!important
}
body.ui-v5-admin .nav-item.active .nav-icon{background:#E7E3FF!important}
body.ui-v5-admin .sidebar-footer{border-top:1px solid #EEF0F4!important}
body.ui-v5-admin .admin-avatar{background:#F0EEFF!important;color:#6557F5!important}
body.ui-v5-admin .admin-name{color:#303344!important}
body.ui-v5-admin .admin-role{color:#969BAB!important}
body.ui-v5-admin .back-btn{
  border:1px solid #E0E2E9!important;background:#FAFAFC!important;color:#64697A!important
}
body.ui-v5-admin .back-btn:hover{background:#F3F2FF!important;color:#5C4FE5!important;border-color:#D8D3FF!important}
body.ui-v5-admin .admin-header{background:#fff!important;border-bottom-color:#E9EBF0!important}
body.ui-v5-admin .admin-content{background:#F5F6FA!important}

body.ui-v5-admin .dashboard{gap:18px!important}
body.ui-v5-admin .stats-grid{gap:14px!important}
body.ui-v5-admin .stat-card{
  position:relative!important;overflow:hidden!important;min-height:116px!important;
  padding:19px 20px!important;border:1px solid #E9EBF1!important;border-radius:16px!important;
  background:#fff!important;box-shadow:0 5px 18px rgba(37,40,67,.045)!important
}
body.ui-v5-admin .stat-card::after{
  content:'';position:absolute;right:-18px;top:-24px;width:82px;height:82px;border-radius:50%;
  background:rgba(101,87,245,.035)
}
body.ui-v5-admin .stat-card:hover{transform:translateY(-1px)!important;box-shadow:0 9px 24px rgba(37,40,67,.07)!important}
body.ui-v5-admin .stat-icon{
  width:48px!important;height:48px!important;flex:0 0 48px!important;
  border-radius:13px!important;box-shadow:none!important
}
body.ui-v5-admin .stat-value{font-size:27px!important;font-weight:800!important;letter-spacing:-.025em!important;color:#1F2232!important}
body.ui-v5-admin .stat-label{margin-top:4px!important;font-size:12px!important;color:#9196A6!important}
body.ui-v5-admin .panel,
body.ui-v5-admin .trend-card,
body.ui-v5-admin .latest-users.card,
body.ui-v5-admin .dist-card{
  border:1px solid #E9EBF1!important;border-radius:16px!important;background:#fff!important;
  box-shadow:0 5px 18px rgba(37,40,67,.04)!important
}
body.ui-v5-admin .trend-card{padding:21px!important}
body.ui-v5-admin .section-title,
body.ui-v5-admin .panel-head h3{color:#303344!important;font-weight:750!important}
body.ui-v5-admin .task-status-grid{gap:10px!important}
body.ui-v5-admin .status-item{
  min-height:52px!important;border:1px solid #EFF0F4!important;border-radius:11px!important;
  background:#FBFBFD!important;box-shadow:none!important
}
body.ui-v5-admin .trend-bars{border-radius:12px!important;background:linear-gradient(180deg,#FCFCFE,#FFF)!important}
body.ui-v5-admin .trend-bar{background:linear-gradient(180deg,#7158FF,#596BF4)!important;border-radius:7px 7px 2px 2px!important}
body.ui-v5-admin .table th{background:#FAFAFC!important;color:#858A9A!important}
body.ui-v5-admin .table td{color:#45495A!important}
body.ui-v5-admin .usage-track{background:#EEF0F5!important}
body.ui-v5-admin .usage-track i{background:linear-gradient(90deg,#7158FF,#586AF4)!important}

@media (max-width:920px){
  body.ui-v5-admin .stat-card{min-height:104px!important}
}

