/* ADIMASTER RELEASE 59 · ARTIST LEFT PANEL LIVE — POINT 1 ONLY Scope: desktop left identity panel micro-interaction + living HUD treatment. Intentionally does NOT touch globe, right telemetry, lower deck, header or routing. */ @media (min-width:761px){ body[data-route="artist"] .artistCopyR49{ --r59-panel-x:18%; --r59-panel-y:26%; background: radial-gradient(260px 220px at var(--r59-panel-x) var(--r59-panel-y),rgba(84,240,255,.055),transparent 70%), repeating-linear-gradient(180deg,rgba(255,255,255,.010) 0 1px,transparent 1px 7px), radial-gradient(66% 34% at 7% 7%,rgba(232,67,205,.115),transparent 72%), radial-gradient(66% 42% at 92% 84%,rgba(85,105,255,.075),transparent 74%), linear-gradient(138deg,rgba(2,8,18,.982),rgba(3,9,20,.972) 60%,rgba(8,5,24,.97))!important; animation:r59PanelBreath 7.6s ease-in-out infinite!important; } /* Faint command-grid behind the interactive rows. */ body[data-route="artist"] .r49DomainStack::before{ content:""; position:absolute; z-index:-1; inset:-.2vw -.3vw; pointer-events:none; opacity:.34; background: linear-gradient(rgba(72,224,255,.025) 1px,transparent 1px), linear-gradient(90deg,rgba(153,87,255,.022) 1px,transparent 1px); background-size:26px 26px; mask-image:linear-gradient(90deg,#000,rgba(0,0,0,.78) 78%,transparent); } /* Live module surface: local pointer glow + edge response. */ body[data-route="artist"] .r49DomainRow.artistDomain{ --r59-x:22%; --r59-y:50%; --r59-edge:rgba(92,235,255,.10); border-top:1px solid transparent!important; border-bottom:1px solid rgba(87,226,255,.11)!important; background: radial-gradient(180px 120px at var(--r59-x) var(--r59-y),rgba(94,240,255,.075),transparent 72%), linear-gradient(90deg,rgba(9,21,38,.62),rgba(6,11,24,.23) 80%,transparent)!important; box-shadow: inset 0 1px var(--r59-edge), inset 0 -1px rgba(98,84,255,.025)!important; transition:transform .18s ease,background .22s ease,filter .22s ease,box-shadow .22s ease!important; } body[data-route="artist"] .r49DomainRow.artistDomain:hover, body[data-route="artist"] .r49DomainRow.artistDomain:focus-visible{ --r59-edge:rgba(99,244,255,.24); background: radial-gradient(220px 140px at var(--r59-x) var(--r59-y),rgba(91,244,255,.14),transparent 72%), linear-gradient(90deg,rgba(12,34,51,.82),rgba(13,10,34,.38) 82%,transparent)!important; box-shadow: inset 0 1px rgba(101,247,255,.20), inset 0 -1px rgba(153,84,255,.12), 0 0 26px rgba(76,229,255,.055)!important; filter:drop-shadow(0 0 15px rgba(76,229,255,.08))!important; } body[data-route="artist"] .r49DomainRow.artistDomain:focus-visible{ outline:1px solid rgba(111,244,255,.48)!important; outline-offset:2px!important; } /* Data rail brightens as the module wakes up. */ body[data-route="artist"] .r49DomainRow.artistDomain:hover::before, body[data-route="artist"] .r49DomainRow.artistDomain:focus-visible::before, body[data-route="artist"] .r49DomainRow.artistDomain.artistAmbient::before, body[data-route="artist"] .r49DomainRow.artistDomain.is-activating::before{ background:linear-gradient(90deg,rgba(107,250,255,.65),rgba(71,221,255,.34) 56%,rgba(165,89,255,.30) 82%,transparent)!important; box-shadow:0 0 10px rgba(69,229,255,.24)!important; } body[data-route="artist"] .r49DomainRow.artistDomain:hover::after, body[data-route="artist"] .r49DomainRow.artistDomain:focus-visible::after, body[data-route="artist"] .r49DomainRow.artistDomain.artistAmbient::after{ background:#d7ffff!important; box-shadow:0 0 6px #fff,0 0 12px #59f0ff,0 0 24px rgba(144,80,255,.62)!important; } /* Visual tile wakes independently of the whole row. */ body[data-route="artist"] .r49DomainVisual{ transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,filter .22s ease!important; } body[data-route="artist"] .r49DomainRow:hover .r49DomainVisual, body[data-route="artist"] .r49DomainRow:focus-visible .r49DomainVisual, body[data-route="artist"] .r49DomainRow.artistAmbient .r49DomainVisual{ transform:translateY(-1px) scale(1.025)!important; border-color:rgba(104,243,255,.44)!important; box-shadow:inset 0 0 24px rgba(66,226,255,.075),0 0 20px rgba(54,211,255,.075),0 0 24px rgba(143,74,255,.045)!important; filter:saturate(1.12) brightness(1.08)!important; } /* Copy has a thin animated signal underline instead of a static text block. */ body[data-route="artist"] .r49DomainCopy{position:relative!important} body[data-route="artist"] .r49DomainCopy::after{ content:""; display:block; width:min(88%,430px); height:1px; margin-top:.32vw; opacity:.22; transform-origin:left center; background:linear-gradient(90deg,rgba(92,245,255,.72),rgba(62,178,255,.22) 45%,rgba(155,81,255,.45) 74%,transparent); box-shadow:0 0 8px rgba(80,229,255,.10); transition:opacity .22s ease,transform .22s ease; } body[data-route="artist"] .r49DomainRow:hover .r49DomainCopy::after, body[data-route="artist"] .r49DomainRow:focus-visible .r49DomainCopy::after, body[data-route="artist"] .r49DomainRow.artistAmbient .r49DomainCopy::after{ opacity:.72; transform:scaleX(1.04); } body[data-route="artist"] .r49DomainRow:hover .r49DomainCopy strong, body[data-route="artist"] .r49DomainRow:focus-visible .r49DomainCopy strong, body[data-route="artist"] .r49DomainRow.artistAmbient .r49DomainCopy strong{ color:#bdffff!important; text-shadow:0 0 8px rgba(91,245,255,.42),0 0 18px rgba(104,98,255,.18)!important; } /* Activation burst on click; routing still belongs to the existing artist JS. */ body[data-route="artist"] .r49DomainRow.artistDomain.is-activating{ --r58-tx:7px!important; filter:brightness(1.14) drop-shadow(0 0 22px rgba(82,235,255,.14))!important; box-shadow: inset 0 0 32px rgba(72,235,255,.08), inset 0 1px rgba(130,255,250,.34), 0 0 28px rgba(70,225,255,.07)!important; animation:r59ActivationKick .38s cubic-bezier(.18,.8,.2,1) both!important; } /* The quote/status area now feels electronically connected to the modules. */ body[data-route="artist"] .r49Quote{ box-shadow:inset 0 0 20px rgba(58,221,255,.025),0 0 18px rgba(99,83,255,.025)!important; transition:border-color .28s ease,box-shadow .28s ease!important; } body[data-route="artist"] .artistCopyR49:has(.r49DomainRow:hover) .r49Quote{ border-color:rgba(103,236,255,.32)!important; box-shadow:inset 0 0 24px rgba(58,221,255,.04),0 0 20px rgba(99,83,255,.04)!important; } @keyframes r59PanelBreath{ 0%,100%{box-shadow:inset 0 0 0 1px rgba(97,235,255,.045),inset 0 0 78px rgba(58,210,255,.03),-12px 0 44px rgba(239,73,211,.045),0 18px 60px rgba(0,0,0,.24)} 50%{box-shadow:inset 0 0 0 1px rgba(112,244,255,.07),inset 0 0 92px rgba(58,210,255,.045),-12px 0 54px rgba(239,73,211,.06),0 18px 64px rgba(0,0,0,.25)} } @keyframes r59ActivationKick{ 0%{transform:perspective(850px) rotateX(var(--r58-rx,0deg)) rotateY(var(--r58-ry,0deg)) translateX(4px) scale(1)} 48%{transform:perspective(850px) rotateX(var(--r58-rx,0deg)) rotateY(var(--r58-ry,0deg)) translateX(8px) scale(1.012)} 100%{transform:perspective(850px) rotateX(var(--r58-rx,0deg)) rotateY(var(--r58-ry,0deg)) translateX(5px) scale(1)} } } @media (max-width:760px){ /* Desktop point only. Mobile Artist remains untouched. */ } @media (prefers-reduced-motion:reduce){ body[data-route="artist"] .artistCopyR49, body[data-route="artist"] .r49DomainRow.artistDomain{animation:none!important} }