:root{--bg: #000;--fg: #eaeaea;--font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial}html,body,#root{height:100%;margin:0;padding:0}html,body{background:var(--bg);color:var(--fg);font-family:var(--font-sans);color-scheme:dark;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}*{margin:0;padding:0;box-sizing:border-box}body,html,#root{height:100%;font-family:Inter,sans-serif;background:linear-gradient(160deg,#0f2027,#203a43,#2c5364)}.login-page{height:100vh;display:flex;justify-content:center;align-items:center;padding:16px}.login-box{width:100%;max-width:340px;display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}.login-logo{width:80px;margin-bottom:12px}.login-title{font-size:1.5rem;font-weight:600;color:#fff;margin-bottom:16px}.login-input{width:100%;padding:14px;border:none;border-radius:8px;font-size:1rem;outline:none;background:#ffffffe6;transition:box-shadow .2s;color:gray;font-weight:700}.login-input:focus{box-shadow:0 0 0 2px #00c6ff}.login-btn{width:100%;padding:14px;border:none;border-radius:8px;background:#00c6ff;background:linear-gradient(135deg,#00c6ff,#0072ff);color:#fff;font-size:1rem;font-weight:600;cursor:pointer;transition:opacity .2s}.login-btn:disabled{opacity:.7;cursor:not-allowed}.login-error{color:#fdd;background:#ff00004d;font-size:.9rem;padding:6px 10px;border-radius:6px}.login-foot{font-size:.8rem;color:#eee;margin-top:20px}.player-viewport{position:fixed;inset:0;width:100vw;height:100dvh;background:#000;overflow:hidden}.centerer{position:absolute;left:50%;top:50%;transform-origin:center center;width:1920px;height:1080px}.stage{position:relative;width:1920px;height:1080px;background:#000;color:#fff;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.music-grid{position:absolute;inset:0;display:grid;grid-template-rows:899px 181px;grid-template-columns:1599px 321px;grid-template-areas:"video sidebar" "footer footer"}.video-area{grid-area:video;width:1599px;height:899px;background:#000;display:flex;align-items:center;justify-content:center}.video-area video{width:1599px;height:899px;object-fit:cover}.sidebar{grid-area:sidebar;width:321px;height:899px;background:#4e0555;display:flex;align-items:center;justify-content:center}.sidebar-img{width:100%;height:100%;object-fit:cover;display:block}.footer{position:absolute;left:0;bottom:0;width:1920px;height:181px;background:#4e0555;overflow:hidden;display:flex;align-items:center}.marquee{display:inline-flex;align-items:center}.marquee .banner{margin-right:24px}.marquee .banner:last-child{margin-right:0}@supports (gap: 24px){.marquee{gap:24px}.marquee .banner{margin-right:0}}.marquee{padding-left:24px;-webkit-transform:translateZ(0);transform:translateZ(0);will-change:transform;-webkit-animation:scroll 25s linear infinite;animation:scroll 25s linear infinite}.banner{height:130px;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;padding:6px 14px;-webkit-transform:translateZ(0);transform:translateZ(0)}.banner img{height:100%;width:auto;object-fit:contain;display:block}.ad-full{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#000;z-index:1}.ad-full video{width:100%;height:100%;object-fit:cover;display:block;position:relative;z-index:1;transform:translateZ(0);backface-visibility:hidden;will-change:transform}video::-webkit-media-controls,video::-webkit-media-controls-enclosure{display:none!important}@media (prefers-reduced-motion: reduce){.marquee{-webkit-animation-duration:40s;animation-duration:40s}}.player-viewport .marquee{display:inline-flex;-webkit-transform:translateZ(0);transform:translateZ(0);will-change:transform;-webkit-animation:scroll 25s linear infinite;animation:scroll 25s linear infinite;-webkit-animation-play-state:running!important;animation-play-state:running!important}.player-viewport .marquee.force-anim{-webkit-animation:scroll 25s linear infinite!important;animation:scroll 25s linear infinite!important;-webkit-animation-play-state:running!important;animation-play-state:running!important}@media (prefers-reduced-motion: reduce){.player-viewport .marquee{-webkit-animation-duration:40s;animation-duration:40s}}.player-viewport .marquee{display:inline-flex;padding-left:24px;-webkit-animation:scroll 25s linear infinite!important;animation:scroll 25s linear infinite!important;-webkit-animation-play-state:running!important;animation-play-state:running!important;-webkit-transform:translateZ(0);transform:translateZ(0);will-change:transform}.player-viewport .marquee .banner{margin-right:24px}@supports (gap: 24px){.player-viewport .marquee{gap:24px}.player-viewport .marquee .banner{margin-right:0}}@-webkit-keyframes scroll{0%{-webkit-transform:translate3d(0,0,0);transform:translateZ(0)}to{-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}}@keyframes scroll{0%{-webkit-transform:translate3d(0,0,0);transform:translateZ(0)}to{-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}}@media (prefers-reduced-motion: reduce){.player-viewport .marquee{-webkit-animation-duration:40s!important;animation-duration:40s!important}}:root{--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--bg: #f8f9fc;--card-bg: #ffffff;--text: #1a202c;--text-muted: #718096;--border: #e2e8f0;--brand: #6366f1;--brand-light: #e0e7ff;--brand-lightest: #f0f4ff;--danger: #ef4444;--danger-light: #fee2e2;--success: #10b981;--success-light: #d1fae5;--warn-text: #7a5b00;--warn-bg: #fff7e5;--warn-border: #ffe6b3;--radius-md: 8px;--radius-lg: 16px;--shadow: 0 4px 6px -1px rgba(0,0,0,.1), 0 2px 4px -1px rgba(0,0,0,.06);--transition: all .2s cubic-bezier(.4,0,.2,1)}.videos-page{font-family:var(--font-sans);background-color:var(--bg);color:var(--text);padding:24px;display:flex;flex-direction:column;gap:24px;min-height:100vh}.page-content{display:grid;grid-template-columns:380px 1fr;gap:24px;align-items:flex-start}.upload-card,.library-card{background-color:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow)}.upload-card{padding:24px;position:sticky;top:24px}.upload-card h2{margin:0 0 16px;font-size:18px}.page-header{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:16px}.page-header h1{margin:0;font-size:28px;font-weight:800}.page-header p{margin:4px 0 0;color:var(--text-muted)}.kpi-group{display:flex;gap:12px}.kpi{background-color:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:12px 16px;text-align:center;min-width:100px}.kpi span{display:block;font-size:12px;color:var(--text-muted)}.kpi strong{display:block;font-size:22px;font-weight:700;color:var(--brand)}.upload-form-item{display:flex;flex-direction:column;gap:16px;padding-bottom:24px;border-bottom:1px solid var(--border)}.upload-form-item:last-of-type{border-bottom:none;padding-bottom:0}.dropzone{border:2px dashed var(--border);border-radius:var(--radius-md);padding:24px;text-align:center;color:var(--text-muted);transition:var(--transition);cursor:pointer}.dropzone.dragging,.dropzone:hover{border-color:var(--brand);background-color:var(--brand-light)}.dropzone svg{width:32px;height:32px;stroke:var(--text-muted);margin-bottom:8px;transition:var(--transition)}.dropzone:hover svg{stroke:var(--brand)}.dropzone label{cursor:pointer}.dropzone strong{color:var(--brand);font-weight:600}.form-fields{display:flex;flex-direction:column;gap:12px}.field>span{font-size:13px;font-weight:500;color:var(--text-muted)}.input{width:100%;height:42px;padding:0 12px;border:1px solid var(--border);border-radius:var(--radius-md);background-color:#fff;font:inherit;font-size:14px;transition:var(--transition)}.input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-light)}.select-tipo{background-color:var(--brand-lightest);color:var(--brand)}.add-more-btn{width:100%;justify-content:center;margin-top:16px}.library-card{padding:24px}.library-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;margin-bottom:24px;padding-bottom:24px;border-bottom:1px solid var(--border)}.library-header p{margin:4px 0 0;color:var(--text-muted);font-size:14px}.filters{display:flex;gap:16px;flex-wrap:wrap}.filter{display:flex;align-items:center;gap:8px}.filter>span{font-size:14px;color:var(--text-muted);white-space:nowrap}.video-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;padding-top:0}.empty-state{grid-column:1 / -1;text-align:center;padding:48px 24px;border:2px dashed var(--border);border-radius:var(--radius-md)}.empty-state h3{margin:0 0 8px}.empty-state p{margin:0;color:var(--text-muted)}.video-card{background-color:#fff;border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;transition:var(--transition);opacity:1}.video-card.inactive{opacity:.6}.video-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.video-card.inactive:hover{opacity:1}.video-preview{position:relative}.video-preview video{display:block;width:100%;height:160px;object-fit:cover;background-color:#000}.video-card:hover .overlay-actions{opacity:1}.video-info{padding:12px}.video-title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0 0 8px}.video-meta{display:flex;justify-content:space-between;align-items:center}.chip{padding:4px 10px;border-radius:999px;font-size:12px;font-weight:600;text-transform:uppercase}.chip-music{background-color:var(--brand-light);color:var(--brand)}.chip-ad{background-color:var(--warn-bg);color:var(--warn-text);border:1px solid var(--warn-border)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:42px;padding:0 16px;border-radius:var(--radius-md);border:1px solid transparent;font-weight:600;font-size:14px;cursor:pointer;transition:var(--transition)}.btn:disabled{cursor:not-allowed;opacity:.5}.btn-primary{background-color:var(--brand);color:#fff}.btn-primary:not(:disabled):hover{filter:brightness(1.1)}.btn-secondary{background-color:transparent;color:var(--brand);border-color:var(--brand)}.btn-secondary:not(:disabled):hover{background-color:var(--brand-light)}.btn-icon{width:32px;height:32px;border-radius:50%;background:#00000080;color:#fff;border:none;padding:0}.btn-icon:hover{background:var(--danger)}.switch{--w: 52px;--h: 28px;position:relative;display:inline-flex;align-items:center;width:var(--w);height:var(--h);border-radius:999px;background-color:#ccc;cursor:pointer;transition:var(--transition)}.switch.on{background-color:var(--success)}.switch span{font-size:11px;font-weight:600;color:#fff;transition:var(--transition)}.switch .knob{position:absolute;top:3px;left:3px;width:22px;height:22px;background-color:#fff;border-radius:50%;box-shadow:0 1px 3px #0003;transition:transform .2s ease-in-out}.switch.on .knob{transform:translate(calc(var(--w) - 100% - 6px))}@keyframes pulse{50%{opacity:.5}}.skeleton{animation:pulse 1.5s cubic-bezier(.4,0,.6,1) infinite;background-color:#e2e8f0;border-radius:var(--radius-md)}.video-card-skeleton{display:flex;flex-direction:column;gap:8px}.skeleton-preview{height:160px}.skeleton-text{height:20px}.skeleton-text.short{width:60%}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,150%);padding:12px 20px;border-radius:var(--radius-md);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;font-weight:600;z-index:1000;transition:transform .4s ease-in-out;pointer-events:none}.toast-success{background-color:var(--success-light);color:var(--success)}.toast-error{background-color:var(--danger-light);color:var(--danger)}@media (max-width: 900px){.page-content{grid-template-columns:1fr}.upload-card{position:static}}@media (max-width: 600px){.videos-page{padding:16px}.page-header{flex-direction:column;align-items:stretch}.video-grid{padding:16px;gap:16px}.toast{width:calc(100% - 32px)}.library-header{flex-direction:column;align-items:flex-start}}html,body,#root{min-height:100%;height:auto;overflow-y:auto!important}:root{--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--bg:#F4F3FF;--surface:#FFFFFF;--card:#FFFFFF;--text:#1A1B2E;--muted:#6B6F8A;--border:#E6E6F2;--brand:#6C63FF;--brand-600:#5B53F7;--brand-100:#EBE9FF;--brand-050:#F6F5FF;--success:#10B981;--danger:#EF4444;--danger-100:#FEE2E2;--radius-md:16px;--radius-lg:22px;--shadow-sm:0 2px 8px rgba(17,24,39,.06);--shadow-md:0 10px 24px rgba(17,24,39,.1);--transition:all .2s cubic-bezier(.4,0,.2,1)}.banners-page{font-family:var(--font-sans);color:var(--text);background:radial-gradient(1200px 800px at -10% -10%,#EEE9FF 0%,transparent 40%),var(--bg);padding:16px;display:flex;flex-direction:column;gap:16px;min-height:100vh;max-width:1100px;margin:0 auto}.page-header{display:flex;gap:14px;align-items:stretch;flex-wrap:wrap}.hero-card{flex:1 1 540px;min-height:110px;border-radius:var(--radius-lg);background:linear-gradient(135deg,var(--brand) 0%,#8E87FF 100%);color:#fff;padding:18px 20px;box-shadow:var(--shadow-md);display:flex;align-items:center}.hero-text h1{margin:0 0 4px;font-size:22px;font-weight:800}.hero-text p{margin:0;opacity:.95;font-size:13px}.kpi-group{display:flex;gap:10px;align-items:stretch;flex-wrap:wrap}.kpi{min-width:110px;background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:12px 14px;box-shadow:var(--shadow-sm);text-align:center}.kpi span{display:block;font-size:12px;color:var(--muted)}.kpi strong{display:block;font-size:20px;color:var(--brand);margin-top:2px}.page-content{display:grid;grid-template-columns:1fr;gap:16px;align-items:flex-start}@media (min-width:900px){.page-content{grid-template-columns:360px 1fr;gap:20px}}.upload-card,.library-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}.upload-card{padding:18px;position:static}@media (min-width:900px){.upload-card{position:sticky;top:16px}}.upload-card h2{margin:0 0 10px;font-size:18px}.upload-card form{display:flex;flex-direction:column;gap:12px}.dropzone{border:2px dashed var(--brand-100);background:var(--brand-050);border-radius:18px;padding:20px;text-align:center;color:var(--muted);transition:var(--transition);cursor:pointer;position:relative}.dropzone:hover{border-color:var(--brand);background:#f0efff}.dropzone.dragging{border-color:var(--brand-600);box-shadow:0 0 0 6px #6c63ff26}.dropzone .drop-icon{width:42px;height:42px;display:grid;place-items:center;margin:0 auto 8px}.dropzone input{position:absolute;inset:0;opacity:0;cursor:pointer}.form-fields{display:grid;grid-template-columns:1fr;gap:10px}@media (min-width:520px){.form-fields{grid-template-columns:1fr 1fr}}.field{display:flex;flex-direction:column;gap:6px}.field>span{font-size:12px;color:var(--muted);font-weight:600}.input{height:44px;padding:0 12px;border-radius:12px;border:1px solid var(--border);background:#fff;font:inherit;font-size:14px;transition:var(--transition)}.input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 4px var(--brand-100)}.input-numero{color:gray;font-weight:700}.upload-actions{display:flex;gap:10px;justify-content:flex-end}.btn{height:42px;padding:0 16px;border-radius:999px;border:0;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:var(--transition)}.btn.ghost{background:#fff;border:1px solid var(--border);color:var(--text)}.btn.ghost:hover{filter:brightness(1.02)}.btn-primary{background:linear-gradient(135deg,var(--brand) 0%,#8E87FF 100%);color:#fff;box-shadow:0 8px 18px #6c63ff40}.btn-primary:hover{transform:translateY(-1px);filter:brightness(1.03)}.btn:disabled{opacity:.6;cursor:not-allowed}.library-header{padding:16px 18px;border-bottom:1px solid var(--border)}.library-header h2{margin:0;font-size:18px}.library-header p{margin:4px 0 0;color:var(--muted)}.banner-grid{padding:18px;display:grid;gap:16px;grid-template-columns:1fr}@media (min-width:560px){.banner-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:960px){.banner-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}.banner-card{background:#fff;border:1px solid var(--border);border-radius:18px;overflow:hidden;transition:var(--transition);box-shadow:var(--shadow-sm)}.banner-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}.banner-card.inactive{opacity:.75}.banner-preview{position:relative;background:#f6f6f6}.banner-preview img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;border-bottom:1px solid var(--border)}.overlay-actions{position:absolute;top:8px;right:8px;display:flex;gap:8px;opacity:0;transition:var(--transition)}.banner-card:hover .overlay-actions{opacity:1}.btn-icon{width:36px;height:36px;display:grid;place-items:center;border-radius:12px;background:#1a1b2e8c;color:#fff;border:0}.btn-icon:hover{filter:brightness(1.08)}.btn-icon.danger{background:#ef4444eb}.banner-info{padding:12px 12px 14px}.meta-row{display:flex;justify-content:space-between;gap:10px;margin-bottom:10px}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,monospace;font-size:12px;color:var(--muted)}.truncate{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.controls-row{display:flex;justify-content:space-between;align-items:center;gap:12px}.order{display:flex;align-items:center;gap:6px}.order-input{width:74px;height:36px;border-radius:12px;border:1px solid var(--border);text-align:center;font:inherit}.switch{--w: 90px;--h: 32px;position:relative;width:var(--w);height:var(--h);border-radius:999px;background:#c7c9e2;border:1px solid #BFC2DF;display:inline-flex;align-items:center;justify-content:flex-start;transition:var(--transition);padding-left:6px;gap:6px}.switch .knob{position:absolute;top:3px;left:3px;width:26px;height:26px;border-radius:50%;background:#fff;box-shadow:0 2px 6px #00000026;transition:transform .2s ease-in-out}.switch .switch-label{color:#fff;font-size:11px;font-weight:800;margin-left:32px;pointer-events:none}.switch.on{background:linear-gradient(135deg,var(--success) 0%,#28C596 100%);border-color:transparent}.switch.on .knob{transform:translate(calc(var(--w) - 32px))}.empty-state{grid-column:1 / -1;border:2px dashed var(--border);border-radius:16px;padding:40px 20px;text-align:center;background:#fff}.toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,150%);padding:10px 16px;border-radius:14px;font-weight:800;background:#d1fae5;color:#065f46;box-shadow:var(--shadow-md);z-index:1000;transition:transform .4s ease-in-out;pointer-events:none}.toast.show{transform:translate(-50%)}.toast-error{background:var(--danger-100);color:var(--danger)}.app-header{position:sticky;top:16px;z-index:50;margin:16px;height:72px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;border-radius:16px;background:linear-gradient(180deg,#a58bff,#8e79ff);box-shadow:0 12px 30px #00000040;color:#fff}.app-header .header-left{display:flex;align-items:center;gap:10px}.app-header .brand{display:inline-flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.2px;cursor:pointer;-webkit-user-select:none;user-select:none}.app-header .dot{width:10px;height:10px;border-radius:999px;background:#fff;box-shadow:0 0 0 4px #ffffff40 inset}.app-header .icon-btn{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:12px;border:1px solid rgba(255,255,255,.25);background:#ffffff1f;cursor:pointer;transition:transform .08s ease,background .2s ease,border-color .2s ease}.app-header .icon-btn:hover{background:#ffffff2e}.app-header .icon-btn:active{transform:translateY(1px)}.app-header .icon-btn svg{fill:none;stroke:#fff;stroke-width:2}.app-header .tabs{display:flex;align-items:center;gap:10px;isolation:isolate}.app-header .tab{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 12px;border-radius:12px;border:1px solid rgba(255,255,255,.28);background:#ffffff24;color:#fff;text-decoration:none;font-weight:600;letter-spacing:.2px;transition:background .2s ease,border-color .2s ease,transform .08s ease}.app-header .tab:hover{background:#fff3}.app-header .tab:active{transform:translateY(1px)}.app-header .tab-icon{display:inline-grid;place-items:center;width:22px;height:22px}.app-header .tab-icon svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:2}.app-header .tab.active,.app-header .tab[aria-current=page]{background:#fff;color:#6f5bff;border-color:#fff}.app-header .tab.active .tab-icon svg,.app-header .tab[aria-current=page] .tab-icon svg{stroke:#6f5bff}.app-header .tab.ghost{cursor:default}.app-header .actions{display:flex;align-items:center;gap:10px}.app-header .avatar{width:40px;height:40px;border-radius:999px;border:2px solid rgba(255,255,255,.65);background:#fff;color:#6f5bff;font-weight:800;display:inline-grid;place-items:center;cursor:pointer;transition:transform .08s ease,box-shadow .2s ease}.app-header .avatar:hover{box-shadow:0 0 0 4px #fff3}.app-header .avatar:active{transform:translateY(1px)}@media (max-width: 960px){.app-header{height:64px;padding:0 10px}.app-header .brand strong{display:none}.app-header .tabs{gap:8px}.app-header .tab{height:40px;padding:0 10px}.app-header .tab-label{display:none}}