.jeyran-bmi-app{
    --jb-primary:#2563eb;
    --jb-dark:#0f172a;
    --jb-text:#334155;
    --jb-muted:#64748b;
    --jb-border:#e2e8f0;
    --jb-bg:#f8fafc;
    width:100%;
    font-family:Vazirmatn,Vazir,Arial,sans-serif;
    box-sizing:border-box;
    margin:25px 0;
}
.jeyran-bmi-app *{box-sizing:border-box}
.jeyran-bmi-card{
    max-width:820px;
    margin:auto;
    background:#fff;
    border:1px solid var(--jb-border);
    border-radius:20px;
    padding:30px;
    box-shadow:0 12px 35px rgba(15,23,42,.08);
}
.jeyran-bmi-header{
    display:flex;
    align-items:center;
    gap:15px;
    margin-bottom:28px;
    padding-bottom:22px;
    border-bottom:1px solid var(--jb-border);
}
.jeyran-bmi-icon{
    width:58px;height:58px;
    display:flex;align-items:center;justify-content:center;
    background:#eff6ff;border-radius:16px;font-size:28px;
}
.jeyran-bmi-header h2{margin:0 0 6px;font-size:26px;color:var(--jb-dark)}
.jeyran-bmi-header p{margin:0;color:var(--jb-muted);font-size:15px}
.jeyran-bmi-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px;
    margin-bottom:18px;
}
.jeyran-bmi-field label{
    display:block;
    font-weight:700;
    color:var(--jb-text);
    margin-bottom:8px;
    font-size:15px;
}
.jeyran-bmi-field .optional{font-weight:400;color:#94a3b8;font-size:12px}
.jeyran-bmi-input-wrap{position:relative}
.jeyran-bmi-input-wrap input,
.jeyran-bmi-field>input{
    width:100%;
    height:52px;
    border:1px solid #cbd5e1;
    border-radius:12px;
    padding:0 15px;
    font-size:16px;
    outline:none;
    background:#fff;
    transition:.2s;
}
.jeyran-bmi-input-wrap input{padding-left:105px}
.jeyran-bmi-input-wrap span{
    position:absolute;left:14px;top:50%;transform:translateY(-50%);
    color:#64748b;font-size:13px;
}
.jeyran-bmi-input-wrap input:focus,
.jeyran-bmi-field>input:focus{
    border-color:var(--jb-primary);
    box-shadow:0 0 0 3px rgba(37,99,235,.12);
}
.jeyran-bmi-gender{display:flex;gap:10px;height:52px}
.jeyran-bmi-gender label{
    flex:1;margin:0!important;cursor:pointer;
    border:1px solid #cbd5e1;border-radius:12px;
    display:flex;align-items:center;justify-content:center;gap:7px;
    font-weight:500!important;color:#475569;
}
.jeyran-bmi-gender input{accent-color:var(--jb-primary)}
.jeyran-bmi-button{
    width:100%;border:0;border-radius:12px;
    background:var(--jb-primary);color:#fff;
    height:54px;font-family:inherit;font-size:16px;font-weight:700;
    cursor:pointer;margin-top:5px;
}
.jeyran-bmi-button:hover{filter:brightness(.95)}
.jeyran-bmi-reset{
    display:block;margin:12px auto 0;border:0;background:transparent;
    color:#64748b;font-family:inherit;cursor:pointer;font-size:14px;
}
.jeyran-bmi-error{
    display:none;margin:0 0 15px;padding:11px 14px;
    background:#fef2f2;color:#b91c1c;border-radius:10px;font-size:14px;
}
.jeyran-bmi-result{
    display:none;margin-top:28px;padding:26px;
    background:var(--jb-bg);border-radius:18px;border:1px solid #e2e8f0;
}
.jeyran-bmi-result.show{display:block}
.jeyran-bmi-result-top{text-align:center}
.jeyran-bmi-result-top>span:first-child{display:block;color:#64748b;font-size:14px}
.jeyran-bmi-number{display:block;font-size:52px;line-height:1.2;color:#0f172a;margin:7px 0}
.jeyran-bmi-status{
    display:inline-block!important;padding:7px 15px;border-radius:999px;
    font-weight:700;font-size:14px;
}
.status-under{background:#e0f2fe;color:#0369a1}
.status-normal{background:#dcfce7;color:#15803d}
.status-over{background:#fef3c7;color:#b45309}
.status-obese{background:#fee2e2;color:#b91c1c}
.jeyran-bmi-meter{
    position:relative;margin:30px 0 9px;height:14px;border-radius:999px;
    background:linear-gradient(90deg,#38bdf8 0%,#38bdf8 18%,#22c55e 18%,#22c55e 50%,#f59e0b 50%,#f59e0b 70%,#ef4444 70%);
}
.jeyran-bmi-marker{
    position:absolute;top:-7px;width:4px;height:28px;background:#111827;
    border-radius:4px;left:0;transition:left .4s ease;
}
.jeyran-bmi-meter-labels{
    display:grid;grid-template-columns:1fr 1fr 1fr 1fr;
    font-size:11px;color:#64748b;text-align:center;
}
.jeyran-bmi-details{margin-top:24px}
.jeyran-bmi-detail-box{
    background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:16px;
    text-align:center;
}
.jeyran-bmi-detail-box span{display:block;color:#64748b;font-size:13px}
.jeyran-bmi-detail-box strong{display:block;color:#0f172a;font-size:19px;margin-top:7px}
.jeyran-bmi-message{
    margin-top:18px;padding:15px;border-radius:12px;background:#fff;
    color:#475569;line-height:2;font-size:14px;
}
.jeyran-bmi-share{
    margin:16px auto 0;display:block;border:1px solid #cbd5e1;background:#fff;
    color:#334155;border-radius:10px;padding:10px 18px;font-family:inherit;cursor:pointer;
}
.jeyran-bmi-info{
    margin-top:28px;padding-top:22px;border-top:1px solid var(--jb-border);
}
.jeyran-bmi-info h3{font-size:19px;color:#0f172a;margin:0 0 10px}
.jeyran-bmi-info p{margin:0;color:#64748b;line-height:2;font-size:14px}
@media(max-width:640px){
    .jeyran-bmi-card{padding:20px 15px;border-radius:16px}
    .jeyran-bmi-grid{grid-template-columns:1fr;gap:14px;margin-bottom:14px}
    .jeyran-bmi-header h2{font-size:21px}
    .jeyran-bmi-header p{font-size:13px;line-height:1.8}
    .jeyran-bmi-icon{width:48px;height:48px;font-size:23px}
    .jeyran-bmi-result{padding:18px 12px}
    .jeyran-bmi-number{font-size:44px}
    .jeyran-bmi-meter-labels{font-size:9px}
}