/* Wallverse shared interface and collectible-frame styles, version 2. */
:root { --bg:#050812; --bg-2:#081225; --surface:rgba(16,24,42,.78); --surface-light:rgba(23,36,61,.78); --text:#f4f7fb; --muted:#95a3b8; --purple:#9b5cff; --blue:#3578ff; --cyan:#28f3ff; --pink:#ef4de1; --line:rgba(198,246,255,.2); --radius:24px; --radius-small:16px; --max:1240px; --shadow:0 22px 52px rgba(0,0,0,.32); }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { min-width:0; overflow-x:hidden; margin:0; color:var(--text); background:radial-gradient(circle at 78% 2%,rgba(53,120,255,.14),transparent 31rem),radial-gradient(circle at 8% 30%,rgba(155,92,255,.1),transparent 28rem),var(--bg); font-family:Manrope,system-ui,sans-serif; } img { display:block; max-width:100%; } a { color:inherit; text-decoration:none; } button { font:inherit; } h1,h2,h3,p { margin:0; } h1,h2,h3 { text-wrap:balance; } .skip-link { position:fixed; z-index:100; top:10px; left:10px; padding:10px 14px; transform:translateY(-150%); background:var(--cyan); color:#021018; border-radius:8px; font-weight:800; } .skip-link:focus { transform:none; } :focus-visible { outline:2px solid var(--cyan); outline-offset:4px; }
.ambient { position:fixed; z-index:-1; width:30rem; height:30rem; opacity:.12; filter:blur(110px); pointer-events:none; } .ambient--purple { background:var(--pink); top:38%; left:-19rem; } .ambient--blue { background:var(--cyan); right:-18rem; bottom:5%; }
.section-shell,.site-header,footer { width:min(var(--max),100%); margin-inline:auto; padding-inline:28px; } .site-header { min-height:88px; display:flex; align-items:center; justify-content:space-between; gap:24px; } .brand { display:inline-flex; align-items:center; gap:10px; font-size:.84rem; font-weight:800; letter-spacing:.2em; white-space:nowrap; } .brand img { object-fit:contain; } .nav { display:flex; gap:28px; } .nav a { color:#b5c0d4; font-size:.88rem; font-weight:700; } .nav a[aria-current],.nav a:hover { color:var(--text); } .header-actions { display:flex; align-items:center; gap:12px; } .search-visual { display:flex; align-items:center; gap:8px; width:178px; padding:10px 12px; border:1px solid var(--line); border-radius:999px; color:#8392aa; background:rgba(8,18,37,.5); font-size:.75rem; } .search-visual span:first-child { font-size:1.25rem; line-height:.8; color:var(--cyan); }
.button { display:inline-flex; align-items:center; justify-content:center; gap:9px; min-height:48px; padding:12px 18px; border:1px solid transparent; border-radius:var(--radius-small); font-size:.84rem; font-weight:800; transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease; } .button:hover { transform:translateY(-2px); } .button--small { min-height:40px; padding:9px 15px; border-color:rgba(40,243,255,.46); background:linear-gradient(135deg,rgba(155,92,255,.17),rgba(40,243,255,.1)); box-shadow:inset 0 0 18px rgba(40,243,255,.06); } .button--play { padding:10px 17px 10px 12px; border-color:rgba(155,92,255,.65); background:linear-gradient(135deg,rgba(20,29,51,.97),rgba(7,11,25,.97)); box-shadow:0 0 30px rgba(155,92,255,.14),inset 0 0 0 1px rgba(255,255,255,.05); } .button--play:hover { box-shadow:0 10px 32px rgba(53,120,255,.24); } .button--play img { width:28px; height:28px; object-fit:contain; } .button--play span { display:grid; text-align:left; } .button--play small { color:#aebbd0; font-size:.56rem; letter-spacing:.12em; } .button--play strong { font-size:1rem; line-height:1.15; } .button--ghost { border-color:var(--line); color:#dce8f5; background:rgba(16,24,42,.5); } .mobile-menu { display:none; position:relative; } .mobile-menu summary { display:grid; gap:4px; width:42px; padding:11px; border:1px solid var(--line); border-radius:12px; cursor:pointer; list-style:none; } .mobile-menu summary::-webkit-details-marker { display:none; } .mobile-menu summary span { height:2px; width:18px; background:var(--text); border-radius:2px; } .mobile-menu nav { position:absolute; right:0; top:52px; z-index:10; display:grid; min-width:190px; padding:10px; border:1px solid var(--line); border-radius:16px; background:#0c1426; box-shadow:var(--shadow); } .mobile-menu nav a { padding:10px; color:#d5dfec; font-size:.85rem; border-radius:9px; } .mobile-menu nav a:hover { background:var(--surface-light); }
.spotlight { display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:74px; min-height:660px; padding-top:56px; padding-bottom:84px; } .eyebrow { display:flex; align-items:center; gap:10px; color:#b0bed5; font-size:.69rem; font-weight:800; letter-spacing:.17em; } .eyebrow span { width:26px; height:1px; background:linear-gradient(90deg,var(--pink),var(--cyan)); } .eyebrow--pill { width:max-content; padding:10px 13px; border:1px solid rgba(40,243,255,.38); border-radius:999px; color:var(--cyan); background:rgba(7,15,31,.54); } .spotlight h1 { margin-top:25px; font-size:clamp(3.15rem,5.2vw,5rem); line-height:.98; letter-spacing:-.06em; } .intro { max-width:460px; margin-top:22px; color:var(--muted); font-size:1.03rem; line-height:1.8; } .spotlight-actions { display:flex; flex-wrap:wrap; gap:14px; margin-top:32px; }
.spotlight-card { position:relative; isolation:isolate; min-height:550px; overflow:hidden; border:1px solid rgba(198,246,255,.28); border-radius:30px; background:var(--surface); box-shadow:0 30px 80px rgba(0,0,0,.48),0 0 60px rgba(53,120,255,.12); } .spotlight-card[hidden] { display:none; } .spotlight-card>img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; } .spotlight-card__shade { position:absolute; inset:0; background:linear-gradient(180deg,rgba(3,7,17,.08) 30%,rgba(3,7,17,.92) 95%); z-index:-0; } .spotlight-card__top { position:absolute; inset:18px 18px auto; display:flex; justify-content:space-between; align-items:center; } .pill,.tag { display:inline-flex; align-items:center; width:max-content; border:1px solid rgba(198,246,255,.34); border-radius:99px; color:#e3faff; background:rgba(7,15,31,.69); font-size:.63rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; backdrop-filter:blur(10px); } .pill { padding:7px 10px; } .icon-button { width:36px; height:36px; display:grid; place-items:center; border:1px solid rgba(198,246,255,.28); border-radius:50%; color:var(--text); background:rgba(5,8,18,.67); cursor:default; font-size:1.25rem; line-height:1; backdrop-filter:blur(10px); } .spotlight-card__meta { position:absolute; right:28px; bottom:30px; left:28px; } .spotlight-card__label { color:#bbc9dd; font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; } .spotlight-card h2 { margin:5px 0 14px; font-size:clamp(2rem,3.2vw,3.25rem); letter-spacing:-.055em; } .creator { display:flex; align-items:center; gap:8px; min-width:0; } .creator>span:last-child { display:grid; min-width:0; } .creator strong { overflow:hidden; color:#eaf2fb; font-size:.76rem; text-overflow:ellipsis; white-space:nowrap; } .creator small { color:#a2b0c4; font-size:.66rem; } .avatar { flex:0 0 28px; width:28px; height:28px; display:grid; place-items:center; overflow:hidden; border:1px solid rgba(255,255,255,.35); border-radius:50%; color:#fff; font-size:.67rem; font-weight:800; } .avatar__image { width:100%; height:100%; object-fit:cover; } .avatar--violet { background:linear-gradient(135deg,#ad78ff,#4935b8); } .avatar--ice { background:linear-gradient(135deg,#65dfff,#3376b9); } .avatar--gold { background:linear-gradient(135deg,#ffc758,#bc6a28); } .avatar--coral { background:linear-gradient(135deg,#ff8a88,#a83a6d); } .avatar--mint { background:linear-gradient(135deg,#67edc4,#278d90); } .avatar--blue { background:linear-gradient(135deg,#60a8ff,#5741cd); } .pager { position:absolute; bottom:18px; left:28px; display:flex; gap:6px; } .pager span { width:18px; height:3px; border-radius:99px; background:rgba(255,255,255,.36); } .pager .is-active { width:32px; background:var(--cyan); box-shadow:0 0 10px var(--cyan); }
.for-you { padding-top:90px; padding-bottom:108px; } .section-heading { display:flex; align-items:end; justify-content:space-between; gap:28px; margin-bottom:20px; } .section-heading h2,.features h2,.app-promo h2 { margin-top:13px; font-size:clamp(2.35rem,4.5vw,4.5rem); line-height:1; letter-spacing:-.06em; } .section-heading>p { max-width:350px; color:var(--muted); font-size:.9rem; line-height:1.7; } .feed-status { min-height:24px; margin:0 0 18px; color:var(--muted); font-size:.88rem; } .wallpaper-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; } .wallpaper-card { overflow:hidden; border:1px solid var(--line); border-radius:var(--radius); background:linear-gradient(145deg,rgba(23,36,61,.68),rgba(8,18,37,.8)); box-shadow:inset 0 1px 0 rgba(255,255,255,.035); transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease; } .wallpaper-card:hover { transform:translateY(-6px); border-color:rgba(40,243,255,.5); box-shadow:var(--shadow),0 0 24px rgba(40,243,255,.08); } .wallpaper-image { position:relative; overflow:hidden; aspect-ratio:9/14; background:linear-gradient(145deg,rgba(23,36,61,.95),rgba(8,18,37,.9)); } .wallpaper-image--unavailable::after { position:absolute; inset:0; display:grid; place-items:center; color:var(--muted); content:'Image unavailable'; font-size:.78rem; } .wallpaper-image img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; } .wallpaper-card:hover .wallpaper-image img { transform:scale(1.05); } .wallpaper-image>.pill { position:absolute; top:10px; left:10px; } .card-actions { position:absolute; top:8px; right:8px; display:flex; gap:5px; } .card-actions .icon-button { width:30px; height:30px; font-size:.95rem; } .card-actions .icon-button:last-child { font-size:.65rem; letter-spacing:1px; } .wallpaper-info { display:grid; grid-template-columns:1fr auto; gap:8px; padding:13px 13px 14px; } .wallpaper-info h3 { grid-column:1/-1; font-size:.91rem; letter-spacing:-.02em; } .wallpaper-info .tag { align-self:center; padding:5px 7px; color:#a9bad1; font-size:.55rem; } .feed-actions { display:flex; justify-content:center; padding-top:30px; }
.features { padding-top:76px; padding-bottom:115px; } .features .section-heading { display:block; max-width:760px; } .feature-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; } .feature-card { min-height:214px; padding:26px; border:1px solid var(--line); border-radius:var(--radius); background:linear-gradient(145deg,rgba(23,36,61,.7),rgba(8,18,37,.82)); } .feature-icon { width:45px; height:45px; display:grid; place-items:center; margin-bottom:28px; border:1px solid rgba(155,92,255,.34); border-radius:14px; color:var(--cyan); background:linear-gradient(135deg,rgba(155,92,255,.24),rgba(40,243,255,.08)); font-size:1.25rem; } .feature-card h3 { margin-bottom:9px; font-size:1rem; } .feature-card p { color:var(--muted); font-size:.83rem; line-height:1.7; }
.app-promo { position:relative; display:grid; grid-template-columns:.88fr 1.12fr; align-items:center; gap:70px; overflow:hidden; margin-bottom:76px; padding-top:64px; padding-bottom:62px; border:1px solid rgba(198,246,255,.25); border-radius:30px; background:radial-gradient(circle at 0% 50%,rgba(155,92,255,.22),transparent 32%),radial-gradient(circle at 100% 50%,rgba(40,243,255,.15),transparent 34%),var(--surface); box-shadow:var(--shadow); } .app-promo__copy { position:relative; z-index:1; } .app-promo__copy>img { width:190px; height:auto; margin-bottom:26px; object-fit:contain; object-position:left; } .app-promo__copy>p:not(.eyebrow) { max-width:430px; margin:20px 0 26px; color:var(--muted); line-height:1.75; } .app-promo__visual { position:relative; min-height:340px; } .phone-halo { position:absolute; inset:15% 5%; border-radius:50%; background:conic-gradient(from 30deg,rgba(239,77,225,.42),rgba(40,243,255,.38),rgba(53,120,255,.42),rgba(239,77,225,.42)); filter:blur(65px); } .app-promo__visual img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 28px 35px rgba(0,0,0,.4)); }
footer { display:grid; grid-template-columns:1fr auto; gap:28px; padding-top:34px; padding-bottom:30px; border-top:1px solid var(--line); color:#a2afc1; font-size:.78rem; } .footer-brand { display:grid; gap:11px; } .footer-links { display:flex; align-items:start; flex-wrap:wrap; justify-content:end; gap:22px; } .footer-links a:hover { color:var(--cyan); } .copyright { grid-column:1/-1; padding-top:12px; border-top:1px solid rgba(198,246,255,.1); color:#718097; font-size:.67rem; }
@media (max-width:1050px) { .nav--desktop,.search-visual { display:none; } .spotlight { grid-template-columns:1fr 1fr; gap:42px; } .wallpaper-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } .app-promo { gap:40px; } }
@media (max-width:760px) { .site-header,.section-shell,footer { padding-inline:18px; } .site-header { min-height:72px; } .header-actions>.button { display:none; } .mobile-menu { display:block; } .spotlight { grid-template-columns:1fr; gap:38px; min-height:0; padding-top:46px; padding-bottom:66px; } .spotlight-card { min-height:520px; } .section-heading { display:grid; gap:14px; align-items:start; } .section-heading>p { max-width:500px; } .wallpaper-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } .for-you { padding-top:68px; padding-bottom:78px; } .feature-grid { grid-template-columns:repeat(2,1fr); } .features { padding-top:48px; padding-bottom:78px; } .app-promo { grid-template-columns:1fr; gap:8px; margin-bottom:48px; padding-top:44px; padding-bottom:12px; } .app-promo__visual { min-height:290px; } footer { grid-template-columns:1fr; text-align:center; } .footer-brand .brand { justify-content:center; } .footer-links { justify-content:center; } }
@media (max-width:390px) { .brand { font-size:.7rem; letter-spacing:.15em; } .brand img { width:34px; height:34px; } .spotlight h1 { font-size:3.3rem; } .spotlight-card { min-height:480px; } .wallpaper-grid { grid-template-columns:1fr; } .feature-grid { grid-template-columns:1fr; } .feature-card { min-height:auto; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none !important; animation:none !important; } }

.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.home-highlights { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); align-items:start; gap:20px; padding-top:62px; padding-bottom:82px; }
.home-highlights .spotlight-card { min-height:0; aspect-ratio:9 / 12; }
.highlights-side { display:grid; gap:20px; }
.featured-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.featured-card,.creator-spotlight { position:relative; isolation:isolate; overflow:hidden; border:1px solid rgba(198,246,255,.27); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow); }
.featured-card { aspect-ratio:9 / 12; }
.featured-card__image,.creator-spotlight__banner { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.featured-card__shade,.creator-spotlight__shade { position:absolute; inset:0; background:linear-gradient(180deg,rgba(4,9,21,.06) 28%,rgba(4,9,21,.88) 100%); }
.featured-card p { position:absolute; z-index:1; right:16px; bottom:16px; left:16px; margin:0; color:var(--text); font-size:.93rem; font-weight:800; line-height:1.25; }
.creator-spotlight { min-height:176px; }
.creator-spotlight__content { position:absolute; z-index:1; right:22px; bottom:20px; left:22px; display:grid; gap:11px; }
.creator-spotlight .eyebrow { color:var(--cyan); }
.creator-spotlight .creator strong { font-size:.95rem; }
.creator-spotlight .avatar { width:40px; height:40px; flex-basis:40px; }
.wallpaper-image img { animation:wallpaper-idle 11s ease-in-out infinite alternate; animation-delay:var(--idle-delay,0s); transform:scale(1.035); }
.spotlight-card>img,.featured-card__image { animation:spotlight-pan 15s ease-in-out infinite alternate; transform:scale(1.08); }
@keyframes wallpaper-idle { from { transform:scale(1.035) translate3d(0,-.8%,0); } to { transform:scale(1.055) translate3d(0,.8%,0); } }
@keyframes spotlight-pan { from { transform:scale(1.08) translate3d(0,-3.5%,0); } to { transform:scale(1.08) translate3d(0,3.5%,0); } }
@media (max-width:760px) { .home-highlights { grid-template-columns:1fr; padding-top:38px; padding-bottom:62px; } .featured-grid { gap:12px; } .highlights-side { gap:12px; } .creator-spotlight { min-height:150px; } }
@media (prefers-reduced-motion:reduce) { .wallpaper-image img,.spotlight-card>img,.featured-card__image { animation:none; } }

/* Homepage highlight refinements */
.spotlight-card__label,.highlight-label { color:var(--cyan); font-size:.68rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.home-highlights { align-items:stretch; }
.highlights-side { grid-template-rows:auto minmax(0,1fr); min-height:0; }
.featured-card__image,.creator-spotlight__banner { will-change:transform; backface-visibility:hidden; transform:translateZ(0); }
.featured-card__badge { position:absolute; z-index:1; top:14px; left:14px; }
.featured-card .highlight-label { position:absolute; z-index:1; right:16px; bottom:48px; left:16px; margin:0; text-shadow:0 2px 16px rgba(0,0,0,.65); }
.featured-card h2 { position:absolute; z-index:1; right:16px; bottom:16px; left:16px; margin:0; color:var(--text); font-size:clamp(.9rem,1.4vw,1.1rem); font-weight:800; line-height:1.25; letter-spacing:-.025em; }
.creator-spotlight { min-height:0; height:100%; }
.creator-spotlight__content { inset:0; display:grid; align-content:end; gap:16px; padding:26px; }
.creator-spotlight__profile { display:flex; align-items:center; gap:14px; min-width:0; }
.creator-spotlight__profile .creator { gap:12px; }
.creator-spotlight__profile .creator strong { font-size:clamp(1.1rem,2vw,1.45rem); }
.creator-spotlight__profile .avatar { width:72px; height:72px; flex-basis:72px; font-size:1.2rem; border-width:2px; box-shadow:0 0 0 4px rgba(40,243,255,.12),0 0 28px rgba(40,243,255,.22); }
.creator-spotlight__stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin:0; }
.creator-spotlight__stats div { min-width:0; padding:9px 7px; border:1px solid rgba(198,246,255,.16); border-radius:12px; background:rgba(4,9,21,.48); backdrop-filter:blur(10px); }
.creator-spotlight__stats dt { overflow:hidden; color:#b7c3d6; font-size:.57rem; font-weight:800; letter-spacing:.08em; text-overflow:ellipsis; text-transform:uppercase; white-space:nowrap; }
.creator-spotlight__stats dd { margin:4px 0 0; overflow:hidden; color:#fff; font-size:.86rem; font-weight:800; text-overflow:ellipsis; white-space:nowrap; }
.wallpaper-image img { will-change:transform; backface-visibility:hidden; transform:translateZ(0); animation:wallpaper-idle 18s cubic-bezier(.45,0,.55,1) infinite alternate; animation-delay:var(--idle-delay,0s); }
.wallpaper-card:hover .wallpaper-image img { transform:translateZ(0); }
.spotlight-card>img,.featured-card__image { will-change:transform; backface-visibility:hidden; animation:spotlight-pan 24s cubic-bezier(.45,0,.55,1) infinite alternate; }
@keyframes wallpaper-idle { from { transform:translate3d(0,-.45%,0) scale(1.025); } to { transform:translate3d(0,.45%,0) scale(1.04); } }
@keyframes spotlight-pan { from { transform:translate3d(0,-2%,0) scale(1.055); } to { transform:translate3d(0,2%,0) scale(1.055); } }
@media (max-width:760px) { .highlights-side { grid-template-rows:auto auto; } .featured-card .highlight-label { display:none; } .creator-spotlight { min-height:270px; } .creator-spotlight__content { padding:20px; } .creator-spotlight__stats { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:430px) { .creator-spotlight__profile .avatar { width:58px; height:58px; flex-basis:58px; } .creator-spotlight__stats { grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* Account and profile */
.button--auth { min-height:40px; padding:9px 15px; border-color:rgba(155,92,255,.64); color:#fff; background:linear-gradient(135deg,rgba(155,92,255,.26),rgba(53,120,255,.2)); }
.account-menu { position:relative; }
.account-menu__trigger { display:flex; align-items:center; gap:8px; padding:4px 8px 4px 4px; border:1px solid var(--line); border-radius:999px; color:var(--text); background:rgba(8,18,37,.56); cursor:pointer; font:inherit; font-size:.78rem; font-weight:800; }
.account-menu__trigger .avatar { width:30px; height:30px; flex-basis:30px; }
.account-menu__panel { position:absolute; z-index:12; top:calc(100% + 9px); right:0; display:grid; min-width:144px; gap:3px; padding:6px; border:1px solid var(--line); border-radius:14px; background:#0d172b; box-shadow:var(--shadow); }
.account-menu__panel button,.text-button { border:0; border-radius:9px; color:#ced8e8; background:transparent; cursor:pointer; font:inherit; font-size:.79rem; font-weight:700; text-align:left; }
.account-menu__panel button { padding:9px 10px; }.account-menu__panel button:hover,.text-button:hover { color:var(--cyan); background:rgba(40,243,255,.07); }
.auth-dialog,.profile-dialog { width:min(440px,calc(100% - 32px)); margin:auto; padding:30px; border:1px solid rgba(198,246,255,.3); border-radius:24px; color:var(--text); background:linear-gradient(145deg,#111c33,#071021); box-shadow:0 30px 90px rgba(0,0,0,.7),0 0 45px rgba(53,120,255,.16); }
.auth-dialog::backdrop,.profile-dialog::backdrop { background:rgba(1,4,12,.74); backdrop-filter:blur(8px); }.dialog-close { position:absolute; top:13px; right:14px; width:34px; height:34px; border:1px solid var(--line); border-radius:50%; color:var(--text); background:rgba(5,8,18,.55); cursor:pointer; font-size:1.35rem; line-height:1; }
.auth-dialog__head { display:grid; gap:10px; padding-right:30px; margin-bottom:23px; }.auth-dialog h2,.profile-dialog h2 { font-size:1.8rem; letter-spacing:-.05em; }.auth-dialog__head>p:last-child,.profile-dialog__identity p:last-child { color:var(--muted); font-size:.86rem; line-height:1.55; }
.auth-dialog form,.profile-dialog form { display:grid; gap:14px; }.auth-field { display:grid; gap:7px; color:#c5d1e3; font-size:.73rem; font-weight:800; letter-spacing:.04em; }.auth-field input { width:100%; padding:12px 13px; border:1px solid var(--line); border-radius:12px; outline:0; color:var(--text); background:rgba(4,10,23,.67); font:inherit; }.auth-field input:focus { border-color:var(--cyan); box-shadow:0 0 0 3px rgba(40,243,255,.11); }
.auth-message { min-height:18px; margin:0; color:#b9c8dd; font-size:.77rem; line-height:1.45; }.auth-message[hidden] { display:none; }.button--auth-submit { width:100%; border-color:rgba(40,243,255,.55); color:#04101b; background:linear-gradient(135deg,var(--cyan),#7eb7ff); }.button--auth-submit:disabled { cursor:wait; opacity:.65; }
.auth-dialog__footer { display:flex; justify-content:space-between; gap:10px; margin-top:16px; }.text-button { padding:7px 4px; }.auth-divider { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:10px; margin:16px 0; color:var(--muted); font-size:.72rem; }.auth-divider span { height:1px; background:var(--line); }.button--oauth { width:100%; min-height:44px; border-color:var(--line); background:rgba(4,10,23,.47); }
.profile-dialog__identity { display:flex; align-items:center; gap:15px; margin-bottom:23px; }.profile-dialog__identity>.avatar { width:72px; height:72px; flex-basis:72px; font-size:1.2rem; border-width:2px; box-shadow:0 0 0 4px rgba(40,243,255,.1); }.profile-dialog__identity>div { display:grid; gap:5px; }.profile-dialog__stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin:0 0 22px; }.profile-dialog__stats div { padding:10px 7px; border:1px solid rgba(198,246,255,.15); border-radius:11px; background:rgba(4,10,23,.47); }.profile-dialog__stats dt { overflow:hidden; color:#aab9ce; font-size:.58rem; font-weight:800; letter-spacing:.08em; text-overflow:ellipsis; text-transform:uppercase; white-space:nowrap; }.profile-dialog__stats dd { margin:5px 0 0; color:#fff; font-size:.9rem; font-weight:800; }
@media (max-width:760px) { .header-actions>.button--auth,.account-menu { display:none; }.mobile-menu nav button { padding:10px; border:0; border-radius:9px; color:#d5dfec; background:transparent; cursor:pointer; font:inherit; font-size:.85rem; text-align:left; }.mobile-menu nav button:hover { background:var(--surface-light); }.auth-dialog,.profile-dialog { padding:24px 20px; }.profile-dialog__stats { grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* Keep the animation budget intentionally small: only cards currently on screen animate. */
#auth-trigger[hidden],#account-menu[hidden],button[data-open-auth][hidden] { display:none !important; }
[hidden] { display:none !important; }
.wallpaper-image img { animation:none; will-change:auto; transform:scale(1.025); }
.wallpaper-card.is-idle .wallpaper-image img { will-change:transform; animation:wallpaper-idle 30s linear infinite alternate; }
.spotlight-card>img,.featured-card__image { animation:spotlight-pan 32s linear infinite alternate; }
@keyframes wallpaper-idle { from { transform:translate3d(0,-.25%,0) scale(1.025); } to { transform:translate3d(0,.25%,0) scale(1.032); } }
@keyframes spotlight-pan { from { transform:translate3d(0,-.8%,0) scale(1.035); } to { transform:translate3d(0,.8%,0) scale(1.035); } }

.button--oauth { color:#f5f8ff; border-color:rgba(198,246,255,.38); background:linear-gradient(135deg,rgba(28,44,74,.94),rgba(10,20,39,.96)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }.button--oauth:hover { border-color:var(--cyan); background:linear-gradient(135deg,rgba(42,68,108,.96),rgba(15,31,61,.98)); }

/* Full profile page */
.profile-page { padding-top:48px; padding-bottom:96px; }.profile-hero { position:relative; display:flex; align-items:center; justify-content:space-between; min-height:330px; overflow:hidden; padding:32px; border:1px solid rgba(198,246,255,.25); border-radius:30px; background:radial-gradient(circle at 16% 18%,rgba(40,243,255,.16),transparent 24%),radial-gradient(circle at 85% 12%,rgba(155,92,255,.36),transparent 28%),linear-gradient(135deg,#111b36,#07101f 65%); box-shadow:var(--shadow); }.profile-hero__glow { position:absolute; inset:auto -8% -60% 32%; height:110%; border-radius:50%; background:conic-gradient(from 50deg,rgba(40,243,255,.3),rgba(155,92,255,.04),rgba(239,77,225,.25)); filter:blur(32px); }.profile-hero__identity,.profile-hero__power { position:relative; z-index:1; }.profile-hero__identity { display:flex; align-items:center; gap:20px; }.profile-hero__avatar { width:112px; height:112px; flex-basis:112px; border-width:3px; font-size:2rem; box-shadow:0 0 0 6px rgba(40,243,255,.1),0 0 44px rgba(40,243,255,.28); }.profile-hero h1 { margin:6px 0; font-size:clamp(2.45rem,5vw,4.6rem); letter-spacing:-.065em; }.profile-hero__identity>div>p:last-child { color:#b9c8dc; font-size:.86rem; text-transform:capitalize; }.profile-hero__power { display:grid; justify-items:end; gap:6px; }.profile-hero__power span { color:#b6c4d9; font-size:.7rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }.profile-hero__power strong { color:var(--cyan); font-size:clamp(1.8rem,3.4vw,3rem); letter-spacing:-.06em; text-shadow:0 0 24px rgba(40,243,255,.25); }
.profile-overview { margin-top:20px; }.profile-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }.profile-stats article { display:grid; gap:8px; min-height:120px; align-content:center; padding:20px; border:1px solid var(--line); border-radius:18px; background:linear-gradient(145deg,rgba(23,36,61,.7),rgba(8,18,37,.82)); }.profile-stats span { color:#aebdd2; font-size:.69rem; font-weight:800; letter-spacing:.09em; text-transform:uppercase; }.profile-stats strong { color:#fff; font-size:1.45rem; letter-spacing:-.04em; }.profile-wallpapers { padding-top:82px; }.profile-signed-out { max-width:590px; margin:110px auto; display:grid; justify-items:start; gap:18px; }.profile-signed-out h1 { font-size:clamp(2.5rem,6vw,4.5rem); letter-spacing:-.065em; }.profile-signed-out>p:not(.highlight-label) { max-width:460px; color:var(--muted); line-height:1.7; }
@media (max-width:760px) { .profile-page { padding-top:26px; padding-bottom:64px; }.profile-hero { min-height:360px; align-items:start; flex-direction:column; padding:24px; }.profile-hero__avatar { width:82px; height:82px; flex-basis:82px; font-size:1.5rem; }.profile-hero__identity { align-items:flex-start; gap:15px; }.profile-hero__power { justify-items:start; }.profile-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }.profile-wallpapers { padding-top:56px; } }

/* Current homepage and profile refinements */
.featured-card { opacity:1; transform-style:preserve-3d; transition:transform .32s ease,border-color .25s ease,box-shadow .25s ease; }.featured-card.is-flipping { pointer-events:none; will-change:transform; animation:featured-card-flip .76s cubic-bezier(.35,.02,.2,1) both; }
@keyframes featured-card-flip { 0% { transform:perspective(1100px) rotateY(0) scale(1); } 48% { transform:perspective(1100px) rotateY(90deg) scale(.965); } 52% { transform:perspective(1100px) rotateY(90deg) scale(.965); } 100% { transform:perspective(1100px) rotateY(0) scale(1); } }
.spotlight-card[role="button"],.featured-card[role="button"] { cursor:pointer; }
.spotlight-card[role="button"]:focus-visible,.featured-card[role="button"]:focus-visible { outline:2px solid var(--cyan); outline-offset:4px; }

.upload-trigger { position:relative; width:42px; height:42px; display:grid; place-items:center; overflow:hidden; padding:0; border:1px solid rgba(198,246,255,.28); border-radius:50%; background:linear-gradient(135deg,rgba(63,37,122,.82),rgba(10,80,116,.82)); box-shadow:0 0 18px rgba(74,218,255,.14); cursor:pointer; }.upload-trigger img,.upload-trigger span { position:absolute; width:20px; height:20px; object-fit:contain; transition:opacity .32s ease,transform .42s cubic-bezier(.2,.8,.2,1); }.upload-trigger span { display:grid; place-items:center; color:#fff; font-size:1.65rem; font-weight:300; }.upload-trigger:hover { border-color:var(--cyan); box-shadow:0 0 25px rgba(40,243,255,.35); }.upload-trigger:hover img { opacity:0; transform:rotate(-85deg) scale(.55); }.upload-trigger:hover span { transform:rotate(90deg) scale(1.1); }.upload-trigger:not(:hover) span { opacity:0; transform:rotate(-90deg) scale(.55); }.upload-trigger:focus-visible { outline:2px solid var(--cyan); outline-offset:3px; }
.upload-dialog { width:min(1040px,calc(100% - 28px)); max-width:none; max-height:calc(100dvh - 28px); overflow:auto; padding:34px; border:1px solid rgba(198,246,255,.25); border-radius:28px; color:var(--text); background:radial-gradient(circle at 8% 0,rgba(40,243,255,.1),transparent 28%),radial-gradient(circle at 100% 0,rgba(155,92,255,.18),transparent 34%),#071020; box-shadow:0 34px 100px rgba(0,0,0,.78); }.upload-dialog::backdrop { background:rgba(1,4,12,.8); backdrop-filter:blur(9px); }.upload-dialog__head { max-width:650px; margin-bottom:24px; }.upload-dialog__head h2 { margin:5px 0 9px; font-size:clamp(1.8rem,3vw,2.8rem); letter-spacing:-.055em; }.upload-dialog__head>p:last-child { color:var(--muted); line-height:1.6; }.upload-form { display:grid; gap:18px; }.upload-picker { display:grid; min-height:190px; place-items:center; border:1px dashed rgba(40,243,255,.45); border-radius:22px; background:rgba(10,23,46,.58); }.upload-picker button { display:grid; justify-items:center; gap:8px; color:#ddecff; background:transparent; border:0; cursor:pointer; font:inherit; }.upload-picker .material-symbols-rounded { color:var(--cyan); font-size:2.2rem; }.upload-picker small,.upload-crop>p,.upload-ai small,.upload-fields label>small { color:#9caec6; font-size:.72rem; }.upload-crop { display:grid; justify-items:center; gap:12px; }.upload-crop__stage { position:relative; width:min(270px,70vw); aspect-ratio:9/20; overflow:hidden; touch-action:none; border:2px solid var(--cyan); border-radius:20px; background:#030914; box-shadow:0 0 28px rgba(40,243,255,.22); cursor:grab; }.upload-crop__stage:active { cursor:grabbing; }.upload-crop__stage img { position:absolute; top:50%; left:50%; width:100%; height:100%; object-fit:cover; transform:translate(-50%,-50%) translate(var(--crop-x,0px),var(--crop-y,0px)) scale(var(--crop-scale,1)); transform-origin:center; pointer-events:none; }.upload-crop__grid { position:absolute; inset:0; pointer-events:none; background:linear-gradient(90deg,transparent 33%,rgba(255,255,255,.25) 33.4%,transparent 33.8%,transparent 66%,rgba(255,255,255,.25) 66.4%,transparent 66.8%),linear-gradient(0deg,transparent 33%,rgba(255,255,255,.25) 33.4%,transparent 33.8%,transparent 66%,rgba(255,255,255,.25) 66.4%,transparent 66.8%); }.upload-crop__controls { display:flex; align-items:center; gap:10px; }.upload-crop__controls button { width:34px; height:34px; border:1px solid var(--line); border-radius:50%; color:#eaffff; background:#0b1730; cursor:pointer; font-size:1.2rem; }.upload-crop__controls input { accent-color:var(--cyan); }.upload-status { min-height:1.2em; margin:0; color:#b6c8de; font-size:.82rem; }.upload-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }.upload-fields>label { display:grid; gap:7px; color:#c7d7ed; font-size:.75rem; font-weight:800; }.upload-fields input,.upload-fields textarea,.upload-fields select { width:100%; border:1px solid var(--line); border-radius:12px; color:#edf7ff; background:#091426; font:inherit; }.upload-fields input,.upload-fields select { min-height:43px; padding:0 12px; }.upload-fields textarea { padding:12px; resize:vertical; }.upload-fields>label:nth-of-type(2),.upload-fields>label:nth-of-type(4),.upload-ai,.upload-switches,.upload-submit { grid-column:1/-1; }.upload-ai { display:flex; align-items:center; gap:12px; padding:14px; border:1px solid rgba(155,92,255,.35); border-radius:15px; background:linear-gradient(110deg,rgba(86,57,185,.2),rgba(24,99,142,.13)); }.upload-ai>.material-symbols-rounded { color:#d584ff; }.upload-ai div { display:grid; gap:3px; flex:1; }.upload-ai button { border:0; color:var(--cyan); background:transparent; cursor:pointer; font:inherit; font-size:.75rem; font-weight:800; }.upload-tags { display:flex; flex-wrap:wrap; gap:6px; min-height:0; }.upload-tags button { display:flex; align-items:center; gap:5px; border:1px solid rgba(40,243,255,.28); border-radius:999px; color:#dbf8ff; background:rgba(25,91,122,.22); cursor:pointer; font:inherit; font-size:.68rem; padding:5px 8px; }.upload-fields label:has(.upload-tags) { grid-column:1/-1; }.upload-switches { display:flex; flex-wrap:wrap; gap:18px; }.upload-switches label { display:flex; align-items:center; gap:8px; color:#cfdaec; font-size:.78rem; }.upload-switches input { width:17px; height:17px; accent-color:var(--cyan); }.upload-switches small { display:block; color:#91a5bf; }.upload-submit { justify-self:start; min-width:220px; }.upload-dialog[aria-busy="true"] .upload-submit { opacity:.65; pointer-events:none; }
@media (max-width:650px) { .upload-dialog { width:calc(100% - 16px); max-height:calc(100dvh - 16px); padding:24px 16px; border-radius:22px; }.upload-fields { grid-template-columns:1fr; }.upload-fields>label:nth-of-type(2),.upload-fields>label:nth-of-type(4),.upload-ai,.upload-switches,.upload-submit { grid-column:auto; }.upload-ai { align-items:flex-start; }.upload-trigger { width:36px; height:36px; }.upload-trigger img,.upload-trigger span { width:17px; height:17px; } }
.upload-trigger img { filter:brightness(0) invert(1); }

/* 20% taller wallpaper cards: 9/14 × 1.2 = 15/28. */
.wallpaper-image,.collectible-card,.creator-dialog-card { aspect-ratio:15/28; }

/* An additional 10% vertical lift for every wallpaper-card surface. */
.wallpaper-image,.collectible-card,.creator-dialog-card { aspect-ratio:75/154; }

@keyframes wallverse-upload-cycle { 0%,42% { opacity:1; transform:rotate(0deg) scale(1); } 50%,100% { opacity:0; transform:rotate(110deg) scale(.58); } }
@keyframes wallverse-upload-cycle-plus { 0%,42% { opacity:0; transform:rotate(-110deg) scale(.58); } 50%,88% { opacity:1; transform:rotate(0deg) scale(1.04); } 100% { opacity:0; transform:rotate(110deg) scale(.58); } }
.upload-trigger img,.upload-trigger:hover img { opacity:1; animation:wallverse-upload-cycle 3.1s cubic-bezier(.65,0,.35,1) infinite; transform:none; }.upload-trigger span,.upload-trigger:hover span { opacity:0; animation:wallverse-upload-cycle-plus 3.1s cubic-bezier(.65,0,.35,1) infinite; transform:none; }.upload-trigger:hover { transform:translateY(-2px) scale(1.06); border-color:var(--cyan); box-shadow:0 0 28px rgba(40,243,255,.45),0 0 48px rgba(155,92,255,.18); }.upload-trigger:hover::after { position:absolute; inset:3px; border:1px solid rgba(255,255,255,.32); border-radius:50%; animation:wallverse-upload-orbit .9s linear infinite; content:''; }@keyframes wallverse-upload-orbit { to { transform:rotate(1turn); } }

@keyframes wallverse-brand-pulse { 0%,100% { filter:drop-shadow(0 0 0 rgba(40,243,255,0)); transform:translateZ(0) rotate(0deg); } 45% { filter:drop-shadow(0 0 10px rgba(40,243,255,.4)) drop-shadow(0 0 18px rgba(155,92,255,.24)); transform:translateZ(0) rotate(-2deg) scale(1.045); } 70% { transform:translateZ(0) rotate(1.5deg) scale(1.015); } }
@keyframes wallverse-brand-scan { 0%,72%,100% { opacity:0; transform:translateX(-135%) skewX(-18deg); } 82% { opacity:.72; } 94% { opacity:0; transform:translateX(175%) skewX(-18deg); } }
.site-header .brand { position:relative; isolation:isolate; padding:6px 9px 6px 3px; border-radius:14px; transition:transform .24s ease,background .24s ease; }.site-header .brand::before { position:absolute; z-index:-1; inset:2px; border:1px solid rgba(40,243,255,.12); border-radius:12px; background:linear-gradient(115deg,rgba(155,92,255,.1),transparent 45%,rgba(40,243,255,.08)); box-shadow:inset 0 0 18px rgba(83,122,255,.08); content:''; opacity:.7; transition:opacity .24s ease,transform .24s ease; }.site-header .brand::after { position:absolute; z-index:-1; top:4px; bottom:4px; left:0; width:30%; border-radius:9px; background:linear-gradient(90deg,transparent,rgba(217,252,255,.75),transparent); content:''; animation:wallverse-brand-scan 6s ease-in-out infinite; pointer-events:none; }.site-header .brand img { animation:wallverse-brand-pulse 4.2s ease-in-out infinite; }.site-header .brand:hover,.site-header .brand:focus-visible { outline:0; transform:translateY(-2px) scale(1.035); background:rgba(16,32,61,.46); }.site-header .brand:hover::before,.site-header .brand:focus-visible::before { opacity:1; transform:scale(1.06); border-color:rgba(40,243,255,.34); }.site-header .brand:hover img,.site-header .brand:focus-visible img { animation-duration:1.15s; filter:drop-shadow(0 0 12px rgba(40,243,255,.7)) drop-shadow(0 0 24px rgba(222,104,255,.45)); }.site-header .brand:hover span,.site-header .brand:focus-visible span { color:#fff; text-shadow:0 0 14px rgba(40,243,255,.55); }
@media (prefers-reduced-motion:reduce) { .upload-trigger img,.upload-trigger span,.site-header .brand img,.site-header .brand::after { animation:none !important; }.site-header .brand,.upload-trigger { transition:none; } }
.wallpaper-card.is-idle .wallpaper-image img { animation-duration:18s; }.spotlight-card>img,.featured-card__image { animation-duration:18s; }
#profile-sign-in[hidden],#profile-sign-out[hidden] { display:none !important; }
.profile-page { padding-top:34px; }.profile-hero { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr); min-height:250px; padding:0; gap:0; background:#0b1427; }.profile-hero__visual { position:relative; isolation:isolate; min-height:250px; overflow:hidden; padding:28px; border-radius:29px 0 0 29px; background:radial-gradient(circle at 12% 12%,rgba(40,243,255,.17),transparent 37%),linear-gradient(135deg,#102644,#0a1429); }.profile-hero__visual>img { position:absolute; inset:0; z-index:-2; width:100%; height:100%; object-fit:cover; }.profile-hero__visual-shade { position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(5,10,23,.78),rgba(5,10,23,.42)),linear-gradient(0deg,rgba(5,10,23,.5),transparent 70%); }.profile-hero__identity { height:100%; align-items:center; }.profile-hero__metrics { display:grid; align-content:center; gap:20px; padding:28px; border-left:1px solid rgba(198,246,255,.16); background:radial-gradient(circle at 100% 100%,rgba(155,92,255,.25),transparent 64%),linear-gradient(145deg,#101d35,#091324); }.profile-hero__power { justify-items:start; gap:4px; padding:13px 15px; border:1px solid rgba(40,243,255,.24); border-radius:16px; background:rgba(4,12,28,.48); }.profile-hero__power strong { font-size:clamp(1.55rem,2.5vw,2.25rem); }.profile-stats { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }.profile-stats article { min-height:78px; padding:13px; border-radius:14px; }.profile-stats strong { font-size:1.16rem; }
@media (max-width:760px) { .profile-hero { grid-template-columns:1fr; }.profile-hero__visual { min-height:240px; border-radius:29px 29px 0 0; }.profile-hero__metrics { border-top:1px solid rgba(198,246,255,.16); border-left:0; }.profile-hero__power { justify-items:start; } }

/* Collectible cards — web adaptation of Card Inspection */
img { -webkit-user-drag:none; user-select:none; }
#profile-wallpaper-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px 20px; perspective:1200px; }
.collectible-card { --tier:#d8deef; --accent:#8290a7; --card-rx:0deg; --card-ry:0deg; --light-x:28%; --light-y:18%; position:relative; isolation:isolate; aspect-ratio:9/14; padding:8px; border:1.5px solid transparent; border-radius:30px; background:linear-gradient(145deg,rgba(255,255,255,.16),rgba(5,10,22,.92)) padding-box,linear-gradient(145deg,rgba(255,255,255,.32),color-mix(in srgb,var(--tier) 62%,transparent),rgba(4,10,22,.9)) border-box; box-shadow:0 22px 38px rgba(0,0,0,.34),0 0 0 1px color-mix(in srgb,var(--tier) 12%,transparent),0 0 24px color-mix(in srgb,var(--tier) 13%,transparent); transform:perspective(900px) rotateX(var(--card-rx)) rotateY(var(--card-ry)) translateZ(0); transform-style:preserve-3d; transition:transform .18s ease-out,box-shadow .25s ease,border-color .25s ease; }
.collectible-card:hover { z-index:2; box-shadow:0 30px 58px rgba(0,0,0,.5),0 0 0 1px color-mix(in srgb,var(--tier) 34%,transparent),0 0 38px color-mix(in srgb,var(--tier) 30%,transparent); }
.collectible-card::before { position:absolute; z-index:-1; inset:-7px; border:1px solid color-mix(in srgb,var(--tier) 28%,transparent); border-radius:36px; background:radial-gradient(circle at 18% 8%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 42%),linear-gradient(145deg,rgba(255,255,255,.06),color-mix(in srgb,var(--tier) 8%,#050812)); box-shadow:inset 0 0 18px rgba(255,255,255,.035); content:''; }
.collectible-card__media { position:relative; height:100%; overflow:hidden; border:1px solid rgba(255,255,255,.2); border-radius:22px; background:#0c1528; transform:translateZ(1px); }
.collectible-card__media--unavailable::before { position:absolute; inset:0; display:grid; place-items:center; color:var(--muted); content:'Image unavailable'; font-size:.75rem; }
.collectible-card__image { width:100%; height:100%; object-fit:cover; transform:scale(1.035); will-change:transform; }
.collectible-card.is-visible .collectible-card__image { animation:collectible-image-idle 14s ease-in-out infinite alternate; }
.collectible-card__surface { position:absolute; inset:0; background:linear-gradient(180deg,rgba(255,255,255,.08),transparent 40%,rgba(0,0,0,.78) 100%); }
.collectible-card__surface::before { position:absolute; inset:0; background:radial-gradient(circle at var(--light-x) var(--light-y),rgba(255,255,255,.35),color-mix(in srgb,var(--tier) 13%,transparent) 22%,transparent 48%); content:''; opacity:.68; transition:opacity .2s ease; mix-blend-mode:screen; }
.collectible-card__shine { position:absolute; top:-36%; bottom:-30%; left:-42%; width:55%; transform:rotate(-20deg); background:linear-gradient(90deg,transparent,rgba(255,255,255,.24),rgba(255,255,255,.06),transparent); opacity:.46; pointer-events:none; }
.collectible-card:hover .collectible-card__shine { animation:collectible-shine 1.15s ease-out; }
.collectible-card__info { position:absolute; right:14px; bottom:15px; left:14px; display:grid; gap:9px; color:#fff; text-shadow:0 2px 10px rgba(0,0,0,.95); }
.collectible-card__info h3 { overflow:hidden; font-size:clamp(.9rem,1.35vw,1.12rem); font-weight:900; line-height:1.16; letter-spacing:-.025em; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.collectible-card__stats { display:grid; grid-template-columns:repeat(3,max-content); align-items:center; gap:9px; font-size:.72rem; font-weight:800; }
.collectible-card__stat { display:inline-flex; align-items:center; gap:4px; }.collectible-card__stat-icon { color:var(--accent); font-size:.96rem; line-height:1; filter:drop-shadow(0 0 7px color-mix(in srgb,var(--accent) 60%,transparent)); }.collectible-card__stat--likes .collectible-card__stat-icon { color:#5ef6ff; }
.tier--uncommon { --tier:#47d764; --accent:#91f2a4; }.tier--rare { --tier:#3f9bff; --accent:#28f3ff; }.tier--epic { --tier:#9b5cff; --accent:#b45bff; }.tier--legendary { --tier:#ffa629; --accent:#ffd166; }.tier--mythic { --tier:#ff70f8; --accent:#28f3ff; }
.tier--epic.is-visible,.tier--legendary.is-visible,.tier--mythic.is-visible,.is-polished.is-visible { animation:collectible-breathe 3.8s ease-in-out infinite; }
.tier--legendary::before { background:radial-gradient(circle at 18% 8%,rgba(255,209,102,.22),transparent 40%),linear-gradient(145deg,rgba(255,166,41,.12),#080d19); }.tier--mythic::before { background:radial-gradient(circle at 18% 8%,rgba(40,243,255,.19),transparent 38%),radial-gradient(circle at 88% 82%,rgba(255,112,248,.2),transparent 44%),#080d19; }
.frame--neonrounded { padding:11px; box-shadow:0 24px 52px rgba(0,0,0,.46),0 0 28px color-mix(in srgb,var(--tier) 48%,transparent),0 0 52px color-mix(in srgb,var(--accent) 22%,transparent); }.frame--neonrounded::before { inset:-8px; border-width:2px; }
.frame--neongradient { padding:11px; background:linear-gradient(#07101f,#07101f) padding-box,conic-gradient(from var(--frame-angle),var(--tier),var(--accent),#28f3ff,#9b5cff,var(--tier)) border-box; animation:frame-gradient-spin 4.2s linear infinite; }
.frame--cyberpunk { border-radius:0; clip-path:polygon(9% 0,100% 0,100% 91%,91% 100%,0 100%,0 9%); }.frame--cyberpunk::before,.frame--cyberpunk .collectible-card__media { border-radius:0; clip-path:inherit; }
.frame--electric { filter:drop-shadow(0 0 10px color-mix(in srgb,var(--accent) 48%,transparent)); }.frame--electric::before { inset:-9px; border:2px solid var(--tier); box-shadow:0 0 10px var(--tier),inset 0 0 14px color-mix(in srgb,var(--accent) 32%,transparent); animation:electric-frame 1.8s steps(2,end) infinite; }
.is-polished::after { position:absolute; z-index:4; inset:8px; overflow:hidden; border-radius:22px; background:linear-gradient(112deg,transparent 28%,rgba(255,255,255,.5) 46%,color-mix(in srgb,var(--accent) 28%,transparent) 52%,transparent 69%); background-size:240% 100%; content:''; pointer-events:none; mix-blend-mode:screen; animation:polish-sweep 3.4s ease-in-out infinite; }
@property --frame-angle { syntax:'<angle>'; initial-value:0deg; inherits:false; }
@keyframes frame-gradient-spin { to { --frame-angle:360deg; } }
@keyframes collectible-image-idle { from { transform:scale(1.035) translate3d(0,-.65%,0); } to { transform:scale(1.055) translate3d(0,.65%,0); } }
@keyframes collectible-shine { 0% { transform:translateX(0) rotate(-20deg); opacity:0; } 24% { opacity:.7; } 100% { transform:translateX(310%) rotate(-20deg); opacity:0; } }
@keyframes collectible-breathe { 0%,100% { box-shadow:0 22px 42px rgba(0,0,0,.4),0 0 22px color-mix(in srgb,var(--tier) 20%,transparent); } 50% { box-shadow:0 27px 54px rgba(0,0,0,.48),0 0 42px color-mix(in srgb,var(--tier) 48%,transparent),0 0 68px color-mix(in srgb,var(--accent) 22%,transparent); } }
@keyframes polish-sweep { 0%,20% { background-position:180% 0; opacity:0; } 38% { opacity:.72; } 62%,100% { background-position:-70% 0; opacity:0; } }
@keyframes electric-frame { 0%,100% { opacity:.82; transform:translate(0); } 33% { opacity:1; transform:translate(.5px,-.5px); } 66% { opacity:.88; transform:translate(-.5px,.5px); } }
@media (max-width:1050px) { #profile-wallpaper-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:760px) { #profile-wallpaper-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 14px; }.collectible-card { padding:6px; border-radius:24px; }.collectible-card::before { inset:-5px; border-radius:29px; }.collectible-card__media { border-radius:18px; }.collectible-card__info { right:10px; bottom:11px; left:10px; }.collectible-card__stats { gap:6px; font-size:.64rem; } }
@media (max-width:340px) { #profile-wallpaper-grid { grid-template-columns:1fr; } }
@media (prefers-reduced-motion:reduce) { .collectible-card,.collectible-card__image,.collectible-card__shine,.is-polished::after,.frame--neongradient,.frame--electric::before { animation:none !important; transition:none !important; } }

/* Public feed: the same Card Inspection language, with compact creator details. */
#wallpaper-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px 20px; perspective:1200px; }
.collectible-card--public { min-width:0; }
.collectible-card,.spotlight-card,.featured-card { color:inherit; text-decoration:none; }
.wallpaper-route-not-found { position:fixed; z-index:90; top:50%; left:50%; display:grid; justify-items:center; gap:12px; width:min(420px,calc(100% - 32px)); padding:28px; border:1px solid rgba(40,243,255,.34); border-radius:22px; color:var(--text); background:radial-gradient(circle at 10% 0,rgba(40,243,255,.13),transparent 38%),#091326; box-shadow:0 28px 80px rgba(0,0,0,.65); text-align:center; transform:translate(-50%,-50%); }.wallpaper-route-not-found strong { font-size:1.25rem; }.wallpaper-route-not-found span { color:var(--muted); font-size:.84rem; line-height:1.55; }
.ad-card { position:relative; isolation:isolate; display:grid; grid-template-rows:auto minmax(0,1fr); min-width:0; aspect-ratio:75/131; overflow:hidden; padding:13px; border:1.5px solid rgba(122,156,202,.26); border-radius:30px; background:radial-gradient(circle at 22% 8%,rgba(40,243,255,.1),transparent 31%),radial-gradient(circle at 88% 91%,rgba(155,92,255,.12),transparent 42%),linear-gradient(145deg,rgba(18,34,61,.92),rgba(5,11,24,.98)); box-shadow:0 22px 38px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.06),0 0 20px rgba(40,243,255,.06); }
.ad-card::before { position:absolute; z-index:-1; inset:7px; border:1px solid rgba(198,246,255,.1); border-radius:21px; content:''; pointer-events:none; }
.ad-card__label { justify-self:start; margin:1px 1px 10px; padding:4px 7px; border:1px solid rgba(198,246,255,.18); border-radius:999px; color:#b7c5d8; background:rgba(5,12,27,.7); font-size:.58rem; font-weight:900; letter-spacing:.08em; line-height:1; text-transform:uppercase; }
.ad-card .adsbygoogle { align-self:stretch; width:100%; min-width:0; overflow:hidden; border-radius:15px; }
.ad-card .adsbygoogle[data-ad-status="unfilled"] { display:none !important; }
.ad-card--wide { grid-template-columns:auto minmax(0,1fr); grid-template-rows:1fr; min-height:116px; aspect-ratio:auto; border-radius:18px; }.ad-card--wide .ad-card__label { align-self:start; margin:1px 13px 1px 1px; }.ad-card--wide .adsbygoogle { min-height:82px; }.creators-ranking .ad-card--wide { grid-column:1/-1; }
@media (max-width:760px) { .ad-card { padding:10px; border-radius:24px; }.ad-card::before { inset:5px; border-radius:18px; }.ad-card__label { margin-bottom:7px; }.ad-card .adsbygoogle { border-radius:13px; } }
@media (max-width:560px) { .ad-card--wide { grid-template-columns:1fr; grid-template-rows:auto minmax(0,1fr); min-height:160px; border-radius:18px; }.ad-card--wide .ad-card__label { margin:1px 1px 7px; }.ad-card--wide .adsbygoogle { min-height:104px; } }
@media (prefers-reduced-motion:reduce) { .ad-card { transition:none; } }
.collectible-card__badges { position:absolute; z-index:3; top:11px; left:11px; display:flex; flex-wrap:wrap; gap:6px; max-width:calc(100% - 22px); }
.collectible-card__badges .pill,.collectible-card__badges .tag { padding:5px 7px; border:1px solid rgba(255,255,255,.22); border-radius:999px; color:#f7fbff; background:rgba(5,12,26,.7); box-shadow:0 5px 14px rgba(0,0,0,.28); font-size:.59rem; font-weight:900; letter-spacing:.06em; text-transform:uppercase; backdrop-filter:blur(8px); }
.collectible-card__badges .tag { color:#bdeff4; }
.collectible-card__creator { display:flex; align-items:center; gap:6px; min-width:0; color:#edf6ff; font-size:.66rem; font-weight:800; text-shadow:0 2px 10px rgba(0,0,0,.95); }
.collectible-card__creator .avatar { width:21px; height:21px; flex-basis:21px; font-size:.58rem; border-width:1px; }.collectible-card__creator strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.collectible-card--public .collectible-card__info { gap:6px; }.collectible-card--public .collectible-card__stats { gap:8px; font-size:.66rem; }

/* Collection discovery controls */
.collection-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:2px 0 20px; }
.collection-search { display:flex; flex:1 1 255px; align-items:center; gap:9px; min-height:43px; padding:0 13px; border:1px solid var(--line); border-radius:13px; color:var(--cyan); background:rgba(8,18,37,.64); }.collection-search input { width:100%; min-width:0; border:0; outline:0; color:var(--text); background:transparent; font:inherit; font-size:.82rem; }.collection-search input::placeholder { color:#8391aa; }
.collection-sort { display:flex; padding:3px; border:1px solid var(--line); border-radius:13px; background:rgba(8,18,37,.64); }.collection-sort__button { min-height:35px; padding:0 11px; border:0; border-radius:9px; color:#aebbd0; background:transparent; cursor:pointer; font:inherit; font-size:.72rem; font-weight:800; }.collection-sort__button.is-active { color:#061424; background:linear-gradient(135deg,var(--cyan),#7eb7ff); box-shadow:0 5px 14px rgba(40,243,255,.16); }
.collection-filter { display:flex; align-items:center; gap:7px; min-height:43px; padding:0 10px; border:1px solid var(--line); border-radius:13px; color:#9eafc6; background:rgba(8,18,37,.64); font-size:.67rem; font-weight:900; letter-spacing:.05em; text-transform:uppercase; }.collection-filter select { min-width:108px; border:0; outline:0; color:#e6eef9; background:#101d33; font:inherit; font-size:.72rem; font-weight:700; text-transform:none; }
.native-select--hidden { position:absolute; width:1px; height:1px; overflow:hidden; opacity:0; pointer-events:none; }.custom-select { position:relative; min-width:108px; }.custom-select__trigger { display:flex; align-items:center; justify-content:space-between; width:100%; gap:12px; border:0; color:#e6eef9; background:transparent; cursor:pointer; font:inherit; font-size:.72rem; font-weight:700; text-transform:none; }.custom-select__trigger::after { width:8px; height:8px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; content:''; transform:translateY(-2px) rotate(45deg); }.custom-select__trigger[aria-expanded="true"]::after { transform:translateY(2px) rotate(225deg); }.custom-select__menu { position:absolute; z-index:60; top:calc(100% + 12px); right:-11px; display:grid; min-width:max(100%,172px); padding:6px; border:1px solid rgba(198,246,255,.24); border-radius:13px; background:#10203a; box-shadow:0 18px 42px rgba(0,0,0,.5); }.custom-select__menu button { min-height:35px; padding:8px 10px; border:0; border-radius:8px; color:#edf4ff; background:transparent; cursor:pointer; font:inherit; font-size:.78rem; text-align:left; }.custom-select__menu button:hover,.custom-select__menu button:focus-visible,.custom-select__menu button.is-selected { outline:0; color:#fff; background:linear-gradient(135deg,rgba(111,74,255,.7),rgba(39,139,255,.75)); }
.collection-toggle { display:inline-flex; align-items:center; gap:8px; min-height:43px; padding:0 11px; border:1px solid var(--line); border-radius:13px; color:#b9c8dd; background:rgba(8,18,37,.64); cursor:pointer; font-size:.7rem; font-weight:800; }.collection-toggle input { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; }.collection-toggle__track { position:relative; width:32px; height:18px; border-radius:999px; background:#33425d; box-shadow:inset 0 0 0 1px rgba(255,255,255,.1); transition:background .2s ease; }.collection-toggle__track::after { position:absolute; top:3px; left:3px; width:12px; height:12px; border-radius:50%; background:#e7effa; box-shadow:0 1px 4px rgba(0,0,0,.4); content:''; transition:transform .2s ease; }.collection-toggle input:checked + .collection-toggle__track { background:linear-gradient(90deg,#8f5cff,var(--cyan)); }.collection-toggle input:checked + .collection-toggle__track::after { transform:translateX(14px); }.collection-toggle input:focus-visible + .collection-toggle__track { outline:2px solid var(--cyan); outline-offset:3px; }.collection-toggle input:disabled + .collection-toggle__track { opacity:.55; }
.button--small { color:#e9f7ff; }.nav a { display:inline-block; transform-origin:center; transition:color .18s ease,transform .18s ease,text-shadow .18s ease; }.nav a:hover,.nav a:focus-visible { color:#fff; outline:0; text-shadow:0 6px 15px rgba(40,243,255,.32); transform:translateY(-2px) scale(1.055); }.search-visual--trigger { width:42px; justify-content:center; padding:9px; appearance:none; cursor:pointer; font:inherit; text-align:left; transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease,background .18s ease; }.search-visual--trigger:hover,.search-visual--trigger:focus-visible { border-color:rgba(40,243,255,.5); outline:0; background:rgba(13,32,60,.8); box-shadow:0 8px 24px rgba(0,0,0,.22),0 0 18px rgba(40,243,255,.09); transform:translateY(-1px); }.material-symbols-rounded { font-family:'Material Symbols Rounded'; font-weight:normal; font-style:normal; font-size:1.05em; line-height:1; letter-spacing:normal; text-transform:none; white-space:nowrap; word-wrap:normal; direction:ltr; -webkit-font-feature-settings:'liga'; -webkit-font-smoothing:antialiased; font-feature-settings:'liga'; }.search-visual--trigger .material-symbols-rounded { color:var(--cyan); font-size:1.2rem; }.collectible-card__stat-icon.material-symbols-rounded { font-size:1.05rem; }.creator-spotlight__profile { justify-content:space-between; }.creator-spotlight__profile>div { min-width:0; }.creator-follow { flex:0 0 auto; min-height:35px; padding:8px 12px; border:1px solid rgba(40,243,255,.52); border-radius:999px; color:#e9fcff; background:linear-gradient(135deg,rgba(155,92,255,.48),rgba(40,243,255,.28)); box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 7px 20px rgba(40,243,255,.12); cursor:pointer; font:inherit; font-size:.69rem; font-weight:900; letter-spacing:.02em; transition:transform .18s ease,box-shadow .18s ease,background .18s ease; }.creator-follow:hover:not(:disabled),.creator-follow:focus-visible { outline:0; transform:translateY(-2px) scale(1.03); background:linear-gradient(135deg,#915bff,#24dff0); box-shadow:0 11px 26px rgba(40,243,255,.22); }.creator-follow.is-following { border-color:rgba(198,246,255,.28); color:#c6d5e8; background:rgba(6,15,32,.66); box-shadow:none; }.creator-follow:disabled { cursor:wait; opacity:.68; }
.feed-suggestive-toggle { position:relative; }.feed-suggestive-toggle[data-tooltip]::after { position:absolute; z-index:30; bottom:calc(100% + 10px); left:50%; width:max-content; max-width:220px; padding:8px 10px; border:1px solid rgba(40,243,255,.28); border-radius:9px; color:#d9f8ff; background:#0b1930; box-shadow:0 10px 28px rgba(0,0,0,.38); content:attr(data-tooltip); font-size:.68rem; font-weight:700; line-height:1.35; letter-spacing:normal; opacity:0; pointer-events:none; text-align:center; text-transform:none; transform:translate(-50%,5px); transition:opacity .16s ease,transform .16s ease; }.feed-suggestive-toggle[data-tooltip]:hover::after,.feed-suggestive-toggle[data-tooltip]:focus-within::after { opacity:1; transform:translate(-50%,0); }
#profile-wallpapers-status { margin:0 0 16px; color:var(--muted); font-size:.78rem; }
@media (max-width:1050px) { #wallpaper-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:760px) { #wallpaper-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 14px; }.collectible-card__badges { top:9px; left:9px; }.collectible-card__badges .tag { display:none; }.collection-toolbar { display:grid; grid-template-columns:1fr 1fr; }.collection-search,.collection-sort { grid-column:1/-1; }.collection-filter { min-width:0; }.collection-filter select { min-width:0; width:100%; } }
@media (max-width:760px) { .custom-select { min-width:0; width:100%; } }
@media (max-width:340px) { #wallpaper-grid { grid-template-columns:1fr; }.collection-toolbar { grid-template-columns:1fr; }.collection-filter { grid-column:1; } }

/* Interactive public cards and Card Inspection */
.collectible-card--public { cursor:pointer; outline:none; }.collectible-card--public:focus-visible { box-shadow:0 0 0 3px #050812,0 0 0 5px var(--cyan),0 28px 58px rgba(0,0,0,.5); }.collectible-card--public:hover { transform:perspective(900px) rotateX(var(--card-rx)) rotateY(var(--card-ry)) translate3d(0,-7px,10px); }
.inspection-dialog { width:min(1120px,calc(100% - 30px)); max-width:none; max-height:calc(100dvh - 30px); margin:auto; padding:0; overflow:hidden; border:1px solid rgba(198,246,255,.24); border-radius:28px; color:var(--text); background:radial-gradient(circle at 10% 8%,rgba(40,243,255,.1),transparent 31%),radial-gradient(circle at 95% 4%,rgba(155,92,255,.19),transparent 28%),#070e1c; box-shadow:0 35px 110px rgba(0,0,0,.82),0 0 44px rgba(40,243,255,.09); }.inspection-dialog::backdrop { background:rgba(1,4,12,.82); backdrop-filter:blur(11px); }.inspection-dialog__close { z-index:12; position:fixed; }
.inspection-layout { display:grid; grid-template-columns:minmax(300px,.82fr) minmax(390px,1.18fr); min-height:min(760px,calc(100dvh - 32px)); }.inspection-stage { position:relative; display:grid; place-items:center; align-content:center; gap:19px; min-width:0; padding:46px 44px 36px; background:radial-gradient(circle at 50% 42%,color-mix(in srgb,var(--tier,#9b5cff) 23%,transparent),transparent 53%),linear-gradient(145deg,rgba(13,29,51,.92),rgba(5,10,21,.96)); perspective:1200px; }.inspection-card { width:min(350px,100%); max-height:65dvh; margin:auto; cursor:default; }.inspection-card .collectible-card__info h2 { font-size:clamp(1.1rem,2vw,1.5rem); line-height:1.12; }.inspection-rarity { color:var(--cyan); font-size:.69rem; font-weight:900; letter-spacing:.16em; text-transform:uppercase; }
.inspection-details { min-width:0; overflow:auto; padding:54px 42px 38px; scrollbar-color:rgba(40,243,255,.36) transparent; }.inspection-owner { display:flex; align-items:center; gap:13px; margin-bottom:20px; }.inspection-owner>.avatar { width:54px; height:54px; flex-basis:54px; box-shadow:0 0 0 4px rgba(40,243,255,.08); }.inspection-owner>div { display:grid; gap:3px; }.inspection-owner span { color:#8fa1ba; font-size:.66rem; font-weight:800; letter-spacing:.09em; text-transform:uppercase; }.inspection-owner strong { font-size:1.05rem; }.inspection-description { margin:0 0 18px; color:#b8c5d8; font-size:.86rem; line-height:1.65; }.inspection-tags { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:20px; }.inspection-tags span,.inspection-tag { padding:6px 9px; border:1px solid rgba(40,243,255,.19); border-radius:999px; color:#b9f6fb; background:rgba(40,243,255,.06); font:inherit; font-size:.63rem; font-weight:800; }.inspection-tag { cursor:pointer; transition:border-color .16s ease,background .16s ease,transform .16s ease; }.inspection-tag:hover,.inspection-tag:focus-visible { border-color:rgba(40,243,255,.66); background:rgba(40,243,255,.14); outline:0; transform:translateY(-1px); }
.inspection-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin:0 0 20px; }.inspection-facts div { min-width:0; padding:11px; border:1px solid var(--line); border-radius:13px; background:rgba(7,17,35,.66); }.inspection-facts dt { color:#8798b1; font-size:.58rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }.inspection-facts dd { overflow:hidden; margin:5px 0 0; color:#eef5ff; font-size:.76rem; font-weight:800; text-overflow:ellipsis; white-space:nowrap; text-transform:capitalize; }
.inspection-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }.inspection-action { position:relative; display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto; align-items:center; column-gap:8px; min-height:62px; padding:10px 12px; overflow:visible; border:1px solid rgba(198,246,255,.19); border-radius:15px; color:#edf5ff; background:linear-gradient(145deg,rgba(24,39,66,.86),rgba(8,17,34,.92)); cursor:pointer; font:inherit; text-align:left; transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease; }.inspection-action:hover:not(:disabled) { transform:translateY(-2px); border-color:rgba(40,243,255,.48); box-shadow:0 10px 25px rgba(0,0,0,.28),0 0 18px rgba(40,243,255,.08); }.inspection-action>span { grid-row:1/-1; color:var(--cyan); font-size:1.2rem; filter:drop-shadow(0 0 8px rgba(40,243,255,.35)); }.inspection-action strong { font-size:.73rem; }.inspection-action small { color:#8fa1ba; font-size:.6rem; }.inspection-action.is-active { border-color:rgba(40,243,255,.62); background:linear-gradient(145deg,rgba(20,75,100,.76),rgba(36,26,84,.82)); box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 24px rgba(40,243,255,.12); }.inspection-action--like.is-active>span { color:#ff5e9c; filter:drop-shadow(0 0 11px rgba(255,94,156,.75)); }.inspection-action--download:disabled { cursor:not-allowed; opacity:.58; }.inspection-message { min-height:20px; margin:10px 2px 0; color:#aeeff5; font-size:.72rem; }
.download-ad-dialog { width:min(450px,calc(100% - 28px)); margin:auto; padding:0; overflow:hidden; border:1px solid rgba(40,243,255,.36); border-radius:24px; color:var(--text); background:radial-gradient(circle at 12% 0,rgba(40,243,255,.16),transparent 34%),radial-gradient(circle at 92% 12%,rgba(155,92,255,.24),transparent 38%),#081226; box-shadow:0 30px 90px rgba(0,0,0,.75),0 0 40px rgba(40,243,255,.12); }.download-ad-dialog::backdrop { background:rgba(1,4,12,.78); backdrop-filter:blur(9px); }.download-ad-dialog__close { position:absolute; z-index:2; top:13px; right:13px; }.download-ad-dialog__body { display:grid; gap:14px; padding:31px; }.download-ad-dialog h2 { margin:2px 0 0; font-size:clamp(1.55rem,4vw,2rem); letter-spacing:-.05em; }.download-ad-dialog__body>p:not(.highlight-label):not(.download-ad-dialog__status) { margin:0; color:var(--muted); line-height:1.55; }.download-ad-dialog__ad { display:grid; gap:8px; min-height:164px; padding:12px; border:1px solid rgba(198,246,255,.15); border-radius:16px; background:rgba(4,11,25,.58); }.download-ad-dialog__ad>span { color:#9dacc2; font-size:.58rem; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }.download-ad-dialog__ad .adsbygoogle { display:block; width:100%; min-height:116px; overflow:hidden; border-radius:10px; }.download-ad-dialog__status { min-height:20px; margin:0; color:#b9eff5; font-size:.76rem; font-weight:800; }.download-ad-dialog__actions { display:flex; align-items:center; justify-content:flex-end; gap:12px; }.download-ad-dialog__actions .button { min-width:144px; }.download-ad-dialog__actions .button:disabled { cursor:not-allowed; opacity:.55; }
.inspection-action--like.is-celebrating { animation:like-heart-pop .68s cubic-bezier(.2,1.65,.35,1); }.like-particle { position:absolute; z-index:5; top:50%; left:25%; color:#ff69b1; font-size:.82rem; font-style:normal; pointer-events:none; text-shadow:0 0 9px currentColor; animation:like-particle-burst .85s ease-out forwards; }
.inspection-comments { margin-top:16px; padding-top:18px; border-top:1px solid var(--line); }.inspection-comments__head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }.inspection-comments__head h3 { font-size:1rem; }.inspection-comments__head span { color:#8ea0b9; font-size:.72rem; }.inspection-comment-list { display:grid; gap:9px; max-height:210px; overflow:auto; padding-right:4px; }.inspection-comment-list>p { color:#8fa1ba; font-size:.76rem; }.inspection-comment { display:flex; align-items:flex-start; gap:9px; padding:10px; border:1px solid rgba(198,246,255,.11); border-radius:13px; background:rgba(8,17,34,.62); }.inspection-comment>.avatar { width:30px; height:30px; flex-basis:30px; font-size:.65rem; }.inspection-comment>div { min-width:0; flex:1; }.inspection-comment p { margin:0; }.inspection-comment>div>p:first-child { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:4px; }.inspection-comment strong { font-size:.69rem; }.inspection-comment time,.inspection-comment small { color:#7789a3; font-size:.58rem; }.inspection-comment>div>p:nth-child(2) { color:#c9d4e4; font-size:.73rem; line-height:1.48; overflow-wrap:anywhere; }.inspection-comment-form { display:grid; grid-template-columns:1fr auto; align-items:end; gap:8px; margin-top:12px; }.inspection-comment-form textarea { width:100%; resize:vertical; min-height:48px; max-height:120px; padding:11px; border:1px solid var(--line); border-radius:12px; outline:0; color:#eef5ff; background:rgba(4,10,23,.8); font:inherit; font-size:.75rem; }.inspection-comment-form textarea:focus { border-color:var(--cyan); box-shadow:0 0 0 3px rgba(40,243,255,.09); }.inspection-sign-in { margin-top:6px; color:#c8d5e7; }
@keyframes like-heart-pop { 0% { transform:scale(1); } 36% { transform:scale(1.13) rotate(-2deg); } 68% { transform:scale(.96) rotate(1deg); } 100% { transform:scale(1); } }
@keyframes like-particle-burst { 0% { opacity:0; transform:translate(0,0) scale(.35) rotate(0deg); } 20% { opacity:1; } 100% { opacity:0; transform:translate(var(--particle-x),var(--particle-y)) scale(1.25) rotate(120deg); } }
@media (max-width:820px) { .inspection-dialog { overflow:auto; }.inspection-layout { grid-template-columns:1fr; }.inspection-stage { min-height:570px; padding:52px 34px 32px; }.inspection-card { width:min(330px,88%); max-height:none; }.inspection-details { overflow:visible; padding:30px 24px 34px; } }
@media (max-width:520px) { .inspection-dialog { width:calc(100% - 16px); max-height:calc(100dvh - 16px); border-radius:22px; }.inspection-stage { min-height:500px; padding:48px 26px 28px; }.inspection-card { width:min(285px,88%); }.inspection-facts { grid-template-columns:repeat(2,minmax(0,1fr)); }.inspection-actions { grid-template-columns:1fr 1fr; }.inspection-action--download { grid-column:1/-1; }.inspection-details { padding:25px 16px 28px; }.inspection-comment-form { grid-template-columns:1fr; }.inspection-comment-form .button { width:100%; } }
@media (max-width:520px) { .download-ad-dialog { width:calc(100% - 20px); border-radius:20px; }.download-ad-dialog__body { gap:12px; padding:25px 20px 21px; }.download-ad-dialog__ad { min-height:144px; padding:10px; }.download-ad-dialog__ad .adsbygoogle { min-height:98px; }.download-ad-dialog__actions { align-items:stretch; flex-direction:column-reverse; }.download-ad-dialog__actions .button { width:100%; } }
@media (prefers-reduced-motion:reduce) { .like-particle,.inspection-action--like.is-celebrating { animation:none !important; } }

@media (hover:hover) and (pointer:fine) {
  .has-wallverse-cursor,.has-wallverse-cursor * { cursor:none !important; }
  .wallverse-cursor-trail { position:fixed; z-index:2147483646; inset:0; margin:0; padding:0; border:0; pointer-events:none; background:transparent; }
  .wallverse-cursor { --cursor-x:-100px; --cursor-y:-100px; position:fixed; z-index:2147483647; top:0; left:0; width:27px; height:27px; margin:0; padding:0; border:0; pointer-events:none; opacity:0; overflow:visible; background:transparent; transform:translate3d(var(--cursor-x),var(--cursor-y),0) translate(-13%,-13%) scale(1); transform-origin:18% 18%; transition:opacity .16s ease,filter .18s ease; will-change:transform; filter:drop-shadow(0 2px 3px rgba(0,0,0,.24)) drop-shadow(0 0 5px rgba(62,223,255,.18)); }
  .wallverse-cursor.is-visible { opacity:1; animation:wallverse-cursor-breathe 2.8s ease-in-out infinite; }
  .wallverse-cursor.is-hovering { filter:drop-shadow(0 3px 5px rgba(0,0,0,.3)) drop-shadow(0 0 10px rgba(62,223,255,.48)); }
  .wallverse-cursor.is-hovering img { transform:scale(1.104); }
  .wallverse-cursor.is-pressed img { transform:scale(.896); }
  .wallverse-cursor img { width:100%; height:100%; object-fit:contain; transform:scale(1); transition:transform .14s cubic-bezier(.2,1.45,.35,1); }
}
@keyframes wallverse-cursor-breathe { 0%,100% { transform:translate3d(var(--cursor-x),var(--cursor-y),0) translate(-13%,-13%) scale(1); } 50% { transform:translate3d(var(--cursor-x),var(--cursor-y),0) translate(-13%,-13%) scale(1.023); } }
@media (hover:none),(pointer:coarse),(prefers-reduced-motion:reduce) { .wallverse-cursor,.wallverse-cursor-trail { display:none !important; } }

.creator-dialog { width:min(1080px,calc(100% - 28px)); max-width:none; max-height:calc(100dvh - 28px); margin:auto; padding:34px; overflow:auto; border:1px solid rgba(198,246,255,.25); border-radius:28px; color:var(--text); background:radial-gradient(circle at 8% 0,rgba(40,243,255,.1),transparent 28%),radial-gradient(circle at 100% 0,rgba(155,92,255,.18),transparent 34%),#071020; box-shadow:0 34px 100px rgba(0,0,0,.78); }.creator-dialog::backdrop { background:rgba(1,4,12,.8); backdrop-filter:blur(9px); }.creator-dialog__head { display:flex; align-items:center; gap:15px; padding-right:38px; }.creator-dialog__head>.avatar { width:68px; height:68px; flex-basis:68px; font-size:1.1rem; border-width:2px; box-shadow:0 0 0 4px rgba(40,243,255,.1),0 0 26px rgba(40,243,255,.18); }.creator-dialog__head h2 { margin:3px 0; font-size:clamp(1.6rem,3vw,2.4rem); letter-spacing:-.055em; }.creator-dialog__head p:last-child { color:var(--muted); font-size:.82rem; }.creator-dialog__stats { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:9px; margin:25px 0 18px; }.creator-dialog__stats div { min-width:0; padding:12px; border:1px solid var(--line); border-radius:14px; background:rgba(9,20,40,.7); }.creator-dialog__stats dt { overflow:hidden; color:#95a8c2; font-size:.58rem; font-weight:900; letter-spacing:.08em; text-overflow:ellipsis; text-transform:uppercase; white-space:nowrap; }.creator-dialog__stats dd { margin:5px 0 0; overflow:hidden; color:#fff; font-size:1rem; font-weight:900; text-overflow:ellipsis; white-space:nowrap; }.creator-dialog__toolbar { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:12px; }.creator-dialog__toolbar button { min-height:34px; padding:7px 11px; border:1px solid var(--line); border-radius:999px; color:#c8d6e7; background:rgba(10,21,42,.72); cursor:pointer; font:inherit; font-size:.7rem; font-weight:800; }.creator-dialog__toolbar button.is-active { color:#061424; border-color:transparent; background:linear-gradient(135deg,var(--cyan),#8ba5ff); }.creator-dialog__status { margin:0 0 14px; color:#9eb0c8; font-size:.76rem; }.creator-dialog__cards { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:13px; }.creator-dialog-card { position:relative; aspect-ratio:9/14; overflow:hidden; border:1px solid color-mix(in srgb,var(--tier,#4a8fff) 45%,rgba(198,246,255,.2)); border-radius:16px; background:#0b1426; box-shadow:0 10px 24px rgba(0,0,0,.26),0 0 18px color-mix(in srgb,var(--tier,#4a8fff) 12%,transparent); }.creator-dialog-card img { width:100%; height:100%; object-fit:cover; }.creator-dialog-card::after { position:absolute; inset:0; background:linear-gradient(180deg,transparent 42%,rgba(3,8,19,.94) 100%); content:''; }.creator-dialog-card strong,.creator-dialog-card span { position:absolute; z-index:1; right:10px; left:10px; color:#fff; text-shadow:0 2px 8px rgba(0,0,0,.9); }.creator-dialog-card strong { bottom:26px; overflow:hidden; font-size:.72rem; line-height:1.22; text-overflow:ellipsis; white-space:nowrap; }.creator-dialog-card span { bottom:10px; color:#c5d7e8; font-size:.55rem; font-weight:800; white-space:nowrap; }.creator-dialog-card.is-unavailable::before { position:absolute; z-index:2; inset:0; display:grid; place-items:center; color:#9fb0c7; content:'Image unavailable'; font-size:.68rem; }
@media (max-width:900px) { .creator-dialog__stats { grid-template-columns:repeat(3,minmax(0,1fr)); }.creator-dialog__cards { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media (max-width:600px) { .creator-dialog { width:calc(100% - 16px); max-height:calc(100dvh - 16px); padding:24px 16px; border-radius:22px; }.creator-dialog__head>.avatar { width:55px; height:55px; flex-basis:55px; }.creator-dialog__stats { grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:20px; }.creator-dialog__cards { grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px; } }

/* Creator dialog: a discreet Wallverse scrollbar instead of the browser default. */
.creator-dialog {
  scrollbar-width:thin;
  scrollbar-color:rgba(56,221,255,.72) rgba(4,11,24,.58);
}
.creator-dialog::-webkit-scrollbar { width:9px; }
.creator-dialog::-webkit-scrollbar-track {
  margin:20px 7px 20px 0;
  border:1px solid rgba(198,246,255,.07);
  border-radius:999px;
  background:rgba(4,11,24,.5);
  box-shadow:inset 0 1px 5px rgba(0,0,0,.36);
}
.creator-dialog::-webkit-scrollbar-thumb {
  min-height:58px;
  border:2px solid rgba(7,16,32,.92);
  border-radius:999px;
  background:linear-gradient(180deg,rgba(40,243,255,.88),rgba(117,89,255,.78) 54%,rgba(231,85,217,.78));
  box-shadow:0 0 10px rgba(40,243,255,.28);
}
.creator-dialog::-webkit-scrollbar-thumb:hover {
  background:linear-gradient(180deg,#55f5ff,#9270ff 54%,#ff7eee);
  box-shadow:0 0 15px rgba(40,243,255,.44);
}
@media (max-width:600px) {
  .creator-dialog::-webkit-scrollbar { width:6px; }
  .creator-dialog::-webkit-scrollbar-track { margin:14px 3px 14px 0; }
}
.profile-page-body .header-actions>#profile-sign-out { color:#e9f7ff; }
@media (max-width:760px) { .profile-page-body .header-actions>#profile-sign-out { display:inline-flex; min-height:36px; padding:8px 11px; font-size:.72rem; } }

.creators-page { padding-top:54px; padding-bottom:100px; }.creators-page__head { max-width:720px; }.creators-page__head h1 { margin:14px 0; font-size:clamp(3rem,6vw,5.8rem); letter-spacing:-.07em; line-height:.94; }.creators-page__head>p:last-child { color:var(--muted); line-height:1.7; }.creators-controls { display:flex; flex-wrap:wrap; gap:10px; margin:38px 0 16px; }.creators-controls>.collection-search { max-width:340px; }.creators-ranking { display:grid; gap:10px; }.creator-ranking-row { display:grid; grid-template-columns:48px minmax(210px,1fr) minmax(420px,1.4fr); align-items:center; gap:16px; width:100%; padding:13px 17px; border:1px solid var(--line); border-radius:18px; color:var(--text); background:linear-gradient(135deg,rgba(16,31,56,.78),rgba(6,14,29,.76)); cursor:pointer; text-align:left; transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }.creator-ranking-row:hover,.creator-ranking-row:focus-visible { border-color:rgba(40,243,255,.48); outline:0; box-shadow:0 14px 32px rgba(0,0,0,.26),0 0 20px rgba(40,243,255,.08); transform:translateY(-2px); }.creator-ranking-row__rank { color:var(--cyan); font-size:1.1rem; font-weight:900; text-align:center; }.creator-ranking-row__identity { display:flex; align-items:center; gap:11px; min-width:0; }.creator-ranking-row__identity .avatar { width:42px; height:42px; flex-basis:42px; }.creator-ranking-row__identity div { display:grid; gap:3px; min-width:0; }.creator-ranking-row__identity strong { overflow:hidden; font-size:.88rem; text-overflow:ellipsis; white-space:nowrap; }.creator-ranking-row__identity span { overflow:hidden; color:#91a4bd; font-size:.67rem; text-overflow:ellipsis; white-space:nowrap; }.creator-ranking-row__stats { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:7px; }.creator-ranking-row__stats span { display:grid; gap:3px; min-width:0; padding:6px 4px; border-left:1px solid rgba(198,246,255,.11); text-align:center; }.creator-ranking-row__stats small { overflow:hidden; color:#8fa2bb; font-size:.53rem; font-weight:900; letter-spacing:.06em; text-overflow:ellipsis; text-transform:uppercase; white-space:nowrap; }.creator-ranking-row__stats strong { overflow:hidden; color:#edf8ff; font-size:.76rem; text-overflow:ellipsis; white-space:nowrap; }.creator-ranking-row__stats span:last-child strong { color:var(--cyan); }
@media (max-width:850px) { .creator-ranking-row { grid-template-columns:38px minmax(170px,1fr); }.creator-ranking-row__stats { grid-column:2; grid-template-columns:repeat(5,minmax(0,1fr)); } }
@media (max-width:560px) { .creators-page { padding-top:30px; }.creators-controls>.collection-search { max-width:none; }.creator-ranking-row { grid-template-columns:30px minmax(0,1fr); gap:10px; padding:12px; }.creator-ranking-row__stats { grid-column:1/-1; grid-template-columns:repeat(3,minmax(0,1fr)); }.creator-ranking-row__stats span { border-top:1px solid rgba(198,246,255,.1); border-left:0; }.creator-ranking-row__stats span:nth-last-child(-n+2) { display:none; } }

/* Keep the final portrait proportion after the base Card Inspection rule above. */
.collectible-card,
.wallpaper-image,
.creator-dialog-card { aspect-ratio:75/131; }

/* Keep the inspection card on the same proportion without squashing it to fit. */
.inspection-card { width:min(350px,calc(65dvh * 75 / 131),100%); max-height:none; aspect-ratio:75/131; }
@media (max-width:820px) { .inspection-card { width:min(330px,88%); } }
@media (max-width:520px) { .inspection-card { width:min(285px,88%); } }

/* Center the animated plus independently from its rotating transform. */
.upload-trigger span { inset:0; width:auto; height:auto; line-height:1; translate:0 -1px; }

/* The moving highlight stays inside the brand frame, with breathing room on its left. */
.site-header .brand { overflow:hidden; padding-left:11px; }
.site-header .brand::after { left:10px; }
.site-header .brand>img,
.site-header .brand>span { position:relative; z-index:1; }

/* Gentle, tactile motion for the homepage highlights. */
.spotlight-card,
.featured-card,
.creator-spotlight { transition:transform .32s cubic-bezier(.2,.8,.2,1),border-color .32s ease,box-shadow .32s ease; }
.spotlight-card:hover,
.featured-card:hover,
.creator-spotlight:hover { z-index:2; border-color:rgba(40,243,255,.56); box-shadow:0 28px 66px rgba(0,0,0,.48),0 0 34px rgba(40,243,255,.14),0 0 48px rgba(155,92,255,.1); transform:translateY(-6px) scale(1.008); }
.spotlight-card>img,
.featured-card__image,
.creator-spotlight__banner { transition:filter .35s ease,transform .5s cubic-bezier(.2,.8,.2,1); }
.creator-spotlight__banner { transform:scale(1.035); }
.spotlight-card:hover>img,
.featured-card:hover .featured-card__image,
.creator-spotlight:hover .creator-spotlight__banner { filter:brightness(1.08) saturate(1.08); }
.creator-spotlight:hover .creator-spotlight__banner { transform:scale(1.075); }
.creator-spotlight__content,.creator-spotlight__profile .avatar,.creator-spotlight__stats div { transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease,border-color .28s ease; }
.creator-spotlight:hover .creator-spotlight__content { transform:translateY(-3px); }
.creator-spotlight:hover .creator-spotlight__profile .avatar { transform:scale(1.06); box-shadow:0 0 0 5px rgba(40,243,255,.16),0 0 34px rgba(40,243,255,.34); }
.creator-spotlight:hover .creator-spotlight__stats div { border-color:rgba(40,243,255,.28); box-shadow:0 8px 20px rgba(0,0,0,.18); transform:translateY(-2px); }
.creator-spotlight:hover .creator-spotlight__stats div:nth-child(2) { transition-delay:.04s; }.creator-spotlight:hover .creator-spotlight__stats div:nth-child(3) { transition-delay:.08s; }.creator-spotlight:hover .creator-spotlight__stats div:nth-child(4) { transition-delay:.12s; }
@media (prefers-reduced-motion:reduce) { .spotlight-card,.featured-card,.creator-spotlight,.spotlight-card>img,.featured-card__image,.creator-spotlight__banner,.creator-spotlight__content,.creator-spotlight__profile .avatar,.creator-spotlight__stats div { transition:none; } .spotlight-card:hover,.featured-card:hover,.creator-spotlight:hover,.creator-spotlight:hover .creator-spotlight__content,.creator-spotlight:hover .creator-spotlight__profile .avatar,.creator-spotlight:hover .creator-spotlight__stats div { transform:none; } }

/* Mobile dialogs are full-height, scrollable surfaces rather than squeezed desktop windows. */
@media (max-width:820px) {
  html,body { max-width:100%; overscroll-behavior-x:none; touch-action:pan-x pan-y; -webkit-text-size-adjust:100%; text-size-adjust:100%; }
  .inspection-dialog,
  .auth-dialog,
  .profile-dialog,
  .upload-dialog,
  .creator-dialog { width:100dvw; max-width:none; height:100dvh; max-height:none; min-height:100dvh; margin:0; padding:calc(18px + env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left)); overflow:auto; border:0; border-radius:0; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }
  .inspection-dialog { padding:0; }
  .inspection-layout { min-height:100%; }
  .inspection-stage { min-height:580px; padding:70px 22px 30px; }
  .inspection-details { padding:28px 18px calc(34px + env(safe-area-inset-bottom)); }
  .inspection-dialog__close { position:fixed; top:max(12px,env(safe-area-inset-top)); right:max(12px,env(safe-area-inset-right)); }
  .auth-dialog .dialog-close,
  .profile-dialog .dialog-close,
  .upload-dialog .dialog-close,
  .creator-dialog .dialog-close { position:fixed; top:max(12px,env(safe-area-inset-top)); right:max(12px,env(safe-area-inset-right)); z-index:20; }
  .upload-dialog { padding-top:calc(64px + env(safe-area-inset-top)); }
  .creator-dialog { padding-top:calc(64px + env(safe-area-inset-top)); }
}

@media (max-width:420px) {
  .inspection-stage { min-height:540px; padding-inline:16px; }
  .inspection-card { width:min(276px,82vw); }
  .inspection-actions { gap:8px; }
  .inspection-action { min-width:0; padding-inline:8px; }
  .auth-dialog__footer { align-items:flex-start; flex-direction:column; }
  .upload-crop__stage { width:min(252px,72vw); }
}

/* Public and personal collections keep a readable two-card layout on phones. */
@media (max-width:760px) {
  #profile-wallpaper-grid,
  #creator-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 14px; }
  .creator-dialog__cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:340px) {
  #profile-wallpaper-grid,
  #creator-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* About — Wallverse as a creative community, with the Android app at its center. */
.wallverse-experience { padding-top:24px; padding-bottom:92px; }
.wallverse-experience__heading { max-width:820px; margin-bottom:28px; }
.wallverse-experience__heading h2 { margin:15px 0 0; font-size:clamp(2.9rem,5.25vw,5.25rem); line-height:1.01; letter-spacing:-.068em; }
.wallverse-experience h2 em,.experience-app h3 em { font-style:normal; background:linear-gradient(100deg,#e95be0 5%,#9b5cff 42%,#28d7ff 92%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.experience-feature-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.experience-feature { display:grid; grid-template-columns:52px minmax(0,1fr); align-items:start; gap:17px; min-height:150px; padding:20px 17px; border:1px solid rgba(168,194,231,.21); border-radius:19px; background:linear-gradient(145deg,rgba(17,31,57,.8),rgba(7,14,30,.82)); box-shadow:inset 0 1px 0 rgba(255,255,255,.035); transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease; }
.experience-feature:hover { transform:translateY(-4px); border-color:rgba(40,243,255,.47); box-shadow:0 16px 35px rgba(0,0,0,.24),0 0 22px rgba(73,137,255,.1); }
.experience-feature>.material-symbols-rounded { display:grid; width:52px; height:52px; place-items:center; border:1px solid rgba(142,109,255,.34); border-radius:16px; color:#42e9ff; background:radial-gradient(circle at 35% 25%,rgba(202,106,255,.34),transparent 42%),linear-gradient(135deg,rgba(71,43,144,.44),rgba(9,32,59,.68)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 0 18px rgba(144,74,255,.12); font-size:1.55rem; }
.experience-feature:nth-child(2)>.material-symbols-rounded,.experience-feature:nth-child(3)>.material-symbols-rounded { color:#e25cff; }.experience-feature:nth-child(4)>.material-symbols-rounded { color:#39efff; }
.experience-feature h3 { margin:7px 0 9px; font-size:1rem; letter-spacing:-.025em; }.experience-feature p { margin:0; color:#abb8cd; font-size:.77rem; line-height:1.72; }
.experience-app { position:relative; display:grid; grid-template-columns:minmax(250px,.9fr) minmax(360px,1.22fr) minmax(190px,.62fr); align-items:center; gap:18px; overflow:hidden; margin-top:28px; min-height:468px; padding:42px 30px 34px; border:1px solid rgba(160,115,255,.43); border-radius:24px; background:radial-gradient(circle at 4% 86%,rgba(161,64,255,.32),transparent 30%),radial-gradient(circle at 62% 84%,rgba(38,125,255,.26),transparent 30%),radial-gradient(circle at 100% 20%,rgba(40,243,255,.08),transparent 31%),linear-gradient(115deg,#111b38,#081326 64%,#09182c); box-shadow:0 28px 60px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.045); }
.experience-app::before { position:absolute; inset:0; background:linear-gradient(105deg,rgba(242,86,221,.11),transparent 30%,transparent 67%,rgba(40,243,255,.07)); content:''; pointer-events:none; }
.experience-app__copy,.experience-app__visual,.experience-app__list { position:relative; z-index:1; }.experience-app__copy { align-self:center; }.experience-app__copy h3 { margin:15px 0 17px; font-size:clamp(2.1rem,3.35vw,3.65rem); line-height:1.02; letter-spacing:-.062em; }.experience-app__copy>p:not(.eyebrow) { max-width:390px; margin:0 0 17px; color:#c3cede; font-size:.88rem; line-height:1.68; }.experience-app__copy .button--play { margin-top:2px; }
.experience-app__visual { min-height:365px; align-self:end; }.experience-app__visual::after { position:absolute; right:4%; bottom:-4%; left:4%; height:28%; border-radius:50%; background:radial-gradient(ellipse,rgba(40,138,255,.4),rgba(132,51,255,.25) 38%,transparent 70%); filter:blur(17px); content:''; }.experience-app__visual img { position:absolute; z-index:1; inset:-4% -15% -15%; width:130%; height:122%; object-fit:contain; filter:drop-shadow(0 28px 30px rgba(0,0,0,.5)); }
.experience-app__list { display:grid; gap:0; align-self:center; padding:0; margin:0; list-style:none; }.experience-app__list li { display:flex; align-items:center; gap:14px; min-height:54px; border-bottom:1px solid rgba(198,246,255,.12); color:#e1eafa; font-size:.78rem; }.experience-app__list li:last-child { border-bottom:0; }.experience-app__list .material-symbols-rounded { color:#65e9ff; font-size:1.35rem; filter:drop-shadow(0 0 8px rgba(40,243,255,.4)); }.experience-app__list li:nth-child(3n+2) .material-symbols-rounded { color:#bd70ff; }
@media (max-width:1080px) { .experience-feature-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.experience-app { grid-template-columns:minmax(260px,.8fr) minmax(390px,1.2fr); gap:10px; }.experience-app__list { grid-column:1/-1; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 15px; }.experience-app__list li:nth-last-child(-n+3) { border-bottom:0; }.experience-app__visual { min-height:355px; } }
@media (max-width:760px) { .wallverse-experience { padding-top:2px; padding-bottom:65px; }.wallverse-experience__heading { margin-bottom:22px; }.wallverse-experience__heading h2 { font-size:clamp(2.55rem,11vw,4rem); }.experience-feature-grid { gap:12px; }.experience-feature { grid-template-columns:45px minmax(0,1fr); gap:13px; min-height:0; padding:16px 14px; border-radius:16px; }.experience-feature>.material-symbols-rounded { width:45px; height:45px; border-radius:14px; font-size:1.35rem; }.experience-feature h3 { margin:5px 0 6px; font-size:.93rem; }.experience-feature p { font-size:.71rem; line-height:1.55; }.experience-app { grid-template-columns:1fr; gap:8px; min-height:0; margin-top:20px; padding:31px 20px 23px; border-radius:21px; }.experience-app__copy h3 { font-size:clamp(2.25rem,10vw,3.35rem); }.experience-app__copy>p:not(.eyebrow) { font-size:.82rem; }.experience-app__visual { order:3; min-height:310px; margin-top:0; }.experience-app__visual img { inset:-9% -18% -20%; width:136%; height:128%; }.experience-app__list { grid-column:auto; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 16px; order:2; }.experience-app__list li { min-height:45px; gap:9px; font-size:.7rem; }.experience-app__list li:nth-last-child(-n+3) { border-bottom:1px solid rgba(198,246,255,.12); }.experience-app__list li:nth-last-child(-n+2) { border-bottom:0; }.experience-app__list .material-symbols-rounded { font-size:1.12rem; } }
@media (max-width:430px) { .experience-feature-grid { grid-template-columns:1fr; }.experience-app__list { grid-template-columns:1fr; }.experience-app__list li,.experience-app__list li:nth-last-child(-n+3) { border-bottom:1px solid rgba(198,246,255,.12); }.experience-app__list li:last-child { border-bottom:0; }.experience-app__visual { min-height:275px; } }
@media (prefers-reduced-motion:reduce) { .experience-feature { transition:none; }.experience-feature:hover { transform:none; } }

/* Interactive type stays restrained: it follows the cursor without affecting layout. */
.is-letter-reactive { cursor:default; }.experience-text-run { display:inline; }.experience-word { display:inline-block; white-space:nowrap; }.experience-letter { display:inline-block; min-width:.08em; transform:translate3d(0,var(--letter-lift,0),0) rotate(var(--letter-turn,0deg)) scale(var(--letter-scale,1)); transform-origin:50% 82%; transition:transform .15s ease,color .15s ease; }.experience-letter.is-near { color:#eafcff; }
.experience-app__visual img { transform:translateX(8%); }.experience-app__list li:nth-child(3n+2) .material-symbols-rounded,.experience-app__list li:nth-child(3n+3) .material-symbols-rounded { color:#bd70ff; }
@media (max-width:760px) { .experience-app__visual img { transform:translateX(3%); } }
@media (prefers-reduced-motion:reduce),(hover:none),(pointer:coarse) { .experience-letter { transition:none; } }

/* Notification center */
.notification-trigger { position:relative; display:grid; width:42px; height:42px; place-items:center; border:1px solid rgba(198,246,255,.2); border-radius:50%; color:#cde8ff; background:rgba(11,25,48,.7); transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,color .2s ease; }.notification-trigger:hover,.notification-trigger:focus-visible,.notification-trigger.is-active { outline:0; color:var(--cyan); border-color:rgba(40,243,255,.58); box-shadow:0 0 20px rgba(40,243,255,.17); transform:translateY(-2px); }.notification-trigger .material-symbols-rounded { font-size:1.25rem; }.notification-badge { position:absolute; top:-4px; right:-5px; display:grid; min-width:18px; height:18px; place-items:center; padding:0 4px; border:2px solid var(--bg); border-radius:999px; color:#071020; background:linear-gradient(135deg,#f263dd,#38e8ff); font-size:.6rem; font-weight:900; line-height:1; }.notifications-page { padding-top:58px; padding-bottom:110px; }.notifications-page__head { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:24px; }.notifications-page__head h1 { margin:10px 0; font-size:clamp(3rem,6vw,5.8rem); letter-spacing:-.07em; line-height:.94; }.notifications-page__head p:last-child { margin:0; color:var(--muted); }.notifications-panel { max-width:940px; }.notifications-list { display:grid; gap:10px; }.notification-item { display:grid; grid-template-columns:48px minmax(0,1fr) auto; align-items:center; gap:14px; padding:15px 17px; border:1px solid var(--line); border-radius:19px; background:linear-gradient(135deg,rgba(15,30,55,.85),rgba(7,16,33,.86)); transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease; }.notification-item:hover { border-color:rgba(40,243,255,.35); transform:translateY(-1px); }.notification-item.is-unread { border-color:rgba(145,97,255,.5); box-shadow:inset 3px 0 0 var(--cyan),0 0 24px rgba(74,113,255,.08); }.notification-item--gift { border-color:rgba(230,99,222,.55); background:radial-gradient(circle at 0 50%,rgba(209,73,211,.16),transparent 36%),linear-gradient(135deg,rgba(32,25,65,.94),rgba(7,20,37,.92)); }.notification-item__icon { display:grid; width:48px; height:48px; place-items:center; border:1px solid rgba(40,243,255,.28); border-radius:15px; color:var(--cyan); background:linear-gradient(135deg,rgba(53,57,151,.46),rgba(8,40,65,.6)); box-shadow:0 0 18px rgba(40,243,255,.1); }.notification-item--gift .notification-item__icon { color:#f171ed; border-color:rgba(232,101,226,.5); }.notification-item__copy { min-width:0; }.notification-item__copy h2 { margin:0 0 4px; font-size:.95rem; letter-spacing:-.025em; }.notification-item__copy p { margin:0; color:#aebed3; font-size:.78rem; line-height:1.5; }.notification-item__copy time { display:block; margin-top:7px; color:#7d91af; font-size:.66rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }.notification-item__actions { display:flex; align-items:center; gap:8px; }.notification-item__open,.notification-item__dismiss { border:0; color:#caedff; background:transparent; font:inherit; font-size:.75rem; font-weight:800; cursor:pointer; }.notification-item__open:hover { color:var(--cyan); }.notification-item__dismiss { display:grid; width:32px; height:32px; place-items:center; border:1px solid rgba(198,246,255,.14); border-radius:50%; }.notification-item__dismiss:hover { color:#ff8db7; border-color:rgba(255,105,159,.42); }.notification-item__dismiss .material-symbols-rounded { font-size:1rem; }.notification-item__gift-action { white-space:nowrap; }.notifications-signed-out { max-width:530px; display:grid; justify-items:start; gap:15px; margin:100px auto; padding:30px; border:1px solid var(--line); border-radius:24px; background:linear-gradient(145deg,rgba(17,31,57,.8),rgba(7,14,30,.82)); }.notifications-signed-out>.material-symbols-rounded { color:var(--cyan); font-size:2rem; }.notifications-signed-out h2 { margin:0; font-size:clamp(2rem,5vw,3.2rem); letter-spacing:-.06em; }.notifications-signed-out p { margin:0; color:var(--muted); line-height:1.65; }
@media (max-width:760px) { .notification-trigger { width:36px; height:36px; }.notifications-page { padding-top:30px; padding-bottom:68px; }.notifications-page__head { align-items:start; flex-direction:column; }.notification-item { grid-template-columns:42px minmax(0,1fr); align-items:start; padding:14px; }.notification-item__icon { width:42px; height:42px; border-radius:13px; }.notification-item__actions,.notification-item__gift-action { grid-column:2; justify-self:start; margin-top:2px; }.notification-item__actions { margin-left:-1px; }.notification-item__copy h2 { font-size:.9rem; }.notification-item__copy p { font-size:.74rem; } }
.notification-trigger { visibility:hidden; }.notification-trigger.is-ready { visibility:visible; }

/* The sponsored-download dialog must remain a compact modal, including on mobile. */
.download-ad-dialog { height:auto !important; min-height:0 !important; max-height:calc(100dvh - 24px) !important; align-self:center; }

/* Android-parity collectible frames. The purchased frame type comes from user_cards. */
.card-frame-skin { position:absolute; z-index:6; inset:-4px; border-radius:34px; pointer-events:none; transform:translateZ(6px); }
.card-frame-skin::before { position:absolute; inset:0; padding:3px; border-radius:inherit; background:conic-gradient(from var(--frame-angle),transparent 0 8%,var(--tier) 14%,var(--accent) 22%,transparent 31% 48%,#28f3ff 57%,var(--tier) 66%,transparent 76% 100%); content:''; -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; filter:drop-shadow(0 0 7px var(--tier)); }
.card-frame-skin::after { position:absolute; inset:8px; border:1px solid color-mix(in srgb,var(--accent) 54%,transparent); border-radius:calc(34px - 8px); box-shadow:inset 0 0 14px color-mix(in srgb,var(--tier) 23%,transparent),0 0 13px color-mix(in srgb,var(--accent) 18%,transparent); content:''; }
.card-frame-skin__rail,.card-frame-skin__spark { position:absolute; display:block; background:var(--accent); box-shadow:0 0 5px var(--accent),0 0 12px var(--tier); }
.card-frame-skin__rail--top,.card-frame-skin__rail--bottom { left:17%; width:24%; height:2px; }.card-frame-skin__rail--top { top:1px; }.card-frame-skin__rail--bottom { right:17%; bottom:1px; left:auto; }
.card-frame-skin__rail--left,.card-frame-skin__rail--right { top:22%; width:2px; height:17%; }.card-frame-skin__rail--left { left:1px; }.card-frame-skin__rail--right { right:1px; top:auto; bottom:22%; }
.card-frame-skin__spark { width:5px; height:5px; border-radius:50%; }.card-frame-skin__spark--1 { top:7%; left:8%; }.card-frame-skin__spark--2 { top:10%; right:7%; }.card-frame-skin__spark--3 { right:8%; bottom:8%; }.card-frame-skin__spark--4 { bottom:10%; left:7%; }
.collectible-card:has(>.card-frame-skin) { padding:11px; border-color:color-mix(in srgb,var(--tier) 58%,transparent); box-shadow:0 24px 52px rgba(0,0,0,.48),0 0 25px color-mix(in srgb,var(--tier) 34%,transparent),0 0 55px color-mix(in srgb,var(--accent) 16%,transparent); }
.collectible-card:has(>.card-frame-skin)>.collectible-card__media { position:relative; z-index:1; }.collectible-card:has(>.card-frame-skin) .collectible-card__info { z-index:7; }

.frame--neonrounded { border-radius:34px; background:radial-gradient(circle at 50% 0,color-mix(in srgb,var(--accent) 22%,transparent),transparent 38%),linear-gradient(145deg,#13202c,#06101b) padding-box,linear-gradient(145deg,var(--accent),color-mix(in srgb,var(--tier) 45%,#07101f),var(--tier)) border-box; }
.frame--neonrounded>.card-frame-skin { border:2px solid color-mix(in srgb,var(--tier) 88%,white 12%); box-shadow:0 0 9px color-mix(in srgb,var(--accent) 78%,transparent),inset 0 0 12px color-mix(in srgb,var(--tier) 32%,transparent); animation:frame-neon-breathe 4.2s ease-in-out infinite; }
.frame--neonrounded>.card-frame-skin::before { animation:frame-orbit 4.2s linear infinite; }.frame--neonrounded>.card-frame-skin__rail { opacity:.7; }

.frame--neongradient { background:linear-gradient(#07101f,#07101f) padding-box,conic-gradient(from var(--frame-angle),var(--tier),var(--accent),#28f3ff,#9b5cff,var(--tier)) border-box; animation:none; }
.frame--neongradient>.card-frame-skin { box-shadow:0 0 26px color-mix(in srgb,var(--tier) 33%,transparent); }.frame--neongradient>.card-frame-skin::before { padding:4px; background:conic-gradient(from var(--frame-angle),var(--tier),#fff 8%,var(--accent) 20%,#28f3ff 40%,#446cff 58%,#c344ff 76%,var(--tier)); animation:frame-orbit 4.2s linear infinite; }.frame--neongradient>.card-frame-skin::after { border-color:color-mix(in srgb,#fff 50%,var(--tier)); opacity:.72; }.frame--neongradient>.card-frame-skin__spark { animation:frame-spark 2.1s ease-in-out infinite alternate; }

.frame--cyberpunk { border-radius:14px; background:linear-gradient(135deg,color-mix(in srgb,var(--tier) 28%,#07101f),#07101f 22% 78%,color-mix(in srgb,var(--accent) 26%,#07101f)) padding-box,linear-gradient(135deg,var(--accent),var(--tier),#28f3ff) border-box; }
.frame--cyberpunk>.collectible-card__media { border-radius:9px; clip-path:polygon(8% 0,100% 0,100% 92%,92% 100%,0 100%,0 8%); }.frame--cyberpunk>.card-frame-skin { inset:-5px; border-radius:10px; clip-path:polygon(8% 0,100% 0,100% 92%,92% 100%,0 100%,0 8%); filter:drop-shadow(0 0 8px color-mix(in srgb,var(--tier) 65%,transparent)); }.frame--cyberpunk>.card-frame-skin::before { padding:4px; border-radius:10px; background:conic-gradient(from var(--frame-angle),var(--accent) 0 7%,transparent 7% 23%,var(--tier) 23% 34%,transparent 34% 58%,#28f3ff 58% 69%,transparent 69% 90%,var(--accent) 90%); animation:frame-orbit 4.2s linear infinite; }.frame--cyberpunk>.card-frame-skin::after { inset:9px; border-radius:4px; border-style:dashed; }.frame--cyberpunk>.card-frame-skin__rail { height:3px; width:31%; border-radius:0; animation:cyber-rail 1.8s steps(3,end) infinite; }.frame--cyberpunk>.card-frame-skin__rail--left,.frame--cyberpunk>.card-frame-skin__rail--right { width:3px; height:24%; }.frame--cyberpunk>.card-frame-skin__spark { border-radius:0; transform:rotate(45deg); }

.frame--electric { border-radius:28px; filter:drop-shadow(0 0 9px color-mix(in srgb,var(--accent) 52%,transparent)); background:linear-gradient(#07101f,#07101f) padding-box,linear-gradient(135deg,var(--tier),#28f3ff,var(--accent)) border-box; }
.frame--electric>.collectible-card__media { border-radius:20px; clip-path:polygon(2% 0,46% 1%,50% 0,97% 2%,100% 15%,98% 41%,100% 52%,99% 88%,94% 100%,52% 99%,47% 100%,4% 98%,0 87%,2% 54%,0 47%,1% 10%); }.frame--electric>.card-frame-skin { inset:-7px; border-radius:29px; clip-path:polygon(3% 0,42% 1%,48% 0,55% 2%,96% 0,100% 12%,98% 43%,100% 49%,98% 56%,100% 91%,94% 100%,57% 98%,49% 100%,42% 98%,4% 100%,0 89%,2% 58%,0 51%,2% 44%,0 9%); animation:electric-flicker 1.6s steps(2,end) infinite; }.frame--electric>.card-frame-skin::before { padding:4px; background:conic-gradient(from var(--frame-angle),transparent 0 6%,#fff 8%,var(--accent) 10%,transparent 14% 36%,var(--tier) 39%,#28f3ff 42%,transparent 46% 69%,var(--accent) 72%,#fff 74%,transparent 79%); animation:frame-orbit 2.8s linear infinite; }.frame--electric>.card-frame-skin::after { inset:9px; border-color:var(--accent); box-shadow:inset 0 0 15px color-mix(in srgb,var(--accent) 40%,transparent),0 0 16px color-mix(in srgb,var(--tier) 45%,transparent); }.frame--electric>.card-frame-skin__spark { width:7px; height:2px; border-radius:0; animation:electric-spark .9s steps(2,end) infinite; }

.collectible-card:not(.is-visible)>.card-frame-skin,.collectible-card:not(.is-visible)>.card-frame-skin::before,.collectible-card:not(.is-visible)>.card-frame-skin .card-frame-skin__rail,.collectible-card:not(.is-visible)>.card-frame-skin .card-frame-skin__spark { animation-play-state:paused; }
@keyframes frame-orbit { to { --frame-angle:360deg; } }
@keyframes frame-neon-breathe { 0%,100% { opacity:.74; filter:brightness(.92); } 50% { opacity:1; filter:brightness(1.28); } }
@keyframes frame-spark { from { opacity:.35; transform:scale(.65); } to { opacity:1; transform:scale(1.25); } }
@keyframes cyber-rail { 0%,100% { opacity:.45; filter:brightness(.8); } 50% { opacity:1; filter:brightness(1.4); } }
@keyframes electric-flicker { 0%,100% { opacity:.78; transform:translateZ(6px); } 37% { opacity:1; transform:translate3d(.5px,-.5px,6px); } 72% { opacity:.88; transform:translate3d(-.5px,.5px,6px); } }
@keyframes electric-spark { 0%,100% { opacity:.22; transform:rotate(-18deg) scaleX(.7); } 50% { opacity:1; transform:rotate(14deg) scaleX(1.6); } }
@media (max-width:760px) { .collectible-card:has(>.card-frame-skin) { padding:8px; }.card-frame-skin { inset:-3px; border-radius:27px; }.card-frame-skin::after { inset:6px; border-radius:21px; }.frame--cyberpunk>.card-frame-skin,.frame--electric>.card-frame-skin { inset:-4px; } }
@media (prefers-reduced-motion:reduce) { .card-frame-skin,.card-frame-skin::before,.card-frame-skin::after,.card-frame-skin__rail,.card-frame-skin__spark { animation:none !important; } }

/* Equipped avatar frames mirror the Android shapes at a quieter intensity. */
.avatar.avatar-frame { --avatar-tier:#d8deef; --avatar-accent:#8290a7; --avatar-power:.72; position:relative; isolation:isolate; overflow:visible; border:0; background:transparent; box-shadow:none; }
.avatar-tier--uncommon { --avatar-tier:#47d764; --avatar-accent:#91f2a4; --avatar-power:.82; }.avatar-tier--rare { --avatar-tier:#3f9bff; --avatar-accent:#28f3ff; --avatar-power:.92; }.avatar-tier--epic { --avatar-tier:#9b5cff; --avatar-accent:#b45bff; --avatar-power:1; }.avatar-tier--legendary { --avatar-tier:#ffa629; --avatar-accent:#ffd166; --avatar-power:1.08; }.avatar-tier--mythic { --avatar-tier:#ff70f8; --avatar-accent:#28f3ff; --avatar-power:1.16; }
.avatar-frame__content { position:absolute; z-index:2; inset:4px; display:grid; overflow:hidden; place-items:center; border:1px solid rgba(255,255,255,.28); border-radius:50%; color:#fff; background:linear-gradient(135deg,#ad78ff,#4935b8); }
.avatar-frame__content>.avatar__image { width:100%; height:100%; object-fit:cover; }
.avatar.avatar-frame::before,.avatar.avatar-frame::after { position:absolute; z-index:1; content:''; pointer-events:none; }
.avatar.avatar-frame::before { inset:0; padding:2px; border-radius:inherit; background:conic-gradient(from var(--frame-angle),var(--avatar-tier),var(--avatar-accent),#28f3ff,#9257ff,var(--avatar-tier)); -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; filter:drop-shadow(0 0 calc(7px * var(--avatar-power)) color-mix(in srgb,var(--avatar-tier) 72%,transparent)); animation:avatar-frame-orbit 4.2s linear infinite; }
.avatar.avatar-frame::after { inset:-2px; border:1px solid color-mix(in srgb,var(--avatar-accent) 50%,transparent); border-radius:inherit; opacity:var(--avatar-power); box-shadow:0 0 12px color-mix(in srgb,var(--avatar-tier) 40%,transparent); }
.avatar-frame--neonrounded { border-radius:29% !important; }.avatar-frame--neonrounded .avatar-frame__content { inset:5px; border-radius:23%; }.avatar-frame--neonrounded::before { border-radius:29%; background:conic-gradient(from var(--frame-angle),transparent 0 7%,var(--avatar-tier) 12%,#fff 16%,var(--avatar-accent) 20%,transparent 27% 55%,var(--avatar-tier) 62%,transparent 70% 100%); }.avatar-frame--neonrounded::after { border-radius:31%; transform:rotate(45deg) scale(.72); }
.avatar-frame--neongradient::before { padding:1.8px; background:conic-gradient(from var(--frame-angle),#28f3ff,#407cff,#9b5cff,var(--avatar-tier),#28f3ff); }.avatar-frame--neongradient::after { opacity:.62; }
.avatar-frame--cyberpunk,.avatar-frame--cyberpunk .avatar-frame__content { border-radius:0 !important; clip-path:polygon(17% 0,100% 0,100% 78%,78% 100%,0 100%,0 17%); }.avatar-frame--cyberpunk::before { border-radius:0; background:conic-gradient(from var(--frame-angle),var(--avatar-accent) 0 10%,transparent 10% 28%,var(--avatar-tier) 28% 43%,transparent 43% 66%,#28f3ff 66% 78%,transparent 78% 100%); }.avatar-frame--cyberpunk::after { inset:1px; border-radius:0; clip-path:inherit; }
.avatar-frame--electric,.avatar-frame--electric .avatar-frame__content { clip-path:polygon(8% 1%,43% 3%,51% 0,94% 4%,100% 18%,97% 46%,100% 54%,96% 91%,82% 100%,53% 97%,46% 100%,9% 96%,0 83%,3% 55%,0 47%,4% 11%); }.avatar-frame--electric::before { padding:2.5px; background:conic-gradient(from var(--frame-angle),transparent 0 9%,#fff 11%,var(--avatar-accent) 14%,transparent 18% 44%,var(--avatar-tier) 47%,#28f3ff 50%,transparent 54% 79%,var(--avatar-accent) 82%,transparent 87%); animation:avatar-frame-orbit 2.8s linear infinite,electric-flicker 1.6s steps(2,end) infinite; }.avatar-frame--electric::after { clip-path:inherit; }
@keyframes avatar-frame-orbit { to { --frame-angle:360deg; } }

/* Final Android-parity tuning for the four card frame identities. */
.frame--neonrounded>.card-frame-skin__spark { width:7px; height:7px; border-radius:1px; transform:rotate(45deg); animation:frame-diamond 2.4s ease-in-out infinite alternate; }.frame--neonrounded>.card-frame-skin__spark--2,.frame--neonrounded>.card-frame-skin__spark--4 { animation-delay:-1.2s; }
.frame--neongradient>.card-frame-skin::before { padding:2px; background:conic-gradient(from var(--frame-angle),#28f3ff,#3478ff,#9b5cff,var(--tier),#28f3ff); filter:drop-shadow(0 0 5px color-mix(in srgb,var(--tier) 68%,transparent)); }
.frame--cyberpunk.is-visible .collectible-card__shine { opacity:.62; animation:cyber-card-sweep 4.4s cubic-bezier(.45,0,.55,1) infinite; }.frame--cyberpunk>.card-frame-skin__rail--top { left:10%; width:38%; }.frame--cyberpunk>.card-frame-skin__rail--bottom { right:8%; width:31%; }.frame--cyberpunk>.card-frame-skin__spark--1,.frame--cyberpunk>.card-frame-skin__spark--3 { width:9px; height:3px; transform:none; }
.frame--electric>.card-frame-skin__spark--1 { animation-delay:-.12s; }.frame--electric>.card-frame-skin__spark--2 { animation-delay:-.47s; }.frame--electric>.card-frame-skin__spark--3 { animation-delay:-.81s; }.frame--electric>.card-frame-skin__spark--4 { animation-delay:-1.14s; }.frame--electric>.card-frame-skin__rail { background:linear-gradient(90deg,transparent,#fff,var(--accent),transparent); animation:electric-bolt 1.35s steps(3,end) infinite; }.frame--electric>.card-frame-skin__rail--right,.frame--electric>.card-frame-skin__rail--bottom { animation-delay:-.68s; }
.is-polished:has(>.card-frame-skin)::after { z-index:8; inset:-2px; border-radius:inherit; mix-blend-mode:screen; }
@keyframes frame-diamond { from { opacity:.28; filter:brightness(.7); transform:rotate(45deg) scale(.62); } to { opacity:1; filter:brightness(1.6); transform:rotate(45deg) scale(1.18); } }
@keyframes cyber-card-sweep { 0%,18% { opacity:0; transform:translateX(-12%) rotate(-20deg); } 36% { opacity:.72; } 58%,100% { opacity:0; transform:translateX(310%) rotate(-20deg); } }
@keyframes electric-bolt { 0%,100% { opacity:.18; transform:scaleX(.45) skewX(-28deg); } 35% { opacity:1; transform:scaleX(1.45) skewX(16deg); } 52% { opacity:.3; transform:scaleX(.7) skewX(-8deg); } }
@media (prefers-reduced-motion:reduce) { .avatar.avatar-frame::before,.frame--cyberpunk .collectible-card__shine { animation:none !important; } }

/* Profile library navigation — integrated into the collectible-card language. */
.profile-library-tabs { position:relative; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); width:min(620px,100%); gap:10px; margin:-8px 0 20px; padding:0; }
.profile-library-tab { position:relative; display:grid; grid-template-columns:42px minmax(0,1fr) auto; align-items:center; gap:12px; min-height:68px; padding:11px 14px 11px 11px; overflow:hidden; border:1px solid rgba(157,190,227,.16); border-radius:18px; color:#8fa3bd; background:linear-gradient(145deg,rgba(13,27,50,.78),rgba(6,14,29,.9)); box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 10px 24px rgba(0,0,0,.13); cursor:pointer; font:inherit; text-align:left; transition:color .22s ease,border-color .22s ease,background .22s ease,box-shadow .22s ease,transform .22s ease; }
.profile-library-tab::after { position:absolute; right:14px; bottom:0; left:14px; height:2px; border-radius:999px 999px 0 0; background:linear-gradient(90deg,transparent,#d35cff 18%,#6a78ff 54%,#28f3ff 82%,transparent); content:''; opacity:0; transform:scaleX(.35); transition:opacity .22s ease,transform .3s cubic-bezier(.2,.8,.2,1); }
.profile-library-tab__icon { display:grid; width:42px; height:42px; place-items:center; border:1px solid rgba(151,104,255,.23); border-radius:13px; color:#9e7cff; background:radial-gradient(circle at 30% 20%,rgba(196,95,255,.2),transparent 48%),rgba(73,48,145,.18); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); font-size:1.2rem; transition:color .22s ease,border-color .22s ease,box-shadow .22s ease,transform .22s ease; }
.profile-library-tab__copy { display:grid; min-width:0; gap:2px; }.profile-library-tab__copy strong { color:#eef5ff; font-size:.82rem; font-weight:900; letter-spacing:-.015em; }.profile-library-tab__copy small { overflow:hidden; font-size:.64rem; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
.profile-library-tab__count { display:grid; min-width:29px; height:25px; place-items:center; padding:0 7px; border:1px solid rgba(198,246,255,.12); border-radius:9px; color:#afbed2; background:rgba(4,11,24,.6); font-size:.65rem; font-weight:900; }
.profile-library-tab:hover,.profile-library-tab:focus-visible { border-color:rgba(90,220,255,.34); color:#c6d8ec; outline:0; box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 14px 30px rgba(0,0,0,.22),0 0 20px rgba(40,243,255,.055); transform:translateY(-2px); }.profile-library-tab:hover .profile-library-tab__icon,.profile-library-tab:focus-visible .profile-library-tab__icon { color:#c67cff; border-color:rgba(190,97,255,.42); transform:scale(1.04); }
.profile-library-tab.is-active { border-color:rgba(69,224,255,.43); color:#c7d8ed; background:radial-gradient(circle at 0 0,rgba(135,72,255,.14),transparent 46%),linear-gradient(145deg,rgba(17,36,65,.94),rgba(7,17,34,.96)); box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 15px 34px rgba(0,0,0,.25),0 0 24px rgba(40,243,255,.075); }.profile-library-tab.is-active::after { opacity:1; transform:scaleX(1); }.profile-library-tab.is-active .profile-library-tab__icon { color:#42efff; border-color:rgba(40,243,255,.48); background:radial-gradient(circle at 28% 18%,rgba(204,88,255,.34),transparent 44%),linear-gradient(145deg,rgba(93,58,188,.42),rgba(5,49,76,.56)); box-shadow:0 0 18px rgba(40,243,255,.1),inset 0 1px 0 rgba(255,255,255,.13); }.profile-library-tab.is-active .profile-library-tab__count { color:#d9fbff; border-color:rgba(40,243,255,.28); background:rgba(10,46,65,.62); }
@media (max-width:560px) { .profile-library-tabs { gap:8px; }.profile-library-tab { grid-template-columns:36px minmax(0,1fr); min-height:60px; gap:9px; padding:9px; border-radius:16px; }.profile-library-tab__icon { width:36px; height:36px; border-radius:11px; }.profile-library-tab__count { position:absolute; top:6px; right:6px; min-width:22px; height:20px; padding:0 5px; border-radius:7px; font-size:.57rem; }.profile-library-tab__copy small { max-width:110px; font-size:.58rem; } }
@media (max-width:380px) { .profile-library-tab__copy small { display:none; }.profile-library-tab { min-height:54px; }.profile-library-tab__copy strong { font-size:.72rem; } }

/* Custom store frames — distinct silhouettes with rarity-driven energy. */
.collectible-card:has(>.card-frame-skin) { --frame-glow:color-mix(in srgb,var(--tier) 48%,transparent); padding:10px; border-color:transparent; background:linear-gradient(150deg,rgba(16,27,46,.98),rgba(4,10,21,.98)) padding-box,linear-gradient(145deg,color-mix(in srgb,var(--tier) 64%,#fff),rgba(255,255,255,.08) 38%,color-mix(in srgb,var(--accent) 66%,transparent)) border-box; box-shadow:0 26px 52px rgba(0,0,0,.52),0 0 20px color-mix(in srgb,var(--tier) 24%,transparent),0 0 44px color-mix(in srgb,var(--accent) 10%,transparent); }
.card-frame-skin { inset:-4px; border-radius:34px; will-change:filter; }.card-frame-skin::before { padding:2px; }.card-frame-skin::after { inset:8px; }
.card-frame-skin__spark--5 { top:26%; right:-1px; }.card-frame-skin__spark--6 { right:22%; bottom:-1px; }.card-frame-skin__spark--7 { bottom:27%; left:-1px; }.card-frame-skin__spark--8 { top:-1px; left:26%; }

/* Neon Rounded: rarity neon, soft halo and diamond anchors. */
.frame--neonrounded { border-radius:34px; filter:none; background:radial-gradient(circle at 18% 0,color-mix(in srgb,var(--tier) 18%,transparent),transparent 34%),linear-gradient(145deg,#111c2d,#050c18) padding-box,linear-gradient(145deg,color-mix(in srgb,var(--tier) 82%,#fff),color-mix(in srgb,var(--accent) 35%,#07101f),var(--tier)) border-box; }
.frame--neonrounded>.collectible-card__media { border-radius:24px; }.frame--neonrounded>.card-frame-skin { border:1px solid color-mix(in srgb,var(--tier) 76%,#fff); border-radius:36px; box-shadow:0 0 8px var(--frame-glow),0 0 22px color-mix(in srgb,var(--tier) 28%,transparent),inset 0 0 12px color-mix(in srgb,var(--accent) 18%,transparent); animation:frame-neon-breathe 3.8s ease-in-out infinite; }
.frame--neonrounded>.card-frame-skin::before { padding:3px; border-radius:35px; background:conic-gradient(from var(--frame-angle),transparent 0 7%,color-mix(in srgb,var(--tier) 78%,#fff) 11%,#fff 14%,var(--accent) 18%,transparent 24% 53%,var(--tier) 59%,transparent 65% 100%); filter:drop-shadow(0 0 6px var(--tier)); animation:frame-orbit 5.2s linear infinite; }.frame--neonrounded>.card-frame-skin::after { border-color:color-mix(in srgb,var(--tier) 42%,transparent); box-shadow:inset 0 0 12px color-mix(in srgb,var(--tier) 14%,transparent); }
.frame--neonrounded>.card-frame-skin__rail { display:none; }.frame--neonrounded>.card-frame-skin__spark { width:7px; height:7px; border:1px solid color-mix(in srgb,#fff 74%,var(--tier)); border-radius:1px; background:var(--tier); box-shadow:0 0 5px #fff,0 0 12px var(--tier); animation:frame-diamond 2.3s ease-in-out infinite alternate; }.frame--neonrounded>.card-frame-skin__spark:nth-of-type(even) { animation-delay:-1.15s; }

/* Neon Gradient: one refined, uninterrupted cyan-blue-violet light ribbon. */
.frame--neongradient { border-radius:32px; filter:none; background:linear-gradient(#07101f,#07101f) padding-box,linear-gradient(135deg,rgba(40,243,255,.7),rgba(79,104,255,.42),rgba(190,72,255,.68)) border-box; }
.frame--neongradient>.collectible-card__media { border-radius:23px; }.frame--neongradient>.card-frame-skin { inset:-3px; border-radius:34px; box-shadow:0 0 12px rgba(40,243,255,.13),0 0 28px color-mix(in srgb,var(--tier) 20%,transparent); }.frame--neongradient>.card-frame-skin::before { padding:2px; border-radius:inherit; background:conic-gradient(from var(--frame-angle),#27f4ff 0deg,#397dff 72deg,#7258ff 142deg,#d94cff 214deg,var(--tier) 286deg,#27f4ff 360deg); filter:drop-shadow(0 0 5px color-mix(in srgb,var(--tier) 62%,transparent)); animation:frame-orbit 6s linear infinite; }.frame--neongradient>.card-frame-skin::after { inset:7px; border-color:rgba(142,208,255,.27); box-shadow:inset 0 0 12px rgba(61,112,255,.11); }.frame--neongradient>.card-frame-skin__rail,.frame--neongradient>.card-frame-skin__spark { display:none; }

/* Cyberpunk: clipped geometry, asymmetrical technical brackets and scanning reflection. */
.frame--cyberpunk { border-radius:0; clip-path:polygon(10% 0,82% 0,86% 2%,100% 2%,100% 88%,96% 92%,96% 100%,14% 100%,10% 98%,0 98%,0 12%); background:linear-gradient(145deg,color-mix(in srgb,var(--tier) 24%,#091222),#050b16 27% 73%,color-mix(in srgb,var(--accent) 20%,#07101f)) padding-box,linear-gradient(135deg,var(--accent),transparent 26%,var(--tier) 48%,transparent 70%,#28f3ff) border-box; }
.frame--cyberpunk::before { border-radius:0; clip-path:inherit; }.frame--cyberpunk>.collectible-card__media { border-radius:0; clip-path:polygon(9% 0,100% 0,100% 90%,91% 100%,0 100%,0 8%); }.frame--cyberpunk>.card-frame-skin { inset:-5px; border-radius:0; clip-path:polygon(9% 0,83% 0,87% 2%,100% 2%,100% 88%,96% 92%,96% 100%,14% 100%,10% 98%,0 98%,0 11%); filter:drop-shadow(0 0 7px color-mix(in srgb,var(--tier) 58%,transparent)); }
.frame--cyberpunk>.card-frame-skin::before { padding:3px; border-radius:0; background:conic-gradient(from 28deg,var(--accent) 0 5%,transparent 5% 20%,var(--tier) 20% 28%,transparent 28% 52%,#28f3ff 52% 61%,transparent 61% 86%,var(--accent) 86% 92%,transparent 92%); animation:none; }.frame--cyberpunk>.card-frame-skin::after { inset:9px; border:1px solid color-mix(in srgb,var(--tier) 38%,transparent); border-radius:0; clip-path:polygon(8% 0,100% 0,100% 91%,92% 100%,0 100%,0 8%); box-shadow:inset 0 0 18px rgba(29,99,140,.12); }
.frame--cyberpunk>.card-frame-skin__rail { border-radius:0; background:linear-gradient(90deg,var(--accent),#fff,var(--tier)); box-shadow:0 0 6px var(--tier); animation:cyber-data-pulse 2.2s steps(4,end) infinite; }.frame--cyberpunk>.card-frame-skin__rail--top { top:1px; left:11%; width:37%; height:3px; }.frame--cyberpunk>.card-frame-skin__rail--bottom { right:6%; bottom:1px; width:27%; height:3px; }.frame--cyberpunk>.card-frame-skin__rail--left { top:17%; left:1px; width:3px; height:23%; }.frame--cyberpunk>.card-frame-skin__rail--right { right:1px; bottom:18%; width:3px; height:19%; }.frame--cyberpunk>.card-frame-skin__spark { width:9px; height:3px; border-radius:0; background:var(--tier); transform:none; animation:cyber-node 1.8s steps(2,end) infinite alternate; }.frame--cyberpunk>.card-frame-skin__spark--2,.frame--cyberpunk>.card-frame-skin__spark--6 { width:3px; height:9px; }.frame--cyberpunk.is-visible .collectible-card__shine { top:-38%; bottom:-38%; width:48%; opacity:.58; background:linear-gradient(90deg,transparent,rgba(54,233,255,.1),rgba(255,255,255,.7),rgba(171,73,255,.12),transparent); animation:cyber-card-sweep 4.8s cubic-bezier(.45,0,.55,1) infinite; }

/* Electric: jagged energy path with independently firing perimeter arcs. */
.frame--electric { border-radius:27px; clip-path:polygon(2% 0,42% 1%,48% 0,55% 1%,97% 0,100% 10%,98% 42%,100% 49%,98% 57%,100% 91%,94% 100%,57% 98%,49% 100%,42% 98%,4% 100%,0 90%,2% 58%,0 51%,2% 43%,0 9%); filter:drop-shadow(0 0 7px color-mix(in srgb,var(--tier) 45%,transparent)); background:linear-gradient(#07101f,#07101f) padding-box,linear-gradient(145deg,var(--tier),#fff 12%,var(--accent) 33%,transparent 52%,#28f3ff 72%,var(--tier)) border-box; }
.frame--electric>.collectible-card__media { border-radius:20px; clip-path:polygon(3% 0,45% 1%,49% 0,95% 2%,100% 11%,98% 42%,100% 48%,98% 55%,100% 89%,94% 100%,54% 98%,49% 100%,43% 98%,5% 100%,0 90%,2% 57%,0 50%,2% 43%,0 10%); }.frame--electric>.card-frame-skin { inset:-7px; border-radius:29px; clip-path:polygon(3% 0,42% 1%,48% 0,55% 2%,96% 0,100% 12%,98% 43%,100% 49%,98% 56%,100% 91%,94% 100%,57% 98%,49% 100%,42% 98%,4% 100%,0 89%,2% 58%,0 51%,2% 44%,0 9%); animation:electric-flicker 1.7s steps(2,end) infinite; }
.frame--electric>.card-frame-skin::before { padding:3px; background:conic-gradient(from var(--frame-angle),transparent 0 5%,#fff 7%,var(--accent) 9%,transparent 13% 31%,var(--tier) 34%,#fff 36%,transparent 40% 62%,#28f3ff 65%,var(--accent) 68%,transparent 72% 88%,var(--tier) 91%,transparent 95%); filter:drop-shadow(0 0 6px var(--tier)); animation:frame-orbit 3.1s linear infinite; }.frame--electric>.card-frame-skin::after { inset:9px; border-color:color-mix(in srgb,var(--accent) 70%,transparent); box-shadow:inset 0 0 14px color-mix(in srgb,var(--accent) 28%,transparent),0 0 13px color-mix(in srgb,var(--tier) 35%,transparent); }
.frame--electric>.card-frame-skin__spark { --arc-rotate:0deg; width:11px; height:2px; border-radius:0; transform-origin:left center; background:linear-gradient(90deg,transparent,#fff,var(--accent),transparent); box-shadow:0 0 5px #fff,0 0 10px var(--tier); animation:electric-arc 1.45s steps(3,end) infinite; }.frame--electric>.card-frame-skin__spark--1 { animation-delay:-.08s; }.frame--electric>.card-frame-skin__spark--2 { --arc-rotate:68deg; animation-delay:-.37s; }.frame--electric>.card-frame-skin__spark--3 { --arc-rotate:0deg; animation-delay:-.71s; }.frame--electric>.card-frame-skin__spark--4 { --arc-rotate:-42deg; animation-delay:-1.03s; }.frame--electric>.card-frame-skin__spark--5 { --arc-rotate:92deg; animation-delay:-.22s; }.frame--electric>.card-frame-skin__spark--6 { --arc-rotate:0deg; animation-delay:-.58s; }.frame--electric>.card-frame-skin__spark--7 { --arc-rotate:-82deg; animation-delay:-.89s; }.frame--electric>.card-frame-skin__spark--8 { --arc-rotate:0deg; animation-delay:-1.23s; }
.frame--electric>.card-frame-skin__rail { height:2px; background:linear-gradient(90deg,transparent,var(--tier),#fff,var(--accent),transparent); box-shadow:0 0 5px var(--tier); animation:electric-bolt 1.35s steps(3,end) infinite; }.frame--electric>.card-frame-skin__rail--left,.frame--electric>.card-frame-skin__rail--right { width:2px; }

/* Avatar adaptations use the same visual identities at reduced intensity. */
.avatar-frame--neonrounded::after { border-radius:28%; transform:rotate(45deg) scale(.74); box-shadow:0 0 8px color-mix(in srgb,var(--avatar-tier) 34%,transparent); }.avatar-frame--neongradient::before { padding:1.5px; animation-duration:6s; }.avatar-frame--cyberpunk::after { border-style:dashed; opacity:.66; }.avatar-frame--electric::before { filter:drop-shadow(0 0 4px var(--avatar-tier)); }

@keyframes cyber-data-pulse { 0%,100% { opacity:.42; filter:brightness(.85); } 45% { opacity:1; filter:brightness(1.55); } 58% { opacity:.58; } }
@keyframes cyber-node { from { opacity:.34; box-shadow:0 0 3px var(--tier); } to { opacity:1; box-shadow:0 0 9px var(--tier),0 0 14px var(--accent); } }
@keyframes electric-arc { 0%,18%,100% { opacity:.12; transform:rotate(var(--arc-rotate)) scaleX(.3) skewX(-30deg); } 27% { opacity:1; transform:rotate(var(--arc-rotate)) scaleX(1.45) skewX(22deg); } 39% { opacity:.28; transform:rotate(var(--arc-rotate)) scaleX(.62) skewX(-12deg); } 48% { opacity:.9; transform:rotate(var(--arc-rotate)) scaleX(1.08) skewX(12deg); } 59% { opacity:.16; transform:rotate(var(--arc-rotate)) scaleX(.42) skewX(-20deg); } }
@media (max-width:760px) { .collectible-card:has(>.card-frame-skin) { padding:8px; }.frame--neonrounded>.card-frame-skin,.frame--neongradient>.card-frame-skin { border-radius:29px; }.frame--neonrounded>.collectible-card__media,.frame--neongradient>.collectible-card__media { border-radius:19px; } }
@media (prefers-reduced-motion:reduce) { .frame--neonrounded>.card-frame-skin,.frame--neonrounded>.card-frame-skin::before,.frame--neonrounded>.card-frame-skin__spark,.frame--neongradient>.card-frame-skin::before,.frame--cyberpunk>.card-frame-skin__rail,.frame--cyberpunk>.card-frame-skin__spark,.frame--electric>.card-frame-skin,.frame--electric>.card-frame-skin::before,.frame--electric>.card-frame-skin__rail,.frame--electric>.card-frame-skin__spark { animation:none !important; } }