:root {
  --bg:#000; --bg2:#080808; --s:rgba(255,255,255,.03);
  --b:rgba(255,255,255,.07); --b2:rgba(255,255,255,.12);
  --t:#fff; --m:#666; --soft:#aaa;
  --g:#c9a84c; --g2:#e8c96d; --g3:#f5e0a0;
  --gr:#4ade80; --rd:#f87171; --bl:#60a5fa;
  --r:18px; --tr:.3s cubic-bezier(.4,0,.2,1);
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;}
body{background:var(--bg);color:var(--t);font-family:'Inter',system-ui,-apple-system,sans-serif;line-height:1.6;overflow-x:hidden;overscroll-behavior:none;-webkit-font-smoothing:antialiased;}
button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation;}
img{max-width:100%;height:auto;}
::-webkit-scrollbar{width:0;display:none;}

#app-root{
  display:none;min-height:100vh;min-height:100dvh;
  flex-direction:column;background:var(--bg);
  position:relative;max-width:480px;margin:0 auto;
}
#app-root.active{display:flex;}
#landing-root.hidden{display:none;}

.app-view{display:none;flex:1;overflow-y:auto;overflow-x:hidden;padding-bottom:80px;-webkit-overflow-scrolling:touch;}
.app-view.active{display:block;animation:viewIn .3s ease both;}
@keyframes viewIn{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}

.bottom-nav{
  position:fixed;bottom:0;left:50%;transform:translateX(-50%);
  width:100%;max-width:480px;
  display:flex;align-items:center;justify-content:space-around;
  height:68px;padding-bottom:env(safe-area-inset-bottom,0);
  background:rgba(0,0,0,.92);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  border-top:1px solid rgba(255,255,255,.08);z-index:100;
}
.nav-tab{
  display:flex;flex-direction:column;align-items:center;gap:3px;
  padding:6px 12px;border:none;background:none;color:var(--m);
  font-size:10px;font-weight:600;letter-spacing:.3px;cursor:pointer;
  transition:color .2s;position:relative;
}
.nav-tab .tab-icon{font-size:22px;line-height:1;}
.nav-tab.active{color:var(--g);}
.nav-tab.active::before{
  content:'';position:absolute;top:-1px;left:50%;transform:translateX(-50%);
  width:24px;height:2px;border-radius:2px;
  background:linear-gradient(90deg,var(--g),var(--g2));
}

.app-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 20px 12px;position:sticky;top:0;z-index:50;
  background:rgba(0,0,0,.85);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
}
.app-header-title{font-size:18px;font-weight:800;letter-spacing:-.3px;}
.app-logo{
  font-size:15px;font-weight:900;letter-spacing:2px;
  background:linear-gradient(135deg,var(--g),var(--g2));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}

.home-greeting{padding:8px 20px 0;}
.home-greeting h2{font-size:24px;font-weight:800;letter-spacing:-.5px;}
.home-greeting p{font-size:13px;color:var(--m);margin-top:2px;}

.balance-card{
  margin:16px 20px;padding:24px;border-radius:20px;
  background:linear-gradient(135deg,rgba(201,168,76,.12),rgba(201,168,76,.04));
  border:1px solid rgba(201,168,76,.2);position:relative;overflow:hidden;
}
.balance-card::before{
  content:'';position:absolute;top:-60px;right:-60px;width:160px;height:160px;
  border-radius:50%;background:radial-gradient(circle,rgba(201,168,76,.15),transparent 70%);
  pointer-events:none;
}
.balance-label{font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--m);}
.balance-amount{font-size:36px;font-weight:900;letter-spacing:-2px;margin:6px 0;line-height:1;
  background:linear-gradient(135deg,var(--g),var(--g2),var(--g3));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.balance-sub{font-size:11px;color:var(--m);font-weight:500;}

.quick-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:0 20px;margin-top:4px;}
.qa-btn{
  display:flex;flex-direction:column;align-items:center;gap:6px;
  padding:14px 8px;border-radius:16px;border:1px solid var(--b);
  background:rgba(255,255,255,.03);cursor:pointer;transition:all .2s;
}
.qa-btn:active{transform:scale(.95);background:rgba(201,168,76,.08);}
.qa-icon{font-size:22px;}
.qa-label{font-size:10px;font-weight:700;color:var(--soft);letter-spacing:.3px;}

.section-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 20px 10px;
}
.section-title{font-size:15px;font-weight:800;letter-spacing:-.2px;}
.section-link{font-size:12px;color:var(--g);font-weight:600;cursor:pointer;background:none;border:none;}

.gift-item{
  display:flex;align-items:center;gap:12px;
  padding:12px 20px;transition:background .2s;cursor:pointer;
}
.gift-item:active{background:rgba(255,255,255,.03);}
.gift-icon{
  width:42px;height:42px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  font-size:20px;flex-shrink:0;
  background:rgba(201,168,76,.1);border:1px solid rgba(201,168,76,.15);
}
.gift-meta{flex:1;min-width:0;}
.gift-name{font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.gift-date{font-size:11px;color:var(--m);margin-top:2px;}
.gift-amount{font-size:14px;font-weight:800;}
.gift-amount.positive{color:var(--gr);}
.gift-amount.negative{color:var(--rd);}

.gifts-sent-counter{
  margin:20px 20px 0;padding:16px 20px;border-radius:16px;
  background:linear-gradient(135deg,rgba(201,168,76,.08),rgba(201,168,76,.03));
  border:1px solid rgba(201,168,76,.15);
  display:flex;align-items:center;gap:14px;
}
.gsc-icon{font-size:28px;}
.gsc-val{font-size:22px;font-weight:900;color:var(--g);}
.gsc-lbl{font-size:11px;color:var(--m);font-weight:500;}

.ad-banner{
  margin:16px 20px 0;padding:16px;border-radius:14px;
  background:linear-gradient(135deg,rgba(201,168,76,.06),rgba(201,168,76,.02));
  border:1px solid rgba(201,168,76,.12);
  display:flex;align-items:center;gap:12px;cursor:pointer;
  transition:all .2s;
}
.ad-banner:active{transform:scale(.98);}
.ad-badge{font-size:8px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--m);position:absolute;top:6px;right:10px;}
.ad-banner-text h4{font-size:13px;font-weight:800;color:var(--t);}
.ad-banner-text p{font-size:11px;color:var(--m);margin-top:2px;}

.wizard-container{padding:20px;}
.wizard-steps{display:flex;align-items:center;gap:0;margin-bottom:24px;padding:0 4px;}
.wizard-step{
  flex:1;display:flex;align-items:center;gap:0;
}
.ws-circle{
  width:28px;height:28px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:800;
  border:2px solid var(--b);color:var(--m);
  transition:all .3s;flex-shrink:0;
}
.ws-circle.active{border-color:var(--g);color:var(--g);background:rgba(201,168,76,.1);}
.ws-circle.done{border-color:var(--gr);color:#000;background:var(--gr);}
.ws-line{flex:1;height:2px;background:var(--b);margin:0 6px;}
.ws-line.done{background:var(--gr);}

.wizard-panel{display:none;animation:viewIn .3s ease both;}
.wizard-panel.active{display:block;}

.form-group{margin-bottom:18px;}
.form-label{font-size:12px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--m);margin-bottom:8px;display:block;}
.form-input{
  width:100%;padding:14px 16px;border-radius:14px;
  border:1px solid var(--b);background:rgba(255,255,255,.04);
  color:var(--t);font-size:16px;font-family:inherit;outline:none;
  transition:border-color .2s;-webkit-appearance:none;
}
.form-input:focus{border-color:rgba(201,168,76,.5);}
.form-input::placeholder{color:var(--m);}
.form-select{
  width:100%;padding:14px 16px;border-radius:14px;
  border:1px solid var(--b);background:rgba(255,255,255,.04);
  color:var(--t);font-size:16px;font-family:inherit;outline:none;
  -webkit-appearance:none;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23666' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center;
}
.form-select option{background:#111;color:#fff;}

.btn-gold{
  width:100%;padding:16px;border-radius:14px;border:none;
  background:linear-gradient(135deg,var(--g),var(--g2));color:#000;
  font-size:15px;font-weight:800;font-family:inherit;cursor:pointer;
  transition:all .2s;letter-spacing:.2px;
}
.btn-gold:active{transform:scale(.97);}
.btn-gold:disabled{opacity:.4;cursor:not-allowed;transform:none;}

.btn-outline{
  width:100%;padding:14px;border-radius:14px;
  border:1px solid var(--b);background:transparent;color:var(--t);
  font-size:14px;font-weight:600;font-family:inherit;cursor:pointer;
  transition:all .2s;
}
.btn-outline:active{background:rgba(255,255,255,.04);}

.occasion-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px;}
.occasion-card{
  padding:16px 8px;border-radius:14px;border:1px solid var(--b);
  background:rgba(255,255,255,.03);text-align:center;cursor:pointer;
  transition:all .2s;
}
.occasion-card.selected{border-color:var(--g);background:rgba(201,168,76,.08);}
.occasion-card:active{transform:scale(.95);}
.occasion-emoji{font-size:28px;margin-bottom:6px;}
.occasion-label{font-size:11px;font-weight:700;color:var(--soft);}

.tone-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:18px;}
.tone-card{
  padding:12px;border-radius:12px;border:1px solid var(--b);
  background:rgba(255,255,255,.03);text-align:center;cursor:pointer;
  transition:all .2s;font-size:13px;font-weight:600;color:var(--soft);
}
.tone-card.selected{border-color:var(--g);color:var(--g);background:rgba(201,168,76,.08);}

.style-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px;}
.style-card{
  padding:14px 8px;border-radius:14px;border:1px solid var(--b);
  background:rgba(255,255,255,.03);text-align:center;cursor:pointer;
  transition:all .2s;
}
.style-card.selected{border-color:var(--g);background:rgba(201,168,76,.08);}
.style-icon{font-size:24px;margin-bottom:4px;}
.style-label{font-size:11px;font-weight:700;color:var(--soft);}

.gift-preview{
  margin:16px 0;padding:24px;border-radius:20px;
  background:linear-gradient(160deg,#111,#060606);
  border:1px solid rgba(201,168,76,.2);text-align:center;
  position:relative;overflow:hidden;
}
.gift-preview::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--g),var(--g2),var(--g3));
}
.gp-occasion{font-size:40px;margin-bottom:10px;}
.gp-message{font-size:14px;color:var(--soft);font-style:italic;margin-bottom:12px;line-height:1.6;}
.gp-amount{font-size:28px;font-weight:900;color:var(--g);}
.gp-to{font-size:12px;color:var(--m);margin-top:6px;}
.gp-brand{font-size:9px;font-weight:800;letter-spacing:2px;color:var(--m);margin-top:16px;text-transform:uppercase;}

.success-screen{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:70vh;text-align:center;padding:40px 20px;
}
.success-check{
  width:80px;height:80px;border-radius:50%;
  background:linear-gradient(135deg,var(--g),var(--g2));
  display:flex;align-items:center;justify-content:center;
  font-size:36px;margin-bottom:24px;
  animation:successPop .5s cubic-bezier(.17,.67,.29,1.5) both;
}
@keyframes successPop{from{transform:scale(0);}to{transform:scale(1);}}
.success-title{font-size:24px;font-weight:900;letter-spacing:-.5px;margin-bottom:8px;}
.success-sub{font-size:14px;color:var(--m);margin-bottom:32px;}
.success-points{
  padding:12px 24px;border-radius:12px;
  background:rgba(201,168,76,.08);border:1px solid rgba(201,168,76,.15);
  font-size:14px;font-weight:700;color:var(--g);margin-bottom:24px;
}

.share-buttons{display:flex;gap:10px;margin:16px 0;flex-wrap:wrap;justify-content:center;}
.share-btn{
  width:44px;height:44px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  font-size:14px;font-weight:800;color:#fff;cursor:pointer;
  border:1px solid rgba(255,255,255,.1);transition:transform .15s;
}
.share-btn:active{transform:scale(.9);}

.sync-card-container{padding:20px;}

/* ── FLIP CARD ── */
.sync-card-scene{
  width:100%;perspective:900px;
  user-select:none;-webkit-user-select:none;
  margin-bottom:4px;
}
.card-tilt{
  transform-style:preserve-3d;
  transition:transform .12s ease-out;
  will-change:transform;
}
.card-tilt.resetting{transition:transform .5s cubic-bezier(.25,.8,.25,1);}
.sync-card-inner{
  position:relative;width:100%;aspect-ratio:1376/768;
  transform-style:preserve-3d;
  transition:transform .72s cubic-bezier(.4,0,.2,1);
  cursor:pointer;
  will-change:transform;
}
.sync-card-inner.flipped{transform:rotateY(180deg);}
.sync-card-face{
  position:absolute;top:0;left:0;width:100%;height:100%;
  backface-visibility:hidden;-webkit-backface-visibility:hidden;
  border-radius:20px;overflow:hidden;
}

/* ── FRONT FACE ── */
.sync-card-face.front{
  box-shadow:
    0 2px 0 rgba(255,255,255,.07) inset,
    0 -1px 0 rgba(0,0,0,.6) inset,
    0 30px 80px rgba(0,0,0,.85),
    0 0 40px rgba(201,168,76,.18),
    0 0 1px rgba(201,168,76,.4);
}
.sync-card-face.front img{width:100%;height:100%;object-fit:cover;display:block;}

/* ── BACK FACE ── */
.sync-card-face.back{
  transform:rotateY(180deg);
  background:linear-gradient(155deg,#0f0d05 0%,#1e1a07 35%,#0d0b04 70%,#1a1706 100%);
  border:1px solid rgba(201,168,76,.2);
  display:flex;flex-direction:column;
  box-shadow:
    0 2px 0 rgba(255,255,255,.04) inset,
    0 -1px 0 rgba(201,168,76,.08) inset,
    0 30px 80px rgba(0,0,0,.85),
    0 0 50px rgba(201,168,76,.14);
}

/* grid overlay */
.cb-grid{
  position:absolute;inset:0;border-radius:20px;pointer-events:none;
  background-image:
    linear-gradient(rgba(201,168,76,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(201,168,76,.035) 1px,transparent 1px);
  background-size:26px 26px;
}
/* corner glow spots */
.cb-glow{
  position:absolute;inset:0;border-radius:20px;pointer-events:none;
  background:
    radial-gradient(ellipse 80% 90% at 10% 110%,rgba(201,168,76,.13) 0%,transparent 65%),
    radial-gradient(ellipse 60% 60% at 90% -10%,rgba(201,168,76,.09) 0%,transparent 60%);
}
/* sweeping shimmer */
@keyframes shimmerSweep{
  0%{transform:translateX(-140%) skewX(-18deg);opacity:0}
  15%{opacity:1}
  85%{opacity:1}
  100%{transform:translateX(240%) skewX(-18deg);opacity:0}
}
.cb-shimmer{
  position:absolute;inset:0;overflow:hidden;border-radius:20px;pointer-events:none;
}
.cb-shimmer::before{
  content:'';position:absolute;top:-50%;width:28%;height:200%;
  background:linear-gradient(90deg,transparent,rgba(255,240,170,.10),rgba(255,240,170,.07),transparent);
  animation:shimmerSweep 5s ease-in-out infinite;animation-delay:1.5s;
}

/* magnetic stripe */
.cb-stripe{
  width:100%;height:42px;position:relative;z-index:2;margin-top:20px;flex-shrink:0;
  background:linear-gradient(180deg,#1c1c1c 0%,#111 60%,#1a1a1a 100%);
  box-shadow:0 1px 0 rgba(255,255,255,.04),0 -1px 0 rgba(255,255,255,.02);
}

/* signature + cvc */
.cb-sig-row{
  display:flex;align-items:center;gap:8px;
  padding:5px 16px 0;position:relative;z-index:2;flex-shrink:0;
}
.cb-sig-panel{
  flex:1;height:22px;border-radius:3px;opacity:.65;
  background:repeating-linear-gradient(
    -50deg,#c8c8c8 0,#c8c8c8 3px,#f5f5f5 3px,#f5f5f5 7px
  );
}
.cb-cvc-box{
  background:#fff;color:#111;font-family:monospace;
  font-size:12px;font-weight:800;padding:4px 10px;
  border-radius:3px;letter-spacing:2px;min-width:38px;text-align:center;
  flex-shrink:0;
}

/* main body */
.cb-body{
  flex:1;display:flex;flex-direction:column;justify-content:flex-end;
  gap:7px;padding:6px 16px 14px;position:relative;z-index:2;
}

/* top row: chip + brand */
.cb-top-row{display:flex;align-items:center;justify-content:space-between;}

/* EMV Chip */
.cb-chip{
  width:36px;height:28px;border-radius:5px;position:relative;flex-shrink:0;
  background:linear-gradient(145deg,#c9a84c,#f5da80,#b8943c,#e8c86a,#9e7830);
  box-shadow:0 1px 5px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.45),inset 0 -1px 0 rgba(0,0,0,.3);
}
.cb-chip::before{
  content:'';position:absolute;top:50%;left:0;right:0;
  height:1px;background:rgba(0,0,0,.22);transform:translateY(-50%);
}
.cb-chip::after{
  content:'';position:absolute;left:50%;top:0;bottom:0;
  width:1px;background:rgba(0,0,0,.18);transform:translateX(-50%);
}
.cb-chip-notch{
  position:absolute;width:10px;height:10px;
  border-radius:2px;background:rgba(0,0,0,.1);
  top:50%;left:50%;transform:translate(-50%,-50%);
}

/* brand name */
.cb-brand-text{
  font-size:14px;font-weight:900;letter-spacing:4px;
  color:rgba(201,168,76,.75);font-style:italic;
  text-shadow:0 0 20px rgba(201,168,76,.3);
}

/* NFC contactless arcs — ))) shape */
.cb-nfc{display:flex;align-items:center;gap:3px;}
.cb-nfc-arc{
  border:1.8px solid rgba(201,168,76,.7);
  border-left:none;
  border-radius:50%;
  flex-shrink:0;
}
.cb-nfc-arc:nth-child(1){width:7px;height:7px;opacity:.35;}
.cb-nfc-arc:nth-child(2){width:11px;height:11px;opacity:.65;}
.cb-nfc-arc:nth-child(3){width:15px;height:15px;opacity:.92;}

/* balance */
.cb-balance-label{font-size:8px;color:rgba(201,168,76,.45);font-weight:700;letter-spacing:1.5px;text-transform:uppercase;}
.cb-balance-val{font-size:21px;font-weight:900;color:var(--g);line-height:1.1;text-shadow:0 0 24px rgba(201,168,76,.35);}

/* card number */
.cb-num-row{display:flex;align-items:center;justify-content:space-between;}
.cb-num{font-size:13px;font-weight:700;letter-spacing:3px;color:rgba(255,255,255,.88);font-family:monospace;text-shadow:0 1px 4px rgba(0,0,0,.6);}
.cb-eye{
  width:30px;height:30px;border-radius:50%;
  border:1px solid rgba(201,168,76,.35);
  background:rgba(201,168,76,.09);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;font-size:14px;flex-shrink:0;
  transition:background .2s,transform .15s;
  box-shadow:0 0 14px rgba(201,168,76,.12);
}
.cb-eye:active{background:rgba(201,168,76,.22);transform:scale(.88);}

/* footer row */
.cb-footer{display:flex;align-items:flex-end;gap:16px;}
.cb-field-label{font-size:7px;color:rgba(201,168,76,.4);font-weight:700;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:2px;}
.cb-field-val{font-size:11px;font-weight:700;color:rgba(255,255,255,.82);font-family:monospace;letter-spacing:1.5px;}

/* card hint */
.sync-card-hint{text-align:center;font-size:11px;color:var(--m);margin:6px 0 14px;letter-spacing:.5px;}

.sync-card-overlay{
  position:absolute;bottom:0;left:0;right:0;padding:16px;
  background:linear-gradient(transparent,rgba(0,0,0,.8));
}
.card-number{font-size:14px;font-weight:600;letter-spacing:3px;color:rgba(255,255,255,.7);}

/* ── GIFT TABS ── */
.gifts-tab-bar{
  display:flex;gap:6px;margin:16px 16px 0;
  background:rgba(255,255,255,.04);border-radius:14px;padding:4px;
}
.gifts-tab{
  flex:1;text-align:center;padding:10px 8px;border-radius:10px;
  font-size:13px;font-weight:700;color:var(--m);cursor:pointer;
  transition:all .2s;
}
.gifts-tab.active{background:var(--g);color:#000;}

/* ── GIFT LIST ITEMS ── */
.gift-list-section{padding:0 0 80px;}
.gift-list-item{
  display:flex;align-items:center;gap:14px;
  padding:13px 16px;border-bottom:1px solid rgba(255,255,255,.04);
  cursor:pointer;transition:background .15s;
}
.gift-list-item:active{background:rgba(255,255,255,.03);}
.gli-box{
  width:46px;height:46px;border-radius:14px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:22px;position:relative;border:1px solid rgba(255,255,255,.06);
}
.gli-media-dot{
  position:absolute;top:-3px;right:-3px;width:10px;height:10px;
  border-radius:50%;background:var(--g);border:2px solid #050505;
}
.gli-info{flex:1;min-width:0;}
.gli-name{font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.gli-sub{font-size:11px;color:var(--m);margin-top:3px;}
.gli-right{text-align:right;flex-shrink:0;}
.gli-amount{font-size:15px;font-weight:900;}
.gli-badge{
  display:inline-block;font-size:9px;font-weight:700;letter-spacing:.5px;
  padding:2px 7px;border-radius:20px;margin-top:4px;text-transform:uppercase;
}
.gli-badge.sent{background:rgba(201,168,76,.12);color:var(--g);}
.gli-badge.claimed{background:rgba(80,200,120,.12);color:var(--gr);}
.gli-badge.pending{background:rgba(255,200,80,.1);color:#ffc850;}

.wallet-actions-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:20px;}
.wa-action{
  display:flex;flex-direction:column;align-items:center;gap:6px;
  padding:14px 8px;border-radius:14px;border:1px solid var(--b);
  background:rgba(255,255,255,.03);cursor:pointer;
}
.wa-action:active{background:rgba(201,168,76,.06);}
.wa-action-icon{font-size:20px;}
.wa-action-label{font-size:10px;font-weight:700;color:var(--m);}

.toggle-row{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 0;border-bottom:1px solid var(--b);
}
.toggle-label{font-size:14px;font-weight:600;}
.toggle-sub{font-size:11px;color:var(--m);margin-top:2px;}
.toggle-switch{
  width:48px;height:28px;border-radius:14px;
  background:rgba(255,255,255,.12);position:relative;
  cursor:pointer;transition:background .3s;flex-shrink:0;
}
.toggle-switch.on{background:var(--g);}
.toggle-switch::after{
  content:'';position:absolute;top:3px;left:3px;
  width:22px;height:22px;border-radius:50%;
  background:#fff;transition:transform .3s;
  box-shadow:0 2px 6px rgba(0,0,0,.3);
}
.toggle-switch.on::after{transform:translateX(20px);}

.limit-control{padding:14px 0;border-bottom:1px solid var(--b);}
.limit-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;}
.limit-title{font-size:14px;font-weight:600;}
.limit-value{font-size:14px;font-weight:800;color:var(--g);}
.limit-slider{
  width:100%;-webkit-appearance:none;appearance:none;height:4px;
  background:var(--b);border-radius:2px;outline:none;
}
.limit-slider::-webkit-slider-thumb{
  -webkit-appearance:none;width:20px;height:20px;border-radius:50%;
  background:var(--g);cursor:pointer;box-shadow:0 2px 8px rgba(201,168,76,.4);
}

.tx-list{padding:0 20px;}
.tx-item{
  display:flex;align-items:center;gap:12px;
  padding:12px 0;border-bottom:1px solid rgba(255,255,255,.04);
}
.tx-icon{
  width:38px;height:38px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  font-size:18px;flex-shrink:0;
}
.tx-meta{flex:1;min-width:0;}
.tx-name{font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tx-date{font-size:11px;color:var(--m);margin-top:1px;}
.tx-amount{font-size:13px;font-weight:800;}

.tier-card{
  margin:0 20px 16px;padding:24px;border-radius:20px;
  background:linear-gradient(135deg,rgba(201,168,76,.12),rgba(201,168,76,.04));
  border:1px solid rgba(201,168,76,.2);text-align:center;
}
.tier-badge{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 16px;border-radius:20px;
  background:rgba(201,168,76,.15);border:1px solid rgba(201,168,76,.3);
  font-size:13px;font-weight:800;color:var(--g);margin-bottom:12px;
}
.tier-points{font-size:32px;font-weight:900;color:var(--t);}
.tier-label{font-size:11px;color:var(--m);margin-top:4px;}

.progress-section{padding:0 20px;margin-bottom:20px;}
.progress-header{display:flex;justify-content:space-between;margin-bottom:8px;}
.progress-title{font-size:13px;font-weight:700;}
.progress-value{font-size:13px;font-weight:700;color:var(--g);}
.progress-bar{height:8px;background:var(--b);border-radius:4px;overflow:hidden;}
.progress-fill{height:100%;background:linear-gradient(90deg,var(--g),var(--g2));border-radius:4px;transition:width .6s ease;}

.referral-card{
  margin:0 20px 16px;padding:20px;border-radius:16px;
  border:1px solid var(--b);background:rgba(255,255,255,.03);
}
.referral-code{
  display:flex;align-items:center;gap:10px;margin-top:10px;
}
.referral-code-text{
  flex:1;padding:12px;border-radius:10px;
  background:rgba(201,168,76,.08);border:1px solid rgba(201,168,76,.15);
  font-size:15px;font-weight:800;letter-spacing:2px;color:var(--g);
  text-align:center;
}
.copy-btn{
  padding:12px 16px;border-radius:10px;border:none;
  background:var(--g);color:#000;font-size:12px;font-weight:800;
  cursor:pointer;white-space:nowrap;
}

.offers-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;padding:0 20px;}
.offer-card{
  padding:16px;border-radius:14px;border:1px solid var(--b);
  background:rgba(255,255,255,.03);
}
.offer-emoji{font-size:24px;margin-bottom:8px;}
.offer-title{font-size:13px;font-weight:700;margin-bottom:4px;}
.offer-desc{font-size:11px;color:var(--m);}
.offer-cashback{font-size:12px;font-weight:800;color:var(--gr);margin-top:6px;}

.profile-header{
  display:flex;flex-direction:column;align-items:center;
  padding:24px 20px;text-align:center;
}
.profile-avatar{
  width:80px;height:80px;border-radius:50%;
  background:linear-gradient(135deg,rgba(201,168,76,.2),rgba(201,168,76,.05));
  border:3px solid rgba(201,168,76,.4);
  display:flex;align-items:center;justify-content:center;
  font-size:32px;margin-bottom:12px;overflow:hidden;
}
.profile-avatar img{width:100%;height:100%;object-fit:cover;}
.profile-name{font-size:20px;font-weight:800;letter-spacing:-.3px;}
.profile-handle{font-size:13px;color:var(--m);margin-top:2px;}
.kyc-badge{
  display:inline-flex;align-items:center;gap:4px;
  padding:4px 12px;border-radius:12px;margin-top:8px;
  font-size:11px;font-weight:700;
}
.kyc-badge.none{background:rgba(255,255,255,.06);color:var(--m);}
.kyc-badge.pending{background:rgba(249,115,22,.1);color:#f97316;}
.kyc-badge.verified{background:rgba(74,222,128,.1);color:var(--gr);}

.settings-section{padding:0 20px;margin-bottom:16px;}
.settings-title{font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--m);margin-bottom:8px;}
.settings-item{
  display:flex;align-items:center;gap:14px;
  padding:14px 0;border-bottom:1px solid rgba(255,255,255,.04);
  cursor:pointer;
}
.settings-item:active{opacity:.7;}
.settings-icon{font-size:20px;width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.04);}
.settings-text{flex:1;}
.settings-text-title{font-size:14px;font-weight:600;}
.settings-text-sub{font-size:11px;color:var(--m);margin-top:1px;}
.settings-arrow{font-size:14px;color:var(--m);}

.logout-btn{
  margin:20px;padding:14px;border-radius:14px;
  border:1px solid rgba(248,113,113,.3);background:rgba(248,113,113,.06);
  color:var(--rd);font-size:14px;font-weight:700;
  font-family:inherit;cursor:pointer;text-align:center;
}

.gift-reveal{
  min-height:100vh;min-height:100dvh;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:40px 20px;text-align:center;position:relative;overflow:hidden;
}
.gift-reveal-bg{
  position:absolute;inset:0;
  background:radial-gradient(circle at 50% 30%,rgba(201,168,76,.15),transparent 60%);
  pointer-events:none;
}
.reveal-emoji{font-size:72px;margin-bottom:20px;animation:revealBounce 1s ease both;}
@keyframes revealBounce{
  0%{transform:scale(0) rotate(-15deg);}
  60%{transform:scale(1.2) rotate(5deg);}
  100%{transform:scale(1) rotate(0);}
}
.reveal-title{font-size:28px;font-weight:900;letter-spacing:-.5px;margin-bottom:8px;}
.reveal-from{font-size:14px;color:var(--m);margin-bottom:16px;}
.reveal-amount{
  font-size:48px;font-weight:900;
  background:linear-gradient(135deg,var(--g),var(--g2),var(--g3));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  margin-bottom:8px;
}
.reveal-message{
  font-size:15px;color:var(--soft);font-style:italic;
  max-width:300px;margin:0 auto 32px;line-height:1.7;
}
.reveal-actions{display:flex;gap:10px;width:100%;max-width:320px;}
.reveal-action{
  flex:1;padding:14px;border-radius:14px;
  border:1px solid var(--b);background:rgba(255,255,255,.04);
  text-align:center;cursor:pointer;transition:all .2s;
}
.reveal-action:active{transform:scale(.95);}
.reveal-action-icon{font-size:20px;margin-bottom:4px;}
.reveal-action-label{font-size:11px;font-weight:700;color:var(--soft);}
.reveal-funds{
  margin-top:20px;padding:12px 20px;border-radius:12px;
  background:rgba(74,222,128,.08);border:1px solid rgba(74,222,128,.15);
  font-size:13px;font-weight:600;color:var(--gr);
}

.auth-screen{
  min-height:100vh;min-height:100dvh;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:40px 24px;text-align:center;max-width:400px;margin:0 auto;
}
.auth-logo{font-size:48px;margin-bottom:8px;}
.auth-brand{
  font-size:28px;font-weight:900;letter-spacing:2px;margin-bottom:4px;
  background:linear-gradient(135deg,var(--g),var(--g2));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.auth-tagline{font-size:13px;color:var(--m);margin-bottom:32px;}
.onboarding-progress{width:100%;height:4px;background:var(--b);border-radius:2px;margin-bottom:24px;overflow:hidden;}
.onboarding-bar{height:100%;background:linear-gradient(90deg,var(--g),var(--g2));border-radius:2px;transition:width .4s ease;}
.auth-form{width:100%;display:flex;flex-direction:column;gap:12px;}
.auth-divider{
  display:flex;align-items:center;gap:12px;margin:8px 0;
}
.auth-divider::before,.auth-divider::after{content:'';flex:1;height:1px;background:var(--b);}
.auth-divider span{font-size:11px;color:var(--m);font-weight:500;}
.auth-social{
  width:100%;padding:14px;border-radius:14px;
  border:1px solid var(--b);background:rgba(255,255,255,.04);
  color:var(--t);font-size:14px;font-weight:600;font-family:inherit;
  cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;
  transition:all .2s;
}
.auth-social:active{background:rgba(255,255,255,.08);}
.auth-switch{font-size:13px;color:var(--m);margin-top:16px;}
.auth-switch a{color:var(--g);font-weight:700;text-decoration:none;cursor:pointer;}
.auth-error{
  width:100%;padding:10px 14px;border-radius:10px;
  background:rgba(248,113,113,.08);border:1px solid rgba(248,113,113,.2);
  color:var(--rd);font-size:13px;text-align:left;display:none;
}
.auth-error.show{display:block;}

.admin-container{max-width:800px;margin:0 auto;padding:20px;}
.admin-header{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:24px;
}
.admin-title{font-size:20px;font-weight:900;}
.admin-back{
  padding:8px 16px;border-radius:10px;border:1px solid var(--b);
  background:none;color:var(--t);font-size:13px;font-weight:600;
  cursor:pointer;font-family:inherit;
}
.admin-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:24px;}
.admin-stat{
  padding:20px;border-radius:16px;border:1px solid var(--b);
  background:rgba(255,255,255,.03);
}
.admin-stat-val{font-size:24px;font-weight:900;color:var(--g);}
.admin-stat-label{font-size:11px;color:var(--m);margin-top:4px;font-weight:500;}
.admin-section{margin-bottom:24px;}
.admin-section-title{
  font-size:14px;font-weight:800;margin-bottom:12px;
  padding-bottom:8px;border-bottom:1px solid var(--b);
}
.admin-table{width:100%;overflow-x:auto;}
.admin-table table{width:100%;border-collapse:collapse;font-size:12px;}
.admin-table th{
  text-align:left;padding:8px;font-weight:700;color:var(--m);
  border-bottom:1px solid var(--b);font-size:11px;letter-spacing:.5px;text-transform:uppercase;
  white-space:nowrap;
}
.admin-table td{padding:8px;border-bottom:1px solid rgba(255,255,255,.03);white-space:nowrap;}
.admin-badge{
  display:inline-block;padding:2px 8px;border-radius:6px;
  font-size:10px;font-weight:700;
}

.empty-state{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:40px 20px;text-align:center;
}
.empty-icon{font-size:48px;margin-bottom:12px;opacity:.5;}
.empty-text{font-size:14px;color:var(--m);}

.modal-overlay{
  display:none;position:fixed;inset:0;z-index:200;
  background:rgba(0,0,0,.8);backdrop-filter:blur(12px);
  align-items:flex-end;justify-content:center;
}
.modal-overlay.open{display:flex;}
.modal-sheet{
  width:100%;max-width:480px;max-height:85vh;max-height:85dvh;
  background:#0a0a0a;border:1px solid var(--b);
  border-radius:20px 20px 0 0;padding:24px;overflow-y:auto;
  animation:sheetUp .3s ease both;
}
@keyframes sheetUp{from{transform:translateY(100%);}to{transform:none;}}
.modal-handle{width:36px;height:4px;border-radius:2px;background:var(--b);margin:0 auto 16px;}
.modal-title{font-size:18px;font-weight:800;margin-bottom:16px;}

.learn-more-btn{
  margin:20px;padding:14px;border-radius:14px;
  border:1px solid rgba(201,168,76,.2);background:rgba(201,168,76,.04);
  color:var(--g);font-size:13px;font-weight:700;
  font-family:inherit;cursor:pointer;text-align:center;
  display:block;text-decoration:none;
}

.blockchain-indicator{
  display:flex;align-items:center;gap:8px;
  padding:12px 16px;border-radius:12px;
  background:rgba(201,168,76,.06);border:1px solid rgba(201,168,76,.12);
  margin:12px 0;
}
.blockchain-dot{
  width:8px;height:8px;border-radius:50%;background:var(--g);
  animation:blink 1.5s ease-in-out infinite;
}
@keyframes blink{0%,100%{opacity:1;}50%{opacity:.3;}}
.blockchain-text{font-size:12px;color:var(--m);font-weight:500;}
.blockchain-text span{color:var(--g);font-weight:700;}

.shareable-card{
  margin:16px 0;padding:32px 20px;border-radius:20px;
  background:linear-gradient(160deg,#111,#060606);
  border:1px solid rgba(201,168,76,.25);text-align:center;
  position:relative;
}
.shareable-card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--g),var(--g2),var(--g3));
}
.sc-logo{font-size:10px;font-weight:900;letter-spacing:3px;color:var(--g);text-transform:uppercase;margin-bottom:12px;}
.sc-emoji{font-size:48px;margin-bottom:10px;}
.sc-amount{font-size:32px;font-weight:900;color:var(--t);}
.sc-msg{font-size:13px;color:var(--soft);margin:8px 0 16px;font-style:italic;}
.sc-qr{
  width:100px;height:100px;margin:0 auto;border-radius:12px;
  background:rgba(255,255,255,.9);display:flex;align-items:center;justify-content:center;
  font-size:10px;color:#000;font-weight:700;
}
.sc-cta{
  margin-top:14px;padding:10px 20px;border-radius:20px;
  background:linear-gradient(135deg,var(--g),var(--g2));
  color:#000;font-size:12px;font-weight:800;display:inline-block;
}

@media(min-width:481px){
  #app-root{border-left:1px solid var(--b);border-right:1px solid var(--b);}
}

@supports(padding: max(0px)) {
  .bottom-nav{padding-bottom:max(env(safe-area-inset-bottom),8px);}
  .app-view{padding-bottom:max(calc(80px + env(safe-area-inset-bottom)),88px);}
}

/* ── GIFT BOX CARDS (Home screen) ── */
.gift-boxes-scroll{
  display:flex;gap:14px;overflow-x:auto;padding:4px 16px 16px;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;
}
.gift-boxes-scroll::-webkit-scrollbar{display:none;}

.gift-box-card{
  flex-shrink:0;width:120px;cursor:pointer;
  transition:transform .2s;
}
.gift-box-card:active{transform:scale(.94);}

.gift-box-wrap{
  width:120px;height:150px;border-radius:14px;
  position:relative;overflow:hidden;
  box-shadow:0 8px 24px rgba(0,0,0,.5),0 2px 6px rgba(0,0,0,.4);
}

.gift-box-lid{
  position:absolute;top:0;left:0;right:0;height:38%;
  border-radius:14px 14px 0 0;z-index:2;
}

.gift-bow{
  position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%);
  width:42px;height:22px;
}
.bow-loop{
  position:absolute;width:18px;height:18px;
  border-radius:50%;border:4px solid;
  top:0;
}
.bow-left{left:0;border-radius:50% 30% 30% 50%;}
.bow-right{right:0;border-radius:30% 50% 50% 30%;}
.bow-center{
  position:absolute;width:8px;height:8px;
  border-radius:50%;top:5px;left:50%;transform:translateX(-50%);
  z-index:3;
}

.gift-ribbon-v{
  position:absolute;top:0;bottom:0;left:50%;
  transform:translateX(-50%);width:14px;z-index:3;
}
.gift-ribbon-h{
  position:absolute;left:0;right:0;top:38%;
  height:14px;z-index:4;
}

.gift-box-bottom{
  position:absolute;bottom:0;left:0;right:0;top:38%;
  border-radius:0 0 14px 14px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  z-index:1;
}
.gift-occasion-emoji{font-size:28px;line-height:1;position:relative;z-index:5;}
.gift-media-badge{
  background:rgba(0,0,0,.7);color:#fff;font-size:10px;
  padding:2px 7px;border-radius:20px;font-weight:700;
  border:1px solid rgba(255,255,255,.2);z-index:5;
}

.gift-box-label{padding:8px 4px 0;text-align:center;}
.gbl-name{font-size:11px;color:var(--soft);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:116px;}
.gbl-amount{font-size:13px;font-weight:900;color:var(--t);margin-top:2px;}

/* ── GIFT MODAL BOX ── */
.gift-modal-box{
  position:relative;height:110px;border-radius:20px;
  overflow:hidden;margin-bottom:4px;
}
.gmb-ribbon-h{
  position:absolute;top:50%;left:0;right:0;
  height:16px;transform:translateY(-50%);z-index:2;
}
.gmb-ribbon-v{
  position:absolute;left:50%;top:0;bottom:0;
  width:16px;transform:translateX(-50%);z-index:2;
}
.gmb-bow{
  position:absolute;top:50%;left:50%;
  transform:translate(-50%,-68%);
  width:52px;height:28px;z-index:4;
}
.gmb-bow-loop{
  position:absolute;width:22px;height:22px;
  border-radius:50%;border:5px solid;top:0;
}
.gmb-bow-left{left:0;border-radius:50% 30% 30% 50%;}
.gmb-bow-right{right:0;border-radius:30% 50% 50% 30%;}
.gmb-bow-center{
  position:absolute;width:10px;height:10px;
  border-radius:50%;top:6px;left:50%;transform:translateX(-50%);z-index:5;
}
.gmb-occasion{
  position:absolute;top:50%;left:50%;
  transform:translate(-50%,10%);font-size:32px;z-index:3;
}

/* ── GIFT MEDIA PLAYER ── */
.gift-media-player{
  border-radius:16px;overflow:hidden;
  background:#000;
  border:1px solid rgba(255,255,255,.08);
}

/* ── MEDIA UPLOAD BUTTON ── */
.media-upload-btn{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:6px;width:100%;padding:22px 16px;
  border:2px dashed rgba(201,168,76,.3);border-radius:16px;
  background:rgba(201,168,76,.03);cursor:pointer;
  font-size:13px;color:var(--soft);font-weight:600;
  transition:all .2s;
}
.media-upload-btn:hover,.media-upload-btn:active{
  border-color:rgba(201,168,76,.6);background:rgba(201,168,76,.07);
}

/* ── WALLET TICKET CARDS ── */
.wallet-ticket-card{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 16px;border-radius:18px;
  background:linear-gradient(135deg,rgba(201,168,76,.07),rgba(201,168,76,.03));
  border:1px solid rgba(201,168,76,.2);
  cursor:pointer;margin-bottom:10px;
  transition:transform .15s,box-shadow .15s;
}
.wallet-ticket-card:active{transform:scale(.97);}
.wallet-ticket-card:hover{box-shadow:0 4px 20px rgba(201,168,76,.12);}
.wtc-left{display:flex;align-items:center;gap:12px;}
.wtc-emoji{font-size:26px;width:36px;text-align:center;}
.wtc-info{}
.wtc-name{font-size:13px;font-weight:800;margin-bottom:2px;}
.wtc-tier{font-size:11px;color:var(--g);font-weight:700;}
.wtc-date{font-size:10px;color:var(--m);margin-top:2px;}
.wtc-right{text-align:right;}
.wtc-price{font-size:14px;font-weight:900;color:var(--t);}
.wtc-qr-hint{font-size:10px;color:var(--m);margin-top:4px;}

/* ── EVENTS ── */
.section-sub{font-size:11px;color:var(--m);margin-top:2px;}
.events-list{display:flex;flex-direction:column;gap:16px;padding:0 16px 4px;}

.event-card{
  border-radius:20px;border:1px solid var(--b);
  background:var(--bg2);overflow:hidden;
}

.event-banner{
  position:relative;height:90px;
  background:linear-gradient(135deg,#0a0a0a 0%,#111 100%);
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.event-banner::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(201,168,76,.12) 0%,transparent 60%);
}
.event-emoji-bg{
  font-size:52px;opacity:.85;
  filter:drop-shadow(0 4px 16px rgba(0,0,0,.6));
  position:relative;z-index:1;
}
.event-header-info{
  position:absolute;top:10px;right:10px;
  display:flex;flex-direction:column;align-items:flex-end;gap:6px;
  z-index:2;
}
.event-status-pill{
  font-size:9px;font-weight:800;letter-spacing:1px;text-transform:uppercase;
  padding:3px 8px;border-radius:20px;border:1px solid;
}
.event-date-badge{
  font-size:10px;font-weight:700;color:var(--soft);
  background:rgba(0,0,0,.5);padding:3px 8px;border-radius:10px;
  border:1px solid rgba(255,255,255,.08);
}

.event-body{padding:14px 16px 16px;}
.event-name{font-size:16px;font-weight:900;letter-spacing:-.3px;margin-bottom:4px;}
.event-venue{font-size:11px;color:var(--m);margin-bottom:8px;}
.event-desc{font-size:12px;color:var(--soft);line-height:1.6;margin-bottom:12px;}

.event-vip-badge{
  display:flex;align-items:center;gap:6px;
  padding:8px 12px;border-radius:10px;margin-bottom:12px;
  background:linear-gradient(135deg,rgba(201,168,76,.08),rgba(201,168,76,.04));
  border:1px solid rgba(201,168,76,.2);
  font-size:11px;font-weight:700;color:var(--g);
}

.event-tiers{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;}
.event-tier{
  display:flex;align-items:center;gap:10px;
  padding:9px 12px;border-radius:12px;
  background:rgba(255,255,255,.03);border:1px solid var(--b);
}
.event-tier-emoji{font-size:16px;width:24px;text-align:center;}
.event-tier-info{flex:1;}
.event-tier-name{font-size:12px;font-weight:700;}
.event-tier-pts{font-size:10px;color:var(--g);font-weight:600;}
.event-tier-price{font-size:13px;font-weight:800;color:var(--t);}

.event-buy-btn{width:100%;text-align:center;border-radius:14px;font-size:14px;}

/* ── TICKET MODAL ── */
.ticket-tier-option{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 14px;border-radius:14px;border:1px solid var(--b);
  background:rgba(255,255,255,.03);cursor:pointer;margin-bottom:8px;
  transition:all .2s;
}
.ticket-tier-option.selected{
  border-color:var(--g);background:rgba(201,168,76,.08);
}
.ticket-tier-option:active{transform:scale(.98);}
.tto-left{display:flex;align-items:center;gap:12px;}
.tto-name{font-size:13px;font-weight:700;}
.tto-pts{font-size:10px;color:var(--g);font-weight:600;margin-top:2px;}
.tto-price{font-size:15px;font-weight:900;color:var(--t);}

.ticket-summary{
  padding:14px;border-radius:14px;border:1px solid var(--b);
  background:rgba(255,255,255,.02);margin-top:4px;
}
.ts-row{
  display:flex;justify-content:space-between;align-items:center;
  font-size:13px;padding:4px 0;color:var(--soft);
}
.ts-total{
  font-weight:800;color:var(--t);font-size:15px;
  border-top:1px solid var(--b);margin-top:8px;padding-top:10px;
}

/* ── TICKET CONFIRMATION ── */
.ticket-confirm-card{
  border-radius:20px;border:1px solid rgba(201,168,76,.25);
  background:linear-gradient(160deg,#111,#060606);
  overflow:hidden;position:relative;
}
.ticket-confirm-card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--g),var(--g2),var(--g3));
}
.tcc-header{
  display:flex;align-items:center;gap:12px;
  padding:20px 18px 14px;
}
.tcc-name{font-size:15px;font-weight:900;}
.tcc-tier{font-size:11px;color:var(--g);font-weight:700;margin-top:2px;}
.tcc-details{padding:0 18px 14px;display:flex;flex-direction:column;gap:6px;border-bottom:1px solid var(--b);}
.tcc-row{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--soft);}
.tcc-rewards{padding:16px 18px;text-align:center;border-bottom:1px solid var(--b);}
.tcc-qr{
  margin:14px auto;width:100px;height:64px;border-radius:12px;
  background:rgba(255,255,255,.9);display:flex;flex-direction:column;
  align-items:center;justify-content:center;
}

/* ── MUSIC ENGINE ── */
.music-source-tabs{display:flex;gap:8px;margin-bottom:12px;}
.music-source-tab{
  flex:1;padding:10px 6px;border-radius:12px;
  border:1px solid var(--b);background:rgba(255,255,255,.03);
  color:var(--soft);font-size:11px;font-weight:700;font-family:inherit;
  cursor:pointer;transition:all .2s;text-align:center;
}
.music-source-tab.active{border-color:var(--g);color:var(--g);background:rgba(201,168,76,.08);}
.music-source-tab:active{transform:scale(.95);}

.music-panel{margin-bottom:18px;min-height:40px;}
.music-placeholder{font-size:12px;color:var(--m);text-align:center;padding:18px;border-radius:12px;border:1px dashed rgba(255,255,255,.1);background:rgba(255,255,255,.02);}

.music-emotion-hint{
  font-size:12px;color:var(--soft);padding:10px 14px;border-radius:10px;
  background:rgba(201,168,76,.06);border:1px solid rgba(201,168,76,.14);
  margin-bottom:12px;line-height:1.5;
}

.music-genre-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:14px;}
.music-genre-card{
  padding:9px 4px;border-radius:10px;border:1px solid var(--b);
  background:rgba(255,255,255,.03);text-align:center;cursor:pointer;
  font-size:10px;font-weight:700;color:var(--soft);transition:all .2s;
}
.music-genre-card.selected{border-color:var(--g);color:var(--g);background:rgba(201,168,76,.1);}
.music-genre-card:active{transform:scale(.93);}

.music-mood-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px;}
.music-mood-card{
  padding:10px 6px;border-radius:10px;border:1px solid var(--b);
  background:rgba(255,255,255,.03);text-align:center;cursor:pointer;
  font-size:11px;font-weight:700;color:var(--soft);transition:all .2s;
}
.music-mood-card.selected{border-color:var(--g);color:var(--g);background:rgba(201,168,76,.1);}

.music-generating{
  font-size:12px;color:var(--g);padding:10px 14px;border-radius:10px;
  background:rgba(201,168,76,.06);border:1px solid rgba(201,168,76,.14);
  display:flex;align-items:center;gap:8px;font-weight:600;
}
.music-wave{animation:musicPulse 1.2s ease-in-out infinite;}
@keyframes musicPulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.5;transform:scale(1.3);}}

.music-platform-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:12px;}
.music-platform-btn{
  padding:14px 10px;border-radius:14px;border:1px solid var(--b);
  background:rgba(255,255,255,.03);text-align:center;cursor:pointer;
  font-size:12px;font-weight:700;color:var(--soft);transition:all .2s;
}
.music-platform-btn span{font-size:24px;display:block;margin-bottom:6px;}
.music-platform-btn.selected{border-color:var(--g);color:var(--g);background:rgba(201,168,76,.08);}
.music-platform-btn:active{transform:scale(.95);}

.music-platform-note{font-size:11px;color:var(--m);padding:8px 12px;border-radius:8px;background:rgba(255,255,255,.03);min-height:28px;line-height:1.5;}

.music-upload-wrap{text-align:center;}
.music-upload-area{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:28px 20px;border-radius:16px;border:2px dashed rgba(201,168,76,.3);
  background:rgba(201,168,76,.04);cursor:pointer;transition:all .2s;
}
.music-upload-area:active{background:rgba(201,168,76,.08);}

.gp-music{font-size:11px;color:var(--g);margin-top:4px;font-weight:600;min-height:16px;}

/* ── PROFILE PHOTO ── */
.profile-avatar-wrap{position:relative;display:inline-block;cursor:pointer;margin-bottom:12px;}
.profile-avatar-wrap .profile-avatar{margin-bottom:0;}
.profile-avatar-cam{
  position:absolute;bottom:0;right:0;
  width:26px;height:26px;border-radius:50%;
  background:var(--g);display:flex;align-items:center;justify-content:center;
  font-size:12px;border:2px solid var(--bg);
}

.avatar-upload-wrap{
  position:relative;width:80px;height:80px;border-radius:50%;
  background:linear-gradient(135deg,rgba(201,168,76,.2),rgba(201,168,76,.05));
  border:3px solid rgba(201,168,76,.4);
  display:flex;align-items:center;justify-content:center;
  font-size:28px;overflow:hidden;cursor:pointer;
}
.avatar-camera-btn{
  position:absolute;bottom:0;right:0;
  width:24px;height:24px;border-radius:50%;
  background:var(--g);display:flex;align-items:center;justify-content:center;
  font-size:11px;border:2px solid #0a0a0a;
  pointer-events:none;
}