.jpsui-box{
    max-width:950px;
    margin:25px auto;
    padding:26px;
    background:#fff;
    border:1px solid #eee;
    border-radius:20px;
    box-shadow:0 10px 30px rgba(0,0,0,.04);
}

.jpsui-box h2{
    margin-top:0;
    margin-bottom:16px;
    font-size:26px;
}

#jpsui-url{
    flex:1;
    height:48px;
    padding:0 15px;
    border:1px solid #ddd;
    border-radius:12px;
    box-sizing:border-box;
    font-size:15px;
    margin:0;
}

#jpsui-button{
    height:48px;
    padding:0 24px;
    border:0;
    border-radius:12px;
    background:#bf0000;
    color:#fff;
    font-weight:800;
    cursor:pointer;
    margin:0;
    white-space:nowrap;
}

.jpsui-search{
    display:flex;
    gap:10px;
    align-items:center;
}

#jpsui-button:disabled{
    opacity:.6;
    cursor:not-allowed;
}

#jpsui-result{
    margin-top:20px;
}

.jpsui-loading,
.jpsui-alert{
    margin-top:18px;
    padding:18px;
    background:#fafafa;
    border:1px solid #eee;
    border-radius:14px;
}

.jpsui-spinner{
    width:28px;
    height:28px;
    border:3px solid #ddd;
    border-top-color:#bf0000;
    border-radius:50%;
    animation:jpsui-spin .8s linear infinite;
}

@keyframes jpsui-spin{
    to{transform:rotate(360deg);}
}

.jpsui-card{
    margin-top:24px;
    display:grid;
    grid-template-columns:minmax(320px, 460px) 1fr;
    gap:34px;
    padding:26px;
    background:#fff;
    border:1px solid #eee;
    border-radius:20px;
    box-shadow:0 12px 35px rgba(0,0,0,.06);
}

.jpsui-image-wrap{
    min-height:430px;
    background:#fafafa;
    border:1px solid #eee;
    border-radius:18px;
    padding:18px;
    display:flex;
    align-items:flex-start;
    justify-content:center;
}

.jpsui-image{
    width:100%;
    max-height:430px;
    object-fit:contain;
}

.jpsui-no-image{
    color:#999;
    padding:80px 0;
}

.jpsui-content{
    padding-left:6px;
}

.jpsui-topline{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin-bottom:12px;
}

.jpsui-badge,
.jpsui-status{
    display:inline-flex;
    padding:6px 11px;
    border-radius:999px;
    font-size:12px;
    font-weight:800;
}

.jpsui-badge{
    background:#111;
    color:#fff;
}

.jpsui-status.good{
    background:#e8f7ee;
    color:#167a3a;
}

.jpsui-status.bad{
    background:#fdecec;
    color:#b00020;
}

.jpsui-content h2{
    font-size:24px;
    line-height:1.4;
    margin:8px 0 18px;
    padding-left:4px;
}

.jpsui-price-box{
    margin:22px 0 24px;
    padding:20px;
    background:#fff7f7;
    border:1px solid #f2d4d4;
    border-radius:18px;
    text-align:center;
}

.jpsui-price-label{
    font-size:13px;
    font-weight:700;
    color:#777;
    margin-bottom:6px;
}

.jpsui-price{
    margin:0;
    font-size:40px;
    line-height:1.2;
    font-weight:900;
    color:#bf0000;
}

.jpsui-actions-price{
    display:flex;
    gap:10px;
    justify-content:center;
    margin-top:18px;
    flex-wrap:wrap;
}

.jpsui-link,
.jpsui-add{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:0 18px;
    border-radius:12px;
    font-weight:800;
    text-decoration:none;
}

.jpsui-actions-price .jpsui-link,
.jpsui-actions-price .jpsui-add{
    min-width:220px;
}

.jpsui-link{
    background:#111;
    color:#fff;
}

.jpsui-add{
    border:0;
    background:#bf0000;
    color:#fff;
    cursor:pointer;
}

.jpsui-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
}

.jpsui-row{
    background:#fafafa;
    border:1px solid #eee;
    border-radius:12px;
    padding:8px 12px;
}

.jpsui-row span{
    display:block;
    font-size:11px;
    color:#777;
    margin-bottom:2px;
}

.jpsui-row strong{
    display:block;
    font-size:13px;
    color:#222;
    font-weight:600;
}

.jpsui-row-double{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
}

.jpsui-row-half{
    background:#fafafa;
    border:1px solid #eee;
    border-radius:12px;
    padding:8px 12px;
}

.jpsui-row-half span{
    display:block;
    font-size:11px;
    color:#777;
    margin-bottom:2px;
}

.jpsui-row-half strong{
    display:block;
    font-size:13px;
    color:#222;
    font-weight:600;
}

.jpsui-description{
    margin-top:16px;
    padding:13px 15px;
    background:#fafafa;
    border:1px solid #eee;
    border-radius:14px;
    cursor:pointer;
}

.jpsui-description summary{
    font-weight:800;
    cursor:pointer;
}

.jpsui-description p{
    margin:12px 0 0;
    line-height:1.7;
}

@media(max-width:820px){
    .jpsui-box{
        padding:18px;
    }

    .jpsui-card{
        grid-template-columns:1fr;
        padding:18px;
    }

    .jpsui-image-wrap{
        min-height:280px;
    }

    .jpsui-image{
        max-height:280px;
    }

    .jpsui-row-double{
        grid-template-columns:1fr;
    }

    .jpsui-actions-price .jpsui-link,
    .jpsui-actions-price .jpsui-add{
        width:100%;
        min-width:0;
    }
}