:root{color-scheme:dark;--bg:#03070d;--card:#07111f;--ink:#f5f8ff;--muted:#aab8ca;--line:rgba(165,213,255,.15);--blue:#28b8ff;--purple:#7675ff;--shadow:0 28px 90px rgba(0,0,0,.38)}
*{box-sizing:border-box}
html{min-height:100%;background:var(--bg)}
body{min-height:100vh;margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;color:var(--ink);background:var(--bg)}
button,a{font:inherit}
button{cursor:pointer}
.page{min-height:100vh;display:grid;place-items:center;position:relative;isolation:isolate;overflow:hidden;padding:32px 16px 112px;background:radial-gradient(circle at 50% 16%,rgba(20,68,112,.24),transparent 32%),linear-gradient(135deg,#02050b 0%,#06111f 56%,#03070d 100%)}
.page:before{content:"";position:absolute;inset:-18%;z-index:0;background:radial-gradient(circle at 20% 10%,rgba(62,197,255,.16),transparent 28%),radial-gradient(circle at 90% 85%,rgba(111,79,255,.18),transparent 30%);background-size:cover;background-position:center;opacity:.1;filter:saturate(1.2) contrast(1.1)}
.page[data-theme=aigc]{--bg:#f6e7f1;--card:rgba(255,255,255,.72);--ink:#24263b;--muted:#6d7184;--line:rgba(255,255,255,.86);--blue:#ff873c;--purple:#cf75c5;--shadow:0 28px 90px rgba(115,73,121,.18);background:linear-gradient(135deg,#f29cc3 0%,#e6c9eb 48%,#a2e1f5 100%)}
.page[data-theme=aigc]:before{opacity:.25;mix-blend-mode:soft-light}
.noise{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.08;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='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E")}
.ambient{position:absolute;border-radius:50%;filter:blur(70px);opacity:.28;pointer-events:none;z-index:0}
.ambient-one{width:260px;height:260px;top:-100px;left:-70px;background:#168cff}
.ambient-two{width:310px;height:310px;right:-140px;bottom:-90px;background:#794fff}
.page[data-theme=aigc] .ambient-one{background:#f255aa}
.page[data-theme=aigc] .ambient-two{background:#61d8ef}
.motion-layer{position:absolute;z-index:0;width:min(72vw,620px);height:min(72vw,620px);border-radius:50%;pointer-events:none;opacity:.28;will-change:transform;transform:translate3d(0,0,0) rotate(0deg);background:conic-gradient(from 210deg,transparent 0 22%,rgba(34,185,255,.03) 27%,rgba(34,185,255,.7) 34%,rgba(113,94,255,.08) 42%,transparent 53%,transparent 74%,rgba(232,117,192,.5) 82%,transparent 90%);filter:blur(18px);animation:motion-layer-drift 17s ease-in-out infinite alternate}
.motion-layer:after{content:"";position:absolute;inset:18%;border:1px solid rgba(108,207,255,.28);border-radius:50%;box-shadow:0 0 48px rgba(30,180,255,.18),inset 0 0 35px rgba(104,90,255,.13)}
.motion-layer-one{top:-38vw;left:-20vw}
.motion-layer-two{right:-34vw;bottom:-36vw;opacity:.22;animation-delay:-7s;animation-direction:alternate-reverse}
.page[data-theme=aigc] .motion-layer{opacity:.18;filter:blur(22px);background:conic-gradient(from 210deg,transparent 0 22%,rgba(255,255,255,.08) 30%,rgba(255,126,169,.52) 38%,rgba(106,214,239,.18) 49%,transparent 59%,transparent 75%,rgba(255,188,118,.45) 84%,transparent 91%)}
.page[data-theme=aigc] .motion-layer:after{border-color:rgba(255,255,255,.34);box-shadow:0 0 48px rgba(255,153,188,.18),inset 0 0 35px rgba(105,215,235,.12)}
.js-motion .motion-layer{animation:none}
.js-motion .motion-layer-one{transform:translate3d(var(--motion-x,0%),var(--motion-y,0%),0) rotate(var(--motion-angle,0deg))}
.js-motion .motion-layer-two{transform:translate3d(calc(var(--motion-x,0%) * -1),calc(var(--motion-y,0%) * -1),0) rotate(calc(var(--motion-angle,0deg) * -1))}
.profile-card{width:min(100%,560px);min-height:760px;padding:34px 24px 96px;border:1px solid var(--line);border-radius:34px;background:linear-gradient(145deg,rgba(11,31,53,.84),rgba(4,12,22,.82));box-shadow:var(--shadow),inset 0 1px rgba(255,255,255,.05);text-align:center;position:relative;z-index:1;overflow:hidden}
.profile-card:before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(circle at var(--mx,50%) var(--my,10%),rgba(95,203,255,.12),transparent 28%),linear-gradient(145deg,rgba(15,45,78,.16),rgba(3,10,20,.2));background-size:auto;background-position:center;opacity:1;filter:none}
.page[data-theme=aigc] .profile-card{background:rgba(255,255,255,.72);border-color:rgba(255,255,255,.82);box-shadow:var(--shadow)}
.page[data-theme=aigc] .profile-card:before{opacity:.16;mix-blend-mode:soft-light}
@supports ((backdrop-filter:blur(18px)) or (-webkit-backdrop-filter:blur(18px))){.profile-card{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.page[data-theme=aigc] .profile-card{-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px)}}
.share-button{position:absolute;right:18px;top:18px;width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--line);border-radius:12px;background:rgba(6,19,35,.72);color:var(--ink);transition:transform .25s,background .25s,color .25s}
.share-button:hover{transform:translateY(-2px) rotate(-6deg);background:rgba(30,71,105,.8);color:#8ee5ff}
.share-button svg{width:17px;height:17px}
.page[data-theme=aigc] .share-button{background:rgba(255,255,255,.72);color:#52576a;border-color:rgba(255,255,255,.84)}
.avatar-stage{width:132px;height:132px;position:relative;margin:11px auto 16px;display:grid;place-items:center}
.avatar{width:84px;height:84px;border:4px solid rgba(249,252,255,.92);border-radius:50%;background-position:center 18%;background-size:cover;box-shadow:0 0 0 4px rgba(20,28,42,.82),0 0 24px rgba(36,187,255,.42),0 12px 30px rgba(0,0,0,.32);position:relative;z-index:2}
.avatar-halo{position:absolute;inset:13px;border-radius:50%;pointer-events:none;will-change:transform}
.halo-back{border:1px solid rgba(104,218,255,.34);border-left-color:transparent;border-bottom-color:rgba(111,99,255,.85);animation:spin 8s linear infinite;filter:drop-shadow(0 0 10px rgba(26,182,255,.75))}
.halo-front{inset:21px;background:conic-gradient(from 0deg,transparent 0 18deg,#f7fbff 24deg,#70788b 58deg,#d47aa8 94deg,#565b6a 142deg,transparent 184deg,transparent 250deg,#dae9f4 290deg,#7dd7ff 322deg,transparent 352deg);-webkit-mask:radial-gradient(circle,transparent 0 57%,#000 61% 73%,transparent 77%);mask:radial-gradient(circle,transparent 0 57%,#000 61% 73%,transparent 77%);animation:spin 5.5s linear infinite;filter:drop-shadow(0 0 8px rgba(214,109,190,.62))}
.js-motion .halo-back{animation:none;transform:rotate(var(--halo-angle,0deg))}
.js-motion .halo-front{animation:none;transform:rotate(calc(var(--halo-angle,0deg) * -1))}
.page[data-theme=aigc] .avatar{box-shadow:0 0 0 4px rgba(255,255,255,.62),0 8px 26px rgba(91,112,154,.18)}
.page[data-theme=aigc] .halo-back{border-color:rgba(255,255,255,.74);border-left-color:transparent;border-bottom-color:#f185a8;filter:drop-shadow(0 0 9px rgba(255,133,165,.45))}
.page[data-theme=aigc] .halo-front{filter:hue-rotate(115deg) saturate(.7) drop-shadow(0 0 7px rgba(255,150,190,.55))}
.profile-card h1{position:relative;margin:0 0 12px;font-size:24px;letter-spacing:.08em;font-weight:800;background:linear-gradient(100deg,#f7fbff 0%,#6ddcff 34%,#3da7ff 62%,#fff 100%);background-size:220% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;filter:drop-shadow(0 3px 12px rgba(38,181,255,.34));animation:text-shift 5s ease-in-out infinite alternate}
.page[data-theme=aigc] .profile-card h1{background:none;color:var(--ink);filter:none;animation:none}
.summary{position:relative;min-height:58px;margin:0 auto 14px;max-width:480px;color:var(--muted);font-size:12px;line-height:1.75;text-align:center}
.page[data-theme=aigc] .summary{color:#3f4356}
.links{position:relative;display:grid;gap:10px;margin-top:18px;text-align:left}
.link-card{min-height:59px;display:grid;grid-template-columns:36px minmax(0,1fr) 20px;align-items:center;gap:12px;padding:10px 13px;border:1px solid rgba(150,205,239,.17);border-radius:16px;background:rgba(8,21,40,.78);color:#dce8f5;text-decoration:none;box-shadow:0 8px 20px rgba(0,0,0,.2);transition:transform .25s,background .25s,border-color .25s,box-shadow .25s}
.link-card:hover{transform:translateY(-3px);background:rgba(15,39,67,.9);border-color:rgba(83,198,255,.45);box-shadow:0 13px 28px rgba(0,125,219,.22)}
.link-icon{width:36px;height:36px;flex:none;display:grid;place-items:center;overflow:hidden;border-radius:50%;background:#eff5f9}
.link-icon img{width:100%;height:100%;display:block;object-fit:cover}
.link-copy{min-width:0;font-size:13px;font-weight:650;text-align:center}
.link-arrow{font-size:20px;color:#88a7c4;transition:transform .25s,color .25s}
.link-card:hover .link-arrow{transform:translate(2px,-2px);color:#79d9ff}
.page[data-theme=aigc] .link-card{background:rgba(255,255,255,.72);border-color:rgba(255,255,255,.82);color:#777d8d;box-shadow:0 5px 15px rgba(115,129,161,.1)}
.page[data-theme=aigc] .link-card:hover{background:rgba(255,255,255,.9);border-color:#fff}
.page[data-theme=aigc] .link-arrow{color:#a1a4b1}
.profile-card>:not(.share-button){position:relative;z-index:1}
.cta-button{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:49px;margin-top:20px;padding:12px 16px;border-radius:999px;background:linear-gradient(135deg,#00a8ff,#4679ff 58%,#6d5bff);color:#fff;text-decoration:none;font-size:15px;font-weight:750;box-shadow:0 10px 24px rgba(0,127,255,.34);transition:transform .25s,box-shadow .25s}
.cta-button:hover{transform:translateY(-3px);box-shadow:0 15px 32px rgba(0,159,255,.46)}
.page[data-theme=aigc] .cta-button{background:#ff873c;box-shadow:0 9px 20px rgba(255,122,45,.3)}
.floating-cta-wrap{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom));z-index:20;width:min(360px,calc(100vw - 32px));transform:translateX(-50%);pointer-events:none}
.floating-cta-wrap .cta-button{margin:0;pointer-events:auto}
.toast{position:absolute;left:50%;bottom:17px;transform:translate(-50%,10px);padding:8px 13px;border-radius:999px;background:rgba(0,0,0,.75);color:#fff;font-size:11px;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s}
.toast.show{opacity:1;transform:translate(-50%,0)}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes background-drift{from{transform:scale(1) translate3d(-1%,0,0)}to{transform:scale(1.08) translate3d(1%,1%,0)}}
@keyframes motion-layer-drift{from{transform:translate3d(-2%,-1%,0) rotate(-10deg)}to{transform:translate3d(2%,1%,0) rotate(14deg)}}
@keyframes text-shift{from{background-position:0 50%}to{background-position:100% 50%}}
@media(max-width:430px){.page{padding:0 0 82px}.profile-card{min-height:100vh;border-radius:0;border-width:0;padding-top:42px}.page[data-theme=aigc] .profile-card{border-radius:0}.floating-cta-wrap{width:min(300px,calc(100vw - 28px));bottom:calc(12px + env(safe-area-inset-bottom))}.floating-cta-wrap .cta-button{min-height:46px;font-size:15px;animation:cta-float 3.2s ease-in-out infinite}}
@media(prefers-reduced-motion:reduce){.floating-cta-wrap .cta-button{animation:none}}
@keyframes cta-float{0%,100%{transform:translateY(0);box-shadow:0 10px 24px rgba(0,127,255,.34)}50%{transform:translateY(-4px);box-shadow:0 15px 30px rgba(0,159,255,.46)}}
