:root{
  --bg:#07090d;
  --bg-soft:#0b0f15;
  --surface:rgba(16,21,29,.82);
  --surface-2:rgba(20,27,37,.92);
  --surface-3:#111821;
  --line:rgba(255,255,255,.08);
  --line-strong:rgba(255,255,255,.13);
  --text:#f4f7fb;
  --muted:#8d98a8;
  --green:#54e38e;
  --green-2:#29c874;
  --orange:#ffad5c;
  --red:#ff6b7a;
  --shadow:0 24px 70px rgba(0,0,0,.42);
  --radius:18px;
  --max-content-width:1400px;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color-scheme:dark;
  font-size:16px;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);overflow-x:hidden}
body{
  padding:24px;
  background:
    radial-gradient(800px 500px at 8% -5%,rgba(48,214,125,.12),transparent 60%),
    radial-gradient(700px 450px at 95% 8%,rgba(88,110,255,.10),transparent 62%),
    radial-gradient(900px 600px at 50% 100%,rgba(0,0,0,.8),transparent 65%),
    linear-gradient(180deg,#080b10 0%,#06080c 100%);
}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.6),transparent 75%)}
#app{width:100%;max-width:var(--max-content-width);margin:auto;display:flex;flex-direction:column;gap:16px;position:relative;z-index:1}
body,input,button,select,textarea{font:inherit;color:var(--text)}
button{font-family:inherit}

#support-banner{
  position:relative;overflow:hidden;width:100%;padding:10px 16px;margin:0;border:1px solid rgba(255,107,122,.18);border-radius:12px;background:linear-gradient(90deg,rgba(255,107,122,.07),rgba(255,255,255,.025),rgba(84,227,142,.06));box-shadow:0 10px 35px rgba(0,0,0,.22);text-align:center;font-size:.78rem;font-weight:800;letter-spacing:.04em;color:#dce3ec
}
.marquee-track{display:flex;width:max-content;min-width:max-content;will-change:transform;animation:marquee-slide 7s linear infinite}
.marquee-group{flex:0 0 auto;display:flex;width:max-content}.marquee-item{flex:0 0 auto;display:block;padding:0 18px 0 0;color:#ff8792;white-space:nowrap;font-weight:900}
.marquee-item span{padding-left:10px}
@keyframes marquee-slide{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
#discord-link,#telegram-link{margin:0!important;text-align:left!important;font-size:.82rem}
#discord-link a,#telegram-link a{display:inline-flex;align-items:center;gap:7px;text-decoration:none!important;color:var(--muted)!important;padding:4px 0;transition:.2s}
#discord-link a:hover,#telegram-link a:hover{color:var(--green)!important}

.toolbar{
  position:relative;display:grid;grid-template-columns:auto auto 1fr auto;gap:12px;align-items:center;padding:14px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(180deg,rgba(17,23,32,.88),rgba(10,14,20,.82));box-shadow:var(--shadow);backdrop-filter:blur(18px);z-index:2
}
.toolbar:before{content:"VibeCard";font-size:1.05rem;font-weight:950;letter-spacing:.14em;color:#fff;margin-right:2px}
#hamburger{order:4;width:46px;height:46px;border-radius:13px;border:1px solid var(--line-strong);background:var(--surface-3);cursor:pointer;font-size:19px;transition:.2s}
#hamburger:hover{transform:translateY(-2px);border-color:rgba(84,227,142,.4);box-shadow:0 10px 25px rgba(84,227,142,.08)}
.toolbar .balance{display:flex;flex-direction:column;gap:3px;min-width:105px}
.toolbar .balance label{font-size:.68rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);font-weight:800}
.toolbar #balance{display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;border:1px solid rgba(84,227,142,.18);border-radius:10px;background:rgba(84,227,142,.06);color:var(--green);font-weight:900}
.toolbar input{min-width:0;width:100%;height:46px;padding:0 16px;border:1px solid var(--line);border-radius:13px;background:rgba(3,6,10,.6);outline:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.03);transition:.2s}
.toolbar input:focus{border-color:rgba(84,227,142,.42);box-shadow:0 0 0 4px rgba(84,227,142,.07)}
.toolbar input::placeholder{color:#687383}
#mobile-nav{position:absolute;right:14px;top:calc(100% + 8px);max-width:calc(100% - 28px);display:none;background:#0c1118;border:1px solid var(--line-strong);border-radius:14px;padding:8px;z-index:50;box-shadow:var(--shadow)}
#mobile-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
#mobile-nav .nav-link{display:block;width:100%;min-height:44px;border:0;background:transparent;border-radius:10px;padding:11px 14px;text-align:left;color:var(--muted);font-weight:800;cursor:pointer;text-decoration:none}
#mobile-nav .nav-link:hover{background:rgba(255,255,255,.05);color:var(--text)}

.view-switch{display:flex!important;gap:8px!important;align-items:center!important;overflow:auto;padding:3px!important;scrollbar-width:none}
.view-switch::-webkit-scrollbar{display:none}
.view-switch .btn{flex:0 0 auto;white-space:nowrap}
.btn{
  min-height:42px;min-width:44px;padding:10px 15px;border:1px solid var(--line);border-radius:12px;background:rgba(17,23,32,.78);color:#cbd3de;font-weight:800;cursor:pointer;transition:transform .18s,background .18s,border-color .18s,box-shadow .18s,color .18s
}
.btn:hover{transform:translateY(-2px);background:#151d27;border-color:rgba(255,255,255,.16);color:#fff;box-shadow:0 10px 24px rgba(0,0,0,.25)}
.btn:active{transform:translateY(0)}
.btn[aria-pressed="true"]{color:#06140c;background:linear-gradient(135deg,var(--green),#78f1a8);border-color:transparent;box-shadow:0 8px 25px rgba(84,227,142,.18)}
.btn.buy,.buy{background:linear-gradient(135deg,#35d67f,#21b96a);color:#04130b;border:0;box-shadow:0 8px 24px rgba(41,200,116,.16)}
.btn.buy:hover,.buy:hover{background:linear-gradient(135deg,#65eba0,#2bd47a);box-shadow:0 12px 30px rgba(41,200,116,.24)}

.table-wrap{width:100%;min-width:0;overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(180deg,rgba(15,21,29,.86),rgba(9,13,19,.86));box-shadow:var(--shadow);backdrop-filter:blur(18px)}
table{width:100%;border-collapse:collapse;font-size:.88rem}
thead{display:table-header-group}
thead th{text-align:left;padding:15px 14px;border-bottom:1px solid var(--line);color:#697587;font-size:.68rem;letter-spacing:.11em;text-transform:uppercase;font-weight:900;white-space:nowrap;background:rgba(255,255,255,.018)}
tbody tr{border-bottom:1px solid rgba(255,255,255,.045);transition:.18s}
tbody tr:last-child{border-bottom:0}
tbody tr:hover{background:rgba(84,227,142,.035)}
tbody td{padding:14px;color:#cdd5df;vertical-align:middle}
tbody td:first-child{font-weight:850;color:#fff}
.actions{display:flex;gap:7px;align-items:center;justify-content:flex-end;width:100%}
.badge{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.035);color:#aab4c1;font-size:.72rem;font-weight:850}
.badge[data-kind="green"]{color:var(--green);border-color:rgba(84,227,142,.18);background:rgba(84,227,142,.06)}
.badge[data-kind="orange"]{color:var(--orange);border-color:rgba(255,173,92,.18);background:rgba(255,173,92,.06)}

.info-box{margin:14px;padding:18px;border:1px solid var(--line);border-radius:15px;background:linear-gradient(135deg,rgba(255,255,255,.035),rgba(255,255,255,.015));box-shadow:0 12px 35px rgba(0,0,0,.2)}
.gold-header{margin:14px;padding:12px 15px;border-radius:12px;color:#201300;background:linear-gradient(100deg,#c79437,#ffe08a,#b97b24);background-size:200% 100%;animation:goldShift 4s linear infinite;font-weight:950;letter-spacing:.08em;box-shadow:0 10px 35px rgba(224,170,62,.12)}
@keyframes goldShift{0%{background-position:0}100%{background-position:200%}}

.footer{display:flex;justify-content:space-between;align-items:center;padding:2px 6px;color:var(--muted);font-size:.78rem}

.pm-backdrop{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(2,4,7,.78);backdrop-filter:blur(12px);z-index:9998}
.pm-card{position:relative;width:min(640px,100%);padding:24px;border:1px solid var(--line-strong);border-radius:22px;background:linear-gradient(180deg,#121922,#0b1017);box-shadow:0 30px 100px rgba(0,0,0,.6)}
.pm-title{font-size:1.15rem;font-weight:950;margin-bottom:9px}.pm-body{color:var(--muted);line-height:1.55;margin-bottom:16px}.pm-actions{display:flex;gap:9px;justify-content:space-between;flex-wrap:wrap}.pm-btn{flex:1;min-width:100px;min-height:46px;padding:12px 15px;border:1px solid var(--line);border-radius:12px;background:#111820;color:#fff;cursor:pointer;font-weight:850;transition:.18s}.pm-btn:hover{background:#18212b;transform:translateY(-2px)}.pm-close{position:absolute;right:12px;top:12px;width:38px;height:38px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.03);color:var(--muted);cursor:pointer}
.gc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.gc-btn{min-height:54px;border:1px solid var(--line);border-radius:13px;background:#101720;color:#fff;font-weight:900;cursor:pointer;transition:.18s}.gc-btn:hover{border-color:rgba(84,227,142,.35);background:rgba(84,227,142,.06);transform:translateY(-2px)}
.gc-code-box{margin-top:16px;border-top:1px solid var(--line);padding-top:15px}.gc-code-label{color:var(--muted);font-size:.82rem;margin-bottom:8px;font-weight:800}.gc-code-row{display:flex;gap:8px}.gc-code-input{flex:1;min-width:0;padding:12px;border:1px solid var(--line);border-radius:11px;background:#080d13;color:#fff;outline:none}.gc-code-input:focus{border-color:rgba(84,227,142,.45)}.gc-code-msg{margin-top:8px;color:var(--muted);font-size:.8rem}
#ltc-addr,#btc-addr,#cash-addr{display:block;margin-top:7px;padding:13px;border:1px solid var(--line);border-radius:11px;background:#080d13;color:#e8edf4;word-break:break-all;text-align:center;font-weight:750}
.pm-code{display:block;margin-top:10px;padding:12px;border:1px solid rgba(84,227,142,.18);border-radius:11px;background:rgba(84,227,142,.05);color:var(--green);text-align:center;font-weight:950;letter-spacing:.1em}.pm-warning{margin-top:9px;color:var(--muted);font-size:.82rem;text-align:center}#ltc-timer,#btc-timer,#cash-timer{display:inline-block;padding:7px 10px;border:1px solid var(--line);border-radius:9px;background:#0b1118;font-weight:900}
#toast{font-family:inherit!important}

@media(max-width:900px){
  body{padding:14px}.toolbar{grid-template-columns:auto 1fr auto}.toolbar:before{display:none}.toolbar .balance{grid-column:1}.toolbar input{grid-column:2}.toolbar #hamburger{grid-column:3}.table-wrap{overflow-x:auto}table{min-width:780px}
}
@media(max-width:700px){
  body{padding:14px max(14px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))}
  #discord-link,#telegram-link{display:none}
  #app{gap:12px}
  .toolbar{grid-template-columns:minmax(0,1fr) auto;padding:10px;border-radius:16px}
  .toolbar .balance{grid-column:1;grid-row:1;min-width:0;align-items:flex-start}
  .toolbar #balance{font-size:.9rem}
  .toolbar #hamburger{grid-column:2;grid-row:1}
  .toolbar input{grid-column:1 / -1;grid-row:2;height:46px;font-size:1rem}
  .view-switch{min-width:0;max-width:100%;margin-top:0;overscroll-behavior-x:contain}
  .view-switch .btn,.actions .btn{min-height:44px}
  .table-wrap{border-radius:15px;overflow:hidden}
  table{min-width:0;display:block}
  thead{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  tbody{display:flex;flex-direction:column;gap:9px;padding:9px}
  tbody tr{display:block;min-width:0;padding:11px;border:1px solid var(--line);border-radius:14px;background:rgba(17,23,31,.76);box-shadow:0 10px 28px rgba(0,0,0,.2)}
  tbody td{display:grid;grid-template-columns:minmax(64px,.35fr) minmax(0,1fr);align-items:start;gap:12px;padding:7px 4px;border:0;text-align:right;overflow-wrap:anywhere}
  tbody td>*{min-width:0;max-width:100%}
  .table-wrap tbody td:before{content:attr(data-label);text-align:left;color:var(--muted);font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;font-weight:900}
  tbody td:empty{display:none}
  tbody td[colspan]{display:block;text-align:left}
  tbody td[colspan]:before{display:none}
  .table-wrap td.actions{display:flex;flex-wrap:wrap;justify-content:flex-end}
  .table-wrap td.actions:before{display:none}
  .badge{white-space:normal;justify-content:flex-end;line-height:1.5}
  .info-box{margin:9px;padding:14px;overflow-wrap:anywhere}
  .footer{flex-wrap:wrap;gap:8px}
  .pm-backdrop{padding:12px max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}
  .pm-card{max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px - env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior-y:contain;overflow-wrap:anywhere}
  .pm-title{padding-right:40px}
  .pm-close{width:44px;height:44px}
  .gc-code-input{font-size:1rem}
  #toast{max-width:calc(100% - 24px);overflow-wrap:anywhere;bottom:max(12px,env(safe-area-inset-bottom))!important}
}
@media(max-width:480px){body{padding:10px max(10px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}.toolbar{gap:8px}.toolbar #balance{padding:8px 9px}.view-switch .btn{padding:9px 12px;font-size:.8rem}.pm-card{padding:18px}.gc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.gc-code-row{flex-wrap:wrap}.gc-code-input{flex-basis:100%}}
.brand-strip{display:flex;justify-content:space-between;align-items:center;padding:2px 4px 0;color:#fff}.brand-strip>div:first-child{display:flex;align-items:center;gap:9px}.brand-dot{width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 18px rgba(84,227,142,.8)}.brand-sub{color:var(--muted);font-size:.72rem;font-weight:700;margin-left:2px}.live-status{display:flex;align-items:center;gap:7px;color:#728092;font-size:.66rem;letter-spacing:.1em;font-weight:900}.live-status span{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 10px rgba(84,227,142,.8)}
.brand-strip{flex-wrap:wrap;gap:10px}
:where(button,a,input):focus-visible{outline:2px solid var(--green);outline-offset:3px}
@media(hover:none){button:hover{transform:none}}
@media(prefers-reduced-motion:reduce){.gold-header{animation:none}*,*:before,*:after{transition:none!important}}
