/* Ativação responsiva: todos os dados e os dois botões permanecem visíveis. */
#activation{position:fixed!important;inset:0!important;box-sizing:border-box!important;width:100vw!important;height:100vh!important;min-width:0!important;min-height:0!important;display:grid!important;grid-template-columns:minmax(0,1fr) 430px!important;overflow:hidden!important}
#activation.hidden{display:none!important}
#activation .activation-main{box-sizing:border-box!important;min-width:0!important;min-height:0!important;padding:clamp(24px,4vh,44px) clamp(28px,5vw,72px)!important;display:flex!important;flex-direction:column!important;justify-content:center!important;overflow:hidden!important}
#activation .activation-header{position:absolute!important;left:clamp(28px,5vw,72px)!important;top:clamp(20px,4vh,42px)!important;gap:14px!important;font-size:clamp(22px,1.7vw,34px)!important}
#activation .activation-header .brand-mark{width:clamp(66px,6vw,100px)!important;height:clamp(66px,6vw,100px)!important;flex:0 0 auto!important}
#activation .activation-header i{height:52px!important}
#activation .activation-copy{position:static!important;width:min(760px,82%)!important;max-width:760px!important;margin:clamp(60px,7vh,90px) 0 0!important}
#activation .activation-copy .kicker{font-size:clamp(12px,.75vw,15px)!important}
#activation .activation-copy h1{margin:10px 0 18px!important;font-size:clamp(38px,3vw,60px)!important;line-height:1.08!important}
#activation .activation-copy>p:not(.kicker){margin:0!important;font-size:clamp(16px,1.12vw,23px)!important;line-height:1.5!important}
#activation .sync-state{box-sizing:border-box!important;width:100%!important;max-width:760px!important;margin-top:clamp(24px,4vh,42px)!important;padding:12px 16px!important;border-radius:12px!important;font-size:clamp(13px,.86vw,17px)!important}
#activation .sync-state .spinner{width:24px!important;height:24px!important;flex:0 0 auto!important}
#activation .activation-main footer{left:clamp(28px,5vw,72px)!important;bottom:clamp(16px,3vh,30px)!important;font-size:clamp(12px,.78vw,16px)!important}
#activation .activation-card{box-sizing:border-box!important;width:430px!important;min-width:0!important;min-height:0!important;padding:18px 28px!important;justify-content:center!important;overflow:hidden!important}
#activation .activation-card .qr-wrap{box-sizing:border-box!important;width:clamp(155px,20vh,220px)!important;height:clamp(155px,20vh,220px)!important;padding:7px!important;border-width:4px!important;border-radius:15px!important;flex:0 0 auto!important}
#activation .qr-label{margin:12px 0 14px!important;font-size:17px!important;text-align:center!important}
#activation .device-field{margin:6px 0!important}
#activation .device-field label{margin-bottom:4px!important;font-size:15px!important}
#activation .device-field strong,#activation .activation-expiry strong{font-size:24px!important}
#activation .activation-expiry{width:90%!important;margin:8px auto 0!important;padding-top:8px!important}
#activation .activation-expiry label{font-size:14px!important}
#activation .activation-buttons{box-sizing:border-box!important;width:90%!important;margin:12px auto 0!important;display:flex!important;flex-direction:column!important;gap:12px!important}
#activation .activation-buttons .refresh-button,#activation .activation-buttons .add-on-tv{box-sizing:border-box!important;width:100%!important;height:48px!important;min-height:48px!important;margin:0!important;padding:0 12px!important;border-radius:10px!important;font-size:15px!important;flex:0 0 auto!important}
#activation .activation-buttons .refresh-button{background:#249b45!important}#activation .activation-buttons .add-on-tv{background:#0d2114!important;border-color:#43b665!important}
#activation .activation-buttons button:focus{transform:none!important;border-color:#fff!important;box-shadow:0 0 0 3px #39c961!important}
#activation .activation-card>small{display:none!important}#activation .version{right:12px!important;bottom:8px!important;font-size:11px!important}
@media(max-height:720px){#activation{grid-template-columns:minmax(0,1fr) 370px!important}#activation .activation-card{width:370px!important;padding:10px 22px!important}#activation .activation-card .qr-wrap{width:140px!important;height:140px!important}#activation .qr-label{margin:7px 0 8px!important;font-size:14px!important}#activation .device-field{margin:3px 0!important}#activation .device-field label{font-size:12px!important}#activation .device-field strong,#activation .activation-expiry strong{font-size:19px!important}#activation .activation-expiry{margin-top:4px!important;padding-top:5px!important}#activation .activation-buttons{margin-top:7px!important;gap:8px!important}#activation .activation-buttons .refresh-button,#activation .activation-buttons .add-on-tv{height:40px!important;min-height:40px!important;font-size:13px!important}#activation .activation-copy h1{font-size:38px!important;margin:7px 0 12px!important}#activation .activation-copy>p:not(.kicker){font-size:16px!important}#activation .sync-state{margin-top:20px!important}}
@media(max-width:900px){#activation{position:absolute!important;height:auto!important;min-height:100vh!important;display:flex!important;flex-direction:column!important;overflow:auto!important}#activation .activation-main{min-height:460px!important;padding:90px 24px 32px!important}#activation .activation-header{left:24px!important;top:18px!important}#activation .activation-copy{width:100%!important;margin:0!important}#activation .activation-card{width:100%!important;min-height:560px!important;border-left:0!important;border-top:2px solid rgba(255,255,255,.4)!important}#activation .activation-main footer{display:none!important}}

/* InterPlay TV — tema neon inspirado na identidade visual da marca. */
#activation{
  background:
    radial-gradient(circle at 62% 18%,rgba(0,174,255,.28),transparent 28%),
    radial-gradient(circle at 70% 55%,rgba(117,25,255,.25),transparent 35%),
    radial-gradient(circle at 57% 92%,rgba(255,0,214,.16),transparent 30%),
    linear-gradient(135deg,#02040d 0%,#06061b 48%,#120521 100%)!important;
}
#activation .activation-main{
  background:
    linear-gradient(151deg,transparent 32%,rgba(0,139,255,.20) 32.3%,rgba(55,24,181,.28) 53%,rgba(218,0,255,.16) 70%,transparent 70.4%)!important;
}
#activation .activation-card{
  border-left:2px solid #11cfff!important;
  background:linear-gradient(155deg,rgba(3,5,18,.84),rgba(22,4,37,.92))!important;
  box-shadow:inset 10px 0 34px rgba(0,183,255,.05)!important;
}
#activation .activation-header>span:last-child{display:flex!important;flex-direction:column!important;gap:4px!important}
#activation .activation-header strong{font:inherit!important;font-weight:400!important;line-height:1.05!important}
#activation .activation-header small{font-size:.72em!important;font-weight:400!important;color:#fff!important}
#activation .activation-header i{background:linear-gradient(#19d9ff,#e500ff)!important}
#activation .activation-copy .kicker{color:#20d7ff!important;background:linear-gradient(90deg,#19d9ff,#8755ff,#ff18df);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
#activation .sync-state{border-color:#bf22ff!important;background:rgba(2,4,18,.58)!important;box-shadow:0 0 18px rgba(122,27,255,.12)!important}
#activation .sync-state .spinner{border-top-color:#16d8ff!important;border-right-color:#dc18ff!important}
#activation .qr-wrap{border-color:#18ccff!important;box-shadow:0 0 0 1px #d91cff,0 0 22px rgba(22,203,255,.15)!important}
#activation .qr-label{color:#19d8ff!important}
#activation .device-field strong{color:#16d6ff!important}
#activation .device-field:nth-of-type(3) strong,#activation .activation-expiry strong{color:#f01bff!important}
#activation .activation-expiry{border-top:1px solid rgba(255,255,255,.15)!important}
#activation .activation-buttons .refresh-button{border-color:#16d7ff!important;background:linear-gradient(100deg,#12bfff,#7852ff 55%,#ed0cff)!important;box-shadow:0 0 18px rgba(113,51,255,.22)!important}
#activation .activation-buttons .add-on-tv{background:rgba(5,7,20,.68)!important;border-color:#df1cff!important;box-shadow:inset 0 0 0 1px rgba(17,210,255,.7)!important}
#activation .activation-buttons button:focus{border-color:#fff!important;box-shadow:0 0 0 3px #13d6ff,0 0 0 6px #d817ff!important}
#activation .activation-main footer{color:#8d91a3!important}