@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@500;600;700&display=swap");
:root{
  /* Pieverse-inspired: warm neutrals, airy spacing, soft glass cards */
  --bg1:#fbfaf7;
  --bg2:#f3eee4;
  --card: rgba(255,255,255,.72);
  --card2: rgba(255,255,255,.92);
  --text:#0b0c0f;
  --muted: rgba(11,12,15,.62);
  --line: rgba(11,12,15,.10);

  --accent:#0b0c0f;          /* primary button */
  --accentText:#fbfaf7;
  --accent2:#c8b58d;         /* warm sand accent */

  --radius:18px;
  --shadow: 0 18px 55px rgba(0,0,0,.10);
  --shadowSm: 0 10px 25px rgba(0,0,0,.08);

  --maxw: 430px;
  --font: "Inter", "Noto Sans KR", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Apple SD Gothic Neo, sans-serif;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:var(--font);
  color:var(--text);
  background:
    radial-gradient(900px 520px at 15% 0%, rgba(200,181,141,.40), transparent 60%),
    radial-gradient(800px 460px at 85% 10%, rgba(120, 98, 54, .16), transparent 62%),
    radial-gradient(700px 420px at 45% 110%, rgba(200,181,141,.18), transparent 55%),
    linear-gradient(180deg, var(--bg1), var(--bg2));
}

/* subtle dot grain overlay (Pieverse-ish texture) */
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background-image: radial-gradient(rgba(11,12,15,.055) 1px, transparent 1px);
  background-size: 22px 22px;
  opacity:.12;
}

.app{
  min-height:100%;
  display:flex;
  justify-content:center;
  padding: 26px 14px;
}

.page{
  width: 100%;
  max-width: var(--maxw);
}

.page--center{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  padding-top: 10px;
}

.page--shell{
  position:relative;
  padding-bottom: 88px; /* space for bottom nav */
}

.hidden{display:none !important}

.brand{
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 12px;
  margin: 10px 0 26px;
}

.brand__logo{
  width:52px;height:52px;
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(255,255,255,.70));
  border: 1px solid rgba(11,12,15,.10);
  box-shadow: var(--shadowSm);
  display:flex;
  align-items:center;
  justify-content:center;
  color: var(--text);
}

.brand__logo--sm{
  width:28px;height:28px;
  border-radius: 10px;
  box-shadow:none;
}

.brand__svg{
  width:72%;
  height:72%;
  display:block;
}

.brand__name{
  font-weight: 850;
  letter-spacing: -.7px;
  font-size: 34px;
  line-height: 1;
}

.brand__kite{font-weight: 900;}
.brand__wallet{margin-left: 8px; font-weight: 800; opacity: .92;}

.brand--logoOnly{
  margin: 16px 0 22px;
}

.brandLogo{
  width: 190px;
  height: auto;
  display:block;
  filter: drop-shadow(0 18px 35px rgba(0,0,0,.10));
}

.brand__img--mark{
  width: 78%;
  height: 78%;
}

.brand__img{
  display:block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.brand__img--icon{
  width: 78%;
  height: 78%;
}

.h1{
  font-size: 34px;
  margin: 10px 0 6px;
  font-weight: 800;
  letter-spacing: -.3px;
}

.h2{
  font-size: 20px;
  margin: 10px 0 12px;
  font-weight: 800;
  letter-spacing: -.2px;
}

.sub{
  margin:0 0 18px;
  color: var(--muted);
  line-height:1.4;
}

.form{display:flex; flex-direction:column; gap: 12px;}

.field{
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 12px 12px;
  border: 1px solid rgba(11,12,15,.10);
  border-radius: 14px;
  background: rgba(255,255,255,.86);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}

.field:focus-within{
  border-color: rgba(11,12,15,.22);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92), 0 0 0 3px rgba(200,181,141,.22);
}

.field__icon{opacity:.85; width: 26px; text-align:center}

.input{
  width:100%;
  border:0;
  outline:0;
  background: transparent;
  color: var(--text);
  font-size: 15px;
  padding: 6px 2px;
}

.field__ghost{
  border:0;
  background: transparent;
  color: rgba(11,12,15,.60);
  cursor:pointer;
  padding: 6px;
  border-radius: 10px;
}
.field__ghost:hover{background: rgba(11,12,15,.06)}

.btn{
  border: 1px solid rgba(11,12,15,.10);
  cursor:pointer;
  border-radius: 999px;
  padding: 14px 18px;
  font-weight: 800;
  letter-spacing: -.1px;
  background: rgba(255,255,255,.82);
  color: var(--text);
  box-shadow: var(--shadowSm);
}

.btn--primary{
  background: var(--accent);
  border-color: rgba(11,12,15,.55);
  color: var(--accentText);
  box-shadow: 0 18px 35px rgba(0,0,0,.18);
}

.btn--primary:hover{filter: brightness(1.03)}

.btn--mono{
  /* Wallet tab: keep CTA achromatic (no warm accent) */
  background: linear-gradient(180deg, rgba(11,12,15,.94), rgba(11,12,15,1));
  border-color: rgba(11,12,15,.55);
  color: rgba(251,250,247,.96);
}


.btn--small{
  padding: 9px 12px;
  border-radius: 999px;
  background: transparent;
  border: 1px solid rgba(11,12,15,.18);
  box-shadow:none;
  font-size: 13px;
  margin-left: 10px;
}
.btn--small:hover{background: rgba(11,12,15,.04)}

.btn--ghost{
  width:100%;
  background: rgba(200,181,141,.18);
  border: 1px solid rgba(200,181,141,.45);
  box-shadow:none;
}
.btn--ghost:hover{background: rgba(200,181,141,.24)}

.row{display:flex; gap: 10px; align-items:center}
.row--center{justify-content:center}
.row--between{justify-content:space-between}
.mt-10{margin-top:10px}
.mt-12{margin-top:12px}
.mt-14{margin-top:14px}
.mt-16{margin-top:16px}
.mt-20{margin-top:20px}

.muted{color: var(--muted)}
.fineprint{
  color: #a9bfd8;
  font-size: 12px;
  line-height:1.45;
  margin:0;
}


/* Login page icon links */
.loginIconLinks{
  display:flex;
  gap: 12px;
  justify-content:center;
  align-items:center;
}

.iconLink{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  border: 1px solid rgba(11,12,15,.10);
  background: rgba(255,255,255,.72);
  box-shadow: var(--shadowSm);
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  color: var(--text);
  transition: transform .12s ease, background .12s ease;
}

.iconLink:hover{background: rgba(255,255,255,.88); transform: translateY(-1px)}
.iconLink:active{transform: translateY(0)}

.iconLink img{
  width: 22px;
  height: 22px;
  object-fit: contain;
  display:block;
}

.iconLink--x img{
  width: 22px;
  height: 22px;
  border-radius: 6px;
}

.blogIcon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height: 26px;
  padding: 0 9px;
  border-radius: 14px;
  border: none;
  background: rgba(255,255,255,.42);
  font-weight: 900;
  font-size: 12px;
  letter-spacing: -.2px;
  text-transform: lowercase;
}

.topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 6px 6px 14px;
}

.topbar__left{display:flex; align-items:center; gap: 10px;}
.topbar__headline{font-weight: 800; font-size: 14px; color: rgba(11,12,15,.85)}

.content{padding: 0 6px}

.card{
  background: var(--card);
  border: 1px solid rgba(11,12,15,.09);
  border-radius: var(--radius);
  padding: 14px;
  box-shadow: var(--shadow);
  backdrop-filter: blur(10px);
}

.card--row{display:flex; align-items:center; gap: 12px;}

.card__title{font-weight: 850;}
.card__sub{color: var(--muted); font-size: 13px; margin-top: 4px;}

.iconBox{
  width:44px;height:44px;border-radius: 14px;
  display:grid; place-items:center;
  background: rgba(11,12,15,.04);
  border: 1px solid rgba(11,12,15,.06);
  color: rgba(11,12,15,.80);
}
.iconBox--shield{background: rgba(200,181,141,.20)}
.iconBox--money{background: rgba(11,12,15,.04)}

.sectionLabel{
  color: rgba(11,12,15,.68);
  font-size: 13px;
  margin: 8px 0 10px;
  font-weight: 700;
}

.newsList{display:flex; flex-direction:column; gap: 10px;}
.newsItem{
  display:flex; align-items:center; gap: 12px;
  background: linear-gradient(180deg, rgba(17,29,56,.94), rgba(9,16,31,.98));
  border: 1px solid rgba(114,178,255,.18);
  border-radius: var(--radius);
  padding: 12px;
  box-shadow: var(--shadowSm);
}

.newsLink{
  display:flex;
  align-items:center;
  gap: 12px;
  width:100%;
  color: rgba(11,12,15,.92);
  text-decoration:none;
}

.newsLink:visited{color: rgba(11,12,15,.92);}
.newsLink:hover .newsItem__title{ text-decoration: underline; text-underline-offset: 2px;}
#newsList a, #newsList a:visited{color: var(--text); text-decoration:none;}


.thumb{
  width:96px;height:72px;
  border-radius: 12px;
  border: 1px solid rgba(114,178,255,.14);
  background: rgba(19,31,59,.92);
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}

.thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.thumb--fallback{
  font-size: 18px;
  color: rgba(11,12,15,.55);
}

.newsItem__title{font-weight: 850; font-size: 14px; line-height:1.25; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.newsItem__meta{color: var(--muted); font-size: 12px; margin-top: 6px}
.newsLoading{padding: 10px 2px;}

.list{display:flex; flex-direction:column; gap: 10px;}
.coinRow{
  display:flex; align-items:center; justify-content:space-between;
  background: linear-gradient(180deg, rgba(17,29,56,.94), rgba(9,16,31,.98));
  border: 1px solid rgba(114,178,255,.18);
  border-radius: var(--radius);
  padding: 12px 12px;
  box-shadow: var(--shadowSm);
}
.coinLeft{display:flex; gap: 12px; align-items:center}
.coinIcon{
  width:40px;height:40px;border-radius:999px;
  background: rgba(19,31,59,.94);
  border: 1px solid rgba(114,178,255,.18);
  display:grid; place-items:center;
  font-weight: 900;
  font-size: 12px;
  line-height: 1;
  letter-spacing: -0.4px;
  text-transform: uppercase;
  color: rgba(11,12,15,.85);
}

/* When we render a real coin logo image, remove the extra container styling */
.coinIcon--img{
  background: transparent;
  border: none;
}
.coinLogo{
  width:40px;
  height:40px;
  display:block;
  border-radius:999px;
}

/* Fit ticker symbols nicely inside the 40px circle */
.coinIcon--s3{font-size: 12px}
.coinIcon--s4{font-size: 11px}
.coinIcon--s5{font-size: 10px}
.coinName{font-weight: 850; font-size: 14px}
.coinTicker{font-size: 12px; color: var(--muted); margin-top: 3px}
.coinRight{text-align:right}
.coinPrice{font-weight: 850; font-size: 14px}
.coinChange{font-size: 12px; margin-top: 3px}

.badge{
  display:inline-flex;
  align-items:center;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid rgba(114,178,255,.18);
  background: rgba(18,33,64,.92);
  color: #cfe6ff;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: -.1px;
  margin-left: 6px;
}

/* Korean market convention: up=red, down=blue */
.pos{color: #d33b3b}
.neg{color: #2563eb}
.neu{color: rgba(11,12,15,.60)}

.empty{padding: 12px 0; text-align:center}

.form--flat{gap: 0}
.label{
  font-size: 13px;
  color: rgba(11,12,15,.70);
  margin: 12px 0 6px;
  font-weight: 700;
}

.input--light, .select{
  width:100%;
  border-radius: 14px;
  border: 1px solid rgba(11,12,15,.10);
  background: rgba(255,255,255,.88);
  color: var(--text);
  padding: 12px 12px;
  font-size: 14px;
  outline: none;
}

.selectWrap{position:relative}
.selectWrap__chev{
  position:absolute; right: 10px; top: 50%;
  transform: translateY(-50%);
  color: rgba(11,12,15,.55);
  pointer-events:none;
}

.menu{display:flex; flex-direction:column; gap: 10px;}
.menuItem{
  display:flex; align-items:center; gap: 12px;
  background: linear-gradient(180deg, rgba(17,29,56,.94), rgba(9,16,31,.98));
  border: 1px solid rgba(114,178,255,.18);
  border-radius: var(--radius);
  padding: 14px;
  color: var(--text);
  cursor:pointer;
  box-shadow: var(--shadowSm);
}
.menuItem__icon{
  width:36px; height:36px;
  border-radius: 12px;
  background: rgba(200,181,141,.18);
  border: 1px solid rgba(200,181,141,.35);
  display:grid; place-items:center;
}
.menuItem__label{font-weight: 850}

.bottomNav{
  position:fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  width: min(var(--maxw), 100%);
  background: rgba(251,250,247,.82);
  border-top: 1px solid rgba(11,12,15,.10);
  padding: 10px 10px 12px;
  display:flex;
  justify-content:space-between;
  backdrop-filter: blur(10px);
}

.navItem{
  border:0;
  background: transparent;
  color: #a9bfd8;
  cursor:pointer;
  width: 20%;
  display:flex;
  flex-direction:column;
  gap: 6px;
  align-items:center;
  padding: 6px 0;
}
.navItem__icon{
  width: 22px; height: 22px;
  display:grid; place-items:center;
  opacity:.95;
}
.navIconSvg{width:22px;height:22px;display:block}
.navItem__label{font-size: 11px; font-weight: 700;}

.navItem.is-active{
  color: rgba(11,12,15,.92);
}

.navItem.is-active::before{
  content:"";
  width: 56px;
  height: 2px;
  border-radius: 99px;
  background: rgba(11,12,15,.85);
  margin-bottom: 2px;
}

.toast{
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: 98px;
  background: rgba(11,12,15,.88);
  color: rgba(255,255,255,.95);
  padding: 10px 12px;
  border-radius: 14px;
  font-size: 13px;
  max-width: min(360px, 92vw);
  text-align:center;
  border: 1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(10px);
  z-index: 9999;
}
.toast--center{
  top: 50%;
  bottom: auto;
  transform: translate(-50%, -50%);
  width: min(340px, calc(100vw - 32px));
  padding: 14px 16px;
  border-radius: 18px;
  box-shadow: 0 18px 40px rgba(0,0,0,.22);
}

/* Holdings list (Asset) */
.holdingsList{display:flex; flex-direction:column; gap: 10px;}
.holdingRow{
  display:flex; align-items:center; justify-content:space-between;
  padding: 12px;
  border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(17,29,56,.94), rgba(9,16,31,.98));
  border: 1px solid rgba(114,178,255,.18);
  box-shadow: var(--shadowSm);
}
.holdingLeft{display:flex; align-items:center; gap: 12px;}
.holdingRight{text-align:right;}
.holdingAmt{font-weight: 900; font-size: 14px;}
.holdingSub{color: var(--muted); font-size: 12px; margin-top: 3px;}

/* Admin */
.tableWrap{
  width: 100%;
  overflow:auto;
  border-radius: calc(var(--radius) - 2px);
  border: 1px solid rgba(11,12,15,.08);
  background: rgba(255,255,255,.70);
}

.adminTable{
  width: 100%;
  border-collapse: collapse;
  min-width: 520px;
}

.adminTable th,
.adminTable td{
  padding: 10px 10px;
  border-bottom: 1px solid rgba(11,12,15,.08);
  text-align:left;
  font-size: 13px;
  vertical-align: top;
}

.adminTable th{
  position: sticky;
  top: 0;
  background: rgba(251,250,247,.96);
  backdrop-filter: blur(8px);
  font-weight: 900;
  letter-spacing: -.1px;
  z-index: 1;
}

.adminTable tr:last-child td{border-bottom:0}

.balLines{display:flex; flex-direction:column; gap: 4px;}
.balLine{display:flex; gap: 8px; align-items:baseline;}
.balLine b{font-weight: 900}
.balLine span{color: rgba(11,12,15,.70)}

.btn--danger{
  background: rgba(211,59,59,.10);
  border-color: rgba(211,59,59,.28);
  color: #b42323;
  box-shadow:none;
}
.btn--danger:hover{background: rgba(211,59,59,.14)}

.quickRow{display:flex; flex-wrap:wrap; gap: 8px; align-items:center;}
.chip{
  border: 1px solid rgba(11,12,15,.14);
  background: rgba(255,255,255,.76);
  color: rgba(11,12,15,.86);
  border-radius: 999px;
  padding: 8px 12px;
  font-weight: 900;
  font-size: 12px;
  cursor:pointer;
}
.chip:hover{background: rgba(255,255,255,.90)}
.chip--ghost{
  background: rgba(11,12,15,.06);
  border-color: rgba(11,12,15,.14);
}

/* Asset screen (new-ish layout already) */
.portfolioHero{
  border-radius: calc(var(--radius) + 6px);
  padding: 16px 16px 14px;
  background:
    radial-gradient(800px 240px at 20% 0%, rgba(44,213,255,.18), transparent 60%),
    radial-gradient(700px 220px at 85% 20%, rgba(71,124,255,.14), transparent 55%),
    linear-gradient(180deg, rgba(14,27,52,.95), rgba(8,15,30,.98));
  border: 1px solid rgba(114,178,255,.18);
  box-shadow: var(--shadow);
  backdrop-filter: blur(10px);
}

.portfolioHero__row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 12px;
}

.portfolioHero__label{
  color: var(--muted);
  font-weight: 750;
  font-size: 13px;
}

.portfolioHero__value{
  margin-top: 6px;
  font-size: 28px;
  font-weight: 900;
  letter-spacing: -.2px;
}

.portfolioHero__value .unit{
  font-size: 16px;
  font-weight: 850;
  margin-left: 6px;
  color: #9ab5d2;
}

.portfolioHero__sub{
  margin-top: 10px;
  font-size: 13px;
  color: #a9bfd8;
}

.statsGrid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.statCard{
  border-radius: var(--radius);
  padding: 12px 12px;
  background: linear-gradient(180deg, rgba(17,29,56,.94), rgba(9,16,31,.98));
  border: 1px solid rgba(114,178,255,.18);
  box-shadow: var(--shadowSm);
}

.statCard__label{
  color: var(--muted);
  font-weight: 750;
  font-size: 13px;
}

.statCard__value{
  margin-top: 6px;
  font-weight: 900;
  font-size: 18px;
}

.pill{
  border-radius: 999px;
  padding: 8px 10px;
  font-weight: 900;
  font-size: 13px;
  border: 1px solid rgba(11,12,15,.10);
  background: rgba(255,255,255,.70);
  color: rgba(11,12,15,.78);
}

/* Signup helpers */
.fieldGroup{display:flex; flex-direction:column; gap: 6px;}
.fieldMsg{
  font-size: 12px;
  line-height: 1.4;
  margin: -4px 0 0;
  padding-left: 14px;
}
.fieldMsg.ok{color: #0f766e;}
.fieldMsg.bad{color: #d33b3b;}
.fieldMsg.neu{color: var(--muted);}

.field__action{
  border: 1px solid rgba(11,12,15,.20);
  background: rgba(11,12,15,.92);
  color: rgba(255,255,255,.95);
  cursor:pointer;
  padding: 8px 10px;
  border-radius: 999px;
  font-weight: 900;
  font-size: 12px;
  letter-spacing: -.1px;
  box-shadow: 0 10px 20px rgba(0,0,0,.12);
  /* prevent Korean syllable wrapping ("중복확\n인") */
  white-space: nowrap;
  min-width: 88px;
  text-align: center;
  flex: 0 0 auto;
}
.field__action:hover{filter: brightness(1.03)}

/* Mobile comfort */
@media (max-width: 380px){
  .brand__name{font-size: 28px}
  .h1{font-size: 30px}
}


/* News (cards) */
.newsBadge{
  width: 34px;
  height: 34px;
  border-radius: 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(11,12,15,.06);
  border: 1px solid rgba(11,12,15,.08);
  flex: 0 0 auto;
}
.newsText{flex: 1 1 auto; min-width: 0;}
.newsItem__desc{font-size: 12px; margin-top: 6px; line-height: 1.35;}

/* ------------------------------
 * Modal (wallet address)
 * ------------------------------ */
.modal {
  position: fixed;
  inset: 0;
  z-index: 999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 22px;
}

.modal.hidden { display: none; }

.modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(11,12,15,.35);
  backdrop-filter: blur(8px);
}

.modal__panel {
  position: relative;
  width: min(440px, 100%);
  border-radius: 22px;
  padding: 18px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(11,12,15,.10);
  box-shadow: 0 30px 70px rgba(0,0,0,.22);
}

.modal__title {
  text-align: center;
  font-weight: 950;
  letter-spacing: -.3px;
  font-size: 18px;
  margin-top: 2px;
}

.addrLine {
  margin-top: 10px;
  text-align: center;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-weight: 800;
  letter-spacing: .2px;
  color: var(--text);
  word-break: break-all;
}

.qrCard {
  margin-top: 14px;
  background: rgba(255,255,255,.96);
  border: 1px solid rgba(11,12,15,.10);
  border-radius: 18px;
  padding: 14px;
  box-shadow: var(--shadowSm);
  display: flex;
  justify-content: center;
}

.qrBox {
  width: 220px;
  height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.qrBox img,
.qrBox canvas {
  width: 220px !important;
  height: 220px !important;
  image-rendering: pixelated;
  border-radius: 10px;
}

.btnIcon {
  display: inline-flex;
  margin-right: 8px;
}

/* Wallet address modal button tweaks */
#walletAddrCopyBtn{ text-align:center; }
#walletAddrCopyBtn.is-copied{
  background: rgba(11,12,15,.92);
  border-color: rgba(11,12,15,.55);
  color: rgba(251,250,247,.96);
}

#walletAddrCloseBtn{
  display:block;
  margin-left:auto;
  margin-right:auto;
  width: min(240px, 100%);
}


.activityList {
  display: grid;
  gap: 10px;
}
.activityItem {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 12px;
  align-items: start;
  padding: 12px;
  border: 1px solid rgba(17, 24, 39, 0.08);
  border-radius: 14px;
  background: rgba(255,255,255,0.82);
}
.activityItem__icon {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: rgba(17,24,39,0.06);
  display: grid;
  place-items: center;
  font-size: 18px;
}
.activityItem__title {
  font-weight: 700;
  color: var(--text);
  line-height: 1.3;
}
.activityItem__sub {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.4;
}
.activityItem__meta {
  margin-top: 4px;
  color: var(--muted2, #6b7280);
  font-size: 12px;
  line-height: 1.45;
  word-break: break-all;
}


/* Wallet estimate */
.estimateCard{
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(255,255,255,.74);
  border: 1px solid rgba(11,12,15,.08);
  box-shadow: var(--shadowSm);
}
.estimateCard__row{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
}
.estimateCard__row + .estimateCard__row{ margin-top:8px; padding-top:8px; border-top:1px solid rgba(11,12,15,.06);}
.estimateCard__label{ font-size:12px; color:var(--muted); font-weight:700; }
.estimateCard__value{ font-size:13px; color:rgba(11,12,15,.92); font-weight:900; }

/* Wallet transfer fail popup */
.modal__panel--alert{
  background: #090b16;
  color: rgba(255,255,255,.95);
  border: 1px solid rgba(255,255,255,.06);
  box-shadow: 0 22px 60px rgba(0,0,0,.42);
}
.modal__title--alert{ color:#fff; margin-bottom: 18px; }
.sendFailBody{ text-align:left; }
.sendFailLead{ margin: 0 0 14px; line-height:1.65; font-size:14px; font-weight:700; color:#1a1a1a; }
.sendFailList{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:7px; color:#1a1a1a; font-size:14px; font-weight:700; }
.sendFailList li::before{ content:'-'; margin-right:2px; }
.sendFailBtn{ display:block; width:132px; margin: 22px auto 0; }

/* ===== SafePal-inspired layout rebuild v4.8.1 ===== */
:root{
  --bg1:#020817;
  --bg2:#07152d;
  --card:rgba(10,22,45,.78);
  --card2:rgba(13,27,56,.96);
  --text:#eef5ff;
  --muted:rgba(216,229,255,.68);
  --line:rgba(120,180,255,.18);
  --accent:#23c9ff;
  --accentText:#03101d;
  --accent2:#7af0ff;
  --maxw:1140px;
  --radius:24px;
  --shadow:0 30px 80px rgba(0,0,0,.45);
  --shadowSm:0 14px 36px rgba(0,0,0,.28);
}

body{
  background:
    radial-gradient(900px 500px at 10% -10%, rgba(35,201,255,.22), transparent 55%),
    radial-gradient(900px 500px at 100% 0%, rgba(94,126,255,.18), transparent 55%),
    radial-gradient(800px 400px at 50% 100%, rgba(23,158,255,.12), transparent 60%),
    linear-gradient(180deg,#031021 0%, #050c1d 34%, #081832 100%);
}
body::before{opacity:.06;background-image: radial-gradient(rgba(255,255,255,.2) .8px, transparent .8px)}
.app{padding:24px 16px 36px}
.page{max-width:var(--maxw)}
.page--center{padding-top:0}
.page--shell{padding-bottom:108px}

.authPage{max-width:1180px}
.authShell{display:grid;grid-template-columns:1.15fr .85fr;gap:28px;align-items:stretch;min-height:calc(100vh - 72px)}
.authVisual,.authCard{border:1px solid var(--line);border-radius:32px;box-shadow:var(--shadow);backdrop-filter:blur(14px)}
.authVisual{background:linear-gradient(160deg, rgba(8,20,42,.82), rgba(6,14,30,.95));padding:40px 38px;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center}
.authVisual::before{content:"";position:absolute;inset:-20% auto auto -10%;width:340px;height:340px;background:radial-gradient(circle, rgba(35,201,255,.28), transparent 65%);filter:blur(10px)}
.authVisual::after{content:"";position:absolute;right:-80px;bottom:-80px;width:280px;height:280px;background:radial-gradient(circle, rgba(123,240,255,.18), transparent 65%)}
.authBadge{position:relative;z-index:1;display:inline-flex;align-self:flex-start;padding:8px 14px;border-radius:999px;background:rgba(35,201,255,.10);border:1px solid rgba(35,201,255,.24);color:#96ecff;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.brand--hero{justify-content:flex-start;margin:22px 0 20px;position:relative;z-index:1}
.authLogo{width:66px;height:66px;border-radius:20px;background:linear-gradient(135deg, rgba(35,201,255,.2), rgba(122,240,255,.08));border-color:rgba(122,240,255,.24)}
.authTitle{position:relative;z-index:1;font-size:54px;line-height:1.03;letter-spacing:-1.8px;margin:0 0 14px;font-weight:900;max-width:620px}
.authTitle--sm{font-size:42px;max-width:520px}
.authLead{position:relative;z-index:1;color:var(--muted);font-size:17px;line-height:1.6;max-width:560px;margin:0 0 28px}
.heroDevice{position:relative;z-index:1;max-width:500px;background:linear-gradient(180deg, rgba(13,31,62,.95), rgba(8,18,36,.95));border:1px solid rgba(120,180,255,.18);border-radius:30px;padding:22px;box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 18px 36px rgba(0,0,0,.35)}
.heroDevice__top{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.heroDevice__eyebrow{font-size:12px;font-weight:800;color:#8fdfff;letter-spacing:.16em}
.heroDevice__pill{display:inline-flex;padding:7px 12px;border-radius:999px;background:rgba(122,240,255,.10);border:1px solid rgba(122,240,255,.22);color:#b5f6ff;font-size:12px}
.heroDevice__balance{font-size:40px;font-weight:900;letter-spacing:-1px;margin-bottom:18px}
.heroDevice__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.heroMiniCard{padding:14px 16px;border-radius:20px;background:rgba(255,255,255,.03);border:1px solid rgba(120,180,255,.12)}
.heroMiniCard__label{font-size:12px;color:var(--muted);margin-bottom:6px}
.heroMiniCard strong{font-size:18px}
.featureStrip{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;position:relative;z-index:1}
.featureChip{padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.04);border:1px solid rgba(120,180,255,.12);color:#dfeeff;font-weight:700}
.authCardWrap{display:flex;align-items:center;justify-content:center}
.authCard{width:100%;padding:30px;background:linear-gradient(180deg, rgba(9,19,39,.92), rgba(7,14,28,.98))}
.authCard--signup{padding:26px 26px 28px}
.authCard__header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:6px}
.authCard__eyebrow{font-size:12px;font-weight:800;letter-spacing:.14em;color:#90e6ff}
.authCard__title{margin:8px 0 0}
.authOrb{width:52px;height:52px;border-radius:50%;background:radial-gradient(circle at 30% 30%, rgba(122,240,255,.95), rgba(35,201,255,.15) 62%, transparent 68%);filter:blur(.2px)}
.authSubmit{margin-top:4px}

.field,.card,.portfolioHero,.statCard,.menuItem,.estimateCard,.modal__panel,.securityBanner,.screenHero,.walletAside__card,.featurePanel,.showcaseCard,.moreHero,.marketShell,.topbar,.bottomNav,.tableWrap{background:linear-gradient(180deg, rgba(11,23,47,.88), rgba(7,14,28,.96));border-color:rgba(120,180,255,.18);box-shadow:var(--shadowSm);color:var(--text)}
.field:focus-within{border-color:rgba(122,240,255,.45);box-shadow:0 0 0 3px rgba(35,201,255,.14), inset 0 1px 0 rgba(255,255,255,.08)}
.field__ghost,.field__action{color:#bdefff}
.input,.select,.input--light{color:var(--text)}
.input::placeholder,.input--light::placeholder{color:rgba(216,229,255,.38)}
.btn{background:rgba(255,255,255,.03);border-color:rgba(120,180,255,.16);color:var(--text)}
.btn--primary{background:linear-gradient(135deg, #20c7ff, #79f3ff);color:#03101d;border-color:transparent;box-shadow:0 18px 40px rgba(35,201,255,.28)}
.btn--mono{background:linear-gradient(135deg,#20c7ff,#79f3ff);color:#03101d}
.btn--ghost{background:rgba(35,201,255,.10);border-color:rgba(35,201,255,.22);color:#dff7ff}
.btn--small{background:rgba(255,255,255,.02);border-color:rgba(120,180,255,.14)}

.topbar--app{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-radius:24px;position:sticky;top:10px;z-index:5;backdrop-filter:blur(18px);margin-bottom:18px}
.topbar__logo{background:rgba(35,201,255,.08);border-color:rgba(35,201,255,.18)}
.topbar__eyebrow{font-size:11px;letter-spacing:.18em;font-weight:800;color:#8fdfff;margin-bottom:2px}
.topbar__headline{font-size:16px;font-weight:800}
.topbar__meta{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.topbarBadge{display:inline-flex;align-items:center;padding:7px 12px;border-radius:999px;background:rgba(255,255,255,.04);border:1px solid rgba(120,180,255,.14);font-size:12px;color:#dff5ff}
.topbarBadge--live{background:rgba(35,201,255,.10);color:#98ecff}
.content{display:flex;flex-direction:column;gap:0}
.screen{padding:2px 0 4px}
.sectionHeader{display:flex;align-items:center;justify-content:space-between;gap:12px}
.sectionHeader__meta,.sectionLabel{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#8cdfff;font-weight:800}
.heroPanel{display:grid;grid-template-columns:1.1fr .9fr;gap:18px;padding:24px;border-radius:30px;background:linear-gradient(135deg, rgba(10,24,48,.96), rgba(5,12,24,.98));border:1px solid rgba(120,180,255,.18);box-shadow:var(--shadow);position:relative;overflow:hidden}
.heroPanel::before{content:"";position:absolute;inset:auto auto -120px -80px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle, rgba(35,201,255,.22), transparent 70%)}
.heroPanel__content{position:relative;z-index:1}
.heroPanel__eyebrow,.screenHero__eyebrow{font-size:12px;font-weight:800;letter-spacing:.15em;color:#8fdfff;text-transform:uppercase}
.heroPanel__title{font-size:34px;line-height:1.1;letter-spacing:-1px;margin:12px 0 10px;font-weight:900;max-width:520px}
.heroPanel__text,.screenHero__text{color:var(--muted);line-height:1.6;margin:0}
.heroPanel__actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
.heroAction{display:inline-flex;align-items:center;justify-content:center;padding:12px 16px;border-radius:999px;border:1px solid transparent;background:linear-gradient(135deg,#20c7ff,#79f3ff);color:#03101d;font-weight:800;cursor:pointer}
.heroAction--ghost{background:rgba(255,255,255,.04);border-color:rgba(120,180,255,.14);color:#dff7ff}
.heroShowcase{display:flex;flex-direction:column;gap:14px;position:relative;z-index:1}
.showcaseCard{padding:18px;border-radius:24px}
.showcaseCard__label{font-size:12px;text-transform:uppercase;letter-spacing:.16em;color:#8fdfff;font-weight:800}
.showcaseCard__value{font-size:36px;font-weight:900;margin:10px 0 8px}
.showcaseCard__meta{color:var(--muted)}
.showcaseStats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.showcaseStat{padding:14px;border-radius:20px;background:rgba(255,255,255,.03);border:1px solid rgba(120,180,255,.12)}
.showcaseStat span{display:block;color:var(--muted);font-size:12px;margin-bottom:6px}
.showcaseStat strong{font-size:18px}
.featureGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.featurePanel{padding:18px;border-radius:22px;display:flex;gap:14px;align-items:flex-start}
.featurePanel__icon{width:40px;height:40px;display:grid;place-items:center;border-radius:14px;background:rgba(35,201,255,.10);font-size:20px}
.featurePanel__title{font-size:16px;font-weight:800;margin-bottom:6px}
.featurePanel__text{color:var(--muted);font-size:14px;line-height:1.5}
.card--deep{padding:18px;border-radius:24px}
.securityBanner{display:flex;gap:16px;align-items:center;padding:18px 20px;border-radius:22px}
.securityBanner__icon{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:rgba(35,201,255,.10);font-size:22px}
.securityBanner__title{font-weight:800;margin-bottom:4px}
.securityBanner__text{color:var(--muted)}
.newsList--featured{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.newsList--featured .newsItem{height:100%}

.screenHero{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;padding:18px 20px;border-radius:24px;margin-bottom:14px}
.screenHero__title{margin:6px 0 8px}
.screenHero__btn{width:auto;min-width:168px}
.marketShell{padding:16px 16px 4px;border-radius:26px}
.portfolioHero--featured{border-radius:28px;padding:22px}
.walletLayout{display:grid;grid-template-columns:1.1fr .7fr;gap:16px;align-items:start}
.walletForm{padding:18px;border-radius:26px;background:linear-gradient(180deg, rgba(11,23,47,.88), rgba(7,14,28,.96));border:1px solid rgba(120,180,255,.18)}
.walletAside__card{padding:22px;border-radius:26px;position:sticky;top:92px}
.walletAside__eyebrow{font-size:12px;font-weight:800;letter-spacing:.16em;color:#8fdfff;text-transform:uppercase}
.walletAside__card h3{margin:10px 0 10px;font-size:24px}
.walletAside__card p{color:var(--muted);line-height:1.6;margin:0 0 14px}
.walletAside__list{margin:0;padding-left:18px;color:#dff5ff;line-height:1.8}
.moreHero{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px;border-radius:26px;background:linear-gradient(135deg, rgba(10,24,48,.96), rgba(6,12,24,.98));border:1px solid rgba(120,180,255,.18);box-shadow:var(--shadowSm);margin-bottom:16px}
.moreHero__orb{width:82px;height:82px;border-radius:50%;background:radial-gradient(circle at 30% 30%, rgba(122,240,255,.88), rgba(35,201,255,.14) 62%, transparent 70%)}
.menu--stacked{display:grid;gap:12px}
.menuItem{border-radius:20px;padding:18px 18px}
.menuItem__icon{width:40px;height:40px;border-radius:14px;background:rgba(35,201,255,.10);display:grid;place-items:center}
.bottomNav{position:fixed;left:50%;transform:translateX(-50%);bottom:18px;width:min(95vw,780px);display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:10px;background:rgba(6,13,28,.84);border:1px solid rgba(120,180,255,.18);border-radius:24px;backdrop-filter:blur(20px);box-shadow:var(--shadow)}
.navItem{border-radius:18px;padding:12px 8px;background:transparent;border:none;cursor:pointer;color:var(--muted)}
.navItem.is-active{background:linear-gradient(135deg, rgba(35,201,255,.16), rgba(122,240,255,.08));color:#e8fbff}
.navItem__icon{font-size:18px;display:block;margin-bottom:6px}
.navItem__label{font-size:12px;font-weight:700}

.modal__panel{border-radius:28px}
.modal__panel,.toast{border:1px solid rgba(120,180,255,.18)}
.toast{background:rgba(7,14,28,.96)}
.loginIconLinks .iconLink{background:rgba(255,255,255,.03);border-color:rgba(120,180,255,.14)}
.blogIcon{color:#dff7ff}

.tableWrap,.card,.portfolioHero,.statCard,.menuItem,.estimateCard,.heroDevice,.showcaseCard,.featurePanel,.securityBanner,.marketShell,.walletForm,.walletAside__card,.moreHero,.topbar--app{box-shadow:0 18px 40px rgba(0,0,0,.28)}

@media (max-width: 980px){
  .authShell,.heroPanel,.walletLayout{grid-template-columns:1fr}
  .authVisual{min-height:auto}
  .page{max-width:760px}
  .featureGrid,.showcaseStats,.newsList--featured{grid-template-columns:1fr 1fr}
}
@media (max-width: 640px){
  .app{padding:14px 12px 28px}
  .page{max-width:100%}
  .authShell{gap:16px;min-height:auto}
  .authVisual,.authCard{border-radius:26px}
  .authVisual{padding:26px 20px}
  .authTitle{font-size:36px}
  .authTitle--sm{font-size:32px}
  .heroDevice__balance{font-size:30px}
  .heroPanel{padding:18px;border-radius:24px}
  .heroPanel__title{font-size:28px}
  .featureGrid,.newsList--featured,.showcaseStats{grid-template-columns:1fr}
  .screenHero,.moreHero,.topbar--app{padding:16px}
  .topbar__meta{display:none}
  .screenHero{flex-direction:column}
  .screenHero__btn{width:100%}
  .bottomNav{width:calc(100vw - 18px);padding:8px;gap:6px;border-radius:20px;bottom:10px}
  .navItem{padding:10px 6px;border-radius:14px}
}


/* v4.8.2 readability tune */
.heroShowcase--mini{align-self:stretch;justify-content:center}
.showcaseCard--compact{min-height:132px;display:flex;flex-direction:column;justify-content:center}
.showcaseCard--compact .showcaseCard__label{font-size:13px;letter-spacing:.12em}
.showcaseCard--compact .showcaseCard__meta{font-size:15px;line-height:1.6;color:#c2d7ee}
.homeActivityItem,.activityItem{background: linear-gradient(180deg, rgba(17,29,56,.94), rgba(9,16,31,.98)); border:1px solid rgba(114,178,255,.18); color:var(--text)}
.activityItem__title,.activityItem__sub,.activityItem__meta{color:inherit}
.newsItem__title{color:var(--text)}
.newsItem__meta,.newsItem__desc,.coinTicker,.sectionLabel,.label,.neu{color:#a9bfd8}
.coinName,.coinPrice,.holdingAmt,.statCard__value{color:var(--text)}
.coinRow,.holdingRow,.newsItem,.menuItem,.statCard{color:var(--text)}
.coinTicker,.holdingSub{color:#a9bfd8}
.marketShell .sectionLabel, .screenHero__text, .portfolioHero__sub{color:#a9bfd8}
.bottomNav{background:linear-gradient(180deg, rgba(12,22,44,.92), rgba(7,14,28,.98)); border-top-color:rgba(114,178,255,.16)}
.navItem{color:#87a9cf}
.navItem.is-active{color:#ffffff}

/* ===== v4.9.0 desktop full-screen layout ===== */
.page--shell{max-width:1480px;width:min(1480px, calc(100vw - 32px));}
#page-app.page--shell{display:flex;flex-direction:column;gap:18px}
#page-app .topbar--app{order:0;margin-bottom:0}
#page-app .bottomNav{order:1;position:sticky;top:98px;left:auto;transform:none;bottom:auto;width:100%;display:flex;justify-content:center;gap:12px;padding:14px 18px;border-radius:26px;margin:0;z-index:4}
#page-app .content{order:2}
#page-app .navItem{width:auto;min-width:128px;flex:0 0 auto;flex-direction:row;justify-content:center;padding:14px 18px;gap:10px;border-radius:18px}
#page-app .navItem__icon{width:auto;height:auto;margin:0}
#page-app .navItem.is-active::before{display:none}

.heroPanel--desktop{grid-template-columns:1.2fr .8fr;padding:34px 34px 30px;border-radius:32px}
.heroPanel__title{font-size:46px;max-width:760px}
.heroPanel__text{font-size:18px;max-width:760px}
.heroPanel__bullets{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.heroPanel__bullets span{padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.04);border:1px solid rgba(120,180,255,.14);color:#dff6ff;font-weight:700}
.heroShowcase--desktop{display:flex;align-items:stretch}
.showcaseFeatureGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;width:100%}
.showcaseFeature{padding:20px;border-radius:22px;background:linear-gradient(180deg, rgba(15,28,54,.94), rgba(9,16,31,.98));border:1px solid rgba(120,180,255,.16);box-shadow:var(--shadowSm)}
.showcaseFeature__label{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#8fdfff;font-weight:800;margin-bottom:10px}
.showcaseFeature strong{font-size:18px;line-height:1.35}
.featureGrid--desktop{grid-template-columns:repeat(3,1fr)}
.homeDesktop{display:grid;grid-template-columns:1fr 420px;gap:18px;align-items:start}
.homeDesktop__main,.homeDesktop__side{display:flex;flex-direction:column;gap:12px}
.newsList--sidebar{grid-template-columns:1fr !important;gap:12px}
.newsList--sidebar .newsItem{padding:14px}
.newsList--sidebar .thumb{width:112px;height:80px}

.screenHero--wide{padding:24px 26px;border-radius:28px}
.marketDesktop{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:18px;align-items:start}
.marketDesktop__main{min-height:100%}
.marketDesktop__side{display:flex;flex-direction:column;gap:14px}
.marketInsight{padding:22px;border-radius:28px;background:linear-gradient(180deg, rgba(11,23,47,.88), rgba(7,14,28,.96));border:1px solid rgba(120,180,255,.18);box-shadow:var(--shadowSm);position:sticky;top:188px}
.marketInsight__eyebrow,.assetAsideCard__eyebrow{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#8fdfff;font-weight:800}
.marketInsight h3,.assetAsideCard h3{margin:10px 0;font-size:28px;line-height:1.15}
.marketInsight p,.assetAsideCard p{color:var(--muted);line-height:1.7;margin:0 0 16px}
.marketInsight__grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.marketInsight__grid div{padding:14px;border-radius:18px;background:rgba(255,255,255,.03);border:1px solid rgba(120,180,255,.12)}
.marketInsight__grid span{display:block;font-size:12px;color:#9cc8ff;margin-bottom:6px}
.marketInsight__grid strong{font-size:15px;line-height:1.4}
.list--wide .coinRow{padding:16px 18px;border-radius:20px}
.list--wide .coinLogo,.list--wide .coinIcon{width:52px;height:52px}
.list--wide .coinName{font-size:16px}
.list--wide .coinPrice{font-size:16px}

.assetDesktop{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:18px;align-items:start}
.assetDesktop__main,.assetDesktop__side{display:flex;flex-direction:column;gap:14px}
.assetAsideCard{padding:22px;border-radius:28px;position:sticky;top:188px}
.card--embedded{padding:12px;border-radius:20px;background:linear-gradient(180deg, rgba(15,28,54,.84), rgba(9,16,31,.94));border-color:rgba(120,180,255,.14);box-shadow:none}

.walletLayout{grid-template-columns:minmax(0,1fr) 360px;gap:18px}
.walletForm{padding:24px}
.walletAside__card{top:188px}
.moreHero{padding:26px 28px}
.menu--stacked{grid-template-columns:repeat(3,minmax(0,1fr));display:grid}
.menu--stacked .menuItem{height:100%;flex-direction:column;align-items:flex-start;padding:22px;gap:16px}
.menu--stacked .menuItem__icon{width:46px;height:46px}

@media (max-width: 1180px){
  .page--shell{width:min(1180px, calc(100vw - 24px));}
  .homeDesktop,.marketDesktop,.assetDesktop,.walletLayout{grid-template-columns:1fr}
  .marketInsight,.assetAsideCard,.walletAside__card{position:relative;top:auto}
  #page-app .bottomNav{position:sticky;top:88px;justify-content:space-between;gap:8px}
  #page-app .navItem{min-width:0;flex:1}
  .menu--stacked{grid-template-columns:1fr 1fr}
}
@media (max-width: 760px){
  .page--shell{width:100%;max-width:100%;}
  #page-app.page--shell{gap:12px}
  #page-app .bottomNav{position:fixed;left:50%;transform:translateX(-50%);bottom:10px;top:auto;width:calc(100vw - 18px);display:grid;grid-template-columns:repeat(5,1fr);padding:8px;gap:6px}
  #page-app .navItem{width:100%;min-width:0;flex-direction:column;padding:10px 6px;gap:6px}
  .heroPanel--desktop,.screenHero--wide,.marketInsight,.assetAsideCard,.walletForm,.walletAside__card,.moreHero{padding:18px}
  .heroPanel__title{font-size:34px}
  .heroPanel__text{font-size:16px}
  .showcaseFeatureGrid,.featureGrid--desktop,.menu--stacked{grid-template-columns:1fr}
  .homeDesktop{grid-template-columns:1fr}
}


/* v4.9.2 wallet field contrast fix */
.walletForm .input--light,
.walletForm .select{
  background: linear-gradient(180deg, rgba(15,31,58,.98), rgba(9,18,36,.98));
  border: 1px solid rgba(114,178,255,.22);
  color: #f2f8ff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.walletForm .input--light::placeholder,
.walletForm .select::placeholder{
  color: rgba(217,232,255,.42);
}
.walletForm .input--light:disabled{
  color: rgba(217,232,255,.72);
  background: linear-gradient(180deg, rgba(19,35,64,.96), rgba(12,24,46,.96));
  opacity: 1;
}
.walletForm .selectWrap__chev{
  color: rgba(217,232,255,.58);
}
.walletForm .label{
  color: #d6e9ff;
}
.walletForm .estimateCard{
  background: linear-gradient(180deg, rgba(14,28,52,.96), rgba(9,18,36,.96));
  border-color: rgba(114,178,255,.18);
}


/* v4.9.6 dropdown/admin readability + password modal */
.select,
.input--light{
  background: linear-gradient(180deg, rgba(15,31,58,.98), rgba(9,18,36,.98));
  border: 1px solid rgba(114,178,255,.24);
  color: #f2f8ff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.select:focus,
.input--light:focus{
  border-color: rgba(122,240,255,.48);
  box-shadow: 0 0 0 3px rgba(35,201,255,.14), inset 0 1px 0 rgba(255,255,255,.05);
}
.select option,
.select optgroup{
  background: #0b1730;
  color: #f2f8ff;
}
.selectWrap__chev{ color: rgba(217,232,255,.64); }
.label{ color: #d6e9ff; }
.input--light::placeholder{ color: rgba(217,232,255,.42); }
.input--light:disabled{
  color: rgba(217,232,255,.72);
  background: linear-gradient(180deg, rgba(19,35,64,.96), rgba(12,24,46,.96));
  opacity: 1;
}
.tableWrap{
  background: linear-gradient(180deg, rgba(10,23,47,.96), rgba(7,14,28,.98));
  border-color: rgba(114,178,255,.22);
}
.adminTable th,
.adminTable td{
  color: #eef6ff;
  border-bottom-color: rgba(114,178,255,.14);
}
.adminTable th{
  background: linear-gradient(180deg, rgba(16,36,70,.98), rgba(10,23,47,.98));
  color: #9feeff;
}
.adminTable tbody tr:hover td{ background: rgba(35,201,255,.045); }
.balLine span{ color: rgba(217,232,255,.66); }
.passwordModal__panel{ width:min(460px,100%); }
.passwordModal__desc{ text-align:center; margin:8px 0 16px; }
.passwordModal__actions{ justify-content:center; gap:10px; }
.passwordModal__actions .btn{ min-width:132px; }

/* v4.9.8 login ko authfix */
.authTitle,.authCard__title,.authLead,.sub{word-break:keep-all;}


/* v4.9.9 Korean labels + per-tab navigation colors */
#page-app .navItem[data-go="home"]{background:linear-gradient(135deg, rgba(35,201,255,.16), rgba(35,201,255,.05)); border:1px solid rgba(35,201,255,.18);}
#page-app .navItem[data-go="coin"]{background:linear-gradient(135deg, rgba(255,79,110,.18), rgba(255,79,110,.06)); border:1px solid rgba(255,79,110,.20);}
#page-app .navItem[data-go="asset"]{background:linear-gradient(135deg, rgba(124,92,255,.18), rgba(124,92,255,.06)); border:1px solid rgba(124,92,255,.20);}
#page-app .navItem[data-go="wallet"]{background:linear-gradient(135deg, rgba(40,221,143,.17), rgba(40,221,143,.05)); border:1px solid rgba(40,221,143,.20);}
#page-app .navItem[data-go="more"]{background:linear-gradient(135deg, rgba(255,184,77,.18), rgba(255,184,77,.06)); border:1px solid rgba(255,184,77,.20);}
#page-app .navItem.is-active{box-shadow:0 0 0 1px rgba(255,255,255,.10) inset, 0 12px 30px rgba(0,0,0,.25); color:#fff;}
#page-app .navItem[data-go="home"].is-active{background:linear-gradient(135deg, rgba(35,201,255,.34), rgba(35,201,255,.12));}
#page-app .navItem[data-go="coin"].is-active{background:linear-gradient(135deg, rgba(255,79,110,.36), rgba(255,79,110,.12));}
#page-app .navItem[data-go="asset"].is-active{background:linear-gradient(135deg, rgba(124,92,255,.36), rgba(124,92,255,.12));}
#page-app .navItem[data-go="wallet"].is-active{background:linear-gradient(135deg, rgba(40,221,143,.32), rgba(40,221,143,.12));}
#page-app .navItem[data-go="more"].is-active{background:linear-gradient(135deg, rgba(255,184,77,.35), rgba(255,184,77,.12));}
.sectionHeader__meta,.screenHero__eyebrow,.heroPanel__eyebrow,.marketInsight__eyebrow,.assetAsideCard__eyebrow,.walletAside__eyebrow{letter-spacing:.08em;}


/* v4.10.0 high-contrast Korean UI + colorful navigation */
#page-app,
#page-app .screen,
#page-app .content{
  color:#f6fbff;
}
#page-app :where(h1,h2,h3,h4,h5,h6,p,span,div,label,button,a,th,td,strong,small){
  color:#f6fbff;
}
#page-app :where(.heroPanel__text,.screenHero__text,.featurePanel__text,.securityBanner__text,.showcaseCard__meta,.marketInsight p,.assetAsideCard p,.walletAside__card p,.newsItem__desc,.newsItem__meta,.activityItem__sub,.activityItem__meta,.coinTicker,.holdingSub,.muted,.sub,.neu,.label,.sectionLabel,.sectionHeader__meta,.portfolioHero__sub,.estimateCard__label,.balLine span){
  color:#cfe2ff !important;
}
#page-app :where(.topbar__headline,.heroPanel__title,.screenHero__title,.featurePanel__title,.securityBanner__title,.coinName,.coinPrice,.holdingAmt,.holdingValue,.statCard__value,.showcaseCard__value,.activityItem__title,.newsItem__title,.menuItem__text,.menuItem__title,.adminTable th,.adminTable td){
  color:#ffffff !important;
}
#page-app .pos{color:#ff6d7a !important;}
#page-app .neg{color:#58a6ff !important;}
#page-app .coinChange.pos{color:#ff6d7a !important;}
#page-app .coinChange.neg{color:#58a6ff !important;}
#page-app .input,
#page-app .input--light,
#page-app .select,
#page-app textarea,
#page-app input{
  color:#ffffff !important;
}
#page-app .input::placeholder,
#page-app .input--light::placeholder,
#page-app textarea::placeholder,
#page-app input::placeholder{
  color:rgba(230,242,255,.58) !important;
}
#page-app .card,
#page-app .portfolioHero,
#page-app .statCard,
#page-app .menuItem,
#page-app .estimateCard,
#page-app .securityBanner,
#page-app .screenHero,
#page-app .walletAside__card,
#page-app .featurePanel,
#page-app .showcaseCard,
#page-app .moreHero,
#page-app .marketShell,
#page-app .tableWrap,
#page-app .activityItem,
#page-app .homeActivityItem,
#page-app .newsItem,
#page-app .coinRow,
#page-app .holdingRow{
  background:linear-gradient(180deg, rgba(12,28,58,.96), rgba(5,13,30,.99)) !important;
  border-color:rgba(114,178,255,.24) !important;
}

#page-app .bottomNav{
  background:
    linear-gradient(90deg,
      rgba(27,224,255,.96) 0%,
      rgba(91,96,255,.96) 24%,
      rgba(190,63,255,.96) 48%,
      rgba(255,80,144,.96) 72%,
      rgba(255,190,62,.96) 100%) !important;
  border:1px solid rgba(255,255,255,.20) !important;
  border-radius:30px !important;
  padding:16px 18px !important;
  gap:12px !important;
  box-shadow:0 24px 60px rgba(0,0,0,.42), 0 0 42px rgba(35,201,255,.22) !important;
}
#page-app .navItem{
  min-height:72px !important;
  padding:18px 22px !important;
  border-radius:22px !important;
  color:#ffffff !important;
  background:rgba(3,9,24,.24) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18), 0 10px 24px rgba(0,0,0,.18) !important;
  backdrop-filter:blur(14px);
}
#page-app .navItem__icon{
  font-size:26px !important;
  filter:drop-shadow(0 6px 10px rgba(0,0,0,.22));
}
#page-app .navIconSvg{
  width:28px !important;
  height:28px !important;
}
#page-app .navItem__label{
  font-size:18px !important;
  font-weight:900 !important;
  letter-spacing:-.02em;
  color:#ffffff !important;
}
#page-app .navItem[data-go="home"]{background:linear-gradient(135deg, rgba(50,229,255,.90), rgba(178,54,255,.72)) !important;}
#page-app .navItem[data-go="coin"]{background:linear-gradient(135deg, rgba(255,72,118,.92), rgba(255,141,43,.72)) !important;}
#page-app .navItem[data-go="asset"]{background:linear-gradient(135deg, rgba(143,96,255,.92), rgba(71,119,255,.72)) !important;}
#page-app .navItem[data-go="wallet"]{background:linear-gradient(135deg, rgba(20,224,161,.90), rgba(29,170,255,.70)) !important;}
#page-app .navItem[data-go="more"]{background:linear-gradient(135deg, rgba(255,205,66,.94), rgba(255,111,64,.72)) !important;}
#page-app .navItem.is-active{
  transform:translateY(-2px);
  background:rgba(255,255,255,.25) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.36), 0 16px 34px rgba(0,0,0,.26), 0 0 0 2px rgba(255,255,255,.18) !important;
}
#page-app .navItem.is-active .navItem__label,
#page-app .navItem.is-active .navItem__icon{
  color:#fff !important;
}

@media (min-width: 761px){
  #page-app .bottomNav{
    min-height:96px;
    justify-content:space-between !important;
  }
  #page-app .navItem{
    flex:1 1 0 !important;
    min-width:150px !important;
  }
}
@media (max-width: 760px){
  #page-app .bottomNav{
    padding:10px 8px !important;
    gap:6px !important;
    border-radius:24px !important;
  }
  #page-app .navItem{
    min-height:62px !important;
    padding:10px 6px !important;
    border-radius:18px !important;
  }
  #page-app .navIconSvg{width:23px !important;height:23px !important;}
  #page-app .navItem__label{font-size:12px !important;}
}

/* v4.10.2 curated rework: cohesive midnight glass palette, no reference-image dependency */
#page-app{
  --nav-bg-a: rgba(8,18,42,.96);
  --nav-bg-b: rgba(12,24,58,.94);
  --nav-line: rgba(143,180,255,.20);
  --nav-text: #f3f8ff;
  --nav-muted: rgba(222,236,255,.72);
  --tab-home: 74,144,255;
  --tab-home2: 34,211,238;
  --tab-coin: 255,103,125;
  --tab-coin2: 255,159,89;
  --tab-asset: 151,117,255;
  --tab-asset2: 91,141,255;
  --tab-wallet: 42,218,175;
  --tab-wallet2: 61,166,255;
  --tab-more: 247,185,78;
  --tab-more2: 239,119,95;
}
#page-app .bottomNav{
  background:
    radial-gradient(580px 170px at 16% 0%, rgba(99,102,241,.22), transparent 60%),
    radial-gradient(560px 160px at 86% 0%, rgba(34,211,238,.16), transparent 58%),
    linear-gradient(135deg, var(--nav-bg-a), var(--nav-bg-b) 52%, rgba(6,17,39,.96)) !important;
  border:1px solid var(--nav-line) !important;
  border-radius:30px !important;
  padding:13px !important;
  gap:10px !important;
  box-shadow:
    0 24px 60px rgba(0,0,0,.38),
    inset 0 1px 0 rgba(255,255,255,.10),
    inset 0 -1px 0 rgba(255,255,255,.04) !important;
}
#page-app .navItem{
  position:relative;
  overflow:hidden;
  min-height:70px !important;
  padding:15px 18px !important;
  border-radius:22px !important;
  background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.025)) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  color:var(--nav-text) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08) !important;
  backdrop-filter:blur(18px);
  transition:transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
#page-app .navItem::after{
  content:"";
  position:absolute;
  left:18px;
  right:18px;
  bottom:9px;
  height:3px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(var(--tab-a),.0), rgba(var(--tab-a),.85), rgba(var(--tab-b),.65), rgba(var(--tab-b),.0));
  opacity:.20;
  transform:scaleX(.62);
  transition:opacity .18s ease, transform .18s ease;
}
#page-app .navItem:hover{
  transform:translateY(-1px);
  border-color:rgba(201,223,255,.18) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.095), rgba(255,255,255,.038)) !important;
}
#page-app .navItem:hover::after{opacity:.45;transform:scaleX(.86);}
#page-app .navItem__icon{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  width:40px !important;
  height:40px !important;
  margin:0 !important;
  border-radius:15px;
  background:linear-gradient(135deg, rgba(var(--tab-a),.24), rgba(var(--tab-b),.12));
  border:1px solid rgba(var(--tab-a),.22);
  color:#fff !important;
  font-size:22px !important;
}
#page-app .navIconSvg{
  width:24px !important;
  height:24px !important;
}
#page-app .navItem__label{
  color:var(--nav-text) !important;
  font-size:16px !important;
  font-weight:850 !important;
  letter-spacing:-.015em;
}
#page-app .navItem[data-go="home"]{--tab-a:var(--tab-home);--tab-b:var(--tab-home2);}
#page-app .navItem[data-go="coin"]{--tab-a:var(--tab-coin);--tab-b:var(--tab-coin2);}
#page-app .navItem[data-go="asset"]{--tab-a:var(--tab-asset);--tab-b:var(--tab-asset2);}
#page-app .navItem[data-go="wallet"]{--tab-a:var(--tab-wallet);--tab-b:var(--tab-wallet2);}
#page-app .navItem[data-go="more"]{--tab-a:var(--tab-more);--tab-b:var(--tab-more2);}
#page-app .navItem[data-go]{
  background:
    linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.026)),
    radial-gradient(120px 90px at 22% 16%, rgba(var(--tab-a),.10), transparent 66%) !important;
  border-color:rgba(var(--tab-a),.16) !important;
}
#page-app .navItem.is-active{
  transform:translateY(-2px);
  background:
    linear-gradient(135deg, rgba(var(--tab-a),.32), rgba(var(--tab-b),.16)),
    linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.03)) !important;
  border-color:rgba(var(--tab-a),.42) !important;
  box-shadow:
    0 16px 36px rgba(0,0,0,.30),
    0 0 24px rgba(var(--tab-a),.18),
    inset 0 1px 0 rgba(255,255,255,.18) !important;
}
#page-app .navItem.is-active::after{
  opacity:1;
  transform:scaleX(1);
}
#page-app .navItem.is-active .navItem__icon{
  background:linear-gradient(135deg, rgba(var(--tab-a),.92), rgba(var(--tab-b),.68));
  border-color:rgba(255,255,255,.26);
  box-shadow:0 10px 24px rgba(var(--tab-a),.18);
}
#page-app .navItem.is-active .navItem__label{color:#fff !important;}

/* Make the main dark cards feel consistent with the refined nav palette */
#page-app .topbar,
#page-app .screenHero,
#page-app .heroPanel--desktop,
#page-app .marketShell,
#page-app .portfolioHero,
#page-app .walletForm,
#page-app .moreHero,
#page-app .tableWrap{
  border-color:rgba(143,180,255,.20) !important;
  box-shadow:0 22px 55px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.045) !important;
}

@media (min-width: 761px){
  #page-app .bottomNav{min-height:92px !important;}
  #page-app .navItem{flex:1 1 0 !important;min-width:138px !important;gap:12px !important;}
}
@media (max-width: 760px){
  #page-app .bottomNav{
    padding:8px !important;
    gap:6px !important;
    border-radius:22px !important;
  }
  #page-app .navItem{
    min-height:60px !important;
    padding:8px 5px !important;
    border-radius:16px !important;
    gap:5px !important;
  }
  #page-app .navItem__icon{
    width:30px !important;
    height:30px !important;
    border-radius:11px;
  }
  #page-app .navIconSvg{width:20px !important;height:20px !important;}
  #page-app .navItem__label{font-size:12px !important;}
  #page-app .navItem::after{left:10px;right:10px;bottom:5px;height:2px;}
}


/* v4.11 Pieverse rebrand: black cat, mint glow and warm timepot accents */
:root{
  --pie-mint:#00f5c8;
  --pie-teal:#4df4ff;
  --pie-gold:#ffd66b;
  --pie-ink:#050608;
  --pie-card:#0c1118;
  --pie-card2:#111823;
}
body{
  background:
    radial-gradient(900px 540px at 12% 0%, rgba(0,245,200,.13), transparent 58%),
    radial-gradient(780px 460px at 88% 8%, rgba(255,214,107,.12), transparent 60%),
    radial-gradient(620px 420px at 56% 102%, rgba(77,244,255,.10), transparent 58%),
    linear-gradient(180deg, #040508 0%, #071018 46%, #030506 100%) !important;
}
.brand__name, .authTitle, .heroPanel__title, .h1, .h2, .screenHero__title{
  font-family:"Space Grotesk", "Inter", "Noto Sans KR", sans-serif;
  letter-spacing:-.035em;
}
.brand__kite{color:#f8fff9 !important;}
.brand__wallet{color:var(--pie-mint) !important;}
.authOrb{
  background:radial-gradient(circle, rgba(0,245,200,.95), rgba(255,214,107,.45) 45%, transparent 72%) !important;
}
.authBadge,
.heroPanel__eyebrow,
.screenHero__eyebrow,
.marketInsight__eyebrow,
.assetAsideCard__eyebrow,
.walletAside__eyebrow,
.authCard__eyebrow{
  color:var(--pie-mint) !important;
}
.btn--primary,
.authSubmit{
  background:linear-gradient(135deg, #00f5c8, #68f7ff 58%, #ffd66b) !important;
  color:#03100d !important;
  box-shadow:0 18px 42px rgba(0,245,200,.20) !important;
}
.btn--primary:hover,
.authSubmit:hover{filter:saturate(1.05) brightness(1.03)}
.pill, .topbarBadge--live{
  border-color:rgba(0,245,200,.28) !important;
  color:#d9fff7 !important;
  background:rgba(0,245,200,.08) !important;
}
#page-app .bottomNav{
  background:
    radial-gradient(520px 170px at 8% 0%, rgba(0,245,200,.22), transparent 62%),
    radial-gradient(520px 170px at 90% 0%, rgba(255,214,107,.13), transparent 62%),
    linear-gradient(135deg, rgba(7,11,16,.96), rgba(13,25,31,.96), rgba(6,8,12,.98)) !important;
}
#page-app{
  --tab-home: 0,245,200;
  --tab-home2: 77,244,255;
  --tab-coin: 255,214,107;
  --tab-coin2: 0,245,200;
  --tab-asset: 116,103,255;
  --tab-asset2: 77,244,255;
  --tab-wallet: 0,245,200;
  --tab-wallet2: 255,214,107;
  --tab-more: 255,214,107;
  --tab-more2: 255,142,93;
}
.brand__logo, .topbar__logo{
  background:linear-gradient(135deg, rgba(255,255,255,.96), rgba(209,255,247,.90)) !important;
  border-color:rgba(0,245,200,.35) !important;
}
.coinRow[data-ticker="PIEVERSE"]{
  border-color:rgba(0,245,200,.42) !important;
  box-shadow:0 0 0 1px rgba(0,245,200,.12), 0 20px 50px rgba(0,245,200,.08) !important;
}
.coinIcon--img img[src*="pieverse"]{
  filter:drop-shadow(0 8px 14px rgba(0,245,200,.18));
}


/* v4.11.1 Pieverse logo and brighter harmonized navigation (base) */
.brand__img--mark,
.brand__img--icon{
  object-fit:contain !important;
  padding:0 !important;
  transform:scale(.94);
}
.brand__logo,
.topbar__logo{
  background:linear-gradient(135deg, rgba(255,255,255,.99), rgba(224,255,248,.96)) !important;
  border-color:rgba(0,245,200,.42) !important;
}
#page-app .bottomNav{
  background:
    radial-gradient(680px 210px at 8% -20%, rgba(0,245,200,.38), transparent 62%),
    radial-gradient(640px 210px at 92% -18%, rgba(255,214,107,.27), transparent 64%),
    radial-gradient(520px 170px at 52% 112%, rgba(77,244,255,.20), transparent 70%),
    linear-gradient(135deg, rgba(13,35,43,.98), rgba(17,47,56,.98) 48%, rgba(10,20,28,.98)) !important;
  border-color:rgba(124,255,229,.34) !important;
  box-shadow:
    0 26px 62px rgba(0,0,0,.34),
    0 0 42px rgba(0,245,200,.10),
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -1px 0 rgba(255,255,255,.05) !important;
}
#page-app .navItem{
  background:
    linear-gradient(180deg, rgba(255,255,255,.105), rgba(255,255,255,.040)),
    radial-gradient(130px 92px at 26% 10%, rgba(var(--tab-a),.12), transparent 68%) !important;
  border-color:rgba(217,255,249,.16) !important;
}
#page-app .navItem:hover{
  background:
    linear-gradient(180deg, rgba(255,255,255,.15), rgba(255,255,255,.055)),
    radial-gradient(150px 100px at 24% 12%, rgba(var(--tab-a),.18), transparent 68%) !important;
  border-color:rgba(217,255,249,.28) !important;
}
#page-app .navItem.is-active{
  background:
    linear-gradient(135deg, rgba(0,245,200,.30), rgba(255,214,107,.12)),
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.055)) !important;
  border-color:rgba(0,245,200,.44) !important;
  box-shadow:
    0 18px 38px rgba(0,0,0,.28),
    0 0 28px rgba(0,245,200,.18),
    inset 0 1px 0 rgba(255,255,255,.24) !important;
}
.coinIcon--img img[src*="pieverse"]{
  filter:none !important;
  border-radius:50%;
}


/* v4.11.2 Pieverse polish: brighter menu, clean logo, text-only news, stable auth fields */
.brand__logo,
.topbar__logo{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
}
.brand__logo{
  width:64px !important;
  height:64px !important;
  border-radius:50% !important;
}
.brand__logo--sm,
.topbar__logo{
  width:56px !important;
  height:56px !important;
  border-radius:50% !important;
}
.brand__img--mark,
.brand__img--icon{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  transform:none !important;
  border-radius:50% !important;
}
.topbar__brand{gap:14px !important;}

#page-app .bottomNav{
  background:
    radial-gradient(720px 220px at 10% -30%, rgba(0,245,200,.48), transparent 62%),
    radial-gradient(720px 220px at 90% -28%, rgba(255,214,107,.34), transparent 66%),
    radial-gradient(580px 190px at 50% 120%, rgba(77,244,255,.26), transparent 70%),
    linear-gradient(135deg, rgba(20,62,72,.98), rgba(22,72,82,.98) 48%, rgba(16,38,52,.98)) !important;
  border-color:rgba(181,255,241,.42) !important;
  box-shadow:
    0 26px 62px rgba(0,0,0,.28),
    0 0 46px rgba(0,245,200,.16),
    inset 0 1px 0 rgba(255,255,255,.23),
    inset 0 -1px 0 rgba(255,255,255,.07) !important;
}
#page-app .navItem{
  background:
    linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.055)),
    radial-gradient(150px 110px at 25% 10%, rgba(var(--tab-a),.15), transparent 68%) !important;
  border-color:rgba(231,255,250,.20) !important;
}
#page-app .navItem.is-active{
  background:
    linear-gradient(135deg, rgba(0,245,200,.42), rgba(255,214,107,.18)),
    linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.07)) !important;
  border-color:rgba(0,245,200,.56) !important;
  box-shadow:
    0 18px 38px rgba(0,0,0,.25),
    0 0 30px rgba(0,245,200,.22),
    inset 0 1px 0 rgba(255,255,255,.28) !important;
}

.newsLink{grid-template-columns:1fr !important;}
.newsLink .thumb,
.newsItem .thumb,
.thumb--img,
.thumb--fallback{display:none !important;}
.newsItem{padding:18px 20px !important;}
.newsItem__title{font-size:15px !important;}
.newsItem__desc{font-size:13px !important;}

/* keep auth id/password fields visually identical on focus/autofill */
#page-login .field,
#page-register .field{
  background:linear-gradient(180deg, rgba(13,28,46,.90), rgba(7,14,24,.96)) !important;
  border:1px solid rgba(0,245,200,.18) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06) !important;
}
#page-login .field:focus-within,
#page-register .field:focus-within{
  background:linear-gradient(180deg, rgba(13,28,46,.90), rgba(7,14,24,.96)) !important;
  border-color:rgba(0,245,200,.42) !important;
  box-shadow:0 0 0 3px rgba(0,245,200,.12), inset 0 1px 0 rgba(255,255,255,.06) !important;
}
#page-login .input,
#page-register .input{
  background:transparent !important;
  color:#ffffff !important;
}
#page-login .input::placeholder,
#page-register .input::placeholder{color:rgba(231,247,255,.54) !important;}
#page-login input:-webkit-autofill,
#page-register input:-webkit-autofill{
  -webkit-text-fill-color:#ffffff !important;
  box-shadow:0 0 0 1000px #0b1829 inset !important;
  transition:background-color 9999s ease-in-out 0s !important;
}


/* v4.11.2 Pieverse: official round logo, brighter menu glass, news text-only, auth focus fix */
#page-app .topbar__logo{
  width:60px !important;
  height:60px !important;
  min-width:60px !important;
  border:none !important;
  background:transparent !important;
  box-shadow:none !important;
  border-radius:50% !important;
  overflow:hidden !important;
}
#page-app .topbar__logo .brand__img--icon{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  border-radius:50% !important;
  transform:none !important;
  padding:0 !important;
}
#page-app .bottomNav{
  background:
    radial-gradient(720px 230px at 10% -18%, rgba(0,245,200,.46), transparent 63%),
    radial-gradient(680px 230px at 92% -16%, rgba(255,214,107,.32), transparent 64%),
    radial-gradient(520px 170px at 50% 116%, rgba(77,244,255,.24), transparent 70%),
    linear-gradient(135deg, rgba(18,58,62,.98), rgba(24,78,76,.98) 48%, rgba(18,42,54,.98)) !important;
  border-color:rgba(151,255,235,.42) !important;
  box-shadow:
    0 26px 62px rgba(0,0,0,.30),
    0 0 46px rgba(0,245,200,.14),
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -1px 0 rgba(255,255,255,.06) !important;
}
#page-app .navItem{
  background:
    linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.052)),
    radial-gradient(140px 98px at 26% 10%, rgba(var(--tab-a),.14), transparent 70%) !important;
  border-color:rgba(232,255,250,.20) !important;
}
#page-app .navItem.is-active{
  background:
    linear-gradient(135deg, rgba(0,245,200,.38), rgba(255,214,107,.16)),
    linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.06)) !important;
  border-color:rgba(0,245,200,.55) !important;
}
.newsLink{color:#f6fbff !important;}
.newsLink:visited{color:#f6fbff !important;}
.newsText{width:100%;min-width:0;}
.newsItem{padding:16px 18px !important;}
.newsItem__title{font-size:15px !important;color:#f6fbff !important;}
.newsItem__meta,.newsItem__desc{color:rgba(226,238,255,.72) !important;}
.thumb{display:none !important;}
#page-login .field,
#page-signup .field{
  background:linear-gradient(180deg, rgba(11,23,47,.88), rgba(7,14,28,.96)) !important;
  border-color:rgba(120,180,255,.20) !important;
  color:#fff !important;
}
#page-login .field:focus-within,
#page-signup .field:focus-within{
  background:linear-gradient(180deg, rgba(12,28,54,.94), rgba(7,15,30,.98)) !important;
  border-color:rgba(0,245,200,.46) !important;
  box-shadow:0 0 0 3px rgba(0,245,200,.14), inset 0 1px 0 rgba(255,255,255,.08) !important;
}
#page-login .input,
#page-signup .input{
  background:transparent !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  caret-color:#00f5c8 !important;
}
#page-login .input:focus,
#page-signup .input:focus{
  background:transparent !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
}
#page-login input:-webkit-autofill,
#page-signup input:-webkit-autofill{
  -webkit-box-shadow:0 0 0 1000px rgba(9,19,39,.98) inset !important;
  -webkit-text-fill-color:#ffffff !important;
  transition:background-color 9999s ease-out 0s !important;
}
.coinIcon--img img[src*="pieverse"]{
  border-radius:50% !important;
  object-fit:cover !important;
}


/* v4.11.2 Pieverse polish: live price, brighter nav, clean logo/news/forms */
#page-app .bottomNav{
  background:
    radial-gradient(720px 220px at 12% -26%, rgba(0,245,200,.45), transparent 60%),
    radial-gradient(660px 210px at 88% -22%, rgba(255,214,107,.34), transparent 62%),
    radial-gradient(560px 180px at 52% 112%, rgba(77,244,255,.24), transparent 68%),
    linear-gradient(135deg, rgba(18,55,61,.98), rgba(25,72,73,.98) 50%, rgba(17,34,39,.98)) !important;
  border-color:rgba(180,255,238,.38) !important;
  box-shadow:
    0 26px 62px rgba(0,0,0,.30),
    0 0 46px rgba(0,245,200,.14),
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -1px 0 rgba(255,255,255,.06) !important;
}
#page-app .navItem{
  background:
    linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.052)),
    radial-gradient(150px 102px at 24% 12%, rgba(var(--tab-a),.14), transparent 70%) !important;
  border-color:rgba(229,255,251,.20) !important;
}
#page-app .navItem:hover{
  background:
    linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.07)),
    radial-gradient(170px 112px at 24% 12%, rgba(var(--tab-a),.20), transparent 70%) !important;
}
#page-app .navItem.is-active{
  background:
    linear-gradient(135deg, rgba(0,245,200,.38), rgba(255,214,107,.18)),
    linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.068)) !important;
  border-color:rgba(0,245,200,.55) !important;
}
/* App top logo: larger, no colored wrapper/border. The uploaded round logo is displayed as-is. */
#page-app .topbar__logo{
  width:64px !important;
  height:64px !important;
  min-width:64px !important;
  border:none !important;
  background:transparent !important;
  box-shadow:none !important;
  padding:0 !important;
  overflow:visible !important;
}
#page-app .topbar__logo .brand__img--icon,
#page-app .topbar__logo img{
  width:64px !important;
  height:64px !important;
  object-fit:contain !important;
  border-radius:50% !important;
  transform:none !important;
  padding:0 !important;
  background:transparent !important;
}
/* Keep auth logo clean while slightly larger */
.authLogo{
  width:74px !important;
  height:74px !important;
  border:none !important;
  background:transparent !important;
  box-shadow:none !important;
}
.authLogo img{width:74px !important;height:74px !important;object-fit:contain !important;border-radius:50% !important;transform:none !important;}
/* News: text-only article cards, no logos/thumbnails. */
.newsLink{gap:0 !important;}
.newsLink .thumb{display:none !important;}
.newsList--featured .newsItem{padding:18px 20px !important;}
.newsText{width:100% !important;}
.newsItem__title{font-size:15px !important;line-height:1.35 !important;-webkit-line-clamp:3 !important;}
.newsItem__meta{font-size:12px !important;opacity:.82;}
.newsItem__desc{font-size:13px !important;line-height:1.48 !important;margin-top:8px !important;}
/* Login/signup fields: focusing 아이디 input should not turn white. */
.authCard .field,
.authCard .field:focus-within{
  background:linear-gradient(180deg, rgba(11,23,47,.92), rgba(7,14,28,.98)) !important;
  border-color:rgba(120,180,255,.22) !important;
}
.authCard .field:focus-within{
  border-color:rgba(0,245,200,.45) !important;
  box-shadow:0 0 0 3px rgba(0,245,200,.12), inset 0 1px 0 rgba(255,255,255,.08) !important;
}
.authCard input,
.authCard .input{
  background:transparent !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  caret-color:var(--pie-mint) !important;
}
.authCard input:focus,
.authCard .input:focus{
  background:transparent !important;
  outline:none !important;
}
.authCard input:-webkit-autofill,
.authCard input:-webkit-autofill:hover,
.authCard input:-webkit-autofill:focus,
.authCard input:-webkit-autofill:active{
  -webkit-box-shadow:0 0 0 1000px rgba(11,23,47,.98) inset !important;
  box-shadow:0 0 0 1000px rgba(11,23,47,.98) inset !important;
  -webkit-text-fill-color:#ffffff !important;
  caret-color:var(--pie-mint) !important;
}


/* v4.11.2 Pieverse live-price + logo + brighter refined UI */
/* topbar/menu logo: larger, circular, no colored border */
.topbar__logo.brand__logo--sm,
#page-app .topbar__logo.brand__logo--sm{
  width:46px !important;
  height:46px !important;
  min-width:46px !important;
  border-radius:50% !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  overflow:hidden !important;
  padding:0 !important;
}
.topbar__logo .brand__img--icon,
#page-app .topbar__logo .brand__img--icon{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  border-radius:50% !important;
  transform:none !important;
  padding:0 !important;
}
.brand__logo.authLogo{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  overflow:hidden !important;
  border-radius:50% !important;
}
.brand__logo.authLogo .brand__img--mark{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  border-radius:50% !important;
  transform:none !important;
}
.coinIcon--img img[src*="pieverse"]{
  border-radius:50% !important;
  object-fit:cover !important;
  background:#fff !important;
}

/* login ID field focus: keep the same dark surface as password field */
.authCard .field,
.authCard .field:focus-within,
#loginForm .field,
#loginForm .field:focus-within,
#signupForm .field,
#signupForm .field:focus-within{
  background:linear-gradient(180deg, rgba(10,23,45,.96), rgba(7,15,31,.98)) !important;
  border-color:rgba(122,240,255,.28) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 0 0 1px rgba(0,245,200,.05) !important;
}
.authCard input,
.authCard input:focus,
.authCard .input,
.authCard .input:focus{
  background:transparent !important;
  color:#f5fbff !important;
  -webkit-text-fill-color:#f5fbff !important;
}
.authCard input::placeholder,
.authCard .input::placeholder{color:rgba(220,238,255,.48) !important;}
.authCard input:-webkit-autofill,
.authCard input:-webkit-autofill:hover,
.authCard input:-webkit-autofill:focus{
  -webkit-text-fill-color:#f5fbff !important;
  box-shadow:0 0 0 1000px #08182e inset !important;
  transition:background-color 9999s ease-out 0s !important;
}

/* homepage news: text-only press list, no logo/image thumbnails */
.newsLink{gap:0 !important;}
.newsItem{padding:16px 18px !important;}
.newsText{width:100% !important;}
.newsList .thumb,
.newsList--featured .thumb,
.newsList--sidebar .thumb{display:none !important;}

/* brighter but still elegant Pieverse menu bar */
#page-app .bottomNav{
  background:
    radial-gradient(760px 220px at 8% -24%, rgba(0,245,200,.48), transparent 62%),
    radial-gradient(760px 230px at 92% -18%, rgba(255,214,107,.32), transparent 64%),
    radial-gradient(620px 180px at 52% 118%, rgba(77,244,255,.24), transparent 70%),
    linear-gradient(135deg, rgba(18,57,66,.98), rgba(20,70,78,.98) 48%, rgba(12,35,49,.98)) !important;
  border-color:rgba(168,255,239,.40) !important;
  box-shadow:
    0 28px 64px rgba(0,0,0,.30),
    0 0 48px rgba(0,245,200,.16),
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -1px 0 rgba(255,255,255,.07) !important;
}
#page-app .navItem{
  background:
    linear-gradient(180deg, rgba(255,255,255,.15), rgba(255,255,255,.055)),
    radial-gradient(140px 94px at 24% 8%, rgba(var(--tab-a),.14), transparent 68%) !important;
  border-color:rgba(229,255,251,.20) !important;
}
#page-app .navItem.is-active{
  background:
    linear-gradient(135deg, rgba(0,245,200,.36), rgba(255,214,107,.16)),
    linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,.07)) !important;
  border-color:rgba(0,245,200,.52) !important;
}

/* v4.11.2 final requested polish: larger clean top logo, brighter balanced menu, text-only news, stable auth field */
#page-app .topbar__logo.brand__logo--sm,
#page-app .topbar__logo{
  width:58px !important;
  height:58px !important;
  min-width:58px !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  padding:0 !important;
  overflow:visible !important;
  border-radius:50% !important;
}
#page-app .topbar__logo img,
#page-app .topbar__logo .brand__img--icon{
  width:58px !important;
  height:58px !important;
  object-fit:contain !important;
  background:transparent !important;
  border:none !important;
  border-radius:50% !important;
  padding:0 !important;
  transform:none !important;
}
#page-app .topbar__brand{gap:16px !important;}
#page-app .bottomNav{
  background:
    radial-gradient(820px 240px at 10% -24%, rgba(0,245,200,.50), transparent 62%),
    radial-gradient(760px 230px at 88% -20%, rgba(255,214,107,.36), transparent 64%),
    radial-gradient(620px 180px at 50% 118%, rgba(77,244,255,.25), transparent 70%),
    linear-gradient(135deg, rgba(21,63,70,.98), rgba(26,80,78,.98) 50%, rgba(15,40,54,.98)) !important;
  border-color:rgba(180,255,240,.44) !important;
}
#page-app .navItem{
  background:
    linear-gradient(180deg, rgba(255,255,255,.15), rgba(255,255,255,.055)),
    radial-gradient(150px 102px at 24% 12%, rgba(var(--tab-a),.15), transparent 70%) !important;
}
#page-app .navItem.is-active{
  background:
    linear-gradient(135deg, rgba(0,245,200,.40), rgba(255,214,107,.18)),
    linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,.07)) !important;
}
.newsLink .thumb,
.newsItem .thumb,
.thumb--img,
.thumb--fallback{display:none !important;}
.newsLink{grid-template-columns:1fr !important;gap:0 !important;}
.newsText{width:100% !important;}
.authCard .field,
.authCard .field:focus-within,
#loginForm .field,
#loginForm .field:focus-within,
#signupForm .field,
#signupForm .field:focus-within{
  background:linear-gradient(180deg, rgba(10,23,45,.96), rgba(7,15,31,.98)) !important;
  border-color:rgba(122,240,255,.28) !important;
}
.authCard input,
.authCard input:focus,
.authCard .input,
.authCard .input:focus{
  background:transparent !important;
  color:#f5fbff !important;
  -webkit-text-fill-color:#f5fbff !important;
}

/* Admin amount input helper */
.adminHint{margin:10px 0 0;color:#cfe7ff;font-size:.9rem;line-height:1.55}


/* v4.12.0 admin fixed system price */
.input--fixed,
.input--light[readonly]{
  cursor: not-allowed;
  background: linear-gradient(180deg, rgba(30,45,74,.96), rgba(17,31,57,.96)) !important;
  border-color: rgba(255,214,112,.28) !important;
  color: #fff4c7 !important;
}

/* v4.12.2 admin member management */
.adminManageGrid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.adminManageCard .label{color:rgba(245,248,255,.9)}
.adminDivider{
  height:1px;
  margin:18px 0;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent);
}
@media (max-width: 900px){
  .adminManageGrid{grid-template-columns:1fr}
}

/* =========================================================
   STORY WALLET DRAFT v1.0 — Story brand kit inspired layout
   Palette: Ice, Sky Blue, Mint, True Blue, Navy, Black, White
   ========================================================= */

body.storyTheme{
  --story-black:#000000;
  --story-white:#ffffff;
  --story-ice:#E9F6FF;
  --story-sky:#41B5FF;
  --story-mint:#99F3FB;
  --story-blue:#1380F5;
  --story-light:#81CEFF;
  --story-navy:#192032;
  --story-teal:#3480B1;
  --story-gold:#F4D36F;
  --story-line:rgba(25,32,50,.14);
  --story-shadow:0 24px 65px rgba(25,32,50,.11);
  --story-shadow-sm:0 10px 30px rgba(25,32,50,.08);
  margin:0;
  color:var(--story-navy);
  font-family:'DM Sans','Noto Sans KR',system-ui,sans-serif;
  background:
    linear-gradient(rgba(19,128,245,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(19,128,245,.035) 1px,transparent 1px),
    #f7fbff;
  background-size:32px 32px;
}
body.storyTheme *{box-sizing:border-box}
body.storyTheme button,body.storyTheme input,body.storyTheme select,body.storyTheme textarea{font:inherit}
body.storyTheme .muted,body.storyTheme .sub{color:#65738b!important}
body.storyTheme .h1,body.storyTheme .h2,body.storyTheme h1,body.storyTheme h2,body.storyTheme h3{color:var(--story-navy)}
body.storyTheme .hidden{display:none!important}
body.storyTheme .page{min-height:100vh}
body.storyTheme .app{max-width:none!important;width:100%!important;margin:0!important;padding:0!important}

/* Auth — editorial split page, intentionally unlike previous wallet projects */
body.storyTheme .authPage{
  padding:0!important;
  background:
    radial-gradient(circle at 14% 14%,rgba(153,243,251,.7),transparent 26%),
    radial-gradient(circle at 92% 90%,rgba(65,181,255,.35),transparent 24%),
    #fff;
}
body.storyTheme .authShell{
  width:100%;min-height:100vh;margin:0!important;
  display:grid!important;grid-template-columns:minmax(0,1.15fr) minmax(420px,.85fr)!important;
  gap:0!important;align-items:stretch!important;
}
body.storyTheme .authVisual{
  position:relative;overflow:hidden;
  padding:clamp(42px,6vw,96px);
  background:
    linear-gradient(135deg,#052453 0%,#1380F5 52%,#99F3FB 120%);
  color:white;
  display:flex;flex-direction:column;justify-content:center;
  min-height:100vh;
}
body.storyTheme .authVisual::before{
  content:"$IP";position:absolute;right:-5vw;bottom:-12vh;
  font:800 clamp(180px,30vw,520px)/.76 'DM Sans',sans-serif;
  color:rgba(255,255,255,.07);letter-spacing:-.12em;
}
body.storyTheme .authVisual::after{
  content:"";position:absolute;width:320px;height:320px;border:1px solid rgba(255,255,255,.22);
  border-radius:48% 52% 36% 64%/58% 34% 66% 42%;right:8%;top:10%;transform:rotate(22deg);
}
body.storyTheme .authBadge{
  position:relative;z-index:1;align-self:flex-start;
  font:600 12px/1 'IBM Plex Mono',monospace;letter-spacing:.13em;
  color:var(--story-mint);background:rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.25);
  padding:10px 13px;border-radius:2px!important;
}
body.storyTheme .brand--hero{position:relative;z-index:2;margin-top:34px;display:block!important}
body.storyTheme .authLogo{width:min(520px,82%);height:auto!important;background:none!important;border:0!important;box-shadow:none!important;padding:0!important}
body.storyTheme .brand__img--wordmark{width:100%;height:auto;object-fit:contain;filter:invert(1);display:block}
body.storyTheme .brand--hero .brand__name{display:none}
body.storyTheme .authTitle{
  position:relative;z-index:1;margin:46px 0 18px!important;max-width:780px;
  color:white!important;font-size:clamp(52px,6.2vw,106px)!important;line-height:.93!important;
  letter-spacing:-.065em!important;font-weight:800!important;word-break:keep-all;
}
body.storyTheme .authLead{position:relative;z-index:1;max-width:690px;color:rgba(255,255,255,.82)!important;font-size:18px;line-height:1.75;margin:0}
body.storyTheme .heroDevice{
  position:relative;z-index:1;margin-top:38px;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;
}
body.storyTheme .heroDevice__top{display:flex;justify-content:space-between;max-width:620px;font:600 11px/1 'IBM Plex Mono',monospace;letter-spacing:.12em;color:rgba(255,255,255,.8)}
body.storyTheme .heroDevice__pill{color:var(--story-gold)}
body.storyTheme .heroDevice__grid{margin-top:12px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;max-width:720px;background:rgba(255,255,255,.22);border:1px solid rgba(255,255,255,.22)}
body.storyTheme .heroMiniCard{border:0!important;border-radius:0!important;background:rgba(2,22,61,.52)!important;padding:18px!important;min-height:92px}
body.storyTheme .heroMiniCard__label{font:500 10px 'IBM Plex Mono',monospace;letter-spacing:.1em;color:var(--story-light)}
body.storyTheme .heroMiniCard strong{display:block;margin-top:11px;color:#fff;font-size:15px}
body.storyTheme .featureStrip{position:relative;z-index:1;display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}
body.storyTheme .featureChip{border-radius:999px!important;padding:9px 13px;background:rgba(255,255,255,.1)!important;border:1px solid rgba(255,255,255,.24)!important;color:white!important;font-size:12px}
body.storyTheme .authCardWrap{min-height:100vh;padding:clamp(30px,5vw,80px);display:flex;align-items:center;justify-content:center;background:#fff}
body.storyTheme .authCard{
  width:min(100%,520px);padding:44px!important;border:1px solid var(--story-line)!important;border-radius:4px!important;
  background:#fff!important;box-shadow:var(--story-shadow)!important;position:relative;overflow:hidden;
}
body.storyTheme .authCard::before{content:"";position:absolute;left:0;top:0;width:100%;height:8px;background:linear-gradient(90deg,var(--story-navy),var(--story-blue),var(--story-mint))}
body.storyTheme .authCard__eyebrow{font:600 11px 'IBM Plex Mono',monospace;letter-spacing:.1em;color:var(--story-blue)}
body.storyTheme .authCard__title{font-size:38px!important;letter-spacing:-.045em;margin:5px 0 0!important}
body.storyTheme .authOrb{width:52px;height:52px;background:url('./assets/story/ip-token.png') center/contain no-repeat!important;border:0!important;box-shadow:none!important}
body.storyTheme .field{
  min-height:58px;border:1px solid #c9d8e8!important;background:#f7fbff!important;border-radius:2px!important;
  box-shadow:none!important;color:var(--story-navy)!important;
}
body.storyTheme .field:focus-within{border-color:var(--story-blue)!important;box-shadow:0 0 0 3px rgba(19,128,245,.12)!important;background:#fff!important}
body.storyTheme .field .input,body.storyTheme .field input{color:var(--story-navy)!important;background:transparent!important;-webkit-text-fill-color:var(--story-navy)!important}
body.storyTheme .field input::placeholder{color:#8795aa!important}
body.storyTheme .field__icon{filter:grayscale(1);opacity:.65}
body.storyTheme .field__action,body.storyTheme .field__ghost{color:var(--story-blue)!important;background:transparent!important;white-space:nowrap}
body.storyTheme .fieldMsg{font-size:12px;margin:7px 0 0 3px;color:#65738b}
body.storyTheme .btn{border-radius:2px!important;min-height:44px;font-weight:700!important}
body.storyTheme .btn--primary{background:var(--story-navy)!important;color:white!important;border:1px solid var(--story-navy)!important;box-shadow:none!important}
body.storyTheme .btn--primary:hover{background:var(--story-blue)!important;border-color:var(--story-blue)!important}
body.storyTheme .btn--small,body.storyTheme .btn--ghost{background:#fff!important;color:var(--story-navy)!important;border:1px solid var(--story-line)!important}
body.storyTheme .loginIconLinks{justify-content:flex-start!important;border-top:1px solid var(--story-line);padding-top:22px}
body.storyTheme .iconLink{border-radius:2px!important;background:var(--story-ice)!important;border:1px solid #cce8fb!important;box-shadow:none!important}
body.storyTheme .blogIcon{color:var(--story-navy)!important}

/* App canvas with a fixed vertical Story navigation */
body.storyTheme #page-app.page--shell:not(.hidden){
  display:grid!important;grid-template-columns:258px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);
  width:100%!important;max-width:none!important;min-height:100vh;padding:0!important;gap:0!important;background:#f7fbff;
}
body.storyTheme #page-app .bottomNav{
  grid-column:1;grid-row:1/3;position:fixed!important;left:0!important;top:0!important;bottom:0!important;transform:none!important;
  width:258px!important;height:100vh!important;margin:0!important;padding:34px 24px!important;
  display:flex!important;flex-direction:column!important;justify-content:flex-start!important;gap:9px!important;
  border:0!important;border-right:1px solid var(--story-line)!important;border-radius:0!important;
  background:rgba(255,255,255,.96)!important;backdrop-filter:blur(20px);box-shadow:none!important;z-index:20;
}
body.storyTheme .sideBrand{display:block;margin:4px 0 46px;padding:0 8px;color:var(--story-navy)}
body.storyTheme .sideBrand img{display:block;width:168px;height:auto}
body.storyTheme .sideBrand span{display:block;margin-top:12px;font:600 10px 'IBM Plex Mono',monospace;letter-spacing:.18em;color:var(--story-teal)}
body.storyTheme #page-app .navItem{
  min-height:58px!important;width:100%;display:grid!important;grid-template-columns:44px 1fr;align-items:center;gap:12px;
  padding:7px 12px!important;border-radius:2px!important;border:1px solid transparent!important;
  background:transparent!important;color:#60708a!important;text-align:left;box-shadow:none!important;
}
body.storyTheme #page-app .navItem:hover{background:var(--story-ice)!important;color:var(--story-navy)!important}
body.storyTheme #page-app .navItem.is-active{background:var(--story-navy)!important;color:#fff!important;border-color:var(--story-navy)!important}
body.storyTheme #page-app .navItem__icon{
  width:38px!important;height:38px!important;border-radius:2px!important;display:flex!important;align-items:center;justify-content:center;
  background:var(--story-ice)!important;color:var(--story-blue)!important;font-size:19px!important;
}
body.storyTheme #page-app .navItem.is-active .navItem__icon{background:var(--story-mint)!important;color:var(--story-navy)!important}
body.storyTheme #page-app .navItem__label{font-size:15px!important;font-weight:700!important;color:inherit!important}
body.storyTheme #page-app .topbar{
  grid-column:2;grid-row:1;position:sticky!important;top:0;z-index:15;margin:0!important;padding:20px 34px!important;
  border:0!important;border-bottom:1px solid var(--story-line)!important;border-radius:0!important;background:rgba(247,251,255,.9)!important;
  backdrop-filter:blur(18px);box-shadow:none!important;color:var(--story-navy)!important;
}
body.storyTheme .topbar__left{gap:14px}
body.storyTheme .topbar__logo,body.storyTheme .brand__logo--sm{width:48px!important;height:48px!important;border:0!important;background:none!important;border-radius:0!important;padding:0!important;box-shadow:none!important}
body.storyTheme .brand__img--icon{width:100%;height:100%;object-fit:contain}
body.storyTheme .topbar__eyebrow{font:600 10px 'IBM Plex Mono',monospace;letter-spacing:.14em;color:var(--story-blue)!important}
body.storyTheme .topbar__headline{color:var(--story-navy)!important;font-weight:800;font-size:18px}
body.storyTheme .topbarBadge{border-radius:999px!important;background:#fff!important;color:var(--story-navy)!important;border:1px solid var(--story-line)!important}
body.storyTheme .topbarBadge--live{background:var(--story-mint)!important;border-color:var(--story-mint)!important}
body.storyTheme #page-app .content{grid-column:2;grid-row:2;width:100%;max-width:1600px;margin:0 auto;padding:34px clamp(28px,4vw,70px) 70px!important;color:var(--story-navy)}
body.storyTheme .screen{width:100%}

/* Story sections */
body.storyTheme .heroPanel,body.storyTheme .screenHero,body.storyTheme .moreHero{
  position:relative;overflow:hidden;border-radius:4px!important;border:0!important;box-shadow:var(--story-shadow)!important;
}
body.storyTheme .heroPanel--home{
  min-height:390px;padding:clamp(36px,5vw,76px)!important;
  background:linear-gradient(120deg,#052453 0%,#1380F5 54%,#99F3FB 135%)!important;color:white!important;
  grid-template-columns:minmax(0,1.05fr) minmax(380px,.95fr)!important;
}
body.storyTheme .heroPanel--home::after{content:"IP";position:absolute;right:-24px;bottom:-80px;font:800 360px/.8 'DM Sans';letter-spacing:-.15em;color:rgba(255,255,255,.07)}
body.storyTheme .heroPanel__content,body.storyTheme .heroShowcase{position:relative;z-index:1}
body.storyTheme .heroPanel__eyebrow,body.storyTheme .screenHero__eyebrow,body.storyTheme .marketInsight__eyebrow,body.storyTheme .assetAsideCard__eyebrow,body.storyTheme .walletAside__eyebrow{
  font:600 11px 'IBM Plex Mono',monospace!important;letter-spacing:.14em;text-transform:uppercase;color:var(--story-blue)!important;
}
body.storyTheme .heroPanel--home .heroPanel__eyebrow{color:var(--story-mint)!important}
body.storyTheme .heroPanel__title{color:#fff!important;font-size:clamp(38px,4.5vw,72px)!important;line-height:.98!important;letter-spacing:-.055em!important;max-width:800px}
body.storyTheme .heroPanel__text{color:rgba(255,255,255,.76)!important;font-size:17px;line-height:1.75;max-width:720px}
body.storyTheme .heroPanel__bullets span{background:rgba(255,255,255,.1)!important;color:white!important;border:1px solid rgba(255,255,255,.24)!important;border-radius:2px!important}
body.storyTheme .showcaseFeatureGrid{gap:1px!important;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.2)}
body.storyTheme .showcaseFeature{min-height:145px!important;border:0!important;border-radius:0!important;background:rgba(2,36,83,.45)!important;color:white!important;padding:24px!important}
body.storyTheme .showcaseFeature__label{font:600 11px 'IBM Plex Mono',monospace;letter-spacing:.12em;color:var(--story-mint)!important}
body.storyTheme .showcaseFeature strong{color:#fff!important;font-size:19px}
body.storyTheme .featureGrid{gap:14px!important}
body.storyTheme .featurePanel{
  border-radius:2px!important;border:1px solid var(--story-line)!important;background:#fff!important;box-shadow:var(--story-shadow-sm)!important;color:var(--story-navy)!important;
}
body.storyTheme .featurePanel__icon{border-radius:2px!important;background:var(--story-ice)!important;color:var(--story-blue)!important}
body.storyTheme .featurePanel__title{color:var(--story-navy)!important}
body.storyTheme .featurePanel__text{color:#65738b!important}
body.storyTheme .sectionHeader__meta{font:600 10px 'IBM Plex Mono',monospace;letter-spacing:.12em;color:var(--story-teal)!important}
body.storyTheme .card,body.storyTheme .marketShell,body.storyTheme .securityBanner,body.storyTheme .walletAside__card,body.storyTheme .marketInsight,body.storyTheme .portfolioHero,body.storyTheme .statCard,body.storyTheme .menuItem,body.storyTheme .estimateCard,body.storyTheme .modal__panel,body.storyTheme .tableWrap{
  background:#fff!important;color:var(--story-navy)!important;border:1px solid var(--story-line)!important;border-radius:4px!important;box-shadow:var(--story-shadow-sm)!important;
}
body.storyTheme .card--deep{background:#fff!important}
body.storyTheme .activityItem,body.storyTheme .newsItem,body.storyTheme .coinRow,body.storyTheme .holdingRow{
  background:#fff!important;border:1px solid var(--story-line)!important;border-radius:2px!important;color:var(--story-navy)!important;box-shadow:none!important;
}
body.storyTheme .activityItem:hover,body.storyTheme .newsItem:hover,body.storyTheme .coinRow:hover{border-color:var(--story-sky)!important;transform:translateY(-1px)}
body.storyTheme .activityItem__title,body.storyTheme .newsItem__title,body.storyTheme .coinName,body.storyTheme .coinPrice,body.storyTheme .holdingName{color:var(--story-navy)!important}
body.storyTheme .activityItem__meta,body.storyTheme .newsItem__meta,body.storyTheme .newsItem__desc,body.storyTheme .coinTicker,body.storyTheme .holdingTicker{color:#718097!important}
body.storyTheme .securityBanner{border-left:5px solid var(--story-blue)!important}
body.storyTheme .securityBanner__icon{background:var(--story-ice)!important;border-radius:2px!important}
body.storyTheme .securityBanner__title{color:var(--story-navy)!important}
body.storyTheme .securityBanner__text{color:#65738b!important}
body.storyTheme .newsList{gap:10px!important}
body.storyTheme .newsItem a{color:inherit!important}
body.storyTheme .screenHero{padding:34px!important;background:linear-gradient(100deg,#fff 0%,var(--story-ice) 100%)!important;border:1px solid #cfe9fa!important;box-shadow:none!important}
body.storyTheme .screenHero__title{font-size:38px!important;letter-spacing:-.045em!important}
body.storyTheme .screenHero__text{color:#65738b!important}
body.storyTheme .pill{border-radius:999px!important;background:var(--story-ice)!important;color:var(--story-navy)!important;border:1px solid #c9e8fb!important}
body.storyTheme .marketDesktop{gap:18px!important}
body.storyTheme .marketInsight{padding:28px!important;background:var(--story-navy)!important;color:#fff!important}
body.storyTheme .marketInsight h3{color:#fff!important;font-size:27px}
body.storyTheme .marketInsight p{color:rgba(255,255,255,.7)!important}
body.storyTheme .marketInsight__grid>div{background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.13)!important;border-radius:2px!important}
body.storyTheme .marketInsight__grid span{color:var(--story-light)!important}
body.storyTheme .marketInsight__grid strong{color:white!important}
body.storyTheme .coinRow[data-ticker="IP"]{background:linear-gradient(90deg,#fff9df,#fff)!important;border-color:#ecd26f!important;box-shadow:0 12px 32px rgba(192,151,34,.12)!important}
body.storyTheme .coinIcon{border-radius:50%!important;background:#f8f5e8!important;border:1px solid #e8d57c!important}
body.storyTheme .coinLogo{object-fit:contain!important;padding:0!important}
body.storyTheme .badge{border-radius:999px!important;background:var(--story-ice)!important;color:var(--story-blue)!important;border:0!important}
body.storyTheme .pos{color:#e24848!important}.storyTheme .neg{color:#1380F5!important}
body.storyTheme .portfolioHero--featured{background:linear-gradient(120deg,var(--story-navy),#274670)!important;color:white!important;border:0!important}
body.storyTheme .portfolioHero__label,body.storyTheme .portfolioHero__value{color:white!important}
body.storyTheme .statCard__label{color:#65738b!important}.storyTheme .statCard__value{color:var(--story-navy)!important}
body.storyTheme .assetAsideCard{background:linear-gradient(180deg,#fff,var(--story-ice))!important}
body.storyTheme .form--flat{background:#fff!important;border:1px solid var(--story-line)!important;border-radius:4px!important;box-shadow:var(--story-shadow-sm)!important;padding:28px!important}
body.storyTheme .label,body.storyTheme .sectionLabel{color:var(--story-navy)!important;font-weight:700}
body.storyTheme .input,body.storyTheme .input--light,body.storyTheme .select,body.storyTheme input,body.storyTheme select,body.storyTheme textarea{
  background:#f5faff!important;color:var(--story-navy)!important;border:1px solid #c7d9e8!important;border-radius:2px!important;-webkit-text-fill-color:var(--story-navy)!important;
}
body.storyTheme input::placeholder,body.storyTheme textarea::placeholder{color:#8997aa!important;-webkit-text-fill-color:#8997aa!important}
body.storyTheme select option{background:#fff!important;color:var(--story-navy)!important}
body.storyTheme .estimateCard{background:var(--story-ice)!important}
body.storyTheme .estimateCard__label{color:#65738b!important}.storyTheme .estimateCard__value{color:var(--story-navy)!important}
body.storyTheme .walletAside__card{background:var(--story-navy)!important;color:white!important;padding:30px!important}
body.storyTheme .walletAside__card h3{color:#fff!important}.storyTheme .walletAside__card p,.storyTheme .walletAside__list{color:rgba(255,255,255,.72)!important}
body.storyTheme .moreHero{background:linear-gradient(105deg,#fff,var(--story-ice))!important;border:1px solid #cfe9fa!important;box-shadow:none!important}
body.storyTheme .moreHero__orb{background:url('./assets/story/ip-token.png') center/contain no-repeat!important;border-radius:0!important;box-shadow:none!important}
body.storyTheme .menuItem{border-left:4px solid transparent!important;text-align:left}
body.storyTheme .menuItem:hover{border-left-color:var(--story-blue)!important;background:var(--story-ice)!important}
body.storyTheme .menuItem__icon{background:var(--story-ice)!important;border-radius:2px!important}
body.storyTheme .menuItem__label{color:var(--story-navy)!important}

/* Admin */
body.storyTheme #page-admin.page--shell:not(.hidden){display:block!important;width:100%!important;max-width:none!important;min-height:100vh;padding:0!important;background:#f7fbff}
body.storyTheme #page-admin .topbar{position:sticky;top:0;border-radius:0!important;border:0!important;border-bottom:1px solid var(--story-line)!important;background:#fff!important;color:var(--story-navy)!important;padding:18px 34px!important;z-index:10;box-shadow:none!important}
body.storyTheme #page-admin .content{width:min(1500px,calc(100% - 48px));margin:0 auto;padding:34px 0 70px!important}
body.storyTheme .adminTable{color:var(--story-navy)!important}
body.storyTheme .adminTable thead th{background:var(--story-navy)!important;color:#fff!important;border-color:rgba(255,255,255,.1)!important}
body.storyTheme .adminTable tbody td{background:#fff!important;color:var(--story-navy)!important;border-color:var(--story-line)!important}
body.storyTheme .adminTable tbody tr:hover td{background:var(--story-ice)!important}
body.storyTheme .adminManageCard{background:#fff!important}
body.storyTheme .btn--danger{background:#fff!important;color:#cf3e4c!important;border:1px solid #efb6bc!important}
body.storyTheme .chip{border-radius:2px!important;background:var(--story-ice)!important;color:var(--story-navy)!important;border:1px solid #cce8fb!important}
body.storyTheme .input--fixed{background:#edf2f6!important;color:#65738b!important}

/* Modal */
body.storyTheme .modal__backdrop{background:rgba(5,36,83,.52)!important;backdrop-filter:blur(8px)}
body.storyTheme .modal__panel{border-top:7px solid var(--story-blue)!important}
body.storyTheme .modal__title{color:var(--story-navy)!important}
body.storyTheme .addrLine{font-family:'IBM Plex Mono',monospace;color:var(--story-navy)!important;background:var(--story-ice)!important;border-radius:2px!important}
body.storyTheme .qrCard{background:#fff!important;border:1px solid var(--story-line)!important;border-radius:2px!important}

/* Mobile */
@media(max-width:1050px){
  body.storyTheme .authShell{grid-template-columns:1fr!important}
  body.storyTheme .authVisual{min-height:auto;padding:50px 28px 60px}
  body.storyTheme .authVisual::after{display:none}
  body.storyTheme .authTitle{font-size:52px!important}
  body.storyTheme .authCardWrap{min-height:auto;padding:34px 18px 70px}
  body.storyTheme .heroDevice__grid{grid-template-columns:repeat(2,1fr)}
  body.storyTheme #page-app.page--shell:not(.hidden){display:flex!important;flex-direction:column;min-height:100vh;padding-bottom:92px!important}
  body.storyTheme #page-app .topbar{width:100%;position:sticky!important;grid-column:auto;padding:14px 18px!important}
  body.storyTheme #page-app .content{width:100%;padding:22px 16px 110px!important}
  body.storyTheme #page-app .bottomNav{
    position:fixed!important;left:50%!important;top:auto!important;bottom:10px!important;transform:translateX(-50%)!important;
    width:calc(100% - 20px)!important;height:auto!important;padding:8px!important;display:grid!important;grid-template-columns:repeat(5,1fr)!important;
    flex-direction:row!important;border:1px solid rgba(25,32,50,.13)!important;border-radius:8px!important;
    box-shadow:0 14px 50px rgba(25,32,50,.18)!important;gap:5px!important;
  }
  body.storyTheme .sideBrand{display:none}
  body.storyTheme #page-app .navItem{display:flex!important;flex-direction:column;justify-content:center;gap:4px;min-height:60px!important;padding:5px!important;text-align:center}
  body.storyTheme #page-app .navItem__icon{width:30px!important;height:30px!important;font-size:16px!important}
  body.storyTheme #page-app .navItem__label{font-size:11px!important}
  body.storyTheme .heroPanel--home{grid-template-columns:1fr!important;min-height:auto;padding:34px 24px!important}
  body.storyTheme .heroPanel__title{font-size:42px!important}
  body.storyTheme .showcaseFeatureGrid{grid-template-columns:1fr 1fr!important}
  body.storyTheme .homeDesktop,body.storyTheme .marketDesktop,body.storyTheme .assetDesktop,body.storyTheme .walletLayout{grid-template-columns:1fr!important}
  body.storyTheme #page-admin .content{width:calc(100% - 24px)}
}
@media(max-width:620px){
  body.storyTheme .authTitle{font-size:40px!important}
  body.storyTheme .authCard{padding:30px 20px!important}
  body.storyTheme .heroDevice__grid{grid-template-columns:1fr 1fr}
  body.storyTheme .topbar__meta{display:none}
  body.storyTheme .heroPanel__title{font-size:34px!important}
  body.storyTheme .showcaseFeatureGrid{grid-template-columns:1fr!important}
  body.storyTheme .screenHero{padding:24px!important}
  body.storyTheme .screenHero__title{font-size:30px!important}
}


/* ===== Story Wallet v1.0.1 — softer login network cards ===== */
body.storyTheme .heroDevice__top{
  max-width:720px;
  padding:0 4px;
  color:rgba(255,255,255,.92)!important;
}
body.storyTheme .heroDevice__eyebrow{
  color:#ffffff!important;
  text-shadow:0 1px 10px rgba(0,0,0,.18);
}
body.storyTheme .heroDevice__pill{
  color:#5b4300!important;
  background:linear-gradient(180deg,#ffe9a5,#f4d36f)!important;
  border:1px solid rgba(255,255,255,.55)!important;
  box-shadow:0 8px 20px rgba(4,24,66,.12);
  font-weight:800;
}
body.storyTheme .heroDevice__grid{
  margin-top:14px!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
  max-width:720px!important;
  padding:10px!important;
  background:linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.07))!important;
  border:1px solid rgba(255,255,255,.28)!important;
  border-radius:24px!important;
  box-shadow:0 18px 38px rgba(3,27,74,.18), inset 0 1px 0 rgba(255,255,255,.28)!important;
  backdrop-filter:blur(12px);
}
body.storyTheme .heroMiniCard{
  min-width:0!important;
  min-height:104px!important;
  padding:17px 16px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.30)!important;
  border-radius:17px!important;
  background:linear-gradient(155deg,rgba(255,255,255,.18),rgba(3,37,90,.20))!important;
  box-shadow:0 10px 24px rgba(4,30,76,.13), inset 0 1px 0 rgba(255,255,255,.20)!important;
}
body.storyTheme .heroMiniCard__label{
  margin:0 0 9px!important;
  color:rgba(255,255,255,.88)!important;
  font:700 11px/1.25 'DM Sans','Noto Sans KR',sans-serif!important;
  letter-spacing:.015em!important;
  word-break:keep-all;
}
body.storyTheme .heroMiniCard strong{
  display:block!important;
  min-width:0!important;
  margin:0!important;
  color:#fff!important;
  font-size:clamp(13px,1.15vw,16px)!important;
  line-height:1.3!important;
  letter-spacing:-.02em!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:keep-all!important;
  text-shadow:0 1px 12px rgba(0,0,0,.20);
}
@media (max-width:980px){
  body.storyTheme .heroDevice__grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media (max-width:520px){
  body.storyTheme .heroDevice__grid{gap:8px!important;padding:8px!important;border-radius:20px!important}
  body.storyTheme .heroMiniCard{min-height:94px!important;padding:15px 14px!important;border-radius:14px!important}
}


/* Story Wallet v1.0.2 — login field, prompt and official links polish */
body.storyTheme #loginForm .field,
body.storyTheme #signupForm .field{
  border:0!important;
  outline:0!important;
  background:#eef6fc!important;
  box-shadow:none!important;
}
body.storyTheme #loginForm .field:focus-within,
body.storyTheme #signupForm .field:focus-within{
  border:0!important;
  background:#e8f3fc!important;
  box-shadow:0 0 0 3px rgba(19,128,245,.14)!important;
}
body.storyTheme #loginForm .field .input,
body.storyTheme #loginForm .field input,
body.storyTheme #signupForm .field .input,
body.storyTheme #signupForm .field input{
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}
body.storyTheme #loginForm .row--center{
  flex-wrap:nowrap!important;
  white-space:nowrap;
  gap:10px;
}
body.storyTheme #loginForm .row--center .muted{
  white-space:nowrap;
  flex:0 1 auto;
}
body.storyTheme #signupBtn{
  flex:0 0 auto;
  white-space:nowrap;
  margin-left:0!important;
}
body.storyTheme .loginIconLinks{
  align-items:center!important;
  gap:10px!important;
}
body.storyTheme .iconLink--story-site{
  width:96px!important;
  padding:0 14px!important;
  background:#fff!important;
}
body.storyTheme .iconLink--story-site img{
  width:68px!important;
  height:auto!important;
  max-height:24px!important;
  object-fit:contain!important;
}
body.storyTheme .iconLink--x img{
  width:20px!important;
  height:20px!important;
  border-radius:0!important;
}
@media(max-width:420px){
  body.storyTheme #loginForm .row--center{gap:7px!important;}
  body.storyTheme #loginForm .row--center .muted{font-size:13px;}
  body.storyTheme #signupBtn{padding:8px 10px!important;font-size:12px!important;}
}


/* =========================================================
   Story Wallet v1.0.6 — sky canvas, white accents, compact nav
   ========================================================= */

/* Authentication readability */
body.storyTheme #page-login .field .input,
body.storyTheme #page-login .field input,
body.storyTheme #page-signup .field .input,
body.storyTheme #page-signup .field input{
  color:#152238!important;
  -webkit-text-fill-color:#152238!important;
  caret-color:#1380F5!important;
  opacity:1!important;
}
body.storyTheme #page-login .field input::placeholder,
body.storyTheme #page-signup .field input::placeholder{
  color:#748399!important;
  -webkit-text-fill-color:#748399!important;
  opacity:1!important;
}
body.storyTheme #page-login input:-webkit-autofill,
body.storyTheme #page-login input:-webkit-autofill:hover,
body.storyTheme #page-login input:-webkit-autofill:focus,
body.storyTheme #page-signup input:-webkit-autofill,
body.storyTheme #page-signup input:-webkit-autofill:hover,
body.storyTheme #page-signup input:-webkit-autofill:focus{
  -webkit-text-fill-color:#152238!important;
  caret-color:#1380F5!important;
  -webkit-box-shadow:0 0 0 1000px #eef7fd inset!important;
  box-shadow:0 0 0 1000px #eef7fd inset!important;
  transition:background-color 9999s ease-out 0s!important;
}

/* Authentication switch prompts stay on one line */
body.storyTheme #loginForm .row--center,
body.storyTheme #signupForm .row--center{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex-wrap:nowrap!important;
  white-space:nowrap!important;
  gap:9px!important;
}
body.storyTheme #loginForm .row--center .muted,
body.storyTheme #signupForm .row--center .muted,
body.storyTheme #signupBtn,
body.storyTheme #toLoginBtn{
  white-space:nowrap!important;
}
body.storyTheme #loginForm .row--center .muted,
body.storyTheme #signupForm .row--center .muted{
  flex:0 1 auto!important;
}
body.storyTheme #signupBtn,
body.storyTheme #toLoginBtn{
  flex:0 0 auto!important;
  margin-left:0!important;
}

/* Logged-in canvas: Story sky blue is the main surface, white is the accent */
body.storyTheme #page-app.page--shell:not(.hidden){
  background:
    radial-gradient(circle at 86% 8%,rgba(255,255,255,.46),transparent 24%),
    radial-gradient(circle at 28% 92%,rgba(153,243,251,.60),transparent 30%),
    linear-gradient(145deg,#5ec7ff 0%,#82ddff 43%,#b8efff 72%,#e8f8ff 100%)!important;
}
body.storyTheme #page-app .content{
  position:relative;
  background:transparent!important;
}
body.storyTheme #page-app .topbar{
  background:rgba(255,255,255,.86)!important;
  border-bottom:1px solid rgba(255,255,255,.72)!important;
  box-shadow:0 10px 30px rgba(5,68,128,.09)!important;
  backdrop-filter:blur(18px)!important;
}
body.storyTheme #page-app .heroPanel--home{
  background:linear-gradient(118deg,#087be8 0%,#2faaf8 53%,#8debf8 128%)!important;
  box-shadow:0 24px 60px rgba(0,82,164,.20)!important;
}
body.storyTheme #page-app .marketInsight,
body.storyTheme #page-app .walletAside__card,
body.storyTheme #page-app .portfolioHero--featured{
  background:linear-gradient(145deg,#0879df 0%,#299ff1 58%,#52c8f0 120%)!important;
  border:1px solid rgba(255,255,255,.38)!important;
  box-shadow:0 18px 46px rgba(3,83,159,.16)!important;
}
body.storyTheme #page-app .screenHero,
body.storyTheme #page-app .moreHero{
  background:linear-gradient(105deg,rgba(255,255,255,.97),rgba(238,250,255,.90))!important;
  border:1px solid rgba(255,255,255,.88)!important;
  box-shadow:0 16px 40px rgba(4,84,150,.10)!important;
}
body.storyTheme #page-app .card,
body.storyTheme #page-app .marketShell,
body.storyTheme #page-app .securityBanner,
body.storyTheme #page-app .featurePanel,
body.storyTheme #page-app .statCard,
body.storyTheme #page-app .menuItem,
body.storyTheme #page-app .estimateCard,
body.storyTheme #page-app .tableWrap,
body.storyTheme #page-app .activityItem,
body.storyTheme #page-app .newsItem,
body.storyTheme #page-app .coinRow,
body.storyTheme #page-app .holdingRow,
body.storyTheme #page-app .form--flat{
  border-color:rgba(255,255,255,.86)!important;
  box-shadow:0 14px 38px rgba(8,77,137,.10)!important;
}

/* Compact, button-like desktop navigation */
@media (min-width:1051px){
  body.storyTheme #page-app.page--shell:not(.hidden){
    grid-template-columns:210px minmax(0,1fr)!important;
  }
  body.storyTheme #page-app .bottomNav{
    width:210px!important;
    padding:22px 14px!important;
    gap:8px!important;
    background:linear-gradient(180deg,#087be8 0%,#32aff4 58%,#75dfef 115%)!important;
    border-right:1px solid rgba(255,255,255,.56)!important;
    box-shadow:14px 0 38px rgba(0,74,144,.15)!important;
  }
  body.storyTheme .sideBrand{
    margin:0 0 20px!important;
    padding:16px 13px 13px!important;
    border:1px solid rgba(255,255,255,.78)!important;
    border-radius:15px!important;
    background:rgba(255,255,255,.94)!important;
    box-shadow:0 12px 28px rgba(1,83,157,.13)!important;
  }
  body.storyTheme .sideBrand img{
    width:138px!important;
    max-width:100%!important;
  }
  body.storyTheme .sideBrand span{
    margin-top:8px!important;
    color:#227db7!important;
    font-size:9px!important;
    letter-spacing:.14em!important;
  }
  body.storyTheme #page-app .navItem{
    min-height:50px!important;
    grid-template-columns:35px minmax(0,1fr)!important;
    gap:9px!important;
    padding:7px 10px!important;
    border:1px solid rgba(255,255,255,.34)!important;
    border-radius:13px!important;
    background:rgba(255,255,255,.15)!important;
    color:#fff!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.16)!important;
  }
  body.storyTheme #page-app .navItem:hover{
    background:rgba(255,255,255,.27)!important;
    border-color:rgba(255,255,255,.62)!important;
    color:#fff!important;
    transform:translateX(2px);
  }
  body.storyTheme #page-app .navItem.is-active{
    background:#fff!important;
    color:#075da8!important;
    border-color:#fff!important;
    box-shadow:0 12px 28px rgba(0,76,145,.18)!important;
  }
  body.storyTheme #page-app .navItem__icon{
    width:33px!important;
    height:33px!important;
    border-radius:10px!important;
    background:rgba(255,255,255,.16)!important;
    border:1px solid rgba(255,255,255,.25)!important;
    color:inherit!important;
    font-size:16px!important;
  }
  body.storyTheme #page-app .navItem.is-active .navItem__icon{
    background:linear-gradient(145deg,#dff6ff,#a8ecf7)!important;
    border-color:#b7eafb!important;
    color:#075da8!important;
  }
  body.storyTheme #page-app .navItem__label{
    color:inherit!important;
    font-size:14px!important;
    font-weight:800!important;
  }
}

/* Mobile navigation inherits the same sky/white visual language */
@media (max-width:1050px){
  body.storyTheme #page-app .bottomNav{
    background:linear-gradient(100deg,rgba(5,123,232,.96),rgba(51,177,245,.96),rgba(112,224,240,.96))!important;
    border:1px solid rgba(255,255,255,.62)!important;
    box-shadow:0 18px 46px rgba(1,69,132,.24)!important;
  }
  body.storyTheme #page-app .navItem{
    background:rgba(255,255,255,.13)!important;
    border:1px solid rgba(255,255,255,.22)!important;
    border-radius:11px!important;
    color:#fff!important;
  }
  body.storyTheme #page-app .navItem.is-active{
    background:#fff!important;
    color:#075da8!important;
    border-color:#fff!important;
  }
  body.storyTheme #page-app .navItem__icon{
    background:transparent!important;
    color:inherit!important;
  }
}

/* Admin follows the same sky canvas and white card accents */
body.storyTheme #page-admin.page--shell:not(.hidden){
  background:linear-gradient(145deg,#69ccff 0%,#a5eaff 58%,#ebfaff 100%)!important;
}
body.storyTheme #page-admin .topbar{
  background:rgba(255,255,255,.90)!important;
  backdrop-filter:blur(18px)!important;
  box-shadow:0 10px 30px rgba(5,68,128,.09)!important;
}
body.storyTheme #page-admin .card,
body.storyTheme #page-admin .tableWrap,
body.storyTheme #page-admin .adminManageCard{
  border-color:rgba(255,255,255,.88)!important;
  box-shadow:0 14px 38px rgba(8,77,137,.11)!important;
}

@media (max-width:420px){
  body.storyTheme #loginForm .row--center,
  body.storyTheme #signupForm .row--center{gap:6px!important;}
  body.storyTheme #loginForm .row--center .muted,
  body.storyTheme #signupForm .row--center .muted{font-size:12px!important;}
  body.storyTheme #signupBtn,
  body.storyTheme #toLoginBtn{padding:8px 9px!important;font-size:12px!important;}
}


/* =========================================================
   Story Wallet v1.0.7 — softer sky panels + compact active nav
   ========================================================= */
body.storyTheme{
  --story-panel-sky:#d8f4ff;
  --story-panel-sky2:#bfeeff;
  --story-panel-sky3:#8ee4fb;
  --story-active:#0c7fdc;
  --story-active2:#0aa8da;
}

/* Use sky tones instead of stark white or dark navy across the app */
body.storyTheme #page-app.page--shell:not(.hidden){
  background:
    radial-gradient(circle at 88% 8%,rgba(255,255,255,.48),transparent 24%),
    radial-gradient(circle at 22% 92%,rgba(153,243,251,.62),transparent 30%),
    linear-gradient(145deg,#55c4ff 0%,#8de4ff 43%,#c6f3ff 72%,#effbff 100%)!important;
}
body.storyTheme #page-app .topbar,
body.storyTheme #page-admin .topbar{
  background:linear-gradient(120deg,rgba(219,246,255,.94),rgba(190,238,255,.88))!important;
  border-bottom:1px solid rgba(255,255,255,.56)!important;
  box-shadow:0 12px 30px rgba(0,98,170,.10)!important;
}
body.storyTheme #page-app .screenHero,
body.storyTheme #page-app .moreHero,
body.storyTheme #page-app .card,
body.storyTheme #page-app .marketShell,
body.storyTheme #page-app .securityBanner,
body.storyTheme #page-app .featurePanel,
body.storyTheme #page-app .statCard,
body.storyTheme #page-app .menuItem,
body.storyTheme #page-app .estimateCard,
body.storyTheme #page-app .tableWrap,
body.storyTheme #page-app .activityItem,
body.storyTheme #page-app .newsItem,
body.storyTheme #page-app .coinRow,
body.storyTheme #page-app .holdingRow,
body.storyTheme #page-app .form--flat,
body.storyTheme #page-admin .card,
body.storyTheme #page-admin .tableWrap,
body.storyTheme #page-admin .adminManageCard{
  background:linear-gradient(145deg,rgba(224,248,255,.96),rgba(185,235,253,.90))!important;
  border:1px solid rgba(255,255,255,.62)!important;
  box-shadow:0 14px 36px rgba(0,93,162,.10)!important;
  color:var(--story-navy)!important;
}
body.storyTheme #page-app .heroPanel--home,
body.storyTheme #page-app .marketInsight,
body.storyTheme #page-app .walletAside__card,
body.storyTheme #page-app .portfolioHero--featured{
  background:linear-gradient(130deg,#25aef4 0%,#55cef8 54%,#9df4fb 116%)!important;
  border:1px solid rgba(255,255,255,.42)!important;
  box-shadow:0 22px 54px rgba(0,96,172,.18)!important;
}
body.storyTheme #page-app .heroPanel--home::after{
  color:rgba(255,255,255,.14)!important;
}
body.storyTheme .showcaseFeature,
body.storyTheme .heroMiniCard{
  background:linear-gradient(145deg,rgba(213,246,255,.70),rgba(119,220,250,.32))!important;
  border:1px solid rgba(255,255,255,.42)!important;
  color:#063259!important;
}
body.storyTheme .showcaseFeature strong,
body.storyTheme .heroMiniCard strong{color:#063259!important;text-shadow:none!important;}
body.storyTheme .showcaseFeature__label,
body.storyTheme .heroMiniCard__label{color:#075f9d!important;text-shadow:none!important;}
body.storyTheme #page-app input,
body.storyTheme #page-app select,
body.storyTheme #page-app textarea,
body.storyTheme #page-admin input,
body.storyTheme #page-admin select,
body.storyTheme #page-admin textarea{
  background:rgba(225,248,255,.92)!important;
  color:#10243d!important;
  border-color:rgba(19,128,245,.22)!important;
}

/* Compact, balanced navigation: tighter but not cramped */
@media (min-width:1051px){
  body.storyTheme #page-app.page--shell:not(.hidden){
    grid-template-columns:196px minmax(0,1fr)!important;
  }
  body.storyTheme #page-app .bottomNav{
    width:196px!important;
    padding:20px 12px!important;
    gap:6px!important;
    background:linear-gradient(180deg,#42bef9 0%,#77ddfb 54%,#b9f2ff 112%)!important;
    border-right:1px solid rgba(255,255,255,.62)!important;
    box-shadow:14px 0 34px rgba(0,92,166,.13)!important;
  }
  body.storyTheme .sideBrand{
    margin:0 0 16px!important;
    padding:14px 12px 12px!important;
    border-radius:14px!important;
    background:rgba(229,249,255,.74)!important;
    border:1px solid rgba(255,255,255,.62)!important;
  }
  body.storyTheme .sideBrand img{width:126px!important;}
  body.storyTheme #page-app .navItem{
    min-height:43px!important;
    grid-template-columns:30px minmax(0,1fr)!important;
    gap:8px!important;
    padding:6px 9px!important;
    border-radius:12px!important;
    background:rgba(255,255,255,.20)!important;
    border:1px solid rgba(255,255,255,.32)!important;
    color:#075f9d!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.18)!important;
  }
  body.storyTheme #page-app .navItem:hover{
    background:rgba(255,255,255,.34)!important;
    border-color:rgba(255,255,255,.68)!important;
    color:#053f76!important;
    transform:translateX(1px)!important;
  }
  body.storyTheme #page-app .navItem.is-active{
    background:linear-gradient(135deg,var(--story-active),var(--story-active2))!important;
    color:#fff!important;
    border-color:rgba(255,255,255,.56)!important;
    box-shadow:0 9px 22px rgba(0,102,184,.20)!important;
  }
  body.storyTheme #page-app .navItem__icon{
    width:28px!important;
    height:28px!important;
    border-radius:9px!important;
    background:rgba(255,255,255,.28)!important;
    border:1px solid rgba(255,255,255,.34)!important;
    color:inherit!important;
    font-size:14px!important;
  }
  body.storyTheme #page-app .navItem.is-active .navItem__icon{
    background:rgba(255,255,255,.22)!important;
    color:#fff!important;
    border-color:rgba(255,255,255,.34)!important;
  }
  body.storyTheme #page-app .navItem__label{
    font-size:13px!important;
    line-height:1.1!important;
    font-weight:800!important;
  }
}

@media (max-width:1050px){
  body.storyTheme #page-app .bottomNav{
    background:linear-gradient(100deg,#48c4fa,#80e2fb,#baf4ff)!important;
    border:1px solid rgba(255,255,255,.62)!important;
    box-shadow:0 15px 38px rgba(0,85,155,.19)!important;
    gap:6px!important;
  }
  body.storyTheme #page-app .navItem{
    background:rgba(255,255,255,.20)!important;
    border:1px solid rgba(255,255,255,.32)!important;
    color:#075f9d!important;
    border-radius:10px!important;
  }
  body.storyTheme #page-app .navItem.is-active{
    background:linear-gradient(135deg,var(--story-active),var(--story-active2))!important;
    color:#fff!important;
    border-color:rgba(255,255,255,.56)!important;
  }
}

/* Remove the small 'recent record' header label in the home activity area */
body.storyTheme .sectionHeader__meta:empty{display:none!important;}

/* =========================================================
   Story Wallet v1.0.8 — text visibility + simplified layouts
   ========================================================= */

/* Requested one-column layouts after removing auxiliary boxes */
body.storyTheme #page-app .marketDesktop,
body.storyTheme #page-app .assetDesktop,
body.storyTheme #page-app .walletLayout{
  grid-template-columns:minmax(0,1fr)!important;
  width:100%!important;
}
body.storyTheme #page-app .marketDesktop__main,
body.storyTheme #page-app .assetDesktop__main,
body.storyTheme #page-app .walletForm{
  width:100%!important;
  max-width:none!important;
}

/* Home news: dark readable headline text on sky panels */
body.storyTheme #page-app #newsList .newsLink,
body.storyTheme #page-app #newsList .newsLink:visited,
body.storyTheme #page-app #newsList .newsItem__title,
body.storyTheme #page-app .homeDesktop__side .sectionHeader .h2{
  color:#092f55!important;
  -webkit-text-fill-color:#092f55!important;
  text-shadow:none!important;
}
body.storyTheme #page-app #newsList .newsItem__meta,
body.storyTheme #page-app #newsList .newsItem__desc{
  color:#315f7f!important;
  -webkit-text-fill-color:#315f7f!important;
}

/* Coin tab section heading */
body.storyTheme #page-app [data-screen="coin"] .sectionLabel{
  color:#073f72!important;
  -webkit-text-fill-color:#073f72!important;
  text-shadow:none!important;
}

/* Asset tab: user ID, labels, balances, holdings and values */
body.storyTheme #page-app [data-screen="asset"] .screenHero__title,
body.storyTheme #page-app [data-screen="asset"] #assetUserLabel,
body.storyTheme #page-app [data-screen="asset"] .sectionLabel,
body.storyTheme #page-app [data-screen="asset"] .statCard__label,
body.storyTheme #page-app [data-screen="asset"] .statCard__value,
body.storyTheme #page-app [data-screen="asset"] .coinName,
body.storyTheme #page-app [data-screen="asset"] .holdingName,
body.storyTheme #page-app [data-screen="asset"] .holdingAmt,
body.storyTheme #page-app [data-screen="asset"] .holdingValue{
  color:#092f55!important;
  -webkit-text-fill-color:#092f55!important;
  text-shadow:none!important;
}
body.storyTheme #page-app [data-screen="asset"] .holdingSub,
body.storyTheme #page-app [data-screen="asset"] .coinTicker,
body.storyTheme #page-app [data-screen="asset"] .empty,
body.storyTheme #page-app [data-screen="asset"] .muted{
  color:#315f7f!important;
  -webkit-text-fill-color:#315f7f!important;
}

/* Wallet tab: user ID and field labels */
body.storyTheme #page-app [data-screen="wallet"] .screenHero__title,
body.storyTheme #page-app [data-screen="wallet"] #walletUserLabel,
body.storyTheme #page-app [data-screen="wallet"] .label,
body.storyTheme #page-app [data-screen="wallet"] .estimateCard__label,
body.storyTheme #page-app [data-screen="wallet"] .estimateCard__value{
  color:#092f55!important;
  -webkit-text-fill-color:#092f55!important;
  text-shadow:none!important;
}
body.storyTheme #page-app [data-screen="wallet"] input,
body.storyTheme #page-app [data-screen="wallet"] select,
body.storyTheme #page-app [data-screen="wallet"] textarea{
  color:#10243d!important;
  -webkit-text-fill-color:#10243d!important;
}
body.storyTheme #page-app [data-screen="wallet"] input::placeholder,
body.storyTheme #page-app [data-screen="wallet"] textarea::placeholder{
  color:#557693!important;
  -webkit-text-fill-color:#557693!important;
}

/* Keep desktop content balanced once the three right-side boxes are gone */
@media (min-width:1051px){
  body.storyTheme #page-app [data-screen="coin"] .marketShell,
  body.storyTheme #page-app [data-screen="asset"] .assetDesktop__main,
  body.storyTheme #page-app [data-screen="wallet"] .walletForm{
    max-width:1180px!important;
    margin-inline:auto!important;
  }
}



/* =========================================================
   Story Wallet v1.0.9 — navy text harmonization + centered navigation
   ========================================================= */
body.storyTheme{
  --story-readable-navy:#092f55;
  --story-readable-muted:#174e78;
}

/* After login: replace white/gray helper text with the same navy used in Home news titles */
body.storyTheme #page-app .content,
body.storyTheme #page-app .screen,
body.storyTheme #page-app .card,
body.storyTheme #page-app .marketShell,
body.storyTheme #page-app .portfolioHero,
body.storyTheme #page-app .statCard,
body.storyTheme #page-app .menuItem,
body.storyTheme #page-app .estimateCard,
body.storyTheme #page-app .securityBanner,
body.storyTheme #page-app .topbar,
body.storyTheme #page-admin,
body.storyTheme #page-admin .card,
body.storyTheme #page-admin .topbar,
body.storyTheme #page-admin .tableWrap,
body.storyTheme #page-admin .adminManageCard{
  color:var(--story-readable-navy)!important;
}
body.storyTheme #page-app h1,
body.storyTheme #page-app h2,
body.storyTheme #page-app h3,
body.storyTheme #page-app h4,
body.storyTheme #page-app p,
body.storyTheme #page-app span,
body.storyTheme #page-app div,
body.storyTheme #page-app label,
body.storyTheme #page-app strong,
body.storyTheme #page-app small,
body.storyTheme #page-app .h1,
body.storyTheme #page-app .h2,
body.storyTheme #page-app .sub,
body.storyTheme #page-app .muted,
body.storyTheme #page-app .small,
body.storyTheme #page-app .sectionLabel,
body.storyTheme #page-app .screenHero__title,
body.storyTheme #page-app .screenHero__kicker,
body.storyTheme #page-app .topbar__eyebrow,
body.storyTheme #page-app .topbar__headline,
body.storyTheme #page-app .featurePanel__title,
body.storyTheme #page-app .featurePanel__text,
body.storyTheme #page-app .showcaseCard__title,
body.storyTheme #page-app .showcaseCard__text,
body.storyTheme #page-app .activityItem__title,
body.storyTheme #page-app .activityItem__meta,
body.storyTheme #page-app .newsItem__title,
body.storyTheme #page-app .newsItem__meta,
body.storyTheme #page-app .newsItem__desc,
body.storyTheme #page-app .coinName,
body.storyTheme #page-app .coinTicker,
body.storyTheme #page-app .coinPrice,
body.storyTheme #page-app .holdingName,
body.storyTheme #page-app .holdingSub,
body.storyTheme #page-app .holdingAmt,
body.storyTheme #page-app .holdingValue,
body.storyTheme #page-app .statCard__label,
body.storyTheme #page-app .statCard__value,
body.storyTheme #page-app .estimateCard__label,
body.storyTheme #page-app .estimateCard__value,
body.storyTheme #page-app .label,
body.storyTheme #page-app .addrLine,
body.storyTheme #page-admin h1,
body.storyTheme #page-admin h2,
body.storyTheme #page-admin h3,
body.storyTheme #page-admin p,
body.storyTheme #page-admin span,
body.storyTheme #page-admin label,
body.storyTheme #page-admin strong,
body.storyTheme #page-admin small,
body.storyTheme #page-admin .muted,
body.storyTheme #page-admin .small,
body.storyTheme #page-admin .label,
body.storyTheme #page-admin .sectionLabel,
body.storyTheme #page-admin .topbar__headline{
  color:var(--story-readable-navy)!important;
  -webkit-text-fill-color:var(--story-readable-navy)!important;
  text-shadow:none!important;
}
body.storyTheme #page-app .muted,
body.storyTheme #page-app .sub,
body.storyTheme #page-app .small,
body.storyTheme #page-app .coinTicker,
body.storyTheme #page-app .holdingSub,
body.storyTheme #page-app .activityItem__meta,
body.storyTheme #page-app .newsItem__meta,
body.storyTheme #page-app .newsItem__desc,
body.storyTheme #page-admin .muted,
body.storyTheme #page-admin .small{
  color:var(--story-readable-muted)!important;
  -webkit-text-fill-color:var(--story-readable-muted)!important;
}

/* Keep the intentionally white login text and Home dashboard hero text */
body.storyTheme #page-login,
body.storyTheme #page-login *,
body.storyTheme #page-signup,
body.storyTheme #page-signup *{
  -webkit-text-fill-color:unset;
}
body.storyTheme #page-app .heroPanel--home,
body.storyTheme #page-app .heroPanel--home *{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  text-shadow:0 1px 1px rgba(9,47,85,.16)!important;
}
body.storyTheme #page-app .heroPanel--home .heroPanel__text,
body.storyTheme #page-app .heroPanel--home .heroMiniCard,
body.storyTheme #page-app .heroPanel--home .showcaseFeature,
body.storyTheme #page-app .heroPanel--home .heroMiniCard *,
body.storyTheme #page-app .heroPanel--home .showcaseFeature *{
  color:#ecfbff!important;
  -webkit-text-fill-color:#ecfbff!important;
}

/* Form values should remain readable on pale-blue inputs */
body.storyTheme #page-app input,
body.storyTheme #page-app select,
body.storyTheme #page-app textarea,
body.storyTheme #page-admin input,
body.storyTheme #page-admin select,
body.storyTheme #page-admin textarea{
  color:var(--story-readable-navy)!important;
  -webkit-text-fill-color:var(--story-readable-navy)!important;
}
body.storyTheme #page-app input::placeholder,
body.storyTheme #page-app textarea::placeholder,
body.storyTheme #page-admin input::placeholder,
body.storyTheme #page-admin textarea::placeholder{
  color:#4d7895!important;
  -webkit-text-fill-color:#4d7895!important;
}

/* Navigation: larger icons/text, centered alignment */
@media (min-width:1051px){
  body.storyTheme #page-app.page--shell:not(.hidden){grid-template-columns:210px minmax(0,1fr)!important;}
  body.storyTheme #page-app .bottomNav{
    width:210px!important;
    gap:8px!important;
    padding:22px 14px!important;
  }
  body.storyTheme #page-app .navItem{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    grid-template-columns:none!important;
    gap:10px!important;
    min-height:52px!important;
    padding:10px 12px!important;
    text-align:center!important;
  }
  body.storyTheme #page-app .navItem__icon{
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    border-radius:12px!important;
    font-size:19px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0!important;
  }
  body.storyTheme #page-app .navIconSvg{width:22px!important;height:22px!important;}
  body.storyTheme #page-app .navItem__label{
    font-size:16px!important;
    line-height:1!important;
    font-weight:900!important;
    letter-spacing:-.01em!important;
    text-align:center!important;
    flex:0 0 auto!important;
  }
}
@media (max-width:1050px){
  body.storyTheme #page-app .navItem{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:64px!important;
    gap:6px!important;
    text-align:center!important;
  }
  body.storyTheme #page-app .navItem__icon{
    width:34px!important;
    height:34px!important;
    font-size:18px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0!important;
  }
  body.storyTheme #page-app .navIconSvg{width:21px!important;height:21px!important;}
  body.storyTheme #page-app .navItem__label{
    font-size:13px!important;
    line-height:1!important;
    font-weight:900!important;
    text-align:center!important;
  }
}

/* =========================================================
   Story Wallet v1.0.9 — navy text consistency + centered menu
   ========================================================= */
body.storyTheme{
  --story-readable-navy:#092f55;
  --story-readable-navy-2:#123d63;
  --story-readable-muted:#275778;
}

/* After login, make white/gray copy use the same readable navy as the news headline. */
body.storyTheme #page-app :where(
  .topbar__eyebrow,.topbar__headline,
  .screenHero__eyebrow,.screenHero__title,.screenHero__text,
  .sectionLabel,.sectionHeader__meta,
  .featurePanel__title,.featurePanel__text,
  .securityBanner__title,.securityBanner__text,
  .showcaseFeature__label,.showcaseFeature strong,.showcaseFeature span,
  .heroMiniCard__label,.heroMiniCard strong,.heroMiniCard span,
  .coinName,.coinTicker,.coinPrice,.coinSub,.coinMeta,
  .portfolioHero__label,.portfolioHero__value,.portfolioHero__meta,
  .statCard__label,.statCard__value,
  .holdingName,.holdingSub,.holdingAmt,.holdingValue,
  .activityItem__title,.activityItem__meta,.activityItem__amount,
  .newsItem__title,.newsItem__meta,.newsItem__desc,.newsLink,
  .menuItem__label,.menuItem__title,.menuItem__text,
  .label,.estimateCard__label,.estimateCard__value,
  .empty,.muted,.small,
  h1,h2,h3,h4,p,label,strong,span,small
),
body.storyTheme #page-admin :where(
  .topbar__eyebrow,.topbar__headline,.sectionLabel,.label,.muted,.small,
  .adminTable th,.adminTable td,.card h2,.card h3,.card p,
  h1,h2,h3,h4,p,label,strong,span,small
){
  color:var(--story-readable-navy)!important;
  -webkit-text-fill-color:var(--story-readable-navy)!important;
  text-shadow:none!important;
}

/* Exception requested: keep the white text inside the Home hero dashboard panel. */
body.storyTheme #page-app .heroPanel--home,
body.storyTheme #page-app .heroPanel--home :where(.heroPanel__eyebrow,.heroPanel__title,.heroPanel__text,.heroPanel__bullets,.heroPanel__bullets *,span,strong,p,h2,div){
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  text-shadow:0 1px 12px rgba(0,76,140,.16)!important;
}

/* Keep form input content readable on sky panels. */
body.storyTheme #page-app :where(input,select,textarea),
body.storyTheme #page-admin :where(input,select,textarea){
  color:#10243d!important;
  -webkit-text-fill-color:#10243d!important;
}
body.storyTheme #page-app :where(input::placeholder,textarea::placeholder),
body.storyTheme #page-admin :where(input::placeholder,textarea::placeholder){
  color:#49708f!important;
  -webkit-text-fill-color:#49708f!important;
}

/* More visible, centered navigation labels/icons without harsh contrast. */
body.storyTheme #page-app .bottomNav{
  background:linear-gradient(180deg,#66d5ff 0%,#90e8ff 58%,#c5f6ff 116%)!important;
  border-color:rgba(255,255,255,.70)!important;
}
body.storyTheme #page-app .navItem{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  color:var(--story-readable-navy)!important;
  -webkit-text-fill-color:var(--story-readable-navy)!important;
  background:rgba(255,255,255,.22)!important;
  border:1px solid rgba(255,255,255,.46)!important;
  gap:7px!important;
}
body.storyTheme #page-app .navItem:hover{
  background:rgba(255,255,255,.34)!important;
  color:#06365f!important;
  -webkit-text-fill-color:#06365f!important;
}
body.storyTheme #page-app .navItem.is-active{
  background:linear-gradient(135deg,#19a9f4 0%,#39c9ff 100%)!important;
  border-color:rgba(255,255,255,.72)!important;
  color:#063259!important;
  -webkit-text-fill-color:#063259!important;
  box-shadow:0 10px 26px rgba(0,114,190,.22)!important;
}
body.storyTheme #page-app .navItem__icon{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
  color:inherit!important;
  -webkit-text-fill-color:inherit!important;
}
body.storyTheme #page-app .navItem__label{
  display:block!important;
  width:100%!important;
  color:inherit!important;
  -webkit-text-fill-color:inherit!important;
  text-align:center!important;
  font-weight:900!important;
  letter-spacing:-.02em!important;
}
body.storyTheme #page-app .navIconSvg,
body.storyTheme #page-app .navItem__icon svg{
  width:26px!important;
  height:26px!important;
}

@media (min-width:1051px){
  body.storyTheme #page-app .bottomNav{
    width:202px!important;
    padding:20px 12px!important;
    gap:8px!important;
  }
  body.storyTheme #page-app .navItem{
    min-height:62px!important;
    padding:9px 10px!important;
    border-radius:16px!important;
  }
  body.storyTheme #page-app .navItem__icon{
    width:34px!important;
    height:30px!important;
    font-size:22px!important;
  }
  body.storyTheme #page-app .navItem__label{
    font-size:15px!important;
    line-height:1.05!important;
  }
}

@media (max-width:1050px){
  body.storyTheme #page-app .bottomNav{
    gap:7px!important;
    padding:9px!important;
  }
  body.storyTheme #page-app .navItem{
    min-height:58px!important;
    padding:8px 6px!important;
    border-radius:14px!important;
  }
  body.storyTheme #page-app .navItem__icon{
    width:30px!important;
    height:28px!important;
    font-size:20px!important;
  }
  body.storyTheme #page-app .navItem__label{
    font-size:13px!important;
    line-height:1.05!important;
  }
}


/* =========================================================
   Story Wallet v1.1.0 — transfer CTA visibility
   ========================================================= */
body.storyTheme #page-app [data-screen="wallet"] .walletForm button[type="submit"],
body.storyTheme #page-app [data-screen="wallet"] .btn--primary.btn--mono{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  text-shadow:none!important;
}

/* ===== 관리자 페이지 TOP 버튼 (v1.2.0) ===== */
.adminTopBtn{
  position: fixed;
  right: 22px;
  bottom: 26px;
  z-index: 70;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  width: 56px;
  height: 56px;
  border: 1px solid rgba(148, 233, 212, .45);
  border-radius: 50%;
  background: rgba(13, 27, 42, .92);
  color: #94E9D4;
  cursor: pointer;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .45);
  backdrop-filter: blur(8px);
  transition: transform .15s ease, opacity .2s ease, background .15s ease;
  opacity: .92;
}
.adminTopBtn:hover{ transform: translateY(-3px); background: rgba(20, 40, 60, .96); opacity: 1; }
.adminTopBtn:active{ transform: translateY(-1px); }
.adminTopBtn__arrow{ font-size: 13px; line-height: 1; }
.adminTopBtn__label{ font-size: 10px; font-weight: 800; letter-spacing: .08em; line-height: 1; }
/* 이 프로젝트는 body.storyTheme #page-admin span 규칙이 !important로 모든 글자를 네이비로 강제합니다.
   TOP 버튼 텍스트가 어두운 배경에 묻히지 않도록, 같은 수준의 구체성으로 민트색을 다시 지정합니다. */
body.storyTheme #page-admin .adminTopBtn .adminTopBtn__arrow,
body.storyTheme #page-admin .adminTopBtn .adminTopBtn__label{
  color: #94E9D4 !important;
  -webkit-text-fill-color: #94E9D4 !important;
}
.adminTopBtn.hidden{ display: none; }
@media (max-width: 640px){ .adminTopBtn{ right: 14px; bottom: 18px; width: 50px; height: 50px; } }

/* ===== 관리자: 선택 회원 보유 코인 표 (v1.2.2) ===== */
.adminHoldings{
  border:1px solid var(--story-line);
  border-radius:10px;
  padding:8px 10px;
  background:rgba(25,32,50,.02);
  max-height:220px;
  overflow-y:auto;
}
.adminHoldings .muted{ padding:6px 2px; }
.adminHoldings__table{ width:100%; border-collapse:collapse; font-size:13px; }
body.storyTheme #page-admin .adminHoldings__table th,
body.storyTheme #page-admin .adminHoldings__table td{
  color:#092f55 !important;
  -webkit-text-fill-color:#092f55 !important;
  text-align:right;
  padding:6px 8px;
  border-bottom:1px solid rgba(25,32,50,.08);
}
body.storyTheme #page-admin .adminHoldings__table th{
  font-weight:800;
  color:#315f7f !important;
  -webkit-text-fill-color:#315f7f !important;
  border-bottom:1px solid rgba(25,32,50,.16);
}
.adminHoldings__table th:first-child,
.adminHoldings__table td:first-child{ text-align:left; }
.adminHoldings__sym{ font-weight:800; }
.adminHoldings__table tbody tr:last-child td{ border-bottom:none; }