
/* MythPvP shared design/runtime layer v5 */
:root{--mx-surface:rgba(17,18,23,.78);--mx-surface-2:rgba(25,26,33,.7);--mx-line:rgba(255,255,255,.08);--mx-pink:#ff6b8b;--mx-pink-soft:rgba(255,107,139,.14)}
html{background:#07080b}
body{background:radial-gradient(900px 500px at 12% -5%,rgba(255,107,139,.11),transparent 62%),radial-gradient(900px 560px at 90% 5%,rgba(111,87,255,.09),transparent 58%),linear-gradient(180deg,#09090b 0%,#07080b 55%,#09090b 100%);background-attachment:fixed;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.22;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to bottom,black,transparent 85%)}
body::after{content:"";position:fixed;inset:-10%;pointer-events:none;z-index:-1;background:radial-gradient(20px 20px at 10% 20%,rgba(255,107,139,.18),transparent 70%),radial-gradient(16px 16px at 80% 35%,rgba(255,196,214,.12),transparent 70%),radial-gradient(20px 20px at 65% 75%,rgba(157,122,255,.12),transparent 70%);animation:mxAmbient 18s ease-in-out infinite alternate}
@keyframes mxAmbient{0%{transform:translate3d(-1%,0,0)}100%{transform:translate3d(1%,1%,0)}}
.mx-petals{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:0}
.mx-petal{position:absolute;top:-40px;width:8px;height:12px;border-radius:70% 30% 65% 35%;background:linear-gradient(145deg,#ffd8e4 0%,#ff8fad 70%,#ff6b8b 100%);opacity:.62;box-shadow:0 0 10px rgba(255,107,139,.16);animation:mxFall var(--d) linear var(--delay) infinite}
@keyframes mxFall{0%{transform:translate3d(0,-6vh,0) rotate(0)}35%{transform:translate3d(calc(var(--sway)*.35),35vh,0) rotate(120deg)}70%{transform:translate3d(calc(var(--sway)*-.5),72vh,0) rotate(235deg)}100%{transform:translate3d(var(--sway),112vh,0) rotate(360deg)}}
.mx-route-loading{position:fixed;inset:0;background:#07080b;z-index:9998;display:grid;place-items:center;transition:opacity .25s ease}.mx-route-loading.hide{opacity:0;pointer-events:none}.mx-loader-dot{width:9px;height:9px;border-radius:50%;background:var(--mx-pink);box-shadow:18px 0 0 rgba(255,107,139,.55),36px 0 0 rgba(255,107,139,.25);animation:mxPulse 1s ease-in-out infinite alternate}@keyframes mxPulse{to{transform:translateX(2px);opacity:.65}}
@media (max-width:900px){body::after{opacity:.12}.mx-petal{opacity:.42;width:7px;height:10px}}
@media (prefers-reduced-motion:reduce){body::after,.mx-petal,.mx-route-loading{animation:none!important;transition:none!important}}
