.ba26-transformer,
.ba26-transformer *{box-sizing:border-box}

.ba26-transformer{
    --ba26-ink:#233840;
    --ba26-muted:#60767e;
    --ba26-line:#d7e0e3;
    --ba26-soft:#f4f7f8;
    --ba26-accent:#a90032;
    --ba26-accent-dark:#8f002a;
    --ba26-steel:#55727c;
    position:relative;
    width:100%;
    max-width:1280px;
    margin:0 auto;
    border:1px solid var(--ba26-line);
    border-radius:26px;
    background:#fff;
    overflow:visible;
    box-shadow:0 14px 38px rgba(35,56,64,.08);
    color:var(--ba26-ink);
    font-family:inherit;
}

.ba26-transformer__intro{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    padding:28px 32px;
    border-bottom:1px solid var(--ba26-line);
    border-radius:26px 26px 0 0;
    background:#fff;
}

.ba26-transformer__eyebrow{
    margin-bottom:5px;
    color:var(--ba26-ink);
    font-size:16px;
    font-weight:700;
}
.ba26-transformer__hint{
    max-width:900px;
    color:var(--ba26-muted);
    font-size:15px;
    line-height:1.55;
}

.ba26-transformer__grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
}
.ba26-state{
    min-width:0;
    padding:30px 28px 28px;
    border-right:1px solid var(--ba26-line);
    background:#fff;
    transition:background .2s ease,box-shadow .2s ease;
}
.ba26-state:last-child{border-right:0}
.ba26-state.is-active{
    background:#fff;
    box-shadow:inset 0 4px 0 var(--ba26-accent);
}
.ba26-state.is-calculated{background:var(--ba26-soft)}
.ba26-state__head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    margin-bottom:24px;
}
.ba26-state__kicker{
    display:block;
    margin-bottom:3px;
    color:var(--ba26-muted);
    font-size:11px;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
}
.ba26-state h3{
    margin:0;
    color:var(--ba26-ink);
    font-size:24px;
    line-height:1.15;
    font-weight:700;
}
.ba26-state__status{
    display:inline-flex;
    align-items:center;
    min-height:28px;
    padding:0 11px;
    border-radius:14px;
    background:#edf2f4;
    color:var(--ba26-muted);
    font-size:11px;
    font-weight:700;
    white-space:nowrap;
}
.ba26-state.is-active .ba26-state__status{
    background:rgba(169,0,50,.08);
    color:var(--ba26-accent);
}

.ba26-field{display:block;margin-bottom:16px}
.ba26-field>span{
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:12px;
    margin-bottom:7px;
    color:var(--ba26-ink);
    font-size:13px;
    font-weight:700;
}
.ba26-field small{
    color:var(--ba26-muted);
    font-size:11px;
    font-weight:600;
}
.ba26-field input{
    width:100%!important;
    height:50px!important;
    margin:0!important;
    padding:0 15px!important;
    border:1.5px solid #b9c8cd!important;
    border-radius:12px!important;
    background:#fff!important;
    box-shadow:none!important;
    outline:none!important;
    color:var(--ba26-ink)!important;
    font:inherit!important;
    font-size:16px!important;
    font-weight:600!important;
    -webkit-appearance:auto!important;
    appearance:auto!important;
}
.ba26-field input:focus{
    border-color:var(--ba26-steel)!important;
    box-shadow:0 0 0 3px rgba(85,114,124,.10)!important;
}
.ba26-field input:disabled{
    opacity:1!important;
    color:#55696f!important;
    background:#eef3f4!important;
    border-color:#d7e0e3!important;
    -webkit-text-fill-color:#55696f!important;
}

.ba26-weight{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:18px;
    margin-top:24px;
    padding-top:20px;
    border-top:1px solid var(--ba26-line);
}
.ba26-weight>span{
    color:var(--ba26-muted);
    font-size:12px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.05em;
}
.ba26-weight strong{
    color:var(--ba26-ink);
    font-size:28px;
    line-height:1;
    font-weight:700;
}
.ba26-weight small{
    color:var(--ba26-muted);
    font-size:12px;
}

.ba26-transformer__result{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
    padding:28px 32px;
    border-top:1px solid var(--ba26-line);
    background:#edf3f5;
}
.ba26-transformer__result-label{
    display:block;
    margin-bottom:3px;
    color:var(--ba26-ink);
    font-size:14px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.04em;
}
.ba26-transformer__result-note{
    display:block;
    color:var(--ba26-muted);
    font-size:13px;
}
.ba26-transformer__result strong{
    flex:0 0 auto;
    color:var(--ba26-accent);
    font-size:42px;
    line-height:1;
    font-weight:750;
}
.ba26-transformer__result small{
    color:var(--ba26-steel);
    font-size:15px;
    font-weight:700;
}

.ba26-transformer__footer{
    padding:20px 26px 22px;
    border-top:1px solid var(--ba26-line);
    border-radius:0 0 26px 26px;
    background:#fff;
}
.ba26-transformer__actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
    flex-wrap:wrap;
}
.ba26-transformer__action{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:43px;
    margin:0!important;
    padding:0 18px!important;
    border:1.5px solid var(--ba26-steel)!important;
    border-radius:24px!important;
    background:#fff!important;
    box-shadow:none!important;
    color:var(--ba26-steel)!important;
    font:inherit!important;
    font-size:13px!important;
    font-weight:700!important;
    line-height:1!important;
    cursor:pointer;
    transition:.18s ease;
}
.ba26-transformer__action svg{
    width:17px;
    height:17px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}
.ba26-transformer__action:hover:not(:disabled){
    border-color:var(--ba26-accent)!important;
    color:var(--ba26-accent)!important;
}
.ba26-transformer__action--pdf{
    border-color:var(--ba26-accent)!important;
    background:var(--ba26-accent)!important;
    color:#fff!important;
}
.ba26-transformer__action--pdf:hover:not(:disabled){
    border-color:var(--ba26-accent-dark)!important;
    background:var(--ba26-accent-dark)!important;
    color:#fff!important;
}
.ba26-transformer__action:disabled{
    opacity:.42;
    cursor:not-allowed;
}
.ba26-transformer__action.is-loading{pointer-events:none;opacity:.72}

.ba26-transformer__share-wrap{position:relative}
.ba26-transformer__share-menu{
    position:absolute;
    z-index:40;
    right:0;
    bottom:calc(100% + 10px);
    width:180px;
    padding:7px;
    border:1px solid var(--ba26-line);
    border-radius:14px;
    background:#fff;
    box-shadow:0 12px 30px rgba(35,56,64,.16);
}
.ba26-transformer__share-menu[hidden]{display:none!important}
.ba26-transformer__share-item{
    display:block;
    width:100%;
    margin:0!important;
    padding:10px 12px!important;
    border:0!important;
    border-radius:9px!important;
    background:#fff!important;
    color:var(--ba26-ink)!important;
    font:inherit!important;
    font-size:13px!important;
    font-weight:600!important;
    text-align:left;
    cursor:pointer;
}
.ba26-transformer__share-item:hover{background:var(--ba26-soft)!important;color:var(--ba26-accent)!important}

.ba26-transformer__toast{
    position:absolute;
    z-index:60;
    left:50%;
    bottom:84px;
    transform:translate(-50%,12px);
    max-width:calc(100% - 40px);
    padding:10px 16px;
    border-radius:18px;
    background:var(--ba26-ink);
    color:#fff;
    font-size:13px;
    font-weight:700;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:.2s ease;
}
.ba26-transformer__toast--show{opacity:1;visibility:visible;transform:translate(-50%,0)}
.ba26-transformer__toast--error{background:#8f002a}

@media(max-width:900px){
    .ba26-transformer__grid{grid-template-columns:1fr}
    .ba26-state{border-right:0;border-bottom:1px solid var(--ba26-line)}
    .ba26-state:last-child{border-bottom:0}
}

@media(max-width:700px){
    .ba26-transformer__actions{display:grid;grid-template-columns:1fr 1fr;width:100%}
    .ba26-transformer__action{width:100%}
    .ba26-transformer__share-wrap{width:100%}
    .ba26-transformer__share-wrap>.ba26-transformer__action{width:100%}
    .ba26-transformer__share-menu{right:auto;left:0;width:100%;min-width:180px}
}

@media(max-width:600px){
    .ba26-transformer{border-radius:18px}
    .ba26-transformer__intro{padding:22px 20px;border-radius:18px 18px 0 0}
    .ba26-state{padding:24px 20px}
    .ba26-state h3{font-size:22px}
    .ba26-transformer__result{align-items:flex-end;padding:24px 20px}
    .ba26-transformer__result strong{font-size:34px}
    .ba26-transformer__footer{padding:18px 20px 20px;border-radius:0 0 18px 18px}
}

@media(max-width:420px){
    .ba26-transformer__result{flex-direction:column;align-items:flex-start;gap:14px}
    .ba26-transformer__actions{grid-template-columns:1fr}
    .ba26-transformer__toast{bottom:116px}
}