/* Shared header buy dropdown / mobile sheet — used by cyberkitsu.com and launcher */ /* Reclaim SOL UI: hidden by default. Set data-reclaim-public="true" on and remove [hidden] to show again. */ html:not([data-reclaim-public="true"]) #reclaim, html:not([data-reclaim-public="true"]) a[href="#reclaim"], html:not([data-reclaim-public="true"]) a[href="/#reclaim"], html:not([data-reclaim-public="true"]) .mobile-sticky-bar__claim, html:not([data-reclaim-public="true"]) [data-reclaim-ui] { display: none !important; } .nav-buy { position: relative; } .nav-buy__trigger { display: inline-flex; align-items: center; gap: 0.35rem; font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; } .nav .nav-buy__trigger { color: var(--muted); font-size: 0.95rem; transition: color 0.25s ease; } .nav .nav-buy__trigger:hover, .nav-buy.is-open .nav-buy__trigger { color: var(--text); } .launcher-nav .nav-buy__trigger { /* inherits .launcher-nav__link when class present on launcher */ } .nav-buy__chevron { display: inline-block; width: 0.45rem; height: 0.45rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); opacity: 0.75; transition: transform 0.2s ease; } .nav-buy.is-open .nav-buy__chevron { transform: rotate(-135deg) translateY(1px); } .nav-buy__backdrop { display: none; position: fixed; inset: 0; z-index: 110; margin: 0; padding: 0; border: 0; background: radial-gradient(circle at 18% 12%, rgba(153, 69, 255, 0.14), transparent 34%), radial-gradient(circle at 82% 86%, rgba(20, 241, 149, 0.12), transparent 38%), rgba(4, 6, 15, 0.72); backdrop-filter: blur(8px); cursor: pointer; } .nav-buy__backdrop[hidden] { display: none !important; } .nav-buy__panel { position: absolute; top: calc(100% + 0.55rem); right: 0; width: min(22rem, calc(100vw - 2rem)); max-width: calc(100vw - 2rem); border: 1px solid rgba(79, 195, 255, 0.18); border-radius: var(--radius-lg); background: radial-gradient(120% 90% at 0% 0%, rgba(20, 241, 149, 0.07), transparent 58%), linear-gradient(160deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.01)), rgba(7, 10, 18, 0.82); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 18px 42px rgba(0, 0, 0, 0.28); backdrop-filter: blur(14px); z-index: 120; box-sizing: border-box; overflow: hidden; } .nav-buy__panel[hidden] { display: none !important; } .nav-buy__panel-head { display: none; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0 0 0.65rem; border-bottom: 1px solid var(--stroke); margin-bottom: 0.65rem; } .nav-buy__panel-title { margin: 0; font-size: 0.72rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--accent-c); } .nav-buy__close { display: none; align-items: center; justify-content: center; width: 2rem; height: 2rem; padding: 0; border: 1px solid var(--stroke); border-radius: 0; background: rgba(255, 255, 255, 0.05); color: var(--text); font-size: 1.35rem; line-height: 1; cursor: pointer; } .nav-buy__close:hover { border-color: rgba(79, 195, 255, 0.45); } .nav-buy__panel-body { padding: 0.85rem 0.9rem 0.35rem; } @media (min-width: 901px) { .nav-buy__panel-body { padding: 1rem 1rem 0.45rem; } } .nav-buy__panel .instant-buy { margin-top: 0; max-width: 100%; width: 100%; min-width: 0; box-sizing: border-box; padding: 0; border: 0; background: transparent; overflow: visible; } .nav-buy__panel .instant-buy--panel .instant-buy__layout, .nav-buy__panel .instant-buy--panel .instant-buy__controls, .nav-buy__panel .instant-buy--panel .instant-buy__actions-panel, .nav-buy__panel .instant-buy--panel .instant-buy__actions-band, .nav-buy__panel .instant-buy--panel .instant-buy__actions-row, .nav-buy__panel .instant-buy--panel .instant-buy__amount-row, .nav-buy__panel .instant-buy--panel .instant-buy__head { min-width: 0; max-width: 100%; overflow: visible; } .nav-buy__panel .instant-buy--panel .instant-buy__eyebrow { line-height: 1.35; /* letter-spacing on uppercase labels bleeds past the glyph box */ padding-inline: 0.14em 0.06em; } .nav-buy__panel .instant-buy--panel .instant-buy__layout { display: grid; grid-template-columns: minmax(0, 1fr) !important; gap: 0.65rem !important; } .nav-buy__panel .instant-buy--panel .instant-buy__actions-panel { display: block !important; border-left: 0 !important; padding: 0 !important; width: 100%; } .nav-buy__panel .instant-buy--panel .instant-buy__actions-band { flex-direction: column; align-items: stretch; width: 100%; } .nav-buy__panel .instant-buy--panel .instant-buy__actions-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); width: 100%; } .nav-buy__panel .instant-buy--panel .instant-buy__amount-row { max-width: none !important; min-width: 0; } .nav-buy__panel .instant-buy--panel .instant-buy__amount-input { min-width: 0; } .nav-buy__panel .instant-buy--panel .instant-buy__submit { min-width: 0; white-space: normal; } .nav-buy__panel .instant-buy--panel .instant-buy__range-label { grid-template-columns: minmax(0, auto) minmax(0, 1fr) minmax(0, auto); gap: 0.4rem; } .nav-buy__panel .instant-buy--panel .instant-buy__range-min, .nav-buy__panel .instant-buy--panel .instant-buy__range-max { font-size: 0.62rem; white-space: normal; line-height: 1.2; } .nav-buy__panel .instant-buy--panel .instant-buy__balance { white-space: normal; overflow-wrap: anywhere; word-break: break-word; line-height: 1.35; } .nav-buy__panel .instant-buy--panel .instant-buy__wallet-chip { max-width: min(9rem, 42%); margin-left: auto; font-size: 0.78rem; } .nav-buy__panel .instant-buy--panel .instant-buy__hint { width: 100%; text-align: left; } .nav-buy__foot { margin: 0; padding: 0.65rem 0.9rem 0.85rem; border-top: 1px solid var(--stroke); font-size: 0.78rem; color: var(--muted); text-align: center; } body.nav-buy-open { overflow: hidden; overscroll-behavior: none; } @media (min-width: 901px) { .nav-buy__panel .instant-buy--panel .instant-buy__layout { grid-template-columns: minmax(0, 1fr) !important; gap: 0.65rem !important; } .nav-buy__panel .instant-buy--panel .instant-buy__actions-panel { display: block !important; border-left: 0 !important; padding-left: 0 !important; } .nav-buy__panel .instant-buy--panel .instant-buy__actions-row { grid-template-columns: minmax(0, 1fr) !important; } .nav-buy__panel .instant-buy--panel .instant-buy__submit { padding: 0.5rem 0.55rem; font-size: 0.82rem; } } /* Mobile / narrow: bottom sheet */ @media (max-width: 900px) { /* Keep buy panel mountable when main nav links are hidden */ .nav { display: contents; } .nav > a { display: none; } .nav-buy { position: static; width: 0; height: 0; overflow: visible; } .nav-buy__trigger { display: none; } .nav-buy.is-open .nav-buy__backdrop { display: block; } .nav-buy__panel { position: fixed; left: 0; right: 0; bottom: 0; top: auto; width: 100%; max-width: none; max-height: min(92dvh, 640px); border-radius: var(--radius-lg) var(--radius-lg) 0 0; overflow: hidden; display: flex; flex-direction: column; transform: translateY(100%); transition: transform 0.32s ease; } .nav-buy.is-open .nav-buy__panel { transform: translateY(0); } .nav-buy__panel[hidden] { display: none !important; transform: translateY(100%); } .nav-buy__panel-head { display: flex; flex-shrink: 0; padding: 0.85rem 0.9rem 0.65rem; margin: 0; } .nav-buy__close { display: inline-flex; } .nav-buy__panel-body { flex: 1 1 auto; min-height: 0; overflow-x: hidden; overflow-y: auto; padding: 0 0.9rem 0.35rem; -webkit-overflow-scrolling: touch; } .nav-buy__foot { flex-shrink: 0; padding-bottom: max(0.85rem, env(safe-area-inset-bottom, 0px)); } } @media (max-width: 720px) { .launcher-topbar .nav-buy__panel { left: 0; right: 0; } } .instant-buy-frozen-notice { margin: 0 0 0.85rem; } .instant-buy-frozen-notice[hidden], .site-pause-notice[hidden] { display: none !important; margin: 0; padding: 0; } .instant-buy-frozen-notice__text { margin: 0; padding: 0.55rem 0.85rem; border: 1px solid rgba(255, 159, 46, 0.38); border-radius: var(--radius); background: linear-gradient( 135deg, rgba(255, 159, 46, 0.12), rgba(234, 96, 18, 0.08) ); color: #ffd4a8; font-size: 0.84rem; font-weight: 600; letter-spacing: 0.02em; line-height: 1.45; text-align: center; } .instant-buy-frozen-notice__text a { color: #ffb347; text-decoration: underline; text-underline-offset: 0.12em; } .instant-buy-frozen-notice__text a:hover { color: #ffe0b0; } .nav-buy__panel .instant-buy-frozen-notice, .instant-buy--panel .instant-buy-frozen-notice { margin: 0 0 0.65rem; } .instant-buy.is-frozen .instant-buy__controls, .instant-buy.is-frozen .instant-buy__submit { opacity: 0.45; pointer-events: none; } .nav-buy--fallback { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .nav-buy__sr-title { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }