/* ===== CARD (Compact Mobile) ===== */
.yr-card{
  width:100%;
  background:var(--card);
  color:var(--text);
  border-radius:16px;
  padding:14px;
  border:1px solid var(--line);
  box-sizing:border-box;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  position:relative;
}

/* ===== TOP ===== */
.yr-top{
  display:flex;
  gap:12px;
  align-items:center;
  margin-bottom:10px;
}

.yr-logoWrap{
  width:90px;
  height:90px;
  border-radius:16px;
  background:var(--banner);
  display:grid;
  place-items:center;
  flex:0 0 auto;
  margin-bottom:auto;
  overflow:hidden;
}

.yr-logo{
  object-fit:cover;
}

.yr-title{
  font-size:20px;
  font-weight:700;
  margin-bottom:1px;
}

.yr-tag{
  font-size:13px;
  color:var(--muted);
  margin-bottom:1px;
}

.yr-tag{
  position:relative;
  color:var(--muted);
}

.yr-moreBtn{
  border:0;
  background:transparent;
  padding:0;
  font:inherit;
  font-weight:500;
  color:var(--dlBlue);
  cursor:pointer;
  pointer-events:auto;
}

.yr-moreBtn:hover{ text-decoration:underline; }

.yr-tag.yr-expanded .yr-moreBtn{
  color:var(--muted);
}

.yr-stars{
  display:flex;
  gap:2px;
  font-size:14px;
}

.yr-stars i{
  color:rgba(127,127,127,.35);
}

.yr-stars .yr-star-on,
.yr-stars .yr-star-half{
  color:var(--star);
  animation:yrStarFade 1.4s ease-in-out infinite;
}

/* Fade animation */
@keyframes yrStarFade{
  0%{opacity:.6;transform:scale(1);}
  50%{opacity:1;transform:scale(1.05);}
  100%{opacity:.6;transform:scale(1);}
}

/* ===== STATS ===== */
.yr-stats{
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:var(--chip);
  border-radius:12px;
  padding:8px 6px;
  border:1px solid var(--line);
  margin-bottom:12px;
}

.yr-stat{
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:0px;
}

.yr-stats-text { font-size:10px; font-weight:500;}

.yr-ico{
  font-size:14px;
  color:var(--text);
}

.yr-val{
  font-size:12px;
  font-weight:600;
}

@media (max-width: 336px){
  
.yr-stats-text { font-size:8px; } .yr-val{ font-size:10px; }

}

.yr-divider{
  width:1px;
  height:28px;
  background:var(--line);
}

.yr-gold{ color:var(--star); }
.yr-green{ color:var(--moneyGreen); }
.yr-blue{ color:var(--dlBlue); }

/* ===== BUTTON ===== */
.yr-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  height:44px; width:100%;
  border-radius:12px;
  background:var(--btn);
  color:var(--btnText);
  text-decoration:none;
  font-weight:600;
  font-size:16px;
  box-shadow:var(--shadow);
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}

.yr-btnIco{
  display:grid;
  place-items:center;
  border-radius:6px;
  background:var(--iconBg);
  font-size:17px;
}   

.appsList { border-radius:16px;
  box-shadow:var(--shadow);
  border:1px solid var(--line); overflow:hidden; margin-top:10px; }

.tabsTrend{
      padding:3px; margin-top:10px; width:calc(100% - 20px);
      border-radius:13px;
      background:transparent;
    }
    .tabTrend{
      width:100%;    
      background: color-mix(in srgb, var(--tab) 92%, transparent);
      border-radius: 13px;
      padding: 6px;
      font-weight: 500; font-size:16px;
      text-align:center;
      color: var(--text);
      cursor:pointer;
      -webkit-tap-highlight-color:transparent;
      white-space:nowrap; 
    }
    
.assetsp-carx{
  background: var(--card);
  border-bottom: 1px solid var(--line);
  padding: 6px 10px;
  margin: 0;
  position: relative;
  overflow: hidden;
  transition: transform .16s ease, box-shadow .16s ease;
}    

.assetsp-carx:last-child {
  border-bottom: none;
}

.assetsp-logo{
  width: 62px;
  height: 62px; }
  

.app-title{
  font-size:19px;
  font-weight:700;
  margin-bottom:15px;
  line-height:1.4;
}

/* App Image */
.app-logo{
  width:110px;
  height:110px;
  border-radius:18px;
  display:block;
  margin:0 auto 15px;
  box-shadow:var(--shadow3);
}

/* Intro Text */
.app-desc{
  font-size:14px;
  line-height:1.6;
  margin-bottom:20px;
  color:var(--text);
}

/* Section Heading */
.section-title{
  font-size:16px;
  font-weight:700;
  margin:18px 0 10px;
  border-bottom:1px solid var(--line);
  padding-bottom:6px;
}

/* Table */
.app-table{
  width:100%;
  border-collapse:collapse;
  font-size:14px;
}

.app-table th,
.app-table td{
  border:1px solid var(--line);
  padding:10px;
  text-align:left;
}

.app-table th{
  background:var(--chip);
  font-weight:600;
}

.status-ok{
  color:var(--green);
  font-weight:600;
}

/* Disclaimer */
.disclaimer{
  font-size:13px;
  margin-top:15px;
  color:var(--muted);
}

/* FAQ */
.faq-item{
  border:1px solid var(--line);
  margin-bottom:10px;
  border-radius:6px;
}

/* default CLOSED state */
.faq-item .faq-answer{
  display:none;
}

.faq-question{
  padding:10px;
  font-weight:600;
  cursor:pointer;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
  background:var(--chip);
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.faq-answer{
  padding:10px;
  font-size:14px;
  line-height:1.6;
}

.faq-question i{
  font-size:13px;
  transition:0.2s;
  transform:rotate(-90deg); /* default arrow closed */
}

/* OPEN state */
.faq-item.open .faq-answer{
  display:block;
}

.faq-item.open .faq-question i{
  transform:rotate(0deg);
}

.dash-divider{
  margin: 15px 0 10px 0;
  border-top: 1px dashed var(--line);
}

.assetsp-moreHidden{ display:none; }

/* more button area */
.assetsp-moreBar{ margin:10px 0; display:flex; justify-content:center; }
.assetsp-moreBtn{
  border:1px solid rgba(0,0,0,.12);
  background:#fff;
  padding:6px 11px;
  border-radius:12px;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  font-weight:500;
  display:flex;
  align-items:center;
  gap:10px;
}
.assetsp-moreBtn:active{ transform:scale(.99); }

/* dark theme friendly (optional, remove if you don't want) */
html[data-theme="dark"]
  .assetsp-moreBtn{ background:#0b1220; border-color:rgba(255,255,255,.12); color:#e5e7eb; }
  
.assetsp-sub{
  gap: 4px;
  font-size: 10px;
}  

.arlxTrustItem { font-size:13px; }

.arlxStepItem{
font-size:13px;
color:var(--text);
position:relative;
}