@font-face{font-family:JF Open Huninn;src:url(/Font/jf-openhuninn-2.1.woff2) format("woff2"),url(/Font/jf-openhuninn-2.1.woff) format("woff");font-weight:400;font-style:normal}body,#root{margin:0;padding:20px;background:transparent;font-family:JF Open Huninn,sans-serif}.superchat-container{width:400px;margin-top:10px;margin-left:10px;position:relative}.pinned-container{display:flex;flex-direction:column;gap:20px;margin-bottom:20px}.superchat-scroll{display:flex;flex-direction:column;gap:20px;position:relative}.superchat-exit{animation:superchatExit .6s cubic-bezier(.4,0,.2,1) forwards}@keyframes superchatExit{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-100%) scale(.9);margin-bottom:-180px}}.superchat{background:transparent;border-radius:13px;padding:0;color:#fff;position:relative;overflow:hidden;width:100%;margin-bottom:0;transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.superchat:hover{transform:translate(8px) scale(1.02)}.superchat.is-new{opacity:0;transform:translate(-100px);animation:slideIn 1.5s cubic-bezier(.22,1,.36,1) forwards;transform-origin:center left}.superchat:before{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;background:linear-gradient(90deg,#fff3,#ffffff1a,#fff3);opacity:0;z-index:-1;border-radius:15px;transition:opacity .3s ease}.superchat:hover:before{opacity:1}.superchat:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(45deg,transparent 0%,rgba(255,255,255,.08) 45%,rgba(255,255,255,.08) 55%,transparent 100%);opacity:0;transition:opacity .3s ease}.superchat:hover:after{opacity:1}.superchat-header{display:flex;align-items:center;gap:16px;position:relative;padding:10px 20px;background:#0003;border-radius:13px 13px 0 0}.avatar{width:52px;height:52px;min-width:52px;min-height:52px;border-radius:100%;overflow:hidden;position:relative;transform:translateY(0);transition:transform .3s ease;z-index:2}.avatar:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(45deg,rgba(255,255,255,.2),transparent);z-index:1}.avatar img{width:100%;height:100%;object-fit:cover}.user-info{flex-grow:1;z-index:2}.superchat-username{font-weight:700;font-size:1.3rem;color:#fff;margin-bottom:3px;text-shadow:-2px 0 #000,0 -2px #000,2px 0 #000,0 2px #000,-1.4px -1.4px #000,1.4px -1.4px #000,1.4px 1.4px #000,-1.4px 1.4px #000}.superchat-amount{display:inline-block;font-size:1.3rem;font-weight:700;letter-spacing:.5px;position:relative;color:#fff!important;text-shadow:-2px 0 #000,0 -2px #000,2px 0 #000,0 2px #000,-1.4px -1.4px #000,1.4px -1.4px #000,1.4px 1.4px #000,-1.4px 1.4px #000}.superchat-message{font-size:20px;line-height:1.6;color:#fff;padding:8px 20px 40px;position:relative;margin-left:0;z-index:2;width:calc(100% - 40px);word-wrap:break-word;min-height:40px;background:transparent;text-shadow:-2px 0 #000,0 -2px #000,2px 0 #000,0 2px #000,-1.4px -1.4px #000,1.4px -1.4px #000,1.4px 1.4px #000,-1.4px 1.4px #000}@keyframes shine{0%{transform:translate(-100%) rotate(35deg);opacity:0}10%{opacity:0}20%{opacity:.5}30%{opacity:0}to{transform:translate(100%) rotate(35deg);opacity:0}}@keyframes slideIn{0%{opacity:0;transform:translate(-120px) scale(.7);box-shadow:0 0 #fff0}35%{opacity:1;transform:translate(10px) scale(1.05);box-shadow:0 0 20px #ffffff4d}60%{transform:translate(-5px) scale(.97);box-shadow:0 0 10px #fff3}80%{transform:translate(2px) scale(.99);box-shadow:0 0 15px #ffffff40}to{opacity:1;transform:translate(0) scale(1);box-shadow:0 0 #fff0}}.tier-1{background:#60defb}.tier-1 .superchat-amount{color:#fff}.tier-1 .superchat-header{background:#4fb4d2}.tier-1 .superchat-message{background:none}.tier-2{background:#4fe8c1}.tier-2 .superchat-amount{color:#fff}.tier-2 .superchat-header{background:#40bda9}.tier-2 .superchat-message{background:none}.tier-3{background:#f5ff83}.tier-3 .superchat-amount{color:#fff}.tier-3 .superchat-header{background:#d0dd54}.tier-3 .superchat-message{background:none}.tier-4{background:#e9851d}.tier-4 .superchat-amount{color:#fff}.tier-4 .superchat-header{background:#d95c00}.tier-4 .superchat-message{background:none}.tier-5{background:#da3900}.tier-5 .superchat-amount{color:#fff}.tier-5 .superchat-header{background:#c42700}.tier-5 .superchat-message{background:none}.tier-6{position:relative;background:linear-gradient(90deg,#f66,#f96,#ff6,#9f6,#6f6,#6f9,#6ff,#69f,#66f,#96f,#f6f,#f69)}.tier-6 .superchat-header{background:#0000000d}.tier-6:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:inherit;filter:blur(8px);z-index:-1}.progress-bar{position:absolute;bottom:0;left:0;width:100%;height:6px;background:#0006;overflow:hidden}.progress-fill{height:100%;background:#ffffffe6;transition:width .1s linear;box-shadow:0 0 8px #fff9}.tier-1 .progress-fill{background:#60defb;box-shadow:0 0 8px #60defb}.tier-2 .progress-fill{background:#4fe8c1;box-shadow:0 0 8px #4fe8c1}.tier-3 .progress-fill{background:#f5ff83;box-shadow:0 0 8px #f5ff83}.tier-4 .progress-fill{background:#e9851d;box-shadow:0 0 8px #e9851d}.tier-5 .progress-fill{background:#da3900;box-shadow:0 0 8px #da3900}.tier-6 .progress-fill{background:linear-gradient(90deg,red,#ff8000,#ff0,#80ff00,#0f0,#00ff80,#0ff,#0080ff,#00f,#8000ff,#f0f,#ff0080)}.floating-gif{position:absolute;bottom:6px;right:10px;pointer-events:none;z-index:1;object-fit:contain;max-width:140px}.test-controls{position:fixed;top:10px;right:10px;display:flex;gap:10px;z-index:1000}.test-button{padding:8px 16px;border:none;border-radius:4px;background:#0009;color:#fff;cursor:pointer;transition:background .3s;font-family:JF Open Huninn,sans-serif}.test-button:hover{background:#000c}