.type-selector{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap}.type-btn{padding:10px 20px;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);font-size:.875rem;cursor:pointer}.type-btn:hover{border-color:var(--color-accent)}.type-btn.active{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.converter-grid{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:stretch}@media(max-width:768px){.converter-grid{grid-template-columns:1fr;gap:12px}}.editor-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column}.editor-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--color-border);background:var(--color-bg)}.editor-title{font-size:.8125rem;font-weight:600;text-transform:uppercase}.btn-copy{padding:6px 12px;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);font-size:.75rem;cursor:pointer}.btn-copy:hover{border-color:var(--color-accent)}.editor-textarea{flex:1;min-height:200px;padding:16px;border:none;font-family:var(--font-mono);font-size:.875rem;line-height:1.6;resize:none}.editor-textarea:focus{outline:none}.converter-actions{display:flex;flex-direction:column;justify-content:center;gap:12px}@media(max-width:768px){.converter-actions{flex-direction:row}}.btn-convert{padding:12px 20px;border:1px solid var(--color-accent);border-radius:var(--radius-sm);background:var(--color-accent);color:#fff;font-size:.875rem;font-weight:500;cursor:pointer;white-space:nowrap}.btn-convert:hover{opacity:.9}
