.card-title,.header h1,.header p,label{color:var(--dark)}.header,.preview-content,.tab{text-align:center}.color-option,.tab,button{cursor:pointer}:root{--primary:#6C63FF;--secondary:#4D44DB;--accent:#FF6584;--dark:#2D3748;--light:#F7FAFC;--glass:rgba(255, 255, 255, 0.25);--glass-border:rgba(255, 255, 255, 0.3);--glass-shadow:0 8px 32px rgba(31, 38, 135, 0.15)}*{margin:0;padding:0;box-sizing:border-box;font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif}body{background:linear-gradient(135deg,#f5f7fa 0,#c3cfe2 100%);min-height:100vh;display:flex;justify-content:center;align-items:center;padding:20px}.tab-content.active,label{display:block}.container{width:100%;max-width:1200px}.header{margin-bottom:30px}.card-title,.form-group{margin-bottom:20px}.header h1{font-size:2.5rem;margin-bottom:10px;background:linear-gradient(to right,var(--primary),var(--secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-weight:700}.header p{opacity:.8;font-size:1.1rem}button,label{font-size:.95rem}.editor-container{display:flex;flex-wrap:wrap;gap:25px;justify-content:center}.card{flex:1;min-width:300px;background:var(--glass);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-radius:20px;border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);padding:30px;transition:transform .3s,box-shadow .3s;animation:.5s forwards fadeIn}.card:hover{transform:translateY(-5px);box-shadow:0 12px 40px rgba(31,38,135,.2)}.card-title{font-size:1.3rem;font-weight:600;display:flex;align-items:center;gap:10px}.tab,label{font-weight:500}.card-title svg{width:24px;height:24px}input[type=color],input[type=text],select{width:100%;border:none;background:rgba(255,255,255,.7)}label{margin-bottom:8px}input[type=text],select{padding:12px 15px;border-radius:12px;font-size:.95rem;color:var(--dark);transition:.3s;box-shadow:0 2px 5px rgba(0,0,0,.05)}input[type=text]:focus,select:focus{outline:0;background:rgba(255,255,255,.9);box-shadow:0 5px 15px rgba(0,0,0,.1)}input[type=color]{height:40px;border-radius:12px;cursor:pointer;padding:3px}.button-group{display:flex;gap:12px;margin-top:25px;flex-wrap:wrap}button{padding:12px 20px;border:none;border-radius:12px;font-weight:600;transition:.3s;display:flex;align-items:center;gap:8px}button svg{width:18px;height:18px}.btn-primary{background:linear-gradient(to right,var(--primary),var(--secondary));color:#fff;box-shadow:0 4px 15px rgba(108,99,255,.3)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(108,99,255,.4)}.btn-secondary{background:rgba(255,255,255,.7);color:var(--dark)}.btn-secondary:hover{background:rgba(255,255,255,.9);transform:translateY(-2px)}.btn-accent{background:var(--accent);color:#fff;box-shadow:0 4px 15px rgba(255,101,132,.3)}.btn-accent:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(255,101,132,.4)}.signature-canvas{border-radius:12px;background:rgba(255,255,255,.7);box-shadow:0 4px 15px rgba(0,0,0,.05);margin-bottom:15px;touch-action:none}.color-options{display:flex;gap:10px;margin-top:10px}.color-option{width:30px;height:30px;border-radius:50%;border:2px solid transparent;transition:transform .2s}.color-option:hover{transform:scale(1.1)}.color-option.selected{border-color:#fff;box-shadow:0 0 0 2px var(--dark);transform:scale(1.1)}.download-options{margin-top:25px}.download-options label{margin-bottom:12px;display:block}.preview-container{position:relative;border-radius:20px;overflow:hidden;min-height:300px;display:flex;justify-content:center;align-items:center;background:linear-gradient(135deg,rgba(255,255,255,.3) 0,rgba(255,255,255,.1) 100%);box-shadow:var(--glass-shadow);border:1px solid var(--glass-border)}.preview-content{padding:30px;width:100%}#signature-preview{max-width:100%;max-height:250px;object-fit:contain}.preview-placeholder{color:var(--dark);opacity:.7;font-size:1rem}.tab-content{display:none}.tabs{display:flex;gap:5px;margin-bottom:20px;background:rgba(255,255,255,.3);padding:5px;border-radius:12px}.tab{flex:1;padding:10px;border-radius:8px;color:var(--dark);transition:.3s}.tab.active{background:#fff;color:var(--primary);box-shadow:0 2px 10px rgba(0,0,0,.05)}@media (max-width:768px){.header h1{font-size:2rem}.card{min-width:100%}.button-group{justify-content:center}button{flex:1;justify-content:center;min-width:120px}}@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.card:first-child{animation-delay:.1s}.card:nth-child(2){animation-delay:.2s}