/* PLAY FULL 02 — the ribbon plays inside the arena: no flat panel, no outlined 7; the live stadium shows through. */
#ribbonIntro{background:transparent}
#ribbonIntro .ri-panel,#ribbonIntro .ri-seven,#ribbonIntro .ri-main{display:none!important}
#ribbonIntro::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.38) 42%,rgba(0,0,0,0) 70%),linear-gradient(0deg,rgba(0,0,0,.7) 0%,rgba(0,0,0,0) 46%)}
#ribbonIntro.ri-lifted::before{opacity:.55;transition:opacity 1.8s cubic-bezier(.22,.61,.36,1)}
#ribbonIntro .ri-live{position:absolute;right:28px;bottom:calc(40px + env(safe-area-inset-bottom,0px));display:flex;align-items:center;gap:12px;padding:8px 8px 8px 14px;border-radius:999px;background:rgba(5,7,12,.72);border:1px solid rgba(233,238,242,.16);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);font:700 10px/1 Inter,sans-serif;letter-spacing:.26em;color:#e9eef2;opacity:0;transition:opacity .9s cubic-bezier(.22,.61,.36,1) 1.6s}
#ribbonIntro.ri-run .ri-live,#ribbonIntro.ri-still .ri-live{opacity:1}
#ribbonIntro .ri-live i{width:9px;height:9px;border-radius:50%;background:#9aff00;box-shadow:0 0 12px #9aff00;animation:riLive 1.6s ease-in-out infinite}
@keyframes riLive{0%,100%{opacity:1}50%{opacity:.35}}
#ribbonIntro .ri-live button{font:800 11px/1 Inter,sans-serif;letter-spacing:.22em;color:#000;background:#c7fc68;border:0;border-radius:999px;padding:10px 14px;cursor:pointer}
#ribbonIntro .ri-live button:hover{background:#d8ff8a}
@media(max-width:720px){#ribbonIntro .ri-live span{display:none}}
/* the blinking green loading line under the eyebrow (Joey: "more green, like a loading line blinking") */
#ribbonIntro .ri-eyebrow{position:relative;padding-bottom:12px}
#ribbonIntro .ri-eyebrow::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:220px;background:#9aff0033;overflow:hidden}
#ribbonIntro .ri-eyebrow::before{content:"";position:absolute;left:0;bottom:0;height:2px;width:84px;background:#9aff00;box-shadow:0 0 14px #9aff00;animation:riSweep 1.6s cubic-bezier(.22,.61,.36,1) infinite,riLive 1.1s steps(2,end) infinite;z-index:1}
@keyframes riSweep{0%{transform:translateX(0)}100%{transform:translateX(136px)}}
#ribbonIntro .ri-live i{animation:riLive .9s steps(2,end) infinite}