.hp-tool .hp-panels{margin: 0 -10px}.hp-tool .form-control-group{margin-bottom: 18px}.hp-tool .hp-panel-header{display: flex;align-items: center;justify-content: space-between;gap: 10px;flex-wrap: wrap}.hp-tool .hp-input{width: 100%;min-height: 280px;resize: vertical;font-family: 'SFMono-Regular',Menlo,Consolas,monospace;font-size: 12.5px;line-height: 1.5;padding: 10px 12px;border: 1px solid #e5e7eb;border-radius: 6px;background: #fff;color: #1f2937}.hp-tool .hp-input:focus{outline: none;border-color: #d1d5db}.hp-tool .hp-options{display: flex;gap: 12px;flex-wrap: wrap;margin-top: 12px;align-items: flex-end}.hp-tool .hp-opt{display: flex;flex-direction: column;gap: 4px}.hp-tool .hp-opt-wide{flex: 1 1 100%}.hp-tool .hp-opt span{font-size: 11px;color: #6b7280;text-transform: uppercase;letter-spacing: 0.03em}.hp-tool .hp-opt select,.hp-tool .hp-opt input{padding: 6px 10px;border: 1px solid #e5e7eb;border-radius: 6px;font-size: 13px;min-width: 90px}.hp-tool .hp-opt-wide input{width: 100%}.hp-tool .hp-check{display: flex;align-items: center;gap: 7px;min-height: 33px;margin: 0;color: #4b5563;font-size: 12.5px;font-weight: 500}.hp-tool .hp-check input{margin: 0}.hp-tool .hp-actions{margin-top: 14px;display: flex;gap: 8px}.hp-tool .hp-status{margin-top: 10px;padding: 8px 12px;border-radius: 6px;font-size: 12.5px}.hp-tool .hp-status.ok{background: #f0fdf4;border: 1px solid #bbf7d0;color: #15803d}.hp-tool .hp-status.err{background: #fef2f2;border: 1px solid #fecaca;color: #b91c1c}.hp-tool .hp-badge{font-size: 11.5px;color: #94a3b8}.hp-tool .hp-preview-wrap{background: #f8fafc;border: 1px solid #e2e8f0;border-radius: 8px;padding: 16px;min-height: 420px}.hp-tool .hp-preview{width: 100%;min-height: 400px;border: none;border-radius: 4px;background: #fff;box-shadow: 0 1px 3px rgba(0,0,0,0.06)}:root[data-theme="dark"] .hp-tool .hp-panel-header{background: #1f2422;color: #e5e7eb;border-bottom-color: rgba(255,255,255,0.08)}:root[data-theme="dark"] .hp-tool .hp-input{background: #161a18;border-color: #37423d;color: #e5e7eb}:root[data-theme="dark"] .hp-tool .hp-input:focus{border-color: #525252}:root[data-theme="dark"] .hp-tool .hp-opt span{color: #9ca3af}:root[data-theme="dark"] .hp-tool .hp-opt select,:root[data-theme="dark"] .hp-tool .hp-opt input{background: #161a18;border-color: #37423d;color: #e5e7eb}:root[data-theme="dark"] .hp-tool .hp-check{color: #cbd5e1}:root[data-theme="dark"] .hp-tool .hp-status.ok{background: rgba(21,128,61,0.15);border-color: rgba(21,128,61,0.4);color: #86efac}:root[data-theme="dark"] .hp-tool .hp-status.err{background: rgba(185,28,28,0.15);border-color: rgba(185,28,28,0.4);color: #fca5a5}:root[data-theme="dark"] .hp-tool .hp-badge{color: #64748b}:root[data-theme="dark"] .hp-tool .hp-preview-wrap{background: #0f172a;border-color: #1e293b}@media (max-width: 767px){.hp-tool .row-layout{flex-direction: column}.hp-tool .hp-options{flex-direction: column;align-items: stretch}.hp-tool .hp-check{min-height: auto}.hp-tool .hp-actions .btn{flex: 1 1 100%}}