/* Update 8.42: the end of a match (VITTORIA / SCONFITTA) as the user's pictures - one card over the court */
body[data-screen=RESULT] .alpha-panel{display:grid;place-items:center}
body[data-screen=RESULT] .alpha-panel .menu{background:none!important;border:0!important;box-shadow:none!important;padding:0!important;max-width:none!important;width:auto!important;backdrop-filter:none!important;overflow:visible!important}
.res841{--res:#cdf35a;--res2:#e9ff9a;--res-dk:#86b827;position:relative;overflow:hidden;box-sizing:border-box;width:min(1000px,94vw);padding:22px clamp(22px,3vw,40px) 26px;border-radius:16px;
 background:linear-gradient(115deg,transparent 0 55%,#ffffff06 55% 63%,transparent 63% 72%,#ffffff05 72% 76%,transparent 76%),radial-gradient(120% 90% at 20% 0%,#1d4a33e6,#0d2219ee 65%),#0c1d16;
 border:1.5px solid #cdf35a99;box-shadow:0 0 0 1px #000a,0 0 30px #cdf35a26,0 30px 90px #000c;color:#fff;animation:rs-in .3s ease-out}
.res841.lost{--res:#ff6a2b;--res2:#ffb15e;--res-dk:#c2421a;border-color:#cdf35a80}
@keyframes rs-in{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.res841 .rs-streak{position:absolute;pointer-events:none;width:2px;height:420px;background:linear-gradient(#cdf35a00,#cdf35a55 40% 60%,#cdf35a00);transform:rotate(35deg)}
.res841 .rs-streak.a{right:28%;top:-120px}.res841 .rs-streak.b{right:12%;top:-40px;opacity:.6}
.res841 .rs-chip{display:inline-block;padding:5px 10px;border-radius:7px;border:1px solid #ffffff2e;background:#0b1712cc;font:800 10px/1 var(--fam);letter-spacing:.08em;color:#e8efe6}
.res841 .rs-title{display:flex;align-items:center;gap:18px;margin:8px 0 14px!important;font:900 italic clamp(46px,5.6vw,76px)/1 var(--fam)!important;letter-spacing:-.01em;
 background:linear-gradient(180deg,var(--res2),var(--res) 55%,var(--res-dk));-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 3px 10px #0008)}
.res841 .rs-slash{display:inline-flex;gap:7px;transform:skewX(-28deg);margin-top:10px}.res841 .rs-slash i{display:block;width:10px;height:clamp(26px,3vw,40px);background:linear-gradient(var(--res),var(--res-dk));opacity:.9}
.res841 .rs-slash i:nth-child(2){opacity:.65}.res841 .rs-slash i:nth-child(3){opacity:.4}
/* the band: the two sides and the score */
.res841 .rs-band{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:clamp(12px,2vw,28px);padding:14px;border-radius:14px;border:1px solid #cdf35a59;background:linear-gradient(90deg,#cdf35a14,#0000 30% 70%,#ff6a2b10)}
.res841 .rs-side{display:flex;gap:10px}.res841 .rs-band>.rs-side:first-child{justify-content:flex-start}.res841 .rs-band>.rs-side:last-child{justify-content:flex-end}
.res841 .rs-card{--edge:#cdf35a;position:relative;width:clamp(150px,20vw,226px);aspect-ratio:1.33;border-radius:12px;overflow:hidden;background:radial-gradient(90% 80% at 50% 45%,#22352c,#0b1511);border:2px solid var(--edge);box-shadow:0 0 16px color-mix(in srgb,var(--edge) 55%,transparent),inset 0 0 18px #0008}
.res841 .rs-card.lose{--edge:#ff7a35}
.res841.duo .rs-card{width:clamp(110px,12.5vw,150px);aspect-ratio:.86}
.res841 .rs-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 42%}
.res841 .rs-name{position:absolute;left:12px;top:10px;z-index:1;font:800 clamp(12px,1.1vw,16px)/1.1 var(--fam);color:#fff;text-shadow:0 1px 4px #000}
.res841 .rs-foot{position:absolute;left:0;right:0;bottom:0;z-index:1;display:flex;align-items:flex-end;justify-content:space-between;padding:0 8px 8px 10px;background:linear-gradient(transparent,#000c 70%)}
.res841 .rs-foot .pc-stars{display:flex;gap:2px;margin-bottom:4px}.res841 .rs-foot .pc-stars i{width:clamp(10px,1vw,15px);height:clamp(10px,1vw,15px)}
.res841 .rs-rate{display:grid;place-items:center;min-width:44px;padding:4px 6px 3px;border-radius:8px;border:1.5px solid #ff9a4c;background:#0d1410e6;box-shadow:0 0 8px #ff8f2e55}
.res841 .rs-rate b{font:900 clamp(16px,1.6vw,22px)/1 var(--fam);color:#fff}.res841 .rs-rate small{font:800 7.5px/1.2 var(--fam);letter-spacing:.06em;color:#dfe6dc}
.res841 .rs-mid{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:150px}
.res841 .rs-cap{font:600 9.5px/1 var(--fam);letter-spacing:.32em;color:#c8d3cb}
.res841 .rs-ball{display:flex;align-items:center;gap:10px}.res841 .rs-ball::before,.res841 .rs-ball::after{content:'';width:46px;height:1px;background:linear-gradient(90deg,transparent,#cdf35a99)}.res841 .rs-ball::after{transform:scaleX(-1)}
.res841 .rs-ball svg{width:22px;height:22px}.res841 .rs-ball svg .f{fill:#cdf35a}.res841 .rs-ball svg path{fill:none;stroke:#0e2017;stroke-width:1.8}
.res841 .rs-score{display:flex;align-items:center;gap:12px;font:900 clamp(56px,6.5vw,92px)/1 var(--fam)}
.res841 .rs-score i{font-style:normal;color:#f4f8f2;text-shadow:0 0 18px #ffffff40}.res841 .rs-score i.w{color:#cdf35a;text-shadow:0 0 22px #cdf35a80}.res841 .rs-score i.l{color:#ff6a2b;text-shadow:0 0 22px #ff6a2b80}
.res841 .rs-score em{font-style:normal;color:#e9efe7;font-size:.6em}
.res841 .rs-unit{display:flex;align-items:center;gap:10px;font:600 10px/1 var(--fam);letter-spacing:.26em;color:#c8d3cb}.res841 .rs-unit::before,.res841 .rs-unit::after{content:'';width:34px;height:1px;background:#ffffff40}
/* the three facts */
.res841 .rs-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:16px 0 0}
.res841 .rs-fact{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:12px;border:1px solid #ffffff17;background:#0b1712b3}
.res841 .rs-ico{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:9px}
.res841 .rs-ico svg{width:26px;height:26px;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.res841 .rs-fact.time .rs-ico{background:#3f6b1d;box-shadow:inset 0 0 0 1px #9fe04a55}.res841 .rs-fact.time svg{stroke:#cdf35a}
.res841 .rs-fact.ball .rs-ico{background:#1f3c63;box-shadow:inset 0 0 0 1px #7cb6ff55}.res841 .rs-fact.ball svg{stroke:#8cc4ff}
.res841 .rs-fact.bolt .rs-ico{background:#5a3417;box-shadow:inset 0 0 0 1px #ffaa5555}.res841 .rs-fact.bolt svg .f{fill:#ffa23d;stroke:none}
.res841 .rs-fact small{display:block;font:700 9.5px/1.2 var(--fam);letter-spacing:.06em;color:#c3cec6}.res841 .rs-fact b{display:block;margin-top:4px;font:800 clamp(18px,1.7vw,24px)/1 var(--fam)}
/* the mode's own result (career rewards, ranked points, online room) under the facts */
.res841 .rs-summary{margin-top:12px;padding:10px 14px;border-radius:12px;border:1px solid #ffffff17;background:#0b1712b3;font-size:13px}
.res841 .rs-summary h3{margin:0 0 6px;font-size:13px;letter-spacing:.08em;color:#cdf35a}.res841 .rs-summary p{margin:4px 0}
/* the buttons */
.res841 .rs-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:14px;margin-top:18px}
.alpha-panel .res841 .rs-actions button{display:flex;align-items:center;justify-content:center;gap:12px;min-width:200px;height:52px;padding:0 22px;border-radius:12px;font:800 13px/1 var(--fam);letter-spacing:.06em;margin:0}
.alpha-panel .res841 .rs-actions button.cta{min-width:min(216px,40vw);background:linear-gradient(90deg,#c4ef4f,#e1fb8a);color:#10200f;border:0;box-shadow:0 0 22px #cdf35a59;position:relative;padding-left:52px;padding-right:44px}
.alpha-panel .res841 .rs-actions button.cta::before{content:'';position:absolute;left:24px;width:0;height:0;border-left:13px solid #10200f;border-top:8px solid transparent;border-bottom:8px solid transparent}
.alpha-panel .res841 .rs-actions button.cta .go{position:absolute;right:16px;background:none!important;color:#10200f!important;font-size:22px}
.alpha-panel .res841 .rs-actions button.quiet{background:#0b1712d9;color:#eef3ec;border:1px solid #ffffff26}
.alpha-panel .res841 .rs-actions button.quiet:hover,.alpha-panel .res841 .rs-actions button.quiet:focus-visible{border-color:#cdf35a99}
.alpha-panel .res841 .rs-actions button[data-action=menu]::before{content:'';width:17px;height:17px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3 2 11.5h3V21h5.5v-6h3v6H19v-9.5h3z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3 2 11.5h3V21h5.5v-6h3v6H19v-9.5h3z'/%3E%3C/svg%3E") center/contain no-repeat}
.res841 .rs-tag{position:absolute;right:18px;bottom:18px;display:flex;align-items:center;gap:7px;padding:7px 12px;border-radius:99px;border:1px solid #cdf35a99;background:#0b1712cc;font:700 11px/1 var(--fam);color:#e8f5c6}
.res841 .rs-tag svg{width:16px;height:16px;fill:#cdf35a}
@media(max-width:900px){.res841 .rs-band{grid-template-columns:1fr;justify-items:center}.res841 .rs-facts{grid-template-columns:1fr}.res841 .rs-tag{position:static;margin:12px auto 0;width:max-content}}
@media(max-height:760px){.res841{padding:14px 22px 16px}.res841 .rs-title{margin:4px 0 8px!important;font-size:44px!important}.res841 .rs-card{width:clamp(130px,16vw,180px)}.res841 .rs-facts{margin-top:10px}.res841 .rs-fact{padding:8px 12px}.res841 .rs-actions{margin-top:12px}}
.res841 .rs-title{transform:skewX(-10deg);transform-origin:left bottom;padding-left:6px}
.res841 .rs-card img{transform:scale(1.55);transform-origin:50% 30%;object-position:50% 30%}
.res841.duo .rs-card{width:clamp(120px,13.6vw,168px);aspect-ratio:.9}
.res841.duo .rs-foot .pc-stars i{width:clamp(8px,.75vw,11px);height:clamp(8px,.75vw,11px)}
.res841.duo .rs-rate{min-width:38px;padding:3px 5px 2px}.res841.duo .rs-rate b{font-size:clamp(14px,1.3vw,19px)}.res841.duo .rs-rate small{font-size:6.5px}
.res841 .rs-actions{border:0!important;padding:0!important;background:none!important;box-shadow:none!important}
.res841 .rs-actions::before,.res841 .rs-actions::after{display:none!important}
@media(max-height:820px){.res841{padding:12px 22px 14px}.res841 .rs-title{font-size:40px!important;margin:4px 0 8px!important}.res841 .rs-band{padding:8px}.res841 .rs-card{aspect-ratio:1.6}.res841.duo .rs-card{aspect-ratio:1.1}
 .res841 .rs-score{font-size:60px}.res841 .rs-mid{gap:3px}.res841 .rs-facts{margin-top:8px;gap:8px}.res841 .rs-fact{padding:6px 10px}.res841 .rs-ico{width:36px;height:36px}.res841 .rs-ico svg{width:22px;height:22px}
 .res841 .rs-summary{margin-top:8px;padding:6px 12px}.res841 .rs-summary .reward{margin:0;padding:6px 10px}.res841 .rs-summary h3{margin-bottom:4px}.res841 .rs-actions{margin-top:10px}.alpha-panel .res841 .rs-actions button{height:44px}}
.res841{max-height:calc(100vh - 100px);overflow-y:auto}
/* Update 8.43: a screen drawn again in place keeps still - no entrance fade */
.alpha-panel.same-screen .menu{animation:none!important}
/* Update 8.49: FISICO in one page - four framed groups and the skin colours (the user's picture) */
.pe823 .bd849{display:flex;flex-direction:column;gap:10px}
.pe823 .bd849 .bd-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.6fr);gap:10px}
.pe823 .bd849 .bd-box{border:1px solid #ffffff17;border-radius:12px;background:#0b171299;padding:8px 10px 10px;min-width:0}
.pe823 .bd849 .bd-box h5{margin:0 0 8px;font:800 11px/1 var(--fam);letter-spacing:.12em;color:#e8efe6}
.pe823 .bd849 .bd-row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:8px}
.alpha-panel .pe823 .bd849 button.pk{min-height:0;padding:0;display:flex;flex-direction:column;overflow:hidden}
.pe823 .bd849 .pk .pk-img{display:block;aspect-ratio:1/1.05;width:100%;overflow:hidden;background:radial-gradient(70% 70% at 50% 40%,#1d2e27,#0d1713)}
.pe823 .bd849 .bd-tall .pk-img{aspect-ratio:.8}
.pe823 .bd849 .pk .pk-img img{width:100%;height:100%;object-fit:cover}
.pe823 .bd849 .bd-sil .pk-img img{filter:brightness(0) invert(.42)}
.pe823 .bd849 .bd-sil.on .pk-img img{filter:brightness(0) invert(.97)}
.pe823 .bd849 .pk .pk-name{position:static;padding:6px 4px 7px;font-size:11px;text-align:center;background:#0a1410}
.pe823 .bd849 .bd-height .pk-img{aspect-ratio:.62}
.pe823 .bd849 .pe-colors{border:1px solid #ffffff17;border-radius:12px;background:#0b171299;padding:8px 10px}
.pe823 .bd849 .bd-note{margin:0}
@media(max-height:820px){.pe823 .bd849 .bd-tall .pk-img{aspect-ratio:1}.pe823 .bd849 .bd-height .pk-img{aspect-ratio:.8}}
.pe823 .bd849 .bd-hand .pk-img,.pe823 .bd849 .bd-build .pk-img{aspect-ratio:1/1}
.pe823 .bd849 .bd-height .pk-img{aspect-ratio:.7}
.pe823 .bd849 .bd-grid{align-items:start}.pe823 .bd849 .bd-hand .pk-img{aspect-ratio:1.25}
.pe823 .bd849 .bd-hand .pk-img{aspect-ratio:auto!important;height:clamp(96px,14vh,150px)!important}
.pe823 .bd849 .bd-build .pk-img{aspect-ratio:auto!important;height:clamp(110px,15vh,170px)!important}
.pe823 .bd849 .bd-sex .pk-img{aspect-ratio:auto!important;height:clamp(150px,22vh,240px)!important}
.pe823 .bd849 .bd-height .pk-img{aspect-ratio:auto!important;height:clamp(90px,13vh,150px)!important}
.pe823 .bd849 .bd-sex .pk-img{height:clamp(130px,17.5vh,220px)!important}.pe823 .bd849 .bd-build .pk-img{height:clamp(96px,12.5vh,160px)!important}
.pe823 .bd849 .bd-hand .pk-img,.pe823 .bd849 .bd-height .pk-img{height:clamp(84px,11.5vh,140px)!important}
.pe823 .bd849{gap:8px}.pe823 .bd849 .bd-grid{gap:8px}
.pe823 .bd849 .bd-note{display:none}
/* Update 8.50: GENERALE - Genere and Corporatura the same size; the heights on one scale; the hand drawn; VISO and CAPELLI as pages of groups */
.pe823 .bd849 .bd-grid{grid-template-columns:minmax(0,2fr) minmax(0,4fr)!important}
.pe823 .bd849 .bd-build .pk-img{height:clamp(130px,17.5vh,220px)!important}
.pe823 .bd849 .bd-build .pk-img img{object-position:50% 50%}
.pe823 .bd849 .bd-height .pk-img img{object-fit:cover;object-position:50% 100%}
.pe823 .bd849 .hand-img{display:grid!important;place-items:center;background:radial-gradient(60% 70% at 50% 50%,#1d2e27,#0d1713)!important}
.pe823 .bd849 .hand-art{width:100%;height:100%}
.pe823 .bd849 .bd-hand .pk-name{font-weight:900;letter-spacing:.12em}
.pe823 .gp850{display:flex;flex-wrap:wrap;gap:8px;align-content:flex-start}
.pe823 .gp850 .bd-box{flex:1 1 auto}
.pe823 .gp850 .gp-row{display:flex;flex-wrap:wrap;gap:6px}
.alpha-panel .pe823 .gp850 button.pk{width:clamp(70px,5.6vw,96px);min-height:0;padding:0;display:flex;flex-direction:column;overflow:hidden}
.pe823 .gp850 .pk .pk-img{display:block;width:100%;aspect-ratio:1;overflow:hidden;background:radial-gradient(70% 70% at 50% 40%,#1d2e27,#0d1713)}
.pe823 .gp850 .pk .pk-img img{width:100%;height:100%;object-fit:cover}
.pe823 .gp850 .pk .pk-name{position:static;padding:4px 3px 5px;font-size:10px;text-align:center;background:#0a1410;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pe823 .gp850 .gp-hairStyle{flex-basis:100%}
.pe823 .gp850 .bd-box.off{opacity:.5}
/* the name and the random button on one line, the same height */
.pe823 .pe-namerow{align-items:flex-end!important}
.alpha-panel .pe823 .pe-random{align-self:flex-end;margin:0!important;height:var(--nm-h,40px)!important;min-height:0!important}
.pe823 .e-name input{height:var(--nm-h,40px)!important;min-height:0!important;box-sizing:border-box}
.pe823 .bd849 .bd-build .pk-img img{transform:scale(1.45);transform-origin:50% 42%}
.pe823 .gp850{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;align-content:start}
.pe823 .gp850.gpc-hair{grid-template-columns:minmax(0,1fr)}
.pe823 .gp850 .bd-box{flex:none!important;height:auto!important;min-height:0!important;align-self:start}
.pe823 .gp850 .gp-row{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:6px}
.pe823 .gpc-hair .gp-row{grid-template-columns:repeat(auto-fill,minmax(84px,1fr))}
.alpha-panel .pe823 .gp850 button.pk{width:auto!important}
.alpha-panel .pe823 .pe-random{margin-bottom:12px!important}
.pe823 .gpc-face .gp-row{grid-template-columns:repeat(auto-fill,minmax(54px,1fr))}
.alpha-panel .pe823 .gp850 button.pk,.alpha-panel .pe823 .bd849 button.pk{height:auto!important;max-height:none!important;aspect-ratio:auto!important}
.pe823 .gp850 .gp-row{grid-auto-rows:auto!important;align-items:start}
.pe823 .gp850,.pe823 .bd849{overflow-y:auto;min-height:0}
@media(max-height:820px){.pe823 .gpc-face .gp-row{grid-template-columns:repeat(auto-fill,minmax(46px,1fr))}.pe823 .gp850 .pk .pk-name{font-size:9px;padding:3px 2px}}
.pe823 .gp850{grid-auto-rows:max-content!important;grid-template-rows:none!important}.pe823 .gp850 .bd-box{overflow:visible!important}
/* Update 8.51: the hand and the backhand side by side, each tile as wide as a body type's; VISO and CAPELLI fill the page with bigger tiles */
.pe823 .bd849 .bd-pair{display:grid;grid-template-columns:1fr 1fr;gap:8px;min-width:0}
.pe823 .bd849 .bd-pair .bd-box{min-width:0}
.pe823 .bd849 .bd-hand .pk-img{height:clamp(96px,13vh,150px)!important}
.pe823 .bd849 .bd-height .pk-img{height:clamp(110px,15vh,170px)!important}
.pe823 .gp850.gpc-face{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.pe823 .gpc-face .gp-row{grid-template-columns:repeat(auto-fill,minmax(clamp(58px,9.2vh,112px),1fr))!important}
.pe823 .gpc-hair .gp-row{grid-template-columns:repeat(auto-fill,minmax(clamp(70px,10.5vh,126px),1fr))!important}
.pe823 .gp850 .pk .pk-name{font-size:clamp(9px,1.1vh,12px)!important}
/* (8.51) VISO and CAPELLI fill the page: the groups in a fixed grid, the tiles stretching to fill their group */
.pe823 .gp850.gpc-face,.pe823 .gp850.gpc-hair{flex:1 1 auto!important;min-height:0!important;height:auto!important;overflow:hidden!important;align-items:stretch!important;align-content:stretch!important}
.pe823 .gp850.gpc-face{grid-template-columns:repeat(12,minmax(0,1fr))!important;grid-template-rows:repeat(3,minmax(0,1fr))!important;grid-auto-rows:auto!important}
.pe823 .gpc-face .gp-face,.pe823 .gpc-face .gp-jaw,.pe823 .gpc-face .gp-eyes{grid-column:span 4}
.pe823 .gpc-face .gp-brows,.pe823 .gpc-face .gp-nose,.pe823 .gpc-face .gp-browThickness,.pe823 .gpc-face .gp-mouth{grid-column:span 6}
.pe823 .gpc-face .gp-brows{grid-row:2}.pe823 .gpc-face .gp-nose{grid-row:2}.pe823 .gpc-face .gp-browThickness{grid-row:3}.pe823 .gpc-face .gp-mouth{grid-row:3}
.pe823 .gp850.gpc-hair{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:minmax(0,2fr) minmax(0,1fr)!important;grid-auto-rows:auto!important}
.pe823 .gp850.gpc-hair:not(:has(.gp-facialHair)){grid-template-rows:minmax(0,1fr)!important}
.pe823 .gp850.gpc-face .bd-box,.pe823 .gp850.gpc-hair .bd-box{display:flex!important;flex-direction:column;min-height:0;height:100%!important;align-self:stretch!important}
.pe823 .gp850.gpc-face .gp-row,.pe823 .gp850.gpc-hair .gp-row{flex:1 1 auto;min-height:0;display:grid!important;grid-template-columns:none!important;grid-auto-flow:column!important;grid-auto-columns:minmax(0,1fr)!important;grid-template-rows:minmax(0,1fr)!important}
.pe823 .gp850.gpc-hair .gp-hairStyle .gp-row{grid-auto-flow:row!important;grid-template-columns:repeat(8,minmax(0,1fr))!important;grid-template-rows:repeat(2,minmax(0,1fr))!important}
.alpha-panel .pe823 .gp850.gpc-face button.pk,.alpha-panel .pe823 .gp850.gpc-hair button.pk{height:100%!important;min-height:0!important}
.pe823 .gp850.gpc-face .pk .pk-img,.pe823 .gp850.gpc-hair .pk .pk-img{flex:1 1 auto;min-height:0;aspect-ratio:auto!important;height:auto!important}
.pe823 .gp850.gpc-face .pk .pk-img img,.pe823 .gp850.gpc-hair .pk .pk-img img{object-fit:cover;object-position:50% 45%}
/* Update 8.52: VISO as the user's picture - left Testa, Occhi, Sopracciglia; right Mascella, Naso, Labbra; close pictures of each feature */
.pe823 .gp850.gpc-face{grid-template-columns:minmax(0,1.45fr) minmax(0,1fr)!important;grid-template-rows:repeat(3,minmax(0,1fr))!important}
.pe823 .gpc-face .gp-face,.pe823 .gpc-face .gp-eyes,.pe823 .gpc-face .gp-brows{grid-column:1!important}
.pe823 .gpc-face .gp-jaw,.pe823 .gpc-face .gp-nose,.pe823 .gpc-face .gp-mouth{grid-column:2!important}
.pe823 .gpc-face .gp-face,.pe823 .gpc-face .gp-jaw{grid-row:1!important}.pe823 .gpc-face .gp-eyes,.pe823 .gpc-face .gp-nose{grid-row:2!important}.pe823 .gpc-face .gp-brows,.pe823 .gpc-face .gp-mouth{grid-row:3!important}
.pe823 .gp850 .bd-box h5{display:flex;align-items:center;gap:10px;font-size:12px!important}
.pe823 .gp850 .gp-pills{margin-left:auto;display:flex;align-items:center;gap:5px}
.pe823 .gp850 .gp-pills span{font-size:9px;letter-spacing:.12em;color:#9fb0a6;margin-right:3px}
.alpha-panel .pe823 .gp850 .gp-pill{min-height:0;padding:3px 9px;font-size:10px;border-radius:99px;border:1px solid #ffffff26;background:#0b1712;color:#dfe8e2}
.alpha-panel .pe823 .gp850 .gp-pill.on{border-color:var(--lime);color:var(--lime)}
.pe823 .gp850.gpc-face .pk .pk-img img{object-position:50% 50%}
/* Update 8.53: the face's details as minimal drawings on plain buttons */
.pe823 .gp850 .pk .pk-img.pk-icon{display:grid!important;place-items:center;background:#0f1d18!important}
.pe823 .gp850 .fi{width:min(70%,74px);height:min(70%,74px);fill:none;stroke:#cfdccf;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.pe823 .gp850 .fi .w{stroke-width:5}.pe823 .gp850 .fi .f{fill:#cfdccf;stroke:none}.pe823 .gp850 .fi .r{fill:#ff6a2b}
.pe823 .gp850 .pk.on .fi{stroke:var(--lime)}.pe823 .gp850 .pk.on .fi .f{fill:var(--lime)}.pe823 .gp850 .pk.on .fi .r{fill:#ff6a2b}
.alpha-panel .pe823 .gp850 .pk:hover .fi{stroke:#fff}
.pe823 .gp850 .gp-eyes .fi,.pe823 .gp850 .gp-brows .fi,.pe823 .gp850 .gp-mouth .fi{width:min(86%,110px);height:min(86%,110px)}
/* Update 8.54: the backhand as two plain text buttons, stacked */
.pe823 .bd849 .bd-grip .bd-row{grid-auto-flow:row!important;grid-auto-rows:1fr;height:clamp(96px,13vh,150px)}
.alpha-panel .pe823 .bd849 button.bd-txt{margin:0;min-height:0;height:100%;border-radius:10px;border:1px solid #ffffff1f;background:#0f1d18;color:#e3ebe5;font:800 12px/1 var(--fam);letter-spacing:.1em}
.alpha-panel .pe823 .bd849 button.bd-txt.on{border-color:var(--lime);color:var(--lime);box-shadow:0 0 0 2px #d4f26a33}
.alpha-panel .pe823 .bd849 button.bd-txt:hover:not(.on){border-color:#ffffff55}
.alpha-panel .pe823 .bd849 button.bd-txt{text-align:center;justify-content:center;display:flex;align-items:center}
/* Update 8.56: the entrance of a match, over the arena (names VS, who serves, 3 2 1 GO) and the wait for the other players */
#matchIntro{position:fixed;inset:0;z-index:40;pointer-events:none;display:grid;place-items:center;font-family:var(--fam);color:#fff}
#matchIntro[hidden]{display:none}
#matchIntro>*{position:absolute;opacity:0;transition:opacity .35s ease,transform .45s cubic-bezier(.2,.8,.2,1)}
#matchIntro .mi-band{top:16%;left:50%;transform:translate(-50%,-14px);display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 34px 16px;border-radius:16px;background:linear-gradient(180deg,#0b1712e8,#0b1712c4);border:1px solid #d4f26a55;box-shadow:0 18px 50px #0009;min-width:min(760px,86vw)}
#matchIntro .mi-place{font:700 11px/1 var(--fam);letter-spacing:.24em;color:#c8d3cb;text-transform:uppercase}
#matchIntro .mi-row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:26px;width:100%}
#matchIntro .mi-team{display:flex;flex-direction:column;gap:4px}#matchIntro .mi-team.me{text-align:right;align-items:flex-end}#matchIntro .mi-team.them{text-align:left;align-items:flex-start}
#matchIntro .mi-team b{font:900 italic clamp(22px,2.4vw,40px)/1 var(--fam);letter-spacing:-.01em;text-shadow:0 2px 10px #000a}
#matchIntro .mi-team.me b{color:#d4f26a}#matchIntro .mi-team.them b{color:#ff8f4a}
#matchIntro .mi-team small{font:800 10px/1 var(--fam);letter-spacing:.16em;color:#dfe8e2}
#matchIntro .mi-vs{font:900 italic clamp(30px,3.2vw,52px)/1 var(--fam);background:linear-gradient(180deg,#fff,#cfd8d2);-webkit-background-clip:text;background-clip:text;color:transparent;padding:0 6px;transform:skewX(-8deg)}
#matchIntro .mi-serve{top:calc(16% + 132px);left:50%;transform:translate(-50%,8px);padding:8px 18px;border-radius:99px;background:#0b1712d9;border:1px solid #ffffff2e;font:800 12px/1 var(--fam);letter-spacing:.14em;color:#e5ece7}
#matchIntro .mi-serve b{color:#d4f26a}
#matchIntro .mi-count{top:50%;left:50%;transform:translate(-50%,-50%) scale(.6);font:900 italic clamp(90px,12vw,180px)/1 var(--fam);color:#d4f26a;text-shadow:0 0 30px #d4f26a88,0 6px 24px #000c}
#matchIntro .mi-wait{bottom:14%;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:12px;padding:12px 22px;border-radius:12px;background:#0b1712e0;border:1px solid #ffffff26;font:700 14px/1 var(--fam);letter-spacing:.04em}
#matchIntro .mi-wait i{width:14px;height:14px;border-radius:50%;border:2px solid #d4f26a;border-right-color:transparent;animation:mi-spin .8s linear infinite}
@keyframes mi-spin{to{transform:rotate(360deg)}}
#matchIntro .mi-skip{bottom:5%;left:50%;transform:translateX(-50%);font:700 11px/1 var(--fam);letter-spacing:.12em;color:#ffffffaa}
#matchIntro[data-stage=wait] .mi-wait{opacity:1}
#matchIntro[data-stage=names] .mi-band,#matchIntro[data-stage=serve] .mi-band,#matchIntro[data-stage=count] .mi-band{opacity:1;transform:translate(-50%,0)}
#matchIntro[data-stage=serve] .mi-serve,#matchIntro[data-stage=count] .mi-serve{opacity:1;transform:translate(-50%,0)}
#matchIntro[data-stage=count] .mi-count{opacity:1;transform:translate(-50%,-50%) scale(1);animation:mi-beat .75s ease-out}
#matchIntro[data-stage=go] .mi-count{opacity:1;transform:translate(-50%,-50%) scale(1.15);color:#fff;animation:mi-go .75s ease-out forwards}
#matchIntro[data-phase=intro] .mi-skip{opacity:1}
@keyframes mi-beat{from{transform:translate(-50%,-50%) scale(1.5);opacity:.2}to{transform:translate(-50%,-50%) scale(1);opacity:1}}
@keyframes mi-go{0%{transform:translate(-50%,-50%) scale(.8);opacity:1}70%{opacity:1}100%{transform:translate(-50%,-50%) scale(1.5);opacity:0}}

/* Update 8.57: the point call */
#pointCall{position:fixed;left:50%;top:27%;z-index:39;pointer-events:none;transform:translate(-50%,-50%);font-family:var(--fam);color:#fff;--tone:#d4f26a}
#pointCall[hidden]{display:none}#pointCall[data-tone=them]{--tone:#ff8f4a}
#pointCall .pcl-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 30px 14px;border-radius:16px;background:linear-gradient(180deg,#0b1712eb,#0b1712c8);border:1px solid color-mix(in srgb,var(--tone) 45%,transparent);box-shadow:0 18px 50px #0009,0 0 0 1px #ffffff10 inset;opacity:0;transform:scale(.82)}
#pointCall.show .pcl-card{animation:pcl-in .34s cubic-bezier(.2,1.3,.4,1) forwards}
#pointCall.show[data-big="1"] .pcl-card{animation:pcl-in-big .5s cubic-bezier(.2,1.5,.35,1) forwards}
#pointCall.out .pcl-card{animation:pcl-out .26s ease-in forwards}
#pointCall .pcl-tag{font:800 11px/1 var(--fam);letter-spacing:.22em;color:#dfe8e2;padding:5px 12px;border-radius:99px;background:#ffffff14}
#pointCall .pcl-main{font:900 italic clamp(32px,3.7vw,60px)/.95 var(--fam);letter-spacing:-.01em;color:var(--tone);text-shadow:0 0 26px color-mix(in srgb,var(--tone) 55%,transparent),0 4px 18px #000b;white-space:nowrap}
#pointCall[data-big="1"] .pcl-main{font-size:clamp(40px,4.6vw,76px);text-shadow:0 0 14px color-mix(in srgb,var(--tone) 80%,transparent),0 0 36px color-mix(in srgb,var(--tone) 45%,transparent),0 4px 18px #000b}
#pointCall[data-big="1"].show .pcl-main{animation:pcl-glow .9s ease-out .15s}
#pointCall .pcl-who{display:flex;align-items:baseline;gap:10px;font:900 italic clamp(17px,1.6vw,26px)/1 var(--fam);letter-spacing:.02em;text-shadow:0 2px 10px #000a}
#pointCall .pcl-who small{font:800 11px/1 var(--fam);font-style:normal;letter-spacing:.2em;color:#c8d3cb}
#pointCall .pcl-score{display:grid;grid-template-columns:1fr auto auto auto 1fr;align-items:center;gap:12px;margin-top:4px;padding-top:10px;border-top:1px solid #ffffff1f;min-width:min(400px,80vw);position:relative}
#pointCall .pcl-score>small{position:absolute;top:-7px;left:50%;transform:translateX(-50%);padding:0 10px;background:#0b1712;font:800 9px/14px var(--fam);letter-spacing:.22em;color:#c8d3cb}
#pointCall .pcl-score span{font:800 12px/1 var(--fam);letter-spacing:.14em;color:#dfe8e2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#pointCall .pcl-score span.me{text-align:right;color:#d4f26a}#pointCall .pcl-score span.them{text-align:left;color:#ff8f4a}
#pointCall .pcl-score b{font:900 clamp(20px,1.9vw,30px)/1 var(--fam);min-width:1.6em;text-align:center}
#pointCall .pcl-score i{font:900 22px/1 var(--fam);color:#ffffff80;font-style:normal}
@keyframes pcl-in{0%{opacity:0;transform:scale(.82)}60%{opacity:1}100%{opacity:1;transform:scale(1)}}
@keyframes pcl-in-big{0%{opacity:0;transform:scale(.6)}45%{opacity:1;transform:scale(1.08);box-shadow:0 0 70px color-mix(in srgb,var(--tone) 45%,transparent),0 18px 50px #0009}100%{opacity:1;transform:scale(1)}}
@keyframes pcl-out{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.06) translateY(-8px)}}
@keyframes pcl-glow{0%{filter:brightness(1.9)}100%{filter:brightness(1)}}

/* Update 8.58: SPECIALE - the +30 over the player, the power-up chips under the scoreboard */
#powerPops{position:fixed;inset:0;pointer-events:none;z-index:38}
#powerPops .pw-pop{position:absolute;transform:translate(-50%,-100%);font:900 italic clamp(16px,1.5vw,24px)/1 var(--fam);letter-spacing:.04em;white-space:nowrap;color:var(--c);text-shadow:0 0 12px var(--c),0 2px 8px #000c;animation:pw-pop 1.4s ease-out forwards;--c:#38d6ff}
#powerPops .pw-pop b{font-size:1.35em;color:#fff;text-shadow:0 0 14px var(--c),0 2px 8px #000c}
.pw-pop[data-stat=control]{--c:#c77dff!important}.pw-pop[data-stat=power]{--c:#ff6a3d!important}
@keyframes pw-pop{0%{opacity:0;transform:translate(-50%,-60%) scale(.6)}12%{opacity:1;transform:translate(-50%,-100%) scale(1.12)}22%{transform:translate(-50%,-105%) scale(1)}78%{opacity:1}100%{opacity:0;transform:translate(-50%,-185%) scale(.96)}}
#hud .pw-chips{position:absolute;top:68px;left:50%;transform:translateX(-50%);display:grid;grid-template-columns:1fr 1fr;gap:150px;width:max-content;pointer-events:none}
#hud .pw-chips[hidden]{display:none}#hud .pw-chips>div{display:flex;gap:5px;flex-wrap:wrap}#hud .pw-chips .me{justify-content:flex-end}
#hud .pw-chips i{font:800 10px/1 var(--fam);font-style:normal;letter-spacing:.1em;padding:4px 7px;border-radius:99px;background:#0b1712d9;border:1px solid var(--c);color:var(--c);--c:#38d6ff}
#hud .pw-chips i[data-stat=control]{--c:#c77dff}#hud .pw-chips i[data-stat=power]{--c:#ff6a3d}
/* (8.58) with the REGOLE section the settings column tightens, so all five sections fit above ENTRA IN CAMPO */
.cs-settings:has(.cs-rules){gap:7px!important;padding:10px 14px!important}
.cs-settings:has(.cs-rules) .cs-img{height:clamp(24px,3.3vh,72px)!important}
.cs-settings:has(.cs-rules) .cs-sec h5{margin-bottom:5px}
#panel .cs830 .cs-settings:has(.cs-rules) button.cs-opt.ico{min-height:clamp(32px,4.3vh,60px)}

/* Update 8.59: the veil while a match loads */
#matchVeil{position:fixed;inset:0;z-index:60;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 40%,#0b3a30,#021613 70%);opacity:1;transition:opacity .5s ease;pointer-events:all;font-family:var(--fam)}
#matchVeil[hidden]{display:none}#matchVeil.out{opacity:0;pointer-events:none}
#matchVeil .mv-in{display:flex;flex-direction:column;align-items:center;gap:6px;color:#fff}
#matchVeil b{font:900 italic clamp(36px,4.6vw,72px)/1 'Arial Black',var(--fam);letter-spacing:.02em}
#matchVeil span{font:900 italic clamp(12px,1.3vw,20px)/1 'Arial Black',var(--fam);letter-spacing:.18em;color:#d4f26a}
#matchVeil i{display:block;width:min(260px,50vw);height:4px;border-radius:4px;background:#ffffff1c;overflow:hidden;margin-top:18px}
#matchVeil em{display:block;width:40%;height:100%;border-radius:4px;background:#d4f26a;animation:mv-run 1.1s ease-in-out infinite}
#matchVeil small{font:700 12px/1 var(--fam);letter-spacing:.12em;color:#c8d3cb;margin-top:8px}
@keyframes mv-run{0%{transform:translateX(-110%)}100%{transform:translateX(260%)}}

/* Update 8.62 */
#matchIntro .mi-rate{display:inline-grid;place-items:center;min-width:46px;padding:5px 8px;border-radius:9px;border:2px solid var(--tier);background:color-mix(in srgb,var(--tier) 22%,#050c16);font:900 20px/1 'Arial Black',var(--fam);color:#fff;box-shadow:0 0 12px color-mix(in srgb,var(--tier) 55%,transparent);margin-top:4px}
#matchIntro .mi-team.me .mi-rate{align-self:flex-end}#matchIntro .mi-team.them .mi-rate{align-self:flex-start}
.alpha-panel button.pe-delete{margin-right:auto;border-color:#ff5d5d66!important;color:#ff8a8a!important}
.alpha-panel button.pe-delete:hover,.alpha-panel button.pe-delete:focus-visible{background:#3a1010!important;color:#fff!important}
#editorName[readonly]{opacity:.8;cursor:not-allowed}
.reward-line .ico{display:inline-block;vertical-align:-3px;margin:0 3px 0 6px}
.rk-board{margin-top:10px;border:1px solid #ffffff1c;border-radius:12px;background:#06191ad9;padding:10px 12px;min-height:0;overflow:auto}
.rk-board h5{display:flex;align-items:center;gap:8px;margin:0 0 8px;font:900 12px/1 var(--fam);letter-spacing:.12em;color:#e6efdf}.rk-board h5 .ic{width:16px;height:16px;color:var(--lime)}
.rk-board ol{list-style:none;margin:0;padding:0;display:grid;gap:3px}
.rk-board li{display:grid;grid-template-columns:20px 24px 1fr auto;align-items:center;gap:8px;padding:4px 8px;border-radius:8px;background:#ffffff08;font:700 12px/1.1 var(--fam);color:#e9f2e3}
.rk-board li.me{background:#d4f26a22;outline:1px solid #d4f26a77}.rk-board li i{font:900 12px/1 var(--fam);font-style:normal;color:#9fb3ab;text-align:right}
.rk-board li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rk-board li b{font:900 12px/1 var(--fam);color:#fff}
.rk-emb.tiny{width:24px;height:24px}.rk-emb.tiny b{font-size:10px}

.st-pa .ico.pa{display:inline-block;margin-right:6px;vertical-align:-3px}

/* (8.63) PROFILO > MODIFICA GIOCATORE: no tabs */
.alpha-panel .menu:has(.pe823[data-mode="edit"]) :is([data-action="profile-tab:overview"],[data-action="profile-tab:edit"],[data-action="profile-tab:stats"]){display:none!important}

/* (8.79) TEST > Movimento: the recovery tools */
.dv-rec .dv-recrow{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 10px}.dv-rec .dv-recrow button{min-height:30px;padding:4px 10px;font-size:11px}
.dv-reclog{margin:6px 0 0;padding-left:18px;display:grid;gap:6px}.dv-reclog li{font-size:12px;color:#e9f2e3}.dv-reclog small{display:block;color:#b9c7c0;font-size:11px;line-height:1.35}

/* (8.83) the controller's icon only in the main menu - not in the other screens, not in a match */
body:not([data-screen="MENU"]) #controllerStatus{display:none!important}
