/* Premium Tool UI */
.pp-tool { --pp-border:#e2e8f0; --pp-radius-lg:16px; --pp-radius-md:12px; --pp-radius-sm:8px; --pp-teal:#0d9488; --pp-navy:#0f172a; --pp-gray:#64748b; --pp-shadow-sm:0 2px 8px #0f172a08; }
.pp-tool [hidden] {display:none!important}
.pp-tool *, .pp-tool *::before, .pp-tool *::after {box-sizing:border-box}
.pp-tool .btn {display:inline-block;border:1px solid #0d9488;border-radius:8px;background:#0d9488;color:white;padding:12px 18px;margin:8px 4px 0 0;font:inherit;font-weight:600;text-decoration:none;cursor:pointer;text-align:center}
.pp-tool .btn-outline {background:white;color:#0f766e}
.pp-tool :disabled {opacity:.6;cursor:wait}
.pp-tool :focus-visible {outline:3px solid #2563eb;outline-offset:3px}
.pp-tool .pp-dropzone {display:block}
.pp-advanced .pp-preview {min-width:0;align-self:flex-start;min-height:0;padding:0}
.pp-advanced canvas {display:block;width:100%;height:auto;touch-action:none;cursor:crosshair}
.pp-advanced .pp-controls {min-width:0}
.pp-advanced input[type=text] {width:100%;padding:12px;border:1px solid #cbd5e1;border-radius:8px}
.pp-advanced .pp-checker {background-color:#fff;background-image:conic-gradient(#e2e8f0 25%,#fff 0 50%,#e2e8f0 0 75%,#fff 0);background-size:20px 20px}
.pp-result {max-height:250px;object-fit:contain;margin:16px 0}
.pp-tool-guide h2 {margin:2rem 0 .75rem;font-size:1.5rem}
.pp-tool-guide h3 {margin:1.2rem 0 .4rem;font-size:1.1rem}
.pp-tool-guide ol {padding-left:1.5rem}
.pp-tool-guide li {margin:.5rem 0}
.pp-tool [data-role=status] {overflow-wrap:anywhere}
.pp-tool .pp-privacy-notice {display:block;line-height:1.6}
.pp-tool .pp-privacy-notice strong {display:block;margin-bottom:.3rem}
.pp-tool .pp-result {border:1px solid #e2e8f0;background:#f8fafc;cursor:default}
.pp-advanced[data-pp-tool="cropper"] .pp-preview {border-radius:0}
.pp-tool { background: #fff; border: 1px solid var(--pp-border); border-radius: var(--pp-radius-lg); padding: 2rem; box-shadow: var(--pp-shadow-sm); margin-bottom: 2rem; }
.pp-privacy-notice { background: #f0fdf4; border: 1px solid #bbf7d0; color: #166534; padding: 1rem; border-radius: var(--pp-radius-sm); font-size: 0.9rem; display: flex; align-items: flex-start; gap: 0.75rem; margin-bottom: 2rem; }
.pp-dropzone { border: 2px dashed #cbd5e1; border-radius: var(--pp-radius-md); padding: 4rem 2rem; text-align: center; background: #f8fafc; transition: all 0.2s; position: relative; cursor: pointer; }
.pp-dropzone:hover { border-color: var(--pp-teal); background: #f0fdfa; }
.pp-dropzone input { position: absolute; width: 100%; height: 100%; top: 0; left: 0; opacity: 0; cursor: pointer; }
.pp-dropzone p { color: #64748b; font-size: 1.1rem; font-weight: 500; margin: 0; }
.pp-workspace { display: flex; gap: 2rem; flex-wrap: wrap; }
.pp-preview { flex: 1 1 300px; background: #f8fafc; border-radius: var(--pp-radius-md); border: 1px solid var(--pp-border); padding: 1rem; display: flex; align-items: center; justify-content: center; min-height: 300px; overflow: hidden; }
.pp-preview img { max-width:100%; max-height:400px; border-radius:4px; box-shadow:var(--pp-shadow-sm); }
.pp-controls { flex: 1 1 250px; background: #fff; }
.pp-controls label { display: block; font-weight: 600; font-size: 0.9rem; margin-bottom: 0.5rem; color: var(--pp-navy); margin-top: 15px;}
.pp-controls label:first-child { margin-top: 0; }
.pp-controls input[type="number"], .pp-controls select { width: 100%; padding: 0.75rem; border: 1px solid #cbd5e1; border-radius: var(--pp-radius-sm); }
.pp-controls input[type="range"] { width: 100%; margin-top: 5px; }

.pp-bulk-result{background:#fff;border:1px solid var(--pp-border);border-radius:var(--pp-radius-md);padding:12px;text-align:center;min-width:160px}
.pp-bulk-result img{width:140px;height:100px;object-fit:contain;background:#f8fafc;border-radius:6px;margin:0 auto 10px}
.pp-bulk-result .btn{width:100%;padding:.65rem 1rem}
.pp-controls input[type="color"]{max-width:100%}
@media (max-width:768px){
  .pp-tool{padding:1rem}
  .pp-workspace{gap:1rem}
  .pp-preview{min-height:220px;flex-basis:100%}
  .pp-controls{flex-basis:100%}
  .pp-dropzone{padding:3rem 1rem}
}
