/* Profile vibes: critical profile frames and theme picker styles. */
.avatar-wrap {position: relative; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; overflow: visible;}
.avatar-wrap > img, .avatar-wrap > .avatar {display: block; width: 100%; height: 100%; border-radius: 50%; object-fit: cover; position: relative; z-index: 0;}
.avatar-wrap::after {content: ""; position: absolute; inset: -4px; border-radius: 50%; pointer-events: none; z-index: 1;}
.avatar-wrap[data-avatar-frame="bronze"]::after {border: 3px solid #cd7f32; box-shadow: 0 0 8px rgba(205,127,50,.50);}
.avatar-wrap[data-avatar-frame="silver"]::after {border: 3px solid #c0c0c8; box-shadow: 0 0 6px rgba(192,192,200,.40);}
.avatar-wrap[data-avatar-frame="gold"]::after {border: 3px solid #d4af37; box-shadow: 0 0 10px rgba(212,175,55,.55);}
.avatar-wrap[data-avatar-frame="platinum"]::after {border: 3px solid #e5e4e2; box-shadow: 0 0 10px rgba(173,216,230,.65);}
.avatar-wrap[data-avatar-frame="obsidian"]::after {border: 3px solid #1a1a2e; box-shadow: 0 0 8px rgba(100,100,160,.45), inset 0 0 4px rgba(120,120,180,.30);}
.avatar-wrap[data-avatar-frame="chrome"]::after {background: linear-gradient(135deg,#fff 0%,#888 25%,#fff 50%,#444 75%,#fff 100%); padding: 3px; -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 5px),#000 calc(100% - 3px)); mask: radial-gradient(farthest-side,#0000 calc(100% - 5px),#000 calc(100% - 3px));}
.avatar-wrap[data-avatar-frame="ruby"]::after {border: 3px solid #e0115f; box-shadow: 0 0 10px rgba(224,17,95,.55);}
.avatar-wrap[data-avatar-frame="emerald"]::after {border: 3px solid #50c878; box-shadow: 0 0 10px rgba(80,200,120,.55);}
.avatar-wrap[data-avatar-frame="sapphire"]::after {border: 3px solid #0f52ba; box-shadow: 0 0 10px rgba(15,82,186,.60);}
.avatar-wrap[data-avatar-frame="amethyst"]::after {border: 3px solid #9966cc; box-shadow: 0 0 10px rgba(153,102,204,.55);}
.avatar-wrap[data-avatar-frame="neon"]::after {border: 2px solid #ff0080; box-shadow: 0 0 12px #ff0080, inset 0 0 6px rgba(255,0,128,.60); animation: neon-pulse 2.2s ease-in-out infinite;}
.avatar-wrap[data-avatar-frame="fire"]::after {background: conic-gradient(from 0deg,#ff4500,#ff8c00,#ffd700,#ff4500,#ff0000,#ff4500); padding: 3px; -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 5px),#000 calc(100% - 3px)); mask: radial-gradient(farthest-side,#0000 calc(100% - 5px),#000 calc(100% - 3px)); animation: frame-spin 3s linear infinite; filter: drop-shadow(0 0 6px rgba(255,69,0,.7));}
.avatar-wrap[data-avatar-frame="ice"]::after {background: conic-gradient(from 0deg,#e0f7ff,#a8dadc,#fff,#cbeef7,#e0f7ff); padding: 3px; -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 5px),#000 calc(100% - 3px)); mask: radial-gradient(farthest-side,#0000 calc(100% - 5px),#000 calc(100% - 3px)); animation: frame-spin 10s linear infinite; filter: drop-shadow(0 0 5px rgba(168,218,220,.7));}
.avatar-wrap[data-avatar-frame="electric"]::after {border: 2px solid #00ffff; box-shadow: 0 0 14px #00ffff, 0 0 6px #fff, inset 0 0 6px rgba(0,255,255,.65); animation: electric-flicker .6s ease-in-out infinite;}
.avatar-wrap[data-avatar-frame="toxic"]::after {border: 2px solid #39ff14; box-shadow: 0 0 12px #39ff14, inset 0 0 4px rgba(57,255,20,.60); animation: toxic-pulse 2s ease-in-out infinite;}
.avatar-wrap[data-avatar-frame="aurora"]::after {background: conic-gradient(from 0deg,#ff6b9d,#c084fc,#60a5fa,#6ee7b7,#ff6b9d); padding: 3px; -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 5px),#000 calc(100% - 3px)); mask: radial-gradient(farthest-side,#0000 calc(100% - 5px),#000 calc(100% - 3px)); animation: frame-spin 6s linear infinite;}
.avatar-wrap[data-avatar-frame="holo"]::after {background: linear-gradient(45deg,#ff00aa,#00aaff,#aaff00,#ff00aa); background-size: 300% 300%; padding: 3px; -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 5px),#000 calc(100% - 3px)); mask: radial-gradient(farthest-side,#0000 calc(100% - 5px),#000 calc(100% - 3px)); animation: holo-slide 3.4s ease-in-out infinite;}
.avatar-wrap[data-avatar-frame="rainbow"]::after {background: conic-gradient(from 0deg,#ff0000,#ff8c00,#ffd700,#00ff00,#00bfff,#4b0082,#9400d3,#ff0000); padding: 3px; -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 5px),#000 calc(100% - 3px)); mask: radial-gradient(farthest-side,#0000 calc(100% - 5px),#000 calc(100% - 3px)); animation: frame-spin 5s linear infinite;}
.avatar-wrap[data-avatar-frame="galaxy"]::after {background: conic-gradient(from 0deg,#0c0032,#190061,#240090,#3500d3,#0c0032); padding: 4px; -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 6px),#000 calc(100% - 4px)); mask: radial-gradient(farthest-side,#0000 calc(100% - 6px),#000 calc(100% - 4px)); animation: frame-spin 8s linear infinite; filter: drop-shadow(0 0 5px rgba(53,0,211,.65));}
.avatar-wrap[data-avatar-frame="phoenix"]::after {background: conic-gradient(from 0deg,#ffd700,#ff4500,#ff0000,#ffd700,#ff8c00,#ffd700); padding: 4px; -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 6px),#000 calc(100% - 4px)); mask: radial-gradient(farthest-side,#0000 calc(100% - 6px),#000 calc(100% - 4px)); animation: frame-spin 2.5s linear infinite; filter: drop-shadow(0 0 8px rgba(255,69,0,.85));}
.avatar-wrap[data-avatar-frame="void"]::after {background: conic-gradient(from 0deg,#000,#2a0a4a,#000,#1a0033,#000); padding: 3px; -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 5px),#000 calc(100% - 3px)); mask: radial-gradient(farthest-side,#0000 calc(100% - 5px),#000 calc(100% - 3px)); animation: frame-spin 12s linear infinite; box-shadow: 0 0 8px rgba(106,13,173,.55);}
.avatar-wrap[data-avatar-frame="kami"]::after {background: conic-gradient(from 0deg,#ffd700,#fff,#ffd700,#ff5f1f,#ffd700); padding: 4px; -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 6px),#000 calc(100% - 4px)); mask: radial-gradient(farthest-side,#0000 calc(100% - 6px),#000 calc(100% - 4px)); animation: frame-spin 4s linear infinite; filter: drop-shadow(0 0 4px rgba(255,215,0,.60));}
.avatar-wrap[data-avatar-frame="sakura"]::after {background: conic-gradient(from 0deg,#ffb7c5,#ff9aa8,#ffd1dc,#ffc0cb,#ffb7c5); padding: 3px; -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 5px),#000 calc(100% - 3px)); mask: radial-gradient(farthest-side,#0000 calc(100% - 5px),#000 calc(100% - 3px)); animation: frame-spin 7s linear infinite; filter: drop-shadow(0 0 5px rgba(255,183,197,.65));}
.avatar-wrap[data-avatar-frame="royal"]::after {background: conic-gradient(from 0deg,#4a148c,#ffd700,#7b1fa2,#ffd700,#4a148c); padding: 4px; -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 6px),#000 calc(100% - 4px)); mask: radial-gradient(farthest-side,#0000 calc(100% - 6px),#000 calc(100% - 4px)); animation: frame-spin 5s linear infinite; filter: drop-shadow(0 0 5px rgba(123,31,162,.7));}

@keyframes neon-pulse {50% {box-shadow: 0 0 18px #ff0080, inset 0 0 10px rgba(255,0,128,.9);}}
@keyframes frame-spin {to {transform: rotate(360deg);}}
@keyframes holo-slide {50% {background-position: 100% 100%;}}
@keyframes electric-flicker {0%,100% {opacity:1;} 50% {opacity:.75; box-shadow: 0 0 22px #00ffff, 0 0 8px #fff, inset 0 0 8px rgba(0,255,255,.9);}}
@keyframes toxic-pulse {50% {box-shadow: 0 0 18px #39ff14, inset 0 0 8px rgba(57,255,20,.9);}}

.uprofile-editor__frames,
.uprofile-editor__themes {display: grid; grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)); gap: 12px; margin-top: 8px;}
.uprofile-editor__frame,
.uprofile-editor__theme {position: relative; cursor: pointer; padding: 8px; border: 2px solid transparent; border-radius: 10px; background: var(--bg-lighter, #1a1a1a); transition: border-color .15s ease, transform .15s ease; display: flex; flex-direction: column; align-items: center; gap: 6px; min-height: 116px;}
.uprofile-editor__frame {min-height: 130px;}
.uprofile-editor__frame:hover,
.uprofile-editor__theme:hover {transform: translateY(-1px);}
.uprofile-editor__frame.is-active,
.uprofile-editor__theme.is-active {border-color: var(--accent, #e34c00);}
.uprofile-editor__frame-preview {position: relative; width: 72px; height: 72px;}
.uprofile-editor__frame-preview img {width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block;}
.uprofile-editor__frame-title,
.uprofile-editor__theme-title {font-size: 11px; text-align: center; color: var(--tt, #ddd); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%;}
.uprofile-editor__frame-loading,
.uprofile-editor__frame-error,
.uprofile-editor__theme-loading,
.uprofile-editor__theme-error {font-size: 12px; color: var(--tt-darker, #888); padding: 12px; text-align: center;}
.uprofile-editor__frame-error,
.uprofile-editor__theme-error {color: #e34c00;}

.uprofile-editor__themes {grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));}
.uprofile-editor__theme-preview {position: relative; width: 100%; height: 72px; border-radius: 8px; overflow: hidden; background: linear-gradient(135deg, var(--theme-preview-accent), #121212);}
.uprofile-editor__theme-preview::before {content: ""; position: absolute; left: 10px; right: 10px; bottom: 9px; height: 18px; border-radius: 5px; background: rgba(0,0,0,.35);}
.uprofile-editor__theme-dot {position: absolute; left: 12px; bottom: 12px; width: 26px; height: 26px; border-radius: 50%; background: var(--theme-preview-accent); box-shadow: 0 0 12px rgba(255,163,50,.45);}
.profile-theme-preview--cyber {background: linear-gradient(90deg, rgba(0,229,255,.28) 1px, transparent 1px) 0 0/18px 18px, linear-gradient(135deg,#060912,#14294a);}
.profile-theme-preview--sakura {background: radial-gradient(circle at 24% 28%, rgba(255,215,228,.8) 0 2px, transparent 3px), linear-gradient(135deg,#3b1829,#8f3c5c);}
.profile-theme-preview--manga {background: radial-gradient(circle, rgba(255,255,255,.28) 1px, transparent 2px) 0 0/7px 7px, linear-gradient(135deg,#050505,#252525);}
.profile-theme-preview--retro {background: radial-gradient(circle, rgba(255,255,255,.3) 1px, transparent 2px) 0 0/9px 9px, linear-gradient(135deg,#d7372f 0%,#ffcc33 52%,#1f6feb 100%);}
.profile-theme-preview--hero {background: linear-gradient(115deg, transparent 0 42%, rgba(255,61,61,.45) 42% 56%, transparent 56%), linear-gradient(135deg,#08090d,#2a303c);}
.profile-theme-preview--ice {background: linear-gradient(135deg, rgba(255,255,255,.35) 0 1px, transparent 1px) 0 0/16px 16px, linear-gradient(135deg,#062432,#0d5870);}
.profile-theme-preview--royal {background: linear-gradient(90deg, rgba(212,175,55,.45) 0 2px, transparent 2px 18px) 0 0/36px 36px, linear-gradient(135deg,#221232,#4c1f70);}
.profile-theme-preview--void {background: radial-gradient(ellipse at 50% 20%, rgba(155,92,255,.45), transparent 58%), linear-gradient(135deg,#020205,#16072e);}

@media (prefers-reduced-motion: reduce) {
	.avatar-wrap::after {animation: none !important;}
}

/* Stronger free profile vibes. Loaded after styles.css, so it can safely override presets. */
.uprofile {
	--profile-accent: var(--accent, #ffa332);
	--profile-panel: var(--bg-lighter, #171717);
	--profile-panel-2: var(--bg-lighter, #171717);
	--profile-soft: rgba(255,163,50,.12);
	--profile-border: rgba(255,163,50,.24);
	--profile-cover: linear-gradient(135deg,#1b1308 0%,#2a1800 34%,#110d08 100%);
	--profile-fx: radial-gradient(circle at 18% 22%, rgba(255,163,50,.24), transparent 34%), radial-gradient(circle at 82% 18%, rgba(245,0,87,.14), transparent 32%);
	--profile-pattern: linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px) 0 0/22px 22px;
	--profile-shadow: 0 18px 42px rgba(0,0,0,.24);
}
.uprofile__hero {border: 1px solid var(--profile-border); box-shadow: var(--profile-shadow);}
.uprofile__cover {background: var(--profile-cover);}
.uprofile__cover::before {background: var(--profile-fx); opacity: 1;}
.uprofile__cover::after {background: var(--profile-pattern); opacity: .82;}
.uprofile__avatar {box-shadow: 0 0 0 4px rgba(0,0,0,.20), 0 0 28px var(--profile-soft);}
.uprofile__name {text-shadow: 0 0 18px var(--profile-soft);}

.uprofile[data-profile-theme] .uprofile__hero {background: var(--profile-panel); border-color: var(--profile-border); box-shadow: var(--profile-shadow);}
.uprofile[data-profile-theme] .uprofile__cover {background: var(--profile-cover);}
.uprofile[data-profile-theme] .uprofile__cover::before {background: var(--profile-fx); opacity: 1;}
.uprofile[data-profile-theme] .uprofile__cover::after {background: var(--profile-pattern); opacity: .92;}
.uprofile[data-profile-theme] .uprofile__cover-gradient {background: linear-gradient(to top, var(--profile-panel) 0%, rgba(0,0,0,0) 100%);}
.uprofile[data-profile-theme] .uprofile__meta,
.uprofile[data-profile-theme] .uprofile__section--card,
.uprofile[data-profile-theme] .uprofile__stat {background: var(--profile-panel-2); border-color: var(--profile-border);}
.uprofile[data-profile-theme] .uprofile__group,
.uprofile[data-profile-theme] .uprofile__stat-icon,
.uprofile[data-profile-theme] .uprofile__section-title .fal {color: var(--profile-accent);}
.uprofile[data-profile-theme] .uprof-pbar > div,
.uprofile[data-profile-theme] .uprofile__btn-edit,
.uprofile[data-profile-theme] .uprofile__btn-pm {background: var(--profile-accent);}
.uprofile[data-profile-theme] .uprofile__btn-edit,
.uprofile[data-profile-theme] .uprofile__btn-pm {box-shadow: 0 8px 22px var(--profile-soft);}

.uprofile[data-profile-theme="cyber"] {--profile-accent:#00e5ff; --profile-panel:#070b13; --profile-panel-2:#0e1420; --profile-soft:rgba(0,229,255,.34); --profile-border:rgba(0,229,255,.34); --profile-cover:linear-gradient(135deg,#03060d 0%,#102a4e 52%,#1b0824 100%); --profile-fx:radial-gradient(circle at 18% 34%, rgba(0,229,255,.38), transparent 34%), radial-gradient(circle at 80% 20%, rgba(255,45,149,.28), transparent 32%); --profile-pattern:linear-gradient(90deg, rgba(0,229,255,.18) 1px, transparent 1px) 0 0/26px 26px, linear-gradient(0deg, rgba(255,45,149,.11) 1px, transparent 1px) 0 0/26px 26px; --profile-shadow:0 0 0 1px rgba(0,229,255,.18), 0 22px 54px rgba(0,0,0,.44);}
.uprofile[data-profile-theme="sakura"] {--profile-accent:#ff8fb3; --profile-panel:#22151d; --profile-panel-2:#281924; --profile-soft:rgba(255,143,179,.32); --profile-border:rgba(255,143,179,.32); --profile-cover:linear-gradient(135deg,#2d1420 0%,#71334e 56%,#160c12 100%); --profile-fx:radial-gradient(circle at 18% 28%, rgba(255,220,231,.45) 0 2px, transparent 3px), radial-gradient(circle at 76% 36%, rgba(255,143,179,.45) 0 3px, transparent 4px); --profile-pattern:linear-gradient(120deg, rgba(255,255,255,.08), transparent 45%);}
.uprofile[data-profile-theme="manga"] {--profile-accent:#f2f2f2; --profile-panel:#111; --profile-panel-2:#171717; --profile-soft:rgba(255,255,255,.22); --profile-border:rgba(255,255,255,.18); --profile-cover:linear-gradient(135deg,#050505 0%,#222 58%,#080808 100%); --profile-fx:radial-gradient(circle, rgba(255,255,255,.22) 1px, transparent 1px) 0 0/9px 9px; --profile-pattern:repeating-linear-gradient(-18deg, rgba(255,255,255,.10) 0 1px, transparent 1px 7px);}
.uprofile[data-profile-theme="retro"] {--profile-accent:#ffcc33; --profile-panel:#24150d; --profile-panel-2:#2a1b12; --profile-soft:rgba(255,204,51,.28); --profile-border:rgba(255,204,51,.34); --profile-cover:linear-gradient(135deg,#d7372f 0%,#ffcc33 50%,#1f6feb 100%); --profile-fx:radial-gradient(circle, rgba(255,255,255,.28) 1px, transparent 2px) 0 0/12px 12px; --profile-pattern:linear-gradient(135deg, rgba(0,0,0,.20) 0 12%, transparent 12% 24%, rgba(0,0,0,.18) 24% 36%, transparent 36%);}
.uprofile[data-profile-theme="hero"] {--profile-accent:#ff3d3d; --profile-panel:#10131a; --profile-panel-2:#171b24; --profile-soft:rgba(255,61,61,.30); --profile-border:rgba(255,61,61,.30); --profile-cover:linear-gradient(135deg,#07090e 0%,#242b38 58%,#08090d 100%); --profile-fx:linear-gradient(115deg, transparent 0 40%, rgba(255,61,61,.36) 40% 55%, transparent 55%), radial-gradient(circle at 80% 22%, rgba(255,255,255,.12), transparent 28%); --profile-pattern:linear-gradient(90deg, rgba(255,255,255,.05) 0 2px, transparent 2px 18px);}
.uprofile[data-profile-theme="ice"] {--profile-accent:#9eeaff; --profile-panel:#07151c; --profile-panel-2:#0d1d27; --profile-soft:rgba(158,234,255,.32); --profile-border:rgba(158,234,255,.32); --profile-cover:linear-gradient(135deg,#04202d 0%,#0d5870 56%,#06121b 100%); --profile-fx:radial-gradient(circle at 28% 28%, rgba(255,255,255,.32), transparent 28%), radial-gradient(circle at 80% 34%, rgba(158,234,255,.30), transparent 30%); --profile-pattern:linear-gradient(135deg, rgba(255,255,255,.18) 0 1px, transparent 1px) 0 0/22px 22px;}
.uprofile[data-profile-theme="royal"] {--profile-accent:#d4af37; --profile-panel:#17101f; --profile-panel-2:#21182d; --profile-soft:rgba(212,175,55,.30); --profile-border:rgba(212,175,55,.38); --profile-cover:linear-gradient(135deg,#221232 0%,#572081 52%,#130b1d 100%); --profile-fx:radial-gradient(circle at 50% 20%, rgba(212,175,55,.34), transparent 32%); --profile-pattern:linear-gradient(90deg, rgba(212,175,55,.26) 0 2px, transparent 2px 22px) 0 0/44px 44px;}
.uprofile[data-profile-theme="void"] {--profile-accent:#9b5cff; --profile-panel:#08070d; --profile-panel-2:#100d18; --profile-soft:rgba(155,92,255,.34); --profile-border:rgba(155,92,255,.30); --profile-cover:linear-gradient(135deg,#020205 0%,#16072e 52%,#020205 100%); --profile-fx:radial-gradient(ellipse at 50% 20%, rgba(155,92,255,.34), transparent 58%), radial-gradient(circle at 18% 70%, rgba(50,12,110,.28), transparent 35%); --profile-pattern:radial-gradient(circle, rgba(255,255,255,.16) 1px, transparent 1px) 0 0/24px 24px;}
.uprofile[data-profile-theme="glitch"] {--profile-accent:#ff2bd6; --profile-panel:#080811; --profile-panel-2:#11111e; --profile-soft:rgba(255,43,214,.34); --profile-border:rgba(0,240,255,.28); --profile-cover:linear-gradient(90deg,#05050b 0%,#191034 44%,#071b2d 100%); --profile-fx:linear-gradient(90deg, rgba(255,43,214,.34) 0 8%, transparent 8% 18%, rgba(0,240,255,.26) 18% 22%, transparent 22%); --profile-pattern:repeating-linear-gradient(0deg, rgba(255,255,255,.12) 0 1px, transparent 1px 5px);}
.uprofile[data-profile-theme="matrix"] {--profile-accent:#39ff14; --profile-panel:#020902; --profile-panel-2:#061006; --profile-soft:rgba(57,255,20,.30); --profile-border:rgba(57,255,20,.28); --profile-cover:linear-gradient(135deg,#020602 0%,#08200a 58%,#010301 100%); --profile-fx:linear-gradient(180deg, rgba(57,255,20,.28), transparent 70%); --profile-pattern:repeating-linear-gradient(90deg, rgba(57,255,20,.18) 0 1px, transparent 1px 18px);}
.uprofile[data-profile-theme="inferno"] {--profile-accent:#ff5a1f; --profile-panel:#170706; --profile-panel-2:#220d08; --profile-soft:rgba(255,90,31,.36); --profile-border:rgba(255,90,31,.36); --profile-cover:linear-gradient(135deg,#280400 0%,#a9280f 48%,#ffb000 100%); --profile-fx:radial-gradient(circle at 30% 70%, rgba(255,211,74,.38), transparent 34%), radial-gradient(circle at 78% 24%, rgba(255,30,0,.34), transparent 32%); --profile-pattern:linear-gradient(135deg, rgba(0,0,0,.22), transparent 50%);}
.uprofile[data-profile-theme="ocean"] {--profile-accent:#2ee9ff; --profile-panel:#06151f; --profile-panel-2:#0a202d; --profile-soft:rgba(46,233,255,.30); --profile-border:rgba(46,233,255,.30); --profile-cover:linear-gradient(135deg,#03111f 0%,#064b6b 48%,#021019 100%); --profile-fx:radial-gradient(circle at 24% 42%, rgba(46,233,255,.26), transparent 35%), radial-gradient(circle at 78% 30%, rgba(64,115,255,.24), transparent 34%); --profile-pattern:repeating-linear-gradient(-18deg, rgba(255,255,255,.08) 0 2px, transparent 2px 14px);}
.uprofile[data-profile-theme="sunset"] {--profile-accent:#ff8a3d; --profile-panel:#211018; --profile-panel-2:#29151f; --profile-soft:rgba(255,138,61,.32); --profile-border:rgba(255,138,61,.34); --profile-cover:linear-gradient(135deg,#ff6f3c 0%,#d83f87 48%,#2f1b78 100%); --profile-fx:radial-gradient(circle at 20% 25%, rgba(255,222,89,.38), transparent 30%); --profile-pattern:linear-gradient(120deg, rgba(255,255,255,.14), transparent 42%);}
.uprofile[data-profile-theme="candy"] {--profile-accent:#ff5fb8; --profile-panel:#21131f; --profile-panel-2:#2b1a28; --profile-soft:rgba(255,95,184,.34); --profile-border:rgba(255,95,184,.34); --profile-cover:linear-gradient(135deg,#ff5fb8 0%,#7bdff2 50%,#f7d6e0 100%); --profile-fx:radial-gradient(circle at 24% 32%, rgba(255,255,255,.45) 0 4px, transparent 5px), radial-gradient(circle at 70% 36%, rgba(255,255,255,.34) 0 3px, transparent 4px); --profile-pattern:repeating-linear-gradient(45deg, rgba(255,255,255,.24) 0 8px, transparent 8px 18px);}
.uprofile[data-profile-theme="samurai"] {--profile-accent:#ff2e2e; --profile-panel:#120c0c; --profile-panel-2:#1c1111; --profile-soft:rgba(255,46,46,.34); --profile-border:rgba(255,46,46,.34); --profile-cover:linear-gradient(135deg,#090707 0%,#5b1212 52%,#120606 100%); --profile-fx:radial-gradient(circle at 76% 28%, rgba(255,46,46,.38), transparent 30%); --profile-pattern:linear-gradient(105deg, transparent 0 44%, rgba(255,255,255,.12) 44% 46%, transparent 46%);}
.uprofile[data-profile-theme="noir"] {--profile-accent:#f5f5f5; --profile-panel:#0d0d0d; --profile-panel-2:#171717; --profile-soft:rgba(255,255,255,.18); --profile-border:rgba(255,255,255,.18); --profile-cover:linear-gradient(135deg,#050505 0%,#2a2a2a 55%,#080808 100%); --profile-fx:linear-gradient(90deg, rgba(255,255,255,.12), transparent 32%); --profile-pattern:repeating-linear-gradient(90deg, rgba(255,255,255,.09) 0 1px, transparent 1px 10px);}
.uprofile[data-profile-theme="cosmic"] {--profile-accent:#b275ff; --profile-panel:#0a0714; --profile-panel-2:#120d20; --profile-soft:rgba(178,117,255,.34); --profile-border:rgba(178,117,255,.32); --profile-cover:linear-gradient(135deg,#05030b 0%,#2a1352 48%,#080516 100%); --profile-fx:radial-gradient(circle at 50% 26%, rgba(178,117,255,.38), transparent 32%), radial-gradient(circle at 80% 68%, rgba(0,209,255,.20), transparent 32%); --profile-pattern:radial-gradient(circle, rgba(255,255,255,.22) 1px, transparent 1px) 0 0/18px 18px;}
.uprofile[data-profile-theme="emerald"] {--profile-accent:#50c878; --profile-panel:#07130c; --profile-panel-2:#0e1d14; --profile-soft:rgba(80,200,120,.30); --profile-border:rgba(80,200,120,.30); --profile-cover:linear-gradient(135deg,#05100a 0%,#0f4b2c 52%,#07110b 100%); --profile-fx:radial-gradient(circle at 24% 34%, rgba(80,200,120,.36), transparent 32%); --profile-pattern:linear-gradient(135deg, rgba(255,255,255,.09) 0 1px, transparent 1px) 0 0/18px 18px;}
.uprofile[data-profile-theme="thunder"] {--profile-accent:#ffd24a; --profile-panel:#14120b; --profile-panel-2:#1d1a10; --profile-soft:rgba(255,210,74,.34); --profile-border:rgba(255,210,74,.36); --profile-cover:linear-gradient(135deg,#16120a 0%,#4b3a11 45%,#071a2b 100%); --profile-fx:linear-gradient(120deg, transparent 0 45%, rgba(255,210,74,.55) 45% 49%, transparent 49% 58%, rgba(46,233,255,.28) 58% 61%, transparent 61%); --profile-pattern:repeating-linear-gradient(0deg, rgba(255,255,255,.08) 0 1px, transparent 1px 12px);}
.uprofile[data-profile-theme="blood"] {--profile-accent:#d81b60; --profile-panel:#12070b; --profile-panel-2:#1d0c12; --profile-soft:rgba(216,27,96,.34); --profile-border:rgba(216,27,96,.34); --profile-cover:linear-gradient(135deg,#120509 0%,#5d1027 55%,#050203 100%); --profile-fx:radial-gradient(circle at 72% 28%, rgba(216,27,96,.40), transparent 30%); --profile-pattern:radial-gradient(circle at 60% 40%, rgba(255,255,255,.08), transparent 22%);}
.uprofile[data-profile-theme="paper"] {--profile-accent:#111111; --profile-panel:#f4efe4; --profile-panel-2:#fffaf0; --profile-soft:rgba(0,0,0,.14); --profile-border:rgba(0,0,0,.18); --profile-cover:linear-gradient(135deg,#fff7df 0%,#e8dcc6 54%,#f7f1e5 100%); --profile-fx:radial-gradient(circle, rgba(0,0,0,.10) 1px, transparent 1px) 0 0/8px 8px; --profile-pattern:repeating-linear-gradient(0deg, rgba(0,0,0,.08) 0 1px, transparent 1px 9px); color:#111;}
.uprofile[data-profile-theme="paper"] .uprofile__cover-gradient {background: linear-gradient(to top, #f4efe4 0%, rgba(244,239,228,0) 100%);}
.uprofile[data-profile-theme="synth"] {--profile-accent:#ff3df2; --profile-panel:#0a0718; --profile-panel-2:#141026; --profile-soft:rgba(255,61,242,.34); --profile-border:rgba(255,61,242,.30); --profile-cover:linear-gradient(135deg,#12092b 0%,#ff3df2 48%,#00d5ff 100%); --profile-fx:radial-gradient(circle at 20% 28%, rgba(0,213,255,.34), transparent 32%), radial-gradient(circle at 78% 22%, rgba(255,61,242,.34), transparent 32%); --profile-pattern:linear-gradient(0deg, rgba(255,255,255,.16) 1px, transparent 1px) 0 0/100% 18px;}
.uprofile[data-profile-theme="forest"] {--profile-accent:#74d680; --profile-panel:#07120a; --profile-panel-2:#0f1d12; --profile-soft:rgba(116,214,128,.30); --profile-border:rgba(116,214,128,.30); --profile-cover:linear-gradient(135deg,#061109 0%,#1e4b27 54%,#08140b 100%); --profile-fx:radial-gradient(circle at 18% 32%, rgba(116,214,128,.32), transparent 28%); --profile-pattern:repeating-linear-gradient(45deg, rgba(255,255,255,.08) 0 1px, transparent 1px 12px);}
.uprofile[data-profile-theme="solar"] {--profile-accent:#ffd166; --profile-panel:#191005; --profile-panel-2:#24180a; --profile-soft:rgba(255,209,102,.34); --profile-border:rgba(255,209,102,.38); --profile-cover:radial-gradient(circle at 50% 28%, rgba(255,209,102,.58), transparent 28%), linear-gradient(135deg,#281500 0%,#7b3f00 54%,#120800 100%); --profile-fx:radial-gradient(circle at 50% 28%, rgba(255,255,255,.26), transparent 35%); --profile-pattern:conic-gradient(from 0deg at 50% 30%, rgba(255,209,102,.18), transparent 18%, rgba(255,209,102,.14) 25%, transparent 34%);}

.uprofile-editor__themes {grid-template-columns: repeat(auto-fill, minmax(148px, 1fr)); gap: 14px;}
.uprofile-editor__theme {min-height: 138px; padding: 9px; border-radius: 10px; background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01)), var(--bg-lighter, #171717);}
.uprofile-editor__theme:hover {transform: translateY(-2px); border-color: rgba(255,255,255,.18);}
.uprofile-editor__theme.is-active {border-color: var(--theme-preview-accent, var(--accent, #ffa332)); box-shadow: 0 0 0 1px rgba(255,255,255,.08), 0 0 22px rgba(255,163,50,.16);}
.uprofile-editor__theme-preview {height: 92px; border-radius: 8px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.10);}
.uprofile-editor__theme-preview::before {left: 12px; right: 12px; bottom: 12px; height: 24px; border-radius: 6px; background: rgba(0,0,0,.38); box-shadow: 0 -28px 42px rgba(255,255,255,.08);}
.uprofile-editor__theme-preview::after {content: ""; position: absolute; left: 48px; right: 18px; bottom: 20px; height: 3px; border-radius: 8px; background: rgba(255,255,255,.42); box-shadow: 0 8px 0 rgba(255,255,255,.22);}
.uprofile-editor__theme-dot {left: 16px; bottom: 16px; width: 28px; height: 28px; border: 2px solid rgba(255,255,255,.30);}
.uprofile-editor__theme-title {font-size: 12px; font-weight: 700;}

.profile-theme-preview--glitch {background: linear-gradient(90deg, rgba(255,43,214,.55) 0 12%, transparent 12% 18%, rgba(0,240,255,.42) 18% 24%, transparent 24%), repeating-linear-gradient(0deg, rgba(255,255,255,.16) 0 1px, transparent 1px 5px), linear-gradient(135deg,#05050b,#191034);}
.profile-theme-preview--matrix {background: repeating-linear-gradient(90deg, rgba(57,255,20,.30) 0 1px, transparent 1px 14px), linear-gradient(135deg,#020602,#08200a);}
.profile-theme-preview--inferno {background: radial-gradient(circle at 30% 70%, rgba(255,211,74,.45), transparent 34%), linear-gradient(135deg,#280400,#a9280f 52%,#ffb000);}
.profile-theme-preview--ocean {background: repeating-linear-gradient(-18deg, rgba(255,255,255,.10) 0 2px, transparent 2px 14px), linear-gradient(135deg,#03111f,#064b6b);}
.profile-theme-preview--sunset {background: radial-gradient(circle at 20% 25%, rgba(255,222,89,.45), transparent 30%), linear-gradient(135deg,#ff6f3c,#d83f87 48%,#2f1b78);}
.profile-theme-preview--candy {background: radial-gradient(circle at 24% 32%, rgba(255,255,255,.58) 0 4px, transparent 5px), repeating-linear-gradient(45deg, rgba(255,255,255,.30) 0 8px, transparent 8px 18px), linear-gradient(135deg,#ff5fb8,#7bdff2);}
.profile-theme-preview--samurai {background: linear-gradient(105deg, transparent 0 44%, rgba(255,255,255,.16) 44% 46%, transparent 46%), linear-gradient(135deg,#090707,#5b1212);}
.profile-theme-preview--noir {background: repeating-linear-gradient(90deg, rgba(255,255,255,.12) 0 1px, transparent 1px 10px), linear-gradient(135deg,#050505,#2a2a2a);}
.profile-theme-preview--cosmic {background: radial-gradient(circle, rgba(255,255,255,.28) 1px, transparent 1px) 0 0/16px 16px, linear-gradient(135deg,#05030b,#2a1352);}
.profile-theme-preview--emerald {background: linear-gradient(135deg, rgba(255,255,255,.12) 0 1px, transparent 1px) 0 0/18px 18px, linear-gradient(135deg,#05100a,#0f4b2c);}
.profile-theme-preview--thunder {background: linear-gradient(120deg, transparent 0 45%, rgba(255,210,74,.70) 45% 49%, transparent 49% 58%, rgba(46,233,255,.42) 58% 61%, transparent 61%), linear-gradient(135deg,#16120a,#071a2b);}
.profile-theme-preview--blood {background: radial-gradient(circle at 72% 28%, rgba(216,27,96,.55), transparent 30%), linear-gradient(135deg,#120509,#5d1027);}
.profile-theme-preview--paper {background: radial-gradient(circle, rgba(0,0,0,.16) 1px, transparent 1px) 0 0/8px 8px, linear-gradient(135deg,#fff7df,#e8dcc6);}
.profile-theme-preview--synth {background: linear-gradient(0deg, rgba(255,255,255,.18) 1px, transparent 1px) 0 0/100% 18px, linear-gradient(135deg,#12092b,#ff3df2 48%,#00d5ff);}
.profile-theme-preview--forest {background: repeating-linear-gradient(45deg, rgba(255,255,255,.10) 0 1px, transparent 1px 12px), linear-gradient(135deg,#061109,#1e4b27);}
.profile-theme-preview--solar {background: conic-gradient(from 0deg at 50% 30%, rgba(255,209,102,.32), transparent 18%, rgba(255,209,102,.26) 25%, transparent 34%), radial-gradient(circle at 50% 28%, rgba(255,209,102,.70), transparent 28%), linear-gradient(135deg,#281500,#7b3f00);}

/* Profile designer pass: make the first viewport feel like a character poster. */
.uprofile {
	max-width: 980px;
	position: relative;
}
.uprofile::before {
	content: "";
	position: absolute;
	inset: -18px -18px auto;
	height: 310px;
	pointer-events: none;
	background:
		radial-gradient(circle at 14% 18%, var(--profile-soft), transparent 32%),
		radial-gradient(circle at 82% 12%, rgba(255,255,255,.08), transparent 28%);
	filter: blur(2px);
	opacity: .9;
	z-index: -1;
}
.uprofile__hero {
	border-radius: 10px;
	min-height: 300px;
	overflow: hidden;
	isolation: isolate;
	background:
		linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,0)),
		var(--profile-panel);
}
.uprofile__hero::before,
.uprofile__hero::after {
	content: "";
	position: absolute;
	pointer-events: none;
	z-index: 1;
}
.uprofile__hero::before {
	inset: 0;
	background:
		linear-gradient(110deg, transparent 0 48%, rgba(255,255,255,.10) 48% 50%, transparent 50%),
		linear-gradient(90deg, rgba(0,0,0,.28), transparent 38%, rgba(0,0,0,.34));
	mix-blend-mode: screen;
	opacity: .58;
}
.uprofile__hero::after {
	left: 24px;
	right: 24px;
	bottom: 20px;
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--profile-accent), transparent);
	opacity: .55;
}
.uprofile__cover {
	height: 205px;
	transform: translateZ(0);
}
.uprofile__cover-art {
	position: absolute;
	inset: -26px;
	width: calc(100% + 52px);
	height: calc(100% + 52px);
	object-fit: cover;
	filter: blur(24px) saturate(1.35) contrast(1.08);
	transform: scale(1.08);
	opacity: .24;
	z-index: 0;
}
.uprofile__cover-name {
	position: absolute;
	right: 26px;
	bottom: 34px;
	max-width: 72%;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	font-size: clamp(46px, 9vw, 118px);
	line-height: .82;
	font-weight: 900;
	text-transform: uppercase;
	color: rgba(255,255,255,.105);
	text-shadow: 0 0 32px var(--profile-soft);
	pointer-events: none;
	z-index: 2;
}
.uprofile__cover::before {
	background:
		var(--profile-fx),
		radial-gradient(circle at 50% -18%, rgba(255,255,255,.20), transparent 32%);
	z-index: 1;
}
.uprofile__cover::after {
	background:
		var(--profile-pattern),
		linear-gradient(135deg, rgba(255,255,255,.08) 0 1px, transparent 1px) 0 0/42px 42px;
	opacity: .75;
	z-index: 2;
}
.uprofile__cover-gradient {
	height: 118px;
	background:
		linear-gradient(to top, var(--profile-panel) 0%, rgba(0,0,0,.60) 54%, transparent 100%);
	z-index: 3;
}
.uprofile__hero-body {
	margin: -86px 22px 0;
	padding: 20px;
	align-items: flex-end;
	border: 1px solid rgba(255,255,255,.12);
	border-radius: 10px;
	background:
		linear-gradient(135deg, rgba(255,255,255,.13), rgba(255,255,255,.04)),
		linear-gradient(90deg, rgba(0,0,0,.34), rgba(0,0,0,.08));
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	box-shadow: 0 22px 44px rgba(0,0,0,.34);
	z-index: 3;
}
.uprofile__avatar-wrap {
	align-self: center;
}
.uprofile__avatar {
	width: 124px;
	height: 124px;
	border: 4px solid rgba(255,255,255,.20);
	background:
		linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,.02)),
		var(--profile-panel-2);
	box-shadow:
		0 0 0 8px rgba(0,0,0,.22),
		0 0 44px var(--profile-soft),
		0 18px 34px rgba(0,0,0,.44);
}
.uprofile__status-dot {
	right: 8px;
	bottom: 8px;
	width: 18px;
	height: 18px;
	border-color: rgba(0,0,0,.55);
}
.uprofile__identity {
	padding-bottom: 8px;
}
.uprofile__name {
	font-size: 34px;
	line-height: 1.05;
	letter-spacing: 0;
	color: #fff;
	text-shadow: 0 2px 16px rgba(0,0,0,.50), 0 0 26px var(--profile-soft);
}
.uprofile__group {
	margin-top: 8px;
	font-size: 13px;
	color: var(--profile-accent);
}
.uprofile__group b,
.uprofile__group span {
	color: var(--profile-accent) !important;
}
.uprofile__status-label {
	margin-top: 10px;
	border: 1px solid rgba(76,175,80,.35);
	border-radius: 999px;
	background: rgba(76,175,80,.14);
	color: #8ff0a4;
}
.uprofile__hero-actions {
	align-self: center;
}
.uprofile__btn-edit,
.uprofile__btn-pm,
.uprofile__btn-home {
	border-radius: 10px;
	border: 1px solid rgba(255,255,255,.14);
	box-shadow: 0 12px 24px rgba(0,0,0,.26);
}
.uprofile__btn-home {
	background: rgba(255,255,255,.10);
	color: #fff;
}
.uprofile__btn-home:hover {
	background: var(--profile-accent);
	color: #050505;
}
.uprofile__stats {
	gap: 12px;
	margin-top: 18px;
	background: transparent;
	border-radius: 0;
	overflow: visible;
}
.uprofile__stat {
	position: relative;
	align-items: flex-start;
	min-height: 112px;
	padding: 18px;
	border: 1px solid var(--profile-border);
	border-radius: 10px;
	background:
		linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.02)),
		var(--profile-panel-2);
	box-shadow: 0 14px 30px rgba(0,0,0,.18);
	overflow: hidden;
}
.uprofile__stat::after {
	content: "";
	position: absolute;
	right: -24px;
	top: -30px;
	width: 86px;
	height: 86px;
	border-radius: 50%;
	background: var(--profile-soft);
	filter: blur(4px);
	opacity: .72;
}
.uprofile__stat-icon {
	font-size: 20px;
	color: var(--profile-accent);
	opacity: 1;
}
.uprofile__stat-value {
	position: relative;
	z-index: 1;
	font-size: 30px;
	color: #fff;
}
.uprofile__stat-label {
	position: relative;
	z-index: 1;
	color: rgba(255,255,255,.58);
	text-align: left;
}
.uprofile__meta,
.uprofile__section--card,
.uprofile-editor__section {
	border: 1px solid var(--profile-border);
	border-radius: 10px;
	background:
		linear-gradient(135deg, rgba(255,255,255,.07), rgba(255,255,255,.02)),
		var(--profile-panel-2);
	box-shadow: 0 14px 30px rgba(0,0,0,.16);
}
.uprofile__meta {
	padding: 22px;
}
.uprofile__meta-grid {
	gap: 14px;
}
.uprofile__meta-item {
	min-height: 66px;
	padding: 12px;
	border-radius: 8px;
	background: rgba(255,255,255,.035);
}
.uprofile__meta-icon {
	background: var(--profile-soft);
	color: var(--profile-accent);
}
.uprofile__meta-label {
	color: rgba(255,255,255,.48);
}
.uprofile__meta-value {
	color: rgba(255,255,255,.88);
}
.uprofile__section-title {
	color: #fff;
}
.uprofile[data-profile-theme="candy"] {
	--profile-accent:#ff4fd8;
	--profile-panel:#0b1020;
	--profile-panel-2:#11172a;
	--profile-soft:rgba(255,79,216,.34);
	--profile-border:rgba(123,223,242,.30);
	--profile-cover:
		radial-gradient(circle at 20% 24%, rgba(255,95,184,.70), transparent 26%),
		radial-gradient(circle at 74% 18%, rgba(123,223,242,.58), transparent 28%),
		linear-gradient(135deg,#12142c 0%,#3c1752 46%,#0b2e44 100%);
	--profile-fx:
		radial-gradient(circle at 24% 32%, rgba(255,255,255,.34) 0 4px, transparent 5px),
		linear-gradient(115deg, transparent 0 42%, rgba(255,79,216,.34) 42% 50%, transparent 50%);
	--profile-pattern:
		linear-gradient(90deg, rgba(123,223,242,.20) 1px, transparent 1px) 0 0/30px 30px,
		linear-gradient(0deg, rgba(255,79,216,.16) 1px, transparent 1px) 0 0/30px 30px;
	--profile-shadow:0 0 0 1px rgba(123,223,242,.18), 0 24px 58px rgba(0,0,0,.46);
}
.uprofile[data-profile-theme="candy"] .uprofile__cover-art {
	opacity: .32;
	filter: blur(22px) saturate(1.65) contrast(1.12);
}
.uprofile[data-profile-theme="candy"] .uprofile__cover-name {
	color: rgba(123,223,242,.16);
	text-shadow: 0 0 34px rgba(255,79,216,.34);
}
.uprofile[data-profile-theme="hero"] {
	--profile-cover:
		linear-gradient(115deg, transparent 0 38%, rgba(255,61,61,.48) 38% 48%, transparent 48%),
		radial-gradient(circle at 82% 18%, rgba(255,255,255,.14), transparent 26%),
		linear-gradient(135deg,#06070c 0%,#263044 58%,#090a0d 100%);
	--profile-shadow:0 0 0 1px rgba(255,61,61,.16), 0 24px 58px rgba(0,0,0,.48);
}
.uprofile[data-profile-theme="cosmic"],
.uprofile[data-profile-theme="synth"],
.uprofile[data-profile-theme="void"] {
	--profile-shadow:0 0 0 1px var(--profile-border), 0 24px 62px rgba(0,0,0,.52);
}

@media screen and (max-width: 768px) {
	.uprofile::before {height: 250px; inset: -10px -10px auto;}
	.uprofile__hero {min-height: 0;}
	.uprofile__cover {height: 170px;}
	.uprofile__cover-art {inset: -20px; width: calc(100% + 40px); height: calc(100% + 40px);}
	.uprofile__cover-name {right: 16px; bottom: 28px; max-width: 82%; font-size: clamp(34px, 15vw, 72px);}
	.uprofile__hero-body {
		margin: -68px 12px 0;
		padding: 16px;
		align-items: center;
	}
	.uprofile__avatar {width: 86px; height: 86px;}
	.uprofile__identity {padding-bottom: 0;}
	.uprofile__name {font-size: 24px;}
	.uprofile__hero-actions {width: auto; margin-left: auto;}
	.uprofile__stats {grid-template-columns: 1fr; gap: 10px;}
	.uprofile__stat {min-height: 86px; padding: 16px;}
	.uprofile__stat-value {font-size: 24px;}
}
@media screen and (max-width: 520px) {
	.uprofile__hero-body {
		display: grid;
		grid-template-columns: auto 1fr;
	}
	.uprofile__hero-actions {
		grid-column: 1 / -1;
		width: 100%;
		justify-content: stretch;
		margin-left: 0;
	}
	.uprofile__btn-edit {flex: 1;}
	.uprofile__meta-grid {grid-template-columns: 1fr;}
}
