.border-tool { display:grid; gap:16px; padding:20px; border:1px solid #ddd; border-radius:16px; }
.border-tool p { margin:0; }
.border-tool label { display:grid; gap:6px; min-width:0; }
.border-tool input,.border-tool select,.border-tool button,.border-tool [data-download] { min-height:44px; max-width:100%; }
.border-tool input[type=checkbox] { min-height:24px; width:24px; }
.border-tool input[type=color] { width:100%; }
.border-tool__controls,.border-tool__sides { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.border-tool__sides { grid-column:1/-1; }
.border-tool [hidden] { display:none !important; }
.border-tool canvas { display:block; max-width:100%; max-height:250px; width:auto; height:auto; margin:auto; cursor:crosshair; touch-action:manipulation; }
.border-tool [data-preview] { display:block; max-width:100%; max-height:360px; margin:auto; object-fit:contain; }
.border-tool [data-download],.border-tool [data-create] { display:block; padding:12px 18px; background:#153d35; color:white; border-radius:8px; text-align:center; }
.border-tool [data-create]:disabled { opacity:.5; }
@media(max-width:600px) { .border-tool { padding:12px; gap:12px; } .border-tool__controls { grid-template-columns:1fr; } }