.stp-tool{width: 100%;margin: 0 auto;}
.stp-file-input{position: absolute;width: 0;height: 0;opacity: 0;pointer-events: none;}
.stp-drop{min-height: 200px;padding: 2rem 1.5rem;border: 2px dashed var(--border,#e2e8f0);border-radius: 16px;background: var(--surface-muted,#f8fafc);cursor: pointer;transition: border-color .2s,background .2s;-webkit-tap-highlight-color: transparent;display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 0.75rem;}
.stp-drop:hover,.stp-drop:focus-visible{border-color: var(--primary,#0ea5e9);outline: none;background: rgba(14,165,233,.05);}
.stp-drop.stp-dragover{border-color: var(--primary,#0ea5e9);background: rgba(14,165,233,.08);}
.stp-drop-icon{color: var(--text-muted,#64748b);line-height: 0;}
.stp-drop:hover .stp-drop-icon,.stp-drop:focus-visible .stp-drop-icon,.stp-drop.stp-dragover .stp-drop-icon{color: var(--primary,#0ea5e9);}
.stp-drop-text{font-size: 1rem;font-weight: 500;color: var(--text-main,#1e293b);}
.stp-preview-wrap{margin-top: 1.5rem;padding: 1.25rem;background: var(--surface,#fff);border: 1px solid var(--border,#e2e8f0);border-radius: 16px;box-shadow: var(--shadow-soft,0 1px 3px rgba(0,0,0,.06));}
.stp-preview{min-height: 200px;max-height: 360px;overflow: auto;background: var(--surface-muted,#f8fafc);border-radius: 12px;display: flex;align-items: center;justify-content: center;padding: 1rem;}
.stp-preview svg{max-width: 100%;max-height: 320px;height: auto;}
.stp-settings{display: flex;flex-wrap: wrap;align-items: flex-end;gap: 1rem;margin-top: 1rem;padding-top: 1rem;border-top: 1px solid var(--border,#e2e8f0);}
.stp-field{display: flex;flex-direction: column;gap: 0.35rem;}
.stp-label{font-size: 0.8125rem;font-weight: 600;color: var(--text-main,#1e293b);}
.stp-input{width: 100%;min-width: 90px;max-width: 140px;padding: 0.5rem 0.75rem;font-size: 0.9375rem;border: 1px solid var(--border,#e2e8f0);border-radius: 10px;background: var(--surface,#fff);color: var(--text-main,#1e293b);-webkit-appearance: none;appearance: none;}
.stp-input:focus{border-color: var(--primary,#0ea5e9);outline: none;}
.stp-unit{font-size: 0.75rem;color: var(--text-muted,#64748b);}
.stp-btn{min-height: 44px;padding: 0.65rem 1.35rem;font-size: 0.9375rem;font-weight: 600;border: none;border-radius: 12px;cursor: pointer;transition: background .2s,transform .15s;-webkit-tap-highlight-color: transparent;background: var(--primary,#0ea5e9);color: #fff;}
.stp-btn:hover{background: var(--primary-dark,#0284c7);}
.stp-btn:focus-visible{outline: none;}
.stp-btn:active{transform: scale(0.98);}
@media (max-width:480px){.stp-drop{min-height: 160px;padding: 1.5rem 1rem;}.stp-settings{flex-direction: column;align-items: stretch;}.stp-input{max-width: none;}.stp-btn{width: 100%;}}