body,html{margin:0;padding:0;font-family:sans-serif;height:100%;overflow-x:hidden}.site-header{position:fixed;top:0;left:0;width:100%;height:90px;z-index:1000;box-shadow:0 2px 12px #2c2c5412;background:#181834;padding:0 1.7rem;display:grid;grid-template-columns:auto 1fr auto;align-items:center;border-bottom:1px solid #313244;transform:none!important;box-sizing:border-box}.logo-container{display:flex;align-items:center;gap:.85rem;text-decoration:none;flex-shrink:0;height:100%}.logo-image{height:46px;width:auto;aspect-ratio:552 / 464}.logo-text{font-size:1.7rem;font-weight:700;color:#eac0f2;line-height:1}.header-link{color:#cdd6f4;text-decoration:none;font-weight:500;line-height:1;font-size:1.05rem}.header-link:hover{color:#eac0f2}.header-button{padding:.7rem 1.4rem;border-radius:9px;border:none;background-color:#daa520;color:#1e1e2e;font-weight:700;cursor:pointer;text-decoration:none;transition:background-color .2s ease;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;line-height:1;font-size:1.05rem}.header-button:hover{background-color:#b8860b}.header-button-small{padding:.6rem 1.15rem;border-radius:7px;border:1px solid #89b4fa;background-color:transparent;color:#89b4fa;cursor:pointer;transition:background-color .2s ease,color .2s ease;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;white-space:nowrap;line-height:1;font-size:1.05rem}.header-button-small:hover{background-color:#89b4fa;color:#1e1e2e}.header-center-section{display:flex;justify-content:center;align-items:center;min-width:0;height:100%}.setup-header{display:flex;justify-content:center;align-items:center}.setup-header-content{display:flex;align-items:center;color:#cdd6f4;font-weight:500;font-size:1.1rem}.setup-text{white-space:nowrap}@media (max-width: 480px){.setup-header-content{font-size:1rem}@media (orientation: landscape){.setup-header-content{font-size:.9rem}}}@media (max-width: 320px){.setup-header-content{font-size:.9rem}}.stream-status-header{background:#ff00001a;border:1px solid rgba(255,0,0,.3);border-radius:23px;padding:.6rem 1.15rem;display:flex;align-items:center;gap:.6rem;line-height:1}.live-indicator-header{display:flex;align-items:center;gap:.6rem;color:#ff6b6b;font-weight:700;font-size:1rem;line-height:1}.live-dot-header{width:9px;height:9px;background:red;border-radius:50%;animation:pulse 1.5s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}.watching-stream-header{background:#0096ff1a;border:1px solid rgba(0,150,255,.3);border-radius:23px;padding:.6rem 1.15rem;display:flex;align-items:center;gap:.6rem;line-height:1}.watching-indicator{display:flex;align-items:center;gap:.6rem;color:#4fc3f7;font-weight:700;font-size:1rem;line-height:1}.watching-dot{width:9px;height:9px;background:#4fc3f7;border-radius:50%;animation:watching-pulse 2s infinite}@keyframes watching-pulse{0%,to{opacity:1}50%{opacity:.5}}.header-right-section{position:relative;display:flex;align-items:center;justify-content:flex-end;gap:1.15rem;height:100%}.menu-toggle-button{background:#313244;border:none;color:#cdd6f4;width:46px;height:46px;border-radius:50%;font-size:1.35rem;font-weight:700;cursor:pointer;display:flex;justify-content:center;align-items:center;transition:background-color .2s ease;flex-shrink:0}.menu-toggle-button:hover{background-color:#45475a}.dropdown-menu{position:absolute;top:calc(100% + 10px);right:0;background-color:#1e1e2e;border:1px solid #313244;max-width:80dvw;min-width:15dvw;max-height:85dvh;overflow-x:hidden;border-radius:8px;padding:.5rem;display:flex;flex-direction:column;gap:.25rem;z-index:1001;box-shadow:0 4px 20px #00000040}.dropdown-item{width:100%;text-align:left;padding:.75rem 1rem;background:none;border:none;color:#cdd6f4;cursor:pointer;border-radius:6px;text-decoration:none;display:block;font-size:1rem;transition:background-color .2s ease}.dropdown-item:hover{background-color:#313244}.dropdown-user-info{padding:.75rem 1rem;border-bottom:1px solid #313244;margin-bottom:.5rem;color:#cdd6f4}.dropdown-user-info strong{color:#fff}.dropdown-user-info small{color:#a6adc8}.desktop-header-items{display:none;align-items:center;gap:1.15rem;height:100%}.mobile-header-items{display:flex;align-items:center;gap:.85rem;height:100%}.user-balance{color:#cdd6f4;font-size:1.1rem;margin-right:1.15rem;white-space:nowrap;display:flex;align-items:center;line-height:1}.creator-balance{color:#f9e2af;font-weight:600;background:#daa5201a;padding:.4rem .8rem;border-radius:6px;border:1px solid rgba(218,165,32,.3)}.mobile-balance{font-size:.9rem;padding:.3rem .6rem;margin-right:.5rem}@media (min-width: 480px) and (max-width: 767px){.site-header{grid-template-columns:auto 1fr auto;padding:0 1.15rem;height:70px}@media (orientation: landscape){.site-header{height:60px!important;padding:0 1rem!important}.logo-image{height:35px!important;aspect-ratio:552 / 464}.logo-text{font-size:1.4rem!important}.header-button{padding:.5rem 1rem!important;font-size:.9rem!important}.header-button-small{padding:.4rem .8rem!important;font-size:.85rem!important}.stream-status-header{padding:.3rem .7rem!important;font-size:.8rem!important}.live-indicator-header{font-size:.8rem!important;gap:.25rem!important}.live-dot-header{width:6px!important;height:6px!important}.menu-toggle-button{width:35px!important;height:35px!important;font-size:1.1rem!important}.pill-avatar{width:30px!important;height:30px!important}.pill-avatar-fallback{width:30px!important;height:30px!important;font-size:1rem!important}.user-balance{font-size:.9rem!important;margin-right:.8rem!important}}.header-right-section{gap:.85rem}.stream-status-header{padding:.45rem .9rem;font-size:.9rem}.live-indicator-header{font-size:.9rem;gap:.35rem}.live-dot-header{width:7px;height:7px}.watching-stream-header{display:none}@media (max-width: 400px){.stream-status-header{padding:.25rem .5rem}.live-dot-header{width:5px;height:5px}}}@media (min-width: 768px){.desktop-header-items{display:flex}.mobile-header-items{display:none}.header-right-section{gap:1.45rem}.desktop-menu-toggle{margin-left:.5rem}}body,#root{padding-top:0!important}.profile-pill{display:flex;align-items:center;gap:.85rem;background-color:#e2e8f0;border:none;border-radius:9999px;padding:7px 18px;cursor:pointer;transition:background-color .2s ease;color:inherit;text-decoration:none}.profile-pill:hover{background-color:#cdd6f4}.pill-info{display:flex;flex-direction:column;align-items:flex-start;gap:.2rem}.pill-balance{font-size:.8rem;color:#f0b024;font-weight:600;background:#f5ce6b6d;padding:.2rem .4rem;border-radius:4px;border:1px solid rgba(218,165,32,.741)}.pill-avatar{width:46px;height:46px;border-radius:50%;object-fit:cover;flex-shrink:0}.pill-username{font-weight:600;color:#181834;max-width:140px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1;font-size:1rem}@media (max-width: 479px){.site-header{height:60px;padding:0 1rem}.logo-image{height:40px;aspect-ratio:552 / 464}.logo-text{font-size:1.5rem}.profile-pill{padding:5px 14px;gap:.45rem;max-width:140px}.pill-avatar{width:37px;height:37px}.pill-avatar-fallback{width:37px;height:37px;font-size:1.15rem}.pill-username{display:none}.header-button{padding:.6rem 1.15rem;font-size:1rem}.header-button-small{padding:.45rem .9rem;font-size:.95rem}.menu-toggle-button{width:40px;height:40px;font-size:1.2rem}.user-balance{font-size:1rem;margin-right:.8rem}.stream-status-header{padding:.35rem .7rem;font-size:.8rem}.live-indicator-header{font-size:.8rem;gap:.25rem}.header-icon-btn .edit-icon,.edit-icon{width:22px;height:22px}.header-icon-btn{padding:0;margin:0 2px}@media (orientation: portrait){.live-indicator-header .live-text{display:none}}.live-dot-header{width:6px;height:6px}@media (orientation: portrait){.site-header{height:60px!important;padding:0 .5rem!important}.logo-image{height:32px!important;aspect-ratio:552 / 464}.logo-text{font-size:1.2rem!important}.header-button{padding:.4rem .8rem!important;font-size:.85rem!important}.header-button-small{padding:.3rem .6rem!important;font-size:.8rem!important}.menu-toggle-button{width:32px!important;height:32px!important;font-size:1rem!important}.pill-avatar{width:28px!important;height:28px!important}.pill-avatar-fallback{width:28px!important;height:28px!important;font-size:.9rem!important}.user-balance{font-size:.8rem!important;margin-right:.5rem!important}.stream-status-header{padding:.25rem .5rem!important;font-size:.7rem!important}.live-indicator-header{font-size:.7rem!important;gap:.2rem!important}.live-dot-header{width:5px!important;height:5px!important}}@media (orientation: landscape){.live-indicator-header .live-text{display:inline}.site-header{height:60px!important;padding:0 .8rem!important}.logo-image{height:30px!important;aspect-ratio:552 / 464}.logo-text{font-size:1.2rem!important}.header-button{padding:.4rem .8rem!important;font-size:.8rem!important}.header-button-small{padding:.3rem .6rem!important;font-size:.75rem!important}.stream-status-header{padding:.25rem .6rem!important;font-size:.75rem!important}.live-indicator-header{font-size:.75rem!important;gap:.2rem!important}.live-dot-header{width:5px!important;height:5px!important}.menu-toggle-button{width:30px!important;height:30px!important;font-size:1rem!important}.pill-avatar{width:25px!important;height:25px!important}.pill-avatar-fallback{width:25px!important;height:25px!important;font-size:.9rem!important}.user-balance{font-size:.8rem!important;margin-right:.6rem!important}}}@media (max-width: 320px){.site-header{height:60px!important;padding:0 .2rem!important}.logo-image{height:24px!important;aspect-ratio:552 / 464}.logo-text{font-size:.9rem!important}.header-button{padding:.25rem .5rem!important;font-size:.7rem!important}.header-button-small{padding:.2rem .4rem!important;font-size:.65rem!important}.menu-toggle-button{width:24px!important;height:24px!important;font-size:.8rem!important}.pill-avatar{width:20px!important;height:20px!important}.pill-avatar-fallback{width:20px!important;height:20px!important;font-size:.7rem!important}.user-balance{font-size:.6rem!important;margin-right:.2rem!important}.stream-status-header{padding:.15rem .3rem!important;font-size:.6rem!important}.live-indicator-header{font-size:.6rem!important;gap:.1rem!important}.live-dot-header{width:3px!important;height:3px!important}}@media (max-width: 360px){.site-header{height:60px!important;padding:0 .3rem!important}.logo-image{height:28px!important;aspect-ratio:552 / 464}.logo-text{font-size:1rem!important}.header-button{padding:.3rem .6rem!important;font-size:.75rem!important}.header-button-small{padding:.25rem .5rem!important;font-size:.7rem!important}.menu-toggle-button{width:28px!important;height:28px!important;font-size:.9rem!important}.pill-avatar{width:24px!important;height:24px!important}.pill-avatar-fallback{width:24px!important;height:24px!important;font-size:.8rem!important}.user-balance{font-size:.7rem!important;margin-right:.3rem!important}.stream-status-header{padding:.2rem .4rem!important;font-size:.65rem!important}.live-indicator-header{font-size:.65rem!important;gap:.15rem!important}.live-dot-header{width:4px!important;height:4px!important}}.pill-avatar-fallback{display:flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:50%;color:#fff;font-size:1.4rem;font-weight:700;background:#8a2be2;flex-shrink:0;line-height:1}.header-icon-btn{background:none;border:none;padding:7px;border-radius:50%;cursor:pointer;display:flex;align-items:center;transition:background .2s}.header-icon-btn:hover{background:#f3e8ff}.edit-icon{width:32px;height:32px;color:#8a2be2;display:block}.mobile-user-controls{display:flex;align-items:center;gap:.6rem;height:100%}.header-button.save{background-color:#a6e3a1;color:#1e1e2e}.header-button.save:hover{background-color:#94e2d5}.header-button.start-stream{background-color:#f38ba8;color:#1e1e2e}.header-button.start-stream:hover{background-color:#eba0ac}.stream-icon{width:23px;height:23px;stroke:currentColor}.language-selector{padding:0!important;margin:0;border-top:1px solid #313244;max-width:100%}.language-label{padding:.75rem 1rem;display:flex;justify-content:space-between;align-items:center;cursor:pointer;user-select:none;font-size:1rem;white-space:nowrap;overflow:hidden}.language-label span{overflow:hidden;text-overflow:ellipsis;max-width:100%}.language-label:hover{background-color:#313244}.language-options{background-color:#313244;border-top:1px solid #45475a;max-width:100%}.language-option{width:90%;padding:.5rem 1rem;text-align:left;background:none;border:none;color:#cdd6f4;cursor:pointer;transition:all .2s ease;font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:.5rem;box-sizing:border-box}.language-option span{overflow:hidden;text-overflow:ellipsis;max-width:100%}.language-option:hover{background-color:#45475a;color:#eac0f2}.language-option.active{color:#eac0f2;font-weight:600}.language-option span,.language-label span{display:inline-flex;align-items:center;gap:.5rem;flex:1;min-width:0}.language-option svg,.language-label svg{flex-shrink:0}.app-loader{display:flex;justify-content:center;align-items:center;height:100vh;background:linear-gradient(135deg,#1a1a2e,#16213e)}.app-loader:after{content:"";width:50px;height:50px;border:3px solid rgba(255,255,255,.1);border-top-color:#e91e63;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.App{display:flex;flex-direction:column;align-items:center;width:100%}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}main,.main-content{padding-top:90px}.app-layout-admin{display:flex;width:100%;position:relative}.app-layout-normal{width:100%}.main-content-admin{width:70%;margin-left:30%;padding-top:0;height:calc(100vh - 90px);box-sizing:border-box}@media (max-width: 767px){main,.main-content{padding-top:60px}.app-layout-admin{margin-top:60px;flex-direction:column}.main-content-admin{width:100%;margin-left:0;min-height:calc(100vh - 60px)}}@media (max-width: 480px){main,.main-content{padding-top:60px}}@supports (-webkit-touch-callout: none){main,.main-content{padding-top:90px}@media (max-width: 767px){main,.main-content{padding-top:60px}}@media (max-width: 480px){main,.main-content{padding-top:60px}}}*,*:before,*:after{box-sizing:border-box}:root{font-family:Poppins,sans-serif;line-height:1.6;font-weight:400;color-scheme:light;color:#333;background-color:#f8f9fa;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html{height:100%}body{margin:0;display:flex;flex-direction:column;min-height:100vh;background:linear-gradient(135deg,#e0f7fa,#f3e5f5);overflow-x:hidden;width:100%;max-width:100vw}#root{margin:0 auto;text-align:center;flex-grow:1;display:flex;flex-direction:column;width:100%;max-width:100vw;overflow-x:hidden;min-height:100vh}h1,h2,h3{color:#4a148c;font-weight:700}p{color:#4527a0}button,.btn{border-radius:30px;border:none;padding:.9em 2em;font-size:1.05em;font-weight:600;font-family:inherit;cursor:pointer;transition:all .3s ease;margin:.7em;box-shadow:0 4px 12px #0000001a;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}button.btn-primary,.btn.btn-primary{background-color:#d84315;color:#fff}button.btn-primary:hover,.btn.btn-primary:hover{background-color:#bf360c;transform:translateY(-2px);box-shadow:0 6px 16px #00000026}button.btn-secondary,.btn.btn-secondary{background-color:#9c27b0;color:#fff}button.btn-secondary:hover,.btn.btn-secondary:hover{background-color:#7b1fa2;transform:translateY(-2px);box-shadow:0 6px 16px #00000026}button.btn-tertiary,.btn.btn-tertiary{background-color:#eceff1;color:#4a148c;box-shadow:none}button.btn-tertiary:hover,.btn.btn-tertiary:hover{background-color:#cfd8dc;transform:none;box-shadow:none}.card{background-color:#fffffff2;border-radius:20px;box-shadow:0 8px 30px #00000014;padding:30px;margin-bottom:30px;backdrop-filter:blur(5px)}form{display:flex;flex-direction:column;gap:1.8em;margin:0 auto;padding:35px;background-color:#fffffff2;border-radius:20px;box-shadow:0 8px 30px #00000014;text-align:left;backdrop-filter:blur(5px)}label{display:block;margin-bottom:.7em;font-weight:600;color:#4a148c}input[type=text],input[type=email],input[type=password],input[type=number],textarea{width:calc(100% - 24px);padding:14px 12px;border:1px solid #D1C4E9;border-radius:10px;font-size:1em;box-sizing:border-box;transition:border-color .3s ease,box-shadow .3s ease;background-color:#f8f9fa;color:#333}input[type=text]:focus,input[type=email]:focus,input[type=password]:focus,input[type=number]:focus,textarea:focus{border-color:#8e24aa;box-shadow:0 0 0 3px #8e24aa33;outline:none}textarea{resize:vertical;min-height:100px}.text-center{text-align:center}.margin-top-large{margin-top:40px}.spinner{border:6px solid #f3f3f3;border-top:6px solid #8E24AA;border-radius:50%;width:50px;height:50px;animation:spin 1s linear infinite;margin-bottom:15px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 480px){body{font-size:14px}button,.btn{padding:.8em 1.5em;font-size:1em}input[type=text],input[type=email],input[type=password],textarea{font-size:16px}}@media (max-width: 360px){body{font-size:13px}button,.btn{padding:.7em 1.2em;font-size:.9em}}html[data-text-dir=rtl] :is(p,span,h1,h2,h3,h4,h5,h6,label,small,strong,em,a,li,blockquote,figcaption,th,td){direction:rtl;unicode-bidi:plaintext}html[data-text-dir=rtl] input,html[data-text-dir=rtl] textarea{direction:rtl}
