:root { font-family: ui-rounded, "Arial Rounded MT Bold", system-ui, sans-serif; color: #fff4f5; background: #540018; }
* { box-sizing: border-box; }
body { min-width: 320px; min-height: 100vh; margin: 0; overflow-x: hidden; background: #540018; }
body::before, body::after { position: fixed; z-index: -1; content: ""; border-radius: 50%; filter: blur(54px); pointer-events: none; }
body::before { width: 72vw; height: 72vw; left: -20vw; top: 18vh; background: #bd174c; opacity: .88; animation: lava-one 15s ease-in-out infinite alternate; }
body::after { width: 68vw; height: 68vw; right: -23vw; top: 48vh; background: #ff538d; opacity: .67; animation: lava-two 18s ease-in-out infinite alternate; }
button, a { font: inherit; } a { color: inherit; text-decoration: none; }
.landing-shell { width: min(100% - 28px, 650px); margin: 0 auto; padding: 42px 0 46px; }

.profile { display: grid; justify-items: center; text-align: center; padding: 8px 10px 40px; }
.profile-photo { width: clamp(150px, 42vw, 192px); aspect-ratio: 1; border: 4px solid rgba(255, 217, 230, .88); border-radius: 50%; background-image: url("assets/princess-melia-reference.png"); background-size: 259.4% auto; background-position: 50% 16%; box-shadow: 0 0 0 3px #b80d43, 0 18px 32px rgba(28, 0, 10, .42); }
.sparkles { order: 1; margin: 15px 0 -2px; color: #ffdce9; font-size: 1rem; letter-spacing: .45em; text-shadow: 0 0 15px rgba(255, 255, 255, .8); }
.profile h1 { order: 2; margin: 0; color: #fff5f5; font-size: clamp(2.25rem, 9vw, 3.5rem); line-height: 1; letter-spacing: -.07em; text-shadow: 0 4px 20px rgba(85, 0, 26, .48); }
.tagline { order: 3; margin: 12px 0 0; color: #ffdbe7; font-size: 1.05rem; font-weight: 800; }.profile-rules { order: 4; margin: 8px 0 0; color: #ffc4d9; font-size: .86rem; font-weight: 750; }.profile-rules span { padding: 0 5px; color: #ff7dac; }

.link-list, .crypto-list { display: grid; gap: 15px; }.link-card, .crypto-card { border: 1px solid rgba(255, 233, 239, .5); background: linear-gradient(125deg, rgba(255,255,255,.32), rgba(255,219,231,.16)); box-shadow: inset 1px 1px rgba(255,255,255,.38), inset -1px -1px rgba(91, 0, 28, .12), 0 9px 0 rgba(76, 0, 24, .28), 0 19px 35px rgba(30, 0, 11, .25); backdrop-filter: blur(16px) saturate(130%); -webkit-backdrop-filter: blur(16px) saturate(130%); }
.link-card { display: grid; min-height: 106px; grid-template-columns: 64px 1fr auto; align-items: center; gap: 17px; padding: 17px 21px; border-radius: 29px; transition: transform .16s ease, filter .16s ease; }.link-card:hover, .link-card:focus-visible { transform: translateY(-3px); filter: brightness(1.1); outline: 0; }
.link-icon, .crypto-icon { display: grid; place-items: center; color: #fff5f7; background: linear-gradient(145deg, rgba(255, 133, 176, .95), rgba(177, 9, 61, .94)); box-shadow: inset 1px 1px rgba(255,255,255,.45), inset 0 -5px rgba(104,0,33,.22), 0 7px 14px rgba(57,0,18,.2); }.link-icon { width: 64px; height: 64px; border: 1px solid rgba(255, 236, 242, .65); border-radius: 21px; }.link-icon svg, .crypto-icon svg { width: 60%; height: 60%; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }.coin-icon svg { width: 66%; height: 66%; }.loyalfans-icon svg { fill: currentColor; stroke: none; }
.link-copy { display: grid; min-width: 0; gap: 4px; }.link-copy strong { font-size: clamp(1.25rem, 5vw, 1.55rem); letter-spacing: -.045em; }.link-copy small { color: #ffe2eb; font-size: .96rem; font-weight: 750; }.arrow { color: #ffd7e4; font-family: Georgia, serif; font-size: 2.5rem; line-height: .6; }
.game-link { border-color: rgba(255, 232, 240, .85); background: linear-gradient(125deg, rgba(255,112,164,.59), rgba(128,0,43,.47)); box-shadow: inset 1px 1px rgba(255,255,255,.55), inset -1px -1px rgba(91,0,28,.18), 0 10px 0 #790026, 0 22px 42px rgba(42,0,14,.34); }.game-link .link-icon { background: linear-gradient(145deg, #ff77ad, #bb0d46); }.game-link .link-copy strong { font-size: clamp(1.45rem, 5.8vw, 1.75rem); }.game-link .link-copy small { color: #fff4f7; }

.crypto { margin-top: 47px; }.section-heading { display: flex; align-items: center; justify-content: center; gap: 12px; color: #fff5f6; text-shadow: 0 4px 16px rgba(69,0,22,.48); }.section-heading h2 { margin: 0; font-size: clamp(1.45rem, 6vw, 2rem); letter-spacing: -.06em; }.section-flourish { color: #ffb7d0; }.crypto-card { display: grid; min-height: 108px; grid-template-columns: 57px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 15px 16px; border-radius: 29px; }.crypto-icon { width: 57px; height: 57px; border: 1px solid rgba(255, 236, 242, .65); border-radius: 19px; font-size: 1.9rem; font-weight: 900; }.ethereum { font-size: 1.45rem; }.solana { font-size: 2.5rem; }.crypto-card h3 { margin: 0 0 5px; font-size: clamp(1.05rem, 4vw, 1.28rem); letter-spacing: -.04em; }.crypto-card h3 span { color: #ffd4e2; font-weight: 700; }.crypto-card code { display: block; overflow-wrap: anywhere; color: #ffe6ed; font: 600 .76rem/1.35 ui-monospace, SFMono-Regular, Menlo, monospace; }.copy-button, .gate-enter { border: 1px solid rgba(255,255,255,.35); border-radius: 16px; padding: 13px 18px; background: linear-gradient(#ff75ac, #db2366); color: white; box-shadow: inset 0 1px rgba(255,255,255,.5), inset 0 -4px #a7083d, 0 5px 12px rgba(69,0,23,.22); font-size: .96rem; font-weight: 900; cursor: pointer; transition: transform .15s ease, filter .15s ease; }.copy-button:hover, .copy-button:focus-visible, .gate-enter:hover, .gate-enter:focus-visible { transform: translateY(-2px); filter: brightness(1.08); outline: 0; }.copy-button.is-copied { background: linear-gradient(#bd7a98, #89546b); box-shadow: inset 0 -4px #643a4d; }

footer { display: grid; justify-items: center; padding: 46px 0 4px; }.copy-status { min-height: 1.4em; margin: 14px 0 0; text-align: center; color: #ffe0eb; font-size: .9rem; font-weight: 700; } footer p { margin: 0 0 16px; color: #ffe2eb; font-size: 1.08rem; font-weight: 800; text-shadow: 0 3px 12px rgba(73,0,22,.4); }.x-button { display: grid; width: 58px; height: 58px; place-items: center; border: 1px solid rgba(255, 232, 240, .8); border-radius: 50%; background: rgba(255,245,248,.9); box-shadow: inset 0 1px white, 0 7px 0 rgba(73,0,23,.34); color: #a7093e; font-size: 1.8rem; transition: transform .15s ease; }.x-button:hover, .x-button:focus-visible { transform: translateY(-2px); outline: 0; }

.age-gate { position: fixed; z-index: 20; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(42, 0, 15, .68); backdrop-filter: blur(11px); -webkit-backdrop-filter: blur(11px); }.age-gate[hidden] { display: none; }.age-gate__card { width: min(100%, 485px); padding: clamp(28px, 7vw, 42px); text-align: center; border: 1px solid rgba(255,235,242,.74); border-radius: 34px; background: linear-gradient(135deg, rgba(255,244,247,.98), rgba(255,218,230,.97)); color: #442433; box-shadow: inset 1px 1px white, 0 25px 70px rgba(29,0,10,.55); animation: gate-in .26s cubic-bezier(.2,1.35,.4,1); }.gate-eyebrow { margin: 0; color: #bd2057; font-size: .85rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }.age-gate h2 { margin: 8px 0 16px; font-size: clamp(2rem, 9vw, 3rem); letter-spacing: -.07em; }.age-gate p { margin: 0 0 28px; color: #624352; font-size: 1.05rem; font-weight: 650; line-height: 1.5; }.gate-enter { display: block; width: 100%; padding: 18px; font-size: 1.15rem; }.gate-close { margin-top: 15px; border: 0; background: transparent; color: #bd2057; font-weight: 900; cursor: pointer; }

@keyframes lava-one { to { transform: translate(30vw, -13vh) scale(1.18); } } @keyframes lava-two { to { transform: translate(-30vw, -22vh) scale(1.28); } } @keyframes gate-in { from { transform: scale(.78); opacity: 0; } to { transform: scale(1); opacity: 1; } }
@media (max-width: 460px) { .landing-shell { width: min(100% - 20px, 650px); padding-top: 28px; }.profile { padding-bottom: 31px; }.link-card { min-height: 96px; grid-template-columns: 56px 1fr auto; gap: 13px; padding: 14px; border-radius: 24px; }.link-icon { width: 56px; height: 56px; border-radius: 18px; }.link-copy small { font-size: .84rem; }.crypto { margin-top: 37px; }.crypto-card { grid-template-columns: 49px minmax(0, 1fr); gap: 11px; padding: 13px; border-radius: 24px; }.crypto-icon { width: 49px; height: 49px; border-radius: 16px; font-size: 1.65rem; }.crypto-card code { font-size: .67rem; }.copy-button { grid-column: 2; justify-self: start; padding: 10px 17px; }.crypto-card:has(.copy-button) { min-height: 132px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; } }
