/* =========================================================
   DREMART SOLANA WALLET — ANIME / SOFT WEB3 THEME
   Drop-in replacement for app.css
   ========================================================= */

:root{
  color-scheme:light;

  --bg:#f8f7ff;
  --bg-2:#eef9ff;
  --surface:rgba(255,255,255,.80);
  --surface-strong:rgba(255,255,255,.94);
  --surface-soft:#faf7ff;

  --text:#202044;
  --text-strong:#121332;
  --muted:#6f7195;

  --purple:#8b5cf6;
  --purple-2:#a855f7;
  --violet:#6d5dfc;
  --cyan:#30c9d5;
  --mint:#21d3a7;
  --pink:#f09adf;

  --line:#e8def7;
  --line-strong:#d9c8f1;

  --shadow:0 24px 70px rgba(92,76,164,.13);
  --shadow-soft:0 12px 34px rgba(92,76,164,.10);

  --radius-xl:32px;
  --radius-lg:24px;
  --radius-md:18px;
  --radius-sm:14px;

  font-family:"Segoe UI",Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
  background:var(--bg);
  color:var(--text);
}

*{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  min-height:100vh;
  color:var(--text);
  overflow-x:hidden;
  background:
    radial-gradient(circle at 8% 0%,rgba(132,196,255,.25) 0,transparent 28%),
    radial-gradient(circle at 98% 16%,rgba(196,157,255,.22) 0,transparent 30%),
    radial-gradient(circle at 50% 100%,rgba(112,230,220,.12) 0,transparent 30%),
    linear-gradient(180deg,#f8fbff 0%,#fbf8ff 48%,#f9fbff 100%);
}

/* floating anime glow */
body::before,
body::after{
  content:"";
  position:fixed;
  z-index:-1;
  width:260px;
  height:260px;
  border-radius:50%;
  filter:blur(22px);
  opacity:.5;
  pointer-events:none;
}

body::before{
  left:-110px;
  top:28vh;
  background:rgba(132,188,255,.18);
}

body::after{
  right:-110px;
  top:56vh;
  background:rgba(198,145,255,.17);
}

::selection{
  background:#d9c9ff;
  color:#26185d;
}

a{
  color:#7657dc;
  text-decoration:none;
}

a:hover{
  color:#5e43c4;
}

/* =========================================================
   GLOBAL LAYOUT
   ========================================================= */

.wrap{
  width:min(1040px,calc(100% - 32px));
  margin:0 auto;
  padding:30px 0 40px;
}

.nav{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  margin-bottom:28px;
}

.page-brand{
  display:inline-flex;
  align-items:center;
  gap:12px;
  color:#6546c7;
  font-weight:850;
  letter-spacing:.02em;
  text-decoration:none;
}

.page-brand img{
  width:44px;
  height:44px;
  padding:4px;
  object-fit:contain;
  border-radius:15px;
  background:#fff;
  border:1px solid rgba(128,100,200,.14);
  box-shadow:0 8px 25px rgba(89,64,163,.12);
}

.page-brand span{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}

.page-brand strong{
  display:block;
  color:#458eb8;
  font-size:1rem;
  font-weight:800;
  line-height:1.2;
}

.page-brand small{
  display:block;
  color:#66558C;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.04em;
  line-height:1.25;
  text-transform:uppercase;
}

.page-brand:hover strong{
  color:#7657DC;
}

.page-brand:hover small{
  color:#66558C;
}

.card{
  position:relative;
  overflow:hidden;
  padding:26px;
  color:var(--text);
  border:1px solid rgba(211,198,238,.82);
  border-radius:var(--radius-lg);
  background:
    linear-gradient(135deg,rgba(255,255,255,.94),rgba(252,250,255,.88));
  box-shadow:var(--shadow);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

.card::before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.98),transparent);
  pointer-events:none;
}

.hero{
  max-width:780px;
  min-height:410px;
  margin:7vh auto;
  padding:42px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  background-image:
    linear-gradient(92deg,rgba(255,255,255,.98) 2%,rgba(255,255,255,.91) 45%,rgba(255,255,255,.46) 72%,rgba(255,255,255,.08) 100%),
    url("/assets/wallet-anime.png");
  background-repeat:no-repeat;
  background-position:center,right center;
  background-size:cover;
}

.hero::after{
  content:"✦";
  position:absolute;
  right:30px;
  top:24px;
  color:#c6a8ff;
  font-size:28px;
  text-shadow:
    -55px 42px 0 #ccecff,
    -18px 94px 0 #eadcff;
  opacity:.85;
  pointer-events:none;
}

.grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:18px;
}

.topspace{
  margin-top:18px;
}

/* =========================================================
   TYPOGRAPHY
   ========================================================= */

h1,h2,h3{
  color:var(--text-strong);
}

h1{
  letter-spacing:-.035em;
}

h2{
  letter-spacing:-.02em;
}

.muted{
  color:var(--muted);
}

.metric{
  margin:5px 0;
  color:#12122f;
  font-size:clamp(1.8rem,4vw,3rem);
  font-weight:900;
  letter-spacing:-.04em;
}

/* =========================================================
   FORM ELEMENTS
   ========================================================= */

.field{
  margin:0 0 16px;
}

label{
  display:block;
  margin-bottom:7px;
  color:#676b91;
  font-size:.86rem;
  font-weight:700;
}

input,
select,
textarea{
  width:100%;
  min-height:48px;
  padding:13px 14px;
  color:#26254d;
  font:inherit;
  outline:none;
  border:1px solid #ded5ed;
  border-radius:14px;
  background:rgba(255,255,255,.88);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
  transition:.2s ease;
}

input:focus,
select:focus,
textarea:focus{
  border-color:#a989ee;
  box-shadow:
    0 0 0 4px rgba(139,92,246,.10),
    0 10px 25px rgba(116,87,188,.08);
}

button,
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:46px;
  padding:12px 18px;
  cursor:pointer;

  color:#fff;
  font:inherit;
  font-weight:850;
  text-decoration:none;

  border:1px solid #55ddbd;
  border-radius:14px;
  background:#16c79a;

  /* NO OUTER BLUR */
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.45);

  text-shadow:none;

  transition:
    transform .18s ease,
    filter .18s ease;
}

button:hover,
.button:hover{
  color:#fff;
  background:#16c79a;
  border-color:#55ddbd;

  transform:translateY(-1px);
  filter:brightness(1.04);

  /* NO OUTER BLUR */
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.5);
}

button:active,
.button:active{
  transform:translateY(0);
  filter:brightness(.97);
}

/* Green button: same style, one color only */
/* Secondary buttons - green */
.secondary{
  color:#fff;
  border-color:#55ddbd;
  background-color:#16c79a;
  background-image:none;

  box-shadow:
    0 8px 18px rgba(22,199,154,.26),
    inset 0 1px 1px rgba(255,255,255,.45);
}

.secondary:hover{
  color:#fff;
  border-color:#6be4c6;
  background-color:#16c79a;
  background-image:none;
  filter:brightness(1.06);

  box-shadow:
    0 11px 22px rgba(22,199,154,.32),
    inset 0 1px 1px rgba(255,255,255,.5);
}


/* Owner Login / page-link - violet */
.page-link{
  color:#fff;
  border-color:#a98aff;
  background-color:#8057e8;
  background-image:none;

  box-shadow:
    0 8px 18px rgba(128,87,232,.25),
    inset 0 1px 1px rgba(255,255,255,.45);

  text-shadow:0 1px 2px rgba(65,35,130,.18);
}

.page-link:hover{
  color:#fff;
  border-color:#b99dff;
  background-color:#8057e8;
  background-image:none;
  filter:brightness(1.06);

  box-shadow:
    0 11px 22px rgba(128,87,232,.32),
    inset 0 1px 1px rgba(255,255,255,.5);
}

/* Pink / danger button: same style, one color only */
.danger{
  color:#fff;
  border-color:rgba(255,255,255,.44);
  background-color:#ed5b90;
  background-image:none;
  box-shadow:
    0 8px 18px rgba(237,91,144,.26),
    inset 0 2px 1px rgba(255,255,255,.38),
    inset 0 -2px 3px rgba(160,42,86,.15);
}

/* =========================================================
   NOTICES / STATUS
   ========================================================= */

.notice{
  margin:14px 0;
  padding:13px 15px;
  color:#4d5278;
  border:1px solid #d4e3f3;
  border-radius:14px;
  background:linear-gradient(135deg,#f6fbff,#f9f7ff);
}

.error{
  color:#8a3551;
  border-color:#f1c5d2;
  background:#fff4f7;
}

.status{
  display:inline-block;
  padding:6px 11px;
  color:#614493;
  font-size:.8rem;
  font-weight:800;
  border:1px solid #d9cbed;
  border-radius:999px;
  background:#f1ebff;
}

.actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:18px;
}

/* =========================================================
   TABLES / SECRETS
   ========================================================= */

table{
  width:100%;
  border-collapse:collapse;
}

th,
td{
  padding:12px 8px;
  text-align:left;
  font-size:.9rem;
  border-bottom:1px solid #ebe4f4;
}

th{
  color:#55557a;
}

.secret{
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
  word-break:break-all;
}

/* =========================================================
   WALLET HOME
   ========================================================= */

.wallet-home{
  max-width:980px;
  margin:3vh auto;
}

.wallet-hero{
  padding:10px 4px 28px;
  text-align:center;
}

.wallet-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:8px 13px;
  color:#7454b5;
  font-size:.75rem;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  border:1px solid #d8c8f3;
  border-radius:999px;
  background:
    linear-gradient(135deg,rgba(247,241,255,.95),rgba(239,253,255,.92));
  box-shadow:0 8px 24px rgba(117,84,181,.08);
}

.wallet-eyebrow::before{
  content:"✦";
  color:#8a66df;
}

.wallet-hero h1{
  max-width:780px;
  margin:18px auto 12px;
  color:#191936;
  font-size:clamp(2rem,5vw,3.45rem);
  line-height:1.03;
  text-shadow:0 2px 0 #fff;
}

.wallet-lead{
  max-width:720px;
  margin:0 auto;
  color:#6e7194;
  font-size:1.04rem;
  line-height:1.7;
}

.wallet-chips{
  display:flex;
  justify-content:center;
  gap:9px;
  flex-wrap:wrap;
  margin-top:22px;
}

.wallet-chip{
  padding:8px 12px;
  color:#595c80;
  font-size:.82rem;
  font-weight:800;
  border:1px solid #dfd8ef;
  border-radius:999px;
  background:rgba(255,255,255,.76);
  box-shadow:0 6px 18px rgba(93,76,144,.06);
}

.benefit-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:13px;
  margin:8px 0 28px;
}

.benefit{
  position:relative;
  overflow:hidden;
  min-height:174px;
  padding:19px;
  color:var(--text);
  border:1px solid #e5dbf2;
  border-radius:20px;
  background:
    linear-gradient(145deg,rgba(252,247,255,.98),rgba(241,252,253,.95));
  box-shadow:0 12px 30px rgba(90,72,150,.07);
}

.benefit::after{
  content:"";
  position:absolute;
  width:80px;
  height:80px;
  right:-34px;
  bottom:-34px;
  border-radius:50%;
  background:rgba(167,124,255,.10);
}

.benefit-icon{
  display:grid;
  width:40px;
  height:40px;
  place-items:center;
  margin-bottom:15px;
  color:#fff;
  font-weight:900;
  border-radius:13px;
  background:linear-gradient(135deg,#9c63ff,#6d62ed 58%,#38cbd0);
  box-shadow:0 10px 24px rgba(119,83,217,.18);
}

.benefit h3{
  margin:0 0 8px;
  color:#262344;
  font-size:1rem;
}

.benefit p{
  margin:0;
  color:#727796;
  font-size:.87rem;
  line-height:1.55;
}

/* =========================================================
   ACCESS / LOGIN PANELS
   ========================================================= */

.access-panel{
  position:relative;
  overflow:hidden;
  padding:26px;
  color:var(--text);
  border:1px solid #e4d9f2;
  border-radius:24px;
  background:
    linear-gradient(145deg,rgba(255,255,255,.96),rgba(249,246,255,.92));
  box-shadow:var(--shadow-soft);
}

.access-panel::before{
  content:"";
  position:absolute;
  width:150px;
  height:150px;
  top:-85px;
  right:-65px;
  border-radius:50%;
  background:rgba(143,99,246,.10);
  pointer-events:none;
}

.access-heading{
  margin-bottom:22px;
  text-align:center;
}

.access-heading h2{
  margin:0 0 7px;
}

.access-heading p{
  margin:0;
  color:#777b9d;
}

.access-panel form h2{
  font-size:1.2rem;
}

.access-panel form button{
  width:100%;
}

.safety-note{
  margin:22px 0 0;
  padding:13px 15px;
  color:#347867;
  text-align:center;
  font-size:.84rem;
  line-height:1.5;
  border:1px solid #c9eadf;
  border-radius:14px;
  background:linear-gradient(135deg,#f2fff9,#f2fbff);
}

/* =========================================================
   SOLANA LOGO / PAYMENT BOX
   ========================================================= */

.solana-hero-logo{
  display:block;
  width:82px;
  height:82px;
  object-fit:contain;
  margin:0 auto 14px;
  filter:
    drop-shadow(0 12px 24px rgba(127,77,220,.18))
    drop-shadow(0 0 18px rgba(51,205,205,.11));
}

.sol-payment-box{
  margin:20px 0;
  padding:19px;
  color:#292747;
  border:1px solid #ddd4ee;
  border-radius:18px;
  background:
    linear-gradient(145deg,rgba(250,246,255,.98),rgba(239,252,253,.96));
  box-shadow:0 16px 38px rgba(103,85,155,.09);
}

.sol-payment-label{
  display:block;
  margin-bottom:7px;
  color:#7254b3;
  font-size:.76rem;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.sol-payment-box>strong{
  display:block;
  color:#1d1c3b;
  font-size:1.15rem;
}

.sol-payment-box>small{
  display:block;
  margin-top:6px;
  color:#747796;
}

.sol-address-row{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:16px;
  padding:7px 7px 7px 13px;
  border:1px solid #d8d4e9;
  border-radius:14px;
  background:rgba(255,255,255,.74);
}

.sol-address-row code{
  min-width:0;
  flex:1;
  color:#5a4f88;
  font-size:.85rem;
  line-height:1.55;
  overflow-wrap:anywhere;
}

.sol-copy-button{
  flex:0 0 auto;
  min-height:42px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:0 13px;
  color:#fff;
  cursor:pointer;
  border:1px solid rgba(255,255,255,.34);
  border-radius:11px;
  background-color:#7c4dff;
  background-image:none;
  box-shadow:
    0 8px 16px rgba(124,77,255,.26),
    inset 0 2px 1px rgba(255,255,255,.34),
    inset 0 -3px 5px rgba(72,35,180,.16);
}

.sol-copy-button:hover,
.sol-copy-button.copied{
  color:#fff;
  filter:brightness(1.06);
  transform:translateY(-1px);
  box-shadow:
    0 11px 20px rgba(124,77,255,.32),
    inset 0 2px 1px rgba(255,255,255,.40);
}

.sol-copy-button svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.sol-copy-feedback{
  min-height:18px;
  margin:7px 0 0;
  color:#2b9e7d;
  font-size:.78rem;
  font-weight:800;
}

/* =========================================================
   PLATFORM / EXTRA CARDS
   ========================================================= */

.platform-hero,
.platform-cta,
.sample-sites,
.platform-benefits article,
.process-grid article,
.platform-faq details,
.earning-flow article,
.sample-site-link{
  color:var(--text);
  border-color:#e4daf2;
  background:
    linear-gradient(135deg,rgba(253,249,255,.97),rgba(241,252,253,.93));
  box-shadow:0 12px 32px rgba(95,78,145,.07);
}

/* =========================================================
   FOOTER
   ========================================================= */

.site-footer{
  width:min(1040px,calc(100% - 32px));
  margin:8px auto 0;
  padding:28px 16px 34px;
  color:#7d7f9d;
  text-align:center;
  border-top:1px solid #e5dcef;
}

.footer-network{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  margin-bottom:9px;
  color:#565979;
  font-size:.82rem;
  font-weight:800;
}

.footer-network img{
  width:25px;
  height:25px;
  object-fit:contain;
}

.site-footer p{
  margin:0;
  color:#777b99;
  font-size:.9rem;
}

.site-footer p a,
.site-footer a,
footer a{
  color:#7556b8;
  font-weight:800;
  text-decoration:none;
}

.site-footer p a:hover,
.site-footer a:hover,
footer a:hover{
  color:#6546c7;
  text-decoration:underline;
}

.site-footer small{
  display:block;
  margin-top:7px;
  color:#9a9bb1;
  font-size:.74rem;
}

/* =========================================================
   OPTIONAL DASHBOARD ANIME CLASSES
   Use these if your wallet dashboard HTML has matching blocks.
   ========================================================= */

.anime-shell{
  width:min(880px,calc(100% - 24px));
  margin:28px auto;
  overflow:hidden;
  border:1px solid rgba(218,207,239,.95);
  border-radius:38px;
  background:rgba(255,255,255,.78);
  box-shadow:0 30px 90px rgba(82,70,145,.16);
  backdrop-filter:blur(22px);
  -webkit-backdrop-filter:blur(22px);
}

.anime-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:24px 28px;
  border-bottom:1px solid #e8e0f1;
  background:rgba(255,255,255,.72);
}

.anime-userbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:16px 28px;
  border-bottom:1px solid #ece6f4;
}

.anime-balance-card{
  position:relative;
  min-height:360px;
  margin:28px;
  overflow:hidden;
  display:flex;
  align-items:center;
  padding:38px;
  border:1px solid #dfd2f2;
  border-radius:30px;
  background:
    linear-gradient(90deg,rgba(255,255,255,.99) 5%,rgba(255,255,255,.91) 46%,rgba(255,255,255,.34) 100%),
    url("/assets/wallet-anime.png") right center/cover no-repeat;
  box-shadow:0 18px 46px rgba(95,74,158,.10);
}

.anime-balance-card::after{
  content:"✦";
  position:absolute;
  right:26px;
  top:18px;
  color:#b994ff;
  font-size:26px;
  text-shadow:
    -58px 42px 0 #beeaff,
    -18px 82px 0 #ead9ff;
}

.anime-balance{
  position:relative;
  z-index:1;
}

.anime-balance small{
  display:block;
  margin-bottom:28px;
  color:#666b91;
  font-size:1rem;
  font-weight:800;
}

.anime-balance strong{
  display:block;
  color:#101028;
  font-size:clamp(3rem,8vw,4.6rem);
  font-weight:900;
  letter-spacing:-.055em;
}

.anime-action-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin:0 28px 28px;
  padding:28px;
  border:1px solid #e7def2;
  border-radius:30px;
  background:rgba(255,255,255,.82);
}

.anime-action{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  color:#23213f;
  font-weight:850;
}

.anime-action-icon{
  display:grid;
  width:70px;
  height:70px;
  place-items:center;
  color:#fff;
  font-size:1.45rem;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.42);
  background:#7c4dff;
  box-shadow:
    0 10px 22px rgba(124,77,255,.30),
    inset 0 2px 1px rgba(255,255,255,.42),
    inset 0 -3px 5px rgba(72,35,180,.16);
}

.anime-action:nth-child(2) .anime-action-icon{
  background:#14c89b;
  box-shadow:
    0 10px 22px rgba(20,200,155,.28),
    inset 0 2px 1px rgba(255,255,255,.42),
    inset 0 -3px 5px rgba(0,120,92,.15);
}

.anime-assets{
  margin:0 28px 28px;
  padding:28px;
  border:1px solid #e7def2;
  border-radius:30px;
  background:rgba(255,255,255,.84);
}

.anime-assets-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:18px;
}

.anime-assets-head h2{
  margin:0;
}

.anime-token{
  display:flex;
  align-items:center;
  gap:14px;
  padding:18px;
  border:1px solid #e8e1f0;
  border-radius:22px;
  background:linear-gradient(135deg,#fff,#faf8ff);
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media(max-width:850px){
  .benefit-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .hero{
    min-height:360px;
    background-position:center,right -90px center;
  }
}

@media(max-width:640px){
  .wrap{
    width:min(100% - 20px,1040px);
    padding-top:18px;
  }

  .card{
    padding:18px;
    border-radius:20px;
  }

  .page-brand{
    gap:10px;
  }

  .page-brand img{
    width:40px;
    height:40px;
  }

  .page-brand strong{
    font-size:.95rem;
  }

  .page-brand small{
    font-size:.66rem;
    letter-spacing:.03em;
  }

  .hero{
    min-height:390px;
    margin:3vh auto;
    padding:26px 20px;
    background-image:
      linear-gradient(180deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.92) 58%,rgba(255,255,255,.38) 100%),
      url("/assets/wallet-anime.png");
    background-position:center,bottom right 26%;
  }

  table{
    display:block;
    overflow-x:auto;
  }

  .wallet-home{
    margin-top:2vh;
  }

  .wallet-hero{
    padding-top:4px;
  }

  .benefit-grid{
    grid-template-columns:1fr;
  }

  .benefit{
    min-height:0;
  }

  .access-panel{
    padding:17px;
  }

  .solana-hero-logo{
    width:64px;
    height:64px;
  }

  .site-footer{
    padding-bottom:26px;
  }

  .anime-shell{
    margin:10px auto;
    border-radius:26px;
  }

  .anime-topbar,
  .anime-userbar{
    padding:16px;
  }

  .anime-balance-card{
    min-height:315px;
    margin:16px;
    padding:24px;
    background-image:
      linear-gradient(180deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.88) 55%,rgba(255,255,255,.28) 100%),
      url("/assets/wallet-anime.png");
    background-position:center,bottom right 30%;
  }

  .anime-action-grid{
    gap:10px;
    margin:0 16px 16px;
    padding:18px 12px;
  }

  .anime-action-icon{
    width:58px;
    height:58px;
  }

  .anime-assets{
    margin:0 16px 16px;
    padding:18px;
  }
}

@media(max-width:560px){
  .sol-address-row{
    align-items:stretch;
    flex-direction:column;
    padding:12px;
  }

  .sol-copy-button{
    justify-content:center;
    width:100%;
  }
}

@media(prefers-reduced-motion:reduce){
  *,
  *::before,
  *::after{
    scroll-behavior:auto;
    transition:none;
  }
}


/* CREATE SITE HEADER */
.page-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;

  margin-bottom:34px;
  padding:13px 15px 13px 13px;

  border:1px solid #dfe3f0;
  border-radius:18px;
  background:rgba(255,255,255,.94);
}

.page-brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
}

.page-brand img{
  width:44px;
  height:44px;
  padding:3px;
  border-radius:13px;
  background:#fff;
  object-fit:contain;
}

.page-brand span{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.page-brand strong{
  color:#458eb8;
  font-size:1rem;
  font-weight:800;
}

.page-brand small{
  color:#66558c;
  font-size:.70rem;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
}

/* Owner Login */
.page-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  padding:11px 17px;

  border:1px solid #a98aff;
  border-radius:12px;

  background:#8057e8;
  color:#fff;

  font-weight:800;
  text-decoration:none;

  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.45);
}

.page-link:hover{
  background:#8057e8;
  color:#fff;
  text-decoration:none;
  filter:brightness(1.04);
}

@media(max-width:520px){
  .page-head{
    padding:10px;
  }

  .page-brand img{
    width:38px;
    height:38px;
  }

  .page-brand small{
    display:none;
  }

  .page-link{
    padding:10px 12px;
    font-size:.82rem;
  }
}


/* PRIVACY POLICY — SPACE FROM CARD ABOVE */
/* PRIVACY POLICY FOOTER */
.privacy-footer{
  position:relative !important;

  margin:24px 0 0 !important;
  padding:0 16px 24px !important;

  text-align:center !important;
  font:700 14px/1.5 Inter,"Segoe UI",Arial,sans-serif !important;
}

.privacy-footer > a,
.privacy-footer > a:visited{
  color:#51427f !important;
  text-decoration:none !important;
  border:0 !important;
  border-bottom:0 !important;
}

.privacy-footer > a:hover,
.privacy-footer > a:focus{
  color:#7257c8 !important;
  text-decoration:none !important;
  border:0 !important;
  border-bottom:0 !important;
}

/* MULTI-WALLET ANIME OVERRIDES */

body:has(.mw){
  background:
    radial-gradient(circle at 7% 0%,rgba(112,190,255,.22),transparent 30rem),
    radial-gradient(circle at 96% 10%,rgba(192,143,255,.18),transparent 32rem),
    radial-gradient(circle at 50% 100%,rgba(76,221,202,.10),transparent 28rem),
    linear-gradient(180deg,#f8fbff 0%,#fbf8ff 52%,#f8fcff 100%)!important;
  color:#202044!important;
}
body:has(.mw)::before,
body:has(.mw)::after{display:none!important}

.mw{
  max-width:1180px!important;
  width:min(1180px,calc(100% - 32px))!important;
  margin:0 auto!important;
  padding:22px 0 34px!important;
}

.mw-nav{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:18px!important;
  margin:0 0 26px!important;
  padding:14px 16px!important;
  border:1px solid #dfe3f0!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:0 14px 36px rgba(80,72,145,.10)!important;
  backdrop-filter:blur(16px)!important;
}
.mw-brand{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  color:#202044!important;
  font-weight:900!important;
  text-decoration:none!important;
}
.mw-brand img{
  width:46px!important;
  height:46px!important;
  padding:4px!important;
  border:1px solid #e2d9ef!important;
  border-radius:14px!important;
  background:#fff!important;
  object-fit:contain!important;
  box-shadow:0 8px 20px rgba(87,69,153,.10)!important;
}
.mw-support{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:42px!important;
  padding:0 16px!important;
  border:1px solid #a98aff!important;
  border-radius:12px!important;
  background:#8057e8!important;
  background-image:none!important;
  color:#fff!important;
  font-weight:800!important;
  text-decoration:none!important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.45)!important;
  transition:transform .18s ease,filter .18s ease!important;
}
.mw-support:hover{
  background:#8057e8!important;
  color:#fff!important;
  transform:translateY(-1px)!important;
  filter:brightness(1.04)!important;
}

.mw-hero{
  display:grid!important;
  grid-template-columns:minmax(0,1.02fr) minmax(380px,.98fr)!important;
  gap:48px!important;
  align-items:center!important;
  min-height:600px!important;
  margin:0 0 24px!important;
  padding:54px 46px!important;
  border:1px solid #dfe3f0!important;
  border-radius:30px!important;
  background:
    radial-gradient(circle at 94% 12%,rgba(137,95,246,.12),transparent 28%),
    radial-gradient(circle at 73% 82%,rgba(48,201,213,.10),transparent 32%),
    linear-gradient(135deg,rgba(255,255,255,.98),rgba(249,247,255,.96) 56%,rgba(239,251,255,.96))!important;
  box-shadow:0 24px 60px rgba(80,72,145,.12)!important;
}
.mw-kicker{
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  padding:7px 11px!important;
  border:1px solid #d8c8f3!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,#f8f3ff,#eefcff)!important;
  color:#7254b5!important;
  font-size:.75rem!important;
  font-weight:900!important;
  letter-spacing:.09em!important;
  text-transform:uppercase!important;
}
.mw-kicker:before{
  content:"✦"!important;
  width:auto!important;
  height:auto!important;
  background:none!important;
  color:#8b5cf6!important;
}
.mw-hero h1{
  max-width:680px!important;
  margin:18px 0!important;
  color:#151630!important;
  font-size:clamp(2.75rem,4.8vw,4.7rem)!important;
  line-height:1.02!important;
  letter-spacing:-.05em!important;
  text-shadow:none!important;
}
.mw-lead{
  max-width:640px!important;
  color:#686e91!important;
  font-size:1.06rem!important;
  line-height:1.72!important;
}
.mw-actions{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:12px!important;
  margin-top:28px!important;
}
.mw-actions .button{
  min-height:46px!important;
  padding:0 20px!important;
  border:1px solid #55ddbd!important;
  border-radius:13px!important;
  background:#16c79a!important;
  background-image:none!important;
  color:#fff!important;
  font-weight:850!important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.45)!important;
}
.mw-actions .button.secondary{
  border-color:#a98aff!important;
  background:#8057e8!important;
  background-image:none!important;
}
.mw-actions .button:hover{
  color:#fff!important;
  transform:translateY(-1px)!important;
  filter:brightness(1.04)!important;
}
.mw-trust{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:10px 18px!important;
  margin-top:24px!important;
  color:#666e91!important;
  font-size:.86rem!important;
  font-weight:700!important;
}
.mw-trust span:before{
  content:"✓"!important;
  color:#16a984!important;
  margin-right:7px!important;
  font-weight:900!important;
}

.wallet-visual{position:relative!important;min-height:470px!important}
.glow{
  position:absolute!important;
  inset:7% 2%!important;
  border-radius:46%!important;
  background:radial-gradient(circle,rgba(128,87,232,.17),rgba(48,201,213,.08) 46%,transparent 70%)!important;
  filter:blur(12px)!important;
}
.device{
  position:absolute!important;
  inset:22px 0!important;
  padding:20px!important;
  border:1px solid #ded7ee!important;
  border-radius:28px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(247,245,255,.96))!important;
  color:#202044!important;
  box-shadow:0 26px 60px rgba(83,70,151,.16)!important;
  transform:none!important;
}
.device-top{display:flex!important;justify-content:space-between!important;align-items:center!important;padding:4px 4px 18px!important}
.device-brand{display:flex!important;align-items:center!important;gap:10px!important;color:#242443!important;font-weight:850!important}
.device-brand img{
  width:35px!important;height:35px!important;padding:3px!important;
  border:1px solid #e2d9ef!important;border-radius:10px!important;
  background:#fff!important;object-fit:contain!important;
}
.live{
  padding:7px 10px!important;
  border:1px solid #bfe9dc!important;
  border-radius:999px!important;
  background:#ecfff8!important;
  color:#18866b!important;
  font-size:.72rem!important;
  font-weight:850!important;
}
.balance{
  padding:24px!important;
  border:1px solid #ddd3ef!important;
  border-radius:20px!important;
  background:linear-gradient(135deg,#f5efff,#eefbff)!important;
  color:#202044!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.92)!important;
}
.balance small{color:#737795!important}
.balance strong{display:block!important;margin:8px 0 4px!important;color:#17172f!important;font-size:2.55rem!important}
.coins{display:grid!important;grid-template-columns:1fr 1fr!important;gap:11px!important;margin-top:13px!important}
.coin{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  padding:14px!important;
  border:1px solid #e4ddef!important;
  border-radius:15px!important;
  background:#fff!important;
  color:#2b2a4a!important;
  box-shadow:0 7px 18px rgba(80,72,145,.06)!important;
}
.coin b{color:#262543!important}
.coin small{color:#8285a1!important}
.coin>img,.coin i{width:38px!important;height:38px!important;flex:0 0 38px!important;border-radius:50%!important;object-fit:contain!important}
.quick{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:9px!important;margin-top:13px!important}
.quick span{
  padding:12px 5px!important;
  border:1px solid #e0d7ef!important;
  border-radius:12px!important;
  background:#f8f5ff!important;
  color:#654d9d!important;
  text-align:center!important;
  font-size:.76rem!important;
  font-weight:800!important;
}

.network-marquee{
  position:relative!important;
  overflow:hidden!important;
  margin:26px 0 8px!important;
  padding:15px 0!important;
  border:1px solid #dfe4f0!important;
  border-radius:20px!important;
  background:linear-gradient(90deg,#f4fbff,#faf7ff,#f2fcff)!important;
  box-shadow:0 10px 26px rgba(80,72,145,.07)!important;
  mask-image:none!important;
  -webkit-mask-image:none!important;
}
.network-track{display:flex!important;width:max-content!important}
.network-group{display:flex!important;align-items:center!important;gap:12px!important;padding-right:12px!important}
.network-logo{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  min-width:150px!important;
  padding:10px 14px!important;
  border:1px solid #dfe2ee!important;
  border-radius:14px!important;
  background:#fff!important;
  color:#59617e!important;
  font-size:.84rem!important;
  font-weight:800!important;
  box-shadow:0 7px 18px rgba(80,72,145,.07)!important;
}
.network-logo img{width:32px!important;height:32px!important;object-fit:contain!important}

.section{padding:56px 0!important}
.section-head{max-width:760px!important;margin-bottom:28px!important}
.section h2,.affiliate-video-copy h2,.security h2,.final-card h2{color:#181832!important;letter-spacing:-.035em!important}
.section h2{margin:12px 0!important;font-size:clamp(2rem,4vw,3.3rem)!important}
.section-head p{color:#6c7192!important;line-height:1.7!important}

.steps{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:16px!important}
.steps article{
  position:relative!important;
  overflow:hidden!important;
  padding:26px!important;
  border:1px solid #e4daf2!important;
  border-radius:21px!important;
  background:linear-gradient(145deg,#fff,#faf7ff)!important;
  color:#202044!important;
  box-shadow:0 12px 30px rgba(90,72,150,.08)!important;
}
.steps article:after{
  content:""!important;position:absolute!important;width:90px!important;height:90px!important;
  right:-42px!important;bottom:-42px!important;border-radius:50%!important;background:rgba(128,87,232,.08)!important;
}
.steps b{
  display:grid!important;place-items:center!important;
  width:40px!important;height:40px!important;margin-bottom:18px!important;
  border:1px solid #a98aff!important;border-radius:12px!important;
  background:#8057e8!important;background-image:none!important;color:#fff!important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.45)!important;
}
.steps h3{color:#292746!important}
.steps p{color:#727796!important;line-height:1.65!important}

.features{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:15px!important}
.features article{
  position:relative!important;
  overflow:hidden!important;
  padding:25px!important;
  border:1px solid #e2dcec!important;
  border-radius:21px!important;
  background:linear-gradient(145deg,#fff,#f6fbff)!important;
  color:#202044!important;
  box-shadow:0 12px 30px rgba(80,72,145,.08)!important;
}
.features article:nth-child(even){background:linear-gradient(145deg,#fff,#faf5ff)!important}
.feature-icon{
  display:grid!important;place-items:center!important;
  width:44px!important;height:44px!important;margin-bottom:16px!important;
  border:1px solid #55ddbd!important;border-radius:13px!important;
  background:#16c79a!important;background-image:none!important;
  color:#fff!important;font-size:1.15rem!important;font-weight:900!important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.45)!important;
}
.features article:nth-child(even) .feature-icon{border-color:#a98aff!important;background:#8057e8!important}
.features h3{color:#292746!important}
.features p{color:#727796!important;line-height:1.65!important}

.affiliate-video{
  display:grid!important;
  grid-template-columns:minmax(0,.78fr) minmax(460px,1.22fr)!important;
  gap:34px!important;
  align-items:center!important;
  padding:34px!important;
  border:1px solid #e1d8ee!important;
  border-radius:28px!important;
  background:linear-gradient(145deg,#fff,#f8f5ff 54%,#eefbff)!important;
  color:#202044!important;
  box-shadow:0 20px 50px rgba(80,72,145,.11)!important;
}
.affiliate-video-copy h2{margin:14px 0 16px!important;font-size:clamp(2rem,3.4vw,3.2rem)!important;line-height:1.08!important}
.affiliate-video-copy p{color:#6d7291!important;line-height:1.72!important}
.affiliate-video-points{display:grid!important;gap:10px!important;margin:22px 0 0!important;padding:0!important;list-style:none!important}
.affiliate-video-points li{display:flex!important;gap:9px!important;color:#4f5577!important;font-size:.92rem!important}
.affiliate-video-points li:before{content:"✓"!important;color:#16a984!important;font-weight:900!important}
.affiliate-video-player{
  overflow:hidden!important;
  border:1px solid #ddd5eb!important;
  border-radius:22px!important;
  background:#f5f2fb!important;
  box-shadow:0 16px 38px rgba(72,63,130,.13)!important;
}
.affiliate-video-player video{display:block!important;width:100%!important;height:auto!important;aspect-ratio:283/149!important;background:#101020!important}

.security{
  display:grid!important;
  grid-template-columns:.25fr 1.75fr!important;
  gap:28px!important;
  align-items:center!important;
  padding:34px!important;
  border:1px solid #cce9df!important;
  border-radius:25px!important;
  background:linear-gradient(135deg,#f3fff9,#f5fbff)!important;
  color:#202044!important;
  box-shadow:0 14px 34px rgba(62,121,103,.08)!important;
}
.security-mark{
  display:grid!important;
  place-items:center!important;
  width:92px!important;height:92px!important;
  border:1px solid #9ddbc8!important;border-radius:27px!important;
  background:#eafff7!important;color:#18866b!important;font-size:2.8rem!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
}
.security p{color:#647d76!important;line-height:1.75!important}

.final{padding:54px 0 18px!important}
.final-card{
  text-align:center!important;
  padding:48px 24px!important;
  border:1px solid #dfd5ee!important;
  border-radius:28px!important;
  background:
    radial-gradient(circle at 50% 0,rgba(128,87,232,.12),transparent 45%),
    linear-gradient(145deg,#fff,#f8f4ff 54%,#eefbff)!important;
  color:#202044!important;
  box-shadow:0 20px 50px rgba(80,72,145,.11)!important;
}
.final-card h2{max-width:760px!important;margin:13px auto!important;font-size:clamp(2.1rem,5vw,3.8rem)!important}
.final-card p{max-width:690px!important;margin:0 auto 25px!important;color:#6d7291!important;line-height:1.7!important}
.final-card .button{
  border:1px solid #55ddbd!important;
  background:#16c79a!important;
  background-image:none!important;
  color:#fff!important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.45)!important;
}

/* =========================================================
   MULTI-WALLET FOOTER — CLEAN ANIME STYLE
   ========================================================= */

.mw .site-footer{
  display:grid!important;
  grid-template-columns:1fr auto 1fr!important;
  align-items:center!important;
  gap:20px!important;

  width:100%!important;
  margin:34px auto 0!important;
  padding:20px 26px!important;

  border:1px solid #dfe3ef!important;
  border-radius:20px!important;

  background:
    linear-gradient(
      120deg,
      rgba(255,255,255,.98),
      rgba(248,245,255,.96) 52%,
      rgba(239,251,255,.96)
    )!important;

  box-shadow:
    0 12px 30px rgba(80,72,145,.08)!important;

  color:#5f6683!important;
}


/* LEFT — NETWORK TEXT */

.mw .site-footer .footer-network{
  display:flex!important;
  align-items:center!important;

  width:auto!important;
  max-width:none!important;

  margin:0!important;
  padding:0!important;

  border:0!important;
  border-radius:0!important;

  background:transparent!important;
  background-image:none!important;

  color:#6d58a8!important;

  font-size:.84rem!important;
  font-weight:800!important;

  box-shadow:none!important;
}


/* CENTER */

.mw .site-footer > p:first-of-type{
  margin:0!important;

  color:#5f6683!important;

  font-size:.9rem!important;
  font-weight:650!important;

  text-align:center!important;
}


/* RIGHT TEXT */

.mw .site-footer small{
  display:block!important;

  margin:0!important;

  color:#69718e!important;

  font-size:.82rem!important;
  font-weight:650!important;

  line-height:1.45!important;

  text-align:right!important;
}


/* PRIVACY + SUPPORT ROW */

.mw .site-footer > p:last-of-type{
  grid-column:1 / -1!important;

  margin:2px 0 0!important;

  padding-top:14px!important;

  border-top:1px solid #e9e3f2!important;

  color:#7a7199!important;

  font-size:.82rem!important;

  text-align:center!important;
}


/* FOOTER LINKS */

.mw .site-footer a{
  color:#684bd6!important;

  font-weight:800!important;

  text-decoration:none!important;

  border:0!important;
  border-bottom:0!important;
}

.mw .site-footer a:hover{
  color:#8057e8!important;

  text-decoration:none!important;
}


/* MOBILE */



@media(max-width:900px){
  .mw-hero{grid-template-columns:1fr!important;gap:30px!important;min-height:0!important;padding:38px 28px!important}
  .mw-hero>div:first-child{max-width:720px!important}
  .wallet-visual{max-width:620px!important;width:100%!important;min-height:450px!important;margin:auto!important}
  .steps,.features{grid-template-columns:1fr 1fr!important}
  .affiliate-video{grid-template-columns:1fr!important;padding:27px!important}
  .affiliate-video-player{order:2!important}
  .mw .site-footer{grid-template-columns:1fr!important;text-align:center!important}
  .mw .site-footer .footer-network{justify-self:center!important}
  .mw .site-footer p,.mw .site-footer small{text-align:center!important}
}

@media(max-width:620px){
  .mw{width:min(100% - 20px,1180px)!important;padding-top:12px!important}
  .mw-nav{padding:11px!important;border-radius:17px!important}
  .mw-brand{gap:9px!important;font-size:.92rem!important}
  .mw-brand img{width:40px!important;height:40px!important}
  .mw-support{min-height:40px!important;padding:0 12px!important;font-size:.76rem!important}
  .mw-hero{padding:28px 18px!important;gap:25px!important;border-radius:22px!important}
  .mw-hero h1{font-size:clamp(2.35rem,12vw,3.2rem)!important}
  .mw-lead{font-size:.98rem!important}
  .mw-actions{display:grid!important;grid-template-columns:1fr!important}
  .mw-actions .button{width:100%!important}
  .wallet-visual{min-height:430px!important}
  .device{inset:8px 0!important;padding:14px!important}
  .balance strong{font-size:2rem!important}
  .coins{grid-template-columns:1fr!important}
  .quick{grid-template-columns:1fr 1fr!important}
  .section{padding:42px 0!important}
  .steps,.features,.security{grid-template-columns:1fr!important}
  .steps article,.features article{padding:20px!important}
  .affiliate-video{padding:18px!important;border-radius:22px!important}
  .affiliate-video-copy h2{font-size:2rem!important}
  .affiliate-video-player{border-radius:16px!important}
  .security{padding:24px 20px!important}
  .security-mark{width:72px!important;height:72px!important;border-radius:21px!important;font-size:2rem!important}
  .final-card{padding:38px 18px!important}
  .mw .site-footer{padding:22px 18px!important;border-radius:20px!important}
}

@media(max-width:760px){

  .mw .site-footer{
    grid-template-columns:1fr!important;

    gap:10px!important;

    padding:20px!important;

    text-align:center!important;
  }

  .mw .site-footer .footer-network,
  .mw .site-footer > p:first-of-type,
  .mw .site-footer small{
    justify-content:center!important;
    text-align:center!important;
  }

  .mw .site-footer > p:last-of-type{
    grid-column:auto!important;

    margin-top:5px!important;
  }
}

/* PWA INSTALL BUTTON */

#pwa-install-button{
  background:#16c79a !important;
  background-image:none !important;
  border:1px solid #55ddbd !important;
  color:#fff !important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.45) !important;
  text-shadow:none !important;
}

/* Install arrow */
#pwa-install-button > span{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;

  color:#fff !important;
  opacity:1 !important;

  font-size:18px !important;
  font-weight:900 !important;
  line-height:1 !important;

  text-shadow:none !important;
  filter:none !important;
}