/**
 * @license
 * SPDX-License-Identifier: Apache-2.0
*/:root{--font-title: "Cinzel", serif;--font-body: "Lato", sans-serif;--color-text-primary: #e0e0e0;--color-text-secondary: #a0a0a0;--color-gold: #c9a46a}*{box-sizing:border-box;margin:0;padding:0}body,html{width:100%}body{background-color:#0c0a09;background-image:url(https://webpatch.rohan2.com/web3/live/en/assets/pc/images/class/bg.jpg);background-size:cover;background-position:center;background-attachment:fixed;font-family:var(--font-body);color:var(--color-text-primary)}#root{width:100%;min-height:100vh;display:flex;justify-content:center;align-items:center;padding:2rem 0}.ir{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0)}.class_wrap{width:100%;max-width:1200px;padding:2rem;text-align:center}.tit{font-family:var(--font-title);font-size:clamp(2rem,6vw,3.5rem);color:var(--color-gold);letter-spacing:.5rem;font-weight:700}.desc_txt{font-size:clamp(.8rem,2vw,1.1rem);color:var(--color-text-primary);margin-top:.5rem;margin-bottom:3rem}.class_cont{display:flex;flex-direction:column;align-items:center}.class_symbol{list-style:none;display:flex;gap:0;margin-bottom:2rem;justify-content:center;flex-wrap:wrap}.class_symbol li{width:115px;height:143px;cursor:pointer;transition:transform .2s ease;background-image:url(https://webpatch.rohan2.com/web3/live/en/assets/pc/images/class/symbol_off.png);background-repeat:no-repeat;background-size:645px 143px}.class_symbol li:hover{transform:scale(1.1)}.class_symbol li.active,.class_symbol li:hover{background-image:url(https://webpatch.rohan2.com/web3/live/en/assets/pc/images/class/symbol_on.png)}.class_symbol li.human{background-position:0 0}.class_symbol li.dhan{background-position:-130px 0}.class_symbol li.elf{background-position:-260px 0}.class_symbol li.half_elf{background-position:-391px 0}.class_symbol li.dekan{background-position:-522px 0}.class_detail>div{display:none;width:100%;min-height:500px}.class_detail>div.active{display:flex;align-items:flex-start;justify-content:center;gap:2rem}.class_info{flex:1 1 55%;max-width:55%}.class_detail .name{font-family:var(--font-title);font-size:4rem;font-weight:700;letter-spacing:.5rem;line-height:1;text-align:left}.class_detail .type{font-size:clamp(.9rem,2.5vw,1.2rem);letter-spacing:.2rem;margin:1rem 0;font-weight:400;color:var(--color-text-secondary);text-align:left}.weapon_select{text-align:left;margin:0 0 2rem;display:flex;align-items:center;gap:1rem;flex-wrap:wrap}.weapon_select span{font-size:clamp(.9rem,2.5vw,1.2rem);letter-spacing:.2rem;font-weight:400;color:var(--color-text-secondary)}.weapon_select button{background:transparent;border:1px solid var(--color-text-secondary);color:var(--color-text-secondary);padding:.4rem .8rem;font-family:var(--font-body);font-size:clamp(.8rem,2vw,1rem);cursor:pointer;transition:all .2s ease-in-out;border-radius:4px}.weapon_select button:hover{border-color:var(--color-gold);color:var(--color-gold)}.weapon_select button.active{background-color:var(--color-gold);color:#0c0a09;border-color:var(--color-gold);font-weight:700}.class_detail .desc{font-size:clamp(.9rem,2vw,1.1rem);line-height:1.8;border-left:3px solid rgba(160,160,160,.5);padding-left:1.5rem;text-align:left;min-height:120px}.class_detail .desc h4{color:var(--color-gold);font-family:var(--font-title);font-size:1.5rem;font-weight:700;letter-spacing:.1rem;margin-bottom:.75rem}.class_detail .desc p{color:var(--color-text-primary)}.class_detail .img{flex:1 1 45%;max-width:45%}.class_detail .img img{max-width:100%;height:auto;max-height:550px;object-fit:contain}.cta_container{margin-bottom:1.5rem;text-align:left}.cta_text{color:var(--color-text-secondary);font-size:1rem;line-height:1.5;margin-bottom:.75rem;max-width:350px}.cta_button{display:inline-block;background-color:var(--color-gold);color:#0c0a09;font-family:var(--font-title);font-weight:700;text-decoration:none;padding:.6rem 1.2rem;border-radius:4px;transition:transform .2s ease,box-shadow .2s ease;letter-spacing:.1rem;font-size:1rem}.cta_button:hover{transform:translateY(-2px);box-shadow:0 4px 10px #c9a46a4d}.hidden-video-container{position:absolute;width:1px;height:1px;top:-9999px;left:-9999px;pointer-events:none}.video-list-container{position:fixed;bottom:20px;right:20px;width:320px;max-height:400px;background-color:#0c0a09e6;border:1px solid var(--color-gold);border-radius:8px;z-index:1000;display:flex;flex-direction:column;box-shadow:0 5px 20px #000000b3;overflow:hidden}.video-list-header{padding:12px 16px;font-family:var(--font-title);color:var(--color-gold);font-size:1.2rem;letter-spacing:.1rem;text-align:center;border-bottom:1px solid rgba(201,164,106,.5)}.video-list-scrollable{overflow-y:auto;flex-grow:1}.video-list-scrollable::-webkit-scrollbar{width:8px}.video-list-scrollable::-webkit-scrollbar-track{background:#1a1a1a}.video-list-scrollable::-webkit-scrollbar-thumb{background-color:var(--color-gold);border-radius:4px;border:2px solid #1a1a1a}.video-item{display:flex;align-items:center;padding:10px;text-decoration:none;color:var(--color-text-primary);transition:background-color .2s ease-in-out;border-bottom:1px solid #2a2a2a}.video-item:last-child{border-bottom:none}.video-item:hover{background-color:#c9a46a1a}.video-thumbnail{width:100px;height:56px;object-fit:cover;margin-right:12px;border-radius:4px;flex-shrink:0}.video-title{font-size:.9rem;line-height:1.3}.video-list-error{padding:20px;text-align:center;color:var(--color-text-secondary)}@media (max-width: 900px){.class_detail>div.active{flex-direction:column;text-align:center;align-items:center}.class_info,.class_detail .img{max-width:100%}.class_detail .name,.class_detail .type,.class_detail .desc{text-align:center;max-width:100%}.class_detail .type,.weapon_select{justify-content:center}.class_detail .desc{border-left:none;border-top:2px solid rgba(160,160,160,.5);padding-left:0;padding-top:1rem;margin:0 auto;max-width:90%}.cta_container{text-align:center;margin-top:2rem}.cta_text{margin-left:auto;margin-right:auto}}@media (max-width: 768px){.video-list-container{width:280px;max-height:300px;bottom:10px;right:10px}.video-thumbnail{width:80px;height:45px}.video-title{font-size:.85rem}}@media (max-width: 480px){.class_symbol li{width:60px;height:74px;background-size:335px auto}.class_symbol li.human{background-position:0 0}.class_symbol li.dhan{background-position:-67px 0}.class_symbol li.elf{background-position:-134px 0}.class_symbol li.half_elf{background-position:-201px 0}.class_symbol li.dekan{background-position:-268px 0}.video-list-container{display:none}}.skills-container{margin-top:1rem}.skills-section{margin-bottom:1.5rem}.skills-section h4{color:#d1b574;border-bottom:1px solid #555;padding-bottom:.5rem;margin-bottom:1rem;font-family:Cinzel,serif;font-weight:700}.skills-list{display:flex;flex-direction:column;gap:.5rem}.skill-item{cursor:pointer;transition:background-color .2s ease-in-out,border-color .2s;background-color:#0003;padding:12px;border-radius:6px;border:1px solid #444}.skill-item[data-rarity=rare]{background-color:#3264c826;border:1px solid rgba(50,100,200,.7)}.skill-item[data-rarity=epic]{background-color:#8032c833;border:1px solid rgba(128,50,200,.8)}.skill-item:hover{background-color:#d1b5741a;border-color:#d1b574}.skill-item[data-rarity=rare]:hover{background-color:#3264c84d;border-color:#5a8dec}.skill-item[data-rarity=epic]:hover{background-color:#8032c866;border-color:#b166ff}.skill-description{font-size:.9rem;color:#ccc;line-height:1.5}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000000d9;display:flex;justify-content:center;align-items:center;z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.modal-content{position:relative;background-color:#1e1e1e;padding:15px;border-radius:10px;border:1px solid #d1b574;box-shadow:0 5px 25px #000000b3;max-width:90vw;max-height:90vh}.modal-content img{max-width:100%;max-height:calc(90vh - 70px);display:block;border-radius:5px}.modal-close{position:absolute;top:-15px;right:-15px;background:#d1b574;color:#121212;border:2px solid #1e1e1e;border-radius:50%;width:35px;height:35px;font-size:24px;cursor:pointer;display:flex;justify-content:center;align-items:center;line-height:1;font-weight:700;transition:transform .2s}.modal-close:hover{transform:scale(1.1)}