/* q4 profile, ux16 profile editing and ux21 welcome recorder. */
#home:has(> #hfeed > .fp)>:is(.hhead,.htabs,.stories,#comHead),
body:has(.bnav [data-nav="me"].on) #home>:is(.hhead,.htabs,.stories,#comHead){display:none}
.fp{color:#16132A}
.fp .fp-tools{display:flex;justify-content:space-between;align-items:center;min-height:42px}
.fp .fp-tools .round{background:#FBFAFF;color:#16132A;width:42px;height:42px}
.fp .hero{margin-top:-6px}
.fp .ring{width:132px;height:132px;padding:4px;box-shadow:0 14px 30px rgba(124,58,237,.18);background:conic-gradient(from 200deg,#7C3AED,#C026D3,#EC4899,#7C3AED)}
.fp .ring>.new-avatar{width:124px!important;height:124px!important;border-radius:50%;border:4px solid #FBFAFF;overflow:hidden}
.fp .ring .new-avatar img{border:0;width:100%;height:100%;object-fit:cover}
.fp h1{font-size:26px;font-weight:700;margin:14px 0 0;text-wrap:balance;display:flex;justify-content:center;align-items:center;gap:7px;overflow-wrap:anywhere}
.fp .handle{font-size:15px;color:#7B738D;direction:ltr;margin-top:2px}
.fp .stats{display:flex;gap:8px;align-items:center;margin-top:12px}
.fp .stat{height:30px;border-radius:15px;background:#F6F4FA;padding:0 12px;display:flex;align-items:center;gap:5px;font-size:13px;color:#7B738D;white-space:nowrap}
.fp .stat b{font-size:14px;color:#16132A}
.fp .stat.main{height:36px;border-radius:18px;padding:0 15px;transform:translateY(-4px);background:#FBFAFF;color:#6D28D9;box-shadow:inset 0 0 0 1.5px #8B5CF6}
.fp .stat.main b{font-size:17px;color:#6D28D9}
.fp .bio{margin-top:6px;font-size:15px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}
.fp .btns{display:flex;gap:6px;width:100%;margin-top:12px}
.fp .b-follow,.fp .b-msg{flex:1;height:38px;border-radius:10px;font-size:14px;font-weight:600}
.fp .b-follow{background:linear-gradient(105deg,#8B5CF6,#5B21B6);color:#fff}
.fp .b-follow.on,.fp .b-msg{background:#F0EAFB;color:#16132A}
.fp .welcome{position:relative;width:100%;margin-top:12px;height:58px;border-radius:29px;background:linear-gradient(110deg,#F7F3FF,#FCF8FF 55%,#F3EDFF);box-shadow:inset 0 0 0 1px #ECE4FB;display:flex;align-items:center;gap:10px;padding:0 8px 0 18px}
.fp .welcome .play{width:42px;height:42px;box-shadow:0 4px 10px rgba(72,34,251,.2)}
.fp .welcome .mid{flex:1;min-width:0;align-self:stretch;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}
.fp .welcome .lbl{position:absolute;top:5px;left:0;right:0;text-align:center;font-size:11px;line-height:1;font-weight:600;color:#6D28D9}
.fp .welcome .wave{height:22px;width:100%;flex:0 0 auto;margin-top:10px;display:flex;gap:2px;align-items:center;overflow:hidden}
.fp .welcome .wave i{flex:1;min-width:2px;max-width:4px;border-radius:3px;background:#8B5CF6}
.fp .welcome .wave i.dim{opacity:.3}
.fp .welcome .t{font-size:12px;color:#6D28D9;direction:ltr;flex:none}
.fp .fp-welcome-empty{height:58px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 14px;margin-top:12px;width:100%;border-radius:29px;background:#F6F1FF;color:#6D28D9;font-size:13px}
.fp .fp-welcome-empty button{font-weight:800;display:flex;align-items:center;gap:6px}
.fp .fp-tabs{display:flex;overflow-x:auto;scrollbar-width:none;margin:18px -16px 0;border-bottom:1px solid #EEE9F7}
.fp .fp-tabs button{flex:1;min-width:58px;display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 4px;border-bottom:2.5px solid transparent;font-size:12.5px;color:#6B6B78;white-space:nowrap}
.fp .fp-tabs button.on{border-color:#7C3AED;color:#7C3AED;font-weight:700}
.fp .fp-tabs svg{width:21px;height:21px}
.fp .fp-requests{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;margin-top:13px;padding:11px 14px;border-radius:16px;background:#F3EEFC;color:#6D28D9;font-size:13px;font-weight:700}
.fp .fp-content{padding-top:8px}
.fp .fp-loading{padding:30px 0}
.fp button:focus-visible,.fp-edit button:focus-visible,.fp-people button:focus-visible,.fp-voice-panel button:focus-visible{outline:3px solid #A78BFA;outline-offset:3px}
.fp button:disabled,.fp-edit button:disabled,.fp-people button:disabled,.fp-voice-panel button:disabled{opacity:.45;cursor:not-allowed}
.fp-edit.new-panel,.fp-people.new-panel{background:#FBFAFF;color:#16132A}
.fp-edit .new-panel-head,.fp-people .new-panel-head{background:#FBFAFF;border-bottom:0}
.fp-edit .new-panel-head .fp-save{height:38px;padding:0 16px;border-radius:19px;background:linear-gradient(105deg,#8B5CF6,#5B21B6);color:#fff;font-size:14px;font-weight:800;margin-inline-start:auto;width:auto}
.fp-edit .new-panel-body{padding:0 16px 30px}
.fp-edit form{display:flex;flex-direction:column;gap:12px}
.fp-edit .pf-ph{display:flex;flex-direction:column;align-items:center;gap:4px}
.fp-edit .pf-rg{position:relative;width:104px;height:104px;padding:3px;border-radius:50%;background:conic-gradient(from 200deg,#7C3AED,#C026D3,#EC4899,#7C3AED)}
.fp-edit .pf-rg>.new-avatar{display:block;width:98px!important;height:98px!important;border-radius:50%;border:3px solid #fff;overflow:hidden}
.fp-edit .pf-rg .new-avatar img{width:100%;height:100%;object-fit:cover}
.fp-edit .pf-rg i{position:absolute;bottom:0;left:0;width:32px;height:32px;border-radius:50%;background:#7C3AED;box-shadow:0 0 0 3px #FBFAFF;display:grid;place-items:center;color:#fff}
.fp-edit .pf-cg{height:34px;color:#5B21B6;font-size:14px;font-weight:700}
.fp-edit .pf-c{padding:14px;border-radius:20px;background:#fff;box-shadow:0 4px 14px rgba(46,16,101,.05),inset 0 0 0 1px #F0EBF7;display:flex;flex-direction:column;gap:10px}
.fp-edit .pf-c label{display:flex;justify-content:space-between;margin-bottom:5px;font-size:13px;font-weight:700;color:#4B4560}
.fp-edit .pf-c label small{font-weight:500;color:#6B6585;direction:ltr}
.fp-edit .pf-c input:not([type=checkbox]),.fp-edit .pf-c textarea{display:block;width:100%;min-height:46px;padding:11px 13px;border:1.5px solid transparent;border-radius:14px;background:#F8F6FC;color:#16132A;font:inherit;font-size:16px;outline:none}
.fp-edit .pf-c textarea{height:108px;resize:vertical;line-height:1.6}
.fp-edit .pf-c input:focus,.fp-edit .pf-c textarea:focus{border-color:#7C3AED;background:#fff}
.fp-edit .pf-c input:read-only{color:#6B6585}
.fp-edit .pf-note{font-size:12px;color:#8A8499;line-height:1.7;margin:0}
.fp-edit .pf-v{min-height:62px;padding:8px;border-radius:31px;background:linear-gradient(110deg,#F7F3FF,#FCF8FF 55%,#F3EDFF);box-shadow:inset 0 0 0 1px #ECE4FB;display:flex;align-items:center;gap:9px}
.fp-edit .pf-v .play{width:46px;height:46px;flex:none}
.fp-edit .pf-v .tx{flex:1;min-width:0}
.fp-edit .pf-v b{display:block;font-size:14px;font-weight:800}
.fp-edit .pf-v small{font-size:12px;color:#6B6585}
.fp-edit .pf-v .ed{flex:none;height:36px;padding:0 12px;border-radius:18px;background:#fff;color:#5B21B6;font-size:12.5px;font-weight:800;box-shadow:0 2px 8px rgba(46,16,101,.1)}
.fp-edit .pf-l{border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 4px 14px rgba(46,16,101,.05),inset 0 0 0 1px #F0EBF7}
.fp-edit .pf-l>button,.fp-edit .pf-private{width:100%;min-height:56px;padding:12px 14px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:15px;font-weight:700;color:#16132A}
.fp-edit .pf-l>button+button{border-top:1px solid #F4F0FA}
.fp-edit .pf-private input{accent-color:#7C3AED;width:19px;height:19px;flex:none}
.fp-edit .pf-action{padding:8px 12px;border-radius:14px;background:#F1EBFB;color:#6D28D9;font-size:13px;font-weight:700}
.fp-edit .pf-unsupported{font-size:12px;color:#8A8499;line-height:1.6}
.fp-edit .pf-remove{color:#C81E3A;font-size:12px;padding:7px}
.fp-edit .pf-error,.fp-voice-panel .pf-error{border:1px solid #E9C7D4;background:#FFF7FA;color:#A42246;border-radius:16px;padding:12px;font-size:13px;line-height:1.7}
.fp-edit .pf-error button,.fp-voice-panel .pf-error button{padding:7px 12px;border-radius:12px;background:#7C3AED;color:#fff;margin-top:8px}
.fp-people .new-panel-body{padding:0 16px 25px}
.fp-people .fp-list-tabs{display:flex;border-bottom:1px solid #EEE9F7;margin-bottom:12px}
.fp-people .fp-list-tabs button{flex:1;padding:13px 5px;font-weight:600;font-size:14px;color:#8A8499;border-bottom:2.5px solid transparent}
.fp-people .fp-list-tabs button.on{color:#7C3AED;border-color:#7C3AED}
.fp-people .fp-list-search{display:block;width:100%;height:42px;border:0;outline:0;border-radius:14px;background:#F1EDF7;padding:0 13px;font:inherit;font-size:14px;margin:12px 0}
.fp-people .fp-list-search:focus{box-shadow:inset 0 0 0 2px #A78BFA}
.fp-saved-collections{margin:0 0 16px;padding:14px;border-radius:18px;background:#F8F5FC;border:1px solid #EEE8F6}
.fp-saved-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.fp-saved-head>b{font-size:14px;color:#211A35}
.fp-saved-collection{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:48px;padding:10px 12px;margin-top:7px;border:1px solid #EEE7F7;border-radius:14px;background:#fff;color:#302743;text-align:start}
.fp-saved-collection small{color:#817990;font-size:11px}
.fp-collection-add{margin:7px 0 12px}
.fp-people .fp-person{display:flex;align-items:center;gap:11px;padding:12px 0;min-height:68px}
.fp-people .fp-person+.fp-person{border-top:1px solid #F2EEF7}
.fp-people .fp-person>.fp-name{flex:1;min-width:0;text-align:right;display:flex;flex-direction:column;gap:4px}
.fp-people .fp-name b{font-size:14px;overflow-wrap:anywhere}
.fp-people .fp-name small{font-size:12px;color:#8A8499}
.fp-people .fp-person .fp-follow{height:32px;min-width:78px;padding:0 14px;border-radius:16px;background:linear-gradient(105deg,#8B5CF6,#5B21B6);color:#fff;font-size:12px;font-weight:700}
.fp-people .fp-person .fp-follow.on,.fp-people .fp-person .fp-follow.requested{background:#F0EBF9;color:#6D28D9}
.fp-people .fp-answer{display:flex;gap:6px}
.fp-people .fp-answer button{padding:8px 12px;border-radius:14px;background:#7C3AED;color:#fff;font-size:12px;font-weight:700}
.fp-people .fp-answer button:last-child{background:#F2EDF9;color:#6D28D9}
.fp-people .fp-more{display:block;width:100%;padding:12px;border-radius:16px;background:#F1EBFB;color:#6D28D9;font-weight:700;margin-top:12px}
.fp-voice-panel.new-panel{background:rgba(22,12,40,.4);justify-content:flex-end}
.fp-voice-panel .fp-voice-card{display:flex;flex-direction:column;max-height:90dvh;border-radius:26px 26px 0 0;background:#FBFAFF;color:#16132A;overflow:hidden}
.fp-voice-panel .fp-voice-card:before{content:"";width:38px;height:5px;border-radius:3px;background:#D9D0E7;margin:10px auto 0;flex:none}
.fp-voice-panel .new-panel-head{background:transparent;min-height:58px}
.fp-voice-panel .new-panel-body{padding:0 18px max(22px,env(safe-area-inset-bottom,0px));overflow:auto}
.fp-voice-panel .w21{display:flex;flex-direction:column;min-height:372px;padding:0 4px}
.fp-voice-panel .w21h{display:flex;justify-content:space-between;align-items:baseline;margin:0 6px}
.fp-voice-panel .w21h b{font-size:16px}
.fp-voice-panel .w21h small{font-size:12px;color:#8A8499}
.fp-voice-panel .fp-voice-limit{font-size:12px;color:#8A8499}
.fp-voice-panel .w21idle{height:54px;border-radius:27px;background:#F4F0FD;box-shadow:inset 0 0 0 1.5px #E6DCFB;display:flex;align-items:center;justify-content:center;gap:3px;margin-top:14px;overflow:hidden}
.fp-voice-panel .w21idle i{width:3px;background:#D9CCFA;border-radius:2px}
.fp-voice-panel .c19live{display:flex;align-items:center;gap:8px;height:54px;border-radius:27px;padding:0 8px;margin-top:14px;background:linear-gradient(135deg,#8B5CF6,#5B21B6);overflow:hidden}
.fp-voice-panel .c19live .pw{flex:none;width:38px;height:38px;border-radius:50%;background:#fff;display:grid;place-items:center}
.fp-voice-panel .c19live .pw i{width:11px;height:11px;border-radius:50%;background:#EF4444}
.fp-voice-panel .c19live.p .pw i{background:#F59E0B}
.fp-voice-panel .c19live .new-avatar{flex:none;border:2px solid #fff}
.fp-voice-panel .rwave{flex:1;display:flex;align-items:center;justify-content:center;gap:2.5px;height:38px;overflow:hidden}
.fp-voice-panel .rwave i{display:block;width:3px;height:6px;border-radius:2px;background:rgba(255,255,255,.95);transform-origin:center}
.fp-voice-panel .w21tm{display:flex;justify-content:center;align-items:center;gap:7px;font-size:26px;font-weight:800;color:#2B1260;direction:ltr;margin-top:12px;font-variant-numeric:tabular-nums}
.fp-voice-panel .w21tm.z{color:#A49DB8}
.fp-voice-panel .w21tm small{font-size:13px;font-weight:600;color:#8A8499}
.fp-voice-panel .w21tm .dt{width:9px;height:9px;border-radius:50%;background:#EF4444}
.fp-voice-panel .w21tm .dt.p{background:#F59E0B}
.fp-voice-panel .c19big{position:relative;width:84px;height:84px;display:grid;place-items:center;margin:24px auto 0}
.fp-voice-panel .c19big>button{position:relative;width:84px;height:84px;border-radius:50%;background:linear-gradient(135deg,#8B5CF6,#5B21B6);display:grid;place-items:center;color:#fff;box-shadow:0 12px 28px rgba(91,33,182,.4)}
.fp-voice-panel .c19big>button:before,.fp-voice-panel .c19big>button:after{content:"";position:absolute;inset:-12px;border-radius:50%;border:2px solid rgba(139,92,246,.35);animation:fp-voice-ring 1.5s ease-out infinite;pointer-events:none}
.fp-voice-panel .c19big>button:after{inset:-26px;border-color:rgba(139,92,246,.18);animation-delay:.3s}
.fp-voice-panel .c19big.pz>button:before,.fp-voice-panel .c19big.pz>button:after{animation:none;opacity:.5;transform:none}
.fp-voice-panel .c19lb{text-align:center;font-size:13px;color:#6B6585;margin:28px 0 0}
.fp-voice-panel .c19ch{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:16px}
.fp-voice-panel .c19ch button{height:38px;padding:0 12px;border-radius:20px;background:#fff;box-shadow:0 3px 10px rgba(46,16,101,.08),inset 0 0 0 1.5px #EDE7FB;color:#3B2A63;font-size:13px;font-weight:700;display:flex;align-items:center;gap:6px}
.fp-voice-panel .c19ch button.cut{color:#5B21B6;box-shadow:0 3px 10px rgba(46,16,101,.08),inset 0 0 0 2px #C4B5FD}
.fp-voice-panel .c19ch button.delete{color:#DC2626}
.fp-voice-panel .c19ok{text-align:center;font-size:13px;color:#15803D;font-weight:700;margin:12px 0 0}
.fp-voice-panel .w21pv{display:flex;align-items:center;gap:10px;height:54px;border-radius:27px;padding:0 8px 0 14px;margin-top:14px;background:linear-gradient(135deg,#8B5CF6,#5B21B6);direction:ltr}
.fp-voice-panel .w21pv .play{width:38px;height:38px;background:#fff;color:#7C3AED;box-shadow:none;flex:none}
.fp-voice-panel .w21pv .wave{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:2.5px;height:30px;overflow:hidden}
.fp-voice-panel .w21pv .wave i{flex:1;max-width:3px;min-width:2px;border-radius:2px;background:rgba(255,255,255,.42);opacity:1}
.fp-voice-panel .w21pv .wave i:not(.dim){background:#fff}
.fp-voice-panel .w21pv .t{color:#fff;font-weight:700;font-size:14px;min-width:34px}
.fp-voice-panel .w21sp{flex:1;min-height:16px}
.fp-voice-panel .w21sv{display:block;width:100%;margin-top:auto;border-radius:18px;padding:14px;font-size:15px;font-weight:800;color:#fff;background:linear-gradient(135deg,#8B5CF6,#5B21B6);box-shadow:0 8px 18px rgba(91,33,182,.3)}
.fp-voice-panel .w21sv:disabled{box-shadow:none}
.fp-voice-panel .w21-status{min-height:22px;margin-top:10px;text-align:center;font-size:12px;color:#8A8499}
.fp-voice-panel .fp-voice-saving{padding:25px 5px}
@media(max-width:360px){.fp .stats{gap:5px}.fp .stat{padding:0 8px;font-size:12px}.fp .stat.main{padding:0 10px}}
@keyframes fp-voice-ring{from{transform:scale(.86);opacity:.7}to{transform:scale(1.16);opacity:0}}
@media(prefers-reduced-motion:reduce){.fp *,.fp-edit *,.fp-voice-panel *,.fp-people *{scroll-behavior:auto!important;animation:none!important}.fp-voice-panel *:before,.fp-voice-panel *:after{animation:none!important}}
