/* XPRTO · Xpert dashboard — built on the app's own components (app.css + extra.css). */
.xprto-xpert .sc{ padding-bottom:calc(var(--sab) + 110px) }
.xpad{ padding:6px 18px 10px }
.xab .lc .v{ display:flex; align-items:center; gap:7px }
.xlive{ width:8px; height:8px; border-radius:50%; background:#1fb46a; box-shadow:0 0 0 4px rgba(31,180,106,.18) }
.xlive.off{ background:#c6cbd6; box-shadow:none }
.xab .av{ position:relative; overflow:hidden }
.xab .av .pimg{ background-size:cover; background-position:center }
.tb button .nd#xReqN{ width:auto; height:17px; min-width:17px; padding:0 4px; top:4px; right:8px; display:flex; align-items:center;
  justify-content:center; font-family:var(--n); font-size:10px; font-weight:700; color:#fff; background:#e24a5b; border-radius:9px }
#xDot{ align-items:center; justify-content:center; font-family:var(--n); font-size:10px; font-weight:700; color:#fff; background:#e24a5b }

/* stats */
.xstats{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:4px }
.xstats div{ display:flex; flex-direction:column; gap:3px; padding:14px 14px 12px; border-radius:20px; background:#fff;
  border:1px solid var(--line); box-shadow:0 6px 16px -12px rgba(0,18,51,.25) }
.xstats b{ font-family:var(--n); font-size:23px; font-weight:700; color:var(--navy); letter-spacing:-.02em }
.xstats span{ font-family:var(--n); font-size:9.5px; letter-spacing:.14em; color:var(--mute) }
.xstats div:first-child{ background:linear-gradient(140deg,#001233,#0e4bb0); border:0 }
.xstats div:first-child b{ color:var(--gold) } .xstats div:first-child span{ color:#a9bfe6 }

/* hero + codes */
.xhero{ margin-top:14px }
.xcode{ display:flex; flex-direction:column; align-items:center; gap:4px; margin:14px 0 4px; padding:14px 12px; border-radius:18px;
  background:rgba(255,255,255,.1); border:1px dashed rgba(243,197,24,.6); text-align:center }
.xcode span{ font-family:var(--n); font-size:9.5px; letter-spacing:.14em; color:var(--gold) }
.xcode b{ font-family:var(--n); font-size:34px; font-weight:700; letter-spacing:.18em; color:#fff }
.xcode i{ font-style:normal; font-size:11.5px; color:#a9bfe6 }
.xcode.big{ background:linear-gradient(140deg,#001233,#0e4bb0); border:0; box-shadow:var(--sh); margin:14px 0 6px; padding:18px 14px }
.xcode.big b{ font-size:40px }
.xcode.big.live{ background:linear-gradient(140deg,#0b5132,#1fb46a) }
.xcode.big.live span{ color:#d9ffe9 }
.xcode.big.live i{ color:#d9ffe9 }

/* cards */
.xcard{ display:block; width:100%; text-align:left; margin-top:10px }
.xcard .av6 .ini{ position:absolute; inset:0; border-radius:inherit }
.xcard .av6{ position:relative; overflow:hidden }
.xarea{ display:flex; align-items:center; gap:5px; margin-top:8px; font-size:12px; color:var(--mute) }
.xexp{ display:block; margin-top:8px; font-family:var(--n); font-size:11px; letter-spacing:.04em; color:#c2410c }
.xacts{ display:flex; gap:8px; margin-top:12px }
.xacts.big{ margin-top:14px }
.xbtn{ flex:1; height:44px; border-radius:14px; border:0; font:inherit; font-size:14px; font-weight:800; letter-spacing:-.01em;
  color:var(--navy); background:var(--gold); cursor:pointer; box-shadow:0 8px 18px -10px rgba(243,197,24,.9) }
.xbtn.ghost{ background:#fff; color:var(--navy); border:1.5px solid var(--line2); box-shadow:none }
.xbtn:active{ transform:scale(.98) }

/* wallet */
.xwal{ position:relative; overflow:hidden; padding:20px 18px 16px; border-radius:26px; color:#fff;
  background:linear-gradient(140deg,#001233,#0e4bb0); box-shadow:var(--sh) }
.xwal .gl{ position:absolute; right:-40px; top:-60px; width:180px; height:180px; border-radius:50%; background:radial-gradient(circle,rgba(243,197,24,.35),transparent 70%) }
.xwal .k{ position:relative; font-family:var(--n); font-size:10px; letter-spacing:.16em; color:var(--gold) }
.xwal > b{ position:relative; display:block; margin-top:6px; font-family:var(--n); font-size:36px; font-weight:700; letter-spacing:-.02em }
.xwr{ position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:16px; padding-top:14px; border-top:1px solid rgba(255,255,255,.15) }
.xwr div{ display:flex; flex-direction:column; gap:3px }
.xwr span{ font-size:10.5px; color:#a9bfe6 }
.xwr b{ font-family:var(--n); font-size:15px; font-weight:700 }
.paycard{ margin-top:10px }
.paycard[data-bk]{ cursor:pointer }
.payrow i a{ color:var(--navy3); font-weight:700; font-style:normal; text-decoration:none }

/* profile */
.xav5{ position:relative; overflow:hidden }
.xav5 .pimg{ background-size:cover; background-position:center }
.xpkh{ display:flex; align-items:center; gap:6px; margin:14px 0 6px; font-family:var(--n); font-size:10px; letter-spacing:.14em; color:var(--mute); text-transform:uppercase }
.xpk{ margin-top:8px; cursor:default }
.xpk .pkhd{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px }
.xpk .pknm{ display:flex; flex-direction:column; gap:2px }
.xpk .pknm b{ font-size:14.5px; font-weight:800; color:var(--navy) }
.xpk .pknm span{ font-size:11.5px; color:var(--mute) }
.xpk .pkam{ display:flex; flex-direction:column; align-items:flex-end; gap:2px; text-align:right }
.xpk .pkam b{ font-family:var(--n); font-size:17px; color:var(--navy) }
.xpk .pkam i{ font-style:normal; font-size:10.5px; color:#1a8a50; font-weight:700 }
.xpk .pkds{ display:block; margin-top:8px; font-size:12px; color:var(--mute); line-height:1.5 }
.xwk{ padding:10px 14px 14px }
.xday{ display:flex; align-items:center; gap:7px; padding:9px 0; border-bottom:1px solid var(--line) }
.xday:last-of-type{ border-bottom:0 }
.xday b{ width:34px; font-size:13px; font-weight:800; color:var(--navy) }
.xday i{ font-style:normal; font-size:11px; color:var(--mute) }
.xday input[type=time]{ flex:1 1 0; width:0; min-width:0; height:36px; padding:0 8px; border-radius:10px; border:1.5px solid var(--line2); font:inherit; font-size:12.5px; color:var(--navy); background:#fff }
.xday input[type=time]::-webkit-calendar-picker-indicator{ display:none }
.xday input:disabled{ opacity:.55 }
.xsw{ position:relative; width:38px; height:22px; flex:none }
.xsw input{ position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; z-index:1 }
.xsw span{ position:absolute; inset:0; border-radius:12px; background:#d3d8e2; transition:.2s }
.xsw span::after{ content:''; position:absolute; left:3px; top:3px; width:16px; height:16px; border-radius:50%; background:#fff; transition:.2s; box-shadow:0 1px 3px rgba(0,0,0,.2) }
.xsw input:checked + span{ background:var(--navy) }
.xsw input:checked + span::after{ transform:translateX(16px); background:var(--gold) }
.xday:has(.xsw input:not(:checked)) input[type=time]{ opacity:.4 }
.pfrow.danger .tx5 b{ color:#c62f3f }
button.pfrow{ width:100%; border:0; background:none; font:inherit; text-align:left; cursor:pointer }
a.pfrow{ text-decoration:none; color:inherit }

/* sheets */
#xSheet h4{ margin:4px 0 6px }
#xSheet p{ margin:0 0 12px; font-size:13px; color:var(--mute); line-height:1.5 }
#xSheet .fmchips{ margin-bottom:6px }
#xSheet .cxact{ margin-top:14px }
#xDet .exbody{ padding-bottom:calc(var(--sab) + 40px) }
.xprto-xpert .bkdnote a{ color:var(--navy3); font-weight:700 }

/* dark theme follows the member app */
html.dk .xstats div:not(:first-child),html.dk .xbtn.ghost{ background:#0d1a33; border-color:#1d2c4c }
html.dk .xstats div:not(:first-child) b,html.dk .xpk .pknm b,html.dk .xday b{ color:#fff }
.xprto-xpert #xpToast.tt{ bottom:calc(var(--sab) + 96px) }