.class-detail-page{background:var(--color-bg-primary);z-index:20;min-height:100vh;position:relative;overflow:clip visible}.class-detail__bg{z-index:0;width:100%;height:60vh;position:absolute;top:0;left:0}.class-detail__bg-image{opacity:.3;filter:blur(10px)brightness(.5)}.class-detail__overlay{background:linear-gradient(180deg, transparent 0%, var(--color-bg-primary) 100%);position:absolute;inset:0}.class-detail__container{z-index:1;padding-top:100px;padding-bottom:80px;position:relative}.class-detail__back-btn{color:var(--color-gold);font-family:var(--font-heading);text-transform:uppercase;letter-spacing:2px;align-items:center;gap:8px;margin-bottom:40px;font-size:.9rem;text-decoration:none;transition:all .3s;display:inline-flex}.class-detail__back-btn:hover{color:var(--color-gold-light);transform:translate(-5px)}.class-detail__content{grid-template-columns:450px 1fr;align-items:start;gap:60px;display:grid}.class-detail__image-wrapper{border:2px solid var(--color-border);border-radius:24px;position:relative;overflow:hidden;transform:translateY(-20px);box-shadow:0 30px 60px #00000080,0 0 40px #c8a96e1a}.class-detail__main-image{width:100%;height:auto;display:block}.class-detail__image-wrapper--coming-soon .class-detail__main-image{filter:grayscale(.58)saturate(.36)brightness(.62)}.class-detail__image-status{z-index:2;color:var(--color-gold-light);font-family:var(--font-heading);letter-spacing:.1em;text-transform:uppercase;-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);background:#08080cd6;border:1px solid #c8a96e6b;border-radius:4px;align-items:center;gap:7px;padding:8px 11px;font-size:.68rem;display:inline-flex;position:absolute;top:18px;right:18px}.class-detail__image-wrapper:after{content:"";pointer-events:none;background:linear-gradient(135deg,#c8a96e1a 0%,#0000 50%);position:absolute;inset:0}.class-detail__info{padding-top:20px}.class-detail__header{align-items:center;gap:20px;margin-bottom:24px;display:flex}.class-detail__class-icon{object-fit:contain;flex:0 0 64px;width:64px;height:64px}.class-detail__title{font-family:var(--font-heading);color:var(--color-text-primary);text-shadow:0 2px 10px #00000080;letter-spacing:2px;margin:0 0 4px;font-size:3rem}.class-detail__role{font-family:var(--font-body);color:var(--color-gold-dark);text-transform:uppercase;letter-spacing:4px;font-size:1rem}.class-detail__meta{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.class-detail__availability-badge{color:var(--color-gold-light);font-family:var(--font-heading);letter-spacing:.08em;text-transform:uppercase;background:#c8a96e12;border:1px solid #c8a96e57;border-radius:4px;align-items:center;gap:6px;padding:6px 9px;font-size:.58rem;display:inline-flex}.class-detail__short-desc{font-family:var(--font-body);color:var(--color-text-secondary);max-width:600px;margin-bottom:32px;font-size:1.2rem;line-height:1.6}.class-detail__stats-grid{grid-template-columns:repeat(4,1fr);gap:16px;max-width:400px;margin-bottom:40px;display:grid}.class-detail__equipment-lab{width:min(100%,600px);min-height:82px;color:var(--color-text-primary);background:radial-gradient(circle at 8%,#c8a96e26,#0000 34%),linear-gradient(110deg,#c8a96e13,#0b0c12bd);border:1px solid #c8a96e47;border-radius:14px;align-items:center;gap:15px;margin:-8px 0 38px;padding:12px 16px 12px 12px;transition:transform .2s,border-color .2s,box-shadow .2s;display:flex;position:relative;overflow:hidden;box-shadow:0 16px 38px #0000003d}.class-detail__availability-notice{background:radial-gradient(circle at 8%,#c8a96e21,#0000 34%),linear-gradient(110deg,#c8a96e0f,#0b0c12c7);border:1px solid #c8a96e40;border-radius:14px;align-items:center;gap:15px;width:min(100%,600px);margin:-8px 0 38px;padding:14px;display:flex;box-shadow:0 16px 38px #00000038}.class-detail__availability-notice-icon{width:54px;height:54px;color:var(--color-gold-light);background:#c8a96e14;border:1px solid #c8a96e4d;border-radius:50%;flex:0 0 54px;place-items:center;display:grid}.class-detail__availability-notice>span:last-child{flex-direction:column;gap:3px;min-width:0;display:flex}.class-detail__availability-notice small{color:var(--color-gold-dark);font-family:var(--font-heading);letter-spacing:.16em;text-transform:uppercase;font-size:.58rem}.class-detail__availability-notice strong{color:var(--color-gold-light);font-family:var(--font-heading);font-size:.98rem}.class-detail__availability-notice>span:last-child>span{color:var(--color-text-muted);font-size:.76rem;line-height:1.5}.class-detail__equipment-lab:after{content:"";pointer-events:none;border:1px solid #c8a96e1a;border-radius:50%;width:110px;height:110px;position:absolute;top:-54px;right:28px;box-shadow:0 0 0 14px #c8a96e06}.class-detail__equipment-lab:hover,.class-detail__equipment-lab:focus-visible{border-color:#e5c9908c;outline:none;transform:translateY(-2px);box-shadow:0 20px 46px #0000004d,0 0 24px #c8a96e14}.class-detail__equipment-lab-icon{width:54px;height:54px;color:var(--color-gold-light);background:#c8a96e17;border:1px solid #c8a96e57;border-radius:50%;flex:0 0 54px;place-items:center;display:grid;box-shadow:inset 0 0 16px #c8a96e14}.class-detail__equipment-lab-copy{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.class-detail__equipment-lab-copy small{color:var(--color-gold-dark);font-family:var(--font-heading);letter-spacing:.2em;font-size:.62rem}.class-detail__equipment-lab-copy strong{color:var(--color-gold-light);font-family:var(--font-heading);letter-spacing:.04em;font-size:1rem}.class-detail__equipment-lab-copy>span{color:var(--color-text-muted);text-overflow:ellipsis;white-space:nowrap;font-size:.72rem;overflow:hidden}.class-detail__equipment-lab>svg{z-index:1;color:var(--color-gold);flex:none;transition:transform .2s;position:relative}.class-detail__equipment-lab:hover>svg{transform:translate(4px)}.class-detail__stat-box{background:var(--color-bg-card);border:1px solid var(--color-border);text-align:center;border-radius:12px;padding:16px;transition:all .3s}.class-detail__stat-box:hover{border-color:var(--color-gold);background:#c8a96e0d;transform:translateY(-2px)}.stat-box__value{font-family:var(--font-heading);color:var(--color-gold);margin-bottom:4px;font-size:1.8rem;font-weight:700;display:block}.stat-box__label{font-family:var(--font-body);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:2px;font-size:.8rem;display:block}.class-detail__lore-section h2{font-family:var(--font-heading);color:var(--color-text-primary);letter-spacing:1px;margin-bottom:12px;font-size:1.5rem}.class-detail__divider{background:var(--color-gold);border-radius:2px;width:60px;height:3px;margin-bottom:24px}.class-detail__lore-text{font-family:var(--font-body);color:var(--color-text-muted);margin-bottom:40px;font-size:1.05rem;line-height:1.8}.class-detail__bottom-section{opacity:0;margin-top:80px;animation:.8s .3s forwards fadeUp}.class-detail__coming-soon-panel{text-align:center;background:radial-gradient(circle at 50% 0,#c8a96e21,#0000 54%),linear-gradient(145deg,#121219eb,#08080cf7);border:1px solid #c8a96e3d;border-radius:18px;max-width:760px;margin:76px auto 0;padding:52px clamp(24px,5vw,64px);box-shadow:0 30px 70px #00000057}.class-detail__coming-soon-icon{width:72px;height:72px;color:var(--color-gold-light);background:#c8a96e14;border:1px solid #c8a96e61;border-radius:50%;place-items:center;margin:0 auto 20px;display:grid;box-shadow:0 0 34px #c8a96e14}.class-detail__coming-soon-eyebrow{color:var(--color-gold-dark);font-family:var(--font-heading);letter-spacing:.2em;text-transform:uppercase;font-size:.66rem}.class-detail__coming-soon-panel h2{color:var(--color-text-primary);font-family:var(--font-heading);margin:12px 0 14px;font-size:clamp(1.9rem,4vw,3rem)}.class-detail__coming-soon-panel p{max-width:560px;color:var(--color-text-muted);margin:0 auto;line-height:1.75}.class-detail__coming-soon-panel a{color:var(--color-gold-light);font-family:var(--font-heading);letter-spacing:.08em;text-transform:uppercase;background:#c8a96e12;border:1px solid #c8a96e57;border-radius:6px;align-items:center;gap:8px;margin-top:28px;padding:11px 16px;font-size:.7rem;text-decoration:none;display:inline-flex}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.section-title{font-family:var(--font-heading);color:var(--color-text-primary);letter-spacing:2px;text-align:center;margin-bottom:16px;font-size:2rem}.section-divider{background:var(--color-gold);border-radius:2px;width:80px;height:3px;margin:0 auto 40px}.class-detail__skills-intro{max-width:680px;color:var(--color-text-muted);font-family:var(--font-body);text-align:center;margin:-20px auto 34px;font-size:.98rem;line-height:1.65}.dual-class-panel{isolation:isolate;background:radial-gradient(circle at 88% -18%,#ddb5681c,#0000 25rem),linear-gradient(145deg,#ffffff06,#0000 38%),#08080ee0;border:1px solid #cda96345;border-radius:2px;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:28px;max-width:980px;margin:0 auto 48px;padding:26px 28px;display:grid;position:relative;box-shadow:0 24px 58px #00000052,0 0 42px #af80320b,inset 0 1px #ffffff09}.dual-class-panel:before{content:"";z-index:3;pointer-events:none;background:linear-gradient(90deg,#0000,#ecc884e0,#0000);width:36%;height:1px;position:absolute;top:0;left:12%;box-shadow:0 0 18px #d8ae5b61}.dual-class-panel__copy h3{color:var(--color-gold-light);font-family:var(--font-heading);letter-spacing:.05em;margin:5px 0 8px;font-size:1.35rem}.dual-class-panel__copy p{max-width:650px;color:var(--color-text-muted);font-family:var(--font-body);margin:0;font-size:.9rem;line-height:1.6}.dual-class-panel__eyebrow{color:var(--color-gold-dark);font-family:var(--font-body);letter-spacing:.14em;text-transform:uppercase;font-size:.68rem;font-weight:700}.dual-class-panel__add,.dual-class-combination__actions button{color:#e1c785;min-height:42px;font-family:var(--font-body);cursor:pointer;background:linear-gradient(135deg,#c8a96e24,#47371f1f 52%,#0d0d11e6),#151419;border:1px solid #d3b16c80;border-radius:2px;justify-content:center;align-items:center;gap:7px;padding:0 15px;font-size:.82rem;transition:border-color .2s,background .2s,transform .2s;display:inline-flex}.dual-class-panel__add:hover,.dual-class-panel__add:focus-visible,.dual-class-combination__actions button:hover,.dual-class-combination__actions button:focus-visible{border-color:var(--color-gold);background:#c8a96e33;transform:translateY(-1px)}.dual-class-combination{color:var(--color-gold-light);font-family:var(--font-heading);flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:9px;font-size:.96rem;display:flex}.dual-class-combination>span{background:#050508c2;border:1px solid #c8a96e3d;border-radius:2px;padding:8px 11px}.dual-class-combination__actions{justify-content:flex-end;gap:7px;width:100%;display:flex}.dual-class-combination__actions .dual-class-combination__remove{color:#d7a29a;background:#b2625814;border-color:#b2625866}.dual-class-picker{border-top:1px solid #c8a96e29;grid-column:1/-1;padding-top:22px}.dual-class-picker__header{color:var(--color-text-primary);font-family:var(--font-heading);justify-content:space-between;align-items:center;gap:16px;margin-bottom:14px;display:flex}.dual-class-picker__header button{width:34px;height:34px;color:var(--color-text-muted);cursor:pointer;background:0 0;border:1px solid #c8a96e33;border-radius:2px;justify-content:center;align-items:center;display:inline-flex}.dual-class-picker__grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;display:grid}.dual-class-picker__grid button{min-width:0;color:var(--color-text-secondary);font-family:var(--font-body);cursor:pointer;background:linear-gradient(135deg,#2a262152,#0c0d12c7);border:1px solid #c8a96e2e;border-radius:2px;align-items:center;gap:10px;padding:8px;transition:border-color .2s,background .2s;display:flex}.dual-class-picker__grid button:hover,.dual-class-picker__grid button:focus-visible,.dual-class-picker__grid button.is-selected{border-color:var(--color-gold);color:var(--color-gold-light);background:#c8a96e1c}.dual-class-picker__grid img{object-fit:cover;object-position:center 18%;border-radius:2px;flex:none;width:46px;height:46px}.dual-class-picker__grid span{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.class-detail__skills-grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px;display:grid}.skill-group{margin-top:42px}.skill-group+.skill-group{border-top:1px solid #c8a96e29;padding-top:42px}.skill-group__header{justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px;display:flex}.skill-group__header h3{color:var(--color-gold-light);font-family:var(--font-heading);letter-spacing:.06em;margin:0 0 6px;font-size:1.45rem}.skill-group__header p{color:var(--color-text-muted);font-family:var(--font-body);margin:0;font-size:.88rem}.skill-group__count{color:#e1c785;min-width:42px;height:34px;font-family:var(--font-heading);background:linear-gradient(135deg,#c8a96e29,#47371f1f 52%,#0d0d11e6),#151419;border:1px solid #d4b87a7a;border-radius:2px;flex:none;justify-content:center;align-items:center;padding:0 11px;font-size:.9rem;display:inline-flex;position:relative}.class-detail__skill-card{text-align:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);isolation:isolate;background:radial-gradient(circle at 50% -5%,#ddb56816,#0000 20rem),linear-gradient(145deg,#ffffff06,#0000 42%),#09090ff0;border:1px solid #cda9632e;border-radius:2px;outline:none;flex-direction:column;align-items:center;gap:14px;min-height:205px;padding:22px 15px 18px;transition:transform .32s,border-color .32s,box-shadow .32s;display:flex;position:relative;overflow:visible;box-shadow:0 22px 54px #00000047,inset 0 1px #ffffff08}.class-detail__skill-card:before{content:"";opacity:0;border-radius:inherit;pointer-events:none;z-index:-1;background:radial-gradient(circle at top,#c8a96e1a,#0000 70%);height:100%;transition:opacity .4s;position:absolute;top:0;left:0;right:0}.class-detail__skill-card:after{content:"";z-index:3;pointer-events:none;background:linear-gradient(90deg,#0000,#ecc884cc,#0000);height:1px;position:absolute;top:0;left:16%;right:16%;box-shadow:0 0 15px #d8ae5b52}.class-detail__skill-card:hover,.class-detail__skill-card:focus-visible,.class-detail__skill-card:focus-within{border-color:var(--color-gold);z-index:20;transform:translateY(-6px);box-shadow:0 28px 68px #00000070,0 0 24px #c8a96e1f}.class-detail__skill-card:hover:before,.class-detail__skill-card:focus-visible:before,.class-detail__skill-card:focus-within:before{opacity:1}.skill-card__icon-wrapper{position:relative}.skill-card__icon{background:linear-gradient(135deg, var(--color-bg-tertiary), #1a1a24);border:2px solid var(--color-gold-dark);width:62px;height:62px;color:var(--color-gold);z-index:2;border-radius:2px;justify-content:center;align-items:center;transition:all .3s;display:flex;position:relative;overflow:hidden}.class-detail__skill-card:hover .skill-card__icon,.class-detail__skill-card:focus-visible .skill-card__icon,.class-detail__skill-card:focus-within .skill-card__icon{border-color:var(--color-gold);color:#fff;transform:scale(1.08);box-shadow:0 0 20px #c8a96e47}.skill-card__icon-image{object-fit:cover;image-rendering:auto;width:100%;height:100%}.skill-card__glow{background:var(--color-gold);filter:blur(20px);opacity:0;z-index:1;width:60px;height:60px;transition:opacity .4s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.class-detail__skill-card:hover .skill-card__glow,.class-detail__skill-card:focus-visible .skill-card__glow,.class-detail__skill-card:focus-within .skill-card__glow{opacity:.5}.class-detail__skill-content{z-index:2;flex-direction:column;align-items:center;display:flex;position:relative}.class-detail__skill-name{font-family:var(--font-heading);color:var(--color-gold-light);letter-spacing:1px;margin:0 0 12px;font-size:1.05rem}.skill-card__badges{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.skill-card__badges span{color:#d9b86e;font-family:var(--font-body);letter-spacing:.04em;background:#050508c2;border:1px solid #d4af3757;border-radius:2px;padding:5px 10px;font-size:.72rem}.skill-card__hint{color:var(--color-text-muted);font-family:var(--font-body);align-items:center;gap:6px;margin-top:16px;font-size:.78rem;transition:color .25s;display:inline-flex}.class-detail__skill-card:hover .skill-card__hint,.class-detail__skill-card:focus-visible .skill-card__hint,.class-detail__skill-card:focus-within .skill-card__hint{color:var(--color-gold-light)}.skill-tooltip{width:min(370px,100vw - 32px);color:var(--color-text-secondary);text-align:left;opacity:0;visibility:hidden;pointer-events:none;transform-origin:50%;z-index:50;background:linear-gradient(145deg,#1e1b19fa,#0b0b10fc);border:1px solid #d3b16cad;border-radius:2px;padding:18px;transition:opacity .2s,visibility .2s,transform .2s;position:absolute;top:70%;left:50%;transform:translate(-50%,-46%)scale(.97);box-shadow:0 24px 60px #000000b8,0 0 28px #c8a96e21}.class-detail__skill-card:hover .skill-tooltip,.class-detail__skill-card:focus-visible .skill-tooltip,.class-detail__skill-card:focus-within .skill-tooltip{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,-50%)scale(1)}.skill-tooltip__header{border-bottom:1px solid #c8a96e2e;align-items:center;gap:12px;padding-bottom:13px;display:flex}.skill-tooltip__icon{border:1px solid #d3b16c8f;border-radius:2px;flex:none;width:42px;height:42px}.skill-tooltip__header strong,.skill-tooltip__header span{display:block}.skill-tooltip__header strong{color:var(--color-gold-light);font-family:var(--font-heading);letter-spacing:.04em;font-size:1.03rem}.skill-tooltip__header span{color:var(--color-text-muted);font-family:var(--font-body);margin-top:3px;font-size:.72rem}.skill-tooltip__description{max-height:150px;color:var(--color-text-secondary);font-family:var(--font-body);white-space:pre-line;scrollbar-width:thin;scrollbar-color:var(--color-gold-dark) transparent;margin:14px 0;font-size:.87rem;line-height:1.58;overflow:auto}.rom-text--cm{color:#9da6b5;font-style:italic}.rom-text--cs{color:#72c7dc}.rom-text--cy{color:#f3d46f}.rom-text--cv{color:#e3bd72;font-weight:600}.skill-tooltip__level-preview{background:#c8a96e0b;border:1px solid #c8a96e26;border-radius:2px;justify-content:space-between;align-items:center;gap:10px;margin:-2px 0 13px;padding:9px;display:flex}.skill-tooltip__level-preview>span{color:var(--color-text-muted);font-family:var(--font-body);letter-spacing:.05em;text-transform:uppercase;flex:none;font-size:.67rem}.skill-tooltip__level-preview>div{justify-content:flex-end;align-items:center;gap:6px;display:flex}.skill-tooltip__level-preview button{width:29px;height:29px;color:var(--color-text-secondary);font-family:var(--font-body);cursor:pointer;background:#ffffff06;border:1px solid #c8a96e33;border-radius:2px;place-items:center;padding:0;font-size:.66rem;transition:border-color .18s,background .18s,color .18s;display:grid}.skill-tooltip__level-preview button:hover,.skill-tooltip__level-preview button:focus-visible{border-color:var(--color-gold);color:var(--color-gold-light);background:#c8a96e29;outline:none}.skill-tooltip__level-preview button:disabled{color:#9a907c4d;cursor:not-allowed;background:#ffffff03;border-color:#c8a96e14}.skill-level-stepper output{min-width:62px;color:var(--color-gold-light);font-variant-numeric:tabular-nums;justify-content:center;align-items:baseline;gap:4px;display:flex}.skill-level-stepper output strong{font-family:var(--font-display);font-size:.9rem;font-weight:600}.skill-level-stepper output span{color:var(--color-text-muted);font-size:.68rem}.skill-tooltip__stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0;display:grid}.skill-tooltip__stats div{background:#ffffff06;border:1px solid #c8a96e21;border-radius:2px;min-width:0;padding:8px 9px}.skill-tooltip__stats dt{color:var(--color-text-muted);letter-spacing:.08em;text-transform:uppercase;margin-bottom:3px;font-size:.63rem}.skill-tooltip__stats dd{color:var(--color-gold-light);text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:.77rem;overflow:hidden}.skill-tooltip__stats .skill-tooltip__requirement{grid-column:1/-1}.skill-tooltip__stats .skill-tooltip__requirement dd{white-space:normal}.skill-tooltip__scaling{color:var(--color-text-muted);font-family:var(--font-body);margin:12px 0 0;font-size:.7rem;font-style:italic;line-height:1.45}.class-detail__action{text-align:center;margin-top:20px}.class-detail__play-btn{letter-spacing:2px;text-transform:uppercase;font-size:1.2rem;font-family:var(--font-heading);padding:16px 48px}@media (max-width:1024px){.class-detail__content{grid-template-columns:1fr;gap:40px}.class-detail__image-wrapper{max-width:500px;margin:0 auto;transform:translateY(0)}.class-detail__info{padding-top:0}.class-detail__skills-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}}@media (max-width:768px){.class-detail__title{font-size:2.2rem}.class-detail__stats-grid{grid-template-columns:repeat(2,1fr)}.class-detail__skills-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.class-detail__skill-card{min-height:190px;padding-inline:10px}.skill-group__header{align-items:flex-start}.dual-class-panel{grid-template-columns:1fr;padding:22px 18px}.dual-class-panel__add{justify-self:start}.dual-class-combination,.dual-class-combination__actions{justify-content:flex-start}}@media (max-width:480px){.class-detail__equipment-lab{align-items:flex-start;padding-right:12px}.class-detail__equipment-lab-icon{flex-basis:46px;width:46px;height:46px}.class-detail__equipment-lab>svg{margin-top:13px}.class-detail__skills-grid{grid-template-columns:1fr}.dual-class-picker__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}