@property --ring-angle {syntax:'<angle>';initial-value:0deg;inherits:false}
:root{--bg:#080910;--text:#f6f7ff;--muted:#b5b4c8;--mint:#85f4d2;--purple:#b39aff;--pink:#f69edb;--line:#ffffff15}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;font-size:1rem;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-wrap:anywhere}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}a:focus-visible{outline:3px solid var(--mint);outline-offset:5px}::selection{background:#b39aff;color:#080910}
.skip{position:absolute;z-index:20;left:16px;top:-100px;padding:12px 18px;border-radius:10px;background:var(--mint);color:#07130f}.skip:focus{top:12px}
.symbols{position:absolute;width:0;height:0;overflow:hidden}.icon{display:block;width:24px;height:24px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.solid{fill:currentColor;stroke:none}
.ambience{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 8% 40%,#41356440,transparent 65%),#080910}
.ambience img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 60%;opacity:.64;animation:stadium-drift 35s ease-in-out infinite alternate}.vignette{position:absolute;inset:0;background:linear-gradient(180deg,#0809104d,#08091040 35%,#08091085),radial-gradient(ellipse at center,transparent 10%,#08091095 100%)}
.bio-shell{width:min(600px,calc(100% - 36px));margin:0 auto;padding:46px 0 32px}
.neon{--accent:#a994ff;--second:var(--accent);position:relative;isolation:isolate;display:block;border:1px solid #ffffff13;border-radius:22px;background:linear-gradient(125deg,#191924ec,#0f101aef 64%);box-shadow:0 8px 32px #00000025;transition:transform .24s ease,box-shadow .24s ease,background .24s ease}
.neon::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:2px;background:conic-gradient(from var(--ring-angle),transparent 0deg,transparent 12deg,var(--accent) 55deg,#fff 64deg,var(--accent) 72deg,transparent 104deg,transparent 190deg,var(--second) 241deg,#fff 250deg,var(--second) 258deg,transparent 290deg);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.95;pointer-events:none;z-index:2;animation:border-orbit 7s linear infinite}
.neon::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:radial-gradient(400px circle at var(--mx,10%) var(--my,0%),#ffffff07,transparent 65%);pointer-events:none}
.neon:nth-child(2n)::before{animation-delay:-2.3s}.neon:nth-child(3n)::before{animation-delay:-4.6s}.neon.neon-paused::before{animation-play-state:paused}
.profile{padding:22px 26px 28px;text-align:center;overflow:hidden;background:radial-gradient(ellipse at 50% 10%,#ac8aff15,transparent 65%),linear-gradient(125deg,#191923dd,#0c0d16ed);border-radius:26px}.profile::after{background:linear-gradient(110deg,transparent,#bca0ff07,transparent)}
.profile-meta{display:flex;justify-content:space-between;align-items:center;gap:14px;color:#b9b5d0;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.75rem;letter-spacing:.085em;line-height:1.5}.outline-label{border:1px solid #a89cd43b;background:#c5b2ff09;border-radius:20px;padding:4px 10px;font-size:.75rem;letter-spacing:.08em;color:#cec5ec}
.avatar{width:88px;height:88px;border-radius:50%;margin:23px auto 18px;position:relative;padding:4px;background:linear-gradient(140deg,#b6a0ff,#b5a0ff16 47%,#78eddb);box-shadow:0 0 35px #aa81ff16}.avatar::before{content:"";position:absolute;inset:-5px;border:1px solid #b4a1ff21;border-radius:50%}.avatar span{width:100%;height:100%;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,#2c2546,#0f1423);font-size:3.4rem;line-height:1;font-weight:950;font-style:italic;letter-spacing:-.14em;padding-right:.14em;color:#e3deff;text-shadow:2px 2px 0 #94fbd332,-2px -2px 0 #a78fff22}
h1{margin:0;font-size:2.65rem;line-height:1.2;font-weight:900;letter-spacing:.045em}.name-dot{color:var(--mint);text-shadow:0 0 22px #85f4d247}.role{margin:8px 0 0;font-size:.875rem;color:#c2bacf;letter-spacing:.015em}.intro{font-size:1rem;line-height:1.7;color:#bcb8cb;margin:20px auto 0;max-width:400px}.intro strong{color:#ece9f8;font-weight:550}
.profile-tags{display:flex;justify-content:center;gap:9px;flex-wrap:wrap;margin-top:19px}.profile-tags span{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.75rem;line-height:1.45;letter-spacing:.055em;border:1px solid #b2a3e22b;color:#c5bdde;border-radius:6px;padding:5px 9px;background:#a898df08}
.link-section{margin-top:29px}.section-title{display:flex;align-items:center;gap:10px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.875rem;font-weight:650;line-height:1.6;letter-spacing:.025em;margin:0 2px 15px;color:var(--purple)}.section-title>span{font-size:1rem;letter-spacing:-.16em;padding-right:3px;opacity:.8}.section-title i{height:1px;flex:1;min-width:12px;background:linear-gradient(90deg,currentColor,transparent);opacity:.6;margin-left:3px}.mint{color:var(--mint)}.lavender{color:#c0a6ff}.blue{color:#97b6ff}.pink{color:#f4a6dc}
.contact-card,.facebook-card{padding:21px 23px 24px;overflow:hidden;min-height:152px}.contact-card{background:radial-gradient(ellipse at 10% 0%,#75f1ce0e,transparent 65%),linear-gradient(120deg,#151c22f5,#0f131cf2);box-shadow:0 7px 40px #75edcb06}.facebook-card{background:radial-gradient(ellipse at 100% 100%,#9184ff13,transparent 70%),linear-gradient(120deg,#191d2bf0,#10111cf5)}
.card-top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:24px}.zalo-word{font-size:1.25rem;font-weight:800;letter-spacing:-.045em;color:#a2f8e3;text-shadow:0 0 20px #64f6c72b}.card-tag{font-size:.75rem;line-height:1.5;font-weight:700;letter-spacing:.045em;padding:5px 10px;border:1px solid #ffffff13;border-radius:20px;background:#ffffff06;color:#d8d5e1}
.feature-bottom{display:flex;justify-content:space-between;align-items:center;gap:16px}.feature-bottom>div{min-width:0}.card-title{display:block;font-size:1.125rem;line-height:1.45;font-weight:700;letter-spacing:-.018em}.card-description{display:block;font-size:.875rem;line-height:1.5;margin-top:4px;color:var(--muted)}.card-description strong{font-weight:550;color:#c1d8d4}
.arrow-circle{width:39px;height:39px;border-radius:50%;display:grid;place-items:center;border:1px solid #a7e9d128;background:#a7e9d107;color:#b7efe2;flex:none;transition:transform .25s}.facebook-card .arrow-circle{border-color:#b0a3ff29;background:#b0a3ff09;color:#c3baff}.arrow-circle .icon{width:19px;height:19px}.social-icon{width:27px;height:27px;color:#94b8ff;filter:drop-shadow(0 0 10px #507bf333)}
.social-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin-top:14px}.social-tile{min-height:183px;text-align:center;padding:27px 15px 24px;border-radius:23px}.tile-icon{width:48px;height:48px;margin:0 auto 15px}.youtube{color:#ff365b;filter:drop-shadow(0 0 14px #ff315d38)}.tiktok{color:#f2f9fc;filter:drop-shadow(-2px -1px 0 #49f9eb) drop-shadow(2px 2px 0 #fa427e)}.social-tile .card-title{font-size:1rem;letter-spacing:.05em;font-weight:800}.social-tile .card-description{font-size:.875rem;margin-top:5px}.tile-arrow{position:absolute;right:15px;top:15px;width:16px;height:16px;color:#8b8b9f}
.facebook-groups{display:grid;gap:11px}.community-card,.announcement{display:flex;align-items:center;gap:16px;padding:19px 20px;min-height:85px;border-radius:19px}.community-icon{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:12px;background:#829dff0c;color:var(--accent)}.community-icon .icon{width:24px;height:24px}.community-copy{min-width:0;flex:1}.community-card .card-title,.announcement .card-title{font-size:1rem;font-weight:650}.community-card .card-description,.announcement .card-description{font-size:.875rem;margin-top:2px}.end-arrow{width:18px;height:18px;color:#9493aa;margin-left:auto;transition:transform .25s}
.announcement{background:radial-gradient(ellipse at right,#cd67c818,transparent 70%),linear-gradient(120deg,#211a28f2,#171220f5);padding-block:22px}.announcement-icon{width:39px;height:39px;display:grid;place-items:center;color:#ffb5e5;flex:none}.announcement-icon .icon{width:30px;height:30px;filter:drop-shadow(0 0 12px #ee89d730)}
.group-section{margin-top:23px}.group-section h3{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 2px 11px;font-size:.875rem;line-height:1.5;letter-spacing:.02em;color:#d1cadd;font-weight:550}.group-type{font-size:.75rem;font-weight:400;letter-spacing:0;color:#aaa2b9}.group-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.group-card{display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px 7px;padding:18px 17px 17px;border-radius:18px;min-height:107px;overflow:hidden}.group-number{grid-column:1;grid-row:1;font-size:1.2rem;line-height:1.2;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-weight:600;letter-spacing:-.03em;color:var(--accent);opacity:.85}.group-card .card-title{grid-column:1/-1;grid-row:2;font-size:.9375rem;line-height:1.5;font-weight:550;letter-spacing:-.01em}.group-card .end-arrow{grid-column:2;grid-row:1;width:16px;height:16px}
footer{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:36px;padding:20px 0 0;color:#c0b8ce;font-size:.75rem;letter-spacing:.075em;text-align:center}.footer-mark{font-size:1.8rem;line-height:1.1;font-weight:900;font-style:italic;letter-spacing:-.04em;color:#d5c6ff;text-shadow:0 0 20px #ba95ff35}.footer-slash{color:#9677ce;padding:0 7px}footer small{font-size:.75rem;color:#a39aaf;letter-spacing:.01em}
.reveal{transition:opacity .55s ease,transform .55s cubic-bezier(.16,1,.3,1),box-shadow .24s ease}.motion-ready .reveal:not(.visible){opacity:0;transform:translateY(18px)}a.neon:active{transform:scale(.985);transition:transform .12s}
@media(hover:hover) and (pointer:fine){a.neon:hover{transform:translateY(-4px);box-shadow:0 10px 30px #00000033,0 0 22px color-mix(in srgb,var(--accent) 7%,transparent)}a.neon:hover::before{opacity:1}a:hover .end-arrow,a:hover .tile-arrow{color:var(--accent);transform:translate(2px,-2px)}a:hover .arrow-circle{transform:rotate(-6deg) scale(1.06)}}
@media(min-width:1000px){.bio-shell{padding-top:55px;padding-bottom:42px;width:580px}.ambience img{object-position:center 66%}.profile{padding-top:24px}.contact-card,.facebook-card{min-height:158px}.social-tile{min-height:195px}}
@media(max-width:480px){.bio-shell{padding-top:22px;width:calc(100% - 32px)}.profile{padding:18px 19px 23px;border-radius:23px}.profile-meta{font-size:.75rem;letter-spacing:0}.outline-label{font-size:.75rem;padding:3px 7px}.avatar{width:76px;height:76px;margin-top:22px;margin-bottom:17px}.avatar span{font-size:3rem}h1{font-size:2.3rem}.role{font-size:.875rem}.intro{margin-top:16px;font-size:1rem;line-height:1.7}.profile-tags{margin-top:16px;gap:7px}.profile-tags span{font-size:.75rem;padding:5px 8px}.link-section{margin-top:26px}.section-title{font-size:.875rem;gap:8px;letter-spacing:0;margin-bottom:13px}.contact-card,.facebook-card{padding:18px 18px 21px;min-height:147px}.card-title{font-size:1.0625rem}.card-top{margin-bottom:22px}.card-tag{font-size:.75rem;padding:4px 8px}.card-description{font-size:.875rem}.feature-bottom{gap:9px}.arrow-circle{width:33px;height:33px}.social-grid{gap:12px}.social-tile{padding:25px 12px 22px;min-height:173px}.tile-icon{width:43px;height:43px;margin-bottom:14px}.community-card,.announcement{padding:17px 16px;gap:12px}.community-card .card-title,.announcement .card-title{font-size:1rem}.group-grid{gap:11px}.group-card{padding:15px;min-height:101px;gap:11px 5px}.group-card .card-title{font-size:.875rem}.group-type{font-size:.75rem}.ambience img{object-position:49% center}.wide-break{display:none}}
@media(max-width:359px){.bio-shell{width:calc(100% - 24px)}.profile-meta{gap:5px;flex-wrap:wrap}.profile{padding-inline:14px}.section-title{gap:6px}.section-title>span{display:none}.card-title{font-size:1rem}.group-card{padding:14px 12px}.community-card{gap:10px;padding-inline:13px}.community-icon{width:30px;height:34px}.group-grid{gap:9px}.arrow-circle{width:29px;height:29px}.group-section h3{flex-wrap:wrap}}
@keyframes border-orbit{to{--ring-angle:360deg}}@keyframes stadium-drift{from{transform:scale(1.03) translateY(0)}to{transform:scale(1.08) translateY(-.5%)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.motion-ready .reveal:not(.visible){opacity:1;transform:none}}

/* Avatar, motion and sound controls. */
.avatar.logo-avatar{width:140px;height:140px;padding:4px;margin-block:25px 23px;background:linear-gradient(135deg,#ffe791,#f47270 45%,#b599ff);box-shadow:0 0 30px #eebe5420;animation:avatar-float 5s ease-in-out infinite}
.avatar.logo-avatar img{display:block;width:100%;height:100%;object-fit:contain;border-radius:50%;background:#fff}
.avatar.logo-avatar::before{inset:-8px;padding:1px;border:0;background:conic-gradient(transparent 20%,#ffd96e 34%,transparent 49%,transparent 69%,#bb9bff 81%,transparent 96%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:avatar-orbit 12s linear infinite;pointer-events:none}
.sound-toolbar{position:sticky;top:12px;z-index:10;display:flex;justify-content:flex-end;min-height:44px;margin-bottom:14px;pointer-events:none}
.sound-toggle{display:flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:10px 16px;border:1px solid #b8a7ef55;border-radius:99px;background:#151422f5;color:#ddd6ef;font:600 .875rem/1.45 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;cursor:pointer;box-shadow:0 5px 24px #0005;touch-action:manipulation;pointer-events:auto;transition:background .2s,border-color .2s,transform .2s}
.sound-toggle[hidden]{display:none}.sound-toggle:hover{background:#252039}.sound-toggle:active{transform:scale(.96)}.sound-toggle:focus-visible{outline:3px solid var(--mint);outline-offset:4px}.sound-toggle[aria-pressed="true"]{color:#acf7df;border-color:#85f4d27a;background:#132520f5}
.equalizer{height:18px;display:flex;align-items:center;gap:3px}.equalizer i{display:block;width:3px;height:5px;border-radius:3px;background:currentColor;transform-origin:center}.equalizer i:nth-child(2){height:13px}.equalizer i:nth-child(3){height:9px}.equalizer i:nth-child(4){height:16px}
.sound-toggle.is-on .equalizer i{height:16px;animation:equalizer .9s ease-in-out infinite alternate}.sound-toggle.is-on .equalizer i:nth-child(2){animation-delay:-.6s}.sound-toggle.is-on .equalizer i:nth-child(3){animation-delay:-.3s}.sound-toggle.is-on .equalizer i:nth-child(4){animation-delay:-.8s}
.sound-feedback{position:absolute;right:0;top:calc(100% + 7px);max-width:280px;font-size:.875rem;line-height:1.5;color:#ffe7c3;border-radius:12px;background:#24202bf5;box-shadow:0 4px 20px #0005}.sound-feedback:not(:empty){padding:12px 14px}
.sparkles{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}.sparkles i{position:absolute;top:0;left:7%;display:block;width:3px;height:3px;border-radius:50%;background:#bfa9ff;box-shadow:0 0 8px #bfa9ff90;opacity:0;animation:particle-rise 22s linear infinite;animation-delay:-7s}.sparkles i:nth-child(2){left:18%;animation-duration:29s;animation-delay:-22s;background:#94f6d6}.sparkles i:nth-child(3){left:29%;animation-duration:24s;animation-delay:-13s}.sparkles i:nth-child(4){left:41%;animation-duration:31s;animation-delay:-27s;background:#ffe4a4}.sparkles i:nth-child(5){left:52%;animation-duration:27s;animation-delay:-17s}.sparkles i:nth-child(6){left:62%;animation-duration:34s;animation-delay:-9s;background:#94f6d6}.sparkles i:nth-child(7){left:71%;animation-duration:25s;animation-delay:-21s}.sparkles i:nth-child(8){left:80%;animation-duration:30s;animation-delay:-3s;background:#ffe4a4}.sparkles i:nth-child(9){left:90%;animation-duration:28s;animation-delay:-18s}.sparkles i:nth-child(10){left:96%;animation-duration:33s;animation-delay:-26s;background:#94f6d6}
.bio-shell{position:relative;z-index:1}a.neon{overflow:hidden}.tap-ripple{position:absolute;width:180px;height:180px;left:var(--rx);top:var(--ry);border-radius:50%;background:radial-gradient(circle,#d9c4ff26,transparent 70%);border:1px solid #d9c4ff55;pointer-events:none;z-index:3;animation:tap-wave .6s ease-out forwards}
.page-paused *,.page-paused *::before,.page-paused *::after{animation-play-state:paused!important}
@keyframes avatar-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes avatar-orbit{to{transform:rotate(360deg)}}
@keyframes equalizer{from{transform:scaleY(.25)}to{transform:scaleY(1)}}
@keyframes particle-rise{0%{transform:translate3d(0,105vh,0);opacity:0}15%,75%{opacity:.42}100%{transform:translate3d(28px,-5vh,0);opacity:0}}
@keyframes tap-wave{from{transform:translate(-50%,-50%) scale(.1);opacity:.9}to{transform:translate(-50%,-50%) scale(2.6);opacity:0}}
@media(max-width:480px){.avatar.logo-avatar{width:126px;height:126px}.sparkles i:nth-child(even){display:none}.sound-toolbar{top:9px;margin-bottom:12px}.sound-toggle{padding:10px 14px}}
@media(prefers-reduced-motion:reduce){.sparkles,.tap-ripple{display:none}.avatar.logo-avatar,.avatar.logo-avatar::before{animation:none}.sound-toggle.is-on .equalizer i{animation:none;transform:none}}