html,body{margin:0;padding:0}
body.mvr-body{
    min-height:100vh;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:40px 24px;
    box-sizing:border-box;
    background:var(--mvr-bg);
    color:var(--mvr-text);
}
.mvr-ad{width:100%;max-width:728px;text-align:center;margin:0 auto}
.mvr-ad-top{margin-bottom:20px}
.mvr-ad-bottom{margin-top:20px}
.mvr-template{width:100%;display:flex;justify-content:center}
.mvr-card{
    width:100%;
    max-width:640px;
    box-sizing:border-box;
    background:var(--mvr-card);
    color:var(--mvr-text);
    padding:44px 40px;
    border-radius:16px;
    text-align:center;
}
.mvr-badge{
    display:inline-flex;
    align-items:center;
    gap:6px;
    font-family:var(--mvr-badge-font);
    font-size:var(--mvr-badge-size);
    font-weight:var(--mvr-badge-weight);
    padding:5px 14px;
    border-radius:20px;
    margin-bottom:18px;
    background:var(--mvr-badge-bg);
    color:var(--mvr-badge-color,var(--mvr-badge-text));
    text-align:var(--mvr-badge-align);
    letter-spacing:0.2px;
}
.mvr-badge svg{flex-shrink:0}
.mvr-badge-affiliate{
    background:var(--mvr-aff-badge-bg);
    color:var(--mvr-aff-badge-text);
}
.mvr-title{
    margin:0 0 10px;
    font-family:var(--mvr-heading-font);
    font-size:var(--mvr-heading-size);
    font-weight:var(--mvr-heading-weight);
    line-height:1.25;
    color:var(--mvr-heading-color);
    text-align:var(--mvr-heading-align);
}
.mvr-desc{
    margin:0 0 26px;
    font-family:var(--mvr-desc-font);
    font-size:var(--mvr-desc-size);
    font-weight:var(--mvr-desc-weight);
    line-height:1.65;
    color:var(--mvr-desc-color);
    text-align:var(--mvr-desc-align);
}
.mvr-url-box{
    padding:14px 18px;
    border-radius:11px;
    margin-bottom:26px;
    word-break:break-all;
    background:var(--mvr-surface);
    border:1px solid var(--mvr-border);
}
.mvr-domain{
    display:block;
    font-family:var(--mvr-domain-font);
    font-size:var(--mvr-domain-size);
    font-weight:var(--mvr-domain-weight);
    margin-bottom:4px;
    color:var(--mvr-domain-color);
    text-align:var(--mvr-domain-align);
    line-height:1.4;
}
.mvr-full-url{
    display:block;
    font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,Courier,monospace;
    font-size:var(--mvr-url-size);
    font-weight:var(--mvr-url-weight);
    line-height:1.55;
    color:var(--mvr-url-color);
    text-align:var(--mvr-url-align);
}
.mvr-actions{
    display:flex;
    gap:12px;
    margin-bottom:26px;
}
.mvr-actions>*{flex:1}
.mvr-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    box-sizing:border-box;
    text-decoration:none;
    cursor:pointer;
    transition:all .2s ease;
    border-radius:var(--mvr-btn-radius);
    font-family:var(--mvr-btn-font);
    font-size:var(--mvr-btn-size);
    font-weight:var(--mvr-btn-weight);
    text-align:var(--mvr-btn-align);
    padding:15px 20px;
    min-height:52px;
    white-space:normal;
    line-height:1.3;
    appearance:none;
}
.mvr-btn:hover{transform:translateY(-1px)}
.mvr-btn-primary{
    background:var(--mvr-button);
    border:1px solid var(--mvr-button);
    color:var(--mvr-button-text);
}
.mvr-btn-secondary{
    background:transparent;
    border:1px solid var(--mvr-back-border);
    color:var(--mvr-text);
}
.mvr-btn-secondary:hover{background:var(--mvr-surface)}
.mvr-note{
    padding-top:16px;
}
.mvr-note-divider{
    height:1px;
    margin-bottom:14px;
    background:var(--mvr-divider);
}
.mvr-note-title{
    display:block;
    font-family:var(--mvr-note-title-font);
    font-size:var(--mvr-note-title-size);
    font-weight:var(--mvr-note-title-weight);
    color:var(--mvr-note-title-color);
    text-align:var(--mvr-note-title-align);
    margin-bottom:4px;
}
.mvr-note-text{
    display:block;
    font-family:var(--mvr-note-text-font);
    font-size:var(--mvr-note-text-size);
    font-weight:var(--mvr-note-text-weight);
    line-height:1.65;
    color:var(--mvr-note-text-color);
    text-align:var(--mvr-note-text-align);
}

.mvr-btn-style-outline .mvr-btn-primary{
    background:transparent!important;
    color:var(--mvr-button)!important;
    border:1px solid var(--mvr-button)!important;
}
.mvr-btn-style-ghost .mvr-btn-primary{
    background:var(--mvr-surface)!important;
    color:var(--mvr-button)!important;
    border:1px solid transparent!important;
}

@media (max-width:680px){
    body.mvr-body{padding:14px;align-items:flex-start}
    .mvr-card{padding:28px 20px;max-width:100%}
    .mvr-actions{flex-direction:column}
    .mvr-actions>*{width:100%}
    .mvr-btn{width:100%}
    .mvr-title{font-size:clamp(22px,var(--mvr-heading-size),32px)}
    .mvr-desc{font-size:clamp(14px,var(--mvr-desc-size),18px)}
}