/*! JT Earnings v1 (2026-09-25): калькулятор дохода YouTube. Палитра блога: чернила #1B1612, крем #F6F1E8, акцент #d72638, неон #6ee7ff/#8df0ba. */
.jt-earn{position:relative;margin:4px 0 30px;border-radius:20px;overflow:hidden;background:#1B1612;color:#F6F1E8;box-shadow:0 18px 50px rgba(27,22,18,.28);isolation:isolate}
.jt-earn::before,.jt-earn::after{content:"";position:absolute;z-index:-1;border-radius:50%;filter:blur(60px);opacity:.55;pointer-events:none}
.jt-earn::before{width:70%;height:90%;left:-20%;top:-35%;background:radial-gradient(circle,#6ee7ff 0%,rgba(110,231,255,0) 70%);animation:jtEarnFloatA 16s ease-in-out infinite alternate}
.jt-earn::after{width:65%;height:85%;right:-22%;bottom:-40%;background:radial-gradient(circle,#8df0ba 0%,rgba(141,240,186,0) 70%);animation:jtEarnFloatB 19s ease-in-out infinite alternate}
@keyframes jtEarnFloatA{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(35%,25%,0) scale(1.15)}}
@keyframes jtEarnFloatB{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(-30%,-20%,0) scale(1.1)}}
.jt-earn__inner{position:relative;padding:26px 28px 24px;background:linear-gradient(180deg,rgba(27,22,18,.35),rgba(27,22,18,.75))}
.jt-earn p{margin:0}
.jt-earn .jt-earn__kicker{display:inline-block;margin:0 0 12px;padding:5px 12px;border-radius:8px;background:#d72638;color:#fff;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.jt-earn .jt-earn__title{margin:0 0 18px;font-size:27px;line-height:1.2;font-weight:800;color:#F6F1E8}
.jt-earn__form{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px;align-items:end;margin-bottom:20px}
.jt-earn__field{display:flex;flex-direction:column;gap:6px;margin:0;font-size:13px;color:rgba(246,241,232,.72)}
.jt-earn__field input,.jt-earn__field select{width:100%;box-sizing:border-box;height:46px;padding:0 14px;border-radius:12px;border:1px solid rgba(246,241,232,.18);background:rgba(246,241,232,.07);color:#F6F1E8;font-size:17px;font-weight:600;outline:none;transition:border-color .15s,box-shadow .15s}
.jt-earn__field select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,#F6F1E8 50%),linear-gradient(135deg,#F6F1E8 50%,transparent 50%);background-position:calc(100% - 20px) 20px,calc(100% - 14px) 20px;background-size:6px 6px;background-repeat:no-repeat;padding-right:36px}
.jt-earn__field select option{color:#1B1612;background:#fff}
.jt-earn__field input:focus,.jt-earn__field select:focus{border-color:#6ee7ff;box-shadow:0 0 0 3px rgba(110,231,255,.22)}
.jt-earn__range{grid-column:1/-1;width:100%;margin:0;accent-color:#6ee7ff;height:22px;cursor:pointer}
.jt-earn__seg{display:flex;gap:4px;padding:4px;border-radius:12px;background:rgba(246,241,232,.07);border:1px solid rgba(246,241,232,.14);height:46px;box-sizing:border-box}
.jt-earn__seg button{flex:1;border:0;border-radius:9px;background:transparent;color:rgba(246,241,232,.75);font-size:14px;font-weight:700;cursor:pointer;transition:background .2s,color .2s}
.jt-earn__seg button.is-on{background:#F6F1E8;color:#1B1612}
.jt-earn__ownbtn{grid-column:1/-1;justify-self:start;margin:-2px 0 0;padding:0;border:0;background:none;color:#6ee7ff;font-size:14px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.jt-earn__ownbtn[hidden],.jt-earn__own[hidden]{display:none}
.jt-earn__own{grid-column:1/-1}
.jt-earn__result{padding:18px 20px;margin:0 0 18px;border-radius:16px;background:rgba(246,241,232,.06);border:1px solid rgba(246,241,232,.12)}
.jt-earn .jt-earn__label{font-size:13px;color:rgba(246,241,232,.7);margin-bottom:4px}
.jt-earn .jt-earn__sum{font-size:44px;line-height:1.1;font-weight:800;letter-spacing:-.01em;background:linear-gradient(90deg,#8df0ba,#6ee7ff 55%,#b9a8ff);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:tabular-nums}
.jt-earn .jt-earn__sum small{white-space:nowrap;display:inline-block;font-size:16px;font-weight:600;color:rgba(246,241,232,.7);-webkit-text-fill-color:rgba(246,241,232,.7)}
.jt-earn__dash[hidden]{display:none}
.jt-earn .jt-earn__rpmline{margin-top:8px;font-size:14px;line-height:1.5;color:rgba(246,241,232,.85)}
.jt-earn .jt-earn__rpmline span{color:rgba(246,241,232,.6);font-size:13px}
.jt-earn a{color:#6ee7ff;text-decoration:underline;text-underline-offset:2px}
.jt-earn__bars{display:grid;grid-template-columns:auto 1fr auto;gap:8px 12px;align-items:center;margin:0 0 16px}
.jt-earn__bars>p{grid-column:1/-1}
.jt-earn .jt-earn__bars-title{font-size:14px;font-weight:700;color:rgba(246,241,232,.85);margin-bottom:2px}
.jt-earn .jt-earn__bars-note{font-size:14px;line-height:1.5;color:rgba(246,241,232,.72)}
.jt-earn__bar{display:contents;font-size:14px}
.jt-earn__bar-name{color:rgba(246,241,232,.85);white-space:nowrap;font-size:14px}
.jt-earn__bar-track{height:12px;border-radius:999px;background:rgba(246,241,232,.08);overflow:hidden}
.jt-earn__bar-track i{display:block;height:100%;width:0;border-radius:999px;background:linear-gradient(90deg,#6ee7ff,#8df0ba);transition:width .7s cubic-bezier(.22,1,.36,1)}
.jt-earn__bar-val{text-align:right;font-weight:700;font-size:14px;font-variant-numeric:tabular-nums;white-space:nowrap}
.jt-earn__bar.is-sel .jt-earn__bar-name,.jt-earn__bar.is-sel .jt-earn__bar-val{color:#fff;font-weight:800}
.jt-earn__bar.is-sel .jt-earn__bar-track i{background:linear-gradient(90deg,#d72638,#ff8a5b)}
.jt-earn .jt-earn__notes{font-size:12.5px;line-height:1.55;color:rgba(246,241,232,.6);margin:0 0 18px}
.jt-earn .jt-earn__notes a{color:rgba(246,241,232,.8)}
.jt-earn__cta{display:flex;align-items:center;gap:16px;padding:16px 18px;border-radius:16px;background:linear-gradient(135deg,rgba(215,38,56,.22),rgba(110,231,255,.12));border:1px solid rgba(246,241,232,.14)}
.jt-earn__cta p{flex:1;font-size:15px;line-height:1.5;color:#F6F1E8}
.jt-earn a.jt-earn__btn{flex:none;display:inline-block;padding:12px 20px;border-radius:999px;background:#F6F1E8;color:#1B1612 !important;font-weight:700;font-size:15px;text-decoration:none !important;white-space:nowrap;transition:transform .15s,box-shadow .15s}
.jt-earn a.jt-earn__btn:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(0,0,0,.25)}
/* Появление карточки: чистый CSS, без зависимости от скрипта */
@keyframes jtEarnIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.jt-earn .jt-earn__inner>*{animation:jtEarnIn .55s cubic-bezier(.22,1,.36,1) both}
.jt-earn .jt-earn__inner>*:nth-child(2){animation-delay:.06s}
.jt-earn .jt-earn__inner>*:nth-child(3){animation-delay:.12s}
.jt-earn .jt-earn__inner>*:nth-child(4){animation-delay:.18s}
.jt-earn .jt-earn__inner>*:nth-child(5){animation-delay:.24s}
.jt-earn .jt-earn__inner>*:nth-child(n+6){animation-delay:.3s}
@media (max-width:575px){
  .jt-earn{border-radius:16px;margin:0 0 24px}
  .jt-earn__inner{padding:20px 16px 18px}
  .jt-earn .jt-earn__title{font-size:22px}
  .jt-earn__form{grid-template-columns:1fr}
  .jt-earn .jt-earn__sum{font-size:34px}
  .jt-earn__bars{gap:8px 8px}
  .jt-earn__bar-name,.jt-earn__bar-val{font-size:13px}
  .jt-earn__cta{flex-direction:column;align-items:stretch}
  .jt-earn a.jt-earn__btn{text-align:center;white-space:normal}
}
@media (prefers-reduced-motion:reduce){
  .jt-earn::before,.jt-earn::after{animation:none}
  .jt-earn .jt-earn__inner>*{animation:none}
  .jt-earn__bar-track i{transition:none}
}