:root{--bg:#03070b;--panel:#0c131d;--panel2:#121c28;--text:#f7fafc;--muted:#929dad;--mint:#00eca6;--green:#28e563;--line:#1d2a38;--red:#ff2b36;--max:1180px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 15% 10%,#09231e 0,transparent 26%),var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.55}a{color:inherit;text-decoration:none}button,input{font:inherit}.site-header{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:28px;min-height:82px;padding:12px max(24px,calc((100vw - var(--max))/2));background:rgba(3,7,11,.9);backdrop-filter:blur(18px);border-bottom:1px solid #101923}.brand img{width:82px;height:58px;object-fit:contain}.site-header nav{display:flex;gap:25px;margin-left:auto}.site-header nav a{color:#bdc5d1;font-size:14px}.site-header nav a:hover{color:var(--mint)}.header-actions{display:flex;gap:10px}.primary,.ghost,.button{border:0;border-radius:12px;padding:12px 18px;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.primary{background:var(--mint);color:#00140f}.ghost{background:#111923;color:#fff;border:1px solid #243142}.compact{padding:10px 14px}.hero,.creator-hero{max-width:var(--max);margin:auto;min-height:670px;padding:80px 24px;display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}.hero h1,.creator-hero h1{font-size:clamp(48px,7vw,84px);line-height:.94;margin:18px 0 24px;letter-spacing:-.055em}.hero h1 span,.creator-hero h1 span,h2 span{color:var(--mint)}.hero p,.creator-hero p{color:#aeb7c4;font-size:19px;max-width:680px}.eyebrow{font-size:12px;font-weight:900;letter-spacing:.16em;color:var(--mint)}.live-dot{display:inline-block;width:8px;height:8px;background:var(--red);border-radius:50%;margin-right:7px;box-shadow:0 0 14px var(--red)}.cta-row{display:flex;gap:12px;margin:30px 0 20px}.trust-row{display:flex;gap:22px;flex-wrap:wrap;color:#7f8c9d;font-size:13px}.hero-card{background:linear-gradient(155deg,#0b121b,#05090e);border:1px solid #182331;border-radius:28px;padding:18px;box-shadow:0 30px 80px rgba(0,0,0,.45)}.hero-card>img,.creator-hero>img{width:100%;border-radius:20px;display:block}.hero-stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}.hero-stat-grid div{background:#0e1721;border-radius:14px;padding:15px}.hero-stat-grid strong{display:block;color:var(--mint);font-size:14px}.hero-stat-grid small{color:#7f8c9d}.section{max-width:var(--max);margin:auto;padding:80px 24px}.section h2{font-size:clamp(34px,5vw,56px);line-height:1.02;letter-spacing:-.04em;margin:12px 0 24px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px}.text-button{background:none;color:var(--mint);border:0;font-weight:800;cursor:pointer}.creator-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.creator-card{background:var(--panel);border:1px solid #172332;border-radius:20px;overflow:hidden}.creator-visual{height:270px;background:linear-gradient(140deg,#13202a,#07110f);position:relative;display:flex;align-items:center;justify-content:center}.creator-visual .avatar{width:112px;height:112px;border-radius:50%;display:grid;place-items:center;font-size:42px;font-weight:900;color:#00140f;background:var(--mint);box-shadow:0 0 0 8px rgba(0,236,166,.12)}.live-badge{position:absolute;top:14px;left:14px;background:var(--red);border-radius:999px;padding:6px 10px;font-size:11px;font-weight:900}.creator-body{padding:18px}.creator-body h3{font-size:22px;margin:0}.creator-meta{color:#8c98a7;font-size:13px}.creator-body .actions{display:flex;gap:8px;margin-top:16px}.creator-body .actions button{flex:1}.approved{display:inline-block;color:#00140f;background:var(--mint);font-size:10px;font-weight:900;padding:7px 9px;border-radius:999px}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.steps article,.casino-grid article{background:var(--panel);border:1px solid #172332;border-radius:20px;padding:22px}.steps b{color:var(--mint);font-size:28px}.steps h3{font-size:20px;margin:16px 0 8px}.steps p,.casino-grid p,.casino-grid small{color:var(--muted)}.statement{display:grid;grid-template-columns:190px 1fr;gap:36px;align-items:center;background:linear-gradient(120deg,#09130f,#090e15);border:1px solid #172332;border-radius:28px;margin-top:30px;margin-bottom:30px;padding:42px}.statement img{width:100%}.statement p{color:var(--muted);font-size:18px}.casino-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.casino-grid h3{font-size:24px;margin:16px 0 3px}.split-cta{display:grid;grid-template-columns:1fr 1fr;gap:18px}.split-cta>div{background:var(--panel);border:1px solid #172332;border-radius:24px;padding:30px}.split-cta h2{font-size:38px}.split-cta p{color:var(--muted)}footer{max-width:var(--max);margin:40px auto 0;padding:30px 24px 60px;border-top:1px solid #14202c;display:flex;align-items:center;gap:16px;color:#8591a0}footer img{width:70px}footer div{display:flex;flex-direction:column}footer strong{color:#fff}footer p{margin-left:auto}.modal-backdrop{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.72);display:grid;place-items:center;padding:20px}.modal-backdrop[hidden]{display:none}.modal{position:relative;width:min(460px,100%);background:#0a111a;border:1px solid #263444;border-radius:24px;padding:30px}.modal img{width:110px}.modal h2{font-size:34px;margin:10px 0}.modal p,.modal small{color:var(--muted)}.modal form{display:grid;gap:10px;margin:22px 0}.modal input{width:100%;background:#111b26;color:#fff;border:1px solid #273747;border-radius:12px;padding:14px}.close{position:absolute;right:14px;top:12px;background:none;border:0;color:#fff;font-size:30px;cursor:pointer}.creator-hero{min-height:620px}.creator-pillars{grid-template-columns:repeat(2,1fr)}.earn-list{display:grid;gap:12px;max-width:900px}.earn-list article{display:grid;grid-template-columns:62px 1fr;gap:18px;background:var(--panel);border:1px solid #172332;padding:22px;border-radius:18px}.earn-list b{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--mint);color:#00140f;font-size:20px}.earn-list h3{margin:2px 0 5px}.earn-list p{margin:0;color:var(--muted)}.app-download{display:grid;grid-template-columns:180px 1fr;gap:34px;align-items:center}.app-download img{width:100%}
@media(max-width:900px){.site-header nav{display:none}.hero,.creator-hero,.two-col{grid-template-columns:1fr;min-height:0}.hero{padding-top:55px}.hero h1,.creator-hero h1{font-size:54px}.creator-grid,.steps{grid-template-columns:repeat(2,1fr)}.statement,.app-download{grid-template-columns:120px 1fr}.split-cta{grid-template-columns:1fr}.header-actions .ghost{display:none}}
@media(max-width:620px){.site-header{padding:8px 16px;min-height:68px}.brand img{width:62px}.header-actions .primary{font-size:12px;padding:10px 12px}.hero,.creator-hero,.section{padding:52px 18px}.hero h1,.creator-hero h1{font-size:46px}.creator-grid,.steps,.creator-pillars,.casino-grid{grid-template-columns:1fr}.cta-row{flex-direction:column}.hero-stat-grid{grid-template-columns:1fr}.statement,.app-download{grid-template-columns:1fr;margin-left:12px;margin-right:12px;padding:26px}.statement img,.app-download img{width:120px}.split-cta{padding-left:18px;padding-right:18px}.section-heading{align-items:start}footer{flex-wrap:wrap}footer p{margin-left:0;width:100%}.creator-visual{height:220px}}


/* STEP 5 — REAL LIVE MEDIA */
.live-empty-card{grid-column:1/-1;min-height:180px;display:flex;align-items:center}
.creator-live-photo{width:88px;height:88px;border-radius:50%;object-fit:cover;border:3px solid #70e5b2;background:#0b1018}
.live-player-backdrop{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.86);display:flex;align-items:center;justify-content:center;padding:24px}
.live-player-backdrop[hidden]{display:none}
.live-player-shell{position:relative;width:min(1100px,96vw);max-height:94vh;overflow:auto;background:#090d14;border:1px solid #26303f;border-radius:26px;padding:26px;box-shadow:0 28px 80px rgba(0,0,0,.55)}
.live-player-close{position:absolute;right:18px;top:14px;z-index:2}
.live-player-heading{padding-right:54px;margin-bottom:18px}
.live-player-heading h2{margin:.35rem 0 .25rem}
.live-player-heading p{margin:0;color:#9fa9bd}
.live-video-stage{position:relative;width:100%;aspect-ratio:16/9;background:#020304;border-radius:20px;overflow:hidden;display:flex;align-items:center;justify-content:center}
.live-video-element{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000}
.live-player-status{position:relative;z-index:3;color:#c5ccda;background:rgba(5,8,13,.78);padding:12px 16px;border-radius:999px;text-align:center}
@media (max-width:700px){.live-player-backdrop{padding:0}.live-player-shell{width:100%;height:100%;max-height:none;border-radius:0;padding:18px}.live-video-stage{aspect-ratio:9/16;max-height:75vh}}

.live-watch-count {
  color: #73e8b4;
  font-weight: 800;
  letter-spacing: .01em;
}


/* STEP 7 — REAL LIVE CHAT */
.live-experience-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(300px,.7fr);gap:18px;align-items:stretch}
.live-chat-panel{display:flex;flex-direction:column;min-width:0;min-height:520px;max-height:70vh;transition:opacity .12s ease;background:#0c131d;border:1px solid #1d2a38;border-radius:18px;overflow:hidden}
.live-chat-heading{padding:15px 16px;border-bottom:1px solid #1d2a38;display:flex;justify-content:space-between;gap:12px;align-items:center}
.live-chat-heading strong{color:var(--mint);font-size:13px;letter-spacing:.12em}.live-chat-heading span{color:var(--muted);font-size:12px}
.live-chat-messages{flex:1;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:10px}
.live-chat-empty{color:var(--muted);font-size:13px;text-align:center;padding:28px 12px}
.live-chat-message{border-radius:13px;padding:10px 11px;background:#111b26;color:#f7fafc;font-size:14px;overflow-wrap:anywhere}
.live-chat-message.creator{background:rgba(0,236,166,.13);border:1px solid rgba(0,236,166,.22)}
.live-chat-meta{display:flex;gap:7px;align-items:center;margin-bottom:4px;color:#9fa9bd;font-size:11px}.live-chat-meta strong{color:#fff}.live-chat-meta span{background:var(--mint);color:#00140f;font-weight:900;border-radius:999px;padding:2px 5px}.live-chat-meta small{margin-left:auto;color:#6f7b8b}
.live-chat-form{border-top:1px solid #1d2a38;padding:12px;display:grid;gap:8px}.live-chat-form input{width:100%;background:#111b26;color:#fff;border:1px solid #273747;border-radius:10px;padding:10px 11px}.live-chat-compose{display:grid;grid-template-columns:1fr auto;gap:8px}
.live-chat-error{color:#ff7379;background:rgba(255,43,54,.09);padding:8px 12px;font-size:12px}
@media (max-width:900px){.live-experience-grid{grid-template-columns:1fr}.live-chat-panel{min-height:360px;max-height:52vh}}


/* STEP 8 — live voting + viewer requests */
.live-interaction-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:9px;border-bottom:1px solid #1d2a38;background:#09111a}
.live-interaction-tab{border:0;border-radius:9px;padding:9px 6px;background:#111b26;color:#8793a8;font-size:11px;font-weight:900;letter-spacing:.08em;cursor:pointer}
.live-interaction-tab.active{background:rgba(0,236,166,.16);color:var(--mint)}
.live-interaction-pane{display:none;flex:1;min-height:0;flex-direction:column}.live-interaction-pane.active{display:flex}
.live-vote-body,.live-request-list{flex:1;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:10px}
.live-vote-question{font-weight:900;font-size:18px;line-height:1.25;margin-bottom:4px;color:#fff}
.live-vote-total{font-size:12px;color:var(--muted);margin-bottom:5px}
.live-vote-option{display:grid;gap:6px;width:100%;text-align:left;border:1px solid #273747;background:#111b26;color:#fff;border-radius:13px;padding:10px 11px;cursor:pointer}
.live-vote-option:hover{border-color:var(--mint)}.live-vote-option.selected{border-color:var(--mint);background:rgba(0,236,166,.12)}
.live-vote-option-head{display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:13px;font-weight:800}
.live-vote-bar{height:6px;border-radius:999px;background:#2a323e;overflow:hidden}.live-vote-bar span{display:block;height:100%;background:var(--mint);border-radius:inherit}
.live-request-item{display:flex;gap:10px;align-items:flex-start;border-radius:13px;padding:10px 11px;background:#111b26;color:#fff}
.live-request-text{flex:1;font-size:13px;line-height:1.35}.live-request-count{background:var(--mint);color:#00140f;font-size:11px;font-weight:900;border-radius:999px;padding:4px 7px;white-space:nowrap}
.live-request-item.acknowledged{border:1px solid rgba(0,236,166,.3)}.live-request-status{display:block;color:var(--mint);font-size:10px;font-weight:900;margin-top:5px;letter-spacing:.06em}
.live-request-form{border-top:1px solid #1d2a38;padding:12px;display:grid;grid-template-columns:1fr auto;gap:8px}.live-request-form input{min-width:0;background:#111b26;color:#fff;border:1px solid #273747;border-radius:10px;padding:10px 11px}
.interaction-firewall{padding:9px 12px;color:#7f8ba0;background:#09111a;border-top:1px solid #1d2a38;font-size:10px;line-height:1.35}

.live-interaction-tabs{grid-template-columns:repeat(4,1fr)!important}.live-tip-panel{display:grid;gap:12px;padding:14px}.live-tip-panel p{margin:0;color:#d8e0e8;font-weight:700}.live-tip-panel input{width:100%;background:#111b26;color:#fff;border:1px solid #273747;border-radius:10px;padding:12px}.live-tip-amounts{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.live-tip-amounts button{border:1px solid #2a3a49;background:#111b26;color:#fff;border-radius:10px;padding:10px 4px;font-weight:900;cursor:pointer}.live-tip-amounts button.selected{border-color:var(--mint);background:#073a2e;color:var(--mint)}.live-tip-confirmation{border:1px solid #166a53;background:#08352c;color:#7ff2c8;border-radius:10px;padding:10px;font-size:12px;font-weight:800}.tip-test-mode{font-size:10px;line-height:1.45;color:#91a0af;background:#0a1118;border:1px solid #1d2a38;border-radius:10px;padding:10px}.tip-test-mode strong{color:#ffc857}.live-chat-panel{min-width:320px}@media(max-width:520px){.live-tip-amounts{grid-template-columns:repeat(3,1fr)}}

/* STEP 10 — CUSTOMER ACCOUNT + LOGIN */
.header-actions>[data-auth-logged-out],.header-actions>[data-auth-logged-in]{display:flex;gap:10px;align-items:center}.header-actions>[hidden]{display:none!important}.account-modal{max-height:min(760px,92vh);overflow:auto}.account-form{display:grid;gap:11px;margin:18px 0}.account-form label{display:grid;gap:7px;color:#aeb7c4;font-size:13px;font-weight:700}.account-form input,.account-modal input{width:100%;background:#111b26;color:#fff;border:1px solid #273747;border-radius:12px;padding:14px}.account-link,.account-full{width:100%;margin-top:9px}.account-status-card{display:grid;gap:8px;background:#0e1721;border:1px solid #213142;border-radius:14px;padding:16px;margin:14px 0}.account-status{justify-self:start;border-radius:999px;padding:5px 9px;font-size:10px;font-weight:900;letter-spacing:.08em}.account-status.verified{background:var(--mint);color:#00140f}.account-status.pending{background:#362d12;color:#ffd75e}.account-message{margin-top:12px;border-radius:12px;padding:12px;background:#0d2b21;color:#9fffdc;font-size:13px}.account-message.error{background:#34171a;color:#ffafb5}.danger-ghost{border-color:#5a2930;color:#ff9ca4}.live-chat-form>input[readonly],.live-tip-panel>input[readonly]{opacity:.75;cursor:default}

/* STEP 11 — Request to Talk */
.live-talk-panel{display:grid;gap:14px;padding:6px 0 10px}.live-talk-status{padding:14px;border-radius:14px;background:rgba(255,255,255,.06);line-height:1.45}.live-talk-status.live{border:1px solid var(--mint,#57f2c2);box-shadow:0 0 0 1px rgba(87,242,194,.15) inset}.live-talk-panel .secondary{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.22);border-radius:12px;padding:12px 14px;font-weight:800}.live-interaction-tabs{flex-wrap:wrap}.live-interaction-tab{flex:1 1 auto;min-width:68px}

/* STEP 12 — REAL CUSTOMER PAYMENTS */
.live-payment-box{display:grid;gap:12px;background:#0a1118;border:1px solid #1d2a38;border-radius:12px;padding:12px}.live-payment-box[hidden]{display:none!important}.tip-real-mode{font-size:10px;line-height:1.45;color:#91a0af;background:#0a1118;border:1px solid #1d2a38;border-radius:10px;padding:10px}.tip-real-mode strong{color:var(--mint)}#livePaymentElement{background:#fff;border-radius:10px;padding:12px;min-height:96px}.live-tip-panel .primary.processing{opacity:.7;cursor:wait}

/* STEP 13 */
.creator-relationship-bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:10px}.creator-relationship-bar button{padding:9px 13px}.member-badge{font-size:11px;font-weight:900;color:#04100d;background:#5fffc2;padding:6px 9px;border-radius:999px}.save-card-consent{display:flex;gap:10px;align-items:flex-start;color:#cbd5df;font-size:13px;line-height:1.4;margin:12px 0}.save-card-consent input{margin-top:3px}#membershipPaymentElement{margin:12px 0;min-height:90px}
#membershipStatus{margin-top:12px;color:#cbd5df;font-size:13px;line-height:1.4}#membershipCancelButton{margin-top:12px}

/* STEP 13 SAFARI MEMBERSHIP CHECKOUT FIX */
/* Safari was applying the generic .live-tip-panel input width:100% rule to
   the recurring-payment consent checkbox, squeezing the approval copy into
   a near-zero-width column. Keep the checkbox intrinsic and let the text use
   the remaining width. */
.save-card-consent {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  width: 100%;
}
.save-card-consent input,
.save-card-consent input[type="checkbox"] {
  width: 18px !important;
  height: 18px;
  min-width: 18px;
  max-width: 18px;
  padding: 0 !important;
  margin: 2px 0 0 0;
  accent-color: var(--mint);
}
.save-card-consent span {
  display: block;
  min-width: 0;
  width: 100%;
  overflow-wrap: break-word;
  word-break: normal;
  white-space: normal;
}

/* Membership checkout can be taller than Chat/Vote. Give that pane its own
   vertical scrolling region so consent, START MEMBERSHIP, status, and the
   accounting firewall remain reachable on Safari and smaller laptop windows. */
.live-interaction-pane[data-interaction-pane="membership"].active {
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}
.live-interaction-pane[data-interaction-pane="membership"] .live-tip-panel {
  flex: 0 0 auto;
  min-width: 0;
}
.live-interaction-pane[data-interaction-pane="membership"] .live-payment-box {
  min-width: 0;
  overflow: visible;
}
#membershipPaymentElement {
  width: 100%;
  min-width: 0;
}
#membershipPayButton {
  width: 100%;
  min-height: 46px;
  flex-shrink: 0;
}

@media (max-width: 900px) {
  .live-interaction-pane[data-interaction-pane="membership"].active {
    max-height: none;
  }
}

/* STEP 13 cleanup: active members must never see a second JOIN action. */
#membershipStartButton[hidden],#membershipCancelButton[hidden],#liveMembershipBadge[hidden]{display:none!important}


/* STEP 14 — NOTIFICATIONS + CREATOR AUDIENCE ACTIVATION */
.notification-center{display:grid;gap:16px}
.notification-preferences{display:grid;gap:10px;padding:14px;background:var(--panel,#111821);border-radius:14px}
.notification-preferences label{display:flex;gap:10px;align-items:flex-start;color:var(--text,#fff);font-size:.92rem;line-height:1.35}
.notification-preferences input[type="checkbox"]{margin-top:3px;accent-color:#58f2c2}
.notification-feed-heading{display:flex;justify-content:space-between;align-items:center;color:#9ca8b7;font-size:.8rem;letter-spacing:.08em}
.notification-feed{display:grid;gap:8px;max-height:360px;overflow:auto}
.notification-item{width:100%;display:flex;justify-content:space-between;gap:12px;text-align:left;padding:12px 14px;border:1px solid rgba(255,255,255,.08);background:#0d131b;color:#fff;border-radius:12px;cursor:pointer}
.notification-item.unread{border-color:rgba(88,242,194,.5);background:#101d1d}
.notification-item span{display:grid;gap:4px}.notification-item small{color:#9ca8b7;line-height:1.35}.notification-item b{color:#58f2c2;font-size:.7rem}


/* STEP 14 WEBSITE UX REPAIR — dedicated notification access and responsive panel */
.notification-bell{position:relative;width:44px;height:44px;display:grid;place-items:center;border:1px solid #243142;border-radius:12px;background:#111923;color:#fff;cursor:pointer;transition:border-color .18s ease,background .18s ease,transform .18s ease}
.notification-bell:hover{border-color:rgba(0,236,166,.65);background:#13211f;transform:translateY(-1px)}
.notification-bell svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.notification-badge{position:absolute;right:-5px;top:-6px;min-width:19px;height:19px;padding:0 5px;display:grid;place-items:center;border-radius:999px;background:var(--red);color:#fff;border:2px solid #03070b;font-size:10px;font-weight:900;line-height:1}
.notification-badge[hidden]{display:none!important}
.account-modal.notification-modal{width:min(780px,calc(100vw - 36px));max-height:min(840px,92vh);padding:30px 32px 32px;overflow:auto}
.account-modal.notification-modal>img{display:none}
.account-modal.notification-modal #modalTitle{margin:0 0 4px;font-size:36px;letter-spacing:-.035em}
.account-modal.notification-modal #modalText{margin:0 0 24px;font-size:15px}
.notification-center{display:grid;gap:18px}
.notification-loading,.notification-empty{display:grid;gap:5px;padding:20px;border:1px solid #213142;border-radius:16px;background:#0e1721;color:#aeb7c4}
.notification-empty strong{color:#fff;font-size:16px}
.notification-section{border:1px solid #1d2a38;border-radius:18px;background:#0b121b;overflow:hidden}
.notification-section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:20px 20px 14px}
.notification-section-heading h3{margin:3px 0 0;font-size:21px;letter-spacing:-.02em}
.notification-kicker{display:block;color:var(--mint);font-size:10px;font-weight:900;letter-spacing:.14em}
.notification-unread-count{flex:0 0 auto;margin-top:2px;padding:6px 10px;border-radius:999px;background:#111d27;color:#b7c1ce;font-size:11px;font-weight:800}
.notification-feed{display:grid;gap:0;max-height:310px;overflow:auto;border-top:1px solid #172331}
.notification-item{width:100%;display:flex;align-items:center;justify-content:space-between;gap:18px;text-align:left;padding:15px 20px;border:0;border-bottom:1px solid #172331;background:#0b121b;color:#fff;border-radius:0;cursor:pointer}
.notification-item:last-child{border-bottom:0}
.notification-item:hover{background:#101923}
.notification-item.unread{border-color:#172331;background:linear-gradient(90deg,rgba(0,236,166,.09),rgba(11,18,27,1) 40%)}
.notification-item-copy{display:grid;gap:4px;min-width:0}
.notification-item-copy strong{font-size:14px;line-height:1.35}
.notification-item-copy small{color:#97a4b4;line-height:1.4;font-size:12px}
.notification-status{flex:0 0 auto;color:#697789;font-size:9px;font-weight:900;letter-spacing:.1em}
.notification-status.new{color:var(--mint)}
.notification-preferences{display:grid;gap:0;padding:0;background:transparent;border-radius:0;border-top:1px solid #172331}
.notification-setting-row{display:flex!important;align-items:center!important;justify-content:space-between;gap:24px;padding:15px 20px;border-bottom:1px solid #172331;color:#fff!important;font-size:14px!important;cursor:pointer}
.notification-setting-row>span{display:grid;gap:3px;min-width:0}
.notification-setting-row strong{font-size:14px;line-height:1.3}
.notification-setting-row small{color:#8f9baa;font-size:12px;line-height:1.35;font-weight:500}
.notification-toggle{appearance:none;-webkit-appearance:none;flex:0 0 auto;width:44px!important;height:24px;margin:0!important;padding:0!important;border:1px solid #314152!important;border-radius:999px!important;background:#18222d!important;position:relative;cursor:pointer;transition:.2s ease}
.notification-toggle:before{content:"";position:absolute;width:18px;height:18px;left:2px;top:2px;border-radius:50%;background:#8491a1;transition:.2s ease}
.notification-toggle:checked{background:var(--mint)!important;border-color:var(--mint)!important}
.notification-toggle:checked:before{transform:translateX(20px);background:#00140f}
.notification-save-row{display:flex;align-items:center;gap:14px;padding:18px 20px;background:#0d151f}
.notification-save-row .primary{min-width:220px}
.notification-save-row .account-message{margin:0;flex:1}
@media(max-width:900px){.header-actions>[data-auth-logged-in]{gap:8px}.notification-bell{display:grid!important}.account-modal.notification-modal{width:min(720px,calc(100vw - 28px))}}
@media(max-width:620px){.header-actions>[data-auth-logged-in]>.ghost{display:none}.notification-bell{width:42px;height:42px}.account-modal.notification-modal{width:calc(100vw - 20px);max-height:94vh;padding:24px 18px}.account-modal.notification-modal #modalTitle{font-size:30px}.notification-section-heading{padding:17px 16px 12px}.notification-setting-row{gap:16px;padding:14px 16px}.notification-item{padding:14px 16px}.notification-save-row{align-items:stretch;flex-direction:column;padding:16px}.notification-save-row .primary{width:100%;min-width:0}.notification-save-row .account-message{width:100%}}

/* STEP 15 - EXPERIENCES MARKETPLACE */
.marketplace-section{padding-top:70px}.marketplace-heading{align-items:flex-end}.marketplace-intro{max-width:700px;margin:0;color:var(--muted);font-size:17px}.marketplace-toolbar{display:grid;gap:14px;margin:28px 0 16px}.marketplace-search{display:flex;align-items:center;gap:10px;background:#0c131d;border:1px solid #1d2a38;border-radius:14px;padding:0 16px;max-width:720px}.marketplace-search span{font-size:24px;color:var(--mint)}.marketplace-search input{width:100%;padding:15px 0;background:transparent;border:0;outline:0;color:#fff;font-size:16px}.marketplace-search input::placeholder{color:#778493}.marketplace-filters{display:flex;gap:8px;flex-wrap:wrap}.market-filter{border:1px solid #223143;background:#0c131d;color:#9eabba;border-radius:999px;padding:8px 12px;font-size:11px;font-weight:900;letter-spacing:.05em;cursor:pointer}.market-filter:hover,.market-filter.active{background:var(--mint);border-color:var(--mint);color:#00140f}.marketplace-status{display:flex;align-items:center;justify-content:space-between;gap:16px;color:#7f8c9d;font-size:12px;font-weight:800;letter-spacing:.06em;margin:18px 0 14px;text-transform:uppercase}.market-live-count{color:#fff}.experience-card{transition:transform .18s ease,border-color .18s ease}.experience-card:hover{transform:translateY(-3px);border-color:#2b4054}.experience-live{border-color:rgba(255,43,54,.48);box-shadow:0 0 0 1px rgba(255,43,54,.08)}.experience-category{position:absolute;top:14px;left:14px;background:#14202b;color:var(--mint);border:1px solid #263848;border-radius:999px;padding:6px 10px;font-size:10px;font-weight:900;letter-spacing:.06em}.experience-time{color:var(--mint);font-size:11px;font-weight:900;letter-spacing:.08em;margin-bottom:5px}.experience-title{font-size:22px!important;margin-bottom:12px!important}.creator-identity{display:flex;align-items:center;gap:9px;width:100%;padding:8px 0 11px;background:none;border:0;color:#fff;text-align:left;cursor:pointer}.creator-mini-avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--mint);color:#00140f;font-size:13px;font-weight:900}.creator-identity small{display:block;color:#728090;font-size:9px;font-weight:900;letter-spacing:.12em;line-height:1}.creator-identity strong{display:block;font-size:15px;line-height:1.3}.creator-identity:hover strong{color:var(--mint)}.marketplace-remind:disabled{opacity:.7;cursor:default}.live-empty-card{grid-column:1/-1}.marketplace-grid .creator-body p{min-height:72px;color:var(--muted)}
@media(max-width:800px){.marketplace-status{align-items:flex-start;flex-direction:column}.marketplace-heading{align-items:flex-start}.marketplace-filters{flex-wrap:nowrap;overflow-x:auto;padding-bottom:5px}.market-filter{white-space:nowrap}}


/* STEP 05 — Free Is Free / Secure Transaction tip breakdown */
.tip-checkout-summary { margin: 12px 0; padding: 14px; border: 1px solid rgba(92, 230, 190, .25); border-radius: 14px; background: rgba(255,255,255,.035); }
.tip-checkout-summary > div { display: flex; justify-content: space-between; gap: 18px; padding: 5px 0; }
.tip-checkout-summary .tip-checkout-total { margin-top: 6px; padding-top: 10px; border-top: 1px solid rgba(255,255,255,.12); font-size: 1.05rem; }
.tip-checkout-summary small { display: block; margin-top: 8px; opacity: .76; }


/* STEP 17 — LIVE TIP EXECUTION
   The TIPS pane can be taller than the fixed interaction rail. Make the pane
   independently scrollable so the payment CTA and Square card form are always
   reachable on desktop Safari, mobile Safari, and shorter browser windows. */
.live-interaction-pane[data-interaction-pane="tips"].active {
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-gutter: stable;
}
.live-interaction-pane[data-interaction-pane="tips"] .live-tip-panel {
  flex: 0 0 auto;
  min-width: 0;
  padding-bottom: 18px;
}
.live-interaction-pane[data-interaction-pane="tips"] .live-payment-box {
  min-width: 0;
  overflow: visible;
}
.tip-execution-button {
  width: 100%;
  min-height: 48px;
  flex-shrink: 0;
  position: relative;
  z-index: 1;
}
@media (max-width: 900px) {
  .live-interaction-pane[data-interaction-pane="tips"].active {
    max-height: none;
  }
}

/* STEP 12 — APPLE NSFW / GUIDELINE 1.2 COMPLIANCE */
.nsfw-badge{display:inline-flex;align-items:center;gap:4px;background:#8b0000;color:#fff;border:1px solid #ff5a5f;border-radius:999px;padding:6px 10px;font-size:11px;font-weight:900;letter-spacing:.08em}.card-nsfw{position:absolute;top:18px;right:18px}.experience-nsfw{border-color:rgba(255,90,95,.55)}.safety-action{border-color:rgba(255,90,95,.5)}.safety-footer{display:flex;gap:14px;flex-wrap:wrap;align-items:center;padding:28px max(20px,calc((100vw - 1100px)/2));border-top:1px solid rgba(255,255,255,.08);color:#8f99ad}.safety-footer strong{color:#5ee4b1}.safety-footer a{color:#5ee4b1}.safety-account{margin-top:14px}.eula-check{display:flex;align-items:flex-start;gap:10px;line-height:1.4}.eula-check input{margin-top:4px}.creator-visual{position:relative}
