.profile-maker-container{color:#fff;background:#0e141d;min-height:100vh;padding:40px 20px;font-family:Inter,sans-serif}.profile-maker-grid{grid-template-columns:1fr 2fr;gap:30px;max-width:1200px;margin:0 auto;display:grid}.profile-maker-header{text-align:center;max-width:1200px;margin:0 auto 40px}.profile-maker-header .header-title h1{color:#fff;margin:0 0 20px;font-size:56px;font-weight:700;line-height:1.2}.profile-maker-header .highlight{background:linear-gradient(-90deg,#f59e0b 10%,#ff5700 62%);-webkit-text-fill-color:transparent;background-size:200% 100%;-webkit-background-clip:text;background-clip:text;animation:2.5s linear infinite shine-text}.profile-maker-header .header-title p{color:#99a1b3;margin:0;font-size:18px}@media (max-width:991px){.profile-maker-header .header-title h1{font-size:40px}}@media (max-width:576px){.profile-maker-header .header-title h1{font-size:26px}.profile-maker-header .header-title p{font-size:14px}}.controls-panel{height:-moz-fit-content;height:fit-content;position:-webkit-sticky;position:sticky;top:20px}.controls-card{color:#fff;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.06);border-radius:10px;max-height:calc(100vh - 100px);padding:20px;overflow:auto;box-shadow:inset 0 1px rgba(255,255,255,.04),0 4px 6px -1px rgba(0,0,0,.3)}.drop-zone{cursor:pointer;text-align:center;background:rgba(0,0,0,.39);border:2px dashed rgba(255,87,0,.37);border-radius:10px;margin-bottom:20px;padding:28px;transition:all .3s}.drop-zone:hover{border-color:#ff5700}.drop-zone.drag-over{border-color:#ff5700;box-shadow:0 6px 18px rgba(14,165,164,.08)}.upload-icon{margin:0 auto 20px;display:block}.drop-text{color:#fff;margin-bottom:8px;font-size:18px;font-weight:500}.text-primary{color:#ff5700;font-weight:700}.drop-subtext{color:#6c757d;font-size:.9rem}.control-section{margin-bottom:20px}.card-title{color:#fff;margin-bottom:15px;font-size:16px;font-weight:600}.control-row{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:15px;display:grid}.control-col{flex-direction:column;display:flex}.form-label{color:#fff;margin-bottom:8px;font-size:13px;font-weight:500}.form-select{color:#fff;-webkit-appearance:auto;-moz-appearance:auto;appearance:auto;background:rgba(0,0,0,.39);border:1px solid rgba(255,255,255,.21);border-radius:10px;outline:none;width:100%;padding:8px 10px;font-size:14px}.form-select:focus{box-shadow:none;border-color:#ff5700}.form-range{-webkit-appearance:none;background:#e2e8f0;border-radius:999px;outline:none;width:100%;height:8px;margin-bottom:20px}.form-range::-webkit-slider-thumb{-webkit-appearance:none;cursor:pointer;background:linear-gradient(-90deg,#f59e0b 10%,#ff5700 62%);border-radius:50%;width:24px;height:24px;margin-top:-8px;transition:all .2s;box-shadow:0 4px 12px rgba(102,126,234,.4)}.form-range::-webkit-slider-thumb:hover{transform:scale(1.2)}.form-range::-moz-range-thumb{cursor:pointer;background:linear-gradient(-90deg,#f59e0b 10%,#ff5700 62%);border:none;border-radius:50%;width:24px;height:24px;box-shadow:0 4px 12px rgba(102,126,234,.4)}.button-row{flex-wrap:wrap;gap:8px;display:flex}.btn{color:#fff;cursor:pointer;white-space:nowrap;border:none;border-radius:50px;padding:8px 16px;font-size:13px;font-weight:600;transition:all .3s}.btn-sm{padding:6px 12px;font-size:12px}.btn-success{background:#28a745}.btn-success:hover{background:#218838}.btn-danger{background:#dc3545}.btn-danger:hover{background:#c82333}.btn-warning{color:#000;background:#ffc107}.btn-warning:hover{background:#e0a800}.btn-info{background:#17a2b8}.btn-info:hover{background:#138496}.btn-primary-gradient{color:#fff;background:linear-gradient(-90deg,#f59e0b 10%,#ff5700 62%);border:0;border-radius:50px;flex:1;padding:10px 20px;font-size:15px;font-weight:600}.btn-primary-gradient:hover{background:linear-gradient(90deg,#f59e0b 10%,#ff5700 62%)}.btn-danger-outline{color:#fff;background:#dc3545;border-radius:50px;flex:1}.btn-danger-outline:hover{background:#c82333}.preview-panel{height:-moz-fit-content;height:fit-content;position:-webkit-sticky;position:sticky;top:20px}.preview-card{color:#fff;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.06);border-radius:10px;padding:20px;box-shadow:inset 0 1px rgba(255,255,255,.04),0 4px 6px -1px rgba(0,0,0,.3)}.preview-header{justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px;display:flex}.preview-title{color:#fff;margin-bottom:5px;font-size:18px;font-weight:700}.preview-subtitle{color:#fff;font-size:12px;display:block}.stat-badge{white-space:nowrap;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.06);border-radius:999px;padding:6px 12px;font-size:14px;box-shadow:inset 0 1px rgba(255,255,255,.04),0 4px 6px -1px rgba(0,0,0,.3)}.canvas-container{background:rgba(0,0,0,.2);border-radius:10px;justify-content:center;align-items:center;min-height:320px;margin-bottom:20px;padding:20px;display:flex;position:relative}.preview-canvas{touch-action:none;border-radius:12px;max-width:100%;display:block;box-shadow:0 8px 20px rgba(2,6,23,.06)}.export-note{text-align:center;color:#fff;background:rgba(255,255,255,.05);border-radius:8px;padding:12px;font-size:14px}hr{background:rgba(255,255,255,.1);border:0;height:1px;margin:20px 0}@media (max-width:1199px){.profile-maker-grid{grid-template-columns:1fr}.controls-panel,.preview-panel{position:relative;top:0}.controls-card{max-height:none;overflow:visible}}@media (max-width:768px){.profile-maker-container{padding:20px 10px}.preview-header{text-align:center;flex-direction:column}.stat-badge{width:100%}.button-row .btn{flex:48%}.control-row{grid-template-columns:1fr}}@media (max-width:576px){.drop-zone{min-height:80px;padding:18px}.upload-icon{width:40px;height:40px}.drop-text{font-size:14px}.canvas-container{min-height:240px}.button-row{flex-direction:column}.button-row .btn{width:100%}}.variants-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:18px;max-width:1200px;margin:40px auto 0;padding:0 16px;display:grid}.variant-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:14px;flex-direction:column;gap:10px;padding:12px;transition:transform .2s,box-shadow .2s;display:flex}.variant-card:hover{transform:translateY(-3px);box-shadow:0 10px 25px rgba(0,0,0,.35)}.variant-card img{aspect-ratio:1;object-fit:cover;background:#000;border-radius:10px;width:100%}.variant-name{text-align:center;color:#cfcfcf;margin-top:4px;font-size:13px}.variant-card .btn{margin-top:auto;padding:6px 10px;font-size:13px}.varinats_pr{margin-top:20px}.varinats_pr .preview-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}@media (max-width:768px){.variants-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:14px}.variant-card{padding:10px}}.bg-row{grid-template-columns:1fr auto;align-items:end;gap:12px;margin-bottom:16px;display:grid}.bg-col{flex-direction:column;display:flex}.color-input::-webkit-color-swatch-wrapper{padding:0}.color-input::-webkit-color-swatch{border:none;border-radius:6px}@media (max-width:480px){.bg-row{grid-template-columns:1fr}.color-input{width:100%}}.border-color-row{grid-template-columns:1fr 1fr;gap:12px;margin-top:10px;display:grid}.border-color-col{flex-direction:column;display:flex}.color-input{cursor:pointer;background:rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.2);border-radius:10px;width:50%;height:38px;padding:4px}.color-input:disabled{opacity:.4;cursor:not-allowed}