/*
  EarnNova V79 — NovaCanvas responsive geometry + WebGL-inspired visual layer
  Loaded after every previous stylesheet so layout safety wins without touching business logic.
*/
:root{
  --nv79-cyan:#67f5e6;
  --nv79-blue:#5aa7ff;
  --nv79-violet:#8a72ff;
  --nv79-ink:#f7fbff;
  --nv79-muted:#a9b8d2;
  --nv79-line:rgba(151,209,255,.16);
  --nv79-deep:#040914;
  --nv79-panel:rgba(9,17,34,.82);
  --nv79-panel-2:rgba(14,25,49,.76);
  --nv79-shadow:0 24px 80px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.07);
  --nova-pointer-x:50%;
  --nova-pointer-y:18%;
}

html,
body.en-body{
  width:100%;
  max-width:100%;
  overflow-x:clip !important;
}

body.en-body{
  background:
    radial-gradient(900px 620px at var(--nova-pointer-x) var(--nova-pointer-y), rgba(90,167,255,.105), transparent 62%),
    radial-gradient(980px 680px at 3% 8%, rgba(103,245,230,.11), transparent 58%),
    radial-gradient(940px 640px at 98% 12%, rgba(138,114,255,.13), transparent 58%),
    linear-gradient(180deg,#071323 0%,#040914 56%,#02050b 100%) !important;
}

body.en-body::after{
  opacity:.34 !important;
  background:
    linear-gradient(118deg, transparent 0 39%, rgba(255,255,255,.026) 40%, transparent 41% 100%),
    radial-gradient(700px 360px at var(--nova-pointer-x) var(--nova-pointer-y), rgba(103,245,230,.035), transparent 70%) !important;
}

/* ---------- App geometry: sidebar + fluid main canvas ---------- */
.en-app-shell{
  width:100% !important;
  max-width:100vw !important;
  min-width:0 !important;
  grid-template-columns:clamp(278px,19.2vw,326px) minmax(0,1fr) !important;
  overflow:clip !important;
}

.en-sidebar{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  overflow-x:hidden !important;
  scrollbar-gutter:stable;
}
.en-sidebar > *,
.en-sidebar nav,
.en-sidebar form,
.en-nav,
.en-nav a,
.en-user-card,
.en-side-cta,
.en-logout{
  min-width:0 !important;
  max-width:100% !important;
}
.en-nav a,
.en-logout button,
.en-side-cta a{width:100% !important;}
.en-side-cta b,
.en-user-card b{overflow-wrap:anywhere;}

.en-app-main{
  position:relative !important;
  isolation:isolate;
  width:auto !important;
  max-width:none !important;
  min-width:0 !important;
  margin:0 !important;
  padding:24px clamp(18px,2.6vw,42px) 110px !important;
  overflow-x:clip !important;
}

.en-app-main::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:
    radial-gradient(680px 420px at var(--nova-pointer-x) var(--nova-pointer-y), rgba(103,245,230,.055), transparent 66%),
    linear-gradient(90deg, rgba(90,167,255,.018) 1px, transparent 1px),
    linear-gradient(rgba(90,167,255,.015) 1px, transparent 1px);
  background-size:auto,72px 72px,72px 72px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.78),transparent 92%);
}

.en-app-main > *,
.en-app-main section,
.en-app-main header,
.en-app-main footer,
.en-app-main article,
.en-app-main form,
.en-app-main table,
.en-app-main div{
  min-width:0;
}

.en-topbar{
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  margin:0 0 24px !important;
}

.en-topbar-title{min-width:0;}
.en-topbar-title h2{overflow-wrap:anywhere;}
.en-top-actions{flex:0 0 auto;}

.en-footer{
  width:100%;
  max-width:100%;
  overflow-wrap:anywhere;
}

img,svg,canvas,video{max-width:100%;height:auto;}

/* ---------- WebGL-inspired surfaces: pointer light, not heavy canvas ---------- */
.en-v79-surface{
  --surface-x:50%;
  --surface-y:25%;
  position:relative !important;
  transform-style:preserve-3d;
  backface-visibility:hidden;
}
.en-v79-surface::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  opacity:0;
  background:radial-gradient(360px circle at var(--surface-x) var(--surface-y), rgba(255,255,255,.095), rgba(103,245,230,.04) 28%, transparent 66%);
  transition:opacity .22s ease;
}
.en-v79-surface:hover::after{opacity:1;}
.en-v79-surface:hover{
  border-color:rgba(103,245,230,.28) !important;
  box-shadow:0 28px 90px rgba(0,0,0,.36), 0 0 42px rgba(90,167,255,.06), inset 0 1px 0 rgba(255,255,255,.09) !important;
}

/* ---------- Universal content containment ---------- */
.en-wallet-center,
.en-balance-hero,
.en-page-hero,
.en-command-card,
.en-table-card,
.en-card,
.en-ledger,
.en-ledger-hero,
.en-ledger-card,
.en-history-card,
.en-withdraw-form,
.en-withdraw-card,
.nova-signal-feed,
.nv74-wrap,
.nv74-hero,
.nv74-tabs,
.nv74-panel,
.en73-board,
.en73-rhero,
.en73-top,
.en73-list{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}

/* Tables stay inside their own viewport rather than stretching the whole app. */
.en-ledger-card,
.en-history-card,
.en-table-card,
.en-ledger-table,
.en-history-table{
  overflow:hidden;
}
.en-ledger-table,
.en-history-table,
.en-table-card{
  overflow-x:auto !important;
  overscroll-behavior-x:contain;
  scrollbar-width:thin;
}
.en-ledger table,
.en-history-table table,
.en-table-card table{
  width:max(100%,720px) !important;
  max-width:none !important;
}

/* ---------- Leaderboard geometry ---------- */
body.en-leader-v73 .en73-board{
  margin:0 0 80px !important;
}
body.en-leader-v73 .en73-rhero{
  padding:clamp(24px,3vw,38px) !important;
  overflow:hidden !important;
}
body.en-leader-v73 .en73-top{
  grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr) !important;
}
body.en-leader-v73 .en73-top > div{
  min-width:0 !important;
  overflow:hidden;
}
body.en-leader-v73 .en73-top b{
  overflow-wrap:anywhere;
  font-size:clamp(21px,2vw,28px) !important;
}
body.en-leader-v73 .en73-row{
  grid-template-columns:68px minmax(190px,1.35fr) minmax(118px,.78fr) minmax(138px,.9fr) minmax(112px,.7fr) 58px !important;
  gap:clamp(10px,1.1vw,16px) !important;
  width:100% !important;
  min-width:0 !important;
  overflow:hidden;
}
body.en-leader-v73 .en73-row > *{min-width:0;}
body.en-leader-v73 .member b,
body.en-leader-v73 .member small,
body.en-leader-v73 .stat-value{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* ---------- Withdraw + payout history ---------- */
.en-wallet-center{
  margin-left:auto !important;
  margin-right:auto !important;
}
.en-withdraw-form{max-width:760px !important;}
.en-history-card{max-width:980px !important;}
.en-amount-box{max-width:100%;}
.en-amount-box input{min-width:0 !important;}
.en-withdraw-info{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
.en-history-head{min-width:0;}

/* ---------- Live reward feed ---------- */
.nova-signal-feed{
  margin-left:0 !important;
  margin-right:0 !important;
  overflow:hidden !important;
}
.nova-signal-head > div{min-width:0;}
.nova-signal-head span{overflow-wrap:anywhere;}
.nova-signal-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)) !important;
}
.nova-signal-item{min-width:0;}
.nova-signal-user,
.nova-signal-meta{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* ---------- PTC deck: no clipped fourth column ---------- */
.earnnova-ptc-v74 .nv74-wrap{
  margin:0 0 74px !important;
  padding:0 !important;
  overflow:visible !important;
}
.earnnova-ptc-v74 .nv74-tabs{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}
.earnnova-ptc-v74 .nv74-tab,
.earnnova-ptc-v74 .nv74-panel,
.earnnova-ptc-v74 .nv74-card,
.earnnova-ptc-v74 .nv74-head,
.earnnova-ptc-v74 .nv74-loader{
  min-width:0 !important;
  max-width:100% !important;
}
.earnnova-ptc-v74 .nv74-grid{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  grid-template-columns:repeat(auto-fit,minmax(270px,1fr)) !important;
  align-items:stretch;
}
.earnnova-ptc-v74 .nv74-card{
  width:100% !important;
  display:flex;
  flex-direction:column;
}
.earnnova-ptc-v74 .nv74-card h3,
.earnnova-ptc-v74 .nv74-card p{
  overflow-wrap:anywhere;
}
.earnnova-ptc-v74 .nv74-meta{
  margin-top:auto !important;
  flex-wrap:wrap;
}
.earnnova-ptc-v74 .nv74-start,
.earnnova-ptc-v74 .nv74-retry{
  max-width:100%;
  white-space:normal;
  text-align:center;
}
.earnnova-ptc-v74 .nv74-loader-inner{
  grid-template-columns:minmax(140px,185px) minmax(0,1fr) !important;
}

/* ---------- Refined Nova glass hierarchy ---------- */
.en-wallet-center,
.en-ledger-hero,
.en-ledger-card,
.en-history-card,
.nova-signal-feed,
.en73-rhero,
.en73-top > div,
.en73-row,
.nv74-hero,
.nv74-tabs,
.nv74-card,
.nv74-loader{
  border-color:var(--nv79-line) !important;
  box-shadow:var(--nv79-shadow) !important;
}

.en-btn,
.nv74-start,
.nv74-retry,
.nv74-more,
.en-top-actions a{
  border-radius:16px !important;
}
.en-btn,
.nv74-start,
.nv74-retry{
  background:linear-gradient(135deg,#6af5e5 0%,#62b8ff 54%,#8a72ff 100%) !important;
  color:#04101d !important;
  box-shadow:0 14px 38px rgba(90,167,255,.18), inset 0 1px 0 rgba(255,255,255,.42) !important;
}
.en-btn-ghost{
  background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.035)) !important;
  color:var(--nv79-ink) !important;
}

/* ---------- Breakpoints ---------- */
@media(max-width:1240px){
  .en-app-shell{grid-template-columns:286px minmax(0,1fr) !important;}
  .en-app-main{padding-left:24px !important;padding-right:24px !important;}
  body.en-leader-v73 .en73-row{
    grid-template-columns:58px minmax(165px,1.2fr) minmax(105px,.72fr) minmax(126px,.82fr) minmax(96px,.64fr) 54px !important;
  }
}

@media(max-width:1080px){
  body.en-leader-v73 .en73-row{
    grid-template-columns:56px minmax(180px,1.2fr) minmax(120px,.8fr) minmax(135px,.9fr) !important;
    grid-template-areas:
      "rank member missions reward"
      "rank member pace ring";
  }
  body.en-leader-v73 .en73-row > :nth-child(1){grid-area:rank;}
  body.en-leader-v73 .en73-row > :nth-child(2){grid-area:member;}
  body.en-leader-v73 .en73-row > :nth-child(3){grid-area:missions;}
  body.en-leader-v73 .en73-row > :nth-child(4){grid-area:reward;}
  body.en-leader-v73 .en73-row > :nth-child(5){grid-area:pace;}
  body.en-leader-v73 .en73-row > :nth-child(6){grid-area:ring;}
  .earnnova-ptc-v74 .nv74-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr)) !important;}
}

@media(max-width:960px){
  .en-app-shell{display:block !important;max-width:100% !important;}
  .en-app-main{width:100% !important;max-width:100% !important;padding:16px 14px 104px !important;}
  .en-topbar{margin-bottom:18px !important;}
  .en-sidebar{width:min(326px,calc(100vw - 24px)) !important;max-width:calc(100vw - 24px) !important;}
  body.en-leader-v73 .en73-top{grid-template-columns:1fr !important;}
  .earnnova-ptc-v74 .nv74-tabs{grid-template-columns:1fr !important;}
}

@media(max-width:720px){
  .en-app-main{padding-left:12px !important;padding-right:12px !important;}
  .en73-rhero,.en-ledger-hero,.en-ledger-card,.en-history-card,.en-wallet-center,.nova-signal-feed,.nv74-hero,.nv74-loader{border-radius:24px !important;}
  body.en-leader-v73 .en73-row{
    grid-template-columns:50px minmax(0,1fr) !important;
    grid-template-areas:
      "rank member"
      "missions missions"
      "reward reward"
      "pace ring";
    padding:16px !important;
  }
  body.en-leader-v73 .member b,
  body.en-leader-v73 .member small,
  body.en-leader-v73 .stat-value{white-space:normal;overflow-wrap:anywhere;}
  .en-withdraw-info{grid-template-columns:1fr !important;}
  .nova-signal-head{flex-direction:column;}
  .earnnova-ptc-v74 .nv74-grid{grid-template-columns:1fr !important;}
  .earnnova-ptc-v74 .nv74-loader-inner{grid-template-columns:1fr !important;text-align:center;}
  .earnnova-ptc-v74 .nv74-reactor{margin:0 auto;}
  .en-topbar{align-items:flex-start !important;}
}

@media(max-width:480px){
  .en-quick-amounts{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .en-amount-box{grid-template-columns:auto minmax(0,1fr) !important;}
  .en-max-btn{grid-column:1/-1;width:100%;}
  .en-topbar-title h2{font-size:25px !important;}
  .en-wallet-center h1{font-size:clamp(42px,15vw,60px) !important;}
}

@media(prefers-reduced-motion:reduce){
  .en-v79-surface::after{display:none;}
}

/* Neutralize legacy full-viewport canvases when they live inside the authenticated column. */
.en-app-main :where(.main,.wrap,.br-main,.vp-app-main,.cf-v4-main,.cf-missions-v72,.cf-rank-board,.brx-league,.container,.content,.page-wrap){
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  margin-left:0 !important;
  margin-right:0 !important;
}
.en-public-main :where(.main,.wrap,.container,.content,.page-wrap){
  max-width:min(1480px,calc(100% - 32px)) !important;
}
