*{box-sizing:border-box;margin:0;padding:0}body{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#1F2937;line-height:1.6}:root{--primary:#5B21B6;--secondary:#F3E8FF;--text-primary:#111827;--text-secondary:#4B5563;--border:#DDD6FE;--hover:#1D4ED8;--accent:#8B5CF6}h1{font-size:44px;font-weight:700}h2{font-size:20px;font-weight:700}h3{font-size:18px;font-weight:500}p,label{font-size:15px;font-weight:400}.helper{font-size:13px;color:var(--text-secondary)}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes slideInLeft{from{transform:translateX(-50px);opacity:0}to{transform:translateX(0);opacity:1}}@keyframes slideInRight{from{transform:translateX(50px);opacity:0}to{transform:translateX(0);opacity:1}}.hero{background:linear-gradient(to bottom,var(--secondary),#FFFFFF);text-align:center;padding:80px 20px;border-bottom:1px solid var(--border);animation:fadeIn 1s ease-out}.hero h1{margin-bottom:12px}.hero p{color:var(--text-secondary)}.tool-container{padding:30px;max-width:1280px;margin:0 auto}.image-preview,.watermark-options{margin-bottom:50px;animation:slideInLeft 0.6s ease-out}@media (min-width:768px){.tool-container{display:grid;grid-template-columns:1fr 1fr;gap:50px}.watermark-options{animation:slideInRight 0.6s ease-out}}.upload-area{border:2px dashed var(--border);padding:50px;text-align:center;cursor:pointer;border-radius:16px;background:var(--secondary);margin-bottom:25px;transition:border-color 0.3s ease,transform 0.3s ease}.upload-area:hover{border-color:var(--primary);transform:scale(1.02)}#image-upload{display:none}.preview-container{display:flex;flex-wrap:wrap;gap:15px}.preview-item{position:relative;border:1px solid var(--border);border-radius:12px;overflow:hidden;box-shadow:0 4px 6px rgb(0 0 0 / .1);max-width:100%;transition:transform 0.3s ease}.preview-item:hover{transform:scale(1.03)}.preview-item canvas{display:block;max-width:100%;height:auto}.preview-item.active{border-color:var(--primary);box-shadow:0 4px 12px rgb(101 40 247 / .3)}.selector-btn{background:var(--secondary);border:1px solid var(--border);padding:10px 15px;margin:8px;border-radius:10px;cursor:pointer;transition:background 0.3s ease,transform 0.3s ease}.selector-btn:hover{background:var(--accent);color:#fff;transform:scale(1.05)}.selector-btn.active{background:var(--primary);color:#fff}.clear-btn{background:#fff0;border:1px solid #EF4444;color:#EF4444;padding:12px 25px;border-radius:10px;cursor:pointer;transition:background 0.3s ease,color 0.3s ease,transform 0.3s ease;margin-top:25px}.clear-btn:hover{background:var(--hover);color:#fff;border-color:var(--hover);transform:scale(1.05)}.option-group{background:var(--secondary);padding:25px;border-radius:16px;margin-bottom:25px;box-shadow:0 4px 6px rgb(0 0 0 / .1);transition:transform 0.3s ease}.option-group:hover{transform:translateY(-5px)}label{display:block;margin-top:12px;font-weight:500}input[type="range"],input[type="text"],select,input[type="color"],input[type="file"]{width:100%;padding:10px;border:1px solid var(--border);border-radius:10px;margin-top:6px;transition:border-color 0.3s ease}input[type="range"]:focus,input[type="text"]:focus,select:focus,input[type="color"]:focus,input[type="file"]:focus{border-color:var(--primary)}input[type="range"]{cursor:pointer}.download-section{display:flex;flex-direction:column;gap:15px}.primary-btn{background:var(--primary);color:#fff;border:none;padding:14px 25px;border-radius:10px;cursor:pointer;font-weight:500;transition:background 0.3s ease,transform 0.3s ease;min-height:48px}.primary-btn:hover{background:var(--hover);transform:scale(1.05)}.secondary-btn{background:#fff0;border:1px solid var(--primary);color:var(--primary);padding:14px 25px;border-radius:10px;cursor:pointer;transition:background 0.3s ease,color 0.3s ease,transform 0.3s ease}.secondary-btn:hover{background:var(--hover);color:#fff;transform:scale(1.05)}button,input[type="file"],.upload-area{transition:all 0.3s ease}:focus{outline:2px solid var(--accent);box-shadow:0 0 0 3px rgb(139 92 246 / .3)}