/* CyberYule Dream Purple Glass UI */
:root{
  --cy-bg-1:#f7f1ff;
  --cy-bg-2:#efe6ff;
  --cy-purple:#7B61FF;
  --cy-purple-2:#A88BFF;
  --cy-pink:#FF8FD8;
  --cy-text:#2d2550;
  --cy-muted:#7f73a8;
  --cy-glass:rgba(255,255,255,.58);
  --cy-border:rgba(123,97,255,.28);
  --cy-shadow:0 24px 70px rgba(123,97,255,.22);
}

*{box-sizing:border-box}

body{
  color:var(--cy-text)!important;
  background:
    radial-gradient(circle at 8% 8%, rgba(255,143,216,.38), transparent 28%),
    radial-gradient(circle at 88% 12%, rgba(123,97,255,.32), transparent 30%),
    radial-gradient(circle at 50% 92%, rgba(168,139,255,.30), transparent 35%),
    linear-gradient(135deg,#fff 0%,var(--cy-bg-1) 42%,var(--cy-bg-2) 100%)!important;
  font-family:"Inter","Microsoft YaHei",Arial,sans-serif!important;
  min-height:100vh;
}

body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background-image:
    radial-gradient(circle,rgba(255,255,255,.9) 0 1px,transparent 1.5px),
    linear-gradient(120deg,rgba(255,255,255,.24),transparent 45%,rgba(255,255,255,.22));
  background-size:42px 42px,100% 100%;
  opacity:.45;
}

a{color:var(--cy-purple)!important;text-decoration:none!important}

nav,.nav,.sidebar,aside,.menu,
[class*="sidebar"],[class*="nav"]{
  background:rgba(255,255,255,.56)!important;
  border:1px solid rgba(255,255,255,.68)!important;
  box-shadow:0 18px 48px rgba(123,97,255,.18)!important;
  backdrop-filter:blur(18px)!important;
  border-radius:26px!important;
}

nav a,.nav a,.sidebar a,aside a,.menu a{
  border-radius:18px!important;
  padding:12px 16px!important;
  color:#53457d!important;
  transition:.22s ease!important;
}

nav a:hover,.nav a:hover,.sidebar a:hover,aside a:hover,.menu a:hover,
nav a.active,.nav a.active,.sidebar a.active,aside a.active,.menu a.active{
  color:#fff!important;
  background:linear-gradient(135deg,var(--cy-purple),var(--cy-purple-2),var(--cy-pink))!important;
  box-shadow:0 0 24px rgba(123,97,255,.42)!important;
  transform:translateY(-1px);
}

main,.main,.content,.container,.wrap{
  padding:28px!important;
}

h1{
  font-size:clamp(34px,4vw,56px)!important;
  line-height:1.05!important;
  letter-spacing:-.05em!important;
  background:linear-gradient(90deg,#7B61FF,#A88BFF,#FF8FD8)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  color:transparent!important;
}

h2,h3{
  color:#32245f!important;
  letter-spacing:-.03em!important;
}

.box,.card,.panel,section,form,
.cards-hero,.wallet-card,.heart-card,.rank-card,.gift-card,.play-card{
  background:var(--cy-glass)!important;
  border:1px solid rgba(255,255,255,.72)!important;
  box-shadow:var(--cy-shadow), inset 0 1px 0 rgba(255,255,255,.72)!important;
  backdrop-filter:blur(18px)!important;
  border-radius:30px!important;
}

.cards-hero,.hero{
  position:relative;
  overflow:hidden;
  padding:34px!important;
  background:
    radial-gradient(circle at 15% 20%,rgba(255,143,216,.34),transparent 32%),
    linear-gradient(135deg,rgba(255,255,255,.75),rgba(239,230,255,.58))!important;
}

.cards-hero:after,.hero:after{
  content:"";
  position:absolute;
  width:220px;
  height:220px;
  right:-70px;
  top:-80px;
  background:radial-gradient(circle,rgba(123,97,255,.32),transparent 68%);
  filter:blur(2px);
}

.play-card,.gift-card,.rank-card,.wallet-card,.heart-card{
  position:relative;
  overflow:hidden;
  transition:transform .24s ease, box-shadow .24s ease, border-color .24s ease!important;
}

.play-card:hover,.gift-card:hover,.rank-card:hover,.wallet-card:hover,.heart-card:hover{
  transform:translateY(-7px)!important;
  border-color:rgba(168,139,255,.72)!important;
  box-shadow:0 28px 86px rgba(123,97,255,.32),0 0 34px rgba(255,143,216,.20)!important;
}

.play-card:before,.gift-card:before,.rank-card:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(135deg,rgba(255,255,255,.42),transparent 42%,rgba(168,139,255,.16));
  opacity:.9;
}

img{
  border-radius:22px!important;
}

.play-card img,.gift-card img,.rank-card img,.avatar{
  object-fit:cover!important;
  box-shadow:0 16px 38px rgba(123,97,255,.20)!important;
}

.gender,.tag,.badge,[class*="tag"],[class*="badge"]{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  border-radius:999px!important;
  padding:7px 13px!important;
  color:#fff!important;
  background:linear-gradient(135deg,var(--cy-purple),var(--cy-pink))!important;
  box-shadow:0 0 18px rgba(255,143,216,.36)!important;
  border:1px solid rgba(255,255,255,.55)!important;
}

.price,.amount,.balance,[class*="price"],[class*="amount"],[class*="balance"]{
  color:#7B61FF!important;
  font-weight:900!important;
  text-shadow:0 0 18px rgba(168,139,255,.35)!important;
}

button,.btn,.button,input[type="submit"],input[type="button"]{
  border:0!important;
  border-radius:999px!important;
  padding:12px 22px!important;
  color:#fff!important;
  font-weight:800!important;
  background:linear-gradient(135deg,var(--cy-purple),var(--cy-purple-2),var(--cy-pink))!important;
  box-shadow:0 12px 28px rgba(123,97,255,.30),0 0 20px rgba(255,143,216,.22)!important;
  cursor:pointer!important;
  transition:.22s ease!important;
}

button:hover,.btn:hover,.button:hover,input[type="submit"]:hover,input[type="button"]:hover{
  filter:brightness(1.08)!important;
  transform:translateY(-2px)!important;
  box-shadow:0 18px 42px rgba(123,97,255,.42),0 0 30px rgba(255,143,216,.30)!important;
}

input,select,textarea{
  border-radius:18px!important;
  border:1px solid rgba(123,97,255,.22)!important;
  background:rgba(255,255,255,.68)!important;
  color:var(--cy-text)!important;
  padding:12px 14px!important;
  outline:none!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8)!important;
}

input:focus,select:focus,textarea:focus{
  border-color:rgba(123,97,255,.68)!important;
  box-shadow:0 0 0 4px rgba(123,97,255,.13)!important;
}

table{
  border-collapse:separate!important;
  border-spacing:0 12px!important;
}

th{
  color:#7d6faa!important;
  font-weight:800!important;
}

td{
  background:rgba(255,255,255,.46)!important;
  border-top:1px solid rgba(255,255,255,.65)!important;
  border-bottom:1px solid rgba(123,97,255,.10)!important;
}

tr td:first-child{border-radius:18px 0 0 18px!important}
tr td:last-child{border-radius:0 18px 18px 0!important}

.small,p{
  color:var(--cy-muted)!important;
}

@media(max-width:760px){
  main,.main,.content,.container,.wrap{padding:16px!important}
  .box,.card,.panel,section,form,.play-card,.gift-card,.rank-card{border-radius:22px!important}
}

/* Safe Wallet UI Upgrade */
body:has(h1)::after{
  content:"";
  position:fixed;
  right:6%;
  bottom:8%;
  width:280px;
  height:280px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,143,216,.28),transparent 68%);
  pointer-events:none;
  z-index:-1;
}

.wallet-grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr))!important;
  gap:28px!important;
  margin:28px 0!important;
}

.wallet-card{
  min-height:150px!important;
  padding:28px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-between!important;
}

.wallet-card p{
  font-size:15px!important;
  font-weight:800!important;
  color:#7c6aa8!important;
}

.wallet-card b{
  font-size:34px!important;
  line-height:1.1!important;
  background:linear-gradient(90deg,#7B61FF,#FF8FD8)!important;
  -webkit-background-clip:text!important;
  color:transparent!important;
}

.wallet-card:nth-child(1)::before{content:"💰";font-size:34px}
.wallet-card:nth-child(2)::before{content:"💎";font-size:34px}
.wallet-card:nth-child(3)::before{content:"🔥";font-size:34px}
.wallet-card:nth-child(4)::before{content:"🎁";font-size:34px}

.heart-card{
  padding:24px!important;
}

.heart-card b{
  font-size:28px!important;
  background:linear-gradient(90deg,#7B61FF,#FF8FD8)!important;
  -webkit-background-clip:text!important;
  color:transparent!important;
}

table{
  width:100%!important;
}

.box:has(table){
  padding:28px!important;
}

.box h2{
  margin-bottom:18px!important;
}

@media(max-width:720px){
  .wallet-card b{font-size:28px!important}
  .wallet-grid{gap:18px!important}
}

/* Safe Rankings UI Upgrade */
.rank-card{
  padding:26px!important;
  display:flex!important;
  align-items:center!important;
  gap:20px!important;
  min-height:120px!important;
}

.rank-card .avatar{
  width:82px!important;
  height:82px!important;
  border-radius:26px!important;
  border:2px solid rgba(255,255,255,.75)!important;
  box-shadow:0 0 28px rgba(123,97,255,.28)!important;
}

.rank-card b,
.rank-card h3{
  font-size:24px!important;
  background:linear-gradient(90deg,#7B61FF,#FF8FD8)!important;
  -webkit-background-clip:text!important;
  color:transparent!important;
}

.rank-card.top{
  background:
    radial-gradient(circle at 12% 18%,rgba(255,224,138,.36),transparent 34%),
    rgba(255,255,255,.62)!important;
  border-color:rgba(255,214,112,.65)!important;
  box-shadow:0 26px 80px rgba(255,184,76,.24),0 0 32px rgba(123,97,255,.20)!important;
}

.rank-card.top::after{
  content:"👑";
  position:absolute;
  right:22px;
  top:18px;
  font-size:34px;
  filter:drop-shadow(0 0 12px rgba(255,214,112,.8));
}

.rank-card:nth-of-type(1)::before{
  content:"TOP 1";
}
.rank-card:nth-of-type(2)::before{
  content:"TOP 2";
}
.rank-card:nth-of-type(3)::before{
  content:"TOP 3";
}

.rank-card::before{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:58px;
  height:30px;
  padding:0 12px;
  border-radius:999px;
  color:#fff;
  font-weight:900;
  background:linear-gradient(135deg,#7B61FF,#FF8FD8);
  box-shadow:0 0 22px rgba(123,97,255,.35);
}

@media(max-width:720px){
  .rank-card{
    align-items:flex-start!important;
    flex-direction:column!important;
  }
}

/* Safe Gift Wall UI Upgrade */
.gift-card{
  padding:24px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  text-align:center!important;
  gap:12px!important;
  min-height:260px!important;
  position:relative;
}

.gift-card img{
  width:90px!important;
  height:90px!important;
  object-fit:contain!important;
  filter:drop-shadow(0 0 18px rgba(123,97,255,.3));
}

.gift-card b{
  font-size:20px!important;
  background:linear-gradient(90deg,#7B61FF,#FF8FD8)!important;
  -webkit-background-clip:text!important;
  color:transparent!important;
}

.gift-card .price{
  font-size:18px!important;
  font-weight:900!important;
  color:#ff6edc!important;
}

.gift-card:hover{
  transform:translateY(-10px) scale(1.03)!important;
  box-shadow:0 30px 90px rgba(123,97,255,.35),0 0 40px rgba(255,143,216,.25)!important;
}

.gift-card::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:30px;
  background:linear-gradient(135deg,rgba(255,255,255,.4),transparent);
  pointer-events:none;
}

.gift-card::after{
  content:"✨";
  position:absolute;
  top:12px;
  right:14px;
  font-size:18px;
  opacity:.6;
}

/* grid spacing */
.gifts-grid,
[class*="gift"]{
  gap:28px!important;
}

/* broadcast highlight */
.gift-card.broadcast{
  border:2px solid rgba(255,215,120,.6)!important;
  box-shadow:0 0 30px rgba(255,215,120,.4)!important;
}

/* mobile */
@media(max-width:720px){
  .gift-card{
    min-height:220px!important;
  }
  .gift-card img{
    width:70px!important;
    height:70px!important;
  }
}


/* Ultimate Companion Cards UI */
.cards-grid,
.play-grid,
[class*="cards"]{
  gap:32px!important;
}

.play-card{
  padding:0!important;
  min-height:420px!important;
  display:flex!important;
  flex-direction:column!important;
  border-radius:34px!important;
}

.play-card img{
  width:100%!important;
  height:260px!important;
  object-fit:cover!important;
  border-radius:34px 34px 24px 24px!important;
  border-bottom:1px solid rgba(255,255,255,.7)!important;
}

.play-card > div:not(:first-child){
  padding:20px 24px!important;
}

.play-card h2,
.play-card h3,
.play-card b{
  font-size:24px!important;
  background:linear-gradient(90deg,#7B61FF,#FF8FD8)!important;
  -webkit-background-clip:text!important;
  color:transparent!important;
}

.play-card .gender{
  position:absolute!important;
  top:18px!important;
  left:18px!important;
  z-index:2!important;
  backdrop-filter:blur(12px)!important;
}

.play-card .price,
.play-card [class*="price"]{
  font-size:22px!important;
  font-weight:900!important;
  color:#ff6edc!important;
}

.play-card p{
  line-height:1.7!important;
}

.play-card .btn,
.play-card button,
.play-card a[href*="order"],
.play-card a[href*="contact"]{
  width:100%!important;
  justify-content:center!important;
  margin-top:12px!important;
}

.play-card:hover img{
  filter:saturate(1.1) brightness(1.05)!important;
}

.play-card::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:34px;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(255,255,255,.15),transparent 35%),
    radial-gradient(circle at 50% 0%,rgba(255,143,216,.22),transparent 45%);
}

.play-card:hover::after{
  background:
    linear-gradient(180deg,rgba(255,255,255,.24),transparent 38%),
    radial-gradient(circle at 50% 0%,rgba(123,97,255,.32),transparent 48%);
}

.cards-hero{
  margin-bottom:34px!important;
}

.cards-hero h1::after{
  content:" ✦";
  color:#FF8FD8;
}

@media(max-width:720px){
  .play-card{
    min-height:auto!important;
  }
  .play-card img{
    height:220px!important;
  }
}

/* 首页梦幻插画替换 */
.cyber-illustration{
  margin:36px auto 0!important;
  max-width:980px!important;
}

.cyber-art-card{
  position:relative;
  min-height:430px;
  overflow:hidden;
  border-radius:38px;
  padding:34px;
  background:
    radial-gradient(circle at 20% 18%,rgba(255,143,216,.45),transparent 28%),
    radial-gradient(circle at 76% 20%,rgba(123,97,255,.42),transparent 32%),
    linear-gradient(135deg,rgba(255,255,255,.72),rgba(238,226,255,.58));
  border:1px solid rgba(255,255,255,.72);
  box-shadow:0 30px 90px rgba(123,97,255,.28), inset 0 1px 0 rgba(255,255,255,.8);
  backdrop-filter:blur(18px);
}

.cyber-art-card h2{
  position:absolute;
  left:36px;
  bottom:76px;
  font-size:42px!important;
  background:linear-gradient(90deg,#7B61FF,#FF8FD8);
  -webkit-background-clip:text;
  color:transparent!important;
}

.cyber-art-card p{
  position:absolute;
  left:38px;
  bottom:42px;
  font-size:17px!important;
  color:#7666a4!important;
}

.moon{
  position:absolute;
  right:72px;
  top:52px;
  width:118px;
  height:118px;
  border-radius:50%;
  background:radial-gradient(circle at 35% 35%,#fff,#ffe8ff 48%,#bda8ff);
  box-shadow:0 0 60px rgba(255,143,216,.5);
}

.stars{
  position:absolute;
  inset:0;
  background-image:
    radial-gradient(circle,#fff 0 2px,transparent 3px),
    radial-gradient(circle,#fff 0 1px,transparent 2px);
  background-size:80px 80px,46px 46px;
  opacity:.7;
}

.girl{
  position:absolute;
  right:210px;
  bottom:38px;
  width:220px;
  height:300px;
  border-radius:110px 110px 42px 42px;
  background:
    radial-gradient(circle at 50% 28%,#ffe7f6 0 34px,transparent 35px),
    radial-gradient(circle at 38% 19%,#7B61FF 0 30px,transparent 31px),
    radial-gradient(circle at 62% 19%,#A88BFF 0 30px,transparent 31px),
    linear-gradient(180deg,#8d6cff,#ff8fd8);
  box-shadow:0 0 55px rgba(123,97,255,.38);
}

.girl:before{
  content:"";
  position:absolute;
  left:58px;
  top:85px;
  width:104px;
  height:132px;
  border-radius:52px 52px 28px 28px;
  background:linear-gradient(180deg,#fff,#f4eaff);
  box-shadow:inset 0 -20px 30px rgba(168,139,255,.2);
}

.girl:after{
  content:"";
  position:absolute;
  left:80px;
  top:52px;
  width:60px;
  height:18px;
  border-radius:999px;
  background:#6546db;
  box-shadow:0 22px 0 #6546db;
}

.gamepad{
  position:absolute;
  right:72px;
  bottom:84px;
  width:112px;
  height:112px;
  border-radius:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:54px;
  background:rgba(255,255,255,.66);
  border:1px solid rgba(255,255,255,.8);
  box-shadow:0 22px 55px rgba(123,97,255,.25);
  backdrop-filter:blur(14px);
}

.spark{
  position:absolute;
  color:#ff8fd8;
  font-size:34px;
  filter:drop-shadow(0 0 12px rgba(255,143,216,.8));
}

.s1{left:13%;top:18%}
.s2{right:31%;top:16%}
.s3{right:18%;bottom:34%}

@media(max-width:760px){
  .cyber-art-card{min-height:360px}
  .girl{right:70px;transform:scale(.72);transform-origin:bottom right}
  .gamepad{right:26px;bottom:42px;transform:scale(.78)}
  .cyber-art-card h2{font-size:30px!important}
}

/* 首页高级滑动展示 */
.cyber-slider{
  max-width:1100px;
  margin:38px auto 0;
  overflow:hidden;
  border-radius:38px;
  border:1px solid rgba(255,255,255,.72);
  background:rgba(255,255,255,.45);
  box-shadow:0 30px 90px rgba(123,97,255,.24);
  backdrop-filter:blur(18px);
}

.cyber-track{
  display:flex;
  width:300%;
  animation:cyberSlide 13s infinite;
}

.cyber-slide{
  width:33.333%;
  min-height:420px;
  position:relative;
  padding:40px;
  overflow:hidden;
  background:
    radial-gradient(circle at 20% 20%,rgba(255,143,216,.35),transparent 28%),
    radial-gradient(circle at 80% 18%,rgba(123,97,255,.35),transparent 30%),
    linear-gradient(135deg,rgba(255,255,255,.72),rgba(238,226,255,.55));
}

.cyber-slide h2{
  position:absolute;
  left:44px;
  bottom:82px;
  font-size:44px!important;
  background:linear-gradient(90deg,#7B61FF,#FF8FD8);
  -webkit-background-clip:text;
  color:transparent!important;
}

.cyber-slide p{
  position:absolute;
  left:46px;
  bottom:46px;
  max-width:520px;
  font-size:17px!important;
}

.slide-art{
  position:absolute;
  right:80px;
  top:54px;
  width:330px;
  height:290px;
  border-radius:42px;
  box-shadow:0 28px 70px rgba(123,97,255,.25);
}

.art-a{
  background:
    radial-gradient(circle at 48% 28%,#ffe8f8 0 38px,transparent 40px),
    radial-gradient(circle at 33% 18%,#7B61FF 0 40px,transparent 42px),
    radial-gradient(circle at 63% 18%,#A88BFF 0 40px,transparent 42px),
    linear-gradient(135deg,#fff,#ffd7f1,#d9ccff);
}

.art-b{
  background:
    radial-gradient(circle at 30% 36%,#fff 0 34px,transparent 36px),
    radial-gradient(circle at 68% 36%,#fff 0 34px,transparent 36px),
    linear-gradient(135deg,#8e72ff,#ff8fd8);
}

.art-c{
  background:
    radial-gradient(circle at 50% 42%,#fff6c9 0 58px,transparent 60px),
    radial-gradient(circle at 32% 28%,#ff8fd8 0 30px,transparent 32px),
    radial-gradient(circle at 70% 30%,#7B61FF 0 36px,transparent 38px),
    linear-gradient(135deg,#fff,#eee6ff);
}

@keyframes cyberSlide{
  0%,28%{transform:translateX(0)}
  34%,62%{transform:translateX(-33.333%)}
  68%,94%{transform:translateX(-66.666%)}
  100%{transform:translateX(0)}
}

@media(max-width:760px){
  .cyber-slide{min-height:360px;padding:24px}
  .slide-art{right:22px;top:32px;width:220px;height:190px}
  .cyber-slide h2{left:24px;bottom:78px;font-size:30px!important}
  .cyber-slide p{left:25px;bottom:38px;font-size:14px!important}
}

/* ===== 名片大图弹窗 ===== */
#imgPreview{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  z-index:9999;
}

#imgPreview.show{
  display:flex;
}

#imgPreview .img-mask{
  position:absolute;
  inset:0;
  background:rgba(20,10,40,0.75);
  backdrop-filter:blur(12px);
}

#imgPreview .img-box{
  position:relative;
  max-width:80%;
  max-height:80%;
  border-radius:20px;
  box-shadow:
    0 0 40px rgba(168,139,255,0.8),
    0 0 80px rgba(123,97,255,0.4);
  animation:zoomIn .25s ease;
}

@keyframes zoomIn{
  from{transform:scale(.8);opacity:0}
  to{transform:scale(1);opacity:1}
}

.view-card-btn{
  border:0!important;
  border-radius:999px!important;
  padding:10px 18px!important;
  color:#fff!important;
  font-weight:900!important;
  background:linear-gradient(135deg,#7B61FF,#FF8FD8)!important;
  box-shadow:0 0 22px rgba(123,97,255,.36)!important;
  cursor:pointer!important;
}

#cardImagePreview{
  position:fixed;
  inset:0;
  z-index:99999;
  display:flex;
  align-items:center;
  justify-content:center;
}

.card-preview-mask{
  position:absolute;
  inset:0;
  background:rgba(24,10,46,.76);
  backdrop-filter:blur(14px);
}

.card-preview-img{
  position:relative;
  max-width:86vw;
  max-height:86vh;
  border-radius:28px!important;
  box-shadow:0 0 45px rgba(123,97,255,.75),0 0 100px rgba(255,143,216,.35)!important;
  animation:cardPreviewZoom .22s ease;
}

@keyframes cardPreviewZoom{
  from{transform:scale(.86);opacity:0}
  to{transform:scale(1);opacity:1}
}

/* ===== 缩小查看名片按钮 ===== */
.view-card-btn{
  padding:4px 10px !important;
  font-size:12px !important;
  border-radius:12px !important;
  line-height:1 !important;
  white-space:nowrap;
  box-shadow:0 0 10px rgba(123,97,255,.3)!important;
}

/* 底部一行排版优化 */
.play-card .bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.play-card .bottom b{
  font-size:16px !important;
  white-space:nowrap;
}
.view-card-btn{
  padding:3px 8px !important;
  font-size:11px !important;
  border-radius:999px !important;
  line-height:1 !important;
  white-space:nowrap;
}