@property --a{syntax:'<angle>';initial-value:0deg;inherits:false}
:root{--gold:#d4af37;--gold2:#f6e27a;--bg:#05040a;--bd:rgba(255,255,255,.1);--tx:#f3efe2;--mut:#9a95a8;--rgb:#ff0040,#ffae00,#00ff9d,#00b7ff,#a200ff,#ff0040}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Segoe UI',system-ui,sans-serif;background:var(--bg);color:var(--tx);min-height:100vh;overflow-x:hidden;line-height:1.5}
body.nocopy,body.nocopy *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
input,textarea,select{-webkit-user-select:text;user-select:text}
.bg{position:fixed;inset:0;z-index:-1;overflow:hidden;background:radial-gradient(circle at 15% 10%,#1b0f3a,transparent 50%),radial-gradient(circle at 85% 90%,#2b0a2e,transparent 50%),var(--bg)}
.bg i{position:absolute;border-radius:50%;filter:blur(100px);opacity:.4;animation:fl 12s ease-in-out infinite}
.bg i:nth-child(1){width:380px;height:380px;background:#7c3aed;top:0;left:-10%}
.bg i:nth-child(2){width:340px;height:340px;background:#00b7ff;bottom:0;right:-8%;animation-delay:-5s}
.sq{position:absolute;bottom:-80px;border:1px solid;background:rgba(255,255,255,.02);animation:rise linear infinite;box-shadow:0 0 14px currentColor}
@keyframes rise{to{transform:translateY(-115vh) rotate(360deg);opacity:0}}
@keyframes fl{50%{transform:translate(50px,-60px) scale(1.2)}}
@keyframes spin{to{--a:360deg}}
@keyframes rgb{to{background-position:300% 0}}
#pg{position:fixed;top:0;left:0;height:3px;width:0;z-index:99;background:linear-gradient(90deg,var(--rgb));box-shadow:0 0 12px #00b7ff}
.wrap{max-width:880px;margin:0 auto;padding:30px 16px 70px}
.hero{text-align:center;padding:30px 10px}
.logo{position:relative;width:104px;height:104px;margin:0 auto 18px;border-radius:50%;display:grid;place-items:center;font-size:42px;font-weight:800;color:#fff;background:#0b0816;z-index:0}
.logo::before{content:'';position:absolute;inset:-4px;border-radius:50%;z-index:-1;background:conic-gradient(from var(--a),var(--rgb));animation:spin 3s linear infinite;box-shadow:0 0 30px rgba(0,183,255,.6)}
.logo::after{content:'';position:absolute;inset:0;border-radius:50%;z-index:-1;background:#0b0816}
h1{font-size:2.3rem;font-weight:800;background:linear-gradient(90deg,var(--rgb));background-size:300%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:rgb 6s linear infinite;filter:drop-shadow(0 0 14px rgba(0,183,255,.35))}
.tag{color:var(--mut);margin-top:4px;letter-spacing:1px}.about{margin-top:12px;color:#d6d1c4}
.badge,.rgbtxt{font-weight:800;letter-spacing:4px;background:linear-gradient(90deg,var(--rgb));background-size:300%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:rgb 5s linear infinite}
.badge{position:relative;display:inline-block;margin-top:18px;padding:8px 22px;border-radius:30px;font-size:.8rem;background-color:rgba(255,255,255,.04)}
h2{margin:40px 0 16px;font-size:1.2rem;letter-spacing:2px;color:#fff;text-shadow:0 0 14px #00b7ff}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.soc,.app,.box{position:relative;background:rgba(18,14,32,.7);border-radius:16px;backdrop-filter:blur(14px);transition:transform .3s,box-shadow .3s}
.soc::before,.app::before,.box::before{content:'';position:absolute;inset:0;border-radius:inherit;padding:1.5px;background:conic-gradient(from var(--a),var(--rgb));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:spin 4s linear infinite;pointer-events:none;opacity:.8}
.soc{display:flex;align-items:center;gap:12px;padding:16px;color:var(--tx);text-decoration:none}
.soc:hover{transform:translateY(-6px) scale(1.03);box-shadow:0 12px 34px color-mix(in srgb,var(--c) 45%,transparent)}
.soc b{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:22px;background:color-mix(in srgb,var(--c) 25%,transparent);box-shadow:0 0 16px color-mix(in srgb,var(--c) 50%,transparent)}
.app{display:flex;align-items:center;gap:12px;padding:16px;margin-bottom:12px}
.app:hover{transform:translateX(6px);box-shadow:0 8px 30px rgba(162,0,255,.3)}
.app .i{flex:1;min-width:0}.app .n{font-weight:700}.app .m{font-size:.8rem;color:var(--mut)}
.btn,button{position:relative;overflow:hidden;cursor:pointer;border:0;padding:10px 20px;border-radius:12px;font-weight:800;color:#fff;text-decoration:none;font-size:.9rem;text-shadow:0 1px 4px rgba(0,0,0,.6);background:linear-gradient(90deg,var(--rgb));background-size:300%;animation:rgb 6s linear infinite;box-shadow:0 0 18px rgba(0,183,255,.4);transition:transform .2s,box-shadow .2s}
.btn:hover,button:hover{transform:translateY(-2px) scale(1.05);box-shadow:0 0 30px rgba(255,0,100,.6)}
.btn:active,button:active{transform:scale(.95)}
.btn::after,button::after{content:'';position:absolute;top:0;left:-80%;width:50%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);animation:sh 3s infinite}
@keyframes sh{60%,100%{left:140%}}
button.sec{background:#1c1730;animation:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}
button.red{background:linear-gradient(90deg,#ff0040,#b3002d);animation:none}
.rip{position:absolute;border-radius:50%;background:rgba(255,255,255,.5);transform:scale(0);animation:rp .6s linear;pointer-events:none}
@keyframes rp{to{transform:scale(4);opacity:0}}
input,textarea,select{width:100%;padding:11px 13px;margin:4px 0;border-radius:11px;border:1px solid var(--bd);background:rgba(0,0,0,.4);color:var(--tx);font:inherit;transition:.25s}
input:focus,textarea:focus,select:focus{outline:0;border-color:#00b7ff;box-shadow:0 0 14px rgba(0,183,255,.5)}
.search{margin-bottom:14px}
.foot{text-align:center;margin-top:50px;color:var(--mut);font-size:.9rem}.foot .rgbtxt{font-size:1.1rem;display:inline-block;margin-top:8px}
.box{padding:18px;margin-bottom:16px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}.tabs a{padding:9px 15px;border-radius:11px;border:1px solid var(--bd);color:var(--tx);text-decoration:none;font-size:.9rem;background:rgba(255,255,255,.04);transition:.25s}.tabs a:hover{border-color:#00b7ff;box-shadow:0 0 14px rgba(0,183,255,.5)}.tabs a.on{background:linear-gradient(90deg,#7c3aed,#00b7ff);border-color:transparent}
.msg{padding:12px;border-radius:12px;background:rgba(0,183,255,.15);border:1px solid rgba(0,183,255,.4);margin-bottom:14px}
.off{opacity:.5}label{font-size:.8rem;color:var(--mut)}
.rv{opacity:0;transform:translateY(40px) scale(.96);transition:opacity .7s,transform .7s cubic-bezier(.2,.8,.2,1)}.rv.in{opacity:1;transform:none}
@media(max-width:520px){.row{grid-template-columns:1fr}h1{font-size:1.8rem}}