.container-box{    max-width:1000px;    margin:auto;    padding:40px 0;}
.card{    border:none;    border-radius:20px;    overflow:hidden;    background:#fff;    box-shadow:0 20px 60px rgba(0,0,0,.15);}
.headerb{    background:linear-gradient(135deg,#2563eb,#1e40af);    color:#fff;    text-align:center;    padding:22px;}
.headerb h4{    margin:0;    font-weight:700;}
.settings-box,.caption-box,.logo-box,.color-box,.download-box{    border-radius:14px;    padding:16px;    margin-bottom:16px;}
.settings-box{    background:#f8fafc;    border:1px solid #e2e8f0;}
.caption-box{    background:#fffbea;    border:1px solid #fde68a;}
.logo-box{    background:#f0fdf4;    border:1px solid #bbf7d0;}
.color-box{    background:#eff6ff;    border:1px solid #bfdbfe;}
.download-box{    background:#f8fafc;    border:1px solid #cbd5e1;}
.settings-title{    font-size:14px;    font-weight:700;    color:#1e40af;    margin-bottom:12px;    padding-bottom:8px;    border-bottom:1px solid rgba(37,99,235,.15);}
.type-btn{    border-radius:10px;    transition:.2s;}
.type-btn.active{    background:#2563eb;    color:#fff;    border-color:#2563eb;}
.type-btn:hover{    transform:translateY(-2px);}
.qr-preview{    background:#f8fafc;    border:2px dashed #cbd5e1;    border-radius:16px;    padding:20px;    min-height:320px;    display:flex;    align-items:center;    justify-content:center;    overflow:auto;}
#qrcode{    display:flex;    justify-content:center;    align-items:center;}
#qrcode canvas{    display:block;    max-width:100%;    height:auto !important;    image-rendering:pixelated;}
.size-value{    font-weight:bold;    color:#2563eb;    min-width:65px;    text-align:center;}
.form-control,.form-select{    border-radius:10px;}
.form-control:focus{    border-color:#2563eb;    box-shadow:0 0 0 .2rem rgba(37,99,235,.15);}
.form-control-color{    width:100%;    height:42px;    border-radius:10px;    cursor:pointer;}
.form-range{    cursor:pointer;}
.btn-success{    background:#16a34a;    border-color:#16a34a;}
.btn-success:hover{    background:#15803d;    border-color:#15803d;}
.btn-secondary{    background:#475569;    border-color:#475569;}
.btn-secondary:hover{    background:#334155;    border-color:#334155;}
#logoControls{    margin-top:10px;}

@media (max-width:768px){
    .container-box{        padding:20px 0;    }
    .qr-preview{        min-height:240px;        padding:15px;    }
    .settings-box,    .caption-box,    .logo-box,    .color-box,    .download-box{        padding:12px;    }
    #qrcode canvas{        max-width:220px;        height:auto !important;    }
}