/* Play2Gether V52 – echtes Neon-Redesign der Dashboard-Bewertung.
   Anders als V51 ist die Karte bereits OHNE Hover sichtbar neu gestaltet.
   Alle Farben kommen aus dem persönlichen Design; keine statischen blauen Buttons. */
#p2gPortalShell #p2gPageDashboard .p2g-v17-score{
 --rating-a:var(--p2g-neon-a,var(--motion-a,#59caff));
 --rating-b:var(--p2g-neon-b,var(--motion-b,#a46dff));
 position:relative;
 isolation:isolate;
 overflow:hidden;
 border:1px solid color-mix(in srgb,var(--rating-a) 58%,#656178)!important;
 border-radius:22px;
 background:
  radial-gradient(ellipse at 8% 0%,color-mix(in srgb,var(--rating-a) 25%,transparent),transparent 64%),
  radial-gradient(ellipse at 95% 95%,color-mix(in srgb,var(--rating-b) 19%,transparent),transparent 67%),
  linear-gradient(137deg,var(--p2g-ambient-card,#191827),var(--p2g-ambient-card-alt,#211a2b))!important;
 box-shadow:
  0 15px 38px #0005,
  0 0 0 1px color-mix(in srgb,var(--rating-a) 12%,transparent),
  0 0 23px color-mix(in srgb,var(--rating-a) 26%,transparent),
  inset 0 1px color-mix(in srgb,var(--rating-b) 32%,transparent)!important;
 transition:transform .38s cubic-bezier(.22,1,.36,1),box-shadow .35s ease,border-color .35s ease!important;
}
#p2gPortalShell #p2gPageDashboard .p2g-v17-score::before{
 content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
 border-radius:inherit;
 background:linear-gradient(112deg,
  color-mix(in srgb,var(--rating-a) 30%,transparent),transparent 38%,
  color-mix(in srgb,var(--rating-b) 23%,transparent) 72%,transparent);
 opacity:.35;transition:opacity .4s ease;
}
#p2gPortalShell #p2gPageDashboard .p2g-v17-score::after{
 content:"";position:absolute;top:0;bottom:0;width:27%;left:-60%;pointer-events:none;z-index:0;
 background:linear-gradient(104deg,transparent,color-mix(in srgb,var(--rating-b) 18%,transparent),color-mix(in srgb,var(--rating-a) 20%,transparent),transparent);
 transform:skewX(-17deg);opacity:0;
}
#p2gPortalShell #p2gPageDashboard .p2g-v17-score>*{position:relative;z-index:1}
#p2gPortalShell #p2gPageDashboard .p2g-v17-score:is(:hover,:focus-within){
 transform:translateY(-4px) scale(1.008);
 border-color:var(--rating-a)!important;
 box-shadow:0 19px 48px #0007,
  0 0 0 1px color-mix(in srgb,var(--rating-a) 29%,transparent),
  0 0 33px color-mix(in srgb,var(--rating-a) 46%,transparent),
  0 0 52px color-mix(in srgb,var(--rating-b) 26%,transparent),
  inset 0 1px color-mix(in srgb,var(--rating-a) 35%,transparent)!important;
}
#p2gPortalShell #p2gPageDashboard .p2g-v17-score:is(:hover,:focus-within)::before{opacity:.68}
#p2gPortalShell #p2gPageDashboard .p2g-v17-score:hover::after{animation:p2g-v52-feedback-sweep 1.1s ease-out both}
@keyframes p2g-v52-feedback-sweep{0%{left:-60%;opacity:0}24%{opacity:.92}100%{left:145%;opacity:0}}
/* Überschrift, Hint und Zahlen bekommen auch im Ruhezustand Akzente. */
#p2gPortalShell #p2gPageDashboard .p2g-v17-score h2{
 color:#f5f8ff!important;
 text-shadow:0 0 17px color-mix(in srgb,var(--rating-a) 23%,transparent);
 transition:text-shadow .28s ease,color .28s ease;
}
#p2gPortalShell #p2gPageDashboard .p2g-v17-score h2::after{
 background:linear-gradient(90deg,var(--rating-a),var(--rating-b));
 opacity:1!important;box-shadow:0 0 17px color-mix(in srgb,var(--rating-a) 60%,transparent);
}
#p2gPortalShell #p2gPageDashboard .p2g-v17-score:is(:hover,:focus-within) h2{
 text-shadow:0 0 14px color-mix(in srgb,var(--rating-a) 56%,transparent),
 0 0 28px color-mix(in srgb,var(--rating-b) 26%,transparent);
}
#p2gPortalShell #p2gPageDashboard #p2gDashFeedback .p2g-v17-ratings b{
 color:#f8f8ff!important;
 border:1px solid color-mix(in srgb,var(--rating-a) 42%,transparent)!important;
 background:linear-gradient(120deg,
  color-mix(in srgb,var(--rating-a) 20%,var(--p2g-ambient-inset,#171726)),
  color-mix(in srgb,var(--rating-b) 10%,var(--p2g-ambient-card,#1a1320)))!important;
 border-radius:10px;
 box-shadow:inset 0 1px #ffffff11,0 0 13px color-mix(in srgb,var(--rating-a) 20%,transparent)!important;
 transition:transform .28s ease,border-color .26s ease,box-shadow .28s ease!important;
}
#p2gPortalShell #p2gPageDashboard #p2gDashFeedback .p2g-v17-ratings b:is(:hover,:focus-visible){
 transform:translateY(-4px) scale(1.06)!important;
 border-color:var(--rating-a)!important;
 box-shadow:0 6px 22px color-mix(in srgb,var(--rating-a) 34%,transparent),
 0 0 32px color-mix(in srgb,var(--rating-b) 25%,transparent)!important;
}
#p2gPortalShell #p2gPageDashboard .p2g-v17-score .p2g-port-muted{
 color:#dad4e2!important;
}
/* Einzige farbliche Ausnahme: Gut/Neutral/Schlecht behalten ihren Statuspunkt. */
#p2gPortalShell #p2gPageDashboard .p2g-v17-score .p2g-port-btn:not([hidden]){
 color:#fff!important;
 border:1px solid color-mix(in srgb,var(--rating-a) 70%,#ffffff22)!important;
 background:linear-gradient(120deg,
   color-mix(in srgb,var(--rating-a) 29%,var(--p2g-ambient-inset,#16142b)),
   color-mix(in srgb,var(--rating-b) 26%,var(--p2g-ambient-card,#271525)))!important;
 box-shadow:0 0 13px color-mix(in srgb,var(--rating-a) 24%,transparent),inset 0 1px #ffffff18!important;
 border-radius:12px;
 text-shadow:0 0 6px color-mix(in srgb,var(--rating-a) 25%,transparent);
}
#p2gPortalShell #p2gPageDashboard .p2g-v17-score .p2g-port-btn:is(:hover,:focus-visible):not([hidden]){
 transform:translateY(-3px) scale(1.025)!important;
 border-color:var(--rating-a)!important;
 background:linear-gradient(115deg,
  color-mix(in srgb,var(--rating-a) 43%,var(--p2g-ambient-card,#271525)),
  color-mix(in srgb,var(--rating-b) 34%,var(--p2g-ambient-inset,#16142b)))!important;
 box-shadow:0 9px 30px #0005,0 0 25px color-mix(in srgb,var(--rating-a) 54%,transparent),0 0 45px color-mix(in srgb,var(--rating-b) 23%,transparent)!important;
}
/* Deaktivierte Bewegung: weiterhin statisches Design, keine Animationen. */
body[data-p2g-motion="off"] #p2gPortalShell #p2gPageDashboard .p2g-v17-score,
body[data-p2g-motion="off"] #p2gPortalShell #p2gPageDashboard .p2g-v17-score *,
body[data-p2g-motion="low"] #p2gPortalShell #p2gPageDashboard .p2g-v17-score{
 animation:none!important;transition:none!important;
}
body[data-p2g-motion="off"] #p2gPortalShell #p2gPageDashboard .p2g-v17-score:is(:hover,:focus-within),
body[data-p2g-motion="low"] #p2gPortalShell #p2gPageDashboard .p2g-v17-score:is(:hover,:focus-within){transform:none!important}
body[data-p2g-motion="off"] #p2gPortalShell #p2gPageDashboard .p2g-v17-score::after,
body[data-p2g-motion="low"] #p2gPortalShell #p2gPageDashboard .p2g-v17-score::after{animation:none!important}
@media(prefers-reduced-motion:reduce){
 #p2gPortalShell #p2gPageDashboard .p2g-v17-score,
 #p2gPortalShell #p2gPageDashboard .p2g-v17-score *{animation:none!important;transition:none!important}
 #p2gPortalShell #p2gPageDashboard .p2g-v17-score:is(:hover,:focus-within){transform:none!important}
 #p2gPortalShell #p2gPageDashboard .p2g-v17-score::after{animation:none!important}
}
