#intro{inset:0;margin:0;padding:0;width:100%;max-width:none;height:100dvh;max-height:none;border:0;border-radius:0;background:radial-gradient(ellipse at 80% 15%,#43764050,transparent 55%),radial-gradient(ellipse at 0% 85%,#1c513c80,transparent 55%),#061b17;color:#edf8e6;box-shadow:none;overflow:auto;overscroll-behavior:contain}
#intro::backdrop{background:#061b17;backdrop-filter:none}.intro-court{position:absolute;inset:0;pointer-events:none;background:linear-gradient(168deg,transparent 16%,#cfff6810 16.1%,transparent 16.25%),linear-gradient(168deg,transparent 49%,#cfff6810 49.1%,transparent 49.25%),linear-gradient(168deg,transparent 84%,#cfff6810 84.1%,transparent 84.25%)}.intro-court::before{content:"";position:absolute;top:0;bottom:0;left:50%;border-left:1px solid #cfff6810}.intro-court::after{content:"";position:absolute;left:0;right:0;top:50%;border-top:1px solid #cfff6806}
.intro-inner{isolation:isolate;position:relative;min-height:100%;width:min(620px,100%);margin:0 auto;padding:calc(36px + env(safe-area-inset-top)) 30px calc(30px + env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.intro-app{display:flex;align-items:center;gap:11px;margin-bottom:26px}.intro-app img{width:44px;height:44px;border:1px solid #cfff6825;border-radius:13px;box-shadow:0 0 30px #cfff680b}.intro-app>span{font-size:9px;letter-spacing:2.5px;color:#bad4a3;font-weight:650}
#intro-title{font-size:clamp(40px,8vw,66px);font-weight:850;line-height:1.02;letter-spacing:-2.8px;color:#f2f9eb;margin:0}#intro-title>span{display:block;font-size:1.14em;color:#d0ff68;letter-spacing:5px;margin-top:6px}.intro-dot{font-size:12px;vertical-align:top;position:relative;top:9px;letter-spacing:0;margin-left:4px}#intro-description{font-size:14px;color:#b0c49d;letter-spacing:.2px;margin:19px 0 0}
.intro-brands{display:flex;gap:16px;width:100%;margin:37px 0 28px;align-items:stretch}.intro-brand{flex:1;min-width:0;padding:17px 15px 16px;border:1px solid #cfff6820;border-radius:20px;background:linear-gradient(145deg,#ffffff06,#ffffff02);box-shadow:0 12px 40px #0001;display:flex;flex-direction:column;align-items:center}.intro-brand-label{font-size:7px;letter-spacing:1.5px;color:#a7c38f;font-weight:600;line-height:1.5}.intro-logo-space{display:flex;align-items:center;justify-content:center;flex:1;min-height:112px;width:100%;padding:12px 0}.intro-olipep img{display:block;width:180px;max-width:100%;height:auto;object-fit:contain}.intro-federation img{width:88px;height:88px;padding:6px;background:#fff;object-fit:contain;border-radius:17px;box-shadow:0 7px 25px #0002}.intro-brand strong{font-size:10px;font-weight:600;line-height:1.65;color:#deecd1;min-height:33px;display:flex;align-items:center;justify-content:center}
#intro-enter{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:51px;width:min(340px,100%);padding:15px 21px;border:1px solid #e6ffab;border-radius:14px;background:#d0ff68;color:#17331d;font-size:13px;font-weight:750;box-shadow:0 10px 36px #cfff6817}#intro-enter>span{font-size:20px;line-height:1}#intro-enter:hover{background:#e0ff96}.intro-progress{width:70px;height:3px;background:#cfff6819;border-radius:10px;margin-top:22px;overflow:hidden}.intro-progress>span{display:block;height:100%;width:100%;background:#d0ff68;transform-origin:left;animation:intro-progress 3.2s linear both}.intro-screen.intro-manual .intro-progress{visibility:hidden}.intro-note{margin:14px 0 0;color:#8ca57c;font-size:8px;line-height:1.7}.intro-replay{display:block;padding:10px 0;min-height:42px;background:none;border:0;color:#d0ff68;font-size:11px;font-weight:600;text-align:left}
@keyframes intro-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(max-width:680px){.intro-inner{padding-left:22px;padding-right:22px}.intro-app{margin-bottom:24px}.intro-app>span{font-size:8px;letter-spacing:2px}#intro-title{font-size:44px;letter-spacing:-2px}#intro-title>span{letter-spacing:4px}.intro-brands{gap:10px;margin:30px 0 25px}.intro-brand{padding:15px 11px 13px;border-radius:17px}.intro-brand-label{font-size:6px;letter-spacing:1px}.intro-logo-space{min-height:103px;padding:12px 0}.intro-olipep img{max-width:145px}.intro-federation img{width:78px;height:78px;border-radius:14px}.intro-brand strong{font-size:9px;line-height:1.6}.intro-note{font-size:7px}#intro-description{font-size:12px}.intro-dot{font-size:10px;top:7px}#intro-enter{font-size:12px}}
@media(max-height:690px){.intro-inner{padding-top:20px;padding-bottom:20px}.intro-app{margin-bottom:16px}#intro-title{font-size:36px}#intro-description{margin-top:12px}.intro-brands{margin:20px 0}.intro-logo-space{min-height:88px}.intro-progress{margin-top:15px}}
.intro-app{flex-direction:column;gap:12px;margin-bottom:19px}.intro-app img{width:126px;height:96px;object-fit:contain;padding:6px;background:#fff;border-radius:20px;border:1px solid #edffca;box-shadow:0 12px 38px #0003,0 0 30px #cfff6808}.intro-app>span{font-size:8px;letter-spacing:2.5px}
.intro-olipep .intro-logo-space img{width:172px;height:96px;max-width:100%;object-fit:contain;background:#f8fcf6;padding:10px 9px;border-radius:14px;box-shadow:0 6px 20px #0002}.intro-brands{margin-top:28px}.intro-progress>span{animation-duration:4.8s}
#intro[open] .intro-app{animation:intro-club-in .75s cubic-bezier(.2,.7,.2,1) both}#intro[open] #intro-title{animation:intro-title-in .7s .25s cubic-bezier(.2,.7,.2,1) both}#intro[open] #intro-description{animation:intro-rise-in .6s .5s ease both}#intro[open] .intro-olipep{animation:intro-left-in .75s .7s cubic-bezier(.2,.7,.2,1) both}#intro[open] .intro-federation{animation:intro-right-in .75s .9s cubic-bezier(.2,.7,.2,1) both}#intro[open] #intro-enter{animation:intro-rise-in .6s 1.2s ease both}#intro[open] .intro-note{animation:intro-rise-in .6s 1.3s ease both}#intro[open] .intro-court{animation:intro-court-in 2.5s ease both}#intro.intro-leaving{animation:intro-out .24s ease both}
@keyframes intro-club-in{from{opacity:0;transform:translateY(-20px) scale(.86)}to{opacity:1;transform:none}}@keyframes intro-title-in{from{opacity:0;transform:translateY(18px) scale(.96);filter:blur(5px)}to{opacity:1;transform:none;filter:none}}@keyframes intro-rise-in{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}@keyframes intro-left-in{from{opacity:0;transform:translateX(-25px) translateY(8px)}to{opacity:1;transform:none}}@keyframes intro-right-in{from{opacity:0;transform:translateX(25px) translateY(8px)}to{opacity:1;transform:none}}@keyframes intro-court-in{from{opacity:0}to{opacity:1}}@keyframes intro-out{from{opacity:1}to{opacity:0}}
@media(max-width:680px){.intro-app{margin-bottom:18px;gap:11px}.intro-app img{width:112px;height:85px;border-radius:17px;padding:5px}.intro-olipep .intro-logo-space img{width:142px;height:80px;padding:8px;max-width:100%}.intro-brands{margin-top:25px}.intro-logo-space{min-height:96px}.intro-brand-label{font-size:6px}}
@media(max-height:690px){.intro-app img{width:100px;height:76px}.intro-app{gap:8px;margin-bottom:14px}.intro-app>span{font-size:7px}.intro-brands{margin:18px 0}.intro-olipep .intro-logo-space img{height:74px}.intro-logo-space{min-height:82px}}
@media(prefers-reduced-motion:reduce){#intro[open] .intro-app,#intro[open] #intro-title,#intro[open] #intro-description,#intro[open] .intro-brand,#intro[open] #intro-enter,#intro[open] .intro-note,#intro[open] .intro-court,#intro.intro-leaving,.intro-progress>span{animation:none}}
.top-actions .presentation-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:0 12px;border:1px solid #ffffff20;border-radius:14px;background:#ffffff08;color:#e4f2dc;font:inherit;font-size:12px;font-weight:650;white-space:nowrap;cursor:pointer}.presentation-button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}.top-actions .presentation-button:hover{background:#cfff6818;color:#d0ff68}.presentation-button:focus-visible{outline:2px solid #d0ff68;outline-offset:3px}@media(max-width:380px){.top-actions .presentation-button{padding:0 9px;font-size:11px;gap:5px}}