@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--accent:#ededf0;--accent-rgb:200,200,210;--muted:#8b8b91;--line:#ffffff14;font-family:Inter,Arial,sans-serif;color:#eeeef1;background:#080809;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,textarea{font:inherit}button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit;border:0}a{color:inherit;text-decoration:none}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}[hidden]{display:none!important}.icon-defs{position:absolute;width:0;height:0;overflow:hidden}button:focus-visible,a:focus-visible{outline:1px solid var(--accent);outline-offset:5px}
.universe{position:fixed;inset:0;pointer-events:none;overflow:hidden;background:radial-gradient(ellipse at 50% 38%,#17171a33,transparent 58%),#080809}.ambient{position:absolute;width:min(1000px,130vw);height:280px;left:50%;top:50%;border-radius:50%;background:radial-gradient(ellipse,rgba(var(--accent-rgb),.045),transparent 68%);transform:translate(-50%,-50%) rotate(-24deg);filter:blur(65px);animation:drift 20s ease-in-out infinite alternate}.star{position:absolute;border-radius:50%;background:#e2e2ec;opacity:var(--star-opacity);animation:twinkle var(--twinkle-duration) ease-in-out infinite alternate;animation-delay:var(--delay)}.grain{position:absolute;inset:0;opacity:.025;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
main{position:relative;min-height:100svh;display:grid;place-items:center;padding:72px 24px}.profile-card{width:100%;max-width:420px;text-align:center;padding:42px 36px 30px;background:linear-gradient(145deg,#ffffff04,#ffffff01);border:1px solid #ffffff0b;border-radius:18px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);animation:arrive .7s ease both}.avatar{width:76px;height:76px;margin:0 auto 20px;display:grid;place-items:center;border:1px solid #ffffff1b;border-radius:50%;background:radial-gradient(circle at 34% 24%,#414146,#242427 45%,#171719 80%);box-shadow:inset 0 1px 2px #ffffff10,0 6px 25px #0004}.avatar span{font:bold italic 53px/1 Georgia,serif;transform:translate(-2px,-4px);color:#e4e4e7;text-shadow:0 0 18px #ffffff12}h1{font-size:38px;line-height:1.15;letter-spacing:-1.6px;font-weight:700;margin:0;color:var(--accent);text-shadow:0 0 24px rgba(var(--accent-rgb),.18);overflow-wrap:anywhere}.handle{font-size:11px;color:#74747c;margin:9px 0 0;overflow-wrap:anywhere}.bio{font-size:13px;color:#b1b1b8;line-height:1.7;margin:13px auto 0;max-width:310px;white-space:pre-line;overflow-wrap:anywhere}.bio.is-placeholder{color:#85858e}.socials{display:flex;justify-content:center;gap:11px;margin-top:24px}.social-link{display:grid;place-items:center;width:38px;height:38px;position:relative;color:#c5c5cd;transition:transform .2s,color .2s,filter .2s}.social-link:hover{color:#fff;transform:translateY(-2px);filter:drop-shadow(0 0 7px #ffffff30)}.social-link svg{width:22px;height:22px}.tooltip{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%,3px);white-space:nowrap;pointer-events:none;opacity:0;background:#202024;border:1px solid #ffffff13;border-radius:6px;padding:6px 9px;font-size:10px;color:#dddde3;transition:opacity .15s,transform .15s}.social-link:hover .tooltip,.social-link:focus-visible .tooltip{opacity:1;transform:translate(-50%,0)}.placeholder-note{font-size:9px;letter-spacing:.15px;color:#66666f;margin:11px 0 0;line-height:1.6}.corner-controls{position:fixed;right:20px;bottom:18px;display:flex;gap:5px}.icon-button{background:transparent;color:#696972;width:36px;height:36px;display:grid;place-items:center;border-radius:8px;transition:color .2s,background .2s}.icon-button:hover{color:#ccc;background:#ffffff06}.icon-button svg{width:16px;height:16px}
body[data-accent=violet]{--accent:#c1b4df;--accent-rgb:177,151,220}body[data-accent=ice]{--accent:#b2cdd4;--accent-rgb:150,194,204}body[data-accent=ember]{--accent:#d9b9a5;--accent-rgb:209,161,134}
.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,15px);opacity:0;pointer-events:none;background:#202024;border:1px solid #ffffff1a;padding:13px 20px;border-radius:8px;z-index:5;font-size:12px;box-shadow:0 5px 40px #0008;transition:opacity .2s,transform .2s;max-width:calc(100% - 32px);text-align:center}.toast.visible{opacity:1;transform:translate(-50%,0)}
.avatar{overflow:hidden}.avatar img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.motion-off .universe *{animation-play-state:paused!important}.motion-off .profile-card{animation:none}.motion-off .social-link{transition:none}
@keyframes drift{to{transform:translate(-43%,-45%) rotate(-14deg)}}@keyframes twinkle{to{opacity:.03}}@keyframes arrive{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}

@media(max-width:520px){main{padding:64px 22px}.profile-card{max-width:380px;padding:38px 24px 28px}.corner-controls{right:13px;bottom:12px}}
@media(max-width:360px){.profile-card{padding-left:20px;padding-right:20px}.socials{gap:7px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.socials{flex-wrap:wrap}.social-link img{display:block;object-fit:contain;border-radius:3px}
.bio a{color:var(--accent);text-decoration:underline;text-decoration-color:#ffffff40;text-underline-offset:3px;overflow-wrap:anywhere}.bio a:hover{text-decoration-color:var(--accent)}
.wallpaper{position:fixed;inset:0;overflow:hidden;pointer-events:none}.wallpaper>img,.wallpaper>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.wallpaper #wallpaper-shade{position:absolute;inset:0;background:#000;opacity:.45}.has-wallpaper .profile-card{background:#0c0c10a6;border-color:#ffffff1b;box-shadow:0 15px 60px #0003}.corner-controls{z-index:2}.has-wallpaper .corner-controls{background:#08080b70;border-radius:10px;padding:3px}.has-wallpaper .corner-controls .icon-button{color:#c5c5d0}
.wallpaper>canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
