/* KNOCKVERSE BUILD 14.0.0 — PROFESSIONAL TWO-PACK STRUCTURE */

:root{--navy:#031727;--deep:#052b43;--aqua:#20dce7;--cyan:#7af7f4;--sea:#087f9d;--white:#fff;--ink:#dff9fb;--muted:#9fc5cc;--coral:#ff806c;--sand:#fff1ca}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#031727;color:var(--ink);font-family:Manrope,Arial,sans-serif;overflow-x:hidden}a{color:inherit}.floating-header{position:fixed;top:18px;left:50%;transform:translateX(-50%);width:min(1480px,calc(100% - 36px));height:72px;padding:0 20px 0 24px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(180deg,rgba(3,23,39,.88),rgba(3,23,39,.58));border:1px solid rgba(93,232,238,.22);box-shadow:0 16px 45px rgba(0,0,0,.25);backdrop-filter:blur(15px);z-index:100}.nav-wordmark{display:flex;width:190px;height:44px;align-items:center}.nav-wordmark img{width:100%;height:100%;object-fit:contain;object-position:left center}.floating-header nav{display:flex;align-items:center;gap:25px}.floating-header nav>a,.nav-login{font-size:10px;font-weight:800;letter-spacing:1.3px;text-transform:uppercase;text-decoration:none;color:white;background:none;border:0;cursor:pointer}.floating-header nav>a:hover,.nav-login:hover{color:var(--cyan)}.nav-store{background:var(--aqua)!important;color:#042237!important;padding:14px 21px!important;border:1px solid #8ef7fb}.mobile-menu{display:none;border:0;background:none;color:white;font-size:26px}.hero-v6{height:100vh;min-height:720px;position:relative;overflow:hidden}.hero-image{position:absolute;inset:0;background:url('hero-knockverse.png') center/cover no-repeat}.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,16,29,.96) 0%,rgba(2,19,33,.82) 25%,rgba(2,24,39,.36) 52%,rgba(2,20,32,.04) 76%),linear-gradient(0deg,rgba(2,16,28,.74),transparent 45%)}.hero-content-v6{position:absolute;left:6.5vw;top:51%;transform:translateY(-50%);width:min(760px,49vw);z-index:3}.hero-kicker,.eyebrow{font-size:11px;letter-spacing:3.7px;font-weight:800;color:var(--aqua)}h1,h2{font-family:Anton,Arial,sans-serif;text-transform:uppercase;line-height:.9;margin:0}h1{font-size:clamp(62px,6.5vw,104px);color:white;text-shadow:0 8px 25px rgba(0,0,0,.45)}.hero-wordmark{display:block;width:min(760px,100%);height:205px;object-fit:contain;object-position:left center;filter:drop-shadow(0 10px 18px rgba(0,0,0,.55));margin:-15px 0 -8px -14px}.hero-description{font-size:16px;line-height:1.75;max-width:580px;color:#f0fbfd}.hero-actions{display:flex;gap:15px;flex-wrap:wrap;margin-top:29px}.button{display:inline-block;padding:16px 24px;text-decoration:none;font-weight:800;letter-spacing:.8px;font-family:inherit;cursor:pointer}.hero-primary{background:var(--aqua);color:#032139;border:1px solid var(--aqua)}.hero-secondary{background:rgba(3,24,40,.48);color:white;border:1px solid rgba(255,255,255,.55)}.hero-scroll{position:absolute;left:6.5vw;bottom:30px;z-index:4;text-decoration:none;font-size:10px;letter-spacing:2px;color:#b5dce2;display:flex;align-items:center;gap:12px}.hero-scroll span{width:18px;height:29px;border:2px solid var(--aqua);border-radius:12px;position:relative}.hero-scroll span:after{content:'';position:absolute;width:3px;height:7px;background:var(--aqua);left:50%;top:5px;transform:translateX(-50%);animation:dot 1.5s infinite}@keyframes dot{0%{opacity:0;transform:translate(-50%,0)}30%{opacity:1}100%{opacity:0;transform:translate(-50%,10px)}}.section-dark,.store-section,.champions-section{padding:110px 7vw;background:radial-gradient(circle at top,#083e56,#031727 65%)}.section-heading{max-width:920px}.centered{text-align:center;margin:auto}.section-heading h2,.cinematic-copy h2,.account-copy h2,.faq-section h2{font-size:clamp(55px,7vw,105px);color:white}.section-heading h2 span,.cinematic-copy h2 span,.account-copy h2 span{color:var(--aqua)}.section-heading>p:last-child,.cinematic-copy>p:last-child,.account-copy>p:not(.eyebrow){font-size:17px;line-height:1.8;color:var(--muted)}.feature-showcase{display:grid;grid-template-columns:repeat(4,1fr);padding:0 5vw 100px;background:#031727;gap:1px}.feature-showcase article{padding:34px;background:linear-gradient(180deg,rgba(10,73,94,.72),rgba(5,42,65,.55));border:1px solid rgba(74,216,221,.18)}.feature-showcase b{font-family:Anton;font-size:42px;color:var(--aqua)}.feature-showcase h3{font-family:Anton;font-size:28px;text-transform:uppercase}.feature-showcase p{color:var(--muted);line-height:1.7;font-size:13px}.cinematic-block{display:grid;grid-template-columns:1.15fr .85fr;min-height:700px;background:#05283c}.cinematic-image{background:url('hero-knockverse.png') 72% center/cover no-repeat;position:relative}.cinematic-image:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 45%,#05283c)}.cinematic-copy{padding:95px 7vw;display:flex;flex-direction:column;justify-content:center}.edition-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:1250px;margin:65px auto 0}.edition-card{position:relative;background:linear-gradient(180deg,#0b4057,#06283d);border:1px solid rgba(82,219,224,.24);padding:0 28px 30px;overflow:hidden}.edition-card.standard{border:2px solid var(--aqua);transform:translateY(-12px)}.edition-top{text-align:center;padding:35px 10px 24px;border-bottom:1px solid rgba(120,235,237,.16)}.edition-symbol{width:76px;height:84px;margin:auto;display:grid;place-items:center;background:var(--aqua);clip-path:polygon(50% 0,100% 24%,88% 88%,50% 100%,12% 88%,0 24%);font-family:Anton;font-size:45px;color:#032238}.edition-top small{display:block;margin-top:18px;font-size:9px;letter-spacing:2px}.edition-top h3{font-family:Anton;font-size:42px;margin:5px 0}.edition-price{font-weight:800;color:var(--cyan)}.edition-card ul{list-style:none;padding:22px 0;min-height:255px}.edition-card li{padding:10px 0 10px 24px;border-bottom:1px solid rgba(120,235,237,.11);font-size:13px;position:relative;color:#c7e7ea}.edition-card li:before{content:'◆';position:absolute;left:0;color:var(--aqua)}.edition-button{display:block;text-align:center;text-decoration:none;padding:15px;background:var(--aqua);color:#042237;font-weight:800}.secondary-link{background:#138eaa}.coral-link{background:var(--coral)}.edition-ribbon{position:absolute;right:-48px;top:20px;background:#021523;width:170px;text-align:center;padding:7px;transform:rotate(42deg);font-size:8px}.store-warning,.demo-data{text-align:center;margin-top:38px;font-size:9px;letter-spacing:2px;color:#7198a0}.champions-section{background:linear-gradient(180deg,#052b40,#031727)}.leaderboard{max-width:1050px;margin:60px auto 0;border:1px solid rgba(87,223,228,.23)}.leader-row{display:grid;grid-template-columns:.5fr 2fr 1fr 1fr 1fr;padding:19px;background:rgba(7,57,78,.68);border-bottom:1px solid rgba(103,226,230,.12)}.leader-head{background:#031421;font-size:9px;font-weight:800;letter-spacing:1px}.account-cta{display:grid;grid-template-columns:1fr 1fr;min-height:660px;background:#05283c}.account-art{display:grid;place-items:center;background:linear-gradient(145deg,#087f9d,#20dce7)}.passport{width:330px;height:430px;background:#031727;padding:40px;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:20px 20px 0 rgba(0,0,0,.22)}.passport img{width:100%;height:120px;object-fit:contain}.passport b{font-family:Anton;font-size:28px}.passport small{letter-spacing:2px;color:var(--cyan)}.account-copy{padding:90px 8vw;display:flex;flex-direction:column;justify-content:center}.account-copy .button{align-self:flex-start}.faq-section{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;padding:110px 7vw;background:linear-gradient(135deg,#021522,#07506a)}.faq-list details{padding:23px 0;border-top:1px solid rgba(112,240,232,.25)}.faq-list summary{font-weight:800;cursor:pointer}.faq-list p{color:#b8dce0;line-height:1.7}footer{padding:65px 7vw;text-align:center;background:#020f19}.footer-wordmark{width:min(420px,75vw);height:130px;object-fit:contain}footer>p{font-family:Anton;font-size:27px;color:var(--aqua)}.footer-links{display:flex;justify-content:center;gap:25px;margin:25px 0;flex-wrap:wrap}.footer-links a{font-size:11px;font-weight:800;text-decoration:none}footer small{font-size:9px;color:#6e939a}.modal{position:fixed;inset:0;background:rgba(1,12,21,.84);display:none;place-items:center;padding:20px;z-index:200}.modal.open{display:grid}.modal-card{width:min(520px,100%);background:#062c42;padding:40px;position:relative;border:1px solid var(--aqua)}.modal-close{position:absolute;right:13px;top:8px;background:none;border:0;color:white;font-size:30px}.modal h2{font-size:52px}.modal form{display:grid;gap:12px;margin-top:20px}.modal input{padding:14px;background:#031927;border:1px solid #397a88;color:white}.modal form button{padding:15px;background:var(--aqua);border:0;font-weight:800}.social-buttons{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}.social-buttons button{padding:12px;background:#083b52;border:1px solid #2d7b8a;color:white}.modal-note{font-size:10px;color:#86aeb5}
/* product pages */.product-page{background:#031727}.product-header{position:sticky;top:0;z-index:50;height:82px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;background:rgba(3,23,39,.96);border-bottom:1px solid rgba(93,232,238,.2)}.product-header .logo{font-family:Anton;font-size:28px;text-decoration:none;color:white}.product-header .logo span{color:var(--aqua)}.product-header nav{display:flex;gap:20px;align-items:center}.product-header nav a{font-size:10px;font-weight:800;letter-spacing:1px;color:white;text-decoration:none}.back-link{padding:11px 15px;border:1px solid #4c8994}.product-hero{min-height:690px;display:grid;grid-template-columns:1.08fr .92fr;background:linear-gradient(145deg,#0b879e,#52e3db)}.product-visual{position:relative;overflow:hidden;display:grid;place-items:center}.product-visual:before{content:'';position:absolute;width:680px;height:680px;border-radius:50%;background:radial-gradient(circle,#fff7c8 0 28%,rgba(255,255,255,.2) 29% 45%,transparent 46%)}.product-island{position:absolute;bottom:10%;width:80%;height:38%;background:#12675f;clip-path:polygon(0 100%,8% 62%,18% 75%,31% 24%,42% 70%,56% 4%,68% 64%,82% 30%,100% 80%,100% 100%);filter:drop-shadow(0 14px 0 #f2d392)}.product-badge{position:relative;z-index:2;width:300px;height:350px;background:var(--aqua);clip-path:polygon(50% 0,93% 18%,84% 83%,50% 100%,16% 83%,7% 18%);display:flex;flex-direction:column;align-items:center;justify-content:center;filter:drop-shadow(16px 18px 0 rgba(2,34,55,.32))}.product-badge span{font-family:Anton;font-size:155px;color:white;line-height:.8}.product-badge b{font-family:Anton;font-size:28px;color:var(--navy);margin-top:20px}.product-info{padding:90px 7vw;background:#041d2d;display:flex;flex-direction:column;justify-content:center}.product-info h1{font-size:clamp(72px,8vw,125px);text-shadow:none}.product-info h1 span{color:var(--aqua)}.product-info .summary{font-size:17px;line-height:1.7;color:#9fc5cc}.product-price{font-family:Anton;font-size:58px;color:var(--aqua);margin:25px 0 10px}.product-price small{display:block;font-family:Manrope;font-size:10px;letter-spacing:2px;color:#7da4ab}.purchase-panel{margin-top:25px;padding:24px;background:#082f43;border:1px solid #2a7180}.purchase-panel label{display:flex;gap:10px;font-size:12px;line-height:1.5}.purchase-button{display:block;text-align:center;margin-top:18px;padding:17px;background:var(--aqua);color:var(--navy);font-weight:800;text-decoration:none}.product-note{font-size:10px;color:#8bb0b7}.product-tabs{padding:85px 7vw;background:#031727}.tab-nav{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:45px}.tab-nav a{padding:12px 18px;border:1px solid #3d7d88;text-decoration:none;font-size:11px;font-weight:800}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px;max-width:1200px;margin:auto}.detail-card{background:#062a3e;padding:32px;border:1px solid rgba(98,223,227,.18)}.detail-card.full{grid-column:1/-1}.detail-card h2{font-size:45px}.reward-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:25px}.reward{padding:22px;background:#08344a;border:1px solid rgba(98,223,227,.16);min-height:175px}.reward-icon{width:60px;height:60px;display:grid;place-items:center;background:var(--aqua);clip-path:polygon(50% 0,100% 25%,88% 88%,50% 100%,12% 88%,0 25%);font-family:Anton;font-size:28px;color:#032238}.reward p,.detail-card p,.detail-card li{font-size:13px;line-height:1.7;color:#9fc5cc}.notice-box{padding:28px;background:#021522}.product-specs{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.spec{padding:20px;background:#08344a;border:1px solid rgba(98,223,227,.16)}.spec small{display:block;font-weight:800;color:var(--aqua)}.purchase-history{display:flex;justify-content:space-between;align-items:center;padding:25px;background:#062a3e;border:1px solid rgba(98,223,227,.18);margin:35px auto 0;max-width:1200px}.purchase-history button{padding:12px 18px;background:#08344a;border:1px solid #3d7d88;color:white}.product-faq{padding:90px 7vw;background:linear-gradient(135deg,#021522,#075a71)}.product-faq h2{font-size:70px}.product-faq details{padding:20px 0;border-top:1px solid rgba(112,240,232,.25);max-width:950px;margin:auto}.product-faq p{color:#b8dce0}
@media(max-width:950px){.mobile-menu{display:block}.floating-header nav{display:none;position:absolute;top:74px;left:0;right:0;background:rgba(3,23,39,.97);padding:25px;flex-direction:column;align-items:flex-start}.floating-header nav.open{display:flex}.hero-content-v6{left:5vw;width:min(680px,82vw)}.hero-image{background-position:63% center}.feature-showcase,.edition-grid{grid-template-columns:1fr 1fr}.cinematic-block,.account-cta,.faq-section,.product-hero{grid-template-columns:1fr}.cinematic-image,.account-art,.product-visual{min-height:520px}.detail-grid{grid-template-columns:1fr}.detail-card.full{grid-column:auto}.reward-grid{grid-template-columns:1fr}.product-specs{grid-template-columns:1fr}.product-header nav a:not(.back-link){display:none}}@media(max-width:620px){.floating-header{top:8px;width:calc(100% - 16px);height:64px}.nav-wordmark{width:145px}.hero-v6{min-height:760px}.hero-image{background-position:61% center}.hero-overlay{background:linear-gradient(90deg,rgba(2,16,29,.94),rgba(2,19,33,.62)),linear-gradient(0deg,rgba(2,16,28,.72),transparent 50%)}.hero-content-v6{left:22px;right:22px;width:auto;top:53%}h1{font-size:53px}.hero-wordmark{height:130px;margin:-7px 0 4px -7px}.hero-description{font-size:14px}.hero-actions .button{width:100%;text-align:center}.hero-scroll{left:22px}.section-dark,.store-section,.champions-section,.faq-section{padding:75px 22px}.feature-showcase,.edition-grid{grid-template-columns:1fr}.edition-card.standard{transform:none}.cinematic-copy,.account-copy{padding:75px 24px}.leader-row{grid-template-columns:.5fr 1.5fr .8fr .8fr}.leader-row span:last-child{display:none}.passport{transform:scale(.82)}.social-buttons{grid-template-columns:1fr}.product-info,.product-tabs,.product-faq{padding:65px 22px}.product-badge{transform:scale(.78)}}

/* V7 hero typography and account redesign */
.hero-title-text{font-family:Anton,Impact,sans-serif;font-size:clamp(72px,8.8vw,142px);line-height:.82;letter-spacing:-2px;color:#69f4f0;text-shadow:0 4px 0 #087d9c,0 9px 0 #04243b,0 18px 34px rgba(0,0,0,.44);margin:-4px 0 22px;transform:skew(-4deg);width:max-content;max-width:100%}
.passport{overflow:hidden;padding:28px 34px 34px}.passport img{width:210px;height:210px;object-fit:contain;object-position:center;margin-bottom:8px;filter:drop-shadow(0 14px 20px rgba(0,0,0,.32))}
.modal-card{width:min(560px,100%);padding:0;overflow:hidden;border-radius:18px;border:1px solid rgba(109,244,241,.55);background:linear-gradient(180deg,#07334b 0,#041f31 100%);box-shadow:0 28px 90px rgba(0,0,0,.55),0 0 50px rgba(32,220,231,.12)}
.modal-brand{height:155px;display:flex;align-items:flex-end;justify-content:center;background:radial-gradient(circle at 50% 15%,rgba(85,246,239,.24),transparent 55%),linear-gradient(180deg,#0a6980,#07344d);border-bottom:1px solid rgba(110,244,241,.28)}
.modal-brand img{width:180px;height:180px;object-fit:contain;transform:translateY(30px);filter:drop-shadow(0 18px 22px rgba(0,0,0,.4))}
.modal-inner{padding:48px 42px 38px}.modal-inner .eyebrow{text-align:center}.modal-inner h2{text-align:center;font-size:52px;margin:6px 0 8px}.modal-subtitle{text-align:center;color:#a6cbd1;font-size:13px;line-height:1.55;margin:0 auto 20px;max-width:390px}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;background:#031927;border:1px solid rgba(109,244,241,.24);border-radius:10px;padding:4px;margin-bottom:18px}.auth-tab{border:0;background:transparent;color:#8fb9c0;padding:11px;font-weight:800;cursor:pointer;border-radius:7px}.auth-tab.active{background:#0c5368;color:white}.social-buttons{grid-template-columns:1fr 1fr}.social-buttons button{display:flex;align-items:center;justify-content:center;gap:9px;border-radius:9px;cursor:pointer;transition:.2s}.social-buttons button:hover{border-color:var(--aqua);transform:translateY(-1px)}.social-mark{width:21px;height:21px;border-radius:50%;display:grid;place-items:center;background:white;color:#09283a;font-size:11px;font-weight:900}.auth-divider{display:flex;align-items:center;gap:12px;color:#7099a1;font-size:10px;letter-spacing:1.5px;margin:20px 0}.auth-divider:before,.auth-divider:after{content:"";height:1px;flex:1;background:rgba(128,190,198,.22)}.modal form input{border-radius:9px;outline:none}.modal form input:focus{border-color:var(--aqua);box-shadow:0 0 0 3px rgba(32,220,231,.1)}.modal form button{border-radius:9px;cursor:pointer}.auth-message{min-height:18px;text-align:center;font-size:11px;margin-top:12px;color:#91c1c7}.auth-message.error{color:#ff9b8c}.auth-message.success{color:#72f0d2}.modal-close{z-index:5;cursor:pointer}.account-user{display:flex;align-items:center;gap:8px}.account-user-avatar{width:24px;height:24px;border-radius:50%;object-fit:cover;background:#0f6477}.logout-button{margin-top:14px;width:100%;padding:12px;border:1px solid #3f7e89;background:transparent;color:white;border-radius:8px;cursor:pointer}
@media(max-width:620px){.hero-title-text{font-size:clamp(58px,18vw,92px);letter-spacing:-1px;margin-bottom:17px}.modal-inner{padding:46px 22px 28px}.modal-brand{height:130px}.modal-brand img{width:155px;height:155px}.social-buttons{grid-template-columns:1fr}.passport img{width:190px;height:190px}}

/* V8 shared navigation + ambient audio */
.product-page{padding-top:0}
.product-page .product-hero{padding-top:108px;min-height:760px}
.product-floating-header{position:fixed!important;top:18px!important;left:50%!important;transform:translateX(-50%)!important}
.product-floating-header .nav-wordmark{width:190px}
.product-floating-header nav{display:flex;align-items:center;gap:25px}
.product-floating-header nav a,.product-floating-header .nav-login{font-size:10px;font-weight:800;letter-spacing:1.3px;text-transform:uppercase;text-decoration:none;color:white;background:none;border:0;cursor:pointer}
.product-floating-header nav a:hover,.product-floating-header .nav-login:hover{color:var(--cyan)}
.product-page .product-info{padding-top:120px}
.product-page footer{background:#021421;border-top:1px solid rgba(95,225,230,.18)}
.music-toggle{position:fixed;right:24px;bottom:24px;z-index:90;display:flex;align-items:center;gap:10px;padding:12px 15px;border:1px solid rgba(115,244,243,.48);background:rgba(3,23,39,.78);backdrop-filter:blur(12px);color:white;border-radius:999px;font-family:Manrope,Arial,sans-serif;font-size:9px;font-weight:800;letter-spacing:1.4px;cursor:pointer;box-shadow:0 12px 35px rgba(0,0,0,.28);transition:.25s}
.music-toggle:hover{transform:translateY(-2px);border-color:var(--cyan)}
.music-toggle.playing{background:rgba(6,76,93,.88);box-shadow:0 0 0 1px rgba(32,220,231,.2),0 12px 35px rgba(0,0,0,.3)}
.music-icon{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--aqua);color:#032238;font-size:15px}
.music-toggle.playing .music-icon{animation:musicPulse 1.8s ease-in-out infinite}
@keyframes musicPulse{0%,100%{box-shadow:0 0 0 0 rgba(32,220,231,.4)}50%{box-shadow:0 0 0 8px rgba(32,220,231,0)}}
@media(max-width:950px){.product-floating-header nav{display:none}.product-floating-header nav.open{display:flex}.product-page .product-hero{padding-top:92px}.product-page .product-info{padding-top:70px}}
@media(max-width:620px){.music-toggle{right:12px;bottom:12px;padding:9px 11px}.music-label{display:none}.product-floating-header{top:8px!important}.product-page .product-hero{padding-top:80px}}


/* V9 navigation branding, Jungle Zone hero and premium audio panel */
.nav-wordmark img,.product-floating-header .nav-wordmark img{filter:grayscale(1) brightness(0) invert(1);opacity:.98}
.hero-title-text{font-size:clamp(68px,8.2vw,132px);letter-spacing:-1px;white-space:nowrap}
.music-player{position:fixed;right:24px;bottom:24px;z-index:90;width:270px;border:1px solid rgba(115,244,243,.48);background:linear-gradient(135deg,rgba(3,23,39,.94),rgba(7,66,82,.9));backdrop-filter:blur(16px);box-shadow:0 18px 45px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.04);overflow:hidden;transition:.25s}
.music-player:hover{border-color:var(--cyan);transform:translateY(-2px)}
.music-toggle{position:static;width:100%;display:grid;grid-template-columns:38px 1fr 38px;align-items:center;gap:12px;padding:14px 15px 10px;border:0;background:transparent;color:white;border-radius:0;box-shadow:none;backdrop-filter:none;text-align:left}
.music-toggle:hover{transform:none;border-color:transparent}
.music-icon{width:36px;height:36px;border-radius:5px;font-size:17px;box-shadow:0 0 0 1px rgba(255,255,255,.18)}
.music-copy{display:flex;flex-direction:column;gap:3px;min-width:0}
.music-copy strong{font-size:10px;letter-spacing:1.7px}
.music-copy small{font-size:8px;letter-spacing:1.3px;color:#8fbfc6}
.music-player.playing .music-copy small{color:var(--cyan)}
.music-status{height:26px;display:flex;align-items:flex-end;justify-content:center;gap:3px}
.music-status i{display:block;width:3px;height:7px;background:#527c85}
.music-player.playing .music-status i{background:var(--cyan);animation:audioBar .8s ease-in-out infinite alternate}
.music-player.playing .music-status i:nth-child(2){animation-delay:.22s;height:16px}
.music-player.playing .music-status i:nth-child(3){animation-delay:.44s;height:11px}
@keyframes audioBar{from{height:5px;opacity:.55}to{height:23px;opacity:1}}
.volume-control{display:grid;grid-template-columns:auto 1fr 34px;align-items:center;gap:10px;padding:9px 15px 13px;border-top:1px solid rgba(115,244,243,.18);font-size:7px;font-weight:800;letter-spacing:1.4px;color:#9ac0c6}
.volume-control input{appearance:none;width:100%;height:3px;background:linear-gradient(90deg,var(--aqua),rgba(126,195,202,.25));outline:none;cursor:pointer}
.volume-control input::-webkit-slider-thumb{appearance:none;width:12px;height:12px;border-radius:2px;background:white;border:2px solid var(--aqua);box-shadow:0 0 10px rgba(32,220,231,.5)}
.volume-control input::-moz-range-thumb{width:9px;height:9px;border-radius:2px;background:white;border:2px solid var(--aqua)}
.volume-control output{text-align:right;color:white;font-size:8px}
.music-player.blocked .music-icon{background:#ffb45e}
.music-player.blocked .music-copy small{color:#ffcc91}
@media(max-width:900px){.hero-title-text{white-space:normal}}
@media(max-width:620px){.hero-title-text{font-size:clamp(54px,16.5vw,84px)}.music-player{right:10px;bottom:10px;width:230px}.music-toggle{display:grid;padding:11px 12px 8px}.music-label{display:block}.volume-control{padding:8px 12px 11px}}

/* ===== V10 STUDIO STORE ===== */
.studio-store{background:linear-gradient(180deg,#031d31,#052d43);color:white}
.store-lead{max-width:760px;margin:20px auto 0;color:#bcdce1;line-height:1.75}
.studio-edition-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;max-width:1260px;margin:65px auto 0}
.studio-edition-card{background:#061f33;border:1px solid rgba(75,227,231,.35);box-shadow:0 25px 60px rgba(0,0,0,.3);position:relative;overflow:hidden}
.featured-pack{border:2px solid #2ddde3;transform:translateY(-12px)}
.pack-art-wrap{aspect-ratio:2/3;position:relative;overflow:hidden;background:#02111e}
.pack-art-wrap img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .55s ease}
.studio-edition-card:hover .pack-art-wrap img{transform:scale(1.025)}
.early-badge{position:absolute;left:20px;top:20px;background:#22d8df;color:#031a2a;font-size:10px;font-weight:900;letter-spacing:1.5px;padding:10px 14px}
.recommended-ribbon{position:absolute;z-index:3;right:-62px;top:31px;width:240px;transform:rotate(42deg);text-align:center;background:#ffdf75;color:#051b2c;padding:8px;font-size:9px;font-weight:900}
.pack-card-body{padding:32px}
.pack-tier{font-size:10px;letter-spacing:2.4px;color:#37dfe5;font-weight:900}
.pack-card-body h3{font-family:Anton;font-size:44px;line-height:1;margin:8px 0 15px}
.pack-card-body>p{color:#a9cbd2;line-height:1.65}
.pack-price{font-family:Anton;font-size:48px;color:#35dce2;margin:25px 0}
.pack-price small{display:block;font:800 9px Manrope;letter-spacing:1.5px;color:#7fa4ad}
.pack-card-body ul{list-style:none;padding:0;margin:20px 0 30px}
.pack-card-body li{padding:12px 0 12px 26px;border-bottom:1px solid rgba(129,204,210,.14);position:relative;font-size:13px}
.pack-card-body li:before{content:"◆";position:absolute;left:0;color:#25d9df}
.pack-actions{display:grid;gap:13px}
.gift-link{text-align:center;color:#7feef1;font-size:11px;font-weight:900;letter-spacing:1px;text-decoration:none;border:1px solid rgba(72,221,227,.35);padding:14px}
.early-access-notice{max-width:1000px;margin:55px auto 0;padding:25px 30px;border-left:4px solid #2bdce1;background:rgba(3,25,42,.65)}
.early-access-notice b{font-size:11px;letter-spacing:1.5px;color:#61edf0}
.early-access-notice p{font-size:12px;color:#a8c7cd;line-height:1.6;margin-bottom:0}

/* Product pages */
.product-page-v10{background:#031a2c;color:white}
.product-floating-header{position:fixed}
.v10-product-hero{min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr;padding-top:0;background:#031a2c}
.v10-pack-visual{min-height:860px;background:#02111e;display:grid;place-items:center;overflow:hidden}
.v10-pack-visual img{width:100%;height:100%;object-fit:cover}
.v10-product-summary{padding:150px 7vw 80px;display:flex;flex-direction:column;justify-content:center;background:linear-gradient(145deg,#041b2e,#062d42)}
.v10-product-summary h1{font-size:clamp(78px,8vw,132px);text-shadow:none;color:white}
.v10-product-summary h1 span{color:#31dbe1}
.v10-summary{font-size:16px;line-height:1.75;color:#abcbd1;max-width:620px}
.v10-price{font-family:Anton;font-size:62px;color:#35dce2;margin:25px 0}
.v10-price small{display:block;font:800 9px Manrope;letter-spacing:1.7px;color:#789da6}
.purchase-type-tabs{display:grid;grid-template-columns:1fr 1fr;margin-top:15px}
.purchase-type{padding:14px;background:#061f33;color:#8eafb7;border:1px solid #315666;font-weight:900;font-size:10px;letter-spacing:1px;cursor:pointer}
.purchase-type.active{background:#27d8df;color:#032033;border-color:#27d8df}
.purchase-flow{border:1px solid #315869;background:rgba(5,38,57,.75);padding:23px;margin-top:0}
.account-required{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding-bottom:18px;border-bottom:1px solid rgba(117,180,188,.25)}
.account-mark{width:50px;height:50px;border-radius:50%;background:#16ced5;overflow:hidden}
.account-mark img{width:100%;height:100%;object-fit:cover}
.account-required b{font-size:10px;letter-spacing:1px}
.account-required p{font-size:10px;color:#8dacb4;margin:5px 0 0}
.mini-account-button{padding:11px 14px;background:transparent;border:1px solid #3edce1;color:#64eef2;font-size:9px;font-weight:900}
.gift-fields{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin:20px 0}
.gift-fields label{font-size:9px;letter-spacing:1px;color:#84a9b1;font-weight:900}
.gift-fields label:nth-child(3),.gift-fields>p{grid-column:1/-1}
.gift-fields input,.gift-fields textarea{display:block;width:100%;margin-top:7px;padding:13px;background:#031a29;border:1px solid #315a68;color:white;font:inherit}
.gift-fields textarea{min-height:85px;resize:vertical}
.gift-fields>p{font-size:10px;color:#789ba4}
.early-confirm{display:flex;gap:11px;font-size:10px;line-height:1.5;color:#bad2d7;margin:18px 0}
.checkout-main{width:100%;padding:17px;background:#2ad9df;border:2px solid #001a28;color:#021c2d;box-shadow:5px 5px 0 #00101c;font-weight:900;cursor:pointer}
.checkout-small{text-align:center;font-size:9px;color:#789aa2}
.payment-methods{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:16px}
.payment-methods span{background:white;color:#102b3b;border-radius:4px;padding:6px 9px;font-size:8px;font-weight:900}
.what-included,.pack-comparison{padding:100px 7vw;background:#051f33}
.benefit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1200px;margin:55px auto 0}
.benefit-tile{padding:28px;background:#082b41;border:1px solid rgba(60,215,220,.3);min-height:210px}
.benefit-tile>span{font-family:Anton;font-size:34px;color:#28dbe1}
.benefit-tile h3{font-size:18px}
.benefit-tile p{font-size:12px;line-height:1.65;color:#9ebdc4}
.pack-comparison{background:#031a2b}
.compare-table{max-width:1050px;margin:55px auto 0;border:1px solid #28515f}
.compare-row{display:grid;grid-template-columns:2fr 1fr 1fr;border-bottom:1px solid #254854}
.compare-row>*{padding:17px;text-align:center}
.compare-row>*:first-child{text-align:left}
.compare-head{background:#092e44;color:#58e9ec;font-size:10px;font-weight:900}
.compare-row b{font-size:11px;color:#d3eff1;border-left:1px solid #254854}
.product-faq-v10{padding:100px 7vw;background:#051e31;display:grid;grid-template-columns:.8fr 1.2fr;gap:70px}
.product-faq-v10 details{padding:20px 0;border-top:1px solid rgba(65,212,218,.3)}
.product-faq-v10 summary{font-weight:900;cursor:pointer}
.product-faq-v10 p{color:#9ebec5;line-height:1.7}

/* Music player v10 */
.music-player{position:fixed;right:18px;bottom:18px;z-index:90;width:270px;display:grid;grid-template-columns:50px 1fr;column-gap:12px;padding:13px 15px;background:rgba(3,34,52,.94);border:1px solid #36dce1;box-shadow:0 12px 35px rgba(0,0,0,.35);backdrop-filter:blur(12px)}
.music-toggle{grid-row:1/3;width:48px;height:48px;border:0;border-radius:6px;background:#27dbe1;color:#032033;font-size:22px;font-weight:900;cursor:pointer}
.player-icon{display:none}
.music-player[data-state="playing"] .pause-icon{display:inline}
.music-player[data-state="paused"] .play-icon{display:inline}
.music-copy{display:flex;justify-content:space-between;align-items:center}
.music-copy b{font-size:10px;letter-spacing:1.5px}
.music-copy span{font-size:8px;color:#60edf0;letter-spacing:1px}
.volume-row{grid-column:2;display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center}
.volume-row label,.volume-row output{font-size:7px;letter-spacing:1px}
.music-volume{width:100%;accent-color:#2bdce2}

@media(max-width:950px){
 .studio-edition-grid,.v10-product-hero,.product-faq-v10{grid-template-columns:1fr}
 .featured-pack{transform:none}
 .v10-pack-visual{min-height:700px}
 .v10-product-summary{padding-top:90px}
 .benefit-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:600px){
 .studio-edition-grid{gap:25px}
 .pack-card-body{padding:24px}
 .v10-pack-visual{min-height:520px}
 .v10-product-summary{padding:95px 22px 60px}
 .gift-fields,.benefit-grid{grid-template-columns:1fr}
 .gift-fields label:nth-child(3),.gift-fields>p{grid-column:auto}
 .compare-row{grid-template-columns:1.5fr .8fr .8fr;font-size:10px}
 .music-player{width:245px;right:10px;bottom:10px}
}


/* =========================================================
   V15 PREMIUM STORE — COMPACT HOME CARDS + PRODUCT PAGES
   ========================================================= */

/* Compact and cinematic homepage edition area */
.studio-store{
  position:relative;
  overflow:hidden;
  padding:105px 6vw 120px;
  background:
    linear-gradient(180deg,rgba(2,20,35,.9),rgba(3,30,47,.96)),
    url("/assets/images/hero/hero-knockverse.png") center 48%/cover fixed;
}
.studio-store:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 22% 35%,rgba(35,222,227,.16),transparent 36%),
    radial-gradient(circle at 78% 40%,rgba(255,128,108,.12),transparent 34%);
  pointer-events:none;
}
.studio-store>*{position:relative;z-index:1}
.studio-edition-grid{
  grid-template-columns:repeat(2,minmax(0,430px));
  justify-content:center;
  gap:28px;
  max-width:960px;
  margin-top:52px;
}
.studio-edition-card{
  border-radius:14px;
  overflow:hidden;
  background:rgba(3,29,46,.92);
  border:1px solid rgba(63,222,227,.44);
  box-shadow:0 28px 70px rgba(0,0,0,.42);
  backdrop-filter:blur(12px);
}
.featured-pack{transform:none}
.pack-art-wrap{
  aspect-ratio:4/5;
  max-height:500px;
  background:#020d17;
}
.pack-art-wrap img{
  object-fit:cover;
  object-position:center top;
}
.pack-card-body{padding:25px 26px 28px}
.pack-tier{margin:0}
.pack-card-body h3{font-size:35px;margin:8px 0 10px}
.pack-card-body>p{font-size:12px;line-height:1.58;margin:0}
.pack-price{font-size:40px;margin:18px 0}
.pack-card-body ul{margin:12px 0 22px}
.pack-card-body li{font-size:11px;padding:9px 0 9px 22px}
.pack-actions{grid-template-columns:1fr;gap:10px}
.edition-button{padding:14px}
.gift-link{padding:12px}
.early-access-notice{
  max-width:900px;
  margin-top:42px;
  border-radius:8px;
}

/* Product page cinematic stage */
.premium-product-page{
  margin:0;
  min-height:100%;
  background:#031a2c;
  color:white;
}
.premium-product-stage{
  position:relative;
  min-height:100vh;
  padding:118px 5vw 70px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.product-backdrop{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(1,14,26,.94),rgba(2,28,44,.62) 44%,rgba(1,16,28,.88)),
    url("/assets/images/hero/hero-knockverse.png") center/cover;
  transform:scale(1.04);
}
.product-backdrop:after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 30% 45%,rgba(41,220,225,.18),transparent 32%),
    linear-gradient(180deg,transparent 55%,rgba(1,13,23,.92));
}
.back-to-editions{
  position:absolute;
  z-index:2;
  top:105px;
  left:5vw;
  color:#89f2f3;
  text-decoration:none;
  font-size:10px;
  font-weight:900;
  letter-spacing:1.5px;
}
.premium-product-panel{
  position:relative;
  z-index:2;
  width:min(1180px,100%);
  display:grid;
  grid-template-columns:minmax(300px,440px) minmax(420px,1fr);
  gap:38px;
  padding:28px;
  border:1px solid rgba(74,229,233,.45);
  background:rgba(3,25,41,.78);
  box-shadow:0 35px 90px rgba(0,0,0,.5);
  backdrop-filter:blur(18px);
  border-radius:18px;
}
.premium-pack-column{
  display:flex;
  align-items:center;
  justify-content:center;
}
.premium-pack-frame{
  position:relative;
  width:min(100%,380px);
  aspect-ratio:2/3;
  overflow:hidden;
  border-radius:14px;
  border:2px solid #35dce2;
  box-shadow:0 20px 60px rgba(0,0,0,.45),0 0 40px rgba(45,220,225,.18);
  background:#02111e;
}
.premium-pack-frame img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.premium-early-badge{
  position:absolute;
  left:14px;
  bottom:14px;
  padding:9px 12px;
  background:#28dce2;
  color:#031827;
  font-size:8px;
  font-weight:900;
  letter-spacing:1.4px;
}
.premium-purchase-column{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:20px 22px 20px 0;
}
.premium-purchase-column h1{
  font-size:clamp(68px,7vw,112px);
  line-height:.86;
  margin:10px 0 18px;
  text-shadow:none;
}
.premium-purchase-column h1 span{color:#31dce2}
.premium-intro{
  max-width:640px;
  color:#b4d0d5;
  line-height:1.7;
  font-size:14px;
}
.premium-price{
  font-family:Anton;
  font-size:52px;
  color:#35dce2;
  margin:20px 0;
}
.premium-price small{
  display:block;
  margin-top:5px;
  font:800 8px Manrope;
  letter-spacing:1.5px;
  color:#7fa4ad;
}
.premium-flow{
  border-radius:10px;
  background:rgba(4,34,53,.78);
}
.premium-included{
  padding:100px 7vw;
  background:linear-gradient(180deg,#041d31,#072d43);
}
.premium-benefits-grid{
  max-width:1120px;
  margin:55px auto 0;
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
}
.premium-benefit{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:18px;
  padding:24px;
  border:1px solid rgba(55,218,223,.3);
  background:rgba(7,43,65,.82);
}
.premium-benefit>span{
  font-family:Anton;
  font-size:34px;
  color:#35dce2;
}
.premium-benefit h3{margin:0 0 7px}
.premium-benefit p{
  margin:0;
  font-size:12px;
  line-height:1.65;
  color:#9ebec5;
}
.premium-comparison{background:#021726}
.premium-faq{background:linear-gradient(145deg,#051e31,#063249)}

@media(max-width:980px){
  .premium-product-panel{
    grid-template-columns:1fr;
    max-width:760px;
  }
  .premium-pack-frame{width:min(340px,78vw)}
  .premium-purchase-column{padding:5px 12px 18px}
  .back-to-editions{top:95px}
}
@media(max-width:700px){
  .studio-edition-grid{grid-template-columns:1fr;max-width:430px}
  .pack-art-wrap{max-height:none}
  .premium-product-stage{padding:105px 16px 55px}
  .premium-product-panel{padding:16px;gap:22px}
  .premium-purchase-column h1{font-size:62px}
  .premium-benefits-grid{grid-template-columns:1fr}
  .purchase-type-tabs{grid-template-columns:1fr}
}


/* =========================================================
   V17 — RESTORED HERO, COMPACT PREMIUM STORE, CLEAN AUDIO UI
   ========================================================= */

/* Exact uploaded image as the homepage background */
.hero-v6 .hero-image{
  background-image:url("/assets/images/hero/hero-knockverse.png") !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  opacity:1 !important;
}
.hero-v6 .hero-overlay{
  background:
    linear-gradient(90deg,rgba(1,15,27,.91) 0%,rgba(1,18,31,.67) 36%,rgba(1,17,29,.18) 69%,rgba(1,17,29,.08) 100%),
    linear-gradient(0deg,rgba(1,14,25,.72),transparent 43%) !important;
}

/* Premium compact Early Access section */
.studio-store{
  padding:92px 5vw 104px !important;
  background:
    linear-gradient(180deg,rgba(2,17,30,.76),rgba(2,27,43,.96)),
    url("/assets/images/hero/hero-knockverse.png") center/cover fixed !important;
}
.studio-store .section-heading{
  max-width:820px;
  margin-inline:auto;
}
.studio-store .section-heading h2{
  font-size:clamp(54px,5.7vw,88px);
}
.studio-edition-grid{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:24px !important;
  max-width:1240px !important;
  margin:48px auto 0 !important;
}
.studio-edition-card{
  display:grid !important;
  grid-template-columns:minmax(190px,42%) 1fr !important;
  min-height:390px !important;
  border-radius:16px !important;
  overflow:hidden !important;
  background:linear-gradient(145deg,rgba(4,34,52,.97),rgba(3,23,39,.97)) !important;
  border:1px solid rgba(59,224,229,.42) !important;
  box-shadow:0 26px 68px rgba(0,0,0,.42) !important;
}
.studio-edition-card.featured-pack{
  transform:none !important;
  border-color:#31dce2 !important;
  box-shadow:0 26px 74px rgba(0,0,0,.46),0 0 0 1px rgba(49,220,226,.18) !important;
}
.pack-art-wrap{
  height:100% !important;
  max-height:none !important;
  min-height:390px !important;
  aspect-ratio:auto !important;
  display:grid !important;
  place-items:center !important;
  padding:13px !important;
  background:linear-gradient(180deg,#020d17,#031827) !important;
  border-right:1px solid rgba(63,221,226,.26);
}
.pack-art-wrap img{
  width:100% !important;
  height:100% !important;
  max-height:365px !important;
  object-fit:contain !important;
  object-position:center !important;
  border-radius:9px;
}
.pack-card-body{
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  min-width:0;
  padding:28px 28px 25px !important;
}
.pack-card-body h3{
  font-size:clamp(30px,2.35vw,42px) !important;
  margin:7px 0 10px !important;
}
.pack-card-body>p{
  font-size:12px !important;
  line-height:1.55 !important;
}
.pack-price{
  font-size:41px !important;
  margin:17px 0 12px !important;
}
.pack-card-body ul{
  margin:5px 0 20px !important;
}
.pack-card-body li{
  font-size:10px !important;
  padding:7px 0 7px 20px !important;
}
.pack-card-body li:nth-child(n+4){
  display:none;
}
.pack-actions{
  margin-top:auto;
  display:grid !important;
  grid-template-columns:1fr auto !important;
  align-items:stretch;
  gap:10px !important;
}
.pack-actions .edition-button{
  display:grid;
  place-items:center;
  padding:13px 15px !important;
  border-radius:5px;
}
.pack-actions .gift-link{
  display:grid;
  place-items:center;
  width:48px;
  padding:0 !important;
  overflow:hidden;
  font-size:0 !important;
  border-radius:5px;
}
.pack-actions .gift-link::before{
  content:"🎁";
  font-size:18px;
}
.early-badge{
  top:17px !important;
  left:17px !important;
  font-size:8px !important;
  padding:8px 11px !important;
}
.recommended-ribbon{
  font-size:7px !important;
}
.early-access-notice{
  max-width:850px !important;
  margin:36px auto 0 !important;
  padding:20px 24px !important;
}

/* New isolated audio component — no legacy selector conflicts */
.kv-audio-player{
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:999;
  width:285px;
  min-height:82px;
  display:grid;
  grid-template-columns:52px 1fr;
  gap:12px;
  align-items:center;
  padding:13px;
  border:1px solid rgba(77,229,233,.64);
  border-radius:10px;
  background:linear-gradient(145deg,rgba(2,26,43,.97),rgba(5,56,70,.96));
  box-shadow:0 18px 48px rgba(0,0,0,.42);
  backdrop-filter:blur(15px);
  color:#fff;
}
.kv-audio-toggle{
  width:52px;
  height:52px;
  border:1px solid rgba(255,255,255,.17);
  border-radius:8px;
  display:grid;
  place-items:center;
  background:linear-gradient(145deg,#27dce2,#19bfc8);
  color:#042237;
  font-family:Manrope,sans-serif;
  font-size:20px;
  font-weight:900;
  cursor:pointer;
  transition:transform .2s,filter .2s;
}
.kv-audio-toggle:hover{
  transform:translateY(-1px);
  filter:brightness(1.08);
}
.kv-audio-play,
.kv-audio-pause{display:none}
.kv-audio-player[data-state="playing"] .kv-audio-pause{display:block}
.kv-audio-player[data-state="paused"] .kv-audio-play{display:block}
.kv-audio-info{
  min-width:0;
  display:grid;
  gap:11px;
}
.kv-audio-heading{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
}
.kv-audio-heading b{
  font-size:9px;
  letter-spacing:1.8px;
  white-space:nowrap;
}
.kv-audio-status{
  font-size:7px;
  letter-spacing:1px;
  color:#65eef1;
  text-align:right;
}
.kv-volume-control{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:8px;
}
.kv-volume-control>span,
.kv-audio-percent{
  font-size:6px;
  letter-spacing:.8px;
  color:#b8dce0;
}
.kv-audio-volume{
  min-width:0;
  width:100%;
  height:3px;
  accent-color:#31dce2;
  cursor:pointer;
}

@media(max-width:1080px){
  .studio-edition-grid{
    grid-template-columns:1fr !important;
    max-width:720px !important;
  }
}
@media(max-width:680px){
  .hero-v6 .hero-image{
    background-position:63% center !important;
  }
  .studio-store{
    padding-inline:18px !important;
  }
  .studio-edition-card{
    grid-template-columns:1fr !important;
  }
  .pack-art-wrap{
    min-height:300px !important;
    border-right:0;
    border-bottom:1px solid rgba(63,221,226,.26);
  }
  .pack-art-wrap img{
    max-height:285px !important;
  }
  .pack-actions{
    grid-template-columns:1fr 48px !important;
  }
  .kv-audio-player{
    right:10px;
    bottom:10px;
    width:min(285px,calc(100vw - 20px));
  }
}


/* =========================================================
   V18 — STABLE AUTH MODAL AND CROSS-PAGE AUDIO PLAYER
   ========================================================= */

body.kv-modal-open{
  overflow:hidden !important;
}

/* Reset legacy modal rules completely */
#modal.modal{
  position:fixed !important;
  inset:0 !important;
  z-index:5000 !important;
  display:none !important;
  place-items:center !important;
  padding:24px !important;
  overflow:auto !important;
  background:rgba(0,12,23,.82) !important;
  backdrop-filter:blur(12px) !important;
}

#modal.modal.open{
  display:grid !important;
}

#modal .modal-card{
  position:relative !important;
  width:min(940px,calc(100vw - 48px)) !important;
  max-height:min(760px,calc(100vh - 48px)) !important;
  padding:0 !important;
  margin:auto !important;
  overflow:auto !important;
  border:1px solid rgba(59,225,231,.62) !important;
  border-radius:20px !important;
  background:#041d30 !important;
  box-shadow:
    0 35px 100px rgba(0,0,0,.65),
    0 0 55px rgba(37,220,226,.12) !important;
}

#modal .modal-close{
  position:absolute !important;
  top:14px !important;
  right:16px !important;
  z-index:20 !important;
  width:40px !important;
  height:40px !important;
  display:grid !important;
  place-items:center !important;
  padding:0 !important;
  border:1px solid rgba(255,255,255,.22) !important;
  border-radius:50% !important;
  background:rgba(2,24,39,.78) !important;
  color:#fff !important;
  font-size:25px !important;
  line-height:1 !important;
  cursor:pointer !important;
}

#modal-content{
  width:100% !important;
}

.kv-auth-shell{
  display:grid !important;
  grid-template-columns:minmax(300px,42%) minmax(380px,58%) !important;
  min-height:600px !important;
}

.kv-auth-mascot{
  position:relative !important;
  min-height:600px !important;
  overflow:hidden !important;
  background:
    radial-gradient(circle at 50% 35%,rgba(47,220,225,.22),transparent 38%),
    linear-gradient(150deg,#063852,#031827 72%) !important;
}

.kv-auth-mascot::after{
  content:"" !important;
  position:absolute !important;
  inset:auto 0 0 !important;
  height:34% !important;
  background:linear-gradient(transparent,rgba(2,19,31,.9)) !important;
}

.kv-auth-mascot img{
  position:absolute !important;
  right:-15% !important;
  bottom:-2% !important;
  width:125% !important;
  height:92% !important;
  object-fit:contain !important;
  object-position:center bottom !important;
  transform:none !important;
  filter:drop-shadow(0 22px 30px rgba(0,0,0,.45)) !important;
}

.kv-auth-content{
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  padding:55px 52px 44px !important;
  background:
    linear-gradient(145deg,rgba(6,46,68,.98),rgba(3,27,44,.99)) !important;
}

.kv-auth-kicker{
  margin:0 0 8px !important;
  color:#51e9ec !important;
  font-size:10px !important;
  font-weight:900 !important;
  letter-spacing:2.5px !important;
}

.kv-auth-content h2{
  margin:0 !important;
  color:#fff !important;
  font-family:Anton,sans-serif !important;
  font-size:clamp(50px,5vw,72px) !important;
  line-height:.95 !important;
  text-align:left !important;
}

.kv-auth-subtitle{
  margin:13px 0 22px !important;
  max-width:480px !important;
  color:#a9c9cf !important;
  font-size:12px !important;
  line-height:1.6 !important;
}

.kv-auth-tabs{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:5px !important;
  padding:4px !important;
  margin-bottom:15px !important;
  border:1px solid rgba(67,209,215,.25) !important;
  border-radius:9px !important;
  background:#031725 !important;
}

.kv-auth-tabs button{
  padding:11px !important;
  border:0 !important;
  border-radius:6px !important;
  background:transparent !important;
  color:#82a8b0 !important;
  font:800 10px Manrope,sans-serif !important;
  letter-spacing:1px !important;
  cursor:pointer !important;
}

.kv-auth-tabs button.active{
  background:#126177 !important;
  color:#fff !important;
}

.kv-auth-socials{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:10px !important;
}

.kv-auth-socials button{
  min-height:44px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:9px !important;
  padding:10px !important;
  border:1px solid rgba(75,196,203,.34) !important;
  border-radius:8px !important;
  background:#082f44 !important;
  color:#fff !important;
  font:700 11px Manrope,sans-serif !important;
  cursor:pointer !important;
}

.kv-auth-socials button:hover{
  border-color:#3bdde2 !important;
  background:#0b4058 !important;
}

.kv-auth-socials button span{
  min-width:18px !important;
  color:#4ee5e9 !important;
  font-size:15px !important;
}

.kv-auth-divider{
  display:flex !important;
  align-items:center !important;
  gap:13px !important;
  margin:19px 0 !important;
  color:#6e969f !important;
  font-size:7px !important;
  font-weight:800 !important;
  letter-spacing:1px !important;
}

.kv-auth-divider::before,
.kv-auth-divider::after{
  content:"" !important;
  flex:1 !important;
  height:1px !important;
  background:rgba(74,176,184,.24) !important;
}

#kv-auth-form{
  display:grid !important;
  gap:12px !important;
  margin:0 !important;
}

#kv-auth-form label{
  display:grid !important;
  gap:6px !important;
  color:#89aeb6 !important;
  font-size:8px !important;
  font-weight:900 !important;
  letter-spacing:1px !important;
}

#kv-auth-form input{
  width:100% !important;
  min-height:45px !important;
  padding:12px 13px !important;
  border:1px solid rgba(69,181,190,.34) !important;
  border-radius:8px !important;
  outline:0 !important;
  background:#031725 !important;
  color:#fff !important;
  font:500 12px Manrope,sans-serif !important;
}

#kv-auth-form input:focus{
  border-color:#37dce1 !important;
  box-shadow:0 0 0 3px rgba(55,220,225,.1) !important;
}

.kv-auth-submit{
  min-height:47px !important;
  margin-top:3px !important;
  border:2px solid #001923 !important;
  border-radius:7px !important;
  background:#32dce2 !important;
  color:#032033 !important;
  box-shadow:4px 4px 0 #00131f !important;
  font:900 11px Manrope,sans-serif !important;
  letter-spacing:1px !important;
  cursor:pointer !important;
}

.kv-auth-message{
  min-height:17px !important;
  margin:11px 0 0 !important;
  text-align:center !important;
  color:#a8c9ce !important;
  font-size:10px !important;
}

.kv-auth-message.error{color:#ff9c8d !important}
.kv-auth-message.success{color:#69e9c9 !important}

.kv-auth-config-note{
  margin:3px 0 0 !important;
  text-align:center !important;
  color:#668b94 !important;
  font-size:8px !important;
  line-height:1.45 !important;
}

/* Audio component: fixed geometry and no legacy inheritance */
.kv-audio-player{
  position:fixed !important;
  right:18px !important;
  bottom:18px !important;
  z-index:2000 !important;
  width:300px !important;
  min-height:78px !important;
  display:grid !important;
  grid-template-columns:52px minmax(0,1fr) !important;
  gap:12px !important;
  align-items:center !important;
  padding:12px !important;
  overflow:hidden !important;
  border:1px solid rgba(66,224,229,.68) !important;
  border-radius:11px !important;
  background:linear-gradient(145deg,rgba(3,31,48,.98),rgba(5,58,72,.98)) !important;
  box-shadow:0 18px 50px rgba(0,0,0,.48) !important;
  color:#fff !important;
  transform:none !important;
}

.kv-audio-toggle{
  position:static !important;
  width:52px !important;
  height:52px !important;
  min-width:52px !important;
  display:grid !important;
  place-items:center !important;
  padding:0 !important;
  border:1px solid rgba(255,255,255,.18) !important;
  border-radius:8px !important;
  background:linear-gradient(145deg,#31dce2,#1bc4cd) !important;
  box-shadow:none !important;
  color:#032133 !important;
  font:900 20px Manrope,sans-serif !important;
  cursor:pointer !important;
  transform:none !important;
}

.kv-audio-info{
  min-width:0 !important;
  display:grid !important;
  gap:11px !important;
}

.kv-audio-heading{
  min-width:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:8px !important;
}

.kv-audio-heading b{
  overflow:hidden !important;
  color:#fff !important;
  font-size:9px !important;
  letter-spacing:1.5px !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}

.kv-audio-status{
  flex-shrink:0 !important;
  color:#65edf0 !important;
  font-size:7px !important;
  letter-spacing:.8px !important;
  white-space:nowrap !important;
}

.kv-volume-control{
  min-width:0 !important;
  display:grid !important;
  grid-template-columns:auto minmax(60px,1fr) 25px !important;
  align-items:center !important;
  gap:8px !important;
}

.kv-volume-control>span,
.kv-audio-percent{
  margin:0 !important;
  color:#b0d3d8 !important;
  font-size:6px !important;
  letter-spacing:.7px !important;
  white-space:nowrap !important;
}

.kv-audio-volume{
  appearance:auto !important;
  width:100% !important;
  min-width:0 !important;
  height:4px !important;
  margin:0 !important;
  padding:0 !important;
  accent-color:#35dce2 !important;
  cursor:pointer !important;
}

.kv-audio-play,
.kv-audio-pause{
  display:none !important;
}

.kv-audio-player[data-state="playing"] .kv-audio-pause{
  display:block !important;
}

.kv-audio-player[data-state="paused"] .kv-audio-play{
  display:block !important;
}

@media(max-width:760px){
  #modal.modal{
    padding:10px !important;
    align-items:start !important;
  }

  #modal .modal-card{
    width:100% !important;
    max-height:calc(100vh - 20px) !important;
    border-radius:14px !important;
  }

  .kv-auth-shell{
    grid-template-columns:1fr !important;
    min-height:0 !important;
  }

  .kv-auth-mascot{
    min-height:150px !important;
    height:150px !important;
  }

  .kv-auth-mascot img{
    right:50% !important;
    bottom:-50px !important;
    width:230px !important;
    height:230px !important;
    transform:translateX(50%) !important;
  }

  .kv-auth-content{
    padding:34px 22px 28px !important;
  }

  .kv-auth-content h2{
    font-size:48px !important;
  }

  .kv-auth-socials{
    grid-template-columns:1fr 1fr !important;
  }

  .kv-audio-player{
    right:10px !important;
    bottom:10px !important;
    width:min(300px,calc(100vw - 20px)) !important;
  }
}

@media(max-width:430px){
  .kv-auth-socials{
    grid-template-columns:1fr !important;
  }
}


/* =========================================================
   V19 — WHITE BRANDING, LEGAL PAGES, SUPPORT CENTER
   ========================================================= */

.nav-wordmark img{
  width:150px !important;
  height:48px !important;
  object-fit:contain !important;
  object-position:left center !important;
  filter:none !important;
}

.kv-site-footer{
  position:relative;
  padding:80px 24px 62px;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 0,rgba(41,218,224,.09),transparent 38%),
    #020f1b;
  border-top:1px solid rgba(70,216,222,.2);
}

.kv-footer-inner{
  width:min(900px,100%);
  margin:auto;
  text-align:center;
}

.kv-footer-logo{
  display:inline-block;
}

.kv-footer-logo img{
  width:min(360px,80vw);
  height:130px;
  object-fit:contain;
}

.kv-footer-tagline{
  margin:8px 0 27px;
  color:#39dce2;
  font-family:Anton,sans-serif;
  font-size:clamp(25px,3vw,38px);
  letter-spacing:1px;
}

.kv-footer-links{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:18px 30px;
  margin-bottom:31px;
}

.kv-footer-links a{
  color:#fff;
  font-size:10px;
  font-weight:800;
  letter-spacing:1px;
  text-decoration:none;
}

.kv-footer-links a:hover{
  color:#4ae7eb;
}

.kv-footer-legal{
  max-width:760px;
  margin:auto;
  color:#62838d;
  font-size:8px;
  line-height:1.65;
}

/* Legal pages */
.kv-legal-page,
.kv-support-page{
  background:#031a2b;
  color:#fff;
}

.kv-legal-main{
  min-height:100vh;
  padding:150px 6vw 100px;
  background:
    linear-gradient(180deg,rgba(2,20,34,.78),#031a2b 510px),
    url("/assets/images/hero/hero-knockverse.png") center top/cover no-repeat;
}

.kv-legal-hero{
  width:min(1050px,100%);
  margin:0 auto 48px;
}

.kv-legal-hero h1{
  margin:10px 0 19px;
  font-family:Anton,sans-serif;
  font-size:clamp(66px,8vw,122px);
  line-height:.9;
}

.kv-legal-hero>p:not(.eyebrow){
  max-width:760px;
  color:#bdd3d7;
  line-height:1.75;
}

.kv-legal-hero small{
  display:block;
  margin-top:18px;
  color:#6f949d;
  font-size:9px;
  letter-spacing:1px;
}

.kv-legal-document{
  width:min(1050px,100%);
  margin:auto;
  padding:45px 50px;
  border:1px solid rgba(61,213,219,.27);
  border-radius:15px;
  background:rgba(3,29,47,.94);
  box-shadow:0 25px 65px rgba(0,0,0,.28);
}

.kv-legal-section{
  padding:29px 0;
  border-bottom:1px solid rgba(91,170,179,.18);
}

.kv-legal-section:last-child{border-bottom:0}

.kv-legal-section h2{
  margin:0 0 12px;
  color:#3bdce2;
  font-size:21px;
}

.kv-legal-section p,
.kv-legal-section li{
  color:#a9c5ca;
  font-size:12px;
  line-height:1.8;
}

.kv-legal-section a{
  color:#54e8eb;
}

/* Support center */
.kv-support-main{
  min-height:100vh;
  padding:145px 6vw 100px;
  background:
    linear-gradient(180deg,rgba(1,15,27,.68),#031a2b 650px),
    url("/assets/images/hero/hero-knockverse.png") center top/cover no-repeat;
}

.kv-support-hero{
  width:min(1180px,100%);
  margin:0 auto 42px;
  display:grid;
  grid-template-columns:1fr 390px;
  gap:35px;
  align-items:end;
}

.kv-support-hero h1{
  margin:9px 0 18px;
  font-family:Anton,sans-serif;
  font-size:clamp(70px,8vw,120px);
  line-height:.88;
}

.kv-support-hero h1 span{color:#36dce2}

.kv-support-hero>div:first-child>p:not(.eyebrow){
  max-width:700px;
  color:#b4ccd1;
  line-height:1.7;
}

.kv-support-status{
  display:grid;
  grid-template-columns:64px 1fr auto;
  align-items:center;
  gap:14px;
  padding:18px;
  border:1px solid rgba(68,218,223,.4);
  border-radius:12px;
  background:rgba(3,31,49,.9);
}

.kv-support-status img{
  width:64px;
  height:64px;
  border-radius:50%;
  object-fit:cover;
  background:#31dce2;
}

.kv-support-status b,
.kv-support-status span{
  display:block;
}

.kv-support-status b{
  font-size:9px;
  letter-spacing:1px;
}

.kv-support-status span{
  margin-top:5px;
  color:#89abb2;
  font-size:9px;
  line-height:1.4;
}

.kv-support-status button{
  padding:11px 14px;
  border:1px solid #37dce2;
  border-radius:6px;
  background:transparent;
  color:#6cebee;
  font-size:9px;
  font-weight:900;
  cursor:pointer;
}

.kv-support-panel{
  width:min(1180px,100%);
  margin:auto;
  display:grid;
  grid-template-columns:270px 1fr;
  overflow:hidden;
  border:1px solid rgba(64,215,220,.35);
  border-radius:16px;
  background:rgba(3,28,45,.95);
  box-shadow:0 30px 80px rgba(0,0,0,.35);
}

.kv-support-sidebar{
  padding:30px 22px;
  background:#041827;
  border-right:1px solid rgba(67,190,198,.22);
}

.kv-support-sidebar button{
  width:100%;
  padding:14px 15px;
  margin-top:8px;
  border:1px solid transparent;
  border-radius:7px;
  background:transparent;
  color:#8eafb6;
  text-align:left;
  font:700 11px Manrope,sans-serif;
  cursor:pointer;
}

.kv-support-sidebar button:hover,
.kv-support-sidebar button.active{
  border-color:rgba(54,220,226,.32);
  background:#0a3850;
  color:#fff;
}

.kv-support-form{
  display:grid;
  gap:17px;
  padding:38px 42px 42px;
}

.kv-support-form-heading h2{
  margin:5px 0 7px;
  font-family:Anton,sans-serif;
  font-size:48px;
}

.kv-support-form-heading>p:not(.eyebrow){
  color:#8eafb6;
  font-size:11px;
}

.kv-form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}

.kv-support-form label{
  display:grid;
  gap:7px;
  color:#8fafb6;
  font-size:8px;
  font-weight:900;
  letter-spacing:1px;
}

.kv-support-form label span{color:#557b84}

.kv-support-form input,
.kv-support-form select,
.kv-support-form textarea{
  width:100%;
  padding:13px 14px;
  border:1px solid rgba(73,180,188,.34);
  border-radius:8px;
  outline:0;
  background:#031725;
  color:#fff;
  font:500 12px Manrope,sans-serif;
}

.kv-support-form input:focus,
.kv-support-form select:focus,
.kv-support-form textarea:focus{
  border-color:#36dce2;
  box-shadow:0 0 0 3px rgba(54,220,226,.09);
}

.kv-support-form textarea{
  min-height:160px;
  resize:vertical;
}

.kv-support-consent{
  grid-template-columns:auto 1fr !important;
  align-items:start;
  line-height:1.6;
  text-transform:none;
  letter-spacing:0 !important;
}

.kv-support-consent input{
  width:auto;
  margin-top:2px;
}

.kv-support-submit{
  min-height:50px;
  border:2px solid #001520;
  border-radius:7px;
  background:#32dce2;
  color:#031d2d;
  box-shadow:5px 5px 0 #00101b;
  font:900 11px Manrope,sans-serif;
  letter-spacing:1px;
  cursor:pointer;
}

.kv-support-message{
  min-height:18px;
  margin:0;
  text-align:center;
  color:#9dbbc1;
  font-size:10px;
}

.kv-support-message.success{color:#68e7c7}

@media(max-width:850px){
  .kv-support-hero,
  .kv-support-panel{
    grid-template-columns:1fr;
  }

  .kv-support-status{
    grid-template-columns:55px 1fr auto;
  }

  .kv-support-sidebar{
    border-right:0;
    border-bottom:1px solid rgba(67,190,198,.22);
  }

  .kv-form-grid{
    grid-template-columns:1fr;
  }
}

@media(max-width:600px){
  .nav-wordmark img{
    width:118px !important;
  }

  .kv-footer-logo img{
    height:90px;
  }

  .kv-legal-main,
  .kv-support-main{
    padding:115px 16px 70px;
  }

  .kv-legal-document{
    padding:25px 22px;
  }

  .kv-support-status{
    grid-template-columns:52px 1fr;
  }

  .kv-support-status button{
    grid-column:1/-1;
  }

  .kv-support-form{
    padding:27px 19px 31px;
  }
}


/* =========================================================
   V20 — ROTATING CHICKEN AUDIO PLAYER
   ========================================================= */

@keyframes kvChickenSpin{
  from{transform:rotate(0deg)}
  to{transform:rotate(360deg)}
}

.kv-audio-player{
  width:320px !important;
  min-height:84px !important;
  grid-template-columns:60px minmax(0,1fr) !important;
  gap:13px !important;
  padding:11px 13px !important;
}

.kv-audio-mascot{
  width:58px !important;
  height:58px !important;
  display:grid !important;
  place-items:center !important;
  overflow:hidden !important;
  border:2px solid rgba(75,231,235,.8) !important;
  border-radius:50% !important;
  background:
    radial-gradient(circle at 35% 30%,rgba(255,255,255,.26),transparent 30%),
    linear-gradient(145deg,#28dce2,#0a7e92) !important;
  box-shadow:
    0 0 0 4px rgba(42,220,226,.09),
    0 10px 24px rgba(0,0,0,.28) !important;
}

.kv-audio-mascot img{
  width:118% !important;
  height:118% !important;
  object-fit:contain !important;
  transform-origin:center !important;
  filter:drop-shadow(0 4px 5px rgba(0,0,0,.3)) !important;
}

.kv-audio-player[data-state="playing"] .kv-audio-mascot img{
  animation:kvChickenSpin 5s linear infinite !important;
}

.kv-audio-player[data-state="paused"] .kv-audio-mascot img{
  animation-play-state:paused !important;
}

.kv-audio-info{
  gap:12px !important;
}

.kv-audio-heading{
  display:grid !important;
  grid-template-columns:1fr 42px !important;
  align-items:center !important;
  gap:10px !important;
}

.kv-audio-heading b{
  font-size:9px !important;
  letter-spacing:1.8px !important;
}

.kv-audio-toggle{
  position:static !important;
  width:42px !important;
  height:34px !important;
  min-width:42px !important;
  border:1px solid rgba(255,255,255,.24) !important;
  border-radius:8px !important;
  display:grid !important;
  place-items:center !important;
  padding:0 !important;
  background:linear-gradient(145deg,#32dce2,#16aab7) !important;
  color:#022338 !important;
  font:900 14px Manrope,sans-serif !important;
  cursor:pointer !important;
  transition:transform .18s ease,filter .18s ease !important;
}

.kv-audio-toggle:hover{
  transform:translateY(-1px) !important;
  filter:brightness(1.1) !important;
}

.kv-audio-play,
.kv-audio-pause{
  display:none !important;
  line-height:1 !important;
}

.kv-audio-player[data-state="playing"] .kv-audio-pause{
  display:block !important;
}

.kv-audio-player[data-state="paused"] .kv-audio-play{
  display:block !important;
}

.kv-volume-control{
  grid-template-columns:auto minmax(90px,1fr) 27px !important;
}

@media(max-width:480px){
  .kv-audio-player{
    width:min(320px,calc(100vw - 20px)) !important;
    grid-template-columns:54px minmax(0,1fr) !important;
  }

  .kv-audio-mascot{
    width:52px !important;
    height:52px !important;
  }
}


/* =========================================================
   V21 — PREMIUM TYPOGRAPHY + THEMED AUDIO VOLUME BAR
   ========================================================= */

:root{
  --kv-font-display:"Barlow Condensed",sans-serif;
  --kv-font-body:"Sora",sans-serif;
}

/* Premium typography across the complete website */
html,
body{
  font-family:var(--kv-font-body) !important;
  font-feature-settings:"kern" 1,"liga" 1;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

h1,
h2,
h3,
h4,
h5,
h6,
.hero-title,
.hero-v6 h1,
.section-heading h2,
.pack-card-body h3,
.premium-purchase-column h1,
.kv-auth-content h2,
.kv-footer-tagline,
.kv-legal-hero h1,
.kv-support-hero h1,
.kv-support-form-heading h2,
.price,
.pack-price,
.premium-price,
.edition-price,
.rank,
.benefit-tile > span,
.premium-benefit > span{
  font-family:var(--kv-font-display) !important;
  font-weight:900 !important;
  letter-spacing:.01em;
}

button,
input,
select,
textarea,
nav,
a,
summary,
label,
small,
p,
li,
span{
  font-family:var(--kv-font-body);
}

.floating-header nav a,
.floating-header nav button,
.nav-store,
.button,
.edition-button,
.gift-link,
.checkout-main,
.kv-support-submit,
.kv-auth-submit{
  font-weight:700 !important;
  letter-spacing:.08em !important;
}

/* Audio player title refinement */
.kv-audio-heading{
  grid-template-columns:minmax(0,1fr) 42px !important;
}

.kv-audio-heading b{
  font-family:var(--kv-font-body) !important;
  font-size:8px !important;
  font-weight:800 !important;
  letter-spacing:1.15px !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}

/* Aqua themed slider track */
.kv-volume-control{
  grid-template-columns:auto minmax(105px,1fr) 28px !important;
}

.kv-audio-volume{
  --kv-volume-fill:9%;
  appearance:none !important;
  -webkit-appearance:none !important;
  width:100% !important;
  height:16px !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  outline:0 !important;
  background:transparent !important;
  cursor:pointer !important;
}

/* Chromium / Safari track */
.kv-audio-volume::-webkit-slider-runnable-track{
  width:100%;
  height:6px;
  border:1px solid rgba(90,239,242,.45);
  border-radius:999px;
  background:
    linear-gradient(
      90deg,
      #2ae0e5 0%,
      #2ae0e5 var(--kv-volume-fill),
      rgba(103,183,192,.22) var(--kv-volume-fill),
      rgba(103,183,192,.22) 100%
    );
  box-shadow:
    inset 0 1px 3px rgba(0,0,0,.45),
    0 0 9px rgba(42,224,229,.13);
}

/* Chromium / Safari thumb */
.kv-audio-volume::-webkit-slider-thumb{
  -webkit-appearance:none;
  appearance:none;
  width:16px;
  height:16px;
  margin-top:-6px;
  border:2px solid #d9ffff;
  border-radius:50%;
  background:
    radial-gradient(circle at 35% 30%,#fff 0 13%,#53edf0 17%,#18aebc 70%);
  box-shadow:
    0 0 0 4px rgba(42,224,229,.14),
    0 0 12px rgba(42,224,229,.75);
  transition:transform .16s ease,box-shadow .16s ease;
}

.kv-audio-volume:hover::-webkit-slider-thumb{
  transform:scale(1.13);
  box-shadow:
    0 0 0 5px rgba(42,224,229,.19),
    0 0 16px rgba(42,224,229,.95);
}

/* Firefox track */
.kv-audio-volume::-moz-range-track{
  width:100%;
  height:6px;
  border:1px solid rgba(90,239,242,.45);
  border-radius:999px;
  background:rgba(103,183,192,.22);
  box-shadow:inset 0 1px 3px rgba(0,0,0,.45);
}

.kv-audio-volume::-moz-range-progress{
  height:6px;
  border-radius:999px;
  background:#2ae0e5;
  box-shadow:0 0 9px rgba(42,224,229,.4);
}

.kv-audio-volume::-moz-range-thumb{
  width:13px;
  height:13px;
  border:2px solid #d9ffff;
  border-radius:50%;
  background:#2ae0e5;
  box-shadow:
    0 0 0 4px rgba(42,224,229,.14),
    0 0 12px rgba(42,224,229,.75);
}

/* Decorative sound-wave line behind the slider */
.kv-volume-control::before{
  content:"";
  position:absolute;
  left:56px;
  right:31px;
  height:1px;
  pointer-events:none;
  opacity:.38;
  background:
    repeating-linear-gradient(
      90deg,
      transparent 0 5px,
      rgba(89,232,237,.8) 5px 7px,
      transparent 7px 11px
    );
}

.kv-volume-control{
  position:relative;
}

/* More premium percentage badge */
.kv-audio-percent{
  display:grid !important;
  place-items:center !important;
  min-width:28px !important;
  height:20px !important;
  border:1px solid rgba(67,224,230,.26) !important;
  border-radius:5px !important;
  background:rgba(0,16,27,.38) !important;
  color:#73f0f2 !important;
  font-size:6px !important;
  font-weight:800 !important;
}

/* Slightly more refined player container */
.kv-audio-player{
  border-color:rgba(72,230,234,.72) !important;
  background:
    linear-gradient(135deg,rgba(2,26,43,.985),rgba(4,66,78,.97)) !important;
  box-shadow:
    0 18px 52px rgba(0,0,0,.5),
    inset 0 1px 0 rgba(255,255,255,.045),
    0 0 24px rgba(43,220,225,.08) !important;
}

@media(max-width:480px){
  .kv-audio-heading b{
    font-size:7px !important;
    letter-spacing:.8px !important;
  }

  .kv-volume-control{
    grid-template-columns:auto minmax(82px,1fr) 28px !important;
  }
}


/* =========================================================
   V22 — PREMIUM EARLY ACCESS EDITION CARDS
   ========================================================= */

@keyframes kvCardShimmer{
  0%{transform:translateX(-145%) skewX(-17deg);opacity:0}
  18%{opacity:.12}
  42%{opacity:.6}
  65%{opacity:.13}
  100%{transform:translateX(245%) skewX(-17deg);opacity:0}
}

@keyframes kvBorderPulse{
  0%,100%{box-shadow:0 26px 68px rgba(0,0,0,.42),0 0 0 rgba(43,225,230,0)}
  50%{box-shadow:0 32px 82px rgba(0,0,0,.5),0 0 32px rgba(43,225,230,.13)}
}

/* More cinematic store section */
.studio-store{
  isolation:isolate;
}

.studio-store::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(2,19,32,.03),rgba(2,15,27,.5)),
    radial-gradient(circle at 50% 45%,rgba(44,222,227,.08),transparent 38%);
}

.studio-store > *{
  position:relative;
  z-index:1;
}

/* Refined card silhouette */
.studio-edition-card{
  position:relative !important;
  isolation:isolate !important;
  overflow:hidden !important;
  border:1px solid rgba(54,228,232,.58) !important;
  background:
    linear-gradient(145deg,rgba(5,41,59,.985),rgba(2,23,38,.99)) !important;
  box-shadow:
    0 28px 72px rgba(0,0,0,.46),
    inset 0 1px 0 rgba(255,255,255,.035) !important;
  transition:
    transform .35s cubic-bezier(.2,.7,.2,1),
    border-color .35s ease,
    box-shadow .35s ease !important;
}

.studio-edition-card::before{
  content:"";
  position:absolute;
  z-index:6;
  top:-15%;
  bottom:-15%;
  left:-32%;
  width:22%;
  pointer-events:none;
  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255,255,255,.03) 15%,
      rgba(122,255,255,.55) 50%,
      rgba(255,255,255,.06) 84%,
      transparent
    );
  filter:blur(2px);
  opacity:0;
}

.studio-edition-card::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:5;
  pointer-events:none;
  border-radius:inherit;
  background:
    linear-gradient(115deg,transparent 0 35%,rgba(69,232,237,.035) 49%,transparent 61%),
    radial-gradient(circle at 82% 12%,rgba(91,239,243,.1),transparent 30%);
}

.studio-edition-card:hover{
  transform:translateY(-8px) scale(1.012) !important;
  border-color:#65f1f3 !important;
  animation:kvBorderPulse 2.4s ease-in-out infinite;
}

.studio-edition-card:hover::before{
  animation:kvCardShimmer 1.15s ease-out forwards;
}

/* Stronger Founder distinction */
.studio-edition-card.featured-pack{
  background:
    linear-gradient(145deg,rgba(6,37,57,.99),rgba(3,21,38,.99)) !important;
}

.studio-edition-card.featured-pack::after{
  background:
    linear-gradient(115deg,transparent 0 35%,rgba(255,216,106,.05) 49%,transparent 61%),
    radial-gradient(circle at 86% 11%,rgba(255,216,105,.13),transparent 28%);
}

/* Poster presentation */
.pack-art-wrap{
  position:relative !important;
  z-index:1;
  background:
    radial-gradient(circle at 50% 38%,rgba(45,219,225,.13),transparent 58%),
    linear-gradient(180deg,#02111e,#020d17) !important;
}

.pack-art-wrap::after{
  content:"";
  position:absolute;
  inset:12px;
  pointer-events:none;
  border:1px solid rgba(78,231,235,.16);
  border-radius:10px;
  box-shadow:inset 0 0 28px rgba(29,216,222,.06);
}

.pack-art-wrap img{
  position:relative;
  z-index:1;
  transition:
    transform .55s cubic-bezier(.18,.7,.2,1),
    filter .55s ease !important;
}

.studio-edition-card:hover .pack-art-wrap img{
  transform:scale(1.045) translateY(-3px) !important;
  filter:saturate(1.08) contrast(1.04) brightness(1.03);
}

/* Content hierarchy */
.pack-card-body{
  position:relative;
  z-index:7;
}

.pack-tier{
  display:inline-flex;
  align-items:center;
  gap:8px;
  width:max-content;
  max-width:100%;
  color:#89f5f7 !important;
  font-size:9px !important;
  letter-spacing:2px !important;
}

.pack-tier::before{
  content:"";
  width:18px;
  height:2px;
  border-radius:999px;
  background:#35dce2;
  box-shadow:0 0 9px rgba(53,220,226,.55);
}

.pack-card-body h3{
  text-wrap:balance;
}

.pack-price{
  position:relative;
  width:max-content;
  color:#42e5e9 !important;
  text-shadow:0 0 22px rgba(52,221,227,.15);
}

.pack-price::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-4px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,#39dfe4,transparent);
  opacity:.55;
}

/* Cleaner feature rows */
.pack-card-body li{
  transition:color .22s ease,padding-left .22s ease;
}

.pack-card-body li::before{
  font-size:7px;
  filter:drop-shadow(0 0 4px rgba(52,222,227,.5));
}

.studio-edition-card:hover .pack-card-body li{
  color:#d7f5f6;
  padding-left:23px !important;
}

/* Premium View Edition CTA */
.pack-actions .edition-button{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(199,255,255,.32) !important;
  border-radius:7px !important;
  background:
    linear-gradient(135deg,#36e0e5,#1fc5cf) !important;
  color:#032233 !important;
  box-shadow:
    0 8px 20px rgba(24,199,208,.18),
    inset 0 1px 0 rgba(255,255,255,.42) !important;
  transition:transform .2s ease,filter .2s ease,box-shadow .2s ease;
}

.pack-actions .edition-button::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.5),transparent 65%);
  transform:translateX(-130%);
  transition:transform .55s ease;
}

.pack-actions .edition-button:hover{
  transform:translateY(-2px);
  filter:brightness(1.06);
  box-shadow:
    0 12px 26px rgba(24,199,208,.28),
    inset 0 1px 0 rgba(255,255,255,.52) !important;
}

.pack-actions .edition-button:hover::after{
  transform:translateX(130%);
}

/* Real image-based gift button */
.pack-actions .gift-link{
  width:52px !important;
  min-width:52px !important;
  display:grid !important;
  place-items:center !important;
  padding:6px !important;
  overflow:hidden !important;
  border:1px solid rgba(71,224,230,.42) !important;
  border-radius:7px !important;
  background:
    linear-gradient(145deg,rgba(8,47,67,.96),rgba(3,27,43,.98)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
  transition:
    transform .2s ease,
    border-color .2s ease,
    background .2s ease,
    box-shadow .2s ease;
}

.pack-actions .gift-link::before{
  content:none !important;
}

.pack-actions .gift-link img{
  width:34px !important;
  height:34px !important;
  object-fit:contain !important;
  filter:drop-shadow(0 5px 7px rgba(0,0,0,.3));
  transition:transform .25s cubic-bezier(.2,.75,.2,1);
}

.pack-actions .gift-link span{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

.pack-actions .gift-link:hover{
  transform:translateY(-2px) rotate(-2deg);
  border-color:#70f2f4 !important;
  background:
    linear-gradient(145deg,rgba(12,69,88,.98),rgba(4,35,53,.98)) !important;
  box-shadow:0 9px 22px rgba(0,0,0,.22);
}

.pack-actions .gift-link:hover img{
  transform:scale(1.13) rotate(5deg);
}

/* Notice card integration */
.early-access-notice{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(61,218,224,.2) !important;
  border-left:3px solid #37dce2 !important;
  border-radius:10px !important;
  background:
    linear-gradient(145deg,rgba(5,39,57,.88),rgba(3,25,41,.88)) !important;
  box-shadow:0 18px 48px rgba(0,0,0,.18);
}

.early-access-notice::after{
  content:"";
  position:absolute;
  top:-80%;
  right:-5%;
  width:220px;
  height:220px;
  border-radius:50%;
  background:rgba(49,220,226,.065);
  filter:blur(4px);
}

/* Small tactile mobile adjustments */
@media(max-width:680px){
  .studio-edition-card:hover{
    transform:translateY(-4px) !important;
  }

  .pack-actions .gift-link{
    width:50px !important;
    min-width:50px !important;
  }
}

@media(prefers-reduced-motion:reduce){
  .studio-edition-card,
  .studio-edition-card::before,
  .pack-art-wrap img,
  .edition-button::after,
  .gift-link img{
    animation:none !important;
    transition:none !important;
  }
}


/* =========================================================
   V23 — MOBILE PLAYBACK FIX + COLLAPSIBLE AUDIO DOCK
   ========================================================= */

.kv-audio-dock{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:2500;
  display:flex;
  align-items:center;
  gap:8px;
  max-width:calc(100vw - 20px);
  transition:transform .28s ease;
}

.kv-audio-dock .kv-audio-player{
  position:relative !important;
  right:auto !important;
  bottom:auto !important;
  flex:none;
  transition:
    width .3s ease,
    opacity .2s ease,
    transform .3s ease,
    margin .3s ease,
    padding .3s ease;
}

/* Dedicated collapse/expand button */
.kv-audio-collapse{
  position:relative;
  z-index:4;
  width:48px;
  height:58px;
  flex:0 0 48px;
  display:grid;
  place-items:center;
  padding:7px;
  border:1px solid rgba(72,229,234,.7);
  border-radius:10px;
  background:
    linear-gradient(145deg,rgba(5,50,67,.98),rgba(2,28,44,.99));
  box-shadow:
    0 15px 36px rgba(0,0,0,.4),
    inset 0 1px 0 rgba(255,255,255,.04);
  cursor:pointer;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}

.kv-audio-collapse img{
  width:30px;
  height:30px;
  object-fit:contain;
  pointer-events:none;
  transition:transform .2s ease,filter .2s ease;
}

.kv-audio-collapse:hover img{
  transform:scale(1.08);
  filter:brightness(1.25);
}

.kv-collapse-arrow,
.kv-expand-arrow{
  display:none;
}

.kv-audio-dock[data-collapsed="false"] .kv-collapse-arrow{
  display:block;
}

.kv-audio-dock[data-collapsed="true"] .kv-expand-arrow{
  display:block;
}

/* Collapse the complete player and keep only the arrow visible */
.kv-audio-dock[data-collapsed="true"] .kv-audio-player{
  width:0 !important;
  min-width:0 !important;
  min-height:58px !important;
  padding:0 !important;
  margin-right:-8px !important;
  opacity:0 !important;
  overflow:hidden !important;
  pointer-events:none !important;
  transform:translateX(24px) scale(.92) !important;
  border-width:0 !important;
}

.kv-audio-dock[data-collapsed="true"] .kv-audio-collapse{
  width:58px;
  flex-basis:58px;
  border-radius:12px;
}

/* Reliable touch target for mobile */
.kv-audio-toggle{
  touch-action:manipulation !important;
  -webkit-tap-highlight-color:transparent !important;
  user-select:none !important;
  position:relative !important;
  z-index:10 !important;
  pointer-events:auto !important;
}

.kv-audio-toggle span{
  pointer-events:none !important;
}

.kv-audio-volume{
  touch-action:pan-x !important;
  pointer-events:auto !important;
}

@media(max-width:600px){
  .kv-audio-dock{
    right:10px;
    bottom:10px;
    gap:6px;
  }

  .kv-audio-dock .kv-audio-player{
    width:min(280px,calc(100vw - 78px)) !important;
    min-height:76px !important;
    grid-template-columns:52px minmax(0,1fr) !important;
    padding:10px 11px !important;
  }

  .kv-audio-mascot{
    width:50px !important;
    height:50px !important;
  }

  .kv-audio-heading{
    grid-template-columns:minmax(0,1fr) 46px !important;
  }

  .kv-audio-toggle{
    width:46px !important;
    height:40px !important;
    min-width:46px !important;
  }

  .kv-audio-collapse{
    width:46px;
    height:58px;
    flex-basis:46px;
    padding:6px;
  }

  .kv-audio-collapse img{
    width:28px;
    height:28px;
  }

  .kv-audio-dock[data-collapsed="true"] .kv-audio-player{
    width:0 !important;
    padding:0 !important;
  }
}

@media(max-width:390px){
  .kv-audio-dock .kv-audio-player{
    width:calc(100vw - 72px) !important;
    grid-template-columns:46px minmax(0,1fr) !important;
  }

  .kv-audio-mascot{
    width:44px !important;
    height:44px !important;
  }

  .kv-audio-heading b{
    font-size:6.5px !important;
    letter-spacing:.65px !important;
  }

  .kv-volume-control{
    grid-template-columns:auto minmax(65px,1fr) 27px !important;
  }

  .kv-audio-dock[data-collapsed="true"] .kv-audio-player{
    width:0 !important;
  }
}

@media(prefers-reduced-motion:reduce){
  .kv-audio-dock .kv-audio-player,
  .kv-audio-collapse img{
    transition:none !important;
  }
}


/* =========================================================
   V24 — LEFT ARROW + SLIDE-OUT AUDIO PLAYER
   ========================================================= */

/* Arrow sits on the left side of the audio player. */
.kv-audio-dock{
  right:18px !important;
  bottom:18px !important;
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  gap:7px !important;
  overflow:visible !important;
}

/* Bare arrow only: no frame, no background, no border. */
.kv-audio-collapse{
  order:0 !important;
  position:relative !important;
  z-index:8 !important;
  width:38px !important;
  height:58px !important;
  flex:0 0 38px !important;
  display:grid !important;
  place-items:center !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  outline:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  cursor:pointer !important;
  touch-action:manipulation !important;
  -webkit-tap-highlight-color:transparent !important;
}

.kv-audio-collapse img{
  width:34px !important;
  height:34px !important;
  object-fit:contain !important;
  pointer-events:none !important;
  filter:
    drop-shadow(0 2px 2px rgba(0,0,0,.55))
    drop-shadow(0 0 5px rgba(79,231,235,.16)) !important;
  transition:
    transform .2s ease,
    opacity .2s ease,
    filter .2s ease !important;
}

.kv-audio-collapse:hover img{
  transform:translateX(-2px) scale(1.08) !important;
  filter:
    brightness(1.25)
    drop-shadow(0 2px 2px rgba(0,0,0,.55))
    drop-shadow(0 0 8px rgba(79,231,235,.35)) !important;
}

/* The player remains to the right of the arrow. */
.kv-audio-dock .kv-audio-player{
  order:1 !important;
  position:relative !important;
  right:auto !important;
  bottom:auto !important;
  margin:0 !important;
  transform:translateX(0) !important;
  transform-origin:right center !important;
  transition:
    transform .42s cubic-bezier(.2,.75,.2,1),
    opacity .24s ease,
    visibility .24s ease !important;
}

/* Slide the player to the right, outside the viewport. */
.kv-audio-dock[data-collapsed="true"] .kv-audio-player{
  width:320px !important;
  min-width:320px !important;
  min-height:84px !important;
  margin:0 !important;
  padding:11px 13px !important;
  border-width:1px !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transform:translateX(calc(100% + 34px)) !important;
}

/* Keep only the left arrow visible when collapsed. */
.kv-audio-dock[data-collapsed="true"]{
  right:10px !important;
}

.kv-audio-dock[data-collapsed="true"] .kv-audio-collapse{
  width:42px !important;
  flex-basis:42px !important;
}

.kv-audio-dock[data-collapsed="true"] .kv-audio-collapse:hover img{
  transform:translateX(2px) scale(1.08) !important;
}

/* Right arrow is shown while expanded, left arrow while collapsed. */
.kv-audio-dock[data-collapsed="false"] .kv-collapse-arrow{
  display:block !important;
}

.kv-audio-dock[data-collapsed="false"] .kv-expand-arrow{
  display:none !important;
}

.kv-audio-dock[data-collapsed="true"] .kv-collapse-arrow{
  display:none !important;
}

.kv-audio-dock[data-collapsed="true"] .kv-expand-arrow{
  display:block !important;
}

@media(max-width:600px){
  .kv-audio-dock{
    right:10px !important;
    bottom:10px !important;
    gap:4px !important;
  }

  .kv-audio-collapse{
    width:34px !important;
    height:54px !important;
    flex-basis:34px !important;
  }

  .kv-audio-collapse img{
    width:30px !important;
    height:30px !important;
  }

  .kv-audio-dock .kv-audio-player{
    width:min(280px,calc(100vw - 54px)) !important;
  }

  .kv-audio-dock[data-collapsed="true"] .kv-audio-player{
    width:min(280px,calc(100vw - 54px)) !important;
    min-width:min(280px,calc(100vw - 54px)) !important;
    transform:translateX(calc(100% + 26px)) !important;
  }
}

@media(max-width:390px){
  .kv-audio-dock .kv-audio-player,
  .kv-audio-dock[data-collapsed="true"] .kv-audio-player{
    width:calc(100vw - 50px) !important;
    min-width:calc(100vw - 50px) !important;
  }
}

@media(prefers-reduced-motion:reduce){
  .kv-audio-dock .kv-audio-player{
    transition:none !important;
  }
}


/* =========================================================
   V25 — COLLAPSED ARROW LOCKED TO THE RIGHT EDGE
   ========================================================= */

/* Expanded state: arrow remains directly to the left of the player. */
.kv-audio-dock[data-collapsed="false"]{
  right:18px !important;
  transform:none !important;
}

/* Collapsed state: move the whole dock to the extreme right edge. */
.kv-audio-dock[data-collapsed="true"]{
  right:6px !important;
  width:42px !important;
  max-width:42px !important;
  gap:0 !important;
  justify-content:flex-end !important;
  overflow:visible !important;
}

/* Hide the player outside the viewport without reserving layout space. */
.kv-audio-dock[data-collapsed="true"] .kv-audio-player{
  position:absolute !important;
  right:0 !important;
  left:auto !important;
  width:320px !important;
  min-width:320px !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transform:translateX(calc(100% + 20px)) !important;
}

/* Keep the remaining arrow exactly at the right edge. */
.kv-audio-dock[data-collapsed="true"] .kv-audio-collapse{
  position:relative !important;
  right:0 !important;
  width:42px !important;
  height:58px !important;
  flex:0 0 42px !important;
  margin:0 !important;
}

/* Slightly smoother slide-in / slide-out effect. */
.kv-audio-dock .kv-audio-player{
  transition:
    transform .46s cubic-bezier(.18,.78,.2,1),
    opacity .24s ease,
    visibility .24s ease !important;
}

.kv-audio-collapse img{
  transition:
    transform .26s cubic-bezier(.2,.75,.2,1),
    opacity .2s ease,
    filter .2s ease !important;
}

.kv-audio-dock[data-collapsed="true"] .kv-audio-collapse img{
  transform:rotate(0deg) !important;
}

.kv-audio-dock[data-collapsed="false"] .kv-audio-collapse img{
  transform:rotate(0deg) !important;
}

@media(max-width:600px){
  .kv-audio-dock[data-collapsed="false"]{
    right:10px !important;
  }

  .kv-audio-dock[data-collapsed="true"]{
    right:4px !important;
    width:38px !important;
    max-width:38px !important;
  }

  .kv-audio-dock[data-collapsed="true"] .kv-audio-collapse{
    width:38px !important;
    height:54px !important;
    flex-basis:38px !important;
  }

  .kv-audio-dock[data-collapsed="true"] .kv-audio-player{
    width:min(280px,calc(100vw - 54px)) !important;
    min-width:min(280px,calc(100vw - 54px)) !important;
    transform:translateX(calc(100% + 16px)) !important;
  }
}

@media(max-width:390px){
  .kv-audio-dock[data-collapsed="true"]{
    right:3px !important;
  }

  .kv-audio-dock[data-collapsed="true"] .kv-audio-player{
    width:calc(100vw - 50px) !important;
    min-width:calc(100vw - 50px) !important;
  }
}


/* =========================================================
   V26 — MOBILE AUDIO CONTROLS INTERACTION FIX
   ========================================================= */

.kv-audio-dock{
  pointer-events:auto !important;
  touch-action:manipulation !important;
}

.kv-audio-player{
  pointer-events:auto !important;
  touch-action:manipulation !important;
}

.kv-audio-toggle,
.kv-audio-collapse{
  pointer-events:auto !important;
  touch-action:manipulation !important;
  -webkit-tap-highlight-color:transparent !important;
  user-select:none !important;
  -webkit-user-select:none !important;
  cursor:pointer !important;
}

.kv-audio-toggle *,
.kv-audio-collapse *{
  pointer-events:none !important;
}

.kv-volume-control{
  pointer-events:auto !important;
  position:relative !important;
  z-index:20 !important;
}

.kv-volume-control::before{
  pointer-events:none !important;
  z-index:0 !important;
}

.kv-audio-volume{
  position:relative !important;
  z-index:10 !important;
  pointer-events:auto !important;
  touch-action:none !important;
  cursor:pointer !important;
}

/* Increase actual touch targets on mobile without changing visual appearance too much. */
@media(max-width:600px){
  .kv-audio-toggle{
    min-width:48px !important;
    min-height:44px !important;
  }

  .kv-audio-collapse{
    min-width:42px !important;
    min-height:54px !important;
  }

  .kv-audio-volume{
    height:28px !important;
  }

  .kv-audio-volume::-webkit-slider-runnable-track{
    height:7px !important;
  }

  .kv-audio-volume::-webkit-slider-thumb{
    width:20px !important;
    height:20px !important;
    margin-top:-7px !important;
  }

  .kv-audio-volume::-moz-range-track,
  .kv-audio-volume::-moz-range-progress{
    height:7px !important;
  }

  .kv-audio-volume::-moz-range-thumb{
    width:17px !important;
    height:17px !important;
  }
}


/* =========================================================
   V27 — NO AUDIO, PREMIUM TYPOGRAPHY, EMPTY LEADERBOARD
   ========================================================= */

:root{
  --kv-display-font:"Archivo Black",sans-serif;
  --kv-body-font:"Plus Jakarta Sans",sans-serif;
}

html,
body{
  font-family:var(--kv-body-font) !important;
  font-feature-settings:"kern" 1,"liga" 1;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

body{
  letter-spacing:-.01em;
}

h1,
h2,
h3,
h4,
h5,
h6,
.hero-title,
.hero-v6 h1,
.section-heading h2,
.pack-card-body h3,
.premium-purchase-column h1,
.kv-auth-content h2,
.kv-footer-tagline,
.kv-legal-hero h1,
.kv-support-hero h1,
.kv-support-form-heading h2,
.pack-price,
.premium-price,
.edition-price,
.rank,
.benefit-tile > span,
.premium-benefit > span{
  font-family:var(--kv-display-font) !important;
  font-weight:400 !important;
  letter-spacing:-.035em !important;
  text-transform:uppercase;
}

p,
li,
label,
input,
select,
textarea,
button,
a,
summary,
small,
span{
  font-family:var(--kv-body-font) !important;
}

p{
  line-height:1.72;
}

.eyebrow,
.pack-tier,
.hero-kicker,
.floating-header nav a,
.floating-header nav button,
.nav-store,
.button,
.edition-button,
.gift-link,
.checkout-main,
.kv-support-submit,
.kv-auth-submit{
  font-family:var(--kv-body-font) !important;
  font-weight:800 !important;
  letter-spacing:.16em !important;
}

.hero-v6 h1,
.section-heading h2{
  text-wrap:balance;
}

.hero-v6 h1{
  line-height:.9 !important;
}

.section-heading h2{
  line-height:.94 !important;
}

.feature-card h3,
.pack-card-body h3,
.premium-benefit h3{
  letter-spacing:-.025em !important;
}

.leaderboard-empty{
  max-width:1050px !important;
  margin:55px auto 0 !important;
  padding:70px 30px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  border:1px solid rgba(59,220,225,.28) !important;
  border-radius:16px !important;
  background:
    radial-gradient(circle at 50% 20%,rgba(47,220,225,.1),transparent 35%),
    linear-gradient(145deg,rgba(6,42,61,.94),rgba(3,24,40,.97)) !important;
  box-shadow:
    0 28px 70px rgba(0,0,0,.3),
    inset 0 1px 0 rgba(255,255,255,.035) !important;
}

.leaderboard-empty-icon{
  width:82px;
  height:82px;
  display:grid;
  place-items:center;
  margin-bottom:22px;
  border:1px solid rgba(67,225,230,.45);
  border-radius:50%;
  background:
    radial-gradient(circle at 35% 30%,rgba(255,255,255,.15),transparent 30%),
    linear-gradient(145deg,#0b6579,#08384e);
  box-shadow:
    0 0 0 8px rgba(54,220,226,.05),
    0 16px 35px rgba(0,0,0,.25);
  font-size:34px;
}

.leaderboard-empty h3{
  margin:9px 0 15px;
  color:#fff;
  font-size:clamp(36px,5vw,66px);
  line-height:.98;
}

.leaderboard-empty > p:not(.eyebrow){
  max-width:660px;
  margin:0;
  color:#9fc1c8;
  font-size:13px;
}

.leaderboard-empty > span{
  margin-top:25px;
  padding:10px 14px;
  border:1px solid rgba(51,220,225,.35);
  border-radius:999px;
  background:rgba(31,202,211,.08);
  color:#5de8eb;
  font-size:8px;
  font-weight:800;
  letter-spacing:.16em;
}

.kv-audio-player,
.kv-audio-dock,
#ambient-music{
  display:none !important;
}

@media(max-width:680px){
  .leaderboard-empty{
    padding:50px 20px !important;
  }

  .leaderboard-empty-icon{
    width:68px;
    height:68px;
    font-size:28px;
  }
}


/* =========================================================
   V28 — REFINED TYPOGRAPHY, EMPTY TABLE, ISLAND VISUAL
   ========================================================= */

:root{
  --kv-display-font:"League Spartan",sans-serif;
  --kv-body-font:"Inter",sans-serif;
}

html,
body{
  font-family:var(--kv-body-font) !important;
  font-feature-settings:"kern" 1,"liga" 1,"calt" 1;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

body{
  letter-spacing:0;
}

p,
li,
label,
input,
select,
textarea,
button,
a,
summary,
small,
span{
  font-family:var(--kv-body-font) !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.hero-title,
.hero-v6 h1,
.section-heading h2,
.pack-card-body h3,
.premium-purchase-column h1,
.kv-auth-content h2,
.kv-footer-tagline,
.kv-legal-hero h1,
.kv-support-hero h1,
.kv-support-form-heading h2,
.pack-price,
.premium-price,
.edition-price,
.rank,
.benefit-tile > span,
.premium-benefit > span{
  font-family:var(--kv-display-font) !important;
  font-weight:900 !important;
  letter-spacing:-.045em !important;
  text-transform:uppercase;
}

.hero-v6 h1{
  font-size:clamp(62px,6.5vw,112px) !important;
  line-height:.87 !important;
  text-shadow:
    0 5px 0 rgba(1,21,35,.72),
    0 18px 38px rgba(0,0,0,.34) !important;
}

.hero-title-text{
  font-family:var(--kv-display-font) !important;
  font-weight:900 !important;
  letter-spacing:-.055em !important;
  line-height:.84 !important;
  text-shadow:
    0 6px 0 #07526b,
    0 18px 40px rgba(0,0,0,.36) !important;
}

.section-heading h2,
.cinematic-copy h2{
  letter-spacing:-.052em !important;
  line-height:.88 !important;
  text-wrap:balance;
}

.section-heading h2 span,
.cinematic-copy h2 span,
.account-copy h2 span,
.kv-support-hero h1 span{
  color:#31dce2;
  text-shadow:0 12px 35px rgba(31,211,218,.12);
}

.feature-showcase article h3{
  font-family:var(--kv-display-font) !important;
  font-weight:800 !important;
  font-size:clamp(19px,1.45vw,27px) !important;
  letter-spacing:-.035em !important;
  line-height:1.06 !important;
}

.feature-showcase article p,
.section-heading > p:not(.eyebrow),
.cinematic-copy > p:not(.eyebrow){
  color:#a8c2c9;
  font-size:13px;
  line-height:1.78;
}

.eyebrow,
.pack-tier,
.hero-kicker,
.floating-header nav a,
.floating-header nav button,
.nav-store,
.button,
.edition-button,
.gift-link,
.checkout-main,
.kv-support-submit,
.kv-auth-submit{
  font-family:var(--kv-body-font) !important;
  font-weight:800 !important;
  letter-spacing:.15em !important;
}

/* Island image block */
.cinematic-block{
  min-height:680px !important;
  display:grid !important;
  grid-template-columns:minmax(0,1.38fr) minmax(430px,.82fr) !important;
  align-items:stretch !important;
  overflow:hidden !important;
  background:
    linear-gradient(145deg,#031927,#062f43) !important;
}

.cinematic-image{
  position:relative !important;
  min-height:680px !important;
  overflow:hidden !important;
  background:#021522 !important;
}

.cinematic-image img{
  width:100% !important;
  height:100% !important;
  display:block !important;
  object-fit:cover !important;
  object-position:center !important;
  transform:scale(1.012);
  filter:saturate(1.03) contrast(1.025);
}

.cinematic-image-shade{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,transparent 54%,rgba(3,27,43,.52) 82%,rgba(3,27,43,.94) 100%),
    linear-gradient(0deg,rgba(1,15,25,.27),transparent 42%);
}

.cinematic-copy{
  position:relative !important;
  z-index:2 !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  padding:80px clamp(44px,6vw,105px) 80px clamp(50px,5vw,90px) !important;
  background:
    radial-gradient(circle at 0 45%,rgba(48,220,226,.08),transparent 40%),
    linear-gradient(145deg,#062d41,#031c2d) !important;
}

.cinematic-copy::before{
  content:"";
  position:absolute;
  left:0;
  top:12%;
  bottom:12%;
  width:1px;
  background:linear-gradient(transparent,#35dce2,transparent);
  opacity:.48;
}

.cinematic-copy h2{
  margin:11px 0 22px !important;
  font-size:clamp(56px,5.2vw,92px) !important;
}

.cinematic-copy > p:last-child{
  max-width:560px;
}

/* Keep the leaderboard table visible, but without fake players. */
.leaderboard-prelaunch{
  max-width:1050px !important;
  margin:54px auto 0 !important;
  overflow:hidden !important;
  border:1px solid rgba(55,209,216,.31) !important;
  border-radius:13px !important;
  background:
    linear-gradient(145deg,rgba(6,43,61,.96),rgba(3,27,44,.98)) !important;
  box-shadow:
    0 28px 70px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.025) !important;
}

.leaderboard-prelaunch .leaderboard-head{
  display:grid !important;
  grid-template-columns:92px 2fr 1fr 1fr 1.25fr !important;
  padding:0 !important;
  border-bottom:1px solid rgba(70,190,198,.24) !important;
  background:rgba(1,18,30,.86) !important;
}

.leaderboard-prelaunch .leaderboard-head span{
  padding:18px 19px !important;
  color:#8daeb5 !important;
  font-size:8px !important;
  font-weight:800 !important;
  letter-spacing:.15em !important;
}

.leaderboard-no-players{
  min-height:270px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:48px 24px;
  text-align:center;
  background:
    radial-gradient(circle at 50% 30%,rgba(51,220,226,.08),transparent 36%);
}

.leaderboard-lock{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  margin-bottom:17px;
  border:1px solid rgba(55,220,225,.38);
  border-radius:50%;
  background:rgba(41,206,215,.07);
  color:#42e1e5;
  font-size:29px;
  box-shadow:0 0 0 7px rgba(46,220,225,.035);
}

.leaderboard-no-players strong{
  font-family:var(--kv-display-font) !important;
  color:#fff;
  font-size:clamp(25px,3vw,40px);
  font-weight:800;
  letter-spacing:-.035em;
}

.leaderboard-no-players p{
  max-width:600px;
  margin:12px 0 20px;
  color:#91b1b8;
  font-size:12px;
  line-height:1.7;
}

.leaderboard-no-players > span{
  padding:9px 13px;
  border:1px solid rgba(55,220,225,.29);
  border-radius:999px;
  background:rgba(46,220,225,.06);
  color:#58e5e8;
  font-size:7px;
  font-weight:800;
  letter-spacing:.15em;
}

@media(max-width:900px){
  .cinematic-block{
    grid-template-columns:1fr !important;
  }

  .cinematic-image{
    min-height:460px !important;
  }

  .cinematic-image-shade{
    background:
      linear-gradient(0deg,rgba(3,27,43,.78),transparent 52%) !important;
  }

  .cinematic-copy{
    padding:65px 7vw 80px !important;
  }

  .cinematic-copy::before{
    top:0;
    left:7vw;
    right:7vw;
    bottom:auto;
    width:auto;
    height:1px;
  }
}

@media(max-width:680px){
  .cinematic-image{
    min-height:330px !important;
  }

  .cinematic-copy h2{
    font-size:48px !important;
  }

  .leaderboard-prelaunch{
    overflow-x:auto !important;
  }

  .leaderboard-prelaunch .leaderboard-head{
    min-width:700px;
  }

  .leaderboard-no-players{
    min-width:700px;
  }
}


/* =========================================================
   V29 — CLASSIC EMPTY LEADERBOARD
   ========================================================= */

.leaderboard-classic-empty{
  max-width:1050px !important;
  margin:55px auto 0 !important;
  overflow:hidden !important;
  border:1px solid rgba(54,205,213,.36) !important;
  border-radius:0 !important;
  background:#07364c !important;
  box-shadow:none !important;
}

.leaderboard-classic-empty .leaderboard-head{
  display:grid !important;
  grid-template-columns:92px 2fr 1fr 1fr 1.25fr !important;
  padding:0 !important;
  border-bottom:1px solid rgba(71,181,190,.3) !important;
  background:#021827 !important;
}

.leaderboard-classic-empty .leaderboard-head span{
  padding:18px 19px !important;
  color:#d6ebee !important;
  font-family:var(--kv-body-font) !important;
  font-size:8px !important;
  font-weight:800 !important;
  letter-spacing:.14em !important;
  text-align:left !important;
}

.leaderboard-empty-body{
  min-height:180px;
  background:#07364c;
}

.leaderboard-empty-row{
  height:60px;
  border-bottom:1px solid rgba(76,164,174,.18);
}

.leaderboard-empty-row:last-child{
  border-bottom:0;
}

@media(max-width:680px){
  .leaderboard-classic-empty{
    overflow-x:auto !important;
  }

  .leaderboard-classic-empty .leaderboard-head,
  .leaderboard-empty-body{
    min-width:700px;
  }
}


/* =========================================================
   V30 — REORDERED WORLD SECTION + PREMIUM NAME RESERVATION
   ========================================================= */

.fighter-name-section{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:120px 6vw 130px;
  background:
    linear-gradient(180deg,rgba(2,20,34,.96),rgba(3,31,47,.99)),
    url("/assets/images/hero/hero-knockverse.png") center/cover fixed;
  color:#fff;
}

.fighter-name-section::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(1,18,31,.97),rgba(1,24,39,.77) 47%,rgba(1,22,37,.92)),
    radial-gradient(circle at 77% 42%,rgba(48,220,226,.13),transparent 32%);
}

.fighter-name-glow{
  position:absolute;
  z-index:-1;
  width:430px;
  height:430px;
  border-radius:50%;
  filter:blur(90px);
  opacity:.16;
  pointer-events:none;
}

.fighter-name-glow-one{
  left:-150px;
  top:20%;
  background:#1acbd4;
}

.fighter-name-glow-two{
  right:-170px;
  bottom:-130px;
  background:#167da1;
}

.fighter-name-heading{
  width:min(1220px,100%);
  margin:0 auto 55px;
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr);
  gap:65px;
  align-items:end;
}

.fighter-name-heading h2{
  margin:10px 0 0;
  font-family:var(--kv-display-font) !important;
  font-size:clamp(64px,7.2vw,116px);
  font-weight:900;
  letter-spacing:-.06em;
  line-height:.82;
}

.fighter-name-heading h2 span{
  color:#34dce2;
  text-shadow:0 18px 45px rgba(47,220,225,.15);
}

.fighter-name-heading > p{
  max-width:530px;
  margin:0 0 7px;
  color:#a7c3c9;
  font-size:14px;
  line-height:1.8;
}

.fighter-name-layout{
  width:min(1220px,100%);
  margin:auto;
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(360px,.88fr);
  gap:28px;
  align-items:stretch;
}

.fighter-name-form-card,
.fighter-pass-preview{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(68,220,225,.38);
  border-radius:18px;
  background:
    linear-gradient(145deg,rgba(6,45,63,.97),rgba(3,25,41,.985));
  box-shadow:
    0 34px 85px rgba(0,0,0,.4),
    inset 0 1px 0 rgba(255,255,255,.035);
}

.fighter-name-form-card{
  padding:38px 40px 36px;
}

.fighter-name-step{
  display:grid;
  grid-template-columns:52px 1fr;
  gap:16px;
  align-items:center;
  margin-bottom:31px;
}

.fighter-name-step > span{
  width:52px;
  height:52px;
  display:grid;
  place-items:center;
  border:1px solid rgba(57,220,226,.42);
  border-radius:50%;
  background:rgba(37,209,217,.08);
  color:#4ce6ea;
  font-weight:800;
  font-size:11px;
  letter-spacing:.1em;
}

.fighter-name-step b{
  display:block;
  font-size:12px;
  letter-spacing:.11em;
}

.fighter-name-step p{
  margin:6px 0 0;
  color:#87aab2;
  font-size:10px;
}

#fighter-name-form{
  display:grid;
  gap:13px;
}

#fighter-name-form > label{
  color:#9dbac1;
  font-size:8px;
  font-weight:800;
  letter-spacing:.15em;
}

.fighter-name-input-wrap{
  position:relative;
}

.fighter-name-input-wrap input{
  width:100%;
  min-height:65px;
  padding:17px 82px 17px 19px;
  border:1px solid rgba(74,197,204,.44);
  border-radius:10px;
  outline:0;
  background:#031725;
  color:#fff;
  font-family:var(--kv-display-font) !important;
  font-size:24px;
  font-weight:700;
  letter-spacing:.025em;
  text-transform:uppercase;
  transition:border-color .2s,box-shadow .2s,background .2s;
}

.fighter-name-input-wrap input:focus{
  border-color:#3bdde2;
  background:#041c2c;
  box-shadow:
    0 0 0 4px rgba(54,220,226,.09),
    0 12px 28px rgba(0,0,0,.2);
}

.fighter-name-input-wrap input::placeholder{
  color:#496f78;
  text-transform:none;
  font-family:var(--kv-body-font) !important;
  font-size:13px;
  font-weight:500;
  letter-spacing:0;
}

.fighter-name-counter{
  position:absolute;
  right:17px;
  top:50%;
  transform:translateY(-50%);
  color:#668d96;
  font-size:9px;
  font-weight:700;
}

.fighter-name-counter b{
  color:#4be4e8;
}

.fighter-name-feedback{
  min-height:44px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 13px;
  border:1px solid rgba(80,161,171,.22);
  border-radius:8px;
  background:rgba(2,22,36,.52);
  color:#799da5;
  font-size:10px;
}

.fighter-name-feedback-icon{
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(83,168,177,.09);
  font-weight:900;
}

.fighter-name-feedback[data-state="valid"]{
  border-color:rgba(81,226,186,.32);
  color:#73e8c2;
}

.fighter-name-feedback[data-state="valid"] .fighter-name-feedback-icon{
  background:rgba(73,224,181,.12);
}

.fighter-name-feedback[data-state="invalid"]{
  border-color:rgba(255,131,111,.35);
  color:#ff9c8d;
}

.fighter-name-feedback[data-state="invalid"] .fighter-name-feedback-icon{
  background:rgba(255,125,106,.12);
}

.fighter-name-submit{
  min-height:55px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  margin-top:4px;
  border:2px solid #001521;
  border-radius:8px;
  background:
    linear-gradient(135deg,#39e0e5,#20c2cd);
  color:#032132;
  box-shadow:
    5px 5px 0 #00101b,
    inset 0 1px 0 rgba(255,255,255,.48);
  font-size:10px;
  font-weight:900;
  letter-spacing:.14em;
  cursor:pointer;
  transition:transform .2s,filter .2s,opacity .2s;
}

.fighter-name-submit:not(:disabled):hover{
  transform:translateY(-2px);
  filter:brightness(1.07);
}

.fighter-name-submit:disabled{
  opacity:.42;
  cursor:not-allowed;
  filter:saturate(.45);
}

.fighter-name-submit > span{
  font-size:17px;
  transition:transform .2s;
}

.fighter-name-submit:not(:disabled):hover > span{
  transform:translateX(4px);
}

.fighter-name-disclaimer{
  margin:1px 0 7px;
  color:#587f88;
  font-size:8px;
  line-height:1.55;
  text-align:center;
}

.fighter-name-benefits{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-top:17px;
}

.fighter-name-benefits article{
  min-height:115px;
  padding:16px;
  border:1px solid rgba(61,176,185,.2);
  border-radius:9px;
  background:rgba(4,31,48,.72);
}

.fighter-name-benefits article > span{
  display:block;
  margin-bottom:11px;
  color:#43e0e5;
  font-family:var(--kv-display-font) !important;
  font-size:20px;
  font-weight:800;
}

.fighter-name-benefits b{
  display:block;
  color:#dff4f5;
  font-size:8px;
  letter-spacing:.08em;
}

.fighter-name-benefits p{
  margin:7px 0 0;
  color:#71939b;
  font-size:8px;
  line-height:1.55;
}

.fighter-pass-preview{
  min-height:590px;
  display:flex;
  flex-direction:column;
  padding:34px;
  transform:perspective(1200px) rotateY(-2deg);
  background:
    radial-gradient(circle at 85% 18%,rgba(50,220,225,.2),transparent 32%),
    linear-gradient(145deg,#0a5269,#062c43 48%,#031827);
}

.fighter-pass-preview::after{
  content:"";
  position:absolute;
  inset:12px;
  pointer-events:none;
  border:1px solid rgba(149,248,250,.18);
  border-radius:12px;
}

.fighter-pass-shine{
  position:absolute;
  top:-25%;
  left:-30%;
  width:36%;
  height:150%;
  transform:rotate(17deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.12),transparent);
  filter:blur(2px);
  animation:fighterPassShine 6s ease-in-out infinite;
}

@keyframes fighterPassShine{
  0%,34%{transform:translateX(-80%) rotate(17deg);opacity:0}
  45%{opacity:.75}
  70%,100%{transform:translateX(420%) rotate(17deg);opacity:0}
}

.fighter-pass-top{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
}

.fighter-pass-top span,
.fighter-pass-top small{
  display:block;
}

.fighter-pass-top span{
  color:#fff;
  font-size:10px;
  font-weight:900;
  letter-spacing:.15em;
}

.fighter-pass-top small{
  margin-top:7px;
  color:#6fdde1;
  font-size:7px;
  letter-spacing:.13em;
}

.fighter-pass-top img{
  width:84px;
  height:84px;
  border:2px solid rgba(191,255,255,.58);
  border-radius:50%;
  object-fit:cover;
  background:#2bdbe1;
  box-shadow:
    0 0 0 7px rgba(44,220,225,.08),
    0 14px 30px rgba(0,0,0,.3);
}

.fighter-pass-main{
  position:relative;
  z-index:2;
  margin:auto 0;
}

.fighter-pass-main p{
  margin:0 0 12px;
  color:#7ab9c2;
  font-size:8px;
  font-weight:800;
  letter-spacing:.18em;
}

.fighter-pass-main strong{
  display:block;
  overflow:hidden;
  color:#fff;
  font-family:var(--kv-display-font) !important;
  font-size:clamp(45px,5vw,78px);
  font-weight:900;
  letter-spacing:-.055em;
  line-height:.9;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-shadow:0 10px 30px rgba(0,0,0,.28);
}

.fighter-pass-main > span{
  display:block;
  margin-top:10px;
  color:#46e4e8;
  font-size:13px;
  font-weight:800;
  letter-spacing:.12em;
}

.fighter-pass-meta{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

.fighter-pass-meta > div{
  padding:14px;
  border:1px solid rgba(104,214,219,.2);
  border-radius:8px;
  background:rgba(1,20,33,.35);
}

.fighter-pass-meta span,
.fighter-pass-meta b{
  display:block;
}

.fighter-pass-meta span{
  color:#65959e;
  font-size:7px;
  font-weight:800;
  letter-spacing:.13em;
}

.fighter-pass-meta b{
  margin-top:7px;
  color:#d9f0f2;
  font-size:9px;
  letter-spacing:.07em;
}

.fighter-pass-footer{
  position:relative;
  z-index:2;
  margin-top:22px;
}

.fighter-pass-footer > span{
  color:#76aeb6;
  font-size:7px;
  font-weight:800;
  letter-spacing:.14em;
}

.fighter-pass-code{
  display:flex;
  gap:5px;
  align-items:flex-end;
  height:39px;
  margin-top:13px;
}

.fighter-pass-code i{
  width:7px;
  background:#8feef0;
  opacity:.65;
}

.fighter-pass-code i:nth-child(1){height:19px}
.fighter-pass-code i:nth-child(2){height:34px}
.fighter-pass-code i:nth-child(3){height:25px}
.fighter-pass-code i:nth-child(4){height:38px}
.fighter-pass-code i:nth-child(5){height:16px}
.fighter-pass-code i:nth-child(6){height:31px}
.fighter-pass-code i:nth-child(7){height:22px}
.fighter-pass-code i:nth-child(8){height:38px}
.fighter-pass-code i:nth-child(9){height:28px}
.fighter-pass-code i:nth-child(10){height:18px}

@media(max-width:980px){
  .fighter-name-heading{
    grid-template-columns:1fr;
    gap:22px;
  }

  .fighter-name-layout{
    grid-template-columns:1fr;
  }

  .fighter-pass-preview{
    min-height:500px;
    transform:none;
  }
}

@media(max-width:680px){
  .fighter-name-section{
    padding:85px 16px 95px;
  }

  .fighter-name-heading{
    margin-bottom:35px;
  }

  .fighter-name-heading h2{
    font-size:55px;
  }

  .fighter-name-form-card,
  .fighter-pass-preview{
    padding:24px 20px;
    border-radius:14px;
  }

  .fighter-name-benefits{
    grid-template-columns:1fr;
  }

  .fighter-name-benefits article{
    min-height:0;
    display:grid;
    grid-template-columns:38px 1fr;
    gap:10px;
  }

  .fighter-name-benefits article > span{
    margin:0;
  }

  .fighter-pass-preview{
    min-height:430px;
  }

  .fighter-pass-main strong{
    font-size:48px;
  }
}

@media(prefers-reduced-motion:reduce){
  .fighter-pass-shine{
    animation:none;
    display:none;
  }
}


/* =========================================================
   V31 — PREMIUM PARADISE FEATURES SECTION
   ========================================================= */

#about{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding-bottom:44px !important;
  background:
    linear-gradient(180deg,#031b2d 0%,#052b3f 58%,#031a2a 100%) !important;
}

#about::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 18%,rgba(48,220,226,.12),transparent 34%),
    linear-gradient(90deg,transparent,rgba(60,220,226,.025),transparent);
}

#about .section-heading{
  margin-bottom:0 !important;
}

#about .section-heading h2{
  max-width:900px;
  margin-inline:auto;
  font-size:clamp(64px,7vw,112px) !important;
  line-height:.84 !important;
}

#about .section-heading > p:not(.eyebrow){
  max-width:780px !important;
  margin-inline:auto !important;
  color:#9fbfc6 !important;
  font-size:13px !important;
  line-height:1.8 !important;
}

.feature-showcase-premium{
  position:relative;
  width:min(1320px,calc(100% - 56px)) !important;
  margin:0 auto 120px !important;
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:18px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
}

.feature-card-premium{
  position:relative;
  isolation:isolate;
  min-height:385px;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  padding:24px 24px 25px;
  border:1px solid rgba(64,218,224,.27);
  border-radius:16px;
  background:
    linear-gradient(145deg,rgba(7,48,67,.97),rgba(3,28,45,.985));
  box-shadow:
    0 24px 65px rgba(0,0,0,.25),
    inset 0 1px 0 rgba(255,255,255,.03);
  transition:
    transform .32s cubic-bezier(.2,.75,.2,1),
    border-color .32s ease,
    box-shadow .32s ease;
}

.feature-card-premium::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  opacity:.5;
  background:
    radial-gradient(circle at 82% 16%,rgba(55,220,226,.18),transparent 27%),
    linear-gradient(140deg,transparent 0 55%,rgba(47,220,225,.035));
}

.feature-card-premium::after{
  content:"";
  position:absolute;
  top:-20%;
  left:-55%;
  z-index:-1;
  width:30%;
  height:150%;
  transform:rotate(18deg);
  opacity:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,transparent,rgba(182,255,255,.34),transparent);
}

.feature-card-premium:hover{
  transform:translateY(-9px);
  border-color:rgba(87,239,243,.72);
  box-shadow:
    0 34px 82px rgba(0,0,0,.38),
    0 0 35px rgba(44,220,225,.11),
    inset 0 1px 0 rgba(255,255,255,.05);
}

.feature-card-premium:hover::after{
  animation:kvFeatureCardSweep .9s ease-out forwards;
}

@keyframes kvFeatureCardSweep{
  from{left:-55%;opacity:0}
  30%{opacity:.55}
  to{left:145%;opacity:0}
}

.feature-card-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:26px;
}

.feature-number{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border:1px solid rgba(71,225,231,.42);
  border-radius:12px;
  background:
    linear-gradient(145deg,rgba(50,219,225,.15),rgba(13,92,108,.17));
  color:#67edf0;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 10px 24px rgba(0,0,0,.18);
}

.feature-label{
  color:#67919a;
  font-size:7px;
  font-weight:800;
  letter-spacing:.14em;
  text-align:right;
}

.feature-icon-wrap{
  width:62px;
  height:62px;
  display:grid;
  place-items:center;
  margin-bottom:28px;
  border:1px solid rgba(70,222,228,.29);
  border-radius:50%;
  background:
    radial-gradient(circle at 35% 30%,rgba(255,255,255,.09),transparent 30%),
    linear-gradient(145deg,rgba(11,87,104,.8),rgba(4,41,58,.92));
  box-shadow:
    0 0 0 7px rgba(47,220,225,.035),
    0 18px 34px rgba(0,0,0,.2);
}

.feature-icon{
  color:#54e7eb;
  font-size:24px;
  font-weight:700;
  text-shadow:0 0 14px rgba(59,222,227,.35);
}

.feature-card-premium h3{
  margin:0 0 16px !important;
  color:#fff !important;
  font-family:var(--kv-display-font) !important;
  font-size:clamp(29px,2.25vw,42px) !important;
  font-weight:900 !important;
  letter-spacing:-.055em !important;
  line-height:.88 !important;
  text-transform:uppercase;
}

.feature-card-premium p{
  margin:0;
  color:#91b2b9 !important;
  font-size:11px !important;
  line-height:1.72 !important;
}

.feature-card-line{
  width:100%;
  height:2px;
  margin-top:auto;
  padding-top:26px;
  background:
    linear-gradient(90deg,#37dce2,rgba(55,220,226,.05)) bottom/100% 2px no-repeat;
  opacity:.55;
}

.feature-card-premium:nth-child(2),
.feature-card-premium:nth-child(4){
  transform:translateY(18px);
}

.feature-card-premium:nth-child(2):hover,
.feature-card-premium:nth-child(4):hover{
  transform:translateY(9px);
}

.feature-ranking::before{
  background:
    radial-gradient(circle at 82% 16%,rgba(255,211,92,.11),transparent 28%),
    linear-gradient(140deg,transparent 0 55%,rgba(255,211,92,.025));
}

.feature-ranking .feature-number{
  border-color:rgba(255,211,101,.34);
  color:#ffe18a;
}

.feature-ranking .feature-icon-wrap{
  border-color:rgba(255,211,101,.22);
  background:
    radial-gradient(circle at 35% 30%,rgba(255,255,255,.08),transparent 30%),
    linear-gradient(145deg,rgba(106,83,17,.6),rgba(44,39,15,.8));
}

.feature-ranking .feature-icon{
  color:#ffe37c;
  text-shadow:0 0 14px rgba(255,218,104,.28);
}

.feature-ranking .feature-card-line{
  background:
    linear-gradient(90deg,#ffe079,rgba(255,224,121,.05)) bottom/100% 2px no-repeat;
}

@media(max-width:1100px){
  .feature-showcase-premium{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    max-width:900px !important;
  }

  .feature-card-premium:nth-child(2),
  .feature-card-premium:nth-child(4){
    transform:none;
  }

  .feature-card-premium:nth-child(2):hover,
  .feature-card-premium:nth-child(4):hover{
    transform:translateY(-9px);
  }
}

@media(max-width:680px){
  .feature-showcase-premium{
    width:calc(100% - 30px) !important;
    grid-template-columns:1fr !important;
    gap:14px !important;
    margin-bottom:80px !important;
  }

  .feature-card-premium{
    min-height:330px;
    padding:22px;
  }

  .feature-card-top{
    margin-bottom:20px;
  }

  .feature-icon-wrap{
    width:56px;
    height:56px;
    margin-bottom:22px;
  }
}

@media(prefers-reduced-motion:reduce){
  .feature-card-premium,
  .feature-card-premium::after{
    animation:none !important;
    transition:none !important;
  }
}


/* =========================================================
   V32 — PREMIUM HALL OF CHAMPIONS LEADERBOARD
   ========================================================= */

#champions{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:120px 5vw 135px !important;
  background:
    linear-gradient(180deg,#031a2b 0%,#062f43 52%,#031b2c 100%) !important;
}

#champions::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 18%,rgba(51,220,226,.11),transparent 34%),
    linear-gradient(90deg,transparent,rgba(55,220,226,.025),transparent);
}

#champions::after{
  content:"";
  position:absolute;
  inset:auto 0 0;
  z-index:-1;
  height:44%;
  pointer-events:none;
  background:
    linear-gradient(180deg,transparent,rgba(1,15,25,.55)),
    repeating-linear-gradient(
      90deg,
      transparent 0 139px,
      rgba(80,220,225,.025) 139px 140px
    );
}

#champions .section-heading{
  margin-bottom:58px !important;
}

#champions .section-heading h2{
  font-size:clamp(66px,7vw,116px) !important;
  line-height:.84 !important;
}

.leaderboard-premium-empty{
  position:relative;
  width:min(1120px,100%);
  margin:0 auto;
  overflow:hidden;
  border:1px solid rgba(67,221,226,.4);
  border-radius:18px;
  background:
    linear-gradient(145deg,rgba(7,49,68,.98),rgba(3,25,41,.99));
  box-shadow:
    0 35px 90px rgba(0,0,0,.42),
    0 0 40px rgba(43,220,225,.07),
    inset 0 1px 0 rgba(255,255,255,.035);
}

.leaderboard-premium-empty::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 85% 10%,rgba(47,220,225,.09),transparent 28%),
    linear-gradient(115deg,transparent 0 46%,rgba(74,225,230,.025) 52%,transparent 60%);
}

.leaderboard-premium-topline{
  height:4px;
  background:
    linear-gradient(90deg,transparent,#31dce2 18%,#66f2f4 50%,#31dce2 82%,transparent);
  box-shadow:0 0 16px rgba(49,220,226,.45);
}

.leaderboard-premium-empty .leaderboard-head{
  position:relative;
  z-index:2;
  display:grid !important;
  grid-template-columns:110px minmax(260px,2fr) 1fr 1fr 1.25fr !important;
  padding:0 !important;
  border-bottom:1px solid rgba(71,192,200,.28) !important;
  background:
    linear-gradient(180deg,rgba(1,20,33,.97),rgba(2,26,41,.97)) !important;
}

.leaderboard-premium-empty .leaderboard-head span{
  padding:20px 22px !important;
  color:#92b8bf !important;
  font-size:8px !important;
  font-weight:800 !important;
  letter-spacing:.16em !important;
  text-align:left !important;
}

.leaderboard-premium-body{
  position:relative;
  z-index:2;
}

.leaderboard-premium-row{
  display:grid;
  grid-template-columns:110px minmax(260px,2fr) 1fr 1fr 1.25fr;
  align-items:center;
  min-height:74px;
  border-bottom:1px solid rgba(75,166,176,.16);
  background:
    linear-gradient(90deg,rgba(9,58,77,.92),rgba(5,42,60,.92));
  transition:
    background .22s ease,
    transform .22s ease;
}

.leaderboard-premium-row:nth-child(even){
  background:
    linear-gradient(90deg,rgba(6,47,65,.94),rgba(4,36,53,.94));
}

.leaderboard-premium-row:last-child{
  border-bottom:0;
}

.leaderboard-premium-row:hover{
  background:
    linear-gradient(90deg,rgba(11,70,89,.98),rgba(5,47,66,.98));
}

.leaderboard-premium-row > span{
  padding:18px 22px;
  color:#769ca5;
  font-size:12px;
  font-weight:600;
}

.rank-slot{
  color:#43e1e5 !important;
  font-family:var(--kv-display-font) !important;
  font-size:22px !important;
  font-weight:800 !important;
}

.player-slot{
  display:flex;
  align-items:center;
  gap:13px;
}

.player-slot i{
  width:34px;
  height:34px;
  flex:0 0 34px;
  border:1px solid rgba(68,220,225,.3);
  border-radius:50%;
  background:
    radial-gradient(circle at 35% 30%,rgba(255,255,255,.08),transparent 30%),
    linear-gradient(145deg,rgba(33,170,181,.18),rgba(4,50,65,.72));
  box-shadow:
    0 0 0 5px rgba(47,220,225,.025);
}

.player-slot b{
  color:#a5c2c8;
  font-size:11px;
  font-weight:600;
  letter-spacing:.02em;
}

.leaderboard-premium-footer{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:17px 20px;
  border-top:1px solid rgba(70,183,192,.19);
  background:rgba(1,20,33,.75);
}

.leaderboard-status-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#39dfe4;
  box-shadow:
    0 0 0 5px rgba(57,223,228,.08),
    0 0 10px rgba(57,223,228,.65);
}

.leaderboard-premium-footer p{
  margin:0;
  color:#6da0a9;
  font-size:7px;
  font-weight:800;
  letter-spacing:.14em;
  text-align:center;
}

@media(max-width:900px){
  .leaderboard-premium-empty{
    overflow-x:auto;
  }

  .leaderboard-premium-empty .leaderboard-head,
  .leaderboard-premium-row{
    min-width:800px;
  }
}

@media(max-width:680px){
  #champions{
    padding:90px 16px 100px !important;
  }

  #champions .section-heading{
    margin-bottom:38px !important;
  }

  .leaderboard-premium-empty{
    border-radius:13px;
  }
}


/* =========================================================
   V33 — PREMIUM STORE REFRESH
   ========================================================= */

@keyframes kvStorePosterShine{
  0%{
    transform:translateX(-170%) skewX(-18deg);
    opacity:0;
  }
  18%{opacity:.08}
  45%{opacity:.58}
  72%{opacity:.1}
  100%{
    transform:translateX(260%) skewX(-18deg);
    opacity:0;
  }
}

@keyframes kvStoreGlowPulse{
  0%,100%{
    opacity:.36;
    transform:scale(.97);
  }
  50%{
    opacity:.72;
    transform:scale(1.035);
  }
}

.studio-store{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:115px 5vw 125px !important;
  background:
    linear-gradient(180deg,rgba(2,20,34,.9),rgba(2,27,44,.98)),
    url("/assets/images/hero/hero-knockverse.png") center/cover fixed !important;
}

.studio-store::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 17%,rgba(53,220,226,.13),transparent 34%),
    radial-gradient(circle at 18% 62%,rgba(37,180,196,.09),transparent 26%),
    radial-gradient(circle at 82% 62%,rgba(255,211,101,.055),transparent 25%);
}

.studio-store .section-heading{
  margin-bottom:58px !important;
}

.studio-store .section-heading h2{
  font-size:clamp(68px,7vw,116px) !important;
  line-height:.84 !important;
}

.studio-store .section-heading > p:not(.eyebrow){
  max-width:760px;
  margin-inline:auto;
  color:#a4c0c7;
  font-size:13px;
  line-height:1.8;
}

.studio-edition-grid{
  width:min(1220px,100%) !important;
  margin:0 auto !important;
  gap:24px !important;
}

.studio-edition-card{
  position:relative !important;
  isolation:isolate !important;
  min-height:455px !important;
  overflow:hidden !important;
  border:1px solid rgba(66,222,227,.42) !important;
  border-radius:18px !important;
  background:
    linear-gradient(145deg,rgba(6,45,63,.99),rgba(3,25,41,.995)) !important;
  box-shadow:
    0 34px 88px rgba(0,0,0,.43),
    0 0 32px rgba(42,220,225,.055),
    inset 0 1px 0 rgba(255,255,255,.035) !important;
  transition:
    transform .34s cubic-bezier(.2,.75,.2,1),
    border-color .34s ease,
    box-shadow .34s ease !important;
}

.studio-edition-card:hover{
  transform:translateY(-9px) scale(1.008) !important;
  border-color:rgba(91,241,244,.78) !important;
  box-shadow:
    0 42px 105px rgba(0,0,0,.52),
    0 0 42px rgba(42,220,225,.12),
    inset 0 1px 0 rgba(255,255,255,.045) !important;
}

.studio-edition-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:4;
  pointer-events:none;
  background:
    linear-gradient(115deg,transparent 0 39%,rgba(66,228,233,.035) 50%,transparent 61%),
    radial-gradient(circle at 88% 10%,rgba(65,228,233,.095),transparent 27%);
}

.studio-edition-card.featured-pack::before{
  background:
    linear-gradient(115deg,transparent 0 39%,rgba(255,216,112,.045) 50%,transparent 61%),
    radial-gradient(circle at 88% 10%,rgba(255,214,104,.12),transparent 27%);
}

.pack-art-wrap{
  position:relative !important;
  isolation:isolate;
  overflow:hidden !important;
  min-height:455px !important;
  padding:14px !important;
  background:
    radial-gradient(circle at 50% 43%,rgba(45,219,225,.12),transparent 54%),
    linear-gradient(180deg,#020f1b,#031725) !important;
}

.pack-art-wrap::after{
  content:"";
  position:absolute;
  inset:11px;
  z-index:4;
  pointer-events:none;
  border:1px solid rgba(76,230,234,.2);
  border-radius:12px;
  box-shadow:
    inset 0 0 34px rgba(40,220,225,.06),
    0 0 25px rgba(35,205,212,.04);
}

.pack-art-wrap img{
  position:relative;
  z-index:2;
  width:100% !important;
  height:100% !important;
  max-height:425px !important;
  object-fit:contain !important;
  border-radius:10px;
  transform:scale(1);
  filter:
    saturate(1.04)
    contrast(1.025)
    drop-shadow(0 18px 24px rgba(0,0,0,.26));
  transition:
    transform .55s cubic-bezier(.18,.75,.2,1),
    filter .55s ease !important;
}

.studio-edition-card:hover .pack-art-wrap img{
  transform:scale(1.045) translateY(-3px);
  filter:
    saturate(1.09)
    contrast(1.045)
    brightness(1.035)
    drop-shadow(0 22px 30px rgba(0,0,0,.34));
}

.pack-art-glow{
  position:absolute;
  z-index:0;
  left:13%;
  right:13%;
  bottom:8%;
  height:34%;
  border-radius:50%;
  background:rgba(41,220,225,.16);
  filter:blur(42px);
  animation:kvStoreGlowPulse 4.8s ease-in-out infinite;
}

.featured-pack .pack-art-glow{
  background:rgba(77,159,255,.15);
}

.pack-art-sheen{
  position:absolute;
  z-index:3;
  top:-10%;
  bottom:-10%;
  left:-36%;
  width:24%;
  pointer-events:none;
  opacity:0;
  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255,255,255,.05) 15%,
      rgba(125,255,255,.64) 50%,
      rgba(255,255,255,.08) 84%,
      transparent
    );
  filter:blur(2px);
}

.studio-edition-card:hover .pack-art-sheen{
  animation:kvStorePosterShine 1.22s ease-out forwards;
}

.pack-card-body{
  position:relative;
  z-index:5;
  padding:32px 30px 28px !important;
}

.pack-store-meta{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-bottom:13px;
}

.pack-store-meta span{
  padding:6px 8px;
  border:1px solid rgba(62,213,220,.23);
  border-radius:999px;
  background:rgba(38,204,212,.055);
  color:#72cbd1;
  font-size:6px;
  font-weight:800;
  letter-spacing:.13em;
}

.pack-tier{
  margin-bottom:8px !important;
}

.pack-card-body h3{
  margin:6px 0 12px !important;
  font-size:clamp(34px,2.7vw,48px) !important;
  line-height:.88 !important;
}

.pack-card-body > p{
  color:#9bb9c0 !important;
  font-size:11px !important;
  line-height:1.72 !important;
}

.pack-price{
  margin:20px 0 5px !important;
  color:#43e2e6 !important;
  font-size:47px !important;
  line-height:.9 !important;
  text-shadow:0 0 24px rgba(56,220,226,.16);
}

.pack-price::after{
  opacity:.72 !important;
}

.pack-card-body ul{
  margin:17px 0 22px !important;
  border-top:1px solid rgba(71,164,174,.16);
}

.pack-card-body li{
  position:relative;
  padding:10px 0 10px 21px !important;
  border-bottom:1px solid rgba(71,164,174,.16);
  color:#b3cdd2 !important;
  font-size:9px !important;
}

.pack-card-body li::before{
  content:"";
  position:absolute;
  left:1px;
  top:50%;
  width:6px;
  height:6px;
  transform:translateY(-50%) rotate(45deg);
  border:1px solid #49e1e5;
  background:rgba(57,220,226,.08);
  box-shadow:0 0 8px rgba(57,220,226,.22);
}

.pack-actions{
  grid-template-columns:1fr 54px !important;
  gap:11px !important;
}

.pack-actions .edition-button{
  min-height:52px;
  font-size:10px !important;
  letter-spacing:.11em !important;
}

.pack-actions .gift-link{
  width:54px !important;
  min-width:54px !important;
  border-color:rgba(76,224,230,.38) !important;
}

.pack-actions .gift-link img{
  width:36px !important;
  height:36px !important;
}

.recommended-ribbon{
  z-index:9 !important;
  padding:10px 38px !important;
  background:linear-gradient(135deg,#ffe48d,#ffc944) !important;
  color:#1e2530 !important;
  box-shadow:0 10px 24px rgba(0,0,0,.22);
}

.early-badge{
  z-index:8 !important;
  padding:8px 12px !important;
  border:1px solid rgba(207,255,255,.26) !important;
  border-radius:5px !important;
  box-shadow:0 9px 20px rgba(0,0,0,.16);
}

.early-access-notice{
  max-width:900px !important;
  margin-top:38px !important;
  padding:22px 25px !important;
  border-radius:12px !important;
  background:
    linear-gradient(145deg,rgba(6,43,61,.92),rgba(3,27,44,.94)) !important;
  box-shadow:
    0 22px 55px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.025);
}

.early-access-notice strong{
  color:#67edf0 !important;
}

@media(max-width:1080px){
  .studio-edition-grid{
    max-width:780px !important;
  }

  .studio-edition-card{
    min-height:430px !important;
  }
}

@media(max-width:680px){
  .studio-store{
    padding:90px 16px 95px !important;
  }

  .studio-edition-card{
    grid-template-columns:1fr !important;
    min-height:0 !important;
  }

  .pack-art-wrap{
    min-height:360px !important;
    border-right:0 !important;
    border-bottom:1px solid rgba(63,221,226,.22);
  }

  .pack-art-wrap img{
    max-height:330px !important;
  }

  .pack-card-body{
    padding:26px 22px 24px !important;
  }

  .pack-actions{
    grid-template-columns:1fr 52px !important;
  }
}

@media(prefers-reduced-motion:reduce){
  .pack-art-glow,
  .pack-art-sheen,
  .studio-edition-card,
  .pack-art-wrap img{
    animation:none !important;
    transition:none !important;
  }
}


/* =========================================================
   V34 — REFINED CLASSIC FEATURES
   ========================================================= */

/* Keep About and Features visually connected as one section. */
#about{
  padding-bottom:0 !important;
  background:#031b2d !important;
}

#about::before,
#about::after{
  content:none !important;
}

#about .section-heading{
  margin-bottom:58px !important;
}

#about .section-heading h2{
  max-width:900px;
  margin-inline:auto;
  font-size:clamp(64px,7vw,112px) !important;
  line-height:.84 !important;
}

#about .section-heading > p:not(.eyebrow){
  max-width:760px !important;
  margin-inline:auto !important;
  color:#a7c0c7 !important;
  font-size:13px !important;
  line-height:1.8 !important;
}

/* Return to the original four-panel layout. */
.feature-showcase-classic-refined{
  width:calc(100% - 8vw) !important;
  max-width:none !important;
  margin:0 auto 0 !important;
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:0 !important;
  padding:0 !important;
  border:1px solid rgba(63,205,213,.28) !important;
  border-bottom:0 !important;
  border-radius:0 !important;
  overflow:hidden !important;
  background:#07364c !important;
}

.feature-classic-block{
  position:relative;
  min-height:260px;
  padding:42px 34px 36px;
  border-right:1px solid rgba(63,205,213,.25);
  background:
    linear-gradient(180deg,rgba(10,66,86,.48),rgba(6,49,69,.75));
  transition:
    background .24s ease,
    transform .24s ease;
}

.feature-classic-block:last-child{
  border-right:0;
}

.feature-classic-block::after{
  content:"";
  position:absolute;
  left:34px;
  right:34px;
  bottom:28px;
  height:1px;
  background:
    linear-gradient(90deg,#2fd8df 0%,rgba(47,216,223,.05) 75%);
  opacity:.38;
  transition:opacity .24s ease;
}

.feature-classic-block:hover{
  background:
    linear-gradient(180deg,rgba(12,76,97,.58),rgba(7,55,75,.85));
}

.feature-classic-block:hover::after{
  opacity:.8;
}

.feature-classic-number{
  display:block;
  margin-bottom:30px;
  color:#2edce3;
  font-family:var(--kv-display-font) !important;
  font-size:31px;
  font-weight:800;
  letter-spacing:-.04em;
  line-height:1;
}

.feature-classic-block h3{
  margin:0 0 20px !important;
  color:#fff !important;
  font-family:var(--kv-display-font) !important;
  font-size:clamp(22px,1.55vw,31px) !important;
  font-weight:800 !important;
  letter-spacing:-.04em !important;
  line-height:1 !important;
}

.feature-classic-block p{
  max-width:300px;
  margin:0;
  color:#a7c2c8 !important;
  font-size:11px !important;
  line-height:1.7 !important;
}

/* Remove all V31 card styling influence. */
.feature-card-premium,
.feature-card-top,
.feature-icon-wrap,
.feature-card-line,
.feature-label{
  all:unset;
}

@media(max-width:1000px){
  .feature-showcase-classic-refined{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  .feature-classic-block:nth-child(2){
    border-right:0;
  }

  .feature-classic-block:nth-child(-n+2){
    border-bottom:1px solid rgba(63,205,213,.25);
  }
}

@media(max-width:620px){
  .feature-showcase-classic-refined{
    width:calc(100% - 30px) !important;
    grid-template-columns:1fr !important;
  }

  .feature-classic-block{
    min-height:220px;
    padding:32px 24px 30px;
    border-right:0 !important;
    border-bottom:1px solid rgba(63,205,213,.25);
  }

  .feature-classic-block:last-child{
    border-bottom:0;
  }

  .feature-classic-block::after{
    left:24px;
    right:24px;
    bottom:23px;
  }
}


/* =========================================================
   V35 — FEATURE COLOR CONTINUITY + SECTION SPACING FIX
   ========================================================= */

/* Keep the whole "Paradise Hits Back" area in one continuous navy tone. */
#about{
  padding-bottom:96px !important;
  background:
    linear-gradient(180deg,#031b2d 0%,#031b2d 100%) !important;
}

#about .section-heading{
  margin-bottom:52px !important;
}

/* Remove the green/teal color break from the feature container. */
.feature-showcase-classic-refined{
  width:calc(100% - 8vw) !important;
  margin:0 auto !important;
  border:1px solid rgba(66,203,211,.24) !important;
  border-radius:10px !important;
  overflow:hidden !important;
  background:#062a3d !important;
  box-shadow:
    0 24px 60px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.018) !important;
}

/* Make all four blocks use the same site navy/aqua palette. */
.feature-classic-block{
  min-height:260px !important;
  padding:42px 34px 38px !important;
  border-right:1px solid rgba(66,203,211,.20) !important;
  background:
    linear-gradient(180deg,rgba(7,48,67,.76),rgba(5,39,57,.92)) !important;
}

.feature-classic-block:hover{
  background:
    linear-gradient(180deg,rgba(8,57,77,.82),rgba(5,44,63,.96)) !important;
}

.feature-classic-block::after{
  bottom:27px !important;
  background:
    linear-gradient(90deg,#2fd8df 0%,rgba(47,216,223,.08) 72%,transparent 100%) !important;
  opacity:.42 !important;
}

.feature-classic-number{
  color:#36dce2 !important;
  text-shadow:0 0 16px rgba(54,220,226,.10);
}

.feature-classic-block h3{
  color:#f7fbfc !important;
}

.feature-classic-block p{
  color:#a8c1c7 !important;
}

/* Add a clean visual gap before the store section. */
.studio-store{
  margin-top:0 !important;
  border-top:1px solid rgba(63,203,211,.10);
}

/* Prevent the store background from visually touching the cards. */
#about + .studio-store{
  padding-top:118px !important;
}

/* Tablet */
@media(max-width:1000px){
  #about{
    padding-bottom:82px !important;
  }

  .feature-classic-block:nth-child(-n+2){
    border-bottom:1px solid rgba(66,203,211,.20) !important;
  }
}

/* Mobile */
@media(max-width:620px){
  #about{
    padding-bottom:70px !important;
  }

  .feature-showcase-classic-refined{
    width:calc(100% - 30px) !important;
    border-radius:9px !important;
  }

  .feature-classic-block{
    min-height:220px !important;
    padding:32px 24px 31px !important;
    border-bottom:1px solid rgba(66,203,211,.20) !important;
  }

  #about + .studio-store{
    padding-top:90px !important;
  }
}


/* =========================================================
   V36 — TRUE UNIFIED ABOUT + FEATURES SECTION
   ========================================================= */

/* One actual section, one actual background, no visual split. */
.about-features-unified{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:112px 0 105px !important;
  margin:0 !important;
  background:#031b2d !important;
  border:0 !important;
}

.about-features-unified::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 18%,rgba(46,220,226,.055),transparent 36%),
    linear-gradient(180deg,#031b2d 0%,#031b2d 100%);
}

.about-features-inner{
  width:100%;
  margin:0 auto;
}

.about-features-unified .section-heading{
  margin:0 auto 54px !important;
  padding:0 6vw !important;
}

.about-features-unified .section-heading h2{
  max-width:900px;
  margin-inline:auto;
}

.about-features-unified .section-heading > p:not(.eyebrow){
  max-width:760px !important;
  margin-inline:auto !important;
}

/* The grid now belongs inside the same section and has no own section background. */
.about-features-unified .feature-showcase-classic-refined{
  width:calc(100% - 8vw) !important;
  margin:0 auto !important;
  padding:0 !important;
  background:#062a3d !important;
  border:1px solid rgba(66,203,211,.24) !important;
  border-radius:10px !important;
  overflow:hidden !important;
  box-shadow:
    0 24px 60px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.018) !important;
}

/* Remove inherited section-like spacing and backgrounds from old rules. */
.about-features-unified #features{
  padding:0 !important;
  border-top:0 !important;
  border-bottom:0 !important;
}

.about-features-unified .feature-classic-block{
  background:
    linear-gradient(180deg,rgba(7,48,67,.76),rgba(5,39,57,.92)) !important;
}

/* Ensure the Store starts only after the complete unified section. */
.about-features-unified + .studio-store{
  margin-top:0 !important;
  padding-top:118px !important;
  border-top:1px solid rgba(63,203,211,.10);
}

/* Neutralize old selectors that treated About and Features as siblings. */
#about + .studio-store{
  padding-top:118px !important;
}

@media(max-width:1000px){
  .about-features-unified{
    padding:96px 0 88px !important;
  }
}

@media(max-width:620px){
  .about-features-unified{
    padding:78px 0 72px !important;
  }

  .about-features-unified .section-heading{
    padding:0 16px !important;
    margin-bottom:38px !important;
  }

  .about-features-unified .feature-showcase-classic-refined{
    width:calc(100% - 30px) !important;
  }

  .about-features-unified + .studio-store,
  #about + .studio-store{
    padding-top:90px !important;
  }
}


/* =========================================================
   V37 — CLEAN SINGLE-BLOCK FIGHTER NAME SECTION
   ========================================================= */

.fighter-name-section-clean{
  position:relative;
  overflow:hidden;
  padding:115px 6vw 125px !important;
  background:#031b2d !important;
  color:#fff;
}

.fighter-name-section-clean::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 75% 28%,rgba(49,220,226,.06),transparent 30%),
    linear-gradient(180deg,#031b2d,#031b2d);
}

.fighter-name-clean-inner{
  position:relative;
  width:min(1180px,100%);
  margin:auto;
}

.fighter-name-clean-heading{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);
  gap:70px;
  align-items:end;
  margin-bottom:48px;
}

.fighter-name-clean-title h2{
  margin:9px 0 0;
  font-family:var(--kv-display-font) !important;
  font-size:clamp(64px,7vw,112px);
  font-weight:900;
  letter-spacing:-.06em;
  line-height:.84;
}

.fighter-name-clean-title h2 span{
  color:#34dce2;
}

.fighter-name-clean-intro{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-end;
  padding-bottom:7px;
}

.fighter-name-clean-intro img{
  width:82px;
  height:82px;
  margin-bottom:20px;
  border:1px solid rgba(74,225,230,.42);
  border-radius:50%;
  object-fit:cover;
  background:#2bdbe1;
  box-shadow:
    0 0 0 7px rgba(44,220,225,.05),
    0 14px 30px rgba(0,0,0,.22);
}

.fighter-name-clean-intro p{
  max-width:520px;
  margin:0;
  color:#a7c2c8;
  font-size:13px;
  line-height:1.78;
}

.fighter-name-unified-card{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);
  overflow:hidden;
  border:1px solid rgba(63,207,214,.3);
  border-radius:14px;
  background:
    linear-gradient(145deg,rgba(6,44,62,.96),rgba(3,28,44,.98));
  box-shadow:
    0 28px 70px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.025);
}

.fighter-name-form-area{
  padding:38px 40px 36px;
  border-right:1px solid rgba(64,201,210,.22);
}

.fighter-name-simple-label{
  display:flex;
  align-items:center;
  gap:16px;
  margin-bottom:28px;
}

.fighter-name-simple-label > span{
  color:#37dce2;
  font-family:var(--kv-display-font) !important;
  font-size:26px;
  font-weight:800;
}

.fighter-name-simple-label b{
  display:block;
  color:#fff;
  font-size:11px;
  letter-spacing:.1em;
}

.fighter-name-simple-label p{
  margin:5px 0 0;
  color:#7f9fa7;
  font-size:9px;
}

.fighter-name-section-clean #fighter-name-form{
  display:grid;
  gap:13px;
}

.fighter-name-section-clean #fighter-name-form > label{
  color:#9bb6bd;
  font-size:8px;
  font-weight:800;
  letter-spacing:.15em;
}

.fighter-name-section-clean .fighter-name-input-wrap input{
  min-height:62px;
  border-radius:8px;
  background:#031725;
}

.fighter-name-section-clean .fighter-name-feedback{
  min-height:42px;
  border-radius:7px;
}

.fighter-name-section-clean .fighter-name-submit{
  min-height:53px;
  border-radius:7px;
}

.fighter-name-section-clean .fighter-name-disclaimer{
  margin:0;
  color:#5f8088;
  font-size:8px;
  text-align:center;
}

.fighter-name-preview-inline{
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  min-height:360px;
  padding:38px 34px;
  background:
    radial-gradient(circle at 80% 18%,rgba(49,220,226,.11),transparent 28%),
    linear-gradient(145deg,rgba(7,54,73,.9),rgba(3,31,47,.96));
}

.fighter-name-preview-inline::before{
  content:"";
  position:absolute;
  left:0;
  top:12%;
  bottom:12%;
  width:1px;
  background:linear-gradient(transparent,#35dce2,transparent);
  opacity:.35;
}

.fighter-name-preview-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.fighter-name-preview-top span,
.fighter-name-preview-top small{
  font-size:7px;
  font-weight:800;
  letter-spacing:.14em;
}

.fighter-name-preview-top span{color:#d9f2f4}
.fighter-name-preview-top small{color:#55e3e7}

.fighter-name-preview-main{
  margin:auto 0;
}

.fighter-name-preview-main strong{
  display:block;
  overflow:hidden;
  color:#fff;
  font-family:var(--kv-display-font) !important;
  font-size:clamp(43px,4.3vw,68px);
  font-weight:900;
  letter-spacing:-.055em;
  line-height:.9;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.fighter-name-preview-main > span{
  display:block;
  margin-top:10px;
  color:#44e2e7;
  font-size:11px;
  font-weight:800;
  letter-spacing:.12em;
}

.fighter-name-preview-bottom{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.fighter-name-preview-bottom > div{
  padding:13px;
  border:1px solid rgba(72,187,196,.21);
  border-radius:7px;
  background:rgba(2,25,39,.34);
}

.fighter-name-preview-bottom span,
.fighter-name-preview-bottom b{
  display:block;
}

.fighter-name-preview-bottom span{
  color:#6f969f;
  font-size:7px;
  font-weight:800;
  letter-spacing:.13em;
}

.fighter-name-preview-bottom b{
  margin-top:6px;
  color:#d6ecef;
  font-size:8px;
  letter-spacing:.07em;
}

/* Remove the old two-card visuals completely. */
.fighter-name-layout,
.fighter-name-form-card,
.fighter-pass-preview,
.fighter-name-benefits,
.fighter-pass-shine,
.fighter-pass-code,
.fighter-pass-meta,
.fighter-pass-footer,
.fighter-pass-top,
.fighter-pass-main{
  display:none !important;
}

@media(max-width:900px){
  .fighter-name-clean-heading{
    grid-template-columns:1fr;
    gap:28px;
  }

  .fighter-name-clean-intro{
    align-items:flex-start;
  }

  .fighter-name-unified-card{
    grid-template-columns:1fr;
  }

  .fighter-name-form-area{
    border-right:0;
    border-bottom:1px solid rgba(64,201,210,.22);
  }

  .fighter-name-preview-inline{
    min-height:280px;
  }

  .fighter-name-preview-inline::before{
    content:none;
  }
}

@media(max-width:620px){
  .fighter-name-section-clean{
    padding:82px 16px 90px !important;
  }

  .fighter-name-clean-title h2{
    font-size:55px;
  }

  .fighter-name-clean-intro img{
    width:70px;
    height:70px;
  }

  .fighter-name-form-area,
  .fighter-name-preview-inline{
    padding:26px 22px;
  }

  .fighter-name-preview-main strong{
    font-size:43px;
  }
}


/* =========================================================
   V45 — CLEAN ACCOUNT MODAL
   One implementation only. No legacy overrides.
   ========================================================= */

body.kv-modal-open{
  overflow:hidden;
}

#modal.modal{
  position:fixed;
  inset:0;
  z-index:9999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(0,12,21,.82);
  backdrop-filter:blur(14px);
}

#modal.modal.open{
  display:flex;
}

#modal .modal-card{
  position:relative;
  width:min(920px,calc(100vw - 48px));
  height:min(560px,calc(100vh - 48px));
  min-height:500px;
  overflow:hidden;
  border:1px solid rgba(63,220,226,.52);
  border-radius:18px;
  background:#052d42;
  box-shadow:0 38px 100px rgba(0,0,0,.56);
}

#modal .modal-close{
  position:absolute;
  top:14px;
  right:14px;
  z-index:20;
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(143,214,220,.3);
  border-radius:50%;
  background:#031b2d;
  color:#fff;
  font-size:23px;
  line-height:1;
  cursor:pointer;
}

#modal #modal-content{
  width:100%;
  height:100%;
  overflow:hidden;
}

/* Desktop */
.kv45-auth-desktop{
  display:grid;
  grid-template-columns:230px minmax(0,1fr);
  width:100%;
  height:100%;
  overflow:hidden;
}

.kv45-auth-avatar-panel{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:26px;
  border-right:1px solid rgba(63,220,226,.18);
  background:
    radial-gradient(circle at 50% 50%,rgba(46,220,226,.10),transparent 48%),
    #031b2d;
}

.kv45-auth-avatar{
  width:160px;
  height:160px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border:1px solid rgba(98,236,240,.62);
  border-radius:50%;
  background:linear-gradient(145deg,#0b687b,#07364d);
  box-shadow:
    0 0 0 10px rgba(47,220,226,.045),
    0 22px 45px rgba(0,0,0,.35);
}

.kv45-auth-avatar img{
  display:block;
  width:138px;
  height:138px;
  max-width:138px;
  max-height:138px;
  object-fit:contain;
  object-position:center;
  filter:drop-shadow(0 11px 15px rgba(0,0,0,.27));
}

.kv45-auth-panel{
  min-width:0;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:26px 38px 24px;
  overflow:hidden;
  background:#052d42;
}

.kv45-auth-panel .kv-auth-kicker{
  margin:0 0 4px;
  color:#50e1e5;
  font-size:8px;
  font-weight:800;
  letter-spacing:.18em;
}

.kv45-auth-panel h2{
  margin:0;
  color:#fff;
  font-size:48px;
  line-height:.88;
}

.kv45-auth-panel .kv-auth-subtitle{
  max-width:560px;
  margin:8px 0 12px;
  color:#9ebbc2;
  font-size:10px;
  line-height:1.5;
}

.kv45-auth-panel .kv-auth-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  min-height:42px;
  margin-bottom:10px;
  padding:4px;
  border:1px solid rgba(65,190,199,.25);
  border-radius:9px;
  background:#031b2d;
}

.kv45-auth-panel .kv-auth-tabs button{
  min-height:34px;
  border:0;
  border-radius:7px;
  background:transparent;
  color:#8ba9b0;
  font-size:8px;
  font-weight:800;
  letter-spacing:.12em;
  cursor:pointer;
}

.kv45-auth-panel .kv-auth-tabs button.active{
  background:#176d84;
  color:#fff;
}

.kv45-auth-panel .kv-auth-socials{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-bottom:9px;
}

.kv45-auth-panel .kv-auth-socials button{
  min-height:39px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  border:1px solid rgba(63,204,213,.28);
  border-radius:8px;
  background:#0a4057;
  color:#fff;
  font-size:9px;
  font-weight:700;
  cursor:pointer;
}

.kv45-auth-panel .kv-auth-socials button span{
  color:#4fe0e4;
  font-size:14px;
}

.kv45-auth-panel .kv-auth-divider{
  display:flex;
  align-items:center;
  gap:10px;
  margin:1px 0 8px;
  color:#77979f;
  font-size:6px;
  font-weight:800;
  letter-spacing:.14em;
}

.kv45-auth-panel .kv-auth-divider::before,
.kv45-auth-panel .kv-auth-divider::after{
  content:"";
  flex:1;
  height:1px;
  background:rgba(73,176,185,.22);
}

.kv45-auth-panel #kv-auth-form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px 11px;
}

.kv45-auth-panel #kv-auth-form label{
  color:#8caab1;
  font-size:7px;
  font-weight:800;
  letter-spacing:.1em;
}

.kv45-auth-panel #kv-auth-form input{
  width:100%;
  height:39px;
  margin-top:4px;
  padding:8px 11px;
  border:1px solid rgba(63,194,202,.28);
  border-radius:8px;
  outline:0;
  background:#031b2d;
  color:#fff;
  font-size:9px;
}

.kv45-auth-panel .kv-auth-submit{
  grid-column:1/-1;
  height:40px;
  border:0;
  border-radius:8px;
  background:#2fd8df;
  color:#032132;
  font-size:8px;
  font-weight:900;
  letter-spacing:.12em;
  cursor:pointer;
}

.kv45-auth-panel .kv-auth-message{
  min-height:11px;
  margin:5px 0 0;
  font-size:7px;
}

.kv45-auth-panel .kv-auth-config-note{
  margin:2px 0 0;
  color:#668991;
  font-size:6px;
  line-height:1.35;
}

/* Mobile keeps the previous working visual structure */
.kv45-auth-mobile{
  height:100%;
  overflow-y:auto;
  background:#052d42;
}

.kv45-auth-mobile-hero{
  position:relative;
  height:180px;
  overflow:hidden;
  border-bottom:1px solid rgba(63,210,218,.18);
  background:#031b2d;
}

.kv45-auth-mobile-hero img{
  position:absolute;
  left:50%;
  top:-5px;
  width:195px;
  height:195px;
  object-fit:contain;
  transform:translateX(-50%);
}

.kv45-auth-mobile .kv45-auth-panel{
  height:auto;
  padding:30px 22px 36px;
  overflow:visible;
}

.kv45-auth-mobile .kv-auth-socials{
  grid-template-columns:1fr;
}

.kv45-auth-mobile #kv-auth-form{
  grid-template-columns:1fr;
}

@media(max-width:700px){
  #modal.modal{
    padding:10px;
  }

  #modal .modal-card{
    width:calc(100vw - 20px);
    height:calc(100dvh - 20px);
    min-height:0;
  }
}

@media(min-width:701px) and (max-height:590px){
  #modal .modal-card{
    height:calc(100vh - 24px);
    min-height:0;
  }

  .kv45-auth-panel{
    padding-top:18px;
    padding-bottom:16px;
  }

  .kv45-auth-panel h2{
    font-size:40px;
  }

  .kv45-auth-panel .kv-auth-subtitle{
    margin-bottom:8px;
  }
}

/* =========================================================
   V46 — LIVE GOOGLE AUTHENTICATION
   ========================================================= */
.kv-auth-socials button small{
  margin-left:auto;
  color:#6f939b;
  font-size:5px;
  letter-spacing:.11em;
}

.kv-auth-socials button:disabled{
  cursor:not-allowed;
  opacity:.42;
  filter:saturate(.25);
}

.kv-auth-socials button.loading{
  opacity:.7;
  cursor:wait;
}

.kv-auth-message.error{color:#ff9c8d !important;}
.kv-auth-message.success{color:#72e8bf !important;}

.kv-auth-account-panel h2{
  font-size:clamp(34px,3.4vw,50px) !important;
  overflow-wrap:anywhere;
}

.kv-account-details{
  display:grid;
  gap:9px;
  margin:12px 0 16px;
}

.kv-account-details > div{
  display:grid;
  grid-template-columns:110px minmax(0,1fr);
  gap:14px;
  align-items:center;
  min-height:44px;
  padding:10px 13px;
  border:1px solid rgba(63,194,202,.23);
  border-radius:8px;
  background:#031b2d;
}

.kv-account-details span{
  color:#6f959e;
  font-size:6px;
  font-weight:800;
  letter-spacing:.14em;
}

.kv-account-details strong{
  overflow:hidden;
  color:#dff2f4;
  font-size:9px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

@media(max-width:700px){
  .kv-auth-account-layout{
    display:block !important;
    height:auto !important;
    min-height:100% !important;
  }

  .kv-auth-account-layout .kv45-auth-avatar-panel{
    width:100% !important;
    height:180px !important;
    min-width:0 !important;
    border-right:0 !important;
    border-bottom:1px solid rgba(63,220,226,.18) !important;
  }

  .kv-auth-account-layout .kv45-auth-avatar{
    width:130px !important;
    height:130px !important;
  }

  .kv-auth-account-layout .kv45-auth-avatar img{
    width:112px !important;
    height:112px !important;
  }

  .kv-auth-account-panel{
    height:auto !important;
    padding:30px 22px 36px !important;
    overflow:visible !important;
  }

  .kv-account-details > div{
    grid-template-columns:1fr;
    gap:5px;
  }
}


/* V54 reserved fighter name state */
.fighter-name-feedback[data-state="locked"]{border-color:rgba(255,216,100,.42)!important;background:rgba(255,216,100,.07)!important;color:#ffe79b!important}.fighter-name-feedback[data-state="locked"] .fighter-name-feedback-icon{color:#ffd76e!important}.fighter-name-submit.name-locked{background:#62572b!important;color:#ffe79b!important;cursor:not-allowed!important;box-shadow:none!important}.fighter-name-section-clean #fighter-name-input:disabled{color:#ffe79b!important;border-color:rgba(255,216,100,.35)!important;opacity:1!important}


/* =========================================================
   V57 — CLEAN GOOGLE / MICROSOFT LOGIN
   ========================================================= */
#modal .modal-card{
  height:auto !important;
  min-height:0 !important;
  max-height:calc(100vh - 48px) !important;
}

.kv45-auth-desktop{
  min-height:430px !important;
  height:auto !important;
}

.kv45-auth-panel{
  justify-content:center !important;
  padding:52px 46px 44px !important;
  overflow:visible !important;
}

.kv45-auth-panel .kv-auth-kicker{
  margin:0 0 10px !important;
}

.kv45-auth-panel h2{
  margin:0 !important;
  font-size:clamp(48px,4.5vw,68px) !important;
  line-height:.92 !important;
  overflow:visible !important;
}

.kv45-auth-panel .kv-auth-subtitle{
  max-width:560px !important;
  margin:16px 0 28px !important;
  font-size:12px !important;
  line-height:1.65 !important;
}

.kv-auth-socials.kv-auth-socials-only{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:14px !important;
  width:100% !important;
  margin:0 !important;
}

.kv-auth-socials-only .kv-oauth-provider{
  position:relative !important;
  display:grid !important;
  grid-template-columns:54px 1fr 54px !important;
  align-items:center !important;
  min-height:68px !important;
  padding:7px 16px !important;
  border:1px solid rgba(79,210,217,.38) !important;
  border-radius:11px !important;
  background:linear-gradient(180deg,#0b4057,#08374d) !important;
  color:#fff !important;
  font-size:13px !important;
  font-weight:800 !important;
  letter-spacing:.02em !important;
  transition:transform .2s ease,border-color .2s ease,background .2s ease !important;
}

.kv-auth-socials-only .kv-oauth-provider::after{
  content:"→";
  grid-column:3;
  justify-self:end;
  color:#5ce5e9;
  font-size:18px;
}

.kv-auth-socials-only .kv-oauth-provider:hover{
  transform:translateY(-2px) !important;
  border-color:#56e4e8 !important;
  background:linear-gradient(180deg,#10506a,#0a4057) !important;
}

.kv-oauth-icon{
  grid-column:1;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  padding:7px !important;
  border-radius:9px !important;
  background:#fff !important;
}

.kv-oauth-icon img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:28px !important;
  max-height:28px !important;
  object-fit:contain !important;
}

.kv-oauth-label{
  grid-column:2;
  justify-self:start;
}

.kv-auth-socials-only + .kv-auth-message{
  min-height:20px !important;
  margin:16px 0 0 !important;
  text-align:center !important;
}

.kv-auth-socials-only ~ .kv-auth-config-note{
  margin:2px 0 0 !important;
  text-align:center !important;
  font-size:7px !important;
}

@media(max-width:700px){
  #modal .modal-card{
    height:auto !important;
    max-height:calc(100dvh - 20px) !important;
    overflow-y:auto !important;
  }

  .kv45-auth-mobile{
    height:auto !important;
    overflow:visible !important;
  }

  .kv45-auth-mobile .kv45-auth-panel{
    padding:32px 22px 34px !important;
  }

  .kv45-auth-panel h2{
    font-size:44px !important;
  }

  .kv45-auth-panel .kv-auth-subtitle{
    margin:12px 0 22px !important;
  }

  .kv-auth-socials-only .kv-oauth-provider{
    min-height:62px !important;
    grid-template-columns:48px 1fr 32px !important;
    padding:6px 12px !important;
    font-size:12px !important;
  }

  .kv-oauth-icon{
    width:38px !important;
    height:38px !important;
  }
}

/* V60 Stripe checkout */
.checkout-message{margin:12px 0 0;padding:12px 14px;border:1px solid rgba(51,220,226,.28);background:rgba(2,33,49,.72);color:#9edce0;font-size:12px;line-height:1.45}.checkout-message[data-type="error"]{border-color:rgba(255,106,106,.5);color:#ffb1b1}.checkout-message[data-type="info"]{color:#a9e5e8}.checkout-main[disabled]{opacity:.65;cursor:wait}.creator-code-checkout{display:grid;gap:7px;margin:14px 0}.creator-code-checkout span{font-size:9px;font-weight:800;letter-spacing:.14em;color:#7da4ac}.creator-code-checkout input{width:100%;min-height:46px;padding:12px 14px;border:1px solid rgba(51,220,226,.28);background:#031d2d;color:#fff;font:600 13px Inter,sans-serif}.checkout-result-page{min-height:100vh;background:radial-gradient(circle at 50% 25%,rgba(40,211,220,.10),transparent 34%),#031c2c;color:#fff}.checkout-result-page main{min-height:100vh;display:grid;place-items:center;padding:120px 24px 60px}.checkout-result-card{width:min(780px,100%);padding:58px;border:1px solid rgba(48,217,224,.4);border-radius:18px;background:linear-gradient(145deg,#073d52,#052a3d);box-shadow:0 35px 90px rgba(0,0,0,.45)}.checkout-result-card h1{margin:8px 0 18px;font:900 clamp(48px,7vw,82px)/.87 "League Spartan",sans-serif}.checkout-result-card h1 span{color:#31d7df}.checkout-result-card>p{max-width:640px;color:#b2cbd0;line-height:1.7}.checkout-result-summary{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:28px 0;padding:20px;border:1px solid rgba(50,216,223,.22);background:#031e2e}.checkout-result-summary span{font-size:9px;letter-spacing:.15em;color:#72a2aa}.checkout-result-summary strong{text-align:right}.checkout-result-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}.checkout-result-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;background:#35d7df;color:#042131;font-size:11px;font-weight:900;letter-spacing:.1em;text-decoration:none}.checkout-result-actions a.secondary{background:transparent;color:#fff;border:1px solid rgba(53,215,223,.4)}@media(max-width:700px){.checkout-result-card{padding:34px 22px}.checkout-result-summary{grid-template-columns:1fr}.checkout-result-summary strong{text-align:left}}


/* V61 — checkout account session state */
.account-required.account-connected{
  border-color:rgba(80,225,229,.48);
  background:linear-gradient(90deg,rgba(45,216,223,.10),rgba(3,31,49,.38));
}
.account-required.account-connected b{color:#55e5b4;}
.account-required.account-connected .account-mark{box-shadow:0 0 0 5px rgba(85,229,180,.08);}
.account-required.account-connected .mini-account-button{border-color:rgba(85,229,180,.45);color:#55e5b4;}

/* V62 — Stripe Embedded Checkout */
.stripe-checkout-modal{position:fixed;inset:0;z-index:12000;display:none;align-items:flex-start;justify-content:center;padding:28px 18px;background:rgba(0,10,18,.88);backdrop-filter:blur(12px);overflow-y:auto}
.stripe-checkout-modal.open{display:flex}.stripe-checkout-open{overflow:hidden}
.stripe-checkout-shell{position:relative;width:min(760px,100%);min-height:480px;margin:auto;border:1px solid rgba(46,218,226,.55);border-radius:18px;background:#052d42;box-shadow:0 35px 100px rgba(0,0,0,.55);overflow:hidden}
.stripe-checkout-heading{padding:26px 72px 18px 30px;border-bottom:1px solid rgba(65,205,214,.18);background:linear-gradient(135deg,#031b2d,#073b51)}
.stripe-checkout-heading span{display:block;color:#37dce3;font-size:10px;font-weight:800;letter-spacing:.18em}.stripe-checkout-heading strong{display:block;margin-top:5px;color:#fff;font-size:28px;line-height:1}.stripe-checkout-heading p{margin:8px 0 0;color:#9ebcc3;font-size:12px}
.stripe-checkout-close{position:absolute;top:18px;right:18px;z-index:2;width:40px;height:40px;border:1px solid rgba(95,220,226,.35);border-radius:50%;background:#031b2d;color:#fff;font-size:24px;cursor:pointer}
#stripe-embedded-checkout{padding:14px 18px 24px;background:#fff;min-height:420px}
.checkout-message{margin:10px 0;padding:10px 12px;border:1px solid rgba(255,100,100,.35);border-radius:7px;background:rgba(80,10,20,.3);color:#ffd8d8;font-size:11px}.checkout-message[data-type="info"]{border-color:rgba(55,220,227,.35);background:rgba(10,76,90,.28);color:#bffcff}.checkout-message[data-type="success"]{border-color:rgba(71,227,156,.35);background:rgba(10,80,50,.28);color:#bffff0}
@media(max-width:700px){.stripe-checkout-modal{padding:8px}.stripe-checkout-shell{border-radius:12px}.stripe-checkout-heading{padding:22px 58px 15px 20px}.stripe-checkout-heading strong{font-size:22px}#stripe-embedded-checkout{padding:8px 4px 18px}}


/* V63 — public pre-launch edition lock */
.studio-edition-card.preorder-locked{
  cursor:not-allowed;
  isolation:isolate;
  min-height:100%;
}
.studio-edition-card.preorder-locked > *{
  filter:blur(7px) saturate(.72) brightness(.68);
  transform:scale(1.015);
  pointer-events:none!important;
  user-select:none;
}
.studio-edition-card.preorder-locked::before{
  content:"?";
  position:absolute;
  z-index:20;
  left:50%;
  top:44%;
  transform:translate(-50%,-50%);
  width:112px;
  height:112px;
  display:grid;
  place-items:center;
  border:1px solid rgba(92,234,239,.72);
  border-radius:50%;
  background:rgba(2,20,32,.72);
  box-shadow:0 0 0 10px rgba(38,219,225,.06),0 18px 55px rgba(0,0,0,.55),0 0 42px rgba(47,216,223,.16);
  color:#f5ffff;
  font-family:var(--kv-display-font,Impact,sans-serif);
  font-size:74px;
  line-height:1;
  text-shadow:0 4px 0 rgba(0,0,0,.32);
  backdrop-filter:blur(5px);
}
.studio-edition-card.preorder-locked::after{content:none!important;display:none!important;}
.studio-edition-card.preorder-locked:hover .pack-art-wrap img{transform:none!important}
@media(max-width:700px){
 .studio-edition-card.preorder-locked::before{width:84px;height:84px;font-size:55px;top:42%}
}
